@import url("common.css");



.compad_b {padding:0 0 170px; box-sizing:border-box;}

.pointColor{color:var(--basic) !important;}
.blackColor{color:var(--black) !important;}
.whiteColor{color:var(--white) !important;}

.bold{font-weight: 500 !important; letter-spacing:inherit; line-height:inherit;}
.semibold{font-weight: 600 !important; letter-spacing:inherit; line-height:inherit;}
.medium{font-weight: 500 !important; letter-spacing:inherit; line-height:inherit;}
.regular{font-weight: 400 !important; letter-spacing:inherit; line-height:inherit;}
.light{font-weight: 300 !important; letter-spacing:inherit; line-height:inherit;}

.fs50{font-size:3.125rem; letter-spacing: -2px; line-height:130%; font-weight:700;}
.fs40{font-size:2.222rem; letter-spacing:-1.8px; line-height:127.778%;}
.fs36{font-size:2rem; letter-spacing:-1.2px; line-height:125%;}
.fs30{font-size:1.667rem; letter-spacing:-1.5px; line-height:133%;}
.fs26{font-size:1.444rem; letter-spacing:-0.78px; line-height:138.462%;}
.fs24{font-size:1.333rem; letter-spacing:-0.72px; line-height:141.667%;}
.fs20{font-size:1.111rem; letter-spacing:-0.6px; line-height:160%;}
.fs18{font-size:1rem; letter-spacing:-0.54px; line-height:177.778%;}
.fs16{font-size:0.889rem; letter-spacing:-0.48px; line-height:175%;}


#header {background:var(--white); border-bottom:1px solid var(--border); box-sizing:border-box;}
#header.fixed {background:var(--white);}
#header h1 {line-height:1; display:inline-block; height:22px; color: var(--black);}
#header #menu ul li > a {color:var(--black);}
#header #menu ul li > a .gg_icon::before {color:var(--black);}
#header .top_util li.search span::before {color:var(--black);}
#header .top_util li.sitemap span::before {color:var(--black);}


@keyframes m_vsImg {
	0% { -webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1); }
	20% { -webkit-transform:scale(1.1); -ms-transform:scale(1.1); transform:scale(1.1); }
	100% { -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); }
}
@keyframes v_txt {
	0% { transform:translateY(60px); opacity:0; }
	100% { transform:translateY(0); opacity:1; }
}




/* 타이틀 */
#subtitle {font-size:1.25rem; font-style: normal; font-weight: 600; line-height: 110%; /* 22px */ text-transform: uppercase; color:var(--black); padding:105px 5% 20px; box-sizing:border-box; transform:translateY(60px); opacity:0;  animation:v_txt 1s ease forwards;}

/* PC lnb */
.lnb {overflow:hidden; position: relative; z-index: 9; margin:-8px auto 15px; transform:translateY(60px); opacity:0;  animation:v_txt 1s ease forwards; animation-delay:0.2s;}
.lnb .lnb_in{}
.lnb .lnb_in ul {display:flex;}
.lnb .lnb_in ul li {position:relative; width: auto; margin-right:37px;}
.lnb .lnb_in ul li::after {content:''; width:1px; height:10px; background:var(--black); opacity:0.2; position:absolute; right:-19px; top:50%; transform:translateY(-50%);}
.lnb .lnb_in ul li:last-of-type {margin-right:0;}
.lnb .lnb_in ul li:last-of-type::after {display:none;}
.lnb .lnb_in ul li a {display:block; line-height:214.286%; letter-spacing: 0.14px; text-transform: uppercase; color:var(--black); font-size:0.833rem; color:rgba(1,1,1,0.5);}
.lnb .lnb_in ul li label {display:block; line-height:214.286%; letter-spacing: 0.14px; text-transform: uppercase; color:var(--black); font-size:0.833rem; color:rgba(1,1,1,0.5);}
.lnb .lnb_in ul li label.checked {color:var(--black); font-weight:700; }
.lnb .lnb_in ul li label input {position:relative; top:-1px; margin:0; margin-right:6px; display:inline-block;}
.lnb .lnb_in ul li.left_linktop a {color:var(--black); font-weight:600; text-decoration:underline; text-underline-offset:4px;}
.lnb .lnb_in ul li:hover a{color:var(--black);}
.lnb .lnb_in ul.kor li a {letter-spacing: -0.7px;}

