@charset "utf-8";
*,
*::after,
*::before{
	box-sizing: border-box;
}

/* [Main Common] 매인 공통 */
/* MAX */
.max-1248{max-width: 1248px !important; width: 100%;
	padding-left: 0 !important; padding-right: 0 !important;
	 margin: 0 auto; padding-inline: 24px !important;
}
@media all and (max-width: 768px) {
	.max-1248{padding-inline: 18px !important;}
}
/* Circle */
.circle-118{
	width: 118px; height: 118px; border-radius: 50%;
	display: flex; align-items: center;
	justify-content: center;
}
@media all and (max-width: 768px) {
	.circle-118{width: 95px; height: 95px;}
}
/* Button */
.btn.rd-white{
	width: fit-content; height: 38px; padding-inline: 16px; 
	border: 1px solid #D2D4D6; background-color: #FFF;
	border-radius: 8px; font-size: 14px; font-weight: 500;
	display: flex; align-items: center;
	justify-content: center;
	transition: all 0.4s ease;
}

/* Item */
.item.farm{
	position: relative;
	display: flex; flex-direction: column;
}
.item.farm .img-wrap{}
.item.farm .img-wrap img{
	object-fit: cover; object-position: center center;
	width: 100%; height: 100%; vertical-align: top;
}
.item.farm .text-wrap{
	position: absolute; inset: 0 0 0 0;
	padding: 40px;
}
.item.farm .text-wrap .title{font-size: 20px; font-weight: 700; line-height: 1.2;}
.item.farm .text-wrap .text{font-size: 18px; font-weight: 700; color: #838383;}
.item.farm .text-wrap .title + .text{padding-top: 5px;}
.item.farm .text-wrap .btn{margin-top: 30px;}
@media all and (max-width: 768px) {
	.item.farm .text-wrap{padding: 20px;}
	.item.farm .text-wrap .title{font-size: 18px;}
	.item.farm .text-wrap .text{font-size: 14px; font-weight: 500;}
	.item.farm .text-wrap .btn{margin-top: 24px;}
}

.item.partners{
	background-color: #FFF; padding: 48px 24px;
	display: flex; flex-direction: column;
	align-items: center;
}
.item.partners .img-wrap{ background-color: #FBFBFB; }
.item.partners .img-wrap + .text-wrap{margin-top: 17px;}
.item.partners .text-wrap{text-align: center; font-weight: 600;}
.item.partners .text-wrap .title{font-size: 24px; line-height: 1.2;}
.item.partners .text-wrap .text{font-size: 18px; color: #838383; line-height: 1.2;}
.item.partners .text-wrap .title + .text{padding-top: 13px;}
@media all and (max-width: 768px) {
	.item.partners {padding: 24px 12px;}
	.item.partners .text-wrap .title{font-size: 18px;}
	.item.partners .text-wrap .text{font-size: 14px; font-weight: 500;}
}


/* Tag */
.tag-wrap{
	display: flex; align-items: center;
	justify-content: center; gap: 8px;
	flex-wrap: wrap;
}
.tag{
	display: flex; align-items: center;
	justify-content: center; margin: 0;
}
.tag.brd-gray{
	background-color: #FFF;
	border: 1px solid #D9D9D9; border-radius: 100px;
	color: #7B7B7B; font-size: 14px; font-weight: 500;
	padding-inline: 24px; height: 34px; 
}

.tag:is(.green, .black){
	width: fit-content; padding: 3px 12px;
	border-radius: 4px; color: #FFF; 
	font-size: 14px; font-weight: 400;
}

.tag.green{background-color: #55B59A;}
.tag.black{background-color: #000;}

@media (any-hover: hover) and (any-pointer: fine) {
	.item.farm:hover .btn.rd-white,
	.btn.rd-white:hover{ border-color: #362B2B; }
}



/*** [Main] 메인 리뉴얼 ***/
.main .section{padding-left: 0px !important; padding-right: 0px !important;}
.main .section + .section{margin-top: 120px;}
.main .section .title-area{padding-top: 0;}
.main .section .title-area .h2{font-size: 28px;}

.main .section.partner .title-area{padding-top: 0;}
@media all and (max-width: 768px) {
	.main .section + .section{margin-top: 80px;}
	.main .section .title-area .h2{font-size: 24px;}
	.main .section .title-area .btn.detail{margin-top: 16px;}
}


/* [Main Banner] 메인 배너 */
.main #slideBanner{
	position: relative;
	width: 100%; height: 410px;
	background-color: #56B59C;
}
.main #slideBanner .swiper-container{position: relative;}
.main #slideBanner [class*="swiper-"]{height: 100%;}
.main #slideBanner .swiper-slide{}
.main #slideBanner .swiper-slide:not(.swiper-slide-active){
	opacity: 0 !important;
}
.main #slideBanner .text-wrap{
	max-width: 1248px; width: 100%; height: 100%; margin: 0 auto;
	display: flex; flex-direction: column;
	justify-content: center; padding-inline: 24px;
	gap: 10px; color: #FFF;
}
.main #slideBanner .text-wrap .title{font-size: 60px; font-weight: 700; line-height: 1.2;}
.main #slideBanner .text-wrap .text{font-size: 20px; font-weight: 600;  line-height: 1.2;}
.main #slideBanner .text-wrap .btn{margin-top: 10px; font-family: 'Pretendard';}
.main #slideBanner .swiper-pagination{
	position: absolute; top: auto; height: auto;
	display: flex; align-items: center; padding-inline: 1.5rem;
}
.main #slideBanner .swiper-pagination span{
	width: 10px; height: 10px; background-color: #FFF;
	border-radius: 100px; transition: width 0.3s ease;
}
.main #slideBanner .swiper-pagination span::before{display: none;}
.main #slideBanner .swiper-pagination span.swiper-pagination-bullet-active{width: 40px;}

.main #slideBanner .video-wrap{
	position: absolute; top: 0px; left: 0; right: 0;
	max-width: 1200px; margin: 0 auto; width: 100%; padding-inline: 1.5rem;
	display: flex; justify-content: flex-end; box-sizing: border-box;
}
 .main #slideBanner .video-wrap video{
	margin-top: 13px; margin-right: 60px;
}

