﻿@charset "utf-8";


/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Pretendard', sans-serif;
}

html {
    width: 100%;
    height: 100%;
    position: relative;
    font-family: 'Pretendard', sans-serif;
}

body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, /*table, th, td,*/ form, fieldset, legend, input, textarea, button, select, div, span {
    margin: 0;
    padding: 0;
    line-height: 1.1;
    -webkit-text-size-adjust: none;
    vertical-align: baseline;
    letter-spacing: -0.8px;
    font-family: 'Pretendard', sans-serif;
}

select {
    font-family: 'Pretendard', sans-serif;
    padding: 0 10px;
    color: #000;
    font-weight: 500;
    /* appearance: none;
    -webkit-appearance: none; */
}

body {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    word-wrap: break-word;
    letter-spacing: -0.5px;
}

body, input, textarea, select, button, table, td, a {
    font-family: 'Pretendard', sans-serif;
    color: #191919;
    font-size: 14px !importnat;
    outline: 0;
    vertical-align: middle;
}

    input:disabled, textarea:disabled, select:disabled {
        background: #eee;
        opacity: 0.5;
        pointer-events: none;
    }

img, video {
    border: 0;
}

ul, ol, dl {
    list-style: none;
    margin: 0;
    padding: 0;
}

em, address {
    font-style: normal
}

a {
    text-decoration: none;
    color: inherit;
    color: #888;
}

    a:link {
        color: #000;
    }

    a:active, a:focus, a:visited {
        text-decoration: none;
        color: #000;
    }

    a:hover {
        color: #583333 !important;
    }

table {
  border-collapse: collapse;
  border-spacing: 0;
}

button {
    border: 0;
    outline: 0;
    cursor: pointer;
    vertical-align: middle;
    line-height: 1;
    background: none;
}

    button:disabled {
        cursor: auto;
    }


.container, .container-lg, .container-md, .container-sm, .container-xl {
   padding: 0;
}

.row {
    margin: 0 auto;
}

body {
    font-family: 'Pretendard', sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #797979;
    min-width: 320px;
    word-break: keep-all;
    padding-right: 0 !important;
    user-select: none;
}

a {
    color: #404040;
}

    a:hover {
        color: #db1718;
        text-decoration: none;
    }

h1, h2, h3, h4, h5, h6 {
    font-family: 'NanumSquareNeo', sans-serif;
}

ul, li, ol, dl, dd, dt {
    list-style: none;
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6, ul, li, ol, dl, dd, dt, div, p, a {
    letter-spacing: -0.25px;
    color: #111;
}

span.red {
    color: #F93827;
}

strong {
    font-family: 'NanumSquareNeoHeavy';
    /* letter-spacing: -2.5px; */
}

h1 {
    font-family: 'NanumSquareNeoHeavy';
    letter-spacing: -2px;
    font-size: 48px;
}

h2 {
    font-family: 'NanumSquareNeoBold';
    letter-spacing: -2px;
    font-size: 30px;
}

h2 strong {
    font-family: 'NanumSquareNeoExtraBold';
    letter-spacing: -2px;
    font-size: 32px;
    line-height: 1.5;
}

h3 {
    font-family: 'NanumSquareNeo';
    letter-spacing: -1px;
    font-size: 22px;
    color: #514C4C;
    line-height: 1.5;
}

main {
    width: 100%;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

p {
    margin: 0;
    margin-block-start: 0;
    margin-block-end: 0;
}

img {
    padding: 0;
    margin: 0;
}

em {
    font-family: 'NanumSquareNeoBold';
    font-style: normal;
}

.modal {
    padding-right: 0 !important;
    background-color: rgba(0, 0, 0, 0.3);
}

.modal-dialog {
    max-width: 700px;
    overflow-y: initial !important;
}

.modal-content {
    border: 0;
    border-radius: 0;
}

.modal-header {
    background-color: #846353;
    border-bottom: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

    .modal-header .close {
        padding: 0;
        margin: 0;
    }

.modal-title {
    color: #fff;
}

.btn {cursor: pointer;}

.close {
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 0.6;
    color: #fff;
    text-shadow: none;
    opacity: 1;
    cursor: pointer;
}

    .close:hover {
        color: #fff;
    }

.modal-body {
    height: 100%;
    overflow-y: auto;
}

#footPop01 .modal-body, #footPop02 .modal-body {
    height: 600px !important;
}

.tl {
    text-align: left;
    }

.tr {
    text-align: right;
}

.red {
    color: #db1718;
}

#footPop01 .txt-box {
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
}

    .txt-box h1 {
        font-size: 22px !important;
        line-height: 2;
    }

    .txt-box div h2 {
        font-size: 16px;
    }
    
    .txt-box div {
        margin-bottom: 45px;
        line-height: 1.4;
    }

        .txt-box div p {
            font-size: 15px;
            color: #757575;
            line-height: 1.4;
        }
    
    .txt-box table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 1px;
        border: 1px solid #e5e5e5;
    }

        .txt-box table th {
            height: 35px;
            background: #f1f1f1;
            border-right: 1px solid #e5e5e5;
            text-align: center;
            font-size: 15px;
        }

        .txt-box table td {
            height: 35px;
            border-bottom: 1px solid #e5e5e5;
            border-right: 1px solid #e5e5e5;
            text-align: center;
            font-size: 15px;
        }

    .btn-nextPage {
        margin: 0 auto;
        width: 150px;
        height: 30px;
    }

    
