@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;700;900&display=swap');


*{margin: 0; padding: 0; list-style: none; box-sizing: border-box;}
a{color: #000; cursor: pointer; border: none; text-decoration: none;}
img{display: inline-block; font-size: 0; vertical-align: bottom; line-height: normal; width: 100%; height: auto;}
main, article, section, header, footer{display: block; width: 100%;}
html, body, #base{height: 100%; position: relative;}
body{
	font-size: 16px;
	line-height: 2;
	font-weight: 400;
	font-feature-settings: "palt" 1;
	letter-spacing: 0.03em;
	font-kerning: normal;
	font-family: 'Lato', 'Noto Sans JP', "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Hiragino Sans W3", "ヒラギノ角ゴ ProN W3", "Yu Gothic Medium", "游ゴシック Medium", "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #000;
	text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	background: #beb566;
}
h1,h2,h3,h4,h5,h6,p,div,li,dt,dd {font-size:100%;}
h1,h2,h3,h4,h5,h6{line-height: normal; font-weight: 700;}
strong{font-weight: 700;}
#base{position: relative;}

:root{
	--size--95px: -95px;
	--size--76px: -76px;
	--size--57px: -57px;
	--size--38px: -38px;
	--size--19px: -19px;
	--size--9px: -9px;
	--size--5px: -5px;
	--size-5px: 5px;
	--size-9px: 9px;
	--size-19px: 19px;
	--size-38px: 38px;
	--size-57px: 57px;
	--size-76px: 76px;
	--size-95px: 95px;
	--size-114px: 114px;
	--size-133px: 133px;
	--size-152px: 152px;
	--size-171px: 171px;
	--size-190px: 190px;
	--size-209px: 209px;
	--size-228px: 228px;
	--size-247px: 247px;
	--size-266px: 266px;
	--size-285px: 285px;

	--baseBoxpLR: 76px;

	--brder8px: solid 8px #111;
	--brderDot1px: dotted 1px #ddd;
	--bgGrey: #f7f7f7;
	--red: #af2c42;

}

.baseBox{
	width: 100%;
	max-width: 1374px;
	margin: 0 auto;
	padding: 0 var(--baseBoxpLR);
}
.baseMaxBox{
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
	padding: 0 var(--baseBoxpLR);
}
.wideBox{
	width: 100%;
	margin: 0 auto;
	padding: 0 var(--baseBoxpLR);
}

.tb,.sp{
	display: none;
}


/*-- COOKIE --*/
#cookie{
	width: 100%;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 10002;
	background: rgba(0, 0, 0, 0.97);
	color: #fff;
	text-align: center;
}
#cookie .baseBox{
	padding: var(--size-57px) var(--baseBoxpLR);
	line-height: 1.5;
}
#cookie button{
	cursor: pointer;
	display: block;
	background: #fff;
	border: none;
	border-radius: 999px;
	width: 60%;
	max-width: 300px;
	padding: var(--size-38px);
	color: #000;
	margin: 0 auto;
	margin-top: 1em;
	line-height: normal;
	font-size: 100%;
}

@media screen and (max-width: 1600px) { /* 1600px */

	body{
		font-size: 1.25vw;
	}

	:root{
		--size--95px: -5.8vw;
		--size--76px: -4.6vw;
		--size--57px: -3.5vw;
		--size--38px: -2.3vw;
		--size--19px: -1.8vw;
		--size--9px: -1.2vw;
		--size--5px: -0.6vw;
		--size-5px: 0.6vw;
		--size-9px: 1.2vw;
		--size-19px: 1.8vw;
		--size-38px: 2.3vw;
		--size-57px: 3.5vw;
		--size-76px: 4.6vw;
		--size-95px: 5.8vw;
		--size-114px: 6.9vw;
		--size-133px: 8.1vw;
		--size-152px: 9.2vw;
		--size-171px: 10.4vw;
		--size-190px: 11.5vw;
		--size-209px: 12.7vw;
		--size-228px: 13.8vw;
		--size-247px: 15vw;
		--size-266px: 16.1vw;
		--size-285px: 17.3vw;

		--baseBoxpLR: 6vw;

	}

}



@media screen and (max-width: 1600px) {/* 1600px */

	body{
		font-size: calc(100vw * 16 / 1600);
		/*font-size: 1.2vw;*/
	}


}



@media screen and (max-width: 1366px) {/* iPad pro　landscape */

	.w1366none{
		display: none;
	}

	body{
		font-size: calc(100vw * 15 / 1366);
	}


}



@media screen and (max-width: 1194px) {/* iPad pro 11　landscape */

	.w1194none{
		display: none;
	}

	body{
		font-size: calc(100vw * 16 / 1194);
	}

}

@media screen and (max-width: 1024px) {/* iPad pro　portrait */

	.w1024none{
		display: none;
	}

	body{
		font-size: calc(100vw * 18 / 1024);
		/*font-size: 1.7vw;*/
	}

	/*-- COOKIE --*/
	#cookie .baseBox{
		padding: 3vw;
	}
	#cookie button{
		width: 35vw;
		max-width: inherit;
		padding: 2vw;
	}

}



@media screen and (max-width: 768px) {/* TB */

	.tb{
		display: block !important;
	}

	body{
		font-size: calc(100vw * 24 / 768);
	}

}



@media screen and (max-width: 759px) {/* SP */

	.sp{
		display: block !important;
	}
	.w759none{
		display: none;
	}

	body{
		font-size: calc(100vw * 28 / 759);
		/*font-size: 3.55vw;*/
	}

	:root{
		--size--95px: -10vw;
		--size--76px: -8vw;
		--size--57px: -6vw;
		--size--38px: -4vw;
		--size--19px: -3vw;
		--size--9px: -2vw;
		--size--5px: -1vw;
		--size-5px: 1vw;
		--size-9px: 2vw;
		--size-19px: 3vw;
		--size-38px: 4vw;
		--size-57px: 6vw;
		--size-76px: 8vw;
		--size-95px: 10vw;
		--size-114px: 12vw;
		--size-133px: 14vw;
		--size-152px: 16vw;
		--size-171px: 18vw;
		--size-190px: 20vw;
		--size-209px: 22vw;
		--size-228px: 24vw;
		--size-247px: 26vw;
		--size-266px: 28vw;
		--size-285px: 30vw;

		--baseBoxpLR: 6vw;

	}

	/*-- COOKIE --*/
	#cookie{
		font-size: 80%;
	}
	#cookie button{
		width: 40vw;
		padding: 2.5vw;
	}

}