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

#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%; height:100%;}
body{
min-width:320px !important;
color:#fff;
background-color:#000;
margin:0;
font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", /*"ＭＳ Ｐゴシック","MS PGothic", */sans-serif;
overflow-x:hidden;}
header,footer{z-index:1;}
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;}

*:focus{outline:0;}

a img{
-webkit-transition:opacity 0.3s ease;
-moz-transition:opacity 0.3s ease;
transition:opacity 0.3s ease;}

/*
================================================================================================================
PAGE COMMON
================================================================================================================
*/
#bg{
display:block;
position:fixed;
width:100%;
height:110vh;
top:0;
left:0;
background-image:url(../images/common/bg.jpg);
background-position:top center;
background-repeat:no-repeat;
background-size:cover;
z-index:1;}

#main{
display:block;
position:relative;
width:100%;
padding:120px 20px 20px;
margin:0 auto;
z-index:2;}
@media screen and (max-width:580px){#main{padding:70px 10px 20px;}}

@media screen and (min-width:981px){#main{min-height:calc(100vh - 201px);}}
@media screen and (max-width:980px){#main{min-height:calc(100vh - 249px);}}

/*
=========================
フレーム
=========================
*/
#main > .main-inner{
position:relative;
width:100%;
max-width:1200px;
color:#1c2d2a;
background:rgba(0,0,0,.7);
font-family:"Noto Sans JP", sans-serif;
font-optical-sizing:auto;
border-radius:20px;
border:3px solid #118e2e;
padding:40px;
margin:0 auto;}
#main > .main-inner::before{
display:block;
content:"";
position:absolute;
top:20px;
left:20px;
width:calc(100% - 40px);
height:calc(100% - 40px);
background:#eaf2e5;
border-radius:17px;
z-index:2;}
#main > .main-inner > *{position:relative; z-index:3;}
@media screen and (max-width:640px){
#main > .main-inner{padding:20px;}
#main > .main-inner::before{top:10px; left:10px; width:calc(100% - 20px); height:calc(100% - 20px);}}
/*
@media screen and (max-width:480px){
#main > .main-inner{padding:10px; border:2px solid #118e2e;}
#main > .main-inner::before{top:5px; left:5px; width:calc(100% - 10px); height:calc(100% - 10px);}}*/

#main > .main-inner + .main-inner{margin-top:40px;}

/*
================================================================================================================
ページ名
================================================================================================================
*/
#main .page-title{
position:relative;
color:#fff;
background-color:#000;
background-image:linear-gradient(#334d00 1px, transparent 1px);
background-size:100% 5px;
font-weight:700;
text-shadow:1px 1px 0 #3a5607,-1px -1px 0 #3a5607,-1px 1px 0 #3a5607,1px -1px 0 #3a5607,0 0 2px #3a5607,0 0 3px #3a5607;
margin:0 auto;}

#main .page-title p{display:flex; position:relative; width:100%; height:100%; align-items:center;}
#main .page-title p::before{
display:block;
content:"";
position:absolute;
top:calc(50% - 11px);
left:-25px;
width:10px;
height:26px;
background:#ffffb1;
box-shadow:0 0 4px #e6c253 , 0 0 10px #e6c253;}
@media screen and (max-width:640px){#main .page-title p::before{top:calc(50% - 11px); left:-15px; width:8px; height:22px;}}
@media screen and (max-width:420px){#main > .main-inner > .page-title p::before{top:calc(50% - 9px); left:-10px; width:5px; height:18px;}}

/*
=========================
ページ名 大
=========================
*/
#main > .page-title{
width:100%;
max-width:1200px;
height:60px;
font-size:30px;
border-radius:40px;
border:2px solid #88c429;
padding:0 50px 0 90px;
margin:0 auto 40px;}
#main > .page-title::before,
#main > .page-title::after{display:block; content:""; position:absolute; top:calc(50% - 29px); width:58px; height:58px; background-size:auto 100%;}
#main > .page-title::before{left:0; background-image:url(../images/common/title/head01_left.png);}
#main > .page-title::after{right:0; background-image:url(../images/common/title/head01_right.png);}
@media screen and (max-width:640px){#main > .page-title{font-size:24px; padding:0 50px 0 80px; margin:0 auto 20px;}}
@media screen and (max-width:480px){
#main > .page-title{height:50px; font-size:20px; padding:0 50px 0 65px; margin:0 auto 10px;}
#main > .page-title::before,#main > .page-title::after{top:calc(50% - 24px); width:48px; height:48px;}}

/*
=========================
ページ名
=========================
*/
#main > .main-inner > .page-title{
width:calc(100% - 40px);
height:50px;
font-size:24px;
border-top:2px solid #88c429;
border-bottom:2px solid #88c429;
padding:0 10px 0 45px;}
#main > .main-inner > .page-title::before,
#main > .main-inner > .page-title::after{display:block; content:""; position:absolute; top:calc(50% - 27px); width:27px; height:54px; background-size:auto 100%;}
#main > .main-inner > .page-title::before{left:-20px; background-image:url(../images/common/title/head02_left.png);}
#main > .main-inner > .page-title::after{right:-20px; background-image:url(../images/common/title/head02_right.png);}
@media screen and (max-width:640px){
#main > .main-inner > .page-title{width:calc(100% - 20px); height:40px; font-size:18px; padding:0 10px 0 25px; margin:10px auto 0;}
#main > .main-inner > .page-title::before,#main > .main-inner > .page-title::after{top:calc(50% - 21px); width:21px; height:42px;}
#main > .main-inner > .page-title::before{left:-15px;}
#main > .main-inner > .page-title::after{right:-15px;}}
@media screen and (max-width:420px){#main > .main-inner > .page-title{font-size:14px; padding:0 10px 0 20px;}}
@media screen and (max-width:370px){#main > .main-inner > .page-title{font-size:13px;}}

/*
=========================
ページ名 サブタイトル
=========================
*/
#main > .main-inner .sub-title{
width:calc(100% - 40px);
color:#1c2d2a;
background-color:#b4dc87;
background-image:linear-gradient(#a7d782 1px, transparent 1px), linear-gradient(90deg, #a7d782 1px, transparent 1px);
background-size:10px 10px;
background-position:top -5px left -5px;
font-size:18px;
font-weight:700;
border:1px solid #72a400;
padding:5px;
margin:20px auto 30px;}
@media screen and (max-width:640px){#main > .main-inner .sub-title{width:100%; font-size:15px; margin:10px auto 20px;}}
@media screen and (max-width:480px){#main > .main-inner .sub-title{font-size:13px;}}

/*
================================================================================================================
ボタン
================================================================================================================
*/
.btn-link{
display:block;
width:100%;
max-width:300px;
color:#fff;
background:linear-gradient(to bottom, #000000 0%,#005100 100%);
text-align:center;
text-shadow:0 0 2px #3a5607 , 1px 1px 0 #3a5607 , -1px -1px 0 #3a5607 , -1px 1px 0 #3a5607 , 1px -1px 0 #3a5607;
border-radius:0px 15px 0px 15px;
border:1px solid #118e2e;
padding:10px;
margin:0 auto;
cursor:pointer;
transition:all .2s ease;}
.btn-link:hover{
border:1px solid #ffffb1;
text-shadow:0 0 3px #ffffb1 , 0 0 10px #ffffb1;
box-shadow:0 0 5px #ffffb1 , inset 0 0 5px #ffffb1;}

/*
================================================================================================================
ERROR
================================================================================================================
*/
#error .main{
position:relative;
width:100%;
max-width:980px;
text-align:center;
margin:100px auto;
z-index:2;}

#error .main strong{font-size:18px; display:block;}
#error .main strong br{display:none;}
#error .main p{font-size:14px; margin:20px auto;}
#error .main span{display:block; font-size:12px;}

@media screen and (max-width:1100px){#error .main{width:90%;}}

@media screen and (max-width:800px){
#error .main strong{line-height:22px;}
#error .main strong br{display:block;}
#error .main p,
#error .main span{text-align:left !important;}}

@media screen and (max-width:370px){
#error .main strong{font-size:15px;}}

/*
================================================================================================================
TOPに戻るボタン
================================================================================================================
*/
#page-top{
position:fixed;
bottom:10px;
right:10px;
width:90px;
height:90px;
z-index:9999;}
#page-top a{
display:block;
width:100%;
height:100%;
background-image:url(/game/sdvx/vii/images/common/btn_top.png);
background-repeat:no-repeat;
background-position:center;
background-size:100% auto;
transition:opacity .2s ease;
filter:drop-shadow(2px 2px 2px rgba(0,0,0,.5));
cursor:pointer;}
#page-top a:hover{opacity:.7;}
@media screen and (max-width:980px){#page-top{width:70px; height:70px;}}

/*
================================================================================================================
HEADER
================================================================================================================
*/
header #id_nav_menu_2.common-header dl,
header #id_nav_menu_2.common-header dl dd,
header #id_nav_menu_2.common-header dl dd ul{display:flex; justify-content:flex-end; align-items:center;}
header #id_nav_menu_2.common-header dl dd ul li:last-child{transform:translateY(2px); margin:0 20px 0 5px !important;}

#title_ad{text-align:left; margin:0;}
#title_ad a{display:flex; width:auto; color:#004484; font-size:12px; text-decoration:underline; align-items:center;}
#title_ad br{display:none;}
@media screen and (max-width:620px){
#title_ad a{font-size:10px; line-height:12px;}
#title_ad br{display:block;}}
@media screen and (max-width:380px){#title_ad a{font-size:7px;}}