/*font----------------------------------------------------------------------

font-family: 'Lato', sans-serif;
font-family: 'Spoqa Han Sans', 'Spoqa Han Sans JP', 'Sans-serif';
font-family:'MalgunGothic';

----------------------------------------------------------------------*/
.container {padding: 0!important;}
.ourworks {background: url('ourworks_bg.jpg') left top no-repeat; background-size: cover;}
.ourworks .container .about-area {
    display: flex;
    justify-content: space-between;
}
.main-btns {
    box-shadow: 1px 1px 5px rgb(0,0,0,0.2);
    background-color: #fff;
}

.main-btns ul li:nth-child(n+2) {
    padding: 0px 30px;
}
.main-btns ul li:nth-child(3) {
    padding-top: 15px;
    padding-bottom: 35px;
}

.sc04_visual .main_title h1,.sc04_visual .main_title p {color: #fff!important;}
.sc04_visual {
    padding: 80px 0 70px!important;
    min-height: 650px;
    background-size: cover;
    background: url('sc04_bg.jpg') center center no-repeat;
    background-size: cover;
    color: #fff;
    padding: 0;
}
.sc04_visual button.slick-prev.slick-arrow {
    background: url(prev-btn.png) center center no-repeat;
    left: -10%;
}
.sc04_visual .slick-prev.slick-arrow {
    background: url(prev.png) center center no-repeat;
}
.sc04_visual button.slick-next.slick-arrow {
    background: url(next-btn.png) center center no-repeat;
    right: -10%;
}
.sc04_visual .slick-arrow {
    position: absolute;
    top: 40%;
    font-size: 0;
    text-indent: -9999px;
    width: 54px;
    height: 54px;
    border: none;
    box-shadow: none;
    opacity: 0.7;
    transition: all 0.5s;
}
.sc04_visual .slick-arrow:hover {opacity: 1;}
.sc04_visual .product-flex {
    display: flex;
}
.sc04_visual .product-cont {
    width: 475px;
    height: 348px;
    padding: 70px 20px 0px 50px;
}
.sc04_visual .product-cont h1 {
    font-size: 28px;
    font-weight: 600;
    color: #292929;
    line-height: 1.3;
    margin: 0;
}
.sc04_visual .product-cont p {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.5px;
    color: #666666;
    line-height: 1.5!important;
    padding: 10px 0 40px;
    font-family: 'Spoqa Han Sans'!important;
}
.sc04_visual .product-cont a {
    font-family: 'Spoqa Han Sans'!important;
    font-size: 14px;
    font-weight: 400;
    color: #808080;
    border: 1px solid #dadada;
    padding: 15px 35px 15px;
    transition: all 0.5s;
    text-transform: uppercase;
}
.sc04_visual .product-cont a:hover {background-color: #0e4798; color: #fff;}
.sc04_visual .slick-list {box-shadow: 1px 1px 10px rgba(0,0,0,0.5);background-color: #fff;}
.sc04_visual .slick-dots {
    display: flex!important;
    justify-content: center;
    margin: 25px 0 0!important;
}
.sc04_visual .slick-dots li button {
    text-indent: -9999px;
    width: 0;
    height: 0;
    display: block;
    padding: 6px;
    border-radius: 50%;
    border: none;
    margin: 7px;
    opacity: 0.5;
    transition: all 0.5s;
}
.sc04_visual .slick-dots  .slick-active button {
    opacity: 1;
}
.onlines {background-color: #f7f7f7; padding: 40px 0;}
.onlines img {
    border: 1px solid #e1e1e1;
}

.gmap-divs {
    border-top: 1px solid #dcdcdc;
}
.ft-top {
    max-width: 1170px;
    display: flex;
    justify-content: space-between;
    padding: 50px 0!important;
    margin: auto;
}
.ft-tit {
    font-family: 'Roboto'!important;
    font-size: 24px;
    font-weight: 500;
    color: #e8e7e7;
    margin: 0 0 40px;
}
.ft-bottom {
    background-color: #121212;
    text-align: center;
    padding: 10px 0;
}
.ft-top li {
    font-family: 'MalgunGothic','Noto Sans KR', 'Roboto', sans-serif !important;
    font-size: 15px;
    color: #9e9e9e;
    line-height: 2.5;
}
.ft-top li span:last-child::after {
    display: none;
}
.ft-top li span::after {
    content: "/";
    position: absolute;
    top: -8px;
    right: -3px;
}
.ft-top li span {
    position: relative;
    padding: 0px 10px;
    letter-spacing: -0.02em;
}
.ft-top li span:first-child {
    padding-left: 0;
}
.ft-top li span b {font-weight: 400;}
.ft-right li {
    letter-spacing: -0.8px;
}
.ft-right .tel {
    line-height: 1.8;
}
.tel a {
    position: relative;
    font-size: 28px;
    font-weight: 600;
    letter-spacing: 0;
    color: #0073bf;
    padding-left: 40px;
    transition: all 0.5s;
}
.tel a::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    width: 26px;
    height: 23px;
    background: url(../img/tel.png) center no-repeat;
}
.ft-bottom .copy {
    font-family: 'MalgunGothic','Noto Sans KR', 'Roboto', sans-serif !important;
    font-size: 14px;
    color: #6f6969;
    letter-spacing: 0.2px;
    margin: 0;
    text-transform: uppercase;
}
.ft-bottom .copy span {
    padding-left: 10px;
}
.ft-bottom .copy span a {
    color: #6f6969;
}

ul.topmenu {
    max-width: 1170px;
    margin: 0 auto!important;
    display: flex;
    justify-content: flex-end;
}
#head-area {background-color: #0e4798;}
ul.topmenu a {
    display: block;
    font-size: 13px;
    color: #fff;
    font-weight: 300;
    position: relative;
    padding-left: 10px;
    margin-left: 10px;
}
ul.topmenu a::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 0;
    width: 1px;
    height: 10px;
    background-color: #fff;
}
ul.topmenu li:first-child a::before {
    display: none;
}

.main-btns {
    box-shadow: 1px 1px 5px rgb(0 0 0 / 20%);
    background-color: #fff;
    width: 369px;
}
.sc04_visual .slick-list {max-height: 348px;}
/*-----------------------------------------------------------------------

서브페이지

-----------------------------------------------------------------------*/
.small-img {display: none;}
.formmail_title_bgcolor {background-color: #fff!important;}
.confrim-box {
    display: flex;
    justify-content: center;
}
.confrim-box a {
    display: block;
    border: 1px solid #ddd;
    padding: 10px 80px;
    transition: all 0.5s;
}
.confrim-box a:first-child {
    background-color: #0e4798;
    color: #fff;
}
.confrim-box a:first-child:hover {opacity: 0.8;}
.confrim-box a:last-child {
    background-color: #ddd;
    color: #333;
}
.confrim-box a:last-child:hover {
    background-color: #f0f5f7;
    color: #000;
}
.inner-cont .board_bgcolor span,input#border,#post_area,#post_area span {
    font-size: 16px !important;
    font-family: 'Noto Sans KR', 'Roboto', sans-serif !important;
}
.board_bgcolor {background-color: rgba(255,255,255,0) !important; text-align: center!important;
    min-width: 100px;}
.inner-cont {
    border-top: 1px solid #666!important;
}

.inner-cont > tbody > tr > td {
    padding: 10px;
}
.inner-cont > tbody > tr > .board_bgcolor {position: relative;}
.inner-cont > tbody > tr > .board_bgcolor::after {
    content: "";
    position: absolute;
    width: 1px;
    height: 15px;
    top:16px;
    right: 0;
    background-color: #666;
}

.inner-cont > tbody > tr > .board_desc {
    padding-left: 30px!important;
}
table.list-view {
    border-top: 1px solid #ddd!important;
}
table.board.qalist .att_title {position: relative;}
table.board.qalist .att_title::after {
    content: "";
    position: absolute;
    top: 16px;
    right: 0;
    width: 1px;
    height: 15px;
    background-color: #666;
}
table.board.qalist .att_title:last-child::after {display: none;}
.bbsnewf5 a {padding-left: 10px!important;}
.bbsnewf5 a:hover {color: #0e4798!important;}

.map-container {
/*    position: relative;*/
    height: 500px;
    margin-bottom: 100px;
    background-color: #f4f4f4;
    box-shadow: 40px 40px 50px -40px rgb(0,0,0,0.2);
    z-index: 5;
}
.map-adress {
    min-height: 170px;
}
.company-cnt iframe {
    height: 100%;
}
.col-heading h3 {
    font-size: 38px;
    font-weight: 300;
    color: #333;
    line-height: 1.3;
    transition: color 0.2s;
}
.col-info dl {
    padding: 40px 70px 32px;
    border-top: 1px solid #555;
    border-bottom: 1px solid #e5e5e5;
    transition: border-color 0.2s;
}
.col-info dl dt {
    clear: left;
    float: left;
    min-width: 110px;
    font-weight: normal;
    color: #333;
}
.col-info dl dd {
    margin-left: 120px;
    color: #777;
}
a {transition: all 0.5s;}
.col-info dl dd a {color: #777;}
.col-info dl dd a:hover {color: #0e4798;}
.col-info dl dt, .col-info dl dd {
    line-height: 1.7;
    margin-bottom: 8px;
    transition: color 0.2s;
}
.formmail_border,.sub-body-cn .formmail_cell_bgcolor textarea { font-family: 'Noto Sans KR', 'Roboto', sans-serif !important; font-size: 15px !important; width: 98%;}

.cont-sec {
    margin-bottom: 80px;
}
.cont-sec:last-child {
    margin-bottom: 0;
}
.txt-wrapper h4 {
    font-size: 1.3em;
    color: #0e4798;
    position: relative;
    font-weight: 500;
    padding-left: 15px;
    margin-bottom: 15px;
}
.txt-wrapper h4::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 4px;
    height: 19px;
    background-color: #0e4798;
    border-radius: 50px;
}
.flex-wrapper {
    display: flex;
    align-items: center;
}

ul.sub-intro-products.flex-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
}
.sub-intro-products {
    border: 1px solid #ddd;
    padding: 40px 30px!important;
}
.sub-intro-products li {
    width: 50%;
    margin-bottom: 20px;
}
.sub-intro-products li:nth-child(n+5) {
    margin-bottom: 0;
}
.product-list .pro-tit {
    margin-bottom: 7px;
}
.sub-intro-products li p {
    line-height: 1.3!important;
}
.product-list {
    padding: 0px 30px;
}
.txt-wrapper .list li {
    padding-left: 15px;
    position: relative;
}
.txt-wrapper .list li::before {
    content: "";
    position: absolute;
    top: 13px;
    left: 0px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #0e4798;
}
.sub-intro-products img {
    min-width: 163px;
}
/*
.sub-products .flex-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
}
.sub-products .flex-wrapper .txt-wrapper {
    width: 49%;
    margin: 0px 0 50px;
}
.sub-products .cont-tit {
    font-size: 1.2em;
    letter-spacing: -0.6px;
}
.sub-products .cont-tit::before {
    height: 16px;
}
.product-ex p {
    line-height: 1.4!important;
    margin: 15px 0 0;
}
.sub-products .sub-intro-products {
    min-height: 541px;
}
*/

#sub-body table {
    width: 100%;
}
#sub-body .sub-products table th, #sub-body .sub-products table td {
    border-bottom: 1px solid #ddd!important;
}
#sub-body .sub-products table td {
    color: #696969!important;
    line-height: 1.5;
    font-weight: 300;
}
#sub-body .sub-products table th {
    text-align: center;
    font-weight: 400;
    line-height: 1.5;
    color: #333;
    position: relative;
}
#sub-body .sub-products table tr:first-child{border-top: 2px solid #333;}
#sub-body .sub-products table th::before {
    content: "";
    position: absolute;
    top: 52px;
    right: 0;
    transform: translateY(-30px);
    width: 1px;
    height: 60px;
    background-color: #666;
}

