.col01 {color:#206ccb !important;}

/*sub*/
#sub .subtit .t01 {font-size:1.25em; font-weight:800; letter-spacing:-0.05em;}
#sub .subtit .t03 {color:#888;}
#sub .tabwrap {overflow-x:auto;}
#sub .tabwrap:before {content:'표를 좌우로 움직여 확인하세요.'; font-size:0.9em; color:#58626c; display:block; margin:0 0 10px;}
#sub .tab01 {width:100%; border-top:2px solid #404040; font-size:0.9em;}
#sub .tab01 tr {border-bottom:1px solid #e0e0e0;}
#sub .tab01 th,
#sub .tab01 td {padding:0.2em 0.4em; vertical-align:middle;}
#sub .tab01 th {background:#f7f7f7; font-weight:600; border-right:1px solid #e0e0e0;}
#sub .tab01 td {color:#666; border-right:1px solid #e0e0e0;}
#sub .tab01 th:last-child,
#sub .tab01 td:last-child {border-right:0;}
#sub .tab01 .star {color:#da0000; font-size:0.8em;}
#sub .tab01.type01 td:last-child {text-align:left;}
#sub .tab01.type02 img {width:100%; max-width:280px;}

@media all and (min-width:768px) {
  #sub .subtit .t01 {font-size:1.75em;}
  #sub .subtit .t02 {font-size:1.25em;}
  #sub .tabwrap:before {display:none;}
  #sub .tab01 {font-size:1em;}
}

@media all and (min-width:1200px) {
  #sub .subtit .t01 {font-size:2em;}
}


/*인사말*/
#sub .intro .img {margin:0 0 40px;}
#sub .intro .img img {width:100%;}
#sub .intro .txt .ceo {text-align:right;}

@media all and (min-width:768px) {
  #sub .intro .info01 {display:flex; justify-content:space-between; flex-direction:row-reverse;}
  #sub .intro .img {width:40%; margin:0;}
  #sub .intro .txt {width:55%;}
}


/*회사개요*/
#sub .about .about_wrap {background:#f4f5f6 url('../img/sub_about_bg.jpg') no-repeat center center / cover; padding:40px 0;}
#sub .about ul {display:flex; flex-wrap:wrap; margin:0 -1%;}
#sub .about li {width:98%; margin:10px 1%; background:#fff; padding:20px; -webkit-box-shadow:0 0 30px 0 rgba(0,0,0,0.1); -moz-box-shadow:0 0 30px 0 rgba(0,0,0,0.1); box-shadow:0 0 30px 0 rgba(0,0,0,0.1);}
#sub .about li:first-child {background:#206ccb; color:#fff;}
#sub .about .t01 {font-weight:700; margin:0 0 10px;}
#sub .about li:not(:first-child) .t01 {color:#206ccb;}

@media all and (min-width:768px) {
  #sub .about li {width:48%;}
}

@media all and (min-width:1200px) {
  #sub .about .about_wrap {padding:80px 0;}
  #sub .about li {width:23%;}
}


/*연혁*/
#sub .history .info01 {background:#f4f5f6 url('../img/sub_history_bg.jpg') no-repeat center center / cover; padding:40px 0;}
#sub .history dt {font-weight:700; font-size:1.1em; margin:0 0 5px;}
#sub .history dt:after {content:''; display:inline-block; width:0.4em; height:0.4em; border-radius:100%; background:#206ccb; margin:0 0 0 5px;}
#sub .history dd {margin:0 0 20px; line-height:1.8;}

@media all and (min-width:768px) {
  #sub .history dl {display:flex; flex-wrap:wrap;}
  #sub .history dt {width:100px; font-size:1.25em;}
  #sub .history dd {width:calc(100% - 100px);}
}

@media all and (min-width:1200px) {
  #sub .history .info01 {padding:80px 0;}
  #sub .history dt {width:150px; font-size:1.5em;}
  #sub .history dd {width:calc(50% - 150px); padding:0 40px 0 0; margin:0 0 60px;}
}


/*조직도*/
:root {--orgline:30px; --orglinecol:#e9ebed;}
#sub .org_wrap {position:relative;}
#sub .org_wrap:before {content:''; display:inline-block; width:1px; height:100%; background:var(--orglinecol); position:absolute; left:50%; top:0;}
#sub .org {text-align:center; font-weight:600;}
#sub .org ul {display:flex; align-items:flex-start; justify-content:center; position:relative;}
#sub .org li {width:30%; padding:10px; position:relative;}
#sub .org ul:not(.ceo) {margin-top:var(--orgline);}
#sub .org .t01 {font-size:1.1em; font-weight:700;}
#sub .org .t02 {font-size:0.9em;}
#sub .org .ceo li {background:#206ccb; color:#fff;}
#sub .org .dep01:before {content:''; display:inline-block; width:50%; height:1px; background:var(--orglinecol); position:absolute; left:50%; top:50%;}
#sub .org .dep01 li {margin-left:auto; background:#58626c; color:#fff;}
#sub .org .dep02 {justify-content:space-between;}
#sub .org .dep02:before {content:''; display:inline-block; width:70%; height:1px; background:var(--orglinecol); position:absolute; left:15%; top:0;}
#sub .org .dep02 li {background:#f4f5f6; color:#58626c; border:1px solid var(--orglinecol); margin-top:var(--orgline);}
#sub .org .dep02 li:not(:nth-child(2)):before {content:''; display:inline-block; width:1px; height:var(--orgline); background:var(--orglinecol); position:absolute; left:50%; bottom:100%;}

@media all and (min-width:768px) {
  :root {--orgline:40px;}
  #sub .org ul:not(.ceo) {margin-top:var(--orgline);}
  #sub .org li {padding:20px;}
  #sub .org .t01 {font-size:1.25em;}
}


/*경영이념*/
#sub .vision .info01 {text-align:center; background:#f4f5f6 url('../img/sub_vision_bg.jpg') no-repeat center center / cover; padding:40px 0;}
#sub .vision .info01 dd {padding:20px; margin:0 0 20px; background:#fff; -webkit-box-shadow:0 0 30px 0 rgba(0,0,0,0.1); -moz-box-shadow:0 0 30px 0 rgba(0,0,0,0.1); box-shadow:0 0 30px 0 rgba(0,0,0,0.1);}
#sub .vision .info01 img {max-width:60px;}
#sub .vision .info01 .t01 {font-size:1.25em; font-weight:800; margin:20px 0;}
#sub .vision .info01 ul li {display:inline-block; border:1px solid #e9ebed; padding:5px 10px; border-radius:5px; background:#f4f5f6; margin:5px; color:#58626c;}

@media all and (min-width:768px) {
  #sub .vision .info01 {padding:80px 0;}
  #sub .vision .info01 dl {display:flex; justify-content:space-between; align-items:stretch;}
  #sub .vision .info01 dd {width:calc(33% - 20px); margin:0; padding:40px 20px;}
  #sub .vision .info01 .t01 {font-size:1.5em;}
}


/*오시는 길*/
#sub .map .info01 li {border-bottom:1px solid #f0f0f0; padding:10px; display:flex; align-items:center;}
#sub .map .info01 li span {font-weight:700; margin:0 1em 0 0; color:#206ccb;}

@media all and (min-width:768px) {
  #sub .map .info01 ul {display:flex; flex-wrap:wrap; border-bottom:1px solid #f0f0f0;}
  #sub .map .info01 li {padding:20px; border:0;}
  #sub .map .info01 li:first-child {width:100%; border-bottom:1px solid #f0f0f0;}
  #sub .map .info01 li .t01 {font-size:1.25em; font-weight:700;}
}

@media all and (min-width:1200px) {
  #sub .map .info01 li .t01 {font-size:1.5em;}
}


/*제품소개*/
#sub .product .list_wrap .nav {display:flex; justify-content:space-between; gap:4px; margin:0 0 40px;}

#sub .product .tit {width:100%; position:relative; padding:0 0 30px; margin:0 0 30px;}
#sub .product .tit:before {content:''; display:inline-block; width:100%; height:10px; background:#f4f5f6; position:absolute; left:0; bottom:0;}
#sub .product .tit:after {content:''; display:inline-block; width:2em; height:10px; background:#206ccb; position:absolute; left:0; bottom:0;}
#sub .product .tit p {font-size:1.75em; font-weight:800;}
#sub .product .loc {display:flex; font-size:0.9em; color:#999; margin:0 0 20px;}
#sub .product .loc li:not(:last-child):after {content:'\e93f'; font-family:'xeicon'; margin:0 0.2em;}

#sub .product .list_wrap .cont .list {display:flex; flex-wrap:wrap; gap:2%;}
#sub .product .list_wrap .cont .list li {width:48%; border:1px solid #e9ebed; padding:10px; margin:0 0 20px; text-align:center; transition:0.2s;}
#sub .product .list_wrap .cont .list li:hover {-webkit-box-shadow:0 0 10px 0 rgba(0,0,0,0.1); -moz-box-shadow:0 0 10px 0 rgba(0,0,0,0.1); box-shadow:0 0 10px 0 rgba(0,0,0,0.1);}
#sub .product .list_wrap .cont .list li .txt {padding:20px 0 10px;}
#sub .product .list_wrap .cont .list li .txt .t01 {font-size:1.1em; font-weight:700; transition:0.3s;}
#sub .product .list_wrap .cont .list li:hover .txt .t01 {color:#206ccb;}
#sub .product .list_wrap .cont .list li .txt .t02 {font-size:0.9em; color:#999;}

#sub .product .detail_wrap {width:min(100%, 1200px); margin:0 auto;}
#sub .product .detail .lcont {margin:0 0 40px;}
#sub .product .detail .lcont img {width:100%;}
#sub .product .detail .lcont > img {border:1px solid #e9ebed;}
#sub .product .detail .tit {margin:0 0 20px;}
#sub .product .detail .tit .t01 {font-size:1.75em; font-weight:800; /*color:#206ccb;*/ line-height:1.25;}
#sub .product .detail .tit .t02 {font-size:1em; font-weight:600; color:#58626c;}
#sub .product .detail .info ul {display:flex; margin:0 0 30px; padding:0 0 30px; border-bottom:1px solid #dee1e4;}
#sub .product .detail .info dl,
#sub .product .detail .info dt {margin:0 0 5px;}
#sub .product .detail .info dl {display:flex; flex-wrap:wrap;}
#sub .product .detail .info dt {width:120px; font-weight:700;}
#sub .product .detail .info dd {width:calc(100% - 120px); display:flex;}
#sub .product .detail .info img {width:40px; border:1px solid #e9ebed; margin:0 5px 0 0;}
#sub .product .detail .btns {display:flex; gap:10px; text-align:center; font-weight:600;}
#sub .product .detail .btns a {flex:1; background:#6a7682; padding:15px 10px; display:flex; align-items:center; justify-content:center; color:#fff;}
#sub .product .detail .btns a:first-child {background:#404040;}
#sub .product .detail .btns a:after {content:'\eb7c'; font-family:'xeicon'; margin-left:0.2em;}

#sub .product .infobox {border-top :1px solid #e9ebed; padding:40px 0 0;}
#sub .product .infobox .t01 {font-weight:700; font-size:1.1em;}
#sub .product .infobox .img img {width:100%; border:1px solid #e9ebed;}

#sub .product .acc {margin:0 0 30px;}
#sub .product .acc .accbtn {cursor:pointer; padding:1em; font-weight:700; background:#404040/*#58626c*/; color:#fff; font-size:1.1em; display:flex; justify-content:space-between;}
#sub .product .acc .accbtn:after {content:'\e942'; font-family:'xeicon'; background:#fff; color:#58626c; display:flex; align-items:center; justify-content:center; width:1.4em; height:1.4em; border-radius:100%;}
#sub .product .acc .accbtn.on:after {content:'\e945';}
#sub .product .acc .panel {overflow:hidden; height:0;}
#sub .product .acc .accbtn.on ~ .panel {height:100%; padding:40px 0 0;}
#sub .product .acc .panel .img_li li {border:1px solid #e9ebed;}

#sub .product .golist {width:100%; text-align:center; display:flex; flex-wrap:wrap; justify-content:center; border-top:1px solid #e0e0e0; padding:40px 0 0;}
#sub .product .golist a {width:40%; max-width:180px; padding:1em; background:#206ccb; color:#fff;}

@media all and (max-width:767px) {/*mobile*/
  #sub .product .list_wrap .nav .dep01 {flex:1; background: #f4f5f6; padding:10px 5px;}
  #sub .product .list_wrap .nav .dep01.on {background:#206ccb; color:#fff;}
  #sub .product .list_wrap .nav .dep01 a {display:flex; align-items:center; justify-content:center; width:100%; height:100%; text-align:center; line-height:1.25;}
  #sub .product .list_wrap .nav .dep02 {display:none;}
}

@media all and (min-width:768px) {
  #sub .product .list_wrap {display:flex; justify-content:space-between; align-items:flex-start;}
  #sub .product .list_wrap .nav {display:block; width:240px; border-top:2px solid #444; margin:0 0 80px;}
  #sub .product .list_wrap .nav .dep01 {flex:1; border:0; width:100%; padding:15px 10px; cursor:pointer; display:flex; justify-content:space-between; border-bottom:1px solid #e0e0e0;}
  #sub .product .list_wrap .nav .dep01:after {font-family:'xeicon'; content:'\e942';}
  #sub .product .list_wrap .nav .dep01.on:after {content:'\e945';}
  #sub .product .list_wrap .nav .dep02 {display:none; padding:10px; border-bottom:1px solid #e0e0e0; font-size:0.9em; color:#666; background:#fafafb;}
  #sub .product .list_wrap .nav .dep01.on + .dep02 {display:block;}
  #sub .product .list_wrap .nav .dep02 a {display:flex; align-items:center;}
  #sub .product .list_wrap .nav .dep02 a.on {color:#206ccb;}
  #sub .product .list_wrap .nav .dep02 a:before {content:''; display:inline-block; width:0.4em; height:0.4em; border-radius:100%; background:#ccc; margin:0 0.5em 0 0;}
  #sub .product .list_wrap .nav .dep02 a.on:before {background:#206ccb;}
  #sub .product .list_wrap .cont {width:calc(100% - 320px);}

  #sub .product .tit {margin:0 0 60px;}
  #sub .product .tit p {font-size:2em;}

  #sub .product .acc {width:100%;}

  #sub .product .detail {display:flex; justify-content:space-between; flex-wrap:wrap;}
  #sub .product .detail .lcont {width:32%; margin:0;}
  #sub .product .detail .rcont {width:60%;}
  #sub .product .detail .tit {margin:0 0 40px;}
  #sub .product .detail .tit .t01 {font-size:2em;}

  #sub .product .infobox {display:flex; flex-wrap:wrap; gap:8%; padding:60px 0 0;}
  #sub .product .infobox > div:not(.acc) {width:46%;}
}

@media all and (min-width:960px) {
  #sub .product .list_wrap .cont .list li {width:32%;}
}

@media all and (min-width:1200px) {
  #sub .product .tit {display:flex; flex-direction:row-reverse; align-items:center; justify-content:space-between;}
  #sub .product .tit .loc {margin:0;}

  #sub .product .detail .lcont {width:42%;}
  #sub .product .detail .rcont {width:50%;}
  #sub .product .detail .tit {display:block;}
  #sub .product .detail .tit .t01 {font-size:2.5em;}
  #sub .product .detail .tit .t01:not(:first-child) {margin-left:1em;}
  #sub .product .detail .tit .t02 {font-size:1.1em;}
}

@media all and (min-width:1400px) {
  #sub .product .list_wrap .cont .list li {width:calc(94% / 4);}
}


/*기술정보*/
#sub .tech .tit01 {font-weight:800; font-size:1.25em; position:relative; padding:0 0 20px; border-bottom:5px solid #f4f5f6;}
#sub .tech .tit01:before {content:''; display:inline-block; width:2em; height:5px; background:#206ccb; position:absolute; left:0; bottom:-5px;}
#sub .tech .tit02 {font-size:1.1em; font-weight:700; color:#206ccb;}
#sub .tech .li01 {display:flex; flex-wrap:wrap;}
#sub .tech .li01 dd:not(:last-of-type):after {content:','; margin:0 0.2em 0 0;}
#sub .tech .tac .li01 {justify-content:center;}
#sub .tech .li02 {display:flex; flex-wrap:wrap;}
#sub .tech .li02 dd {padding:10px; background:#f4f5f6; color:#58626c; border:1px solid #e9ebed; display:flex; align-items:center; margin:0 10px 10px 0;}
#sub .tech .li02 dd .cir {background:#206ccb; color:#fff; display:flex; align-items:center; justify-content:center; width:1.4em; height:1.4em; border-radius:100%; margin:0 0 0 0.5em;}
#sub .tech .li02 dd .label {color:#58626c; font-weight:700; margin:0 0.5em 0 0;}
#sub .tech .wrap01 .lcont {margin:0 0 20px;}
#sub .tech .info01 .img {background:#f4f5f6; padding:20px; display:flex; align-items:center; justify-content:center; margin:0 0 20px; border:1px solid #e9ebed;}
#sub .tech .info01 .img img {width:100%; max-width:280px;}
#sub .tech .info01 .t01 {font-weight:600; color:#206ccb;}
#sub .tech .info01 .t02 {font-size:1.5em; font-weight:800; padding:0 0 20px; margin:0 0 20px; border-bottom:5px solid #f4f5f6; position:relative;}
#sub .tech .info01 .t02:before {content:''; display:inline-block; width:2em; height:5px; background:#206ccb; position:absolute; left:0; bottom:-5px;}
#sub .tech .info02 {background:#f4f5f6; border:1px solid #e9ebed; padding:20px; text-align:center;}
#sub .tech .info02 dl {display:flex; align-items:stretch; justify-content:center; margin:0 0 10px;}
#sub .tech .info02 dd {margin:0 2px; padding:5px 10px; border:3px solid #58626c; display:flex; align-items:center; justify-content:center;}
#sub .tech .info02 dd:not(.box) {font-weight:700; width:80px; background:#58626c; color:#fff;}
#sub .tech .info02 dd.box {background:#fff; color:#206ccb; font-weight:600;}
#sub .tech .info02 .t01 {color:#58626c; font-size:0.9em;}
#sub .tech .info03 {padding:20px; background:#f4f5f6; border:1px solid #e9ebed;}
#sub .tech .info03 .img img {width:100%; max-width:400px; margin:0 auto; display:block;}
#sub .tech .info03 dt {font-weight:700; display:flex; align-items:center; color:#206ccb;}
#sub .tech .info03 dt .num {display:flex; align-items:center; justify-content:center; width:1.4em; height:1.4em; color:#fff; background:#206ccb; border-radius:100%; margin-right:0.3em; font-size:0.9em;}
#sub .tech .info03 dt .eng {font-weight:500; color:#58626c; margin-left:0.3em; font-size:0.8em;}
#sub .tech .info03 dd {font-size:0.9em; margin-top:10px;}
#sub .tech .info03 dd:not(:last-of-type) {margin-bottom:20px;}
#sub .tech .info04 {display:flex; flex-wrap:wrap; margin:0 -1%;}
#sub .tech .info04 li {width:48%; margin:10px 1%; text-align:center; font-weight:600;}
#sub .tech .info04 li img {width:100%; -webkit-box-shadow:0 0 10px 0 rgba(0,0,0,0.1); -moz-box-shadow:0 0 10px 0 rgba(0,0,0,0.1); box-shadow:0 0 10px 0 rgba(0,0,0,0.1);}
#sub .tech .info04 li p {margin:10px 0 0;}

@media all and (min-width:768px) {
  #sub .tech .tit01 {font-size:1.5em;}
  #sub .tech .wrap01 {display:flex; justify-content:space-between; align-items:flex-start;}
  #sub .tech .wrap01 .lcont {width:18%; margin:0;}
  #sub .tech .wrap01 .rcont {width:78%;}
  #sub .tech .info01 {display:flex; justify-content:space-between; align-items:flex-start; flex-direction:row-reverse;}
  #sub .tech .info01 .img {width:20%; margin:0;}
  #sub .tech .info01 .txt {width:75%;}
  #sub .tech .info04 li {width:31.33%;}
}

@media all and (min-width:1200px) {
  #sub .tech .tit01 {font-size:1.75em;}
  #sub .tech .tit02 {font-size:1.25em;}
  #sub .tech .info01 .t02 {font-size:1.75em;}
  #sub .tech .info03 {display:flex; justify-content:space-between; align-items:center; padding:30px;}
  #sub .tech .info03 .img {width:40%;}
  #sub .tech .info03 .txt {width:55%;}
  #sub .tech .info04 li {width:23%;}
  #sub .tech .info04.item05 li {width:18%;}
}


/*개인정보처리방침*/
#sub .privacy h4 {font-size:1.25em; font-weight:600;}


/*이메일무단수집거부*/
#sub .noemail .box {border-top:2px solid #222; border-bottom:1px solid #e0e0e0; padding:20px;}
#sub .noemail .box h1 {font-size:1.5em;}

@media all and (min-width:768px) {
  #sub .noemail .box {padding:30px;}
}

@media all and (min-width:1200px) {
  #sub .noemail .box {padding:40px;}
}


/*사이트맵*/
#sub .sitemap ul {border-top:2px solid #222;}
#sub .sitemap li {display:flex; flex-wrap:wrap; width:100%; border-bottom:1px solid #e0e0e0;}
#sub .sitemap li h1 {width:100%; padding:10px; border-bottom:1px solid #e0e0e0; background:#fafafa; font-weight:600;}
#sub .sitemap li .sub {width:100%; padding:10px;}
#sub .sitemap li .sub dl {display:flex; flex-wrap:wrap; width:100%;}
#sub .sitemap li .sub dd {margin:0 1em 0 0; display:flex;}
#sub .sitemap li .sub dd:before {content:'·'; margin:0 0.2em 0 0;}

@media all and (min-width:768px) {
  #sub .sitemap li h1 {width:20%; padding:20px; border-bottom:0; text-align:center;}
  #sub .sitemap li .sub {width:80%; padding:20px;}
}

@media all and (min-width:1200px) {
  #sub .sitemap ul {display:flex; border-top:0; gap:20px;}
  #sub .sitemap li {display:block; flex:1;}
  #sub .sitemap li h1 {background:#58626c; color:#fff; width:100%; font-size:1.1em;}
  #sub .sitemap li .sub dd {width:100%; margin:0;}
}
