.main_slide_area .txt_box { padding : 3rem 10rem 3rem 3rem  }
.main_slide_area .txt_box h3 { font-size : 4.8rem; margin-bottom : 2rem }
.main_slide_area .txt_box dl > * { margin : 0 2rem  }
.main_slide_area .txt_box dl dt { margin-left : 0 }
.main_slide_area .img_box {  text-align : center; max-width : 100%; height : 600px; overflow : hidden }
.main_slide_area .img_box img { display : inline-block; max-width : 100%; height : auto !important; object-fit: cover; }
.play_control_wrap i { top : inherit !important }
.play_control { position : relative; top : -10px }
.play_control #playBtn,
.play_control #playBtn2 { display : block }
.play_control #stopBtn,
.play_control #stopBtn2 { display : none }
.play_control.active #playBtn,
.play_control.active #playBtn2 { display : none }
.play_control.active #stopBtn,
.play_control.active #stopBtn2 { display : block }

.play_control_wrap { position : absolute; top : 70px; right : 0; z-index : 10; display : inline-flex; }
.play_control_wrap .relative { width : 150px;  }
.play_control_wrap .autoplay-progress { position : absolute;  top :0; right : 0; width: 140px;height: 2px;background-color: rgba(0, 0, 0, 0.1); }
.autoplay-progress svg,
.autoplay-progress2 svg { position : absolute; --progress: 0; right: 0;top: 0;z-index: 10; width: 140px; stroke-width: 4px;stroke: #050505;fill: none;stroke-dashoffset: calc(100 * (1 - var(--progress)));stroke-dasharray: 100; }
.main_slide_area .swiper-pagination { font-size : 4rem; top : 0 !important; width : 130px; text-align : right; left : inherit; right : 0; }
.main_slide_area .swiper-pagination span { display : inline-block; margin : 0 10px }
.main_slide_area .swiper-pagination span + span { color : #707070; margin-left : 0 }
.main_slide_area .control_box { position: absolute; top : 3rem; right : 0; z-index : 5 }

.main_slide_area .arrow_wrap { position : absolute; top : 50px; right : 0 }
.main_slide_area .arrow_btn { display : block; top : inherit !important; margin-top : inherit !important; width : 70px; height : 70px; line-height : 70px; border-radius : 100%; background-color : rgba(255, 255, 255, 0.5); box-shadow : 2px 2px 2px #ccc; right : 0; left : inherit  }
.main_slide_area .arrow_btn:hover { background-color : var(--default) }
.main_slide_area .arrow_btn:hover:After { color : #fff }
.main_slide_area .arrow_btn:after { position : absolute; top : 50%; left : 50%; transform: translate(-50%, -50%); color : #111; font-size : 2rem }
.main_slide_area .swiper-button-prev { right : 80px }
.main_slide_area .swiper-button-next { right : 0 }

.calendar_wrap { box-shadow : 2px 2px 5px #ccc; border-radius : 10px; align-items : center; overflow : hidden }
.calendar_wrap select,
.calendar_wrap p { flex-shrink: 0;}
.calendar_wrap select { border : none; width : 80px; font-size : 1.8rem; color : var(--default); padding-left : 10px }
.calendar_wrap p { width : 100px; height : 100px; background-color: var(--default); color : #fff; display : flex; text-align : center; flex-direction: column; justify-content: center;}
.calendar_wrap p.month_text { justify-content: flex-start;}
.calendar_wrap p span { display : block; border : 1px solid rgba(255, 255, 255, 0.5);  overflow : hidden; margin-bottom : 10px }
.calendar_wrap p span a { display : block; float : left; width : 50%; text-align :Center; color : #fff; line-height : 50px; height : 50px; }
.calendar_wrap p span a + a { border-left : 1px solid rgba(255, 255, 255, 0.5) }
.calendar_wrap p i { display : block; width : 100%; margin : 0 auto 12px }
.calendar_wrap p span a i { top : 14px }
.calendar_wrap .cal_day_wrap { width : 100% }
.calendar_wrap ul { display : flex; width : 100% }
.calendar_wrap ul li { width : 3.22%; text-align : center; line-height : 30px; color : #666 }
.calendar_wrap ul li a { display : block; text-align : center; border-radius : 100%; width : 30px; line-height : 30px; margin : 0 auto; color : #157781; border: solid; }
.calendar_wrap ul li a:hover { border-bottom : 2px solid var(--default); border-radius : 0 }
.calendar_wrap ul li.sun {color:#cc1d2b;}

#calendarSlide a { display : block }
#calendarSlide p.img_wrap { height : 410px  }
#calendarSlide .slide_info { padding : 2rem 0 }
#calendarSlide .slide_info h2 { font-size : 2rem; margin : 1rem 0 }
#calendarSlide .slide_info p { font-size : 1.5rem; }
#calendarSlide .swiper-pagination { bottom : 0 }
#calendarSlide .swiper-pagination-bullet { transition: all .3s ease ;}
#calendarSlide .swiper-pagination-bullet:hover { background-color : var(--default) }
#calendarSlide .swiper-pagination-bullet-active { width : 20px; border-radius : 5px; background-color : var(--default)  }

.middle_info_txt { display : flex; justify-content: space-between; margin : 0 -10px }
.middle_info_txt .wrap { display : flex; align-items : center; flex-direction : column; position : relative; padding : 5rem; width : calc(50% - 20px); margin : 0 10px; text-align : center; color : #fff; border-radius : 20px; overflow : hidden }
.middle_info_txt .wrap:before {content : '';width : 100%;height : 100%;background-color :rgba(0, 0, 0, 0.2);position : absolute;top : 0;left : 0; }
.middle_info_txt .inner_left { background : url('../img/main/img_03_01_ebook.png') no-repeat center center / cover;  } 
.middle_info_txt .inner_right { background : url('../img/main/img_03_02_newsletter.png') no-repeat center center / cover;  } 
.middle_info_txt p { position : relative; z-index: 1; font-size : 2rem; margin-bottom : 15px }
.middle_info_txt .inner_left p { font-size : 3rem; font-weight: bold; }
.middle_info_txt h2 { position : relative; z-index: 1; font-size : 3rem  }
.middle_info_txt .line { position : relative; z-index: 1; width : 80%; height : 1px; background-color : #fff; margin : 2rem auto 4rem }
.middle_info_txt a {display : inline-block;line-height : 60px;text-align : center;font-size : 1.8rem;background-color : rgba(255, 255, 255, 0.9);border-radius : 5px;padding : 0 25px;position: relative;z-index: 5;}

.bbs_list_wrap { padding-left : 650px; margin : 10rem auto }
.bbs_list_wrap .left { position : absolute; top : 0; left : 0; width : 560px }
.bbs_list_wrap .swiper-slide a { display : block; border-radius : 20px; overflow : hidden }
.bbs_list_wrap .swiper-slide a img { width : 100%; height : auto !important; }
.bbs_list_wrap ul { margin-top : 30px }
.bbs_list_wrap ul li { margin : 1rem 0; }
.bbs_list_wrap ul li a { display : block; position : relative; padding : 3rem 10rem 3rem 3rem; border : 1px solid transparent; border-radius : 20px; background-color : #F8F8F8 }
.bbs_list_wrap ul li a h2 { font-size : 2rem; font-weight: bold; margin : 1rem 0 }
.bbs_list_wrap ul p { position : relative; padding-right : 10rem; font-size : 1.4rem; color : #333 }
.bbs_list_wrap ul p sub { position : absolute; top : 0; right : 0;font-size : 1.4rem }
.bbs_list_wrap ul i { position : absolute; bottom : 2rem; right : 2rem; width : 46px; height : 46px; line-height : 46px; text-align : center; background-color : #DFDFDF; color : #959595; border-radius : 100%}
.bbs_list_wrap ul a:hover { border : 1px solid #DCDCDC; box-shadow : 5px 5px 5px #ccc }
.bbs_list_wrap ul a:hover i { background-color : var(--default); color : #fff }

.bbs_list_wrap .arrow_btn { position : absolute; top : calc(50% - 35px); display : block; margin-top : inherit !important; width : 70px; height : 70px; line-height : 70px; border-radius : 100%; background-color : rgba(255, 255, 255, 0.5); box-shadow : 2px 2px 2px #ccc; z-index : 3 }
.bbs_list_wrap .arrow_btn:hover { background-color : var(--default) }
.bbs_list_wrap .arrow_btn:hover:After { color : #fff }
.bbs_list_wrap .arrow_btn:after { position : absolute; top : 50%; left : 50%; transform: translate(-50%, -50%); color : #111; font-size : 2rem }
.bbs_list_wrap .swiper-button-prev { left : -35px }
.bbs_list_wrap .swiper-button-next { right : -35px }

.bbs_list_wrap .gugakEduImg {max-width : 560px; text-align: center;}
.bbs_list_wrap .noImg {width : 560px; text-align: center;}



.company_info { background : url('../img/main/bg_info_wrap.png') no-repeat center center / cover; padding : 10rem 0  }
.slide_effect_wrap { display : flex; justify-content: space-between }
.slide_effect_wrap div { width : calc(25% - 2rem); margin : 0 1rem; border-radius : 20px; overflow : hidden ; transition : all .3s ease }
.slide_effect_wrap div:first-child { margin-left : 0 }
.slide_effect_wrap div:last-child { margin-right : 0 }
.slide_effect_wrap div.active { width : 850px; flex-shrink: 0; }
.slide_effect_wrap a { position : relative; display : block; height : 510px; padding : 4rem; color : #fff; }
.slide_effect_wrap .inner_info_txt { position : absolute; bottom : 4rem; left : 4rem; color : #fff; width : 100% }
.slide_effect_wrap .inner_info_txt h2 { font-size : 3.2rem; margin-bottom : 2rem  }
.slide_effect_wrap .inner_info_txt ul { max-width : 300px; overflow : hidden }
.slide_effect_wrap .inner_info_txt ul li { float : left; width : 33.33%; margin : 1rem 0; font-size : 1.7rem; color : #DCDCDC}
.slide_effect_wrap .inner_info_txt ul li:before { content : ''; display : inline-block; width : 4px; height : 4px; background-color: #DCDCDC; position : relative; top : -4px; margin-right : 5px }
.slide_effect_wrap .slide_card { background-size : cover; background-position: center center; background-repeat : no-repeat; filter: grayscale(100%); }
.slide_effect_wrap .slide_card:hover { filter : grayscale(0)}
.slide_effect_wrap .slide_card01 { background-image : url('../img/main/bg_info_01.png'); filter : grayscale(0) }
.slide_effect_wrap .slide_card02 { background-image : url('../img/main/bg_info_02.png') }
.slide_effect_wrap .slide_card03 { background-image : url('../img/main/bg_info_03.jpg') }
.slide_effect_wrap .slide_card04 { background-image : url('../img/main/bg_info_04.jpg') }
.slide_effect_wrap a.has_txt { display : flex; align-items: baseline; justify-content: center; padding : 5rem }
.slide_effect_wrap .rotate_info_txt { font-size : 3.2rem; transform : rotate(-90deg); white-space: nowrap;  }


.notice_bbs_wrap { display : flex; margin : 10rem auto; justify-content: space-between;  }
.notice_bbs_wrap > div { min-height : 550px }
.notice_bbs_wrap .left { padding-right : 80px }
.notice_bbs_wrap .left ul { border-top : 1px solid #111; margin : 2rem -1%; padding-top : 4rem; overflow : hidden }
.notice_bbs_wrap .left ul li { float : left; width : 48%; margin : 1%; }
.notice_bbs_wrap .left ul li:nth-child(2n) { float : right }
.notice_bbs_wrap .left ul li a { display : flex; flex-direction: column; justify-content: space-between; padding : 3rem; border : 1px solid #dfdfdf; border-radius : 20px; box-shadow : 0 0 15px #e9e9e9 }
.notice_bbs_wrap .left ul h2 { font-size : 23px; height : 55px }
.notice_bbs_wrap .left ul p { margin : 3rem 0; height : 42px; font-size : 15px; height : 35px }
.notice_bbs_wrap .left ul span { font-size : 14px }
.notice_bbs_wrap .left .btm_info { background: var(--default); border-radius : 10px; padding : 35px 0; margin-top : 40px; overflow : hidden }
.notice_bbs_wrap .left .btm_info div { border-right : 1px dotted #fff; width : 25% }
.notice_bbs_wrap .left .btm_info div:last-child { border-right : none }
.notice_bbs_wrap .left .btm_info div a { display : block; color : #fff; padding : 0 20px; text-align : center  }
.notice_bbs_wrap .left .btm_info div a img { display : block; margin : 0 auto 30px; width : 30px; height : 30px; width : auto !important }



.notice_bbs_wrap .right { width : 560px }
#newsSlide { position : relative; border-radius : 20px; overflow : hidden; padding-bottom : 67px }
#newsSlide .swiper-slide { height : 470px }
#newsSlide .swiper-slide a { position : relative; display : block; height : 100%; border-radius: 0; }
.control_box2 { position : absolute; display : flex; justify-content : space-between; align-items : center; bottom : 0; left : 0; width : 100%; padding : 0 20px; background-color : #000; height : 67px; z-index: 2; }
.control_box2 .progress { color : #fff; white-space: nowrap; }
.control_box2 .total { color : #d0d1d4 }
.control_box2  .arrow_wrap { display : flex; align-items: center; }
.control_box2  .arrow_wrap * { position : static; padding : 0 3px }
.control_box2 .play_control { position :relative; top : 2px }
.control_box2 .play_control i { color : #D0D1D4 }
.control_box2 .arrow_btn { margin-top : 0; }
.control_box2 .swiper-button-next:after,
.control_box2 .swiper-button-prev:after { font-size : 17px; color : #D0D1D4 }

.control_box2 .progress { display : flex; align-items: center; }
.control_box2 .swiper-pagination { position : static !important }
.play_control_wrap2 { margin-left : 15px; }
.play_control_wrap2 .autoplay-progress2 { position : absolute;  top :0; width: 120px;height: 2px;background-color: rgba(255, 255, 255, 0.5); }
.autoplay-progress2 { width : 120px; height : 2px }
.autoplay-progress2 svg { width : 100%; stroke: #fff; }

.tab_ctrl { padding-right : 30px }

@media ( max-width : 1440px ){
    .bbs_list_wrap { padding-left : 500px !important }
    .bbs_list_wrap .left { width : 480px }
    .bbs_list_wrap .swiper-button-next { right : 0 }
    .bbs_list_wrap .swiper-button-prev { left : 0 }

    .slide_effect_wrap div.active { width : 780px }
}


@media ( max-width : 1200px ){
    .bbs_list_wrap { padding-left : 20px !important }
    .bbs_list_wrap .left { display : none }

    .slide_effect_wrap div.active { width : 600px }
    .notice_bbs_wrap { flex-wrap : wrap }
    .notice_bbs_wrap .left { padding-right : 0; width : 100% !important }
    .notice_bbs_wrap > * { width : 100%; height : auto !important; min-height : auto !important }
    .notice_bbs_wrap .only_mobile { display : block !important }
    .notice_bbs_wrap .left .btm_info { margin-top : 0 }
    .notice_bbs_wrap .right { margin-top : 2rem; width : 100% }
}




@media ( max-width : 1024px ){
    .main_slide_area .txt_box { padding-left : 0; padding-right : 0 }
    .main_slide_area .control_box { top : 0 }
    .play_control_wrap { top : 52px }

    .main_slide_area .arrow_wrap { top : 30px }

    .main_slide_area .img_box { height : auto !important; border-radius : 20px; overflow : hidden; }
    .main_slide_area .img_box img { display : block; width : 100% }
    .calendar_wrap { position : relative; height : 100px; line-height : 100px; width : 100%; overflow-x : auto; }
    .calendar_wrap .cal_day_wrap { overflow : auto hidden }
    .calendar_wrap ul { display : flex  }
    .calendar_wrap ul li { width : 35px; flex-basis :  35px; flex-shrink: 0; }

    .calendar_wrap select,
    .calendar_wrap p.flex { position : absolute; width : 100px; top : 0  }
    .calendar_wrap select { line-height : 100px; left : 0 }
    .calendar_wrap p.flex { right : 0; }

    .slide_effect_wrap { display : block }
    .slide_effect_wrap > div { width : 100% !important; margin-bottom : 30px; height : 120px }
    .slide_effect_wrap > div.active { height : 350px }
    .slide_effect_wrap .inner_info_txt{ bottom : 20px; left : 20px; }
    .slide_effect_wrap a { height : 100% }
    .slide_effect_wrap .inner_info_txt ul li { font-size : 2rem }
    .slide_effect_wrap .rotate_info_txt { transform : rotate(0)}
    .slide_effect_wrap a.has_txt { align-items: center; justify-content: flex-start;}

    footer .footer_top .right { display : none }
    .footer_btm .inner { flex-direction: column; padding : 30px !important }
    footer .footer_btm .sns_link { top : 30px; right : 30px }
    footer .footer_btm h1 { margin-bottom : 50px !important }
    footer .footer_btm p { font-size :  15px }

    .bgsound { display: block; }

    .middle_info_txt { flex-direction: column; margin : 15px 0 }
    .middle_info_txt .wrap { width : 100%; margin : 15px 0 }
}



@media ( max-width : 700px ){
    .main_slide_area .txt_box h3 { font-size : 4.2rem }
    .main_slide_area .txt_box dl { font-size : 2rem }

    .main_slide_area .arrow_btn { width : 50px; height : 50px }
    .main_slide_area .swiper-button-prev { right : 60px }
    .calendar_wrap { padding : 0 65px }
    .calendar_wrap select, .calendar_wrap p.flex { width : 65px }
    .notice_bbs_wrap .left ul h2 { font-size : 20px; height : 45px }

    .title_01 .has_sub_title { display : block }
    .title_01 .has_sub_title h2 { margin-bottom : 20px }
}

@media ( max-width : 450px ){
    .notice_bbs_wrap .left ul { padding-top : 0; margin : 10px 0 }
    .notice_bbs_wrap .left ul li { float : none; width : 100%; margin : 10px 0 }

    footer .footer_btm .sns_link { position : static; margin-top : 20px  }

}





#sns_wrap .inner > ul > li > .bx-wrapper {position:relative;}
#sns_wrap .inner > ul > li > .bx-wrapper > .bx-controls {position:absolute; bottom:20px; right:20px;}
#sns_wrap .inner > ul > li > .bx-wrapper > .bx-controls > .bx-pager {display:none;}
#sns_wrap .inner > ul > li > .bx-wrapper > .bx-controls > .bx-controls-direction {width:40px; background:url(../images/main/sns_slide_line.png) no-repeat center center; text-align:left;}
#sns_wrap .inner > ul > li > .bx-wrapper > .bx-controls > .bx-controls-direction > .bx-prev {width:13px; height:13px; background:url(../images/main/sns_slide_left.png) no-repeat center center; text-indent:-99999px; text-indent:0; font-size:0; line-height:0;}
#sns_wrap .inner > ul > li > .bx-wrapper > .bx-controls > .bx-controls-direction > .bx-next {float:right; width:13px; height:13px; background:url(../images/main/sns_slide_right.png) no-repeat center center; text-indent:-99999px; text-indent:0; font-size:0; line-height:0;}


/*배경음악*/
/* .bgsound { display: none; position: relative; float:left; z-index: 1000; width:30px; height: 30px; margin: 0px auto 0; } */
/* .bgsound > a { display: block; width:30px; height: 30px; } */
/* .bgsound > a span { display: block; width:30px; height: 30px; text-indent: -999px; background: url(../images/common/icon_music_off.png) no-repeat 5px center; } */
/* .bgsound > a span.on { background: url(../images/common/icon_music_on.png) no-repeat 5px center; } */