/* layout */
.con-middle {
    display: table-cell;
    vertical-align: middle;
}

.area1280 {
    width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

.mt-area1280 {
    width: 1280px;
    margin: 0 auto;
}

.area1200 {
    width: 1200px;
    height: 100%;
    margin: 0 auto;
}

.col3 {
    overflow: hidden;
}

    .col3 article {
        width: 274px;
        background-color: #fff;
        float: left;
    }

        .col3 article + article {
            width: 273px;
            margin-left: 20px;
        }

.fl_l {
    float: left;
}

.fl_r {
    float: right;
}

.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.C, .text-center {
    text-align: center !important;
}

.bold {
    font-weight: bold;
}

.bold_500 {
    font-weight: 500;
}

.normal {
    font-weight: normal
}

/* font-color */
.mg-0 {
    margin: 0 !important;
}

.mg-5 {
    margin: 5px !important;
}

.mg-10 {
    margin: 10px !important;
}

.mg-15 {
    margin: 15px !important;
}

.mg-20 {
    margin: 20px !important;
}

.mg-25 {
    margin: 25px !important;
}

.mg-30 {
    margin: 30px !important;
}

.mg-35 {
    margin: 35px !important;
}

.mg-40 {
    margin: 40px !important;
}

.mg-45 {
    margin: 45px !important;
}

.mg-50 {
    margin: 50px !important;
}

.mg-t0 {
    margin-top: 0 !important;
}

.mg-t5 {
    margin-top: 5px !important
}

.mg-t10 {
    margin-top: 10px !important
}

.mg-t15 {
    margin-top: 15px !important
}

.mg-t20 {
    margin-top: 20px !important
}

.mg-t25 {
    margin-top: 25px !important
}

.mg-t30 {
    margin-top: 30px !important
}

.mg-t35 {
    margin-top: 35px !important
}

.mg-t40 {
    margin-top: 40px !important
}

.mg-t45 {
    margin-top: 45px !important
}

.mg-t50 {
    margin-top: 50px !important
}

.mg-l0 {
    margin-left: 0px !important
}

.mg-l5 {
    margin-left: 5px !important
}

.mg-l10 {
    margin-left: 10px !important
}

.mg-l15 {
    margin-left: 15px !important
}

.mg-l20 {
    margin-left: 20px !important
}

.mg-l25 {
    margin-left: 25px !important
}

.mg-l30 {
    margin-left: 30px !important
}

.mg-l35 {
    margin-left: 35px !important
}

.mg-l40 {
    margin-left: 40px !important
}

.mg-l45 {
    margin-left: 45px !important
}

.mg-l50 {
    margin-left: 50px !important
}

.mg-l115 {
    margin-left: 115px !important
}

.mg-l130 {
    margin-left: 130px !important
}

.mg-l140 {
    margin-left: 140px !important
}

.mg-r0 {
    margin-right: 0px !important
}

.mg-r3 {
    margin-right: 3px !important
}

.mg-r5 {
    margin-right: 5px !important
}

.mg-r10 {
    margin-right: 10px !important
}

.mg-r15 {
    margin-right: 15px !important
}

.mg-r20 {
    margin-right: 20px !important
}

.mg-r25 {
    margin-right: 25px !important
}

.mg-r30 {
    margin-right: 30px !important
}

.mg-r35 {
    margin-right: 35px !important
}

.mg-r40 {
    margin-right: 40px !important
}

.mg-r45 {
    margin-right: 45px !important
}

.mg-r50 {
    margin-right: 50px !important
}

.mg-b0 {
    margin-bottom: 0px !important
}

.mg-b5 {
    margin-bottom: 5px !important
}

.mg-b10 {
    margin-bottom: 10px !important
}

.mg-b15 {
    margin-bottom: 15px !important
}

.mg-b20 {
    margin-bottom: 20px !important
}

.mg-b25 {
    margin-bottom: 25px !important
}

.mg-b30 {
    margin-bottom: 30px !important
}

.mg-b35 {
    margin-bottom: 35px !important
}

.mg-b40 {
    margin-bottom: 40px !important
}

.mg-b45 {
    margin-bottom: 45px !important
}

.mg-b50 {
    margin-bottom: 50px !important
}

.pd-0 {
    padding: 0px !important;
}

.pd-5 {
    padding: 5px !important;
}

.pd-10 {
    padding: 10px !important;
}

.pd-15 {
    padding: 15px !important
}

.pd-20 {
    padding: 20px !important;
}

.pd-25 {
    padding: 25px !important;
}

.pd-30 {
    padding: 30px !important;
}

.pd-35 {
    padding: 35px !important;
}

.pd-40 {
    padding: 40px !important;
}

.pd-45 {
    padding: 45px !important;
}

.pd-50 {
    padding: 50px !important;
}

.pd-t0 {
    padding-top: 0px !important;
}

.pd-t5 {
    padding-top: 5px !important
}

.pd-t10 {
    padding-top: 10px !important
}

.pd-t15 {
    padding-top: 15px !important
}

.pd-t20 {
    padding-top: 20px !important
}

.pd-t25 {
    padding-top: 25px !important
}

.pd-t30 {
    padding-top: 30px !important
}

.pd-t35 {
    padding-top: 35px !important
}

.pd-t40 {
    padding-top: 40px !important
}

.pd-t45 {
    padding-top: 45px !important
}

.pd-t50 {
    padding-top: 50px !important
}

.pd-t60 {
    padding-top: 60px !important
}

.pd-t65 {
    padding-top: 65px !important
}

.pd-l0 {
    padding-left: 0px !important
}

.pd-l5 {
    padding-left: 5px !important
}

.pd-l10 {
    padding-left: 10px !important
}

.pd-l15 {
    padding-left: 15px !important
}

.pd-l20 {
    padding-left: 20px !important
}

.pd-l25 {
    padding-left: 25px !important
}

.pd-l30 {
    padding-left: 30px !important
}

.pd-l35 {
    padding-left: 35px !important
}

.pd-l40 {
    padding-left: 40px !important
}

.pd-l45 {
    padding-left: 45px !important
}

.pd-l50 {
    padding-left: 50px !important
}

.pd-l55 {
    padding-left: 55px !important
}

.pd-l65 {
    padding-left: 65px !important
}

.pd-l75 {
    padding-left: 75px !important
}

.pd-l85 {
    padding-left: 85px !important
}

.pd-l110 {
    padding-left: 110px !important
}

.pd-l130 {
    padding-left: 130px !important
}

.pd-l150 {
    padding-left: 150px !important
}

.pd-r0 {
    padding-right: 0px !important
}

.pd-r5 {
    padding-right: 5px !important
}

.pd-r10 {
    padding-right: 10px !important
}

.pd-r15 {
    padding-right: 15px !important
}

.pd-r20 {
    padding-right: 20px !important
}

.pd-r25 {
    padding-right: 25px !important
}

.pd-r30 {
    padding-right: 30px !important
}

.pd-r35 {
    padding-right: 35px !important
}

.pd-r40 {
    padding-right: 40px !important
}

.pd-r45 {
    padding-right: 45px !important
}

.pd-r50 {
    padding-right: 50px !important
}

.pd-r55 {
    padding-right: 55px !important
}

.pd-r60 {
    padding-right: 60px !important
}

.pd-b0 {
    padding-bottom: 0px !important;
}

.pd-b5 {
    padding-bottom: 5px !important
}

.pd-b10 {
    padding-bottom: 10px !important
}

.pd-b15 {
    padding-bottom: 15px !important
}

.pd-b20 {
    padding-bottom: 20px !important
}

.pd-b25 {
    padding-bottom: 25px !important
}

.pd-b30 {
    padding-bottom: 30px !important
}

.pd-b35 {
    padding-bottom: 35px !important
}

.pd-b40 {
    padding-bottom: 40px !important
}

.pd-b45 {
    padding-bottom: 45px !important
}

.pd-b50 {
    padding-bottom: 50px !important
}

.w100 {
    width: 100% !important
}

.font-11 {
    font-size: 11px !important;
}

.font-12 {
    font-size: 12px !important;
}

.font-13 {
    font-size: 13px !important;
}

.font-14, .fs14 {
    font-size: 14px !important;
}

.font-16 {
    font-size: 16px !important;
}

.font-18 {
    font-size: 18px !important;
}

.font-20 {
    font-size: 20px !important;
}

.font-24 {
    font-size: 24px !important;
}

.font-26 {
    font-size: 26px !important;
}

.font-28 {
    font-size: 28px !important;
}

.font-30 {
    font-size: 30px !important;
}

.font-32 {
    font-size: 32px !important;
}

.font-35 {
    font-size: 35px !important;
    letter-spacing: -1px;
}

.font-38 {
    font-size: 38px !important;
    letter-spacing: -2px;
}

.font-40 {
    font-size: 40px !important;
    letter-spacing: -2px;
}

.font-45 {
    font-size: 45px !important;
    letter-spacing: -2px;
}

.font-50 {
    font-size: 50px !important;
    letter-spacing: -2px;
}

.font-60 {
    font-size: 60px !important;
    letter-spacing: -3px;
}

.v-middle {
    vertical-align: middle !important;
}

.v-sub {
    vertical-align: sub !important;
}

.v-top {
    vertical-align: top !important;
}

.v-text-top {
    vertical-align: text-top !important;
}

.v-baseline {
    vertical-align: baseline !important;
}

.v-bottom {
    vertical-align: bottom !important;
}

.v-text-bottom {
    vertical-align: text-bottom !important;
}

.lH15 {
    line-height: 1.5
}

.bd-rad0 {
    border-radius: 0 !important
}
    

/*--------------------------------------------------------------
# Input / Select / Textarea
--------------------------------------------------------------*/
/* select {
    width: 150px;
    height: 40px;
    border: 1px solid #dadada;
    padding-left: 15px;
    vertical-align: middle;
}

input[type=text] {
    width: 340px;
    height: 40px;
    border: 1px solid #dadada;
    padding: 0 12px;
    vertical-align: middle;
} */

input[type=date] {
    border: 1px solid #dadada;
    color: #797979;
}

input:focus[type=date] {
    outline: none !important;
}

 /*input.widthM {
   width:500px !important;
}*/

::placeholder {
    color: #d3d3d3;
}

textarea {
    width: 100%;
    border: 1px solid #dadada;
}

@media (max-width: 767px) {
    select {
        font-size: 14px !important;
    }
    input::placeholder {
        font-size: 14px !important;
    }
}


/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
    position: fixed;
    display: none;
    right: 20px;
    bottom: 110px;
    z-index: 99999;
}

    .back-to-top i {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        width: 40px;
        height: 40px;
        border-radius: 100%;
        background: #F5464D;
        color: #fff;
        transition: all 0.4s;
    }

        .back-to-top i:hover {
            background: #ec333b;
            color: #fff;
        }


/*--------------------------------------------------------------
# message-box
--------------------------------------------------------------*/
.msg-tab {
    width: 90%;  
    text-align: left;
    margin: 10px 0;
}

.msg-tab ul {
    display: inline-flex;
}

.msg-tab ul li {
    margin-right: 5px;
}

.txt-tag {
    min-width: 40px;
    height: 15px;
    border-radius: 80px;
    display: inline-block;
    margin: 0 3px;
    border: 1px solid #ff7070;
    color: #ff4f4f;
    font-size: 12px;
    line-height: 15px;
	text-align: center;
}











