@charset "UTF-8";

/*=================================================
			메인 슬라이드
=================================================*/
.mainslide-wrap .section-wrap{
    padding: 0 160px !important;
}

.mainslide-wrap .ratio-custom::before{
    padding-top: 31.8%;
}

.mainslide-wrap .top-nav a{
    padding: 18px 0;

    text-align: center;

    background-color: #191919;
    border-top: 3px solid #ff8f43;
}

.mainslide-wrap .bottom-nav{
    padding: 40px 0 50px;
}

.mainslide-wrap .bottom-nav .title{
    padding: 0 0 10px;
}

.mainslide-wrap .bottom-nav .subtitle{
    border-bottom: 1px solid #ff8f43;
}

.mainslide-wrap .bottom-nav .ratio-custom::before{
    padding-top: 49%;
}

.mainslide-wrap .bottom-nav .ratio-content{
    border-bottom: 3px solid #6b6b6b;

    overflow: hidden;
}

.mainslide-wrap .bottom-nav video{
    width: 100%;
}

.mainslide-wrap .bottom-nav .slide-layer{
    background-color: rgba(255, 255, 255, 0.9);
    border-top: 3px solid #6b6b6b;
}

.mainslide-wrap .bottom-nav .slide-layer .middle-box{
    position: relative;
}

.mainslide-wrap .bottom-nav .slide-layer .middle-box .subtitle{
    position: absolute;

    bottom: 0; left: 50%;

    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

/*****#####===== 미디어 쿼리  =====#####*****/
/***** xl *****/
@media (min-width: 1200px) and (max-width: 1600px){
    .mainslide-wrap .section-wrap {
        padding: 0;
    }
}

/***** lg *****/
@media (min-width: 992px) and (max-width: 1199px){
    .mainslide-wrap .section-wrap {
        padding: 0 !important;
    }
}

/***** md *****/
@media (min-width: 768px) and (max-width: 991px){
    .mainslide-wrap .section-wrap {
        padding: 0 !important;
    }
}

/***** sm *****/
@media (min-width: 576px) and (max-width: 767px){
    .mainslide-wrap .section-wrap {
        padding: 0 !important;
    }

    .mainslide-wrap .bottom-nav .title.txt-h8{
        font-size: 18px;
    }

    .mainslide-wrap .bottom-nav .ratio-custom::before{
        padding-top: 80%;
    }

    .mainslide-wrap .bottom-nav video{
        width: auto;
        height: 100%;
    }
}

/***** xs *****/
@media (max-width: 575px) {
    .mainslide-wrap .section-wrap {
        padding: 0 !important;
    }

    .mainslide-wrap .bottom-nav .title.txt-h8{
        font-size: 11px;
    }

    .mainslide-wrap .bottom-nav .ratio-custom::before{
        padding-top: 120%;
    }

    .mainslide-wrap .bottom-nav video{
        width: auto;
        height: 100%;

        -webkit-transform: translateX(-20%);
        -ms-transform: translateX(-20%);
        transform: translateX(-20%);
    }
}

/*=================================================
			OUR CLIENTS
=================================================*/
.ourclients-wrap{
    overflow: hidden;
}

.ourclients-wrap .section-wrap{
    padding: 60px 0 30px;

    background-color: #f3f4f4;
}

.ourclients-wrap .banner .ratio-custom::before{
    padding-top: 24.7%;
}

.ourclients-wrap .slick-prev,
.ourclients-wrap .slick-next{
    display: none !important;
}

/*****#####===== 미디어 쿼리  =====#####*****/
/***** lg *****/
@media (min-width: 992px) and (max-width: 1199px){

}

/***** md *****/
@media (min-width: 768px) and (max-width: 991px){
    .ourclients-wrap .banner .ratio-custom::before {
        padding-top: 30%;
    }
}

/***** sm *****/
@media (min-width: 576px) and (max-width: 767px){
    .ourclients-wrap .banner .ratio-custom::before {
        padding-top: 40%;
    }
}

/***** xs *****/
@media (max-width: 575px) {
    .ourclients-wrap .banner .ratio-custom::before {
        padding-top: 50%;
    }

    .ourclients-wrap .txt-h5{
        font-size: 16px
    }
}

/*=================================================
			RECRUIT
=================================================*/
.mainrecruit-wrap{
    background-image: url('/img/section_bg.png');
    background-repeat: repeat-x;
    background-position: left bottom;
    background-size: 354px;
    overflow: hidden;
}

.mainrecruit-wrap .section-wrap{
    padding: 127px 0 47px;
}

.mainrecruit-wrap .mainrecruit_slick{
    height: 416px;

    overflow: hidden;
}

.mainrecruit-wrap .ratio-custom::before{
    padding-top: 66%;
}

.mainrecruit-wrap .ratio-custom .bg{
    background-position: left;
}

.mainrecruit-wrap .left{
    padding: 100px 40px 70px;
}

.mainrecruit-wrap .left .desc{
    padding: 70px 0 0;
}

.mainrecruit-wrap .left .name{
    padding: 50px 0 0;
}

.mainrecruit-wrap .slick-dotted.slick-slider{
    margin: 0;
}

.mainrecruit-wrap .slick-dots {
    width: auto;
    margin: 0;
    padding: 0;

    bottom: 25px; left:40px ;
}

.mainrecruit-wrap .slick-dots li button::before{
    font-size: 14px;
    color: #919191;
}

/*****#####===== 미디어 쿼리  =====#####*****/
/***** lg *****/
@media (min-width: 992px) and (max-width: 1199px){
    .mainrecruit-wrap .ratio-custom::before {
        padding-top: 79%;
    }
}

/***** md *****/
@media (min-width: 768px) and (max-width: 991px){
    .mainrecruit-wrap .section-wrap {
        padding: 37px 0 47px;
    }

    .mainrecruit-wrap .mainrecruit_slick{
        height: 456px;
    }

    .mainrecruit-wrap .right{
        padding: 50px 0 0;
    }
}

/***** sm *****/
@media (min-width: 576px) and (max-width: 767px){
    .mainrecruit-wrap .section-wrap {
        padding: 37px 0 47px;
    }

    .mainrecruit-wrap .mainrecruit_slick{
        height: 336px;
    }

    .mainrecruit-wrap .right{
        padding: 50px 0 0;
    }
}

/***** xs *****/
@media (max-width: 575px) {
    .mainrecruit-wrap .section-wrap {
        padding: 37px 0 47px;
    }

    .mainrecruit-wrap .ratio-custom::before {
        padding-top: 60%;
    }

    .mainrecruit-wrap .mainrecruit_slick{
        height: auto;
    }

    .mainrecruit-wrap .slick-dots {
        width: auto;
        margin: 0;
        padding: 0;
        bottom: 10px;
        left: 10px;
    }

    .mainrecruit-wrap .right{
        padding: 50px 0 0;
    }
}

/*=================================================
			CONTACT US
=================================================*/
.contactus-wrap{
    background-color: #2a2a2a;
    overflow: hidden;
}

.contactus-wrap .section-wrap{
    padding: 80px 0 90px;
}

.contactus-wrap #contact_form{
    padding: 13px 0 0;

    border-top: 2px solid #ff8f43;
}

