@charset "UTF-8";

.mainimg_under {
	
	position: relative;
	height: 39.8rem;
	background-image: url('../img/mainimg_under.webp');
	background-size: cover;
	background-position: center center;
	margin-top: 7.9rem;

}

.mainimg_under .catch1 {

	position: absolute;
	bottom: 5.2rem;
	left:   18.8rem;
	width:  21.8rem;
	height: 29rem;
	padding: 1.8rem;

}

.mainimg_under .catch1:after {
	
	opacity: 0.8;
	position: absolute;
	top:  0;
	left: 0;
	content: "";
	width:  100%;
	height: 100%;
	background: #c96236;

}

.mainimg_under .catch1 img {
	
	position: absolute;
	z-index: 2;
	top: 2.4rem;
	width: 17.8rem;

}

.mainimg_under .catch2 {

	position: absolute;
	top:  13.6rem;
	left: 74.6rem;
	width: 41.2rem;

}

#setsubi {
	
	padding-top:    6.4rem;
	padding-bottom: 11.2rem;
	background: #C1C2BF;
	
}

#setsubi .inner {

	width:  102rem;
	margin: 0 auto;

}

#setsubi h2 {
	
	position: relative;
	display: block;
	width:  102rem;
	height: 12.6rem;
	margin-bottom: 5rem;
	padding-top: 0.8rem;
	padding-left: 2.9rem;
	color: #fff;

}

#setsubi h2:before {
	
	opacity: 0.8;
	position: absolute;
	top:  0;
	left: 0;
	content: "";
	width:  100%;
	height: 100%;
	background: #c96236;

}

#setsubi h2 .ja {
	
	position: relative;
	z-index: 3;
	font-family: "fot-chiaro-std", sans-serif;
	font-size: 5.3rem;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.11em;

}

#setsubi h2 .en {
	
	opacity: 0.5;
	position: relative;
	z-index: 3;
	margin-top: -0.08em;
	margin-left: 1.96em;
	font-family: "futura-pt", sans-serif;
	font-size: 6rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.143em;

}

#setsubi h2 .man {

	position: absolute;
	top:   0;
	right: 2rem;
	z-index: 4;
	width: 12.9rem;
	transform-origin: bottom;
	transition: all 0.15s;

}

#setsubi .line1 {
	
	margin-bottom: 16.6rem;
	padding-left: 0.2rem;
	font-family: "toppan-bunkyu-midashi-go-std", sans-serif;
	font-size: 2.4rem;
	font-weight: 900;
	color: #c96236;
	letter-spacing: 0.2em;

}

#setsubi .box_wrap {

  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
	width: 137.6rem;
	margin: 0 auto;

}

#setsubi .box_wrap .box {
	
	width: 39.2%;
	margin-bottom: 11.1rem;

}

#setsubi .box_wrap .box:nth-child(even) {

	margin-right: 4.2rem;

}

#setsubi .box_wrap .box .img {
	
	position: relative;
	margin-bottom: 4.3rem;

}

#setsubi .box_wrap .box .img:after {

	position: absolute;
	top:  2.4rem;
	left: 2.3rem;
	z-index: 1;
	content: "";
	display: inline-block;
	width:  100%;
	height: 100%;
	background: #888;
	
	top:  0;
	left: 0;

}

#setsubi .box_wrap .box.active .img:after {

	top:  2.4rem;
	left: 2.3rem;
	transition: all 0.6s;

}

#setsubi .box_wrap .box .img img {

	position: relative;
	z-index: 2;

}

#setsubi .box_wrap .box h3 {

	font-family: "toppan-bunkyu-midashi-go-std", sans-serif;
	font-size: 2.4rem;
	font-weight: 900;
	letter-spacing: 0.2em;
	color: #c96236;
	white-space: nowrap;

}



@media only screen and (max-width: 1900px) {

	html {
		
		font-size: 61.8489583%;
		
	}

}


@media only screen and (max-width: 1890px) {

	html {
		
		font-size: 61.5234%;
		
	}

}


@media only screen and (max-width: 1860px) {

	html {
		
		font-size: 60.5468%;
		
	}

}


