/* opening */
.opening{width: 100%; height: 100vh;position:absolute;}
.opening .bg{width: 100%; height: 100%;position:fixed;top:0;left:0;background: url(../img/main/loding.jpg);z-index: 9999;}
.opening button{width: 200px;position:absolute;color:#fff;border:1px solid #fff;z-index: 99999;;top:630px;left:50%;transform: translate(-50%, -50%);padding:15px 0;font-weight: 600;}
.opening button:hover{background-color: #fff;color:#333;}





/* 리뉴얼 안내 페이지 */
.renewal_con{width: 100%; overflow: hidden; height: 100vh;}
.renewal_con .img_in{width: 100%; background: url(../img/main/renewal.jpg)no-repeat; background-position: center; background-size: cover; height: 100vh;}

.section{height:100vh;position:relative;overflow: hidden;}
.dis_bl{width:100%;/*  height:100%; */display: none;}
/* .posi_cen{position:absolute;top:50%; transform: translate(-50%, -50%); left:50%;} */
/* #section01{display: none;}
#section02{display: none;} */
/* slide */
#fp-nav.right {
    left: 40px !important;
    right: auto !important;
}

#fp-nav ul, .fp-slidesNav ul{display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    flex-direction: column;}
#fp-nav ul li, .fp-slidesNav ul li{margin:10px 0 !important;
width:18px !important; height:18px !important;}


