+ コンポーネントのコードを表示

@supports(display: grid) {
    :root {
     --sidebar-width-on-desktop: calc((var(--base-font-size) * (14 / 15)) * 19);
     --body-width-on-desktop: 45.75rem;
    }
    @media only screen and (min-width: 769px) {
     #side-bar .close-menu {
     display: block;
     position: fixed;
     top: unset;
     bottom: 0.5rem;
     left: 0.5rem;
     width: 3rem;
     height: 3rem;
     background: unset;
     opacity: 1;
     pointer-events: all;
     z-index: -1;
     }
 
     #side-bar .close-menu img {
     color: transparent;
     }
 
     #side-bar .close-menu::before,
     #side-bar .close-menu::after {
     content: "";
     box-sizing: border-box;
     position: fixed;
     display: block;
     top: unset;
     bottom: 0.5rem;
     left: 0.5rem;
     width: 3rem;
     height: 3rem;
     padding: 0;
     margin: 0;
     text-align: center;
     pointer-events: all;
     cursor: pointer;
     transition:
     opacity var(--sidebar-transition-timing);
     }
 
     #side-bar .close-menu::before {
     --mask:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Hamburger' x='0' y='0' baseProfile='tiny' overflow='visible' version='1.2' viewBox='0 0 32 32' xml:space='preserve'%3E%3Cpath d='M4 10h24c1.1 0 2-.9 2-2s-.9-2-2-2H4c-1.1 0-2 .9-2 2s.9 2 2 2zm24 4H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2zm0 8H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2z'/%3E%3C/svg%3E");
     z-index: -1;
     background-color: var(--toggle-icon-color, rgb(var(--sidebar-links-text))) !important;
     -webkit-mask: var(--mask);
     mask: var(--mask);
     -webkit-mask-repeat: no-repeat;
     mask-repeat: no-repeat;
     -webkit-mask-position: 50% 50%;
     mask-position: 50% 50%;
     -webkit-mask-size: 60%;
     mask-size: 60%;
     }
 
     #side-bar .close-menu::after {
     z-index: -2;
     background-color: var(--toggle-button-bg, rgb(var(--sidebar-bg-color))) !important;
     border-radius: var(--toggle-roundness, 50%);
     border: var(--toggle-border-color, rgb(var(--sidebar-links-text))) var(--toggle-border-width, 0.25rem) solid;
     }
 
     #side-bar:focus-within .close-menu,
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu {
     pointer-events: none;
     }
 
     #side-bar:focus-within .close-menu::before,
     #side-bar:focus-within .close-menu::after {
     opacity: 0;
     pointer-events: none;
     }
 
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::before,
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::after {
     opacity: 0;
     pointer-events: none;
     }
 
     #side-bar {
     display: block;
     position: fixed;
     top: 0;
     left: calc(var(--sidebar-width-on-desktop)*-1);
     z-index: 10;
     transition:
     left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     height: 100%;
     overflow-y: auto;
     overflow-x: hidden;
     margin-top: 0;
     }
 
     #side-bar:focus-within {
     left: 0;
     }
 
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover {
     left: 0;
     }
 
     #side-bar .side-block {
     margin-top: 1rem;
     background-color: rgb(0, 0, 0, 0);
     border-radius: 0;
     border-left-width: 0px;
     border-right-width: 0px;
     }
 
     #main-content::before {
     content: "";
     display: block;
     position: fixed;
     top: 0;
     right: 0;
     z-index: -1;
     opacity: 0;
     transition:
     opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
     width 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     margin-left: var(--sidebar-width-on-desktop);
     background: rgba(var(--swatch-menubg-black-color), .3) 1px 1px repeat;
     padding-right: 0;
     width: 100%;
     height: 100vh;
     pointer-events: none;
     z-index: 99;
     }
 
     #side-bar:focus-within ~ #main-content::before {
     width: calc(100% - var(--sidebar-width-on-desktop));
     opacity: 1;
     pointer-events: all;
     }
 
     #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover ~ #main-content::before {
     width: calc(100% - var(--sidebar-width-on-desktop));
     opacity: 1;
     pointer-events: all;
     }
 
     @supports (-moz-appearance:none) and (background-attachment:local) and (not (-moz-osx-font-smoothing:auto)) { #side-bar {
     padding: inherit;
     } }
 
     #content-wrap {
     display: flex;
     flex-direction: row;
     width: calc(100vw - (100vw - 100%));
     min-height: calc(100vh - calc(var(--final-header-height-on-desktop, 10.125rem)));
     flex-grow: 2;
     height: auto;
     position: relative;
     margin: 0 auto;
     max-width: inherit;
     }
 
     #main-content {
     width: 100%;
     position: initial;
     max-height: 100%;
     padding: 2rem 1rem;
     max-width: var(--body-width-on-desktop, 45.75rem);
     margin: 0 auto;
     }
 
     #page-content {
     max-width: min(90vw, var(--body-width-on-desktop, 45.75rem));
     }
 
     @supports (-webkit-hyphens:none) {
     #side-bar {
     transition:
     left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
     padding-right 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
     background-color 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     padding-right: 0;
     background-color: rgb(0, 0, 0, 0);
     pointer-events: all;
     overflow-x: visible;
     overflow-y: visible;
     z-index: 999;
     }
 
     #side-bar::-webkit-scrollbar {
     opacity: 0;
     -webkit-transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
     }
 
     #side-bar .close-menu::before {
     z-index: 999;
     }
 
     #side-bar .close-menu::after {
     z-index: 998;
     }
 
     #side-bar:hover .close-menu::before,
     #side-bar:hover .close-menu::after {
     opacity: 0;
     }
 
     #side-bar:hover {
     left: 0;
     background-color: rgba(var(--swatch-menubg-color), 1);
     padding-right: 0;
     }
 
     #side-bar:hover::-webkit-scrollbar {
     opacity: 1;
     }
 
     #side-bar:hover~#main-content::before {
     width: calc(100% - var(--sidebar-width-on-desktop));
     opacity: 1;
     pointer-events: all;
     }
     }
     }
    }
}

