
/* common */
#about { overflow: hidden; padding-top: ; }
.sub_tit { line-height: 1; margin:0 0 50px; }
.sub_tit b { display: block; font-size: 26px; font-weight: 600; color: #008bf6; margin:0 0 20px; }
.sub_tit h2 { font-size: 55px; font-weight: bold; text-transform: uppercase; }



/* about */
#about { }

/* s1 */
#ab_s1 { padding:130px 0 140px; background:url('../img/ab_s1_bg.jpg') no-repeat bottom center / 100% 470px; }
#ab_s1 .sub_tit { border-bottom: 1px solid #ddd; padding:0 0 40px; margin:0 0 40px; }

.s1_con h3 { font-size: 28px; line-height: 1.75; }
.s1_con p { font-size: 20px; font-weight: 300; line-height: 1.65; margin-top: 30px; }
.s1_con .name { display: block; margin:40px 0 0; font-size: 18px; }
.s1_con .name img { margin-left: 20px; }
.s1_con .img { margin-top: 60px; }


/* s2 */
#ab_s2 { padding:130px 0 90px; }

.s2_con .swiper { overflow: visible; }
.his_list { position:relative; overflow-x: visible; z-index: 2; }

.his_list .his_box { position:relative; width: 390px; height: 100%; padding:0 65px 0 0; line-height: 1;  transition: .5s; }
.his_list .his_box::before { content:""; position:absolute; left:0; width:100%; top:119px; height: 1px; background:#ddd; }
.his_list .his_txt { width: 100%; padding:40px 35px; border-radius: 15px; min-height: 350px; }
.his_list .his_y { font-size: 40px; font-weight: 800; transition: all .3s; }
.his_list .his_dot { margin:30px 0; position:relative; width: 20px; height: 20px; border-radius: 50%; background-color:rgba(174,174,174,0.28); z-index: 3; transition: all .3s; }
.his_list .his_dot::before { content:""; position:absolute; left:5px; top:5px; width:10px; height: 10px; background:#aeaeae; border-radius: 50%; transition: all .3s;  }

.his_list .mth_list li { display: flex; margin:0 0 10px; }
.his_list .mth_list li strong { position:relative; top:5px; width: 23px; font-size: 17px; font-weight: 800; letter-spacing: -0.43px; transition: all .3s; font-family: 'NanumSquare',sans-serif; }
.his_list .mth_list li p { width: calc(100% - 23px); padding-left: 12px; font-size: 16px; font-weight: 300; letter-spacing: -0.43px; line-height: 1.7; transition: all .3s; }

/* .his_list .slick-slide { opacity: 0; }
.his_list .his_box.slick-active,
.his_list .his_box.slick-active + .his_box { opacity: 1; } */
.his_list .swiper-slide { opacity: 1; }
.his_list .his_box.swiper-slide-prev { opacity: 0; }

.his_list .his_box.swiper-slide-active .his_txt { background:#3e3a39; }
.his_list .his_box.swiper-slide-active .his_y { color: #fff;; }
.his_list .his_box.swiper-slide-active .his_dot { color:rgba(255,255,255,0.28); }
.his_list .his_box.swiper-slide-active .his_dot::before { background:#fff; }
.his_list .his_box.swiper-slide-active .mth_list li strong { color: #fff; }
.his_list .his_box.swiper-slide-active .mth_list li p { color: rgba(255, 255, 255, 0.5); }


/* #his_arrow { display: flex; align-items: center; margin:55px 0 0; }
#his_arrow .slick-arrow { width:54px; height: 54px; border:1px solid #ddd; border-radius: 50%; cursor: pointer; transition: all .3s; }
#his_arrow #his_prev { background:url('../img/his_prev.png') no-repeat center #fff; }
#his_arrow #his_next { background:url('../img/his_next.png') no-repeat center #fff; margin-left: 20px; } */
.s2_con .swiper-arrow { display: flex; margin:55px 0 0; height: 50px; }
.s2_con .swiper-button-prev,
.s2_con .swiper-button-next { position:relative; width: 50px; height: 50px; border:1px solid #ababab; border-radius: 50%; transition: .3s; z-index: 3; }
.s2_con .swiper-button-prev { left:0; background:url('../img/his_prev.png') no-repeat center #fff; }
.s2_con .swiper-button-next { right:initial; margin-left: 20px; background:url('../img/his_next.png') no-repeat center #fff; }
.s2_con .swiper-button-next:after,
.s2_con .swiper-button-prev:after { display: none; }


/* ab_s3 */
#ab_s3 { padding:130px 0 150px; background:url('../img/dot_bg.jpg') repeat center; }

.s3_con .logo_list { display: flex; flex-wrap: wrap; border-top: 1px solid #ddd; border-left: 1px solid #ddd; }
.s3_con .logo_list li { width:25%; height: 160px; display: flex; align-items: center; justify-content: center; background: #fff; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; padding:0 30px; }



/* hover */
@media screen and (min-width: 1024px) {

    /* s2 */
    /* #his_arrow #his_prev:hover { background:url('../img/his_prev_w.png') no-repeat center #008bf6; }
    #his_arrow #his_next:hover { background:url('../img/his_next_w.png') no-repeat center #008bf6; } */

    .s2_con .swiper-button-prev:hover { border:1px solid #008bf6; background:url('../img/his_prev_w.png') no-repeat center #008bf6; }
    .s2_con .swiper-button-next:hover { border:1px solid #008bf6; background:url('../img/his_next_w.png') no-repeat center #008bf6; }

}


/* media query */
@media screen and (max-width: 1420px) {

    /* s2 */
    .his_list .his_box { padding: 0 40px 0 0; }

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

    /* common */
    .sub_tit { margin:0 0 40px; }
    .sub_tit b { font-size: 22px; }
    .sub_tit h2 { font-size: 42px; }

    /* about */
    #about { text-align: center; }

    /* s1 */
    #ab_s1 { padding: 80px 0; background-size:auto 300px; }
    .s1_con h3 { font-size: 22px; }
    .s1_con p { font-size: 18px; margin-top: 25px; }

    /* s2 */
    #ab_s2 { padding: 80px 0; }

    .s2_con .swiper { overflow: hidden; }
    .s2_con .swiper-arrow { height: auto; justify-content: center; }

    .his_list .his_box { padding: 0 20px 0 0; }
    .his_list .his_box::before { top: 110px; }
    .his_list .his_txt { text-align: left; }
    .his_list .his_y { font-size: 35px; }
    .his_list .his_dot { margin: 25px 0; }

    /* #his_arrow { margin: 20px 0 0; justify-content: center; } */

    /* s3 */
    #ab_s3 { padding: 80px 0 100px; }
    .s3_con .logo_list li { height: auto; padding:50px 30px; }



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


    /* s2 */
    .his_list .his_box { padding: 0; }
    /* #his_arrow { margin: 30px 0 0; } */



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

    /* common */
    .sub_tit { margin:0 0 30px; }
    .sub_tit b { font-size: 18px; margin: 0 0 15px; }
    .sub_tit h2 { font-size: 30px; }

    /* about */

    /* s1 */
    #ab_s1 { padding: 50px 0 60px; background-size:100% 120px; }
    #ab_s1 .sub_tit { padding: 0 0 30px; margin: 0 0 30px; }
    .s1_con h3 { font-size: 18px; }
    .s1_con p { font-size: 16px; margin-top: 20px; }
    .s1_con .name { margin: 30px 0 0; font-size: 16px; }
    .s1_con .name img { width:100px; margin-left: 10px; }
    .s1_con .img { margin-top: 35px; }

    /* s2 */
    #ab_s2 { padding: 60px 0; }

    /* s3 */
    #ab_s3 { padding: 60px 0 80px; }
    .s3_con .logo_list li { padding:30px; }


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

    /* s2 */
    .his_list .his_box { padding: 0; }
    .his_list .his_box::before { top: 95px; }
    .his_list .his_txt { padding: 35px 30px; min-height: 0; }
    .his_list .his_y { font-size: 30px; }
    .his_list .his_dot { margin: 20px 0; }

    /* #his_arrow { margin: 0; }
    #his_arrow .slick-arrow { width: 45px; height: 45px; }
    #his_arrow #his_prev { background-size: 10px auto; }
    #his_arrow #his_next { background-size: 10px auto; } */
    .s2_con .swiper-button-prev,
    .s2_con .swiper-button-next { width: 45px; height: 45px; }
    .s2_con .swiper-button-prev { background-size:10px auto; }
    .s2_con .swiper-button-next { background-size:10px auto; }

    /* s3 */
    .s3_con .logo_list li { width: 50%; }
}
