@charset "UTF-8";
@font-face {
    font-family: 'esaB';
    font-style: Bold;
    font-weight: 700;
    src: url(../font/esamanruBold.eot);
    src: url(../font/esamanruBold?#iefix) format('embedded-opentype'),
         url(../font/esamanruBold.woff) format('woff'),
         url(../font/esamanruBold.ttf) format('truetype');
}
@font-face {
    font-family: 'esaL';
    font-style: Light;
    font-weight: 400;
    src: url(../font/esamanruLight.eot);
    src: url(../font/esamanruLight?#iefix) format('embedded-opentype'),
         url(../font/esamanruLight.woff) format('woff'),
         url(../font/esamanruLight.ttf) format('truetype');
}
@font-face {
    font-family: 'esaM';
    font-style: normal;
    font-weight: 500;
    src: url(../font/esamanruMedium.eot);
    src: url(../font/esamanruMedium?#iefix) format('embedded-opentype'),
         url(../font/esamanruMedium.woff) format('woff'),
         url(../font/esamanruMedium.ttf) format('truetype');
}
@font-face {
    font-family: 'nexon';
    font-style: Bold;
    font-weight: 700;
    src: url(../font/NEXONLv1GothicOTFBold.eot);
    src: url(../font/NEXONLv1GothicOTFBold?#iefix) format('embedded-opentype'),
         url(../font/NEXONLv1GothicOTFBold.woff) format('woff'),
         url(../font/NEXONLv1GothicOTFBold.ttf) format('truetype');
}

*, :before, :after {box-sizing:border-box;}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,address,code,em,img,strong,sub,sup,b,u,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figure,figcaption,footer,header,hgroup,menu,nav,section,main,audio,video {margin: 0; padding: 0; -webkit-tap-highlight-color: rgba(0,0,0, 0.1);}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display: block}

button { cursor: pointer; }
fieldset,img {border: 0; vertical-align: top}
ol,ul,li {list-style: none}
address,em {font-style: normal}
strong {font-weight: normal;}
a {
    text-decoration: none;
    color: #101010;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
}
iframe {overflow: hidden; border: 0}
table {border-collapse: collapse; border-spacing: 0; width: 100%}
h1,h2,h3,h4,h5,h6 {font-weight: normal; font-size: 100%}
input, select, textarea, button {
    vertical-align: middle;
    margin: 0;
    padding: 0;
    border-radius: 0;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
}
select::-ms-expand {display:none;}
textarea {resize: none;}
body { line-height: 1.5; -webkit-text-size-adjust: none  }

html {overflow-y: scroll;}
body,input,button,select,textarea,table {
    font-family: 'Noto Sans KR', 'Apple SD Gothic Neo',sans-serif;
    font-size: 15px;
    color:#101010;
    letter-spacing: -0.05em;
}

legend,caption,.blind {position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px}

.clearfix:after { content: ''; display: block; clear: both; }

::-webkit-input-placeholder {color:#bbb;}
:-moz-placeholder {color:#bbb;}
::-moz-placeholder {color:#bbb; opacity:1;}
:-ms-input-placeholder {color:#bbb !important;}

/* 텍스트 선택 */
/* ::selection { background-color: #ef151e; color: #ffffff; } */

/* 폼 공통 */
input[type="text"]::-ms-clear {display: none;}
input[type="password"]::-ms-reveal {display: none;}

input[type="text"] {
    width:100%;
    height:45px;
    border:none;
    outline:none;
    padding-left:15px;
    background:#f8f8f8;
    box-sizing: border-box;
}

input.input_small {
    width:200px
}

/* input file 공통 */

.file_wrap {
    display:inline-block;
    position:relative;
    width:466px;
    border:2px solid #ddd;
}
.file_wrap input[type="text"] {
    height:40px;
    background:none;
}

.file_wrap input[type="file"] + label {
    position:absolute;
    right:0;
    top:0;
    width:98px;
    height:40px;
    text-align:center;
    font-weight:500;
    line-height:40px;
    color:#009223;
    cursor:pointer;
}
.file_wrap input[type="file"] + label:before {
    content:'';
    position:absolute;
    left:0;
    top:50%;
    margin-top:-8px;
    width:2px;
    height:16px;
    background:#e8e8e8;
}


/* 라디오 공통 */

.radio_wrap {display:inline-block; margin-right:20px;}
.radio_wrap label {
    position: relative;
    font-size: 16px;
    color: #292929;
    padding-left:36px;
    cursor:pointer;
}
.radio_wrap label:before {
    content:'';
    position:absolute;
    left:0;
    top:-2px;
    width:26px;
    height:26px;
    border-radius:50%;
    border:2px solid #ddd;
}
.radio_wrap input[type="radio"]:checked + label:after {
    content:'';
    position:absolute;
    left:6px;
    top:4px;
    width:18px;
    height:18px;
    border-radius:50%;
    background: #009223;
}

/* select 공통 스타일 */
.select_wrap {
    position:relative;
    display:inline-block;
    width:100%;
    border:1px solid #ccc;
}
.select_wrap:after{
    content:'';
    position:absolute;
    right:10px;
    top:50%;
    width:0;
    height:0;
    margin-top:-3px;
    border:7px solid transparent;
    border-top-color:#444;

}
.select_wrap select {
    width:100%;
    border:none;
    height:45px;
    padding:0 20px;
    color:#999;
    position:relative;
    z-index:10;
    background:none;
}

/* textarea 공통 */

textarea {
    width:100%;
    background:#f8f8f8;
    border:none;
    padding:15px;
    outline:none;
    box-sizing:border-box;
}

/* 폰트컬러 */
.kakao_id {color:#ffe600;}
.strong {color:#fccf7f;}
.txt_red {color:red; font-weight:500;}

/* index css */

html {scroll-behavior: smooth;}
body.hidden {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    overflow: hidden;}

#wrap {min-width:320px;}


/* 본문공통 */
.main_tit {text-align:center; font-family:'Black Han Sans', sans-serif; font-size:50px;}
.main_txt {text-align:center; font-size:22px; font-weight:500;}


/* 본문 */

#header {position:fixed; left:0; top:0; width:100%;background: #fff; border-bottom:1px solid #372773; z-index:10001;}
#header .header_inner {position:relative; min-width:320px; max-width:1200px; margin:0 auto; height:100px; padding:0 20px;}
#header .logo {position:absolute; left:20px; top:50%; transform:translateY(-50%);}
#header .logo img {width:50%;}

.gnb {float:right;}
.gnb .depth1>li {position:relative; float:left;}
.gnb .depth1>li>a {
    display: block;
    width:100%;
    font-family: 'nexon', sans-serif;
    font-size: 24px;
    line-height: 99px;
    margin:0 30px;
    transition: color .3s;
}

.gnb .depth1>li:hover>a {color:#372773;}
.gnb .depth1>li>a:after{
    content:'';
    position:absolute;
    left:0;
    bottom:9999px;
    width:100%;
    height:4px;
    background: #372773;
    transition: transform .3s, bottom .3s;
    transform: scaleX(0);
    z-index:9999;
}
.gnb .depth1>li:hover>a:after{
    transform: scaleX(1);
    bottom: -1px;
    transition: transform .3s;
}

.gnb .depth2 {display:none; position:absolute; left:0; top:100px; z-index:9999; text-align:center; width:100%;}
.gnb .depth2 li {width:100%; border:1px solid #372773;}
.gnb .depth2 li + li {border-top:none;}
.gnb .depth2 li a {
    display:block;
    width:100%;
    text-align:center;
    padding:15px 15px 9px;
    font-family: 'nexon', sans-serif;
    background: #fff;
}
.gnb .depth2 li:hover a {background: #847fe2; color:#fff;}

/* 메인 슬라이더 */


#container {padding-top:101px; padding-bottom:160px;}


/* .main_slider .swiper-slide .img_wrap {width:100%; height:100%;} */
.main_slider .swiper-slide img {width:100%;}

.swiper-pagination .swiper-pagination-bullet {background: #fff; transition:width .3s; border-radius:50px;}
.swiper-pagination .swiper-pagination-bullet-active {background: #372773; width:50px; border-radius:50px;}


/* 메인 배너 */

.main_banner {max-width:1200px; margin:0 auto; padding:60px 0;}
.main_banner .list_banner li {float:left; width:calc(100% / 3);}
.main_banner .list_banner li img {width:100%;}
.main_banner .list_banner .kakao_img {margin-top:80px;}


/* 메인 공지사항 */

.main_notice {max-width:1200px; margin:0 auto 60px; padding:40px 0; border:1px solid #e4e4e4; border-radius:5px;}
.main_notice .board_inner {max-width:1200px; margin:0 auto;}
.main_notice .list_board>li + li {margin-left:20px;}
.main_notice .list_board>li {
    position: relative;
    float: left;
    width: calc(50% - 10px);
    margin:35px 0;
    background: #fff;
}

.main_notice .lat .lat_title {padding:0 30px; padding-top:20px;}
.main_notice .lat .lat_title a {font-family: 'nexon', sans-serif; color:#372773; font-size:22px;}
.main_notice .lat ul {padding:30px;}
.main_notice .lat li a {line-height:45px;}
.main_notice .lat .lt_more {top:30px; right:35px;}

@media (max-width:1200px) {
    .main_notice .lat .lat_title a {font-size:18px;}
    .main_notice .lat li a {
        font-size: 14px;
        width: 100%;
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    
}



.main_board {background: #e4e4e4; padding:60px 0;}
.main_board .board_inner {max-width:1200px; margin:0 auto;}
.main_board .list_board>li + li {margin-left:20px;}
.main_board .list_board>li {
    position: relative;
    float: left;
    width: calc(50% - 10px);
    background: #fff;
}

.main_board .lat .lat_title {padding:0 30px; padding-top:20px;}
.main_board .lat .lat_title a {font-family: 'nexon', sans-serif; color:#372773; font-size:22px;}
.main_board .lat ul {padding:30px;}
.main_board .lat li a {line-height:45px;}
.main_board .lat .lt_more {top:30px; right:35px;}

@media (max-width:1200px) {
    .main_board .lat .lat_title a {font-size:18px;}
    .main_board .lat li a {
        font-size: 14px;
        width: 100%;
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    

}


/* 팝업 */
.popup {
    position:fixed;
    right:-60px;
    top:30%;
    z-index:8888;
}
.popup img {width:75%;}

@media (max-width:767px) {
    .popup {top:70%; right:-107px;}
    .popup img {width:50%;}
}

#footer {
    position:fixed;
    display: block;
    width: 100%;
    min-width:320px;
    left: 0;
    bottom: 0;
    border-top: 1px solid #372773;
    background: #fff;
    z-index:100;
}
#footer .footer_inner {max-width:1200px; margin:0 auto;  padding:40px;}
.copyright {font-family: 'esaB', sans-serif; font-size:25px; text-align:center;}



#bo_list .td_subject {text-overflow:ellipsis; overflow:hidden; white-space: nowrap;}


/* 가격표 */

.sub_visual img {width:100%;}


.lnb {max-width:1200px; margin:0 auto; padding-top:60px;}
.lnb .depth1 {text-align:center;}
.lnb .depth1 li {display:inline-block; background: #fff; margin-bottom:20px;}
.lnb .depth1 li + li {margin-left:20px;}
.lnb .depth1 li a {
    display: block;
    font-family: 'esaM', sans-serif;
    font-size: 20px;
    padding: 15px;
    color: #372773;
    line-height: 15px;
    border: 1px solid #372773;
    border-radius: 5px;
    transition:color .3s, background .3s;
}
.lnb .depth1 li:hover a {color:#fff; background: #372773; transition:color .3s, background .3s;}

.price_wrap {max-width:1200px; margin:0 auto; padding-bottom:60px;}
.price_wrap .price1,
.price_wrap .price2,
.price_wrap .price3,
.price_wrap .price4,
.price_wrap .price5 {padding-top:50px;}

.price_wrap .txt_wrap {max-width:1200px; margin:0 auto; text-align:center; padding:80px 0;}
.price_wrap_tit {font-family: 'esaB', sans-serif; font-size: 40px;}
.price_txt {font-size :18px;}

.price dl {float:left; width:calc(94% / 3); margin-bottom:3%;}
.price dl.master {width:100%; margin:0;}
.price dl.master .price_img {width:500px;}
.price dl + dl {margin-left:3%;}
.price dl:nth-child(3n+1) {margin-left:0;}
.price dt {display:table; width:100%; text-align:center; padding:20px; background: #847fe2;}
.price dt .price_img {width: 190px;}
.price dt .price_img img {width:50%;}
.price dt .price_tit { text-align: left; font-size:22px; vertical-align:middle; font-family:'esaM', sans-serif;}

.price dd {display:table; width:100%; text-align:center; padding:20px; background: #333;} 
.price span {display:table-cell; color:#fff;}
.price .dot {background: url(../images/dot.png) no-repeat 50% 50%; width:185px;}
.price .undo_num {font-size:12px}

.price3 .dot {width:40%}

.price5 dd {padding:20px;}
.price5 dl.level dd .price_win {width:110px;}
.price5 dl.level dd .dot {width:100px;}

.price5 dd + dd {padding-top:10px;}
.price5 dl.master {margin-bottom:3%;}
.price5 dl.token {margin-left:0;}

.price_notice {max-width:1200px; margin:0 auto;}
.price_notice img {width:100%;}

.qna {max-width:1200px; margin:0 auto;}
.qna img {width:100%;}

/* 기사소개 */

.red {color:#c30e2e; font-weight:500;}

.driver {max-width:1200px; margin:0 auto; text-align: center;}
.driver .txt_wrap {padding:40px 0 60px;}
.driver .sub_tit {font-size:50px; font-family: 'nexon', sans-serif;}
.driver .sub_txt {font-size:22px;}

.driver .driver_img {margin-bottom:30px;}
.driver .driver_img img {width:100%;}

.driver_slider img {width:50%;}
.driver_slider .txt_box {padding-bottom:40px;}
.driver_slider h2 {font-size: 20px; font-family: 'nexon', sans-serif; padding:15px 0 5px;}
.driver_slider p {font-size:16px; font-weight:500;}
.driver_slider .most {padding:20px 0 0; color:#372773; font-weight:700;}
.driver_slider .champ {padding:0 0 20px;}
.driver .profile {padding-top:80px;}

.driver_slider .btn_arrow {
    background: url(../images/left_arrow.png) no-repeat 50% 50%;
    background-size: 100%;
}
.driver_slider .swiper-button-next {
    background-image: url(../images/right_arrow.png);
}


/* 퀵메뉴 */

.quick_top {position:fixed; bottom:30px; right:30px;}
.quick_top .btn_top {
    display: block;
    width:50px;
    height:50px;
    background: url(../images/btn_top.png) no-repeat 50% 50%;
    background-size: cover;
    text-indent:-9999px;
}


/* 모바일 block */
.m_gnb {display:none;}
.btn_open {display:none;}

/* 타블렛 분기점 */
@media (max-width:1200px) {
    #header .header_inner {height:80px;}
    #header .logo img {width:40%;}

    #container {padding-top:81px;}

    .gnb .depth1>li>a {font-size: 18px; line-height:80px; margin:0 15px;}

    .gnb .depth2 {top:80px;}
    .gnb .depth2 li a {font-size:13px;}

    .lnb .depth1 li + li {margin-left:10px;}

    .price dd {padding:15px;}
    .price .dot {width:120px;}
    .price3 .dot {width:90px;}
    .price dt .price_img {width:100px;}
    .price dt .price_img img {width:75%;}
    .price dt .price_tit {font-size:18px;}

    .price5 dd {padding:15px;}
    .price5 dl.level dd .dot {width:50px;}
    .price5 dl dd .dot {width:50px;}

    .price dd .price_win, .price dd .price_num {font-size:13px;}
    .price5 dl.level dd .price_win {width:100px;}
    .price dl.master .price_img {width:250px;}

    #footer  .footer_inner {padding:30px;}
    .copyright {font-size:18px;}

    .price_wrap_tit {font-size:36px;}


    .driver .sub_tit {font-size:46px;}
    .driver .sub_txt {font-size:18px;}

}



/* 모바일 분기점 */
@media (max-width:767px) {
    #header .logo {left:50%; transform:translate(-50%, -50%);}
    #header .logo img {width: 110px;}

    .gnb {display:none;}

    .main_banner .list_banner li {width:100%; float:none;}
    .main_banner .list_banner li .kakao_img {margin:0;}

    .main_board .list_board li {float:none; width:100%; margin-bottom:10px;}
    .main_board .list_board>li + li {margin-left:0;}

    .btn_open {
        display:block;
        position:absolute;
        left:10px;
        top:50%;
        transform:translateY(-50%);
        width:48px;
        height:48px;
        text-indent: -9999px;
        background: url(../images/btn_menu.png) no-repeat 50% 50%;
        background-size: cover;
    }

    #hd_pop {height:auto; width:auto; min-width:320px; position:absolute;}
    .hd_pops_con {width:auto !important;}
    .hd_pops {
        margin-right: 20px;
        position: static;
    }

    .m_gnb {
        display:none;
        position:fixed;
        top:0;
        left:0;
        min-width:320px;
        width:100%;
        height:100%;
        background: #e4e4e4;
        z-index:99999;
    }
    .m_gnb.open {display:block;}

    .m_gnb .top_gnb {position:relative; height:80px; border-bottom:1px solid #372773; background: #fff;}
    .m_gnb .top_gnb .btn_close {
        display:block;
        position:absolute;
        left:10px;
        top:50%;
        transform:translateY(-50%);
        width:48px;
        height:48px;
        border:none;
        text-indent: -9999px;
        background: url(../images/btn_close.png) no-repeat 50% 50%;
        background-size: cover;
    }

    .m_gnb .depth1>li {position:relative; background: #fff; border-bottom:1px solid #999;}
    .m_gnb .depth1>li>a {display:block; padding:20px 20px 10px; font-family: 'nexon', sans-serif; font-size:24px;}

    .m_gnb .depth2 {display:none;}
    .m_gnb .depth2 li {background: #e4e4e4;}
    .m_gnb .depth2 li + li {border-top:1px solid #d1cccb;}
    .m_gnb .depth2 li a {display:block; padding:18px 40px 9px; font-family: 'nexon', sans-serif;}

    .m_gnb .btn_more {
        position:absolute;
        right:20px;
        top:0;
        text-indent: -9999px;
        background: url(../images/btn_add.png) no-repeat 50% 50%;
        background-size: 75%;
    }
    .m_gnb .depth1 li.on .btn_more {
        background-image: url(../images/btn_remove.png);
    }


    .lnb {padding-top:30px;}
    .lnb .depth1 li a {font-size: 14px;}

    .price_wrap_tit {font-size:32px;}
    .price_wrap .txt_wrap {padding:50px 0;}
    .price_txt {font-size:14px; padding:0 10px;}

    .price dl + dl {margin:0; margin-bottom:6%;}
    .price dl {width:100%; margin-bottom:6%;}

    .price5 dl.master {margin-bottom:6%;}
    .price dl.master dt {display:table; width:100%; text-align:center;}
    .price dl.master dt .price_img {display:block; width:100%;}
    .price dl.master dt .price_tit {display:inline-block; width:100%;}
    .price dl.master dt .price_tit .kor {display:inline-block; width:100%;}

    .price dl.master dd {display:table;}

    .price dl {display:table;}
    .price dl dt {display:table-cell; width:60%; padding:15px;}
    .price dl dd {display:table-cell; vertical-align: middle;}
    .price dl .dot {display:none;}

    .price dl dd span {display:block;}
    .price dt .price_tit {font-size:14px;}
    .price dl.master .price_tit {text-align:center; padding-left:0;}
    .price dt .price_img {width:80px;}
    .price dd .price_win, .price dd .price_num {font-size:14px;}

    .price5 dl.level dt .price_tit {font-size:20px; text-align:center;}
    .price5 dl.level {display:block;}
    .price5 dl.level dt {width:100%; display:table;}
    .price5 dl.level span {display:table-cell;}
    .price5 dl.level dd span { width:33%;}
    .price5 dl.level dd .dot {width:100px; text-align:center;}
    .price5 dl.level dd {width:100%; display:table;}

    .price dl.m_token dt .price_tit {font-size:20px;}

    .copyright {font-size:13px;}


    .driver .sub_tit {font-size:34px;}
    .driver .sub_txt {font-size:14px; padding:0 20px;}
}



.tbl_wrap table {table-layout: fixed; width:100%;}

.tbl_head01 thead th:first-child {width:10%;}
.tbl_head01 thead th:nth-child(2) {overflow:hidden; text-overflow:ellipsis; white-space: nowrap;}
.tbl_head01 thead th:nth-child(3) {width:10%;}
.tbl_head01 thead th:last-child {width:10%;}

@media (max-width:767px) {
    .tbl_head01 thead th:first-child {width:15%;}
    .tbl_head01 thead th:nth-child(3) {width:25%;}
    .tbl_head01 thead th:last-child {width:15%;}
}


body {position:relative;}

#wrap {z-index:2; position: relative; background: #fff;}
.body_txt_wrap {position:absolute; bottom:0; left:50%; transform:translateX(-50%); z-index:1;}
.body_txt_wrap h2, 
.body_txt_wrap a, 
.body_txt_wrap p {font-size:1px;}

.body_txt_wrap .list_txt li {float:left; width:calc(100% / 2);}
.body_txt_wrap .list_txt li h2,
.body_txt_wrap .list_txt li p {font-size:1px;}


#login_btn{position:absolute; top:5px; right:0; font-size:13px;}
#login_btn:hover{text-decoration:underline;}