html,body {margin: 0;padding: 0;font-family: -apple-system, blinkMacSystemFont,'Helvetica Neue','Segoe UI','Hiragino Kaku Gothic ProN','Meiryo','sans-serif';min-height:100vh;background-attachment:fixed;background-size:cover;background-position:center;background-image:linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%,rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%,rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%,rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%),linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%,rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%,rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%,rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%,rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%),linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%,rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%,rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%,rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%,rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.42999999999999%,rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.71600000000001%,rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%),linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%,rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%,rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%,rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%,rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%),linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%,rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%,rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%,rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%),linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%,rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%,rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%,rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%,rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%,rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%,rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%,rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%),linear-gradient(90deg, rgb(57,57,57),rgb(57,57,57))}
body::after {content: '';position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;z-index:9990;pointer-events:none;opacity:0;transition:opacity .8s ease}
body.fadeout::after{opacity:1}
header{background:rgba(30,30,30,.9);position:sticky;top:0;height:50px;z-index:3;backdrop-filter:blur(3px)}

body.fixed{position:fixed;width:100%;height:100%;left:0}


:root{

  /*--titlecolor--*/
  --t1-c-0:#eee;
  --t1-c-1:#dff0fa;
  --t1-c-2:#faf7df;
  --t1-c-3:#dffae9;
  --t1-c-4:#fadff0;
  --t1-c-5:#e9dffa;
  --t1-c-6:#fadfe3;
  --t1-c-7:#f7dffa;

  --t2-c-0:#e4e1f8;
  --t2-c-1:#c6f8ff;
  --t2-c-2:#f8ffc6;
  --t2-c-3:#c6ffea;
  --t2-c-4:#ffc6f8;
  --t2-c-5:#cec6ff;
  --t2-c-6:#ffcec6;
  --t2-c-7:#eac6ff;

}