---

+ コンポーネントのコードを表示

:root {
        /* header measurements */
        --header-height-on-desktop: 10rem;
        --header-height-on-mobile: 10rem;
        --header-h1-font-size: clamp(2rem, 5vw, 2.8125rem);
        --header-h2-font-size: clamp(0.875rem, 3vw, 0.9375rem);
        --logo-image: url("https://scp-jp.github.io/Black-Highlighter/img/logo.svg");
    }
 
    #header {
        --search-textbox-text-color: var(--swatch-secondary-color);
        background: none;
    }
 
    #header::before {
        content: " ";
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0.75rem;
        background-image: var(--logo-image);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: auto calc(var(--header-height-on-desktop) - 1.5rem);
        opacity: 0.8;
        pointer-events: none;
    }
 
    #header h1,
    #header h2 {
        margin: 0;
        padding: 0;
        width: 100%;
        height: var(--header-height-on-desktop);
        display: flex;
        align-items: center;
        justify-content: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }
 
    #header h1 a,
    #header h1 a::before,
    #header h2 span,
    #header h2 span::before {
        margin: 0;
        padding: 0;
        z-index: 0;
        display: block;
        text-align: center;
    }
 
    #header h1 {
        z-index: 1;
    }
 
    #header h1 a::before,
    #header h1 a::after {
        content: var(--header-title);
    }
 
    #header h1 a::before  {
        color: rgb(var(--swatch-text-tertiary-color));
        z-index: -1;
        -webkit-text-stroke: 0.325rem rgb(var(--swatch-text-dark));
    }
 
    #header h1 a::after {
        color: rgb(var(--swatch-headerh1-color));
        z-index: 1;
    }
 
    #header h2 {
        z-index: 0;
        text-transform: uppercase;
        pointer-events: none;
    }
 
    #header h2 span {
        margin-top: calc(var(--header-height-on-mobile)/2 + var(--header-h1-font-size)/1.6 - 2em);
    }
 
    #header h2 span::before,
    #header h2 span::after {
        --wght: 600;
        content: var(--header-subtitle);
        position: absolute;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        width: 100%;
        text-align: center;
    }
 
    #header h2 span::before {
        -webkit-text-stroke: 0.25rem rgb(var(--swatch-text-dark));
    }
 
    #header h2 span::after {
        color: rgb(var(--swatch-headerh2-color));
        z-index: 1;
    }
 
    #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
        color: rgba(0, 0, 0, 0);
    }
 
    @media (min-width: 36rem) {
 
        #login-status {
            flex-grow: 1;
            left: 3%;
            right: initial;
        }
 
     #login-status::before {
     --mask-image: none;
     background-color: transparent;
     }
 
        #login-status:not(:focus-within) {
            color: rgb(var(--login-line-divider-color));
            -webkit-user-select: initial;
            -moz-user-select: initial;
            -ms-user-select: initial;
            user-select: initial;
        }
 
        #login-status #account-topbutton,
        #login-status:not(:focus-within) #account-topbutton {
            --clip-path:
                    polygon( 0 0, 100% 0, 100% 100%, 0 100% );
            background-color: rgba(var(--login-arrow-color), 0);
 
        }
 
        #login-status #account-topbutton::before{
            --clip-path:
                    polygon( 30% 35%, 70% 35%, 50% 60%, 50% 60% );
            --mask-image: initial;
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(var(--login-arrow-color), 1);
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #login-status #account-topbutton::before,
        #login-status:not(:focus-within) #account-topbutton::before,
        #login-status:not(:focus-within) #account-topbutton:hover::before {
            --clip-path:
                    polygon( 30% 35%, 70% 35%, 50% 60%, 50% 60% );
            --mask-image: initial;
        }
 
        #login-status:not(:focus-within) #account-topbutton::after {
            display: none;
        }
 
        #login-status:not(:focus-within) *:not(#account-topbutton):not([href*="account/messages"]) {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0 100%
                    );
            pointer-events: all;
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #login-status:not(:focus-within) *:not(#account-topbutton):not(#account-options):not([href*="account/messages"]) {
            opacity: 1;
        }
 
        #login-status #my-account {
            --wght: 300;
        }
 
        #account-options {
            background: var(--gradient-header);
        }
 
        #search-top-box {
            top: 1.5em;
            right: 3%;
            background: rgba(var(--search-focus-textbox-bg-color), 0.4);
        }
 
     #search-top-box:focus-within ~ #login-status {
     opacity: 1;
     }
 
        #search-top-box::after {
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                -webkit-clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1),
                -webkit-clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
        }
 
        #search-top-box:not(:focus-within)::after {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0% 100%
                    );
            background-color: rgba(var(--search-icon-bg-color, --dark-accent), 1);
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #search-top-box:not(:focus-within):hover::after {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0 100%
                    );
            background-color: rgb(var(--search-icon-hover-bg-color));
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) {
            max-width: var(--search-width);
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
            max-width: var(--search-width);
            padding: 0 var(--search-height) 0 1em;
            outline-width: 0;
            background-color: rgb(var(--search-focus-textbox-bg-color), 0.35);
            color: rgba(var(--search-textbox-text-color), 0.4);
            cursor: pointer;
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="submit"],
        #search-top-box form[id="search-top-box-form"]:focus-within input[type="submit"] {
            pointer-events: all;
            border: none;
        }
 
    }
 
    #page-title::after,
    .meta-title::after,
    #page-title::before,
    .meta-title::before {
        content: "";
        flex-grow: 1;
        height: 0.0625rem;
        background: rgb(var(--swatch-primary));
    }
 
    #page-title::before,
    .meta-title::before {
        margin: auto 1.25rem auto auto;
    }

