@charset "utf-8";
/* CSS Document */

/*html {
  scroll-behavior: smooth;
}*/
#container{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 400;
    width: 100%;
    margin: 0;
	font-size: 16px;
	color: #fff;
	line-height: 1.5;
	background: #000;
}

* { box-sizing: border-box; }
#container a{
	text-decoration: none;
	color: #fff;
}
#container a:hover{
/*	color: #333;*/
/*	opacity: .6;*/
}

.w1000{
	width: 1200px;
	max-width: 1200px;	
	margin: 0 auto;
}

.pc{display: block;}
.sp{display: none;}

ul {
  list-style: none;
}

/*-- 画像位置 --*/
#container img {
    margin: 0;
    padding: 0;
    vertical-align: bottom;
	max-width: 100%;
	width: 100%;
}
/*-- flex --*/
.flex_box {
  	display:-webkit-box;
  	display:-ms-flexbox;
  	display:flex;
}
/*-- font --*/
.s-font{font-size: 0.9em;}
.cursive{font-family: 'Dancing Script', cursive;	color: #fbdb90;}
.hina{font-family: 'Hina Mincho', serif;}
.min{font-family: 'Noto Serif JP', serif;}
.gothic{	font-family: 'Noto Sans JP', sans-serif;}
.game{font-family: 'Kiwi Maru', serif;}


.noto-sans-jp{
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}
.oswald {
  font-family: "Oswald", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}
.bungee-regular {
  font-family: "Bungee", sans-serif;
  font-weight: 400;
  font-style: normal;
}

/*--------------------page-top */
#page-top{
    position: fixed;
    z-index: 100;
    right: 20px;
    bottom: 20px;
}
#page-top a{
	font-size: 4vw;
    color:  rgba(249,255,0,0.50);
	text-decoration: none;
}
#page-top a:hover{
    color:  rgba(255,247,0,1.00);
}
/*<!--#page-top:hover{
	transform: rotate(315deg); 
    transition: .5s; 
}-->*/
/*--------------------パンくず */
#pankuzu{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 600;
	margin: 15px auto;
	width: 1000px;
	font-size: .85em;
}

#pankuzu ul{
    padding: 0 0 5px;
    _zoom: 1;
}
#pankuzu li{
    float: left;
    list-style: none;
}
#pankuzu li + li:before{
    margin: 0 8px;
    content: '>';
}


/*------------------------------クレジット*/
.photo{position: relative;}
.cre{
	color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	text-align: right;
	font-size: .8em;
	line-height: 1;
	position: absolute;
	right: 2px;
	bottom: 2px;
	text-shadow:
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000,		
       2px  0px 1px #000000,
       0px  2px 1px #000000,
      -2px  0px 1px #000000,
       0px -2px 1px #000000; 	
}
/*------------------------------marker*/
.marker{
background:linear-gradient(transparent 65%, rgba(255,247,153,0.25) 65%);
font-weight:500; 
}
h2{
	font-weight: 900;
	font-size: min( 8vw, 2.3em );
	position: relative;
	line-height: 1.3;
}
h2 small{ display: block; font-size: 0.7em;}

.gold{
	background: linear-gradient(0deg, rgba(210,182,47,1) 0%, rgba(230,232,174,1) 12%, rgba(184,166,15,1) 49%, rgba(255,249,220,1) 96%);
	background: -webkit-linear-gradient(90deg, rgba(210,182,47,1) 0%, rgba(230,232,174,1) 12%, rgba(184,166,15,1) 49%, rgba(255,249,220,1) 96%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

/*--------------------------------------------------- twitter */
.twitter{
	text-align: right;
	margin: -2.5em 10% 0 0;
/*	position:absolute;
	right: 10%;
	top:-2.5em;*/
}
/*------------------------------top*/
#top p{
	color: #fff003;
	font-weight: 700;
	font-size: min( 3vw, 1.3em );
	padding: .5em 0;
}
#top dl{
	background: #fff003;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: .8em 0;
	font-weight: 700;
}
#top dl dt{
	font-size: min( 3vw, 1.4em );
	width: 8em;
	text-align: center;
	padding: 2px .5em;
	background: #3e0a8c;
	color: #fff003;
	margin-right: 1em;
}
#top dl dd{	
	color: #3e0a8c;
	font-size: min( 3.5vw, 1.6em );
	line-height: 1;
	font-weight: 900;
}
#top dl dd strong{	font-size: 1.2em;}	
#top dl dd small{	font-size: 0.6em;}	