@media only screen and (max-width: 1840px) {

	html {
		
		font-size: 59.89583%;
		
	}

}


@media only screen and (max-width: 1820px) {

	html {
		
		font-size: 59.25%;
		
	}

}


@media only screen and (max-width: 1800px) {

	html {
		
		font-size: 58.59375%;
		
	}

}


@media only screen and (max-width: 1790px) {

	html {
		
		font-size: 58.2682%;
		
	}

}


@media only screen and (max-width: 1770px) {

	html {
		
		font-size: 57.6171%;
		
	}

}


@media only screen and (max-width: 1750px) {

	html {
		
		font-size: 56.96614%;
		
	}

}


/* MacBook Pro16 */
@media only screen and (max-width: 1728px) {

	html {
		
		font-size: 56.25%;
		
	}

}


@media only screen and (max-width: 1700px) {

	html {
		
		font-size: 55.33854%;
		
	}

}


@media only screen and (max-width: 1670px) {

	html {
		
		font-size: 54.375%;
		
	}

}


@media only screen and (max-width: 1640px) {

	html {
		
		font-size: 53.3854%;
		
	}

}


@media only screen and (max-width: 1620px) {

	html {
		
		font-size: 52.75%;
		
	}

}


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

	html {
		
		font-size: 52.0833%;
		
	}

}


@media only screen and (max-width: 1570px) {

	html {
		
		font-size: 51.125%;
		
	}

}


@media only screen and (max-width: 1540px) {

	html {
		
		font-size: 50.1302%;
		
	}

}


/* MacBook Pro14 */
@media only screen and (max-width: 1512px) {

	html {
		
		font-size: 49.25%;
		
	}

}


@media only screen and (max-width: 1490px) {

	html {
		
		font-size: 48.5026%;
		
	}

}


@media only screen and (max-width: 1460px) {

	html {
		
		font-size: 47.526%;
		
	}

}


@media only screen and (max-width: 1440px) {

	html {
		
		font-size: 46.875%;
		
	}

}


@media only screen and (max-width: 1420px) {

	html {
		
		font-size: 46.223958%;
		
	}

}


@media only screen and (max-width: 1400px) {

	html {
		
		font-size: 45.562%;
		
	}

}


@media only screen and (max-width: 1380px) {

	html {
		
		font-size: 44.9218%;
		
	}

}


/* 中サイズ */
@media only screen and (max-width: 1366px) {

	html {
		
		font-size: 44.4375%;
		
	}

}


@media only screen and (max-width: 1340px) {

	html {
		
		font-size: 43.61979%;
		
	}

}


@media only screen and (max-width: 1320px) {

	html {
		
		font-size: 43%;
		
	}

}


@media only screen and (max-width: 1300px) {

	html {
		
		font-size: 42.3177%;
		
	}

}


/* MacBook Air */
@media only screen and (max-width: 1280px) {

	html {
		
		font-size: 41.6875%;
		
	}

}


@media only screen and (max-width: 1260px) {

	html {
		
		font-size: 41.0156%;
		
	}

}


@media only screen and (max-width: 1240px) {

	html {
		
		font-size: 40.375%;
		
	}

}


@media only screen and (max-width: 1220px) {

	html {
		
		font-size: 39.71354%;
		
	}

}


@media only screen and (max-width: 1200px) {

	html {
		
		font-size: 39.0625%;
		
	}

}


/* iPad Pro11の横 */
@media only screen and (max-width: 1194px) {

	html {
		
		font-size: 38.875%;
		
	}

}


/* iPad 5th Airの横 */
@media only screen and (max-width: 1180px) {

	html {
		
		font-size: 38.4375%;
		
	}

}


@media only screen and (max-width: 1160px) {

	html {
		
		font-size: 37.7604%;
		
	}

}


@media only screen and (max-width: 1150px) {

	html {
		
		font-size: 37.434895%;
		
	}

}


/* iPad 6th Miniの横 */
@media only screen and (max-width: 1133px) {

	html {
		
		font-size: 36.875%;
		
	}

}


