/*font-family: 'Lato', sans-serif;*/
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {padding: 0;}
.container {max-width: 1200px; padding: 0;}
#head-area {border-top: 7px solid #00a3d9;}
a {transition: all 0.5s;}
.row {margin: 0 auto;}
.ourworks.products {
    background:#f2f2f2 url(adv_divs.jpg) left top no-repeat;
    background-size: contain;
    padding: 55px 0;
}
.ourworks.products .htitle {margin: 0px auto 30px;}
.ourworks.products .htitle h1 {
    float: left;
    min-width: 25%;
    font-family: 'Lato'!important;
    color: #fff;
    font-size: 42px;
    font-weight: 900;
}
.ourworks.products .htitle p {
    font-size: 18px!important;
    letter-spacing: -0.02em;
    color: #fff;
    font-weight: 300;
    line-height: 1.5!important;
}
.ourworks.products .row {
    justify-content: space-between;
}
.ourworks.products .row:nth-child(2) > div {
    max-width: 288px;
}
.ourworks ul {
    background-color: #fff;
    padding-bottom: 20px!important;
}
.carousel-control-prev {justify-content: flex-start;}
.carousel-control-next {justify-content: flex-end;}
.footer_mn {
    background-color: #383f43;
}
.footer_mn .row {text-align: center; justify-content: center;}
.footer_mn .row a {
    color: #fff;
    font-size: 14px;
    letter-spacing: -0.04em;
    font-weight: 300;
    padding: 15px 10px!important;
    display: block;
}
.footer_mn .row a:hover {background-color: #222; color: #00a3d9;}
.footersubarea {
    text-align: center;
    width: 100%;
}
.ft-logo {
    margin-bottom: 10px!important;
}
#footerarea ul span,#footerarea ul span b {
    font-size: 14px;
    font-weight: 300;
    line-height: 1.5;
}

.main-nav > ul > li ul li a {text-transform: capitalize;}