#sub-body .sub-products table th:last-child::before {
    display: none;
}
.product1 td img {
    max-height: 130px;
    min-height: 100px    
}
.product1 td p {
    padding: 0 30px;    margin: 0;
}
.product1 th {
    padding: 0 10px;
}

.product2 td {
    border: 1px solid #ddd!important;
    padding: 10px 15px;
}
.product2 td span {
    display: block;
    font-size: 0.895em;color: #999;
}
.product2 td:nth-child(n+2) {
    width: 15%;
}
.product2 .td10 td {padding: 10px!important;}
.product2 .td10 td:nth-child(n+2) {
    width: 9%;
}
.product2 .td9 td:nth-child(n+2) {
    width: 10.4%;
}
.product2 .td6 td:nth-child(n+2) {
    width: 13.9%;
}
.product2 .td9-2 td:nth-child(n+2) {
    width: 9.9%;
}
.product2 .td7 td {
    width: 14.24%;
}
.product2 .etc td {text-align: center;}
.product2 td img {max-width: 265px;}
.product3 img {max-width: 351px;}
#sub-body .product3 table th {
    padding: 4px 0;
    height: 52px!important;
}
#sub-body .product3 table th:nth-child(1) {
    padding: 0!important;
    width: 30%;
}
#sub-body .product3 table th:nth-child(1)::before {
    display: none;
}
#sub-body .product3 table th::before {
    height: 20px;
    top: 45px;
}
#sub-body .product3 table td {text-align: center;}
#sub-body .product3 table td ul {
    display: inline-block;
    text-align: left;
}
.product3 li h1 {
    font-size: 17px;
    color: #333;
    text-decoration: underline;
    margin: 0 0 1px;
}
.col-info .clearfix.eng {
    padding: 10px 0px;
}