クレジット

タイトル: 殻々商品ページ【SLEEPWALK】
著者: stengan774, terukami
作成年: 2026

その他のライセンス

その他

夢のコンテスト2026
泡影部門 銅賞

殻々商品ページ【SLEEPWALK】

♡ 683

💬 53

🛒

💾

#オネイロイ・コレクティブ #薬剤 #便利アイテム #再入荷

素敵な夢をあなたに！オネイロイ・コレクティブの睡眠薬！

￥ 4,999 送料込み

分類	薬剤
商品の状態	新品、未使用、未開封
配送料	送料込み (出品者が負担)
配送方法	時空間ポータル
発送日数	約3分
在庫	残り10点 (再入荷予定あり)
支払い方法	叡智圏外経由暗号通貨

【概要】

基本説明

深い眠りをもたらすとともに、快適な夢を体験できる特別な薬。服用するだけで次第にまぶたが重くなり、ものの数分で入眠してしまいます。オネイロイ・コレクティブ社提供の独自技術を使用しており、違法成分や危険な物質は含まれていないため安心安全です。

錠剤型であり、水無しで飲むことができます。

注意事項

• 付属冊子の用法用量を厳守してください。予期せぬ副作用が発生するおそれがあります。
• 体質により効きが悪いことがありますが、過剰な服用はお控えください。
• 運転中や飲酒後の服用は危険ですので絶対にしないでください。

【実際の活用例】

すぐにぐっすり幸せな夢

中々眠りにつけない時も

寝なければいけないのに眠れない時、ありますよね。そんな時でもこれを飲めば、あなたは速やかに眠りに落ちることができます。辛い不眠に苦しむ必要は、もうありません。

快適な目覚めで気分爽快

夢見に悩んでいるあなたへ

しょっちゅう悪夢を見てしまうそこのあなたにも、当製品はおすすめです。オネイロイ・コレクティブ社の技術は悪夢の集団を退け、あなたの夢を快適なまま守ることができます。もうトラウマにうなされることもなければ、目覚めの悪さに頭を悩ますこともないでしょう。

