.font-12{font-size: 12px  !important; line-height: 180%;}
.font-14{font-size: 14px  !important; line-height: 180%;}
.font-16{font-size: 16px  !important; line-height: 180%;}
.font-17{font-size: 17px  !important; line-height: 180%;}
.font-18{font-size: 18px  !important; line-height: 180%;}
.font-20{font-size: 20px  !important; line-height: 180%;}
.font-22{font-size: 22px !important; line-height: 180%;}
.font-24{font-size: 24px !important; line-height: 180%;}
.font-25{font-size: 25px !important; line-height: 180%;}
.font-27{font-size: 27px !important; line-height: 180%;}
.font-30{font-size: 30px !important; line-height: 180%;}
.font-35{font-size: 35px !important; line-height: 160%;}
.font-40{font-size: 40px !important; line-height: 160%;}
.font-45{font-size: 45px !important; line-height: 160%;}
.font-50{font-size: 50px !important; line-height: 160%;}
.font-55{font-size: 55px !important; line-height: 160%;}
.font-60{font-size: 60px !important; line-height: 160%;}
.font-64{font-size: 64px !important; line-height: 160%;}
.font-70{font-size: 70px !important; line-height: 160%;}

.weight-200{font-weight: 200;}
.weight-300{font-weight: 300;}
.weight-400{font-weight: 400;}
.weight-500{font-weight: 500;}
.weight-600{font-weight: 600;}
.weight-700{font-weight: 700;}
.weight-800{font-weight: 800;}

