@charset "utf-8";

@import url('./fonts.css');
.inner {
    width: calc(100% - 8.333vw);
    margin: 0 auto;
}
.blind {
    font-size: 0; color: transparent;
}
html.fixed, 
body.fixed{
    overflow: hidden !important;
    touch-action:none;
}

/* flex */

.sb_ac {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.jc_ac {
    display: flex;
    align-items: center;
    justify-content: center;
}

.fl_sb {
    display: flex;
    justify-content: space-between;
}

.fl_jc {
    display: flex;
    justify-content: center;
}

/* button  */
.bg_full {
    background:#6ec84e ;
    color: #fff;
    text-align: center;
}
.blue_btn {
    background:#2354a1 ;
    color: #fff;
    text-align: center;
}
.black_btn {
    background:#333 ;
    color: #fff;
    text-align: center;
}
.gray_btn {
    background:#f8f8f8 ;
    color: #252525;
    text-align: center;
}
.line_btn {
    border: 0.278vw solid #dbdbdb ;
    color: #454545;
    text-align: center;
}
.btn_box {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 8.333vw;
    width: 100%;
}

/* ======================= header */
#header {
    border-bottom:0.278vw solid #aaaaaa  ;
}
#header .inner {
    display: flex;
}

#header .logo a{
    display: flex;
    width:31.944vw ;
}
#header .logo a img{
    max-width:31.944vw ;
    width: 100%;
}
#header .right {
    display: flex;
    align-items: center;
}
#header .charging_btn {
    display: inline-block;
    font-size: 3.5vw;
    border-radius:1.111vw;
    line-height: 10vw ;
    border: 0.556vw solid #ff4444;
    color: #ff4444;
    padding: 0 2.778vw;
    /* width: 22.222vw; */
    font-weight: 500;
    text-align: center;
    transition: all 0.3s;
}
#header .login_btn {
    background: #6ec84e;
    display: inline-flex;
    font-size: 3.5vw;
    border-radius: 1.111vw;
    height: 10vw;
    color: #fff;
    padding: 0 2.778vw;
    width: 20vw;
    font-weight: 500;
    text-align: center;
    justify-content: center;
    align-items: center;
    transition: all 0.3s;
}
#header .register_btn {
    display: inline-flex;
    font-size: 3.5vw;
    border-radius: 1.111vw;
    height: 10vw;
    border: 0.556vw solid #6ec84e;
    color: #6ec84e;
    padding: 0 2.778vw;
    width: 20vw;
    font-weight: 500;
    text-align: center;
    justify-content: center;
    align-items: center;
    margin-left: 2vw;
    transition: all 0.3s;
}
.open #header .charging_btn, 
.open #header .login_btn, 
.open #header .register_btn {
    visibility: hidden;
    opacity: 0;
}
.ham_btn {
    display: block;
    width: 6.667vw; height: 16.667vw;
    margin-left:4.167vw ;
   
}
.ham_btn > div {
    position: relative;
    width: 100%; height: 5vw;
}
.ham_btn span {
    display: block;
    width: 100%;
    height: 0.556vw;
    background: #252525;
    position: absolute;
    left: 0;
    transition: all 0.5s;
}
.ham_btn .top {
    top: 0;
}

.ham_btn .mid {
    top: 50%;
    transform: translateY(-50%);
}

.ham_btn .bot {
    top: calc(100% - 0.556vw);
}
html.open .ham_btn {
    transform: rotate(-45deg);
}

html.open .ham_btn .top {
    top: 50%;
    left: 0.278vw;
    transform: translateY(-50%);
}

html.open .ham_btn .mid {
    transform: scale(0);
}

html.open .ham_btn .bot {
    top: calc(50% - 0.278vw);
    transform: rotate(90deg) translateY(-50%);
}