/*-----------------------------------------------------------------------

반응형

-----------------------------------------------------------------------*/
@media (max-width: 1199px){
    
    .contains {max-width: 100%;}
    .head-text {top: 30%!important;}
    .sc04_visual button.slick-next.slick-arrow {right: 0%;}
    .sc04_visual button.slick-prev.slick-arrow {left: 0%; z-index: 1;}
    .ourworks .container .about-area .main-btns {width: 32%;}
    .main-btns ul li,.product3 li h1,td, td font,.bbsnewf5 a:link,.inner-cont .board_bgcolor span, input#border, #post_area, #post_area span,.formmail_border, .sub-body-cn .formmail_cell_bgcolor textarea {font-size: 1em!important;}
    .main-btns ul li br {display: none!important;}
    .sc04_visual .product-flex li {height: auto;}
    .sc04_visual .product-cont {padding: 50px 0px 0px 40px;}
    .sc04_visual .product-cont p {padding: 10px 0 20px;}
    .ft-top {display: block; max-width: 90%;}
    .ft-left {margin-bottom: 50px;}
    .ft-tit {margin: 0 0 20px;}
     #sub-body .sub-products table td {font-size: 0.985em!important;}
    .product2 td, .product2 .td6 td, .product2 .td10 td,.product2 .td9 td,.product2 .td9-2 td {padding: 0px!important;}
}
@media (max-width: 991px){
    .container {width: 90%!important;}
    .sc04_visual .slick-list {max-width: 80%; margin: auto!important;}
    .sc04_visual .product-flex {display: block;}
    .sc04_visual .product-cont h1 br, .sc04_visual .product-cont p br, .head-text p br {display: none!important;}
    .sc04_visual .product-flex li {width: 100%; text-align: center;}
    .sc04_visual .product-cont {padding: 50px 20px;}
    .sc04_visual .product-cont h1 {font-size: 2em;}
    .company-cnt h5 {font-size: 1em;}
    .sub-intro-products li p {font-size: 0.895em!important;}
    .product-list {padding: 0px 15px;}
    .map-adress {min-height: 270px;}
    .company-cnt.sub-products.product2 table tr:nth-child(1) td:nth-child(1) {max-width: 150px!important;}
    .product2 td img,.product3 img {max-width: 100%;}
    .product1 td p {padding: 0 15px;}
    #sub-body .product3 table th {padding: 0;    height: 30px!important;}
    #sub-body .product3 table th::before {height: 15px;    top: 37px;}
    #sub-body .product3 .cont-sec:last-child table td ul li:nth-child(6) {display: none;}
    .sub-products ul li {line-height: 1.3;}
    .sc04_visual .slick-list {max-height: 100%;}
}