@media only screen and (max-width: 1120px) {

	html {
		
		font-size: 36.4583%;
		
	}

}


@media only screen and (max-width: 1100px) {

	html {
		
		font-size: 35.8125%;
		
	}

}


/* iPad 9thの横 */
@media only screen and (max-width: 1080px) {

	html {
		
		font-size: 35.8125%;
		
	}

}


@media only screen and (max-width: 1060px) {

	html {
		
		font-size: 34.5052%;
		
	}

}


@media only screen and (max-width: 1050px) {

	html {
		
		font-size: 34.17968%;
		
	}

}


/* iPadPro */
@media only screen and (max-width: 1024px) {

	html {
		
		font-size: 33.3125%;
		
	}
	
	.mainimg_under {
		
		height: 100rem;
		background-image: url('../img/mainimg_under.webp');
		
		margin-top: 22rem;

	}

	.mainimg_under .catch1 {

		bottom: 11%;
		left:   3%;
		width:  55.2rem;
		height: 74.4rem;
		padding: 3.6rem;

	}

	.mainimg_under .catch1 img {
		
		z-index: 2;
		top: 4.8rem;
		width: 48rem;

	}

	.mainimg_under .catch2 {

		top:  36%;
		left: 55%;
		width: 77rem;

	}

	#setsubi {
		
		padding-top:    16rem;
		padding-bottom: 2rem;
		
	}

	#setsubi .inner {

		width:  150rem;

	}

	#setsubi h2 {
		
		width:  150rem;
		height: 23rem;
		margin: 0 auto;
		margin-bottom: 12rem;
		padding-top: 3rem;
		padding-left: 2.9rem;

	}

	#setsubi h2 .ja {
		
		font-size: 11rem;
		letter-spacing: 0.06em;

	}

	#setsubi h2 .en {
		
		margin-top: -0.08em;
		margin-left: 1.96em;
		font-size: 9rem;
		letter-spacing: 0.11em;

	}

	#setsubi h2 .man {

		top:   0;
		right: 3rem;
		z-index: 4;
		width: 23.7rem;

	}

	#setsubi .line1 {
		
		margin-bottom: 16.6rem;
		padding-left: 0.2rem;
		font-size: 6.4rem;
		letter-spacing: 0.08em;

	}

	#setsubi .box_wrap {

	  display: flex;
	  flex-wrap: wrap;
	  justify-content: space-between;
		width: 88%;

	}

	#setsubi .box_wrap .box {
		
		width: 44.5%;
		margin-bottom: 12rem;

	}

	#setsubi .box_wrap .box:nth-child(even) {

		margin-right: 5rem;

	}

	#setsubi .box_wrap .box .img {
		
		margin-bottom: 6rem;

	}

	#setsubi .box_wrap .box .img:after {

		top:  3rem;
		left: 3rem;
		width:  100%;
		height: 100%;

	}

	#setsubi .box_wrap .box h3 {

		font-size: 5rem;
		letter-spacing: 0.04em;
		white-space: nowrap;

	}

}


@media only screen and (max-width: 1000px) {

	html {
		
		font-size: 32.552%;
		
	}

}


@media only screen and (max-width: 980px) {

	html {
		
		font-size: 31.90104%;
		
	}

}


@media only screen and (max-width: 970px) {

	html {
		
		font-size: 31.57552%;
		
	}

}


@media only screen and (max-width: 950px) {

	html {
		
		font-size: 30.937%;
		
	}
	
}


/* iPhone14 ProMaxの横 */
@media only screen and (max-width: 932px) {

	html {
		
		font-size: 30.937%;
		
	}
	
}


@media only screen and (max-width: 910px) {

	html {
		
		font-size: 29.62239%;
		
	}
	
}


/* XRの横 */
@media only screen and (max-width: 896px) {

	html {
		
		font-size: 29.2%;
		
	}
	
}


@media only screen and (max-width: 880px) {

	html {
		
		font-size: 28.64583%;
		
	}
	
}


/* AndroidのＬの横 */
@media only screen and (max-width: 854px) {

	html {
		
		font-size: 27.8125%;
		
	}

}


