@charset "utf-8";

/* 감춰질것들 */
.pc, #pc_gnb, .controller_wrap, .snb {display:none}

/* 보여질것들 */
.m {display: block}

html, body {min-width:320px; max-width:100%}
/* 모바일 헤더 */
header {background: #d0181a; height:50px; position: relative;}
header:after {content:''; display:block; clear:both;}
.logo {padding-top:3px;}
.logo a {margin:0 auto; width:100px; height:44px; background: url(/skin/images/common/mlogo.png) center top no-repeat; display: block ; background-size: contain; text-indent: -9999% }
.toggle{position:relative; }
.toggle button{background:url(/skin/images/main/toggle_menu.png) center center no-repeat; background-size:contain; position: absolute; left:15px; top:-35px;width:25px; height:25px; z-index:1000 ; }
#m_gnb {overflow-y:auto; background:rgba(0,0,0,0.50); width:100%; height: 100%; top:0; left:-640px; position: fixed; z-index: 1000; }
.gnb_wrap {background: #fff; width:70%; height:100%; position: relative; }
.gnb_h1_wrap {padding:8px 0; border-bottom: 1px solid #d2d2d2; position: relative;}
.gnb_h1_wrap h1 {background:url(/skin/images/common/gnb_mlogo.png) center center no-repeat;  background-size:contain;  display: block; width:100%; height:50px; text-indent: -9999%   }
#mobile_close img {position: absolute; right:-38px; top:14px; z-index: 100; width: 25px}

/* 모바일 gnb */
.gnb {background: #fff; font-size:1.1em;}
.depth1 > li { background: #fff; color: #555555; }
.depth1 > li > a {padding:12px 0 12px 25px; display: block; /* font-weight: 700; */  border-bottom: 1px solid #d2d2d2; background: url(../images/common/ico_arrow01.png) 95% center no-repeat; background-size: 16px;  }
.depth1 > li.on > a { background: #d0181a url(../images/common/ico_arrow02.png) 95% center no-repeat; background-size: 16px;   color:#fff; }

/* .depth1 > li .depth2 { display: none; -webkit-transition: display .5s ease-in-out; -moz-transition: display .5s ease-in-out; -o-transition: display .5s ease-in-out; transition: display .5s ease-in-out; } */
.depth1 > li .depth2 li { background: #efeeee url(../images/common/ico_dot01.png) 27px 20px no-repeat; background-size: 4px; border-bottom: 1px solid #d2d2d2 ; padding-left: 15px}
.depth1 > li .depth2 a { color: #555555; padding:12px 0 12px 25px; display: block; font-size: 100%; text-decoration: none; }
.depth1 > li.on .depth2 { display: block; }

/* 모바일 상단 언어 선택 셀렉 박스 */
.global { position: absolute; right:10px; top:9px; margin-bottom: 20px; z-index: 1; width:65px;}
.global a { text-transform: uppercase; background: #ba0f10; font-size: 10px; padding: 5px; display: block; /* font-weight: 700; */ color: #ffffff; text-decoration: none; font-family:arial, helvetica, clean, sans-serif; }
.global a:hover { color: #d0181a; background: #fff; }
.global > a { background: #ba0f10 url("../images/common/caret-write-off.png"); padding-left:10px;}
#pc_gnb .global a.cn {letter-spacing:.1em}
.global ul { position: absolute; left: 0; top: 30px; width: 100%; display: none; }
.global ul a { line-height: 1;  padding: 10px; }
.global.active > a { background: #ffffff url("../images/common/caret-write-on.png"); color: #d0181a; }
.global.active ul { display: block; }
.global:hover > a { background: #ffffff url("../images/common/caret-write-on.png"); color: #d0181a; }
.global > a, .global.active > a, .global:hover > a  {background-repeat:no-repeat; background-position:47px center; background-size:6px}
/* 모바일 main visual */
.main_visual {height:0; padding-bottom:58.2%; position: relative; text-align: center; width: 100%; }
.main_visual .txt {position: absolute;  top: 33%; z-index: 100;  color:#fff; width:100%; }
.main_visual .txt p:first-child {font-size:1.6em; line-height:1.2em}
.main_visual .txt p + p{font-size:0.9em; margin-top:0.7em;}
.visual_m01 {background: url(/skin/images/main/visual_mimg01.png) }
.visual_m02 {background: url(/skin/images/main/visual_mimg02.png) }
.visual_m03 {background: url(/skin/images/main/visual_mimg03.png) }
.visual_m04 {background: url(/skin/images/main/visual_mimg04.png) }
.visual_m05 {background: url(/skin/images/main/visual_mimg05.png) }
.visual_m06 {background: url(/skin/images/main/visual_mimg06.png) }
.visual_m01, .visual_m02, .visual_m03, .visual_m04, .visual_m05, .visual_m06 {position: absolute; top:0; left:0; width:100%; height:100%; background-repeat: no-repeat;  background-size: cover;}

/* 모바일 main_product */
.product_box {padding:6% 8% 5% 8%; overflow: hidden; }
.product_box  li {width:27.3333333333%; float: left; overflow: hidden; margin-right:9%; text-align: center; padding-bottom:.8em;}
.product_box  li:nth-child(3n+3) {margin-right:0;}
.product_box  li:nth-child(4),.product_box  li:nth-child(5), .product_box  li:nth-child(6){ padding-bottom:0;} 
.product_box  li a {margin-bottom:0.7em; display: block;}
.product_box  li a img {width:100%;}
.product_box  li i {overflow:hidden;display:block;position:absolute; visibility:hidden; width:1px; height:1px;font-size:1px;white-space:nowrap;}
.product_box  h2 a {display: block;  font-size: 1.15rem; color:#ce020b; /* font-weight: 600; */ letter-spacing: -0.1em}

/* footer */
footer {background:#848484; font-size:.8666666em; padding:15px; color:#fff; line-height: 1.8em;}
footer span {margin-right:3%; display:inline-block;/* border-right:solid 1px #eee; */ }

/* sub */
.container {margin:0 15px 15px 15px }
.content_wrap h2 {font-size:1.8em; text-align:center; margin:15px 0; font-weight:700}

/*브레드 크롬 */
.content_wrap .breadcrumb {padding:9px 0; overflow:hidden; border-bottom:1px solid #e7e7e7; width:120%; margin-left:-20px; padding-left:15px}
.content_wrap .breadcrumb span {display:block; float:left}
.content_wrap .breadcrumb span:nth-child(odd) {background:url(/skin/images/common/breadcrumb_bg.png)right 49.2% no-repeat; background-size:6px;  padding:0 12px 0 6px;}
.content_wrap .breadcrumb span:last-child {background:none; padding-right:0}
.content_wrap .breadcrumb .current {color:#e90118}
.content_wrap .breadcrumb .home {background:url(/skin/images/common/ico_home.png)0 3px no-repeat; width:15px; background-size:14px 12px; display:block}
/* snb */
.snb_m {background:#686868 url(/skin/images/common/ico_select_arrow.png) no-repeat 95% 50%; background-size:11px 7px; height:100%; padding:0 30px 0 10px; color:#fff; display:block; box-sizing:border-box; overflow: hidden; vertical-align:middle; width:100%; border:0; font-size:17px; height:43px; border-radius:0; -webkit-appearance: none;}
	
/* content_main */
.content_wrap .contents {margin-top:37px 0 15px 0; width:100% }
.content_wrap .contents h1 {background:url(/skin/images/common/ico_sub_mtitle.png)0 2px no-repeat; font-size:1.5em; font-weight:700; padding-left:27px; margin-top:23px; background-size:20px; color:#333;}
.content_wrap .contents > h1 span {font-weight:normal; font-size:.7em; letter-spacing:0; display:inline-block; line-height:1.5em;}
.content_wrap .contents .exp {padding:12px 0 12px 0; color:#666}

/* 오른쪽 따라다니는 제품*/
.products {width:100%; background:#f3f3f3; overflow:hidden; clear:both;}
.products ul { padding:15px 10px 15px 10px; width:94%; margin:0 auto; overflow:hidden;}
.products span{display:block; margin-top:7px;}
.products li a {padding:15px 0; display:block; float:left; width:33.333333333%; text-align:center}
.products li a img {margin:0 auto}
.products li:last-child a {background:none}
.products img {width:60%}

/* 사업분야 */
.pd_box {display:block; padding:0 0 15px 0; overflow:hidden;}
.pd_box li a {min-height:21em; position:relative; float:left; border-width:1px; border-style:solid; border-color:#ccc;  width:49.6%; height:auto; display:block; text-align:center; cursor:pointer;}
.pd_box li:nth-child(3) a, .pd_box li:nth-child(4) a,.pd_box li:nth-child(5) a {border-top:none;}
.pd_box li:nth-child(even) a {border-left:none}
.pd_box li a h2 {font-size:1.1em; padding:.2em .6em 0 .6em; font-weight:700}
.pd_box li a img {padding-top:30px; width:100%;}

/* 제품 상단 상세페이지 */
.pd_dtail_box {width:99.789473684%; display:block; border:1px solid #ccc;  margin:20px 0 30px 0; overflow:hidden; background:url(/skin/images/sub/pd_dtail_bg.gif)43.684210526% top repeat-y;}
.pd_dtail_box img {width:43.578947368%;/* width:414px */  padding :35px 0; float:left;}
.pd_dtail_box div.descrip {float:left; width:52.947368421%;/*width:533-30=503px*/  padding: 0 0 3.157894736% 3.157894736%;/*padding:30px*/margin-top:-1%; font-size:1em; }
.pd_dtail_box div.descrip p {padding-bottom:3.5%; color:#bd383a; font-size:1.1em;}
.pd_dtail_box div.descrip h1 {background:none; color:#000; padding:.3em 0 .4em 0; font-size:1.4em; line-height:1.2em; font-weight:700; }
.pd_dtail_box div.descrip li { margin-bottom:1.5%; line-height:1.5em; background:url(/skin/images/common/ico_line01.png)0 9px no-repeat; background-size:5px; padding:0 5px 0 12px; word-break:break-all;}
/* 제품 상단 상세페이지 - 상단이미지 없을때  */
.pd_dtail_box2 {width:99.789473684%;/* width:948px */ display:block; border:1px solid #ccc;  margin:20px 0 50px 0; overflow:hidden;}
.pd_dtail_box2 div.descrip2 { width:95%; padding:5% 0 5% 5%; font-size:1em;  }
.pd_dtail_box2 div.descrip2 p {padding-bottom:3.5%; color:#c6303f;}
.pd_dtail_box2 > div.descrip2 > h1 {background:none; color:#000; padding:0 0 1.5% 0; font-size:1.4em; line-height:1.2em; margin-top:5px }
.pd_dtail_box2 div.descrip2 li { margin-bottom:1.5%; line-height:1.5em; background:url(/skin/images/common/ico_line02.png)0 10px no-repeat; padding-left:12px}
/* 세부사항 */
.pd_dt_info {width:100%;}
.pd_dt_info .dt_tit {font-size:1.2em; border-bottom:1px solid #999; padding:0 0 7px 5px}
.pd_dt_info img {margin:0 auto; padding:20px 0 15px 0; width:100%}
.pd_dt_info dl {float:left; width:50%; overflow:hidden}
.pd_dt_info dt,.pd_dt_info dd {margin:0 auto; width:85%}
.pd_dt_info h3 {font-size:1.3em; margin-bottom:12px; color:#000}
.pd_dt_info dl li {background:url(/skin/images/common/ico_dot02.png) 0 8px no-repeat; background-size:2px; padding: 0 0 2px 10px } 
.pd_dt_info > .pd2 > P {color:#c6303f; padding:5% 0 0 1%; font-size:1.2em;}
.pd_dt_info > .pd2:after {border-bottom:1px solid #ccc; display:block; clear:both; content:""}
.pd_dt_info > .pd2:last-child:after {border:0}
.pd_dt_info > .pd2 > dl {margin-bottom:5%}
.btn_wrap {margin:12px 0 50px 0; clear:both; overflow:hidden; width:100.5%}
.btn_back {display:block; background:url(/skin/images/common/ico_mback.png)20px 47% no-repeat; background-size:27px; width:30px; padding:12px 18px 12px 55px; border:#e4e4e4 1px solid; float:right;}
/* 테이블 기본스타일 */
.tbl_basic {border-bottom:1px solid #9b9b9b;border-top:1px solid #9b9b9b;}
.tbl_basic th,.tbl_basic td { border-bottom:1px solid #e1e1e1; padding:10px}
.tbl_basic th{background:#f5f5f5; text-align:center; line-height:21px; font-weight:normal;}
.tbl_basic td{text-align:left; line-height:21px;}
/* 테이블 컬러-바탕 없음  회사연혁 테이블*/
.tbl_col {border-bottom:1px solid #9b9b9b;}
.tbl_col .frt {border-top:2px solid #e81126}
.tbl_col .frt2 {border-top:2px solid #7c7c7c}
.tbl_col th,.tbl_col td { border-bottom:1px solid #e1e1e1;}
.tbl_col th{text-align:center; padding:20px 0; line-height:1.55em; font-weight:normal; color:#d0181a; font-size:1.2em; vertical-align:top}
.tbl_col td{color:#333; padding:20px 0 20px .5em; text-align:left; line-height:1.5em;  }
.tbl_col i {font-weight:700; color:#d0181a; display:inline-block; padding-right:8px}
.tbl_col li {padding-bottom:5px} 
.tbl_col li:last-child {padding-bottom:0} 
.last{border-bottom:0 !important}
/* 테이블 컬러-바탕 있음 */
.tbl_col2 {border-bottom:1px solid #9b9b9b;;}
.tbl_col2 .frt {border-top:2px solid #e81126}
.tbl_col2 .frt2 {border-top:2px solid #646464}
.tbl_col2 th,.tbl_col2 td { border-bottom:1px solid #e1e1e1;}
.tbl_col2 th{background:#f5f5f5; text-align:center; padding:10px 0; line-height:21px; font-weight:normal; color:#777}
.tbl_col2 td{padding:10px 20px; text-align:left; line-height:21px;color:#000;  }
.last{border-bottom:0!important}
/* 커뮤니티,PR */
.board_ct {padding-bottom:50px; padding-top:10px;}
.bar {background:url(/skin/images/common/bar_01.gif)0 top no-repeat;}
/* 특허 */
.patent li { width:46.84%; text-align:center; float:left; padding:20px 6.31% 5% 0}
.patent li:nth-child(even) {padding-right:0;}
.patent li img {width:100%;border:1px solid #d6d6d6; box-shadow:2px 2px 4px rgba(0,0,0,.2)}
.patent li p {margin-top:12px}
.patent li i {display:block}
/* 게시판 하단 버튼 */
.btn_ct {text-align:center; margin-top:15px;}
.btn_ct a.red{display:inline-block; padding:10px 0; width:100px; margin:0 auto; text-align:center; background:#e81126; color:#fff; border-radius:2px}
.btn_ct a.red:hover {font-weight:700}
.btn_ct a.gray{display:inline-block; padding:10px 0; width:100px; margin:0 auto; text-align:center; background:#8a8a8a; color:#fff; border-radius:2px}
.btn_ct a.gray:hover {font-weight:700}
/* 커뮤니티, PR 검색*/
.board_sch {float:right; margin-top:-25px; padding-bottom:15px}
.bd_slct {width:57px; border:1px solid #dfe0e0; height:28px; float:left;}
input.bd_ipt {width:150px; border:1px solid #dfe0e0; height:28px; float:left; margin-left:5px}
.bd_btn {background:url(/skin/images/common/ico_srch.png)50% 50% no-repeat; background-size:16px; height:28px;  border:1px solid #dfe0e0; width:50px; float:left;margin-left:5px}
.bd_btn:hover {background:url(/skin/images/common/ico_srch2.png)50% 50% no-repeat; background-size:16px;  border-color:#e81126}
/* 커뮤니티, PR 게시판 테이블*/
.tbl_col3 {border-bottom:1px solid #bdbbb7; word-break:break-all;}
.tbl_col3 .frt {border-top:2px solid #e81126;}
.tbl_col3 .frt2 {border-top:2px solid #646464;}
.tbl_col3 th,.tbl_col3 td {border-bottom:1px solid #e1e1e1;}
.tbl_col3 th{background:#f5f5f5; text-align:center; padding:8px 5px; line-height:1.4em; font-weight:normal; color:#333; word-break: keep-all;}
.tbl_col3 td{text-align:center; line-height:1.4em;  padding:10px 5px; word-break:break-all;}
.tbl_col3 td a:hover {color:#000; text-decoration:underline}
.tbl_col3 .link_tit {padding:0 5px;}
.tbl_col3 .link_tit a {padding:7px 0; display:block }
.tbl_col3 .view {line-height:2em; width:100%; margin:15px auto 15px auto; text-align:left;}
.tbl_col3 .view img, .tbl_col3 .view embed, .tbl_col3 .view object, .tbl_col3 .view video {max-width:100%; display:block; padding:15px 0; margin:0 auto;}
.tbl_col3 input[type="text"] {width:70%;  box-sizing:border-box;}
.tbl_col3 textarea {width:98%; min-height:180px; margin:0;  box-sizing:border-box;}
.tbl_col3 input[type="file"] {width:100%; height:100%;}
.tbl_col3 .file{width:77px; height:31px; background:url('/skin/images/common/btn_file.gif') no-repeat 0 0; display:inline-block; overflow:hidden; vertical-align:middle; margin-left:2px}
.tbl_col3 td a.file_add{width:75px; height:29px; background:#f3f3f3; display:block; line-height:31px; text-align:center; border:1px solid #d9d9d9; color:#777; text-decoration:none; margin-top:5px}
.tip {margin-top:5px; font-size:.9em; display:block; line-height:1.3em; color:#777} 
/* 인풋사이즈 */
.tbl_col3 td .w10 {width:25%} 
.tbl_col3 td .w20 {width:42%}
.tbl_col3 td .w30 {width:60%}
.tbl_col3 td .w98 {width:98%}
.select {background:#fff; border:1px solid #cdcdcd; font-size:13px; color:#666; padding-left:0; box-sizing:border-box; padding:5px 0; height:31px; vertical-align:middle; margin-top:5px}
.lf {text-align:left !important}
.rgt {text-align:right !important}
.reple {padding:1px 9px 1px 10px; margin-right:6px; font-size:.9em; color:#fff; background:#b0b0b0; display:inline-block; letter-spacing:1px; line-height:20px; margin-top:5px}
.required {color:#e81126; display:inline-block; margin-left:4px;}
/* paging */
.paging{text-align:center; margin-top:15px;}
.paging .prev {margin-right:7px;background:url('/skin/images/common/btn_prev.gif') no-repeat 50% 50%; text-indent:-9999%}
.paging .next {margin-left:4px;background:url('/skin/images/common/btn_next.gif') no-repeat 50% 50%; text-indent:-9999%}
.paging .prev2{background:url('/skin/images/common/btn_prev2.gif') no-repeat 50% 50%; text-indent:-9999%}
.paging .next2{background:url('/skin/images/common/btn_next2.gif') no-repeat 50% 50%; text-indent:-9999%}
.paging a{display:inline-block; width:24px; height:25px; line-height:25px; font-size:13px; text-align:center; vertical-align:middle; border:1px solid #dddddd; margin-right:3px}
.paging .on{background:#e81126; color:#fff; font-weight:700; border-color:#e81126}
.paging .frt { margin-left:0;}
/* 인사말 */
.intrcn {padding:10px 0 15px 0;}
.intrcn img {width:100%}
.intrcn:after {clear:both; content:""; display:block}
.grt {width:100%;}
.grt_txt{font-size:1.1em; line-height:1.6em; margin-top:15px}
.spc span{padding : 0 20px 5px 0; display:inline-block}

/* 연혁 -인증서 */
.cri {background:#d6d6d6 url(/skin/images/sub/hist_bg.gif) 100% bottom no-repeat; padding:3.915789473%;  overflow:hidden; margin-top:15px }
.cri ul {margin:0 auto; width:100%; box-sizing:border-box;}
.cri li {float:left; padding-right:3.915789473%; width:22%}
.cri li:last-child {padding-right:0}
.cri li img {width:100%;}
img[src*="orgcht_m"]{padding-bottom:50px}

/* ci */
.ci_img span {width:47.368421052%; display:block; float:left; position:relative; text-align:center}
.ci_img span:last-child {margin-left:5.263157894%}
.ci_img img {margin-bottom:12px}
.ci_img i {display:block; position:absolute; right:10px; top:10px; font-weight:700; font-size:1em}
.dw {display:inline-block; background:url(/skin/images/common/icon_down.png)68% 47% no-repeat; background-size:16px; width:40px; padding:2% 15% 2% 4%; border:#eee 1px solid; margin:0 auto; text-align:right;}
.text_box h3{background:url(/skin/images/common/ico_line03.png)left top no-repeat; color:#333; padding:10px 0 5px 4px; font-weight:700 ; font-size:1.2em}
.text_box p {padding-left:5px; font-size:1.1em; line-height:1.8em}
.text_box .box {display:block; border:1px solid #eee; padding:30px; text-align:center}
.epai{color:#333; display:inline-block; border-right:1px solid #eee; margin-right:20px; padding-right:10px; width:70px}
.mission {background:url(/skin/images/sub/ci_m04.png)0 0 no-repeat; width:100%; background-size:contain; padding:55px 0 0 0; margin-top:80px; position:relative;}
.mission .dsgn {position:absolute; top:7.5em; right:0; font-size:.8em; color:#999; font-family:arial}
.mission span+span {display:block; font-size:1.2em; color:#d0181a; font-weight:700; font-family:arial; margin-top:20px}
.mission dl{clear:both; display:block; margin-top:10px ; overflow:hidden; max-width:1000px}
.mission dd {margin-top:3px;}

@media screen and (max-width: 600px){ 
	.pd_box li a {min-height:20.6em}

}	
	
@media screen and (max-width: 510px){  
	.content_wrap h2 {font-size:1.5em}
	.content_wrap .contents .exp {padding-bottom:0}
	.pd_box li a {border:0; border-bottom:1px solid #d9d9d9; width:99.4%;}
	.pd_box li:first-child a{border-left:0}
	.pd_box li:nth-child(3) a {border-top:0; border-left:0}
	.pd_box li:first-child a img{padding-top:20px} 
	.pd_box li a h2 {font-size:1.2em; padding-bottom:1.1em;}
	.products li a {padding:10px 0; float:left; width:50%; text-align:center}
	.products img {width:50%}
	.pd_dtail_box {width:100%; padding:25px 0; background:none;}
	.pd_dtail_box img {width:100%; padding:0;}
	.pd_dtail_box div.descrip{width:90%; padding:0 5% 0 5%}
	.pd_dt_info dl {width:100%}
	.pd_dt_info dt, .pd_dt_info dd {width:92%}
	.pd_dt_info dl li {background-position:0 8px}
	.cri {padding:3.915789473%;  overflow:hidden;}
	.cri ul {margin:0 auto; width:100%; box-sizing:border-box;}
	.cri li {float:left; padding:0 3.915789473% 3.915789473% 0; width:48%}
	.cri li:nth-child(2){padding-right:0;}
	.cri li:nth-child(3),.cri li:last-child{ padding-bottom:0}
	.ci_img span {width:100%}
	.ci_img i {font-size:1.2em; right:15px; top:15px; }
	.ci_img span:last-child {margin:30px 0 0 0;}
	.board_sch {display:block; margin-top:10px; float:left}
	.mission .dsgn {position:absolute; top:5.5em; }

}

@media screen and (max-width: 380px){  
	.main_visual .txt {top:28%}
	.epai {display:block; border-right:none}
	.patent li { width:99.789251844%; }
}