/*------------------------------nav*/
nav{
    background: url("../img/bg_FG2.jpg") no-repeat center bottom/ cover;
	padding: 1em 0;
}
nav .w1000{
	padding-bottom: min( 40vw, 500px );
	background: 
		url("../img/mini_ken.png") no-repeat left bottom/ 30%,
		url("../img/mini_chunli.png") no-repeat center bottom 8vw/ 30%,
		url("../img/mini_ryu.png") no-repeat right bottom/ 30%;
	
}
nav h2{
	text-align: center;
		background: 
		url("../img/mini_juri.png") no-repeat left -3% center/ 30%,
		url("../img/mini_luke.png") no-repeat right center/ 30%;
	padding: 8vw 25% 8vw 20%;
}
nav ul{
	display: flex;
}
nav ul li {
	flex: 1;
	margin: 2em .5em .5em;
}
nav ul li a{
	display: block;
	text-align: center;
	border: 4px #FFFFFF solid;
	padding: 2em 1em;
	position: relative;
	font-weight: 700;
	font-size: min( 1.65vw, 1.3em );
	background: rgba(5,0,0,0.70);
	box-shadow: 0 0 .2rem #fff,
            0 0 .2rem #fff,
            0 0 0.2rem #bc13fe,
            0 0 0.8rem #bc13fe,
            0 0 0.2rem #bc13fe,
            inset 0 0 1.3rem #bc13fe; 
	transition: all 0.5s ease;
}
nav ul li a:hover{
	background: rgba(255,255,255,0.15);
	cursor: pointer;
}
nav ul li span.no{
	position: absolute;
	top:-3em;
	left: 0;
	width: 5em;
}
nav ul li span.day{
	position: absolute;
	top:42%;
	left: 1vw;
	width: 3em;
}
nav ul li small{
	font-size: 0.7em;
}
nav ul li .red{
	font-family: "Oswald", sans-serif;
	color: #dc3a57;
	display: block;
	font-size: 1.2em;
}
nav ul li .s-font{display: block;}	

/*------------------------------event_wrap*/

h3{
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	display: inline-block;
	padding: 0 3em 0 1em;
	font-size: min( 5vw, 2.7em );
	border-bottom: #FFFFFF solid 5px;
	line-height: 0.8;
}
.btn{text-align: center; margin-top: 3vw;}
.btn a{
	border: 1px #FFFFFF solid;
	padding: 1em 3em;
	display: inline-block;
	font-weight: 700;
	font-size: min( 3.5vw, 1.2em );
	background: rgba(5,0,0,0.70);
	box-shadow: 0 0 .2rem #fff,
            0 0 .2rem #fff,
            0 0 0.2rem #E0FF82,
            0 0 0.3rem #E0FF82,
            0 0 0.2rem #E0FF82,
            inset 0 0 0.8rem #E0FF82; 
	transition: all 1s ease;
}
.btn a:hover{
	background: rgba(255,255,255,0.20);
	cursor: pointer;
}
.host{
	text-align: center;
	margin-top: 1.5em;
}
.date,.price{
	font-size: 1.2em;
	font-weight: 600;
}
.event_wrap {padding: 7em 0 2em;}

.event_wrap .center{text-align: center;}
.event_wrap h2{
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center; 
	margin: 2em auto 1.5em;
	position: relative;
	text-align: center;
	padding-left:3.5em;
}
.event_wrap h2::before{
	content: '';/*何も入れない*/
	position: absolute;
	left:-1em;
	display:block;
	width: 5em;/*画像の幅*/
	height: 5em;/*画像の高さ*/
	background: url(../img/no1.png) no-repeat center top/ contain;
	vertical-align: middle;
}
.event_wrap h2 span.no{
	position: absolute;
	top:0;
	left: 0;
	width: 5em;
}
.event_wrap h2 span.e-logo{
	max-width: 16em;
	margin: auto;
	display: block;
}
.event_wrap h2 .red{
	font-family: "Oswald", sans-serif;
	color: #dc3a57;
	display: block;
	font-size: 1.2em;
}
.event_wrap .center + p{
	color: #F3FF02;
	font-weight: 700;
	font-size: 1.2em;
	margin: .5em auto 2em;
} 
.detail{display: flex;}
.detail dt{
	padding: 2px .5em;
	display: inline-block;
	border: 2px #fff solid;
		font-weight: 600;
}
.detail dd{
	margin-bottom: 1em;
	padding: .5em 1em;
}
.detail dd a{ 
	color: yellow!important;
	text-decoration: underline!important;
}
.present{
	background: rgba(255,255,255,0.77);
	padding: 1em;
	margin: 3em auto;
}
.present h4{
	display: inline-block;
	padding: 2px 0.5em;
	background: #086f7b;
	font-size: min( 2vw, 1.3em );
}
.present p{
	color: #086f7b;
}
.present h5{
	display: inline-block;
	padding: 2px 0.5em;
	background: #FFFFFF;
	color: #00464F;
	margin-top: .7em;
}
.present a{
	font-size: 0.9em;
	font-weight: 600;
	color: #00464F!important;
	text-decoration: underline!important;
}
a:hover{opacity: 0.7;}


