@import url('/css/animate.css');.wow{animation:fadeIn 1.5s both;-webkit-animation:fadeIn 1.5s both;animation-duration:1s;-webkit-animation-duration:1s}
.delay1{animation-delay:0.5s;-webkit-animation-delay:0.5s}
.delay2{animation-delay:1.0s;-webkit-animation-delay:1.0s}
.delay3{animation-delay:1.5s;-webkit-animation-delay:1.5s}
#articleInfo7 .y-bg{position:relative;width:fit-content;color:#603813;text-align:center;margin:25px 0;font-size:30px;line-height:100%;background-color:#eeddb6;padding:5px 20px;margin:25px 0;border-radius:20px}
#articleInfo13 .topBox{overflow:hidden;margin:0 0 50px;position:relative}
#articleInfo13 .topBox .articleInfo13bg{top:0;left:0;width:100%;height:100%}
#articleInfo13 .topBox .articleInfo13bg img{width:100%;aspect-ratio:6/3;object-fit:cover}
#articleInfo13 .topBox p,#articleInfo13 .topBox h3{position:relative;text-align:center;font-size:20px;color:#fff;z-index:2;animation-name:fadeInDown;-webkit-animation-name:fadeInDown}
#articleInfo13 .topBox p{display:flex;flex-direction:column;align-items:center}
#articleInfo13 .topBox p i{width:80px;height:80px;display:inline-block;border:2px #fff solid;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;font-size:40px;line-height:80px;display:flex;flex-direction:column;align-items:center;justify-content:center}
#articleInfo13 .topBox p i img{-webkit-filter:contrast(0) brightness(200%);filter:contrast(0) brightness(200%);width:80%}
#articleInfo13 .topBox h3{margin:15px 0;font-size:25px}
#articleInfo13 >ul{display:grid;grid-template-columns:repeat(2,1fr);gap:50px;margin-bottom:50px}
#articleInfo13 >ul li .item{position:relative;display:flex;flex-direction:column;justify-content:center}
#articleInfo13 >ul li .item .circle{position:absolute;width:90px;left:0}
#articleInfo13 >ul li .item p{margin-left:120px;color:#84ad71;font-weight:bold;font-size:26px}
#articleInfo13 >ul li .item article{margin-left:120px;color:#603813;font-size:20px}
#articleInfo13 .bottomBox{background:#f1f1f1;padding:50px 90px}
#articleInfo13 .bottomBox.white{background:#fff;text-align:center}
#articleInfo13 .bottomBox.white h3{display:inline-block;padding:10px 30px;border:1px solid #ddd;border-radius:25px;margin-bottom:30px}
#articleInfo13 .photoBox{display:flex;justify-content:center;margin:30px 0}
#articleInfo13 .advantage-box{display:flex;flex-direction:column;align-items:center}
#articleInfo13 .advantage-box h3{position:relative;width:fit-content;color:#603813;text-align:center;margin:25px 0;font-size:30px;line-height:100%;background-color:#eeddb6;padding:5px 20px;margin:25px 0;border-radius:20px}
#articleInfo13 .advantage-box img{aspect-ratio:4/3;object-fit:cover;border-radius: 60px;width: 1000px;}
#articleInfo13 .compare-img{display:grid;grid-template-columns:repeat(2,1fr);gap:50px;justify-items:stretch;margin-bottom:60px}
#articleInfo13 .bottomBox .boxx{display:grid;grid-template-columns:repeat(2,1fr);margin:50px 0;gap:30px}
#articleInfo13 .bottomBox .boxx .infoo{background:#f1f1f1;padding:30px 0;border-radius:25px}
#articleInfo13 .bottomBox .boxx .infoo h5{font-size:24px}
#articleInfo13 .bottomBox .boxx .infoo p{font-size:20px;margin:0}
#articleInfo13 .bottomBox .boxx .infoo p img{height:250px;aspect-ratio:5/3;object-fit:cover}
#articleInfo13 .bottomBox h3{text-align:center;color:#603813;font-size:23px;font-weight:300}
#articleInfo13 .bottomBox p{text-align:center;font-size:30px;margin-bottom:30px;font-weight:bold;color:#84ad71}
#articleInfo13 .bottomBox .img{text-align:center}
#articleInfo13 .bottomBox h5{text-align:center;color:#603813;font-size:20px}
#articleInfo13 .box{margin:45px 0}
#articleInfo13 .box h3{text-align:center;font-size:30px;margin-bottom:30px;font-weight:bold;color:#84ad71}
#articleInfo13 ul.topBox{display:grid;grid-template-columns:repeat(5,1fr);gap:50px;width:80%;margin:0 auto}
#articleInfo13 ul.topBox p{margin-bottom:15px}
#articleInfo13 ul.topBox p img{width:80px}
#articleInfo13 .y-bg{width:fit-content;color:#603813;text-align:center;margin:25px 0;font-size:30px;line-height:100%;background-color:#eeddb6;padding:5px 20px;margin:25px auto;border-radius:20px}
#articleInfo7{display:grid;grid-template-columns:37% 60%;margin:70px 0;align-items:center;justify-content:space-between;justify-items:start}
#articleInfo7.twoo{grid-template-columns:45% 50%}
#articleInfo7 .two{order:2}
#articleInfo7 img{}
#articleInfo7 .info h3,.title_box{color:#84ad71;font-size:36px;margin-bottom:20px}
.title_box{text-align:center}
#articleInfo7 .info p{text-align:justify;color:#603813;font-size:20px}
#articleInfo13 .imgBox{display:grid;grid-template-columns:repeat(3,1fr);margin:60px 0;justify-content:center;gap:30px}
#articleInfo13 .imgBox2{grid-template-columns:repeat(2,1fr)}
#articleInfo13 .imgBox p{}
#processBox ul{display:grid;grid-template-columns:repeat(4,1fr);align-items:start;width:min(100%,1200px);margin:0 auto}
#processBox li{position:relative;display:flex;flex-direction:column;align-items:center;margin:30px;justify-content:center}
#processBox li .num{position:absolute;font-family:"Barlow",sans-serif;font-size:23px;width:40px;aspect-ratio:3 / 3;background:var(--primary);display:flex;align-items:center;justify-content:center;color:var(--white);border-radius:50px;left:15%;z-index:2;top:0px}
#processBox li:after{content:url(/images/44/triangle.png);position:absolute;right:-40px}
#processBox li:last-child:after,#processBox li:nth-child(4):after{display:none;}