.contactus-wrap #contact_form .form-group{
    margin: 44px 0 0;
}

.contactus-wrap #contact_form input,
.contactus-wrap #contact_form textarea{
    padding-left: 0;

    color: #a8a8a8;

    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #fff;
}

.contactus-wrap #contact_form textarea{
    height: 200px;
}

.contactus-wrap #contact_form input::-webkit-input-placeholder,
.contactus-wrap #contact_form textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #a8a8a8;
}

.contactus-wrap #contact_form input:-ms-input-placeholder,
.contactus-wrap #contact_form textarea:-ms-input-placeholder { /* IE 10+ */
    color: #a8a8a8;
}

.contactus-wrap #contact_form .term-wrap{
    padding: 8px 0 14px;
}

.contactus-wrap #contact_form .term-wrap input[type="checkbox"]{
    margin: 0 5px 0 0;

    vertical-align: -3px;
}

.contactus-wrap #contact_form .term-wrap button{
    background-color: transparent;
    border: 0;
}

.contactus-wrap .map-wrap{
    padding: 0 0 5px;
}

.contactus-wrap .map-wrap .map_canvas{
    height: 274px;
}

/*****#####===== 미디어 쿼리  =====#####*****/
/***** lg *****/
@media (min-width: 992px) and (max-width: 1199px){
    .contactus-wrap .info-wrap.txt-h11{
        font-size: 14px;
    }

    .contactus-wrap .address-wrap.txt-h12{
        font-size: 13px;
    }
}

/***** md *****/
@media (min-width: 768px) and (max-width: 991px){
    .contactus-wrap .section-wrap {
        padding: 40px 0 45px;
    }

    .contactus-wrap #contact_form {
        padding: 13px 0 40px;
    }
}

/***** sm *****/
@media (min-width: 576px) and (max-width: 767px){
    .contactus-wrap .section-wrap {
        padding: 40px 0 45px;
    }

    .contactus-wrap #contact_form {
        padding: 13px 0 40px;
    }
}

/***** xs *****/
@media (max-width: 575px) {
    .contactus-wrap .section-wrap {
        padding: 40px 0 45px;
    }

    .contactus-wrap #contact_form {
        padding: 13px 0 40px;
    }
}