@media screen and (max-width: 600px){
    
    body, p {
        font-size: 14px !important;
    }
    
    .ourworks .container .about-area {display: block;}
    .ourworks .container .about-area .main-btns {width: 100%;}
    .sc04_visual .product-cont h1 {font-size: 1.4em; letter-spacing: -0.5px;}
    .sc04_visual .product-cont a {padding:10px 35px 10px;}
    .sc04_visual .product-cont {padding: 30px 10px;}
    .sc04_visual .slick-arrow {display: none!important;}
    .ft-top li {font-size: 0.9em; line-height: 1.8;}
    .ft-bottom .copy {
        max-width: 90%;
        font-size: 0.9em!important;
        margin: auto;
        letter-spacing: 0;
    }
    #slider-logo .slide-area {padding: 0 3px;}
    .flex-wrapper {flex-wrap: wrap;}
    .sub-intro-products li {
        width: 100%;
        text-align: center;
    }
    .txt-wrapper>.sub-intro-products.flex-wrapper {
        flex-wrap: wrap;
        justify-content: center;
    }
    ul.sub-intro-products.flex-wrapper li .flex-wrapper {display: block;}
    .product-list {
        padding: 0;
        margin: 10px 0;
    }
    .sub-body-cn h2.page_title {font-size: 1.5em!important;}
    .txt-wrapper h4 {font-size: 1.2em!important;}
    .col-info dl {padding: 10px 10px 10px;}
    .col-info dl dt {min-width: 60px;}
    .col-info dl dd {margin-left: 70px;}
    .map-container {margin-bottom: 50px;}
    #sub-body .sub-products table td {font-size: 0.8em!important;}
    .product1 th {padding: 0;}
    .product1 td img {
        max-height: 100%;
        min-height: auto;
    }
    .company-cnt.sub-products.product2 table tr:nth-child(1) td:nth-child(1) {display: none;}
    .small-img {display: block;}
    #sub-body .company-cnt.sub-products.product2 .td10 td,#sub-body .company-cnt.sub-products.product2 .td9 td,#sub-body .company-cnt.sub-products.product2 .td9-2 td {
        font-size: 6px!important;
        max-width: 36px!important;
    }
    #sub-body .product3 table th:nth-child(1) {display: none;}
    .sub-products ul li {padding: 0 10px;}
    .qalist td.bbsnewf5 {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 200px;
    }
    .list-view .bbsnewf5 {min-width: 300px;}
    .confrim-box a {padding: 10px 50px;}

}