#header .gnb_sec {
    display: block;
    position: fixed;
    width: 100%;
    height: calc(100% - 16.667vw );
    top:16.667vw ; right: -100%;
    background: #fff;
    padding: 9.167vw 4.167vw 16.667vw;
    overflow: scroll;
    transition: all 0.6s;
    z-index: 99999;
}
.open #header .gnb_sec  {
    right: 0;
}
#header .util_box p {
    font-size:5.278vw ;
    font-family: "NanumSquare";
    line-height:1.6 ;
}
#header .util_box p a {
    font-weight: 700;
    border-bottom: 0.278vw solid #252525 ;
}
#header .util_box.no_member .bot_box {
    margin-top:7.500vw;
    padding-bottom:5.556vw;
    display: flex;
    align-items: center;
}
#header .util_box.no_member .bot_box span {
    font-size: 3.889vw;
}
#header .util_box.no_member .bot_box a {
    font-size: 3.889vw;
    color: #6ec84e;
    padding-right: 4.167vw;
    background: no-repeat center right /1.667vw auto ;
    background-image: url(../img/ico/arrow_green.png);
    margin-left: 0.833vw;
    position: relative;
}

#header .util_box.no_member .bot_box a.membership_btn {
    padding: 2.083vw;
    border: 0.139vw solid #dbdbdb;
    border-radius: 0.694vw;
    font-size: 3.889vw;
    color: #252525;
    background: unset;
}

#header .util_box.no_member .bot_box a.membership_btn::after {
    display: none;
}

#header .util_box.no_member .bot_box a::after {
    content: '';
    display: block;
    width: calc(100% - 4.167vw); 
    height: 0.278vw;
    background: #6ec84e;
    position: absolute;
    left: 0; bottom: -1.389vw ;
}
#header .util_box.member p {
    display: flex;
}
#header .util_box.member .btn_area {
    display: flex;
    align-items: center;
}
#header .util_box.member .btn_area a{
    font-size: 0; color: transparent;
    display: block;
    width:6.667vw ; height: 6.667vw;
    background: no-repeat center ;
    border: none;
}
#header .util_box.member .btn_area .set_btn {
    background-image: url(../img/btn/my_set_btn.png);
    background-size: 6.389vw auto ;;
}
#header .util_box.member .btn_area .out_btn {
    background-image: url(../img/btn/logout_btn.png);
    background-size:5.278vw auto ;;
    margin-left: 2.778vw;
}
#header .util_box.member b {
    display: block;
    font-size:5.278vw ;
    font-family: "NanumSquare";
    line-height:1.6 ;
    font-weight: 700;
}
#header .util_box.member .bot_box {
    margin-top:6.944vw ;
}
#header .util_box.member .bot_t {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 4.167vw;
    /* border-bottom:0.278vw solid #f4f4f4; */
}
#header .util_box.member .bot_t span {
    font-size: 3.889vw;
    color: #757575;
}
#header .util_box.member .bot_t a {
    display: inline-block;
    border:0.278vw solid #6ec84e ;
    color:#6ec84e ;
    border-radius:6.944vw ;
    line-height: 6.667vw;
    padding: 0 2.778vw;
    font-size:3.333vw;
    font-weight: 500;
}
#header .util_box.member .bot_t a.bay_ticket {
    font-size: 4.444vw;
    line-height: 7.777vw;
    font-weight: 700;
}
#header .buy_box {
    border: 0.278vw solid #f4f4f4;
    padding: 6.111vw ;
    box-sizing: border-box;
    border-radius:1.389vw ;
}
#header .util_box .buy_box .ticket_name {
    font-size: 5vw;
    font-weight: 500;
    display: block;
    line-height: 1;
    font-family:'Noto Sans KR'; 
    margin-bottom: 2.778vw;
}
#header .util_box .buy_box .ticket_date {
    font-size: 3.889vw;
    color:#999999 ;
} 

