@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;400;500;700;800&family=Yusei+Magic&display=swap');

/*
 font-family: "M PLUS Rounded 1c", sans-serif;
300-800


*/


/*--------------------------------------------------
reset
-----------------------------------------------------*/
html{scroll-behavior: smooth;}
body{width: 100%;letter-spacing: 0;text-align: left; }
body, p, dl, ol, ul, h1, h2, h3, h3, h4, h5, h6, form, table, td, dt, dd {margin: 0;padding: 0;}
img{border: none; vertical-align:middle;width:100%;height:auto;}
ol,ul{list-style-type: none;}
table {/*border-collapse: collapse;*/border-spacing: 0;}

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

.flex{display:flex; justify-content: space-between; align-items: center;}
.inner{width:80%;margin:0 auto;position: relative;}
.sfont{font-size:90%;}
.ssfont{font-size:90%;}

/* スクロールで　フェードイン表示 */
.fade{opacity:0;}
.fadein{opacity:1.0;}
.ts1{transition: 1.0s}

/* アスタリスク　注釈用 */
ul.ast {	list-style: none;font-size: 90%;margin: 0.5em 0;}
ul.ast li {	margin: 0 0 5px 0;	padding-left: 1em;	text-indent: -1em;}
ul.ast li:before {	content: "\203b";	color: #fff;}
ul.ast li.red:before {	content: "\203b";	color: #f00;}

.youtube {
    position: relative;
    padding-bottom: 56.25%; /* アスペクト比16:9の場合 */
    padding-top: 0;
    height: 0;
    overflow: hidden;
    margin-bottom: 0; /* YouTubeの下に余白をつける */
	margin-top:0;
	margin-left:auto;
	margin-right:auto;
	 background: #000;
}
.youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

a{transition: 0.2s;}
a:hover{opacity:0.5;}
a.deactive{pointer-events:none;opacity: 0.3}

.fb-share-button{position: relative;top:-2px;}

/*右下固定リンク　「先頭に戻る」他　*/
#jumpbtn { position:fixed; right:0; bottom:0;z-index:500;}
#jbtnbox a{display:block;padding:0.5em; background: #000;color:#fff;position:relative;text-decoration: none;}
#jbtnbox a:hover{ 
opacity:1;	
}
#content #jbtnbox a i{font-size:280%;position: relative;left:-3px;margin:0 5px 0 0;color:#eda4c2;}

#content img.protect {
  pointer-events: none;
  user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  -webkit-user-select:none;
  -khtml-user-select:none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -webkit-touch-callout: none; 
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
}




/*--------------------------------------------------
common
-----------------------------------------------------*/
body {color: #000;  background: #000;overflow-x: hidden;}

#sns{ background: #268300;padding:0.25em;}	
#sns .logo{flex-basis: 20%;}	
#sns .fb-share-button{margin:0 0 0 1em;}

.close {
	z-index: 1;
	inset: 0;
	pointer-events: none;
	transition: background-color .6s;
}
#drawer:checked ~ .close {
	pointer-events: auto;
/*	background-color: rgba(0,0,0,.3);*/
}

/*
.contents {
	transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
*/

/* :::::: toggle button :::::: */
#drawer {
	display: none;
}
label {
	cursor: pointer;
	position: fixed;
}
.open {
	z-index: 2;
	top: 8px;
	right: 8px;
	width: 80px;
	height: 80px;
	border-radius: 80px;
	background: #fff;
	transition: background .6s, transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.open::before,
.open::after {
	content: "";
}
.open span,
.open::before,
.open::after {
	content: "";
	position: absolute;
	top: calc(50% - 1px);
	left: 20%;
	width: 60%;
	border-bottom: 3px solid #036eb8;
	transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}



.open::before {
	transform: translateY(-12px);
}
.open::after {
	transform: translateY(12px);
}
.close {
	z-index: 1;
	inset: 0;
	pointer-events: none;
	transition: background .6s;
}
#drawer:checked + .open {
	background: #fff;
	transform: translateX(-280px);
}
#drawer:checked + .open span {
	transform: scaleX(0);
}
#drawer:checked + .open::before {
	transform: rotate(135deg) scaleX(1.2);
}
#drawer:checked + .open::after {
	transform: rotate(-135deg) scaleX(1.2);
}
#drawer:checked ~ .close {
	pointer-events: auto;
/*	background: rgba(0,0,0,.3);*/
}