【出品者の情報】

SLEEPWALK 公式
★★★★☆ 517件の評価

---

カスタマーレビュー (53)

★★★★☆ [4.5 / 5]
411件の評価

moonwalk_cat

★★★★★

この薬を飲むことで救われました。飲むとあっという間に眠気がやってきて、気がついたらそのまま寝落ちすることができます。本当に気持ちのいい眠りです。少しコツが要りますが、寝る前にイメージしておくと望んだ通りの内容の夢を見ることもできますし、おすすめです。寝つきが悪い人は1回飲んでみてください。

119120

1112

niku_ice

★★★★★

家業で呪詛を扱っている者です。昔受けた後遺症で何年も悪夢に苦しんでいたのですが、この薬を飲むようになってからは夢の中で化け物を見ることがなくなりました。前までは夜そのものが苦手だったのですが、これを飲むようになってからは快適そのもの。今では布団に入ることに喜びを見出しているくらいです。

8182

2526

you_sena

★★★★★

とてもいい薬です。いっぱい飲むと、起きながら夢を見ている感じになれるので好きです。箱で買ってます。

素敵な商品ありがとうございます。

1314

3233

quliq

☆☆☆☆☆

偽物です。この薬には、商品紹介やレビューに書かれているような効力はありません。オネイロイ・コレクティブが本当に関わっているのかすら怪しいと思われます。

私は記憶補強系薬剤の副作用による不眠症に悩まされており、一般の医療機関にかかれないため藁にもすがる思いでこの薬を注文しました。期待して飲みましたが、得られたのは僅かな眠気と奇妙な幻覚だけです。快適な夢も、ほんの数分で眠りにつくこともありませんでした。

不思議に思い、自宅のラボで分析にかけてみると、この薬が役に立たない理由がわかりました。SLEEPWALKに超常の要素はありません。これは単なる睡眠薬です。市販のそれらと何ら変わりません。

恐らく、レビューは全てサクラでしょう。騙されないでください。この出品者は私のように困っている者を狙ってまがい物を売りつける悪徳業者です。買う価値なんてありません。

(あなたのこのレビューは出品者に削除されました)

(1)件のプライベートメッセージが届いています

From: SLEEPWALK 公式
To: quliq
Subject: SLEEPWALKについて

---

quliq様。私たちの薬で良い夢が見られなかったということは、あなたは健全な感覚をお持ちなのですね。

仰る通り、SLEEPWALKは魔法の代物ではありません。ベンゾジアゼピン系の薬品に軽い幻覚作用を誘発する混ぜ物を加えたもので、ドラッグストアで売られている睡眠薬よりは少々不可思議な夢見体験ができますが、とても「超常」と言える範疇に足を踏み入れてはいないでしょう。

それでもレビュー欄には☆5評価が溢れ、私たちの薬を継続的に購入していく方々がいます。彼らはサクラなどではなく、SLEEPWALKにはオネイロイの魔法がかかっているのだと本気で信じているのです。前述した通り、あの薬に処方薬より飛び抜けた効果はないにもかかわらず、です。

即ち、プラシーボ効果。思い込みによって、実際の薬理作用以上の効能があると錯覚している。

このサイトを利用する人々は、通常科学では説明できない存在を知っています。そして、それらが一般的な事物よりも優れたものだと盲信しています。国家資格を取ったベテラン医師による治療よりも、法の目が届かない超常企業が売り出す得体の知れない薬品の方が彼らにとっては信頼に足るものなのです。

だからこそ、超常というラベルを貼って売るだけで、彼らにはよりよく効くのでしょう。科学を超えた事物は、容易に仕組みを量ることのできないブラックボックスでもあります。高度な科学技術どころか、市販薬でさえ彼らは魔法と区別ができません。

SLEEPWALKで私たちは多くの人々を癒してきました。超常依存症で感覚が壊れてしまった者達にとっては、時に予想外の危害を及ぼす「本物」の薬は必要ではありません。むしろ毒だとさえ言えるでしょう。私たちに出会わなければ、彼らはもっと深い地獄まで転がり落ちていたはずです。

私の妹はオネイロイ・コレクティブ製の睡眠薬を頼ったせいで、体が溶けて死にました。私たちが連中の名を騙るのは、妹のような不幸な出来事を世界から少しでも減らすためです。

どうか目を瞑り、私たちのことを放っておいてください。人の領分はそれぞれ異なるものです。私たちの薬があなたの不眠を癒せないように、あなたには彼らを救えません。

---

 share