#header .util_box .buy_box.no_ticket  {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
#header .util_box .buy_box.no_ticket strong {
    display: block;
    font-size: 5vw;
    font-weight: 500;
    line-height:24.444vw ;
}
#gnb {
    margin-top:5.556vw ;
    padding-top: 5vw;
    border-top:0.278vw solid #eeeeee ;
}
#gnb li a {
    display: block;
    font-size: 5.833vw;
    font-weight: 500;
    line-height: 2.1;
    background: no-repeat center right /1.667vw ;
    background-image: url(../img/ico/arrow_gray.png);
}
#header .gnb_sec .coupon_box {
    margin-top: 11.111vw;
}
#header .gnb_sec .coupon_box span {
    display: block;
    font-size:5.278vw ;
    font-weight: 500;
    margin-bottom: 4.167vw;
}
#header .gnb_sec .coupon_box .button_row {
    display: flex;
    align-items: center;
    width: 100%;
}
#header .gnb_sec .coupon_box .button_row input {
    width: calc(100% - 26.389vw);
    border:0.278vw solid  #bebebe;
    height: 11.111vw;
    font-size: 4.444vw;
}
#header .gnb_sec .coupon_box .button_row button {
    width:  26.389vw;
    border:0.278vw solid  #555555;
    color: #fff;
    background: #555555;
    height: 11.111vw;
    font-size: 3.889vw;
    font-weight: 500;
} 
/* // header // */



/* footer */

#footer  {
    border-top: 0.278vw solid #dbdbdb;
}
#footer .logo_wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
#footer .logo_wrap .btn_go_pc {
    background-color: #00000000;
    color: #ddd;
    font-size: 3.333vw;
    height: 6.25vw;
    width: 18.67vw;
    border-radius: 6px;
    border: 0.28vw solid #888;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
#footer .logo a {
    display: inline-block;
    width: 31.944vw;
}
#footer .logo a img {
    max-width: 31.944vw;
    width: 100%;
    margin-bottom: 6.944vw;
}
#footer #fnb {
    display: flex;
    flex-direction: column;
    padding:3.333vw 0 4.167vw ;
}
#footer #fnb li {
    display: flex;
}
#footer #fnb li a {
    font-size: 3.611vw;
    font-weight: 350;
    line-height: 2;
    display: block;
}
#footer #fnb li a strong {font-weight: 500;}
#footer #fnb li a + a {
    margin-left:7.639vw ;
}

#footer .fot_bot {
    background:#454545 ;
    padding: 8.333vw 0 ;
}
#footer address div {
    display: flex;
    flex-wrap: wrap;
} 
#footer address div dl {
    display: flex;
}
#footer address div dl * {
    color: #757575;
    font-size: 3.333vw;
    font-weight: 400;
    line-height: 1.75;
}
#footer address div dl.home_name {
    
}
#footer address div dl.com_owner {
    padding-left: 2.111vw;
    margin-left: 2.111vw
}
#footer address div dl.comnum {
    width: 100%;
    padding-left: 0;
    margin-left: 0;
}
#footer address div dl + dl  {
    padding-left:1.111vw ;
    margin-left: 1.111vw;
    position: relative;
}
#footer address div dl + dl::after {
    content: '';
    display: block;
    width:0.339vw ; height:3.056vw ;
    background:#757575 ;
    position: absolute;
    top: 50%; left: 0;
    transform: translateY(-50%);
}
#footer address div dl.comnum::after {
    display: none;
}
#footer address div dl dt + dd {
    margin-left: 0.694vw;
}
#footer .copy {
    font-size: 3.333vw;
    color: #757575;
    margin:5.556vw 0 0  ;
    /* text-transform: uppercase; */
}
#footer .tel {
    display: block;
    font-size: 4.722vw;
    color: #ddd !important;
    margin-top: 7.639vw;
}
#footer .bot *{
    color: #757575;
}
#footer .time {
    display: flex;
    margin-top:3.333vw ;
}
#footer .time dl {
    display: flex;
    
}
#footer .time dl  + dl {
    margin-left:2.778vw ;
}
#footer .bot p,
#footer .time dl  * {
    font-size: 3.333vw;
    line-height:1.75 ;
}