@media all and (max-width: 1024px){
	.main #slideBanner .video-wrap video{
		max-width: 460px; width: 100%; 
		margin-top: 117px; margin-right: 0;
	}
}
@media all and (max-width: 768px) {
	.main #slideBanner{height: 350px;}
	.main #slideBanner .text-wrap{justify-content: flex-start; padding-top: 60px;}
	.main #slideBanner .text-wrap .title{font-size: 40px;}
	.main #slideBanner .text-wrap .text{font-size: 18px;}

	.main #slideBanner .video-wrap{height: 100%;}
	.main #slideBanner .video-wrap video{
		position: absolute; bottom: clamp(-75px,-12.12vw,-46px);
		max-width: clamp(280px,74.67vw,460px); margin-top: 0px; margin-right: -24px;
	}
}

/* [Main Smartfarm] 메인 스마트팜 설치 사례 */
.main .section.re-partner{margin-top: 120px;}
.main .section.re-partner li{width: 383px;}
.main .section.re-partner .item{height: 465px;}
.main .section.re-partner .item .img-wrap{width: 100%; height: 100%;}
@media all and (max-width: 1024px){
	.main .section.re-partner li{width: 340px;}
	.main .section.re-partner .item{height: 425px;}
}
@media all and (max-width: 768px) {
	.main .section.re-partner{margin-top: 80px;}
	.main .section.re-partner li{width: 285px;}
	.main .section.re-partner .item{height: 345px;}
}

/* [Main Partner] 업체정보 */
.main .section.re-look{}
.main .section.re-look li{width: 383px; aspect-ratio: 1/1;}
.main .section.re-look .item{height: 100%;}
.main .section.re-look .item .tag-wrap{margin-top: 48px;}
.main .section.re-look .item .tag-wrap .tag{margin: 0;}
@media all and (max-width: 1024px) {
	.main .section.re-look li{width: 350px;}
	.main .section.re-look .item .tag-wrap{margin-top: 24px;}
	.main .section.re-look .item .tag-wrap .tag{height: 30px; font-size: 14px; padding-inline: 18px;}
}
@media all and (max-width: 768px) {
	.main .section.re-look li{width: 310px;}
	.main .section.re-look .item .tag-wrap{margin-top: 38px; gap: 4px; margin-top: 16px;}
	.main .section.re-look .item .tag-wrap .tag{padding-inline: 14px; font-size: 12px; height: 28px;}
}


/* [Main Best Shop] 메인 섹션 추천상품 */
.main .section.re-best-shop{
	width: 100%;height: 450px;
	background-color: #F0F5F1;
}
.main .section.re-best-shop .max-1248{
	position: relative; height: 100%;
	display: flex;
}
.main .section.re-best-shop .img-wrap{
	position: relative; top: -120px; left: 35px;
	width: 724px; height: 679px;
}
.main .section.re-best-shop .img-wrap img{
	width: 100%; height: 100%;
	object-fit: cover; object-position: center center;
}

