/*e-amusementサイトテンプレート*/
header,footer,header#id_nav_menu_1{position:relative !important;}
header#id_nav_menu_1{background:#fff;}
#wrapper{position:relative !important;}
header#id_nav_menu_1{z-index:9999 !important;}
footer{z-index:2 !important;}

#base-inner{z-index:4;}
#menu > #bg{z-index:2;}
#menu-pc{z-index:90 !important;}
#menu-sp #bar{z-index:5;}
#title-pc a img{z-index:2;}

#log-on{z-index:1;}

/*
================================================================================================================
COMMON
================================================================================================================
*/
*{padding:0; margin:0; border:0;}
*, *:before, *:after{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
-ms-box-sizing:border-box;
box-sizing:border-box;}

html{width:100%; max-width:2000px; height:100%; margin:0 auto;}
body{
width:100%;
min-width:320px !important;
height:100%;
background:#fff;
margin:0;
font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
overflow-x:hidden;}
h1,h2,h3,h4,h5,h6{display:none;}
a{outline:none;}
a:link,a:visited,a:hover,a:active{text-decoration:none;}
img{padding:0; margin:0; border:0; vertical-align:bottom;}
ul{margin:0; padding:0; border:0;}
li{list-style:none;}
strong,em,b{font-weight:bold; font-style:normal;}
table{width:100%; color:#000; border-collapse:collapse; border-spacing:0; margin:0 auto;}
tr,td,th{border-collapse:collapse;}

/*
=========================
リスト
========================
*/
#base .small{font-size:12px;}
@media screen and (max-width:640px){#base .small{font-size:11px;}}
@media screen and (max-width:480px){#base .small{font-size:10px;}}

ul.dot > li,ul.ast > li,span.ast{position:relative; padding-left:16px;}
ul.num > li{position:relative; padding-left:22px;}

ul.dot > li::before,
ul.ast > li::before,
ul.num > li::before,
span.ast::before{display:block; position:absolute; top:0; left:0;}

ul.dot > li::before{content:"・";}
ul.ast > li::before,span.ast::before{content:"※";}

ul.num > li:first-child::before{content:"①";}
ul.num > li:nth-child(2)::before{content:"②";}
ul.num > li:nth-child(3)::before{content:"③";}
ul.num > li:nth-child(4)::before{content:"④";}
ul.num > li:nth-child(5)::before{content:"⑤";}

/*
=========================
背景
========================
*/
#bg{
position:fixed;
top:0;
left:0;
width:100%;
height:100vh;
background-image:url(../../images/common/bg/main.webp);
background-position:top;
background-repeat:no-repeat;
background-size:cover;
pointer-events:none;
z-index:1;}
@media screen and (min-width:2001px){#bg{left:calc(50% - 1000px); max-width:2000px;}}

/*
================================================================================================================
ページベース
================================================================================================================
*/
@media screen and (min-width:981px){#base{min-height:calc(100vh - 367px);}}
@media screen and (max-width:980px){#base{min-height:calc(100vh - 345px);}}

#base{
display:block;
position:relative;
width:100%;
max-width:2000px;
color:#000;
padding:20px;
margin:0 auto;
z-index:2;}
@media screen and (max-width:640px){#base{padding:10px;}}
@media screen and (max-width:480px){#base{padding:0;}}

#base-inner{position:relative; width:100%; max-width:980px; background:rgba(255,255,255,.4); padding:20px; margin:0 auto;}
@media screen and (max-width:980px){#base-inner{padding:20px;}}
@media screen and (max-width:480px){#base-inner{padding:10px;}}

/*
================================================================================================================
フレーム
================================================================================================================
*/
#base-inner .frame{
position:relative;
width:100%;
max-width:980px;
background:rgba(255,255,255,.8);
font-size:14px;
text-align:center;
padding:20px;
margin:0 auto;
z-index:5;}
#base-inner .frame::after{display:none !important;}
@media screen and (max-width:480px){#base-inner .frame{font-size:13px; padding:10px;}}
@media screen and (max-width:360px){#base-inner .frame{font-size:12px;}}

/*
================================================================================================================
ページ見出し
================================================================================================================
*/
#page-title{
position:relative;
width:100%;
color:#000;
font-family:'M PLUS 1', sans-serif;
font-size:30px;
font-weight:700;
padding-left:20px;
margin:0 auto 10px;
pointer-events:none;}
#page-title::before{
display:block;
content:"";
position:absolute;
top:calc(50% - 1px);
left:-490px;
width:500px;
height:1px;
border-bottom:2px dashed #000;}

#page-title > p{width:100%; line-height:110%; margin:0 auto;}
#page-title > p > br{display:block;}
#page-title > p > span{font-size:20px; font-weight:normal;}

@media screen and (max-width:600px){
#page-title{font-size:20px;}
#page-title > p > span{font-size:15px;}}
@media screen and (max-width:380px){
#page-title.long.pass{font-size:18px;}}

/*
================================================================================================================
TOPに戻るボタン
================================================================================================================
*/
#page-top{
position:fixed;
bottom:10px;
right:10px;
width:120px;
height:120px;
z-index:999 !important;
filter:drop-shadow(2px 2px 1px rgba(0,0,0,.3));}
#page-top a{
position:relative;
display:block;
width:100%;
height:100%;
background-image:url(../../images/common/btn_top.png);
background-size:100% auto;
transition:all .3s ease;
z-index:999 !important;}
#page-top a:hover{opacity:.5}

@media screen and (max-width:800px){#page-top{width:90px; height:90px;}}