/* // footer // */


/* -------------------------- sub_nav */
.sub_nav{position: relative; }
.sub_nav .now_btn {
    width: 100%; 
    line-height:12.500vw ;
    background: #6ec84e no-repeat center right 5.556vw / 3.333vw auto;
    background-image: url(../img/common/now_btn_off.png);
    font-size: 4.167vw;
    color: #fff;
    padding-left: 5.556vw;
    text-align: center;
    padding-right: 28px;
}
.sub_nav .now_btn.on {
    background-image: url(../img/common/now_btn_on.png);
}
.sub_nav .depth_box {
    position: absolute;
    top: 100%; left: 0;
    width: 100%;
    z-index: 10;
    display: none;
    box-shadow: 0 10px 24px rgb(0 0 0 / 10%);
}
.sub_nav .depth {
    width: 100%;
    border:0.278vw solid #dbdbdb ;
    padding:1.389vw 5.556vw; ;
    display: none;
    background: #fff;
    /* position: absolute;
    bottom: 100%; left: 0; */
    text-align: center;
}
.sub_nav .depth.on {display: block;}
.sub_nav .depth li a {
    line-height: 2;
    font-size:  4.167vw;;
}


/* --------------------  search_form 검색박스 */
.search_form {
    display: flex;
    align-items: center;
    width: 100%;
    margin:0 0 8.333vw;
}
.search_form select {
    width: 33.333vw;
    border-color:#dbdbdb ;
    border-right: none;
    font-size: 3.889vw;
    height: 13.333vw;
}
.search_form .se_input_row  {
    width: calc(100% - 33.333vw);
    position: relative;
}
.search_form .se_input_row input {
    width: 100%;
    border-color:#dbdbdb ;
    font-size: 3.889vw;
    height: 13.333vw;
    padding-right:  10.556vw;
}
.search_form .se_input_row button {
    position: absolute;
    top: 50%; right: 0;
    transform: translateY(-50%);
    display: block;
    width: 10.556vw; height: 13.333vw;
    background: no-repeat center / 5.694vw auto;
    background-image: url(../img/btn/search_ico.png);
    font-size: 0; color: transparent;
}
/* // search_form // */

/* -------------------------------- pager */
.pager {
    margin-top: 8.333vw;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pager li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 8.056vw; height: 8.056vw;
    border: 0.417vw solid #dbdbdb;
    color:#a9a9a9 ;
    border-radius: 50%;
    font-size:3.889vw ;
    background: no-repeat center / auto 2.222vw;
}
.pager li + li a {
    margin-left: 1.389vw;
}
.pager li.all_prev a {
    background-image: url(../img/common/first_page.png);
}
.pager li.prev a {
    margin-right:1.389vw;
    background-image: url(../img/common/prev_page.png);
}
.pager li.next a {
    margin-left:2.778vw;
    background-image: url(../img/common/next_page.png);
}
.pager li.all_next a {
    background-image: url(../img/common/last_page.png);
}
.pager li.on a {
    background: #6ec84e;
    border-color: #6ec84e;
    color: #fff;
    font-weight: 500;
}
/* // pager // */
/* 리포트정보 팝업 */

/* popup_wrap */
.popup_wrap {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 10000;
    height: calc(var(--vh, 1vh) * 100);
}

.popup_wrap .popup_cont {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 8.3333vw);
    z-index: 2;
    box-shadow: 0 1.3888vw 7.5vw rgba(0, 0, 0, 0.11);
}

.popup_wrap .popup_cont .pop_head {
    height: 13.88vw;
    line-height: 13.88vw;
    font-size: 5vw;
    font-weight: 500;
    color: #fff;
    background: #333;
    padding: 0 14px;
    position: relative;
}


