@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@600&display=swap');


ul, li {
	list-style: none;
}

a:link{
	color:#8F7003;
	text-decoration:none;
}

a:visited{
	color:#435766;
	text-decoration:none;
}

a:hover{
	color:#ff6600;
	text-decoration:none;
}

.hidden{
	display:none;
	font-size:0px;
	text-indent:-9999px;
}

.object-fitImg{
	width:100%;
	height:100%;
	object-fit: cover;
	font-family: 'object-fit: cover;'
}

.fadeIn {
  opacity: 0;
  transition: 2s;
}
.fadeIn.is-show {
  opacity: 1;
}

#contents .clear{
	clear:both;
}

@media screen and (min-width:641px )
{

/*ƒgƒbƒv*/
.pc { display: block !important; }
.sp { display: none !important; }
	
	body{
		background-color: #222222;
		background-image: url("../img/bg.jpg");
		background-repeat: no-repeat;
		background-size:cover;
		padding-top: 53.125%;
		background-attachment: fixed;
		background-position: top center;
	   /* color:#eaff00;*/
		color:#fff;
		letter-spacing:	2px;
		font-family: 'Noto Sans JP', sans-serif,ŸΰƒSƒVƒbƒN‘Μ, 'Yu Gothic', YuGothic, 'ƒqƒ‰ƒMƒmŠpƒS Pro','Hiragino Kaku Gothic ProN', 'ƒƒCƒŠƒI', Meiryo, '‚l‚r ƒSƒVƒbƒN',fMS PGothicf, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
		text-align:	center;
		-webkit-text-size-adjust: 100%;
		display: flex;
		flex-flow: column;
		min-height: 100vh;
	}

	#snsbanner{
		display: inline-block;
		margin: 2em auto 1em auto;
		/*padding:0.25em 0.5em;*/
		text-align: center;
		padding:0;
		/*background: #444;
		border-radius: 5em;*/
	}
	#gigyaShare {
		vertical-align: top;
		text-align: center;
		margin-left:-2.5em; 
	}
	
    header{
        width:100%;
        padding:0;
        margin:0 auto;
		position: relative;
		text-align: center;
 		padding-top: 62.962%;
		position: relative;
 	}
 	header #header_inner{
		width:90%;
		height:auto;
		margin: 0 5%;
		text-align: center;
		position: absolute;
		top:0;
	}
	header h3{
        color:#a58c38;
        font-family: din-2014, sans-serif;
        font-style: normal;
        font-weight:600;
        font-size:min(3vw,36px);
        letter-spacing: 0.1em;
		margin: 1em auto 0 auto;
		text-align: center;
    }
	header .mainImage{
		width:100%;
		height:0;
		margin:-5vw auto 0 auto;
		background-image: url("../img/title.png");
		background-repeat: no-repeat;
		background-size:contain;
		padding-top: 62.962%;
		background-position: top center;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	header p{
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}

	@media screen and (min-width:1081px )
	{
		header{
			padding-top: 680px;
		}
		header #header_inner{
			width:100%;
			height:auto;
			margin: 0 auto;
			text-align: center;
		}
		header .mainImage{
			width:972px;
			padding-top: 612px;
			margin:-60px auto 0 auto;
		}
	}
	
	#contents{
		width:100%;
		padding:0;
		margin:2em auto 0 auto;
	}
	
	#contents h3{
        color:#a58c38;
        font-family: din-2014, sans-serif;
        font-style: normal;
        font-weight:600;
        font-size:min(4.5vw,42px);
        letter-spacing: 0.1em;
		margin: 0 auto;
		padding:0;
		text-align: center;
	}

	#contents #program{
		width: 100%;
		max-width: 1080px;
		margin: 0 auto;
		padding:0;
		position: relative;
	}
	#contents #program .read{
		color:#bbb;
        font-style: normal;
        font-weight:400;
        font-size:min(2vw,24px);
        letter-spacing: 0.05em;
		line-height: 2em;
		margin: 1.5em auto 0 auto;
		padding:0;
		text-align: center
	}
	#contents #program .read p{
		margin-top: 1em;
		padding:0;
	}
    #contents #program .logo{
        margin:30px auto;
        padding: 0;
        text-align: center;
    }

	#contents #program .logo .size{
		width:25%;
    }
	
	#contents #message{
		width: 100%;
		max-width: 1080px;
		margin: 10em auto 0 auto;
		padding:0;
		position: relative;
	}
    #contents #message .container{
        display: table;
        width: 95%;
        padding-bottom:20px;
        margin:2em auto 0 auto;
    }
   #contents #message .copy{
        font-size:min(3vw,28px);
        line-height:min(4.5vw,42px);
        font-weight:bold;
        text-align: left;
        color:#fff;
    }
    #contents #message .read{
        height:auto;
        margin:0;
        font-size:min(1.75vw,21px);
        line-height:min(3.5vw,36px);
		color:#bbb;
    }
    #contents #message .wrap_msg{
        display: table-cell;
    }
    #contents #message .lBox{
        width:70%;
        height:auto;
        margin:0;
        font-size:min(1.5vw,18px);
        line-height:min(2.5vw,24px);
        vertical-align: top;
    }
    #contents #message .notice{
        font-size:min(1.25vw,14px);
        color:#a9a9a9;
		margin-bottom: 2em;
    }
	#contents #message .notice .em{
		border-bottom: #a58c38 dashed 0.1rem;
	}
    #contents #message .rBox{
        width:100%;
        height:auto;
        margin:0;
		text-align: center;
        vertical-align: bottom;
    }
    #contents #message .present{
        width:64%;
        height:auto;
        margin:2em auto 0 auto;
		padding-top:121.6%;
		background-image:url("../img/present_pic.png");
		background-repeat: no-repeat;
		background-size: contain;
        background-position: top center;
    } 
	#contents #message .btnWrap{
        width:90%;
		padding:0.75em 0 0.75em 0;
		margin: 0;
		text-align: center;
		background-color: #a58c38;
   }
   #contents #message .btn_text a:link{
        color:#fff;
        font-family: din-2014, sans-serif;
        font-style: normal;
        font-weight:600;
        font-size:min(2vw,24px);
        letter-spacing: 0.1em;
        padding:0;
        text-decoration: none;
        transition-property: opacity;
        -webkit-transition-property: opacity;
        transition-duration: 0.5s;
        -webkit-transition-duration: 0.5s;
    }
   #contents #message .btn_text a:hover{
        color:#887B51;
        font-family: din-2014, sans-serif;
        font-style: normal;
        font-weight:600;
        font-size:min(2vw,24px);
        letter-spacing: 0.1em;
    }
   #contents #message .btn_text a:visited{
        color:#fff;
    }

	#contents #guest{
		width: 100%;
		max-width: 1080px;
		margin: 10em auto 0 auto;
		padding:0;
		position: relative;
	}
   #contents #guest .copy{
        font-size:min(3vw,28px);
        line-height:min(4.5vw,42px);
        font-weight:bold;
        text-align: center;
        color:#fff;
    }
    #contents #guest .read{
        height:auto;
        margin:0;
        font-size:min(1.75vw,21px);
        line-height:min(3.5vw,36px);
		color:#bbb;
		text-align: center;
    }
	#contents #guest ul{
		width:90%;
		max-width: 1440px;
		display: flex;
		justify-content:center;
		align-items: top;
		flex-wrap: wrap;
		margin:1em auto;
		padding:0;
	}
	#contents #guest ul li{
		display:block;
		width:28%;
		margin:0 4% 1% 4%;
		padding:0;
	}
	#contents #guest .img1{
		width:100%;
		background:url("../img/guest1.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .img2{
		width:100%;
		background:url("../img/guest2.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .img3{
		width:100%;
		background:url("../img/guest3.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .img4{
		width:100%;
		background:url("../img/guest4.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .name{
        color:#fff;
        font-family: din-2014, sans-serif;
        font-style: normal;
        font-weight:400;
        font-size:min(1.6vw,21px);
		text-shadow: 2px 2px 10px #000, -2px 2px 10px #000, 2px -2px 10px #000, -2px -2px 10px #000;
		margin: 0.5em auto 0 auto;
		padding:0;
		text-align: center;
	}
	#contents #guest .name .small{
        font-weight:100;
        font-size:min(1.3vw,14px);
	}
    
    footer{
        height:auto;
        margin:2vw auto 0 auto;
        padding:1vw 00;
        width:100vw;
		text-align: center;
		background: #a58c38;
    }
	footer .jSns{
        width:100%;
        margin:0px auto 5px auto;
        padding:0;
        text-align: center;
    }
	footer .jLogo{
        width:100%;
        margin:0px auto 5px 0;
        padding:0;
        text-align: center;
    }
    footer .logo_jwave {
        width: 240px;
        margin: 20px 0 5px 20px;
    }
    footer .copyright{
        width:100%;
        font-family: Arial, "ŸΰƒSƒVƒbƒN", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
        font-size:12px;
        color:#fff;
        text-align:center;
        padding:5px auto 0 auto;
    }

}

/* ƒXƒ}[ƒgƒtƒHƒ“—p */

@media screen and (max-width:640px )
{
	.pc { display: none !important; }
	.sp { display: block !important; }

	body {
	  margin: 0;
	  min-height: 100vh;
	  position: relative;
	  color: #fff;
	  font-family: 'Noto Sans JP', sans-serif;
	}
	body::before {
	  content: "";
	  position: fixed;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background: url("../img/bg_sp.jpg") no-repeat center top;
	  background-size: cover;
	  z-index: -1;
	}

	#snsbanner{
		display: inline-block;
		margin: 4vw auto 3vw auto;
		text-align: center;
		padding:0;
		/*background: #444;
		border-radius: 8vw;*/
	}
	#gigyaShare {
		vertical-align: top;
		text-align: center;
		margin-left:-2.5em; 
	}
	header{
        width:100%;
		height:100vh;
		max-height:1160px; 
        padding:0;
        margin:0 auto;
		position: relative;
		text-align: center;
    }
	header #header_inner{
		width:100%;
		height:auto;
		margin: 0;
		text-align: center;
		position: absolute;
		top:0;
	}
	header h3{
        color:#a58c38;
        font-family: din-2014, sans-serif;
		font-style: normal;
        font-weight:600;
        font-size:5vw;
        letter-spacing: 0.1em;
		margin: 2em auto 0 auto;
		text-align: center;
    } 
	header .mainImage{
		width:100%;
		height:0;
		margin:2em auto 0 auto;
		padding-top: 181.25%;
		background-image:url(../img/title_sp.png);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center center;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	header p{
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	@media screen and (max-height:800px)
	{
		header .mainImage{
			width:100%;
			height:0;
			margin:0 auto ;
			padding-top: 159.375%;
			background-image:url(../img/title_sp2.png);
			background-repeat: no-repeat;
			background-size: contain;
			background-position: center center;
			text-indent: 100%;
			white-space: nowrap;
			overflow: hidden;
		}
	}
	
 	#contents{
		width:100%;
		margin:0 auto;
		padding:0;
		position: relative;
	}
	#contents h3{
        color:#a58c38;
        font-family: din-2014, sans-serif;
        font-weight:600;
        font-size:6vw;
        letter-spacing: 0.1em;
		margin: 0 auto;
		padding:0;
		text-align: center;
	}

	#contents #program{
		width: 100%;
		margin: 0 auto;
		padding:0;
		position: relative;
	}
	@media screen and (max-height:800px)
	{
		#contents #program{
			margin: 3em auto 0 auto;
		}
	}
	#contents #program .read{
		color:#ccc;
        font-style: normal;
        font-weight:400;
        font-size:3.5vw;
		line-height: 2.25em;
		margin: 2em auto 0 auto;
		padding:0;
		text-align: center
	}
	#contents #program .read p{
		margin-top: 2em;
	}
	#contents #program .logo{
        margin:30px auto;
        padding: 0;
        text-align: center;
    }
    #contents #program .logo .size{
       width:60%;
    }

	#contents #message{
        min-width:300px;
        height:auto;
        margin:5em auto 0 auto;
        padding:0;
    }
    #contents #message .title{
        width:100%;
		max-width: 1080px;
        height:auto;
        margin:0 auto;
        padding:5vw 0;
		border-top:1px solid #a9a9a9;
		border-bottom:1px solid #a9a9a9;
    }
   #contents #message .copy{
        font-size:4vw;
        line-height: 6.5vw;
        font-weight:bold;
        text-align: center;
        color:#fff;
        margin-top: 1em;
    }
    #contents #message .read{
        height:auto;
        margin:2.5vw 0 0 0;
        font-size:3.3vw;
        line-height:6vw;
		color:#bbb;
		text-align: center;
    }
    #contents #message .notice{
        font-size:2.25vw;
        color:#bbb;
        text-align: center;
		line-height: 4vw;
    }
