
/* main */
.main_wrap{position:relative; display:flex; justify-content:space-between; flex-direction:row-reverse; width:100vw; min-width:320px; height:100vh; min-height:1075px; overflow-x:hidden; background:#0d2a65;}

.main_wrap section.all_menu{position:relative; min-width:380px; width:20vw; height:100%; background:#0d2a65;}

.main_wrap section.main_con{width:100%; transition:all 0.4s;}
.main_con .main_tlt{text-align:center; width:80%; margin:0 auto;}
.main_con .main_tlt h3{font-family:'GmarketSansBold'; color:#fff; letter-spacing:-1px; font-size:3.90rem; word-break:keep-all; opacity:0;}
.main_con .main_tlt p{font-family:'GmarketSansLignt'; color:#fff; letter-spacing:-1px; font-size:1.45rem; line-height:150%; margin-top:-0.4vh; word-break:keep-all;  opacity:0;}

.main_wrap section.main_con.on{position:relative; width:80vw; height:100%; background:url('../images/main/main_bg.jpg') no-repeat; background-size:cover; padding-top:32vh;}
.main_wrap section.main_con.on .main_tlt h3{opacity:1; transition: all 0.6s; transition-delay: 0.4s;}
.main_wrap section.main_con.on .main_tlt p{opacity:1; transition: all 0.6s; transition-delay: 0.8s;}

.main_con .main_quick{position:absolute; display:flex; opacity:0; top:80px;}
.main_con.on .main_quick{opacity:1; top:105px; transition:all 0.4s;}
.main_con .main_quick a{display:block; width:fit-content; padding:5px 30px; margin-top:20px; margin-left:20px; border-radius:5px; color:#fff; font-size:15px;}
.main_con .main_quick a:first-child{background:#2e418e;}
.main_con .main_quick a:last-child{background:#333;}

.main_con .cnt_box{opacity:0;}
.main_con.on .cnt_box{display:flex; justify-content:center; align-items:center; margin-top:8vh; opacity:1; transition:all 0.6s; transition-delay: 0.8s;}
.main_con .cnt_box li{background:#fff; width:min(396px, 15.5vw); min-width:300px; height:19.5vh; min-height:200px; max-height:220px; padding-top:max(40px, 3.3vh);  padding-bottom:max(55px, 3.3vh); box-sizing:border-box; border-radius:10px; text-align:center; font-family:'GmarketSansMedium'; color:#071837;}
.main_con .cnt_box li +li{margin-left:3.8vw;}
.main_con .cnt_box li strong{display:flex; justify-content:center; align-items:baseline; font-size:4.53rem; font-family:inherit; color:inherit;}
.main_con .cnt_box li strong i{font-style:none; font-size:inherit}
.main_con .cnt_box li strong > span{display:inline-block; margin-left:10px; font-size:1.67rem; font-family:inherit; color:inherit;}
.main_con .cnt_box li p{font-size:1.33rem; font-family:inherit; color:#999; margin-top:-20px;}

/* num_counter */
.main_con .cnt_box #desc {padding: 40px;}
.main_con .cnt_box .number {display: inline-block; height:4.5rem; overflow:hidden;}
.main_con .cnt_box .number > span + span{margin-top: 0;}
.main_con .digit-con {display: inline-block; height: 4.5rem;; overflow: hidden; vertical-align: top;}
.main_con .digit-con > span {display: block; font-size: 4.53rem; line-height: 4.54rem; position: relative; text-align: center; top: 0;}

/* pc */
@media (min-width: 2560px) {
    .main_wrap{max-width:2560px;}
}

@media (min-width: 2270px) {

}

@media (max-width: 1920px) {
}

@media (max-width: 1440px) {
    .main_wrap{display:block; height:auto; min-height:auto;}

    .main_wrap section.all_menu{min-width:380px; display:none; position:absolute; top:0; right:0; z-index:89; overflow:hidden;}

    .main_wrap section.main_con.on{width:100%; padding-top:min(320px, 25vh); padding-bottom:min(320px, 25vh); transition:all 0.4s;}
    .main_con .cnt_box li{max-height:200px;}
}

@media (max-width: 1280px) {

}

/* mobile */
@media (max-width: 1024px) {
    .main_wrap .pc_only{display:none;}

    .main_gnb{height:auto;}
    .gnb_l nav{display:none;}

    .gnb_r .ham_menu{right:30px;}

    .main_wrap section.main_con{padding-top: max(180px, 25vh); padding-bottom: max(180px, 25vh);}
    .main_con .main_quick{display:none;}
    .main_con .main_tlt h3{font-size:48px;}
    .main_con .main_tlt p{font-size:20px; margin-top:0;}
    .main_con .cnt_box li{min-width:280px; min-height:auto; max-height:auto; height:auto; padding:35px 0;}
    .main_con .cnt_box li strong{font-size:48px;}
    .main_con .cnt_box li strong > span{margin-left:5px;}
    .main_con .cnt_box li p{font-size:20px; margin-top:0;}

    footer .f_info ul{flex-wrap:wrap;}
}

@media (max-width: 768px) {

    .main_wrap section.main_con.on{padding-top:min(150px, 25vh); padding-bottom:min(150px, 25vh);}
    .main_con .cnt_box{flex-wrap:wrap; margin:8vh 50px;}
    .main_con .cnt_box li{display:flex; flex-direction: column-reverse; flex-wrap:wrap; padding:30px; width:100%; min-width:auto; min-height:auto;}
    .main_con .cnt_box li +li{width:48%; margin-left:0; margin-top:4%;}
    .main_con .cnt_box li:last-child{margin-left:4%;}
    .main_con .cnt_box li strong{font-size:54px; width:100%; text-align:right; justify-content:flex-end;}
    .main_con .cnt_box li p{font-size:18px; width:100%; text-align:left;}
}

@media (max-width: 640px) {
    .main_wrap .mobile_only{display:block;}

    .main_con .main_tlt h3{font-size:38px; line-height:125%;}
    .main_wrap section.main_con.on .main_tlt p{font-size:16px; margin-top:10px;}

    .main_wrap section.all_menu{min-width:100%;}


    .main_con.on .cnt_box{margin:40px 20px;}
    .main_con .cnt_box li{background:rgba(255,255,255,0.2); backdrop-filter: blur(10px); color:#fff; height:auto;}
    .main_con .cnt_box li + li{width:100%;}
    .main_con .cnt_box li:last-child{margin-left:0;}
    .main_con .cnt_box li p{color:#fff; margin-top:0;}
    .main_con .cnt_box li strong{font-size:30px;}
    .main_con .cnt_box li strong span{font-size:20px;}

}

@media (max-width: 576px) {

}

@media (max-width: 425px) {
    .main_con .main_tlt h3{font-size:28px;}
    .main_wrap section.main_con.on .main_tlt p{font-size:15px;}
    .main_con .main_tlt{width:90%;}
    .main_con .cnt_box li{padding:20px;}
}