.main .section.re-best-shop .text-wrap{
	position: relative; z-index: 1; padding-top: 80px;
	width: calc(100% - 724px);
}
.main .section.re-best-shop .title{font-size: 32px; font-weight: 600; line-height: 1.2;}
.main .section.re-best-shop .text {font-size: 24px; line-height: 1.2; color: #000; font-weight: 500;}
.main .section.re-best-shop .btn{margin-top: 14px;}
@media all and (max-width: 1150px) {
	.main .section.re-best-shop .img-wrap{ width: 630px; height: 590px; top: -80px; left: 0; }
	.main .section.re-best-shop .text-wrap{ width: calc(100% - 630px); }
}
@media all and (max-width: 1024px) {
	.main .section.re-best-shop{height: 400px;}
	.main .section.re-best-shop .img-wrap{ width: 440px; height: 410px; top: 10px; left: 0; }
	.main .section.re-best-shop .text-wrap{padding-top: 40px; width: calc(100% - 440px); }
}
@media all and (max-width: 768px) {	
	.main .section.re-best-shop{height: fit-content; padding-block: 0 40px;}
	.main .section.re-best-shop .max-1248{
		flex-direction: column;	
	}
	.main .section.re-best-shop .img-wrap{
		width: 100%; height: auto; top: -60px;
	}
	.main .section.re-best-shop .text-wrap{width: 100%; padding-top: 0px;}
	.main .section.re-best-shop .title{font-size: 24px;}
	.main .section.re-best-shop .text {font-size: 18px;}
}


/* [Main News] 메인 섹션 뉴스 */
.main .section.re-news{background-color: #FAFAFA;}
.main .section.re-news .swiper-container{border: 1px solid #EAEAEC; background-color: #FFF;}
.main .section.re-news li{width: 399px;}
.main .section.re-news li + li{border-left: 1px solid #EAEAEC;}
.main .section.re-news .item.news{
	height: 655px; padding: 90px 60px;
	display: flex; flex-direction: column;
	gap: 35px; background-color: #FFF;
	box-shadow: none;
}
.main .section.re-news .item.news .text-wrap{
	display: flex; flex-direction: column;
	gap: 12px;
}
.main .section.re-news .item.news .title{font-size: 20px; font-weight: 700;}
.main .section.re-news .item.news .text {font-size: 16px; color: #6A6C73; font-weight: 400;}

@media all and (max-width: 1024px) {
	.main .section.re-news li{width: 350px;}
	.main .section.re-news .item.news{
	 	height: 582px; padding: 70px 45px;
		gap: 24px;
	}
}
@media all and (max-width: 768px) {	
	.main .section.re-news li{width: 285px;}
	.main .section.re-news .item.news{
		height: 470px; padding: 45px 35px;
		gap: 18px;
	}
	.main .section.re-news .item.news .title{font-size: 18px;}	
	.main .section.re-news .item.news .text {font-size: 14px;}
	.main .section.re-news .item.news .tag{font-size: 12px;}
}


/* [Main Link] 메인 섹션 링크 */
.main .section.re-link{ margin-top: 120px;
	width: 100%; height: 665px;
	padding-left: 0; padding-right: 0;
	background: url("../images/main/section_re_link.jpg") center center / cover no-repeat;
	
}
.main .section.re-link .section-wrap{
	display: flex; flex-direction: column;
	gap: 175px;
}
.main .section.re-link .h2{font-size: 36px;}
.main .section.re-link .section-wrap .data-list{
	width: 100%; padding-top: 0;
	display: flex; align-items: center;
	justify-content: flex-end;
	gap: 132px;
}
.main .section.re-link .section-wrap .data-list .ico{margin-left: 40px;}

@media all and (max-width: 1024px) {
	.main .section.re-link .section-wrap .data-list{gap: 80px;}
}
@media all and (max-width: 768px) {
	.main .section.re-link{margin-top: 80px; height: 540px;}
	.main .section.re-link .h2{font-size: 30px;}
	.main .section.re-link .section-wrap{gap: 60px;}
	.main .section.re-link .section-wrap .data-list{
		flex-direction: column;
		align-items: flex-start; justify-content: flex-start;
		gap: 24px;
	}
	.main .section.re-link .section-wrap .data-list li,
	.main .section.re-link .section-wrap .data-list li a{width: 100%;}
}