/* iPhone14 Proの横 */
@media only screen and (max-width: 852px) {

	html {
		
		font-size: 27.75%;
		
	}

}


/* iPhone14の横*/
@media only screen and (max-width: 844px) {

	html {
		
		font-size: 27.5%;
		
	}

}



/* iPad Pro11 */
@media only screen and (max-width: 834px) {

	html {
		
		font-size: 27.125%;
		
	}

}


/* iPad Air */
@media only screen and (max-width: 820px) {

	html {
		
		font-size: 26.687%;
		
	}

}


/* iPhone13 miniの横 */
@media only screen and (max-width: 812px) {

	html {
		
		font-size: 26.437%;
		
	}

}


/* iPad 9th */
@media only screen and (max-width: 810px) {

	html {
		
		
		
	}

}


@media only screen and (max-width: 790px) {

	html {
		
		font-size: 25.7161%;
		
	}

}


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

	html {
		
		font-size: 25%;
		
	}

}


/* iPad 6th Mini */
@media only screen and (max-width: 744px) {

	html {
		
		font-size: 24.25%;
		
	}

}


/* iPhonePlusの横 */
@media only screen and (max-width: 736px) {

	html {
		
		font-size: 23.937%;
		
	}

}


@media only screen and (max-width: 720px) {

	html {
		
		font-size: 23.4375%;
		
	}

}


@media only screen and (max-width: 700px) {

	html {
		
		font-size: 22.75%;
		
	}

}


@media only screen and (max-width: 680px) {

	html {
		
		font-size: 22.1354%;
		
	}

}


/* iPhone8の横 */
@media only screen and (max-width: 667px) {

	html {
		
		font-size: 21.687%;
		
	}

}


@media only screen and (max-width: 650px) {

	html {
		
		font-size: 21.158854%;
		
	}

}


@media only screen and (max-width: 630px) {

	html {
		
		font-size: 20.507%;
		
	}

}


@media only screen and (max-width: 620px) {

	html {
		
		font-size: 20.18229%;
		
	}

}


@media only screen and (max-width: 600px) {

	html {
		
		font-size: 19.53125%;
		
	}

}


@media only screen and (max-width: 580px) {

	html {
		
		font-size: 18.8802%;
		
	}

}


/* iPhone5の横 */
@media only screen and (max-width: 568px) {

	html {
		
		font-size: 18.5%;
		
	}

}


@media only screen and (max-width: 540px) {

	html {
		
		font-size: 17.5781%;
		
	}

}


@media only screen and (max-width: 520px) {

	html {
		
		font-size: 16.927%;
		
	}

}


@media only screen and (max-width: 500px) {

	html {
		
		font-size: 16.276014%;
		
	}

}


/* AndLoidL */
@media only screen and (max-width: 480px) {

	html {
		
		font-size: 15.625%;
		
	}

}


@media only screen and (max-width: 450px) {

	html {
		
		font-size: 14.648%;
		
	}

}


/* Iphone13 Pro Max */
@media only screen and (max-width: 430px) {

	html {
		
		font-size: 14%;
		
	}

}


/* Iphone12 Pro Max */
@media only screen and (max-width: 428px) {

	html {
		
		font-size: 13.93229%;
		
	}

}


/* iPhonePlus */
@media only screen and (max-width: 414px) {

	html {
		
		font-size: 13.5%;
		
	}

}


@media only screen and (max-width: 400px) {

	html {
		
		font-size: 13.02083%;
		
	}

}


/* iPhone14 Pro */
@media only screen and (max-width: 393px) {

	html {
		
		font-size: 12.812%;
		
	}

}


/* iPhone12 Pro */
@media only screen and (max-width: 390px) {

	html {
		
		font-size: 12.687%;
		
	}

}


/* iPhone8 */
@media only screen and (max-width: 375px) {

	html {
		
		font-size: 12.187%;
		
	}

}


/* Galaxy */
@media only screen and (max-width: 360px) {

	html {
		
		font-size: 11.75%;
		
	}

}


/* iPhone5 */
@media only screen and (max-width: 320px) {

	html {
		
		font-size: 10.437%;
		
	}

}