/*------------------------------stamp*/
#stamp{	background: url("../img/bg_WT.jpg") no-repeat center top/ cover;}
#stamp.event_wrap .center + p{	max-width: 42em;}
#stamp .detail p{flex:1;}
#stamp .detail dl{
	margin-right: 1em;
	flex: 1.7;
}
/*------------------------------pass*/
#pass{	background: url("../img/bg_BH.jpg") no-repeat center top/ cover;}
#pass.event_wrap h2::before{  background: url(../img/no2.png) no-repeat center top/ contain;}
#pass h2 span.day{
	position: absolute;
	top:50%;
	left: 2.8em;
	width: 2.8em;
}
#pass .detail .image{flex:1;}
#pass .detail dl{
	margin-right: 1em;
	flex: 1.7;
}
/*------------------------------goods*/
#goods{	background: url("../img/bg_FG2.jpg") no-repeat center top/ cover;}
#goods.event_wrap h2::before{  background: url(../img/no3.png) no-repeat center top/ contain;}
.comingsoon{
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	text-align: center;
	font-size: min( 8vw, 4em );
	padding: .8em 0 3em;
	vertical-align: middle;	
	height: 1em;
 } 
/*------------------------------about*/
#about{ padding: 5em 0 2em;}
#about h2{
	width: min( 60vw, 16em);
	margin: auto;
}
#about .paint{
	background: url("../img/about.png") no-repeat left center/ contain;
	padding :3.5em 0 2.5em;	
}
#about p{	font-size: 1.2em;}
#about p strong{ font-size: 1.5em;}
#about .host{margin-top: 10vw;}

/*------------------------------contact*/
#contact{ 
	padding: 5em 0;
	background: #4040ff;
}
#contact .flex_box{ justify-content: center; }
#contact dl{
	display: inline-block;
	margin-right: 2em; 
}
#contact ul{
	display: inline-block; 
}


/*スクロールしたら表示させる*/
.sa {
  opacity: 0;
  transition: all 1.5s ease;
}
 .sa.show {
  opacity: 1;
  transform: none;
}
 
.sa-lr {  transform: translate(-100px, 0);}
.sa-rl {  transform: translate(100px, 0);}
.sa-up {  transform: translate(0, 100px);}
.sa-down {  transform: translate(0, -100px);}
.sa-scaleUp {  transform: scale(.5);}
.sa-scaleDown {  transform: scale(1.5);}
.sa-rotateL {  transform: rotate(180deg);}
.sa-rotateR {  transform: rotate(-180deg);}

/*------------------------------終了スタンプ*/
.end_stamp{
	position: relative;
}
.end_stamp::before{
	content: "終了";
	position: absolute;
	top:-.3em;
	left: -.3em;
	font-size: 3em;
	font-weight: 600;
	font-family: 'Kiwi Maru', serif;
	color: #A6090B;
	border: 7px #A6090B double;
	background: rgba(255,255,255,0.55);
	padding: .7em .5em;
	border-radius: 50%;
	transform: rotate(-15deg);
}


/************************************************************
					★min770px－max1200px
************************************************************/
@media screen /*and (min-width: 770px) */and (max-width: 1199px){

#container, .w1000 {
	min-width: 100%;  
	width: 100%;
	margin: 0;
	overflow: hidden;
}
.w1000,#top p {	padding-right: 2%; padding-left: 2%;}

/*---------------------------------------------コンテナ用★★★★★★★★-----*/

	
}




/************************************************************
					★タブレット対応
************************************************************/
@media screen /*and (min-width:600px) */and (max-width:769px)  {

/* 非表示指定 */
.pc{display: none;}
.sp{display: block;}	
.tb_none{display: none;}	
#pankuzu{ display: none;}
	#container{font-size: 0.95em;}	
/*--------------------------------------------------- twitter */
.twitter{
	text-align: left;
	margin:0 0 0 1em;
}
.twitter p{
	background: #fff;	
	padding: 5px 5px 0;
}
/*---------------------------------------------コンテナ用★★★★★★★★-----*/
	
/*------------------------------nav*/
nav h2{
	background: 
		url("../img/mini_juri.png") no-repeat left -3% bottom/ 30%,
		url("../img/mini_luke.png") no-repeat right bottom/ 30%;
	padding: 5vw 25% 11vw 20%;
}
nav ul{	display: block;}
nav ul li {	line-height: 1.2;}
nav ul li a{
	padding: .5em 1em;
	font-size:3vw;
}
nav ul li span.no{
	top:-2em;
	left: -1em;
	width: 5em;
}
nav ul li span.day{
	position: absolute;
	top:3%;
	left: 3em;
	width: 2.5em;
}

nav ul li .red{	display: inline;}
nav ul li .s-font{display: inline;}	
nav ul li strong br{display: none;}	
/*------------------------------event_wrap*/
.event_wrap .detail{font-size: 1.1em;}
	#pass .detail .date{display: block;}
	
}


