.h1{font-size: clamp(40px,5vw,96px);  font-family: Work_Sans_B;line-height: 1.4;}
.h2{font-size: clamp(30px,3.4vw,64px);font-family: Work_Sans_B;line-height: 1.2}
.h3{font-size: clamp(24px,3vw,48px);font-family: Work_Sans_B;line-height: 1}
.desc{font-size: clamp(18px,1.4vw,24px);font-family: Work_Sans_R;}
.ibanner{padding: 16% 0 10%;}
.ibanner::before{content: ' ';position: absolute;width: 75%;padding-bottom: 57%;background: url(../images/sporicide/ry.webp) no-repeat center/cover;right: 0;top: 0;z-index: 2;}
.ibanner::after{content: ' ';position: absolute;width: 40%;padding-bottom: 57%;background: url(../images/sporicide/ly.webp) no-repeat center/cover;left: 0;bottom: 10%;z-index: 2;}
.ibanner .layout{position: relative;z-index: 3;color: #fff;max-width: 1600px;}
.ibanner .bottom{margin-top: 16%;}
.ibanner .bottom .h1{color: #0320A0;}

.ibanner .item{display: flex;justify-content: space-between;align-items: center;margin-top: 5%;}
.ibanner .item:nth-child(2n){flex-direction: row-reverse;margin-top: 10%;}
.ibanner .item:nth-child(2n) .num{padding-bottom: 5%;flex-direction: row-reverse;}
.ibanner .item .num_warp{width: 30%;padding: 4% 0;}
.ibanner .item .num_warp .h3{margin-top: 5%;}
.ibanner .item>.h3{font-family: Work_Sans_M;width: 55%;line-height: 1.5;}
.ibanner .item .h4{font-family: Work_Sans_B;}
.ibanner .num{display: flex;justify-content: start;align-items: flex-end;}
.ibanner .num_warp .number{position: relative;width: 50%;padding-bottom: 42%;display: inline-block;animation: number35 2s 1 linear forwards;}
.ibanner .num_warp .dw{font-size: clamp(50px,5vw,96px);font-family: Work_Sans_B;color: #0320a0;position: relative;z-index: 2;}
.ibanner .item:nth-child(2n)>.h3{text-align: right;}
.ibanner .item:nth-child(2n) .number{position: relative;width: 30%;padding-bottom: 50%;display: inline-block;animation: number6 2s 1 linear forwards;}
.ibanner .item:nth-child(2n) .dw{color: #2D9FD2;font-size: clamp(80px,7vw,128px);margin-right: -10%;line-height: 1;}

.flitration{margin-top: 5%;}
.flitration .title_warp{text-align: center;max-width: 600px;margin: 0 auto;}
.flitration .title_warp .title{font-size: clamp(30px, 3.4vw, 64px);color: #0320A0;line-height: 1.4;}
.flitration .title_warp .desc{font-size: clamp(24px, 2vw, 32px);color:#2D9FD2;max-width: 70%;margin: 2% auto 15%;}
.flitration .item{background-color: #0320A0;display: flex;color: #fff;font-size: clamp(28px, 3.4vw, 64px);justify-content: start;align-items: center;}
.flitration .item .title{width: 48%;padding: 0 5%;}

.flitration .item:nth-child(n){padding-left: 10%;margin-bottom: 5%;}
.flitration .item:nth-child(2n){padding-right: 10%;flex-direction: row-reverse;padding-left: 0;}
.flitration .item:nth-child(2n) .title{text-align: right;}

.flitration .item .img_warp{width: 21%;padding-bottom: 28%;position: relative;margin-top: -10%;flex-shrink: 0;}
.flitration .item .img_warp img{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;}
.flitration .item .right{display: flex;justify-content: end;}
.flitration .item:nth-child(2) .right{justify-content: start;}
.flitration .item .right img{height: 100%;width: auto;position: relative;}
.flitration .item .right img:nth-child(2){margin-left: -25%;}
.flitration .item:nth-child(1) .right img:nth-child(1){animation: opacity100 3s infinite linear forwards;}
.flitration .item:nth-child(1) .right img:nth-child(2){animation: opacity50 3s infinite linear forwards;}
.flitration .item:nth-child(2) .right img:nth-child(1){animation: opacity50 3s infinite linear forwards;}
.flitration .item:nth-child(2) .right img:nth-child(2){animation: opacity100 3s infinite linear forwards;}

@media only screen and (max-width: 950px) {
.ibanner{padding: 100px 0 50px;}
.ibanner .item{flex-direction: column;align-items: start;}
.ibanner .item>.h3{width: 100%;}
.ibanner .item .num_warp{width: 100%;}
.ibanner .item:nth-child(2n){flex-direction: column;}
.ibanner .item:nth-child(2n)>.h3{text-align: left;}
.flitration .list .item{padding: 0 2.5%;margin-bottom: 25%;}
.flitration .item .right{display: none;}
.flitration .item .img_warp{width: 50%;padding-bottom: 68%;margin-top: -25%;}
.flitration .item:nth-child(2n){}
.flitration .item .title{padding: 0 2.5%;}
}

@keyframes number35 {
	0% {background: url(../images/sporicide/35.png) no-repeat  center/auto 100%;}
	3% {background: url(../images/sporicide/34.png) no-repeat  center/auto 100%;}
	6% {background: url(../images/sporicide/33.png) no-repeat  center/auto 100%;}
	9% {background: url(../images/sporicide/32.png) no-repeat  center/auto 100%;}
	12% {background: url(../images/sporicide/31.png) no-repeat center/auto 100%;}
	15% {background: url(../images/sporicide/30.png) no-repeat center/auto 100%;}
	18% {background: url(../images/sporicide/29.png) no-repeat center/auto 100%;}
	21% {background: url(../images/sporicide/28.png) no-repeat center/auto 100%;}
	24% {background: url(../images/sporicide/27.png) no-repeat center/auto 100%;}
	27% {background: url(../images/sporicide/26.png) no-repeat center/auto 100%;}
	30% {background: url(../images/sporicide/25.png) no-repeat center/auto 100%;}
	33% {background: url(../images/sporicide/24.png) no-repeat center/auto 100%;}
	36% {background: url(../images/sporicide/23.png) no-repeat center/auto 100%;}
	39% {background: url(../images/sporicide/22.png) no-repeat center/auto 100%;}
	42% {background: url(../images/sporicide/21.png) no-repeat center/auto 100%;}
	45% {background: url(../images/sporicide/20.png) no-repeat center/auto 100%;}
	48% {background: url(../images/sporicide/19.png) no-repeat center/auto 100%;}
	51% {background: url(../images/sporicide/18.png) no-repeat center/auto 100%;}
	54% {background: url(../images/sporicide/17.png) no-repeat center/auto 100%;}
	57% {background: url(../images/sporicide/16.png) no-repeat center/auto 100%;}
	60% {background: url(../images/sporicide/15.png) no-repeat center/auto 100%;}
	63% {background: url(../images/sporicide/14.png) no-repeat center/auto 100%;}
	66% {background: url(../images/sporicide/13.png) no-repeat center/auto 100%;}
	67% {background: url(../images/sporicide/12.png) no-repeat center/auto 100%;}
	70% {background: url(../images/sporicide/11.png) no-repeat center/auto 100%;}
	73% {background: url(../images/sporicide/10.png) no-repeat center/auto 100%;}
	76% {background: url(../images/sporicide/9.png) no-repeat  center/auto 100%;}
	79% {background: url(../images/sporicide/8.png) no-repeat  center/auto 100%;}
	81% {background: url(../images/sporicide/7.png) no-repeat  center/auto 100%;}
	100% {background: url(../images/sporicide/6.png) no-repeat center/auto 100%;}

}

@keyframes number6 {
	0% 	{background: url(../images/sporicide/b1.png) no-repeat  center/auto 100%;}
	16% 	{background: url(../images/sporicide/b2.png) no-repeat  center/auto 100%;}
	32% 	{background: url(../images/sporicide/b3.png) no-repeat  center/auto 100%;}
	48% 	{background: url(../images/sporicide/b4.png) no-repeat  center/auto 100%;}
	60% {background: url(../images/sporicide/b5.png) no-repeat center/auto 100%;}
	100% {background: url(../images/sporicide/b6.png) no-repeat center/auto 100%;}
}

@keyframes opacity100 {
	0% {opacity: 50%;}
	50% {opacity: 100%;}
	100% {opacity: 50%;}
}
@keyframes opacity50 {
	0% {opacity: 100%;}
	50% {opacity: 50%;}
	100% {opacity: 100%;}
}