#processBox li .item{border:5px solid var(--secondary);width:150px;aspect-ratio:3 / 3;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative}
#processBox li .item:after{content:'';position:absolute;width:100%;height:100%;border:10px solid #fff;border-radius:50%;z-index:-1;left:0;top:0}
#processBox li img{width:57px;aspect-ratio:3 / 3}
#processBox li h3{text-align:center;font-size:22px;margin-top:25px;font-weight:500;line-height:1.5;color:#603813}
#processBox li:hover .item:after{top:-10px;left:-10px}
#reading{background:#e9efde;border-radius:30px;padding:50px;margin-top:50px}
#reading .readingTop{display:flex;align-items:flex-end;gap:50px;margin-bottom:20px}
#reading .readingTop h3{font-size:22px;color:#8c9b70}
#reading h2{font-size:24px;color:#8c9b70;margin-bottom:10px}
#reading .readLink{border-radius: 30px;border: 2px #8c9b70 solid;width: fit-content;padding: 10px;}
#reading .readLink a{padding: 10px 20px;font-size: 22px;font-weight: 600;color: #8c9b70;}
#reading .readLink:hover {background:#8c9b70}
#reading .readLink:hover a{;color:#fff}

@media screen and (max-width: 1024px) {
	#processBox li .item, #articleInfo13 ul.topBox{width:100%;}
	#reading .readingTop{display: flex;flex-direction: column;align-items: center;}
	#articleInfo13 .imgBox{display: grid;grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width: 768px) {
	#articleInfo13 .imgBox{display: grid;grid-template-columns: repeat(1,1fr);}
	#articleInfo13 .compare-img{grid-template-columns:repeat(1,1fr);}
	#processBox li h3{font-size: 18px;}
	#processBox li .num{left: -10px;}
	#articleInfo13 .imgBox{flex-wrap: wrap;}
	#articleInfo13 ul.topBox{grid-template-columns: repeat(3, 1fr);}
	#articleInfo13 .bottomBox{padding:50px;}
	#articleInfo13 >ul, #articleInfo7, #articleInfo7.twoo{grid-template-columns:1fr}
	#articleInfo7 .info{margin: 20px 0;}
	#articleInfo7{margin:0}
	#articleInfo7 .two{order:-1}
	#processBox ul{grid-template-columns: repeat(3,1fr);}
	#processBox li:nth-child(3):after,#processBox li:nth-child(6):after{display:none;}
	#processBox li:nth-child(4):after{display:inline-block;}
	
}
@media screen and (max-width: 640px) {
	#articleInfo13 .imgBox p{width: calc(100%/1);}
	#articleInfo13 .bottomBox.white{padding:0;margin: 60px 0;}
	#articleInfo13 .bottomBox .boxx{grid-template-columns: 1fr;margin: 0 0;}
	#articleInfo13 ul.topBox{grid-template-columns: repeat(2, 1fr);}
	#articleInfo13 .info h3.brown{font-size: 26px;}
	#articleInfo13 .advantage-box h3,#articleInfo13 .y-bg{
    font-size: 20px;
}
	#processBox ul{grid-template-columns: repeat(2,1fr);}
	#processBox li:nth-child(even):after{display:none;}
	#processBox li:nth-child(3):after{display:inline-block;}
	#processBox li h3{font-size: 18px;}
	#reading{padding: 20px;}
}