.popup_wrap .popup_cont .pop_head .close {
position: absolute;
top: 50%;
right: 3.888vw;
transform: translateY(-50%);
width: 5.55vw ;
}

.popup_wrap .popup_cont .pop_body {
    background: #fff;
    padding: 8.333vw 5.55vw 11.111vw;
    line-height: 1.5;
    /* max-height: calc(var(--vh, 100vh) - 25vw); */
    overflow-y: auto;
    max-height: calc(var(--vh, 1vh) * 100 - 40vw);
}

.popup_wrap .desc_wrap{
    color: #454545;
    border: 0.27vw solid #dbdbdb;
    border-bottom: none;
    border-top: 0.555vw solid #252525;
    font-size: 3.888vw;
    
}
.popup_wrap dl > *{
    padding: 3.472vw 4.166vw;
    border-bottom: 0.27vw solid #dbdbdb;
    min-height: 11.111vw;
}

.popup_wrap dt{
    background-color: #f3f3f3;
    font-weight: 500;
}
/* -------------------------------- popup */
.popup .pop_cont {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}
.popup .pop_cont > div {
    /* max-width: 80.556vw; */
    width: calc(100% - 8.333vw);
    background: #fff;
    padding:4.167vw  4.167vw  11.111vw;
    border-radius:10px ;
}
.popup .pop_close {
    display: flex;
    width:4.167vw ; height: 4.167vw;
    margin-left: auto;
    background: no-repeat center /4.167vw auto ;
    background-image: url(../img/btn/popup_close.png);
    font-size: 0;
    color: transparent;
}

.popup .pop_ttl {
    font-size: 5vw ;
    font-weight: 500;
    line-height:1.33 ;
    margin-top: 5.556vw;
    text-align: center;
}
.popup .desc {
    text-align: center;
    font-size: 3.889vw;
    color: #757575;
    line-height: 1.35;
}
.popup .pop_ttl + .desc {
    margin-top:4.167vw ;
}
#secret_pop .input_row {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 61.111vw;
    width: 100%;
    margin: 5.556vw auto 0;
    
}
#secret_pop .input_row  input {
    width: calc(100% -  18.056vw);
    height: 13.333vw;
    font-size: 3.889vw;
}
#secret_pop .input_row .ch_btn {
    width: 18.056vw;
    line-height: 13.333vw;
    background:#555555 ;
    color: #fff;
    font-weight: 500;
    font-size: 3.889vw;
}

/* 회원가입 팝업 */
 .desc_pop .pop_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
 }
 .desc_pop .pop_top .pop_ttl {
    margin-top: 0;
 }
 .desc_pop .pop_body {
    margin-top: 4.167vw;
    max-height: 70vh;
    height: 100%;
    overflow: auto;
 }
 .desc_pop .pop_body .agree_txt {
    line-height: 1.5;
    word-break: keep-all;
    font-size: 3.611vw;
 }
 #out_check_pop .out_cont + .out_cont {
    margin-top: 5.556vw;
 }
 #out_check_pop .out_cont strong {
    display: block;
    font-size: 3.611vw;
    font-weight: 500;
    margin-bottom: 2.778vw;
 }
 #out_check_pop .out_cont span {
    color: #757575;
    font-size:3.056vw;
    line-height: 1.3;
    word-break: keep-all;
 }
 #out_check_pop .check_list  {
    display: flex;
    flex-wrap: wrap;
 }
 #out_check_pop .check_list li {
    width: 50%;
    margin-top:2.778vw ;
 }
 #out_check_pop .check_list li input + label {
    font-size: 3.056vw;
    line-height: 3.611vw;;
    padding-left: 4.861vw;
 }
 #out_check_pop textarea {
    width: 100%;
    height:27.778vw ;
 }
 #out_check_pop .btn_box {
    margin-top:5.556vw;
}
/* //popup// */




.trems_con {
    margin-top: 8.333vw;
    font-size:3.611vw;
    line-height: 1.5;

}



