/************************************************************
						★スマホ対応
************************************************************/
@media screen and (max-width:599px)  {
/*--- 非表示 ---*/
/*br{display: none}*/
/*img{max-width:100%;}*/
.sp_none{display: none;}
.pc{display: none;}
.sp{display: block;}
.sp_only{display: block;}
/*---------------------------------------------コンテナ用★★★★★★★★-----*/
h2{	font-size: 5vw;}
h2 small{ font-size: 0.65em;}


/*------------------------------event_wrap*/
/*
h3{
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	display: inline-block;
	padding: 0 3em 0 1em;
	font-size: min( 5vw, 2.7em );
	border-bottom: #FFFFFF solid 5px;
	line-height: 0.8;
}
.5vw, 1.2em );
	background: rgba(5,0,0,0.70);
	box-shadow: 0 0 .2rem #fff,
            0 0 .2rem #fff,
            0 0 0.2rem #E0FF82,
            0 0 0.3rem #E0FF82,
            0 0 0.2rem #E0FF82,
            inset 0 0 0.8rem #E0FF82; 
	transition: all 1s ease;
}
.btn a:hover{
	background: rgba(255,255,255,0.20);
	cursor: pointer;
}
.host{
	text-align: center;
	margin-top: 1.5em;
}
.date,.price{
	font-size: 1.2em;
	font-weight: 600;
}
*/
.event_wrap {padding: 3em 0 2em;}	
.event_wrap h2{
	margin: 2em auto 1.5em;
	position: relative;
	text-align: center;
	max-width: 95%;
	padding-left:3em;
}
.event_wrap h2::before{
	content: '';/*何も入れない*/
	position: absolute;
	top:-1em;;
	left:-1.5em;
	display:block;
	width: 4.5em;/*画像の幅*/
	height: 4.5em;/*画像の高さ*/
	background: url(../img/no1.png) no-repeat center top/ contain;
	vertical-align: middle;
}
/*	
.event_wrap h2 span.no{
	position: absolute;
	top:0;
	left: 0;
	width: 5em;
}
.event_wrap h2 span.e-logo{
	max-width: 16em;
	margin: auto;
	display: block;
}
.event_wrap h2 .red{
	font-family: "Oswald", sans-serif;
	color: #dc3a57;
	display: block;
	font-size: 1.2em;
}*/
.event_wrap .center + p{	font-size: 1.1em;} 
	
.detail{display: block; font-size: 0.9em;}
/*.detail dt{
	padding: 2px .5em;
	display: inline-block;
	border: 2px #fff solid;
		font-weight: 600;
}*/
/*.detail dd{	padding: .5em;}
	
.detail dd a{ 
	color: yellow!important;
	text-decoration: underline!important;
}
.present{
	background: rgba(255,255,255,0.77);
	padding: 1em;
	margin: 3em auto;
}
.present h4{
	display: inline-block;
	padding: 2px 0.5em;
	background: #086f7b;
	font-size: min( 2vw, 1.3em );
}
.present p{
	color: #086f7b;
}
.present h5{
	display: inline-block;
	padding: 2px 0.5em;
	background: #FFFFFF;
	color: #00464F;
	margin-top: .7em;
}
.present a{
	font-size: 0.9em;
	font-weight: 600;
	color: #00464F!important;
	text-decoration: underline!important;
}
a:hover{opacity: 0.7;}*/
	
/*------------------------------stamp*/
#stamp.event_wrap .center + p{	max-width: 100%;}
#stamp .detail dl{	margin-right:0;}	
/*------------------------------pass*/
#pass h2 span.day{
	position: absolute;
	top:50%;
	left: 1.3em;
	width: 2.8em;
}
#pass .detail dl{	margin-right: 0;}
/*------------------------------goods*/

/*------------------------------about*/
#about{ padding: 3em 0 2em;}
#about p{	font-size: 1em; margin-bottom: 1em;}


/*------------------------------contact*/
#contact{ 
	padding: 5em 0;
	background: #4040ff;
}
#contact .flex_box{ display: block; }
#contact dl{
	margin-right: 0; 
	margin-bottom: 1em;
}
#contact ul{
	font-size: 1.2em;
}	
	
}