@media (orientation: landscape) {
    /* 모바일 Landscape 모드(가로모드)일 때 적용할 CSS */
    #section1 { min-height: 700px; }
}


/* w1400 + 140(양옆패딩70씩) */
@media screen and (min-width:1px) and (max-width:1540px) {
    #visual #links { width: 100%; padding: 0 70px; }
    #visual #links .link { padding: 0 10px; }
    #visual #links .link .desc { line-height: 1.4; }

    #section2 .left_box .left_inner{width: 100%; padding: 30px 15px 0 30px;}
    #section2 .left_box .left_inner .down_btn{right: -15px;}
    #section2 .right_box > div{padding: 10%; width: 100%;}



    /* section5 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section5 { padding: 80px 140px; }
}

@media screen and (min-width:1px) and (max-width:1300px) {
    #visual .swiper-pagination{bottom: 25%;}
}
@media screen and (min-width:1px) and (max-width:1200px) {
    #visual #links { padding: 0 40px; }
    #visual .textBox p.en { font-size: 20px; }
    #visual .textBox p.title { font-size: 70px; margin-top: 15px; }
    #visual .textBox p.desc { font-size: 24px; margin-top: 20px; }
 


    /* section2 */
    /* ------------------------------------------------------------------------------------------------------------- */


    /* section3 */
    /* ------------------------------------------------------------------------------------------------------------- */

    #section3 .sec_ul { grid-template-columns: repeat(3, 1fr); grid-gap: 30px;}

    /* section4 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section4 .sec_div02{margin-left: 0;}


    /* section5 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section5 { padding: 80px 70px; }
    #section5 .swiper-button-prev { left: 35px; }
    #section5 .swiper-button-next { right: 35px; }
}
@media screen and (min-width:1px) and (max-width:1000px) {
    .tit{margin: 10px 0 5%;}

    #section2 .section2_inner{grid-template-columns: 100%;}
    #section2 .left_box .left_inner{margin-right: 0; width: 80%;}
    #section2 .left_box{padding: 10% 0;}
    #section2 .right_box > div{padding: 10% 20px;}

    #section4 .inner > div{width: 100%;}
    #section4 .inner > div:not(:last-child){margin-bottom: 10%;}
}

@media screen and (min-width:1px) and (max-width:768px) {
    #visual .textBox p.en { font-size: 16px; }
    #visual .textBox p.title { font-size: 50px; }
    #visual .textBox p.desc { font-size: 20px; font-weight: 300; }
    #visual .textBox p.desc em.br { display: inline; }
    #visual .textBox p.desc em.mo_br { display: block; }
    #visual .swiper-button-prev,
    #visual .swiper-button-next { display: none; }
    #visual #links .link { height: 140px; flex-direction: column; justify-content: center; }
    #visual #links .link img { width: 45px; }
    #visual #links .link .title { font-size: 17px; font-weight: 500; margin-bottom: 0; }
    #visual #links .link .desc { display: none; }



    /* section2 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section2 .right_box .board_news li{padding: 20px 0;}
    #section2 .right_box .tit_box{padding-bottom: 10px;}
    #section2 .left_box .left_inner .down_btn{bottom: 0;}

    /* section3 */
    /* ------------------------------------------------------------------------------------------------------------- */


    /* section4 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section4{background: url(/data/skin/default_v01/img/main/m_section4_bg.jpg) no-repeat top/cover;}
    #section4 .sec_div03{padding: 5%;}
    #section4 .sec_div03 .sd_p{margin-bottom: 13%;}

    /* section5 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section5 { padding: 65px 40px; }
    #section5 .swiper-container { overflow: visible; }
    #section5 .swiper-button-prev,
    #section5 .swiper-button-next { display: none; }
    #section5 .swiper-slide { padding: 0 4px; }
}


@media screen and (min-width:1px) and (max-width:500px) {
    #visual .textBox p.en { font-size: 13px; }
    #visual .textBox p.title { font-size: 40px; margin-top: 10px; }
    #visual .textBox p.desc { font-size: 17px; margin-top: 15px; }
    #visual #links { padding: 0 20px; }
    #visual #links .link { height: 122px; }
    #visual #links .link img { width: 35px; }
    #visual #links .link .title { font-size: 14px; line-height: 1.6; }

    .scroll_btn img{width: 30px;}


    /* section2 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section2 .right_box .board_news li .num{width: 60px;}
    #section2 .right_box .board_news li .con{width: calc(100% - 60px);}
    #section2 .left_box .left_inner{width: 90%;}
    #section2 .left_box .left_inner .down_btn{padding: 10px 20px;}

    /* section3 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section3{padding: 10% 0;}
    #section3 .sec_ul{grid-template-columns: repeat(2, 1fr); grid-gap:20px;}
    #section3 .sec_ul li .img_box img{width: 45px;}
    #section3 .sec_ul li .txt_box{margin-top: 20px;}

    /* section4 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section4{padding: 10% 0;}
    #section4 .sec_div03 .down_btn{padding: 10px 20px;}


    /* section5 */
    /* ------------------------------------------------------------------------------------------------------------- */
    #section5 { padding: 48px 20px; }
}

@media screen and (min-width:768px){
    #section3 .sec_ul li:hover .img_box::after{ opacity: 1;}
    #section3 .sec_ul li:hover .img_box img{filter: brightness(0) invert(1);}
    .down_btn{position: relative; overflow: hidden; z-index: 1;}
    .down_btn:hover .mc{color: #fff;}
    .down_btn::after{position: absolute; width: 100%; height: 100%; right: 100%; top: 0; background: linear-gradient(to right,  #00418e 0%,#001b3a 100%); content: ''; transition: 0.3s; z-index: -1;}
    .down_btn:hover::after{right: 0;}
    #section4 .sec_div02 .submit:hover{background: #a0c0ff; color: #162543;}
}