@charset "utf-8";
/*------------------------------------------------------------
	index
------------------------------------------------------------*/
#main .mainVisual .textBox {
	padding-top: min(19.5vw,24.9rem);
}
#main .compBox {
	margin-bottom: min(8.5vw,10.8rem);
}
#main .sec02{
	padding-bottom: 8rem;
	position: relative;
}
#main .sec02:after {
	width: 100%;  
	background: url(../img/special4/bg01.webp) no-repeat;
	background-size: cover;
	position: absolute;  
	top: min(3vw,3.8rem);
	bottom: 0;
	left: 0;
	content: ""; 
	z-index: -1;
}
#main .sec02 .content {
	max-width: 118.5rem;
}
#main .sec02 .inner01 {
	margin-bottom: min(6.8vw,7rem);
	position: relative;
}
#main .sec02 .inner01 p {
	font-size: 2.7rem;
	letter-spacing: 0.2em;
	line-height: 2.33;
	text-align: justify;
	font-feature-settings: "palt";
}
#main .sec02 .inner02 {
	margin-bottom: min(4.92vw,6.3rem);
	position: relative;
}
#main .sec02 .inner02:last-child {
	margin-bottom: 0;
}
#main .sec02 .inner02 .photoBox {
	order: 2;
	width: 48rem;
	margin: 8.5rem -6.7rem 0 min(6.25vw,8rem);
}
#main .sec02 .inner02 .photoBox img {
	width: 100%;
}
#main .sec02 .inner02 .photoBox span {
	display: block;
	font-size: 1.4rem;
	letter-spacing: 0.025em;
	margin-top: 1rem;
}
#main .sec02 .inner02 .textBox {
	flex: 1;
	padding-left: min(4.51vw,5rem);
}
#main .sec02 .inner02 .textBox .headLine03 {
	margin-right: -2rem;
}
#main .sec02 .inner02 p {
	margin-bottom: min(1.48vw,1.9rem);
	text-align: justify;
	line-height: 2.22;
	letter-spacing: 0.04em;
	font-feature-settings: "palt";
}
#main .sec02 .inner02 .txt {
	border: 1px solid #000000;
	font-size: 1.6rem;
	letter-spacing: 0.05em;
	line-height: 1.875;
	padding: 1.0rem 1.8rem;
	background-color: rgba(255, 255, 255, 0.7);
}
#main .sec02 .inner02 .note {
	font-size: 1.4rem;
	letter-spacing: 0.025em;
	line-height: 1.57;
	padding-top: 0.5rem;
}
#main .sec02 .inner02 p:last-child {
	margin-bottom: 0;
}
#main .sec02 .inner02 .linkTxt {
	text-align: left;
	font-size: 1.4rem;
	letter-spacing: 0.025em;
	margin-right: -4rem;
}
#main .sec02 .inner02 .linkTxt a:hover {
	opacity: 0.7;
}
#main .sec02 .inner03 .photoBox {
	order: -1;
	margin-right: min(6.25vw,8rem);
	margin-left: max(-8.45vw,-7rem);
}
#main .sec02 .inner03 .photoBox span {
	text-align: right;
}
#main .sec02 .inner03 .textBox {
	padding-left: 0 !important;
	padding-right: min(5.2vw,5rem);
}


