@charset "utf-8";
/* =============== 서브 페이지 css =============== */
/* 서브 비주얼 */
.sub_visual {width: 100%; height: 540px; background-position: center; background-repeat: no-repeat; background-size: cover; position:relative;}
.sub_visual1 {background-image: url(../../img/sub_visual01.png);}
.sub_visual2 {background-image: url(../../img/sub_visual02.png);}
.sub_visual3 {background-image: url(../../img/sub_visual03.png);}
.sub_visual4 {background-image: url(../../img/sub_visual04.png);}
.sub_visual .inner {padding: 0 18.5%; position:absolute; bottom:38%;}
.sub_visual .tit {font-size: 56px; font-weight: 600; margin-bottom: 20px; color:#fff;}
.sub_visual .desc {font-size: 22px; color:#fff;}

/* 뎁스 메뉴 */
.depth_container {z-index:10; width: 100%; height: 60px; background-color: rgba(7,42,76,.8); position:relative; top:-60px;}
.depth_container::before {content:" "; z-index:11; display:block; background-color:#fff; width:18.5%; height:100%; position:absolute; border-bottom: 1px solid #dddddd;}
.depth_container .depth_wrap {z-index:12; padding: 0 18.5%; position:absolute; display:flex; height:100%;}

.depth_wrap .home_btn {width: 60px; height:100%; border: 1px solid #dddddd; border-top:none; background: #fff url(../../img/icon-home.png) no-repeat center;}
.depth_wrap .home_btn a {display:block; width: 100%; height: 100%;}

.depth_wrap .depth {position: relative; width: 260px; height:100%; line-height:60px; cursor:pointer; border-bottom: 1px solid #dddddd; border-right: 1px solid #dddddd; background: #fff url(../../img/icon-down-arrow.png) no-repeat center right 40px;}
.depth_wrap .depth .depth_name {position: absolute; left:40px; top:0;}
.depth ul {position: absolute; left:-1px; top:59px; height:auto; background-color: #fff; width:calc(100% + 2px); text-indent:40px; border: 1px solid #dddddd;}
.depth ul > li {height:50px; line-height:50px;}
.depth ul > li > a {display:block; font-size:15px;}

/* 페이지 공통 css */
.page_container {width: 100%;}
.page_wrap {padding: 2% 18.5%;}
.page_wrap .tit_wrap {border-bottom:1px solid #e1e1e1; display: flex; justify-content: space-between; align-items:center; height:90px; margin-bottom:80px;}
.page_wrap .tit_wrap .tit {font-size: 32px; position: relative; padding-left: 30px;}
.page_wrap .tit_wrap .tit::before {content:" "; display: block; width: 20px; height: 4px; background: #0054a6; position: absolute; left:0; bottom:0;}
.page_wrap .tit_wrap .page_navi {font-size: 15px; font-weight: 300;}
.page_wrap .tit_wrap .page_navi .right_arrow {display: inline-block; width: 12px; height: 12px; background: url(../../img/icon-right-arrow.png) no-repeat center; margin: 0 10px;}


/*=================== 회사소개 ===================*/
/*---------- CEO인사말 ----------*/
.greeting .con_container {width: 100%; display: flex; justify-content: space-between; margin-bottom:80px;}

.greeting .con_container .con_wrap {width:55%;}
.greeting .con_container .con_wrap .tit_box {margin-bottom: 80px;}
.greeting .con_container .con_wrap .tit_box span {font-size: 38px; font-weight: 200;}
.greeting .con_container .con_wrap .tit_box .tit {font-size: 58px; font-weight: 600; margin-top:10px;}
.greeting .con_container .con_wrap .txt_box {margin-bottom: 80px;}
.greeting .con_container .con_wrap .txt_box .txt {font-size: 17px; font-weight: 300; color:#646464; margin-bottom:40px; line-height: 1.8;}
.greeting .con_container .con_wrap .txt_box .txt:nth-of-type(4) {margin-bottom:80px;}
.greeting .con_container .con_wrap .txt_box .sign {font-size: 18px; font-weight: 500;}
.greeting .con_container .con_wrap .txt_box .sign .name {font-size: 43px; letter-spacing:10px; font-family: 'Nanum Pen Script', cursive; display:inline-block; margin-left:20px;}

.greeting .con_container .img_box {width: 421px; height: 579px; background: url(../../img/greeting-img01.png) no-repeat center / cover;}


/*---------- 회사개요 ----------*/
.overview .page_wrap {padding: 2% 0;}
.overview .con_container {padding: 0 18.5%;}
.overview .tit_wrap {padding: 0 18.5%; border-bottom:none; position: relative;}
.overview .tit_wrap::before {content:" "; display: block; width: 63%; height: 1px; background: #ddd; position: absolute; left:50%; bottom:0; transform: translateX(-50%);}

/* 회사개요: 회사개요 */
.overview .con_container1 {margin-bottom: 160px;}

/* 회사개요: 경영이념 */
.overview .con_container2 {}
.overview .con_container2 .con_wrap {width:100%; position:relative; padding-bottom: 15%;}
.overview .con_container2 .con_wrap .txt_box {width:50%;}
.overview .con_container2 .con_wrap .txt_box .tit_box {margin-bottom: 80px;}
.overview .con_container2 .con_wrap .txt_box .tit_box span {font-size: 38px; font-weight: 200;}
.overview .con_container2 .con_wrap .txt_box .tit_box .tit {font-size: 58px; font-weight: 600; margin-top:10px;}
.overview .con_container2 .con_wrap .txt_box .txt {color:#646464; font-size: 17px; font-weight: 300; line-height: 1.8; margin-top: 40px;}
.overview .con_container2 .con_wrap .img_box {width: 425px; height: 582px; background: url(../../img/overview-img01.png) no-repeat center / cover; position:absolute; right:80px; top:-150px;}

.overview .con_container2 .con_wrap .top {background:url(../../img/overview-img02.png) no-repeat center; width:100%; height:500px; position:relative; margin-bottom:40px;}
.overview .con_container2 .con_wrap .top .con {position:absolute; width:280px; text-align:right;}
.overview .con_container2 .con_wrap .top .con:nth-child(1) {top:80px; left:40px;}
.overview .con_container2 .con_wrap .top .con:nth-child(2) {width:220px; top:190px; right:0; text-align:left;}
.overview .con_container2 .con_wrap .top .con:nth-child(3) {bottom:50px; left:40px;}
.overview .con_container2 .con_wrap .top .con .tit_box {margin-bottom:10px; padding:15px 70px 15px 0; background:url(../../img/icon-overview01.png) no-repeat right center;}
.overview .con_container2 .con_wrap .top .con:nth-child(2) .tit_box {padding:15px 0 15px 70px; margin-left:-80px; background-image: url(../../img/icon-overview02.png); background-position: left 10px center;}
.overview .con_container2 .con_wrap .top .con:nth-child(3) .tit_box {background-image: url(../../img/icon-overview03.png);}
.overview .con_container2 .con_wrap .top .con .tit_box span {color:#1288d8; }
.overview .con_container2 .con_wrap .top .con .tit_box strong {display:block; margin-top:5px; font-weight: 600;}
.overview .con_container2 .con_wrap .top .con .txt {}

.overview .con_container2 .con_wrap .btm {width:100%; display:flex; justify-content:space-between;}
.overview .con_container2 .con_wrap .btm .con {width:calc((100% / 4) - 80px);}
.overview .con_container2 .con_wrap .btm .con .tit_box {width:220px; height:220px; line-height:220px; background:#4ca4e1; border-radius:50%; text-align:center; margin-bottom:70px; position:relative;}
.overview .con_container2 .con_wrap .btm .con:nth-child(even) .tit_box {background:#888;}
.overview .con_container2 .con_wrap .btm .con .tit_box::before {content:" "; display:block; width:1px; height:50px; background:#959595; position:absolute; left:50%; transform:translateX(-50%); bottom:-50px;}
.overview .con_container2 .con_wrap .btm .con .tit_box::after {content:" "; display:block; position:absolute; left:50%; transform:translateX(-50%); bottom:-10px; background:#4ca4e1; width:20px; height:20px; border:5px solid #fff; border-radius:50%;}
.overview .con_container2 .con_wrap .btm .con:nth-child(even) .tit_box::after {background:#888;}
.overview .con_container2 .con_wrap .btm .con .tit_box strong {color:#fff; font-size:28px; font-weight:600;}
.overview .con_container2 .con_wrap .btm .con .txt {text-align:center;}

/* 회사개요: 생산 설비 및 CAPA */
.overview .con_container3 > .tit {padding:80px 20% 0; color: #fff; font-size: 32px; position: relative;}
.overview .con_container3 > .tit::before {content:" "; display: block; width: 20px; height: 4px; background: #fff; position: absolute; left:18.5%; bottom:0;}

.overview .con_container3 {padding: 0; width:100%; background:url(../../../img/overview-img03.png) no-repeat left top / 100%; margin-bottom:250px;}
.overview .con_container3 .con_wrap {padding:60px 18.5% 0; height:350px; display: flex; justify-content: space-between;}
.overview .con_container3 .con_wrap .con {width: calc((100%/4) - 20px); background: #fff;}
.overview .con_container3 .con_wrap .con .tit {font-size:20px; padding:0 20px; height:100px; box-sizing:border-box; display:flex; flex-wrap:wrap; align-content:center; line-height:1.2;}
.overview .con_container3 .con_wrap .con .tit span {color:#126cab;}
.overview .con_container3 .con_wrap .con .txt_box {padding:0 20px; height:180px;}
.overview .con_container3 .con_wrap .con .txt_box li {margin:10px 0; position:relative; padding-left:16px; line-height:1.2;}
.overview .con_container3 .con_wrap .con .txt_box li::before {content:""; display:block; width:5px; height:5px; background:#126cab; border-radius:50%; position:absolute; left:0; top:8px;}
.overview .con_container3 .con_wrap .con .img_box {width: 100%; padding-bottom:55%; background-position: center; background-repeat: no-repeat; background-size: cover;}
.overview .con_container3 .con_wrap .con:nth-child(1) .img_box {background-image:url(../../img/overview-img04.png);}
.overview .con_container3 .con_wrap .con:nth-child(2) .img_box {background-image:url(../../img/overview-img05.png);}
.overview .con_container3 .con_wrap .con:nth-child(3) .img_box {background-image:url(../../img/overview-img06.png);}
.overview .con_container3 .con_wrap .con:nth-child(4) .img_box {background-image:url(../../img/overview-img07.png);}


/*---------- 조직도 ----------*/
.org .con_container {width:100%; margin-bottom:80px;}
.org .con_container img {display:block; margin:0 auto;}

.org .mobile {display: none;}

/*---------- history ----------*/
.history .con_container {width:100%; display: flex; justify-content: space-between; margin-bottom:60px;}
.history .con_container .con_wrap {position: relative; width: 45%;}
.history .con_container .con_wrap:last-child::before {content:" "; display: block; position: absolute; left:-59px; width:1px; height:100%; background-color: #ddd;}

.history .img_box {width: 100%; padding-bottom: 60%; background: url(../../img/history-img1.png) no-repeat center / cover;}

.history .con_box {width: 100%; margin-top:80px;}
.history .con_box:last-child {padding-bottom:30px;}
.history .con_box:first-child {margin-top:0;}
.history .con_box .year {font-size: 32px; font-weight: 800; margin-bottom: 20px; position: relative;}
.history .con_box .year::after {content:""; display: inline-block; width:20px; height:3px; background-color: #0054a6; margin-left:4px;}
.history .con_box .con {position: relative; margin-top:20px; font-size:17px;}
.history .con_box .con:first-child {margin-top:0;}
.history .con_box .con::before {content:" "; display: block; position: absolute; left:-65px; top:8px; width: 50px; height: 1px; background-color: #eaeaea;}
.history .con_box .con::after {content:" "; display: block; position: absolute; left:-65px; top:1px; width: 15px; height: 15px; background-color: #0054a6; border:4px solid #eaeaea; border-radius: 50%;}
.history .con_box .con .month {font-weight: bold; font-family: 'Red Hat Display', sans-serif; display:inline-block; width:40px;}
.history .con_box .con .month::after {content:".";}


/*---------- 오시는 길 ----------*/
.contact .table {margin:60px 0 80px;}
.contact .table th {font-weight: 500;}


/*=================== 제품소개 ===================*/
/*---------- 제품 목록 ----------*/
.prd_list {padding-bottom: 100px;}
.prd_list a {display:block; width:100%; height:100%;}

.prd_list .con_container {width:100%;}
.prd_list .con_container .tit {width:100%; font-size:20px; font-weight:500; position:relative; padding-left:32px; margin-bottom:40px;}
.prd_list .con_container .tit::before {content:" "; display:block; position:absolute; left:10px; top:6px; width:8px; height:8px; border-radius:50%; background:#126cab;}
.prd_list .con_container .con_wrap {width:100%; display:flex; flex-wrap: wrap;}
.prd_list .con_container .con_wrap:first-child {margin-bottom:50px;}
.prd_list .con_container .con_wrap .con {width:calc((100% / 5) - 20px); margin:0 10px 80px;}
.prd_list .con_container .con_wrap .con .img_box {width:100%; border:1px solid #eaeaea; background:#fff; margin-bottom:20px; overflow:hidden;}
.prd_list .con_container .con_wrap .con .img_box a {display: flex; justify-content: center; align-items: center;}
.prd_list .con_container .con_wrap .con .img_box img {transform:scale(1); transition:transform .3s;}
.prd_list .con_container .con_wrap .con:hover .img_box img {transform:scale(1.05);}
.prd_list .con_container .con_wrap .con .name_box {text-align:center; position:relative; background:#f8f8f8; padding:15px 0;}
.prd_list .con_container .con_wrap .con .name_box::after {content:" "; display:block; width:100%; transform:scaleX(0); height:2px; background:#126cab; position:absolute; bottom:0; transition:transform .3s;}
.prd_list .con_container .con_wrap .con:hover .name_box::after {transform:scaleX(1);}
.prd_list .con_container .con_wrap .con:hover .name_box a {color:#126cab;}
.prd_list .con_container .con_wrap .con .name_box br {display: none;}


/* 제품소개: 공통 */
.product .con_wrap {display:flex; justify-content:space-between; margin-bottom:60px;}

.product .con_wrap .img_box {position: relative; width:45%; height: auto; display:flex; justify-content:center; align-items:center; background:#fff; border:1px solid #ddd; box-shadow:2px 2px 5px rgba(0, 0, 0, 0.2);}
.product .con_wrap .img_box img {width: 100%; height: auto; transition: 1s;}

.product .con_wrap .con_box {width:45%;}

.product .con_wrap .con_box .name_box {border-bottom:1px solid #dddddd;}
.product .con_wrap .con_box .name_box .model {font-size:24px;}
.product .con_wrap .con_box .name_box .name {font-size:32px; margin-top:10px; padding-bottom:20px;}

.product .con_wrap .con_box .con {margin-top:60px;}
.product .con_wrap .con_box .con h6 {font-size:24px; margin-bottom:20px; color:#4d4d4d;}
.product .con_wrap .con_box .con .list li {padding-left:24px; position:relative; margin-top:4px; line-height:1.6; color:#4d4d4d;}
.product .con_wrap .con_box .con .list li::before {content:" "; display:block; position:absolute; left:5px; top:10px; width:6px; height:6px; border-radius:50%; background:#126cab;}

.product .con_wrap .table {margin-top:100px;}
.product .con_wrap .table caption {position:absolute; top:-60px; left:0; padding:10px 0 10px 40px; font-size:24px; color:#4d4d4d; background:url(../../img/icon-mark.png) no-repeat left center;}
.product .con_wrap .table th.second_th {width: 20%; background-color: #fff; border-right:1px solid #cccccc;}
/* .product .con_wrap .table td {width: 60%;} */

.product .con_wrap .table_img {width: 95%; height:auto; margin:0 auto;}

.product .btn_list {display: block; color: #fff; padding: 20px 0; margin:80px auto 40px; width:240px; text-align:center;}


/*=================== 고객센터 ===================*/
/*---------- 온라인 문의 ----------*/
.inquiry .page_wrap {padding: 2% 18.5% 6%;}

.inquiry .img_box {width: 100%; height: 250px; background: url(../../img/inquiry-img.png) no-repeat left center / cover; margin-bottom: 30px;}

.inquiry .txt {font-size: 18px; margin-bottom: 60px; position: relative; padding-left: 20px; font-weight: 500;}
.inquiry .txt::before {content:" "; display: block; width: 4px; height: 20px; background: #0054a6; position: absolute; left:0; top:5px;}

.inquiry .table_wrap {width: 100%; margin-bottom: 50px;}
.inquiry .table_wrap .tit {font-size: 24px; font-weight: 700; margin-bottom: 30px;}
.inquiry .table_wrap .tit .check_point {font-size: 16px; font-weight: 400; margin-left: 18px;}
.inquiry .table_wrap table {width: 100%; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.1); background: #fff;}
.inquiry .table_wrap table tr:first-child {border-top: 3px solid #0054a6;}
.inquiry .table_wrap table th {width: 20%; vertical-align: top; padding-top: 26px; font-size: 18px; font-weight: 500;}
.inquiry .table_wrap table td {width: 80%; padding: 20px 60px 15px 0;}
.inquiry .table_wrap table textarea {resize: none; border-color: #999;}
.inquiry .form_style {border: 1px solid #999; padding: 5px; }
.count_box .count_num {margin-top: 15px; text-align:right;}
.count_box .frm_info {margin-top: 15px; margin-bottom: 15px; display:block;}
.check_point {position: relative; padding-left: 15px;}
.check_point::before {content:""; position: absolute; left: 0; top:11px; display:inline-block; width:4px; height:4px; background:red; transform: rotate(45deg);}

.inquiry .table_wrap .select {display: inline-block; border: 1px solid #ddd; width: 200px; height: 36px; overflow: hidden; vertical-align: middle;}
.inquiry .table_wrap .select > a {display: block; height: 100%; line-height: 36px; text-indent: 10px;}
.inquiry .table_wrap .select > ul {background: #fff;}
.inquiry .table_wrap .select > ul > li {text-indent: 10px; padding: 5px 0;}

.btn_style_wrap {text-align: center;}
.inq_btn {border: none; outline: none; width: 200px; height:50px; font-weight: 500; transition: opacity .3s;}
.inq_btn1 {background: #d9d9d9d9;}
.inq_btn2 {background: #0054a6; color: #fff; margin-left:6px;}
.inq_btn1:hover, .inq_btn2:hover {opacity: 0.9;}


/*=================== 개인정보처리방침 ===================*/
.privacy .con {margin-bottom:50px;}
.privacy .con_tit {font-size: 20px; font-weight: 600; margin-bottom: 10px;}
.privacy .txt {padding-left: 20px; line-height: 1.6;}

.privacy ol {padding-left: 40px;}
.privacy ol li {line-height: 1.6;}

.privacy .list1 {}
.privacy .list1 li {list-style-type: decimal;}

.privacy .list2 {padding-left: 45px;}
.privacy .list2 li {list-style-type: hangul;}