/*서브페이지-----------------------------------------------------------------*/
.subcontxt .flow-list h5 {
    line-height: 1.2!important;
    letter-spacing: -0.05em;
    margin-top: 10px!important;
    text-transform: capitalize;
}
.submn {
    background-color: #ededed;
    border-bottom: 1px solid #ddd;
}
#subtitbg h2 {text-shadow: 1px 1px 5px #666;}
#subarea .container {max-width: 1100px;}
.point {color: #00a3d9!important;    letter-spacing: -0.03em;}
.subcontxt h4 strong {
    font-size: 1.4em;
    font-weight: 600;
}
.img-wrapper img {
    border: 1px solid #dfdfdf;
}
p strong {
    font-size: 1.25em;
    letter-spacing: -0.03em;
}

.subcontxt p {margin-bottom: 0.5rem;}
.sign {
    color: #333;
    text-align: right;
    font-size: 1.1em;
    position: relative;
    padding-right: 100px;
}
.sign span {
    font-size: 1.5em;
    letter-spacing: 0.3em;
    padding-left: 5px;
}
.sign img {
    position: absolute;
    right: 0;
    top: -5px;
}
.intro {
    text-align: center;
}
.intro h4 {
    line-height: 2!important;
    font-weight: 400;
}
h4 b {
    font-weight: 600;
}
.subcontxt table {
    width: 100%;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
}
.subcontxt table th, .subcontxt table td {padding: 8px;}
.subcontxt table td {font-weight: 400; padding-left: 20px; color: #666;}

.subcontxt table tr {
    border-bottom: 1px solid #ddd;
}
.subcontxt table tr:last-child {border: none;}
.col-md-12.logo {
    text-align: center;
}
.his_list .his_box h3 {font-size: 2em; font-weight: 400; font-family: 'Lato'!important; margin-bottom: 0!important;}

.subcontxt .his_box p {
    margin: 0;
}

.his_list ul li {position: relative;}
.h_cons {color: #888788;}

.cont-1 {
    border: 1px solid #ddd;
    padding: 50px 0 40px;
}

.txt-wrapper {
    text-align: center;
    background-color: #f7f7f7;
    padding: 30px 50px;
}

.cont-wrapper h4 {
    position: relative;
    padding-left: 20px;
    margin: 0 0 10px!important;
}
.cont-wrapper h4::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    top: 17px;
    left: 0;
    background-color: #353535;
    transform: rotate(45deg);
}
.img-wrap img {
    padding: 10px;
}

.txt-wrapper > ul {
    display: inline-block;
}
.txt-wrapper ul > li {
    text-align: left;
}
.txt-wrapper ol {
    padding: 0;
}
ol li {
    text-decoration: none!important;
    list-style: none;
}
.txt-wrapper ol {
    display: flex;
    flex-wrap: wrap;
    max-width: 960px;
    margin: auto;
}
.txt-wrapper ol > li {
    max-width: 180px;
    margin: 30px 30px 0;
}
.txt-wrapper ol ul li p {
    line-height: 1.3!important;
    font-size: 0.985em!important;
}
.txt-wrap {
    text-align: center;
    padding: 0 50px;
}
.rnd .cont-1 .txt-wrap .pbrnone {
    background-color: #f7f7f7;
    padding: 30px 38px;
    margin-top: 20px;
    text-align: left;
}
.txt-wrapper p {
    max-width: 915px;
    margin: auto;
}
.cs-center .subcontxt.cont-1 {
    align-items: center;
}

.cs-center .subcontxt h5 {
    position: relative;
    padding-bottom: 5px;
    margin-bottom: 15px!important;
    font-size: 1.3em;
}
.cs-center .subcontxt h5::after {
    content: "";
    width: 85px;
    height: 3px;
    background-color: #333;
    position: absolute;
    left: 0;
    bottom: 0;
}
.cs-center dl {
    margin: 0;
}
.cs-center dd a {
    font-size: 1.5em;
    font-family: 'Lato'!important;
    color: #333;
    font-weight: 700;
}
.cs-center dd a:hover {color: #00a3d9;}
.cs-center .img-wrapper {
    text-align: right;
}
.cs-center img {
    max-width: 350px;
    border: none;
}

.map .add-area {
    border-top: 1px solid #333;
    border-bottom: 1px solid #ddd;
    padding: 30px 50px;
    margin-bottom: 30px;
}
.map .subcontxt {margin-bottom: 80px;}
.map .subcontxt:last-child {margin-bottom: 0px;}
.map .add-area dl {margin: 0;} 
.map .add-area dt {
    font-size: 1.1em;
    font-weight: 500;
    color: #222;
    float: left;
    min-width: 70px;
}
.map .add-area2 dt {min-width: 170px!important;}
.map .add-area dd {
    font-size: 1.1em;
}
.map .add-area dd:last-child {margin: 0;}
.recruit ol {
    padding-left: 40px;
}
.recruit ol li {
    list-style: decimal;
}
.recruit h5 {
    margin-bottom: 10px!important;
    font-size: 1.2em;
    font-weight: 500;
}
.recruit li {
    font-size: 15px;
    line-height: 1.8;
}
.recruit ul {
    padding-left:40px!important;
}
.recruit ul li {
    list-style: circle!important;
}
.recruit .img-wrap {
    background-color: #f7f7f7;
    margin-top: 20px;
}
.recruit .point {
    color: #222!important;
    font-weight: 600;
    background-color: #f7f7f7;
    text-align: center;
    display: block;
    padding: 15px 50px;
    margin: 0px 0 20px;
}
.recruit .row {
    align-items: center;
}
.recruit h4 {
    font-size: 1.3em;
    text-align: center;
}
.recruit .col-md-10 {
    padding: 0 40px;
}
.recruit .container > div > .col-md-12 > .row {
    align-items: center;
    border-bottom: 1px solid #ddd;
    padding: 50px 0px;
}
/*.recruit .container > div > .col-md-12 > .row:last-child {border: none; padding: 0;}*/
.recruit .container > div > .col-md-12 > .row:first-child {border-top: 1px solid #333;}
.recruit .intro h4 {
    font-size: 2.1em;
    color: #fff;
    text-shadow: 1px 1px 5px #333;
}
.recruit .intro {
    background: url(m04_p02-01.jpg) center center no-repeat;
    padding: 160px 0;
    margin-bottom: 50px;
}

.bbsnewf5 a:hover {color: #00a3d9!important;}
.img2 {
    margin: 0 auto 30px;
    width: 100%;
    text-align: center;
}
.qalist td.att_title font {
    font-size: 15px!important;
    color: #666!important;
}
.qalist > tbody > tr:first-child {
    border-top: 1px solid #ccc;
}
.cont-wrap .txt-wrap p {
    font-size: 1.15em!important;
    color: #323232;
    text-align: left;
    letter-spacing: -0.02em;
    font-weight: 500;
}
td.paging b {
    color: #00a3d9!important;
    font-weight: 500!important;
}
.paging a {font-family: 'Noto Sans KR', 'Roboto', sans-serif !important;}
.recruit h3 {
    margin-bottom: 5px!important;
    position: relative;
    padding-left: 13px;
    font-size: 24px;
    font-weight: 600;
    color: #333;
}

.recruit h3::before {
    content: "";
    width: 4px;
    height: 21px;
    border-radius: 5px;
    background-color: #333;
    position: absolute;
    top: 12px;
    left: 0;
}
.qalist td.bbsnewf5 {
    max-width: 450px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.cont-wrap .txt-wrap {
    border: 1px solid #ddd;
    padding: 30px 70px 20px;
}


.arr {
    position: relative;
}
.arr::after {
    content: "";
    position: absolute;
    top: 30%;
    right: -35px;
    width: 0px;
    height: 0px;
    border-top: 15px solid transparent;
    border-left: 15px solid #00a3d9;
    border-right: 15px solid none;
    border-bottom: 15px solid transparent;
}
li.arr.\33 -2-1::after,li.arr.\33 -2-2::after {
    border-top: 15px solid transparent;
    border-left: 15px solid #78bc27;
    border-right: 15px solid none;
    border-bottom: 15px solid transparent;
}
.line {
    position: relative;
}
.line::after {
    content: "";
    position: absolute;
    top: 0;
    right: -31px;
    width: 2px;
    height: 100%;
    background-color: #888788;
}


.subcontxt .img-wrap a img {
    padding: 0;
}
.subcontxt .img-wrap a {
    position: relative;
    display: inline-block;
    border: 1px solid #ddd;
}
.subcontxt .img-wrap a:hover {
    border-color:  #00a3d9;
}
.subcontxt .img-wrap a::before {
    content: "+";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #00a3d9;
    color: #fff;
    line-height: 47px;
    font-size: 2em;
    text-align: center;
    transform: translate(-25px, -25px);
    opacity: 0;
    transition: all 0.5s;
}
.subcontxt .img-wrap a:hover::before  {opacity: 0.8;}
.subcontxt h6 {
    font-size: 1.05em;
    color: #444;
    line-height: 1.5!important;
}


.products .subcontxt th, .products .subcontxt td {
    border: 1px solid #ddd!important;
    padding: 10px;
}
.products .subcontxt th {
    background-color: #999;
    color: #fff;
    font-weight: 400;
}
.products .subcontxt td {
    background-color: #fff;
    font-weight: 300;
}

.txt-wrap.row {
    align-items: center;
}

.rnd .txt-wrap.row {
    padding: 0;
}
.txt-wrapper > ul li {font-size: 16px;}
td.board_bgcolor font {
    font-size: 15px!important;
    color: #333!important;
}
div#post_area {
    font-size: 1.1em;
}
table.board {
/*    border-top: 1px solid #00a3d9;*/
}
td.board_desc {
    padding: 10px 20px;
}
.recruit .container > div.wow {
    margin-bottom: 80px!important;
}
.txt-wrap.col-md-6 ul {
    padding-top: 15px!important;
    max-width: 80%;
    margin: auto!important;
}
.txt-wrap.col-md-6 ul {
    padding-top: 15px!important;
    display: inline-block;
}
.txt-wrap.col-md-6 ul li {
    text-align: center;
}


.company-cont td li {
    line-height: 1.7;
}







/*반응형-서브페이지-----------------------------------------------------------------*/

@media only screen and (max-width: 1200px) {
    
    #subarea .container {max-width: 96%;}
    .subcontxt table th {white-space: nowrap;}
    
    .products .txt-wrapper {padding: 30px 10px;}
    
    .rnd .img-wrap.col-md-7 {white-space: nowrap;}
    .rnd .txt-wrap.row {justify-content: space-between;}
    .company-cont td li {line-height: 1.5;}
}


@media only screen and (max-width: 811px) {
    
    .submn {background: none; border: none;}
    .submn1 .submn li:nth-child(1) a{background-color : #fff;}
    .submn2 .submn li:nth-child(2) a{background-color : #fff;}
    .submn3 .submn li:nth-child(3) a{background-color : #fff;}
    .submn4 .submn li:nth-child(4) a{background-color : #fff;}
    .submn5 .submn li:nth-child(5) a{background-color : #fff;}
    .submn6 .submn li:nth-child(6) a{background-color : #fff;}
    .submn7 .submn li:nth-child(7) a{background-color : #fff;}
    .submn8 .submn li:nth-child(8) a{background-color : #fff;}
    .submn9 .submn li:nth-child(9) a{background-color : #fff;}
    .submn10 .submn li:nth-child(10) a{background-color : #fff;}
    .cs-center .col-md-6 {padding-left: 50px;}
    .txt-wrapper ol {justify-content: center;}
    .txt-wrapper ol > li {margin: 30px 20px 0;}
    .rnd .img-wrap.col-md-7 {min-width: 100%;}
    .rnd .txt-wrap .col-md-4 {
        min-width: 40%;
        margin: auto;
    }
    .intro h4 br {display: none;}
    .txt-wrapper {padding: 30px 10px;}
    .img-wrapper.col-md-5 {
        text-align: center;
    }
    .company-cont {padding: 0px 10px;}

}


@media only screen and (max-width: 680px) {
    
    #subarea {padding: 30px 0 50px;}
    .intro h4 {font-size: 1.2em;}
    .recruit .intro h4 {
        font-size: 1.5em;
        line-height: 1.8!important;
    }
    .his_list ul li:nth-child(odd) .his_content {text-align: left;}
    .his_list {margin: 50px auto 0;}
    .cont-1 {padding: 40px 20px 40px;}
    .products .txt-wrapper {padding: 30px 20px;}
    
    .txt-wrapper ol {
        display: block;
        max-width: 100%;
        text-align: center;
    }
    .txt-wrapper ol > li {margin: 30px auto;}
    .txt-wrap {padding: 0;}
    .intro {
        max-width: 90%;
        margin: auto;
    }
    .intro h4 br {display: none;}
    .cs-center img {max-width: 100%;}
    .cs-center .col-md-6 {
        max-width: 80%;
        margin: 10px auto;
        padding: 0;
    }
    .map .add-area dt {float: initial;}
    
    .recruit .container > div > .col-md-12 > .row {padding: 30px 0px;}
    .recruit .col-md-10 {padding: 10px;}
    
    .cont-wrap .txt-wrap {padding: 30px 30px 20px;}
    .cont-wrap .txt-wrap p {font-size: 1.05em!important; text-align: center;}
    .subbg2 {background-position: 25% center;}
    .subbg3 {background-position: 76% center;}
    .txt-wrapper > ul li {font-size: 0.852em;}
    .products .subcontxt th, .products .subcontxt td {padding: 1px 0px;font-size: 0.825em!important;}
    .txt-wrapper ol {
        display: flex;
        justify-content: space-between;
    }
    .txt-wrapper ol > li {max-width: 49%;}
    .recruit ol,.recruit ul {padding-left: 20px!important;}
    .recruit li {
        font-size: 0.985em;
        letter-spacing: -0.05em;
    }
    .recruit .point {
        font-size: 0.825em!important;
        line-height: 1.5;
        padding: 15px;
    }
    .rnd .img-wrap.col-md-7 {white-space: initial;}
    
    .qalist td.bbsnewf5 {max-width: 150px;}
    .qalist td,.qalist td.att_title font,select.cateform,td.board_bgcolor font,.board_desc {font-size: 0.895em!important;}
    .board a:link  {font-size: 1em!important;}
    #subarea.recruit .container {max-width: 100%;}
    .recruit .intro {max-width: 100%; padding: 160px 20px;}
    .recruit_bd {
        max-width: 90%;
        margin: auto;
    }
    div#post_area {font-size: 1em;}
    .recruit .container .subcontxt {max-width: 90%;}
    
    .txt-wrap.col-md-6 {margin-bottom: 30px;}
    .rnd .img-wrap img {width: 100%;}
        .company-cont {padding: 30px 10px;}


}














/*반응형-메인-----------------------------------------------------------------*/

@media only screen and (max-width: 1200px) {
    .container {max-width: 100%;}
    #main_slide .carousel-inner {height: 300px!important;}
    #main_slide .carousel-caption {max-width: 80%!important; padding-top: 90px!important;}
    #main_slide .carousel-indicators {max-width: 80%!important; top: 210px;}
    .ourworks.products .container {max-width: 96%;}
    .ourworks.products .row:nth-child(2) > div {max-width: 24%;}
    .ourworks.products {background-size: cover;}
    .ourworks ul li br {display: none!important;}
    .ourworks ul li:last-child {max-width: 90%!important;min-height: 60px!important;
}

    
    
    
    
    
    
    
}

@media only screen and (max-width: 811px) {
    
    .ourworks ul li:last-child {
        font-size: 0.985em!important;
        min-height: 75px!important;
    }
    .ourworks.products .htitle h1 {min-width: 30%!important; font-size: 2.5em!important;}
    .ourworks.products .htitle p {font-size: 0.985em!important;}
    #main_slide .carousel-inner .carousel-item img {object-position: 70%!important;}
    .slide_txtarea {text-shadow: 2px 2px 2px #fff;}
    
    
    
    
    
    
    
    
    
}
@media only screen and (max-width: 680px) {
    #main_slide .carousel-caption {padding-top: 40px!important;}
    #main_slide .carousel-indicators {top: 135px; text-align: center;}
    .carousel-caption .slide_txtarea {text-align: center;}
    
}

@media only screen and (max-width: 580px) {
    .ourworks.products .htitle h1 {
        float: initial;
        text-align: center;
        font-size: 2em!important;
    }
    .ourworks.products .htitle p {text-align: center;}
    .ourworks.products .row:nth-child(2) > div {
        max-width: 49%;
        margin-bottom: 30px;
    }
    .footer_mn .row a ,#footerarea ul span{font-size: 0.985em;}
    #footerarea ul span b {font-size: 1em;}
    #footerarea {padding: 0px 0 30px;}
    .ourworks ul li:last-child {min-height: 60px!important;}

}