@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap');

/* Reset */
html { font-size: 10px; }
body * { outline: none; box-sizing: border-box; }
*{-webkit-tap-highlight-color: transparent;}
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}
body{ font-size: 1rem; background:#fff;-webkit-text-size-adjust:none;word-wrap:break-word; color: #444;}
body,input,select,textarea,pre {border:none; font-size:1.4rem; font-family: 'Noto Sans KR', sans-serif; margin: 0 auto; }
button { border:none; font-family: 'Noto Sans KR', sans-serif; outline: none; cursor: pointer; background-color: transparent; font-size: 1.4rem; }
ul,ol,li{list-style:none;}
table{ border-spacing:0; }
img,fieldset{border:0;}
address,cite,code,em{font-style:normal;font-weight:normal;}
label,img,input,select,textarea,button{vertical-align:middle;}
.hide,legend{overflow: hidden; display:block; position:absolute; border: 0; width: 1px; height: 1px; clip: rect(1px, 1px, 1px, 1px);}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:#444;text-decoration:none;}
pre{ white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; white-space: pre-wrap; word-wrap: break-word; color: #444; line-height: 2rem; font-size: 1.5rem; }
img { pointer-events : none; }

/* rem rule */
@media (max-width: 360px)
{
    html { font-size: 8.7px; }
}
@media (max-width: 330px)
{
    html { font-size: 8px; }
}

/* Form */
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file],
input[type=url],
input[type=number],
input[type=datetime-local],
input[type=date] { font-size:1.4rem; border:1px solid #DDDDDD; background:#fff; transition: all 0.5s; box-sizing: border-box; vertical-align:middle; padding: 0 1rem; height: 4rem; color: #222; }
input::-webkit-input-placeholder { color:#00000060; font-size:1.4rem; }
/* input:focus { border-color: #2B5CFF; } */
textarea { font-size:1.4rem; border:1px solid #DDDDDD; background:#fff; transition: all 0.5s; box-sizing: border-box; vertical-align:middle; padding: 1rem; color: #222; resize: vertical; }
textarea::-webkit-input-placeholder { color: #00000060; }
/* select { height: 4rem; line-height: 4rem; background: url('../../assets/images/icon/icon_drop.svg') no-repeat right 1.05rem center / 1.1rem #fff; border: 1px solid #727272; padding: 0 3.2rem 0 1.2rem; border-radius: 0.5rem; -webkit-appearance:none; -moz-appearance:none; appearance:none; } */
/* select:focus { background-image: url('../../assets/images/icon/icon_up.svg') } */
select::-ms-expand{ display:none; }
.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}
.fixed { overflow: hidden; }

    /* body {
        font-family: 'Noto Sans KR', sans-serif;
    } */
    #mainMenu nav>ul>li.hover-active>a, #mainMenu nav>ul>li.hover-active>span, #mainMenu nav>ul>li.current>a, #mainMenu nav>ul>li.current>span, #mainMenu nav>ul>li:hover>a, #mainMenu nav>ul>li:hover>span, #mainMenu nav>ul>li:focus>a, #mainMenu nav>ul>li:focus>span {
        color: #dd1d1f;
    }

    .heading-text.heading-section h2 {
        margin-bottom: 80px;
        font-size: 32px;
        font-weight: 700;
        line-height: 42px;
    }

    .heading-text.heading-section h2:before {
        width: 50px;
        background-color: #dd1d1f;
    }

    .heading-text.heading-section.text-light h2:before {
        width: 50px;
        background-color: #4d66ae;
    }

    #scrollTop:after, #scrollTop:before {
        background-color: #dd1d1f;
    }

    button.btn, .btn:not(.close):not(.mfp-close), a.btn:not([href]):not([tabindex]) {
        background-color: #dd1d1f;
        border-color: #dd1d1f;
    }

    button.btn:hover, button.btn:focus, button.btn:not(:disabled):not(.disabled):active, button.btn:not(:disabled):not(.disabled).active, .btn:not(.close):not(.mfp-close):hover, .btn:not(.close):not(.mfp-close):focus, .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled):active, .btn:not(.close):not(.mfp-close):not(:disabled):not(.disabled).active, a.btn:not([href]):not([tabindex]):hover, a.btn:not([href]):not([tabindex]):focus, a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled):active, a.btn:not([href]):not([tabindex]):not(:disabled):not(.disabled).active {
        background-color: #b81316;
        border-color: #b81316;
    }

    button.btn.btn-outline, .btn:not(.close):not(.mfp-close).btn-outline, a.btn:not([href]):not([tabindex]).btn-outline {
        color: #dd1d1f;
        border-color: #dd1d1f;
    }

    button.btn.btn-outline:hover, button.btn.btn-outline:focus, button.btn.btn-outline:active, button.btn.btn-outline.active, .btn:not(.close):not(.mfp-close).btn-outline:hover, .btn:not(.close):not(.mfp-close).btn-outline:focus, .btn:not(.close):not(.mfp-close).btn-outline:active, .btn:not(.close):not(.mfp-close).btn-outline.active, a.btn:not([href]):not([tabindex]).btn-outline:hover, a.btn:not([href]):not([tabindex]).btn-outline:focus, a.btn:not([href]):not([tabindex]).btn-outline:active, a.btn:not([href]):not([tabindex]).btn-outline.active {
        background-color: #dd1d1f;
        border-color: #dd1d1f;
    }

    .lead {
        font-size: 1.35rem;
        line-height: 2rem;
        font-weight: 300;
        color: #505050;
    }

    .lead strong {
        color: #202020;
    }

    .txt_s_gray {
        font-size: 20px;
        font-weight: 400;
        color: #aaaaaa;
    }

    .img_mw100 {
        max-width: 100%;
        height: auto;
    }

    .xmt_table {
        display: table;
        width: 100%;
        table-layout: fixed;
        border-collapse: collapse;
        border-top: 3px solid #283762;
    }

    .xmt_table th {
        padding: 10px 0px;
        font-size: 1.1rem;
        font-weight: 500;
        color: #283762;
        text-align: center;
        background-color: #e5e9f5;
        border-bottom: 1px solid #283762;
    }

    .xmt_table td {
        padding: 10px 15px;
        font-size: 1.1rem;
        border-bottom: 1px solid #283762;
    }

    .team-members.team-members-circle .team-member .team-image>img {
        border-radius: 5px;
    }

    .team-members .team-member .team-desc>h3 {
        font-size: 1.3em;
        font-weight: 700;
    }

    .team-members .team-member .team-desc>p {
        margin-top: 15px;
        font-size: 1.1em;
        font-weight: 400;
        color: #8ea6ed;
        line-height: 1.5em;
    }

    .post-item .post-item-description>h2, .post-item .post-item-description>h2>a {
        overflow: hidden;
        text-overflow: ellipsis;
        word-wrap: break-word;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        line-height: 1.2em;
        height: 2.4em;
    }

    a:not(.btn):not(.badge):hover, a:not(.btn):not(.badge):focus, a:not(.btn):not(.badge):active {
        color: #222;
    }

    @media (max-width: 1024px) {
        .heading-text.heading-section h2 {
            font-size: 2em;
            line-height: 1.25em;
        }

        .heading-text.heading-section h2::before {
            display: block;
            width: 40px;
        }

        .txt_s_gray {
            font-size: 1em;
        }
    }

    @media (max-width: 991px) {
        #exchange button {
            margin-top: 20px;
        }
    }

    @media (max-width: 768px) {
        .body-inner section {
            padding: 60px 0;
        }

        .heading-text.heading-section h2 {
            font-size: 1.8em;
        }

        .txt_s_gray {
            font-size: 0.7em;
        }

        .heading-text.heading-section h2 {
            margin-bottom: 40px;
        }

        .heading-text.heading-section h2:before {
            bottom: -20px;
        }
    }

