/* 메인&서브 공통 */
html,body{max-width:2560px; margin:0 auto;}
.pc_only{}
.mobile_only{display:none;}

/* 텍스트 스타일 */
.mt_tlt_st01{font-family:'GmarketSansBold'; font-size:1.73rem; color:#fff; font-weight:normal;}
.mt_tlt_st02{font-family:'GmarketSansMedium'; font-size:1.20rem; color:#fff; font-weight:normal; letter-spacing:-1px;}

.mt_txt_st01{font-size:1rem; font-weight:300; color:#fff; letter-spacing:-0.5px; line-height:145%; word-break:keep-all;}

/* 버튼 스타일 */
.btn_st01{font-family:'GmarketSansLight'; font-size:1rem; color:#fff; letter-spacing:-1px; padding-right:20px; display:inline-block; background:url("../images/main/main_arrow.png") right 2px no-repeat;}

/* 헤더영역 */
.main_gnb{position:absolute; top:0; left:0; right:0; margin:auto; width:100%; max-width:2560px; height:105px; min-height:100px; border-bottom:1px solid rgba(255,255,255,0.2); display:flex; justify-content:space-between; align-items:center; padding: 30px; box-sizing:border-box; z-index:90;}
.main_gnb .gnb_l{display:flex; align-items:flex-end;}
.gnb_l h1{height:36px;}
.gnb_l h1 a{display:inline-block; height:100%; vertical-align: bottom;}
.gnb_l h1 a:last-child{height:fit-content; line-height:100%;}
.gnb_l h1 a img{height:100%;}
.gnb_l h1 a span{font-size:18px; display:inline-block; line-height:125%; color:#fff; margin-left:5px;}

.gnb_l nav{margin-left:42px;}
.gnb_l nav ul{display:flex;}
.gnb_l nav ul li + li{margin-left:30px;}
.gnb_l nav ul li a{display:block; font-family:'GmarketSansMedium'; font-size:1.13rem; color:#fff; letter-spacing:-1px; line-height:125% }

.main_gnb .gnb_r{}
.gnb_r{display:flex; justify-content:flex-end; align-items:center;}
.gnb_r ul.top_menu{display:flex;}
.gnb_r ul.top_menu li + li{margin-left:10px;}
.gnb_r ul.top_menu li a{display:block; height:40px; line-height:40px; font-size:1rem; color:#fff; text-align:center; border-radius:20px;}
.gnb_r ul.top_menu li a.login{width:140px; background:#db4252;}
.gnb_r ul.top_menu li a.logout{width:140px; background:#555555;}
.gnb_r ul.top_menu li a.admin{width:140px; background:#3da649;}
.gnb_r ul.top_menu li a.join{width:140px; background:#0288c4;}
/* .gnb_r .top_comm{display:block; font-size:0.93rem; color:#fff; padding:0.2vw 1.4vw; margin-left:3vw; margin-right:4.4vw; box-sizing:border-box; background:#081c46; border-radius:3px;} */
.gnb_r .top_comm{display:inline-block; width:260px; text-align:center;font-size:0.93rem; color:#fff; padding:0.2vw 1.4vw; margin-left:3vw; margin-right:4.4vw; box-sizing:border-box; background:#081c46; border-radius:3px;}
.gnb_r .ham_menu{position:absolute; width:25px; height:22px; top:0; bottom:0; right:2vw; margin:auto; transition:all 0.4s;}
.gnb_r .ham_menu span{display:block; height:2px; width:25px; background:#fff; position:absolute; top:0; left:0; bottom:0; right:0; margin:auto; transition:inherit;}
.gnb_r .ham_menu span:before{content:''; display:block; height:2px; width:25px; background:#fff; position:absolute; top:-7px; left:0; right:0; margin:auto; transition:inherit;}
.gnb_r .ham_menu span:after{content:''; display:block; height:2px; width:25px; background:#fff; position:absolute; bottom:-7px; left:0; right:0; margin:auto;}

/* 전체메뉴 */
.all_menu aside{position:relative; width:100%; height:100%; padding-top:105px; transition:all 0.4s;}
.all_menu aside ul{position:absolute; width:calc(100% + 15px);}
.all_menu aside ul li{background:#0d2a65;}
.all_menu aside ul li:nth-child(2){background:#14367c;}
.all_menu aside ul li a{display:block;padding: 70px 50px; box-sizing:border-box;}
.all_menu .mt_tlt_box{display:flex; align-items:center; margin-bottom:2.5vh;}
.all_menu .mt_tlt_box span.main_icon_box{display:block; width:max(36px, 3.2vw); height:max(36px, 3.2vw); background:#fff; border-radius:50%; margin-right:min(20px, 1.4vw); text-align:center;}
.all_menu .mt_tlt_box span.main_icon_box img{width:100%;}
.all_menu .mt_txt_st01{opacity:0.6;}
.all_menu .mt_tlt_box p > *{display:block;}
.all_menu .mt_txt_st01{margin-bottom:2.7vh;}

.all_menu aside ul li:hover{transform:translateX(-15px); transition:all 0.4s;}
.all_menu aside ul li:hover a{position:relative;}
.all_menu aside ul li:hover a:before{content:''; position:absolute; width:3px; height:43%; background:#0d97ff; top:0; bottom:0; left:0; margin:auto; transition:all 0.4s;}
.all_menu aside ul li a:hover .btn_st01{font-weight:bold;}

/* 푸터영역 */
.main_wrap footer{position:absolute; bottom:0; text-align:center; width:100%; border-top:1px solid rgba(255,255,255,0.2); padding:2.2vh 0}
footer div.f_info{width: 80%;}
footer .f_info ul{display:flex; justify-content:center; align-items:center; font-size:0.93rem; color:#fefefe; opacity:0.6;}
footer .f_info ul li + li{ margin-left:1vw; display:flex; }
footer .f_info ul li > *{display:inline-block; color:inherit; font-weight:light; letter-spacing:0;}
footer .f_info ul li > * + *{margin-left:10px;}
footer .copyright{font-size:0.93rem;; color:#fefefe; opacity:0.5; margin-top:1vh;}

.sub_wrap footer{background:#333; text-align:center; width:100%; min-width:320px; border-top:1px solid rgba(255,255,255,0.2); padding:2.2vh 0}
.sub_wrap footer div.f_info{width:100%;}

.gnb_r .ham_menu {display:none; pointer-events: none;}

/* pc */
@media (min-width: 2560px) {
    html, body {font-size:20px;}
}

@media (min-width: 2270px) {
    html, body {font-size:17px;}
}

@media (max-width: 1920px) {
    html, body {font-size:15px;}
    .all_menu aside ul li a{padding:50px;}
}

@media (max-width: 1440px) {
    .main_wrap{display:block; height:auto; min-height:auto;}

    .main_gnb .gnb_r.on{justify-content:space-between; width:100%; max-width:320px;}
    .gnb_r ul.top_menu{display:none;}
    .gnb_r ul.top_menu.on{display:flex; justify-content:space-between; padding-right:50px;}
    .gnb_r ul.top_menu li a.join,
    .gnb_r ul.top_menu li a.login,
    .gnb_r ul.top_menu li a.logout,
    .gnb_r ul.top_menu li a.admin{width:120px;}

    .gnb_r .top_comm{display:none;}
    .gnb_r .ham_menu {display:block; pointer-events: auto;}
    .gnb_r .ham_menu.on > span{background:transparent; transition: all 0.4s;}
    .gnb_r .ham_menu.on > span:before{top:0; bottom:0; transform: rotate(45deg); transition:inherit;}
    .gnb_r .ham_menu.on > span:after{top:0; bottom:0; transform: rotate(135deg); transition:inherit;}

    .all_menu aside{position:static; height:100%;}
    .all_menu aside ul{position:static; width:100%;}
    .all_menu .mt_tlt_box span.main_icon_box{width:63px; height:63px;}
    .all_menu aside ul li:hover{transform:none; transition:none;}

    footer div.f_info{width:100%; transition:all 0.4s;}
}

@media (max-width: 1280px) {
    .main_gnb .gnb_r.on{max-width:320px;}
}

/* mobile */
@media (max-width: 1024px) {
    .main_gnb{height:auto;}
    .gnb_l nav{display:none;}
    .gnb_r .ham_menu{right:30px;}
    footer .f_info ul{flex-wrap:wrap;}
}

@media (max-width: 768px) {
    .main_gnb{height:60px; min-height:auto; padding:20px;}
    .gnb_l h1{height:22px;}
    .gnb_l h1.on{display:none;}
    .gnb_l h1 img{max-height:22px;}
    .main_gnb .gnb_r.on{min-width:270px; max-width:340px;}
    .gnb_r ul.top_menu li a.join,
    .gnb_r ul.top_menu li a.login,
    .gnb_r ul.top_menu li a.logout,
    .gnb_r ul.top_menu li a.admin{width:90px; height:30px; line-height:30px;}
    .gnb_r .ham_menu{right:20px;}

    .all_menu aside{padding-top:70px;}
    .all_menu aside ul li a{padding:40px;}
}

@media (max-width: 640px) {
    .main_gnb .gnb_r.on{width:100%; min-width:100%; max-width:100%; justify-content:flex-start;}
}

@media (max-width: 576px) {
}

@media (max-width: 425px) {
	.gnb_l h1 a img {height: 22px;}
	.gnb_l h1 a span {font-size:16px; margin-left: 5px;}
    .mt_tlt_st01{font-size:24px}
    .all_menu .mt_tlt_box span.main_icon_box{width:45px; height:45px;}
    .mt_tlt_st01{font-size:24px; line-height:125%;}
    .mt_tlt_st02{font-size:15px;}
}