@media all and (max-width: 896px) {
	#main .mainVisual .textImg {
		width: 25.3rem;
	}
	#main .mainVisual .textBox {
		padding: 10.2rem 1.4rem 0;
	}
	#main .mainVisual {
		padding-bottom: 0;
		margin-bottom: 3.2rem;
	}
	#main .compBox {
		margin-bottom: -0.2rem;
	}
	#main .sec02::after {
		top: 8.7rem;
		background-image: url(../img/special4/bg01_sp.webp);
	}
	#main .sec02 .content {
		padding: 0 2rem;
	}
	#main .sec02 .inner01 p {
		font-size: 1.5rem;
		line-height: 2.1;
	}
	#main .sec02 .inner01::after {
		width: 34rem;
		height: 34rem;
		top: 5.4rem;
		right: -7.7rem;
	}
	#main .sec02 .inner02 {
		margin-bottom: 2rem;
	}
	#main .sec02 .inner03 .photoBox span {
		text-align: left;
	}
	#main .sec02 .inner02 .subInner {
		display: block;
	}
	#main .sec02 .inner02 .photoBox {
		width: auto;
		margin: 1.5rem 0 1rem;
	}
	#main .sec02 .inner02 .photoBox img {
		width: 100%;
	}
	#main .sec02 .inner02 .photoBox span {
		font-size: 1rem;
		margin-top: 0.8rem;
	}
	#main .sec02 .inner02 .textBox {
		padding: 0;
	}
	#main .sec02 .inner02 .txt {
		font-size: 1.1rem;
		margin-bottom: 1rem;
		padding: 0.7rem 1rem;
		line-height: 1.73;
	}
	#main .sec02 .inner01 {
		margin-bottom: 2.8rem;
	}
	#main .sec02 .inner02 p {
		margin-bottom: 1rem;
		font-size: 1.2rem;
		line-height: 2;
	}
	#main .sec02 .inner02.bg01::after { 
		width: 21rem;
		height: 21rem;
		left: auto;
		right: -2rem;
		top: 13.9rem;
		right: -10.2rem;
	}
	#main .sec02 .inner02 .linkTxt {
		font-size: 1rem;
		line-height: 1.56;
	}
	#main .sec02 .inner02.bg02::after { 
		width: 26.5rem;
		height: 26.5rem;
		right: auto;
		left: -3.5rem;
		top: -8.8rem;
	}
	#main .sec02 .inner03 {
		padding-bottom: 0;
	}
	#main .sec02 .inner02 .note {
		font-size: 0.9rem;
		padding-top: 0.2rem;
		margin-bottom: 1.2rem;
	}
	#main .sec02 {
		padding: 3.8rem 0 1.7rem;
	}
	#main .sec02 .inner02 .linkTxt {
		margin-right: 0;
		line-height: 1.56;
		display: flex;
	}
	#main .sec02 .inner02 .linkTxt span {
		flex-shrink: 0;
		margin-right: 0.3rem;
	}
	#main .mainVisual .iconBox {
		bottom: -1rem;
	}
}

@media all and (min-width: 897px) {
	#main .mainVisual {
		margin-bottom: min(6.4vw,8.2rem);
	}
	#main .mainVisual .textBox .textImg {
		margin-left: max(-1.3vw,-1.7rem);
	}
	#main .mainVisual .iconBox {
		bottom: max(-0.7vw,-0.9rem);
	}
	#main .compBox p {
		padding-right: min(2.4vw,3rem);
	}
}

@media all and (min-width: 897px) and (max-width: 1279px) {
	#main .mainVisual .textImg {
		width: 95.3%;
	}
	#main .sec02 {
		padding-bottom: 5rem;
	}
	#main .sec02 .content {
		padding: 0 6rem;
	}
	#main .sec02 .inner02 .subInner {
		display: block;
	}
	#main .sec02 .inner02 .photoBox {
		margin-right:-9.7rem;
		margin-bottom: 5rem;
		width: 42%;
		float: right;
	}
	#main .sec02 .inner02 .photoBox02 {
		margin-bottom: 2rem;
	}
	#main .sec02 .inner02 .textBox {
		padding-left: 1.5rem;
	}
	#main .sec02 .inner01::after { 
		height: 65.5rem;
		height: 65.5rem;
		top: 5.2rem;
		right: -38rem;
		background-size: 100% 100%;
	}
	#main .sec02 .inner02.bg01::after { 
		height: 51rem;
		height: 51rem;
		left: -20rem;
		top: 1rem;
		background-size: 100% 100%;
	}
	#main .sec02 .inner02.bg02::after { 
		background-size: 100% 100%;
		height: 65.5rem;
		height: 60.5rem;
		right: -18rem;
		top: 27rem;
	}
	#main .sec02 .inner03 .photoBox {
		margin-left: -8.8rem;
		margin-right: 5rem;
		width: 42%;
		float: left;
	}
	#main .sec02 .inner02 .textBox .headLine03 .subSpan span {
		display: block;
	}
	#main .sec02 .inner02 .txt {
		max-width: 46.4rem;
	}
	#main .sec02 .inner03 .textBox {
		padding-right: 2rem;
		padding-left: 1.5rem !important;
	}
	
	#main .sec02 .inner01 p {
		max-width: 76.2rem;
		margin: 0 auto;
	}

}