﻿.main-banner {background-image: url("/resources/img/main/banner.jpg");-webkit-background-size: cover;background-size: cover;background-position: center center;background-repeat: no-repeat;aspect-ratio: 1920 / 960; display: flex;align-items: center;width: 100%;}   
.banner-t1 {font-size: 80px;font-weight: 700;color: #fff;margin-bottom: 20px;}
.banner-t2 {font-size: 30px;font-weight: 500;color: #fff;}

.section1 {padding-top: 200px;padding-bottom: 300px;}
.section2 {background-image: url("/resources/img/main/company_bg.png");-webkit-background-size: cover;background-size: cover;background-position: center center;background-repeat: no-repeat;aspect-ratio: 1920 / 960;display: flex;align-items: center;justify-content: center;width: 100%;}   
.section3 {padding: 200px 0;}
.section3-df {display: flex;justify-content: space-between;}
.section3-right {width: 66%;}
.section3-left {width: 20%;}

.main-stit {font-size: 20px;font-weight: 700;color: #34B2C9;margin-bottom: 10px;}
.main-tit {font-size: 70px;font-weight: 700;color: #000;}
.main-txt {font-size: 20px;font-weight: 500;color: #444;line-height: 1.7;}

.company-t1 {font-size: 50px;font-weight: 700;color: #fff;margin: 40px 0;}
.company-t2 {font-size: 20px;font-weight: 500;color: #fff;line-height: 1.5;margin-bottom: 50px;}

.section2-df {display: flex;justify-content: space-between;}
.product-tab {display: flex;gap: 10px;align-self: end;}
.product-tab li {border: 1px solid #ddd;border-radius: 30px;background-color: #fff;overflow: hidden;display: flex;}
.product-tab li a {flex: 1;padding: 18px 34px;font-size: 24px;font-weight: 700;color: #000;display: flex; flex-direction: column; align-items: center;justify-content: center;text-align: center;}
.product-tab li a span {font-size: 16px;font-weight: 700;color: #34B2C9;}
.product-tab li.on {background-color: #34B2C9;}
.product-tab li.on a,
.product-tab li.on a span {color: #fff;}

.product-wrap {position: relative;max-width: 1920px;margin: 220px auto 0;}
.product-cont {width: 38%;}
.product-tit {font-size: 50px;font-weight: 700;color: #000;margin-bottom: 50px;}
.product-txt {font-size: 20px;font-weight: 500;color: #444;line-height: 1.7;margin-bottom: 50px;height: 615px;}
.product-item {background-color: #F2F5F9;border-radius: 20px;display: flex;align-items: center;justify-content: center; aspect-ratio: 750 / 650;padding: 120px 130px;}
.product-slide-wrap {position: absolute;left: 46%;top: 50%;transform: translateY(-50%);width: 100%;max-width: 52%;}
.product-slide {overflow: hidden;margin-left: auto;padding-right: 250px;}
.product-slide .owl-stage-outer {overflow: visible;}
.product-item img {idth: 100%;height: 100%;object-fit: contain;}

.product-nav {position: absolute;left: 0;top: 50%; width: calc(100% - 250px); transform: translateY(-50%); z-index: 10;display: flex; align-items: center;}
.product-nav a {display: inline-flex;width: 60px;height: 60px;}
.product-nav a.prev {background-image: url("/resources/img/main/slide_prev.svg");background-repeat: no-repeat;background-position: center center;position: absolute;left: 0;}
.product-nav a.next {background-image: url("/resources/img/main/slide_next.svg");background-repeat: no-repeat;background-position: center center;position: absolute;right: 0;}

@media (max-width: 1600px) {

}
@media (max-width: 1560px) {
	.banner-t1 {font-size: 70px;}
	.main-tit {font-size: 60px;}
	.company-t1 {font-size: 40px;}
}
@media (max-width: 1499px) {
	.product-txt {font-size: 18px;}
}

@media (max-width: 1429px) {
	.banner-t1 {font-size: 60px;}
	.main-tit {font-size: 50px;}
	.product-tab li a {font-size: 20px;padding: 15px 20px;}
	.product-wrap {margin: 150px auto 0;}
	.product-item {padding: 100px 100px;}
	.section1 {padding-top: 150px; padding-bottom: 150px;}
}
@media (max-width: 1399px) {
	.product-slide {padding-right: 150px;}
	.product-nav {width: calc(100% - 150px);}
	.main-banner {min-height: 560px;}
}
@media (max-width: 1259px) {
	.banner-t1 {font-size: 50px;}
	.main-tit {font-size: 40px;}
	.product-tit {font-size: 40px;}
	.company-t1 {font-size: 35px;}
	.product-item {padding: 80px 80px;}

}

@media (max-width: 1219px)	{
	.banner-t1 {font-size: 40px;}
	.banner-t2 {font-size: 25px;}
	.main-stit {font-size: 18px;}
	.main-tit {font-size: 30px;}
	.main-txt {font-size: 18px;}
	.product-tit {font-size: 30px;}
	.product-txt {font-size: 16px;}
	.company-t1 {font-size: 30px;}
	.company-t2 {font-size: 18px;}
	.section3 {padding: 150px 0;}
	.product-tab li a {font-size: 16px;}
	.product-tab li a span {font-size: 14px;}
    .product-wrap {margin: 100px auto 0;}
	.product-slide {padding-right: 100px;}
	.product-nav {width: calc(100% - 100px);}
	.section2 {min-height: 460px;}
}

@media (max-width: 991px) {
	.main-banner {min-height: 460px;}
	.banner-t1 {font-size: 30px;margin-bottom: 10px;}
	.banner-t2 {font-size: 18px;}
    .section1 {padding-top: 100px;padding-bottom: 100px;}
	.section3 {padding: 100px 0;}
	.main-stit {font-size: 16px;}
	.main-tit {font-size: 25px;}
	.product-tit {font-size: 20px;margin-bottom: 25px;}
	.product-txt {font-size: 14px;margin-bottom: 25px;}
	.product-tab li a {font-size: 14px;}
	.product-tab li a span {font-size: 12px;}
	.section2-df {flex-direction: column;gap: 20px;}
    .product-wrap {margin: 50px auto 0;}
	.product-nav a {width: 30px;height: 30px;-webkit-background-size: 12px auto;background-size: 12px auto;}
	.product-item {padding: 50px 50px;}
	.product-slide {padding-right: 50px;}
	.product-nav {width: calc(100% - 50px);}
	.company-t1 {font-size: 20px;margin: 20px 0;}
	.company-t2 {font-size: 14px;margin-bottom: 25px;}
	.main-txt {font-size: 16px;}
	.section3-df {flex-direction: column;gap: 20px;}
	.section3-right {width: 100%;}
	.section3-left {width: 100%;}
	.product-txt {height: 670px;}
}	

@media (max-width: 767px) {
	.main-banner {min-height: 360px;}
	.banner-t1 {font-size: 25px;}
	.banner-t2 {font-size: 16px;}
    .section1 {padding-top: 50px;padding-bottom: 50px;}
	.section3 {padding: 50px 0;}
	.product-cont {width: 100%;}
	.product-slide-wrap {position: relative;left: auto;top: auto;max-width: 100%;transform: translateY(0);margin-top: 30px;padding: 0 16px;}
	.product-tit {margin-bottom: 10px;}
	.product-slide {padding-right: 0;}
	.product-nav {width: 100%;}
	.product-nav a.prev {left: 16px;}
	.product-nav a.next {right: 16px;}
	.main-tit {font-size: 20px;}
	.main-txt {font-size: 14px;}
	.product-tab {display: grid;grid-template-columns: repeat(2, 1fr);align-self: normal;align-items: center;}
    .product-wrap {margin: 25px auto 0;}
	.product-tab li a {padding: 15px 10px;}
	.product-txt {height: 453px;}
}	

@media (max-width: 375px) {
	.product-txt {height: auto;}
}