.body-sub,
.subContents,
.contents {margin:0; word-break: break-word;}

/* title */
.title-wrap {margin-bottom: 20px;}
.title-wrap .title {font-family: 'Montserrat', sans-serif; font-size: 30px; font-weight: 600; color: #222; line-height: 1.3;
    position: relative;
}
.title-wrap .title:after {content: "";
    width: 10px; height: 10px; border-radius: 50%; background-color: #00c0f3;
    position: absolute; top: -25px; left: 10px;
}
.title-wrap p {font-size: 16px; font-weight: 300; color: #666; margin-top: 15px; line-height: 1.4;}
.title-wrap .sub-title {font-family: 'Montserrat', sans-serif; font-size: 22px; font-weight: 500; color: #222; margin-top: 5px;}

@media only screen and (max-width: 1024px){
    .title-wrap .title {font-size: 25px;}
    .title-wrap .sub-title {font-size: 20px;}
}

@media only screen and (max-width: 768px){
    .title-wrap .title {font-size: 22px;}
    .title-wrap .sub-title {font-size: 18px;}
}

@media only screen and (max-width: 480px){
    .title-wrap .title {font-size: 18px;}
    .title-wrap .sub-title {font-size: 16px;}
    .title-wrap p {font-size: 14px;}
}

/* btn */
.btn-box {text-align: center; margin-top: 110px;}
.btn {display: inline-block;}
.btn a {display: block; padding: 25px 95px 20px 30px; position: relative; 
    background: #222;}
.btn a::before {content: ""; width: 65px; height: 100%; 
    position: absolute; top: 0; right: 0;}
.btn.type1 a::before {background: #00c0f3 url('../images/common/btn-arrow.png') center no-repeat;}
.btn.type2 a::before {background: #00c0f3 url('../images/common/btn-poin.png') center no-repeat;}
.btn a span {font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 500; color: #fff;}

@media only screen and (max-width: 1024px){
    .btn a span {font-size: 18px;}
}

@media only screen and (max-width: 768px){
    .btn a span {font-size: 16px;}
}


/* table */
table {font-family: 'Montserrat', sans-serif; line-height: 1.4;}
table tr {border-bottom: 1px solid #ececec;}
table thead th {font-size: 20px; font-weight: 700; color: #fff; padding: 20px 5px;}
table tbody th {border-right: 1px solid #ececec; padding: 20px 5px;}
table tbody td {font-size: 18px; font-weight: 300; color: #666; padding: 20px 5px;}
table tbody tr:nth-child(2n) {background: #f8f8f8;}
table.white tbody tr:nth-child(2n) {background: none;}

table.type1 thead th {padding: 20px 50px; background: #222; text-align: left;}
table.type1 tbody th {font-size: 18px; font-weight: 500; color: #222; border-right: 1px solid #ececec;} 
table.type1 tbody td {padding: 20px 0 20px 60px; }

table.type2 {text-align: center;}
table.type2 thead th {background: #006eb3; border-right: 1px solid #fff;}
table.type2 tbody th {font-size: 18px; font-weight: 500; color: #006db1;}
table.type2 tbody td {border-right: 1px solid #ececec;}
table.type2 tbody td:last-child {border-right: 0;}
table.type2 tbody td p {display: inline-block; text-align: left; line-height: 1.1;}

.table > p {margin-top: 20px; font-size: 16px; font-weight: 500; color: #00c0f3;}

@media only screen and (max-width: 1024px) {
    table thead th {font-size: 18px;}
    table tbody td, table.type1 tbody th, table.type2 tbody th {font-size: 16px;}
}

@media only screen and (max-width: 768px) {}

@media only screen and (max-width: 640px) {
    table thead th {font-size: 16px;}
    table tbody td, table.type1 tbody th, table.type2 tbody th {font-size: 14px;}
}


/* copy */
.copy {text-align: center; margin-bottom: 60px; font-size: 30px; font-weight: 400; color: #006eb3; line-height: 2;}
.copy span {font-weight: 700; position: relative; vertical-align: baseline;}
.copy span.bg::after {content: ""; width: 102%; height: 50%; background: #d1e9f7; 
    position: absolute; top: 60%; left: 50%; transform: translateX(-50%); z-index: -1;}

@media only screen and (max-width: 1240px) {
    .copy {font-size: 26px;}
}

@media only screen and (max-width: 1024px) {
    .copy {font-size: 22px;}
}

@media only screen and (max-width: 640px) {
    .copy {font-size: 18px;}
}

@media only screen and (max-width: 480px) {
    .copy {font-size: 16px;}
    .copy br {display: none;}
}

/* img-wrap */
.img-wrap.dot {border: 1px solid #d3d3d3; margin-bottom: 50px; padding: 60px 20px; position: relative;}
.img-wrap.dot::before {content: ""; width: 50px; height: 10px; background: url('../images/contents/content_box-dot.png') center no-repeat; 
    position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);}
.img-wrap.dot .img-box {text-align: center;}
.img-wrap.dot .img-box p {font-size: 18px; font-weight: 300; color: #222; line-height: 1.5;}

@media only screen and (max-width: 640px) {
    .img-wrap.dot .img-box p {font-size: 16px;}
}


/* tab */
.content-tab {border: 1px solid #ededed; font-size: 0; margin-bottom: 100px;}
.content-tab li {display: inline-block; border-right: 1px solid #ededed;}
.content-tab li.on {border-right: 1px solid #00c0f3;}
.content-tab.nth-1 li {width: 50%;}
.content-tab.nth-2 li {width: 20%;}
.content-tab.nth-3 li {width: 25%;}
.content-tab li:last-child {border-right: 0;}
.content-tab li a {font-family: 'Montserrat', sans-serif; display: block; padding: 19px; text-align: center; font-size: 16px; line-height: 1.4; font-weight: 400; color: #666;}

.content-tab li.on a { background: #00c0f3; font-weight: 700; color: #fff; position: relative;}
.content-tab li.on a::before {content: ""; width: 25px; height: 25px; border-radius: 50%; background: #00c0f3 url('../images/contents/content_tab-chek.png') center no-repeat; background-size: contain;
    position: absolute; bottom: 2px; left: 50%; transform: translate(-50%, 50%);}
.content-tab li:hover a { background: #00c0f3; font-weight: 700; color: #fff; position: relative;}
.content-tab li:hover a::before {content: ""; width: 25px; height: 25px; border-radius: 50%; background: #00c0f3 url('../images/contents/content_tab-chek.png') center no-repeat; background-size: contain;
    position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 50%);}

@media only screen and (max-width: 1400px){
    .content-tab.nth-2 li {width: 33.3333%;}
    .content-tab.nth-2 li:nth-of-type(1), .content-tab.nth-2 li:nth-of-type(2) {width: 50%; border-bottom: 1px solid #ededed;}
}

@media only screen and (max-width: 768px){
    .content-tab {margin-bottom: 80px;}

    .content-tab.nth-1 li {width: 100%;}
    
    .content-tab.nth-3 li {width: 50%;}
    .content-tab.nth-3 li:nth-of-type(1), .content-tab.nth-3 li:nth-of-type(2) {border-bottom: 1px solid #ededed;}
}

@media only screen and (max-width: 640px){
    .content-tab.nth-2 li:nth-of-type(1) {width: 100%; border: 0;}
    .content-tab.nth-2 li:nth-of-type(2), .content-tab.nth-2 li {width: 100%; border-top: 1px solid #ededed; border-bottom: 0;}
    .content-tab.nth-3 li {width: 100%; border-bottom: 1px solid #ededed;}
    .content-tab.nth-3 li:last-child {border-bottom: 0;}
}


/* 010101-기업개요 */
.company-item {margin-bottom: 100px;}

.ceo::after {display: block; content: ""; clear: both;}
.ceo .img {float: left; width: 360px; height: 340px; margin-right: 35px; background: url('../images/contents/ceo.png') center no-repeat;}

.ceo .text {float: left; width: calc(100% - 395px); color: #222; line-height: 1.4;}
.ceo .text h3 {font-size: 40px; font-weight: 300;}
.ceo .text h4 {font-size: 30px; font-weight: 500; margin-bottom: 30px;}
.ceo .text h4 span {vertical-align: baseline; font-weight: 700; color: #006eb3;}
.ceo .text p {font-size: 18px; font-weight: 300; line-height: 1.5; margin-bottom: 20px;}
.ceo .text h2 {font-size: 18px; font-weight: 500;}
.ceo .text h2 span {font-size: 25px; font-weight: 700;}

.company-item .bg {padding: 95px 0; background: #f5f5f5;}
.company-item .bg .inner {text-align: center;}
.company-item .bg .img {width: 1037px; height: 457px; margin: 0 auto; background: url('../images/contents/company-chart.png') center no-repeat; }

.company-item:nth-of-type(3) .img {width: 100%; height: 550px; background: url('../images/contents/company_goal.png') center no-repeat;}
.company-item:nth-of-type(4) .img {width: 100%; height: 421px; background: url('../images/contents/company_different.png') center no-repeat; background-size: contain;}

@media only screen and (max-width: 1240px){
    .ceo .text p br {display: none;}

    .company-item .bg .img {width: 100%; background-size: contain;}

    .company-item:nth-of-type(4) .img {height: 300px;}
}

@media only screen and (max-width: 1024px){
    .ceo .text h3 {font-size: 30px;}
    .ceo .text h4 {font-size: 25px;}
    .ceo .text p, .ceo .text h2 {font-size: 16px;}
    .ceo .text h2 span {font-size: 20px;}

    .company-item .bg {padding: 50px 0;}
    .company-item .bg .img {height: 350px;}

    .company-item:nth-of-type(3) .img {background: url('../images/contents/company_goal-mo.png') center top no-repeat; background-size: contain;}
}

@media only screen and (max-width: 768px){
    .ceo .img {float: inherit; width: 55%; margin: 0 auto 20px;}
    .ceo .text {width: 100%;}
    .ceo .text h3 {font-size: 25px;}
    .ceo .text h4 {font-size: 20px;}
    .ceo .text h2 span {font-size: 18px;}

    .company-item:nth-of-type(3) .img {height: 350px;}

    .company-item:nth-of-type(4) .img {height: 200px;}
}

@media only screen and (max-width: 640px){
    .ceo .img {width: 80%;}

    .company-item .bg .img {background: url('../images/contents/company-chart_mo.png') center no-repeat; height: 500px;}

    .company-item:nth-of-type(3) .img {height: 260px;}
}

@media only screen and (max-width: 480px){
    .ceo .img {width: 100%; background-size: contain;}

    .company-item:nth-of-type(3) .img {height: 170px;}

    .company-item:nth-of-type(4) .img {background: url('../images/contents/company_different-mo.png') center no-repeat; height: 800px; background-size: contain;}
}


/* 010201-기업연혁 */
.history-top {text-align: center; margin-bottom: 70px;}
.history-top h4 {font-size: 40px; font-weight: 300; color: #006eb3; margin-bottom: 20px; line-height: 1.2;}
.history-top p {font-size: 20px; font-weight: 500; color: #222; letter-spacing: 0.3em;}

.history-title {width: 130px; height: 140px; margin: 0 auto 70px; position: relative; background: url('../images/contents/history_title.png') center no-repeat;}
.history-title::before {content: ""; width: 1px; height: 100%; background: #222; 
    position: absolute; top: 100%; left: 50%;}

.history-item {padding-bottom: 60px; font-family: 'Montserrat', sans-serif; position: relative;}
.history-item::before {content: ""; width: 1px; height: 100%; background: #222; 
    position: absolute; top: 0; left: 50%;}
.history-item:nth-of-type(4)::after {content: ""; width: 300px; height: 200px; border-radius: 30px; background: url('../images/contents/history_bg01.png') center no-repeat; 
    position: absolute; top: 0; right: 0; transform: translateY(-30px);}
.history-item:nth-of-type(7)::after {content: ""; width: 308px; height: 346px; background: url('../images/contents/history_bg02.png') center no-repeat; 
    position: absolute; bottom: 0; left: 0; transform: translateY(-30px);}
.history-item.type1 {padding-right: calc(50% + 45px); text-align: right;}
.history-item.type2 {padding-left: calc(50% + 45px);}

.history-info {margin-bottom: 20px; position: relative; z-index: 1;}
.history-item.type1 .history-info {padding-right: 40px;}
.history-item.type2 .history-info {padding-left: 40px;}

.history-item .year {font-size: 40px; font-weight: 700; color: #006eb3; margin-bottom: 25px; position: relative;}
.history-item .year::before {content: ""; width: 7px; height: 7px; border-radius: 50%; background: #222; 
    position: absolute; top: 50%;}
.history-item.type1 .year::before {right: -45px; transform: translate(50%, -50%);}
.history-item.type2 .year::before {left: -45px; transform: translate(-50%, -50%);}

.history-item .month {display: inline-block; text-align: justify; font-size: 20px; font-weight: 700; color: #222; border-bottom: 2px solid #222;}
.history-item .text {display: inline-block; font-size: 18px; font-weight: 400; color: #666; transform: translateY(5px); line-height: 1.2;}

.history-item.type1 .month {position: absolute; top: 0; right: 0;}

.history-item.type2 .month {position: absolute; top: 0; left: 0;}

.history-bottom {height: 260px; background: url('../images/contents/history_logo.png') center no-repeat; background-size: contain; margin-top: 45px;}


@media only screen and (max-width: 1240px){
    .history-top h4 {font-size: 35px;}

    .history-item:nth-of-type(7)::after {transform: translateY(30px);}

    .history-item .year {font-size: 35px; margin-bottom: 15px;}
}

@media only screen and (max-width: 1024px){
    .history-top h4 {font-size: 30px;}

    .history-bottom {margin-top: 20px;}
}

@media only screen and (max-width: 768px){
    .history-top h4 {font-size: 30px;}

    .history-item:nth-of-type(4)::after {width: 250px; height: 150px; background-size: cover;}
    .history-item:nth-of-type(7)::after {width: 250px; height: 300px; background-size: contain; transform: translateY(-30px);}

    .history-item .year {font-size: 30px;}
}

@media only screen and (max-width: 640px){
    .history-top {margin-bottom: 50px;}
    .history-top h4 {font-size: 24px; margin-bottom: 10px;}
    .history-top p {font-size: 18px;}

    .history-title {margin: 0 0 70px; width: 100px; height: 100px; background-size: contain;}

    .history-item::before {left: 50px;}
    .history-item.type1, .history-item.type2 {padding: 0 0 20px 70px; text-align: left;}
    .history-item.type1 .history-info {padding-left: 40px; padding-right: 0;}
    .history-item.type1 .month {left: 0; right: auto;}

    .history-item.type1 .year::before {left: -20px; right: auto; transform: translate(-50%, -50%);}
    .history-item.type2 .year::before {left: -20px;}

    .history-item:nth-of-type(4)::after, .history-item:nth-of-type(7)::after {display: none;}

    .history-bottom {height: 200px;}
}

@media only screen and (max-width: 480px){
    .history-top {margin-bottom: 30px;}
    .history-top h4 {font-size: 18px;}
    .history-top p {font-size: 16px;}

    .history-title {width: 70px; height: 70px;}

    .history-item::before {left: 35px;}
    .history-item.type1, .history-item.type2 {padding: 0 0 20px 45px;}

    .history-item.type2 .history-info, .history-item.type1 .history-info {padding-left: 25px;}
    .history-item.type1 .year::before, .history-item.type2 .year::before {left: -10px;}
    .history-item .month, .history-item .text {font-size: 16px; transform: translate(0);}

    .history-bottom {margin-top: 0;}
}

/* 010401-CI */
.ci-item.nth-2 .bg .inner::after, .ci-item.nth-3 .inner::after, .ci-item .color-box::after {display: block; content: ""; clear: both;}

.ci-item {margin-bottom: 100px;}
.ci-item.nth-1 .img {border: 1px solid #ececec; margin-bottom: 45px; height: 300px; background: url('../images/contents/ci_main-logo.png') center no-repeat; background-size: cover;}
.ci-item.nth-1 .text {font-size: 27px; line-height: 2; font-weight: 400; color: #006eb3; text-align: center;}
.ci-item.nth-1 span {font-weight: 700; position: relative; vertical-align: baseline;}
.ci-item.nth-1 span::before {content: ""; width: 102%; height: 20px; background: #d1e9f7;
    position: absolute; top: 50%; left: 50%; transform: translateX(-50%); z-index: -1;}

.ci-item.nth-2 .bg {background: #f5f5f5; padding: 70px 0;}
.ci-item .sig-item {float: left; margin-right: 30px; width: calc(33.3333% - 20px);}
.ci-item .sig-item:last-child {margin-right: 0;}
.sig-item h4 {font-size: 22px; font-weight: 500; color: #222; margin-bottom: 20px;}
.ci-item.nth-2 .img {border: 1px solid #ececec;}

.ci-item .color-box {float: left;  width: calc(50% - 10px); background: #006eb3;
    margin-right: 20px; padding: 65px 60px; position: relative;}
.ci-item .color-box:last-child {margin-right: 0; background: #00c0f3;}
.ci-item .color-box::before {content: ""; width: 5px; height: 50px; background: #fff; 
    position: absolute; top: 0; left: 60px;}
.color-box p {float: left; font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 500; color: #fff; line-height: 1.5;}
.color-box p.bottom {float: right;}


@media only screen and (max-width: 1024px){
    .ci-item.nth-1 .text {font-size: 22px;}
    .ci-item.nth-1 .text br {display: none;}
    .ci-item.nth-1 .img {margin-bottom: 35px;}

    .sig-item h4 {font-size: 18px;}

    .ci-item .color-box {padding: 50px 30px;}
    .ci-item .color-box::before {left: 30px;}
    .color-box .top {width: 100%;}
}

@media only screen and (max-width: 768px){
    .ci-item.nth-1 .text {font-size: 18px;}
    .ci-item.nth-1 .img {height: 200px; margin-bottom: 25px;}

    .ci-item.nth-2 .bg {padding: 50px 0 70px;}
    .ci-item .sig-item {width: 100%; margin-bottom: 40px; text-align: center;}
    .ci-item .sig-item:last-child {margin-bottom: 0;}
    .ci-item.nth-2 .img {display: inline-block;}

    .ci-item .color-box {width: 100%;}
    .color-box p {font-size: 18px;}
}

@media only screen and (max-width: 640px){
    .ci-item.nth-1 .img {height: 100px;}
    
    .color-box p {font-size: 16px;}
}

@media only screen and (max-width: 480px){
    .ci-item.nth-1 .text {font-size: 16px;}

    .ci-item .color-box {padding: 50px 30px 30px;}
    .color-box .top {margin-bottom: 10px;}
}

/* 010501-오시는길 */
.map-info::after {display: block; content: ""; clear: both;}

.map-wrap {position: relative; padding-bottom: 430px;}
#map {width: 118%; height: 645px; position: relative; position: absolute; top: 80px; right: 0; background: #999;}

.map-info {display: inline-block; padding: 30px 60px 0; background: #006eb3; font-family: 'Montserrat', sans-serif; position: relative; z-index: 10;}
.map-title {font-size: 20px; font-weight: 500; text-align: center; color: #00c0f3; letter-spacing: 0.3em; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #4794c4;}

.map-info h4 {font-size: 22px; font-weight: 500; color: #fff; margin-bottom: 15px; padding-left: 50px; position: relative;}
.map-info p {font-size: 18px; font-weight: 300; color: #fff; line-height: 1.4; margin-bottom: 45px; padding-left: 50px;}

.address h4::before, .tel h4::before, .fax h4::before {content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.address h4::before {width: 29px; height: 26px; background: url('../images/contents/address-ico.png') center no-repeat;}
.tel h4::before {width: 35px; height: 31px; background: url('../images/contents/tel-ico.png') center no-repeat;}
.fax h4::before {width: 32px; height: 26px; background: url('../images/contents/fax-ico.png') center no-repeat;}


@media only screen and (max-width: 1024px){
    #map {right: -20px;}
    #map::after {content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 10;}

    .map-info {width: 100%;}
    .address {float: left; width: 40%;}
    .tel, .fax {float: left; width: 27%; margin-left: 3%;}
}

@media only screen and (max-width: 768px){
    .map-info {padding: 15px 40px;}
    #map {top: 45px; height: 700px;}

    .map-title {padding-bottom: 10px; font-size: 18px;}

    .address br {display: none;}
    .address, .tel, .fax {width: 100%; margin-left: 0;}

    .map-info h4 {font-size: 18px;}
    .map-info p {margin-bottom: 15px; font-size: 16px;}
}

@media only screen and (max-width: 768px){
    .map-info h4 {font-size: 16px;}
    .map-info p {font-size: 14px;}
}


/* 020101-CleanCableSystem */
.ccs-wrap .img-bottom .img {border-radius: 10px;}
.ccs-wrap .table-wrap .table {display: inline-block; width: calc(50% - 22px); vertical-align: top; margin-right: 40px;}
.ccs-wrap .table-wrap .table:nth-of-type(2) {margin: 0;}
.ccs-wrap .table-wrap p {padding-left: 18px; position: relative;}
.ccs-wrap .table-wrap p::before {content: ""; width: 11px; height: 10px; background: url('../images/contents/text-dot.png') center no-repeat; background-size: cover; 
    position: absolute; top: 9px; left: 0; transform: translateY(-50%);}

.ccs-top .img-wrap {margin-bottom: 60px; background: #d6e4ec; padding: 50px 20px; position: relative;}
.ccs-top .img-top {width: 100%; text-align: center;}
.ccs-top .img-top .img {display: inline-block; min-width: 170px; min-height: 70px;}
.ccs-top .img-top .img.nth-1 {background: url('../images/contents/ccs-top_img-top1.png') center no-repeat;}
.ccs-top .img-top .img.nth-2 {background: url('../images/contents/ccs-top_img-top2.png') center no-repeat;}
.ccs-top .img-top .img.nth-3 {background: url('../images/contents/ccs-top_img-top3.png') center no-repeat;}
.ccs-top .img-top .img.nth-4 {min-width: 65px; background: url('../images/contents/ccs-top_img-top4.png') center no-repeat;}

.ccs-top .img-bottom {width: 100%; text-align: center; position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%);}
.ccs-top .img-bottom .img {display: inline-block; width: 235px; min-height: 150px;}
.ccs-top .img-bottom .img.nth-1 {background: url('../images/contents/ccs-top_img-bottom1.png') center no-repeat;}
.ccs-top .img-bottom .img.nth-2 {margin: 0 20px; background: url('../images/contents/ccs-top_img-bottom2.png') center no-repeat;}
.ccs-top .img-bottom .img.nth-3 {background: url('../images/contents/ccs-top_img-bottom3.png') center no-repeat;}

.ccs-bottom {margin-top: 160px;}
.ccs-bottom .img-box p {margin-bottom: 40px;}
.ccs-bottom .img-box .img {display: inline-block; width: 26%; height: 205px;}
.ccs-bottom .img-box .img.nth-1 {width: 45%; background: url('../images/contents/ccs-bottom_img1.png') center no-repeat;}
.ccs-bottom .img-box .img.nth-2 {background: url('../images/contents/ccs-bottom_img2.png') center no-repeat; margin: 0 1%;}
.ccs-bottom .img-box .img.nth-3 {background: url('../images/contents/ccs-bottom_img3.png') center no-repeat; border-radius: 10px;}

@media only screen and (max-width: 1400px) {}

@media only screen and (max-width: 1240px) {

    .ccs-bottom .img-box .img {width: 49%;}
    .ccs-bottom .img-box .img.nth-1 {width: 100%; margin-bottom: 20px;}
    .ccs-bottom .img-box .img.nth-2 {margin: 0 1% 0 0;}
}

@media only screen and (max-width: 1024px) {
    .ccs-wrap .table-wrap .table {margin: 0; width: 100%; margin-bottom: 40px;}

    .ccs-bottom .table {overflow-x: scroll;}
    .ccs-bottom table {min-width: 765px;}

    .ccs-wrap .table-wrap p {font-size: 14px; line-height: 1.4;}

    .ccs-top .img-bottom .img {width: 30%;}
}

@media only screen and (max-width: 768px) {
    .ccs-top .img-bottom {position: inherit; bottom: auto; left: auto; transform: translateX(0);}

    .ccs-top .img-top .img {min-width: 25%;}
    .ccs-top .img-top .img.nth-1, .ccs-top .img-top .img.nth-2, .ccs-top .img-top .img.nth-3, .ccs-top .img-top .img.nth-4 {background-size: contain;}

    .ccs-top .img-bottom .img.nth-2 {margin: 0 2%;}

    .ccs-top .img-wrap {padding: 50px 10px;}

    .ccs-bottom .img-box .img.nth-1 {margin: 0; background-size: contain;}
    .ccs-bottom .img-box .img.nth-2 {width: 100%; margin: 0 0 20px; background-size: contain;}
    .ccs-bottom .img-box .img.nth-3 {width: 100%; background-size: contain;}
}

@media only screen and (max-width: 640px) {
}

@media only screen and (max-width: 480px) {
    .ccs-top .img-wrap {padding: 25px 10px;}

    .ccs-top .img-top {top: 25px;}
    .ccs-top .img-top .img {min-width: 49%;}

    .ccs-top .img-bottom .img, .ccs-top .img-bottom .img.nth-2 {
        width: 100%; margin: 0 0 20px;}
    
    .ccs-top .img-bottom .img.nth-1, .ccs-top .img-bottom .img.nth-2, .ccs-top .img-bottom .img.nth-3 {background-size: cover;}
    .ccs-bottom .img-box .img {height: 150px;}
}


/* 020201-Pod전용케이블 */
.pod-top {margin-bottom: 90px;}
.pod-top .table {display: inline-block; width: 49%; margin-right: 1%;}
.pod-top .img {display: inline-block; width: 49%; text-align: center;}

.pod-top .img p {width: 49%; display: inline-block; font-family: 'Montserrat', sans-serif; font-size: 25px; font-weight: 500; color: #222; line-height: 3;}

.pod-bottom {text-align: center; position: relative;}
.pod-bottom::before {content: ""; width: 445px; height: 310px; background: url('../images/contents/pod-bottom-img.png') center no-repeat; background-size: contain; 
    position: absolute; top: calc(100% - 45px); right: 0;}
.pod-bottom .table {overflow-x: scroll;}
.pod-bottom table {min-width: 980px;}
.pod-bottom > p {display: inline-block; margin-top: 45px; padding-left: 18px; text-align: center; font-size: 18px; font-weight: 300; line-height: 1.4; color: #666; position: relative;}
.pod-bottom > p::before {content: ""; width: 11px; height: 10px; background: url('../images/contents/text-dot.png') center no-repeat; background-size: cover; 
    position: absolute; top: 9px; left: 0; transform: translateY(-50%);}

.pod-bottom .img {width: 230px; height: 155px;}
.pod-bottom .img.nth-1, .pod-bottom .img.nth-2, .pod-bottom .img.nth-3, .pod-bottom .img.nth-9 {background: url('../images/contents/pod-bottom_img1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-4 {background: url('../images/contents/pod-bottom_img2.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-5 {background: url('../images/contents/pod-bottom_img3.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-6 {background: url('../images/contents/pod-bottom_img4.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-7 {background: url('../images/contents/pod-bottom_img5.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-8 {background: url('../images/contents/pod-bottom_img6.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-10 {background: url('../images/contents/pod-bottom_img7.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-11, .pod-bottom .img.nth-12, .pod-bottom .img.nth-13, .pod-bottom .img.nth-14 {background: url('../images/contents/pod-bottom_img9.png') center no-repeat; background-size: 85%;}

.pod-bottom .img.nth-1-1 {background: url('../images/contents/pod-bottom_img1-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-2-1 {background: url('../images/contents/pod-bottom_img2-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-3-1 {background: url('../images/contents/pod-bottom_img2-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-4-1 {background: url('../images/contents/pod-bottom_img3-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-5-1 {background: url('../images/contents/pod-bottom_img4-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-6-1 {background: url('../images/contents/pod-bottom_img5-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-7-1 {background: url('../images/contents/pod-bottom_img6-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-8-1 {background: url('../images/contents/pod-bottom_img7-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-9-1 {background: url('../images/contents/pod-bottom_img8-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-10-1 {background: url('../images/contents/pod-bottom_img9-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-11-1 {background: url('../images/contents/pod-bottom_img10-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-12-1 {background: url('../images/contents/pod-bottom_img11-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-13-1 {background: url('../images/contents/pod-bottom_img12-1.png') center no-repeat; background-size: 85%;}
.pod-bottom .img.nth-14-1 {background: url('../images/contents/pod-bottom_img12-1.png') center no-repeat; background-size: 85%;}

@media only screen and (max-width: 1400px) {
    .pod-top .table {width: 68%;}
    .pod-top .img {width: 30%;}
    .pod-top .img p {width: 100%; margin: 0 0 20px;}

    table tbody td {padding: 5px;}
    .pod-bottom .img {width: 150px; height: 100px;}
}

@media only screen and (max-width: 1240px) {
}

@media only screen and (max-width: 1024px) {
    .pod-top .table {width: 100%; margin-bottom: 40px;}

    .pod-top .img {width: 100%;}
    .pod-top .img p {width: 49%; font-size: 18px;}

    .pod-bottom > p {font-size: 16px;}
}

@media only screen and (max-width: 640px) {
    .pod-top .img p {font-size: 16px;}
    .pod-bottom > p {font-size: 14px;}
}

@media only screen and (max-width: 480px) {
    table.type1 tbody td {padding: 20px 0 20px 20px;}
    .pod-top img {width: 90%;}
    .pod-top .img p {display: block; width: 100%;}
}


/* 020301-Flat Pod Cable */
.fpc-item.nth-1 {margin-bottom: 100px;}
.fpc-item.nth-1 .img.nth-1 {background: url('../images/contents/fpc_img1.png') center no-repeat;}
.fpc-item.nth-1 .img.nth-2 {background: url('../images/contents/fpc_img2.png') center no-repeat;}
.fpc-item.nth-1 .img.nth-3 {background: url('../images/contents/fpc_img3.png') center no-repeat;}
.fpc-item.nth-1 .img.nth-4 {background: url('../images/contents/fpc_img4.png') center no-repeat; background-size: 95%;}
.fpc-item.nth-1 .img.nth-5 {background: url('../images/contents/fpc_img5.png') center no-repeat; background-size: 95%;}
.fpc-item.nth-1 .img.nth-6 {background: url('../images/contents/fpc_img6.png') center no-repeat; background-size: 95%;}
.fpc-item.nth-1 .img.nth-7 {background: url('../images/contents/fpc_img7.png') center no-repeat; background-size: 95%;}

.fpc-item.nth-1 .table {overflow-x: scroll;}
.fpc-item.nth-1 table {min-width: 650px;}

.fpc-item.nth-2 .img {display: inline-block; margin-top: 50px;}

.fpc-item.nth-3 {background: #f5f5f5; padding: 90px 0;}
.fpc-item.nth-3 .inner {background: #fff; box-shadow: 10px 10px 10px #ededed; padding: 85px 65px; position: relative;}
.fpc-item.nth-3 .inner::before {content: ""; width: 770px; height: 630px; background: url('../images/contents/contenst_fpc-bg.png') center no-repeat; 
    position: absolute; bottom: 0; right: 0;}
.fpc-item.nth-3 .top {margin-bottom: 90px; position: relative; z-index: 10;}
.fpc-item.nth-3 .left, .fpc-item.nth-3 .right {display: inline-block; width: 28%;}
.fpc-item.nth-3 .top .text-box {background: #00c0f3; padding: 30px 0; border-radius: 50px; text-align: center; font-size: 22px; font-weight: 500; color: #fff; line-height: 1.4;}
.fpc-item.nth-3 .top .text-box:nth-of-type(1) {margin-bottom: 145px;}
.fpc-item.nth-3 .center {display: inline-block; width: 40%; height: 350px; font-family: 'Montserrat', sans-serif; text-align: center; font-size: 35px; font-weight: 700; color: #fff; background: url('../images/contents/contenst_fpc-text.png') center no-repeat; background-size: contain; position: relative;}
.fpc-item.nth-3 .center p {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.fpc-item.nth-3 h4 {font-family: 'Montserrat', sans-serif; font-size: 70px; font-weight: 700; color: #00c0f3; position: relative; z-index: 5;}

.fpc-item.nth-4 {margin-top: 95px;}
.fpc-item.nth-4::after {display: block; content: ""; clear: both;}
.fpc-item.nth-4 .left, .fpc-item.nth-4 .right {display: inline-block;}
.fpc-item.nth-4 .left {float: left; width: 74%;}
.fpc-item.nth-4 .left .text-box {padding-left: 35px; position: relative; margin-bottom: 25px;}
.fpc-item.nth-4 .left .text-box::before {content: ""; width: 10px; height: 100%; background: #00c0f3; border-radius: 30px; 
    position: absolute; top: 0; left: 0;}
.fpc-item.nth-4 .left .text-box p {font-size: 20px; font-weight: 300; line-height: 1.5; color: #222;}
.fpc-item.nth-4 .left .text-box p span {font-weight: 700; vertical-align: baseline;}
.fpc-item.nth-4 .left .img {width: 950px; height: 505px; background: url('../images/contents/fpc_img10.png') center no-repeat; background-size: contain;}

.fpc-item.nth-4 .right {margin-left: 60px; width: calc(25% - 60px); float: right;}
.fpc-item.nth-4 .right .img:nth-of-type(1) {width: 100%; height: 135px; margin-bottom: 25px; border-radius: 10px; border: 1px solid #ececec; background: url('../images/contents/fpc_img11.png') center no-repeat;}
.fpc-item.nth-4 .right .img:nth-of-type(2) {width: 100%; height: 505px; border-radius: 10px; background: #9ec4df url('../images/contents/fpc_img12.png') bottom center no-repeat;}

.fpc-item.nth-4 .bottom {width: 100%; float: left; margin-top: 90px;}
.fpc-item.nth-4 .bottom .img {display: inline-block; height: 95px;}
.fpc-item.nth-4 .bottom .img.nth-1 {width: 25%; background: url('../images/contents/fpc_img13.png') center no-repeat; background-size: 100%;}
.fpc-item.nth-4 .bottom .img.nth-2 {width: 34%; background: url('../images/contents/fpc_img14.png') center no-repeat; background-size: 100%;}
.fpc-item.nth-4 .bottom .img.nth-3 {width: 40%; background: url('../images/contents/fpc_img15.png') center no-repeat; background-size: 100%;}

.fpc-item.nth-5 {margin-top: 95px; font-size: 0;}
.fpc-item.nth-5 .table {display: inline-block; width: 75%;}
.fpc-item.nth-5 .img {display: inline-block; width: calc(25% - 60px); margin-left: 60px; border-radius: 10px; background: #9ec4df url('../images/contents/fpc_img16.png') center no-repeat;}

@media only screen and (max-width: 1400px) {
    .fpc-item.nth-1 .img.nth-1, .fpc-item.nth-1 .img.nth-2, .fpc-item.nth-1 .img.nth-3 {background-size: contain;}

    .fpc-item.nth-3 .top .text-box {font-size: 20px;}

    .fpc-item.nth-4 .left .img {width: 100%;}
    .fpc-item.nth-4 .right {margin-left: 40px; width: calc(25% - 40px);}
}

@media only screen and (max-width: 1240px) {
    .fpc-item.nth-3 .top .text-box {font-size: 16px; padding: 20px 5px;}
    .fpc-item.nth-3 .center {font-size: 30px;}

    .fpc-item.nth-3 h4 {font-size: 60px;}

    
}

@media only screen and (max-width: 1024px) {
    .fpc-item.nth-3 .inner{padding: 40px 25px; overflow: hidden;}

    .fpc-item.nth-3 .top::after {display: block; content: ""; clear: both;}
    .fpc-item.nth-3 .center {width: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0;}
    .fpc-item.nth-3 .left {width: 45%; float: left; position: relative; z-index: 5;} 
    .fpc-item.nth-3 .right {width: 45%; float: right; position: relative; z-index: 5;}

    .fpc-item.nth-3 h4 {font-size: 45px; text-align: right;}

    .fpc-item.nth-4 .left, .fpc-item.nth-4 .right {width: 100%; margin: 0 0 10px;}
    .fpc-item.nth-4 .left .text-box p {font-size: 18px;}
    .fpc-item.nth-4 .right .img:nth-of-type(1), .fpc-item.nth-4 .right .img:nth-of-type(2) {display: inline-block; width: 49%; height: 150px; margin: 0;}
    .fpc-item.nth-4 .right .img:nth-of-type(2) {background: #9ec4df url('../images/contents/fpc_img12.png') center 30% no-repeat; background-size: 50%;}
    .fpc-item.nth-4 .left .img {height: 400px;}

    .fpc-item.nth-5 .table {width: 60%;}
    .fpc-item.nth-5 .img {width: calc(38% - 60px);}
}

@media only screen and (max-width: 768px) {
    .fpc-item.nth-3 .inner::before {right: auto; left: 0;}
    
    .fpc-item.nth-4 .right .img:nth-of-type(2) {background-size: 80%;}

    .fpc-item.nth-4 .bottom {margin-top: 40px;}
    .fpc-item.nth-4 .bottom .img.nth-1, .fpc-item.nth-4 .bottom .img.nth-2, .fpc-item.nth-4 .bottom .img.nth-3 {width: 100%; margin: 0 0 10px; background-size: contain;}

    .fpc-item.nth-5 .table {width: 100%;}
    .fpc-item.nth-5 .img {width: 100%; height: 100px; margin: 10px 0 0; background: #9ec4df url('../images/contents/fpc_img16.png') right 30% no-repeat;}
}

@media only screen and (max-width: 640px) {
    .fpc-item.nth-3 .inner::before {bottom: 70px;}
    .fpc-item.nth-3 .center {width: 80%;}

    .fpc-item.nth-4 .left .text-box p {font-size: 16px;}
    .fpc-item.nth-4 .left .img {height: 250px;}
    .fpc-item.nth-4 .right .img:nth-of-type(1), .fpc-item.nth-4 .right .img:nth-of-type(2) {width: 100%; margin-bottom: 10px;}
}

@media only screen and (max-width: 480px) {
    .fpc-item.nth-3 .top .text-box {padding: 20px;}
    .fpc-item.nth-3 .top {padding-top: 300px;}
    .fpc-item.nth-3 .center {width: 100%; height: 320px; top: 0; left: 0; transform: translate(0, 0); background: url('../images/contents/contenst_fpc-text-mo.png') center no-repeat; background-size: contain;}
    .fpc-item.nth-3 .left, .fpc-item.nth-3 .right {width: 100%; margin-bottom: 10px;}
    .fpc-item.nth-3 .top .text-box:nth-of-type(1) {margin-bottom: 10px;}

    .fpc-item.nth-3 h4 {font-size: 35px;}

    .fpc-item.nth-4 .bottom {margin-top: 0;}
}


/* 020401-Flat Cable */
.fc-item > p {margin-bottom: 30px; font-size: 20px; font-weight: 300; color: #222; line-height: 1.4;}

.fc-item .table {overflow-x: scroll;}
.fc-item table {min-width: 725px;}
.fc-item .img {width: 210px; height: 155px; margin: 0 auto;}
.fc-item .img.nth-1, .fc-item .img.nth-2, .fc-item .img.nth-3, .fc-item .img.nth-9 {background: url('../images/contents/pod-bottom_img1.png') center no-repeat; background-size: contain;}
.fc-item .img.nth-4 {background: url('../images/contents/pod-bottom_img2.png') center no-repeat; background-size: contain;}
.fc-item .img.nth-5 {background: url('../images/contents/pod-bottom_img3.png') center no-repeat; background-size: contain;}
.fc-item .img.nth-6 {background: url('../images/contents/pod-bottom_img4.png') center no-repeat; background-size: contain;}
.fc-item .img.nth-7 {background: url('../images/contents/pod-bottom_img5.png') center no-repeat; background-size: contain;}
.fc-item .img.nth-8 {background: url('../images/contents/pod-bottom_img6.png') center no-repeat; background-size: contain;}
.fc-item .img.nth-10 {background: url('../images/contents/pod-bottom_img7.png') center no-repeat; background-size: contain;}

@media only screen and (max-width: 1024px) {
    .fc-item .img {width: 150px; height: 100px;}
}
@media only screen and (max-width: 1024px) {
    .fc-item > p {font-size: 18px;}
}

@media only screen and (max-width: 640px) {
    .fc-item > p {font-size: 16px;}
}


/* 020501-Clamp Bracket */
.cb-item > p {margin-bottom: 40px; font-size: 20px; font-weight: 300; color: #222; line-height: 1.5;}
.cb-item.nth-1 table thead th {text-align: center; padding: 20px 5px;}
.cb-item.nth-1 {margin-bottom: 100px;}
.cb-box::after {display: block; content: ""; clear: both;}
.cb-box .table {float: left; display: inline-block; width: calc(100% - 590px); margin-right: 60px;}
.cb-box .table td {text-align: center; padding: 20px 5px;}
.cb-box .img {float: right; display: inline-block; width: 525px; height: 378px; background: url('../images/contents/cb-img1.png') center no-repeat; background-size: contain;}

.cb-item.nth-2 .img-wrap {padding: 60px 20px;}
.cb-item.nth-2 .img {display: inline-block; width: 16%;}

@media only screen and (max-width: 1240px) {
    .cb-box::after {display: block; content: ""; clear: both;}
    .cb-box .table {width: 100%; margin: 20px 0 0; float: right;}
    .cb-box .img {width: 100%; float: right;}
}

@media only screen and (max-width: 1024px) {
    .cb-item > p {font-size: 18px;}

    .cb-item.nth-2 .img {width: 33%;}
}

@media only screen and (max-width: 768px) {
    .cb-item.nth-2 .img {width: 49%;}
}

@media only screen and (max-width: 640px) {
    .cb-item > p {font-size: 16px; margin-bottom: 0;}
}

@media only screen and (max-width: 480px) {
    .cb-box .img {height: 250px;}

    .cb-item.nth-2 .img {width: 100%;}
}


/* 020601-Pod */
.pod-item {margin-bottom: 100px;}
.pod-item.nth-1 .img {width: 100%; margin-top: 20px;}

.pod-item.nth-2 .table {display: inline-block; width: calc(65% - 60px); margin-right: 60px;}
.pod-item.nth-2 .img {display: inline-block; width: 34%; border-radius: 10px; border: 1px solid #ececec; background: url('../images/contents/pod-img2.png') bottom center no-repeat; background-size: cover;}

.pod-item.nth-3 .box {display: inline-block; width: calc(65% - 60px); margin-right: 60px;}
.pod-item.nth-3 .box .table {margin-bottom: 30px;}
.pod-item.nth-3 .box .tip {padding: 35px 0 35px 100px; position: relative;}
.pod-item.nth-3 .box .tip::before {content: ""; width: 82px; height: 65px; background: url('../images/contents/tip-mark.png') center no-repeat; background-size: contain;
    position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.pod-item.nth-3 .box .tip p {padding-left: 10px; margin-bottom: 15px; font-size: 16px; font-weight: 400; color: #222; position: relative; white-space: nowrap;}
.pod-item.nth-3 .box .tip p::before {content: ""; width: 5px; height: 5px; background: #222; border-radius: 50%; 
    position: absolute; top: 50%; left: 0; transform: translateY(-50%);}

.pod-item.nth-3 .img-wrap {display: inline-block; width: 34%;}
.pod-item.nth-3 .img-wrap .img {border-radius: 10px;}
.pod-item.nth-3 .img-wrap .img:nth-of-type(1) {margin-bottom: 30px; background: #a0c6e1 url('../images/contents/pod-img3.png') center no-repeat;}
.pod-item.nth-3 .img-wrap .img:nth-of-type(2) {height: 140px; background: #a0c6e1 url('../images/contents/pod-img4.png') center no-repeat;}

@media only screen and (max-width: 768px) {
    .pod-item.nth-2 .table {width: 100%; margin: 0 0 20px;}
    .pod-item.nth-2 .img {width: 100%; height: 100px;}

    .pod-item.nth-3 .box {width: 100%;}
    .pod-item.nth-3 .img-wrap {width: 100%;}
}

@media only screen and (max-width: 480px) {
    .pod-item.nth-3 .box .tip {padding: 35px 0;}
    .pod-item.nth-3 .box .tip::before {top: 10%; width: 40px; height: 32px;}
}


/* 020701-주문과정 */
.order-top .img-wrap {padding: 110px 40px 40px; margin-bottom: 95px;}

.order-top .img-box .text {text-align: left; padding-left: 375px; position: relative;}
.order-top .img-box .text::before {content: ""; width: 180px; height: 195px; background: url('../images/contents/order-top_img1.png') center no-repeat; 
    position: absolute; top: 50%; left: 105px; transform: translateY(-50%);}
.order-top .img-box h4 {font-size: 40px; font-weight: 400; color: #222; line-height: 1.5;}
.order-top .img-box h4 span {vertical-align: baseline; font-weight: 700;}
.order-top .img-box h4 span.blue {color: #006eb3;}
.order-top .img-box h4 span.bg {position: relative;}
.order-top .img-box h4 span.bg::before {content: ""; width: 102%; height: 20px; background: #d1e9f7; 
    position: absolute; top: 60%; left: 50%; transform: translateX(-50%); z-index: -1;}
.order-top .img-box h5 {display: inline-block; line-height: 1.4; font-size: 18px; font-weight: 300; padding: 10px 0; margin-bottom: 10px; border-bottom: 1px solid #222;}
.order-top .img-box p {font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 400; letter-spacing:5px; margin-bottom: 20px;}

.order-top .box::after {content: ""; display: block; clear: both;}
.order-top .box {margin-top: 70px;}
.order-top .box .card {float: left; width: calc(25% - 37.5px); min-height: 125px; padding: 12px; border-radius: 10px; border: 1px solid #222; margin-right: 50px; text-align: right; margin-bottom: 50px; position: relative;}
.order-top .box .card:nth-of-type(4), .order-top .box .card:nth-of-type(5) {margin-right: 0;}
.order-top .box .card::before {content: ""; width: 25px; height: 22px; background: url('../images/contents/order-top_arrow.png') center no-repeat; 
    position: absolute; top: 50%; right: -25px; transform: translate(50%, -50%);}
.order-top .box .card:nth-of-type(4)::before {top: calc(100% + 25px); right: 50%; transform: translate(50%, -50%) rotate(90deg);}
.order-top .box .card:nth-of-type(5)::before {display: none;}
.order-top .box .card:nth-of-type(6)::before, .order-top .box .card:nth-of-type(7)::before {content: ""; width: 25px; height: 22px; background: url('../images/contents/order-top_arrow.png') center no-repeat; 
    position: absolute; top: 50%; right: -25px; transform: translate(50%, -50%) rotate(-180deg);}
.order-top .box .card .bg {text-align: left; min-height: 101px; border-radius: 10px; background: #65bef0; padding: 22px 10px 22px 50px; font-size: 20px; font-weight: 700; color: #fff; position: relative; line-height: 1.4;}
.order-top .box .card .no {font-family: 'Montserrat', sans-serif; background: #fff; border-radius: 0 0 10px 0; display: inline-block; padding: 10px; font-size: 20px; font-weight: 700; color: #222;
    position: absolute; top: 0; left: 0;}

.order-top .box .card:nth-of-type(5), .order-top .box .card:nth-of-type(6), .order-top .box .card:nth-of-type(7) {float: right;}


.order-bottom {background: #f5f5f5; padding: 100px 0;}
.order-bottom .inner {background: #fff; padding: 40px; position: relative;}
.order-bottom .center {position: absolute; width: 500px; height: 500px; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; background: url('../images/contents/order-bottom-bg.png') center no-repeat; padding: 87px;}
.order-bottom .center .logo {border-radius: 50%; width: 100%; height: 100%; border: 1px solid #c0d4e4; background: url('../images/contents/order-bottom_logo.png') center no-repeat; background-size: 85%;}
.order-bottom .box {display: inline-block; width: calc(50% - 22px); height: 390px; padding: 35px 30px; position: relative;}
.order-bottom .box h4 {display: inline-block; font-size: 25px; font-weight: 700; text-align: center; width: 160px; background: #fff; padding: 20px 0; }
.order-bottom .box p {display: inline-block; font-size: 20px; font-weight: 700; color: #fff; line-height: 1.4; padding: 10px 0;}

.order-bottom .box.nth-1 {margin: 0 40px 40px 0; background: #9ec8eb url('../images/contents/order-bottom_img1.png') center no-repeat; background-size: contain;}
.order-bottom .box.nth-1 h4 {color: #9ec8eb; position: relative;}
.order-bottom .box.nth-1 h4::before {content: ""; width:  100%; height: 80px; background: url('../images/contents/order-bottom_img5.png') center no-repeat; 
    position: absolute; top: calc(100% + 10px); left: 0;}
.order-bottom .box.nth-1 p {text-align: right; float: right;}

.order-bottom .box.nth-2 {margin-bottom: 40px; background: #bbb7b7 url('../images/contents/order-bottom_img2.png') center no-repeat;}
.order-bottom .box.nth-2 h4 {float: right; color: #bbb7b7;}

.order-bottom .box.nth-3 {margin-right: 40px; background: #aed6f1 url('../images/contents/order-bottom_img3.png') center no-repeat;}
.order-bottom .box.nth-3 h4 {float: left; color: #aed6f1;}
.order-bottom .box.nth-3 p {text-align: right; position: absolute; bottom: 35px; right: 30px;}

.order-bottom .box.nth-4 {background: #c1d0cf url('../images/contents/order-bottom_img4.png') center no-repeat;}
.order-bottom .box.nth-4 h4 {float: right; color: #c1d0cf;}
.order-bottom .box.nth-4 p {position: absolute; bottom: 35px; left: 30px;}

@media only screen and (max-width: 1240px) {
    .order-top .img-box h4 {font-size: 35px;}

    .order-top .box .card {width: calc(33.3333% - 34px);}
    .order-top .box .card:nth-of-type(3n) {margin-right: 0;}
    .order-top .box .card:nth-of-type(3)::before, .order-top .box .card:nth-of-type(6)::before {top: calc(100% + 25px); right: 50%; transform: translate(50%, -50%) rotate(90deg);}
    .order-top .box .card:nth-of-type(4) {float: right; margin-left: 50px;}
    .order-top .box .card:nth-of-type(4)::before {top: 50%; left: -25px; transform: translate(-50%, -50%) rotate(-180deg);}
    .order-top .box .card:nth-of-type(5) {margin-left: 50px;}
    .order-top .box .card:nth-of-type(5)::before {display: block; top: 50%; left: -25px; transform: translate(-50%, -50%) rotate(-180deg);}
    .order-top .box .card:nth-of-type(7) {float: left;}
    .order-top .box .card:nth-of-type(7)::before {display: none;}

    .order-bottom .center {display: none;}
    .order-bottom .box.nth-1 p {text-align: right; position: absolute; bottom: 35px; right: 30px;}
    .order-bottom .box.nth-2 p {position: absolute; bottom: 35px; left: 30px;}
    .order-bottom .box p {text-align: left; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);}
}

@media only screen and (max-width: 1024px) {
    .order-top .img-box .text {padding-left: 35%;}
    .order-top .img-box .text::before {left: 0;}
    .order-top .img-box h4 {font-size: 24px;}
    .order-top .img-box h5, .img-wrap.dot .img-box p {font-size: 16px;}

    .order-top .box .card {width: calc(50% - 25px);}

    .order-top .box .card:nth-of-type(2) {margin-right: 0;}
    .order-top .box .card:nth-of-type(3), .order-top .box .card:nth-of-type(4), .order-top .box .card:nth-of-type(7) {float: right;}
    .order-top .box .card:nth-of-type(5), .order-top .box .card:nth-of-type(6) {float: left;}

    .order-top .box .card:nth-of-type(3) {margin-left: 50px;}
    .order-top .box .card:nth-of-type(4) {margin-left: 0;}
    .order-top .box .card:nth-of-type(5) {margin-left: 0; margin-right: 50px;}
    .order-top .box .card:nth-of-type(7) {margin-right: 0;}

    .order-top .box .card:nth-of-type(2)::before, .order-top .box .card:nth-of-type(4)::before {top: calc(100% + 25px); left: 50%; transform: translate(-50%, -50%) rotate(90deg);}
    .order-top .box .card:nth-of-type(3)::before {top: 50%; left: -25px; transform: translate(-50%, -50%) rotate(-180deg);}
    .order-top .box .card:nth-of-type(5)::before {top: 50%; left: auto; right: -25px; transform: translate(50%, -50%);}

    .order-bottom .box {width: 100%; margin-bottom: 40px;}
}

@media only screen and (max-width: 640px) {
    .order-top .img-wrap {padding: 40px;}
    .order-top .img-box .text {padding: 200px 0 0;}
    .order-top .img-box .text::before {left: 50%; top: 0; transform: translate(-50%, 0);}
    .order-top .img-box h4 {font-size: 18px;}
    .order-top .img-box h4 span.bg::before {height: 10px;}

    .order-top .box .card {width: 100%; margin: 0 0 50px;}
    .order-top .box .card::before, .order-top .box .card:nth-of-type(3)::before, .order-top .box .card:nth-of-type(5)::before, .order-top .box .card:nth-of-type(6)::before {top: calc(100% + 25px); left: 50%; transform: translate(-50%, -50%) rotate(90deg);}

    .order-bottom .box {padding: 15px;}
    .order-bottom .box.nth-1 {background-size: inherit;}
    .order-bottom .box h4, .order-bottom .box.nth-2 h4, .order-bottom .box.nth-4 h4 {float: inherit; margin-left: 50%; transform: translateX(-50%);}
    .order-bottom .box.nth-3 p, .order-bottom .box.nth-1 p {text-align: left; right: auto; left: 30px;}
}

@media only screen and (max-width: 480px) {
}


/* 030101-Robot Cable System */
.rcs-item {margin-bottom: 100px;}
.rcs-item.nth-1 .top .img-wrap {font-size: 0; margin-bottom: 40px; border: 1px solid #ececec;}
.rcs-item.nth-1 .top .img {display: inline-block; width: 33.3333%; height: 460px; border-right: 1px solid #ececec;}
.rcs-item.nth-1 .top .img.nth-1 {background: url('../images/contents/rcs-top_img1.png') center no-repeat; background-size: cover;}
.rcs-item.nth-1 .top .img.nth-2 {background: url('../images/contents/rcs-top_img2.png') center no-repeat; background-size: cover;}
.rcs-item.nth-1 .top .img.nth-3 {background: url('../images/contents/rcs-top_img3.png') center no-repeat; border: 0; background-size: cover;}

.rcs-item.nth-1 .bottom .img-wrap {font-size: 0;}
.rcs-item.nth-1 .bottom .img {display: inline-block; text-align: center; margin-right: 25px; margin-bottom: 25px; width: calc(16.6666% - 21px); 
    font-size: 16px; font-weight: 500; color: #222;}
.rcs-item.nth-1 .bottom .img:last-child {margin-right: 0;}
.rcs-item.nth-1 .bottom .img img {border: 1px solid #ececec; margin-bottom: 25px;}
.rcs-item.nth-1 .bottom .img p {font-size: 16px; font-weight: 500; color: #222;}

.rcs-item.nth-2 .img-wrap::after {display: block; content: ""; clear: both;}
.rcs-item.nth-2 .img-wrap {position: relative; font-size: 0; text-align: center; padding: 80px 0;}
.rcs-item.nth-2 .img-wrap .img {margin-bottom: 45px; position: relative;}
.rcs-item.nth-2 .img-wrap .img:last-child {margin-bottom: 0;}
.rcs-item.nth-2 .img-wrap .img::after {width: 25px; height: 25px; padding: 10px; border-radius: 50%; background: #00c0f3; color: #fff; font-size: 20px; position: absolute; top: 0; left: 0;}
.rcs-item.nth-2 .img-wrap .left .img:nth-of-type(1)::after {content: "1";}
.rcs-item.nth-2 .img-wrap .left .img:nth-of-type(2)::after {content: "2";}
.rcs-item.nth-2 .img-wrap .left .img:nth-of-type(3)::after {content: "3";}
.rcs-item.nth-2 .img-wrap .right .img:nth-of-type(1)::after {content: "4";}
.rcs-item.nth-2 .img-wrap .right .img:nth-of-type(2)::after {content: "5";}
.rcs-item.nth-2 .img-wrap .right .img:nth-of-type(3)::after {content: "6";}
.rcs-item.nth-2 .img-wrap img {border-radius: 50%; margin-bottom: 20px;}
.rcs-item.nth-2 .img-wrap .left {float: left; display: inline-block; width: 20%; position: relative; z-index: 10;}
.rcs-item.nth-2 .img-wrap .right {float: right; display: inline-block; width: 20%; position: relative; z-index: 10;}
.rcs-item.nth-2 .img-wrap .center {display: inline-block; width: 58%; margin: 0 1%; height: 1000px; border: 1px solid #ededed; background: url('../images/contents/rcs-center_img.png') center no-repeat;}
.rcs-item.nth-2 .img-wrap h4 {font-size: 18px; font-weight: 500; color: #222; margin-bottom: 10px;}
.rcs-item.nth-2 .img-wrap .text {display: inline-block; text-align: left;}
.rcs-item.nth-2 .img-wrap p {padding-left: 10px; font-size: 16px; font-weight: 500; color: #999; position: relative; line-height: 1.4;}
.rcs-item.nth-2 .img-wrap p::before {content: ""; width: 4px; height: 1px; background: #999; position: absolute; left: 0; top: 10px;}

@media only screen and (max-width: 1024px) {
    .rcs-item.nth-1 .top .img {width: 100%; height: 300px;}
    .rcs-item.nth-1 .bottom .img {width: calc(33.3333% - 17px);}
    .rcs-item.nth-1 .bottom .img:nth-of-type(3n) {margin-right: 0;}

    .rcs-item.nth-2 .img-wrap {padding: 0;}
    .rcs-item.nth-2 .img-wrap .center {width: 100%; margin: 0 0 40px; float: left;}
    .rcs-item.nth-2 .img-wrap .right, .rcs-item.nth-2 .img-wrap .left {width: 49%;}
    .rcs-item.nth-2 .img-wrap .right {margin-right: 1%;}

    .rcs-item.nth-2 .img-wrap .center {position: relative;}

    .rcs-item.nth-2 .img-wrap h4 {font-size: 16px;}
    .rcs-item.nth-2 .img-wrap p {font-size: 14px;}
}

@media only screen and (max-width: 640px) {
    .rcs-item.nth-1 .bottom .img {width: calc(50% - 12.5px);}
    .rcs-item.nth-1 .bottom .img:nth-of-type(3n) {margin-right: 25px;}
    .rcs-item.nth-1 .bottom .img:nth-of-type(2n) {margin-right: 0;}
}

@media only screen and (max-width: 480px) {
    .rcs-item.nth-1 .bottom .img {width: 100%;}

    .rcs-item.nth-2 .img-wrap .right, .rcs-item.nth-2 .img-wrap .left {width: 100%; margin: 0;}
    .rcs-item.nth-2 .img-wrap .left {margin-bottom: 45px;}

    .rcs-item.nth-2 .img-wrap .center {background-size: contain; height: 400px;}
    .rcs-item.nth-2 .img-wrap .center::before {background-size: cover;}

    .rcs-item.nth-1 .bottom .img p {font-size: 14px;}
}



/* 030102-EV Charger & PV 인버터 케이블 하네스 */
.ev_pv-item.nth-1 .img-wrap {font-size: 0; margin-bottom: 100px;}
.ev_pv-item.nth-1 .img {display: inline-block; width: calc(50% - 20px); position: relative;}
.ev_pv-item.nth-1 .img:last-child {margin-left: 40px;}
.ev_pv-item.nth-1 p {display: inline-block; padding: 15px 25px; background: #00c0f3; font-size: 24px; font-weight: 500; color: #fff; 
    position: absolute; bottom: 20px; left: 20px;}

.ev_pv-item.nth-2 .img-wrap {font-size: 0; text-align: left;}
.ev_pv-item.nth-2 .img {text-align: center; display: inline-block; overflow: hidden; background: #d3d3d3; width: calc(20% - 8px); height: 200px; margin: 0 10px 10px 0; border: 1px solid #d3d3d3;}
.ev_pv-item.nth-2 .img:nth-of-type(5n), .ev_pv-item.nth-2 .img:last-child {margin: 0 0 10px 0;}

.ev_pv-item.nth-2 .img-wrap .img.logo {background: none; width: calc(40% - 8px); border: 0;}

@media only screen and (max-width: 1240px) {
    .ev_pv-item.nth-1 p {font-size: 18px;}
}

@media only screen and (max-width: 1024px) {
    .ev_pv-item.nth-1 p {font-size: 16px;}
    .ev_pv-item.nth-2 .img, .ev_pv-item.nth-2 .img-wrap .img.logo {width: calc(33.333% - 8px);}
    .ev_pv-item.nth-2 .img:nth-of-type(5n) {margin: 0 10px 10px 0;}
    .ev_pv-item.nth-2 .img:nth-of-type(3n), .ev_pv-item.nth-2 .img:last-child {margin: 0 0 10px 0;}
}

@media only screen and (max-width: 768px) {
    .ev_pv-item.nth-1 .img {width: 100%; margin: 0 0 40px 0;}
    .ev_pv-item.nth-1 .img img {width: 100%;}
    .ev_pv-item.nth-1 .img:last-child {margin-left: 0;}
}

@media only screen and (max-width: 640px) {
    .ev_pv-item.nth-2 .img, .ev_pv-item.nth-2 .img-wrap .img.logo {width: calc(50% - 8px);}
    .ev_pv-item.nth-2 .img:nth-of-type(3n) {margin: 0 10px 10px 0;}
    .ev_pv-item.nth-2 .img:nth-of-type(2n), .ev_pv-item.nth-2 .img:last-child {margin: 0 0 10px 0;}
}

@media only screen and (max-width: 480px) {
    .ev_pv-item.nth-1 p {font-size: 14px;}
    .ev_pv-item.nth-2 .img, .ev_pv-item.nth-2 .img-wrap .img.logo {width: 100%;}
}


/* 030201-콘트롤 데이터 케이블 */

.cable-top {border: 1px solid #d3d3d3; border-top: 5px solid #00c0f3; margin-bottom: 100px;}
.cable-top .img-wrap {font-size: 0;}
.cable-top .img-wrap > div {display: inline-block; width: 50%;}
.cable-top .img-wrap .text {max-width: 200px;}
.cable-top .img-wrap h4 {font-size: 22px; font-weight: 700; color: #00c0f3; margin-bottom: 15px; position: relative;}
.cable-top .img.nth-1 h4::before {content: ""; width: 115px; height: 20px; background: url('../images/contents/cable-top_line01.png') left center no-repeat; 
    position: absolute; top: 50%; left: 105%;}
.cable-top .img.nth-2 h4::before {content: ""; width: 92px; height: 5px; background: url('../images/contents/cable-top_line02.png') left center no-repeat; 
    position: absolute; top: 50%; right: 105%;}
.cable-top .img.nth-3 h4::before {content: ""; width: 30px; height: 60px; background: url('../images/contents/cable-top_line03.png') left center no-repeat; 
    position: absolute; top: 50%; left: 105%;}

.cable-top .img-wrap p {font-size: 16px; font-weight: 400; color: #00c0f3; line-height: 1.4;}

.cable-top .img-wrap > div {height: 460px;}
.cable-top .img {position: relative;}
.cable-top .img-wrap > div:first-child .img {height: 50%;}
.cable-top .img-wrap .img.nth-1 {border-bottom: 1px solid #d3d3d3; background: url('../images/contents/cable-top_bg01.png') center right no-repeat;}
.cable-top .img-wrap > div:last-child {border-left: 1px solid #d3d3d3; background: url('../images/contents/cable-top_bg03.png') bottom right no-repeat;}

.cable-top .img-wrap .img.nth-1 .text {text-align: right; position: absolute; top: 70px; left: 105px;}
.cable-top .img-wrap .img.nth-2 {background: url('../images/contents/cable-top_bg02.png') bottom left no-repeat;}
.cable-top .img-wrap .img.nth-2 .text {position: absolute; top: 80px; right: 60px;}
.cable-top .img-wrap .img.nth-3 .text {text-align: right; position: absolute; top: 70px; left: 40px;}

.cable-bottom .bg {background: #f5f5f5; padding: 40px 0 120px;}
.cable-item {margin-bottom: 70px;}
.cable-item h4.title {font-family: 'Montserrat', sans-serif; font-size: 22px; font-weight: 500; color: #222; margin-bottom: 30px;}
.cable-item .bg {background: #fff; padding: 60px 50px; font-size: 0;}

.cable-item .img {display: inline-block; width: 25%; height: 100%; vertical-align: top;}
.cable-item .text-wrap {display: inline-block; width: 37.5%; padding-left: 35px;border-left: 1px solid #ededed;}
.cable-item > h4 {display: inline-block; margin-bottom: 25px;}
.cable-item .text-wrap > h4 {display: inline-block; border-bottom: 1px solid #222; color: #222; font-family: 'Montserrat', sans-serif; font-size: 20px; font-weight: 600; margin-bottom: 25px;}
.cable-item .text h4 {display: inline-block; border-bottom: 1px solid #00c0f3; color: #00c0f3; font-size: 20px; font-weight: 600; margin-bottom: 15px;}
.cable-item .text-wrap.nth-1 .text {margin-bottom: 40px;}
.cable-item .text-wrap.nth-1 .text p {font-size: 16px; font-weight: 300; color: #666; margin-bottom: 20px;}

.cable-item .text-wrap.nth-2 .text {margin-bottom: 30px;}
.cable-item .text-wrap.nth-2 .text > div {padding-left: 15px; position: relative;}
.cable-item .text-wrap.nth-2 .text > div::before {content: ""; width: 5px; height: 5px; border-radius: 50%; background: #222; 
    position: absolute; left: 0; top: 16px; transform: translateY(-50%);}
.cable-item .text-wrap.nth-2 .text p {display: inline-block; width: auto; font-size: 16px; font-weight: 300; color: #222; vertical-align: top; line-height: 2;}
.cable-item .text-wrap.nth-2 .text span {font-weight: 500; vertical-align: baseline;}

@media only screen and (max-width: 1400px) {
    .cable-top .img-wrap .img.nth-1 .text {left: 40px;}
    .cable-top .img-wrap .img.nth-2 .text {right: 15px;}
}

@media only screen and (max-width: 1240px) {
    .cable-top .img-wrap .img.nth-1 {background: url('../images/contents/cable-top_bg01.png') center -5% no-repeat;}
    .cable-top .img-wrap .img.nth-2 {background: url('../images/contents/cable-top_bg02.png') bottom no-repeat;}
    .cable-top .img-wrap .img.nth-1 .text {left: 5px;}
    .cable-top .img-wrap .img.nth-3 .text {left: 250px;}
}

@media only screen and (max-width: 1024px) {
    .cable-top .img-wrap > div {width: 100%;}
    .cable-top .img-wrap > div:last-child {border-left: 0; border-top: 1px solid #d3d3d3;}
    .cable-top .img-wrap .img.nth-3 .text {left: 50px;}

    .cable-item .bg {padding: 30px;}
    .cable-item h4.title {font-size: 20px;}
    .cable-item .text h4 {font-size: 18px;}

}

@media only screen and (max-width: 768px) {
    .cable-item .img {width: 60%; margin-bottom: 15px;}
    .cable-item .text-wrap {width: 50%;}
}

@media only screen and (max-width: 640px) {
    .cable-item .img {width: 100%;}
    .cable-item .text-wrap {width: 100%; border-left: 0; padding-left: 0;}
    .cable-item .text-wrap.nth-1 {border-bottom: 1px solid #ededed; margin-bottom: 20px;}
    .cable-item .text-wrap.nth-2 {margin: 20px 0 30px;}
}

@media only screen and (max-width: 480px) {
    .cable-item h4.title {font-size: 18px;}

    .cable-top .img-wrap .img.nth-1 .text {top: 30px; left: 0; max-width: 150px;}
    .cable-top .img-wrap .img.nth-2 .text {top: 130px;}
    .cable-top .img-wrap .img.nth-3 .text {top: 30px; left: 30px;}

    .cable-top .img-wrap > div:last-child {height: 360px; background: url('../images/contents/cable-top_bg03.png') right bottom no-repeat; background-size: cover;}
}



/* 030301-DUALflex */
.dual-item {margin-bottom: 100px;}

.dual-item.nth-1 .img {text-align: center; margin-bottom: 60px;}

.dual-item.nth-2 .img-wrap {font-size: 0;}
.dual-item.nth-2 .img {display: inline-block; width: 25%; height: 300px; margin-right: 12.5%; border-radius: 50%; position: relative;}
.dual-item.nth-2 .img:last-child {margin-right: 0;}
.dual-item.nth-2 .img p {display: inline-block; text-align: center; line-height: 1.4; font-size: 30px; font-weight: 500; color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.dual-item.nth-2 .img.nth-1 {background: #0077b9;}
.dual-item.nth-2 .img.nth-2 {background: #00c0f3;}
.dual-item.nth-2 .img.nth-3 {background: #66dfff;}

.dual-item.nth-3 {margin-top: 150px;}
.dual-item.nth-3 .img-wrap {font-size: 0; position: relative;}
.dual-item.nth-3 .img-wrap::after {content: ""; width: 205px; height: 28px; background: url('../images/contents/test-logo.png') center no-repeat; 
    position: absolute; top: 20px; right: 20px;}
.dual-item.nth-3 .img {display: inline-block; width: 50%; text-align: center;}

.dual-item.nth-4 {background: #f5f5f5; padding: 80px 0;}
.dual-item.nth-4 .inner {font-size: 0;}
.dual-item.nth-4 .img {display: inline-block; width: 33.3333%; text-align: center;}
.dual-item.nth-4 img {margin-bottom: 20px; border: 1px solid #999;}
.dual-item.nth-4 p {font-size: 16px;}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
}



/* 030301-DUALflex의 구성 */

.dual-con-item {margin-bottom: 100px;}

.dual-con-item.nth-1 .top {background: #717174; font-size: 0; position: relative; overflow: hidden;}
.dual-con-item.nth-1 .top .img {display: inline-block; width: 65%;}
.dual-con-item.nth-1 .top::after {content: ""; width: 565px; height: 100%; background: url('../images/contents/dual-con-img.png') center no-repeat; 
    position: absolute; top: 0; right: 0;}
.dual-con-item.nth-1 .top .text {display: inline-block; width: 35%;}
.dual-con-item.nth-1 .top .text p {padding-left: 15px; line-height: 1.4; font-size: 22px; font-weight: 500; color: #fff; position: relative;}
.dual-con-item.nth-1 .top .text p::before {content: ""; width: 5px; height: 5px; border-radius: 50%; background: #fff; position: absolute; top: 15px; left: 0; transform: translateY(-50%);}

.dual-con-item.nth-2 .box {font-size: 0;}
.dual-con-item.nth-2 .wrap {display: inline-block; width: calc(50% - 20px); margin-right: 40px;}
.dual-con-item.nth-2 .wrap .img {border: 1px solid #d3d3d3; width: 100%; }
.dual-con-item.nth-2 .wrap .table th {background: #222; color: #fff;}
.dual-con-item.nth-2 .box > .img {display: inline-block; width: calc(50% - 20px); background: url('../images/contents/dual-con-img02.png') center no-repeat; background-size: cover;}

.dual-con-item.nth-3 .img-wrap {font-size: 0; margin-bottom: 55px;}
.dual-con-item.nth-3 .img-wrap .img {display: inline-block; width: calc(50% - 20px); text-align: center;}
.dual-con-item.nth-3 .img-wrap .img:first-child {margin-right: 40px;}
.dual-con-item.nth-3 .img-wrap .img img {margin-bottom: 25px; box-shadow: 5px 5px 50px rgba(0, 0, 0, 0.1);}
.dual-con-item.nth-3 .img-wrap .img h4 {font-size: 22px; font-weight: 500; color: #222; margin-bottom: 15px;}
.dual-con-item.nth-3 .img-wrap .img p {font-size: 16px; font-weight: 500; color: #222; line-height: 1.4;}

.dual-con-item.nth-3 .box > .img {width: 100%; height: 200px; background: url('../images/contents/dual-con-img05.png') center no-repeat;}

@media only screen and (max-width: 1240px) {
    .dual-con-wrap table.type1 tbody td {padding: 20px 0 20px 20px;}
    .dual-item.nth-2 .img {width: 31%; margin-right: 3.3333%;}
}

@media only screen and (max-width: 1024px) {
    .dual-con-item.nth-1 .top .img, .dual-con-item.nth-1 .top .text {width: 50%; }
    .dual-con-item.nth-1 .top .text p {font-size: 18px;}

    .dual-con-item.nth-3 .img-wrap .img h4 {font-size: 18px;}

    .dual-item.nth-2 .img p {font-size: 24px;}
}

@media only screen and (max-width: 768px) {

    .dual-con-item.nth-1 .top::after {display: none;}

    .dual-con-item.nth-2 .wrap {min-width: auto; width: 100%; margin: 0 0 20px;}
    .dual-con-item.nth-2 .box > .img {width: 100%;}
    .dual-con-item.nth-2 .wrap .img img {width: 100%;}

    .dual-con-wrap table.type1 tbody td {padding: 5px;}

    .dual-con-item.nth-3 .img-wrap .img, .dual-con-item.nth-3 .img-wrap .img:first-child {width: 100%; margin: 0 0 20px;}

    .dual-item.nth-3 .img-wrap::after {width: 130px; height: 18px; background-size: contain;}

    .dual-item.nth-4 img {width: 80%;}
    .dual-con-item.nth-1 .top .text p {font-size: 16px;}

}

@media only screen and (max-width: 640px) {
    .dual-con-item.nth-1 .top .img {width: 100%;}
    .dual-con-item.nth-1 .top .text {width: 100%; padding: 15px;}
}

@media only screen and (max-width: 480px) {
    .dual-item {margin-bottom: 40px;}
    .dual-item.nth-3 {margin-top: 0;}

    .dual-con-item.nth-1 .top .text p {font-size: 14px;}

    .dual-con-item.nth-3 .img-wrap .img h4 {font-size: 16px;}
    .dual-con-item.nth-3 .img-wrap .img p {font-size: 14px;}

    .dual-item.nth-2 .img p {font-size: 14px;}

    .dual-item.nth-3 .img {width: 100%; margin: 0 0 40px;}

    .dual-item.nth-4 .img {width: 100%; margin-bottom: 40px;}
    

}



/* 030303-DUALflex Series */

.ds-item {margin-bottom: 100px;}
.ds-item .img-wrap {font-size: 0;}
.ds-item .img-wrap .img {display: inline-block; width: calc(50% - 20px); margin: 0 40px 0 0;}
.ds-item .img-wrap .table {display: inline-block; width: calc(50% - 20px); vertical-align: top;}

.ds-item.nth-2 .img-wrap::after {display: block; content: ""; clear: both;}
.ds-item.nth-2 .img-wrap .img {float: right; margin: 0 0 0 40px;}
.ds-item.nth-2 .img-wrap .table {float: left;}

@media only screen and (max-width: 1024px) {
    .ds-item .img-wrap .img {width: 100%; margin: 0 0 20px 0;}
    .ds-item .img-wrap .img img {width: 100%;}

    .ds-item.nth-2 .img-wrap .img {float: inherit; margin: 0 0 20px 0;}

    .ds-item .img-wrap .table {width: 100%;}
}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
}


/* 030304-관련법령 */

.law-item {margin-bottom: 100px;}

.law-wrap .title-wrap p {font-size: 16px; font-weight: 300; line-height: 1.4; margin-top: 10px; padding: 0; margin: 0;}
.law-wrap .title-wrap {margin-bottom: 35px;}

.law-item.nth-1 .img img:nth-of-type(2) {display: none;}

.law-wrap .table .col1 {width: 20%;}
.law-wrap .table table tbody td, .law-wrap .table table tbody th {padding: 10px 5px;}

.law-wrap .img-wrap {font-size: 0;}
.law-wrap .img-wrap .img {display: inline-block; width: calc(50% - 20px); text-align: center; margin-bottom: 10px;}
.law-wrap .img-wrap .img:first-child {margin-right: 40px;}
.law-wrap .img-wrap .img p {font-size: 16px; font-weight: 500; color: #666; margin-top: 10px;}

@media only screen and (max-width: 768px) {
}

@media only screen and (max-width: 480px) {
    .law-item.nth-1 .img img:nth-of-type(1) {display: none;}
    .law-item.nth-1 .img img:nth-of-type(2) {display: block; width: 80%; margin: 0 auto;}

    .law-wrap .img-wrap .img {width: 100%; margin-right: 0;}
    .law-wrap .img-wrap .img:first-child {margin-bottom: 20px;}
}


/* 050101-제품문의 */
.inquiry-wrap {border: 1px solid #d3d3d3; border-top: 2px solid #10bff1; padding: 50px 40px 40px; position: relative;}
.inquiry-wrap .img {display: inline-block; width: 25%; height: 220px; margin-right: 20px; background: url('../images/contents/inquiry-img.png') bottom center no-repeat; background-size: contain;}
.inquiry-wrap .text-wrap {display: inline-block; width: calc(74% - 20px);}
.inquiry-wrap .text-top {padding: 0 0 60px; line-height: 1.4;}
.inquiry-wrap .text-top h4 {font-size: 20px; font-weight: 400; margin-bottom: 20px;}
.inquiry-wrap .text-top p {display: inline-block; font-size: 16px; font-weight: 400;}
.inquiry-wrap .text-top span {vertical-align: baseline; font-weight: 700;}
.inquiry-wrap .text-top span.blue {color: #10bff1;}

.inquiry-wrap .text-bottom {border-top: 2px dotted #10bff1; padding-top: 30px;}
.inquiry-wrap .text-bottom p {display: inline-block; position: relative; font-size: 20px; font-weight: 400; width: 33%;}
.inquiry-wrap .text-bottom p:nth-of-type(2) {text-align: center;}
.inquiry-wrap .text-bottom p:nth-of-type(2)::before {content: ""; width: 1px; height: 90%; background: #d3d3d3; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.inquiry-wrap .text-bottom p:nth-of-type(2)::after {content: ""; width: 1px; height: 90%; background: #d3d3d3; position: absolute; top: 50%; right: 4%; transform: translateY(-50%);}
.inquiry-wrap .text-bottom p:last-child {text-align: right;}
.inquiry-wrap .text-bottom span {vertical-align: bottom; font-weight: 700;}


@media only screen and (max-width: 1400px) {
    .inquiry-wrap .text-bottom p {font-size: 18px;}
}

@media only screen and (max-width: 1240px) {
    .inquiry-wrap .text-bottom p:nth-of-type(1), .inquiry-wrap .text-bottom p:nth-of-type(2) {width: 31%;}
    .inquiry-wrap .text-bottom p:nth-of-type(3) {width: 35%;}
    .inquiry-wrap .text-bottom p {font-size: 16px;}
    .inquiry-wrap {padding: 50px 20px 40px;}
    .inquiry-wrap .img {position: absolute; top: 25px; left: 20px; margin: 0; height: 160px;}
    .inquiry-wrap .text-wrap {width: 100%;}
    .inquiry-wrap .text-top  {padding: 0 0 60px 33%;}
    .inquiry-wrap .text-top h4 {font-size: 18px;}
    .inquiry-wrap .text-bottom, .inquiry-wrap .text-bottom p:last-child {text-align: center;}
}

@media only screen and (max-width: 768px) {
    .inquiry-wrap .img {width: 40%; top: 10px; left: 50%; transform: translateX(-50%);}
    .inquiry-wrap .text-top {padding: 150px 0 30px;}
    .inquiry-wrap .text-bottom p:nth-of-type(1) {width: 100%; margin-bottom: 10px;} 
    .inquiry-wrap .text-bottom p:nth-of-type(2) {width: 44%;}
    .inquiry-wrap .text-bottom p:nth-of-type(3) {width: 55%;}
    .inquiry-wrap .text-bottom p:nth-of-type(2)::before {display: none;}
}

@media only screen and (max-width: 640px) {
    .inquiry-wrap .text-top h4 {font-size: 16px;}
}

@media only screen and (max-width: 480px) {
    .inquiry-wrap.inner {margin: 0;}
    .inquiry-wrap .img {width: 80%;}
    .inquiry-wrap .text-bottom p:nth-of-type(2) {margin-bottom: 10px;}
    .inquiry-wrap .text-bottom p:nth-of-type(2)::after {display: none;}
    .inquiry-wrap .text-bottom p:nth-of-type(2), .inquiry-wrap .text-bottom p:nth-of-type(3) {width: 100%;}
}