/* 메인 */
#header { background-color: #fff; }
/* #header.sub { height: 4rem; line-height: 4rem; border-bottom: 1px solid #00000029; }
#header.sub .header-inner { height: 3.9rem; }
#header.sub .logo-default img { max-height: 2.4rem; margin-top: -0.6rem; } */
#header.sub #logo { float: none; text-align: center; height: 4rem; }
header .left_btn { position: absolute; left: 1rem; top: 0; z-index: 1; }
header .left_btn a { display: block; width: 2.4rem; height: 2.4rem; background: url('../images/icon/back.svg') no-repeat center / 2.4rem; height: 80px; }
header .right_btn { position: absolute; right: 1.5rem ; top: 0; z-index: 1; }
header .right_btn a,
header .right_btn a:not(.btn):not(.badge):hover { text-decoration: underline; }
header .right_btn a ~ a { margin-left: 2rem; }
#header .container > strong { font-size: 1.6rem; display: block; text-align: center; }

#slider { top: 50px !important; margin-bottom: 0 !important; }
#slider .container { padding-bottom: 3rem; }
#main_slide { margin-bottom: 6rem; }
#main_slide img { max-width: 100%; }
.slide_conBox { position: relative; }
.main_prev,
.main_next { width: 2.4rem; height: 2.4rem; background-repeat: no-repeat; background-position: center; background-size: 1.35rem; }
.swiper-button-prev.main_prev { background-image: url('../images/icon/arrow_left.svg'); left: -3.6rem; }
.swiper-button-next.main_next { background-image: url('../images/icon/arrow_right.svg'); right: -3.6rem; }
#main_slide p { color: #222; font-size: 2.6rem; padding-top: 1.5rem; text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 공통 */
input:not([type="checkbox"]):not([type="radio"]), select { font-size: 1.4rem; }
.body-inner section { padding: 8rem 0; }
main { min-height: 100vh; background-color: #fff; }
.back_grey { background-color: #F7F7F7; }

.dis_inblock { display: inline-block; }
.txt_center { text-align: center; }
.txt_right { text-align: right; }
.w_92 { width: 9.2rem; }
.w_full { width: 100%; }
.martop_20 { margin-top: 2rem; }
.martop_30 { margin-top: 3rem; }
.martop_40 { margin-top: 4rem; }

/* button */
.white_btn { height: 4rem; line-height: 3.8rem; border: 1px solid #707070; border-radius: 0.4rem; font-size: 1.8rem; font-weight: bold; }

/* paging */
.paging { padding-top: 2.5rem; text-align: center; padding-bottom: 1.5rem; }
.paging ul { display:inline-block; }
.paging ul li { float: left; }
.paging ul li ~ li { margin-left: 7px; }
.paging ul li a { display: block; padding: 0 0.5rem; height: 2.4rem; line-height: 2.4rem; color: #999; font-size: 1.6rem; }
.paging ul li a img { max-height: 100%; vertical-align: -0.2rem; }
.paging ul li a.on { color: #444; font-weight: 700; }

/* 목록 */
.list_wrap { max-width: 114rem; margin: 0 auto; padding: 0 1.5rem; }
.list_box { background-color: #fff; border: 1px solid #EEEEEE; border-radius: 2px; padding: 1.5rem 1.5rem 1.5rem 0; }
.list_box ~ .list_box { margin-top: 1rem; }
.list_box img { margin-left: 1.5rem; max-width: 9.8rem; }
.list_box img + .dis_inblock { max-width: calc(100% - 12rem); }
.list_box .dis_inblock { vertical-align: top; padding-left: 1rem; }
.list_box strong { display: block; font-size: 1.5rem; }
.list_box span { display: block; font-size: 1.2rem; padding-top: 0.5rem; color: #888888; }

/* 상세 */
.modify_wrap,
.detail_wrap { max-width: 114rem; margin: 0 auto; padding: 0 1.5rem; }
.detail_top { position: relative; padding-bottom: 1.8rem; margin-bottom: 1.8rem; border-bottom: 1px solid #f6f7f9; }
.detail_top strong { display: block; font-size: 2.4rem; color: #222; font-weight: 500; line-height: 3.2rem; }
.detail_top span { display: block; font-size: 1.6rem; color: #888888; padding-top: 1.2rem; }
.more_btnBox { position: absolute; right: 0; bottom: 1rem; }
.share { width: 2.4rem; height: 2.4rem; background: url('../images/icon/share.svg') no-repeat center / 2.4rem; }
.more { width: 2.4rem; height: 2.4rem; background: url('../images/icon/opt.svg') no-repeat center / 2.4rem; }
.more_list { width: 15.3rem; border: 1px solid #DDDDDD; border-radius: 0.4rem; position: absolute; background-color: #fff; padding: 1rem 1.5rem; top: 3rem; right: 0; }
.more_list p { font-size: 1.2rem; color: #888888; padding-bottom: 2rem; }
.more_list button { font-size: 1.3rem; padding-top: 3.5rem; background: url('../images/icon/url.svg') no-repeat center top / 3rem; color: #666; }
.more_list:not(.txt_center) { padding: 1.5rem; }
.more_list a { display: block; font-size: 1.3rem; color: #666; }
.more_list a ~ a { margin-top: 1.5rem; }
.detail_bottom img { max-width: 100%; }
.detail_bottom pre { padding-top: 2rem; font-size: 1.8rem; color: #666666; line-height: 2.8rem; }

.detail_wrap .list_wrap { padding: 0; border-top: 1.2rem solid #F7F7F7; }
.detail_wrap .list_box { border: none; border-bottom: 1px solid #EEEEEE; }
.detail_wrap .list_box ~ .list_box { margin-top: 0; }

/* 수정 */
.modify_wrap > span { display: block; font-size: 1.5rem; color: #222; padding-bottom: 0.5rem; font-weight: 500; }
.modify_wrap > span span { font-size: 1.3rem; }

/* 로그인 */
.login_wrap { margin: 5rem auto 0; max-width: 41.4rem; height: 43rem; padding: 4rem 3.7rem; background-color: #fff; }
.login_wrap strong { display: block; font-size: 2.4rem; color: #222; padding-bottom: 2rem; text-align: center; }
.login_wrap > span { display: block; padding-bottom: 0.5rem; font-size: 1.5rem; color: #222; font-weight: 500; margin-top: 2rem; }
.login_wrap > button { display: block; font-size: 1.8rem; background-color: #444; height: 5rem; line-height: 5rem; color: #fff; margin-top: 3rem; border-radius: 0.4rem; }
.fail_txt { color: #FF0000; font-size: 1.3rem; padding-top: 0.5rem; }

#header.user { height: auto; line-height: inherit; }
#header.user .container { clear: both; }
#header.user .container .logo_txt:after { content: ""; display: block; width: 5rem; height: 2px; background-color: #DD1D1F; margin-top: 2.5rem; }
#header.user .container:after { content: ""; display: block; clear: both; }
#header.user .header-inner { background-color: #F7F7F7; padding: 6rem 0 3rem; height: auto; }
#header.user .header-inner #logo { height: auto; }
#header.user .header-inner #logo a span { font-size: 3.2rem; font-weight: 600; }
#header.user .right_btn a { font-weight: 700; }
#header.user.white .header-inner { background-color: #fff; }
@media (max-width: 1024px) {
    #header.user .header-inner { padding-top: 4rem; }
    #header.user #logo { text-align: left; position: static !important; }
    #header.user .right_btn { right: 2.4rem; }
    #header.user .container { padding: 0 1.5rem; }
    .container { max-width: 100%; }
}