.point-color{color: #f42717;}
.w-color{color: #fff;}
/*main.css*/


.main_page {margin:87px 0px 0px 100px; }

.title-wrap{margin-bottom: 20px;}

.side-nav-bar{width: 100px; position: fixed; left: 0; top: 50%; transform: translateY(-50%);}
.side-nav-bar ul li{height: 50px;}
.side-nav-bar ul li a{text-align: center; display: flex; flex-direction: column; align-items: center;}
.side-nav-bar ul li:not(:last-child){margin-bottom: 30px;}
.side-nav-bar ul li p{display: none;}
.side-nav-bar ul li a:hover p{display: block;}
.side-nav-bar ul li a:hover img{display: none;}


/*banner*/
.main_banner{width: 100%; display: block;  background: url(../img/main/banner2.png); background-size: cover; background-position: center center; }
.main_banner .mb_slide{ position: relative; height:calc(100vh - 87px); display: flex; align-items: center;}
/* .main_banner .mb_slide2{position: relative; height: 100vh;}
.main_banner .mb_slide3{position: relative; height: 100vh;} */


.main_banner .swiper-button-prev, .main_banner .swiper-button-next{margin-top: 0; top:auto; bottom: 35px;  width: 12px; height: 15px; background-size: cover; outline: 0; background-position: center;} 
.main_banner .swiper-button-prev{left: 0px; background-image: url('../img/main/arrow_left.png');}
.main_banner .swiper-button-next{left: 140px; background-image: url('../img/main/arrow_right.png');}
.main_banner .swiper-button-prev::after,
.main_banner .swiper-button-next::after{display: none;}

.main_banner .swiper-container-horizontal>.swiper-pagination-bullets, .main_banner .swiper-pagination-custom, .main_banner .swiper-pagination-fraction{bottom:30px;}
.main_banner .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin: 0 5px;}
.main_banner .swiper-pagination-bullet{width: 10px; height: 10px; opacity: 0.5; background: rgba(255,255,255,1); border-color: rgba(255,255,255,1); -webkit-box-sizing: border-box; box-sizing: border-box; outline: 0;}
.main_banner .swiper-pagination-bullet-active{opacity: 1;}
.main_banner .banner_tit{margin-left: 50px;}

.main_nbsp {width:100%; height:87px; position: absolute; background:#fff; bottom:0;}


/* main_sec1 */
.main_sec1{width: 100%; padding: 100px 0 100px; position: relative;}
.main_sec1::before{content: ""; background-color: #f5f5f5; width: 120%; height: 1000px; position: absolute; left: -100px; top: 0; z-index: -1;}
.main_sec1 .about-wrap{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center;}
.main_sec1 .about-wrap .txt-wrap{width: 40%; padding-right: 20px;}
.main_sec1 .about-wrap .txt-wrap h2{color: #000; position: relative;}
.main_sec1 .about-wrap .txt-wrap h2::after{content: ""; width: 80px; height: 1px; background-color: #000; position: absolute; left: 0; bottom: -20px;}
.main_sec1 .about-wrap .txt-wrap p{margin-top: 40px;}

.main_sec1 .about-wrap .img-wrap{display: flex; flex-wrap: wrap;  width: 60%;}
.main_sec1 .about-wrap .img-wrap .fir-img{margin-right: 2%; width: 72%;}
.main_sec1 .about-wrap .img-wrap .fir-img img{width: 100%;}
.main_sec1 .about-wrap .img-wrap .sec-img{width: 26%;}
.main_sec1 .about-wrap .img-wrap .sec-img img{width: 100%;}

.wrap{width: 1700px; max-width: 100%;}
/* main_sec2 */
.main_sec2{width: 100%; padding: 20px 0 100px;}
.main_sec2 .wrap ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.main_sec2 .wrap ul li{width: 49.5%; background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; }
.main_sec2 .wrap ul li::after{content: ""; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.466); position: absolute; left: 0; top: 0; z-index: 1; transition: 0.2s; opacity: 0;}
.main_sec2 .wrap ul li a{display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; padding: 180px 40px 40px 40px; position: relative; z-index: 2;}
.main_sec2 .wrap ul li a p{line-height: 120% !important;}
.main_sec2 .wrap ul li a span{position: relative;}
.main_sec2 .wrap ul li a span::after{content: ""; width: 0; height: 1px; background-color: #fff; position: absolute; left: 0; bottom: 0; transition: 0.2s;}
.main_sec2 .wrap ul li:hover::after{opacity: 1;}
.main_sec2 .wrap ul li:hover a span::after{width: 100%;}

.main_sec2 .wrap ul li:nth-child(1){background-image: url(../img/main/main_sec2_img01.png); margin-bottom: 20px;}
.main_sec2 .wrap ul li:nth-child(2){background-image: url(../img/main/main_sec2_img02.png); margin-bottom: 20px;}
.main_sec2 .wrap ul li:nth-child(3){background-image: url(../img/main/main_sec2_img03.png);}
.main_sec2 .wrap ul li:nth-child(4){background-image: url(../img/main/main_sec2_img04.png);}


/* main_sec3 */
.main_sec3{width: 100%; padding: 0px 0 100px;}

.main_sec3 .swiper-container {width: 100%; height: auto; margin-left: auto; margin-right: auto;}
.main_sec3 .swiper-slide {
    /* text-align: center; */
    font-size: 18px;
    background: #f8f8f8;
    margin-bottom: 50px;
    /* height: 300px; */
  
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    flex-direction: column;
}
  
.main_sec3 .swiper-scrollbar-drag {
    background-color: #000;
    position: relative;
}
  
.main_sec3 .swiper-scrollbar-drag:before {
    content: '';
    background-color: #000;
    position: relative;
    left: -99vw;
    top: 0;
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 100vw;
    z-index: 999;
}
  
.main_sec3 .swiper-scrollbar-drag:after {
    content: '';
    background-color: #000;
    position: relative;
    left: -99vw;
    top: 0;
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 100vw;
    z-index: 999;
}

.main_sec3 .swiper-slide .img-wrap{height: 300px; display: flex; align-items: center;}
.main_sec3 .swiper-slide .txt-wrap{padding: 20px;}
.main_sec3 .swiper-slide .txt-wrap h3{font-size: 22px; font-weight: bold; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #828282; box-sizing: border-box;}
.main_sec3 .swiper-slide .txt-wrap p{font-size: 16px; color: #828282;}




/* main_sec4 */
.main_sec4{position: relative; width: 100%; margin-bottom: 100px;}
.main_sec4::after{content: ""; width: 30%; height: 100%; background-color: #f5f5f5; position: absolute; right: 0; top: 0; z-index: -1;}
.main_sec4 .wrap ul{padding: 100px 0;}
.main_sec4 .wrap ul li{display: flex; flex-wrap: wrap; align-items: center;}
.main_sec4 .wrap ul li a{width: 50%; background-color: #fff; box-shadow: 2px 1px 5px #e4e4e4; height: 250px; display: flex; justify-content: center; flex-direction: column; padding: 20px 50px; transition: 0.2s;}
.main_sec4 .wrap ul li a span{margin-left: 10%;}
.main_sec4 .wrap ul li a span p:nth-child(1){padding-bottom: 10px; margin-bottom: 10px; position: relative; display: inline-block; color: #000;}
.main_sec4 .wrap ul li a span p:nth-child(1)::before{content: ""; position: absolute; width: 0; height: 1px; right: 0; bottom: 4px; background-color: #000; transition: 0.2s; transform: rotate(45deg);}
.main_sec4 .wrap ul li a span p:nth-child(1)::after{content: ""; position: absolute; width: 0; height: 1px; left: 0; bottom: 0; background-color: #000; transition: 0.2s;}
.main_sec4 .wrap ul li a:hover{background-color: #fafafa;}
.main_sec4 .wrap ul li a:hover span p:nth-child(1)::before{width: 10px; right: -40%;}
.main_sec4 .wrap ul li a:hover span p:nth-child(1)::after{width: 140%;}

.main_sec4 .wrap ul li .click-bg{width: 60%; height: 300px; margin-left: -10%;}
.main_sec4 .wrap ul li:nth-child(1){margin-bottom: 50px;}
.main_sec4 .wrap ul li .click-bg{background-repeat: no-repeat;background-size: cover; background-position: center;}
.main_sec4 .wrap ul li:nth-child(1) .click-bg{background-image: url(../img/main/main_sec4_bg1.png); }
.main_sec4 .wrap ul li:nth-child(2) .click-bg{background-image: url(../img/main/main_sec4_bg2.png); }





/* main_sec5 */
.main_sec5{width: 100%; padding: 0 0 150px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.main_sec5 .notice{width: 48%; height: 420px;}
.main_sec5 .contact{width: 48%; background-image: url(../img/main/main_sec5_bg.png); background-repeat: no-repeat; background-position: center; background-size: cover; height: 420px; display: flex; align-items: center; justify-content: center;}
.main_sec5 .contact a{display: flex; align-items: center; flex-direction: column; text-align: center;}
.main_sec5 .contact a img{margin-bottom: 10px;}





/* 갤러리 상단 padding */
.main_sec5 .pic_lt.event .no-js .owl-carousel, .main_sec4 .pic_lt.event .owl-carousel.owl-loaded{padding-top: 120px;}

.owl-dots{display: none;}
.main_sec5 .pic_lt.event .owl-theme .owl-nav [class*=owl-]:hover{}
.main_sec5 .pic_lt.event .owl-carousel .owl-dots.disabled, .main_sec4 .pic_lt.event .owl-carousel .owl-nav.disabled{display: block;}

/* 좌우 버튼 */
.main_sec5 .pic_lt.event .owl-carousel .owl-nav{position: absolute; margin: 0; width: 138px; height: 38px; right: 0; top: 0;}
.main_sec5 .pic_lt.event .owl-carousel .owl-nav button.owl-next, .main_sec4 .pic_lt.event .owl-carousel .owl-nav button.owl-prev{margin: 0; position: absolute; width: 38px; height: 38px; border-radius: 0; background: url(../img/main/section4_left.png) no-repeat; background-position: center; background-color: none; outline: 0; border: 1px solid #bbb; box-sizing: border-box;}

.main_sec5 .pic_lt.event .owl-carousel .owl-nav button.owl-prev{left: 0;}
.main_sec5 .pic_lt.event .owl-carousel .owl-nav button.owl-next{right: 0; background-image: url(../img/main/section4_right.png);} 

/* 번호매김 */
/* .main_sec5 .pic_lt.event .owl-theme .owl-nav.disabled+.owl-dots{margin: 0; position: absolute; top: 0; right: 38px; width: 62px; height: 38px;}


.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot{position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot::after{display: block; position: absolute; top: 0; left: 0; content: "1 / 1"; width: 100%; height: 100%; line-height: 38px; background: none; opacity: 0; -ms-transform: skew(-0.1deg); -webkit-transform: skew(-0.1deg); transform: skew(-0.1deg); font-size: 14px;}
.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot span{margin: 0; width: 62px; height: 38px; border-radius: 0; position: absolute; top: 0; left: 0; opacity: 0; background: none;}

.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot.active::after{opacity: 1;}
.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot.active span{opacity: 1; background: none;}


.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot:first-child::after{content: "1 / 2";}
.main_sec5 .pic_lt.event .owl-theme .owl-dots .owl-dot:nth-child(2)::after{content: "2 / 2";} */




.main_sec5 .pic_lt.event .gall_text_area{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); opacity: 0; transition-duration: 0.3s; transition-timing-function: ease-in-out;}

.main_sec5 .pic_lt.event .item:hover .gall_text_area{opacity: 1;}

.main_sec5 .pic_lt.event .text_box{display: table; width: 100%; height: 100%;}
.main_sec5 .pic_lt.event .text_box .text{display: table-cell; padding: 15px; vertical-align: bottom;}
.main_sec5 .pic_lt.event .text_box .text *{color: #fff;}
.main_sec5 .pic_lt.event .text .gall_title{font-size: 2px; font-weight: bold;}
.main_sec5 .pic_lt.event .text .gall_date{font-size: 14px; font-weight: 300;}


.default_banner .swiper-pagination-current {color:#000}
.default_banner .swiper-pagination {left: 50px; text-align:left; font-size:22px; z-index: -1;}
.default_banner .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {left:auto}
.default_banner .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {cursor: pointer; opacity:1}
.default_banner .swiper-button-prev, .swiper-container-rtl .swiper-button-next {left:0}












@media screen and (max-width: 1460px){
    .main_sec1 .about-wrap .txt-wrap p br.none{display: none;}
}


@media screen and (max-width: 1400px){
    .main_sec2 .wrap ul li a{flex-direction: column; align-items: flex-start;}
}

@media screen and (max-width:1200px){
    .title-wrap{padding: 0 20px;}
    .notice .title-wrap{padding: 0 0px;}

    .main_page {margin:87px 0px 0px 0px; }
    .main_sec1::before{content: ""; background-color: #f5f5f5; width: 100%; height: 1000px; position: absolute; left: 0px; top: 0; z-index: -1;}

    .main_sec1 .about-wrap .txt-wrap{padding-left: 20px; width: 100%;}
    .main_sec1 .about-wrap .img-wrap{width: 100%; margin-top: 40px;}

    .main_sec4 .wrap ul li a span{margin-left: 0;}

    .main_sec5{padding-bottom: 0;}
    .main_sec5 .notice{width: 100%; margin: 0 20px; height: auto;}
    .main_sec5 .contact{width: 100%; margin-top: 40px;}   

    .default_banner .swiper-pagination {left: 60px; text-align:left; font-size:20px; z-index: -1;}
    .main_banner .swiper-button-next{left: 130px;}
    .default_banner .swiper-button-prev, .swiper-container-rtl .swiper-button-next {left: 20px}


}

@media screen and (max-width:1024px){
    .main_sec4::after{width: 100%;}
    .main_sec4 .wrap ul li{flex-direction: column;}
    .main_sec4 .wrap ul li a{order: 2; margin-top: -100px; width: 80%;}
    .main_sec4 .wrap ul li .click-bg{order: 1; margin-left: 0; width: 90%;}
    
}


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

}



@media screen and (max-width:768px){
    .main_sec2 .wrap ul li::after{opacity: 1;}
    .main_sec2 .wrap ul li{width: 100%; margin: 0 20px;}
    .main_sec2 .wrap ul li:nth-child(3){margin-bottom: 20px;}

    .main_sec4 .wrap ul li a{background-color: #fff;}
    .main_sec4 .wrap ul li a span p:nth-child(1)::before{width: 10px; right: -40%;}
    .main_sec4 .wrap ul li a span p:nth-child(1)::after{width: 140%;}

}





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


}


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


}
@media screen and (max-width:480px){
    .main_sec4 .wrap ul li a{height: 280px;}
    .main_sec4 .wrap ul li a:hover span p:nth-child(1)::before{width: 10px; right: -10%;}
    .main_sec4 .wrap ul li a:hover span p:nth-child(1)::after{width: 110%;}



}

@media screen and (max-width : 1400px) {
    .font-12{font-size: 12px !important; line-height: 180%;}
    .font-14{font-size: 14px !important; line-height: 180%;}
    .font-16{font-size: 16px !important; line-height: 180%;}
    .font-17{font-size: 17px !important; line-height: 180%;}
    .font-18{font-size: 18px !important; line-height: 180%;}
    .font-20{font-size: 20px !important; line-height: 180%;}
    .font-22{font-size: 22px !important; line-height: 180%;}
    .font-24{font-size: 24px !important; line-height: 180%;}
    .font-25{font-size: 25px !important; line-height: 180%;}
    .font-27{font-size: 27px !important; line-height: 180%;}
    .font-30{font-size: 30px !important; line-height: 180%;}
    .font-35{font-size: 32px !important; line-height: 160%;}
    .font-40{font-size: 38px !important; line-height: 160%;}
    .font-45{font-size: 42px !important; line-height: 160%;}
    .font-50{font-size: 48px !important; line-height: 160%;}
    .font-55{font-size: 52px !important; line-height: 160%;}
    .font-60{font-size: 55px !important; line-height: 160%;}
    .font-64{font-size: 60px !important; line-height: 160%;}
    .font-70{font-size: 65px !important; line-height: 160%;}
}
@media screen and (max-width : 1000px) {
    .font-12{font-size: 12px !important; line-height: 180%;}
    .font-14{font-size: 14px !important; line-height: 180%;}
    .font-16{font-size: 16px !important; line-height: 180%;}
    .font-17{font-size: 17px !important; line-height: 180%;}
    .font-18{font-size: 17px !important; line-height: 180%;}
    .font-20{font-size: 18px !important; line-height: 180%;}
    .font-22{font-size: 20px !important; line-height: 180%;}
    .font-24{font-size: 22px !important; line-height: 180%;}
    .font-25{font-size: 24px !important; line-height: 180%;}
    .font-27{font-size: 25px !important; line-height: 180%;}
    .font-30{font-size: 28px !important; line-height: 180%;}
    .font-35{font-size: 30px !important; line-height: 160%;}
    .font-40{font-size: 34px !important; line-height: 160%;}
    .font-45{font-size: 38px !important; line-height: 160%;}
    .font-50{font-size: 40px !important; line-height: 160%;}
    .font-55{font-size: 45px !important; line-height: 160%;}
    .font-60{font-size: 50px !important; line-height: 160%;}
    .font-64{font-size: 55px !important; line-height: 160%;}
    .font-70{font-size: 60px !important; line-height: 160%;}
}
@media screen and (max-width : 768px) {
    .font-12{font-size: 11px !important; line-height: 180%;}
    .font-14{font-size: 12px !important; line-height: 180%;}
    .font-16{font-size: 15px !important; line-height: 180%;}
    .font-17{font-size: 16px !important; line-height: 180%;}
    .font-18{font-size: 17px !important; line-height: 180%;}
    .font-20{font-size: 18px !important; line-height: 180%;}
    .font-22{font-size: 20px !important; line-height: 180%;}
    .font-24{font-size: 22px !important; line-height: 180%;}
    .font-25{font-size: 23px !important; line-height: 180%;}
    .font-27{font-size: 24px !important; line-height: 180%;}
    .font-30{font-size: 26px !important; line-height: 180%;}
    .font-35{font-size: 28px !important; line-height: 160%;}
    .font-40{font-size: 30px !important; line-height: 160%;}
    .font-45{font-size: 35px !important; line-height: 160%;}
    .font-50{font-size: 38px !important; line-height: 160%;}
    .font-55{font-size: 40px !important; line-height: 160%;}
    .font-60{font-size: 45px !important; line-height: 160%;}
    .font-64{font-size: 50px !important; line-height: 160%;}
    .font-70{font-size: 55px !important; line-height: 160%;}
}
@media screen and (max-width : 500px) {
    .font-12{font-size: 10px !important; line-height: 180%;}
    .font-14{font-size: 11px !important; line-height: 180%;}
    .font-16{font-size: 14px !important; line-height: 180%;}
    .font-17{font-size: 15px !important; line-height: 180%;}
    .font-18{font-size: 15px !important; line-height: 180%;}
    .font-20{font-size: 17px !important; line-height: 180%;}
    .font-22{font-size: 19px !important; line-height: 180%;}
    .font-24{font-size: 21px !important; line-height: 180%;}
    .font-25{font-size: 22px !important; line-height: 180%;}
    .font-27{font-size: 23px !important; line-height: 180%;}
    .font-30{font-size: 25px !important; line-height: 180%;}
    .font-35{font-size: 27px !important; line-height: 160%;}
    .font-40{font-size: 29px !important; line-height: 160%;}
    .font-45{font-size: 32px !important; line-height: 160%;}
    .font-50{font-size: 35px !important; line-height: 160%;}
    .font-55{font-size: 38px !important; line-height: 160%;}
    .font-60{font-size: 40px !important; line-height: 160%;}
    .font-64{font-size: 45px !important; line-height: 160%;}
    .font-70{font-size: 50px !important; line-height: 160%;}
}