@charset "utf-8";
/* css setting start */
.sec-wrap,
.sec-header,
.sec-content,
.sec-footer {position:relative;width:100%;margin:0;padding:0;box-sizing:border-box;}

/* contents */
.dv-conts-wrap {position:relative;width:100%;max-width:1280px;margin:0 auto;padding:0;box-sizing:border-box;overflow:hidden;}

/******************************************************* common *******************************************************/
input,select,textarea{font-size: clamp(15px,0.833vw,16px);}
input[type="radio"] {	position:relative;  appearance: none;  border: 2px solid #E5E5E5;  border-radius: 50%;width: 22px;  height: 22px;  transition: all 0.3s ease-in-out;   margin-right: 5px;}
input[type="radio"]:checked {  border-color: #00AFEF;}
input[type="radio"]:before{	content:''; 	width:0; 	height:0;position:absolute;	top:50%;	left:50%;	transform:translate(-50%,-50%);	background: #00AFEF;border-radius:50%;  transition: all 0.3s ease-in-out;}
input[type="radio"]:checked:before{	width:9px; 	height:9px;}
input[type="radio"]:focus-visible { outline-offset: 1px;  outline: 1px dotted #00AFEF;}
input[type="radio"]:hover {   cursor: pointer;}
input[type="radio"]:hover + span {  cursor: pointer;}
input[type="radio"]:disabled {  background-color: lightgray;  box-shadow: none;  opacity: 0.7;  cursor: not-allowed;}
input[type="radio"]:disabled + span { opacity: 0.7;  cursor: not-allowed;}
select{ background: url('/images/icon-select.svg') no-repeat center right 20px / 12px;}

.contents-wr{ }
.inner{padding:0 clamp(20px,2.6vw,50px); max-width:none; width: 100%;}
.mo-br{display:none;}
.pc-only{}
.mo-only{display:none;}
/*.contents-wr.news .inner, */
/*.contents-wr.cases .inner, */
/*.contents-wr.contact .inner{max-width:1520px; width: 90%; margin:0 auto;}*/


@media (max-width: 969px) {
	/* common */
	body{font-size: 14px;}
	.mo-br{display:block !important;}
	.pc-only{display:none;}
	.mo-only{display:block;}

}


/* split */
.split-up .line{display:block;overflow:hidden; }
.split-up .char{display:inline-block;transform:translateY(110%);opacity:0;will-change:transform;  }


/* title */
.section-head{margin-bottom:clamp(60px,7.81vw,150px); display:flex; flex-direction:column; gap:clamp(14px,1.04vw,20px);}
.section-head:has(+ .btn-motion){margin-bottom:clamp(30px,3.13vw,60px);}
.section-head .section-title{  font-size:clamp(34px,4.17vw,80px); font-weight: 500; line-height:1.2; }
.section-head .section-title strong{color: #764EB7; vertical-align:baseline; line-height:1.2;   }
.section-head .section-title span{line-height: 1.2;}
.section-head .sub-title{display:block; font-size:clamp(15px,1.04vw,20px); font-weight: 500;}
.section-head p{ font-size:clamp(16px,1.15vw,22px);  }
.section-head.big {margin-bottom: 0;}
.section-head.big .section-title{font-size: clamp(54px,7.81vw,150px); line-height: 1;}
.section-head.big .section-title strong{line-height: 1;}

@media screen and (max-width:969px){
	.section-head p br{display:none;}
	.section-head .section-title br{display:none;}
}


/* btn */
.btn-wrap{display:flex; gap:clamp(8px,0.52vw,10px); flex-wrap:wrap;}
.btn-motion{--size:clamp(30px,2.08vw,40px); --point:#66459C; --bg:#000;   padding:0 clamp(20px,1.56vw,30px) 0 calc(var(--size) + clamp(20px,1.56vw,30px)); position:relative; display:inline-flex;align-items:center; gap:10px;height:clamp(50px,3.13vw,60px);  border-radius:999px; background:var(--bg);color:#fff;overflow:hidden; transition:.35s; font-size:clamp(14px,0.83vw,16px);font-weight:500;}
.btn-bg{position:absolute;left:10px;top:50%;width:var(--size); aspect-ratio:1; border-radius:50%;background:var(--point);transform:translateY(-50%);transition:.55s cubic-bezier(.22,1,.36,1);}
.btn-text{position:relative;z-index:3; }
.btn-icon{position:absolute;display:flex;align-items:center;justify-content:center;width:var(--size); aspect-ratio:1; z-index:3;overflow:hidden;}
.btn-icon i{  display:block; width: 100%; height: 100%; background: url('/images/main/arrow.svg') no-repeat center center / 14px;}
.btn-icon.left{left:10px; }
.btn-icon.left i{ transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .35s;}
.btn-icon.right{right:10px;}
.btn-icon.right .circle{display:flex;align-items:center;justify-content:center;width:var(--size); aspect-ratio:1; border-radius:50%;background:var(--bg);transform:scale(.2);opacity:0;transition:.45s cubic-bezier(.22,1,.36,1);}
.btn-icon.right i{transform:translateX(-10px);opacity:0;transition:.45s cubic-bezier(.22,1,.36,1);}
.btn-motion:hover { padding:0 calc(var(--size) + clamp(20px,1.56vw,30px)) 0 clamp(20px,1.56vw,30px)}
.btn-motion:hover .btn-bg{ width:100%;  left:0; border-radius:999px;}
.btn-motion:hover .btn-icon.left i{transform:translateX(10px);opacity:0;}
.btn-motion:hover .btn-icon.right .circle{transform:scale(1);opacity:1;}
.btn-motion:hover .btn-icon.right i{transform:translateX(0);opacity:1;transition-delay:.08s;}



/******************************************************* header *******************************************************/

.sec-header{position:fixed; top:0; left:0; width: 100%; z-index:9;height: 90px; padding:0 clamp(20px,2.6vw,50px); display:flex; align-items:center; justify-content:space-between; transition:all ease .35s; gap:100px; }
.scroll-down .sec-header{transform:translateY(-90px); }
.scroll-up .sec-header{  background: #f0f0f0; }
.scroll-up .sec-header .mo-btn span{background: #000;}
.scroll-up.open .sec-header .mo-btn span{background: #fff;}
.sec-header .logo{position:relative; z-index:11; width: 70px; transition:all ease .35s;}
.sec-header ul ul a[target="_blank"]{display:inline-flex; align-items:center; justify-content:center; gap:5px;}
.sec-header ul ul a[target="_blank"]::after{content:''; width: 20px; height: 20px; background: url('/images/icon-external-link.svg') no-repeat center center / contain;  display: block;     margin-top: -3px;}

/* right */
.sec-header .hd-right{display:flex; z-index:11; position:relative; gap:clamp(20px,2.08vw,40px); align-items:center;  }
.sec-header .hd-lang{position:relative; display:flex; gap:10px; }
.sec-header .hd-lang a {opacity:.6; font-weight: 400; }
.sec-header .hd-lang a.on{border-bottom:1px solid #000;  opacity:1;}
.sec-header .btn-motion{ --arr-size:clamp(15px,1.04vw,20px); --size:clamp(25px,1.56vw,30px); --point:#000; --bg:#66459C; padding:0 clamp(15px,1.04vw,20px) 0 calc(var(--size) + clamp(15px,1.04vw,20px));font-size: clamp(13px,0.78vw,15px); height: clamp(40px,2.6vw,50px);    }
.sec-header .btn-motion:hover { padding:0 calc(var(--size) + clamp(15px,1.04vw,20px)) 0 clamp(15px,1.04vw,20px)}
.sec-header .btn-icon i{background-size:12px;}
.mo-btn{display:none; flex-direction:column; gap:6px; width: 30px; height: 30px; justify-content:center; cursor:pointer;}
.mo-btn span{width: 100%; height: 2px; background: #fff; transition:all ease .35s;}

body:not(.scroll-up) .sec-header .logo{filter: brightness(0) invert(1);}
body:not(.scroll-up) .sec-header a{color: #fff;}
body:not(.scroll-up) .sec-header .hd-lang a.on{border-color:#fff;}


@media (min-width: 1201px) {
	/* gnb */
	.sec-header .gnb{ text-align: center; font-size: 16px; position:absolute; left:50%; transform:translateX(-50%);}
	.sec-header .gnb > ul{display:inline-flex; gap:40px;  align-items:center; }
	.sec-header .gnb > ul > li{position:relative;   }
	.sec-header .gnb > ul > li > a{display:block;  transition:all ease .35s; font-weight: 500; font-size: 18px;  }
	.sec-header .gnb > ul > li > ul{position:absolute; width: 170px; left:50%; transform:translateX(-50%); top:100%; border-radius:10px;  padding: 14px 0; text-align: center; display:none; background: #0B1F2A; border:1px solid rgb(0 175 239 / 10%); }
	.sec-header .gnb > ul > li > ul > li > a{padding:5px 10px; display:flex; justify-content:center;  font-size: 16px;}
	.sec-header .gnb > ul > li > ul{display: block; opacity:0; visibility:hidden; transition:all ease .35s;}
	.sec-header .gnb > ul > li:hover > ul { opacity:1; visibility:visible;}
	.sec-header .gnb > ul > li > ul > li > a{ opacity:.6; transition:all ease .35s;}
	.sec-header .gnb > ul > li > ul > li > a:hover{opacity:1;}

}
@media (max-width: 1200px) {
	/* header */
	.sec-header {gap:0;}
	.open{overflow:hidden;}
	.open .sec-header{position:fixed;}
	.mo-btn{display:flex;}
	.open .sec-header .mo-btn{z-index:2;}
	.open .sec-header .mo-btn span:nth-child(1){transform:translateY(4px) rotate(45deg);}
	.open .sec-header .mo-btn span:nth-child(2){display:none;}
	.open .sec-header .mo-btn span:nth-child(3){transform:translateY(-4px) rotate(-45deg);}
	.open .sec-header .gnb{right:0;  }
	.open .sec-header .logo{z-index:2;     filter: brightness(0) invert(1);}
	.sec-header .gnb{position:fixed; right:-100%; top:0; width: 100%; background: #000; height: 100vh; padding:100px clamp(20px,2.6vw,50px) 0; font-size: 24px;     transition: all ease .35s;}
	.sec-header .gnb > ul{overflow-y:auto; height: calc(100vh - 150px); }
	.sec-header .gnb > ul > li > a{display:flex; justify-content:space-between; align-items:center; padding:20px 0; font-weight: 450;  font-size: 30px; color: #fff;}
	.sec-header .gnb > ul > li:has(ul) > a:after{content:'↓'; }
	.sec-header .gnb > ul > li.active > a{opacity:1;}
	.sec-header .gnb > ul > li.active:has(ul) > a:after{content:'↑'; }
	.sec-header .gnb > ul > li > ul {padding:0 10px 30px; display:none;}
	.sec-header .gnb > ul > li > ul > li > a{font-size: 19px; padding:5px 0; display:block;}
	.sec-header .gnb .btn-motion{position:absolute; left:clamp(20px,2.6vw,50px); bottom:clamp(40px,2.6vw,80px);}

}

@media (max-width: 969px) {

	.sec-header{height:70px;}
}

/******************************************************* footer *******************************************************/


.footer{padding:clamp(20px,2.6vw,50px);background:#312F30;color:#fff;}
.footer-top{position:relative; }
.footer-title{font-size:clamp(40px,7.81vw,150px);font-weight:500;line-height:1; padding-right: 100px; }
.footer-copy{position:absolute;top:0;right:0;font-size:clamp(13px,0.78vw,15px);}
.footer-sns{display:flex;gap:10px;margin-top:clamp(15px,1.56vw,30px);}
.footer-sns-item{display:flex;align-items:center;justify-content:center;width:clamp(40px,2.6vw,50px); aspect-ratio:1; border:1px solid rgba(255,255,255,.2);border-radius:50%;color:#fff; transition:.3s; padding:10px;}
.footer-sns-item img{filter:invert(1);}
.footer-sns-item:hover{border-color:#fff; }
.footer-bottom{display:grid;grid-template-columns:2fr repeat(6,1fr) 140px;gap:10px;margin-top:clamp(50px,14.06vw,270px);}
.footer-card{ padding:clamp(12px,1.04vw,20px);border-radius:10px;background:rgba(0,0,0,0.3);}
.footer-card strong,.footer-card h3{display:block;margin-bottom:20px;font-size:clamp(14px,0.94vw,18px);font-weight:500;}
.footer-card h3{text-decoration:underline;}
.footer-card p,.footer-card li{font-size:clamp(13px,0.83vw,16px); font-weight: 300; line-height: 1.3;}
.footer-card ul{display:flex;flex-direction:column;gap:5px;}
.footer-card:has(.footer-info){background: none; border:1px solid rgba(255,255,255,0.2);}
.footer-info{display:flex; gap:clamp(5px,0.57vw,11px);  flex-wrap:wrap;}
.footer-info span{ position:relative;}
.footer-info span + span:before{content:''; width: 1px; height: 10px; background: rgba(255,255,255,0.2); position:absolute; left:-6px; top:7px;}
.footer-qr{display:flex; align-items:center;justify-content:center; border-radius:5px; background: #fff; width: clamp(50px,5.21vw,100px);  padding:clamp(6px,0.78vw,15px); aspect-ratio:1;}
.footer-qr img{width:100%; aspect-ratio:1; object-fit:contain; }

.btn-top{position:fixed; z-index:3; right:20px; bottom:20px; font-size: 20px; border:0; border-radius:50px; width: 50px; height: 50px; display:flex; align-items:flex-start; justify-content:center; background: rgba(0,0,0,0.2);     backdrop-filter: blur(10px); color: #fff; transition:all ease .35s; padding-top: 10px;}
.btn-top.is-bottom{bottom:clamp(40px,4.167vw,80px);}

@media (hover: hover) and (pointer: fine) {
	.btn-top:hover{ background: #000; height: 80px; }
}


@media screen and (max-width:1600px){
	.footer-bottom{  grid-template-columns:repeat(4,1fr);}

}
@media screen and (max-width:969px){
	.footer-bottom{  grid-template-columns:1fr; margin-top: 20px;}
	.footer-card{display:flex; }
	.footer-card strong, .footer-card h3{width: 90px; margin-bottom: 0;}
	.footer-card ul{flex:1;}
	.footer-card:not(:has(h3)){ padding-top: 0; padding-bottom: 0;background: none;}
	.footer-info span + span:before{display:none;}

}

/******************************************************* contents *******************************************************/
/* pagination */
.pagination {display:flex; gap:5px; justify-content:center; margin-top: 60px;}
.pagination a{width: 30px; aspect-ratio:1; display:flex; align-items:center; justify-content:center; line-height: 1; font-size: 14px; color: #aaa;}
.pagination a.on{color: #000; font-weight: 600;}
.pagination .first,
.pagination .last{letter-spacing:-10px;}
.pg_page.pg_start:before,
.pg_page.pg_end:before{content:'';width: 8px; aspect-ratio:1;border-top:1px solid #000; border-right:1px solid #000; transform:rotate(45deg); }
.pg_page.pg_start:before{transform:rotate(-135deg); margin-right: -5px;}
.pg_page.pg_end:before{margin-left: -5px;}




/******************************************************* board *******************************************************/
.news,
.cases, .news_en{ padding : clamp(70px,10.42vw,200px) 0;}

.sub:has(#bo_w) .sub-visual,
.sub:has(#bo_v) .sub-visual{ height: 50vh;}
.sub:has(#bo_w) .sub-visual .visual-scroll,
.sub:has(#bo_v) .sub-visual .visual-scroll{display:none;}


#bo_v{background: none;}

.chk_box input[type="checkbox"] + label{line-height: 1;}
#bo_btn_top{margin:0;}
#bo_btn_top ul{display:flex; gap:5px; flex-wrap:wrap; justify-content:flex-end;    align-items: center;}
#bo_btn_top a, #bo_btn_top button{display:block; font-size: 14px; padding:0 10px; border:1px solid #ddd; border-radius:4px; background: #fff; vertical-align:top; height:40px; line-height: 38px;}

#bo_cate{margin:0;}
#bo_cate ul{display:flex; flex-wrap:wrap; gap:clamp(8px,0.5vw,10px); cursor:pointer; width: 100%; justify-content:center;}
#bo_cate li{padding:0;}
#bo_cate a{height: clamp(40px,3.125vw,60px); border:1px solid #000; border-radius:60px; display:inline-flex; align-items:center; justify-content:center; padding:0 clamp(24px,2.604vw,50px);; text-align: center;    font-size: clamp(15px,0.94vw,18px);;  font-weight: 500; color: #000;  transition:all ease .35s;}
#bo_cate a:hover,
#bo_cate #bo_cate_on{background: #66459C; border-color:#66459C; color: #fff; box-shadow:none; font-weight: 500;}



#bo_gall li.empty_list{width: 100%;}

.tbl_head01 tbody tr:hover td,
#bo_list tbody .even td{background: none;}
#bo_list tbody tr:hover{border:none;}
#bo_list tbody tr{border:none;}


.bo_cate_link{ background: #000; color: #fff; font-size: 13px; padding:  10px;  height:auto; display:none;}
.bo_top{display:flex; justify-content:center; align-items:flex-end; flex-wrap:wrap;}
.bo_top:has(#bo_cate){margin-bottom:clamp(50px,5.21vw,100px);}
#bo_cate ul:after{display:none;}

a.btn, .btn{ }
#bo_w .btn_cancel,
#bo_w .btn_submit{font-size: inherit;}
#bo_w .btn_submit{background: #000;}
#bo_w .write_div{margin:20px 0;}
#bo_w .bo_w_link .frm_input,
#bo_w .bo_w_flie .file_wr,
.wr_content textarea, .tbl_frm01 textarea, .form_01 textarea, .frm_input,
#bo_w .bo_w_select select,
#bo_w .bo_w_tit .frm_input{padding:0 20px; height:50px; border:1px solid #ddd; border-radius:10px;}
#bo_w .bo_w_link .frm_input,
#bo_w .bo_w_flie .file_wr{padding-left: 50px; display:flex; align-items:center;}
#bo_w i{vertical-align:middle; }
#bo_w .bo_w_link label,
#bo_w .bo_w_flie .lb_icon{height: 50px; line-height: 50px;width: 50px;}
#bo_w .bo_w_flie .frm_file{font-size: 13px; padding-left: 0; margin-top: 0;}
#bo_w .bo_w_tit #btn_autosave{top:10px; font-size: 13px; right:10px; padding:0;}
.write_div .chk_box input[type="checkbox"] + label span, .bo_vc_w .chk_box input[type="checkbox"] + label span{top:0;}


/* youtube */
#bo_gall .gall_img{position:relative; aspect-ratio: 1.54; margin-bottom: clamp(10px,1.042vw,20px); border-radius:20px;}
#bo_gall .gall_img:before{content:'▶'; color: #fff; width: 100%; height: 100%; background: rgba(0,0,0,0.4); display:flex; align-items:center; justify-content:center; position:absolute; left:0; top:0; font-size: 3em;}
#bo_gall .gall_img img{width: 100%; height: 100% !important; object-fit:cover; }
#bo_gall #gall_ul{margin:0; padding:0; display:flex; gap:clamp(20px,2.083vw,40px); flex-wrap:wrap; margin-top: clamp(10px,1.042vw,20px);}
#bo_gall .gall_li{margin:0; padding:0; width:calc(50% - clamp(10px,1.042vw,20px));}
#bo_gall .gall_text_href{position:relative; margin:0; padding:0;}
#bo_gall .gall_text_href img{margin:0; padding:0;}
#bo_gall .bo_cate_link{position:absolute; right:20px; top:20px;   z-index:2;}
#bo_gall .gall_box{margin:0;}
#bo_gall .gall_text_href a.bo_tit{font-weight: 600; color: #000;}
#bo_v_con iframe{width:100%; aspect-ratio:1.75; height:auto;}
#bo_v_con *{font-family:"Inter", "Pretendard Variable",'Noto Sans KR',Dotum,Helvetica,AppleGothic,Gulim,'Roboto','굴림',Sans-serif !important;}


.youtube-modal { position:fixed; inset:0; display:none; z-index:9999; }
.youtube-modal.active { display:block; }
.youtube-dim { position:absolute; inset:0; background:rgba(0,0,0,.7); }
.youtube-inner {position:absolute;top:50%; left:50%;transform:translate(-50%,-50%);width:90%;max-width:900px; border-radius:20px;  max-height: 80vh;   overflow-y: auto;}
.youtube-inner::-webkit-scrollbar { width:4px; }
.youtube-inner::-webkit-scrollbar-thumb { background:#666; border-radius:10px; }
.youtube-inner::-webkit-scrollbar-track { background:transparent; }

.youtube-wrap { position:relative; padding-top:56.25%;   background:#000;  border-radius: 20px 20px 0 0;   overflow: hidden; }
.youtube-wrap iframe { position:absolute; inset:0; width:100%; height:100%; }
.modal-close {position:absolute;top:clamp(10px,1.042vw,20px); right:clamp(10px,1.042vw,20px);color:#fff;font-size:clamp(50px,3.646vw,70px);background:none;border:0;cursor:pointer; font-weight: 200; line-height: 1; width: clamp(50px,3.646vw,70px); height: clamp(50px,3.646vw,70px);}
.modal-content{padding:30px; background:#fff;  border-radius:0 0 20px 20px; }
.modal-content h3{font-size: 1.4em;  }
.modal-content h3 + p{margin-top: clamp(5px,0.521vw,10px);}

/* list */
.tbl_wrap table{margin-top: clamp(10px,1.042vw,20px); background: none; }
.tbl_head01 td{padding:clamp(20px,1.563vw,30px) clamp(10px,1.042vw,20px); height: auto;   border-top:1px solid rgba(0,0,0,.2);border-bottom:1px solid rgba(0,0,0,0.2);}
.bo_tit a{font-size: 1.2em; font-weight: 600; }
#bo_list .td_datetime{width: clamp(100px,10.417vw,200px); white-space:nowrap;}
#bo_list_total strong{color: #000;}
#bo_list .bo_tit .new_icon{background: #000; color: #fff; border-radius:50%; aspect-ratio:1;  font-size: 11px;}

/* view */
.bo_btns{text-align: center; display:flex; gap:5px; flex-wrap:wrap; justify-content:flex-end;}
.bo_btns a{display:block; padding:7px 20px; font-size: 14px; border:1px solid rgba(0,0,0,0.2); border-radius:6px;  }
.list-btn{text-align: center; display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top: clamp(30px,2.604vw,50px);}
.list-btn a{display:block; padding:15px 60px; background: #000; color: #fff;border-radius:60px;  font-weight: 600; font-size: 1.1em; }
.bo_v_nb{ margin:clamp(30px,2.604vw,50px) 0 clamp(10px,1.042vw,20px);}
.bo_v_nb li{padding:20px;}
#bo_v{margin-top: clamp(20px,2.604vw,50px);}
#bo_v_title{text-align: center;}
#bo_v_title .bo_v_tit{margin: clamp(24px,2.083vw,40px) 0 clamp(30px,3.125vw,60px); font-size: clamp(24px,2.083vw,40px);  }
#bo_v_title .bo_v_cate{ background: #000; color: #fff; font-size: clamp(13px,0.729vw,14px); padding:  clamp(5px,0.521vw,10px) clamp(10px,1.042vw,20px); height:auto; border-radius:8px;}
#bo_v_img a.view_image{    pointer-events: none;}
#bo_v_atc{padding : clamp(30px,2.604vw,50px) 0; border-top:2px solid #000; border-bottom:1px solid rgba(0,0,0,0.2);}
#bo_v_atc{max-width: 1580px; margin: 0 auto;}


/* search */
.bo_sch_wrap{width: 100%; max-width:500px; }
.bo_sch form{display:flex; gap:10px;}
.bo_sch select{height: 60px; padding:0 24px; border-radius:60px; border:1px solid #ddd;  width: 150px;     flex-shrink: 0;}
.bo_sch input{height: 60px; padding:0 20px; border:0;}
.bo_sch select:focus{outline:none !important; border:1px solid #ddd !important;  box-shadow:none !important;}
.bo_sch input:focus{outline:none !important; border:none !important;  box-shadow:none !important;}
.sch_bar{position:relative; width: 100%; padding-right: 60px;  border-radius:60px; border:1px solid #ddd; overflow:hidden;}
.sch_btn{width: 60px; height: 60px;background: #fff; color: #000; position:absolute; right:0; top:0; display:flex; align-items:center; justify-content:center; }
.sch_word{background: none; color: #a500ff; padding:0; margin:0;     line-height: inherit;}


/* paginge */
.pg_wrap{width: 100%; margin:50px auto 0; }
.pg{display:flex; gap:5px; font-size: 14px; justify-content:center;}
.pg_page{background: #fff; border:0; line-height: normal; display:flex; align-items:center; justify-content:center;}
.pg_current{ line-height: normal; display:flex; align-items:center; justify-content:center; background: #000; border:0;  }


/* Fade Up Motion */
[data-motion]{
	opacity:0;
	visibility:hidden;
	transform:translateY(60px);
}


@media screen and (max-width:969px){
	#bo_gall #gall_ul{flex-direction: column; }
	#bo_gall .gall_li{width: 100%;}
}





/******************************************************* sub *******************************************************/
/* common */
.sub-tit .stit{color: #00AFEF; font-weight: 500; margin-bottom: 10px; letter-spacing:0;}
.sub-tit h2{color: #000; font-size: clamp(25px,2.4vw,46px); line-height: 1.4;}
.sub-tit h3{color: #000; font-size: clamp(25px,2.4vw,46px); line-height: 1.4;}
.sub-tit p{margin-top: clamp(15px,1.042vw,20px); font-size: clamp(16px,1.042vw,20px); }


/* btn */
.btn-wr{text-align: center; gap:clamp(8px,0.521vw,10px); display:flex;  flex-wrap:wrap;}
.btn-wr a{ display:flex; align-items:center; justify-content:center;   padding:0 clamp(22px,1.563vw,30px); height: clamp(42px,2.865vw,55px);   font-size: clamp(14px,0.833vw,16px); text-align: center; background: #000; border-radius:60px; color: #fff; font-weight: 600; transition:all .35s ease; white-space:nowrap;}
.btn-wr a:hover{background: #fff; color: #000;}
.btn-wr a:after{content:'→'; opacity:0; width:0; display:block; transition:all ease .35s;}
.btn-wr a:hover:after{ opacity:1; width: 15px; margin-left: 10px;}



/* tab */
.tab-menu {display:flex; flex-wrap:wrap; gap:clamp(8px,0.5vw,10px); cursor:pointer; width: 100%;}
.tab-menu li{ }
.tab-menu a{height: clamp(50px,3.125vw,60px); border-radius:60px; display:inline-flex; align-items:center; justify-content:center; text-align: center; background: #fff;  padding:0 clamp(20px,2.083vw,40px); font-size: clamp(16px,1.042vw,20px);  font-weight: 500;}
.tab-menu a.active{background: #000; border-color:#000; color: #fff;}
.tab{ display: none;}
.tab.active{ display: block;}




/* visual */
.sub-visual{position:relative; width: 100%; height: 100vh; padding : 150px clamp(20px,2.604vw,50px) clamp(20px,2.604vw,50px); overflow:hidden; display:flex;  flex-direction:column; color: #fff; background-size:cover; background-repeat:no-repeat; background-position:center center;}
.sub-menu{ padding : clamp(70px,10.42vw,200px) clamp(20px,2.604vw,50px);width: 100%;  display:flex; flex-wrap:wrap; justify-content:center; flex-wrap:wrap; gap:clamp(8px,0.5vw,10px); z-index:2;}
.sub-menu a{ height: clamp(40px,3.125vw,60px); padding:0 clamp(24px,2.604vw,50px); display:flex; align-items:center; justify-content:center;   border:1px solid #000; border-radius:50px; font-weight: 500; font-size: clamp(15px,0.94vw,18px); text-align: center; transition:all ease .35s;}
.sub-menu a:hover,
.sub-menu a.on{background:#66459C; border-color:#66459C; color: #fff;}
.visual-scroll{margin-top: auto; display:flex; gap:20px; align-items:center;}
.visual-scroll .icon{  aspect-ratio:1; border-radius:50%;    background:#000;    overflow:hidden; display:flex;justify-content:center; position:relative;}
.visual-scroll .track{display:flex;flex-direction:column;animation:roll 2s infinite;}
.visual-scroll .track span{width:clamp(50px,3.125vw,60px);  aspect-ratio:1; display:flex;align-items:center;justify-content:center;color:#66459C;flex-shrink:0; font-size: 18px; font-weight: 700;}


@keyframes roll{
    from{transform:translateY(clamp(-50px,-3.125vw,-60px));}
    to{transform:translateY(0);}
}

.sec-content:has(.vision) .sub-visual{background-image:url('/images/sub/sub-visual08.webp');}
.sec-content:has(.products) .sub-visual{background-image:url('/images/sub/sub-visual09.webp');}
.sec-content:has(.technology) .sub-visual{background-image:url('/images/sub/sub-visual10.webp');}
.sec-content:has(.cases) .sub-visual{background-image:url('/images/sub/sub-visual07.webp');}
.sec-content:has(.contact) .sub-visual{background-image:url('/images/sub/sub-visual05.webp');}
.sec-content:has(.news_en) .sub-visual,
.sec-content:has(.news) .sub-visual{background-image:url('/images/sub/sub-visual06.webp');}




/******************************************************* common section *******************************************************/
.contact-section{position:relative;  background: #312F30;}
.contact-pin{position:relative;height:100vh; width: 100%;overflow:hidden;
   background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg transform='translate(90 90)' stroke='%23555' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='-5' y1='0' x2='5' y2='0'/%3E%3Cline x1='0' y1='-5' x2='0' y2='5'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat:repeat;
    background-size:180px 180px;  }
.contact-preview{position:relative;display:flex;justify-content:center;align-items:center;height:100%;z-index:2;}
.contact-card{position:relative;overflow:hidden;border-radius:10px;  width: clamp(120px,26.04vw,500px); height: clamp(160px,15.63vw,300px); transform-origin:center center;will-change:transform; background: #000;}
.contact-image{position:relative; width: 100%; height: 100%;}
.contact-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover; transition:.45s;}
.contact-content{position:absolute;top:50%;right:clamp(20px,2.604vw,50px);  height:calc(100% - 200px); z-index:2;width:calc(100% - clamp(40px,5.21vw,100px)); max-width:600px; max-height:76vh;background:#66459C;color:#fff;border-radius:10px;padding:clamp(30px,2.604vw,50px);     display: flex;  flex-direction: column;  opacity:0;}
.contact-content .section-head{margin-bottom: 0;}
.contact-content .section-head .section-title {font-size: clamp(30px,3.65vw,70px); line-height: 1.1;}
.contact-content .section-head p{font-size: clamp(16px,1.042vw,20px);}
.contact-content .btn-motion{border:1px solid #000; }
.contact-content .btn-wrap{margin-top: auto;}



@media screen and (max-width:969px){
	.contact-content .btn-wrap{flex-direction:column; align-items: flex-start;}
	.contact-content{max-height:50vh;}
}


/******************************************************* vision *******************************************************/
/* strength */
.strength-section{padding:clamp(70px,10.42vw,200px) 0 clamp(100px,15.63vw,300px);}
.strength-list{border-top:1px solid #000;   margin-left:  auto; max-width:900px;}
.strength-list > li{border-bottom:1px solid rgba(0,0,0,0.2);}
.strength-item{display:grid;grid-template-columns:360px 1fr;gap:clamp(20px,2.083vw,40px);padding:clamp(30px,2.604vw,50px) 0;}
.strength-title strong{display:block;font-size:clamp(24px,1.56vw,30px);font-weight: 500; line-height: 1.4;}
.strength-title p{margin-top:10px;font-size:clamp(15px,0.94vw,18px); line-height: 1.4;}
.strength-desc{  display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between; gap:clamp(14px,1.042vw,20px);}
.strength-desc p{font-size:clamp(16px,1.042vw,20px);   }
.strength-desc .btn-motion{margin-top: clamp(10px,1.042vw,20px);}


@media screen and (max-width:969px){
	.strength-item{    grid-template-columns:   1fr;}
	.strength-desc p br{display:none;}
}



/* history */
.digit{    overflow:hidden;   width:.62em;    height:1em;}
.digit-wrap{   display:flex;    flex-direction:column;}
.digit-wrap i{   display:flex;   align-items:center;   justify-content:center;   height:1em;    font-style:normal;line-height:1;}

.history-section{position:relative;padding:clamp(100px,15.63vw,300px) 0 0; background: #312F30;  color:#fff; }
.history-pin{display:flex; position:relative; height:100vh; width: 100%;overflow:hidden; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg transform='translate(90 90)' stroke='%23555' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='-5' y1='0' x2='5' y2='0'/%3E%3Cline x1='0' y1='-5' x2='0' y2='5'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat;background-size:180px 180px;  }
.history-preview{position:absolute; inset:0; display:flex;justify-content:center;align-items:center;height:100%;    pointer-events: none; }
.history-card{position:relative;overflow:hidden;border-radius:10px;  width: clamp(120px,26.04vw,500px); height: clamp(160px,15.63vw,300px); transform-origin:center center;will-change:transform; background: #000;}
.history-image{position:relative; width: 100%; height: 100%;}
.history-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover; transition:.45s;}
.history-year{position:fixed;left:clamp(70px,10.42vw,200px);top:50%;display:flex;gap:0;font-size:clamp(60px,11.46vw,220px);font-weight:500;line-height:1;color:#fff;transform:translateY(-50%);pointer-events:none;z-index:10;}
.history-wrap{  margin-left: auto; width: 42%;padding-right: clamp(20px,7.81vw,150px); padding-left: clamp(20px,2.604vw,50px);position:relative; }
.history-group{position:relative;padding:100px 0;  }
.history-group h3{margin-bottom:50px;font-size:clamp(24px,1.56vw,30px);font-weight:500;line-height:1;color:#fff;}
.history-list{display:flex;flex-direction:column;gap:20px;}
.history-list li{display:grid;grid-template-columns:50px 1fr; gap:10px;align-items:flex-start; font-size: clamp(18px,1.042vw,20px);}
.history-list li span{ font-weight:500; color:#fff; }
.history-list li p{ font-weight:400; color:#fff; }


@media screen and (max-width:969px){
	.history-wrap{width: 100%;}
	.history-year{left:auto; right:clamp(20px,2.604vw,50px); top:auto; bottom:clamp(20px,2.604vw,50px); transform:none;}
}






/* cleanroom */
.cleanroom-section{position:relative; padding-top: clamp(100px,15.63vw,300px);}
.cleanroom-bg{position:absolute;inset:0; z-index:-1;}
.cleanroom-item{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility .8s;}
.cleanroom-item.active{opacity:1;visibility:visible;}
.cleanroom-item img{width:100%;height:100%;object-fit:cover;}
.cleanroom-item::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,.15) 40%,rgba(0,0,0,.45) 100%);}
.cleanroom-content{position:relative;z-index:2;display:flex;justify-content:flex-end;align-items:flex-end;width: 100%; height:100vh;margin:0 auto;padding:clamp(20px,2.604vw,50px); overflow:hidden; }
.cleanroom-info{width:100%; max-width:600px;padding: clamp(30px,2.604vw,50px);background:#66459C;border-radius:10px;color:#fff;}
.cleanroom-list{display:flex;flex-direction:column;gap:10px;}
.cleanroom-list li{position:relative;padding-left:clamp(24px,1.56vw,30px);font-size:clamp(15px,1.042vw,20px);  }
.cleanroom-list li::before{content:"";position:absolute;left:0;top:clamp(4px,0.26vw,5px);width:clamp(16px,1.042vw,20px); aspect-ratio:1; border:1px solid #fff;border-radius:50%;}
.cleanroom-list li::after{content:"";position:absolute;left:clamp(5px,0.36vw,7px);top:clamp(6px,0.52vw,10px);width:5px;height:8px;border-right:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(45deg);}
.cleanroom-desc{margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.2);}
.cleanroom-desc h3{margin-bottom:10px;font-size:clamp(15px,1.042vw,20px);font-weight: 500; }
.cleanroom-desc p{font-size:clamp(14px,0.94vw,18px);   }
.cleanroom-pagination{position:absolute;left:clamp(20px,2.6vw,50px);bottom:clamp(20px,2.6vw,50px);display:flex; flex-wrap:wrap;gap:clamp(6px,0.52vw,10px);}
.cleanroom-pagination button{width:clamp(40px,2.6vw,50px); aspect-ratio:1;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:transparent;color:#fff;font-size:clamp(12px,0.729vw,14px);font-weight: 500;cursor:pointer;transition:.3s; line-height: 1;}
.cleanroom-pagination button:hover,.cleanroom-pagination button.active{  border-color:#fff;}




@media screen and (max-width:1200px){
	.cleanroom-body{ max-height: 300px;  overflow-y: auto; }
	.cleanroom-content{align-items: flex-start;}
}




/* network */
.network-section{padding:clamp(100px,15.63vw,300px) 0 0; overflow:hidden;}
.network-section .section-head{margin-bottom: 0;}
.network-map{position:relative;}
.network-map > img{display:block;width:100%;}
.network-area{position:absolute;left:50%;top:50%;width:clamp(200px,31.25vw,600px); aspect-ratio:1; border-radius:50%; transform:translate(-50%,-50%);}
@keyframes networkRipple{
	0%{transform:translate(-50%,-50%) scale(.1);opacity:.45;}
	100%{transform:translate(-50%,-50%) scale(1);opacity:0;}
}
.network-point{position:absolute; transform:translate(-50%,-50%);     background: none; display:flex; align-items:center; gap:clamp(4px,0.78vw,15px);}
.network-point .nation{position:absolute; top:clamp(-60px,-3.125vw,-30px); display:flex;align-items:center;gap:clamp(4px,0.52vw,10px); line-height: 1;padding:clamp(4px,0.52vw,10px) clamp(8px,1.042vw,20px) clamp(4px,0.52vw,10px) clamp(4px,0.52vw,10px);border:0;border-radius:999px;background:#000;color:#fff;font-size:clamp(11px,0.94vw,18px);font-weight:500;box-shadow:0 clamp(4px,0.52vw,10px) 25px rgba(0,0,0,.2);transition:.35s;cursor:pointer; white-space:nowrap;   width:max-content;  max-width:none;}
.network-point .nation span{display:block; }
.network-point .nation img{width:clamp(20px,1.56vw,30px); aspect-ratio:1; border-radius:50%;flex:none; }
.network-point .dot{content:""; position:relative; width:clamp(4px,0.52vw,10px); aspect-ratio:1; background:#000; }
.network-point.korea .dot::before,
.network-point.korea .dot::after{content:"";position:absolute;left:50%;top:50%;    width: clamp(200px,31.25vw,600px); aspect-ratio: 1; border-radius:50%;background:rgba(0,0,0,.1);transform:translate(-50%,-50%) scale(.1);animation:networkRipple 3s linear infinite;}
.network-point.korea .dot::after{animation-delay:1.5s;}
.network-point.korea{ left: 43.4%; top: 57.5%; flex-direction: column-reverse;}
.network-point.japan{ left: 47%;  top: 58%;}
.network-point.vietnam{ left: 37%; top: 70%; }
.network-point.luxembourg{left:5.5%; top:48%; }
.network-point.usa{ left:87%; top:48%; flex-direction: row-reverse; align-items:flex-end;}



/* philosophy */
.philosophy-section{padding:clamp(100px,15.63vw,300px) 0 0;}
.philosophy-wrap{display:grid;grid-template-columns:1fr 1fr; height: 100vh;}
.philosophy-image{position:relative;overflow:hidden;}
.philosophy-image img{width:100%;height:100%;object-fit:cover;t }
.philosophy-content{ padding:clamp(30px,5.21vw,100px);background:#312F30;color:#fff;}
.philosophy-content .section-head{justify-content:space-between; margin-bottom: 0; height: 100%;}
.philosophy-content .section-head .sub-title{font-weight: 400;}


@media screen and (max-width:969px){
	.philosophy-wrap{grid-template-columns:1fr ; height:auto; }
	.philosophy-content{height: 400px;}
	.network-point.japan .nation{left:16px; top: -28px;}
}





/* value */
.value-section{position:relative;height:400vh;}
.value-pin{position:relative;height:100vh;overflow:hidden;   background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg transform='translate(90 90)' stroke='%23d9d9d9' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='-5' y1='0' x2='5' y2='0'/%3E%3Cline x1='0' y1='-5' x2='0' y2='5'/%3E%3C/g%3E%3C/svg%3E"); background-repeat:repeat; background-size:180px 180px;}
.value-section .section-head{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;z-index:2;}
.value-section .section-title{font-size: clamp(40px,5.21vw,100px); line-height: 1.1;}
.value-list{position:absolute;left:0;  width: 100%; bottom:0; padding:clamp(40px,4.17vw,80px) clamp(20px,2.604vw,50px);display:flex;gap:clamp(40px,3.65vw,70px); height: 100vh; }
.value-item{flex:1; display: flex;  flex-direction: column;}
.value-item h3{font-size: clamp(20px,1.46vw,28px); font-weight: 500; margin-bottom: 10px;}
.value-item p{font-size: clamp(16px,1.042vw,20px); height: 56px;}
.value-item .img{ flex:1; border-radius:10px; margin-bottom: clamp(20px,2.083vw,40px); overflow:hidden; max-height:67vh;}
.value-item .img img{width: 100%; height: 100%; object-fit:cover;}



@media screen and (max-width:969px){
	.value-section{height: auto; padding:clamp(100px,15.63vw,300px) 0;}
	.value-pin{height:auto;}
	.value-list{flex-direction:column; height:auto; position: relative; padding-top: 0; padding-bottom: 0;}
	.value-section .section-head{position:relative; top:auto; left:auto; right:auto; transform:none !important;}
	.value-item .img{aspect-ratio:2;}
	.value-item p{height:auto;}

}



/******************************************************* products *******************************************************/

/* product */
.products-section{position:relative;padding:clamp(70px,10.42vw,200px) 0 0;}
.product-pin{position:relative; height:100vh; width: 100%;overflow:hidden;    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg transform='translate(90 90)' stroke='%23d9d9d9' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='-5' y1='0' x2='5' y2='0'/%3E%3Cline x1='0' y1='-5' x2='0' y2='5'/%3E%3C/g%3E%3C/svg%3E");    background-repeat:repeat;   background-size:180px 180px;}
.product-sec{    position:absolute; padding:clamp(60px,7.81vw,150px) clamp(20px,2.6vw,50px); color: #fff;    inset:0;    z-index:2; background-repeat:no-repeat; background-size:cover; background-position:center center; display:flex; justify-content:space-between;}
.product-sec .section-head{margin-bottom: clamp(20px,2.08vw,40px); margin-top: clamp(24px,2.6vw,50px);}
.product-sec .section-head .section-title{font-size: clamp(30px,3.13vw,60px);}
.product-sec.vexa{z-index:2; background-image:url('/images/sub/product-sec-bg02.webp');}
.product-sec.mobility{z-index:3; background-image:url('/images/sub/product-sec-bg03.webp');}
.product-content{position:relative;  }
.product-preview{position:relative;display:flex;justify-content:center;align-items:center;height:100%;z-index:2;}
.product-card{position:relative;overflow:hidden;border-radius:10px;  width: clamp(120px,26.04vw,500px); height: clamp(160px,15.63vw,300px); transform-origin:center center;will-change:transform; background: #000;}
.product-image{position:relative; width: 100%; height: 100%;}
.product-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:.45s;}
.product-img:first-child{opacity:1;}
.product-img.active{opacity:1;}
.content-card{  width:100%; max-width:500px;background:#66459C;color:#fff;border-radius:10px;padding:clamp(24px,2.6vw,50px);     display: flex;  flex-direction: column;  opacity:0;}
.card-wr{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#fff transparent; display:flex; flex-direction:column; font-size: clamp(15px,1.042vw,20px); padding-right: 20px;}
.card-wr h3{font-weight: 500; margin-top: clamp(20px,2.08vw,40px);}
.card-wr p + p{margin-top: clamp(15px,1.042vw,20px);}
.card-wr::-webkit-scrollbar{width:6px;}
.card-wr::-webkit-scrollbar-track{background:transparent;}
.card-wr::-webkit-scrollbar-thumb{background:#fff;border-radius:999px;}
.card-wr::-webkit-scrollbar-thumb:hover{background:#fff;}
.key-point{display:flex;flex-direction:column;gap:clamp(4px,0.52vw,10px); margin-top: clamp(15px,1.042vw,20px);}
.key-point li{position:relative;padding-left:30px;font-size:clamp(14px,0.94vw,18px);  }
.key-point li::before{content:"";position:absolute;left:0;top:clamp(2px,0.26vw,5px);width:clamp(18px,1.042vw,20px); aspect-ratio:1; border:1px solid #fff;border-radius:50%;}
.key-point li::after{content:"";position:absolute;left:7px;top:clamp(6px,0.52vw,10px);width:5px;height:8px;border-right:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(45deg);}
.products .contact-content{height: 90%; max-height:64vh; left:0; right:0; margin:0 auto; width: 90%; max-width:800px;}


@media screen and (max-width:969px){
	.product-pin{height:auto;}
	.product-sec{flex-direction:column; position:relative;     background-image: url(/images/sub/product-sec-bg01.webp); gap:40px;}
	.content-card{height: auto;        pointer-events: none;  opacity:1;}
	.product-preview{display:none;}

}




/* faq */
.faq-section{padding:clamp(100px,15.63vw,300px) 0; }
.faq-section .inner{display:flex;justify-content:space-between; align-items:flex-start; }
.faq-left{ flex:1; position:sticky; top:150px; padding-right: 60px; }
.faq-right{width: 60%; max-width: 900px; min-width:0;border-top:1px solid #000;}
.faq-item{border-bottom:1px solid rgba(0,0,0,0.2);padding:clamp(20px,2.6vw,50px) 0 10px;}
.faq-question{display:flex;align-items:center;width:100%;background:none;border:0;padding:0;text-align:left;cursor:pointer; font-size: clamp(18px,1.25vw,24px); font-weight: 500; margin-bottom:clamp(10px,2.08vw,40px); }
.faq-question .num{width:clamp(40px,3.13vw,60px); }
.faq-question .title{flex:1; }
.faq-question .icon-plus{position:relative;width:30px; aspect-ratio:1;}
.faq-question .icon-plus::before,
.faq-question .icon-plus::after{content:"";position:absolute;left:50%;top:50%;background:#000;transform:translate(-50%,-50%);}
.faq-question .icon-plus::before{width:16px;height:2px;}
.faq-question .icon-plus::after{width:2px;height:16px;transition:.3s;}
.faq-item.active .icon-plus::after{opacity:0;}
.faq-item.active {padding-bottom: clamp(30px,2.6vw,50px);}
.faq-answer{  height:0; overflow:hidden;  }
.answer-box{background:#fff;border-radius:10px;padding:clamp(20px,1.56vw,30px);font-size:clamp(15px,0.94vw,18px);font-weight: 400; }



@media screen and (max-width:969px){
	.faq-section .inner{flex-direction:column;}
	.faq-left{position:relative;top:auto; width: 100%;}
	.faq-right{width: 100%;}
}



/******************************************************* technology *******************************************************/


/* technology */
.technology .strength-section{padding-top: 0;}
.technology .strength-item.active .key-cont{max-height:300px;  }
.technology .strength-item.active .key-advantage{gap:clamp(10px,0.78vw,15px);}
.technology .strength-item.active .key-cont li{opacity:1;}
.technology .strength-item{display:grid;grid-template-columns:clamp(70px,10.42vw,200px) 1fr;  }
.technology .key-advantage{width: 100%; background:rgba(0,0,0,0.05);padding:clamp(24px,1.56vw,30px);border-radius:10px;font-size:clamp(16px,1.042vw,20px);  display:flex; flex-direction:column; gap:0; transition:all .6s ease;}
.technology .key-advantage p{font-weight:500;}
.technology .key-advantage .key-cont{max-height:0;overflow:hidden;transition:max-height .6s ease; display:flex; flex-direction:column; gap:clamp(8px,0.52vw,10px); }
.technology .key-advantage .key-cont li{opacity:0; transition:all ease .6s; position:relative; padding-left: 15px; line-height: 1.3;}
.technology .key-advantage .key-cont li:before{content:''; width: 4px; aspect-ratio:1; background: #000; position:absolute; left:0; top:clamp(8px,0.52vw,10px);}
.technology .contact-section{ background:none;}
.technology .contact-pin{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cg transform='translate(90 90)' stroke='%23d9d9d9' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='-5' y1='0' x2='5' y2='0'/%3E%3Cline x1='0' y1='-5' x2='0' y2='5'/%3E%3C/g%3E%3C/svg%3E"); background-repeat:repeat; background-size:180px 180px;}





/* pdlc */
.pdlc-section{  }
.pdlc-wrap{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.pdlc-card{padding:clamp(30px,2.083vw,40px) clamp(24px,2.083vw,40px) clamp(24px,2.083vw,40px);background:#fff;border-radius:10px;}
.pdlc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
.pdlc-top h3{font-size:clamp(22px,1.46vw,28px);font-weight:500;}
.pdlc-switch{display:flex;gap:clamp(5px,0.52vw,10px);}
.pdlc-switch button{height:clamp(36px,2.604vw,50px);padding:0 clamp(15px,1.25vw,24px);border:1px solid #000;border-radius:30px;background:#fff;font-size:clamp(13px,0.94vw,18px);font-weight:500;cursor:pointer;transition:.35s; color: #000;}
.pdlc-switch button.active{background:#66459C;border-color:#66459C;color:#fff;}
.pdlc-image{display:flex;justify-content:center;align-items:center; }
.pdlc-image img{max-width:90%;max-height:100%; }
.pdlc-desc{margin-top:clamp(10px,1.77vw,34px);text-align:center;font-size:clamp(16px,1.042vw,20px);color:#111; display:none; }



@media screen and (max-width:969px){
	.pdlc-wrap{    grid-template-columns: 1fr;}
	.technology .strength-item{    grid-template-columns: 1fr;}
	.technology .strength-item .key-cont{max-height:300px;  }
	.technology .strength-item .key-cont li{opacity:1;}
	.technology .strength-item .key-advantage {   gap: clamp(10px, 0.78vw, 15px);}
	.pdlc-top{flex-direction:column; gap:15px;}

}






/* energy */
.energy-section{padding:clamp(100px,15.63vw,300px) 0 0;position:relative; }
.energy-pin{height:100vh; width: 100%; overflow:hidden; background: #000; }
.energy-inner{height:100%; display:flex;  }
.energy-image{flex:1;height:100%; overflow:hidden;}
.energy-image img{width:100%;height:100%;object-fit:cover;display:block;}
.energy-info{width:0;display:flex;flex-direction:column;gap:clamp(10px, 0.78vw, 15px);  }
.energy-card{width: 300px; flex:1; background:#66459C; border-radius:10px;padding:clamp(20px,1.56vw,30px);color:#fff;transform:translateX(120%);opacity:0; display:flex; flex-direction:column; font-size: clamp(16px,0.94vw,18px);}
.energy-card .icon{width: clamp(40px,3.13vw,60px); aspect-ratio:1; background: rgba(0,0,0,0.2); border-radius:50%; display:flex; align-items:center; justify-content:center;  margin-bottom: auto;}
.energy-card strong{display:block;font-size:clamp(22px,1.46vw,28px);margin-top:10px; font-weight: 500;}
.energy-result{padding:clamp(100px,15.63vw,300px) 0;background:#000;color:#fff;overflow:hidden; text-align: center;}
.energy-result .section-head .section-title{font-size: clamp(30px,3.65vw,70px);}
.graph-wrap{display:flex;gap:40px;margin-bottom:clamp(50px,5.21vw,100px);}
.graph-card{flex:1;}
.graph-box{position:relative;height:clamp(300px,21.88vw,420px); margin-bottom: clamp(80px,5.21vw,100px);}
.graph-grid{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;flex-direction:column;justify-content:space-between;list-style:none;}
.graph-grid li{position:relative;flex:1;border-bottom:1px solid rgba(255,255,255,.1);}
.graph-grid li span{position:absolute;left:0;bottom:-10px;font-size:clamp(11px,0.73vw,14px); width: clamp(40px,3.39vw,65px); background: #000; white-space:nowrap; text-align:right;}
.graph-legend{position:absolute;top:0;right:0;display:flex;flex-direction:column;gap:3px;padding:10px 15px;background:rgba(255,255,255,0.1); backdrop-filter:blur(30px);border-radius:10px;font-size:clamp(11px,0.73vw,14px);  }
.graph-legend span{display:flex;align-items:center;gap:6px;}
.graph-legend span::before{content:"";width:10px; aspect-ratio:1;border-radius:50%;}
.graph-legend .gray::before{background:#555;}
.graph-legend .purple::before{background:#66459C;}
.graph-bars{height:100%;display:flex;justify-content:space-around;align-items:flex-end;padding-left: clamp(40px,2.6vw,50px);}
.graph-item{ flex:1; display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:10px;}
.bar-group{display:flex;align-items:flex-end;gap:10px; flex:1;;}
.graph-bar{position:relative;width:clamp(40px,2.6vw,50px);height:0;border-radius:10px 10px 0 0;transform-origin:bottom;}
.graph-bar.gray{background:linear-gradient(to top,transparent,#312F30);}
.graph-bar.blue{background:linear-gradient(to top,transparent,#2B2974);}
.graph-bar.purple{background:linear-gradient(to top,rgba(102, 69, 156, 0.2),#66459C);}
.graph-bars.type3 .graph-bar{width: clamp(50px,4.17vw,80px); }
.graph-item > strong{font-size:clamp(14px,0.94vw,18px);font-weight:500;text-align:center; position:absolute; top:calc(100% + 10px);}
.graph-caption{ padding:clamp(12px,0.89vw,17px); border-radius:40px;background:#66459C;color:#fff;display:flex;justify-content:center;align-items:center;font-size:clamp(16px,1.04vw,20px);font-weight:500;}
.energy-table{ position:relative; border:1px solid rgba(255,255,255,1);border-radius:12px;overflow-x:auto;}
.energy-table .table-wrap{min-width:500px;}
.energy-table table{width:100%;border-collapse:collapse;background:#050505;}
.energy-table th,
.energy-table td{padding:clamp(10px,0.94vw,18px) clamp(5px,0.52vw,10px);border-bottom:1px solid rgba(255,255,255,.2); font-size:clamp(13px,0.94vw,18px);    }
.energy-table tbody tr:last-child td{border-bottom:0;}
.energy-table tbody tr:hover{background:#111;transition:.35s;}


@keyframes scrollHint{
    0%,100%{transform:translateX(0);}
    50%{transform:translateX(6px);}
}
.cert-section{ padding-bottom: clamp(100px,15.63vw,300px);}
.cert-list{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(15px,3.13vw,60px);}
.cert-thumb{background:#fff;border-radius:10px;padding:clamp(14px,1.46vw,28px); transition:.35s;aspect-ratio:410 / 540;}
.cert-thumb img{width: 100%; height: 100%; object-fit:cover;}


@media screen and (max-width:1200px){
	.cert-list{ grid-template-columns:repeat(3,1fr); }
}
@media screen and (max-width:969px){
	.energy-pin{height:auto;}
	.energy-inner{flex-direction:column;}
	.energy-image{aspect-ratio:1; flex:auto;}
	.energy-info{width: 100%;  padding:clamp(20px,2.6vw,50px);}
	.energy-card{transform:none; opacity:1; width: 100%;position:relative;}
	.energy-card .icon{position:absolute; right:clamp(20px,1.56vw,30px);}
	.graph-wrap{flex-direction:column;}
	.cert-list{ grid-template-columns:repeat(2,1fr); }
	.energy-table::before{content:"↔";position:absolute;top:0;left:0;z-index:10;display:flex;align-items:center;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.7);color:#fff;font-size:20px;font-weight:400;line-height:1;pointer-events:none;animation:scrollHint 1.2s ease-in-out infinite;}


}


/******************************************************* 구 contact 페이지 *******************************************************/

.contact {padding:clamp(70px,10.42vw,200px) 0; font-size: clamp(14px,0.94vw,18px);}
.contact .sub-tit{margin-bottom: clamp(20px,2.083vw,40px); display:flex; justify-content:space-between; align-items:flex-end;}
.contact .sub-tit .req-txt{font-size: 15px;color: #555; line-height: 1; }
.contact .sub-tit .req-txt span{color: #00AFEF;}
.contact .btn{font-size: 1.1em;}
.contact .tab{margin:clamp(40px,5.208vw,100px) 0;}
.contact .req:after{content:'*'; color: #00AFEF; margin-left: 5px;}
.contact .btn-wr{justify-content: center;}
.contact .btn-wr a{font-size: clamp(16px,1.042vw,20px); height: clamp(54px,3.646vw,70px); padding:0 clamp(36px,3.646vw,70px);}
.contact .btn-wr a:hover{background-color: #000; color: #fff; }
.contact-form{padding: clamp(20px,3.125vw,60px) clamp(20px,2.083vw,40px); background: #fff; border-radius:10px; display:flex; flex-wrap:wrap; gap:clamp(10px,1.042vw,20px) 60px;  }
.contact-form input:not([type="radio"]):not([type="checkbox"]),
.contact-form select{width: 100%; border:1px solid #E5E7EB; height: clamp(54px,3.125vw,60px); padding:0 clamp(15px,1.25vw,24px); border-radius:clamp(10px,3.125vw,60px); font-size: clamp(15px,0.833vw,16px);}
.contact-form select{background: url('/images/icon-select.svg') no-repeat center right clamp(15px,1.25vw,24px);}
.contact-form textarea{width: 100%; border:1px solid #E5E7EB; border-radius:30px; padding:clamp(15px,1.25vw,24px); height: clamp(200px,15.625vw,300px);}
.contact-form > li{width: calc(50% - 30px); display:flex;}
.contact-form > li.wide{width: 100%;}
.contact-form > li > label{width: 150px;  font-size: clamp(17px,1.042vw,20px); font-weight: 500; padding-top: 15px;}
.contact-form > li .ip-box{width:calc(100% - 150px);}
.contact-form > li .ip-box:has(.radio-group){display:flex; align-items:center; gap:20px;}
.contact-form > li .radio-group{display:flex; gap:20px;}
.contact-form > li .radio-group label{display:flex; gap:5px; font-size: 1rem;}
.contact-form > li .ip-size{display:flex; gap:10px;}
.contact-form > li .ip-box > p{color: #666; margin-top: 12px; font-size: 14px;}
.contact-form > li .ip-box.address{display:flex; gap:clamp(5px,0.521vw,10px);}
.contact-form > li .ip-box.address button{background: #000; color: #fff; border-radius:clamp(10px,3.125vw,60px); text-align: center; width: clamp(80px,6.25vw,120px); font-weight: 500;     flex-shrink: 0; font-size: clamp(15px,0.833vw,16px)}
.contact-form > li .ip-name{display:flex; gap:clamp(5px,0.521vw,10px);}
.contact-form > li .ip-name input:first-child{width: 50%;}
.contact-form > li .file-box{display:flex;gap:clamp(5px,0.521vw,10px); max-width:600px;}
.contact-form > li .file-box input[type=text]{flex:1;}
.contact-form > li .file-box .file-hidden{display:none;}
.contact-form > li .file-box .btn-file{background: #000; color: #fff; border-radius:clamp(10px,3.125vw,60px); text-align: center; width: clamp(90px,6.25vw,120px); font-weight: 500;     flex-shrink: 0; cursor:pointer; line-height: clamp(54px,3.125vw,60px);}
.contact-form #captcha{display:flex; flex-wrap:wrap; gap:10px; align-items:center;}
.contact-form #captcha #captcha_img{border:0;}
.contact-form #captcha #captcha_key{width: 150px; height: 50px; border:1px solid #e2e4e9; border-radius:10px; font-weight: 500; color: #000;}
.contact-form #captcha #captcha_info{width: 1010%;}
.contact-form #captcha #captcha_mp3,
.contact-form #captcha #captcha_reload{width: 50px; height: 50px; background-color: #c9c9c9; border-radius:10px;}
.contact-form #captcha #captcha_mp3{background-position:4px 4px;}
.contact-form #captcha #captcha_reload{background-position:4px -36px;}
.contact-form > li:has(.privacy-content){flex-direction:column; gap:clamp(12px,1.042vw,20px);}
.contact-form > li:has(.privacy-content) label{width: 100%;}
.contact-form > li .privacy-content{ width: 100%;border: 1px solid #E5E7EB;border-radius: 20px;padding: clamp(20px,2.083vw,40px);height: clamp(200px,15.625vw,300px); background: #fafafa; color: #666; overflow-y:auto;}
.privacy-content td,
.privacy-content th{padding:clamp(5px,0.521vw,10px); }
.privacy-content td{background: #fff;}
.contact-guide{background: #fff; padding:clamp(30px,3.125vw,60px); border-radius:10px; display:flex; gap:clamp(10px,1.563vw,30px); margin-bottom: clamp(60px,5.208vw,100px); justify-content:space-between;}
.contact-guide .guide-tit{   }
.contact-guide .guide-tit h3{font-size:clamp(24px,1.875vw,36px); margin:10px 0;}
.contact-guide .guide-tit p{font-size: clamp(16px,1.042vw,20px); color: #222; font-weight: 400;}
.contact-guide .guide-tit .icon{width:clamp(30px,1.875vw,36px);}
.contact-guide .guide-cont{flex:1; max-width:980px;}
.contact-guide .guide-cont h4 {font-size: clamp(16px,1.042vw,20px); margin-bottom: clamp(8px,0.781vw,15px);}
.contact-guide .guide-cont p{  color: #555;}
.contact-guide .guide-cont .dot-list{width: 100%;}
.contact-guide .guide-cont .dot-list > li{position:relative; color: #555; padding-left: clamp(12px,0.781vw,15px);}
.contact-guide .guide-cont .dot-list > li + li{margin-top: clamp(3px,0.521vw,10px);}
.contact-guide .guide-cont .dot-list > li:before{content:''; width: 5px; height: 5px; background: #555; border-radius:50%; position:absolute; left:0; top:8.5px;}
.contact-guide .guide-cont .guide-flex{display:flex;  flex-wrap:wrap; gap:10px; margin-top: clamp(10px,3.125vw,60px);}
.contact-guide .guide-cont .guide-flex > div{width: 45%;}
.contact-guide .guide-cont .process{margin-top: clamp(10px,3.125vw,60px);}
.contact-guide .guide-cont .process .note{font-size: clamp(14px,0.781vw,15px); margin-top: 10px;}
.contact-guide .guide-cont .process > ul{display:flex; gap:10px;  counter-reset:step;}
.contact-guide .guide-cont .process > ul > li{position:relative; width: 16.66%; background: #fafafa; border-radius:10px; border:1px solid #eee; padding:clamp(16px,1.042vw,20px); aspect-ratio:1; counter-increment:step; color: #333; transition:all ease .35s; font-weight: 500; }
.contact-guide .guide-cont .process > ul > li::before{content:'STEP'counter(step, decimal-leading-zero); width: 100%; font-weight: 600; font-size: 14px; color: #aaa; margin-bottom: clamp(3px,0.521vw,10px); display:block; transition:all ease .35s;}
.contact-guide .guide-cont .process > ul > li + li:after{content:''; width: 30px; height: 30px; border-radius:50%; display:flex; align-items:center; justify-content:center; text-align: center;  color: #fff; position:absolute; left:-21px; top:50%; margin-top: -15px; font-size: 1.3em; line-height: 1; background: url(/images/main/arrow.svg) #000 no-repeat center center / 14px;}
.contact-guide .guide-cont .process > ul > li.on{border-color:#000;}
.contact-guide .guide-cont .process > ul > li.on::before{color: #000;}
.contact-guide .guide-cont .info-list{margin:clamp(15px,1.563vw,30px) 0; background:#fafafa; border-radius:20px; padding:clamp(20px,1.563vw,30px);}
.contact-guide .guide-cont .info-list > li{display:flex; gap:clamp(5px,0.521vw,10px);}
.contact-guide .guide-cont .info-list > li + li{margin-top: clamp(8px,0.781vw,15px);}
.contact-guide .guide-cont .info-list > li .info-tit{width: 120px;  color: #333;  font-weight: 600; display:flex; gap:clamp(5px,0.521vw,10px); align-items:flex-start;}
:lang(en) .contact-guide .guide-cont .info-list > li .info-tit{width: 160px;}
.contact-guide .guide-cont .info-list > li .info-tit img{width: clamp(20px,1.25vw,24px);}
.contact-guide .guide-cont .info-list > li .info-desc{flex:1; color: #555; font-weight: 400; }



/* agree */
.contact-form > li:has(.agree-box){flex-direction:column; gap:clamp(8px,0.781vw,15px); font-size: clamp(15px,0.938vw,18px);}
.agree-box {position:relative;  display: flex;  align-items: center;  gap: 10px; }
.agree-box input[type="checkbox"] { position: absolute; opacity: 0;}
.agree-box input[type="checkbox"] + label {  position: relative;  cursor: pointer;  padding: 0;  padding-left: clamp(30px,1.875vw,36px); padding-top: 2px;}
.agree-box input[type="checkbox"] + label:before {  content: "";  margin-right: 10px;  display: inline-block;  vertical-align: top;   width: clamp(20px,1.302vw,25px);  height: clamp(20px,1.302vw,25px);  background: white; border:1px solid #ddd; border-radius:50%; position:absolute; left:0; top:3px;}
.agree-box input[type="checkbox"]:checked + label:before {  background: #000;  border-color:#000;}
.agree-box input[type="checkbox"]:disabled + label {  color: #b8b8b8;  cursor: auto;}
.agree-box input[type="checkbox"]:disabled + label:before {  box-shadow: none;  background: #ddd;}
.agree-box input[type="checkbox"]:checked + label:after {  content: "";  position: absolute;  left: clamp(5px,0.365vw,7px);  top: clamp(12px,0.729vw,14px);  background: white;  width: 2px;  height: 2px;  box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;  transform: rotate(45deg);}
.agree-box label span{ color: #000; vertical-align:baseline;}



/* popup */
.layer-popup {  position: fixed;  inset: 0;   z-index: 1000; display:none;}
.layer-popup.active { display: block;}
.layer-popup .popup-dim { position: absolute;  inset: 0;  background: rgba(0,0,0,0.5);}
.layer-popup .popup-content {  position: absolute;  top: 50%;  left: 50%;  width: 90%;  max-width: 1000px; max-height:80vh; transform: translate(-50%, -50%);  background: #fff;  padding: clamp(50px,3.125vw,60px) 5%;  border-radius: 20px;}
.layer-popup .popup-content h2 {  font-size: clamp(20px,1.25vw,24px);  margin-bottom: clamp(20px,2.083vw,40px); text-align: center; color: #111;}
.layer-popup .popup-text {  max-height: calc(80vh - 200px);  overflow-y: auto;   color: #444;  line-height: 1.6;    }
.layer-popup .btn-close {width: 30px; height: 30px; position:absolute; right:20px; top:20px; display:flex; align-items:center;color: #000; justify-content:center; background: none; font-size: 30px;  cursor: pointer;}


/* privacy */
.privacy .sub-tit {margin-bottom: clamp(30px,2.6vw,50px);}
.privacy .sub-tit h2{text-align: center;}
.privacy-cont{  line-height:1.5;  }
.privacy-cont h3{font-size:1.2em; margin:clamp(20px,2.083vw,40px) 0 clamp(8px,0.8vw,15px);color:#000;}
.privacy-cont h4{font-size:1.1em; margin:clamp(15px,1.042vw,20px) 0 clamp(7px,0.5vw,10px); color:#000;}
.privacy-cont p{margin-bottom:15px;}
.privacy-cont ul{margin:clamp(5px,0.5vw,10px) 0 clamp(10px,1.042vw,20px) clamp(20px,1.25vw,24px);}
.privacy-cont li{margin-bottom:clamp(4px,0.4vw,8px);}
.privacy-cont ul ul{margin:clamp(4px,0.4vw,8px) 0 clamp(6px,0.6vw,12px) clamp(6px,0.5vw,10px);}
.privacy-cont ul ul li:before{content:'-'; margin-right: 5px;}
.privacy-cont strong color:#000;}
.privacy-cont hr{border:none;border-top:1px solid #ddd;margin:40px 0;}



@media (max-width: 969px) {

	/* contact */
	.contact-form > li{width: 100%; flex-direction:column; gap:10px;}
	.contact-form > li > label{width: 100%;  }
	.contact-form > li .ip-box{width: 100%;}
	.contact-form > li .ip-box:has(.radio-group){flex-direction:column; align-items:flex-start; }
	.contact-guide{flex-direction: column; }
	.contact-guide .guide-cont .guide-flex{flex-direction: column; }
	.contact-guide .guide-cont .process > ul{flex-wrap:wrap; flex-direction: column; }
	.contact-guide .guide-cont .process > ul > li{width: 100%; aspect-ratio:auto; }
	.contact-guide .guide-cont .process > ul > li br{display:none;}
	.contact-guide .guide-cont .guide-flex > div{width: 100%;}
	.contact-guide .guide-tit {display:flex; flex-wrap:wrap; gap:10px;}
	.contact-guide .guide-tit h3{width:calc(100% - 40px); margin:  0; }
	.contact-guide .guide-cont .process > ul > li + li:after{left:50%; top:-21px; margin-top: 0; margin-left: -15px; transform: rotate(90deg);}
	.contact .sub-tit{flex-direction: column; align-items:flex-start;}
	.contact .sub-tit:has(.req-txt){margin-bottom: 10px;}
	.contact-form > li .ip-size{flex-direction: column; }
	.contact-guide .guide-cont .info-list > li{flex-direction: column; }
	.contact-guide .guide-cont .info-list > li .info-tit{width: 100%; font-size: 1.1em; }
	.contact-guide .guide-cont .info-list > li .info-tit img{margin-top: 2px;}


}