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

/*
================================================================================================================
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;
color:#000;
background:#fff !important;
margin:0 auto;
font-family:"メイリオ", "Meiryo", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
overflow-x:hidden;}
h1,h2,h3,h4,h5,h6{font-weight:700; display:none;}
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;}

.blue{color:#00f;}
.red{color:#f00;}

/*
================================================================================================================
共通
================================================================================================================
*/
#main{font-size:16px; line-height:150%; font-family:'Noto Sans JP', sans-serif; padding:20px;}
@media screen and (max-width:640px){#main{font-size:14px; padding:10px;}}
@media screen and (max-width:480px){#main{font-size:13px; padding:5px;}}

#main-inner{width:100%; max-width:980px; border:1px solid #ddd; padding:20px; margin:0 auto;}
@media screen and (min-width:981px){#main-inner{min-height:calc(100vh - 241px);}}
@media screen and (max-width:980px){#main-inner{min-height:calc(100vh - 289px);}}
@media screen and (max-width:480px){#main-inner{min-height:calc(100vh - 269px); padding:10px;}}

#main-inner img{display:block; width:100%; margin:10px auto;}

/*
=========================
見出し
========================
*/
#main h1{display:block; color:#fff; background:#444; border-radius:10px; padding:20px;}
#main h1 strong{display:block; font-size:22px; border-top:1px solid #888; padding:10px 0 0; margin:10px auto 0;}
#main h2{display:block; font-size:20px; border-left:8px solid #990014; padding:5px 10px; margin:40px auto 20px;}
#main h3{display:block; font-size:18px; border-bottom:1px solid #990014; padding:0 5px 5px; margin:40px auto 10px;}
#main h4{display:block; font-size:16px; padding:0 5px 5px; margin:40px auto 10px;}
#main h4 > span{color:#990014;}

@media screen and (max-width:640px){
#main h1{padding:10px;}
#main h1 strong{font-size:18px; padding:5px 0 0; margin:5px auto 0;}
#main h2{font-size:16px;}
#main h3{font-size:14px;}
#main h4{font-size:12px;}}

b.indent{display:block; position:relative; padding:0 5px 0 20px; margin:20px auto 5px;}
b.indent::before{
display:block;
content:"";
position:absolute;
top:calc(50% - .5px);
left:0;
width:15px;
height:1px;
background:#666;}

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

ul.list > li{position:relative; padding-left:16px;}
ul.num > li{padding-left:22px;}
ul.list > li + li{margin-top:5px;}

ul.list > li::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:"⑤";}

/*
========================
リンクボタン
========================
*/
.btn-link{
display:block;
position:relative;
width:calc(100% - 40px);
max-width:480px;
color:#990014;
font-weight:700;
text-align:center;
border:1px solid #990014;
border-radius:5px;
padding:10px 20px;
margin:20px auto;
transition:all .2s ease;}
.btn-link:hover{color:#fff; background:#990014;}
.btn-link::before{
display:block;
content:"";
position:absolute;
top:calc(50% - 7px);
right:20px;
width:14px;
height:14px;
border-top:2px solid #990014;
border-right:2px solid #990014;
transform:rotate(45deg);
transition:all .2s ease;}
.btn-link:hover::before{
right:15px;
border-top:2px solid #fff;
border-right:2px solid #fff;}

@media screen and (max-width:640px){.btn-link{text-align:left; padding:10px 40px 10px 10px;}}
@media screen and (max-width:480px){.btn-link{width:100%;}}

/*
========================
動画
========================
*/
.movie{
position:relative;
width:100%;
margin:0 auto;}
.movie-inner{
position:relative;
padding-bottom:56.25%;
height:0;
overflow:hidden;}
.movie-inner iframe{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
margin:0 auto;
z-index:2;}

/*
================================================================================================================
詳細情報 - 開催期間・店舗情報
================================================================================================================
*/
ul.date,ul.shop{width:100%; max-width:800px; margin:0 auto;}

/*開催期間*/
ul.date{color:#fff; font-size:18px; font-weight:700; background:#666; border-radius:5px; padding:10px;}
ul.date li{position:relative;}
ul.date li::before{
display:block;
content:"開催期間";
width:110px;
background:#990014;
text-align:center;
border-radius:5px;
padding:5px 0;}

@media screen and (min-width:641px){
ul.date li{padding-left:120px;}
ul.date li::before{position:absolute; top:-5px; left:-5px;}}
@media screen and (max-width:640px){
ul.date{font-size:15px; text-align:center; padding:5px;}
ul.date li::before{padding:2px 0; margin:0 auto 5px;}}

/*店舗情報*/
ul.shop{font-size:14px; border:1px solid #ddd; border-radius:5px; padding:5px; margin-top:20px;}
ul.shop li + li{margin-top:5px;}
ul.shop li:nth-child(1){font-size:18px; font-weight:700; background:#ddd; border-radius:5px; padding:5px 20px;}
ul.shop li:nth-child(3){border-top:1px dotted #ddd; border-bottom:1px dotted #ddd;}
ul.shop li:not(:nth-child(1)){position:relative; padding:5px 0;}
ul.shop li:not(:nth-child(1))::before{display:block;}
ul.shop li:nth-child(2)::before{content:"住所";}
ul.shop li:nth-child(3)::before{content:"アクセス";}
ul.shop li:nth-child(4)::before{content:"ロケテスト開催時間";}
ul.shop li a{
display:inline-block;
position:relative;
color:#990014;
border:1px solid;
border-radius:5px;
padding:0 5px 0 18px;
margin:0 0 0 5px;
transition:opacity .2s ease;}
ul.shop li a:hover{opacity:.6;}
ul.shop li a::before{
display:block;
content:"";
position:absolute;
top:calc(50% - 7px);
left:3px;
width:14px;
height:14px;
background-image:url(https://img.konami.com/amusement/s/img/icon-locatest-map.svg);
background-repeat:no-repeat;
background-position:center;
background-size:100% auto;}
ul.shop li a::after{content:"MAP";}

@media screen and (min-width:641px){
ul.shop li:not(:nth-child(1)){padding-left:90px;}
ul.shop li:not(:nth-child(1))::before{position:absolute; width:70px; text-align:center; top:5px; left:5px;}}
@media screen and (max-width:640px){
ul.shop li:nth-child(1){font-size:16px; padding:5px 10px;}
ul.shop li:not(:nth-child(1))::before{font-weight:700;}}
@media screen and (max-width:480px){ul.shop{font-size:12px;}}

/*
================================================================================================================
SNS
================================================================================================================
*/
.sns{display:flex; width:calc(100% - 40px); max-width:480px; margin:0 auto; justify-content:center; align-items:center;}
.sns a{
display:flex;
position:relative;
width:calc(50% - 5px);
height:50px;
font-weight:700;
text-align:center;
border:1px solid #000;
border-radius:5px;
padding-left:50px;
margin:5px 0;
align-items:center;
transition:all .2s ease;}
.sns a:hover{color:#fff; background:#000;}

.sns a::before,
.sns a::after{display:block; position:absolute; content:""; transition:all .2s ease;}
.sns a::before{
top:10px;
left:10px;
width:30px;
height:30px;
background-repeat:no-repeat;
background-position:center;
background-size:100% auto;}
.sns a.x::before{background-image:url(https://img.konami.com/amusement/s/common/img/logo-x-blue.svg);}
.sns a.eam::before{background-image:url(https://img.konami.com/amusement/s/img/logo-eaapp.svg);}
.sns a:hover::before{filter:invert(100%) brightness(1.75);}
.sns a::after{
top:calc(50% - 7px);
right:20px;
width:14px;
height:14px;
border-top:2px solid;
border-right:2px solid;
transform:rotate(45deg);}
.sns a:hover::after{right:15px;}

@media screen and (min-width:641px){.sns a:nth-child(even){margin-left:10px;}}
@media screen and (max-width:640px){
.sns{flex-wrap:wrap;}
.sns a{width:100%;}}
@media screen and (max-width:480px){.sns{width:100%;}}


.center{
    text-align: center;
}

.attention{
    border: solid 1px;
    margin: 1em auto;
    color: #990014;
    padding:5px;
}


