@charset "utf-8";

/*********************
** 해더
********************/
header { transition: background-color 0.3s ease;}
.menu {  color: #fff;  transition: color 0.3s ease;}
.co_white {   transition: color 0.3s ease;}
header.scrolled {  background-color: #fff;}
header.scrolled .menu {  color: #222;}

/*********************
** 메인
*********************/
.mainBanner{background:url('/img/mainBg.jpg'); background-size:cover; background-position: center;}

.technologyBox{width:calc(50% - 15px); background-size:cover; background-position: center;}
.technologyBox:nth-of-type(1){background-image:url('/img/technology-001.jpg')}
.technologyBox:nth-of-type(2){background-image:url('/img/technology-002.jpg')}
.technologyBox:nth-of-type(3){background-image:url('/img/technology-003.jpg')}
.technologyBox:nth-of-type(4){background-image:url('/img/technology-004.jpg')}


.productBox:nth-of-type(1){background:url('/img/product-001.jpg')#fff}
.productBox:nth-of-type(2){background:url('/img/product-002.jpg')#fff}
.productBox{ background-size: auto 100% !important; background-position: right bottom !important; background-repeat: no-repeat !important;}

.slide1 { background:url('/img/loungeSlider-001.jpg'); background-size:cover; background-position:center;} 
.slide2 { background:url('/img/loungeSlider-002.jpg'); background-size:cover; background-position:center;} 
.slide3 { background:url('/img/loungeSlider-003.jpg'); background-size:cover; background-position:center;} 
.slide4 { background:url('/img/loungeSlider-004.jpg'); background-size:cover; background-position:center;} 
.slide5 { background:url('/img/loungeSlider-005.jpg'); background-size:cover; background-position:center;} 
.next, .prev {  top: 50%;  transform: translateY(-50%);  z-index: 10;  cursor: pointer;    background-color: rgba(0, 0, 0, 0.2); }
.prev {  left: 0;  border-radius: 0 8px 0 8px; }
.next {  right: 0;  border-radius: 8px 0 0 8px; }

.loungeBox{ background-size:cover; background-position:center; overflow: hidden;}
.loungeBox1{background-image:url('/img/lounge1store.jpg');}
.loungeBox2{background-image:url('/img/lounge2store.jpg');}
.gradientBg{background:linear-gradient(to top, #212121, rgba(0,0,0,0)); bottom:0; left:0}

.partnershipBox{display:grid; grid-template-columns: repeat(2 , 1fr);}

/*********************
** 회사소개 (about.php)
*********************/
.aboutBanner{background:url('/img/aboutSubBn.jpg'); background-size:cover; background-position:center;}
.aboutMenu{bottom:0;}
.company{background:url('/img/companyBg.png'); background-size:cover; background-position:bottom}
.companyBox{ display: grid; grid-template-columns: repeat(4 , 1fr);}
.valuesBox{ max-width: 1370px; display:grid; grid-template-columns: repeat(2 , 1fr);}
.aboutCenter{transform: translate(-50%, -50%); top:50%; left:50%;}
.valuesBox div{max-width: 670px; background-size:cover; background-position:center;}
.valuesBox div:nth-of-type(2){background-image:url('/img/values-001.jpg');}
.valuesBox div:nth-of-type(3){background-image:url('/img/values-002.jpg');}
.valuesBox div:nth-of-type(4){background-image:url('/img/values-003.jpg');}
.valuesBox div:nth-of-type(5){background-image:url('/img/values-004.jpg');}
.menberBox{display:grid; grid-template-columns: repeat(3 , 1fr);}

/*********************
** 연혁 (history.php)
*********************/
.history_row {  align-items: stretch; }
.history_row:last-child {  padding-bottom: 0;}
.line_area::before {  content: '';  position: absolute;  top: 0px;  bottom: -80px;   left: 50%;  width: 2px;  background-color: #B2A092;  transform: translateX(-50%);}
.history_row:last-child .line_area::before {  bottom: -100px;}
.dot {  border: 6px solid #5C4742;}
.content_area {  flex: 1;}
.event-item:last-child {  margin-bottom: 0;}
.month {  flex-shrink: 0;}
.desc {  word-break: keep-all;}

/*********************
** CI (ci.php)
*********************/
.ciBox{display:grid; grid-template-columns: repeat(2 , 1fr);}
.ciBox > div{overflow:hidden;border:1px solid #D9DADE}

/*********************
** 오시는길 (map.php)
*********************/
.tab-item:first-child { border-radius: 16px 16px 0 0; }
.tab-item:last-child { border-radius: 0 0 16px 16px; }
.tab-item{border:1px solid #D9DADE}
.tab-item.active {  background-color: #5C4742;   color: #fff;  border-color: #5C4742;}
.map-wrapper {  border-radius: 30px 30px 0 0;  overflow: hidden;}
.map-wrapper iframe {  width: 100%;  height: 100%;  border: 0;}
.address-bar{border-radius: 0 0 30px 30px;}


/*********************
** 제품정보(NIR,RING) (productNir.php, productRing.php)
*********************/
.productBanner{background:url('/img/productSubBn.jpg')center center; background-size:cover}
.productBnr{background:url('/img/productBg.jpg')center center no-repeat; background-size:100% auto; background-position: top;}
.productSlider .swiper-slide {transform: scale(0.6);transition: transform 0.4s ease; transform-origin: bottom center; display: flex; align-items: center; justify-content: center;}
.productSlider .swiper-slide-active,
.productSlider .swiper-slide-duplicate-active {transform: scale(1);z-index: 10;}
.swiperBtnBox .custom-pagination .swiper-pagination-bullet {width: 12px;height: 12px;background: #d9dade;border-radius: 50%;opacity: 1;cursor: pointer;display: block;}
.swiperBtnBox .custom-pagination .swiper-pagination-bullet-active {background: #5C4742;transform: scale(1.7);}
.iteamLine{border-top:1px solid #d9dade; border-bottom:1px solid #d9dade}
.productInfo td{border:1px solid #d9dade; border-width:1px 0 1px 0}
.productInfo tr td:nth-child(1){border-right:1px solid #d9dade}
.HeliostarVideo .videoBox {width: 100%;}
.HeliostarVideo iframe {width: 100%; aspect-ratio: 16 / 9;}

/*********************
** 웰니스라운지(lounge.php)
*********************/
.loungeBanner{background:url('/img/loungeSubBn.jpg')center center; background-size:cover}

.loungeImg1{background:url('/img/loungeImg-001.jpg')center center }
.loungeImg2{background:url('/img/loungeImg-002.jpg')center center }
.loungeImg{background-size:cover;}

.loungeCnt{overflow: hidden;}


/*********************
** 자료실(/board/dataRoom.php)
*********************/
.dataRoomBanner{background:url('/img/loungeSubBn.jpg')center center; background-size:cover}
.dataRoomList{border-top:1px solid #222}
.dataRoomList td{border-bottom:1px solid #d9dade}


.nextPrevList{border-top:1px solid #d9dade}

/*********************
** 게시판 작성(/page//board/dataWrite.php.php)
*********************/
.boardInput{border:1px solid #D9DADE}
.btnStyleNo{border:1px solid #b8bac1; cursor: pointer;}


/*********************
** 자료실(/page/form/inquiry.php)
*********************/
.inquiryBanner{background:url('/img/inquirySubBn.jpg')center center; background-size:cover}
#policy + label .policyBox{background:url('/img/chkOff.svg')center center no-repeat; background-size:cover}
#policy:checked + label .policyBox{background:url('/img/chkOn.svg')center center no-repeat; background-size:cover}



.loginBg{background:url('/img/mainBg.jpg')center center; background-size:cover}
.onlineLists td, .onlineLists th{border:1px solid #b8bac1}