/* ========================================================================
 sec bg
======================================================================== */
#secMain_1 .bg:before {background-image: url(/tour/_assets/recycling/img/secmain_1_bg.webp);}
#secMain_2 .bg:before {background-image: url(/tour/_assets/recycling/img/secmain_2_bg.webp);}
#sec1_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec1_1_bg.webp);}
#sec1_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg.webp);}
#sec2_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec2_1_bg.webp);}
#sec2_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg.webp);}
#sec3_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec3_1_bg.webp);}
#sec3_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg.webp);}
#sec4_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec4_1_bg.webp);}
#sec4_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg.webp);}
#sec5_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec5_1_bg.webp);}
#sec5_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg.webp);}

@media only screen and (max-width: 980px) {
	#secMain_1 .bg:before {background-image: url(/tour/_assets/recycling/img/secmain_1_bg_sp.webp);}
	#secMain_2 .bg:before {background-image: url(/tour/_assets/recycling/img/secmain_2_bg_sp.webp);}
	#sec1_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec1_1_bg_sp.webp);}
	#sec1_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg_sp.webp);}
	#sec2_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec2_1_bg_sp.webp);}
	#sec2_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg_sp.webp);}
	#sec3_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec3_1_bg_sp.webp);}
	#sec3_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg_sp.webp);}
	#sec4_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec4_1_bg_sp.webp);}
	#sec4_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg_sp.webp);}
	#sec5_1 .bg:before {background-image: url(/tour/_assets/recycling/img/sec5_1_bg_sp.webp);}
	#sec5_2 .bg:before {background-image: url(/tour/_assets/img/sec_insight_bg_sp.webp);}
}
/* ------------------------------------------------------------------------
 contents
------------------------------------------------------------------------ */
.sec .contents{
	padding:100px 100px 100px clamp(260px, 15.5%, 100%);
}
@media only screen and (max-width: 980px) {
	.sec .contents{
		padding: 60px 54px 60px 5%;
	}
}
/* ------------------------------------------------------------------------
 secnav
------------------------------------------------------------------------ */
.secnavList:before {
	height:162px;
}
@media only screen and (max-width: 980px) {
	.secnavList:before{
		height:142px;
	}
}
/* ------------------------------------------------------------------------
 secMain_1
------------------------------------------------------------------------ */
#secMain_1{

}
#secMain_1 .sec-head{
	width:580px;
	top:15%;
}
#secMain_1 .secMain-title {
    filter: drop-shadow(0px 0px 10px rgba(24, 42, 99, 0.6));
}
#secMain_1 .desc {
	width: 430px;
}
#square span{
	display:none;
}
@media only screen and (max-width: 980px) {
	#secMain_1 .bg:before{
		background-position:right center;
	}
}
/* ------------------------------------------------------------------------
 secMain_2
------------------------------------------------------------------------ */
#secMain_2{
	
}
#secMain_2 .contents-block{
	width:100%;
	opacity:0;
}
#secMain_2.anim .contents-block{
	animation: slideinBtoT 0.6s var(--anim-ease1) var(--anim-delay2) 1 normal forwards;
}
#secMain_2 h3{
	margin-bottom: 3.5em;
	color:#fff;
	font-size:24px;
	font-weight:700;
	line-height:1.5;
	text-align:center;
}
#secMain_2 .process-image{
	width:100%;
	max-width: 1280px;
	margin: 0 auto;
	display: block;
}
#secMain_2 .process-image img{
	width:100%;
	display: block;
}
@media only screen and (max-width: 980px) {
	#secMain_2 .contents-block.anim{
		animation: slideinBtoT 0.6s var(--anim-ease1) var(--anim-delay2) 1 normal forwards;
	}
	#secMain_2 h3{
		margin-bottom: 1.5em;
		font-size:18px;
	}
}
/* ------------------------------------------------------------------------
 sec1_1
------------------------------------------------------------------------ */
#sec1_1{
	
}
@media only screen and (max-width: 980px) {
	
}
/* ------------------------------------------------------------------------
 sec1_2
------------------------------------------------------------------------ */
#sec1_2{
	
}
#sec1_2 .sec-insight .bottom-illust:before{
	content:"";
	height:189px;
	aspect-ratio: 377 / 379;
    left: -110px;
    top: -70px;
	background-image:url(/tour/_assets/recycling/img/sec1_2_illust.webp);
}
@media only screen and (max-width: 1440px) {
	#sec1_2 .sec-insight .bottom-illust:before{
		height:169px;
		left: -15px;
		top: 20px;
	}
}
@media only screen and (max-width: 980px) {
	#sec1_2 .sec-insight .bottom-illust:before{
        height: 122px;
        left: 0px;
        top: 15px;
	}
}
/* ------------------------------------------------------------------------
 sec2_2
------------------------------------------------------------------------ */
#sec2_2{
	
}
#sec2_2 h3:before{
	content:"";
	height:172px;
	aspect-ratio: 132 / 347;
    left: calc(50% - 360px);
    top: -50px;
	background-image:url(/tour/_assets/recycling/img/sec2_2_illust.webp);
}
@media only screen and (max-width: 980px) {
	#sec2_2 h3:before{
        height: 115px;
        left: calc(50% - 150px);
        top: -60px;
	}
}
/* ------------------------------------------------------------------------
 sec3_2
------------------------------------------------------------------------ */
#sec3_2{
	
}
#sec3_2 h3:before{
	content:"";
	height:139px;
	aspect-ratio: 217 / 279;
    left: 5%;
    top: -50px;
	background-image:url(/tour/_assets/recycling/img/sec3_2_illust.webp);
}
@media only screen and (max-width: 1080px) {
#sec3_2 h3:before{
        height: 120px;
        left: 2%;
        top: -50px;
	}
}
@media only screen and (max-width: 980px) {
	#sec3_2 h3:before{
		content:none;
	}
	#sec3_2 .sec-insight .bottom-illust:before{
		content:"";
        height: 110px;
        aspect-ratio: 217 / 279;
        left: 0px;
        top: 0px;
		background-image:url(/tour/_assets/recycling/img/sec3_2_illust.webp);
	}
}
/* ------------------------------------------------------------------------
 sec4_1
------------------------------------------------------------------------ */
@media only screen and (max-width: 980px) {
    #sec4_1 .contents {
        padding: 60px 54px 60px 5%;
        justify-content: flex-start;
    }
}
/* ------------------------------------------------------------------------
 sec4_2
------------------------------------------------------------------------ */
#sec4_2{
	
}
#sec4_2 h3:before{
	content:"";
	height: 145px;
	aspect-ratio: 140 / 291;
	left: 180px;
    top: -45px;
	background-image:url(/tour/_assets/recycling/img/sec4_2_illust.webp);
}
#sec4_2 .sec-insight .desc-content.width-image .desc-image {
    box-shadow: none;
}
@media only screen and (max-width: 980px) {
	#sec4_2 h3:before{
        height: 115px;
        left: -10px;
        top: -55px;
	}
}
/* ------------------------------------------------------------------------
 sec5_1
------------------------------------------------------------------------ */
#sec5_1{
	color: var(--color-deepblue);
}
@media only screen and (max-width: 1200px) {
	#sec5_1 .desc-title,
	#sec5_1 .desc-text{
		filter: drop-shadow(0px 0px 8px rgba(255,255,255,1)) drop-shadow(0px 0px 8px rgba(255,255,255,1));
	}
}
@media only screen and (max-width: 980px) {
	#sec5_1 .bg:before{
		background-position: center 0%;
	}
	#sec5_1 .contents {
		justify-content: flex-start;
	}
}
/* ------------------------------------------------------------------------
 sec5_2
------------------------------------------------------------------------ */
#sec5_2{
	
}
#sec5_2 h3:before{
	content:"";
    height: 320px;
    aspect-ratio: 631 / 670;
    left: calc(50% - 500px);
    top: -190px;
	background-image:url(/tour/_assets/recycling/img/sec5_2_illust.webp);
}
@media only screen and (max-width: 1200px) {
	#sec5_2 h3:before{
		height: 260px;
        left: calc(50% - 430px);
        top: -150px;
	}
}
@media only screen and (max-width: 980px) {
	#sec5_2 h3:before{
		content:none;
	}
	#sec5_2 .sec-insight .bottom-illust:before{
		content:"";
        height: 180px;
        aspect-ratio: 631 / 670;
        left: -55px;
        bottom: -130px;
		background-image:url(/tour/_assets/recycling/img/sec5_2_illust.webp);
	}
}

