@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-style{position:relative; height:60px; margin-bottom:6rem; z-index: 1;}
.sub-tab-list-style {max-width: 556px; border-radius: 4rem; background-color: rgba(0,0,0,0.05); backdrop-filter:blur(1rem); margin: 0 auto;}
.sub-tab-list-style ul{display:table; width:100%; height:100%; table-layout:fixed; border-radius: 4rem; padding: 6px; box-sizing: border-box; }
.sub-tab-list-style ul:after{display:none}
.sub-tab-list-style ul li{display:table-cell; vertical-align:middle; position:relative; width:33.333%; position: relative; z-index: 1;}
.sub-tab-list-style ul li a{display:table; height:44px; width:100%; border-radius: 3rem;}
.sub-tab-list-style ul li a em{display:table-cell; vertical-align:middle; color:#000; font-size:1.6rem; font-weight: 700; letter-spacing:-0.025em; text-align:center;  transition: all 0.4s; }
.sub-tab-list-style ul li.selected  {z-index: 2;}
.sub-tab-list-style ul li.selected a em{color:#fff; }

/* Tab Fixed Move*/
.sub-tab-list-style.top-fixed{position:fixed; top:70px; left:0; width:100%; height:60px;}
/* Mobile Tab Drop Menu */
.sub-drop-open-btn-style{display:none}

@media all and (min-width:1025px){
	/* Tab Fixed Background */
	.sub-tab-list-style:before{position:absolute; top:0px; bottom:0px; left:50%; width:0; content:""; background-color:#fff; border-bottom:1px solid #e5e5e5; transition:all 0.5s}
	.sub-tab-list-style.top-fixed:before{width:100%; margin-left:-50%}
}

/* -------- 공통 :: 버튼효과 -------- */
@media all and (min-width:801px){
	.cm-btn-full{position: relative; overflow:hidden;}
	.cm-btn-full .cm-fill {position: absolute; display: block; width: 0px; height: 0px; transform: translate(-50%,-50%); border-radius: 50%; opacity: 0.95; background: #fff; transition: width 0.7s, height 0.7s;}
	.cm-btn-full:hover .cm-fill{ width: 70vw; height: 70vw; }
}

.bg-fixed-con {background-repeat: no-repeat; background-position: center; background-size: cover; background-attachment: fixed;}

/* sub menu 이동 */
@media all and (min-width:801px){
	.move-line-wrap {position: absolute; width: 100%; margin: 0 auto; top: 10px; left: 0; pointer-events: none;}
	.tab-on-icon.move-line {position:absolute; left:0; top:0; z-index:1; height: 40px;}
	.tab-on-icon.move-line > span {height: 40px; background-color:#000; position:absolute; left:0; top:0; text-align:center; transition:background-color 0.5s; border-radius:30px;}
	
	.sub-tab-list-style .move-line-wrap {top: 6px;}
	.sub-tab-list-style .tab-on-icon.move-line {height: 44px;}
	.sub-tab-list-style .tab-on-icon.move-line > span {height: 44px; background-color: var(--main-color);}
}

/* ****************** 1.Company ********************** */
/* -------- 회사소개 -------- */
.intro-top {padding: 29rem 0;     background-image: url(/images/content/intro_top_bg.jpg);}
.intro-top .inner {width: 100%; text-align: center; box-sizing: border-box;}
.intro-top .inner .tit {font-size: 6.4rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.6;}
.intro-top .inner .txt {font-size: 2.4rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.5); line-height: 1.3; margin-top: 3rem;}
.intro-bottom {padding: 12rem 0 14.5rem; background-color: #F5F5F5; text-align: center;}
.intro-bottom .txt01 {font-size: 4rem; font-weight: 700; letter-spacing: -0.04em; color: #222; line-height: 1.4;}
.intro-bottom .txt02 {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-top: 3rem;}
.intro-bottom .intro-bottom-logo {margin-top: 10rem;}
.intro-bottom .intro-bottom-logo img {max-width: 100%;}

/* -------- CEO 인사말 -------- */
.greeting-top {padding-bottom: 6rem;}
.greeting-top strong {display: block; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: var(--main-color); line-height: 1.6; margin-bottom: 2rem;}
.greeting-top .greeting-tit {font-size: 4rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.4; margin-bottom: 6rem;}
.greeting-top .greeting-tit b {color: var(--main-color); font-weight: inherit;}
.greeting-top .greeting-txt01 {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.04em; color: #222; line-height: 1.6;}
.greeting-bottom {padding: 6rem 0 10rem; background-color: #F5F5F5;}
.greeting-bottom-inner {position: relative; display: flex; flex-wrap: wrap; align-items: end; border-bottom: 1px solid #000;}
.greeting-bottom-inner .txt-box {width: 61.32%; padding-bottom: 6rem;}
.greeting-bottom-inner .txt-box .greeting-txt02 {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6;}
.greeting-bottom-inner .txt-box .greeting-txt02 + .greeting-txt02 {margin-top:4rem;}
.greeting-bottom-inner .img-box {position: relative; width: 38.68%;} 
.greeting-bottom-inner .img-box img {position: absolute; bottom: 0; left: 0; width: 100%;}
.greeting-ceo-txt {padding-top: 5rem;}
.greeting-ceo-txt p {display: block; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #222; line-height: 1.8;}
.greeting-ceo-txt p strong {font-weight: inherit; display: inline-block; margin-left: 1rem;}

/* -------- 비전 및 미션 -------- */
#visionCon02{background-color: #fff;}
.vision-con {position: relative; height: 100vh; /* display: table; table-layout: fixed;width: 100%; */}
.vision-con-inner {/* display: table-cell; vertical-align: middle; */ width: 100%; box-sizing: border-box;}
.vision-scroll-icon {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
.vision-scroll-icon .bar{display: block; position: relative; width:3px; height:8rem; overflow:hidden; margin:auto; background: rgba(0,0,0,0.1);}
.vision-scroll-icon .bar em{position: absolute; display: block; width:100%; height:100%; animation: upDown 2s ease-in-out infinite; background:#000; }
.vision-scroll-icon .txt{display:block; color:rgba(0,0,0,0.5); font-size:1.6rem; letter-spacing:-0.03em; line-height:1.5; font-weight:500; margin-bottom:2rem;}
@keyframes upDown {
	0% {
		transform:  translateY(-120%);
	}
	100% {
		transform:  translateY(120%);
	}
}

#visionCon01 {background: url(/images/content/vision_con01_bg.jpg)no-repeat center/cover;}
.vision-con01 {display: flex; align-items: center;}
.vision-con01 .txt-con {width: 54.87%; padding-right: 8rem; box-sizing: border-box;}
.vision-con01 .txt-con .tit {display: block; font-size: 6.4rem; font-weight: 700; letter-spacing: -0.02em; color: var(--main-color); margin-bottom: 2.5rem;}
.vision-con01 .txt-con .txt01 {font-size: 3rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.3; margin-bottom: 3rem;}
.vision-con01 .txt-con .txt02 {font-size: 2.4rem; font-weight: 500; letter-spacing: -0.03em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-bottom:3.2rem;}
.vision-con01 .txt-con .txt03 {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6;}
.vision-con01 .img-con {width: 45.13%;}
.vision-con01 .img-con span {display: block; position: relative; width: 100%; height: 0; padding-top: 61.53%; border-radius: 2rem; overflow: hidden; box-shadow:1rem 1rem 4rem rgba(0,0,0,0.25);}
.vision-con01 .img-con span img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.vision-con01.reverse {flex-direction:row-reverse;}
.vision-con01.reverse .txt-con {text-align: right; padding-right: 0; padding-left: 8rem;}

#visionCon03 {background-color: #F5F5F5;}
.vision-con03-tit {display: block; font-size: 6.4rem; font-weight: 700; letter-spacing: -0.02em; color: var(--main-color); text-align: center;}
.vision-value-list { margin-top: 8rem; width: 100%; display: flex;flex-wrap: wrap;}
.vision-value-cir{position: relative; width: 100%; height: 0; padding-top: 100%;}
.vision-value-item{width: 25%; opacity:0; filter:blur(1rem); transition:all 1.2s ease-in-out; text-align: center;}
.vision-value-cir{position: relative; width: 100%; height: 0; padding-top: 100%;}
@media all and (min-width:801px){
	.vision-value-item:nth-child(1){transform:translateX(150%);}
	.vision-value-item:nth-child(2){transform:translateX(50%);}
	.vision-value-item:nth-child(3){transform:translateX(-49%);}
	.vision-value-item:nth-child(4){transform:translateX(-150%);}
}
.vision-value-item:nth-child(1) .vision-value-cir{background: url("/images/main/main_value_bg01.png?ver=251216") center/cover no-repeat;}
.vision-value-item:nth-child(2) .vision-value-cir{background: url("/images/main/main_value_bg02.png?ver=251216") center/cover no-repeat;}
.vision-value-item:nth-child(3) .vision-value-cir{background: url("/images/main/main_value_bg03.png?ver=251216") center/cover no-repeat;}
.vision-value-item:nth-child(4) .vision-value-cir{background: url("/images/main/main_value_bg04.png?ver=251216") center/cover no-repeat;}
.vision-value-cir:before {position: absolute; content:''; width:100%; height:100%; border-radius:50%; box-sizing:border-box; top:50%; left:50%; transform:translate(-50%, -50%);  animation: mainValueCir 3s linear infinite;}
.vision-value-item:nth-child(1) .vision-value-cir:before {border-top:4px solid #fff;}
.vision-value-item:nth-child(2) .vision-value-cir:before {border-bottom:4px solid #fff;}
.vision-value-item:nth-child(3) .vision-value-cir:before {border-top:4px solid #fff;}
.vision-value-item:nth-child(4) .vision-value-cir:before {border-bottom:4px solid #fff;}
@keyframes mainValueCir {
	0% {
		transform: translate(-50%, -50%) rotate(0);
	}
	100% {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

.vision-value-cir:after{position: absolute; top: 50%; margin-top: -3rem; left: -3rem; width: 6rem; height: 6rem; font-size: 2.4rem; color: #000; border-radius: 100%; display: flex; align-items: center; justify-content: center; content: "\e913"; font-family: xeicon; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0) 100%); backdrop-filter: blur(20px);}
.vision-value-item:nth-child(1) .vision-value-cir:after{display: none;}
.vision-value-inner{position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.vision-value-img{width: 100%; height: 7.7rem; display: flex; align-items: center; justify-content: center;}
.vision-value-img img{max-height: 100%;}
.vision-value-txt{margin-top: 3rem; text-align: center;}
.vision-value-txt h5{height: 2.66em; font-size: 3rem; line-height: 1.33; letter-spacing: -0.04em; font-weight: 700; color: #000; display: flex; align-items: center; justify-content: center;}
.vision-value-item .bottom-txt {margin-top: 4rem; font-size: 1.6rem; line-height: 1.3; letter-spacing: -0.04em; color: rgba(0,0,0,0.5);}

/* animated */
.vision-con-inner.animated .vision-value-item{opacity:1; filter:blur(0); transform:translateX(0px);}

/* -------- 연혁 -------- */
.history-content {max-width: 1760px; margin: 0 auto;}
.history-top-con {text-align: center; padding: 14rem var(--area-padding) 11rem; background-image: url(/images/content/history_top_img.jpg); border-radius: 2rem; margin-bottom: 15rem;}
.history-top-txt {margin-bottom: 6rem;}
.history-top-txt strong {display: block; font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; margin-bottom: 4rem;}
.history-top-txt .tit {font-size: 6rem; font-weight: 700; letter-spacing: -0.02em; color: #fff; line-height: 1.2; margin-bottom: 1.5rem;}
.history-top-txt .txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(255,255,255,0.6); line-height: 1.6;}
.history-tab-wrapper-style{position:relative; height: 60px; text-align: center; z-index: 2;}
.history-tab-list-style {position: relative; display: inline-block; border-radius: 40px; background-color: rgba(0,0,0,0.05);  backdrop-filter:blur(1rem); }
.history-tab-list-style ul{position: relative; display: flex; height: 60px; border-radius: 40px;  -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box; padding: 10px; }
.history-tab-list-style ul li{display:table-cell; vertical-align:middle; position:relative; width: 16.2rem; border-radius: 3rem; z-index:1; }
.history-tab-list-style ul li a{display:table; height:40px; width:100%; }
.history-tab-list-style ul li a em{display:table-cell; vertical-align:middle; text-align: center; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.025em; color: #fff;  transition:all 0.3s;}
.history-tab-list-style ul li.selected{z-index:2;}
.history-tab-list-style ul li.selected em {color: #fff;}
.history-tab-list-style.top-fixed {position: fixed; top:calc( var(--header-fixed-height) + 20px); left: 50%;width: auto; transform: translateX(-50%); z-index: 99; will-change: transform; transition:top 0.8s ease-in-out}
.scroll-down .history-tab-list-style.top-fixed{top: 30px;}

.history-drop-open-btn-style {display: none;}
.history-con {position: relative; padding-bottom: 20rem;}
.history-percent-bar {position: absolute;top: 0; left: 50%; border-radius: 2px; margin-left: -0.2rem; width:0.4rem;height: calc(100% - 20rem); background: #eee;}
.history-percent-bar .percent-bar-child {position: absolute;content: ""; width: 100%;  height: 0; background-color: var(--main-color); z-index: 1; border-radius:2px 2px 0 0; will-change:height;}
.percent-bar-child .point { display: flex; align-items: center; justify-content: center;  position: absolute; bottom: -3rem; left: calc(50% - 2rem); content: ""; z-index: 10; width: 4rem; height: 4rem; border-radius: 4rem; border: 2px solid rgba(0,92,185,0.3); padding: 3px; box-sizing: border-box; will-change:bottom, left;}
.percent-bar-child .point span {width: 100%; height: 100%; border-radius: 50%; background-color: var(--main-color); display: flex; align-items: center; justify-content: center;}
.history-year-group-box {position: relative; display: flex; padding-bottom: 10rem;}
.history-year-group-box:last-of-type {padding-bottom: 0;}
.history-year-group-box .history-img-box {width: 50%; text-align: right; padding-right: 10rem; box-sizing: border-box;}
.history-year-group-box .history-img-list li {position: relative; border-radius: 2rem; overflow: hidden;}
.history-year-group-box .history-img-list li span {display: block; position: relative; width: 100%; height: 0; padding-top: 67.74%; border-radius: 2rem; overflow: hidden;}
.history-year-group-box .history-img-list li span img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.history-year-group-box .history-img-list .slick-dots {position: absolute; left: 2.4rem; bottom: 2.4rem; display: inline-flex; z-index: 1000;}
.history-year-group-box .history-img-list .slick-dots li {margin-left: 1.6rem;}
.history-year-group-box .history-img-list .slick-dots li:first-child {margin-left: 0;}
.history-year-group-box .history-img-list .slick-dots li button {font-size: 0; width: 1rem; height: 1rem; border-radius: 1rem; background: #fff; opacity: 0.5; transition:all 0.3s;}
.history-year-group-box .history-img-list .slick-dots li.slick-active button {opacity: 1;} 
.history-year-group-box .history-info-box {position: relative; width: 50%; text-align: left;  padding-left: 10rem; box-sizing: border-box;}
.history-year-group-box .history-year-group-tit {position: absolute; left: 10rem; top: 0; font-size: 6rem; font-weight: 700; letter-spacing: -0.02em; color: #000; transition:all 0.4s;}
.history-year-group-box.active .history-year-group-tit {font-size: 6.4rem; color: var(--main-color);}
.history-year-group-box .history-year-list-box {padding-top: 11rem;}
.history-year-group-box .history-year-item {display: flex; margin-bottom: 3rem;}
.history-year-group-box .history-year-item:last-of-type {margin-bottom: 0;}
.history-year-group-box .history-year-item .history-year {position: relative; width: 9rem; padding-left: 2rem; box-sizing: border-box;}
.history-year-group-box .history-year-item .history-year strong {display: inline-block; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.7; }
.history-year-group-box .history-year-item .history-year:before {position: absolute; content: ''; top: 1rem; left: 0; width: 0.6rem; height: 0.6rem; border-radius: 0.6rem; background-color: #DDDDDD;}
.history-year-group-box .history-year-item .history-month-box {width: calc(100% - 9rem);}
.history-year-group-box .history-year-item .history-month-box .history-month-item {display: flex; margin-bottom: 0.5rem;}
.history-year-group-box .history-year-item .history-month-box .history-month-item:last-child {margin-bottom: 0;}
.history-year-group-box .history-year-item .history-month-item .history-month {display: block; width: 5rem; font-size: 2rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.7; color: #666;}
.history-year-group-box .history-year-item .history-month-item .history-detail-txt-con {width: calc(100% - 5rem);}
.history-year-group-box .history-year-item .history-month-item .history-detail-txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.44;}

@media all and (min-width:801px){
	.history-year-group-box.reverse {flex-direction: row-reverse;}
	.history-year-group-box.reverse .history-img-box {width: 50%; text-align: left; padding-right: 0; padding-left: 10rem;}
	.history-year-group-box.reverse .history-info-box {padding-left: 0; text-align: right; padding-right: 10rem; }
	.history-year-group-box.reverse .history-year-group-tit {left: auto; right: 10rem;}
	.history-year-group-box.reverse .history-year-item {flex-direction: row-reverse;}
	.history-year-group-box.reverse .history-year-item .history-year {padding-left: 0; padding-right: 2rem;}
	.history-year-group-box.reverse .history-year-item .history-year:before {left: auto; right: 0;}
	.history-year-group-box.reverse .history-year-item .history-month-box .history-month-item {flex-direction: row-reverse;}
}

/* -------- 오시는길 -------- */
.location-page {padding-bottom: 10rem;}
.location-content {height: 100vh; max-width: 1760px; margin: 0 auto;}
.location-con-wrap {display: flex; height: 100%; flex-wrap: wrap; justify-content: space-between; padding:5.5rem 2rem; box-sizing: border-box;}
.location-con-wrap .location-map-con {width: calc(100% - 56rem); height: 100%; }
.location-map-list {position: relative; width: 100%; height: 100%;}
.location-map-list li {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 2rem; overflow: hidden; opacity: 0; visibility: hidden; transition:all 0.4s;}
.location-map-list li iframe { width: 100%; height: 100%;}
.location-map-list li.on {opacity: 1; visibility: visible; }
.location-item-con {width: 54rem; padding: 4rem; box-sizing: border-box; background-color: #F5F5F5; border-radius: 2rem;}
.location-tab-wrapper-style {position: relative; height: 6rem; margin-bottom: 8rem;}
.location-tab-list-style {position: relative; background-color: rgba(0, 0, 0, 0.05); backdrop-filter: blur(1rem); border-radius: 40px;}
.location-tab-list-style ul {display: flex; width: 100%; height:60px; border-radius: 40px;  padding: 10px; box-sizing: border-box;}
.location-tab-list-style ul li {display: table-cell;vertical-align: middle; position: relative;  z-index: 1; width: 25%; height: 100%;}
.location-tab-list-style ul li a {display: table; height: 40px; width: 100%; border-radius: 3rem; transition:all 0.3s;}
.location-tab-list-style ul li a em {display: table-cell; vertical-align: middle; text-align: center; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.025em; color: #000; transition:all 0.3s;}
.location-tab-list-style ul li.selected { z-index: 2;}
.location-tab-list-style ul li.selected a em {color: #fff;}
.location-tab-content-style {height: calc(100% - 14rem);}
.location-tab-con {height: 100%; display: flex; flex-direction:column; justify-content: space-between;}
.location-info-box .top-tit {padding: 0 7rem 3rem 0; position: relative; border-bottom: 1px solid #ddd;}
.location-info-box .top-tit strong {display: block; font-size: 4rem; font-weight: 700; letter-spacing: -0.04em; color: #222; line-height: 1.3;}
.location-info-box .top-tit span {position: absolute; right: 0; top: 0.2rem; display: block; width: 5rem; height: 5rem; text-align: center; border-radius: 50%; background-color: #fff;color: #000; }
.location-info-box .top-tit span i {line-height: 5rem; font-size: 2.4rem;}
.location-info-box .info-list {padding-top: 3rem;}
.location-info-box .info-list dl {display: flex; font-size: 2rem; letter-spacing: -0.04em; color: #222; line-height: 1.8; margin-bottom: 1rem;} 
.location-info-box .info-list dl dt {width: 10.7rem; padding-right: 0.5rem; box-sizing: border-box; font-weight: 700;}
.location-info-box .info-list dl dd {width: calc(100% - 10.7rem); font-weight: 500; color: rgba(0,0,0,0.5);}

.location-link-btn {position: relative; width: 100%; height: 8rem; display: flex; align-items: center; justify-content: space-between; background-color: #000; color: #fff; padding: 0 4rem;  border-radius: 1.6rem; box-sizing: border-box; transition: all 0.4s;}
.location-link-btn em {position: relative; font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; line-height: 1.3; z-index: 1;}
.location-link-btn i {position: relative; font-size: 2.4rem; z-index: 1;}
.location-link-btn.cm-btn-full .cm-fill {opacity: 1; background: var(--main-color);}


/* ****************** 2.Product ********************** */
/* -------- 인트로 페이지 -------- */
.prd-intro-content {/* background: url(/images/content/prd_intro_bg.jpg)no-repeat center/cover; */background: #f5f5f5;}
.prd-intro-img-con { position: relative; z-index: 1;}
.prd-intro-car-img {position: relative; width: 100%; height: 0; padding-top: 100vh; opacity: 0; transition-property: opacity, transform, -webkit-transform, filter; filter: blur(10px); transition:var(--transition-custom2);}
.prd-intro-car-img .img {position: absolute; top: 0px; left: 0; width: 100%; height: 100%;}
.prd-intro-car-img .img img {position: relative; top: 50%; width: 100%; height: auto; transform:translateY(-50%); }
.prd-intro-car-img .marker-con { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.prd-intro-car-img .marker-con .marker-item {position: absolute; left: 50%; top: 50%; transform:translate(-50%, calc(-50% + 30px));  width: 2rem; height: 2rem; z-index: 9; cursor: pointer; opacity: 0; transition-property: opacity,transform; transition:var(--transition-custom2); }
.prd-intro-car-img .marker-con .marker-item .inner {position: absolute; left: 50%; top: 50%; transform:translate(-50%, -50%);  width: 2rem; height: 2rem; display: flex; align-items: center; justify-content: center; transition:all 0.5s; cursor: pointer; will-change: transform, width, height; }
.prd-intro-car-img .marker-con .marker-item.marker01 {/* margin-top: -2.3rem; margin-left: 14.4rem; */margin-top: -1.1%; margin-left: 7.7%;}
.prd-intro-car-img .marker-con .marker-item.marker02 {/* margin-top: -9.6rem; margin-left: 12rem; */ margin-top: 5.2%; margin-left: -9%;}
.prd-intro-car-img .marker-con .marker-item.marker03 {/* margin-top: -2rem;margin-left: -4rem; */ margin-top: -0.9%; margin-left: -2.1%;}
.prd-intro-car-img .marker-con .marker-item.marker04 {/* margin-top: 3.5rem; margin-left: 0.5rem; */ margin-top: 1.8%; margin-left: 0.8%;}
.prd-intro-car-img .marker-con .marker-item i {position: absolute; left: 50%; top: 50%; font-size: 1.6rem; margin: -0.8rem 0 0 -0.8rem; color: #fff; z-index: 4; opacity: 0; transition:all 0.5s;}
.prd-intro-car-img .marker-con .marker-item .dot {width: 8px; height: 8px; background-color: var(--main-color); z-index: 3; border-radius:50%; transition:all 0.6s;  will-change: width, height;}
.prd-intro-car-img .marker-con .marker-item .inner > span {background:rgba(0, 92, 185, 0.6) ;border-radius: 50%; -webkit-animation-fill-mode: both; animation-fill-mode: both;position: absolute;left: 0;top: 0px;opacity: 0;margin: 0;width: 100%;height: 100%; animation: nation-circle 4s cubic-bezier(1, 2, 0.66, 3) infinite;  will-change: transform;}
.prd-intro-car-img .marker-con .marker-item .inner > span.wave02 {-webkit-animation-delay: 1s;animation-delay: 1s; }
.prd-intro-car-img .marker-con .marker-item .inner > span.wave03 {-webkit-animation-delay: 2s;animation-delay: 2s; }
.prd-intro-car-img .marker-con .marker-item .inner > span.wave04 {-webkit-animation-delay: 3s;animation-delay: 3s; }
@keyframes nation-circle {
 0% {
		-webkit-transform: scale(0);
		transform: scale(0);
		opacity: 0.3; 
	}
	50% {
		opacity: 0.3; 
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
		opacity: 0; 
	}
}

.prd-intro-car-img .marker-con .marker-item.on .inner {width: 7.5rem; height: 7.5rem;}
.prd-intro-car-img .marker-con .marker-item.on i {opacity: 1;}
.prd-intro-car-img .marker-con .marker-item.on .dot {width: 5rem; height: 5rem;}

.prd-intro-con {position: absolute; top: 0; left: 0; width: 100%; display: flex; align-items: center; justify-content: space-between; padding: calc(var(--header-height) + 2rem) 8rem 10rem; height: 100vh; box-sizing: border-box; /* z-index: 1; */}
.prd-intro-con .left-con {position: relative; z-index: 2; height: 100%; display: flex; flex-direction:column; justify-content: space-between;}
.prd-intro-con .left-con .tit-box {}
.prd-intro-con .left-con .tit-box h4 {font-size: 6.4rem; font-weight: 700; letter-spacing: -0.04em; color: #000; }
.prd-intro-con .left-con .tit-box .txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6;}
.prd-intro-tab-wrapper-style {position: relative; width: 20rem; padding: 0.5rem 1rem; box-sizing: border-box; border-radius: 2.4rem; background-color: #fff; opacity: 0; transform:translateY(50px); transition-property: opacity, transform, -webkit-transform, filter; filter: blur(10px); transition:var(--transition-custom2);}
.prd-intro-list-style {position: relative;}
.prd-intro-list-style ul {display: flex; flex-direction: column; }
.prd-intro-list-style ul li {position: relative;width: 100%; z-index: 1; padding:5px 0; }
.prd-intro-list-style ul li a {display: table; width: 100%; height: 6rem; text-align: center;    border-radius: 1.2rem;}
.prd-intro-list-style ul li a em {display: table-cell;vertical-align: middle; font-size: 1.8rem; font-weight: 700; letter-spacing: -0.025em; color: #000; transition:all 0.3s;}
.prd-intro-list-style ul li.selected {z-index: 2;} 
.prd-intro-list-style ul li.selected a em {color: #fff;}
.prd-intro-list-style .move-line-wrap {top: 0;}
.prd-intro-list-style .tab-on-icon.move-line > span {border-radius: 1.2rem;}
.prd-intro-con .right-con {position: relative; z-index: 2; width: 46rem; }
.prd-intro-con .prd-intro-tab-con {width: 100%; padding: 1.9rem; border-radius: 4rem; background-color: rgba(255,255,255,0.3); backdrop-filter: blur(2rem); border: 1px solid #fff; box-sizing: border-box; box-shadow: 2rem 2rem 7rem rgba(0,0,0,0.1); opacity: 0; transform:translateY(50px); transition-property: opacity, transform, -webkit-transform, filter; filter: blur(10px); transition:var(--transition-custom2);}
.prd-intro-con .prd-intro-tab-con .img-box {position: relative; width: 100%; height: 0; padding-top: 71.428%;}
.prd-intro-con .prd-intro-tab-con .img-box span {position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 2rem; overflow: hidden;}
.prd-intro-con .prd-intro-tab-con .img-box span img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.prd-intro-con .prd-intro-tab-con .txt-box {padding: 4.5rem 0 4rem; text-align: center;}
.prd-intro-con .prd-intro-tab-con .txt-box dl dt {font-size: 4.5rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.3; }
.prd-intro-con .prd-intro-tab-con .txt-box dl dd {font-size: 2rem; font-weight: 500; letter-spacing: -0.04em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-top: 1.2rem;}
.prd-intro-con .prd-intro-tab-con .txt-box .more-btn {position: relative; overflow: hidden; width: 100%; max-width: 24rem; margin: 3rem auto 0; height: 6.2rem; display: flex; align-items: center; justify-content: center; border-radius: 4rem; color: #000; border: 0.3rem solid #000; box-sizing: border-box; transition:all 0.5s;}
.prd-intro-con .prd-intro-tab-con .txt-box .more-btn .cm-fill {background: #000; opacity: 1;}
.prd-intro-con .prd-intro-tab-con .txt-box .more-btn em {position: relative; z-index: 1; font-size: 1.5rem; font-weight: 700; letter-spacing: -0.02em;}
@media all and (min-width:801px){
	.prd-intro-con .prd-intro-tab-con .txt-box .more-btn:hover {color: #fff;}
	.prd-intro-con .prd-intro-tab-con .txt-box .more-btn:hover .cm-fill {width: 40vw; height: 40vw;}
}

/* active */
.active .prd-intro-car-img {opacity: 1;-webkit-transform: none; transform: none;filter: blur(0px);}
.active .prd-intro-tab-wrapper-style {opacity: 1;-webkit-transform: none; transform: none;filter: blur(0px);}
.active .prd-intro-con .prd-intro-tab-con {opacity: 1;-webkit-transform: none; transform: none;filter: blur(0px);}
.active .prd-intro-tab-wrapper-style ,
.active .prd-intro-con .prd-intro-tab-con {transition-delay:0.1s;}
.active .prd-intro-car-img .marker-con .marker-item {opacity: 1; transform:translate(-50%, -50%)}
.active .prd-intro-car-img .marker-con .marker-item.marker02 {transition-delay:0.2s;}
.active .prd-intro-car-img .marker-con .marker-item.marker03 {transition-delay:0.3s;}
.active .prd-intro-car-img .marker-con .marker-item.marker04 {transition-delay:0.4s;}
.active .prd-intro-car-img .marker-con .marker-item.marker01 {transition-delay:0.5s;}
.prd-intro-con .left-con .tit-box .cm-word-split-JS.splitting .char{animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.prd-intro-con .left-con .tit-box h4.splitting .char,
.prd-intro-con .left-con .tit-box .txt.splitting .char {opacity:0; transform:translateY(100%);}
.active .prd-intro-con .left-con .tit-box h4,
.active .prd-intro-con .left-con .tit-box .txt {animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}
.active .prd-intro-con .left-con .tit-box .txt {animation-delay:0.1s;}  
.active .prd-intro-con .left-con .tit-box .cm-word-split-JS.splitting .char{animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;}

/* -------- 뷰 페이지 -------- */

/* 제품 설명 */
#prdViewCon01 {background-color: #F5F5F5;}
.prd-view-con01-wrap {width: 100%; height: 100%; box-sizing: border-box;}
.prd-view-con01 {display: flex; flex-wrap: wrap; gap:4rem; padding: var(--header-height) 0 4rem; width: 100%; height: 100%; box-sizing: border-box;}
.prd-view-con01 .left-con {position: relative; width: calc(100% - 66rem); height: 100%; border-radius: 4.8rem; background-color: #fff;}
.product-viewer-info{z-index: 1;}
/* 제품 이미지 회전 */
.product-viewer-wrap{position: relative; display: flex; align-items: flex-start; height:100%; overflow: hidden;}
.product-viewer-arrow{position: absolute; width:89.09%; height:100%; left:50%; transform:translateX(-50%); /* z-index:-1; */ box-sizing:border-box; pointer-events: none; /* opacity:1; transition:var(--transition-custom2); transition-property: opacity; */background: url("/images/content/product_bg_360.svg") center 65% no-repeat; background-size: contain;}
/* .product-viewer-arrow.fade-out{opacity:0; transition-delay: 0.2s;} */
/* 제품 이미지 뷰어 */
#product-viewer{position: relative; background-repeat:no-repeat; background-position: center; width:100%; height:85%; cursor:move; will-change: background-image; transition:all 0.01s; text-align:center; outline: none;}
#product-viewer img{
	position:absolute; top:50%; left: 50%; transform: translate(-50%, -54%); width: 110%; object-fit: cover;
	pointer-events: none; /* 이미지에 마우스 이벤트 발생 안하게 */
	user-select: none; /* 이미지 선택 방지 */
	-webkit-user-drag: none; /* 웹킷 브라우저에서 이미지 드래그 방지 */
}
@media all and (min-width:1280px){
	.prd-view-con01-wrap{height: 100vh;}
	#product-viewer { touch-action: pan-y; }
}

.prd-01-page #product-viewer img {width: 140%; transform: translate(-47%, -57%);} /* Cockpit Module */
.prd-02-page #product-viewer img {width: 141%; transform: translate(-50%, -57%);} /* Door Trim */
/* .prd-03-page #product-viewer img {width: 110%; transform: translate(-50%, -55%);} Console
.prd-04-page #product-viewer img {transform: translate(-47%, -54%);} */

.product-viewer-info {position: absolute; bottom: 7rem; left: 0; width: 100%; padding: 0 6rem; box-sizing: border-box; display: flex; align-items: end; justify-content: space-between;}
.product-viewer-info .txt-box{width: 31rem;}
.product-viewer-info .txt-box strong {display: block; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.05em; color: #000; line-height: 1.3;}
.product-viewer-info .txt-box .txt {margin-top: 0.5rem; font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6; }
.product-viewer-btn {width: 24rem; position: relative; display: inline-flex; z-index: 10;}
.product-viewer-btn .inner-btn {width: 12rem;}
.product-viewer-btn .inner-btn + .inner-btn {margin-left: 4rem;}
.product-viewer-btn .inner-btn a {position: relative; display: block; width: 100%;}
.product-viewer-btn .inner-btn a img {max-width: 100%;}
.product-viewer-btn .inner-btn a:before {position: absolute; top: -2rem; font-size: 1.4rem; font-weight: 500; letter-spacing: -0.05em; color: #000;}
.product-viewer-btn .inner-btn a.prev-btn:before {content: 'Prev'; right: 0;}
.product-viewer-btn .inner-btn a.next-btn:before {content: 'Next'; left: 0;}
.product-viewer-pop-btn{width: 31rem; display: flex; justify-content: flex-end;}
.product-viewer-pop-btn a{padding: 0 3rem; width: 24rem; height: 6rem; font-size: 2rem; letter-spacing: -0.04em; font-weight: 600; color: #fff; background-color: var(--main-color); border-radius: 6rem; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between;}
.product-viewer-pop-btn a i{font-size: 2.4rem;}

@media all and (max-width:1920px) and (min-width:1280px){
	.product-viewer-info .txt-box{width: 31rem; width: 16.14vw;}
	.product-viewer-info .txt-box strong {font-size: 1.25vw;}
	.product-viewer-info .txt-box .txt {font-size: 1.04vw;}
	.product-viewer-btn {width: 12.5vw;}
	.product-viewer-btn .inner-btn {width: 6.25vw;}
	.product-viewer-btn .inner-btn + .inner-btn {margin-left: 2.08vw;}
	.product-viewer-btn .inner-btn a:before {top: -1.04vw; font-size: 0.72vw;}
	.product-viewer-pop-btn{width: 16.14vw;}
	.product-viewer-pop-btn a{padding: 0 1.56vw; width: 12.5vw; height: 3.12vw; font-size: 1.04vw;}
	.product-viewer-pop-btn a i{font-size: 1.25vw;}
}

.product-viewer-arrow{opacity: 0; transition: opacity 1s ease-in-out;}
#product-viewer{opacity: 0; transition: opacity 0.6s ease-in-out;}
.prd-view-con01.active-start .product-viewer-arrow{opacity: 1;}
.prd-view-con01.active-start2 #product-viewer{opacity: 1;}

.prd-view-con01 .right-con {display: flex; flex-direction:column; justify-content: space-between;  position: relative; width: 62rem; height: 100%; padding: 5rem 5rem 4rem; border-radius: 4.8rem; background-color: #fff;  box-sizing: border-box; } 
.prd-description-con {display: flex; flex-direction:column; justify-content: space-between; height: calc(100% - 90px); padding: 0 2.5rem;}
.prd-description-con .txt-box {margin-bottom: 3rem;}
.prd-description-con .tit {font-size: 5rem; font-weight: 700; letter-spacing: -0.04em; color: #000; line-height: 1.3;}
.prd-description-con .txt {font-size: 1.9rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-top: 2rem; overflow:hidden;
	display:block;display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;}

.prd-top-video-container {position: relative; width: 100%; height: 0; padding-top: 56.25%;}
.prd-top-video-con {position: absolute; width: 100%; height: 100%; top: 0; left: 0; border-radius: 2rem; overflow: hidden;}
.prd-view-tab-con {width: 100%; height: 60px; margin-top: 30px;}
/* .prd-tab-wrapper-style {position: absolute; bottom: 5rem; left: 0; height: 60px; width: 100%; z-index: 1;} */

/* 제조 공정 */
.prd-view-con02 {width: 100%; max-width: 960px; margin: 0 auto;}
.prd-main-video-con {position: relative;}
.prd-main-video-m {display: none;}
/* .prd-main-video-list li .inner {transition: all 0.4s; pointer-events:none;}
.prd-main-video-list li .iframe-wrapper {overflow:hidden; position:relative; width:100%; height:0; padding-top:56.25%; border-radius: 2rem;}
.prd-main-video-list li .iframe-inner {position:absolute; top:0; left:0px; width:100%; height:100%}
.prd-main-video-list li .iframe-inner iframe{position:absolute; top:50%; left:50%; width:100%; height:calc(100% + 350px); transform:translate(-50%,-50%)}
.prd-main-video-list li .background-video-wrapper {overflow:hidden; position:relative; width:100%; height:0; padding-top:56.25%; border-radius: 2rem;}
.prd-main-video-list li .background-video{position:absolute; top:0; left:0px; width:100%; height:100%}
.prd-main-video-list li .background-video iframe{position:absolute; top:50%; left:50%; width:100%; height:calc(100% + 350px); transform:translate(-50%,-50%)} */

/*  PC 제품 탭 */
.prd-tab-wrapper-style{position: fixed; left: 50%; top: 50%;transform-origin: 0 0;will-change: transform; transition: transform 0.6s ease;z-index: 9999; visibility: hidden; opacity: 0;}
.prd-tab-list-style {position: relative;  width: 52rem; height: 60px; margin: 0 auto; transform:translateY(0); border-radius: 40px;     background-color: rgba(0, 0, 0, 0.05);  backdrop-filter: blur(1rem); transition: all 0.6s ease;}
.prd-tab-list-style ul {display: flex; width: 100%; height:60px; border-radius: 40px; padding: 10px; box-sizing: border-box;}
.prd-tab-list-style ul li {display: table-cell;vertical-align: middle; position: relative;  z-index: 1; /* width: 33.333%;  */width: 100%; height: 100%;}
.prd-tab-list-style ul li a {display: table; height: 40px; width: 100%; border-radius: 3rem; transition:all 0.3s;}
.prd-tab-list-style ul li a em {display: table-cell; vertical-align: middle; text-align: center; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.025em; color: #000; transition:all 0.3s;}
.prd-tab-list-style ul li.selected { z-index: 2;}
.prd-tab-list-style ul li.selected a em {color: #fff;}
.prd-tab-list-style.scroll-up {transform:translateY(70px);}

/*  PC 영상 슬라이드 */
.prd-main-video-container{position: fixed; z-index: 9998; top: 50%; left: 50%; width: 960px; transform-origin: 0 0; transition: transform 0.6s ease; will-change: transform; visibility: hidden; opacity: 0;}
.prd-main-video-list .slick-list {margin: 0 -12rem;}
.prd-main-video-list .slick-slide {margin: 0 12rem;}
.prd-main-video-list li {pointer-events:none;}
.prd-main-video-list li:not(.slick-active) .inner {opacity: 0; transition: all 0.4s;}
.prd-main-video-list li .background-video-wrapper {overflow:hidden; position:relative; width:100%; height:0; padding-top:56.25%; border-radius: 2rem;}
.prd-main-video-list li .background-video{position:absolute; top:0; left:0px; width:100%; height:100%}
.prd-main-video-list li .background-video iframe{position:absolute; top:50%; left:50%; width:100%; height:calc(100% + 350px); transform:translate(-50%,-50%)}
.prd-main-video-container.active-start {}
.prd-main-video-container.active-start .slick-list {overflow: visible;}
.prd-main-video-container.active-start  li:not(.slick-active) .inner {opacity: 0.1;}
.prd-main-video-container.is-hidden{/* opacity: 0;  */pointer-events: none;}
.prd-main-video-arrow {position: absolute; top: 50%; left: 0; transform:translateY(-50%); width: 100%; height: 3rem;z-index: 10000; visibility: hidden; opacity: 0;}
.prd-main-video-arrow button.slick-disabled {opacity: 0.2;}
.prd-main-video-arrow .prd-video-next-btn {position: absolute; right: -12rem; top: 0;}
.prd-main-video-arrow .prd-video-prev-btn {position: absolute; left: -12rem; top: 0;}
.prd-main-video-dot {position: relative; width: 52rem; height: 1rem; margin: 5rem auto 0; z-index: 10000; visibility: hidden; opacity: 0;}
.slick-scrollbar-track{ position: relative;width: 100%;height: 1rem; background: rgba(0,0,0,0.05);border-radius: 0.5rem; }
.slick-scrollbar-thumb{position: absolute;top: 0;left: 0; height: 100%; width: 20%; background: #000; border-radius: 0.5rem;cursor: grab;border: 0; padding: 0;}
.slick-scrollbar-thumb:active{cursor: grabbing;}

.prd-main-video-container.active-start .prd-main-video-dot {visibility: visible; opacity: 1;}
.prd-main-video-container.active-start .prd-main-video-arrow{visibility: visible; opacity: 1;}

.prd-tab-wrapper-style.is-ready,
.prd-main-video-container.is-ready{
  visibility: visible; opacity: 1;
}
.prd-main-video-container.start {pointer-events:none;}


/* 주요 제품 */
#prdViewCon03 {background-color: #F5F5F5;}
.prd-view-con03 {padding-top: 12rem;}
.prd-view-con03 .inner-con {width: 100%; box-sizing: border-box;}
/* 썸네일영역 */
.prd-major-thum-con{width: 100%; max-width: 109rem; max-width: 1090px; margin: 0 auto 4rem;}
.prd-major-thum-con .cm-scroll-drag-guide{display: none;}
.prd-major-thum-container{width: 100%;}
.prd-major-thum-list{display: flex; align-items: center;}
@media all and (min-width:801px){
	.prd-major-thum-list{justify-content: center;}
}
.prd-major-thum-item{width: 9%; margin-right: 1%; cursor: pointer; transition:opacity 0.4s;}
.prd-major-thum-item .img-box{position: relative; width: 100%; height: 0; padding-top: 100%; border-radius: 2rem; background-color: rgba(255,255,255,0.85); overflow: hidden; transition:background-color 0.4s;}
.prd-major-thum-item .img-box:after {position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 100%; border-radius: 2rem; border: 4px solid var(--main-color); box-sizing: border-box; opacity: 0; transition:opacity 0.4s;}
.prd-major-thum-item .img-box img{position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; max-width: 70%; max-width: 70%; opacity: 0.25; transition:opacity 0.4s;}
.prd-major-thum-item.on .img-box {background-color: #fff;}
.prd-major-thum-item.on .img-box:after {opacity: 1;}
.prd-major-thum-item.on .img-box img {opacity: 1;}
/* 슬라이드 */
.prd-major-con {padding: 0 3rem; box-sizing: border-box;}
.prd-major-list-container.swiper-container {overflow: visible;}
.prd-major-list li {position: relative; border-radius: 3.2rem; background-color: #fff; height: -webkit-fill-available;}
.prd-major-list li:before {position: absolute; content: ''; width: 100%; height: 100%; border-radius: 3.2rem; border: 4px solid var(--main-color); box-sizing: border-box; opacity: 0; transition:all 0.4s;}
.prd-major-list li .inner {display: flex; flex-direction:column; justify-content: space-between; padding: 2rem;  box-sizing: border-box; transition:opacity 0.4s;}
.prd-major-list li:not(.active-slide) .inner {opacity: 0.15;}
.prd-major-list li .inner span {position: absolute; right: 2rem; top: 2rem; display: inline-flex; align-items: center; text-align: center; height: 3rem; padding: 0 1.3rem; border-radius: 3rem; background-color: #000; font-size: 1.6rem; font-weight: 600; letter-spacing: -0.04em; color: #fff; z-index: 1; transition:all 0.4s;}
.prd-major-list li .inner .img-box {position: relative; width: 100%; height: 0; padding-top: 100%;}
.prd-major-list li .inner .img-box img {position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-width: 100%; max-height: 100%;}
.prd-major-list li .inner .tit {display: block; font-size: 3.2rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.3; padding: 1rem 2rem; word-break: break-word; box-sizing: border-box; margin-top: 5rem; transition:all 0.4s;}
.prd-major-list li.on:before {opacity: 1;}
.prd-major-list li.on .inner span {background-color: var(--main-color);}
.prd-major-list li.on .inner .tit {color: var(--main-color);}
/* 드래그바 */
.prd-major-progress {position: relative; margin-top: 1.5rem; display: none;}
.prd-major-progress-bar {position: relative; width: 100%; height: 15.3rem;}
.prd-major-progress-bar .swiper-pagination {  position: absolute; height: 4px; top: 50%; margin-top: -2px; bottom: auto; left: 0; width: 100%; background-color: #DDDDDD;}
.prd-major-progress-bar .swiper-pagination .bar-fill{display: block; position:absolute; left:0; top:0; height:100%; width:100%; background:#000;transform: scaleX(0); transform-origin: left center;}
/* .prd-major-progress-bar .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {background: #000;} */
.prd-major-progress-bar .swiper-scrollbar {height: 4px; top: 50%; margin-top: -2px; bottom: auto; left: 0; width: 100%;  background: transparent;}
.prd-major-progress-bar .swiper-scrollbar-drag {position: relative; height: 15.3rem; top: -7.65rem;background: transparent; z-index: 11; }
.prd-major-progress-bar .swiper-scrollbar-drag .point {position: absolute; width: 15.3rem; height: 15.3rem; right: -7.65rem; top: 0; display: flex; align-items: center; justify-content: center; z-index: 1; }
.prd-major-progress-bar .swiper-scrollbar-drag .point:before {position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background: url(/images/content/prd_view_drag_btn.svg)no-repeat center/100%; animation: point-spin 14s infinite linear;}
.prd-major-progress-bar .swiper-scrollbar-drag .point span {display: flex; align-items: center; justify-content: center; width: 8rem; height: 8rem; border-radius: 50%; background-color: #000; padding: 2rem; box-sizing: border-box;}
.prd-major-progress-bar .swiper-scrollbar-drag .point span img {max-width: 100%;}
@keyframes point-spin {
  to { transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { transform: rotate(360deg); }
}



/* ****************** 3.R&D ********************** */
/* -------- R&D 소개 -------- */
.rnd-intro-content {display: flex; align-items: end; height: 100vh; background-image: url(/images/content/rnd_intro_bg.jpg?ver=260119); }
.rnd-intro-bottom {position: relative; width: 100%; background-color: rgba(0,0,0,0.1); backdrop-filter:blur(2rem);}
.rnd-intro-bottom .inner {padding: 8rem 0 10rem; max-width: 1280px; margin: 0 auto; display: flex;}
.rnd-intro-bottom .inner .tit {width: 43.75%; padding-right:4rem; font-size: 4rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.4; box-sizing: border-box;}
.rnd-intro-bottom .inner .txt-box {width: 56.25%; }
.rnd-intro-bottom .inner .txt-box .txt01 {font-size: 2.4rem; font-weight: 700; line-height:1.6; letter-spacing: -0.04em; color: #fff; }
.rnd-intro-bottom .inner .txt-box .txt02 {font-size: 2rem; font-weight: 500; line-height: 1.6; letter-spacing: -0.02em; color: rgba(255,255,255,0.8); margin-top: 2rem;}

/* -------- 연구분야 -------- */
.field-content {padding:10rem 0 16rem; background-color: #F5F5F5;}
/* 제품설계 */
.field01-list {display: flex; flex-wrap: wrap; gap:3rem}
.field01-list li {display: flex; flex-direction:column; justify-content: space-between; width: calc(33.333% - 2rem); background-color: #fff; border-radius:2rem; padding: 6rem 5rem 4.5rem; box-sizing: border-box; transition: var(--transition-custom2); opacity: 0;  transition-property: opacity, transform, -webkit-transform;  -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0);}
.field01-list li .txt-box { margin-bottom: 4.7rem;}
.field01-list li .txt-box .tit {display: block; font-size: 3.6rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.3; margin-bottom: 1rem;}
.field01-list li .txt-box .txt {font-size: 2.2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-bottom: 2.2rem;}
.field01-list li .txt-box .sub-txt p {position: relative; padding-left: 2.9rem; font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.6; color: rgba(0,0,0,0.5); }
.field01-list li .txt-box .sub-txt p + p {margin-top: 0.5rem;}
.field01-list li .txt-box .sub-txt p:before {position: absolute; left: 0; top: 0.1rem; content: '\e92b'; font-family: xeicon; }
.field01-list li .img-box {position: relative; width: 100%; height: 0; padding-top: 66.295%; border-radius: 1rem; overflow: hidden;}
.field01-list li .img-box img {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
@media all and (min-width:801px){
	.field01-list li:nth-child(3n + 1) { transition-delay: 0s !important; }
	.field01-list li:nth-child(3n + 2) { transition-delay: 0.12s !important; }
	.field01-list li:nth-child(3n + 3) { transition-delay: 0.24s !important; }
}
.field01-list li.animated  { opacity: 1;  -webkit-transform: none;  transform: none; pointer-events: auto;}

/* 선행연구 */
.field02-con-item {display: flex; flex-wrap: wrap; justify-content: space-between;}
.field02-con-item + .field02-con-item {margin-top: 3rem;}
.field02-con-item .left-con {width: 31.52%; background-color: #fff; border-radius: 2rem; display: flex; flex-direction:column; justify-content: space-between; padding: 9rem 7.5rem 5.5rem; box-sizing: border-box;} 
.field02-con-item .left-con .txt-box .tit {font-size: 4rem; font-weight: 700; letter-spacing: -0.03em; color: #040404; line-height: 1.25;}
.field02-con-item .left-con .txt-box .txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-top: 1.5rem;}
.field02-con-item .left-con .txt-box .bar {position: relative; display: block; width: 4px; height: 10rem; background-color: rgba(0,0,0,0.08); margin-top: 3rem; border-radius: 3rem;}
.field02-con-item .left-con .txt-box .bar:before {position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 2.4rem; border-radius: 3rem; background-color: #000; z-index: 1;}
.field02-con-item .left-con .count-box {font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; color: rgba(0,0,0,0.5);}
.field02-con-item .left-con .count-box span {display: inline-block;}
.field02-con-item .left-con .count-box span.cur-num {font-size:2.4rem; color: #000;}
.field02-con-item .left-con .count-box em {display: inline-block; margin: 0 0.5rem;}
.field02-con-item .right-con {width: 67.36%;}
.field02-con-item .right-con .img {display: block; position: relative; width: 100%; height: 0; padding-top: 67.01%; border-radius: 2rem; overflow: hidden;}
.field02-con-item .right-con .img img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

/* 제품개발 */
.field03-con-item {display: flex; align-items: center; border-radius:2rem; background-color: #fff; padding: 4rem;box-sizing: border-box;}
.field03-con-item + .field03-con-item {margin-top: 2rem;}
.field03-con-item .img-box {width: 45.51%;}
.field03-con-item .img-box span {display: block; position: relative; width: 100%; height: 0; padding-top: 67.2%; border-radius: 1rem; overflow: hidden; }
.field03-con-item .img-box span img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.field03-con-item .txt-box {width: 54.49%; padding-left: 8.8%; box-sizing: border-box;}
.field03-con-item .txt-box .tit {font-size: 3.6rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.2; margin-bottom: 1.5rem;}
.field03-con-item .txt-box .txt {font-size: 2.2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6; margin-bottom: 2.3rem;}
.field03-con-item .txt-box .sub-txt p {position: relative; padding-left: 2.9rem; font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; line-height: 1.6; color: rgba(0,0,0,0.5); }
.field03-con-item .txt-box .sub-txt p + p {margin-top: 0.5rem;}
.field03-con-item .txt-box .sub-txt p:before {position: absolute; left: 0; top: 0.1rem; content: '\e92b'; font-family: xeicon; }

/* -------- 연구 개발 전략 -------- */
.development-content {padding: 10rem 0 16rem; background-color: #F5F5F5;}
.development-con-item {display: flex; align-items: center; border-radius: 2rem; background-color: #fff; padding: 4rem 4rem 4rem 2rem; box-sizing: border-box;}
.development-con-item + .development-con-item {margin-top: 4rem;}
.development-con-item.reverse {flex-direction:row-reverse; padding: 4rem 2rem 4rem 4rem;}
.development-con-item .tit-box {width: 51.45%; text-align: center;}
.development-con-item .tit-box strong {display: block; font-size: 4.2rem; font-weight: 700; letter-spacing: -0.02em; color: #ddd; line-height: 1.1; margin-bottom: 3rem;}
.development-con-item .tit-box .tit {font-size: 3.2rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.4;}
.development-con-item .img-box {width: 48.55%;}
.development-con-item .img-box span {position: relative; display: block; width: 100%; height: 0; padding-top: 53.73%; border-radius: 1rem; overflow: hidden;}
.development-con-item .img-box span img {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
 
/* -------- 연구 설비 현황 -------- */
.status-content {padding: 10rem 0 16rem; background-color: #F5F5F5;}
.status-tab-wrapper-style {margin-bottom: 6rem;}
.status-tab-list-style {border-bottom: 2px solid #ddd;}
.status-tab-list-style ul {display: flex; justify-content: center;}
.status-tab-list-style ul li a {display: inline-block; padding: 0 3rem;}
.status-tab-list-style ul li a em {display: block; position: relative; font-size: 1.8rem; font-weight: 700; letter-spacing: -0.025em; color: rgba(34,34,34,0.5); padding-bottom: 2rem;}
.status-tab-list-style ul li a em:before {position: absolute; content: ''; width: 0; bottom: -2px; left: 50%; transform:translateX(-50%); height: 2px; background-color: #000;}
.status-tab-list-style ul li.selected a em {font-weight: 700;color: #000; }
.status-tab-list-style ul li.selected a em:before {width: 100%;}

.status-list-con .bbs-no-list {border-top: 0; padding: 10rem 0 16rem;}
.status-list {display: flex; flex-wrap: wrap; margin: -1.5rem;}
.status-list li {width: calc(33.333% - 3rem); margin: 1.5rem;  transition: var(--transition-custom2); opacity: 0;  transition-property: opacity, transform, -webkit-transform;  -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0);}
.status-list li.animated {opacity: 1;  -webkit-transform: none;  transform: none; pointer-events: auto;}
.status-list li a {display: block; width: 100%; height: 100%; border-radius: 2rem; overflow: hidden; background-color: #fff;  transition:all 0.4s;}
.status-list li a .img-box {position: relative; width: 100%; height: 0; padding-top: 60.87%;}
.status-list li a .img-box:before {position: absolute; content: '\ea3f'; font-family: xeicon; top: 50%; left: 50%; margin: -3rem 0 0 -3rem; font-size: 6rem; color: #fff; z-index: 1;}
.status-list li a .img-box span {position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; filter: brightness(0.8);}
.status-list li a .img-box span img {position: absolute;  top: 0; left: 0;  right: 0; bottom: 0; width: 100%; height: 100%; transition: all 0.5s;}
.status-list li a .txt-box {position: relative; padding: 4rem; box-sizing: border-box; min-height: 24rem;}
.status-list li a .txt-box:before {position: absolute; bottom: 4rem; right: 4rem; content: '\e90b'; font-family: xeicon; font-size: 2.4rem; color: #000; opacity: 0.5; transition:all 0.4s;}
.status-list li a .txt-box .cate {display: block; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.025em; color: var(--main-color); line-height: 1.3; margin-bottom: 1.5rem;}
.status-list li a .txt-box .tit {font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; color: #000; line-height: 1.6; margin-bottom: 3rem;}
@media all and (min-width:801px){
	.status-list li:nth-child(3n + 1) { transition-delay: 0s !important; }
	.status-list li:nth-child(3n + 2) { transition-delay: 0.12s !important; }
	.status-list li:nth-child(3n + 3) { transition-delay: 0.24s !important; }

	.status-list li a:hover {box-shadow: 1rem 1rem 3rem rgba(0,0,0,0.1);}
	.status-list li a:hover .img-box span img {-webkit-transform: scale(1.08) rotate(0.002deg); 
		-moz-transform: scale(1.08) rotate(0.002deg);
		-ms-transform: scale(1.08) rotate(0.002deg);
		-o-transform: scale(1.08) rotate(0.002deg); 
		transform: scale(1.08) rotate(0.002deg);}
	.status-list li a:hover .txt-box:before {opacity: 1; color: var(--main-color);}
}
/* 팝업 */
.status-modal-content{position:relative; width:96%; max-width:1300px; margin:20px auto; }
.status-modal-content .modal-close-btn{position:absolute; top:0; right:-5rem; color:#fff; }
.status-modal-content .modal-close-btn i{font-size:3.8rem;}
.status-modal-content .modal-close-btn i:hover {color:#fff}
.status-modal-inner{padding:4rem; background-color:#fff; border-radius: 2rem; box-sizing: border-box;}
.status-pop-con {display: flex; flex-wrap: wrap;}
.status-pop-con .video-con {width: calc(100% - 40rem); overflow:hidden;}
.status-pop-con .video-iframe-wrapper{position:relative; width: 100%; border-radius: 1rem;overflow:hidden;}
.status-pop-con .video-iframe-box{position:relative; padding-top: 56.25%; height:0; background-color:#000}
.status-pop-con .video-iframe-box iframe{position:absolute; top:0px; left:0px; width:100%; height:100%;}
.status-pop-con .video-cover-box{position:absolute; top:0px; left:0px; width:100%; height:100%; cursor:pointer ;  }
.status-pop-con .video-cover-box:after{position:absolute; top:0px; left:0px; width:100%; height:100%; cursor:pointer ; background-color:rgba(0,0,0,0.2); content:"";}
.status-pop-con .video-cover-box .thumb{display:block; width:100%; height:100%;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s}
.status-pop-con .video-cover-box .thumb img{width:100%; height:100%;}
.status-pop-con .video-cover-box:hover .thumb{
	-ms-transform: scale(1.1) rotate(0.002deg);
	  -o-transform: scale(1.1) rotate(0.002deg);
	  -moz-transform: scale(1.1) rotate(0.002deg);
	  -webkit-transform: scale(1.1) rotate(0.002deg);
	  transform: scale(1.1) rotate(0.002deg);
}
.status-pop-con .video-cover-box .icon{position:absolute; top:50%; left:50%;  z-index:1; -ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);}
.status-pop-con .video-cover-box .icon i {font-size:8rem; color:#fff;}
.status-pop-con .info-con {display: flex; flex-direction:column; justify-content: space-between; width: 40rem; padding-left: 4rem; box-sizing: border-box;}
.status-pop-con .info-con .tit-box {padding: 3.3rem 0 2rem; border-bottom: 1px solid #ddd;}
.status-pop-con .info-con .tit-box .cate {display: block; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.025em; color: var(--main-color); margin-bottom: 1.5rem;}
.status-pop-con .info-con .tit-box .tit {font-size: 2.4rem; font-weight: 700; letter-spacing: -0.02em; color: #222222; line-height: 1.33;}
.status-pop-con .info-con .info-box {padding: 2rem 0;}
.status-pop-con .info-con .info-box > span {display: inline-block; padding: 0.4rem 1.6rem; border-radius: 3rem; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.025em; color: #fff; line-height: 1.3; background-color: var(--main-color); margin-bottom: 1.5rem;}
.status-pop-con .info-con .info-list {}
.status-pop-con .info-con .info-list li {display: table; font-size: 2rem; letter-spacing: -0.04em; line-height: 2;}
.status-pop-con .info-con .info-list li strong {display: table-cell; width: 8.5rem; font-weight: 700; color: #222;}
.status-pop-con .info-con .info-list li p {display: table-cell; width: calc(100% - 8.5rem); font-weight: 500; color: #666;}
.status-pop-con .test-inquiry-btn {width: 100%; height: 5.5rem; display: flex; align-items: center; justify-content: space-between; padding: 0 3rem; font-size: 2rem; font-weight: 600; letter-spacing: -0.04em; color: #fff; border-radius: 3rem; background-color: #000; box-sizing: border-box;}
.status-pop-con .test-inquiry-btn i {font-size: 2.4rem; font-weight: 400;}

#partnersCon {padding-top: 15rem; transition:var(--transition-custom2); will-change: transform; will-change: opacity; opacity: 0;transition-property: opacity, transform, -webkit-transform, filter; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); filter: blur(10px);}
#partnersCon.animated {opacity: 1; -webkit-transform: none;  transform: none; filter: blur(0px);}

/* -------- 성과 및 활동 -------- */
/* .result-con01 {position: relative; padding: 20rem 0 16rem;}
.result-con01 .bg{position: absolute; top: 0; left: 0; width: 100%; height: 0; padding-top: 41.666%; z-index: -1;}
.result-con01 .bg span {display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: url(/images/content/result_con01_bg.jpg)no-repeat center/cover;}
.result-tit-box strong {display: block; font-size: 2.2rem; font-weight: 700; letter-spacing: -0.04em; color: var(--main-color); line-height: 1.1; margin-bottom: 2.5rem;}
.result-tit-box .tit {font-size: 4rem; font-weight: 700; letter-spacing: -0.05em; color: #000; line-height: 1.4; margin-bottom: 1rem;}
.result-tit-box .tit b {font-weight: inherit; color: var(--main-color);}
.result-tit-box .txt {font-size: 2rem; font-weight: 500; letter-spacing: -0.05em; color: rgba(0,0,0,0.5); line-height: 1.6;}

.result-banner-con {display: flex; flex-wrap: wrap; margin-top: 16rem; gap:1.5rem;}
.result-banner-con .result-banner-left {width: 61.8%; height: 62.3rem;}
.result-banner-con .result-banner-left .result-banner-item {height: 100%; border-radius: 3rem; padding: 9rem 9.7rem; background: url(/images/content/result_con01_img01.jpg)no-repeat center/cover; box-sizing: border-box;}
.result-banner-con .result-banner-left .result-banner-item h5 {display: block; font-size: 5rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; line-height: 1.3;}
.result-banner-con .result-banner-left .result-banner-item span {display: block; font-size: 2rem; font-weight: ;}
.result-banner-con .result-banner-right {width: calc(38.2% - 1.5rem);} */


/* ****************** 5.HR ********************** */
/* -------- 채용공고 뷰 -------- */
.recruit-content .bbs-view-top {padding: 20px 21rem 20px 20px;}
.bbs-view-top .recruit-notice-btn {position: absolute; right: 0; top: 50%; margin-top: 0.5rem; display: flex; align-items: center; justify-content: space-between; width: 20rem; height: 4.8rem; padding: 0 1.7rem 0 2.2rem; border: 2px solid var(--main-color); box-sizing: border-box; border-radius: 3rem;}
.bbs-view-top .recruit-notice-btn.end {  border-color: #CCCCCC;pointer-events: none; background-color: #CCCCCC;}
.bbs-view-top .recruit-notice-btn.end i, 
.bbs-view-top .recruit-notice-btn.end span:not(.cm-fill) {color: #fff;}
.bbs-view-top .recruit-notice-btn.end .cm-fill { display: none;}
.bbs-view-top .recruit-notice-btn span:not(.cm-fill) { position: relative;  z-index: 1; font-size: 1.6rem; font-weight: 700;  letter-spacing: -0.04em; color: var(--main-color); transition: var(--transition-custom);}
.bbs-view-top .recruit-notice-btn i { position: relative; z-index: 1; font-size: 2rem; color: var(--main-color); transform: rotateZ(-45deg); transition: var(--transition-custom);}
@media all and (min-width:801px) {
	.bbs-view-top .recruit-notice-btn:hover span:not(.cm-fill) { color: #fff;}
	.bbs-view-top .recruit-notice-btn:hover i { color: #fff;}
}
@media (max-width: 1500px) {
	.recruit-content .bbs-view-con {padding: 0;}
}
@media (max-width: 800px) {
	.recruit-content .bbs-view-con {padding: 0;}
	.recruit-content .bbs-view-top {padding: 20px;}
	.recruit-content .bbs-view-top .category-box{padding-right: 8rem;}
	.bbs-view-top .recruit-notice-btn {position: relative; left: 0; top: 0; margin: 3rem 0 0 auto; width: 16rem;height: 4.5rem; padding: 0 1.5rem;  /* transition: var(--transition-custom); */}
	/* .bbs-view-top .recruit-notice-btn:hover { background-color: var(--main-color);} */
}
 
 
/* ****************** 6.About Us ********************** */
/* -------- 유진소식 -------- */
.resource-con01 {padding-bottom: 10rem;}
.resource-con02 {background-color: #F5F5F5; padding: 12rem 0 16rem;}

.resource-content .bbs-view-con {padding-bottom: 16rem;}

/* -------- 공지사항 -------- */
.notice-con {padding-bottom: 10rem;}
.bbs-top-list-box .fakeform-selectbox {width: 14.2rem;}


/* ****************** 문의하기 팝업 ********************** */
.inquiry-modal-content {position:relative; width:96%; max-width:780px; margin:35px auto; }
.inquiry-modal-content .modal-close-btn{position:absolute; width: 6rem; height: 6rem; border-radius: 50%; background-color: #EEEEEE;  top:2.4rem; right:2.4rem; color:#000; text-align: center; }
.inquiry-modal-content .modal-close-btn i {font-size: 3.2rem; line-height: 6rem;}
.inquiry-modal-content .modal-close-btn i:hover {color: #000;}
.inquiry-inner-box{padding:8rem 4rem; background-color:#fff; border-radius: 4.8rem; box-sizing: border-box; }
.inquiry-inner-box h2 {font-size: 4rem; font-weight: 700; letter-spacing: -0.04em; color: #121212; line-height: 1.1; padding-bottom: 3.5rem; text-align: center;}
.inquiry-write-con {width: 100%; max-width: 58.2rem; margin: 0 auto;}
.inquiry-tbl-con {}
.inquiry-write-tbl {width: 100%;border-top: 1px solid #F2F2F2; }
.inquiry-write-tbl th{border: 0; padding: 2rem 1rem 2rem 0; font-size: 1.8rem; font-weight: 600; letter-spacing: -0.04em; color: #060606;}
.inquiry-write-tbl td{border: 0; padding: 2rem 0;}
.inquiry-write-tbl th,
.inquiry-write-tbl td {border-bottom: 1px solid #F2F2F2;}
.inquiry-write-tbl th.alignTop {vertical-align: top;}
.inquiry-write-tbl .write-input,
.inquiry-write-tbl .write-select,
.inquiry-write-tbl .write-textarea{height:3.6rem; width:100%; border: none; outline: none; background-color: #f5f5f5 !important; font-size:1.8rem; color: #060606; text-indent:2.4rem; vertical-align:middle; box-sizing:border-box; border-radius: 2.4rem;}
.inquiry-write-tbl .write-select {background-size: 12px !important; background-position: calc(100% - 18px) 50% !important;}
.inquiry-write-tbl .write-input:focus,
.inquiry-write-tbl .write-select:focus,
.inquiry-write-tbl .write-textarea:focus{outline:none;}
.inquiry-write-tbl .write-textarea {padding: 2.4rem 0; height: 12rem;}
.inquiry-write-tbl .email-fieldset .hypen {margin: 0 0.8rem; font-size: 1.4rem; color: #333333;}
.inquiry-write-tbl .email-fieldset .write-input, 
.inquiry-write-tbl .email-fieldset .write-select{width:calc(33.33% - 1.2rem) !important;}

.inquiry-agree-con {padding: 2.5rem 0; border-bottom: 1px solid #F2F2F2;}
.inquiry-agree-con .agree-txt {display: flex; align-items: center; justify-content: space-between; position: relative;}
.inquiry-agree-con .agree-txt input{display:none;}
.inquiry-agree-con .agree-txt label{position:relative; padding-left:26px; font-size: 1.8rem; font-weight: 600; line-height: 1.5em; letter-spacing: -0.04em; color: #060606; display: block;}
.inquiry-agree-con .agree-txt label i{position:absolute; top: 0.5rem; left:0px; font-size:2rem; color:#ddd;}
.inquiry-agree-con .agree-txt input:checked + label i {color: #060606;}
.inquiry-agree-con .agree-txt a { padding: 0.7rem 2rem; display: inline-block; border: 1px solid #D9D9D9; border-radius: 3rem; font-size: 1.2rem; font-weight: 500; letter-spacing: -0.04em; color: #000;}
.inquiry-btn-controls .inquiry-btn { display: flex; align-items: center; justify-content: center; text-align: center; margin: 4rem auto 0; width:100%; height: 6rem; border-radius:3rem; background-color: var(--main-color); font-size: 2rem; font-weight: 700; letter-spacing: -0.04em; color: #fff; }
/* 보안코드 */
.security-code-box{position: relative; padding: 1rem; height: 4.6rem; background-color: #f5f5f5; border: 0; border-radius: 3.2rem; box-sizing: border-box; display: flex; align-items: center;}
.security-code-box .security-code{width: 8rem; height: 2.8rem; line-height: 2.8rem; border: 1px solid #d9d9d9;box-sizing: border-box;  text-align: center; font-size: 1.2rem; letter-spacing: -0.015em; color: #333; font-weight: 500; letter-spacing: -0.04em; background-color: #fff; border-radius: 2rem;}
.security-code-box .write-input{width: calc(100% - 10rem); max-width: 31rem; height: 3.6rem !important;}


/* ***********************
	*	페이크폼 스타일 추가css 
*********************** */
.fakeform-selectbox{position: relative; display:inline-block; width: 100%;}
.fakeform-selectbox select{opacity: 0; visibility: hidden;}
.select-option.select-in-popup{z-index: 10000 !important;}
/* fake form - 기본 select 스타일 */
.fakeform-selectbox .select-title {display: flex; align-items: center; /* justify-content: center; */ padding: 0 2rem;/* text-indent: 2rem; */ width: 100% !important; height: 4.8rem; text-align: left; vertical-align: middle; border:0; /* line-height:4.8rem; */ font-size:1.6rem; color: #333; background-color: #F5F5F5; line-height: 1.2; /* display: inline-block; */ box-sizing: border-box; cursor: pointer; border-radius: 2.4rem;}
.fakeform-selectbox .select-title.white-ver {background-color: #fff;}
.fakeform-selectbox .select-title:after{font-family: 'xeicon'; position:absolute; top:50%; right:2rem; transform:translateY(-50%); content: "\e942"; font-size:2rem; color: #333;}
.fakeform-selectbox .select-title strong {width: 90%; font-weight: 400; word-break: break-all; white-space: nowrap; text-overflow: ellipsis; display: block; overflow: hidden;}
.fakeform-selectbox .select-title.active{border-bottom-color: #fff;}
.fakeform-selectbox .select-title.active:after{content: "\e945";}
.fakeform-selectbox .select-title.focus {}
.fakeform-selectbox .select-title.active {border-radius: 2.4rem 2.4rem 0 0;}
.fakeform-selectbox .select-title.disabled{}
/* 옵션창 */
.select-option {background: #f5f5f5; max-height: 200px; overflow: auto;border-radius: 0 0 2.4rem 2.4rem;  z-index: 9999 !important;}
.select-option.white-ver {background: #fff;}

/* .select-option::-webkit-scrollbar{
	width: 5px;
}
.select-option::-webkit-scrollbar-thumb{
	background-color:#333;
	border-radius:5px;
	transition:all 0.5s;
}
.select-option::-webkit-scrollbar-track{
	background-color:#f2f2f2; 
	border-radius:0;
} */
.select-option ul {margin: 0; padding: 0;}
.select-option li {list-style: none;}
.select-option span,
.select-option strong {height: auto; font-size: 1.4rem; line-height: 1.5; color: #666; /* white-space: nowrap; 
text-overflow: ellipsis;  */text-decoration: none; padding: 1.5rem 2rem; display: block;/*  overflow: hidden; */ cursor: pointer;}
.select-option span:hover {background: #f2f2f2;}
.select-option span.selected {color: #000; font-weight: 600;}
.select-option .disabled span,
.select-option .disabled strong {color: #bbb; text-decoration: line-through; background: none; cursor: default;}

@media all and (max-width:800px){
	.fakeform-selectbox .select-title {/* text-indent: 1em;  */font-size: 1.4rem; line-height: 5rem;}
	.fakeform-selectbox .select-title:after{right:0.7em; font-size:2rem;}
	/* 옵션창 */
	.select-option span,
	.select-option strong {height: auto; font-size: 1.3rem; font-weight: 500; line-height: 1.5; padding: 1.5rem 2rem;/* padding: 1.5rem 1em; */}
}

/***** 임시 css *****/
/* .full-img {display: flex; align-items: center; justify-content: center; width: 100.788%; margin: 0 auto; padding-bottom:16rem;}
.full-img img {max-width: 100%;}
 */
.full-img img {position: relative; left: 50%; margin-left: -960px;}
@media all and (max-width:1279px){
	.full-img img {position: static; margin-left: 0; width: 100%; height: auto;}
}