/*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;}

/*
================================================================================================================
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,
#bg #bg01,
#bg #bg02,
#base::after{
display:block;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
pointer-events:none;
z-index:1;}

#bg01{
background-image:url(/game/2dx/34/images/common/bg/cherry01.webp) , url(/game/2dx/34/images/common/bg/common.jpg); 
background-size:auto , cover;
background-position:top right , center;
background-repeat:no-repeat , no-repeat;}
@media screen and (max-width:1400px){#bg01{background-size:60% auto , cover;}}
@media screen and (max-width:480px){#bg01{background-size:80% auto , cover;}}

/*花パーツ上*/
@media screen and (max-width:800px){
#bg01{background-position:top 155px right , center;}
#bg.fix #bg01{background-position:top 50px right , center;}}
@media screen and (max-width:480px){
#bg01{background-position:top 135px right , center;}
#bg.fix #bg01{background-position:top 40px right , center;}}

/*花びらループ*/
#bg02{
background-image:url(/game/2dx/34/images/common/bg/cherry_petal.webp); 
background-size:100% auto;
background-position:top;
background-repeat:repeat-y;
filter:drop-shadow(1px 1px 2px #000);
transform:translateZ(0);
transition: .3s ease;}
@media screen and (max-width:1400px){#bg02{background-size:150% auto;}}

/*花パーツ下*/
#base::after{
content:"";
background-image:url(/game/2dx/34/images/common/bg/cherry02.webp); 
background-size:auto;
background-position:bottom left;
background-repeat:no-repeat;
transition: .3s ease;}
@media screen and (max-width:1400px){#base::after{background-size:60% auto;}}
@media screen and (max-width:480px){#base::after{background-size:80% auto;}}

#base.btm::after{position:absolute;}

/*
================================================================================================================
ページベース
================================================================================================================
*/
@media screen and (min-width:1601px){#base{min-height:calc(100vh - 375px);}}
@media screen and (max-width:1600px){#base{min-height:65vh;}}
@media screen and (max-width:1200px){#base{min-height:calc(100vh - 307px);}}
@media screen and (max-width:980px){#base{min-height:calc(100vh - 355px);}}
@media screen and (max-width:480px){#base{min-height:calc(100vh - 338px);}}

#base{
display:block;
position:relative;
width:100%;
max-width:2000px;
color:#fff;
font-family:'Noto Sans JP', sans-serif;
padding:20px;
margin:0 auto;}
@media screen and (max-width:640px){#base{padding:20px 10px;}}

#base-inner{position:relative; width:100%; max-width:980px; margin:0 auto;}

/*
================================================================================================================
フレーム
================================================================================================================
*/
#base-inner .frame{
position:relative;
width:100%;
max-width:980px;
color:#000;
background:#fff;
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;}}

/*エラーメッセージ*/
#base-inner > .frame.error{color:#fff; background:rgba(0,0,0,.8);}
#base-inner .frame .frame.error{color:#fff; background:transparent !important;}

/*
================================================================================================================
ページ見出し
================================================================================================================
*/
#page-title{
position:relative;
width:calc(100% - 10px);
color:#fff;
font-size:30px;
font-weight:900;
letter-spacing:-1px;
text-align:center;
padding:10px 20px;
margin:0 auto 20px;
pointer-events:none;}
#page-title::before,#page-title::after{display:block; content:""; position:absolute; top:0; left:0; width:100%; height:100%; /*border-radius:50px;*/}
#page-title::before{
top:-2px;
left:-2px;
width:calc(100% + 4px);
height:calc(100% + 4px);
background-image:url(/game/2dx/34/images/common/bg/title.jpg);
background-size:100% 100%;
filter:drop-shadow(1px 1px 0 #000) drop-shadow(-1px -1px 0 #000) drop-shadow(-1px 1px 0 #000) drop-shadow(1px -1px 0 #000);
transform:translateZ(0);
z-index:1;}
#page-title::after{background:#000; z-index:2;}

#page-title > p{
position:relative;
width:100%;
line-height:110%;
margin:0 auto;
transform:skewX(-15deg);
z-index:3;}
#page-title > p > br{display:block;}
#page-title > p > span{font-size:20px; font-weight:700;}

@media screen and (min-width:1201px){
#page-title{padding:15px 20px 20px;}
#page-title > p{line-height:120%; filter:drop-shadow(1px 1px 0 #000) drop-shadow(-1px -1px 0 #000) drop-shadow(-1px 1px 0 #000) drop-shadow(1px -1px 0 #000) drop-shadow(2px 2px 0 #ae00ff);}}
@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{text-align:left; font-size:16px;}}

/*
================================================================================================================
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;}}