@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}
#articleInfo13 .info h3{text-align:left;font-size:30px;margin-bottom:30px;font-weight:bold;color:#84ad71}
#articleInfo13 .info h3.brown{color:#603813;text-align:center;margin-bottom:50px}
#articleInfo13 .top-img{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-bottom:80px}
#articleInfo13 .top-img img{aspect-ratio:4/3;object-fit:cover}
#articleInfo13 .la-img{display:grid;grid-template-columns:repeat(3,1fr);gap: 20px;}
#articleInfo13 .la-img img{aspect-ratio:3/4;object-fit:cover}
#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: 150px;}
#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 .photoBox{display: flex;justify-content: center;}
#articleInfo13 .bottomBox.white h3{display:inline-block;padding: 10px 30px;border: 1px solid #ddd;border-radius: 25px;margin-bottom: 30px;}
#articleInfo13 .bottomBox.white iframe{width: 100%;aspect-ratio: 16/9;object-fit: contain;}
#articleInfo13 .bottomBox .boxx{display:grid;grid-template-columns: repeat(2, 1fr);margin: 50px 0;gap: 60px;}
#articleInfo13 .bottomBox .boxx .infoo h5{font-size: 24px;color: #84ad71;}
#articleInfo13 .bottomBox .boxx .infoo p{font-size:20px;color: #603813;}
#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;margin-bottom: 20px;}
#articleInfo13 .bottomBox h5{text-align:center;color: #603813;}
#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;}
#articleInfo7{display:grid;grid-template-columns: 50% 45%;align-items: center;justify-content: space-between;}
#articleInfo7.twoo{grid-template-columns: 45% 50%;}
#articleInfo7 .two{order:2}
#articleInfo7 img{aspect-ratio:4/3;object-fit: cover;}
#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;gap: 50px;}
#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}

#articleInfo13 .compare-img{display:grid;grid-template-columns:repeat(2,1fr);gap:50px;justify-items:stretch;margin-bottom:60px}
#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{width: 1000px;aspect-ratio:4/3;object-fit:cover;border-radius: 150px;}
#articleInfo13 .box{display:grid;grid-template-columns:48% 48%;margin:80px 0;justify-content:space-between;align-items:center}
#articleInfo13 .box .tt h3{text-align:center;color:#84ad71;font-weight:bold;font-size:36px}
#articleInfo13 .box .form-box ul{list-style: none;margin-top: 15px;}
#articleInfo13 .box .form-box ul li{overflow: hidden;border-bottom: 1px solid #d4d4d4;padding: 20px 0;display: grid;grid-template-columns: 20% 80%;align-items: center;}
#articleInfo13 .box .form-box ul li h4{float:left;font-size:20px;color:#603813}
#articleInfo13 .box .form-box ul li p{float: right;font-size: 19px;color: #603813;}
#articleInfo13 .box .form-box >p{font-size: 18px;font-weight: 600;}
#articleInfo15{margin:70px 0;}
#articleInfo15 .tit{position:relative;text-align:center;z-index:2}
#articleInfo15 .tit h3{text-align:center;font-size:33px;color: #84ad71;}
#articleInfo15 .tit font{padding:0 20px;display:inline-block;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease;text-align: center;color: #603813;font-size: 20px;}
#articleInfo15 ul{overflow:hidden;position:relative;z-index:1;margin-top: 50px;display: flex;flex-wrap: wrap;justify-content: center;}
#articleInfo15 ul li{width: calc(100%/3);animation-name:fadeInUp;-webkit-animation-name:fadeInUp}
#articleInfo15 ul li .item{padding: 20px 50px;}
#articleInfo15 ul li .item .circle{position:relative;margin: 0 auto 25px;box-sizing:border-box;text-align:center;}
#articleInfo15 ul li .item .circle img{aspect-ratio:4/3;object-fit: cover;}
#articleInfo15 ul li .item p{text-align:center;font-size: 23px;color: #84ad71;}
#articleInfo15 ul li .item article{text-align: center;color: #603813;font-size: 20px;}

@media screen and (max-width: 1024px) {
	#articleInfo15 ul li .item{padding: 20px;}
	#articleInfo13 .box{grid-template-columns:1fr}
	#articleInfo13 .box img {width:100%}
	#processBox li .item, #articleInfo13 ul.topBox{width:100%;}
}
@media screen and (max-width: 768px) {
	#articleInfo13 .top-img{grid-template-columns:repeat(1,1fr)}
	#articleInfo13 .la-img{}
	#articleInfo13 .compare-img{grid-template-columns:repeat(1,1fr)}
	#processBox li .num{top:0;left:0}
	#articleInfo15 ul li{width:50%}
	#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;}
	#articleInfo13 .imgBox{margin:30px;grid-template-columns:1fr;}
}
@media screen and (max-width: 640px) {
	#articleInfo15 ul li{width:100%;}
	#articleInfo13 .bottomBox.white{padding:0;margin: 25px 0;}
	#articleInfo13 .bottomBox .boxx{grid-template-columns: 1fr;margin: 0 0;}
	#articleInfo13 ul.topBox{grid-template-columns: repeat(2, 1fr);}
	#articleInfo13 .advantage-box img{border-radius: 30px;}
	#articleInfo13 .advantage-box h3{ font-size: 24px;}
	#articleInfo13 .info h3.brown{font-size: 26px;}
	#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;}
}