/*Content CSS*/
#main_intro {width: 100%; height: 100vh; display: flex; z-index: 30; min-height: 700px;}
#main_intro > article{width: 50%; height: 100%; background: 50% / cover no-repeat; position: relative; z-index: 2;}
#main_intro > article::before{content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #000; opacity: .85; transition: .5s;}
#main_intro > article:hover::before{opacity: .45;}

#main_intro .sec1{background-image: url('../img/intro_img1.jpg');}
#main_intro .sec2{background-image: url('../img/intro_img2.jpg');}

/* font-style */
#main_intro .fs_80{font-size: 80px; font-weight: 700; line-height: 1; letter-spacing: -1.6px;}
#main_intro .fs_50{font-size: 50px; font-weight: 500; line-height: 1.2; letter-spacing: -1px; font-family: 'Gmarket Sans';}
#main_intro .fs_25{font-size: 25px; font-weight: 400; line-height: 1.6; letter-spacing: -.5px;}

/* inner */
#main_intro .inner{position: relative; width: 100%; height: 100%; z-index: 1; padding: 100px 50px; display: flex; flex-direction: column; justify-content: space-between;}
#main_intro .inner h3{text-transform: uppercase; color: #fff; padding-bottom: 48px; margin-bottom: 35px; border-bottom: solid 1px rgba(255,255,255,.4);}
#main_intro .inner .bot{display: flex; justify-content: space-between; align-items: flex-end;}
#main_intro .inner .bot h2{color: #fff; }
#main_intro .inner .bot p{color: #fff; margin-top: 51px; min-height: 80px;}

/* dir_btn */
#main_intro .dir_btn{flex-shrink: 0; margin-left: 20px;display: flex; align-items: center; justify-content: center; width: 154px; height: 154px; border-radius: 50%; background-color: transparent; border: solid 1px #fff; transition: .3s;}
#main_intro > article:hover .dir_btn{background-color: #04056b; border-color: #04056b;}

/* min-width */
@media screen and (min-width:1901px) {
    #main_intro .inner{padding: 150px 110px;}
}
@media screen and (min-width:1025px) {
}
/* max-width */
@media screen and (max-width:1600px) {
    /* font-style */
    #main_intro .fs_80{font-size: 70px;}
    #main_intro .fs_50{font-size: 45px; line-height: 1.4;}
    #main_intro .fs_25{font-size: 23px;}
    /* inner */
    #main_intro .inner .bot{align-items: flex-start;}
    #main_intro .inner .bot p{min-height: 74px; margin-top: 30px;}
    /* dir_btn */
    #main_intro .dir_btn{width: 140px; height: 140px;}
    #main_intro .dir_btn img{width: 40px;}

}
@media screen and (max-width:1400px) {
    /* font-style */
    #main_intro .fs_80{font-size: 65px;}
    #main_intro .fs_50{font-size: 34px;}
    #main_intro .fs_25{font-size: 22px;}

    /* dir_btn */
    #main_intro .dir_btn{width: 80px; height: 80px;}
    #main_intro .dir_btn img{width: 38px;}
}
@media screen and (max-width:1280px) {
    #main_intro {min-height: 500px;}
    #main_intro .inner{padding: 50px;}
}
@media screen and (max-width:1024px) {
    #main_intro{flex-wrap: wrap; min-height: 850px;}
    #main_intro br:not(.space){display: none;}
    #main_intro > article{width: 100%; height: 50%;}

    /* font-style */
    #main_intro .fs_80{font-size: 50px;}
    #main_intro .fs_50{font-size: 30px;}
    #main_intro .fs_25{font-size: 20px;}

    /* inner */
    #main_intro .inner{text-align: center; padding: 50px 30px;}
    #main_intro .inner h3{padding-bottom: 30px;}
    #main_intro .inner .bot{display: block;}
    #main_intro .inner .bot p{min-height: 0; margin-top: 15px;}

    /* dir_btn */
    #main_intro .dir_btn{ width: 100%; height: 45px; border-radius: 10px; margin: 30px 0 0;}
    #main_intro .dir_btn::before{content: 'VIEW MORE'; display: inline-block; font-size: 12px; color: #fff; font-family: 'Gmarket Sans'; font-style: normal; margin-right: 10px;}
    #main_intro .dir_btn img{width: 20px;}
}
@media screen and (max-width:640px) {
    #main_intro{min-height: 100vh; height: auto;}
    #main_intro > article{height: auto;}

    /* font-style */
    #main_intro .fs_80{font-size: 40px;}
    #main_intro .fs_50{font-size: 25px;}
    #main_intro .fs_25{font-size: 16px;}

    /* inner */
    #main_intro .inner{padding: 30px 20px;}

    /* dir_btn */
    #main_intro .dir_btn{height: 40px; margin: 25px 0 0;}
    #main_intro .dir_btn::before{font-size: 11px;}
    #main_intro .dir_btn img{width: 18px;}
}