@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td { margin: 0; padding: 0;}
body {
    overflow-x: hidden;
    font-family: 
        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", "Noto Sans JP", "Helvetica Neue",
        "Hiragino Sans", "Yu Gothic", "Meiryo", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}


ul { list-style: none; }
fieldset,img { border: 0; vertical-align: top; overflow: hidden; }
a {color:#c66a00; text-decoration:none; transition: color 0.4s;  }
a:hover {color:#c0000a; text-decoration: none;}
img{ max-width:100%;}

a.external-link img {
    vertical-align: middle; /* テキストとアイコンを揃える */
    margin-left: 5px; /* テキストとの間隔 */
    margin-bottom: 5px; /* 位置を微調整 */
    width: 14px; /* アイコンのサイズ */
    height: 14px;
}

.sp_none{ display: block; }
.pc_none{ display: none; }
.an_scl{ opacity: 0; }


.red_cl{ color:#eb000c; }
.white_cl{ color:#fff; }
.black_cl{ color: #000; }

.fs14{ font-size:0.7em; line-height: 150%; }
.fs16{ font-size:0.8em; line-height: 160%; }
.fs18{ font-size:0.9em; line-height: 160%; }
.fs22{ font-size:1.1em; line-height: 170%; }
.fs24{ font-size:1.2em; line-height: 170%; }
.fs26{ font-size:1.3em; line-height: 170%; }
.fs28{ font-size:1.4em; line-height: 170%; }
.fs30{ font-size:1.5em; line-height: 160%; }
.fs32{ font-size:1.6em; line-height: 150%; }
.fs34{ font-size:1.7em; line-height: 140%; }
.fs36{ font-size:1.8em; line-height: 140%; }
.fs38{ font-size:1.9em; line-height: 140%; }
.fs40{ font-size:2em; line-height: 120%; }
.fs60{ font-size:3em; line-height: 120%; }

.fws{ font-weight: 300; }
.fwb{ font-weight: 600; }

.align_center{text-align: center;}
.align_left{text-align: left;}
.align_right{text-align: right;}

.small-text {
    font-size: 0.7em; /* 元のフォントサイズの70%にする */
}

.palt{font-feature-settings: "palt";-webkit-font-feature-settings: "palt";}



.pd_t10{ padding-top: 0.1rem; }
.pd_t20{ padding-top: 0.2rem; }
.pd_t30{ padding-top: 0.3rem; }
.pd_t40{ padding-top: 0.4rem; }
.pd_t50{ padding-top: 0.5rem; }
.pd_t70{ padding-top: 0.7rem; }
.pd_b10{ padding-bottom: 0.1rem; }
.pd_b20{ padding-bottom: 0.2rem; }
.pd_b30{ padding-bottom: 0.3rem; }
.pd_b40{ padding-bottom: 0.4rem; }
.pd_b50{ padding-bottom: 0.5rem; }
.pd_b70{ padding-bottom: 0.7rem; }


:root{
	--htmlfont:100px;
}

.fw_title{font-family: "Shippori Mincho", serif; font-weight: 600; font-style: normal;}

/******************************************************************/
html{ font-size:var(--htmlfont); /* opacity: 0; transition: opacity 1s;visibility: hidden; */}
html.pgshow{ opacity: 1;visibility: visible; }
/* html.wf-active,html.loading-delay{visibility: visible;} */
body{font-size: 0.2rem; opacity: 1; line-height:155%; font-weight: 400;position: relative; background: #fff2c9;}

/* loading ani */
.loading{height: 100vh; overflow: hidden; opacity: 0;}
/* loading ani */



/* wrap */
.wrap{ position: relative; z-index: 10; }
header{max-width: 100%; background: url("../images/top_bg.jpg?01") center 0 no-repeat; background-size:cover; margin: 0 auto;padding:0 0 0.1rem 0; box-sizing: border-box; position: relative; text-align: center;}
	.headinpre{display: inline-block; }
	.top{ position: relative; }
	.top_tx{position: absolute; top:0%; left: 50%;  width:1200px; max-width:69.36%;transform: translate(-50%,0); z-index: 10;}
	.top_logo{position: absolute; top:5.513%; left: 50%;  width: 420px; max-width:24.27%;transform: translate(-50%,0); z-index: 10; }
	.top_info{ position: absolute; top:59.43%; left:50%; width: 964px; max-width:55.7%; transform: translate(-50%,0); z-index: 10; }
		.top_tx_ph{display: inline-block;}
		.topinfo_ph{ position: relative; z-index: 12; }
		.topinfo_bg{ position: absolute; top: 0; left: 0; width: 100%; z-index: 10; }



.main{position: relative; z-index: 1;}
	.main::after{content: ""; position:absolute; top: 0; left: 0; width: 100%; height: 100vh;max-height: 100%; background:#fff2c9  url('../images/main_bg.jpg') 0 0 no-repeat; background-size:cover; z-index: 1}
	.scrollin::after{position: fixed;}
	.inner_mob{background: rgba(255,211,76, 0.3); padding: 0.6rem 0; position: relative; z-index: 5;}
	.mob_ins01{background: rgba(107,194,135, 0.3); }
		.mob_title{text-align: center; padding: 1.2em 0 2.2em 0;background:url("../images/title_bg.svg") center center no-repeat; background-size: auto 100%; line-height: 0; font-size: 1em;}
			.tit_txjp{ font-size: 2.4em; line-height: 1;color: #000; display: inline-block; padding-bottom: 0.1em; letter-spacing: 0.1em; }
			.tit_txen{font-size:0.8em; color: #fc321d; display: inline-block; line-height: 1; letter-spacing: 0.26em;}

		.inner_cont{width: 1200px; max-width: 100%; padding: 0 0.5rem;box-sizing: border-box;margin: 0 auto; padding-top:2.5em;}
		.inner_cont02{ width: 960px; max-width:calc(100% - 0.8rem);padding: 0.5rem 0.4rem;margin: 0 auto;}
		.inner_cont03{ width: 960px; max-width:100%;margin: 0 auto;}
		.inner_cont04{ width:1100px; max-width:96%;margin: 0 auto;}
			.text_justify{text-align: justify; display:inline-block;text-align-last: justify; width: 7.2em;}
			.text_justify02{text-align: justify; display:inline-block;text-align-last: justify; width: 6em;}
			.text_justify03{text-align: justify; display:inline-block;text-align-last: justify; width: 12em;}
			.tx_moblines{ width: 960px; max-width:100%; box-sizing: border-box;  padding:1.5em; background: #fde7c6; position: relative; margin: 1em auto 0 auto;}
				.tx_titls{ font-size: 1.3em; font-weight: bold; line-height: 160%; }
				.tx_phtitle{ position: absolute; top: -2em; right: -2em; width:240px;max-width: 27%; }
			.title_03{font-weight: 500; padding: 0 0 0.2em 0; font-size: 1.5em; line-height: 140%;}
			.txin_mobws{display: flex; flex-wrap: wrap; width: 100%;}
				.pv_mob{ width:38.2%; padding-right: 3.6%; }
					.pre_ph{ width:97%; max-width: none;margin: 7%; }
					.topytbmob{ width: 100%; padding-bottom: 56.25%; position:relative;}
					.topytbmob iframe{ position: absolute; top:0; left:0; width:100%; height:100%; }
				.txin_cont{ width: 58.2%; padding-top: 2.5em;}
				.soldout{position: relative; padding: 0.5em;}
					.soldout::before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); z-index: 3; }
					.soldout::after{ content: "受付終了"; position: absolute; top:50%; left:50%; font-size: 2em; line-height: 1.1; transform: translate(-50%,-50%); font-weight: bolder; color: #ff4519;  z-index: 10; }





			.premobs_ins{display: flex; flex-wrap: wrap; padding-top: 1.5em;}
				.pre_img_ins{width: 20%;  }
				.pre_cont_ins{ width:80%; box-sizing: border-box; padding: 0em 0em 0em 1.5em; text-align: left; }
				.pre_cont_ins h3{color:#ff2d27; padding-bottom:0.5em; font-size: 1.2em;}

			.premobs{ --bz:1.6em; display: flex; flex-wrap: wrap; margin:4em 0 1em 0; background:rgba(255,255,255,0.8) radial-gradient(rgba(255,0,0,0.03) 0%,rgba(255,0,0,0.03) 20%, transparent 20%); background-size:var(--bz) var(--bz); position: relative;}
				.premobs::after{content: ""; position: absolute; top:calc(var(--bz) / 2);left:calc(var(--bz) / 2); z-index: 1; width:calc(100% - var(--bz));height:calc(100% - var(--bz)); background:radial-gradient(rgba(255,0,0,0.03) 0%,rgba(255,0,0,0.03) 20%, transparent 20%); background-size:var(--bz) var(--bz);}
				.pre_img{ width: 32.4%; position: relative; z-index: 10; background:rgba(255,45,39,0.3); }
				.pre_img img{position: relative;top: -1em;left: -1em;height: 100%;width: 100%;object-fit: cover;object-position: top center;}
				.pre_cont{ width:67.6%; box-sizing: border-box; padding: 2em 1em 2em 2em; font-size: 0.8em; line-height: 180%;position: relative; z-index: 10; }
					.prename{ font-size: 2.2em; line-height: 1; padding-bottom: 0.9em; color: #ff2d27; letter-spacing: 0.3em; }
					.name_en{ font-size: 0.8em; display: inline-block; padding-left: 0.8em; font-weight: 400; letter-spacing: 0; }
						.prectin{ height: 23.5em; overflow-y: auto; padding-right: 1em; font-feature-settings: "palt" 1; }
						.prectin::-webkit-scrollbar {width:0.5em;height:0.5em;}
						.prectin::-webkit-scrollbar-track {background:rgba(0,0,0,0); border-radius:2em;}
						.prectin::-webkit-scrollbar-thumb {background:rgba(0,0,0,0.1); border-radius:2em;}
						.prectin::-webkit-scrollbar-thumb:hover {background:rgba(0,0,0,0.35) }

			.premobs02{--bz:1.6em;display: flex; flex-wrap: wrap; padding: 2em 0 2em 0; justify-content: center; width: calc(100% + 2em);}
				.premobs02_ins{width:calc(33.3% - 2em); margin: 0em 2em 1em 0; box-sizing: border-box; position: relative; background:rgba(255,255,255,0.8) radial-gradient(rgba(255,0,0,0.03) 0%,rgba(255,0,0,0.03) 20%, transparent 20%); background-size:var(--bz) var(--bz);}
				.premobs02_ins::after{content: ""; position: absolute; top:calc(var(--bz) / 2);left:calc(var(--bz) / 2); z-index: 1; width:calc(100% - var(--bz));height:calc(100% - var(--bz)); background:radial-gradient(rgba(255,0,0,0.03) 0%,rgba(255,0,0,0.03) 20%, transparent 20%); background-size:var(--bz) var(--bz);}
				.prename02{font-size: 1.4em; line-height: 1.2; padding: 1em 0; color: #ff2d27; letter-spacing: 0.1em; text-align: center; position: relative;z-index: 10;}
					.prename02 .name_en{padding-left:0; color: #000;}
					.pre02_img{/*  box-shadow: 0.7em 0.7em 0 rgba(255,45,39,0.3); */position: relative;z-index: 10; }
					.pre02_img img{ height: 100%;width: 100%;object-fit: cover;object-position: top center; }



/* ------wrap----- */




.text_ins07{padding-left: 0.64em; text-indent:-0.64em; padding-top: 0.15em; padding-bottom: 0.15em; line-height: 140%; }
.text_in01{padding-left: 1em; text-indent:-1em; line-height: 150%; padding-bottom: 0.3em; }
.text_in02{padding-left: 2em; text-indent:-2em; }
.text_in03{padding-left: 3em; text-indent:-3em; }
.text_in04{padding-left: 4em; text-indent:-4em; }
.text_in045{padding-left: 4.5em; text-indent:-4.5em; }
.text_in05{padding-left: 5em; text-indent:-5em; }

.page_up{opacity: 0; position: fixed; bottom: 0.6rem; right: 0.3rem; z-index: 20; transition: opacity 0.8s;pointer-events: none; width: 0.8rem; max-width:8%; display: block;}
.page_up.visible {opacity: 1;pointer-events: auto;}
footer{ display: block; background: #f8c979; padding:2em 1em; text-align: center;  position: relative; z-index: 10;}
	footer .ftcopy{font-size: 12px; line-height:2;  display: block;}



/* animation */
.scoll_ani{opacity: 0;}
.animated {animation-fill-mode: both;}
.fadeIn {
    animation-name: fadeIn;
    animation-duration: 1s;
}

.fadeInZoom {
    animation-name: fadeInZoom;
    animation-duration: 1s;
}

.fadeInUp {
    animation-name: fadeInUp;
    animation-duration: 1s;
}

.fadeInDown {
    animation-name: fadeInDown;
    animation-duration: 1s;
}

.fadeInline {
    animation-name: fadeInline;
    animation-duration: 1s;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInZoom {
    from { opacity: 0; transform: scale(0.5); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeInDown {
    0% { opacity: 0; transform: translateY(-20px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInline {
    from { opacity: 0; transform: translateX(-50px); }
    to { opacity: 1; transform: translateX(0); }
}




@media screen and (max-width:1200px) {
	:root{--htmlfont:8.33vw;}
}

@media screen and (max-width:768px) {
	:root{--htmlfont:13.33vw;}

	html{ width: 100%; overflow-x: hidden; }
	body{ overflow-x: hidden; font-size: 0.2rem;}
	.sp_none{ display: none; }
	.pc_none{ display: block; }



	header{background:none; padding:0; width: 100%;}
		.headinpre{}
		.top_tx{left:0%;  width:100%; max-width:none;transform: translate(0,0);}
		.top_logo{top:0; margin-top: 9%; width:34.83%; max-width:none; }
		.top_info{top:0%;margin-top: 92.33%; width:136.5%; max-width:none; }
		.inner_cont04{ max-width:94%;}

		.tx_moblines{ padding: 1.6em 1em 1em 1em; }
			.tx_phtitle{ top: -1.6em; right: -1.2em; width:8em; }
			.premobs_ins{padding-top: 1.5em;}
				.pre_img_ins{width: 28%;  }
				.pre_cont_ins{ width:72%;  padding: 0em 0em 0em 1em;  }
				.pre_cont_ins h3{font-size: 1.2em;}

			.title_03{padding: 0 0 1.2em 0;}
			.top_tx_ph{display: inline-block;}
			.topinfo_ph{ position: relative; z-index: 12; }
			.topinfo_bg{ position: absolute; top: 0; left: 0; width: 100%; z-index: 10; }

	.inner_cont{padding: 0.6rem 0.4rem 0 0.4rem;}
		.pv_mob{ width: 100%; margin-bottom: 0.3rem; display: none; }
		.txin_cont{ width: 100%; }
			.txin_cont{padding-top: 0;}

	.cast_mob .inner_cont02{box-sizing: border-box; max-width:100%;padding:0.5rem 0.4rem;}
		.premobs{ padding: 2em; box-sizing: border-box;margin: 0 0 0.4rem 0!important; }
			.pre_img{ width:100%; background:none; height:80vw; }
			.pre_img img{position: static; object-position: 50% 10%;}
			.pre_cont{ width:100%; padding: 2em 0 0 0; font-size: 1.1em; line-height: 180%; }
				.prename{letter-spacing: 0.1em;}
				.prectin{height: auto; padding: 0}
				.name_en{font-size: 0.6em;}


		.premobs02{ padding: 0; width: 100%; }
			.premobs02_ins{ width: 100%; padding: 2em;margin: 0 0 0.4rem 0!important;background:rgba(255,255,255,0.8) radial-gradient(rgba(255,0,0,0.03) 0%,rgba(255,0,0,0.03) 20%, transparent 20%); background-size:var(--bz) var(--bz); position: relative;display: flex; flex-wrap: wrap;flex-direction: column-reverse;}
			.prename02{font-size: 1.8em;  padding:0; letter-spacing: 0.1em; text-align: left;}
				.prename02 .name_en{ font-size: 0.8em; }
				.pre02_img{ width: 100%; box-shadow:none; height: 80vw;margin-bottom: 2em;}








	footer .ftcopy{font-size:9px;}
}