@font-face {
  font-family: 'icomoon';
  src:  url('../webfonts/icomoon.eot?qqgkbq');
  src:  url('../webfonts/icomoon.eot?qqgkbq#iefix') format('embedded-opentype'),
    url('../webfonts/icomoon.ttf?qqgkbq') format('truetype'),
    url('../webfonts/icomoon.woff?qqgkbq') format('woff'),
    url('../webfonts/icomoon.svg?qqgkbq#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
  
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.icon-rader::before{content:"\e917"}
.icon-mail::before{content:"\f003"}
.icon-max::before{content:"\f012"}
.icon-facebook::before{content:"\ea90"}
.icon-twitter::before{content:"\f099"}
.icon-pocket::before{content:"\e905"}
.icon-line::before{content:"\e907"}
.icon-hatebu::before{content:"\e908"}
.icon-feedly::before{content:"\e909"}
.icon-star-o::before{content:"\f006"}
.icon-ex-link::before{content:"\f08e"}
.icon-heart::before {content:"\f004"}
.icon-heart-o::before{content:"\f08a"}
.icon-shield::before{content:"\e903"}
.icon-link::before{content:"\e904"}
.icon-contract::before{content:"\e906"}
.icon-envelope::before{content:"\f0e0"}
.icon-share::before{content:"\f1e0"}
.icon-th-up:before{content:"\f164"}
.icon-th-down:before{content:"\f165"}
.icon-shield::before,.icon-contract::before,.icon-envelope::before,.icon-share::before{display:inline-block;width:20px;text-align:center;color:grey}

/* ローディング */
.loadwrap{position:fixed;display:flex;align-items:center;justify-content:center;top:calc(50% - 40px);left:50%;transform:translate(-50%,-50%);z-index:9999}
.loader{position:absolute;top:0;z-index:9998;width:50px;height:50px;border:15px solid;border-radius:50%;border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0);animation:loadEr 3s infinite}
@keyframes loadEr{0%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0)}10.4%{border-top-color:rgba(44,44,44,0.5);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0)}20.8%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0)}31.2%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0.5);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0)}41.6%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0);transform:rotate(40deg)}52%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0.5);border-left-color:rgba(33,33,33,0)}62.4%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0)}72.8%{border-top-color:rgba(44,44,44,0);border-right-color:rgba(55,55,55,0);border-bottom-color:rgba(66,66,66,0);border-left-color:rgba(33,33,33,0.5)}}
.loaderbefore{width:50px;height:50px;border:15px solid #ddd;border-radius:50%;position:absolute;top:0;z-index:9997}
.circular{position:absolute;top:-15px;left:-57.5px;width:70px;height:70px;border:20px solid;border-radius:50%;border-top-color:#7a7384;border-left-color:#fff;border-bottom-color:#333;border-right-color:#fff;opacity:0.2;animation:poof 5s infinite;z-index:9996}
@keyframes poof{0%{transform:scale(1,1) rotate(0deg);opacity:0.2}50%{transform:scale(4,4) rotate(360deg);opacity:0}}
.another{opacity:0.1;transform:rotate(90deg);animation:poofity 5s infinite;animation-delay:1s;z-index:9996}
@keyframes poofity{0%{transform:scale(1,1) rotate(90deg);opacity:0.1}50%{transform:scale(4,4) rotate(-360deg);opacity:0}}
.text {position:absolute;top:95px;font-family:Arial;text-transform:uppercase;color:#888;animation:opaa 10s infinite;z-index:9999}
@keyframes opaa{0%{opacity:1}10%{opacity:0.5}15%{opacity:1}30%{opacity:1}65%{opacity:0.3}90%{opacity:0.8}}

h1+small>img{width:6em;aspect-ratio:3/1;object-fit:cover}
#h1div{font-family:'icomoon';display:flex;height:100%;margin:0 auto}
h1{position:relative;flex-grow:1;display:block;margin:auto 0;padding:.4em 0 .4em .5em;font-size:1.1em;font-weight:bold;line-height:1em;color:#fff}
h1+small{margin:auto 0}

/* ---- 共通(index,ceiling,reset) ---- */
.close1{position:absolute;bottom:.5em;right:2em;display:flex;justify-content:center;align-items:center;width:2em;height:1.5em;font-size:1.5em;color:#fff;cursor:pointer}
.close1::after{content:"× CLOSE";font-weight:bold;white-space:nowrap}
#mainground{margin:0;padding:0;font-size:12px;line-height:1.2em;color:#FAFCFF}
#container{position:relative;display:grid;margin:0 auto}
[data-chapter]{position:relative;display:grid;gap:.1em;margin:-50px 0 1em;padding:70px 0 2em}
[data-chapter]::before{margin:0 4px .2em;padding-bottom:.2em;padding-right:.3em;font-size:1.4em;text-align:right;color:#DFDFDF;border-bottom:.05em solid grey}
[data-chapter="0"]::before{content:"What's\00a0new"}
[data-chapter="1"]::before{content:"January"}
[data-chapter="2"]::before{content:"February"}
[data-chapter="3"]::before{content:"March"}
[data-chapter="4"]::before{content:"April"}
[data-chapter="5"]::before{content:"May"}
[data-chapter="6"]::before{content:"June"}
[data-chapter="7"]::before{content:"July"}
[data-chapter="8"]::before{content:"August"}
[data-chapter="9"]::before{content:"September"}
[data-chapter="10"]::before{content:"October"}
[data-chapter="11"]::before{content:"November"}
[data-chapter="12"]::before{content:"December"}
[data-chapter="nav"]::before{content:"PAGE GUIDE"}

[data-chapter]>h2{position:relative;margin:0 4px;padding:.7em 0;font-size:1.4em;line-height:1.6em;text-indent:1em;color:#F0F8FF;border-top:.05em solid #727272;border-bottom:.05em solid #727272;background:rgba(20,20,20,.4)}
[data-chapter]>h2::first-letter{color:#d0c2ca}

:is([data-chapter]>h2,.nav-ol>li>a)>small{position:relative;margin-left:1em;font-weight:normal;font-size:.7em}
[data-chapter]>h2>small::before,[data-chapter]>h2>small::after,.nav-ol>li>a>small::before,.nav-ol>li>a>small::after{position:absolute;content:"";top:50%;transform:translateY(-50%);transform-origin:bottom;width:.5em;height:.05em;background:#ccc}
[data-chapter]>h2>small::before,.nav-ol>li>a>small::before{left:-.7em}[data-chapter]>h2>small::after,.nav-ol>li>a>small::after{right:-.7em}
[data-chapter]>div{display:grid;gap:.8em}
.box{margin-top:-50px;padding-top:50px}
.box>div{display:grid;gap:.8em;margin:1em 4px 0;padding:.4em 0;background:rgba(110,110,140,.4)}
h3[data-h3c]{margin:.6em 0 0;padding-left:1em;font-size:1em}
[data-h3c="1"]::first-letter{color:#ffafea}
[data-h3c="2"]::first-letter{color:#b6a4ff}
[data-h3c="3"]::first-letter{color:#f3ff99}
[data-h3c="4"]::first-letter{color:#a3dcff}
.active::first-letter{color:#836e81}
.nav-ol>li>a{position:relative;padding:.4em .2em .4em 2em;background:rgba(20,20,20,.4);font-size:1.1em;text-decoration:none;color:#dff0fa}
a[data-h3c]{overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:#FAFCFF}
.nav-ol{display:grid;gap:.2em;margin:3px;padding:.2em;color:#FAFCFF;background:rgba(180,180,235,.15)}.nav-ol a.active:not(.nav-ol [data-h3c]:hover,.nav-ol ol a:hover){position:relative;background:#fff;color:#111}.nav-ol [data-h3c]:not(a.active){background:rgba(30,30,40,.3)}
.nav-ol li{display:grid;padding:0;list-style-type:none;text-overflow:ellipsis;white-space:nowrap}.nav-ol li{gap:.2em;margin:0}
.nav-ol [data-h3c]{padding:.3em .2em .3em 1.4em;font-size:.9em}
.nav-ol [data-h3c]:hover,.nav-ol ol a:hover{background:#222;box-shadow:0 0 .2em .1em #99ffff}
.nav-ol ol{display:grid;gap:.2em;margin:0;padding:0}
[data-menu^="l"] .nav-ol>li>p{margin:.2em 0 .1em;padding-left:.5em;font-size:1.1em;font-weight:bold}[data-menu^="l"] .nav-ol>li>p::first-letter{color:#fdc399}
.nav-ol ol>li>a:not(.nav-ol>li>a,[data-h3c]){overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:#FAFCFF;padding:.2em .2em .2em 1.4em;background:rgba(150,150,180,.25)}
div.nav-ol>div>p{position:relative;text-align:center;margin:.4em .2em;font-weight:bold;color:#ccc}
div.nav-ol>div>p::before,div.nav-ol>div>p::after{position:absolute;top:50%;transform:translateY(-50%);content:"";width:calc(50% - 1.9em);height:.5px;background:#dcdcdc}
div.nav-ol>div>p::before{left:.5em}div.nav-ol>div>p::after{right:.5em}
nav.wo-1{display:grid;gap:1.6em;margin:1em 4px 0;padding:1em 0;background:rgba(110,110,140,.4)}

/* ---- サイトマップ ---- */
[data-page]{display:grid;gap:.2em}[data-page="0"],[data-page="1"],[data-page="2"]{margin:3px;padding:.2em}[data-page="t"]{margin:0 .8em}
[data-page]>:is(a,span){position:relative;display:grid;align-items:center;height:100%;color:#595959;background:rgba(50,0,0,.1);text-decoration:none}
[data-page]>ul{display:grid;grid-template-columns:1fr 1fr;margin:0;padding:0;list-style-type:none}.wo-1 [data-page]>ul{gap:.4em}[data-page="0"]>ul{gap:.2em}
[data-page]:not([data-page="t"])>ul{grid-template-columns:repeat(auto-fit, minmax(2.5em, 1fr))}[data-page="t"]>ul:nth-of-type(n+2){grid-template-columns:repeat(auto-fit, minmax(3em, 1fr))}
[data-page="t"]>div{padding:.4em 1em;font-size:.9em;color:#dde;background:rgba(0,0,100,.1)}[data-page="t"]>div:not(:first-of-type){margin-top:.7em}
[data-page]>ul>li{position:relative;display:grid;align-items:center}
[data-page]>ul>li::before{position:absolute;color:#bbb}
[data-page] a:hover{font-weight:bold;background:#fff;color:#222;transition:ease-in-out .3s}
[data-page]>ul>li>span{display:grid;align-items:center;font-weight:bold;color:#eee}
[data-page]>ul>li>a{display:grid;align-items:center;font-size:.9em;text-decoration:none;background:rgba(40,40,40,.6);border-radius:.3em}

.wo-1:not(nav) [data-page]>ul>li>:is(a,span){padding:1.2em 0}
nav.wo-1 [data-page]>ul:not([data-page="t"]>ul:first-of-type)>li>:is(a,span){padding:.7em 0}
nav.mw-N [data-page]>ul>li>:is(a,span){padding:.3em 0}nav.mw-N [data-page]{background:rgba(180,180,235,.15)}
[data-page]>ul:not([data-page="t"]>ul:first-of-type)>li>:is(a,span){text-align:center}
[data-page="t"]>ul:first-of-type>li>:is(a,span){padding:.7em .6em}
[data-page="0"]>ul>li>a,[data-page="t"]>ul:nth-of-type(3)>li>a{color:var(--t2-c-0)}
[data-page="4"]>ul>li>a,[data-page="t"]>ul:nth-of-type(3)>li>a{color:var(--t2-c-2)}
[data-page="3"]>ul>li>a,[data-page="t"]>ul:nth-of-type(4)>li>a{color:var(--t2-c-4)}
[data-page="1"]>ul>li>a,[data-page="t"]>ul:nth-of-type(5)>li>a{color:var(--t2-c-3)}
[data-page="2"]>ul>li>a,[data-page="t"]>ul:nth-of-type(6)>li>a{color:var(--t2-c-1)}
[data-page="6"]>ul>li>a,[data-page="t"]>ul:nth-of-type(7)>li>a{color:var(--t2-c-6)}
[data-page="t"]>ul:nth-of-type(2)>li>a{color:var(--t2-c-0)}
[data-page="t"]>ul:first-of-type>li:first-child>a{color:var(--t2-c-0)}
[data-page="t"]>ul:first-of-type>li:nth-child(n+2):nth-child(-n+3)>a{color:var(--t2-c-2)}
[data-page="t"]>ul:first-of-type>li:nth-child(4)>a{color:var(--t2-c-4)}
[data-page="t"]>ul:first-of-type>li:nth-child(5)>a{color:var(--t2-c-4)}
[data-page="t"]>ul:first-of-type>li:nth-child(6)>a{color:var(--t2-c-3)}
[data-page="t"]>ul:first-of-type>li:nth-child(7)>a{color:var(--t2-c-5)}
[data-page="t"]>ul:first-of-type>li:nth-child(8)>a{color:var(--t2-c-1)}
[data-page="t"]>ul:first-of-type>li:nth-child(9)>a{color:var(--t2-c-6)}
[data-page="t"]>:is(ul:first-of-type,ul)>li>a:hover{font-weight:bold;background:#fff;color:#222;transition:ease-in-out .3s}
[data-page="t"]>ul span{position:relative}[data-page]>ul span::before{position:absolute;content:"Now";left:.2em;font-style:italic;font-weight:normal;transform:scale(.6);transform-origin:top left;color:#ff6ed8}
[data-page="t"]>ul span::before{top:0}.mw-N [data-page]>ul span::before{top:-.2em}
#favorite_box [data-dpage]{background:rgba(30, 30, 30, .4);border-radius:.3em}#favorite_box [data-dpage] a:hover{font-weight:bold;color:#222;transition:ease-in-out .3s}
#favorite_box [data-dpage="1"] a,[data-latest="1"]{color:#f2c6f6}
#favorite_box [data-dpage="1a"] a,[data-latest="1a"]{color:#f6c6e2}
#favorite_box [data-dpage="2"] a,[data-latest="2"]{color:#caf6c6}
#favorite_box [data-dpage="3"] a,[data-latest="3"]{color:#c6f6f2}
#favorite_box [data-dpage="4"] a,[data-latest="4"]{color:#f6f2c6}
#favorite_box [data-dpage="0"] a{color:#d3d3d3}


/* ---- 記事リスト(専用) ---- */
.ma-1{position:relative;display:grid;gap:.2em;margin:0 .4em;padding:.3em;background:rgba(45,40,80,.5)}
.ma-1>div{display:grid;grid-template-columns:1fr 1fr;gap:.3em}.box>div>p{margin:0 4px;padding:.2em .6em;line-height:1.6em}
.ma-1>div>figure{position:relative;display:grid;margin:0;padding:0;overflow:hidden}
.ma-1>div>figure::before{position:absolute;content:"";top:0;left:0;bottom:0;right:0;background:rgba(0,0,0,.2)}.ma-1:has([class^="na-link"]:hover)>figure::before{background:unset;transition:ease-in-out .3s}
.ma-1>div>figure>img{width:100%;height:auto;padding:.3em;object-fit:cover;border-radius:.1em;border:none;box-sizing:border-box;background:#333;aspect-ratio:2/1}
.ma-1>dl{display:flex;flex-wrap:wrap;margin:2px;padding:0;gap:2px;font-size:.85em;list-style-type:none}.ma-1>dl>div{display:flex;gap:.3em;margin:0;padding:0 .4em;font-size:.9em;color:#8d5c9f;background:#fff;border-radius:2px}
.ma-1>dl>div:not(:last-of-type)>dd{margin:0;font-style:normal;color:#111}.ma-1>dl>div:last-of-type>dt{position:absolute;text-indent:100%;white-space:nowrap;overflow:hidden}.ma-1>dl>div:last-of-type>dd{margin:0;font-style:normal;color:#8d5c9f}
.ma-1 figure+div{display:grid;grid-template-rows:repeat(2,1fr);row-gap:.2em;margin:0;font-size:.85em}
.ma-1 figure+div>:is(i,p) {display:grid;grid-template-columns:3.8em 1fr;align-items:center;margin:0;padding-left:.4em;font-style:normal;background:rgba(0,0,0,.2)}
.ma-1 figure+div>:is(i,p)>:is(em,span) {display:grid;align-items:center;justify-content:center;height:100%;margin:0;font-style:normal;line-height:1em;background:rgba(0,0,0,.4)}
.ma-1 figure+div>:is(i,p)>em{font-weight:bold}
.box>div>section :is(h4,h5){margin:0;padding:.2em .6em 0}.ma-1 h5{color:#e3f3ff}
.box>div>section{position:relative;display:grid;gap:.2em;padding:.3em}
.box>div>section>p{margin:0;padding:.5em;line-height:1.6em}
.box>div>section>section{padding:.2em;overflow:hidden;background:rgba(0,0,0,.2)}
.box>div>section>section>ul{display:inline-flex;gap:15em;margin:.4em 0 .2em;padding-left:100%;line-height:1em;;white-space:nowrap;animation:ma-p2 20s linear infinite}
.box>div>section>section>ul>li{display:inline-flex;margin:0}
.box>div>section :is(p,li)>strong{color:#fee7ff}
.box>div>section :is(p,li)>em{font-style:normal;color:#e5fff6}
.box>div>section :is(p,li)>b{color:#fff0e7}

.dpage{display:grid;gap:.3em;margin:0 .4em .2em;padding:0;list-style-type:none;z-index:1}.dpage p{margin:0;padding:.4em .6em;line-height:1.5em}:is(#favorite_box,.page-n) [data-dpage]>a{margin:.05em}
:is(section[data-dpage],[data-dpage="5"]) a{position:relative;display:block;padding:.6em 1.3em;text-decoration:none;background:rgba(0,0,0,.4)}[data-dpage]>a{line-height:1.5em;background:rgba(200,200,255,.1);text-decoration:none}
[data-dpage] a:hover{background:#fff;color:#111;transition:ease-in-out .3s}[data-dpage] a:hover :is(b,em),:is(#favorite_box,.page-n) [data-dpage]:hover a{color:#111}
[data-dpage] h4{margin:0}
:is(section[data-dpage],[data-dpage="5"]){gap:.2em;padding:.2em}
:is(section[data-dpage],[data-dpage="5"]){background:rgba(150,150,250,.15)}:is(.wo-1,#favorite_box) [data-dpage]{background:rgba(0,0,0,.4)}
[data-dpage]{position:relative;display:grid;margin:0}
[data-dpage="1"] :is(b,em),#favorite_box [data-dpage="1"] a{color:#f2c6f6}
[data-dpage="1a"] :is(b,em),#favorite_box [data-dpage="1a"] a{color:#f6c6e2}
[data-dpage="2"] :is(b,em),#favorite_box [data-dpage="2"] a{color:#caf6c6}
[data-dpage="3"] :is(b,em),#favorite_box [data-dpage="3"] a{color:#c6f6f2}
[data-dpage="4"] :is(b,em),#favorite_box [data-dpage="4"] a{color:#f6f2c6}
[data-dpage="0"] :is(b,em),#favorite_box [data-dpage="0"] a{color:#d3d3d3}
[data-dpage="5"] :is(b,em){color:#c6caf6}
.box:has([data-model]>.favorite_mark:active)>div{background:#b4afff;box-shadow:0 0 1em rgba(235, 220, 255, .9);transition:ease-in-out .3s}
.box:has([data-dpage="1"] a:hover)>div{background:#deafff;box-shadow:0 0 1em rgba(235, 220, 255, .9);transition:ease-in-out .3s}
.box:has([data-dpage="1a"] a:hover)>div{background:#f0cce8;box-shadow:0 0 1em rgba(235, 220, 255, .9);transition:ease-in-out .3s}
.box:has([data-dpage="2"] a:hover)>div{background:#afffc5;box-shadow:0 0 1em rgba(235, 200, 255, .9);transition:ease-in-out .3s}
.box:has([data-dpage="3"] a:hover)>div{background:#afe1ff;box-shadow:0 0 1em rgba(235, 220, 255, .9);transition:ease-in-out .3s}
.box:has([data-dpage="4"] a:hover)>div{background:#d0d7c9;box-shadow:0 0 1em rgba(235, 220, 255, .9);transition:ease-in-out .3s}
.box:has([data-dpage="5"] a:hover)>div{background:#9ca3b4;box-shadow:0 0 1em rgba(235, 220, 255, .9);transition:ease-in-out .3s}
article.box [data-dpage] a::before,article.box [data-dpage] a::after{position:absolute;content:"";top:50%;transform:translateY(-50%);clip-path:polygon(0 0, 100% 50%, 0 100%);width:.4em;height:.7em;background:rgba(255,255,255,.4)}
article.box [data-dpage] a::before{right:1em}
article.box [data-dpage] a::after{right:.5em}

/*page-st*/
.page-st{display:grid;gap:.3em;margin:0;padding:0;z-index:1}
.page-st>div{display:grid;margin:0 4px;background:rgba(0,0,0,.2)}
.page-st dt{display:flex;margin:4px;padding:.2em .8em;background:rgba(0,0,0,.2)}
.page-st ul{display:flex;flex-wrap:wrap;gap:.6em;margin:0;padding:.4em;list-style-type:none}
.page-st dt{font-weight:bold}.page-st dd{margin:0}
.page-st dt>a,.page-st ul li>a{position:relative;display:flex;align-items:center;margin:.2em;padding:0 .4em 0 1em;text-decoration:none;color:#bff6ff;border-radius:.3em}
.page-st dt>a::before,.page-st ul li>a::before{position:absolute;top:50%;left:0;content:"\e904";font-family:'icomoon';transform:scale(.8) translateY(-50%);font-size:.8em;color:#93b0bd}
.page-st dt>a:hover,.page-st li>a:hover{background:#fff;color:#0095F9;transition:ease-in-out .3s}
.page-st ol{display:grid;gap:.4em;margin:0;padding:0;list-style-type:none}.page-st dd>ol{padding:.4em 0}
.page-st ol li{position:relative;display:grid;gap:.2em;margin-left:2em;padding-left:1em}
.page-st ol li::before{position:absolute;content:"";top:1em;left:.3em;border-radius:50%;background:#bbb}
.page-st dd>ol>li::before{width:0.3em;height:0.3em}.page-st dd>ol ol>li::before{width:0.2em;height:0.2em}
.page-st ol li>a{margin:.2em .4em;padding:.3em;text-decoration:none;color:#bfeaff;border-radius:.3em}

dl.page-st1,dl.page-st2,dl.page-st3{display:grid;gap:.2em;margin:0;padding:0;z-index:1}dl.page-st3{grid-template-columns:1fr 1fr;}.page-st3 div:nth-of-type(3){grid-column:span 2}
:is(.page-st1,.page-st2,.page-st3)>div{display:grid;grid-template-columns:auto 1fr;border-radius:.3em;background:rgba(0,0,0,.1)}.page-st3 dd:first-of-type,.page-st3 dd:nth-of-type(2){text-align:center}
:is(.page-st1,.page-st2,.page-st3) dt{display:grid;align-items:center;width:7em;margin:0;padding:0 .2em 0 .6em;font-size:.9em;border-radius:.3em 0 0 .3em;background:rgba(0,0,0,.1)}:is(.page-st1,.page-st2,.page-st3) dd{margin:0;padding:.2em 0}.page-st1 dd{font-size:.9em}
dl:is(.page-st1,.page-st2,.page-st3) ul{display:flex;flex-wrap:wrap;gap:.2em .6em;margin:0;padding:0 .4em;list-style-type:none}
:is(dl:is(.page-st1,.page-st2,.page-st3) ul,ul.page-st1)>li{position:relative;margin:0 0 0 1em}
:is(dl:is(.page-st1,.page-st2,.page-st3) ul,ul.page-st1)>li::before{position:absolute;content:"";padding:0;top:50%;left:-.5em;width:.2em;height:.4em;transform:translateY(-50%) rotate(40deg);transform-origin:top left;border-bottom:.05em solid #999;border-right:.05em solid #999}

ul.page-st1{display:flex;flex-wrap:wrap;gap:.2em .6em;margin:0;padding:.4em;font-size:.9em;list-style-type:none;border-radius:.3em;background:rgba(0,0,0,.1)}

/*page-st導入月リンク*/
ol.page-st1{display:flex;flex-wrap:wrap;gap:.8em .6em;margin:0;padding:.4em;list-style-type:none;border-radius:.3em;background:rgba(0,0,0,.1)}
ol.page-st1>li{position:relative;display:grid;margin:0 0 0 .4em}ol.page-st1 li>a{margin:0;padding:.3em 1em .3em 1.2em;text-decoration:none;color:#bfeaff;border-radius:.3em}
ol.page-st1 li>a::before{position:absolute;top:50%;left:0;content:"\e904";font-family:'icomoon';transform:scale(.8) translateY(-50%);font-size:.8em;color:#93b0bd}



/* ---- MY LIST(i,c,r) ---- */
.favorite_mark:not(.checkon){background:rgba(0,0,0,.1)}.ma-1 .favorite_mark.checkon{background:rgba(0,0,0,.4);transition:300ms}
.checkon::after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"\f005";font-family:'icomoon';text-indent:0;font-size:1.05em;font-style:normal;color:#bba3ff;transition:300ms}
.favorite_mark{position:relative;display:grid;height:100%;text-indent:-200%;overflow:hidden;border-radius:.1em}
/* ---- MY LIST(all) ---- */
.favorite_mark::before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"\f006";font-family:'icomoon';text-indent:0;font-size:1.3em;font-style:normal}
#favorite_box .favorite_mark::before{color:#696969}
#my-box{margin:.2em;padding:0;color:#FAFCFF}
#favorite_box{display:grid;gap:.2em;margin:0;padding:.2em;list-style-type:none}
#favorite_box>li{display:grid;grid-template-columns:7fr 1fr;margin:0;padding:.2em;border-radius:.2em;background:rgba(200,200,245,.3)}
#favorite_box>li>div{display:grid;grid-template-columns:1fr 2.4em;gap:.4em .2em;text-overflow:ellipsis;white-space:nowrap}
#favorite_box>li>div>p{margin:0;padding:.2em .5em;font-size:.9em;color:#fff;overflow:hidden;text-overflow:ellipsis}
#favorite_box [data-dpage]>a{position:relative;display:grid;justify-content:center;padding:.4em 0;font-size:.85em;transition:300ms}#favorite_box [data-dpage]:hover{background:#fff}
#favorite_box>li>div>div{grid-column:span 2;display:grid;grid-template-columns:repeat(5,1fr);gap:.2em}
#favorite_box>li>div>i{display:grid;align-items:center;cursor:pointer;background:rgba(150,150,180,.7);border-radius:.2em}
#favorite_box [data-dpage="1"]{grid-column-start:1}
#favorite_box [data-dpage="2"]{grid-column-start:2}
#favorite_box [data-dpage="3"]{grid-column-start:3}
#favorite_box [data-dpage="4"]{grid-column-start:4}
#favorite_box [data-dpage="0"]{grid-column-start:5}
.ghost{opacity:.4!important}
#tooltip{display:none;animation:fadeIn 0.6s;position:absolute;top:1em;left:50%;transform:translateX(-50%);width:80%;padding:.4em;background:rgba(0,0,0,.7);backdrop-filter:blur(10px);outline:.4em solid rgba(0,0,0,.7);outline-offset:.2em;z-index:5}
#tooltip>p{margin:0;padding:.6em 1.4em .6em;color:#87c6ff}
#tooltip>ul{display:grid;gap:.8em;margin:0;padding:.4em;list-style-type:none}
#tooltip>ul>li{position:relative;margin:0;color:#fff;line-height:1.4em;text-align:justify}
#tooltipButton{width:10em;margin:.2em .3em;font-size:.9em}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.drag-handle{display:grid;position:relative;cursor:grab}.drag-handle:active {cursor:grabbing}
.drag-handle::before{position:absolute;top:50%;left:50%;transform: translate(-50%,-50%);font-family:'icomoon';content:"\e91a";font-size:2em;font-style:normal;color:#000}
#Browsing_history{display:grid;gap:.2em;margin:0;padding:.2em;list-style-type:none}
#Browsing_history li{display:grid;grid-template-columns:7fr 1fr 1fr;align-items:center;height:2.8em;border-radius:.2em;background:#eee;text-overflow:ellipsis;white-space:nowrap}
#Browsing_history li:hover{background:rgba(200,180,255,.9)}
#Browsing_history li a{padding:.4em .4em;color:#111;text-decoration:none;overflow:hidden;text-overflow:ellipsis}
#Browsing_history li a>small{display: block;overflow:hidden;text-overflow:ellipsis}
.h_delete{display:grid;justify-content:center;align-items:center;font-size:1.5em;color:#111;cursor:pointer}
.h_lock{position:relative;text-indent:110%;overflow:hidden}.h_lock::before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-indent:0;font-family:'icomoon';content:"\e918"}
#mylist+.mw-overlay1>.mw-N>div:first-child{display:flex;background:rgba(120,60,255,.4)}
#mylist+.mw-overlay1>.mw-N>div:first-child>p{position:relative;flex-grow:1;margin:auto 0;padding:.6em .6em .4em}
#mylist+.mw-overlay1>.mw-N>div:first-child>p::before{font-family:'icomoon';content:"\f006";padding:.4em .3em 0}
#my-box>p{padding:.4em 1.4em .1em;font-size:.9em;color:#aaa3ff}#my-box>p:first-of-type{margin:0}#my-box>p:nth-of-type(2){margin:.2em 0 0}


/* ---- pagination(index,ceiling,reset) ---- */
.page-n{display:grid;gap:.2em;padding:.2em;background: #fff;border-top:.2em solid #bbb;border-bottom:.2em solid #bbb}
nav.page-n{grid-template-columns: 4em 1fr 4em;margin:0 .4em .4em}div.page-n{margin:3px;border:.2em solid #333}
.page-n>:is(a,span){position:relative;display:grid;align-items:center;height:100%;color:#595959;background:rgba(50,0,0,.1);text-decoration:none}
nav.page-n>*:first-child{padding-left:1.4em}
nav.page-n>*:last-child{padding-right:1.4em;text-align:end}
.page-n>:is(a,span)::before,.page-n>:is(a,span)::after{position:absolute;color:#999}
.page-n>a:first-child::before{content:"≪";left:.4em}
.page-n>a:last-child::before{content:"≫";right:.4em}
.page-n>ul{display:grid;grid-template-columns:repeat(auto-fit, minmax(3em, 1fr));gap:.2em;margin:0;padding:0;list-style-type:none}
.page-n>ul>li{position:relative;display:grid;align-items:center}
.page-n>ul>li::before{position:absolute;color:#bbb}
.page-n a:hover{background:#fdcbf9;color:#595959}
.page-n>ul>li>span{display:grid;align-items:center;height:1.6em;text-align:center;font-weight:bold;color:#494949}
.page-n>ul>li>a{display:grid;align-items:center;height:1.6em;text-align:center;text-decoration:none;color:#696969;background:rgba(0,0,0,.04)}

/* ---- footer(all) ---- */
footer{position:relative;display:block;min-height:100%;margin:0 auto;padding-bottom:8em;font-size:12px}
#share-container{display:block;height:100%}
#share-container>p{position:relative;margin:.8em 0 .4em;padding-left:3em;color:#dbdbdb}#share-container>p::before{position:absolute;font-family:'icomoon';top:50%;left:1.8em;transform:translateY(-50%);content:"\f1e0"}
#share-container>ul{list-style:none;display:flex;flex-wrap:wrap;margin:0 1em .4em;padding:0}
#share-container>ul>li{width:4em;height:2.2em;margin:.2em;text-align:center}
#share-container a{display:flex;justify-content:center;align-items:center;height:100%;color:#fff;background:rgba(200,200,255,.3);text-decoration:none;border-radius:.2em}
#share-container a::before{font-family:'icomoon';font-size:1.5em;display:block;transition:ease-in-out .2s;border-radius:5px}
#share-container a:hover::before{color:#666;background:#dbdbdb;width:100%;height:100%;transform:scale(1.05);filter:drop-shadow(1px 1px 1.5px rgba(0,0,0,0.6))}
#sns_line::before{content:"\e907"}
#sns_tw::before{content:"\e91b"}
#sns_fb::before{content:"\ea90"}
#sns_hb::before{content:"\e908"}
#sns_po::before{content:"\e905"}
footer>section{display:grid;gap:.3em;margin:2em 0 1em}
footer h2{display:block;margin:0;padding-left:.8em;color:#595959}footer h2>img{width:5em;aspect-ratio:4/1;object-fit:cover}
footer>section>div{position:relative;display:block;width:15em;height:2em;padding:0 2em;color:#eef}
[data-foot]{position:relative;display:flex;align-items:center;height:100%;padding:0 .7em;cursor:pointer}
[data-foot]::before{font-family:'icomoon';display:inline-flex;justify-content:center;width:1.5em;color:#dde}
[data-foot]::after{position:absolute;content:attr(data-foot);font-family:'icomoon';top:50%;left:2.5em;transform:translateY(-50%)}
[data-foot]:hover{color:white;background:grey;border-radius:5px}
[data-foot]:hover::before{color:white}
footer>section>div:first-of-type>[data-foot]::before{content:"\e906"}
footer>section>div:nth-of-type(2)>[data-foot]::before{content:"\e903"}
footer>section>div:nth-of-type(3)>[data-foot]::before{content:"\f0e0"}
footer>small{position:absolute;left:2em;display:block;font-size:1em;color:#dde}
footer h3{margin:0;font-size:1.2em}
footer h4{margin:1em 0 0}
footer h4 ~ p{margin:0}footer h4 ~ p:not(footer h4+p){padding-top:1em}
footer section>ul{margin:0;padding:.5em 1em 0;list-style-type:lower-roman}
#formWrapper>form>div:nth-child(-n+5):nth-child(n+2){padding:.5em 1em}
#formWrapper{position:relative}
#formWrapper>form>div:first-child{display:none;padding:.5em 1em}textarea,#formWrapper :is(label>input,select){border:0.5px solid #777;margin:.2em 0;padding:.3em .4em;border-radius:.3em;filter:drop-shadow(1px 1px 1.5px rgba(0,0,0,0.6))}
input,select,textarea{font-family:inherit;font-size:100%}#formWrapper~iframe{display:none}
#formWrapper textarea{width:calc(100% - .8em)}
#thxMessage::before{display:block;content:"お問い合わせありがとうございました。"}#thxMessage::after{display:block;content:"自動返信メールを送信させていただきましたのでご確認ください。"}
#thxMessage{display:none;padding:5em 2em}
footer hr{margin:.2em;border-top:1px dashed silver;border-bottom:transparent 1px solid}
footer address{margin-left:1em}
#formWrapper [type="submit"]{margin:0 1em;border:1px solid #777;padding:.4em 1em;color:#fff;cursor:pointer;background:#000;border-radius:.3em}
::placeholder{color:silver}
:focus::placeholder{color:white}
.mw-F input:not(#formWrapper [type="submit"],#formWrapper label>input){visibility:hidden;position:absolute}



::-webkit-scrollbar{width:0px;height:4px}
::-webkit-scrollbar-thumb{border-radius:30px;background:#b7f0aa}
::-webkit-scrollbar-track{border-radius:30px;background:grey}

.mw-A input{visibility:hidden}.mw-A{position:absolute}
.mw-B,.mw-G{position:absolute;width:100%;height:100%}
.mw-C{display:grid;gap:.3em;overflow-y:auto;align-self:start;margin-top:0;padding:.3em;max-height:85vh;transform:translateX(-100%);transition:transform .4s cubic-bezier(.465,.183,.153,.946);background:linear-gradient(231deg, rgba(233, 233, 233, 0.01) 0%, rgba(233, 233, 233, 0.01) 25%,rgba(10, 10, 10, 0.01) 25%, rgba(10, 10, 10, 0.01) 50%,rgba(237, 237, 237, 0.01) 50%, rgba(237, 237, 237, 0.01) 75%,rgba(200, 200, 200, 0.01) 75%, rgba(200, 200, 200, 0.01) 100%),linear-gradient(344deg, rgba(2, 2, 2, 0.03) 0%, rgba(2, 2, 2, 0.03) 20%,rgba(10, 10, 10, 0.03) 20%, rgba(10, 10, 10, 0.03) 40%,rgba(100, 100, 100, 0.03) 40%, rgba(100, 100, 100, 0.03) 60%,rgba(60, 60, 60, 0.03) 60%, rgba(60, 60, 60, 0.03) 80%,rgba(135, 135, 135, 0.03) 80%, rgba(135, 135, 135, 0.03) 100%),linear-gradient(148deg, rgba(150, 150, 150, 0.03) 0%, rgba(150, 150, 150, 0.03) 14.286%,rgba(15, 15, 15, 0.03) 14.286%, rgba(15, 15, 15, 0.03) 28.572%,rgba(74, 74, 74, 0.03) 28.572%, rgba(74, 74, 74, 0.03) 42.858%,rgba(175, 175, 175, 0.03) 42.858%, rgba(175, 175, 175, 0.03) 57.144%,rgba(16, 16, 16, 0.03) 57.144%, rgba(16, 16, 16, 0.03) 71.42999999999999%,rgba(83, 83, 83, 0.03) 71.43%, rgba(83, 83, 83, 0.03) 85.71600000000001%,rgba(249, 249, 249, 0.03) 85.716%, rgba(249, 249, 249, 0.03) 100.002%),linear-gradient(122deg, rgba(150, 150, 150, 0.01) 0%, rgba(150, 150, 150, 0.01) 20%,rgba(252, 252, 252, 0.01) 20%, rgba(252, 252, 252, 0.01) 40%,rgba(226, 226, 226, 0.01) 40%, rgba(226, 226, 226, 0.01) 60%,rgba(49, 49, 49, 0.01) 60%, rgba(49, 49, 49, 0.01) 80%,rgba(94, 94, 94, 0.01) 80%, rgba(94, 94, 94, 0.01) 100%),linear-gradient(295deg, rgba(207, 207, 207, 0.02) 0%, rgba(207, 207, 207, 0.02) 25%,rgba(47, 47, 47, 0.02) 25%, rgba(47, 47, 47, 0.02) 50%,rgba(142, 142, 142, 0.02) 50%, rgba(142, 142, 142, 0.02) 75%,rgba(76, 76, 76, 0.02) 75%, rgba(76, 76, 76, 0.02) 100%),linear-gradient(73deg, rgba(81, 81, 81, 0.03) 0%, rgba(81, 81, 81, 0.03) 12.5%,rgba(158, 158, 158, 0.03) 12.5%, rgba(158, 158, 158, 0.03) 25%,rgba(136, 136, 136, 0.03) 25%, rgba(136, 136, 136, 0.03) 37.5%,rgba(209, 209, 209, 0.03) 37.5%, rgba(209, 209, 209, 0.03) 50%,rgba(152, 152, 152, 0.03) 50%, rgba(152, 152, 152, 0.03) 62.5%,rgba(97, 97, 97, 0.03) 62.5%, rgba(97, 97, 97, 0.03) 75%,rgba(167, 167, 167, 0.03) 75%, rgba(167, 167, 167, 0.03) 87.5%,rgba(22, 22, 22, 0.03) 87.5%, rgba(22, 22, 22, 0.03) 100%),linear-gradient(90deg, rgb(68,68,68),rgb(68,68,68))}
.mw-H{display:block;overflow-y:auto;align-self:start;margin-top:0;padding:1em;color:#595959;max-height:80vh;transform:translateX(-100%);transition:transform .4s cubic-bezier(.465,.183,.153,.946);background:#fff}

.mw-A input:checked ~ .mw-overlay,.mw-F input:checked ~ .mw-overlayF{pointer-events:auto;opacity:1;transform:scale(1);transition:opacity .8s cubic-bezier(.465,.183,.153,.946)}
.mw-A input:checked ~ .mw-overlay :is(.mw-C,.mw-Z){transform:translateX(0)}
.mw-F input:checked ~ .mw-overlayF .mw-H{transform:translateX(0)}


/*ad*/
.adlink1{margin:-1em 0 2em}
.ads-ci{margin:1em 0}
.ads-cm{display:grid;margin:0}
.adslot_1{width:100%;height:350px}

.w-adside{display:none}

.adv-1{background:#2D2D2D}
.ad-00{display:grid;gap:2px;margin:8px 14px;border:3px solid #424242;outline:solid 4px white;filter:drop-shadow(1px 1.5px 2px rgba(0,0,0,0.6))}
.adv-0{margin:10px 35px 5px;background:#2D2D2D}
.adv-ch{margin:30px 35px auto}

.ads-ch0{display:grid;margin:0 6px}
.ads-chw{display:grid;grid-template-columns:repeat(2,1fr);gap:4px}

.ads-ch{display:grid;margin:0 6px}
.ad-y01{margin:0 6px 4px}


/*--1.メーカー順 2.50音順 3.top 4.index--*/
[data-menu="l-maker"]>label::before,[data-menu="l-maker"] .mw-N>p::before{content:"\e90a"}
[data-menu="l-order"]>label::before,[data-menu="l-order"] .mw-N>p::before{content:"\e90a"}
[data-menu="l-mylist"]>label::before,[data-menu="l-mylist"] .mw-N>p::before{content:"\f006"}
[data-menu="l-top"]>a::before{content:"\f062"}
[data-menu="index"]>label::before,[data-menu="index"] .mw-N>p::before{content:"\e90b"}
.mw-N>p{position:relative;margin:0 3px;padding:.6em .6em .4em;background:rgba(120,60,255,.4)}.mw-N>p::before{font-family:'icomoon';padding:.4em .3em 0}
[data-menu="l-mylist"] .mw-N{background:#333}
:is([data-menu="l-maker"],[data-menu="l-order"]) .mw-N{background:#222}

@media (max-width:338.98px){
#mainground,footer{font-size:10px}
.adslot_1{height:350px}
}
@media (max-width:280px) {
#mainground,footer{font-size:10px}
#box{font-size:.85em}
.adslot_1{height:265px}
}

@media (max-width:359.98px) {
#mainground,footer{font-size:11px}
}
@media (min-width:390px) and (max-width:419.98px){
#mainground,footer{font-size:13px}
}
@media (min-width:420px){
#mainground,footer{font-size:14px}
}
@media (max-width:539.98px){
  #b-menu{position:fixed;left:0;bottom:0;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(20px,1fr));column-gap:.1em;background:#444;width:calc(100% - .2em);list-style-type:none;z-index:3}
  #b-menu > li{display:grid;margin:0;height:3.8em;background:#000;border:none}
[data-menu="index"]{grid-area:1/5}
[data-menu^="l"]>:is(a,label),[data-menu="index"]>label{position:relative;display:grid;justify-content:center;align-items:end;padding:.5em 0;color:#fff;text-decoration:none;cursor:pointer}
[data-menu^="l"]>:is(a,label)::before,[data-menu="index"]>label::before{position:absolute;font-family:'icomoon';top:.5em;left:50%;transform:translateX(-50%);font-size:1.2em}[data-menu="index"]>label::after{position:absolute;content:"INDEX";bottom:.5em;left:50%;transform:translateX(-50%)}
[data-menu^="l"]>:is(a,label):hover,[data-menu="index"]>label:hover{color:#222;background:#b7f7ff}
[data-menu="l-top"]{grid-area:1/4}
[data-menu="l-mylist"]{grid-area:1/3}

.mw-M input{visibility:hidden}.mw-M{position:absolute;bottom:0;right:0;height:0}
.mw-overlay,.mw-overlayF,.mw-overlay1{display:flex;justify-content:center;width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0, 0, 0, .8);pointer-events:none;opacity:0;transition:opacity .4s,transform 0s .4s;transform:scale(0);z-index:4;will-change:transform}
.mw-N{overflow-y:auto;align-self:start;margin-top:5px;max-height:90dvh;width:360px;background:#555;transform:translateX(100%);transition:transform .4s cubic-bezier(.465,.183,.153,.946)}
.mw-M input:checked ~ .mw-overlay1{pointer-events:auto;opacity:1;transform:translateX(0);transition:opacity .4s}
.mw-M input:checked ~ .mw-overlay1 .mw-N{transform: scale(1)}
.mw-O{position:absolute;width:100%;height:100dvh}
.nav-ol a.active::after{position:absolute;right:1em;content:"Now";color:red}
}
@media (min-width:540px){
#mainground{font-size:12px}
header{z-index:4}
.mw-M input{display:none}
#b-menu{position:sticky;top:50px;margin:0;padding:0;list-style-type:none;z-index:3}

[data-menu^="l"]>:is(a,label){position:fixed;background:rgba(200,200,255,.3)}
[data-menu="l-maker"]>label{bottom:13.6em;right:.4em}
[data-menu="l-order"]>label{bottom:9.2em;right:.4em}
[data-menu="l-mylist"]>label{bottom:4.8em;right:.4em}
[data-menu="l-top"]>a{bottom:.4em;right:.4em}
[data-menu^="l"]>:is(a,label){display:grid;justify-content:center;align-items:end;width:4.5em;height:3em;padding:.5em 0;color:#fff;text-decoration:none;cursor:pointer}
[data-menu^="l"]>:is(a,label)::before{position:absolute;font-family:'icomoon';top:.5em;left:50%;transform: translateX(-50%);font-size:1.4em}
[data-menu^="l"]>:is(a,label):hover{color:#222;background:#b7f7ff;transition:ease-in-out .3s}
[data-menu="index"]>label{display:block;height:0;text-indent:100%;overflow:hidden}

.mw-overlay,.mw-overlayF,:is([data-menu="l-maker"],[data-menu="l-order"],[data-menu="l-mylist"]) .mw-M .mw-overlay1{display:flex;justify-content:center;width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0,0,0,.8);pointer-events:none;opacity:0;transition:opacity .5s,transform 0s .5s;transform:scale(0);z-index:4;will-change:transform}
.mw-N{position:sticky;top:50px;overflow-y:scroll;height:90vh}

#container{grid-template-columns:6fr 3fr}
.mw-C,.mw-H,label[for="mylist"]+.mw-N{width:440px}
[data-menu="index"] .mw-overlay1 > .close1{display:none}

:is([data-menu="l-maker"],[data-menu="l-order"],[data-menu="l-mylist"]) .mw-M input{visibility:hidden}:is([data-menu="l-maker"],[data-menu="l-order"],[data-menu="l-mylist"]) .mw-M{position:absolute}
:is([data-menu="l-maker"],[data-menu="l-order"],[data-menu="l-mylist"]) .mw-M input:checked ~ .mw-overlay1{pointer-events:auto;opacity:1;transform:scale(1);transition:opacity .8s cubic-bezier(.465,.183,.153,.946)}
:is([data-menu="l-maker"],[data-menu="l-order"],[data-menu="l-mylist"]) .mw-M input:checked ~ .mw-overlay1 .mw-N{transform:translateX(0)}
:is([data-menu="l-maker"],[data-menu="l-order"],[data-menu="l-mylist"]) .mw-O{position:absolute;width:100%;height:100%}

}
@media (min-width:590px) and (max-width:639px){
#mainground,footer{font-size:13px}
}
@media (min-width:640px){
#mainground,footer{font-size:14px}
.adslot_1{height:386px}
}
@media (min-width:690px){
#mainground,footer{font-size:15px}
}
@media (min-width:720px){
#h1div{width:720px}
#container{width:720px}
#mainground,footer{font-size:16px}
footer{max-width:720px}
}