.highlights_sort {position:absolute; right:5%; top:97px; display:flex; flex-wrap:Wrap; align-items:center; }
.highlights_sort span {color:#010101; font-family:var(--eng); font-size: 14px; font-weight: 400; letter-spacing: 0.14px; display:block; margin-right:10px; line-height:1;}
.highlights_sort select {font-size:14px; width:110px; height:33px !important; padding:0 11px; background-size:10px;}


.contents_in {transform:translateY(60px); opacity:0;  animation:v_txt 1s ease forwards; animation-delay:0.4s;}



/*** 공통 css ***/
.subTit{font-size:2.5rem; letter-spacing:-1.5pt; line-height:120%; font-weight:300; color:var(--black);}
.subTit strong{display:inline; letter-spacing:-1.5pt; font-weight:700;}
.subTxt{font-size:1.25rem; letter-spacing:-0.75pt; color:rgba(119,119,119,.8); line-height:150%; font-weight:400;}
.stxt{letter-spacing: -1.26px; color:rgba(1,1,1,0.5);}
.txt{font-size:1rem; letter-spacing:-0.35pt; color:var(--basic); line-height:170%;}

/* select, .select {font-size:0.9444rem; color:var(--basic); border:1px solid var(--border); padding:0 14px; font-family:inherit; height:45px !important; box-sizing:border-box; -webkit-appearance: none; -webkit-border-radius: 0; background: url("../image/icons/cat_arrow_bk.svg") no-repeat right 12px center/8px auto; outline:none; cursor:pointer;}
.input {font-size:0.9444rem; color:var(--basic); border:1px solid var(--border); background-color:var(--white); padding:0 14px; font-family:inherit; height:45px; box-sizing:border-box; -webkit-appearance: none; -webkit-border-radius: 0;}
.blind {font-size:0; line-height:0; width:0px; height:0px;}
.textarea {width:100%; height: 200px; font-family:inherit; color:var(--basic); line-height:150%; letter-spacing:-0.5px; padding:15px; border: 1px solid var(--border); background-color:var(--white); box-sizing:border-box; -webkit-appearance: none; -webkit-border-radius: 0;} */

/* input 디자인 */
/* .input_m {width:50%;}
.input_s {width:150px; box-sizing:border-box;}
.input_l {width:100%; box-sizing:border-box;}
.input_file {width: 100%; padding:0 15px; height: 50px; line-height: 50px; box-sizing:border-box; border:1px solid var(--border); -webkit-appearance: none; -webkit-border-radius: 0;} */

/* 버튼디자인 */
/* .btn_w {display:inline-block; text-align:center; height:55px; line-height:53px; width:110px; border:1px solid var(--border); font-size:0.88rem; letter-spacing:-0.5pt; vertical-align:top; transition:all 0.3s; box-sizing:border-box; cursor:pointer; -webkit-appearance: none; -webkit-border-radius: 0;}
.btn_w:hover {color: var(--black); border:1px solid var(--black); transition:all 0.3s;}
.btn_b:link, .btn_b:visited {display:inline-block; text-align:center; height:55px; line-height:53px; width:110px; border:1px solid #555; background:#555; color:var(--white); font-size:0.88rem; letter-spacing:-0.5pt; vertical-align:top; transition:all 0.3s; box-sizing:border-box; cursor:pointer; -webkit-appearance: none; -webkit-border-radius: 0;}
.btn_b:hover  {background:var(--black); border:1px solid var(--black); color:var(--white); transition:all 0.3s}
.btn_b_s {font-size:0.88rem; height:55px;line-height: 53px; -webkit-appearance: none; -webkit-border-radius: 0;display:inline-block; text-align:center; cursor:pointer;  color:var(--white); width:70px; border:1px solid #555; background:#555; letter-spacing:-0.5pt; vertical-align:top; transition:all 0.3s; box-sizing:border-box; -webkit-appearance: none; -webkit-border-radius: 0;}
.btn_b_s:hover  {background:var(--black); border:1px solid var(--black); transition:all 0.3s;}

input.btn_w {text-align:center; height:55px; line-height: 53px; width:110px; border:1px solid #ccc; background:var(--white); color:#555; font-size:0.88rem; letter-spacing:-0.5pt; vertical-align:top; transition:all 0.3s; cursor:pointer; -webkit-appearance: none; -webkit-border-radius: 0;}
input.btn_w:hover {color:var(--black); border:1px solid var(--black); transition:all 0.3s}
input.btn_b {text-align:center; height:55px; line-height: 53px; width:110px; border:1px solid #555; background:#555; color:var(--white); font-size:0.88rem; letter-spacing:-0.5pt; vertical-align:top; transition:all 0.3s; cursor:pointer; -webkit-appearance: none; -webkit-border-radius: 0;}
input.btn_b:hover {background:var(--black); border:1px solid var(--black); transition:all 0.3s} */



/* 회사소개 - 회사개요 */
.company_cont {}
.company_cont .basic_in .overview_cont {display:flex; flex-wrap:wrap; padding:50px 0 0;}
.company_cont .basic_in .overview_cont > div{box-sizing:border-box;}
.company_cont .basic_in .overview_cont .imgArea{width:30%;}
.company_cont .basic_in .overview_cont .imgArea img{max-width:100% !important; height:auto !important;} 
.company_cont .basic_in .overview_cont .imgArea img.mobile{display:none;}
.company_cont .basic_in .overview_cont .txtArea{width:70%; padding: 0 0 0 80px; display: flex; flex-direction: column; justify-content: center; background:url('../image/sub/overview_ci.png') no-repeat right bottom/472px auto;}
.company_cont .basic_in .overview_cont .txtArea .fs36{padding:0 0 20px; color: var(--black);}
.company_cont .basic_in .overview_cont .txtArea .fs18{padding:0 0 30px; color:rgba(1,1,1,0.5);}
.company_cont .basic_in .overview_cont .txtArea .fs18.ceo{color:var(--black); }
/* .company_cont .basic_in .textArea .logo {width:420px; font-size: 4.625rem; font-weight: 600; color: var(--black);}
.company_cont .basic_in .textArea .cont {width:calc(100% - 420px);}
.company_cont .basic_in .textArea .cont h4 {font-size:1.66rem; font-style: normal; font-weight: 400; letter-spacing: -1.2px; color:var(--black); margin:0 0 16px;}

.company_cont .basic_in .textArea .cont .overview_info {border-top:2px solid var(--black);}
.company_cont .basic_in .textArea .cont .overview_info dl {display:flex; flex-wrap:Wrap; border-bottom:1px solid #ddd;}
.company_cont .basic_in .textArea .cont .overview_info dl dt {width:200px; padding:20px 22px; box-sizing:border-box; background:var(--grayBg);font-size: 1rem; font-weight: 500; letter-spacing: -0.34px; color:var(--black);}
.company_cont .basic_in .textArea .cont .overview_info dl dd {width:calc(50% - 200px); padding:20px 22px; font-size: 0.875rem; letter-spacing: -0.34px; box-sizing:border-box;}

.company_cont .basic_in .textArea .cont p {margin:32px 0;}
.company_cont .basic_in .textArea .cont p:last-of-type {margin:0;} */


/* 회사소개 - 연혁 */
.history_top{background:url('../image/sub/history_img.jpg') no-repeat center/cover; text-align:center; padding:144px 50px; box-sizing:border-box;}
.history_top .fs50{color:var(--white);}
.history_top .fs18{color:var(--white); padding:15px 0 0;}

.history_wrap {padding:100px 0 0; position:relative}
.history_in {display:flex; align-items:flex-start}
.history_in:not(:first-of-type) {padding-top:100px}
.history_in > h4 {width:350px; flex-shrink:0; position:sticky; top:20px; transition:all 0.3s ease-in-out}
/* .header.fixed + .mo_menu + #visual + #contents .history_in > h4 {top: 130px} */
.header.fixed + #sitemap + .mo_menu + #visual + #contents .history_in > h4 {top: 130px}
.his_in {padding-bottom:40px; padding-left:80px}
.history_in .his_in:last-child {padding-bottom:0}
.history_in:last-of-type .his_in:last-child {padding-bottom:100px}
.his_txt {display:flex; align-items:flex-start;}
.his_in h4 {position:relative; margin-top:-5px; padding-right:46px}
.his_in h4 .dot {width:10px; aspect-ratio:1 / 1; background:var(--white); box-shadow: 0 0 0 3px var(--black) inset; border-radius:50%;box-sizing:border-box; position:absolute; top:50%; transform:translate(-50%, -50%); left:-76px; z-index:10}
.his_in h4 .dot::before {position:Absolute; top:50%; left:10px; transform:translateY(-50%); width:40px; height:1px; background:var(--border); content:""; z-index:1}
.his_txt li {display:flex; gap:8px; align-items:flex-start}
.his_txt li::before {width:3px; aspect-ratio:1 / 1; background:var(--black); margin-top:15px; content:""; flex-shrink:0;}

.line {position:absolute; background:var(--border); width:1px; height:100%; top:0; left:353px;}
.active_line {width:1px; background:var(--black); top:0; left:50%; transform:translate(-50%); z-index:-1; transition: all 0.3s; position:absolute; z-index:0}


/* 회사소개 - 특허&디자인 */

.certi_list {position:relative; /*max-width:1350px;*/ display:flex; flex-wrap:wrap;}
.certi_list .checkbox{position: absolute; left:5px; top:5px; z-index:9;}
.certi_list dl{width:calc((100% - 120px)/5); margin-right:30px; position:relative; box-sizing: border-box; }
.certi_list dl:nth-child(5n){margin-right:0;}
.certi_list dl:nth-child(n+6) { margin-top:50px; }
.certi_list dl a{display: block;}
.certi_list dl dt{display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; text-align:center; box-sizing:border-box; width: 100%; border:1px solid #ddd;}
.certi_list dl dt img{width: 100%; max-width:100%; height: auto; background-size:contain; background-position:center; background-repeat: no-repeat; transform:rotate(0.01deg) scale3d(1, 1, 1); transition:transform .3s cubic-bezier(0.250, 0.460, 0.450, 0.940); overflow:hidden; transition:All .2s linear; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.10);}
.certi_list dd{ padding:19px 0 0; width: 100%; box-sizing: border-box; display: block;}
.certi_list dd .fs16{text-align:center; color: var(--black); font-weight: 400; letter-spacing:-0.72px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; line-height:155%; }
.certi_list dl:hover dd .fs16 { color:var(--main); transition:all .3s linear; } 
.certi_list dd .fs16 br {display:block !important;}


/* Styles for dialog window */
.white-popup.wid{max-width:960px; margin:0 auto; background:#fff}
.white-popup {background: white;text-align: left;max-width:560px;margin: 40px auto;position: relative;}
.white-popup h2{background:var(--black); color:#fff; font-weight:500; font-size:18px; padding:0 50px 0 20px; line-height:50px; letter-spacing: -0.25pt; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block}
.white-popup h2 span{line-height:100%;  font-size:15px;}
.white-popup img{max-width:100%; background-size: cover;}
.white-popup .smimg{text-align:center; padding:20px;}
.white-popup .infob{text-align:center; padding:0 20px 30px 20px}
.white-popup .etx{font-size:16px; color:#16306d;  line-height:100%; margin-bottom:10px;}
.white-popup .smtit{font-weight:600; line-height:30px; font-size:20px; color:#222;  letter-spacing: -0.8pt; margin-bottom:12px;}

.white-popup .grbox{position:relative; overflow: hidden;background:#f0f0f0; padding:25px 20px}
.white-popup dl{position:relative;overflow: hidden;  margin-bottom:12px}
.white-popup dl:last-child{margin-bottom:0}
.white-popup dt{letter-spacing: -0.3pt;position:relative;overflow: hidden; float:left; width:60px; margin-right:30px;  font-size:16px;line-height:22px; color:#222; font-weight:500}
.white-popup dd{letter-spacing: -0.3pt; font-weight:300; position:relative;overflow: hidden; float:left; font-size:16px; line-height:22px;  width: calc(100% - 90px);}


.white-popup2{max-width:960px; margin:0 auto; background:#fff}
.white-popup2 .smcbox{text-align:center; padding:20px;}
.white-popup2 .smimg img{max-width:100%; max-height: 760px;}
/*.white-popup2 .mfp-close{background:#15613b; width:50px !important; height:50px !important; line-height:50px !important; top: -50px; right:0px;}
.white-popup2 .mfp-close:active { top:-50px; }*/

.mfp-close{opacity:1 !important; width:50px !important; height:50px !important; line-height:50px !important;}
.mfp-close-btn-in .mfp-close{color:#fff !important}
/**
 * Fade-zoom animation for first dialog
 */

/* start state */
.my-mfp-zoom-in .zoom-anim-dialog {
	opacity: 0;

	-webkit-transition: all 0.2s ease-in-out; 
	-moz-transition: all 0.2s ease-in-out; 
	-o-transition: all 0.2s ease-in-out; 
	transition: all 0.2s ease-in-out; 



	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-ms-transform: scale(0.8); 
	-o-transform: scale(0.8); 
	transform: scale(0.8); 
}

/* animate in */
.my-mfp-zoom-in.mfp-ready .zoom-anim-dialog {
	opacity: 1;

	-webkit-transform: scale(1); 
	-moz-transform: scale(1); 
	-ms-transform: scale(1); 
	-o-transform: scale(1); 
	transform: scale(1); 
}

/* animate out */
.my-mfp-zoom-in.mfp-removing .zoom-anim-dialog {
	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-ms-transform: scale(0.8); 
	-o-transform: scale(0.8); 
	transform: scale(0.8); 

	opacity: 0;
}

/* Dark overlay, start state */
.my-mfp-zoom-in.mfp-bg {
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-zoom-in.mfp-ready.mfp-bg {
	opacity: 0.8;
    z-index: 99999999;
}
/* animate out */
.my-mfp-zoom-in.mfp-removing.mfp-bg {
	opacity: 0;
}



/**
 * Fade-move animation for second dialog
 */

/* at start */
.my-mfp-slide-bottom .zoom-anim-dialog {
	opacity: 0;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-moz-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-ms-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-o-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );

}

/* animate in */
.my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
	opacity: 1;
	-webkit-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-moz-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-ms-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-o-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
}

/* animate out */
.my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
	opacity: 0;

	-webkit-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-moz-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-ms-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-o-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
}

/* Dark overlay, start state */
.my-mfp-slide-bottom.mfp-bg {
	opacity: 0;

	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-slide-bottom.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-slide-bottom.mfp-removing.mfp-bg {
	opacity: 0;
}

/* 회사소개 - 오시는길 */
.contactus_cont {display:flex; flex-wrap:wrap; justify-content:space-between; }
.map_area {width:calc(81% - 470px);}

.map_area .root_daum_roughmap {width:100%;}
.map_area .wrap_map{width:100%; height:611px !important;}
.map_area .map_border{display:none !important;}
.map_area .wrap_controllers{display:none !important;}
.map_area .cont {display:none !important;}

.map_table {width:470px; display:flex; flex-wrap:wrap; align-content:space-between; margin-right:13.9%}
.map_table .map_info {width:100%;}
.map_table .map_info .subject {font-weight: 500; line-height:133.333%; letter-spacing: -0.96px; font-size:1.333rem; color:Var(--black); margin:0 0 12px;}
.map_table .map_info dl {display:flex; flex-wrap:Wrap; margin:0 0 3px;}
.map_table .map_info dl:last-of-type {margin:0;}
.map_table .map_info dl dt {width:110px; letter-spacing: -1.26px; color:var(--black); }
.map_table .map_info dl dd {width:calc(100% - 110px); letter-spacing: -1.26px; color:rgba(1,1,1,0.5);  display:flex; flex-wrap:wrap;}
.map_table .map_info dl dd span {display:block; margin-right:5px; position:relative; top:4px;}
.map_table .map_info dl dd span::before {color:rgba(1,1,1,0.5); font-size:16px; font-weight:500;}
.map_table .map_info dl dd span.tel::before {content:'\e0b0';}
.map_table .map_info dl dd span.email::before {content:'\e158';}


.loca_btn {display: flex;}
.loca_btn li {margin-right:5px}
.loca_btn li:last-child {margin-right:0}
.naver_btn a {position:relative; z-index:10; width:130px; height:40px; display:flex; text-align:center; border:1px solid rgba(1,1,1,0.5); box-sizing:border-box; color:var(--black); transition:all 0.5s ease; letter-spacing: 0.15px; text-transform: uppercase; font-size:0.75rem; margin:20px 0 0; flex-wrap:wrap; align-items:center; justify-content:center;}
.naver_btn a svg path { transition:all 0.5s ease;}
.naver_btn a svg {width:15px; height:auto; margin-right:10px; display:block;}
.naver_btn a::after {content:''; width:0; height:100%; background:var(--black); position:absolute; top:0; left:0; opacity:0; transition:all 0.5s ease; z-index:-1;}
.naver_btn a:hover {border:1px solid var(--black); color:var(--white); transition:all 0.5s ease;}
.naver_btn a:hover svg path {fill:var(--white); transition:all 0.5s ease;}
.naver_btn a:hover::after {width:100%; opacity:1; transition:all 0.5s ease;}
.kakao_btn a {position:relative; z-index:10; width:130px; height:40px; display:flex; text-align:center; border:1px solid rgba(1,1,1,0.5); box-sizing:border-box; color:var(--black); transition:all 0.5s ease; letter-spacing: 0.15px; text-transform: uppercase; font-size:0.75rem; margin:20px 0 0; flex-wrap:wrap; align-items:center; justify-content:center;}
.kakao_btn a svg path { transition:all 0.5s ease;}
.kakao_btn a svg {width:7px; height:auto; margin-right:10px; display:block;}
.kakao_btn a::after {content:''; width:0; height:100%; background:var(--black); position:absolute; top:0; left:0; opacity:0; transition:all 0.5s ease; z-index:-1;}
.kakao_btn a:hover {border:1px solid var(--black); color:var(--white); transition:all 0.5s ease;}
.kakao_btn a:hover svg path {fill:var(--white); transition:all 0.5s ease;}
.kakao_btn a:hover::after {width:100%; opacity:1; transition:all 0.5s ease;}

.map_table .map_img {width:100%; /* border:1px solid #ddd; */ box-sizing:border-box; height:313px; margin-top:20px;}
.map_table .map_img img {max-width: 100%;}


/* 갤러리2(배너) */
.gallery_roll{position:relative;}
.gallery_roll:after{content:''; display:block; clear:both;}
.gallery_roll .roll{position:relative;}
.gallery_roll .roll .imgArea{background:#000;}
.gallery_roll .roll .imgArea img{width:100%; background-repeat:no-repeat; background-size:contain; background-position:center;}
.gallery_roll .roll .txtArea{position:absolute; left:0; bottom:0; width:100%; text-align:center; background:rgba(34,34,34,.6); padding:20px; box-sizing:border-box;}
.gallery_roll .roll .txtArea h4{font-weight:400; color:var(--white); line-height:150%; font-size:1.25rem;}
.gallery_roll .slick-arrow{border:0; padding:0; font-size:0; outline:none; cursor:pointer; width:30px; height:30px; transition:all .3s linear; position: absolute; z-index: 9999; width: 30px; height: 30px; opacity: 1; left: auto; right:auto; bottom: auto; top:50%; margin-top:-15px;}
.gallery_roll .slick-arrow:hover{opacity:0.5;}
.gallery_roll .slick-prev{background:url('/img/arrow_p_w.png') no-repeat center/100% auto; left:30px;}
.gallery_roll .slick-next{background:url('/img/arrow_n_w.png') no-repeat center/100% auto; right:30px;}

.gallery_nav{margin:30px -2px 0; width:calc(100% + 4px);}
.gallery_nav:after{content:''; display:block; clear:both;}
.gallery_nav .roll{margin:0 2px; cursor:pointer; background-color:#000; overflow: hidden;}
.gallery_nav .roll .txtArea{display: none;}
.gallery_nav .roll .imgArea{}
.gallery_nav .roll .imgArea img{width:100%; opacity:0.5;  background-repeat:no-repeat; background-size:cover; background-position:center;}
.gallery_nav .roll.slick-current .imgArea img{opacity:1;}


/* 제품소개(분류) */
.list_top {padding:20px 0; /*border-top:1px solid var(--border);*/ }
.list_top .basic_in {position:relative; display:flex; flex-wrap:wrap; align-items:center;}
.list_top .collection_list span {cursor:pointer; position:relative; display:block; width:125px; line-height:214.286%; letter-spacing: 0.14px; text-transform: uppercase; color:Var(--black); font-size:0.77rem; font-weight: 700; box-sizing:border-box;}
.list_top .collection_list span i {display:block; position:absolute; top:50%; right:0;  margin-top:-10px; }
.list_top .collection_list span i::before {content:'\e5cc';  font-style:normal; font-size:20px; font-weight:400; transform:rotate(90deg); transition:all 0.5s ease;}
.list_top .collection_list span.on i::before { transform:rotate(270deg); transition:all 0.5s ease;}
.list_top .collection_list .cate_select_list {width:257px;box-sizing:border-box; background:var(--white); box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.10); height:240px; position:absolute; top:35px; left:0; z-index:999; display:none;}
.list_top .collection_list .cate_select_list ul {height:100%; overflow-y:scroll; padding:20px; box-sizing:border-box;}
.list_top .collection_list .cate_select_list ul li {margin:0 0 4px;}
.list_top .collection_list .cate_select_list ul li:last-of-type {margin:0;}
.list_top .collection_list .cate_select_list ul li label {line-height: 214.286%; letter-spacing: 0.14px; text-transform: uppercase; font-size:0.77rem; color:rgba(1,1,1,0.5); display:flex; flex-wrap:wrap; align-items:center; }
.list_top .collection_list .cate_select_list ul li label.checked {font-weight: 700; color:var(--black);}
.list_top .collection_list .cate_select_list ul li label input[type="checkbox"] {margin-right:8px; position:relative; top:-1px;}

  .cate_select_scroll::-webkit-scrollbar {
    width: 4px;
  }
  .cate_select_scroll::-webkit-scrollbar-thumb {
    background-color: var(--black);
  }
  .cate_select_scroll::-webkit-scrollbar-track {
    background-color:rgba(1,1,1,0.2);
  }


.list_top a.reset_btn {width:84px; height:35px; border:1px solid #ddd; box-sizing:border-box; line-height:33px; font-size:0.77rem; color:var(--black); letter-spacing: 0.14px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;  text-transform: uppercase; transition:all 0.4s ease; margin-left:56px;}
.list_top a.reset_btn span::before {content:'\f053'; font-size:20px; color:#1C1B1F; position:relative; top:5px; margin-right:2px;  transition:all 0.4s ease; }
.list_top a.reset_btn:hover {border:1px solid var(--black); background:var(--black); color:var(--white); transition:all 0.4s ease;}
.list_top a.reset_btn:hover span::before {color:var(--white); transition:all 0.4s ease;}
.list_top .result_text {position:absolute; top:50%; right:0; transform:translateY(-50%); font-size: 0.77rem; font-style: normal; font-weight: 400; line-height: 30px; letter-spacing: 0.14px; text-transform: uppercase; margin-left:20px;}
.list_top .result_text b {color:var(--black); font-weight:inherit;}


    
.list_top2 {padding:35px 0; border-top:1px solid var(--border);}
.list_top2 .basic_in {position:relative; display:flex; flex-wrap:wrap; align-items:center;}
.list_top2 .result_text {position:absolute; top:50%; right:0; transform:translateY(-50%); font-size: 0.77rem; font-style: normal; font-weight: 400; line-height: 30px; letter-spacing: 0.14px; text-transform: uppercase; margin-left:20px;}
.list_top2 .result_text b {color:var(--black); font-weight:inherit;}

/* 리스트 */
.pro_list{display:flex; flex-wrap:wrap;}
.pro_list dl {position:relative; margin-top:-1px; margin-left:-1px; border:1px solid #ddd; width:25%; box-sizing:border-box;}
.pro_list dl .nw_txt {position:absolute; top:6%; left:8%; z-index:50; font-family:var(--eng); color:#555; font-size:0.722rem; font-weight:bold;}
.pro_list dl dt {overflow:hidden; position:relative;}
.pro_list dl dt .one {position:relative; z-index:1;}
.pro_list dl dt .two {position:absolute; top:0; left:0; background:var(--white); opacity:0; visibility:hidden; z-index:10; transition:all 0.3s ease; width:100%; height:100%;}
.pro_list dl dt img {width:100%; background-repeat:no-repeat; background-position:Center; background-size:contain; transition:all 0.5s ease;}
.pro_list dl dd {padding:38px 50px; box-sizing:Border-box;}
.pro_list dl dd p {color:var(--black);letter-spacing: 0.14px; text-transform: uppercase; font-size:0.777rem; line-height:214%;}
.pro_list dl dd h4 {font-size:1.11rem; font-weight: 600; line-height: 115%; /* 23px */ text-transform: uppercase; color:var(--black);height: 33px;}
/* .pro_list dl:hover img {opacity:0.8; transform:scale(1.07); transition:all 0.5s ease;} */
.pro_list dl:hover .two {opacity:1; visibility:visible; transition:all 0.3s ease;}


.bbs_con {width:100%; border-collapse:separate; border-spacing:0; border-top:1px solid var(--black); text-align:center;}
.bbs_con th {font-size:1rem; letter-spacing:-0.54px; line-height:166%; font-weight:700; color:var(--black); box-sizing:border-box; padding:20px 10px; border-bottom:1px solid var(--border);}
.bbs_con td {font-size:1rem; letter-spacing:-0.54px; line-height:177%; font-weight:400; color:var(--basic); box-sizing:border-box; padding:20px 10px; border-bottom:1px solid var(--border);}
.bbs_con td.left {text-align:left; padding:20px 20px;}
.bbs_con td.attatched {font-size:0}
.bbs_con td.attatched a:before {font-family:var(--icon); content:'\f17f'; font-size:20px; color:var(--black); display:block;}
.bbs_con tr.point td{background:var(--grayBg);}
.bbs_con td img{display:inline-block; vertical-align:middle; margin:0 3px 2px 3px;}
.bbs_con .notice {display:flex; justify-content: center; align-items: center;}
.bbs_con .notice span{color:var(--black);}
.bbs_con .mo_line{display:none;}

.view_file{margin:30px 0; box-sizing:border-box; background:var(--grayBg); display:flex;}	
.view_file .btit{width:150px; padding:18px 0 17px 25px; font-size:0.889rem; font-weight:700; letter-spacing:-0.48px; line-height: 175%; color:var(--black); box-sizing:border-box; position: relative; display:flex}	
.view_file .btit:before {font-weight:300; font-family:var(--icon); display:block; content:'\e2bc'; font-size:20px; color:var(--black);}
.view_file .bstxt{width:calc(100% - 150px); padding:18px 20px 17px; font-size:0.889rem; letter-spacing:-0.48px; line-height: 175%; box-sizing:border-box;}	
.view_file .bstxt a{display:inline-block; font-size:0.889rem; letter-spacing:-0.48px; line-height:175%; color:var(--basic); }
.view_file .bstxt a:last-child{margin: 0;}
.view_file .bstxt .file{display:none;}	


.news_list { display:flex; flex-wrap:wrap;}
.news_list dl {width:calc(50% - 15px); border:1px solid #ddd; margin-right:30px; margin-top:30px; box-sizing:border-box; position:relative; }
.news_list dl:nth-of-type(2n) {margin-right:0;}
.news_list dl:nth-of-type(-n+2) {margin-top:0;}
.news_list dl input {width:20px; height:20px; position:absolute; top:10px; left:10px; z-index:10;}
.news_list dl dt {overflow:hidden; line-height:1; position:relative; }
.news_list dl dt .one {position:relative;}
.news_list dl dt .two {position:absolute; top:0; left:0; opacity:0; visibility:hidden; transition:all 0.3s ease; width:100%; height:100%;}
.news_list dl dt img {width:100%; background-repeat:no-repeat; background-position:center; background-size:cover; transition:all 0.5s ease;}
.news_list dl dd {padding:40px; box-sizing:border-box;}
.news_list dl dd ul {display:flex; flex-wrap:wrap; }
.news_list dl dd ul li {color:var(--black);line-height:214.286%; letter-spacing: 0.14px; text-transform: uppercase; font-size:0.77rem;}
.news_list dl dd ul li:last-of-type {color:rgba(1,1,1,0.5); margin-left:20px;}
.news_list dl dd h4 {color:var(--black);font-size: 1.11rem; font-style: normal; font-weight: 700; line-height:160%; letter-spacing: -0.8px;}
/* .news_list dl:hover dt img {opacity:0.8; transform:scale(1.07); transition:all 0.5s ease;} */
.news_list dl:hover dt .two {opacity:1; visibility:visible; transition:all 0.3s ease;}

/* 뷰 */
/* 화살표 */
.slick-arrow {border:0; padding:0; font-size:0; outline:none; cursor:pointer; width:38px; height:38px; transition:all .4s ease; position: absolute; z-index: 90; border:1px solid var(--border); border-radius:100%; transition:all 0.4s ease; top:50%; z-index:99; margin-top:-19px;}
.slick-arrow:hover {border:1px solid rgba(1,1,1,0.5); transition:all 0.4s ease;}
.slick-prev {left:10%; background:#fff url('../image/icons/prevArrow.svg') no-repeat center;}
.slick-next {right:10%; background:#fff url('../image/icons/nextArrow.svg') no-repeat center;}
/* 화살표 */

.pro_view {position:relative; padding:80px 0 0;}
.pro_view .slick-dots {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:999;}
.pro_view .slick-dots li {width:8px; height:8px !important; border-radius:100%; margin-right:12px; opacity:0.15; overflow:hidden; cursor:pointer;}
.pro_view .slick-dots li.slick-active {opacity:1;}
.pro_view .slick-dots li:last-of-type {margin-right:0;}
.pro_view .slick-dots li button {font-size:0; border:0; display:block; width:100%; height:100%; background:#010101; padding:0; margin:0;}
.pro_view .pro_img {width:100%; min-height:655px; display:flex; flex-wrap:Wrap; align-content:center; border-bottom:1px solid #ddd;}
.pro_view .pro_img .slick-track, .pro_view .pro_img .slick-list {height:100%; min-height:655px;}
.pro_view .pro_img ul.slick-slider {width:100%; height:100%; min-height:655px;}
.pro_view .pro_img ul li {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:100%;}
.pro_view .pro_img ul li img {display:block; margin:0 auto; max-width:100%;}

.pro_view .pro_txt .prdnum {margin:80px 0 10px;  text-align:center; }
.pro_view .pro_txt .prdname {margin:0 0 30px; text-align:center; color:var(--black); font-weight: 700; line-height: 120%; font-size:1.66rem; text-transform: uppercase;}

.pro_view .pro_txt .prd_info_list {display:flex; flex-wrap:wrap; justify-content:center;}
.pro_view .pro_txt .prd_info_list dl {width:calc((100% - 60px) / 3); margin-right:30px; border:1px solid #ddd; display:flex; flex-wrap:wrap; align-items:center;  box-sizing:border-box; padding:20px;}
.pro_view .pro_txt .prd_info_list dl:last-of-type {margin-right:0;}
.pro_view .pro_txt .prd_info_list dl dt {width:140px; letter-spacing: 0.14px; text-transform: uppercase; font-weight: 600; line-height: 115%; color:rgba(1,1,1,0.5); font-size:0.77rem;}
.pro_view .pro_txt .prd_info_list dl dd {width:calc(100% - 140px); padding-left:35px; box-sizing:border-box;}

.pro_content{padding:50px 0 0;}
.pro_content img{max-width:100%; height: auto !important; display:block !important; margin:0 auto !important;}

.listBtn {display:block; width:175px; height:50px; border:1px solid var(--black);  letter-spacing: 0.15px; text-transform: uppercase; font-size:15px; color:var(--black); text-align:center; line-height:48px; margin:60px auto 0; position:relative; z-index:10; transition:all 0.4s ease; background:var(--white); cursor:pointer;}
.listBtn::after {content:''; width:0; height:100%; background:Var(--black); position:absolute; top:0; left:0; z-index:-1; opacity:0; transition:all 0.4s ease;}
.listBtn:hover {color:var(--white); transition:all 0.4s ease;}
.listBtn:hover::after {width:100%; opacity:1; transition:all 0.4s ease;}

/* 검색바 */
.bbs_search {text-align:center; padding:30px 0 0; font-size:0; }
.bbs_search dl{display:flex; max-width:395px; width:100%; margin:0 auto;}
.bbs_search dt {width: 100px;}
.bbs_search dt select{width:100%; height:45px !important; font-size:0.77rem; color:var(--basic); border:1px solid var(--border); padding:0 14px; font-family:inherit; height:45px !important; box-sizing:border-box; -webkit-appearance: none; -webkit-border-radius: 0; background: url("../image/icons/cat_arrow_bk.svg") no-repeat right 12px center/8px auto; outline:none; cursor:pointer;}
.bbs_search dd{width:calc(100% - 100px); position:relative; display:flex;}
.bbs_search dd .search_input {font-size:0.77rem; color: var(--basic); border: 1px solid var(--border); background-color: var(--white); padding:0 15px; font-family:inherit; height:45px; line-height:53px; box-sizing:border-box; width:calc(100% - 45px); box-sizing:Border-box; border-left:0; border-right:0; -webkit-appearance: none; -webkit-border-radius: 0;}
.bbs_search dd .bbs_s_b{padding:0; border:0; background:var(--black); outline:none; cursor:pointer; width:45px; height:45px; display:flex; align-items:center; justify-content: center; width: 45px; transition:all .3s linear;}
.bbs_search dd .bbs_s_b:hover{background:#000;}
.bbs_search dd .bbs_s_b span{font-size:20px; color:var(--white); font-weight:400;}


.bbs_search.two{padding: 30px 0;}
.bbs_search.two dl{max-width:600px;}
.bbs_search.two dt {width: 245px; display: flex;}
.bbs_search.two dt select{width: 50%; border-left:0;}
.bbs_search.two dt select:first-child{border-left:1px solid var(--border);}



/* 이용약관, 개인정보취급방침 */
.policy_cont{position:relative; overflow:hidden; font-size:0.88rem;}
.policy_cont br{display:block;}
.policy_cont strong{font-weight:500; color:var(--black);}
.policy_cont .cont_title{font-size:1.412rem; color:var(--black); padding-bottom:18px; letter-spacing:-0.02em; font-weight:500;}
.policy_cont p.cont_tit {display:block; font-size:1.2em !important; padding-bottom:10px; font-weight:500; color:var(--black) !important; letter-spacing:-0.02em;}
.policy_cont .cont_txt {padding:0px 0px 35px 0;}
.policy_cont .cont_txt2 {padding-bottom:35px;}
.policy_cont .cont_box {padding:25px; background:var(--grayBg); margin:7px 0px 10px 0px; display:block;  letter-spacing:-0.02em; line-height:1.7;}

.privacy_list {width:91%; overflow:hidden; clear:both; *zoom:1; padding:4% 4% 3% 4%; border:1px solid var(--border); margin-bottom:30px;}
.privacy_list li {width:50%; float:left; padding-bottom:1%;}
.privacy_list li a {font-weight:500; color:var(--black);} 





/*******************************************************************************
    @media 1700px
*******************************************************************************/
@media all and (max-width:1700px){

    /* 뷰 */
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a {width:calc((100% - 10px) / 3); }
    
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a span {position:relative; top:2px;}
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a span::before {font-size:1.3vw;}
    
    
}
/*******************************************************************************
    @media 1600px
*******************************************************************************/
@media all and (max-width:1600px){
    
    .map_area {width:calc(100% - 600px);}
    .map_table {width:550px; margin-right:0}
    .map_area .wrap_map{height:553px !important;}

    /* 뷰 */
    .pro_view .pro_txt .prd_info_list dl {width:calc((100% - 30px) / 3); margin-right:15px;}
    .pro_view .pro_txt .prd_info_list dl dt {width:100px;}
    .pro_view .pro_txt .prd_info_list dl dd {width:calc(100% - 100px); padding-left:20px;}
    .pro_view .pro_txt .prd_info_list dl dd .link_btn a {width:calc((100% - 5px) / 2); }


}
/*******************************************************************************
    @media 1450px
*******************************************************************************/
@media all and (max-width:1450px){

    /* 회사소개 - 회사개요 */
    /* .company_cont .basic_in .textArea br {display:none;} */

    .map_area {width:calc(100% - 500px);}
    .map_table {width:450px; margin-right:0}
    .map_area .wrap_map{height:528px !important;}


}
/*******************************************************************************
    @media 1350px
*******************************************************************************/
@media all and (max-width:1350px){

    /*** 공통 css ***/
    .subTit br{display:none;}
    .subTxt br{display:none;}
    .stxt br{display:none;}
    .txt br{display:none;}

    /* 비주얼 lnb */
    .visual_lnb{}
    .visual_lnb dl{}
    .visual_lnb dl dd .dlst{right: 0; width: 100%;}

    /* 회사소개 - 회사개요 */
    .company_cont .basic_in .overview_cont{}
    .company_cont .basic_in .overview_cont .txtArea{padding: 0 0 0 60px; background-size:350px auto;}

    /* 회사소개 - 연혁 */
    .history_in > h4 {width:300px}

    /* 회사소개 - 오시는길 */
    /* .map_area {width:calc(100% - 500px);}
    .map_table {width:450px; margin-right:0} */
    .map_area .wrap_map{height:470px !important;}

    .news_list dl dd {padding:30px;}

    /* 뷰 */
    .pro_view .pro_txt .prd_info_list dl {align-content:center;}
    .pro_view .pro_txt .prd_info_list dl dt {width:100%; margin:0 0 20px;}
    .pro_view .pro_txt .prd_info_list dl dd {width:100%; padding-left:0;}
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a {height:50px; line-height:48px;}

}
/*******************************************************************************
    @media ~1280px
*******************************************************************************/
@media all and (max-width:1280px){

    /* 회사소개 - 회사개요 */
    .company_cont .basic_in .textArea .logo {width:100%; margin:0 0 30px;}
    .company_cont .basic_in .textArea .logo svg {width:200px; height:auto;}
    .company_cont .basic_in .textArea .cont {width:100%;}

    /* 회사소개 - 특허&디자인 */
    .certi_list dl{width:calc((100% - 90px)/4); margin-right:30px;}
    .certi_list dl:nth-child(5n){margin-right:30px;}
    .certi_list dl:nth-child(4n){margin-right:0;}
    .certi_list dl:nth-child(n+5) { margin-top:50px; }


    /* 회사소개 - 오시는길 */
    .map_area {width:calc(100% - 430px);}
    .map_table {width:400px;}

    /* 갤러리2(배너) */
    .gallery_roll{}
    .gallery_roll .roll .txtArea{padding:15px;}
    .gallery_roll .slick-arrow{width: 25px; height: 25px; margin-top:-12px;}
    .gallery_roll .slick-prev{left:20px;}
    .gallery_roll .slick-next{right:20px;}
    .gallery_nav{margin:20px -2px 0; width:calc(100% + 4px);}
    .gallery_nav .roll{margin:0 2px;}

}
/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){

    .compad_b {padding:0 0 100px; box-sizing:border-box;}

    #contents{}

    /* 타이틀 */
    #subtitle {padding:90px 5% 20px;}
    .highlights_sort {position:absolute; right:5%; top:70px;}

    /*** 공통 css ***/
    .subTit{font-size:2rem;}
    .subTxt{font-size:1.12rem;}
    .stxt{font-size:1rem;}

    /* 회사소개 - 회사개요 */
    .company_cont .basic_in .overview_cont{}
    .company_cont .basic_in .overview_cont .txtArea{padding: 0 0 0 40px; background-size:260px auto;}
    .company_cont .basic_in .overview_cont .txtArea .fs36{padding:0 0 15px;}
    .company_cont .basic_in .overview_cont .txtArea .fs18{padding:0 0 20px;}
    .company_cont .basic_in .overview_cont .txtArea .fs18.ceo{padding:20px 0 6px;}

    /* 회사소개 - 연혁 */
    .history_top{padding:120px 30px;}
    .history_top .fs18{padding:12px 0 0;}

    .history_wrap {padding-top:70px}
    .history_in > h4 {width:250px; font-size:1.7rem}
    .header.fixed + #sitemap + .mo_menu + #visual + #contents .history_in > h4  {top: 108px}
    .his_in {padding-left:50px; padding-bottom:30px}
    .his_txt {display:block}
    .his_txt > h4 {padding-right:0; font-size:1.3rem}
    .his_in h4 .dot {left:-70px}
    .his_in h4 .dot::before {width:30px}
    .his_txt li {gap:6px}
    .his_txt li::before {margin-top:12px}
    .history_in:not(:first-of-type) {padding-top:50px}
    .history_in:last-of-type .his_in:last-child {padding-bottom:70px}
    .line {left:229px}


    /* 회사소개 - 오시는길 */
    .map_area {width:100%;}
    .map_table {width:100%;}

    .map_area {margin:0 0 60px;}
    .map_table .map_info {width:100%; padding-right:0; box-sizing:Border-box; margin:0 0 50px;}
    .map_table .map_info dl dt {width:90px;}
    .map_table .map_info dl dd {width:calc(100% - 90px);}
    .map_table .map_img {width:100%; height:300px;}
    .loca_btn {margin:25px 0 0;}
    /* .kakao_btn {margin:25px 0 0;} */

    /* 리스트 */
    .pro_list dl dd {padding:25px 30px;}

    .bbs_con {}
    .bbs_con th {padding:15px 8px;}
    .bbs_con td {padding:12px 8px;}
    .bbs_con td.left {padding:12px 15px;}
    .bbs_con .mo_line .attatched {position:absolute; right:0; top: 50%; transform: translateY(-50%);}
    .bbs_con .mo_line .attatched a:before {font-family:var(--icon); content:'\f17f'; font-size:16px; color:var(--black); display:block;}

    .view_file{margin:25px 0;}	
	.view_file .btit{width:120px; padding:14px 0 14px 15px;}	
	.view_file .btit:before {font-weight:300; font-family:var(--icon); display:block; content:'\e2bc'; font-size:20px; color:var(--black);}
	.view_file .bstxt{width:calc(100% - 120px); padding:14px 0 14px 15px;}	

    
    .news_list dl {width:calc((100% - 15px) / 2); margin-right:15px; margin-top:15px;}
    .news_list dl dd {padding:20px;}



    /* 뷰 */

    .pro_view .slick-dots {bottom:26px;}
    .pro_view .slick-dots li {margin-right:8px;}
    .pro_view .pro_img {min-height:500px;}
    .pro_view .pro_img .slick-track, .pro_view .pro_img .slick-list {height:100%; min-height:500px;}
    .pro_view .pro_img ul.slick-slider {width:100%; height:100%; min-height:500px;}

    .pro_view .pro_txt .prd_info_list {}
    .pro_view .pro_txt .prd_info_list dl {align-content:center;}
    .pro_list dl .nw_txt { font-size:0.82rem;}
    .pro_view .pro_txt .prd_info_list dl dt {width:100%; margin:0 0 20px;}
    .pro_view .pro_txt .prd_info_list dl dt img {max-height:80px; max-width:100px;}
    .pro_view .pro_txt .prd_info_list dl dd {width:100%; padding-left:0; text-align:center;}
    .pro_view .pro_txt .prd_info_list dl dd h4 i {margin-left:5px;}

    .pro_view .pro_txt .prd_info_list dl dd .link_btn a {width:calc((100% - 5px) / 2);}
    .pro_view .pro_txt .prd_info_list dl dd .link_btn a.website span::before {font-size:1.6vw;}

    .pro_view .pro_txt .prd_info_list dl.designer dd .link_btn a {width:100%;}
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a {height:35px; line-height:33px;}
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a span::before {font-size:1.6vw;}



    /* 이용약관, 개인정보취급방침 */
    .policy_cont{}
    .policy_cont p.cont_tit {font-size:1.2em !important; padding-bottom:5px;}
    .policy_cont .cont_txt {padding:0px 0px 25px 0; }
    .policy_cont .cont_txt2 {padding-bottom:25px;}
    .policy_cont .cont_box {padding:18px 18px; }

    .privacy_list {margin-bottom:30px;}
    .privacy_list li {width:100%;  }

}
/*******************************************************************************
    @media ~768px
*******************************************************************************/
@media all and (max-width:768px){

    /* 회사소개 - 특허&디자인 */
    .certi_list dl{width:calc((100% - 60px)/3); margin-right:30px;}
    .certi_list dl:nth-child(4n){margin-right:30px;}
    .certi_list dl:nth-child(3n){margin-right:0;}
    .certi_list dl:nth-child(n+4) { margin-top:50px; }

    .pro_view .pro_img {min-height:auto;}
    .pro_view .pro_img .slick-track, .pro_view .pro_img .slick-list {height:100%; min-height:auto;}
    .pro_view .pro_img ul.slick-slider {width:100%; height:100%; min-height:auto;}
    .slick-arrow {width:30px; height:30px; background-size:6px !important;}
    .slick-prev {left:5%;}
    .slick-next {right:5%;}


    .pro_view .pro_txt .prd_info_list dl {width:100%; margin-bottom:15px;}
    .pro_view .pro_txt .prd_info_list dl:last-of-type {margin-bottom:0;}
    .pro_view .pro_txt .prd_info_list dl dt img {max-height:80px; max-width:80px;}
    .pro_view .pro_txt .prd_info_list dl.download dt img {max-height:50px; max-width:50px;}
    .pro_view .pro_txt .prd_info_list dl dd .link_btn a.website span::before {font-size:16px;}
    .pro_view .pro_txt .prd_info_list dl dd .down_btn a span::before {font-size:16px;}
    .pro_view .pro_txt .prd_info_list dl dd h4 {margin:3px 0 12px;}

    .pro_view .pro_txt .prdname {font-size:1.3rem; margin:50px 0 20px;}
    .pro_view .pro_txt .shortexp {font-size:1rem; text-align:center;}

}
/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){

    /* 서브탑 */
    .compad_b {padding:0 0 60px; box-sizing:border-box;}

    /* 타이틀 */
    .highlights_sort {position:absolute; right:5%; top:65px;}
    .highlights_sort span {font-size:12px; }
    .highlights_sort select {font-size:12px; width:90px; height:28px !important; background-size:8px;}

    #subtitle {padding:75px 5% 20px;}
    .lnb .lnb_in ul li {margin-right:20px;}
    .lnb .lnb_in ul li::after {right:-10px;}
    .lnb .lnb_in ul li a {font-size:1rem;}

    /*** 공통 css ***/
    .subTit{font-size:1.8rem; line-height: 130%; letter-spacing: -1pt;}
    .subTit strong{line-height: 130%; letter-spacing: -1pt;}

    /* 회사소개 - 회사개요 */
    .company_cont .basic_in .overview_cont{flex-wrap:wrap;}
    .company_cont .basic_in .overview_cont .imgArea{width:100%; text-align:center;}
    .company_cont .basic_in .overview_cont .imgArea img.pc{display:none;}
    .company_cont .basic_in .overview_cont .imgArea img.mobile{display:block;}
    .company_cont .basic_in .overview_cont .txtArea{width:100%; padding: 30px 0 0; background-size:200px auto;}
    .company_cont .basic_in .overview_cont .txtArea .fs36{padding:0 0 12px;}
    .company_cont .basic_in .overview_cont .txtArea .fs18{padding:0 0 15px;}
    .company_cont .basic_in .overview_cont .txtArea .fs18.ceo{padding:15px 0 4px;}

    /* 회사소개 - 연혁 */
    .history_top{padding:70px 30px;}
    .history_top .fs18{padding:8px 0 0;}

    .history_wrap {padding-left:50px; padding-top:40px}
    .history_in {display:block}
    .history_wrap svg {width:32px; left:17px}
    .history_in > h4 {width:auto; position:static; margin-bottom:20px}
    .history_in > h4 span.eng {font-size: 20px}
    .his_in {padding-left:0; padding-bottom:20px}
    .his_in h4 .dot {left:-34px}
    .his_in h4 .dot::before {width:16px}
    .line {left:15px}
    .his_txt li::before {margin-top:10px}
    .history_in:not(:first-of-type) {padding-top:30px}
    .history_in:last-of-type .his_in:last-child {padding-bottom:40px}

    /* 회사소개 - 오시는길 */
    .map_area {margin:0 0 40px;}
    .map_area .wrap_map{height:370px !important;}
    .map_table .map_info {width:100%; padding-right:0; box-sizing:Border-box; margin:0 0 35px;}
    .map_table .map_info .subject {margin:0 0 16px;}
    .map_table .map_info dl {margin:0 0 5px;}
    .map_table .map_info dl dt {width:90px;}
    .map_table .map_info dl dd {width:calc(100% - 90px);}
    .map_table .map_info dl dd span {top:3px;}
    .map_table .map_img {width:100%; height:270px;}
    .loca_btn {margin:20px 0 0;}

    /* 갤러리2(배너) */
    .gallery_roll{}
    .gallery_roll .roll .txtArea{padding:10px;}
    .gallery_roll .slick-prev{left:10px;}
    .gallery_roll .slick-next{right:10px;}
    .gallery_nav{margin:10px -2px 0; width:calc(100% + 4px);}
    .gallery_nav .roll{margin:0 2px;}


    .list_top {padding:10px 0;}
    .list_top .collection_list span {width:90px;}
    .list_top a.reset_btn {width:65px; height:30px; line-height:28px; margin-left:10px;}
    .list_top a.reset_btn span::before {font-size:16px;}
    .list_top .result_text {font-size:1rem;}
    .list_top .basic_in {position:relative; }
    .list_top .collection_list {position:static;}
    .list_top .collection_list .cate_select_list {left:0; width:100%;}

    /* 리스트 */
    .pro_list dl {width:50%;}
    .pro_list dl dd {padding:15px;}
    .pro_list dl dd p {margin:0 0 3px;}

    .bbs_con {}
    .bbs_con th {display: none;}
    .bbs_con td {padding:0;}
    .bbs_con td.left {padding:10px;}
    .bbs_con .pc_line{display:none;}
    .bbs_con .mo_line{display:block; position: relative;}
    .bbs_con .mo_line .m_notice{display:block; width:50px; height:25px; line-height:25px; text-align:center; color:var(--white); font-size:11px; font-weight:700; background:var(--main); margin: 0 0 4px;}
    .bbs_con .mo_line .subject,
    .bbs_con .mo_line .subject a{display:inline-block; font-size:14px; letter-spacing:-0.35pt; line-height:150%; color:var(--black); font-weight:500;}
    .bbs_con .mo_line .writer{display:flex; margin: 4px 0 0;}
    .bbs_con .mo_line .writer li{padding:0 20px 0 0; position:relative; font-size:13px; line-height: 120%; letter-spacing:0; color:#999;}
    .bbs_con .mo_line .writer li:last-child{padding:0;}
    .bbs_con .mo_line .writer li:after{content:''; display:block; width:1px; height:8px; background:var(--border); position:absolute; right:10px; top:50%; margin-top:-4px;}
    .bbs_con .mo_line .writer li:last-child:after{display: none;}
    .bbs_con .mo_line .attatched {position:absolute; right:0; top: 50%; transform: translateY(-50%);}
    .bbs_con .mo_line .attatched a:before { font-size:14px;}
    .bbs_con .recom{font-size:1rem; line-height: 20px; font-weight: 500; color:var(--black); font-family:var(--eng); position: absolute; right: 0; top:0;}
    .bbs_con .recom span{color:#ff0000; font-weight: 700; font-size:16px; display: inline-block; vertical-align: middle; margin: -2px 5px 0 0;}

    .view_file{margin:20px 0;}	
	.view_file .btit{width:100px; padding:12px;}	
	.view_file .bstxt{width:calc(100% - 100px); padding:12px;}	

    /* 뷰 */
    .pro_view .slick-dots {bottom:15px;}
    .pro_view .slick-dots li {margin-right:8px; width:6px; height:6px !important;}


    /* 검색바 */
    .bbs_search {padding:20px 0 0;}
    .bbs_search dt {width: 100px;}
    .bbs_search dt select{height:40px !important; font-size:1rem;}
    .bbs_search dd{width:calc(100% - 100px);}
    .bbs_search dd .search_input {padding:0 10px; height:40px; line-height:43px; width:calc(100% - 40px); font-size:1rem;}
    .bbs_search dd .bbs_s_b{width:40px; height:40px; }
    .bbs_search dd .bbs_s_b span {font-size:16px;}

    .bbs_search.two{padding: 20px 0;}
    .bbs_search.two dl{flex-wrap:wrap;}
    .bbs_search.two dt {width: 100%;}
    .bbs_search.two dd{width: 100%;}
    .bbs_search.two dd .search_input{border:1px solid var(--border); border-top:0;}


    /* 이용약관, 개인정보취급방침 */
    .policy_cont{position:relative; overflow:hidden; font-size:1rem;}



}
/*******************************************************************************
    @media ~480px               
*******************************************************************************/
@media all and (max-width:480px){

    /* 회사소개 - 특허&디자인 */
    .certi_list dl{width:calc((100% - 30px)/2); margin-right:30px;}
    .certi_list dl:nth-child(3n){margin-right:30px;}
    .certi_list dl:nth-child(2n){margin-right:0;}
    .certi_list dl:nth-child(n+3) { margin-top:50px; }

    .news_list dl {width:100%; margin-right:0; }
    .news_list dl:nth-of-type(2) {margin-top:15px;}
    .news_list dl dd {padding:15px;}
    .news_list dl dd ul li:last-of-type {margin-left:10px;}

}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:360px){




}
