
/* common */
#studio2 { overflow: hidden; padding:120px 0; }
.sub_h1 { position:relative; font-size: 50px; font-weight: bold; letter-spacing: -0.5px; color: #32343a; line-height: 1; }
.sub_h1::after { content:""; display: block; width:30px; height: 5px; background:#e73829; margin:25px 0 0; }
.sub_h2 { font-size: 24px; letter-spacing: -0.6px; margin-top: 35px; }
.sub_p { font-size: 20px; font-weight: 300; letter-spacing: -0.5px; color: #32343a; line-height: 38px; }
.sub_p ~ .sub_p { margin-top: 30px; }

.bot_bg { width:100%; height: 500px; background:url('../img/studio2_bg.jpg') no-repeat center / cover; margin-top: 130px; }


/* studio 공통 */
#studio2 .sub_h1 { text-align: center; }
#studio2 .sub_h1::after { display: none; }
#studio2 p { text-align: center; padding:100px; font-size:25px; color:#aaa; }





/* tab_btn */
.tab_btn_wr {margin: 50px auto; }
.tab_btn {display: flex; justify-content: center; text-align: center; width: 100%; height: 80px; align-items: center; background-color: #fff;  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.11); }
.tab_btn li { margin-right: 40px; }
.tab_btn li:last-child {margin-right: 0;}
.tab_btn li a {display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; font-size: 16px; font-weight: 500; color:#333; transition: all .2s ease; cursor: pointer; }
.tab_btn li a.active {color:#e73829; }


.tab {display: none; }
.tab.active {display: block; }


/* slider */
.slider_wrap { position: relative; display: flex; align-items: center; }
.slider_wrap .stu_slider { width:100%; max-width:1100px; }
.slider_wrap .stu_slider .slick-slide { outline: none; display: flex !important; align-items:center; flex-direction: column;}
.slider_wrap .stu_slider .slick-slide img { margin:0 auto;}

.thumbnails_wrap { text-align: center; margin-left: 40px; }
/* .thumbnails_wrap .slick-track { display: flex; flex-direction: column; } */
.thumbnails_wrap.fixed .slick-track { transform: none !important; }
.thumbnails_wrap .slick-list { width:260px !important; height: 700px !important; position: relative; }
/* .thumbnails_wrap .slick-slide { position:relative; transition: all .2s ease; outline: none; display: inline-block;
     cursor: pointer; max-height:150px; overflow: hidden; text-align: center; } */
.thumbnails_wrap .slick-slide { position:relative; transition: all .2s ease; outline: none; display: inline-block;
     cursor: pointer; overflow: hidden; text-align: center; }
.thumbnails_wrap .slick-slide ~ .slick-slide { margin-top: 12px; }
.thumbnails_wrap .slick-slide img { margin:0 auto; width: 100%;}
.thumbnails_wrap .slick-slide:after { content:""; position:absolute; left:0; width:100%; top:0; height:100%; border: 4px solid transparent; }
.thumbnails_wrap .slick-slide.slick-current:after { border-color:#e73829; }

.slick-arrow { position:absolute; right:-385px; z-index: 20; top:44%; transform: translateY(-50%); font-size:0;
    width: 50px; height: 50px; transition: all 0.3s; border:1px solid #ddd; border-radius: 50%; }
.slick-arrow.slick-prev { margin-top: -35px; background:url('../img/btn_next.png') no-repeat center / 9px auto;
transform: rotate(-90deg);}
.slick-arrow.slick-next { margin-top: 35px; background:url('../img/btn_prev.png') no-repeat center / 9px auto;
transform: rotate(-90deg);}




/* hover */
@media screen and (min-width:1024px){
    .tab_btn li a:hover {color:#e73829; }

    .slick-arrow.slick-prev:hover { background-image:url('../img/btn_next_w.png'); background-color: #e73829; border-color: #e73829; }
    .slick-arrow.slick-next:hover { background-image:url('../img/btn_prev_w.png'); background-color: #e73829; border-color: #e73829; }
}

/* 반응형 */
@media screen and (max-width:1800px){

    .slick-arrow { right: 10px; }
    /* .slick-arrow.slick-prev { margin-top: -25px; }
    .slick-arrow.slick-next { margin-top: 25px; } */

    .slick-arrow.slick-prev:hover { background-image:url('../img/btn_next.png'); background-color: #fff; border-color: #fff; }
    .slick-arrow.slick-next:hover { background-image:url('../img/btn_prev.png'); background-color: #fff; border-color: #fff; }

}

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

    /* common */
    #studio2 p br { display: none; }

    /* studio 공통 */
    .slider_wrap { flex-direction: column; }

    .thumbnails_wrap {margin: 30px auto 0 auto; text-align: center; width:100%; max-width: 1100px; }
    .thumbnails_wrap .slick-list { width:auto !important; height: auto !important; }
    .thumbnails_wrap .slick-slide img { width: auto; }
    .thumbnails_wrap .slick-slide ~ .slick-slide { margin:0; }
    .thumbnails_wrap .slick-slide { margin:0 5px !important; }

    .tab_btn { padding:7px 15px; flex-wrap: wrap; }



}



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

    /* common */
    #studio2 { padding: 80px 0 100px; }
    .sub_h1 { font-size: 38px; }
    .sub_h2 { font-size: 20px; }
    .sub_p { font-size: 18px; line-height: 35px; }

    .bot_bg { height: 350px; margin-top: 100px; }

    /* studio 공통 */
    .tab_btn li { margin-right: 30px; }


}

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

    /* common */
    #studio2 { padding: 50px 0 80px; text-align: center; }
    .sub_h1 { font-size: 28px; line-height: 40px; }
    .sub_h1::after { margin: 25px auto 0; }
    .sub_h2 { font-size: 18px; line-height: 32px; margin-top: 20px; }
    .sub_p { font-size: 16px; line-height: 30px; }
    .sub_p ~ .sub_p { margin-top: 15px; }

    .bot_bg { height: 200px; margin-top: 70px; }

    /* studio 공통 */
    .tab_btn_wr { margin: 35px auto 50px; }
    .tab_btn { height: auto; padding:10px 20px; justify-content: flex-start; }
    .tab_btn li { min-width: 50%; margin:0; }
    .tab_btn li a { font-size: 15px; line-height: 30px; justify-content: flex-start; }

    .slick-arrow { display: none !important; }



}