\	#contents #message .notice .em{
		border-bottom: #a58c38 dashed 0.075rem;
	}
    #contents #message .wrap_msg{
		text-align: center;
    }
    #contents #message .present{
        width:25%;
        height:auto;
        margin:1.5vw auto 3vw auto;
		padding-top:47.765%;
		background-image:url("../img/present_pic.png");
		background-repeat: no-repeat;
		background-size: contain;
        background-position: top center;
		transform: rotate(10deg);
    }
	#contents #message .btnWrap{
        width:90%;
		padding:3vw 0;
		margin: 4vw auto 0 auto;
		text-align: center;
		background-color: #a58c38;
        font-family: din-2014, sans-serif;
        font-weight:600;
        font-size:4vw;
		color:#fff;
        letter-spacing: 0.1em;
	}
   #contents #message .btn_text{
        padding:0;
    }
	
	#contents #guest{
        min-width:300px;
        height:auto;
        margin:5em auto 0 auto;
        padding:0;
    }
	
	#contents #guest .copy{
        font-size:4vw;
        line-height: 6.5vw;
        font-weight:bold;
        text-align: center;
        color:#fff;
        margin-top: 1em;
    }
    #contents #guest .read{
        height:auto;
        margin:2.5vw 0 0 0;
        font-size:3.3vw;
        line-height:6vw;
		color:#bbb;
		text-align: center;
    }
	#contents #guest ul{
		width:90%;
		display: flex;
		justify-content:space-between;
		align-items: center;
		flex-wrap: wrap;
		margin:1em auto;
		padding:0;
	}
	#contents #guest ul li{
		display:block;
		width:40%;
		margin:0 auto;
		padding:0;
	}
	#contents #guest .img1{
		width:100%;
		background:url("../img/guest1.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .img2{
		width:100%;
		background:url("../img/guest2.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .img3{
		width:100%;
		background:url("../img/guest3.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}
	#contents #guest .img4{
		width:100%;
		background:url("../img/guest4.jpg") no-repeat;
		padding-top:100%;
		background-position: center center;
		background-size:contain;
		border-radius: 50%;
		margin: 1.5em auto 0 auto;
	}	
	#contents #guest .name{
        color:#fff;
        font-family: din-2014, sans-serif;
        font-style: normal;
        font-weight:400;
        font-size:3.25vw;
		text-shadow: 2px 2px 10px #000, -2px 2px 10px #000, 2px -2px 10px #000, -2px -2px 10px #000;
		margin: 0.5em auto 1em auto;
		padding:0;
		text-align: center;
	}
	#contents #guest .name .small{
        font-weight:100;
        font-size:2.5vw;
	}		

	footer{
		width:100%;
		height:auto;
		margin: 0 auto;
		padding:2vw 0;
		text-align: center;
		background: #a58c38;
	}
	footer .jSns{
        width:100%;
        margin:20px auto 5px auto;
        padding:0;
        text-align: center;
    }
	footer .jLogo{
		width:100%;
        margin:10px auto 5px auto;
		padding:0;
        float: left;
        text-align: center;
	}
    footer .logo_jwave {
        width: 50%;
        margin:0 0 7px 20px;  
	}
	footer .copyright{
		width:100%;
		font-size:1vw;
		color:#fff;
		text-align:center;
        letter-spacing: 0.25vw;
		margin:4.5vw 0 0 0;
	}
	
}