#fp-nav ul li span, .fp-slidesNav ul li span{width:6px !important; height:6px !important; border-radius: 0 !important;margin: 0 !important;left:0 !important;top:0 !important;transform: rotate(45deg); background-color: #fff !important;opacity: 0.5;}
#fp-nav ul li .active, .fp-slidesNav ul li .active{margin:0;}
#fp-nav ul li .active span, .fp-slidesNav ul li .active span{
    width:13px !important; height: 13px !important; opacity: 1;
    border:1px solid #fff; background-color: transparent !important;    transform: translate(-4px, 0px) rotate(45deg);}
    #fp-nav ul li .active span::before, .fp-slidesNav ul li .active span::before{
        width:60%;height:60%; background-color: #fff; content:'';z-index: 99;;
    position:absolute;top:50%;left:50%; transform: translate(-50%,-50%);}


    .fp-viewing-5 #fp-nav ul li span, .fp-viewing-5 .fp-slidesNav ul li span,
    .fp-viewing-7 #fp-nav ul li span, .fp-viewing-7 .fp-slidesNav ul li span,  
    .fp-viewing-8 #fp-nav ul li span, .fp-viewing-8 .fp-slidesNav ul li span  
    
    {background-color: #333 !important;}
    .fp-viewing-5 #fp-nav ul li .active span, .fp-viewing-5 .fp-slidesNav ul li .active span,
    .fp-viewing-7 #fp-nav ul li .active span, .fp-viewing-7 .fp-slidesNav ul li .active span,
    .fp-viewing-8 #fp-nav ul li .active span, .fp-viewing-8 .fp-slidesNav ul li .active span    
    {background-color: transparent !important;    border:2px solid #333; }
    .fp-viewing-5 #fp-nav ul li .active span::before, .fp-viewing-5 .fp-slidesNav ul li .active span::before,
    .fp-viewing-7 #fp-nav ul li .active span::before, .fp-viewing-7 .fp-slidesNav ul li .active span::before,
    .fp-viewing-8 #fp-nav ul li .active span::before, .fp-viewing-8 .fp-slidesNav ul li .active span::before
    { background-color: #333 !important;}







    .slide .slick-dotted.slick-slider{margin-bottom:0;}
    
.slide{position:relative}
.slide.section .slide_sli{height:100%}
.slide .slick-slider{height:100%;}
.slide .slick-list{height:100%;}
.slide .slick-track{height:100%;}
.slide .slick-slide{position: relative;}
.slide.slide .text_box{position:absolute;top:50%; transform: translateY(-50%);left:10%;}
.slide .sli h2{font-size:3rem; line-height: 1.3;overflow: hidden;color:#fff;}
.slide .sli h2 span{display: block; 
    animation-name: sli_h2;
    animation-duration:1s;
}
.slide .sli .bg_sli{width: 100%;height:100%;}
.slide .sli .video_sli_sec{display:none;    height: 100%;}
.slide .sli .video_sli_sec iframe{ height: 100%;}
.slide .sli .img_sli_sec{height:100%;}
.slide .sli .ytp-impression-link{display: none !important;}


@-webkit-keyframes sli_h2 {
    0% {
        transform: translateY(70px);
    }
    100% {
        transform: translateY(0);
    }
  }

.sli p{font-size:1.3rem; line-height: 1.3;font-weight: 300;margin-top:30px; overflow: hidden;color:#fff;}
.sli p span{display: block;
    animation-name: sli_p;
    animation-duration:1.3s;
}
@-webkit-keyframes sli_p {
    0% {
        transform: translateY(70px);
    }
    100% {
        transform: translateY(0);
    }
  }

/* 슬릭버튼 */
.slide .plst{position:absolute;bottom:63px;left: 400px;    width: 14px;
    height: 14px;display: flex;align-items: center;
    justify-content: center;}
.slide .plst button{width:15px; height:13px;}
.slide .plst .play{display: none;background: url(../img/main/sli_stop.svg) no-repeat;}
.slide .plst .stop{background: url(../img/main/sli_play.svg) no-repeat;}



.slide .pagingInfo{position:absolute;color:#fff;z-index: 99;bottom:57px; left:300px;font-size:16px;font-weight: 600;    letter-spacing: 8px;}
.slide .slick-prev {left: 185px !important;z-index: 99; top:auto !important;bottom:50px !important;}
.slide .slick-prev:before{content: '' !important;  width:13px; height:13px; border-top:3px solid #fff; border-right:3px solid #fff; transform: rotate(-135deg);}

.slide .slick-next {left: 225px !important;z-index: 99; top:auto !important;bottom:50px !important;}
.slide .slick-next:before{content: '' !important;  width:13px; height:13px; border-top:3px solid #fff; border-right:3px solid #fff; transform: rotate(45deg);}


.slide .slick-dots{    bottom: 30px !important;    width: 65% !important;    right: 120px;}
.slide .slick-dots li{width:calc(25% - 20px) !important; margin:10px !important;    height: 40px !important;overflow: hidden;position:relative}
.slide .slick-dots li button{height: 1px !important;background-color: #fff !important;width:100% !important;padding: 1px !important;opacity: 0;}
.slide .slick-dots li.slick-active button{ opacity: 1;width:0%;

    animation-name: slickactive;
    animation-duration:5s;
    animation-timing-function:linear;

}

@-webkit-keyframes slickactive {
    0% {
       width:0%;
       transform: translateX(-99%);
       
    }
    100% {
       width:100%;
       transform: translateX(00px);
    }
  }
.slide .slick-dots li::before{position:absolute;top:20px;left:0; color:#fff;font-weight: 500;}
.slide .slick-dots li:first-child::before{content:attr(data-content);display: block;}
.slide .slick-dots li:nth-child(2)::before{content:attr(data-content);display: block;}
.slide .slick-dots li:nth-child(3)::before{content:attr(data-content);display: block;}
.slide .slick-dots li:last-child::before{content:attr(data-content);display: block;}




.slide .slick-dots li::after{content:'';display: block; background-color: #fff; width:100%; height:2px; position:absolute; top:0; left:0;opacity: 0.3;}



.scroll_ani{position:absolute; bottom:130px; left:-2px; transform: rotate(-90deg); color:#fff;font-size:13px;}
.scroll_ani span{width:33px; height:18px; border:2px solid #fff;border-radius: 30px;position: absolute;
    left: -44px; top:50%; transform: translateY(-50%);
}
.scroll_ani span::after{width:7px; height:7px; content:''; display: block; border-radius: 10px;;background-color: #fff;;position:absolute; top:50%; left:5px; transform: translateY(-50%);

    animation-name: scroll_ani;
    animation-duration:1.3s;
    /* animation-direction:alternate-reverse; */
    /* animation-timing-function:linear; */
    animation-iteration-count :infinite
}

@-webkit-keyframes scroll_ani {
    0% {
        left:18px;     
    }
    30% {
        opacity:1;
       
    }
    100% {
        left:5px;
        opacity:0;
    }
  }

/* sec01 */
.sec_in {display: flex;}
.sec_in > div{position: relative; overflow: hidden;width:50%;}


/* .sec01 .left{position: relative;overflow: hidden;} */
.sec01 .left h3{color:#fff;}
.sec01 .sli_div{height:100vh;    width: 100%; }
.sec01 .taxt_box{position: absolute;bottom:100px;left:100px;cursor: pointer;   }
.section h3{font-size:2.5rem; font-weight: 600; width: fit-content;}


.sec01  h3::after{content:'';display: block; width:15px; height: 15px; border-top:3px solid #fff; border-right:3px solid #fff;position:absolute;top:26px;transform: rotate(45deg);

    animation-name: sec_h3;
    animation-duration:0.8s;
    animation-iteration-count :infinite;
    animation-direction:alternate-reverse;
    animation-timing-function:ease-in;
}

@-webkit-keyframes sec_h3 {
    0% {
       transform: translateX(10px) rotate(45deg);
    }
    100% {
        transform: translateX(0px) rotate(45deg);
    }
  }


  .sec01 .right_top h3::after{display: none;}

.sec01 .right_bottom h3::after{right:150px;}

.sec01 .left h3::after{right:300px;}


.sec01 .taxt_box p{font-size:1.125rem; color:#fff;opacity: 0.7;margin-top:10px;}
:lang(en) .sec01 .taxt_box p{padding-right:290px;}
.sec01 .slick-slider{height:100%;}
.sec01 .slick-list{height:100%;}
.sec01 .slick-track{height:100%;}
.sec01 .left .in_con{ width: 100%;
    animation-name: sec01_left;
    animation-duration:0.5s;
}

@-webkit-keyframes sec01_left {
    0% {
        /* transform: translateX(-500px); */
       opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
  }

  .sec01 .right_bottom{     transform: translateX(0);
    animation-name: sec01_right_bottom;
    animation-duration: 0.6s;
}
.sec01 .right_top{   
    animation-name: sec01_right_top;
    animation-duration:0.5s;
}

@-webkit-keyframes sec01_right_top {
    0% {
        width:0;
       
    }
    100% {
        width:100%;
    }
  }

  .sec01 .right_bottom{   
    animation-name: sec01_right_bottom;
    animation-duration: 0.6s;
}

@-webkit-keyframes sec01_right_bottom{
    0% {
        width:0;
        height:50vh
       
    }
    100% {
        width:100%;
    }
  }



.sec01 .right_top{background-color: #fff;}
.sec01 .right_top >div{padding:20px 0 ;;}
/* .sec01 .right_top .text_b{position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    left: 50%;
} */
.sec01 .right_top h3{font-size:1.5rem;}

.sec01 .right_top ul{margin-top:5px;}
.sec01 .right_top ul li{/* line-height: 3.5; */font-size:0.95rem; font-weight: 400;position:relative}
.sec01 .right_top ul li::after{content:'';display: block ; position:absolute;top:50%; right:0; transform: translateY(-50%) rotate(45deg);  transition: all 0.5s linear;width: 8px; height: 8px; border-top:1px solid #bbb; border-right:1px solid #bbb;;}
.sec01 .right_top .ri_top_tb ul li::after{border-top:1px solid #fff; border-right:1px solid #fff;opacity: 0.5;;}


/* .sec01 .right_top ul li:hover::after{transform: rotate(180deg);transform-origin: center ;} */

.sec01 .right > div{/* padding-left:100px; */ height:50vh;width:100%;
    overflow: hidden;    position: relative;    display: flex;
}
.sec01 .right_top > div{width: 50%;;display: flex; align-items: center; flex-direction: column;justify-content: center;}
.sec01 .right .right_top > div:last-child{background-color: #0c3869;color:#fff;    }
.sec01 .right .right_top > div:last-child ul{color:#fff}


.sec01 .right > div .text_b{padding:20px 50px;width: 100%;}
.sec01 .right_top ul li p{overflow: hidden;     padding: 6px 0;}
.sec01 .right_top ul li p::before{width:100%; height:1px; content: '';display: block; background-color: #333;position:absolute; bottom:0; left:0;opacity: 0.1;}
.sec01 .right_top .ri_top_tb ul li p::before{background-color: #fff;}

.sec01 .le_top_tb ul li p::after{width:0%; height:1px; content: '';display: block; background-color: #0c3869;position:absolute; bottom:0; left:0;opacity: 1;transition-duration:0.5s ;}
.sec01 .ri_top_tb ul li p::after{width:0%; height:1px; content: '';display: block; background-color: #fff;position:absolute; bottom:0; left:0;opacity: 1;transition-duration:0.5s ;}



.sec01 .le_top_tb ul li:hover p::after{ width:100%;}
.sec01 .le_top_tb ul li:hover p{color:#0c3869}
.sec01 .le_top_tb ul li:hover::after{border-color:#0c3869}
.sec01 .ri_top_tb ul li:hover p::after{ width:100%;}
.sec01 .ri_top_tb ul li:hover p{color:#fff}
.sec01 .ri_top_tb ul li:hover::after{color:#fff;opacity: 1;}




.sec01 .right_bottom h3{color:#fff;}
.sec01 .right_bottom{transition-duration:0.5s ;overflow: hidden;}
.sec01 .right_bottom .in_bg{background: url(../img/main/sec02_right_bg.jpg) no-repeat center; background-size: cover;transition-duration:0.5s ;width:100%; height:100%;transform: scale(1);}
.sec01 .right_bottom:hover .in_bg{transform: scale(1.1);}

/* sec02 */





.sec02{background-color: #fff;z-index: -1;;}
.sec02 .top{text-align: center;}
.sec02 .top p{font-size:1rem; color:#888;margin-top:10px;}

.sec02 h3{text-align: center;margin: 0 auto}
.section .top h3{overflow: hidden;}
.section .top h3 span{
    display: block; transition-duration: 0.3s;
        animation-name: sec02h3;
        animation-duration: 1s;
    }
    
    @-webkit-keyframes sec02h3{
        0% {
            transform: translatey(60px);
           
        }
        100% {
            transform: translateX(0);
        }
      }
    
    
.section .top p{overflow: hidden;}   
    
  .section .top p span{opacity: 0.7;
display: block; transition-duration: 0.3s;
    animation-name: sec02p;
    animation-duration: 1s;
}

@-webkit-keyframes sec02p{
    0% {
        transform: translatey(20px);
       
    }
    100% {
        transform: translateX(0);
    }
  }





.sec02 .con{height:60vh;margin-top:80px;padding-top:0 ;}
.sec02 .top_con {height:42vh;display: flex; align-content: center; align-items: center; }
.sec02 .top_con li{width:calc(100% / 3);text-align: center;position:relative}
.sec02 .top_con li:after{content: '';display:block; width:1px; height:100vh;background-color: #ddd;position:absolute;top:-143%;left:0;z-index: -1;}
.sec02 .top_con li:last-child::before{content: '';display:block; width:1px; height:105vh;background-color: #ddd;position:absolute;top:-145%;;right:0px;z-index: 9;}
.sec02 .top_con li p.txt01{font-size:1.125rem; color:#888; overflow: hidden; transition-duration: 0.8s;}
    .sec02 .top_con li p.txt01 span{
    animation-name: sec02txt01;display: block;
    animation-duration: 1s;
}

@-webkit-keyframes sec02txt01{
    0% {
        transform: translatey(20px);
       
    }
    100% {
        transform: translateX(0);
    }
  }


  :lang(en) .sec02 .top_con li p.txt02{padding: 0 100px;}

.sec02 .top_con li p.txt02{font-size:0.9rem; color:#888;margin-top:15px;line-height: 1.8;word-break: keep-all;

    animation-name: sec02txt02;display: block;
    animation-duration: 1s;
}

@-webkit-keyframes sec02txt02{
    0% {
       opacity: 0;
       
    }
    100% {
        opacity: 1;
    }
  }




.sec02 .top_con li h4{font-size:2rem; color:#333;margin-top:20px;}
.sec02 .top_con li >div:hover .txt01{color:#0c3869}


.sec02 .top_con li .ani_i01{background:url(../img/main/sec02_01.svg) no-repeat; transition-duration:0.8s ;}
.sec02 .top_con li >div:hover .ani_i01{background:url(../img/main/sec02_01_b.svg) no-repeat; }
.sec02 .top_con li .ani_i02{background:url(../img/main/sec02_02.svg) no-repeat; transition-duration:0.8s ;}
.sec02 .top_con li >div:hover .ani_i02{background:url(../img/main/sec02_02_b.svg) no-repeat; }
.sec02 .top_con li .ani_i03{background:url(../img/main/sec02_03.svg) no-repeat; transition-duration:0.8s ;}
.sec02 .top_con li >div:hover .ani_i03{background:url(../img/main/sec02_03_b.svg) no-repeat; }






.sec02 .top_con i{width:50px;height:50px;;display: block;margin:0 auto;margin-bottom:50px;   
    
    animation-name: top_coni;
    animation-duration: 1s;
}








@-webkit-keyframes top_coni{
    0% {
        transform: scale(0);
       
    }
    100% {
        transform: scale(1);
    }
  }




.sec02 .bo_con {height:18vh; display: flex;}
.sec02 .bo_con li{width:50%;position: relative;overflow: hidden;cursor: pointer;}

.sec02 .bo_con .text_box{position:absolute;top:50%;left:40px;transform: translateY(-50%);width: 90%;}
.sec02 .bo_con .text_box::after{content:'';display: block; width:15px; height: 15px; border-top:2px solid #fff; border-right:2px solid #fff;position:absolute;top:50%;transform: rotate(45deg) translateY(-50%);right: 10px;

    animation-name: sec_h3;
    animation-duration:0.8s;
    animation-iteration-count :infinite;
    animation-direction:alternate-reverse;
    animation-timing-function:ease-in;
}

@-webkit-keyframes sec_h3 {
    0% {
       transform: translateX(10px) rotate(45deg) translateY(-50%);
    }
    100% {
        transform: translateX(0px) rotate(45deg) translateY(-50%);
    }
  }




.sec02 .bg_w > div{position:absolute;top:50%;left:50px; transform: translateY(-50%);}
.sec02 .bo_con li:hover .bg_w01{transform: scale(1.1);}
.sec02 .bo_con li:hover .bg_w02{transform: scale(1.1);}
.sec02 .bg_w01{
    transition-duration:0.5s ;


    animation-name: bg_w01;
    animation-duration: 0.5s;
}

@-webkit-keyframes bg_w01{
    0% {
        width: 0;
       
    }
    100% {
        width: 100%;
    }
  }

  .sec02 .bg_w02{
    transition-duration:0.5s ;
    
    animation-name: bg_w02;
    animation-duration: 0.5s;
}

@-webkit-keyframes bg_w02{
    0% {
        width: 0;
       
    }
    100% {
        width: 100%;
    }
  }



.sec02 .bo_con h4{ font-size:1.25rem;color:#fff;}
.sec02 .bo_con p{ font-size:1rem;color:#fff;margin-top:10px; opacity: 0.7;}

.sec02 .bg_w{width:100%; height:100%;}




/* sec03 */
.sec03 .slick-list.draggable{/* position: absolute;  */top: 0; left: 0;width: 115%; /* z-index: -1; */}
.sec03{ background:url(../img/main/notice_bg.jpg) no-repeat;display: flex;
    flex-direction: column;overflow: hidden;background-size: cover;
    justify-content: center;}
 /* .sec03 .bd-xl{margin-top:100px;} */
.sec03 .top{margin-bottom:8vh;color:#fff;padding-left:100px;}
.sec03 .top p{font-size:1rem; margin-top:10px;opacity: 0.7;;}



.sec03 .notice{ transform: translateX(100px);   height:auto;}
.sec03 .slick-slide {margin-right:40px;display: block;cursor: pointer;}
.sec03 .slick-slide .in{    height: 100%;background-color: #fff;padding:40px 30px;position:relative;
    display: block;

        
    animation-name: sec03_in;
    animation-duration: 0.5s;

}

@-webkit-keyframes sec03_in{
    0% {
        width:0;
        visibility: hidden;
        opacity: 0;
       
    }
    100% {
        width:100%;
        visibility: inherit;
        opacity: 1;
    }
  }



.sec03 .sli_div, .sec03 .slick-slider, .sec03 .slick-list, .sec03 .slick-track
{height:100%;}
.sec03 .new_tit{font-size:1.6rem; font-weight: 300;line-height: 1.6;margin-bottom:10px;}
.sec03 .blog_img{width:100%;height:220px; display: block;    background-size: cover;    background-position: center;}
.sec03 .new_txt{font-size:1.2rem; margin-bottom: 20px;font-weight: 300;margin-top:10px;line-height: 1.8;opacity: 0.7;}
.sec03 .date{font-size:14px;     font-weight: 600;color:#888;text-align: right;}

.sec03 .slick-prev {left: auto !important;right: 450px !important;top:-20% !important;}
.sec03 .slick-prev:before{content: '' !important;  width:13px; height:13px; opacity: 1 !important; border-top:2px solid #fff; border-right:2px solid #fff; transform: rotate(-135deg);}

.sec03 .slick-next {left: auto !important;right: 390px !important;top:-20% !important;}
.sec03 .slick-next:before{content: '' !important;  width:13px; height:13px; opacity: 1 !important; border-top:2px solid #fff; border-right:2px solid #fff; transform: rotate(45deg);}

.sec03 .plst{position:absolute;top:-101px;right: 230px;display: flex;
    align-items: center;
    justify-content: center;}
.sec03 .plst button{width:18px; height:18px;}
.sec03 .plst .play{display: none;background: url(../img/main/sli_play.svg) no-repeat;}
.sec03 .plst .stop{background: url(../img/main/sli_stop.svg) no-repeat;}

.sec03 .pagingInfo01{position:absolute;top:-104px; right:294px; color:#fff; font-size:15px;letter-spacing: 9px;font-weight: 600;} 

.css_tit{ 
    /* 한 줄 자르기 */ display: inline-block; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 
   
 }

.css_tar {/* 여러 줄 자르기 추가 스타일 */ white-space: normal; line-height: 1.2; height: 3.6em; text-align: left; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp:2; -webkit-box-orient: vertical;    overflow: hidden; }


/* sec04 */
.sec04{display: flex;flex-direction: column;background-color: #fff;
    justify-content: center;z-index: -1;}
.sec04 .top{margin-bottom:7vh;}
.sec04 .con{display: flex;justify-content:center;padding: 0 60px;}
.sec04 .con .left{width:40%;margin-right:15%;}
.sec04 .con .right{width:40%;}
.sec04 li{margin-bottom:2vh}
.sec04 .input{height:4.5vh}
.sec04 .input >div{height:100%;display: flex;justify-content:flex-start;}
.sec04 .input input{height:100%;border:1px solid #ddd;padding:10px;width:100%;}
.sec04 .input .inp{ width:calc(50% - 7px);margin-right:15px;}
.sec04 .input .inp:last-child{margin-right:0;}
.sec04 .text_ar .inp{ width:100%;margin-right:15px;}
.sec04 input{outline: 0;

        
    animation-name: sec04_input;
    animation-duration: 0.5s;

}

@-webkit-keyframes sec04_input{
    0% {
        width:0;
       
    }
    100% {
        width:100%;
    }
}








.sec04 .input input:last-child{margin-right:0;}


.sec04 .text_ar{height:20vh}
.sec04 .text_ar >div{height:100%;}
.sec04 .text_ar textarea{height:100%;border:1px solid #ddd;padding:10px; width: 100%;outline: 0;

    animation-name: sec04_text;
    animation-duration: 0.5s;

}

@-webkit-keyframes sec04_text{
    0% {
        width:0;
       
    }
    100% {
        width:100%;
    }
}






.sec04 .check{font-size:13px;color:#888}
/* .sec04 .check > div{display: flex;
    align-items: center;} */

    /* .sec04 .check .hove_sli{display: flex;align-items: center;} */
    input[type="checkbox"]{
        display: none;
      }
input[type="checkbox"] + label{transform: translateY(3px);
        display: inline-block;
        width: 15px;
        height: 15px;
        border:1px solid #ddd;
        position: relative;margin-right:5px;
      }
input[id="checkbox"]:checked + label::after{
        content:'';
        background: url(../img/sub/check02.png) no-repeat left/15px;
        font-size: 25px;
        width: 200px;
        height: 15px;
        border-color:#0c3869;
        text-align: center;
        position: absolute;
        left: 0;
        top:0;
      }
      input + label p{position:absolute; left:18px;top:-3px;width: 600px;}
      input + label p span{cursor: pointer;margin-left:5px;}


    .sec04 .check_con{border:1px solid #ddd; height:15vh; overflow-y: scroll;margin-top:10px;display: none; background-color: #fff;font-size:0.8rem; padding:10px;
    }
    .sec04 .check_con::-webkit-scrollbar{width:15px;background: #f5f5f5;}
    .sec04 .check_con::-webkit-scrollbar-thumb{background: #bbb;background-clip: padding-box;
        border: 3px solid transparent;}

.sec04 button{width:100%; background: #ddd;padding:20px 0;margin-top:30px;color:#888;font-weight: 400;font-size:1rem; transition-duration:0.3s ;}
.sec04 button:hover{background: #0c3869;color:#fff;}

.sec04 .right{display: flex;
    align-items: center;
    justify-content: flex-start;}
    .sec04::before{width:30%;height:100vh; content:'';display: block;background: #f5f5f5;z-index: -1;position: absolute; top:0;right:0;}
.sec04 .right > div{width:100%;height: 45vh; overflow: hidden;background:url(../img/main/sec04_bg.jpg) no-repeat  center;background-size: cover;


        
    animation-name: sec04_ri;
    animation-duration: 0.5s;
}

@-webkit-keyframes sec04_ri{
    0% {
       width:0;
    }
    100% {
        width:100%;
    }
  }








.sec02 .con .top_con h4  {
    /* font-family: Courier, monospace; */
    display: inline-block;
}
.sec02 .con .top_con h4 span {
    display: inline-block;
  	overflow: hidden;
      letter-spacing: -0.5px;;
 	animation: typing 2s steps(30, end), blink .75s step-end infinite;
    white-space: nowrap;
    font-size: 30px;
    font-weight: 700;
    border-right: 4px solid transparent;
    box-sizing: border-box;
}

@keyframes typing {
    from { 
        width: 0% 
    }
    to { 
        width: 100% 
    }
}

@keyframes blink {
    from, to { 
        border-color: transparent 
    }
    50% { 
        border-color: transparent; 
    }
}

    
/* ********************************************* *
 * 1600px
 * ********************************************* */
 @media screen and (max-width: 1660px){
   
    .slide .slick-dots {right: 60px; }
   
    
}

/* ********************************************* *
* 1400px
* ********************************************* */
@media screen and (max-width: 1400px){
    .slide .slick-prev {left: 135px !important;}
    .slide .slick-next {left: 195px !important; }
    .slide .pagingInfo {left: 260px;}
    .slide .plst {left: 350px;}

    .sec01 .taxt_box {bottom: 50px;left: 50px;width:80%;}
 

    .sec03 .top {padding-left: 80px; }
    .sec03 .notice {transform: translateX(80px);}

    .sec01 .taxt_box {width: 85%; }
       .section .left h3::after {right: 40px;}
       .section .right_bottom h3::after {right: 40px;}


       .sec02 .bo_con .text_box {width: 85%; }

       .sec02 .con .top_con h4 span {font-size: 26px;}
       :lang(en) .sec01 .taxt_box p{    padding-right: 0;}
}

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

    .scroll_ani{display: none;}
    :lang(en) .sec02 .top_con li p.txt02 {  padding: 0; }

    .slide.slide .text_box {left: 40px; }
    .slide .slick-prev {left: 45px !important;}
    .slide .slick-next {left:105px !important; }
    .slide .pagingInfo {left: 170px;}
    .slide .plst {left: 260px;}
    .slide .slick-dots {width: 66% !important; right: 40px;}

    .section.sec01 h3::after{display: none;}
    .section h3 {font-size: 2rem;}
    .sec02 .top_con li:last-child::before{display: none;}
    .sec02 .top_con li:after{display: none;}
    .section .top p span{display: none;}
    .sec02 .top_con{ display: inherit;height: auto;}
    .sec02 .top_con li { width: 100%;margin-bottom:50px;}
    .sec02 .top_con li > div{display: flex; text-align: left;align-items: center;width: 80%;margin:0 auto;}
    .sec02 .top_con li > div> div{width:100%;}
    .sec02 .top_con li i{margin:0;margin-right:40px;}
    .sec02 .top_con li h4{margin-top:0;font-size: 0;}
    .sec02 .top_con li p.txt02{width: 100%;margin-top:0;;}
    .sec02 .top_con li p.txt02 br{display: none;}
    .sec02 .con .top_con h4 span{font-size: 25px;}

    .sec02{padding:100px 0;padding-bottom: 0;}


    .sec04 {padding:120px 0;}
    .sec04 .con { display: inherit;     padding: 40px 0;}
    .sec04 .con .left{width:100%;}
    .sec04 .con .right{width:100%;margin-top:45px;}
    .sec04 input{background-color: #fff;}
    .sec04 .right > div {height: 50vh;}

    
    .sec03 .top {padding-left: 20px; }
    .sec03 .notice {transform: translateX(20px);}



    .sec03 .plst {top: -65px;  right: 40px;}
    .sec03 .pagingInfo01 {top:-68px;right: 94px;}

    .sec03 .slick-next {right: 200px !important;top:-15%!important;}
    .sec03 .slick-prev {right: 280px !important; top:-15%!important;}
    .sec03 .slick-list.draggable { width: 130%;}

    .sec04::before {height: 100%;}

    .sec03 .slick-slide .in {padding: 30px 30px;}
    .sec01 .right > div .text_b {
        padding: 20px 20px;}
  
}

/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){
    .sec03 .slick-list.draggable {
        width: 170%;
    }
}


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


    .sec03 .slick-list.draggable { width: 200%;}



}
/* ********************************************* *
*900px
* ********************************************* */
@media screen and (max-width:900px){
    .slide .slick-dots {width:96% !important; right: 50%;transform: translateX(50%);}
    .slide .slick-dots li:first-child::before{display: none;}
    .slide .slick-dots li:nth-child(2)::before{display: none;}
    .slide .slick-dots li:nth-child(3)::before{display: none;}
    .slide .slick-dots li:last-child::before{display: none;}
    .slide .slick-dots li::after {height: 3px;}
    .slide .slick-dots li button {height: 3px !important;}
    .slide .slick-dots li {height: 3px !important;}
    .slide .slick-prev {bottom: 80px !important;}
    .slide .slick-next {bottom: 80px !important;}
    .slide .pagingInfo{bottom: 89px !important;}
    .slide .plst{bottom: 93px !important;}
    .slide.slide .text_box{top:auto;bottom:100px;}
    .sli p {margin-top: 10px;}

    .sec_in { display: inherit;}
    .sec_in > div{width:100%;}
    .sec01 .right > div {height: 50vh;}
    .sec01 .right .right_bottom {height: 250px;}




    .sec02 .con {height: auto;}

    .sec02 .top_con li >div:hover .txt01{color:#888}
    .sec02 .top_con li >div:hover .ani_i01{background:url(../img/main/sec02_01.svg) no-repeat; }
    .sec02 .top_con li >div:hover .ani_i02{background:url(../img/main/sec02_02.svg) no-repeat; }
    .sec02 .top_con li >div:hover .ani_i03{background:url(../img/main/sec02_03.svg) no-repeat; }

    .sec02 .bo_con { display: inherit;    height: 300px;}
    .sec02 .bo_con li { width: 100%;height:150px; }
    .sec02 .bd-xl{height:100%;;}
    .dis_bl{ height:100%;}
    /* .sec02 .dis_bl { height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);} */
    /* .sec04 .con{ height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);width: 100%;} */
    .sec04 .con .left{padding:0 20px;}
    .sec02 .top_con {padding:0 20px;}
    .sec03 .dis_bl{position:absolute;top:50%; transform: translateY(-50%);height: auto;}


    
    .slide.slide .text_box { left: 20px;}
    .slide .slick-prev {left: 25px !important;}
    .slide .slick-next {left: 75px !important;}
    .slide .pagingInfo {left: 131px;    bottom: 86px !important;}
    .slide .plst {left: 241px;bottom: 93px!important;}
    .slide .slick-dots li {margin: 5px !important;width: calc(25% - 10px) !important;}

    .slide .sli h2 {font-size: 2.5rem;}

    .sec01 .taxt_box {
        width: 40%;
    }

    .sec02 .bo_con .text_box {width: 90%; }
    .sec01 .taxt_box {  width: 95%; }
    .section .right_bottom h3::after {display:none;}
    .section .left h3::after{display:none;}
}


/* ********************************************* *
* 768px
* ********************************************* */
@media screen and (min-width: 769px){
 

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



    .sec03 .slick-list.draggable { width: 290%;}
    .sec03 .slick-slide .in{padding:30px 25px;}
    .sec03 .slick-slide { margin-right: 20px;}
    /* .sec03 .date{bottom:30px; right:25px;} */



    .sec01 .taxt_box {bottom: 20px;left: 20px;}
    .sec01 .right_top .text_b{position: inherit; top:0; transform: none;left:0;margin:0 auto;width: 95%;}
    .sec01 .right .right_top{height: auto;/* padding:40px 0;  */}

    

    /* .sec03 .notice {height: 40vh;} */
    .sec04 button {background: #0c3869; color: #fff; }

    .sec03 .pagingInfo01 {top: -61px;}
    .sec03 .plst {top: -58px;}

    .sec03 .slick-next { top: -13%!important; }
    .sec03 .slick-prev { top: -13%!important; }
    
    .sec03 .new_tit {font-size: 1.5rem;}
    .sec03 .notice {height: 430px; }


    /* hover */

    .sec01 .right_top ul li:hover p {color: #888;}
    .sec01 .right_top ul li:hover::after {color: #888;}
    .sec01 .right_top ul li:hover p::after{display: none;}
    .sec02 .bo_con li:hover .bg_w01 {transform: scale(1);}
    .sec02 .bo_con li:hover .bg_w02 {transform: scale(1);}
    .sec01 .right_bottom:hover .in_bg {transform: scale(1);}

}

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

    .sec02 {padding: 60px 0;padding-bottom:0;}
    .sec04 {padding: 0 0;}
    .sec02 .con {margin-top: 30px;}
    .sec04 .top{margin-bottom: 30px;}


    .sec02 .top_con li i{display: none;}
    .sec02 .top_con li > div{width:100%;}

    .sec02 .bo_con li {height: 120px; }
    .sec02 .bo_con {height: 240px; }
    .sec01 .sli_div {height: 50vh;}


    .sec03 .slick-next { right: 150px !important;    top: -13% !important;}
    .sec03 .slick-prev { right: 200px !important;    top: -13% !important;}
    .sec03 .slick-prev:before{width: 9px;height: 9px;}
    .sec03 .slick-next:before {width: 9px;height: 9px;}
    .sec03 .pagingInfo01 { font-size: 13px;    right: 74px;top:-48px;}
    .sec03 .plst{    top:-66px}
    .sec03 .plst button{    width: 12px; height: 12px;}

    .sec02 .bo_con .text_box {
        position: absolute;width:90%;
        top: 50%;
        left: 20px;}
    .sec04 .right > div {height: 30vh;}
    .sec02 .bo_con h4 {font-size: 1.125rem;}
    .sec02 .bo_con p {font-size: 0.95rem;;}


    .slide.slide .text_box {bottom: 70px;}

    .sec01 .right > div .text_b { padding: 20px 20px;}


    .section h3 {font-size: 2rem;}
    .sec01 .taxt_box p {font-size: 1rem;font-weight: 300;    margin-top: 5px;}
    .sec04 button{margin-top:0;padding:15px 0;}
    


    .slide .slick-prev {bottom: 50px !important;}
    .slide .slick-next {bottom: 50px !important;left: 65px !important;}
    .slide .pagingInfo {bottom: 60px !important;left: 111px;font-size: 14px;}
    .slide .plst {left: 211px;bottom: 64px !important;}

    .sec04::before{display: none;}

    .sec01 .taxt_box {
        width: 98%;
    }
    .sec04 .con .left { padding: 0;}

    .section h3::after{width: 11px; height: 11px; border-top: 2px solid #fff;
        border-right: 2px solid #fff;top: 17px;}

        :lang(en) .sec01 .taxt_box p br{display:none;}
        :lang(en) .sec02 .top_con li p.txt02 {
            padding: 0;
        }

}


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

    .sec03 .slick-list.draggable { width: 340%;}


    .lag {display: none; }
    .slide .slick-dots {width:91% !important; right: 50%;transform: translateX(50%);}
    .slide .slick-dots li {margin: 2px !important;width: calc(25% - 4px) !important;}


    
    .slide .slick-dots li::after {height: 2px;}
    .slide .slick-dots li button {height: 2px !important;}
    .slide .slick-dots li {height: 2px !important;}


    .sec03 .new_txt {margin-top: 10px;margin-bottom: 10px;}



    .sec01 .right > div {flex-direction: column;}
    .sec01 .right_top > div {width: 100%;}
    .sec01 .right > div .text_b {padding: 20px 20px}
    .sec01 .right_top >div {padding: 0;}
    input + label p { width: 300px;}
    .sec04 button {margin-top: 20px; }
    .sec04 .check_con {margin-top: 30px;}
}

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



    .sec03 .slick-list.draggable { width: 350%;}
    .sec04 .right > div {height: 25vh;}


    .slide .sli h2 {font-size: 1.5rem;}
    .sli p {font-size: 1rem;font-weight: 400;}

    .slide .slick-next:before{width: 10px; height: 10px; border-top: 2px solid #fff;
        border-right: 2px solid #fff;;}
    .slide .slick-prev:before{width: 10px; height: 10px; border-top: 2px solid #fff;
        border-right: 2px solid #fff;;} 

    


    .sec02 .bo_con li {height: 100px; }
    .sec02 .bo_con {height: 200px; }
    .sec02 .bo_con p { margin-top: 5px;}


    .sec03 .slick-next {top: -14% !important;}
    .sec03 .slick-prev {top: -14% !important;}

    .sec01 .taxt_box {
        width: 80%;
    }

    .sec02 .bo_con .text_box {width: 85%; }
    .sec02 .bo_con .text_box::after{display: none;}
    .sec02 .con .top_con h4 span {font-size: 20px;}
    .section h3 { font-size: 1.8rem;}
    .slide .sli h2 { font-size: 2rem;}


}