@charset "utf-8";

/* font 한화고딕체 */
@font-face {
    font-family: 'HanwhaGothicL'; font-style: normal; font-weight: normal;
    src: local(''),
        url('../font/HanwhaGothicL.woff2') format('woff2'),
        url('../font/hanwhaGothicL.woff') format('woff');
}
@font-face {
    font-family: 'HanwhaGothicR'; font-style: normal; font-weight: normal;
    src: local(''),
            url('../font/HanwhaGothicR.woff2') format('woff2'),
            url('../font/hanwhaGothicR.woff') format('woff');
}
@font-face {
    font-family: 'HanwhaGothicB'; font-style: normal; font-weight: normal;
    src: local(''),
            url('../font/HanwhaGothicB.woff2') format('woff2'),
        url('../font/hanwhaGothicB.woff') format('woff');
}
/* 저해상도 디스플레이 이슈로 인해 텍스트(글씨)가 들어가는 영역에는 아래 내용 적용 필요 */
.font_skew {transform: skew(-0.03deg); -webkit-transform: skew(-0.03deg); -ms-transform: skew(-0.03deg);}

/* common */
html {-webkit-touch-callout:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
*, *:before, *:after {box-sizing:border-box; word-break:keep-all; word-wrap:break-word;}
html, body {width:100%; height: 100%; background: #fff;}
body, h1, h2, h3, h4, h5, h6, fieldset, ul, ol, dl, dt, dd, p, button, figure, xmp {margin:0; padding:0;}
body {font-size: 14px; color:#676767; line-height: 1.33; font-family: 'HanwhaGothicL', sans-serif; word-break: keep-all; box-sizing: border-box; overflow-x: hidden; overflow-y: auto;}
h1, h2, h3, h4, h5, h6, input, textarea, select, button, optgroup {font-weight: inherit;}
legend, caption {overflow: hidden; width: 0.063rem; height: 0.063rem; color: transparent;}
a {text-decoration: none; color: inherit;}
a[href^="tel"] {cursor: default;}
img {vertical-align: middle; border: none;}
fieldset, button {background: none; border: 0;}
li {list-style: none;}
table {width: 100%; border-spacing: 0; border-collapse: collapse; table-layout: fixed;}
iframe {width: 100%; vertical-align: middle; border: none;}
hr {background: #ccc;}
button {cursor: pointer;}
input[type=checkbox], input[type="text"], input[type="password"], input[type="number"], 
select {-webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-border-radius: 4px; border-radius: 4px; color: #272b2f;}
input::-ms-clear {display: none;}
input[type=password]::-ms-reveal {display: none;}
b, strong {font-family: 'HanwhaGothicB', sans-serif; font-weight: inherit;}
em {font-style: inherit;}
input, textarea {-moz-user-select: auto; -webkit-user-select: auto; -ms-user-select: auto; user-select: auto;}
input:focus, select:focus, textarea:focus{outline: none;}
input::placeholder, textarea::placeholder{color: #c6ccd1;}

.a11y_hidden {position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: polygon(0 0, 0 0, 0 0);}
.f12 {font-size: 12px;}
.f15 {font-size: 15px;}
.mt5 {margin-top: 5px;}
.mt8 {margin-top: 8px;}
.mt15 {margin-top: 15px;}
.mt20 {margin-top: 20px;}
.mt25 {margin-top: 25px;}
.mt35 {margin-top: 35px;}
.mb12 {margin-bottom: 12px;}
.txt_b {color: #000;}
.txt_g {color: #9e9e9e;}
.txt_d {color: #676767;}
.txt_o {color: #f37321;}
/* txt */
.title1 {
    margin-bottom: 8px;
    font-family: 'HanwhaGothicB', sans-serif;
    font-size: 18px;
    color: #000;
}
.title2 {
    margin-bottom: 8px;
    font-family: 'HanwhaGothicB', sans-serif;
    font-size: 14px;
    color: #000;
}
.title3 {
    font-family: 'HanwhaGothicR', sans-serif;
    font-size: 22px;
}
.title4 {
    margin-top: 18px;
    font-family: 'HanwhaGothicR', sans-serif;
    font-size: 14px;
    color: #000;
}
.info_txt {
    position: relative;
    padding-left: 15px;
}
.info_txt:before {
    content: '※';
    position: absolute;
    left: 0;
}
/* header */
header {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    width: 100%;
    text-align: center;
    z-index: 2;
}
header .title1 {
    margin: 0;
    height: 60px;
    padding: 18px 20px;
}
.container {
    padding-top: 100px;
}
/* .fix {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
} */
/* tab */
.tab_btn {
    display: flex;
}
.tab_btn li {
    position: relative;
    width: 50%;
    height: 40px;
    border-bottom: 1px solid #e2e2e2;
}
.tab_btn button {
    display: block;
    width: 100%;
    height: 100%;
    color: #9e9e9e;
    text-align: center;
}
.tab_btn li.active button {
    color: #000;
}
.tab_btn li.active::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: #000;
}
.tab_cont {
    display: none;
}
.tab_cont.active {
    display: block;
}
/* box */
.box {
    position: relative;
    margin-top: 10px;
    padding: 24px;
}
.box:before {
    content: '';
    position: absolute;
    top: -10px;
    left: 0;
    width: 100%;
    height: 10px;
    border-top: 1px solid #ececec;
    background: #f6f6f6;
}
.box:first-child, .box.none {
    margin-top: 0;
}
.box:first-child:before, .box.none:before {
    display: none;
}
.flex_box {
    display: flex;
    justify-content: space-between;
}
.flex_box > div {
    width: calc(50% - 6px);
}
.store_box {
    display: block;
    padding: 25px 13px 0;
    border: 1px solid #dadada;
    border-radius: 10px;
    text-align: center;
}
.store_box .tit {
    margin-bottom: 12px;
    font-family: 'HanwhaGothicR', sans-serif;
    font-size: 18px;
    text-align: left;
    color: #000;
}
.store_box .btn {
    display: block;
    margin-top: 12px;
    padding: 10px 0;
    width: 100%;
    border-top: 1px solid #dadada;
    font-size: 14px;
    color: #000;
}
.store_box img {
    width: 72px;
    height: 72px;
}
.bg_box1 {
    padding: 12px;
    background: #f6f6f6;
}
.bg_box2 {
    padding: 24px;
    background: #f2f2f2;
    border-radius: 10px;
}
.line_btn {
    display: block;
    width: 100%;
    padding: 15px 0;
    border: 1px solid #dadada;
    border-radius: 20px;
    text-align: center;
    color: #000;
}
/* dot_list */
.dot_list > li {
    position: relative;
    margin-top: 4px;
    padding-left: 7px;
}
.dot_list > li:first-child {
    margin-top: 0;
}
.dot_list > li:before {
    content: '';
    position: absolute;
    top: 7px;
    left: 0;
    width: 3px;
    height: 3px;
    border-radius: 100%;
    background-color: #676767;
}
/* dash_list */
.dash_list > li {
    display: flex;
    position: relative;
    margin-top: 2px;
    padding-left: 5px;
}
.dash_list > li:before {
    content: '';
    position: absolute;
    top: 8px;
    left: 0;
    width: 3px;
    height: 1px;
    background-color: #676767;
}
.dash_list > li p + p {
    margin-left: 4px;
    width: calc(100% - 36px);
}
/* table */
.tbl {
    width: 100%;
}
.tbl th {
    padding: 8px 10px;
    font-size: 12px;
    font-weight: inherit;
    text-align: center;
    background: #f6f6f6;
    border-bottom: 1px solid #e5e5e5;
}
.tbl td {
    padding: 8px 10px;
    font-size: 12px;
    border-bottom: 1px solid #e5e5e5;
}
.tbl tr:first-child th,
.tbl tr:first-child td {
    border-top: 1px solid #000
}
/* icon */
.icon_arrow {
    display: inline-block;
    width: 7px;
    height: 12px;
    margin-left: 8px;
    background: url(../img/icon_arrow.png) no-repeat 0 0 / 100%;
    vertical-align: -2px;
}
.icon_call {
    display: inline-block;
    width: 12px;
    height: 13px;
    margin-right: 10px;
    background: url(../img/icon_call.png) no-repeat 0 0 / 100%;
    vertical-align: -2px;
}
.icon_close {
    display: inline-block;
    width: 18px;
    height: 18px;
    background: url(../img/icon_close.png) no-repeat 0 0 / 100%;
}
/* num_round_list */
.num_round_list li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    position: relative;
    margin-top: 12px;
    color: #000;
}
.num_round_list li:before {
    content: '';
    position: absolute;
    left: 15px;
    top: -12px;
    width: 1px;
    height: 12px;
    background-color: #e5e5e5;
}
.num_round_list li:first-child:before {
    display: none;
}
.num_round_list .num {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 8px;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    background: #000;
    color: #fff;
}
.num_round_list.type_sm li {
    align-items: flex-start;
}
.num_round_list.type_sm li:first-child {
    margin-top: 0;
}
.num_round_list.type_sm li:before {
    display: none;
}
.num_round_list.type_sm .num {
    margin-right: 6px;
    width: 16px;
    height: 16px;
    font-size: 10px;
}
/* num_border_list */
.num_border_list li {
    display: flex;
    align-items: center;
    position: relative;
    padding-top: 16px;
    margin-top: 16px;
    color: #000;
    border-top: 1px solid #e5e5e5;
}
.num_border_list li:first-child {
    margin-top: 0;
    border-top: none;
}
.num_border_list .num {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
    width: 60px;
    height: 40px;
    border-radius: 16px;
    border: 1px solid #dadada;
}
.num_border_list .txt_g {
    font-size: 12px;
}
.num_border_list .txt_o {
    margin-left: 2px;
    font-family: 'HanwhaGothicB', sans-serif;
    font-size: 16px;
}
.num_border_list .f12 {
    margin-top: 4px;
    color: #676767;
}
/* bg img box */
.bg_view_ars {
    height: 160px;
    padding: 30px 24px;
    background: #fcf3e6 url(../img/bg_ars.png) no-repeat center right;
    background-size: 360px 160px;
}
.bg_view_ars .tit {
    font-family: 'HanwhaGothicR', sans-serif;
    font-size: 22px;
    color: #ed7000;
}
.bg_view_ars .txt {
    margin-top: 12px;
    color: #988e81;
}
.bg_call_ars {
    text-align: center;
}
.bg_call_ars .call {
    padding-top: 115px;
    background: url(../img/icon_ars.png) no-repeat top center / 96px 96px;
}
.img_box {
    margin-top: 8px;
    margin-bottom: 6px;
    width: 100%;
}
.img_box > img {
    width: 100%;
}
/* full_popup */
.pop_full {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 3;
}
.pop_on {
    display: block;
}
.pop_head {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    text-align: right;
    background: #fff;
    z-index: 4;
}
.pop_head .pop_close {
    width: 60px;
    height: 60px;
}
.pop_head + .box {
    padding-top: 72px;
}
.scroll_hidden {
    overflow: hidden;
}