.disp_menu{color:#036eb8;position: fixed;top:12px;right:27px;z-index:10;}
#drawer:checked + .open +.disp_menu{display:none;}




/* :::::: drawer menu :::::: */
.menu {
	z-index: 1;
	position: fixed;
	overflow: auto;
	top: 0;
	right: 0;
	width: 300px;
	height: 100%;
	margin: 0;
	padding: 10px;
	box-sizing: border-box;
	background: rgba(0,0,0,.8);
	transform: translateX(100%);
	transition: transform .6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.menu h2 {
	color: white;
	font-family: "Ubuntu Condensed", sans-serif;
	font-weight: 400;
	letter-spacing: .1em;
	text-align: center;
}
.menu ul {
	margin: 0;
	padding: 0;
}
.menu li {
	line-height: 1.4;
}
.menu li:not(:first-child) {
	border-top: 1px solid rgba(255,255,255,.6);
}
.menu a {
	display: block;
	padding: 1em 2em;
	color: white;
	text-decoration: inherit;
	transition: background .6s;
}
.menu a:hover {
	background: black;
}
#drawer:checked ~ .menu {
	transform: none;
}

.wrapper{max-width:950px;margin:auto; background: #192d79;}
header{margin:0 0 1em 0;}
header h1{margin:auto;;}
#header_menu{margin:0 0 3em 0;}
#header_menu li{margin:0 0 1em 0;}

#header_menu p.ended {color:#f4e82a;text-align: center;margin:0 0 1em 0;font-size:100%;font-weight:700;}

@media screen and (min-width: 500px) {
header{margin:0 0 2em 0;}    
#header_menu p.ended {font-size:155%;}
}


#mainwrap{}
#step{margin:0 0 3em 0;}
#step .item{margin:0 0 1em 0;}
#kaijyo{ background:#0d1229;padding:3em 0 1em 0;margin:0 0 3em 0;}



/*下層*/

/*prize.html*/
/* ------------------------------------------------------------------------------------------------------------------ */
#prize header{padding:3em 0 5em 0;}
#prize header .inner{width:60%;}
#prize header h1{margin:0 0 1em 0;}

#prize .postcard{width:77%;margin:auto;}

section.prizelist{width:90%;margin:0 auto 4em auto;position:relative; background: #fff;border-radius:1em;}

section.prizelist h2{
position: absolute;
top:-44px;
left:0;
right:0;
margin:auto;
  
width:50%;height:88px;    
    
}



section.prizelist .item_wrap{padding:10% 3% 2% 3%; display:flex; align-items: flex-start;justify-content: center;flex-flow:row wrap;}  
section.prizelist .item_wrap .item{flex-basis:49%;margin:0 0.5% 2em 0.5% ;font-family: "M PLUS Rounded 1c", sans-serif;color:#1c2a82;text-align: center;}
section.prizelist .item_wrap .item .store_name{border-top:1px solid #1c2a82;border-bottom:1px solid #1c2a82;padding:0.25em;font-weight:700;font-size:122%;margin:0 0 0.5em 0;}
section.prizelist .item_wrap .item .shotengai{margin:0 0 0.5em 0;}
section.prizelist .item_wrap .item .thumb{margin:0 0 0.5em 0;}
section.prizelist .item_wrap .item .item_name{color:#000;font-size:100%;}



@media screen and (max-width: 767.9px) {
    
#prize header{padding:2em 0 1em 0;}
#prize header .inner{width:80%;}
#prize header h1{margin:0 10% 1em 10%;}

section.prizelist{width:90%;margin:0 auto 4em auto;position:relative; background: #fff;border-radius:1em;}

section.prizelist h2{
position: absolute;
top:-44px;
left:0;
right:0;
margin:auto;
    
width:70%;height:88px;    
background:url("../images/prize_tt_bg.png") center center no-repeat;
background-size: contain;
display: flex;
align-items: center;
justify-content: center;
font-size:133%;
font-weight:400;;
font-family: "Yusei Magic", sans-serif;
    
}

section.prizelist .item_wrap{padding:10% 3% 2% 3%; display:flex; align-items: flex-start;justify-content: center;flex-flow:row wrap;}  
section.prizelist .item_wrap .item{flex-basis:100%;margin:0 0 2em 0 ;font-family: "M PLUS Rounded 1c", sans-serif;color:#1c2a82;text-align: center;}
section.prizelist .item_wrap .item .store_name{border-top:1px solid #1c2a82;border-bottom:1px solid #1c2a82;padding:0.25em;font-weight:700;font-size:122%;margin:0 0 0.5em 0;}
section.prizelist .item_wrap .item .shotengai{margin:0 0 0.5em 0;}
section.prizelist .item_wrap .item .thumb{margin:0 0 0.5em 0;}
section.prizelist .item_wrap .item .item_name{color:#000;font-size:100%;}   
    

}
@media screen and (max-width: 500px) {
 #prize header h1{width:70%;margin:0 0 1em 0;}   
}



/*store.html*/
/* ------------------------------------------------------------------------------------------------------------------ */
#store{}
#store header{padding:2em 0 0.5em 0;}
#store header .inner{}
#store header h1{width:40%; margin:0 auto 1em auto;}

section.store_index {color:#fff;}
section.store_index .inner{width:90%;margin:0 auto 1em auto;}
section.store_index ul{flex-flow: row wrap;align-items: flex-start}
section.store_index ul li{flex-basis:31%; margin:0 0 0.75em 0;font-size:90%;}
section.store_index a{display: block;color:#f7f5c9;text-decoration: none;background: #081b61;padding:0.5em 0.5em;border-radius:2em;text-align: center;}
section.store_index p{margin:1em 0 2em 0;}


section.storelist{width:90%;margin:0 auto 4em auto;position:relative; background: #fff;border-radius:1em;}
section.storelist .item_wrap{padding:2% 3% 2% 3%; display:flex; align-items: flex-start;justify-content: space-between;flex-flow:row wrap;}  
section.storelist .item_wrap .item{flex-basis:32%;margin:0 0.5% 1em 0.5% ;font-family: "M PLUS Rounded 1c", sans-serif;}
section.storelist .item_wrap .item h2{font-weight:700;color:#fff;font-size:97%;padding:0.25em;text-align: center;margin:0 0 0.75em 0;}
section.storelist .item_wrap .item:nth-child(odd) h2{ background: #1b2b83;}
section.storelist .item_wrap .item:nth-child(even) h2{background: #861d7f;}
section.storelist .item_wrap .item ul {	list-style: none;font-size: 90%;margin: 0.5em 0;font-weight:500;}
section.storelist .item_wrap .item ul li {	margin: 0 ;	padding-left: 1em;	text-indent: -1em;}
section.storelist .item_wrap .item ul li:before {	content: "\25CF";	}
section.storelist .item_wrap .item:nth-child(odd) ul li:before {color:#7469a9;}
section.storelist .item_wrap .item:nth-child(even) ul li:before {color:#b68ba9;}


section.storelist .item_wrap .item.w100{flex-basis:100%;margin:0 0 1em 0 ;}
section.storelist .item_wrap .item.w100 ul{display: flex;flex-flow:row wrap; justify-content: space-between}
section.storelist .item_wrap .item.w100 ul li{flex-basis:31%;}






@media screen and (max-width: 767.9px) {
#store header{padding:2em 0 0 0;}
#store header h1{width:55%; margin:0 0 1em 0;}   
    
section.storelist .item_wrap{padding:4% 3% 2% 3%; }  
section.storelist .item_wrap .item{flex-basis:100%;}
section.storelist .item_wrap .item h2{font-size:105%;}

    
  
section.store_index .inner{width:90%;margin:0 auto 1em auto;}
section.store_index ul{flex-flow: row wrap;align-items:stretch;}
section.store_index ul li{flex-basis:49%; margin:0 0 0.75em 0;font-size:90%;}
section.store_index a{color:#f7f5c9;text-decoration: none; }
    
    
 section.storelist .item_wrap .item.w100{flex-basis:100%;margin:0 0 1em 0 ;}
section.storelist .item_wrap .item.w100 ul{display: block}
section.storelist .item_wrap .item.w100 ul li{}   
    
}


/* フッター */
footer{margin:0;padding:0 0 3em 0;}





 /* //////////////////////////////////////////////////*/
@media screen and (min-width: 48.1em) {
 /* //////////////////////////////////////////////////*/

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


/* //////////////////////////////////////////////////*/
} /* //////////////////////////////////////////////////*/
/* //////////////////////////////////////////////////*/



@media print {
.fade{opacity:1;}
.fadein{opacity:1.0;}	
    #content #jumpbtn {display:none; }  
}



