@charset "Shift-JIS";
/*e-amusementサイトテンプレート*/
header,footer,header#id_nav_menu_1{position:relative !important;}
header#id_nav_menu_1{background-color:#fff;}
#wrapper{position:relative !important;}
#container{background:#fff;}

/*z-index*/
#main,#main::before,#main::after {z-index:1;}
#main > #main-inner              {z-index:2;}
#main > #main-inner > #frame     {z-index:3;}

header#id_nav_menu_1              {z-index:9999 !important;}
footer                            {z-index:2 !important;}
#page-top,#page-top a             {z-index:100 !important;}

/*
================================================================================================================
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%; height:100%; overflow-wrap:break-word}
body{
min-width:320px !important;
background:#000 !important;
margin:0 auto;
font-size:12px;
font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
overflow-x:hidden;}
a{outline:none;}
a:link,a:visited,a:hover,a:active{text-decoration:none;}
a img{transition:opacity .3s ease;}
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:700; font-style:normal;}
table{width:100%; color:#000; border-collapse:collapse; border-spacing:0; margin:0 auto;}

.no-show{display:none;}/*タブ切替*/
.red{color:#cb0715;}
.blue{color:#0074ff;}

#main{position:relative; width:100%; height:100%;}
#main::before{
display:block;
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background-color:#fff;
background-image:url(../img/common/bg.webp);
background-position:center;
background-repeat:no-repeat;
background-size:cover;}

#main-inner{position:relative; width:100%; max-width:1200px; min-height:calc(100vh - 194px); margin:0 auto;}
@media screen and (min-width:1101px){#main-inner{display:flex;}}

#main-inner::before,
#main-inner::after{
display:block;
content:"";
position:fixed;
top:0;
width:calc(50% - 240px);
height:100%;
background:rgba(255,255,255,.6);}
#main-inner::before{left:0;}
#main-inner::after{right:0;}

#frame{
position:relative;
width:50%;
max-width:480px;
margin:0 auto;
padding:0;
}
#frame::before,
#frame::after{
display:block;
content:"";
width:5px;
height:100%;
position:absolute;
top:0;
background:#0021b0;
pointer-events:none;
z-index:3;
}
#frame::before{left:-5px;}
#frame::after{right:-5px;}
@media screen and (max-width:1100px){#frame{width:100%; max-width:480px; margin:0 auto;}}

#frame > #inner{position:relative; width:100%; height:100%; padding:0 0 30px;}
@media screen and (max-width:460px){#frame > #inner{padding:0 5px 30px;}}

#frame > #inner::before{bottom:0; left:-10px;}
#frame > #inner::after{top:0; right:-10px;}
@media screen and (max-width:500px){#frame > #inner::before,#frame > #inner::after{display:none;}}

#frame > #inner img{width:100%;}

/*
=========================
メインフレーム中身
=========================
*/
#frame > #inner > #top-image{position:relative;}

/*
=========================
box関連
=========================
*/
/*
=========
見出し
=========
*/
.box > h2{
background-color:#ffca00; 
font-family:"M PLUS 1p", sans-serif;
font-weight:800;
font-size:26px; 
color:#fff; 
text-shadow:1.763px 2.427px 0px rgba(164, 104, 0, 0.47);
text-align:center; 
padding:15px;
}
.caution > h2{
background-color:#ffc900; 
box-shadow: 0px 2px 0px 2px rgba(0, 6, 132, 0.25); 
border:solid 2px #fff;
font-family:"M PLUS 1p", sans-serif;
font-weight:800;
font-size:16px;
margin-bottom:5px; 
padding:10px;
}
@media screen and (max-width:375px){
.box > h2{font-size:18px;}
.caution > h2{font-size:14px;}
}
.ranking > h2{background-color:#000; text-shadow:none;}
/*マイページ用*/
.mypage > h2{
background-image:url(../img/ranking/flower.png);
background-position:top -30px right;
background-size:50%;
background-repeat:no-repeat;
}

h3{font-size:16px; font-family:"M PLUS 1p", sans-serif; font-weight:800; margin-top:10px;}
h3 + p{margin-top:10px;}
h3.number{position:relative; padding-left:20px;}
h3.number::before{position:absolute; content:""; font-size:20px; top:0; left:0;}
h3.number.one::before{content:"①";}
h3.number.two::before{content:"②";}
h3.number.three::before{content:"③";}

.ranking h3{position:relative; margin-bottom:10px;}
.ranking h3 span img{position:absolute; max-width:20px; top:0;}

h4{font-size:14px; font-weight:bold; margin-top:20px;}
h4.schedule{font-size:12px; font-weight:bold; text-align:center; margin:20px 0 40px 0;}
h4.schedule p:nth-of-type(2){font-size:15px;}

/*基本のbox*/
.box{
width:100%; 
max-width:460px;
background-color:#fff; 
border-radius:40px; box-shadow:0px 5px 0px 2px rgba(0, 6, 132, 0.25); 
overflow:hidden; 
margin:20px auto;
}
/*基本のbox 水玉付き*/
.box.solo,
.box.mission,
.box.mypage{
background-image:url(../img/top/dot.png);
background-position:right bottom -4px;
background-repeat:no-repeat;
background-size:80%;
}
.box .box-inner{padding:10px 20px; color:#5a4a41;}
.box .box-inner > p{margin-bottom:10px;}
/*box ランキング用 花*/
.box.ranking{
background-image:url(../img/ranking/flower.png);
background-color:#ffca00; 
background-position:right -40px bottom -80px;
background-repeat:no-repeat;
background-size:80%;
color:#000;
}
.box.ranking .box-inner{color:#000;}


/*注意書き*/
.caution{width:100%; max-width:460px;margin:0 auto;}
.caution ul{background-color:rgba(255, 255, 255 ,0.8); padding:10px;}

/*box内リスト*/
.list{font-weight:bold;}
.list.point{border:solid 1px #5a4a41;}
.list.point li{display:flex; justify-content:space-between; align-items:center; border-bottom:solid 1px #5a4a41; padding:5px;}
.list.point li:last-child{border:none;}

.list.two{border:solid 1px #5a4a41;}
.list.two li{display:flex; justify-content:space-between; /*align-items:center;*/ border-bottom:solid 1px #5a4a41;}
.list.two li:first-child{background-color:#ffefad;}
.list.two li:last-child{border:none;}
.list.two li p{width:50%; padding:5px;}
.list.two li p:first-child{border-right:solid 1px #5a4a41;}
/*
=========================
ボタン
=========================
*/
.btn {
display:block;
width:calc(100% - 40px);
border-radius:40px;
border:solid 4px #000;
filter:drop-shadow(4px 4px 0 #8f6101);
transform: translateZ(0);
text-align:center;
margin:20px auto;
padding:12px;
box-shadow:inset 2px 2px 2px 0 #fff, inset -2px -2px 2px 0 #000;
transition:all .3s ease;
}
.btn > p{
font-size:16px;
font-family:"M PLUS 1p", sans-serif;
font-weight:800;
padding-bottom:5px;
}
.btn.link{background:linear-gradient(#ffc700 , #fcc601); cursor:pointer;}
.btn.link:hover{background:linear-gradient(#ff9900 , #fc5201);}

.btn.none{
background:#d4d4d4;
filter: drop-shadow(4px 4px 0 #9e9e9e);
transform: translateZ(0);
pointer-events:none;
}
.btn.check{
background:#d4d4d4;
filter: drop-shadow(4px 4px 0 #9e9e9e);
transform: translateZ(0);
pointer-events:none;
}


.sp-460px{display:none;}
@media screen and (max-width:460px){
.sp-460px{display:block;}
}

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

ul.dot,ul.ast,ul.num{line-height:180%;}
ul.dot > li,ul.ast > li,span.ast{display:block; position:relative; padding-left:18px;}
ul.dot > li::before,
ul.ast > li::before,
span.ast::before{display:block; position:absolute; top:0; left:0;}

ul.dot > li::before{content:""; top:10px; left:4px; width:5px; height:5px; background:#000; border-radius:50%;}
ul.dot > li.red::before{background:#cb0715;}
ul.ast > li::before,span.ast::before{content:"※";}

ul.ast.small > li,span.ast.small{padding-left:14px;}

ul.ast li a{color:#ff5078; text-decoration:underline;}
ul.ast li a:hover{text-decoration:none;}

/*
================================================================================================================
TOPに戻るボタン
================================================================================================================
*/
#page-top{
position:fixed;
bottom:0;
right:0;
visibility:hidden;
transition:all .4s ease;
opacity:0;}
#page-top a{
display:block;
position:relative;
width:90px;
height:78px;
/*background-image:url(/game/bombergirl/bg/p/images/p/common/pagetop.png);*/
background-image:url(../img/pagetop.png);
background-size:auto 78px;
background-repeat:no-repeat;
background-position:center;
transition:opacity .4s ease;}
#page-top a:hover{opacity:.7;}

#page-top.scroll{bottom:0; opacity:1; visibility:visible;}

@media screen and (max-width:1100px){
#page-top{right:0;}
#page-top a{width:70px; height:58px; background-size:auto 58px;}}



/*
================================================================================================================
ERROR
================================================================================================================
*/
#error{display:flex; width:100%; min-height:calc(100vh - 496px); align-items:center;}
#error > *{width:100%;}
@media screen and (max-width:1100px){#error{min-height:calc(100vh - 695px);}}
@media screen and (max-width:480px){#error{min-height:calc(100vh - 664px);}}