@charset "utf-8";
/* *******************************************************
 * filename : content.css
 * description : 서브페이지 컨텐츠 CSS
 * date : 2022-03-14
******************************************************** */

/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
.custom-scrollbar-cover,
.cm-scroll-drag-guide{display:none;}

/* -------- 공통 :: 탭 -------- */
/* Tab 공통 스타일 */
.sub-tab-wrapper-con{display: flex; align-items:flex-start;}
.sub-tab-wrapper-style{position:sticky !important; top:4rem; padding:1rem; box-sizing:border-box; background:rgba(255,255,255,0.03); border-radius:2.4rem; overflow:hidden; }
@media (min-width:801px){
	#wrap.scroll-down .sub-tab-wrapper-style {top:4rem; transition: opacity 0.8s ease-in-out, filter 0.8s ease-in-out, top 0.8s cubic-bezier(0.4, 0, 0.2, 1);}
	#wrap:not(.scroll-down) .sub-tab-wrapper-style {top: var(--header-height); transition: opacity 0.8s ease-in-out, filter 0.8s ease-in-out, top 0.8s cubic-bezier(0.4, 0, 0.2, 1);}
}
.sub-tab-list-style{position: relative;}
.sub-tab-list-style ul{margin:-1rem 0;}
.sub-tab-list-style ul li{margin:1rem 0;}
.sub-tab-list-style ul li a{display: flex; align-items:center; justify-content:center; width:16rem; height:5rem; border-radius:1.6rem; overflow:hidden;}
.sub-tab-list-style ul li a .liquid-effect{border-radius:1.6rem;}
.sub-tab-list-style ul li a em{position: relative; font-size:1.4rem; letter-spacing:-0.02em; color:#fff; font-weight:700;}
.sub-tab-list-style ul li.selected a:not(.cm-btn-full){background:#fff;}
.sub-tab-list-style ul li.selected a .liquid-effect{opacity:0;}
.sub-tab-list-style ul li.selected a em{color:#000; }

/* Tab 채워지는 효과 */
.sub-tab-list-style ul li a.cm-btn-full .cm-fill{left:50% !important; }
.sub-tab-list-style ul li a.cm-btn-full:hover em{color:#000;}
.sub-tab-list-style ul li.selected a.cm-btn-full .cm-fill{width:20vw; height:20vw;}

.sub-tab-list-style ul li.below a.cm-btn-full .cm-fill{top:0; bottom:auto; transform:translate(-50%, -50%);}
.sub-tab-list-style ul li.above a.cm-btn-full .cm-fill{bottom:0; top:auto; transform:translate(-50%, 50%);}

/* 테두리 각도 변경 */
.sub-tab-list-style ul li a.border-gradient::before{background: linear-gradient(160deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.01) 40%, rgba(255, 255, 255, 0.01) 60%, rgba(255, 255, 255, 0.15) 100%);}

/* Mobile Tab Drop Menu */
.sub-drop-open-btn-style{display:none}


/* -------- 공통 :: 커스텀 셀렉트 -------- */
.gs-custom-selectbox {position: relative; display: inline-block;}
.gs-custom-selectbox select {display: none;}
.gs-custom-selectbox .select-style {width: 100%; height:100%; text-align: left; vertical-align: middle; border:0; display: flex; align-items: center; box-sizing: border-box; cursor: pointer;}
.gs-custom-selectbox .select-style span {display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.gs-custom-selectbox .select-style:after {font-family: 'xeicon'; position: absolute; top: 50%; right: 1.5rem; transform: translateY(-50%); content: "\e942"; font-size: 2rem; color: #000;}
.gs-custom-selectbox .select-options {position: absolute; z-index: 1; top: 100%; left: 0; display: none; width: 100%; margin-top: 0.5rem; padding: 0; list-style: none; background-color: #fff; border: 2px solid #ddd; border-radius: 1rem; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; max-height: 23rem;}
.gs-custom-selectbox .select-options li {padding: 1.2rem 1.5rem; font-size: 1.4rem; color: #666; cursor: pointer;}
.gs-custom-selectbox .select-options li:hover,
.gs-custom-selectbox .select-options li.is-selected{background-color: #f5f5f5;}
.gs-custom-bg {position: absolute; top: 0;  left: 0; width: 100%;  height: 100%; transition: var(--transition-custom); border-radius: inherit; box-sizing: border-box;}
/* open */
.gs-custom-selectbox.open .select-options {display: block;}
.gs-custom-selectbox.open .select-style:after{content: "\e945";}
/* 비활성화 */
.gs-custom-selectbox.is-disabled .select-style {background-color: #f5f5f5; cursor: auto; color: rgba(51,51,51,0.4);}
.gs-custom-selectbox.is-disabled .select-style span{text-decoration: line-through;}
.gs-custom-selectbox.is-disabled { pointer-events:none; }
/* 스크롤(사용 안해도됨.) */
html:not(.is-mobile) .gs-custom-selectbox .select-options::-webkit-scrollbar {width: 7px; border-radius: 7rem; }
html:not(.is-mobile) .gs-custom-selectbox .select-options::-webkit-scrollbar-track{border-radius: 7rem; background:#fff;}
html:not(.is-mobile) .gs-custom-selectbox .select-options::-webkit-scrollbar-thumb{border-radius: 7rem; background:#f5f5f5}

/* 카테고리 셀렉트 (모바일 swiper 슬라이드 변경) */
.category-selectbox{width:20rem; height:5.6rem; background:#f5f5f5; border-radius:1rem; padding:0 2.4rem; box-sizing:border-box;}
.category-selectbox .select-style span{font-size:1.6rem; letter-spacing:-0.04em; color:#000; font-weight:500;}

.category-selectbox .select-options{height:auto;}

@media all and (max-width:800px){
	.category-selectbox{width:100%; height:4.8rem;}
	
	.category-selectbox{background:transparent; padding:0; height:auto;}
	.category-selectbox:before{position: absolute; content:''; top:100%; left:50%; transform:translateX(-50%); width:100vw; height:1px; background:rgba(0,0,0,0.1); box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.07);}
	.category-selectbox .select-style{display: none;}
	.category-selectbox .select-options{display: flex; position: relative; top:auto; margin-top:0; border:0; border-radius:0; overflow: auto;}
	.category-selectbox .select-options *::-webkit-scrollbar { width: 0px; height: 0px; }
	.category-selectbox .select-options li{position: relative; background:transparent !important; padding:1.5rem 2rem; box-sizing:border-box; color:rgba(0,0,0,0.3); transition:var(--transition-custom); text-align:center; white-space:nowrap;}
	.category-selectbox .select-options li:before{position: absolute; content:''; width:0; height:3px; background:#000; bottom:0; left:50%; transition:var(--transition-custom);}
	.category-selectbox .select-options li.is-selected{color:#000;}
	.category-selectbox .select-options li.is-selected:before{width:100%; left:0;}
	
	.category-selectbox .select-options.count-1 li{width:100%;}
	.category-selectbox .select-options.count-2 li{width:50%;}
	.category-selectbox .select-options.count-3 li{width:33.33%;}
	.category-selectbox .select-options.count-4 li{width:25%;}
	
	.board-left-box:has(.count-more){margin:0 calc(-1 * var(--area-padding));}
	.category-selectbox .select-options.count-more li:first-child{margin-left:var(--area-padding);}
}

/* -------- 공통 :: 상단 타이틀 -------- */
.cm-sub-top-box{margin-bottom:5rem;}
.cm-sub-tit {font-size:4.8rem; line-height:1.4; letter-spacing:-0.04em; color:#000; font-weight:700; text-align:center;}
.cm-sub-txt01 {font-size: 2.8rem; font-weight: 700; letter-spacing:-0.04em; color:#000; line-height: 1.6; text-align: center; margin-top: 6rem;}
.cm-sub-txt01 b {font-weight: inherit; color: var(--main-color);}
.cm-sub-txt02 {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(0,0,0,0.6); line-height: 1.8; font-weight: 500; margin-top: 2.4rem; text-align: center;}
.cm-sub-top-box.white-ver .cm-sub-tit  {color: #fff;}
.cm-sub-top-box.white-ver .cm-sub-txt02  {color: rgba(255,255,255,0.6);}

@media all and (max-width:800px){
	.cm-sub-top-box{margin-bottom:4rem;}
	.cm-sub-tit{font-size:3.2rem;}
}

.sub-wrap .main-inquiry-scroll .main-inquiry-bg span img {top: -15%;}

/* ****************** 
 * Product
 ********************** */
/* ********* 제품 비주얼 레이아웃 ********* */
#visual.sub-visual-products,
#visual.sub-visual-industries {height: var(--sub-prd-visual-height);}
#visual.sub-visual-products .table-cell-layout,
#visual.sub-visual-industries .table-cell-layout {    vertical-align: bottom;}
#visual.sub-visual-products .visual-tit,
#visual.sub-visual-industries .visual-tit {font-size:4.8rem; letter-spacing:-0.02em; color:#fff; font-weight:700; }

/* ********* 제품 상단 배경 ********* */
.prd-top-bg{position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100%;}
.prd-top-bg img{width:100%;}

.prd-con-wrapper{position: relative; padding-bottom:16rem;}
/* ********* 제품 상단 검색창 ********* */
.prd-top-box{display: flex; justify-content:space-between; align-items:center; padding:1.5rem 0; border-bottom:1px solid rgba(255,255,255,0.2); margin-bottom:4rem;}
.prd-top-box .total-box{white-space: nowrap;}
.prd-top-box .total-box .total{font-size:1.6rem; letter-spacing:-0.02em; color:#fff; font-weight:600;}
.prd-top-box .search-box{display: flex; align-items:center;}
.prd-top-box .search-box .search-filter-btn {width: 13.5rem; height: 4rem; display: flex; align-items: center; justify-content: space-between; padding: 0 1.8rem; border: 1px solid #fff; border-radius: 2rem; box-sizing: border-box; margin-right: 4rem; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.02em; color: #fff;}
.prd-top-box .search-box .search-filter-btn i {font-size: 2rem; font-weight: 400;}

.prd-top-box .search-box .search-txt{font-size:1.4rem; letter-spacing:-0.02em; color:#fff; font-weight:600; padding-right:1.5rem;}
.prd-top-box .search-box .prd-search-inner{position: relative; display: flex; align-items:center; width:34rem; height:4.8rem; padding:0 1.6rem; box-sizing:border-box;}
.prd-top-box .search-box .prd-search-inner:before{position: absolute; content:''; width:1px; height:2.4rem; background:#fff; left:0; top:50%; transform:translateY(-50%);}
.prd-top-box .search-box .prd-search-inner .prd-search-input{background:none; outline:none; border:none; width:calc(100% - 3rem); height:100%; font-size:1.4rem; letter-spacing:-0.02em; color:#fff; font-weight:600;}
.prd-top-box .search-box .prd-search-inner .prd-search-input::placeholder{color:#fff;}
.prd-top-box .search-box .prd-search-inner .prd-search-btn{display: flex; align-items:center; justify-content:center; width:3rem; height:3rem; font-size:2.4rem; color:#fff;}

@media all and (max-width:800px){
	.prd-top-box .search-box .search-filter-btn{margin-right:2rem;}
	.prd-top-box .search-box form{width: calc(100% - 15.5rem);}
	.prd-top-box .search-box .prd-search-inner{padding-right:0;}
}

/* ********* 제품 필터 ********* */
.prd-filter-wrap{position: sticky; top:4rem; width:13.636%; max-width:240px; max-height:calc(100vh - 8rem); z-index:11;}
@media (min-width:801px){
	#wrap.scroll-down .prd-filter-wrap {top:4rem; transition: top 0.8s cubic-bezier(0.4, 0, 0.2, 1);}
	#wrap:not(.scroll-down) .prd-filter-wrap {top: var(--header-height); transition: top 0.8s cubic-bezier(0.4, 0, 0.2, 1);}	
}
.prd-filter-box{position: relative; padding:1rem; border-radius:2.4rem; background:rgba(255,255,255,0.025); overflow:hidden;}
.prd-filter-list{}
.prd-filter-list .filter-item{position: relative; background:rgba(255,255,255,0.03); border-radius:1.6rem; margin-bottom:1rem; transition:var(--transition-custom); overflow:hidden;}

.prd-filter-list .filter-item:last-child{margin-bottom:0;}
.prd-filter-list .filter-item .tit-item{position: relative; display: flex; align-items:center; justify-content:space-between; width:100%; height:6.4rem; padding:1rem 2rem; box-sizing:border-box; cursor:pointer; color:#fff; transition:var(--transition-custom);}
.prd-filter-list .filter-item .tit-item .filter-tit{font-size:1.6rem; letter-spacing:-0.02em; font-weight:700;}
.prd-filter-list .filter-item .tit-item > i{font-size:2.4rem; transition:var(--transition-custom);}

.prd-filter-list .filter-item .inner-list{display: none; position: relative; padding:0 1rem 1rem; box-sizing:border-box; max-height: calc(100vh - 48rem); overflow: auto;}
.prd-filter-list .filter-item .inner-list .liquid-effect{display: none;}
.prd-filter-list .filter-item .inner-list::-webkit-scrollbar { width: 5px; height: 5px; }
.prd-filter-list .filter-item .inner-list::-webkit-scrollbar-track { background-color: #f1f1f1; }
.prd-filter-list .filter-item .inner-list::-webkit-scrollbar-thumb { background-color: #c1c1c1; }

.prd-filter-list .filter-item .inner-list .inner-item{position: relative; background:#eee; border-radius:0.8rem; margin:1rem 0;}
.prd-filter-list .filter-item .inner-list .inner-item input[type="radio"],
.prd-filter-list .filter-item .inner-list .inner-item input[type="checkbox"]{display:none;}
.prd-filter-list .filter-item .inner-list .inner-item .check-item{display: block; width:100%; height:100%; text-align:left; padding:1.5rem 2rem; box-sizing:border-box;}
.prd-filter-list .filter-item .inner-list .inner-item .check-item .check-txt{font-size:1.4rem; letter-spacing:-0.02em; color:#000; font-weight:500;}

.prd-filter-list .filter-item .inner-list .inner-item:first-child{margin-top:0;}
.prd-filter-list .filter-item .inner-list .inner-item:last-child{margin-bottom:0;}
/* filter 타이틀박스 */
.prd-filter-list .filter-item.top-item{background:#000;}
.prd-filter-list .filter-item.top-item .tit-item{ cursor:auto;}
/* filter industry 박스 */
.prd-filter-list .filter-industry-item{padding-top:1.5rem; margin-top:1.5rem; border-top:1px solid rgba(255,255,255,0.1)}
/* filter on */
.prd-filter-list .filter-item.on{background:#fff;}
/* .prd-filter-list .filter-item.on .cm-fill{width: 70vw; height: 70vw; transition: width 0.5s ease-in 0.1s, height 0.5s ease-in 0.1s;} */
.prd-filter-list .filter-item.on .tit-item{color:#000; /* transition-delay:0.3s */}
.prd-filter-list .filter-item.on .tit-item > i{transform:rotate(180deg);}

.cm-btn-full-click{position: relative; overflow: hidden;}
.cm-btn-full-click .cm-fill{position: absolute; display: block; width: 0px; height: 0px; transform: translate(-50%, -50%); border-radius: 50%; background: #fff; transition: width 0.5s ease-out, height 0.5s ease-out;}

/* filter button on */
.prd-filter-list .filter-item .inner-list .inner-item .check-item svg{ position:absolute; inset:0; left: -2px; width:calc(100% + 2px); height:100%; }
.prd-filter-list .filter-item .inner-list .inner-item .check-item rect{ fill:none; stroke:#000; stroke-width:2; vector-effect: non-scaling-stroke; stroke-dasharray:225; stroke-dashoffset:225; transition:stroke-dashoffset 0.4s ease;}
.prd-filter-list .filter-item .inner-list .inner-item .check-item.active rect,
.prd-filter-list .filter-item .inner-list .inner-item input[type="radio"]:checked + .check-item rect,
.prd-filter-list .filter-item .inner-list .inner-item input[type="checkbox"]:checked + .check-item rect{ stroke-dashoffset:0; transition-duration:0.8s}

@keyframes draw{
	to{
		stroke-dashoffset:0;
	}
}

/* ********* 제품 리스트 ********* */
.prd-list-wrapper{display: flex; justify-content:space-between; align-items:flex-start; }
.prd-list-wrap{display: flex; flex-wrap:wrap; margin:-2rem; width:calc(82.955% + 4rem);}
.prd-list-wrap .list-item{position: relative; width:calc(33% - 4rem); margin:2rem; border-radius:2.4rem; background:rgba(255,255,255,0.025); overflow:hidden; opacity:0; transform:translateY(50px); filter: blur(10px); animation:prdFadeUp .8s forwards;}
.prd-list-wrap .list-item a{position: relative; display: block; height: 100%; z-index:9;}
.prd-list-wrap .list-item .img-box{}
.prd-list-wrap .list-item .img-box span{position: relative; display: block; width:100%; height:0; padding-top:50%;}
.prd-list-wrap .list-item .img-box span img{position: absolute; inset:0; max-width:100%; max-height:100%; object-fit:cover; margin:auto;}
.prd-list-wrap .list-item .txt-box{margin:0 2rem 2rem; border-top:1px solid rgba(255,255,255,0.1); padding-top:2.2rem;}
.prd-list-wrap .list-item .txt-box .prd-category{display: block;font-size:1.4rem; letter-spacing:-0.02em; color:#fff; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.prd-list-wrap .list-item .txt-box .prd-tit{font-size:3.2rem; letter-spacing:-0.02em; color:#fff; font-weight:700; margin-top:1rem;}

.prd-more-wrap{position: relative; margin:6.5rem auto 0;}
.prd-more-wrap:before{position: absolute; content:''; width:100%; height:1px; background:rgba(255,255,255,0.2); top:50%; left:0; z-index:1;}
.prd-more-wrap .more-btn{position: relative; display: flex; align-items:center; justify-content:space-between; width:24rem; height:6.4rem; border-radius:3.2rem; padding:0 3.5rem; box-sizing:border-box; margin:auto; z-index:2; background:rgba(255,255,255,0.05); overflow:hidden;}
.prd-more-wrap .more-btn .txt{position: relative; font-size:1.8rem; letter-spacing:-0.02em; color:#fff; font-weight:700;}
.prd-more-wrap .more-btn i{position: relative; font-size:2.4rem; color:#fff;}
.prd-more-wrap .more-btn .loading-icon{display: none;}
.prd-more-wrap .more-btn .loading-icon{ animation: rotate-loading 1.5s linear infinite; }
@keyframes rotate-loading {
	to { transform: rotate(360deg); }
}
/* loading */
.prd-loading.prd-more-wrap .more-btn{justify-content:center;}
.prd-loading.prd-more-wrap .more-btn .txt,
.prd-loading.prd-more-wrap .more-btn .xi-plus{display: none;}
.prd-loading.prd-more-wrap .more-btn .loading-icon{display: block;}

@keyframes prdFadeUp{
	to{
		opacity:1;
		transform:translateY(0);
		filter: blur(0px);
	}
}

/* ********* 제품 뷰페이지 ********* */
/* 뷰페이지 상단 :: 위치정보 */
.prd-location-box{display: flex;}
.prd-location-box span{position: relative; font-size:1.6rem; line-height:1.3; letter-spacing:-0.02em; color:#fff; font-weight:500; padding-right:2rem; margin-right:2rem;}
.prd-location-box span a{color:inherit;}
.prd-location-box span:before{position: absolute; content:'\e93f'; font-family:'xeicon'; font-size:2.4rem; line-height:0.8; right:0; top:0; transform:translateX(50%);}
.prd-location-box span:last-child{padding-right:0; margin-right:0;}
.prd-location-box span:last-child:before{display: none;}

.prd-top-inner-box .prd-location-box{margin-top:1.5rem;}

/* 뷰페이지 상단 :: 우측 버튼 */
.prd-view-btn-box{display: flex; justify-content:space-between; align-items:center; width:19rem; height:5rem; border-radius:5rem;}
.prd-view-btn-box a{position: relative; font-size:2.4rem; color:#fff; padding:1.5rem; box-sizing:border-box;}
.prd-view-btn-box a:nth-of-type(1):before{position: absolute; content:''; width:1px; height:2.4rem; background:rgba(255,255,255,0.2); top:50%; right:0; transform:translateY(-50%);}
.prd-view-btn-box a:nth-of-type(3):before{position: absolute; content:''; width:1px; height:2.4rem; background:rgba(255,255,255,0.2); top:50%; left:0; transform:translateY(-50%);}
/* 뷰페이지 상단 :: 정보 */
.prd-view-top-con{display: flex; align-items:center; justify-content:space-between; padding-bottom:12rem; margin-bottom:12rem; border-bottom:1px solid rgba(255,255,255,0.1);}
.prd-top-info{width:50%;}
.prd-top-info .category{display: block; font-size:1.8rem; line-height:1; letter-spacing:-0.02em; color:var(--main-color); font-weight:700; margin-bottom:1.5rem;}
.prd-top-info .tit{font-size:12rem; line-height:1; letter-spacing:-0.02em; color:#fff; font-weight:700; margin-bottom:4rem;}
.prd-top-info .txt{font-size:2.4rem; line-height:1.6; letter-spacing:-0.02em; color:#fff; font-weight:700;}
.prd-top-info .prd-top-btn-box{display: flex; margin:5.5rem -1rem 0;}
.prd-top-info .prd-top-btn-box .prd-view-btn{display: flex; align-items:center; justify-content:center; width:calc(50% - 2rem); max-width:24rem; height:6.4rem; border-radius:6.4rem; font-size:1.6rem; letter-spacing:-0.02em; color:#fff; font-weight:700; overflow:hidden; margin:0 1rem;}
.prd-top-info .prd-top-btn-box .prd-view-btn em{position: relative;}
.prd-top-info .prd-top-btn-box .prd-view-btn:first-child{background:var(--main-color);}
.prd-top-info .prd-top-btn-box .prd-view-btn:last-child{background:rgba(255,255,255,0.03);}
/* 뷰페이지 상단 :: 이미지 슬라이드 */
.prd-top-img{position: relative; width:45.455%; max-width:600px; max-height:600px; border-radius:2.4rem; background:rgba(255,255,255,0.02);}
.prd-top-img .prd-img-slide{position: relative;}
.prd-top-img .prd-img-slide img{width:100%;}

.prd-top-img .prd-top-img-dots{position: absolute; bottom:4rem; left:4rem; z-index:9;}
.prd-top-img .prd-top-img-dots ul{display: flex; margin:0 -1.5rem;}
.prd-top-img .prd-top-img-dots ul li{width:1rem; height:1rem; border-radius:50%; background:rgba(255,255,255,0.25); font-size:0; text-indent:-9999px; margin:0 1.5rem; transition:var(--transition-custom); cursor:pointer;}
.prd-top-img .prd-top-img-dots ul li.slick-active{background:#fff;}

.prd-top-img .prd-top-img-num{position: absolute; bottom:4rem; right:4rem; z-index:9;}
.prd-top-img .prd-top-img-num span{font-size:2.4rem; letter-spacing:-0.02em; color:#fff; font-weight:500;}

/* 뷰페이지 컨텐츠 */
.prd-view-wrapper .sub-tab-wrapper-con{display: flex; justify-content:space-between; align-items:flex-start;}
.prd-view-content-style{width:77.27%; max-width:1020px;}
/* 뷰페이지 :: 공용 텍스트 */
.prd-view-con{margin-bottom:12rem;}
.prd-view-con .prd-view-tit{font-size:3.2rem; letter-spacing:-0.02em; color:#fff; font-weight:700;}
.prd-view-con .prd-view-txt{font-size:1.8rem; line-height:1.6; letter-spacing:-0.02em; color:#fff;}
/* 뷰페이지 :: 텍스트박스 */
.prd-view-tit-box{margin-bottom:4rem;}
.prd-view-tit-box .prd-view-tit{margin-bottom:2rem;}
.prd-view-tit-box .prd-view-txt{margin-bottom:4rem;}
/* 뷰페이지 :: 테이블 */
.prd-view-con .prd-view-table{border-top:1px solid #fff; width:100%;}
.prd-view-con .prd-view-table tr th,
.prd-view-con .prd-view-table tr td{border-bottom:1px solid rgba(255,255,255,0.15); padding:4rem 2rem; box-sizing:border-box; vertical-align: top; text-align: left;}
/* 뷰페이지 :: 다운로드 */
.prd-view-download-list{}
.prd-view-download-list .list-item{display: flex; align-items:center; justify-content:space-between; margin-bottom:1.6rem; border-radius:2.4rem; background:rgba(255,255,255,0.02); padding:4rem 4rem 4rem 6rem; box-sizing:border-box;}
.prd-view-download-list .list-item:last-child{margin-bottom:0rem;}
.prd-view-download-list .list-item .tit{position: relative; width:calc(100% - 45rem); font-size:2.4rem; letter-spacing:-0.02em; color:#fff; font-weight:700;}
.prd-view-download-list .list-item .btn-box{display: flex; margin:0 -0.5rem;}
.prd-view-download-list .list-item .btn-box .btn{display: flex; align-items:center; justify-content:space-between; width:20rem; height:6.4rem; border-radius:1.6rem; padding:1rem 2rem; box-sizing:border-box; background:rgba(255,255,255,0.02); overflow:hidden; margin:0 0.5rem;}
.prd-view-download-list .list-item .btn-box .btn .txt{position: relative; font-size:1.6rem; letter-spacing:-0.02em; color:#fff; font-weight:700;}
.prd-view-download-list .list-item .btn-box .btn i{position: relative; font-size:2.4rem; color:#fff;}
/* 뷰페이지 :: 인증서 */
.prd-view-certi-list{display: block;}
.prd-view-certi-list .list-item{display: flex;  align-items: center; justify-content: space-between; width:100%; margin-bottom: 1rem; padding:4rem 5rem; box-sizing:border-box; border-radius:2.4rem; background:rgba(255,255,255,0.02)}
.prd-view-certi-list .list-item .img-box{position: relative;z-index: 1;}
.prd-view-certi-list .list-item .img-box span{display: block; position: relative; width:100%; height:0; padding-top:140.51%; border-radius:1.6rem; overflow:hidden;}
.prd-view-certi-list .list-item .img-box span img{position: absolute; inset:0; max-width:100%; max-height:100%; object-fit:cover; margin:auto;}
 
.prd-view-certi-list .list-item .icon-box {position: relative; z-index: 1; width: 7.2rem;  height: 7.2rem; border: 1px solid rgba(0, 0, 0, 0.15); box-sizing: border-box; border-radius: 50%;background: #fff;}
.prd-view-certi-list .list-item .icon-box span {display: block;position: relative;width: 100%; height: 0; padding-top: 100%;}
.prd-view-certi-list .list-item .icon-box span img {position: absolute; inset: 0;  max-width: 100%;  max-height: 100%; object-fit: cover; margin: auto;}
.prd-view-certi-list .list-item .icon-box + .txt-box {width: calc(100% - 17.2rem); padding: 3rem; box-sizing: border-box;}
.prd-view-certi-list .list-item .txt-box {position: relative; z-index: 1;}
.prd-view-certi-list .list-item .txt-box .category {display: block; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.04em; color: var(--main-color); margin-bottom: 1rem;}
.prd-view-certi-list .list-item .txt-box .tit {font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; overflow: hidden;  text-overflow: ellipsis; white-space: nowrap;} 
.prd-view-certi-list .list-item .btn-box{position: relative; z-index: 1;  width: 10.2rem; margin: -0.5rem 0;}
.prd-view-certi-list .list-item .btn-box .btn {display: flex; align-items:center; justify-content:center; width:100%; height:4rem; border-radius:0.8rem; font-size:2rem; color:#fff;  background:rgba(255,255,255,0.02); overflow:hidden; margin: 0.5rem 0;}
.prd-view-certi-list .list-item .btn-box .btn i{position: relative;}


/* 유리질감 효과 */
.liquid-effect{position: absolute; inset:0; overflow: hidden; z-index: 0; isolation: isolate; backdrop-filter: blur(7px); filter: url(#glass-distortion);}
/* 테두리 그라데이션 */
.border-gradient{position:relative; overflow: hidden;}
.border-gradient::before{ content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; z-index:9; pointer-events:none;
	background: linear-gradient( 135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.01) 40%, rgba(255,255,255,0.01) 60%, rgba(255,255,255,0.15) 100% );
	-webkit-mask:
	linear-gradient(#000 0 0) content-box,
	linear-gradient(#000 0 0);
	-webkit-mask-composite:xor;
	mask-composite:exclude;
}
@property --angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}
.border-gradient::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px; /* 테두리 두께 */
  z-index: 10;
  pointer-events: none;

  /* 2. conic-gradient로 변경하고 변수 적용 */
  background: conic-gradient(
    from var(--angle),
    transparent 0%,
    rgba(255, 255, 255, 0.5) 15%,
    transparent 30%
  );

  /* 기존 마스크 로직 유지 */
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;

  /* 3. 애니메이션 실행 */
  animation: rotate-gradient 3s linear infinite;
  opacity: 0;
  transition: opacity 0.3s;
}

@keyframes rotate-gradient {
  to {
    --angle: 360deg;
  }
}
.border-gradient:hover::after {opacity: 1;}


/* ********* 제품 뷰페이지 ********* */
@media all and (max-width:1280px){
	/* 뷰페이지 :: 인증서 */
	.prd-view-certi-list .list-item{padding:3rem;}
}
@media all and (max-width:800px){
	/* 뷰페이지 상단 :: 위치정보 */	
	.prd-location-box{width:calc(100% - 14rem); flex-wrap:wrap;}
	.prd-location-box span{font-size:1.2rem; padding-right:1rem; margin-right:1rem;}
	.prd-location-box span:before{font-size:2rem;}
	
	.prd-top-inner-box{width:100%;}
	.prd-top-inner-box .prd-location-box{width:100%;}
	
	/* 뷰페이지 상단 :: 우측 버튼 */
	.prd-view-btn-box{width:12rem; height:4rem;}
	.prd-view-btn-box a{font-size:2rem; padding:1rem;}
	.prd-view-btn-box a:nth-of-type(1):before{height:2rem;}
	.prd-view-btn-box a:nth-of-type(3):before{height:2rem;}
	/* 뷰페이지 상단 :: 정보 */
	.prd-view-top-con{display: block; padding-bottom:8rem; margin-bottom:8rem;}
	.prd-top-info{width:100%; margin-bottom:4rem;}
	.prd-top-info .category{font-size:1.6rem; margin-bottom:1rem;}
	.prd-top-info .tit{font-size:6rem; margin-bottom:2rem;}
	.prd-top-info .txt{font-size:2rem;}
	.prd-top-info .prd-top-btn-box{margin:3rem -0.5rem 0;}
	.prd-top-info .prd-top-btn-box .prd-view-btn{width:calc(50% - 1rem); max-width:20rem; height:4rem; font-size:1.4rem; margin:0 0.5rem;}
	/* 뷰페이지 상단 :: 이미지 슬라이드 */
	.prd-top-img{width:100%; max-width:760px; max-height:760px; margin:auto;}

	.prd-top-img .prd-top-img-dots{bottom:2rem; left:2rem;}
	.prd-top-img .prd-top-img-dots ul{margin:0 -1rem;}
	.prd-top-img .prd-top-img-dots ul li{width:0.8rem; height:0.8rem; margin:0 1rem;}

	.prd-top-img .prd-top-img-num{bottom:2rem; right:2rem;}
	.prd-top-img .prd-top-img-num span{font-size:2rem;}
	
	
	/* 뷰페이지 컨텐츠 */
	.prd-view-wrapper .sub-tab-wrapper-con{display: block;}
	.prd-view-content-style{width:100%;}
	/* 뷰페이지 :: 공용 텍스트 */
	.prd-view-con{margin-bottom:8rem;}
	.sub-tab-con:last-child .prd-view-con{margin-bottom:0rem;}
	.prd-view-con .prd-view-tit{font-size:2.4rem;}
	.prd-view-con .prd-view-txt{font-size:1.4rem;}
	/* 뷰페이지 :: 텍스트박스 */
	.prd-view-tit-box{margin-bottom:2rem;}
	.prd-view-tit-box .prd-view-tit{margin-bottom:1rem;}
	.prd-view-tit-box .prd-view-txt{margin-bottom:2rem;}
	/* 뷰페이지 :: 테이블 */
	.prd-view-con .prd-view-table tr th,
	.prd-view-con .prd-view-table tr td{padding:2rem 1rem;}
	/* 뷰페이지 :: 다운로드 */
	.prd-view-download-list{}
	.prd-view-download-list .list-item{display: block; margin-bottom:1rem; padding:2rem 2rem 2rem 3rem;}
	.prd-view-download-list .list-item .tit{width:100%; font-size:2rem; margin-bottom:2rem;}
	.prd-view-download-list .list-item .btn-box .btn{width:calc(50% - 1rem); height:4.5rem; padding:1rem 1.5rem; border-radius:0.8rem;}
	.prd-view-download-list .list-item .btn-box .btn .txt{font-size:1.4rem;}
	.prd-view-download-list .list-item .btn-box .btn i{font-size:2rem;}
	/* 뷰페이지 :: 인증서 */
	.prd-view-certi-list .list-item {flex-wrap: wrap; padding: 3.6rem var(--area-padding); }
	.prd-view-certi-list .list-item .icon-box { width: 6.4rem;height: 6.4rem;}
	.prd-view-certi-list .list-item .icon-box + .txt-box {width: calc(100% - 6.4rem); padding-left: 1.5rem;}
	.prd-view-certi-list .list-item .btn-box {width: 100%; display: flex; justify-content:space-between}
	.prd-view-certi-list .list-item .btn-box .btn {width: calc(50% - 0.5rem);}
}
@media all and (max-width:480px){
	.prd-location-box{width:100%; margin-top:2rem;}
}


/* ****************** 
 * Download
 ********************** */
/* 게시판 공통 :: 상단 검색창 */
.cm-board-top-wrapper{position: relative; display: flex; align-items:center; justify-content:space-between; margin-bottom:4rem; z-index:99;}

/* 게시판 공통 :: 총 갯수 */
.cm-total{font-size:1.6rem; letter-spacing:-0.04em; color:#333; font-weight:700;}
.cm-total span{color:var(--main-color); font-weight:600;}

@media all and (max-width:800px){
	.cm-board-top-wrapper{display: flex; flex-direction:column-reverse; align-items: normal; margin-bottom:0;}
	
	.cm-total{display: none;}
}


/* Download :: 갤러리 게시판 */
.download-gallery-wrapper{border-top:1px solid #000; border-bottom:1px solid #000; padding:4rem 0 8rem;}
.download-gallery-list{display: flex; flex-wrap:wrap; margin:-4rem -2rem;}
.download-gallery-list .list-item{width:calc(25% - 4rem); margin:4rem 2rem;}
.download-gallery-list .list-item .img-box{width:100%;}
.download-gallery-list .list-item .img-box .inner-box{position: relative; display: block; width:100%; height:0; padding-top:120%; background:#f5f5f5; border-radius:1rem;}
.download-gallery-list .list-item .img-box .inner-box .inner-img{position: absolute; top:0; left:0; width:100%; height:100%; display: block; padding:6rem; box-sizing:border-box; }
.download-gallery-list .list-item .img-box .inner-box .inner-img img{position: absolute; inset:0; max-width:100%; max-height:100%; object-fit:cover; margin: auto; filter: drop-shadow(59px 87px 42px rgba(0, 0, 0, 0.01)) drop-shadow(33px 49px 36px rgba(0, 0, 0, 0.05)) drop-shadow(15px 22px 26px rgba(0, 0, 0, 0.09)) drop-shadow(4px 5px 14px rgba(0, 0, 0, 0.1)); padding:6rem; box-sizing:border-box; transition:var(--transition-custom);}

.download-gallery-list .list-item .img-box .inner-box svg{ position:absolute; inset:-2px; width:calc(100% + 4px); height:calc(100% + 4px); pointer-events:none;}
.download-gallery-list .list-item .img-box .inner-box rect{ fill:none; stroke:var(--main-color); stroke-width:2; vector-effect: non-scaling-stroke; stroke-dasharray:370; stroke-dashoffset:370; transition:stroke-dashoffset 0.4s ease;}

.download-gallery-list .list-item .img-box .inner-box .hover-box{position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); opacity:0; transition:var(--transition-custom);}
.download-gallery-list .list-item .img-box .inner-box .hover-box .hover-btn{display: flex; align-items:center; justify-content:space-between; width:14rem; height:4rem; border-radius:2rem; color:#fff; padding:0.5rem 2rem; box-sizing:border-box; margin:0.6rem 0;}
.download-gallery-list .list-item .img-box .inner-box .hover-box .hover-btn span{font-size:1.4rem; letter-spacing:-0.04em; font-weight:500;}
.download-gallery-list .list-item .img-box .inner-box .hover-box .hover-btn i{font-size:1.8rem;}
.download-gallery-list .list-item .img-box .inner-box .hover-box .hover-btn.preview{background:#000;}
.download-gallery-list .list-item .img-box .inner-box .hover-box .hover-btn.download{background:var(--main-color);}

.download-gallery-list .list-item .txt-box{text-align:center; margin-top:2.5rem;}
.download-gallery-list .list-item .txt-box .category{display: block; font-size:1.6rem; letter-spacing:-0.04em; color:var(--main-color); font-weight:700;}
.download-gallery-list .list-item .txt-box .tit{font-size:2.4rem; letter-spacing:-0.04em; color:#000; font-weight:700; margin-top:1rem;}

/* hover */
.download-gallery-list .list-item .img-box .inner-box:hover .inner-img img{filter:drop-shadow(59px 87px 42px rgba(0, 0, 0, 0.01)) drop-shadow(33px 49px 36px rgba(0, 0, 0, 0.05)) drop-shadow(15px 22px 26px rgba(0, 0, 0, 0.09)) drop-shadow(4px 5px 14px rgba(0, 0, 0, 0.1)) blur(5px) grayscale(1);}
.download-gallery-list .list-item .img-box .inner-box:hover rect{ stroke-dashoffset:0; transition-duration:0.8s}
.download-gallery-list .list-item .img-box .inner-box:hover .hover-box{opacity:1;}

@media all and (max-width:1280px){
	.download-gallery-list .list-item .img-box .inner-box .inner-img{padding:3rem;}
	.download-gallery-list .list-item .img-box .inner-box .inner-img img{padding:3rem;} 
}
@media all and (max-width:800px){
	.download-gallery-wrapper{border-top:0;}
	.download-gallery-list{margin:-2rem -0.8rem;}
	.download-gallery-list .list-item{width:calc(50% - 1.6rem); margin:2rem 0.8rem;}
	.download-gallery-list .list-item .img-box .inner-box{padding-top:140.35%;}
	
	.download-gallery-list .list-item.img-box .inner-box svg{inset: -1px; width: calc(100% + 2px); height: calc(100% + 2px);}
	
	.download-gallery-list .list-item .img-box .inner-box .inner-img{padding:0rem; border-radius:0.6rem; overflow:hidden;}
	.download-gallery-list .list-item .img-box .inner-box .inner-img img{padding:0rem; max-width:none; max-height:none; width:100%; height:100%; box-shadow:none;}
	
	.download-gallery-list .list-item .txt-box{margin-top:1.5rem;}
	.download-gallery-list .list-item .txt-box .category{font-size:1.2rem;}
	.download-gallery-list .list-item .txt-box .tit{font-size:1.8rem;}
}


/* PQ :: 리스트 게시판 */
.cm-board-wrapper{border-top:1px solid #000; border-bottom:1px solid #000;}
.cm-board-list{}
.cm-board-list .list-item{display: flex; align-items:center; justify-content:space-between; padding:3.5rem 5.5rem; box-sizing:border-box; border-bottom:1px solid rgba(0,0,0,0.2); transition:var(--transition-custom);}
.cm-board-list .list-item:last-child{border-bottom:0;}
.cm-board-list .list-item .txt-box{width:calc(100% - 16rem); padding-right:2rem; box-sizing:border-box;}
.cm-board-list .list-item .txt-box .category{display: block; font-size:1.6rem; letter-spacing:-0.04em; font-weight:700; color:var(--main-color); margin-bottom:1rem;}
.cm-board-list .list-item .txt-box .tit{font-size:2.4rem; letter-spacing:-0.04em; font-weight:700; color:#000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.cm-board-list .list-item .txt-box .date{font-size:1.6rem; letter-spacing:-0.04em; font-weight:500; color:#777; margin-top:1rem;}
.cm-board-list .list-item .btn-box{width:16rem;}
.cm-board-list .list-item .btn-box .btn{display: flex; align-items:center; justify-content:space-between; width:16rem; height:4rem; border-radius:2rem; background:#f5f5f5; padding:0 2rem; box-sizing:border-box; color:rgba(0,0,0,0.6); margin:0.6rem 0; transition:var(--transition-custom);}
.cm-board-list .list-item .btn-box .btn span{font-size:1.4rem; letter-spacing:-0.04em; font-weight:500;}
.cm-board-list .list-item .btn-box .btn i{font-size:1.8rem; }

/* 아이콘이 있을 때 (Certificate 페이지) */
.cm-board-list .list-item .icon-box{width:7.2rem; height:7.2rem; border:1px solid rgba(0,0,0,0.15); box-sizing:border-box; border-radius:50%; background:#fff;}
.cm-board-list .list-item .icon-box span{display: block; position: relative; width:100%; height:0; padding-top:100%;}
.cm-board-list .list-item .icon-box span img{position: absolute; inset:0; max-width:100%; max-height:100%; object-fit:cover; margin:auto;}
.cm-board-list .list-item .icon-box + .txt-box{width:calc(100% - 23.2rem); padding-left:3rem;}


/* 인증 카테고리 리스트 */
.select-category-wrap{position: relative; margin:4rem 0; display: flex;}
.select-category-list{width:calc(100% - 9rem); margin-left: 0;}
.select-category-list .list-item{width:auto;}
.select-category-list .list-item button{text-align:center;}
.select-category-list .list-item:last-child button{margin-right:2rem;}
.select-category-list .list-item button .icon-box{position: relative; display: block; width:6.4rem; height:6.4rem; border-radius:50%; background:#f5f5f5;}
.select-category-list .list-item button .icon-box img{position: absolute; inset:0; max-width:80%; max-height:80%; object-fit:cover; margin:auto;}
.select-category-list .list-item button .txt{font-size:1.4rem; letter-spacing:-0.02em; color:#000; font-weight:600; margin-top:0.7rem;}

.select-category-wrap .category-btn-box{position: relative; width:9rem; display: flex; align-items:center; justify-content: flex-end; z-index:99;}
.select-category-wrap .category-btn-box:before{position: absolute; content:''; width:2px; height:3.2rem; background:rgba(0,0,0,0.1); top:50%; left:0; transform:translateY(-50%);}
.select-category-wrap .category-btn-box:after{position: absolute; content:''; top:0; left:0; transform:translateX(-100%); width:3rem; height:100%; background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);}
.select-category-wrap .category-btn-box .category-button{position: relative; right:-1rem; font-size:3.2rem; color:#000; margin:0 0.2rem;}

@media all and (min-width:801px){
	.cm-board-list .list-item .btn-toggle-box{display: block !important;}
	/* hover */
	.cm-board-list .list-item:hover{background:#f5f5f5;}
	.cm-board-list .list-item:hover .btn-box .btn.preview{background:rgba(0,0,0,0.1); color:#000;}
	.cm-board-list .list-item:hover .btn-box .btn.download{background:rgba(0,0,0,1); color:#fff;}
}
@media all and (max-width:800px){
	.cm-board-wrapper{margin:0 calc(-1 * var(--area-padding)); border-color:rgba(0,0,0,0.05);}
	.cm-board-list .list-item{flex-wrap:wrap; padding:3.6rem var(--area-padding); border-bottom-color:rgba(0,0,0,0.05);}
	.cm-board-list .list-item .txt-box{width:100%;}
	.cm-board-list .list-item .txt-box .tit{font-size:1.8rem;}
	.cm-board-list .list-item .txt-box .date{font-size:1.2rem;}
	.cm-board-list .list-item .btn-toggle-box{display: none; width:100%;}
	.cm-board-list .list-item .btn-wrap {width: 100%;}
	.cm-board-list .list-item .btn-box{display: flex; justify-content: space-between; width:100%; margin-top:3rem;}
	.cm-board-list .list-item .btn-box .btn{width:calc(50% - 3px); height:3.2rem;}
	.cm-board-list .list-item .btn-box .btn span{font-size:1.4rem;}
	.cm-board-list .list-item .btn-box .btn i{font-size:1.6rem;}
	
	/* 모바일 on */
	.cm-board-list .list-item.m-on{background:#f5f5f5;}
	.cm-board-list .list-item.m-on .btn-box .btn.preview{background:rgba(0,0,0,0.1); color:#000;}
	.cm-board-list .list-item.m-on .btn-box .btn.download{background:rgba(0,0,0,1); color:#fff;}
	
	/* 아이콘이 있을 때 (Certificate 페이지) */
	.cm-board-list .list-item .icon-box{width:6.4rem; height:6.4rem;}
	.cm-board-list .list-item .icon-box + .txt-box{width:calc(100% - 6.4rem); padding-left:1.5rem;}
	
	/* 인증 카테고리 리스트 */
	.select-category-wrap{margin:2.4rem calc(-1 * var(--area-padding));}
	.select-category-list{width:100%;}
	.select-category-list .list-item:first-child button{margin-left:var(--area-padding);}
	.select-category-list .list-item:last-child button{margin-right:var(--area-padding);}

	.select-category-wrap .category-btn-box{display: none;}
}



/* ****************** 
 * KOLAS
 ********************** */
/* ********* Overview ********* */
.kolas-overview-con1 {padding: 10rem 0 16rem; background: linear-gradient(180deg, #fff 0%, #F5F5F5 100%);}
.kolas-overview-con1 .cm-sub-top-box {margin-bottom: 6.4rem;}
.kolas-overview-txt {position: relative; display: flex; align-items: center; justify-content: center; margin-top: 4.5rem;}
.kolas-overview-txt:before {position: absolute; content: ''; width: 8rem; height: 3px; background-color: #000; top: 50%; left: 50%; margin-left: -4rem; margin-top: -1.5px;}
.kolas-overview-txt p {display: flex; align-items: center; gap:2rem; padding: 0 6.4rem; width: 50%; box-sizing: border-box;}
.kolas-overview-txt p:first-child {justify-content: flex-end;}
.kolas-overview-txt p span {font-size: 2.4rem; font-weight: 600; letter-spacing: -0.04em; color: #000; line-height: 1.2;}
.kolas-overview-txt p strong {font-size: 4rem; font-weight: 600; color: #000; line-height: 1.2;}

.kolas-overview-list {display: flex; gap:2rem;}
.kolas-overview-list .item {width: calc(50% - 1rem); border-radius: 2rem; height: 35rem; background-color: #fff; display: flex; align-items: center; justify-content: center;}
.kolas-overview-list .item figure {padding: 4.7rem 6rem; box-sizing: border-box;}
.kolas-overview-list .item figure img {max-width: 100%; max-height: 100%;}
.kolas-overview-con1 .txt {font-size: 1.8rem;  font-weight: 500;letter-spacing: -0.04em;color: rgba(0, 0, 0, 0.6); line-height: 1.8;font-weight: 500;  margin-top: 6.4rem; text-align: center;}

.kolas-overview-con2 {padding: 16rem 0 52rem; position: relative;}
.kolas-slide-con {display: flex; flex-wrap: wrap; justify-content: space-between; padding-bottom: 8rem; height: 65rem; overflow: hidden; }
.kolas-slide-con .big-slide-con {position: relative; width: calc(100% - 22.3rem); height: 100%; border-radius: 3rem; background-color: #F5F5F5; padding-top: 8.8rem; box-sizing: border-box;}
.kolas-slide-con .big-slide-con .inner {max-width: 30rem; margin: 0 auto 4rem; box-shadow: 0.5rem 0.6rem 1.8rem rgba(0,0,0,0.1);}
.kolas-big-slide li .img {position: relative; width: 100%; height: 0; padding-top:141.667%; }
.kolas-big-slide li .img span {position: absolute; display: block; width: 100%; height: 100%; top: 0; left: 0; }
.kolas-big-slide li .img span img {width: 100%; height: 100%;}
.kolas-list-btn-wrap {position: absolute; bottom: 7rem; width: 17.5rem; left: 50%; transform:translateX(-50%); display: flex; align-items: center; justify-content: center;}
.kolas-list-btn-wrap .photo-btn-wrap {position: absolute; width: 100%;}
.kolas-list-btn-wrap .photo-btn-wrap button {position: absolute; top: 50%; margin-top: -1.2rem; font-size: 2.4rem; color: rgba(0,0,0,0.2); transition:all 0.3s; }
.kolas-list-btn-wrap .photo-btn-wrap button.slick-prev {left: 0;}
.kolas-list-btn-wrap .photo-btn-wrap button.slick-next {right: 0;}
.kolas-list-btn-wrap .photo-btn-wrap button:hover {color: #000;}
.kolas-list-btn-wrap .photo-conuter{font-size:2rem; letter-spacing:-0.04em; font-weight: 500; color:rgba(0,0,0,0.4); position: relative; }
.kolas-list-btn-wrap .photo-conuter .cur-num {color:#000; font-weight:700;}
.kolas-list-btn-wrap .photo-conuter .middle {display: inline-block; margin: 0 0.5rem; position: relative; top: -0.1rem;}

.kolas-slide-con .nav-slide-con {position: relative; width: 20.3rem; height: 100%; border-radius: 2rem; background-color: #F5F5F5; }
.kolas-slide-con .nav-slide-con .inner {position: relative; width: 100%; height: 100%; padding: 4rem 4.6rem 0;  border-radius: 2rem; box-sizing: border-box; overflow: hidden;}
.kolas-slide-con .nav-slide-con .inner:before {position: absolute; content: ''; width: 100%; height: 4rem; top: 0; left: 0; background-color: #F5F5F5; z-index: 1;}
.kolas-nav-slide {height: 120%;}
.kolas-nav-slide .slick-list {margin: -1rem 0; }
.kolas-nav-slide .slick-slide {margin: 1rem 0;}
.kolas-nav-slide li .img {position: relative; border-radius: 0.5rem; overflow: hidden;}
.kolas-nav-slide li .img:before {position: absolute; content: '';  top: 0; left: 0; width: 100%; height: 100%; border-radius: 0.5rem; border: 2px solid #000; box-sizing: border-box; opacity: 0; transition: var(--transition-custom); opacity: 0;}
.kolas-nav-slide li img {max-width: 100%; max-height: 100%;}
.kolas-nav-slide li.slick-current .img:before {opacity: 1;}
.slick-nav-arrow {position: absolute; left: 50%; margin-left: -2.8rem; bottom: -2.8rem; width: 5.6rem; height: 5.6rem; border-radius: 50%; background-color: rgba(255,255,255,0.9); backdrop-filter:blur(1rem); display: flex; align-items: center; justify-content: center; box-shadow: 0 0.4rem 0.8rem rgba(0,0,0,0.25); font-size: 2rem; color: rgba(0,0,0,0.5);}

.kolas-btn-wrap {display: flex; justify-content: center; gap:1.6rem;}
.kolas-btn-wrap a {width: calc(50% - 0.8rem); max-width: 30rem; height: 7.2rem; display: flex; align-items: center; justify-content: space-between; border: 2px solid #000; border-radius: 3.6rem; padding: 0 3.8rem; box-sizing: border-box; transition: var(--transition-custom2);}

.kolas-btn-wrap a.kolas-btn01 {background-color: #000; color: #fff;}
.kolas-btn-wrap a.kolas-btn02 {background-color: #fff; color: #000; }
.kolas-btn-wrap a em {position: relative; z-index: 1; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; }
.kolas-btn-wrap a i {position: relative; z-index: 1; font-size: 2.4rem;}

@media all and (min-width:801px){
	.kolas-btn-wrap a.kolas-btn01 .cm-fill {background-color: #fff;}
	.kolas-btn-wrap a.kolas-btn02 .cm-fill {background-color: #000;}
	
	.kolas-btn-wrap a.kolas-btn01:hover {color: #000;}
	.kolas-btn-wrap a.kolas-btn02:hover {color: #fff;}
}

.overview-flow-txt { position: absolute; bottom: 5rem; left: 0; width: 100%;}
.overview-flow-txt .inner { position: relative; width: 100%; height: 30rem; overflow: hidden;}
.overview-flow-txt .flow-txt {width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 2;}
.overview-flow-txt .maskBg {width: 100%; height: 100%; display: flex; align-items: center; overflow: hidden;}
.overview-flow-txt .maskBg .marquee {width: 100%; height: 100%;position: relative;}
.overview-flow-txt .maskBg .marquee .absol { position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: flex; align-items: center;}
.overview-flow-txt .maskBg .marquee .absol .mar_ch {height: 100%;}
.overview-flow-txt .maskBg .marquee .absol .mar_ch img {max-height: 100%; margin: 0 1rem;}

/* ********* 교정신청절차 ********* */
.calibration-page {padding-bottom: 16rem;}
.calibration-page .cm-sub-top-box {margin-bottom: 6.4rem;}
.request-process-list {display: flex; flex-wrap: wrap; gap:1.6rem; margin-bottom: 8rem;}
.request-process-list li {position: relative; width: calc(16.66% - 1.4rem); padding: 3.6rem 1rem; box-sizing: border-box; text-align: center; background-color: #f5f5f5; border-radius: 1rem;}
.request-process-list li:before {position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(135deg, var(--main-color) 0%, #C74702 100%); border-radius: 1rem; transition:all 0.4s; opacity: 0;}
.request-process-list li:after {position: absolute; left: -3.37rem; top: 50%; margin-top: -2.5rem; width: 5rem; height: 5rem; border-radius: 50%; background-color: #fff; line-height: 5rem; content: '\e93f'; font-family: xeicon; font-size: 2.4rem; color: var(--main-color); background-color: #fff; box-shadow: 0 0.4rem 0.4rem rgba(0,0,0,0.1); z-index: 2;}
.request-process-list li:first-child:after {display: none;}
.request-process-list li .icon {position: relative; z-index: 1; width: 8rem; height: 8rem; margin: 0 auto;}
.request-process-list li .icon svg {width: 100%; height: 100%;}
.request-process-list li .icon svg .path01 {fill:#E60012; opacity: 0.2; transition:all 0.4s;}
.request-process-list li .icon svg .path02 {stroke:#490004; transition:all 0.4s;}
.request-process-list li strong {position: relative; z-index: 1; display: block; margin-top: 1rem; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.04em; color: #490004; line-height: 1.3; transition:all 0.4s;}
.request-process-list li.active:before {opacity: 1;}
.request-process-list li.active .icon svg .path01 {fill:#fff; opacity: 0.15;}
.request-process-list li.active .icon svg .path02 {stroke:#fff}
.request-process-list li.active strong {color: #fff;}

.request-process-item {padding: 5.6rem 5.6rem 5rem; border-bottom: 1px solid rgba(0,0,0,0.2);}
.request-process-item:first-child {border-top: 1px solid rgba(0,0,0,0.2);}
.request-process-item dl {display: flex; align-items: center; margin-bottom: 1.8rem;}
.request-process-item dl dt {display: inline-block; width: 8.5rem; height: 3.8rem; line-height: 3.8rem; border-radius: 1rem; background-color: var(--main-color); text-align: center; font-size: 1.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff;}
.request-process-item dl dd {display: inline-block; margin-left: 1rem; font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.3;}
.request-process-item .txt1 {font-size: 2rem; font-weight: 500; letter-spacing: -0.04em; color:rgba(0,0,0,0.8); line-height: 1.8; }
.request-process-item .txt1 em {font-size:1.6rem;}
.request-process-item .txt2 {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; line-height: 1.8; color: rgba(0,0,0,0.5);}
.request-process-item .txt2 i {margin-right: 0.8rem;}
.request-process-item .txt2 a {display: inline-block; font-weight: inherit; color: inherit;}
.request-process-item .txt1 + .txt2 {margin-top: 1.2rem;}

.request-process-item:has(.kolas-btn-wrap){display: flex; align-items:center; justify-content:space-between;}
.request-process-item:has(.kolas-btn-wrap) dl{margin-bottom:0;}
.request-process-item .kolas-btn-wrap a{width:30rem;}


/* ****************** 
 * About WISE
 ********************** */
 /* ********* WISE ********* */
.intro-con01 {position: relative; padding-top:8rem; padding-bottom:16rem; box-sizing: border-box; }
.intro-con01-bg {position: absolute; width: 100%; height: 100%; top: 0; left: 0;  background: #000 url(/images/content/intro01_bg.jpg?ver=260507)no-repeat left 50% bottom 10% /cover; filter:blur(1rem); transition:all 1.2s ease-in-out;} 
.animated .intro-con01-bg {filter: blur(0px);}
.intro-page .talent-list{margin-top:6rem;}
.intro-con01-inner {position: relative; z-index: 1;}
.intro-tit-con {text-align: center;}
.intro-tit-con .sub-tit {display: block; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: var(--main-color); line-height: 1.3; margin-bottom: 1.5rem;}
.intro-tit-con .tit {font-size: 5.6rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.3;}
.intro-tit-con .tit b {font-weight: inherit; color:var(--main-color);}
.intro-tit-con .txt {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.6); line-height: 1.8; margin-top: 1.6rem;}
.intro-con02 {padding: 16rem 0 20rem; background: url(/images/content/intro02_bg.png)no-repeat center/cover;}
.intro-slide-con {position: relative; max-width: 34rem; margin: 12.5rem auto 0;}
.intro-slide-wrap.swiper-container { overflow: visible;}

.intro-tit-con .tit.style02{font-size:4.4rem; font-weight:600; line-height:1.4; letter-spacing:-0.02em; color:rgba(255,255,255,0.5);}
.intro-tit-con .tit.style02 span{color:#fff;}

.intro-slide > li {border-radius:2.4rem;}
/* .intro-slide li:after {position: absolute; width: 100%; height: 100%; top: 0; left: 0; border-radius:2.4rem; opacity: 0; } */
.intro-slide > li .inner {position: relative; width: 100%;padding: 13.4rem 4rem 4rem; border-radius:2.4rem; background: rgba(255,255,255,0.1); box-sizing: border-box;}
.intro-slide > li .inner:before {position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; border-radius:2.4rem; background:var(--main-color); opacity: 0; transition:  opacity 0.3s;}
.intro-slide > li .inner .tit {position: absolute; z-index: 1; top: 4rem; left: 4rem; display: block; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.2;}
.intro-slide > li .inner .icon {position: relative; z-index: 1; width: 16rem; height: 16rem; margin: 0 auto 5.4rem;}
.intro-slide > li .inner .icon svg {overflow: visible; width: 100%; height: 100%;}
.intro-slide > li .inner dl {position: relative; z-index: 1; text-align: right;}
.intro-slide > li .inner dl dt {font-size: 1.8rem; font-weight: 700; letter-spacing: -0.04em; color: rgba(255,255,255,0.5); line-height: 1.3; margin-bottom: 1.4rem;}
.intro-slide > li .inner dl dd {}
.intro-slide > li .inner dl dd strong {display: inline-block; font-size: 6rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; }
.intro-slide > li .inner dl dd .number {display: flex; align-items: center; justify-content: end;}
.intro-slide > li .inner dl dd .number.flex-end {align-items: flex-end;}
.intro-slide > li .inner dl dd .count-num-box {display:flex; align-items:center; font-size:3rem}
.intro-slide > li .inner dl dd .count-num-box > p {color: #fff; font-size:6rem; line-height: 6rem; font-weight: 700; letter-spacing: -0.02em;} 
.intro-slide > li .inner dl dd .count-num-item-wrap {height:2em; overflow:hidden;}
.intro-slide > li .inner dl dd .count-num-item-wrap .count-num-item-box{height: 60rem;}
.intro-slide > li .inner dl dd .count-num-item-wrap .count-num-item-box .count-num-item {position: relative; top: 0.5rem; line-height: 1em; color:#fff; font-weight:700; font-size:6rem; letter-spacing:-0.02em; }	 
.intro-slide > li .inner dl dd .count-unit {position: relative; font-size:6rem; letter-spacing:-0.02em; color: #fff; font-weight: 700; top: 0.5rem;}
.intro-slide > li .inner dl dd .number.flex-end .count-unit {font-size: 2.8rem; top: 0;}

/* 카운트 active */
.animated .count-num-item-box{animation:count-up-ani 3s forwards;}
.animated .count-num-item-box.down {animation:count-down-ani 3s forwards;}
@keyframes count-up-ani {
    0% {
	   transform: translate3d(0, 0, 0);
    }
    100% {
	   transform: translate3d(0, -90%, 0);
    }
}
@keyframes count-down-ani {
    0% {
	   transform: translate3d(0, -90%, 0);
    }
    100% {
	   transform: translate3d(0, 0, 0);
    }
} 

.intro-slide li.swiper-slide-active .inner:before {opacity: 1;}
.intro-swiper-scrollbar {position: absolute; bottom: -6rem; left: 50%; transform:translateX(-50%); width: 19.2rem; height: 4px; background-color: rgba(255,255,255,0.2); border-radius: 0.2rem; background-filter:blur(1rem);}
.intro-swiper-scrollbar .swiper-scrollbar-drag {position: relative; background:transparent}
.intro-swiper-scrollbar .swiper-scrollbar-drag:before {position: absolute; content: ''; width: 8px; height: 8px; border-radius: 8px; background-color: #fff; top: 50%; left: 50%; transform:translate(-50%,-50%);}

/* 아이콘 효과 */
/* 첫번째 아이콘 */
.intro-icon01 .path01 {fill:#fff; opacity: 0.2; transform-origin: bottom; transform-box: fill-box; animation: introIcon01Ani01 2.4s cubic-bezier(0.42, 0, 0.27, 1.06) infinite;}
.intro-icon01 .path02 {fill:#fff; transform-origin: center; transform-box: fill-box; animation: introIcon01Ani02 2.4s cubic-bezier(0.42, 0, 0.27, 1.06) infinite;}
.swiper-slide-active .intro-icon01 .path01 {opacity: 1; fill:#E65C55;}

@keyframes introIcon01Ani01 {
	 0% {transform: scaleY(0.02);}
	50% {transform: scaleY(1);}
	100% {transform: scaleY(0.02);}
}
@keyframes introIcon01Ani02 {
	 0% {transform: translateY(80px);}
	50% {transform: translateY(-10px);}
	100% {transform: translateY(80px);}
}
/* 두번째 아이콘 */
.intro-icon02 circle { transform-origin: center; animation: introIcon02Ani01 4s cubic-bezier(0.4, 0, 0.2, 1) infinite, introIcon02Ani02 2s linear infinite; transition:filter 0.3s ease-in-out}
.intro-icon02 .path01 { --x:-15px; --y:-15px; animation-delay: 0s !important; }
.intro-icon02 .path02 { --x:0px;   --y:-15px; animation-delay: .1s !important; }
.intro-icon02 .path03 { --x:15px;  --y:-15px; animation-delay: .2s !important; }
.intro-icon02 .path04 { --x:-15px; --y:0px;   animation-delay: .3s !important; }
.intro-icon02 .path05 { --x:0px;   --y:0px;   animation-delay: .4s !important; }
.intro-icon02 .path06 { --x:15px;  --y:0px;   animation-delay: .5s !important;  }
.intro-icon02 .path07 { --x:-15px; --y:15px;  animation-delay: .6s !important; }
.intro-icon02 .path08 { --x:0px;   --y:15px;  animation-delay: .7s !important; }
.intro-icon02 .path09 { --x:15px;  --y:15px;  animation-delay: .8s !important; }

@keyframes introIcon02Ani01 {
	0%, 20% {transform: translate(0,0);}
	40% {transform: translate(var(--x), var(--y));}
	40%, 60% {transform: translate(var(--x), var(--y));}
	80% {transform: translate(0,0);}
	80%, 100% {transform: translate(0,0);}
}

@keyframes introIcon02Ani02 {
	0%   { fill: rgba(255,255,255,0.2); }
	50%  { fill: rgba(255,255,255,1); }
	100% { fill: rgba(255,255,255,0.2); }
}

.intro-icon03 {  animation: introIcon03 4s cubic-bezier(0.4, 0, 0.2, 1) infinite;}
.intro-icon03 .path01 {fill:#fff; transform-origin: center; opacity: 0.2; animation: introIcon03Ani01 4s cubic-bezier(0.4, 0, 0.2, 1) infinite}
.intro-icon03 .path02 {fill:#fff; }
.intro-icon03 .path03 {fill:#fff; }
.swiper-slide-active .intro-icon03 .path01 {opacity: 1; fill:#E65C55;}

@keyframes introIcon03 {
	0% { transform: rotate(0deg);}
	100% {transform: rotate(360deg);}
}
@keyframes introIcon03Ani01 {
	0% {transform:scale(0.2)}
	50% {transform:scale(1.0)}
	100% {transform: scale(0.2);}
}

.intro-icon04 .path01 {fill:#fff; transform-origin: center; transform-box: fill-box; animation: introIcon04Ani01 4s cubic-bezier(0.4, 0, 0.2, 1) infinite}
.intro-icon04 .path02 {fill:#fff; transform-origin: center; transform-box: fill-box; opacity: 0.2; animation: introIcon04Ani02 4s cubic-bezier(0.4, 0, 0.2, 1) infinite}

@keyframes introIcon04Ani01 {
  0% { transform:translate(0,0);}
  50% {transform:translate(42px,42px);}
  100% {transform:translate(0,0);}
}
@keyframes introIcon04Ani02 {
   0% { transform:translate(0,0);}
  50% {transform:translate(-42px,-42px);}
  100% {transform:translate(0,0);}
}

.intro-icon05 {transform:rotate(180deg);}
.intro-icon05 rect:not(.path04) {
	transform-origin: bottom;
	transform-box: fill-box;
}
.intro-icon05 .path01 {fill:#fff; opacity: 0.2; animation: introIcon05Ani01 1.8s ease-in-out infinite; animation-delay: 0.6s; }
.intro-icon05 .path02 {fill:#fff; opacity: 0.2; animation: introIcon05Ani01 1.8s ease-in-out infinite; animation-delay: 0.3s;}
.intro-icon05 .path03 {fill:#fff; opacity: 0.2; animation: introIcon05Ani01 1.8s ease-in-out infinite;}
.intro-icon05 .path04 {fill:#fff; animation: introIcon05Ani02 1.8s ease-in-out infinite; animation-delay: 0.6s;}
.swiper-slide-active .intro-icon05 .path01 {opacity: 1; fill:#E65C55;}
.swiper-slide-active .intro-icon05 .path02 {opacity: 1; fill:#E65C55;}
.swiper-slide-active .intro-icon05 .path03 {opacity: 1; fill:#E65C55;}

/* 애니메이션 */
@keyframes introIcon05Ani01 {
	0% {height: 35px;}
	50% {height: 120px;}
	100%{height: 35px;}
}
@keyframes introIcon05Ani02 {
	0% {transform: translateY(10px);}
	50% {transform: translateY(96px);}
	100% {transform: translateY(10px);}
}

.intro-icon06 {animation: 10s linear 0s infinite normal none running introIcon06;}
.intro-icon06 .path01 {fill:#fff; animation: 5s ease 0s infinite normal none running introIcon06Ani01;}
.intro-icon06 .path02 {fill:#fff; opacity: 0.7; animation: 5s ease 0.3s infinite normal none running introIcon06Ani02;}
.intro-icon06 .path03 {fill:#fff; opacity: 0.6; animation: 5s ease 0.6s infinite normal none running introIcon06Ani03;}
.intro-icon06 .path04 {fill:#fff; opacity: 0.5; animation: 5s ease 0.9s infinite normal none running introIcon06Ani04;}
.intro-icon06 .path05 {fill:#fff; opacity: 0.4; animation: 5s ease 1.2s infinite normal none running introIcon06Ani05;}
.intro-icon06 .path06 {fill:#fff; opacity: 0.3; animation: 5s ease 1.5s infinite normal none running introIcon06Ani06;}
.intro-icon06 .path07 {fill:#fff; opacity: 0.2; animation: 5s ease 1.8s infinite normal none running introIcon06Ani07;}
.intro-icon06 .path08 {fill:#fff; opacity: 0.1; animation: 5s ease 2.1s infinite normal none running introIcon06Ani08;}

@keyframes introIcon06 {
	0% { transform: rotate(0deg);}
	100% {transform: rotate(-360deg);}
}

@keyframes introIcon06Ani01 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(0px, 120px);}
	50% {transform: translate(0px, 120px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani02 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(-85px, 85px);}
	50% {transform: translate(-85px, 85px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani03 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(-120px, 0px);}
	50% {transform: translate(-120px, 0px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani04 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(-85px, -85px);}
	50% {transform: translate(-85px, -85px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani05 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(0px, -120px);}
	50% {transform: translate(0px, -120px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani06 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(85px, -85px);}
	50% {transform: translate(85px, -85px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani07 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(120px, 0);}
	50% {transform: translate(120px, 0);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

@keyframes introIcon06Ani08 {
	0% {transform: translate(0px, 0px);}
	20% {transform: translate(85px, 85px);}
	50% {transform: translate(85px, 85px);}
	70% {transform: translate(0px, 0px);}
	100% {transform: translate(0px, 0px);}
}

/* white-ver */
.white-ver .intro-tit-con .tit{color:#000;}
.white-ver .intro-tit-con .tit.style02{color:rgba(0,0,0,0.5);}
.white-ver .intro-tit-con .tit.style02 span{color:#000}

.white-ver .intro-con02{background:#f5f5f5;}
.white-ver .intro-slide > li .inner{background: #fff;}
.white-ver .intro-slide > li.border-gradient::before{display: none;}
/* .white-ver .intro-slide > li.border-gradient::after{background: conic-gradient(from var(--angle), transparent 0%, rgba(0, 0, 0, 0.5) 15%, transparent 30%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);} */
.white-ver .intro-slide > li:not(.swiper-slide-active) .inner .tit{color:#000;}
.white-ver .intro-slide > li:not(.swiper-slide-active) .inner dl dt{color:rgba(0,0,0,0.5);}
.white-ver .intro-slide > li:not(.swiper-slide-active) .inner dl dd .count-unit,
.white-ver .intro-slide > li:not(.swiper-slide-active) .inner dl dd .count-num-box > p,
.white-ver .intro-slide > li:not(.swiper-slide-active) .inner dl dd strong,
.white-ver .intro-slide > li:not(.swiper-slide-active) .inner dl dd .count-num-item-wrap .count-num-item-box .count-num-item{color:#000;}

.white-ver .intro-swiper-scrollbar{background-color: rgba(0, 0, 0, 0.2);}
.white-ver .intro-swiper-scrollbar .swiper-scrollbar-drag:before{background:#000;}

/* 두번째 아이콘 */
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon01 circle,
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon01 path,
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon02 circle,
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon03 circle,
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon04 circle,
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon05 rect,
.white-ver .intro-slide > li:not(.swiper-slide-active) .intro-icon06 path {filter:brightness(0)}

.white-ver .mouse-pointer .pointer-circle{border-color:#000;}
.white-ver .mouse-pointer .pointer-circle i{color:#000;}

/* ********* History ********* */
.history-page {padding-bottom: 16rem;}
.history-parallax-wrap {position: relative; height: 100vh;}
.history-tab-wrapper-style {position: absolute; top: 50%; left: 8rem; width: 15rem; z-index: 1; transform:translateY(-50%);}
.history-tab-list-style ul li {position: relative; width: 100%; margin: 8px 0; border-radius: 2.2rem}
.history-tab-list-style ul li::before { content: ""; position: absolute;  inset: 0; border-radius: inherit;padding: 1px; z-index: 9;  pointer-events: none; background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.01) 40%, rgba(255, 255, 255, 0.01) 60%, rgba(255, 255, 255, 0.15) 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude; opacity: 0; transition:all 0.4s;}
.history-tab-list-style ul li::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px; /* 테두리 두께 */
  z-index: 10;
  pointer-events: none;

  /* 2. conic-gradient로 변경하고 변수 적용 */
  background: conic-gradient(
    from var(--angle),
    transparent 0%,
    rgba(255, 255, 255, 0.5) 15%,
    transparent 30%
  );

  /* 기존 마스크 로직 유지 */
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;

  /* 3. 애니메이션 실행 */
  animation: rotate-gradient 3s linear infinite;
  opacity: 0;
  transition: opacity 0.3s;
}
.history-tab-list-style ul li.selected::after {opacity: 1;}
.history-tab-list-style ul li a {display: flex; align-items: center; justify-content: center; width: 100%; height: 4.4rem; border-radius: 2.2rem;}
.history-tab-list-style ul li a em {font-size: 1.6rem; font-weight: 700; letter-spacing: -0.04em; color: rgba(255,255,255,0.2); transition:all 0.4s;}
.history-tab-list-style ul li.selected::before {opacity: 1;}
.history-tab-list-style ul li.selected a em {color: #fff;}

.history-parallax-con {display: flex; height: 100%;}
.history-img-wrap {width: 50%; height: 100%; display: flex; align-items: center; justify-content: end; padding: 0 8rem; box-sizing: border-box;}
.history-img-wrap .inner {width: 100%; max-width: 58rem;}
.history-img-wrap .inner .img-list {position: relative; width: 100%; height: 0; padding-top: 100%; border-radius: 2rem; overflow: hidden;}
.history-img-wrap .inner .img-list li {position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; }
.history-img-wrap .inner .img-list li span {position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 0; transition: all 1.2s ease-in-out;}
.history-img-wrap .inner .img-list li.on span {height: 100%;}

.history-info-wrap {position: relative; width: 50%; height: 60%; margin: auto 0 0 0;}
.history-year-box {position: absolute; width: 100%; top: -15rem; left: -1rem; z-index: 10;overflow: hidden; z-index: 2;}
.history-year-box:before {position: absolute; content: ''; width: calc(100% - 32rem); right: -1rem; top: 50%; height: 1px; margin-top: -0.5px; background-color: #fff;}
.history-year {display: flex; font-size: 11rem; line-height:1; font-weight: 700;line-height: 1;color: #fff;letter-spacing: -0.06em;}
.year-roll-wrap {display: flex;}
/* .digit-wrap {position: relative;width: 1ch;height: 1em;overflow: hidden; }
.digit {position: absolute;inset: 0;display: flex;align-items: center;justify-content: center;line-height: 1;} */
.digit-wrap{position:relative;width:1ch;height:1em;overflow:hidden;display:flex;align-items:flex-start;justify-content:center;}
.digit-reel{display:flex;flex-direction:column;}
.digit-reel span{display:flex;align-items:center;justify-content:center;height:1em;line-height:1;}

.history-info-con {position: absolute; top: 0; left: 0; }
.history-item-group {display: contents;}
.history-item {width: 80%; height: 580px;display: flex;flex-direction: column; padding: 0;opacity: 0.15; transition: opacity 0.4s ease-in-out;}
.history-img-m,
.history-year-m {display: none;}
.history-item.active {opacity: 1;}
.history-item dl {display: flex; font-size: 2rem; letter-spacing: -0.04em; line-height: 1.6; color: rgba(255,255,255,0.6);}
.history-item dl + dl {padding-top: 2rem;}
.history-item dl dt {width: 6.8rem;  font-weight: 700;}
.history-item dl dd {width: calc(100% - 6.8rem); font-weight: 500;}


/* ********* CI ********* */
.ci-con01 {padding: 6rem 0 16rem; background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,0.1)) ;}
.ci-con01 .cm-sub-top-box {margin-bottom: 6.4rem;}
.ci-con01-box {display: flex; align-items: center; justify-content: center; height: 31.6rem; border: 2px solid rgba(255,255,255,0.5); border-radius: 2rem; overflow: hidden; background: rgba(255,255,255,0.05) url(/images/content/ci_bg.svg); padding: 0 5rem; box-sizing: border-box;}
.ci-con01-box img {max-width: 100%;}

.ci-con01-bottom {padding: 6.4rem 4rem 0; display: flex; box-sizing: border-box;}
.ci-con01-bottom .txt {width: calc(100% - 30rem); font-size: 1.8rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.6); line-height: 1.8; padding-right: 3rem; box-sizing: border-box;}
.ci-con01-bottom a {position: relative; display: flex; align-items: center; justify-content: space-between; width: 30rem; height: 7.2rem; border-radius: 3.6rem; padding: 0 3.8rem; box-sizing: border-box;}
.ci-con01-bottom a:before {position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0;  border: 2px solid #fff; border-radius: 3.6rem; box-sizing: border-box; pointer-events:none;}
.ci-con01-bottom a em {font-size: 2rem; color: #fff; letter-spacing: -0.04em;}
.ci-con01-bottom a i {position: relative; z-index: 1; font-size: 2.4rem; color: #fff;  transition:var(--transition-custom2)}

 @media all and (min-width:801px){
	.ci-con01-bottom a:hover em ,
	.ci-con01-bottom a:hover i {color: #000;}
}

.ci-con02 {padding: 16rem 0 8rem;}
.ci-type-box {padding: 4rem; border-radius: 3rem; background-color: rgba(255,255,255,0.1); backdrop-filter:blur(1rem); box-sizing: border-box;}
.ci-type-list {display: flex; flex-wrap: wrap; gap:2rem;}
.ci-type-list li {width: calc(50% - 1rem); text-align: center;}
.ci-type-list li .logo-box {height:28rem; background-color: #fff; border-radius: 2rem; display: flex; align-items: center; justify-content: center; padding: 0 5rem; box-sizing: border-box;}
.ci-type-list li .logo-box img {max-width: 100%;}
.ci-type-list li span {display: inline-block; padding: 0 2.3rem; height: 3.4rem; line-height: 3.2rem; border: 1px solid rgba(255,255,255,0.5); box-sizing: border-box; margin-top: 2.4rem; border-radius: 1.7rem; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; color: #fff; }

.ci-con03 {padding: 8rem 0 16rem;}
.ci-con03 .cm-sub-top-box.white-ver .cm-sub-tit {transition: var(--transition-custom2);}
.ci-color-box {padding: 4rem; border-radius: 3rem; background-color: rgba(255,255,255,0.1); background-filter:blur(1rem); box-sizing: border-box; transition: var(--transition-custom2);}
.ci-color-list {display: flex; flex-wrap: wrap; gap:2rem;}
.ci-color-list li {width: calc(50% - 1rem); }
.ci-color-list li .color-box {height:20rem; padding: 4rem; border-radius: 2rem; box-sizing: border-box; }
.ci-color-list li .color-box.red {background-color: var(--main-color);}
.ci-color-list li .color-box.black {background-color: #000;}
.ci-color-list li .color-box strong {font-size: 3.2rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.3;}
.ci-color-list li .color-code {padding: 4rem 2.4rem 1rem; box-sizing: border-box;}
.ci-color-list li .color-code dl {display: flex; font-size: 1.8rem; color: #fff; line-height: 1.3; margin-bottom: 2.4rem; transition: var(--transition-custom2);}
.ci-color-list li .color-code dl:last-child {margin-bottom: 0;}
.ci-color-list li .color-code dt {width: 15.5rem; font-weight: 700; opacity: 0.3; }
.ci-color-list li .color-code dd {width:calc(100% - 15.5rem); font-weight: 500; opacity: 0.6; }

#wrap.black-ver.bg-active #middleArea {background-color: #f5f5f5; }

.bg-active .ci-con03 .cm-sub-top-box.white-ver .cm-sub-tit {color: #000;}
.bg-active .ci-color-box {background-color: #fff;}
.bg-active .ci-color-list li .color-code dl {color: #000;}

/* ********* Global Network ********* */
.about-tab-wrapper-style{position:relative; height: 74px; text-align: center;}
.abou-tab-list-style {position: relative;  border-radius: 10rem;}
.abou-tab-list-style:before {content:"";position:absolute;inset:0;border-radius:inherit; padding:1px;z-index:9; pointer-events:none; background: linear-gradient( 135deg, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0.01) 40%, rgba(255,255,255,0.01) 60%, rgba(255,255,255,0.15) 100% ); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude;}
.abou-tab-list-style ul{display: flex; height: 74px; border-radius: 10rem; background: rgba(255,255,255,0.1);  -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; padding: 8px;}

.abou-tab-list-style ul li{display:table-cell; vertical-align:middle; position:relative; width: 33.333%; border-radius: 10rem; z-index:1;}
.abou-tab-list-style ul li a{display:table; height:58px; width:100%;}
.abou-tab-list-style ul li a em{display:table-cell; vertical-align:middle; font-size: 1.8rem; font-weight: 700; color: rgba(255,255,255,0.3); line-height: 1.2; text-align:center; transition: all 0.3s;}
.abou-tab-list-style ul li.selected{z-index:2;}
.abou-tab-list-style ul:not(.move-line-list2-JS) li.selected {background-color:var(--main-color);}
.abou-tab-list-style ul li.selected em {color: #fff;}
.abou-tab-list-style ul li.hover a em {color: #fff;}
.abou-tab-list-style ul li.none-hover a em{color:#000;}
/* sub menu 이동 */
 @media all and (min-width:801px){
	.move-line-wrap2 {position: absolute; max-width: 35rem; width: 100%; margin: 0 auto; top: 8px; left: 0;}
	.tab-on-icon2.move-line2 {position:absolute; left:0; top:0; z-index:1; height: 74px;}
	.tab-on-icon2.move-line2 > span {height: 58px; background-color:var(--main-color); position:absolute; left:0; top:0; text-align:center; transition:background-color 0.5s; border-radius:10rem;}
 }

.global-page {padding-bottom: 10rem;}
.global-page .cm-sub-top-box {padding-top: 10rem;}
.global-content {position: relative; height: 80rem;}
.global-tab-content-inner {position: absolute; z-index: 1; height: 100%; left: 4.8rem; padding: 4.8rem 0; box-sizing: border-box;}
.global-tab-con {height: 100%;}
.global-list-box {position: relative; width: 40rem; height: 100%; background-color: #fff; border-radius: 2rem; padding: 2rem 1rem 0 3rem; box-sizing: border-box;}
.global-list {position: relative; height: 100%;overflow-x: hidden; overflow-y: auto;  box-sizing: border-box; padding-right: 2rem;}
.global-list::-webkit-scrollbar {
	width: 7px;
}
.global-list::-webkit-scrollbar-track {
	background-color: #fff;
	border-radius: 4px
}
.global-list::-webkit-scrollbar-thumb {
	background-color: rgba(0,0,0,0.3);
	border-radius: 4px
} 
.global-list .global-list-item {padding: 4rem 0; border-top: 1px solid rgba(0,0,0,0.1);}
.global-list .global-list-item:first-child {padding-top: 2rem; border-top: 0;}
.global-list .global-list-item .area-txt {display: block; font-size: 1.2rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(0,0,0,0.6); margin-bottom: 2rem; line-height: 1.6;}
.global-list .global-list-item .tit {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.2; margin-bottom: 2rem;}
.global-list .global-list-item .info-box p {position: relative; padding-left: 2.3rem; font-size: 1.4rem; font-weight: 500; letter-spacing: -0.04em; line-height: 1.6; color: rgba(0,0,0,0.6); margin-bottom: 1rem;}
.global-list .global-list-item .info-box p i {position: absolute; left: 0; top: 0.3rem; font-size: 1.5rem;}
.global-list .global-list-item .info-box p:last-of-type {margin-bottom: 0;}
.global-list .global-list-item .info-box p a {display: block;}
.global-list .global-list-item .info-box p a.mail-txt {text-decoration: underline; }

.map-con {position: relative; height: 100%;}
.map-con #map {width: 100%; height: 100%; border-radius: 3rem; background-color: rgba(255,255,255,0.2);}
.pac-container {display: none !important;}
@keyframes bounce-in {
  0% {
    transform: scale(0.9) translateY(30px);
    opacity: 0;
  }
  60% {
    transform: scale(1.1) translateY(-10px);
    opacity: 1;
  }
  80% {
    transform: scale(0.95) translateY(5px);
  }
  100% {
    transform: scale(1) translateY(0);
  }
}
.marker-wrap {position: relative; width: auto; height: auto;  transform-origin:center; animation: bounce-in 0.6s ease;}
.marker-wrap .label {position: absolute; bottom: calc(100% + 1.2rem); left: 50%; transform: translateX(-50%); background: var(--main-color);padding: 1rem 4rem;border-radius: 0.5rem;font-size: 2rem;	font-weight: 700;	color: #fff; box-shadow: 2px 2px 5px rgba(0,0,0,0.1);white-space: nowrap;transform-origin:center; opacity: 0; visibility: hidden; transition:all 0.3s ease-in-out;}
.marker-wrap .label:before {position: absolute; content: ''; margin-left: -12px; left: 50%; bottom: -8px; width: 0;height: 0;border-style: solid;border-width: 8px 12px 0px 12px;border-color: var(--main-color) transparent transparent transparent;}
.marker-wrap.active .label {opacity: 1; visibility: visible;}

.marker-wrap .dot  {
	width: 16px;
	height: 16px;
	border: 2px solid #fff;
	background: var(--main-color);
	border-radius: 50%;
	box-sizing: border-box;
}

.cluster-marker {
	background: var(--main-color);
	color: #fff;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 700;
}

/* ********* Careers ********* */
/* 채용안내 */
.careers-page {padding-bottom: 16rem;}
.careers-con {padding-top: 16rem;}
.careers-con.con01 {padding-top: 10rem;}
.talent-list {display: flex; margin: 0 -1rem;}
.talent-item {flex: 1 1 0; height: 48rem; transition: all 0.8s; position: relative; box-sizing: border-box; overflow: hidden; border-radius:2rem; margin: 0 1rem;}
.talent-item.item01 {background: url(/images/content/careers_con01_img01.jpg)no-repeat center/cover;}
.talent-item.item02 {background: url(/images/content/careers_con01_img02.jpg)no-repeat center/cover;}
.talent-item.item03 {background: url(/images/content/careers_con01_img03.jpg)no-repeat center/cover;}
.talent-item.item04 {background: url(/images/content/careers_con01_img04.jpg)no-repeat center/cover;}
.talent-item .tit {position: absolute; top: 4rem; left: 50%; transform:translate(-50%); display: inline-block; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; color: #fff; transition: var(--transition-custom); transition-delay:0.5s;}
.talent-item .txt {position: absolute; bottom: 3.2rem; left: 4rem; font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.5; opacity: 0;  white-space: nowrap;  transition: var(--transition-custom);}
.talent-item.active .tit {left:8rem; transition-delay:0s;} 
.talent-item.active .txt { opacity: 1; } 

@media all and (min-width: 801px){
	.talent-item.active {flex: 4.875 1 0;}
}

.talent-btn-wrap {display: flex; justify-content: center; gap:1.6rem; margin-top: 8rem;}
.talent-btn-wrap a {position: relative; width: calc(50% - 0.8rem); max-width: 30rem; height: 7.2rem; display: flex; align-items: center; justify-content: space-between; border-radius: 3.6rem; padding: 0 4rem; box-sizing: border-box; }
.talent-btn-wrap a:before {position: absolute; content: ''; top: 0; left: 0; width: 100%; height: 100%; border: 2px solid #fff; border-radius: 3.6rem; box-sizing: border-box; pointer-events:none;}
.talent-btn-wrap a em {position: relative; z-index: 1; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; }
.talent-btn-wrap a i {position: relative; z-index: 1; font-size: 2.4rem; color: #fff; transition: var(--transition-custom2);}

@media all and (min-width:801px){
	.talent-btn-wrap a .cm-fill {background-color: #fff;}
	.talent-btn-wrap a:hover em ,
	.talent-btn-wrap a:hover i {color: #000;}
}

.careers-process-con {display: flex; flex-wrap: wrap; justify-content: center;}
.process-icon-list {display: flex; width: 28.2rem; padding:2.8rem; box-sizing: border-box; border-radius: 14rem; background: rgba(255,255,255,0.1); flex-direction:column; gap:7.2rem}
.process-icon-item {position: relative; width: 100%; height: 0; padding-top: 100% ; border-radius: 50%;}
.process-icon-item:before {position: absolute; left: 50%; margin-left: -1.6rem; bottom: -5.2rem; content: '\e942'; font-family: xeicon; width: 3.2rem; height: 3.2rem; line-height: 3.2rem; font-size: 2.4rem; color: rgba(255,255,255,0.5); background-color: rgba(255,255,255,0.05); text-align: center; border-radius: 50%; transition:all 0.4s; }
.process-icon-item:last-child:before {display: none;}
.process-icon-item .inner-wrap {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; overflow: hidden;}
.process-icon-item .inner-wrap .liquid-effect {border-radius: 50%;}
.process-icon-item .inner {position: relative; z-index: 1; width: 100%; height: 100%; display: flex; flex-direction:column; text-align: center; align-items: center; justify-content: center;  transition:all 0.4s;}
.process-icon-item .inner .icon {width: 8rem; height: 8rem; margin: 1rem 0;}
.process-icon-item .inner .icon svg {width: 100%; height: 100%;}
.process-icon-item .inner .icon svg .path01 {fill:#555; transition:all 0.4s;}
.process-icon-item .inner .num,
.process-icon-item .inner .tit {display: block; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.3; color: rgba(255,255,255,0.5); transition:all 0.4s;}
.process-icon-item.active:before {color: #fff; background-color: rgba(255,255,255,0.3);}
.process-icon-item.active .inner {background-color: var(--main-color);}
.process-icon-item.active .inner .num,
.process-icon-item.active .inner .tit {color: #fff;}
.process-icon-item.active .inner .icon svg .path01 {fill:#EB3341;}

.process-txt-list {display: flex; padding:2.8rem 0; margin-left: 6rem; box-sizing: border-box;  flex-direction:column; gap:7.2rem}
.process-txt-list li {flex: 1; display: flex; align-items: center;}
.process-txt-list li dl dt {display: flex; align-items: center;}
.process-txt-list li dl dt span {display: inline-block; width: 8.5rem; height: 3.8rem; line-height: 3.8rem; text-align: center; border-radius: 1rem; background-color: var(--main-color); font-size: 1.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff;}
.process-txt-list li dl dt strong {display: inline-block; font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff;  margin-left: 1rem;}
.process-txt-list li dl dd {font-size: 2rem; font-weight: 500; letter-spacing: -0.04em; line-height: 1.8; color: rgba(255,255,255,0.8); margin-top: 2.4rem;}

.careers-job-list {display: flex; flex-wrap: wrap; margin: -1rem;}
.careers-job-list li {width: calc(25% - 2rem); margin: 1rem; }
.careers-job-list li a {display: block; width: 100%; border-radius: 2rem;}
.careers-job-list li a .inner {position: relative; z-index: 1; width: 100%; height: 100%; background: rgba(255,255,255,0.1); min-height: 30rem; border-radius: 2rem; padding: 4.5rem 4rem; box-sizing: border-box; transition:all 0.4s;}
.careers-job-list li a .inner:before {position: absolute; right: 2.5rem; bottom: 2.5rem; transform:rotate(45deg); content: '\e907'; font-family: xeicon; font-size: 3.2rem; color: #fff; opacity: 0.3;  transition:all 0.4s;}
.careers-job-list li a .inner .tit {display: block; font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.3;}
.careers-job-list li a .inner .txt {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.5); line-height: 1.8; margin-top: 2.4rem; overflow:hidden;
	display:block;display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; transition:all 0.4s;}
.careers-job-list li a .cm-fill {background-color: var(--main-color);}

@media all and (min-width:801px){
	.careers-job-list li a:hover .cm-fill {width: 60vw; height: 60vw;}
	.careers-job-list li a:hover .inner:before {opacity: 1;}
	.careers-job-list li a:hover .inner .txt {color:  rgba(255,255,255,0.8);}
}
/* 팝업 */
.careers-modal-content{position:relative; width:96%; max-width:500px; margin:20px auto; }
.careers-modal-content .modal-close-btn{position:absolute; top: auto; right: auto; bottom:-5.2rem; left: 50%; transform:translateX(-50%); color:#fff; padding: 0.5rem 0; font-size: 1.8rem; font-weight: 500; border-bottom: 2px solid #fff; }
.careers-modal-content .modal-close-btn i {position: relative; left: 0.2rem; font-size: 2.4rem; color: #fff; vertical-align: middle;}
.careers-pop-inner{padding:5.6rem; background-color:#1D1D1D; min-height: 64rem; border-radius: 2rem; box-sizing: border-box;}
.careers-pop-inner .tit {padding-bottom: 3rem; font-size: 3.2rem; font-weight: 700; color: #fff; line-height: 1.3; border-bottom: 1px solid rgba(255,255,255,0.1);}
.careers-job-info dl {padding-top: 4rem;}
.careers-job-info dl dt {display: flex;}
.careers-job-info dl dt span {position: relative; top: 0.4rem; display: inline-block; width: 4rem; height: 1.8rem; line-height: 1.8rem; text-align: center; border-radius:1.2rem; background-color: var(--main-color); font-size: 1.1rem; font-weight: 500; letter-spacing: -0.04em; color: #fff;}
.careers-job-info dl dt strong {display: inline-block; width: calc(100% - 4.8rem); font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.3; margin-left: 0.8rem;}
.careers-job-info dl dd {font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.6); line-height: 1.8; margin-top: 1.2rem;}

.welfare-con {}
.welfare-tab-list-style {width: 100%; height: 6.4rem; border-radius: 1rem; background-color: rgba(255,255,255,0.1);}
.welfare-tab-list-style ul {display: flex; justify-content: center;}
.welfare-tab-list-style ul li a {padding: 0 3.2rem; height:  6.4rem;}
.welfare-tab-list-style ul li a em {display: inline-block; line-height: 6.4rem; position: relative; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.04em; color: rgba(255,255,255,0.5); transition:var(--transition-custom);}
.welfare-tab-list-style ul li a em:before {position: absolute; bottom: 0; left: 50%; transform:translateX(-50%); content: ''; width: 0; height: 3px; background-color: #fff; transition:var(--transition-custom);}
.welfare-tab-list-style ul li.selected a em {color: #fff;}
.welfare-tab-list-style ul li.selected a em:before {width: 100%;}

.welfare-tab-con {padding-top: 5.6rem;}
.welfare-list {display: flex; flex-wrap: wrap; gap:2rem}
.welfare-list li {width: calc(50% - 1rem); border-radius: 2rem; background-color: rgba(255,255,255,0.1);}
.welfare-list li .inner {position: relative; height: 100%; min-height: 30rem; z-index: 1; padding: 3rem; box-sizing: border-box; border-radius: 2rem; display: flex; flex-direction:column; justify-content: space-between; transition: all 0.4s;}
.welfare-list li .inner .icon {width: 8.8rem; height: 8.8rem;}
.welfare-list li .inner .icon svg {width: 100%; height:100%; }
.welfare-list li .inner .icon svg .path01 {fill:rgba(255,255,255,0.2);}
.welfare-list li .inner dl {padding: 0 1rem;}
.welfare-list li .inner dl dt {font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.3;}
.welfare-list li .inner dl dd {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.6); line-height: 1.8; margin-top: 1rem; transition: all 0.4s;}
.welfare-list li .liquid-effect {backdrop-filter: none;}
.welfare-list li .cm-fill {background-color: var(--main-color);}

@media all and (min-width:801px){
	.welfare-list li:hover .cm-fill {width:80vw; height: 80vw;}
	/* .welfare-list li:hover .inner .icon svg .path01 {fill:#EB3341; } */
	.welfare-list li:hover .inner dl dd {color: rgba(255,255,255,0.8);}
}


/* 채용공고 */
.recruit-page {padding-bottom: 16rem;}
.recruit-con {padding-top: 10rem;}
.recruit-con .recruit-selectbox{width:15rem; height:5.6rem; background: rgba(255,255,255,0.1); border-radius:1rem;  box-sizing:border-box; overflow: visible !important;}
.recruit-con .recruit-selectbox .select-style {padding: 0 2.4rem;}
.recruit-con .recruit-selectbox .select-style span{font-size:1.6rem; letter-spacing:-0.04em; color:#fff; font-weight:500;}
/* .recruit-con .recruit-selectbox .select-options{height:auto;} */
.recruit-con .gs-custom-selectbox + .gs-custom-selectbox {margin-left: 1rem;}
.recruit-con .gs-custom-selectbox .select-style:after {color: #fff;}
.recruit-con .gs-custom-selectbox .select-options { background: #000; border: 0; backdrop-filter:blur(1rem);}
.recruit-con .gs-custom-selectbox .select-options:before { content: "";position: absolute;inset: 0; border-radius: inherit;  padding: 1px;z-index: 9;pointer-events: none; background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.01) 40%, rgba(255, 255, 255, 0.01) 60%, rgba(255, 255, 255, 0.15) 100%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;}
.recruit-con .gs-custom-selectbox .select-options li:hover, 
.recruit-con .gs-custom-selectbox .select-options li.is-selected {background-color: rgba(255,255,255,0.2);}
.recruit-con .gs-custom-selectbox .select-options li {color: #fff;}
.recruit-con .board-search-box .board-search-inner {background-color: rgba(255,255,255,0.1);}
.recruit-con .board-search-box .search-subject-select, 
.recruit-con .board-search-box .search-word {color: #fff;}
.recruit-con .board-search-box .search-subject-select:focus,
.recruit-con .board-search-box .search-word:focus{color:#fff; }

.recruit-con .custom-select-trigger {color: #fff; padding: 0 2.4rem;}
.recruit-con .board-search-box .search-subject-select + .search-word, 
.recruit-con .board-search-box .board-custom-select-box + .search-word {border-left: 0; padding: 0 2rem;}

.recruit-con .custom-option-drop-list {background: rgba(255,255,255,0.1); border: 0; border-radius: 0.6rem;}
.recruit-con .board-custom-select-box .custom-option-item {color: rgba(255,255,255,0.5);}
.recruit-con .board-custom-select-box .custom-option-item.selection {background: none;}
.recruit-con .custom-option-drop-list:before { content: "";position: absolute;inset: 0; border-radius: inherit;  padding: 1px;z-index: 9;pointer-events: none; background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.01) 40%, rgba(255, 255, 255, 0.01) 60%, rgba(255, 255, 255, 0.15) 100%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;}
.recruit-con .board-search-box .bbs-search-btn {color: #fff;}

.announcement-con {padding: 4rem 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff;}
 .announcement-list {display:flex; flex-wrap:wrap; margin: -1rem;}
.announcement-list li {width: calc(50% - 2rem); margin: 1rem; border-radius:2rem; box-sizing:border-box; transition:all 0.3s ease;}
.announcement-list li a {position: relative; display:inline-block; width: 100%; height: 100%; box-sizing:border-box; background-color: rgba(255,255,255,0.1); overflow:hidden; padding: 4rem; border-radius:2rem;}
.announcement-list li a:before {position: absolute; right: 2.5rem; bottom: 2.5rem; transform:rotate(45deg); content: '\e907'; font-family: xeicon; font-size: 3.2rem; color: #fff; opacity: 0.2;  transition:all 0.4s;}
.announcement-list li a .cate {position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap:0.4rem; margin-bottom: 1.2rem;}
.announcement-list li a .cate span {display: inline-flex; align-items: center; padding: 0 1.1rem; height: 2.5rem; border-radius:3rem; border: 1px solid rgba(255,255,255,0.4); white-space:nowrap; box-sizing: border-box; font-size: 1.3rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.8);}
.announcement-list li a .tit {position: relative; z-index: 1; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.3; height: 2.6em; overflow:hidden;display:block;display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.announcement-list li a .date {position: relative; z-index: 1; margin-top: 3.5rem; display: block; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.5);  transition:all 0.4s;}
.announcement-list li a .cm-fill {background: var(--main-color); }

@media all and (min-width:801px){
	.announcement-list li a:hover .cm-fill {width: 80vw; height: 80vw;}
	.announcement-list li a:hover .date { color: rgba(255,255,255,0.8);}
}

/* Training */
.training-con01 {padding: 10rem 0;}
.training-list01 {display: flex; flex-wrap: wrap; gap:2rem;}
.training-list01 li {position: relative; width: calc(50% - 1rem); border-radius: 2rem; min-height: 18rem;  overflow: hidden;}
.training-list01 li .inner {position: relative; display: flex; align-items: center; z-index: 1; height: 100%; border-radius: 2rem; background-color: rgba(255,255,255,0.1); padding: 3rem; box-sizing: border-box; transition:all 0.4s;}
.training-list01 li .inner .icon {width: 8.8rem;}
.training-list01 li .inner .icon svg {width: 100%;}
.training-list01 li .inner .icon svg .path01 {fill:#414141; transition:all 0.4s;}
.training-list01 li .inner .txt-box {width: calc(100% - 8.8rem); padding-left: 2.4rem; box-sizing: border-box;}
.training-list01 li .inner .txt-box .txt01 {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.5; }
.training-list01 li .inner .txt-box .txt02 {font-size: 1.4rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.5); line-height: 1.8; margin-top: 0.4rem;}
.training-list01 li.active .inner {background-color: var(--main-color);}
.training-list01 li.active .inner .icon svg .path01 {fill:#EB3341;}

.training-con02 {padding: 6rem 0 16rem;}
.training-career-con {padding: 10.3rem 0; border-radius: 3rem; background: url(/images/content/training_con02_bg.jpg)no-repeat center/cover;}
.training-list02 {display: flex; flex-wrap: wrap; gap:1.8rem}
.training-list02 li {width: calc(33.333% - 1.2rem); border-radius: 2rem; overflow: hidden;}
.training-list02 li .inner {display: flex; flex-direction:column; justify-content: space-between; position: relative; z-index: 1;border-radius: 2rem; background-color: rgba(255,255,255,0.1); height: 42.8rem; padding: 3.8rem; box-sizing: border-box; transition:all 0.4s;}
.training-list02 li .liquid-effect {backdrop-filter: blur(2rem);}
.training-list02 li .inner .icon {width: 10rem; height: 10rem;}
.training-list02 li .inner .icon svg {width: 100%; height: 100%;}
.training-list02 li .inner .icon svg .path01 {opacity: 0.3; fill:#fff; transition:all 0.4s;}
.training-list02 li .inner dl {padding: 1rem;}
.training-list02 li .inner dl dt {font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.5;}
.training-list02 li .inner dl dd {font-size: 1.8rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.6); line-height: 1.8; margin-top: 1.5rem; transition:all 0.4s;}
.training-list02 li .inner img {max-width: 100%;}

.training-list02 li.active .inner {background-color: var(--main-color);}
.training-list02 li.active .inner dl dd {color: rgba(255,255,255,0.8); }
.training-list02 li.active .inner .icon svg .path01 {fill:#EB3341;}
.training-list02 li:last-child .inner {align-items: center; justify-content: center; background-color: #000;}


/* ****************** 
 * CS Center
 ********************** */
 
 /* ********* Contact Us ********* */
.contact-page .abou-tab-list-style:before {display: none;}
.contact-page .abou-tab-list-style ul {background: #f5f5f5;}
.contact-page .abou-tab-list-style ul li a em {color: rgba(0,0,0,0.3);}
.contact-page .abou-tab-list-style ul li.selected a em {color: #fff;}
.contact-page .abou-tab-list-style.top-fixed {position: fixed; top: calc(var(--sub-menu-height) + 45px); width: var(--area-sub-width); z-index: 99;}

.contact-tab-con {padding-top: 16rem;}
.contact-tab-con:first-of-type {padding-top: 10rem;}
.contact-tit {font-size: 4.8rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.4; margin-bottom: 5.6rem; text-align: center;}
.contact-list {display: flex; flex-wrap: wrap; margin: -1rem;}
.contact-list li {width: calc(33.333% - 2rem); margin: 1rem;}
.contact-list li .inner {position: relative; display: block;height: 100%; padding: 3.8rem 3.8rem 4.6rem; border: 2px solid #F5F5F5; background-color: #F5F5F5; border-radius: 2rem; box-sizing: border-box; transition:all 0.4s;}
.contact-list li .inner strong {display: block; font-size: 2.8rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.5; margin-bottom: 2.4rem; transition:all 0.4s;}
.contact-list li .inner dl {margin-bottom: 2.4rem;}
.contact-list li .inner dl:last-of-type {margin-bottom: 0;}
.contact-list li .inner dl dt {font-size: 2rem; font-weight: 600; letter-spacing: -0.04em; color: rgba(0,0,0,0.6); line-height: 1.4; transition:all 0.4s; margin-bottom: 0.8rem;}
.contact-list li .inner dl dt span {display: block; font-size: 1.4rem; font-weight: 400; letter-spacing: -0.04em; color: rgba(0,0,0,0.6); line-height: 1.5;}
.contact-list li .inner dl dd {}
.contact-list li .inner dl dd p {display: flex; font-size: 1.6rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(0,0,0,0.6);  line-height: 1.4; transition:all 0.4s; margin-bottom: 0.5rem;}
.contact-list li .inner dl dd p i {line-height: 1.4; margin-right: 0.8rem;}
.contact-list li .inner dl dd p:last-child {margin-bottom: 0;}

.contact-list li:hover .inner {border-color: var(--main-color); background-color: #fff;}
.contact-list li:hover .inner strong {color: var(--main-color);}
.contact-list li:hover .inner dl dt {color: #000;}

/* ****************** 
	* Mouse Pointer
********************** */
.mouse-pointer{position:fixed; top:0px; left:0px; z-index:10000; pointer-events:none; }
/* base */
.mouse-pointer .pointer-circle{position:absolute; top:50%; left:50%; width: 14rem; height: 14rem; border-radius:50%;  transform:translate(-50%,-50%) scale(0); border:2px solid #fff; box-sizing:border-box; transition:var(--transition-custom); opacity:0; background:rgba(0,0,0,0.05); backdrop-filter:blur(1.5rem);}
.mouse-pointer .pointer-circle i {position: absolute; top:50%; left:50%; transform:translate(-50%, -50%) rotate(90deg); font-size:4.8rem; color:#fff;}
/* arrow */
.mouse-pointer.drag .pointer-circle{transform:translate(-50%,-50%) scale(1); opacity:1;}


/* Global Network :: 상단 리스트 추가 */
.global-top-wrap{margin-bottom:6rem; padding-top:0rem;}
/* .global-top-con{display: none;} */
.global-top-list{position: relative; display: flex; align-items: flex-start; gap:2rem;}

.global-top-list .global-top-category{position: sticky; top:var(--header-height); width:22rem;}

.global-top-list .inner-list{display: flex; flex-wrap:wrap; margin:-3rem -1rem -1rem; width:calc(100% - 22rem);}
.global-top-list.wide .inner-list{width:calc(100% + 2rem);}
.global-top-list .inner-list .list-item{position: relative; display: flex; flex-direction: column; justify-content: center; width:calc(50% - 2rem); margin:1rem; padding:2.5rem 3rem; padding-right:8rem; box-sizing:border-box; border-radius:1.2rem; background: rgba(255, 255, 255, 0.03);}
.global-top-list .inner-list .list-item .arrow{position: absolute; top:50%; right:3.2rem; font-size:3.2rem; color:rgba(255,255,255,0.2); transform:translateY(-50%); transition:var(--transition-custom);}
.global-top-list .inner-list .list-item .location-tit{position: relative; font-size:2.4rem; line-height:1.35; letter-spacing:-0.04em; font-weight:700; color:#fff;}
.global-top-list .inner-list .list-item .location-txt{position: relative; font-size:1.6rem; line-height:1.6; letter-spacing:-0.04em; font-weight:500; color:rgba(255,255,255,0.5); margin-top:0.8rem;}

/* .global-top-con,
.global-tab-con{ opacity:0; transition:opacity 0.2s ease; } */

.global-top-list .inner-list .list-item:hover .arrow{color:#fff;}

.global-top-con.active,
.global-tab-con.active{ opacity:1; }

/* 수정 */
.global-top-list .inner-list02{display: block; width: 100%; margin:-2rem 0;}
/* .global-top-list .toggle-item + .toggle-item{margin-top:2rem;} */
.global-top-list .toggle-item{width:100%; position: relative; background:rgba(255,255,255,0.03); border-radius:1.2rem; transition:var(--transition-custom); margin:2rem 0;}
.global-top-list .toggle-item .toggle-tit-box{position: relative; padding:3.2rem; padding-right:6.4rem; box-sizing:border-box; cursor:pointer;}
.global-top-list .toggle-item .toggle-tit-box .location-tit{font-size:2.4rem; line-height:1.35; letter-spacing:-0.04em; color:#fff; font-weight:700; transition:var(--transition-custom)}
.global-top-list .toggle-item .toggle-tit-box .location-txt{font-size:1.6rem; line-height:1.6; letter-spacing:-0.04em; color:rgba(255,255,255,0.5); font-weight:500; margin-top:0.8rem; transition:var(--transition-custom)}
.global-top-list .toggle-item .toggle-tit-box .arrow{position: absolute; top:50%; right:3.2rem; font-size:3.2rem; color:rgba(255,255,255,0.2); transform:translateY(-50%); transition:var(--transition-custom)}

.global-top-list .toggle-item .toggle-con-JS{position: relative; display: none; padding:3.2rem; padding-top:0; box-sizing:border-box;}
.global-top-list .toggle-item .toggle-con-box{display: flex; justify-content:space-between;}
.global-top-list .toggle-item .toggle-con-box .img-box{}
.global-top-list .toggle-item .toggle-con-box .img-box span{position: relative; display: block; width:100%; height:0; padding-top:56%; border-radius:0.8rem; overflow:hidden;}
.global-top-list .toggle-item .toggle-con-box .img-box span img{position: absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.global-top-list .toggle-item .toggle-con-box .info-box{margin-top:1.6rem; border-radius:0.8rem; width:100%; background:#f5f5f5; padding:2.4rem; box-sizing:border-box;}
.global-top-list .toggle-item .toggle-con-box .info-box dl{display: flex; font-size:1.6rem; line-height:1.6; letter-spacing:-0.04em; color:#rgba(0,0,0,0.6);}
.global-top-list .toggle-item .toggle-con-box .info-box dl + dl{margin-top:0.8rem;}
.global-top-list .toggle-item .toggle-con-box .info-box dl dt{position: relative; top:2px; width:2.8rem;}
.global-top-list .toggle-item .toggle-con-box .info-box dl dd{width:calc(100% - 2.8rem);}
.global-top-list .toggle-item .toggle-con-box .info-box dl dd a{text-decoration:underline;}

.global-top-list .toggle-item .toggle-con-box .map-box{width:100%; height:36rem; border-radius:0.8rem; overflow:hidden;}


.global-top-list .toggle-item .toggle-con-box .left-box{width:calc(50% - 0.8rem);}
.global-top-list .toggle-item .toggle-con-box .right-box{width:calc(50% - 0.8rem); border-radius:0.8rem; overflow:hidden;}
.global-top-list .toggle-item .toggle-con-box .wide-box{width:100%;}

.google-map{width:100%; height:100%;}

/* open */
.global-top-list .toggle-item.open{background:#fff;}
.global-top-list .toggle-item.open .toggle-tit-box .location-tit{color:#000;}
.global-top-list .toggle-item.open .toggle-tit-box .location-txt{color:rgba(0,0,0,0.5);}
.global-top-list .toggle-item.open .toggle-tit-box .arrow{color:#000; transform:translateY(-50%) rotate(180deg);}

@media all and (max-width:800px){
	.global-top-list .inner-list02{width:100%;}
	.global-top-list .toggle-item .toggle-tit-box{padding:2rem var(--area-padding); padding-right:5rem;}
	.global-top-list .toggle-item .toggle-tit-box .location-tit{font-size:2rem;}
	.global-top-list .toggle-item .toggle-tit-box .location-txt{font-size:1.4rem;}
	.global-top-list .toggle-item .toggle-tit-box .arrow{right:var(--area-padding); font-size:2.4rem;}
	
	.global-top-list .toggle-item .toggle-con-JS{padding:0 var(--area-padding) 2rem; }
	.global-top-list .toggle-item .toggle-con-box{display: block;}
	.global-top-list .toggle-item .toggle-con-box .info-box{padding:2rem 1.5rem;}
	.global-top-list .toggle-item .toggle-con-box .info-box dl + dl{margin-top:0.5rem;}
	.global-top-list .toggle-item .toggle-con-box .left-box{width:100%; margin-bottom:1.6rem;}
	.global-top-list .toggle-item .toggle-con-box .right-box{width:100%; height:20rem;}
	.global-top-list .toggle-item .toggle-con-box .map-box{height:20rem;}
}


/* ***********************
	*	커스텀 셀렉트 스타일 추가css 
*********************** */
.gs-custom-selectbox.global-selectbox {position: relative; display: inline-block; width: 100%; height:6.4rem;}
.gs-custom-selectbox.global-selectbox select {display: none;}
.gs-custom-selectbox.global-selectbox .select-style {width: 100%; text-align: left; vertical-align: middle; border:0; line-height: 6.4rem; font-size:1.6rem; color: #fff; display:inline-block; box-sizing: border-box; cursor: pointer; height:100%;}
.gs-custom-selectbox.global-selectbox .select-style .border-gradient{padding-left: 3.2rem; border-radius:1.2rem; box-sizing:border-box; background: rgba(255, 255, 255, 0.03); height:100%;}
.gs-custom-selectbox.global-selectbox .select-style span {position: relative; display: inline-block;}
.gs-custom-selectbox.global-selectbox .select-style:after {font-family: 'xeicon'; position: absolute; top: 50%; right: 3.2rem; transform: translateY(-50%); content: "\e936"; font-size: 2.4rem; color: #fff;}
.gs-custom-selectbox.global-selectbox .select-options {position: absolute; z-index: 1; top: 100%; left: 0; display: none; width: 100%; margin-top: 0.5rem; padding: 0; list-style: none; background-color: #fff; border: 2px solid #ddd; border-radius: 1rem; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; max-height: 23rem;}
.gs-custom-selectbox.global-selectbox .select-options li {padding: 1.2rem 1.5rem; font-size: 1.4rem; color: #666; cursor: pointer;}
.gs-custom-selectbox.global-selectbox .select-options li:hover {background-color: #f5f5f5;}
/* open */
.gs-custom-selectbox.global-selectbox.open .select-options {display: block;}
.gs-custom-selectbox.global-selectbox.open .select-style:after{content: "\e930";}


@media all and (max-width:1500px){
	.global-top-wrap .area{padding:0}
}
@media all and (max-width:1280px){
	.global-top-list{display: block;}
	.global-top-list .global-top-category{position: relative; top:auto; margin-bottom:4rem; margin-inline:auto 0;}
	.global-top-list .inner-list{width:calc(100% + 2rem);}
}
@media all and (max-width:800px){
	.global-top-wrap{margin-bottom:3rem; padding-top:0;}
	.global-top-list .global-top-category{width:18rem;}

	.global-top-list .inner-list .list-item{padding:2rem 1.5rem;}
	.global-top-list .inner-list .list-item .location-tit{font-size:2rem;}
	.global-top-list .inner-list .list-item .location-txt{font-size:1.4rem;}
	
	.gs-custom-selectbox.global-selectbox{height:4rem;}
	.gs-custom-selectbox.global-selectbox .select-style {line-height: 4rem; font-size:1.4rem;}
	.gs-custom-selectbox.global-selectbox .select-style .border-gradient{padding-left: 2rem; }
	.gs-custom-selectbox.global-selectbox .select-style:after {right: 2rem; font-size: 2rem;}
	.gs-custom-selectbox.global-selectbox .select-options li {padding: 1rem 2rem; font-size:1.3rem;}
}
@media all and (max-width:480px){
	.global-top-list .inner-list .list-item{width:calc(100% - 2rem)}
}