@charset 'utf-8';
.clearfix:after {
    content: "";
    display: block;
    clear: both;
}
legend,
.blind,
caption {
    position: absolute;
    top: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
    text-indent: -9999em;
    overflow: hidden;
}
.mobile-only {
    display: none !important;
}
.pc-only {
    display: block !important;
}
img {
    vertical-align: middle;
    max-width: 100%;
}
hr {
    border: 0;
    border-top: 1px solid #a6a6a6;
    margin: 16px 0;
}
select[disabled] {
    background-color: #f6f6f6;
    cursor: not-allowed;
    color: #565656;
}
input[readonly] {
    background: #f6f6f6;
    cursor: not-allowed;
    color: #565656;
}

a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.accordion {
    width: 100%;
}
.border-top {
    border-top: 1px solid #e6e6e6;
}
.border-bottom {
    border-bottom: 1px solid #e6e6e6;
}
.not-border-bottom {
    border-bottom: 0 !important;
}
.t-underline {
    text-decoration: underline;
}
.bgwhite {
    background-color: #fff;
}
.icon-new {
    display: inline-block;
    vertical-align: middle;
    width: 31px;
    height: 14px;
    background: url(/image/mobile/icon_new.png) center center no-repeat;
    background-size: contain;
}
.icon-sold-out {
    width: 38px;
    height: 18px;
    background: url(/image/mobile/icon_sold-out.png) center center no-repeat;
    background-size: contain;
    display: inline-block;
}
.icon-sold-out span {
    display: none;
}
.input-regular.unit-add {
    width: calc(100% - 24px);
    margin-right: 4px;
}
textarea.input-regular {
    display: inline-block;
    min-width: 200px;
    min-height: 100px;
    padding: 12px;
    border: solid 1px #e9e9e9;
    background-color: #ffffff;
    font-size: 13px;
    font-weight: 400;
    text-align: left;
    color: #565656;
    line-height: 1.33;
    letter-spacing: -0.65px;
    transition: all 0.5s;
    border-radius: 4px;
}
.margin-t40 {
    margin-top: 40px !important;
}
.padding-t40 {
    padding-top: 40px !important;
}
a.btn-medium {
    display: inline-block;
    vertical-align: middle;
}
.help-text {
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #ff6636;
    margin: 8px 0 0;
}

.width312 {
    width: 312px !important;
}

.btn-split2 {
    float: left;
    width: calc((100% - 8px) / 2) !important;
    margin: 0;
}
.btn-split2 + .btn-split2 {
    margin-left: 8px;
}

.btn-split3 + .btn-split3 {
    margin-left: 8px;
}
.btn-split3 {
    float: left;
    width: calc((100% - 16px) / 3) !important;
    margin: 0;
}

.clamp1 {
    display: -webkit-box;
    line-height: 1.5em;
    max-height: 1.5em;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}
.clamp2 {
    display: -webkit-box;
    line-height: 1.5em;
    max-height: 3em;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}
.clamp3 {
    display: -webkit-box;
    line-height: 1.5em;
    max-height: 4.5em;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}
.clamp4 {
    display: -webkit-box;
    line-height: 1.5em;
    max-height: 6em;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}
.clamp5 {
    display: -webkit-box;
    line-height: 1.5em;
    max-height: 7.5em;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}

/*input-split*/
.input-split2 {
    float: left;
    min-width: calc((100% - 8px) / 2) !important;
    width: calc((100% - 8px) / 2) !important;
    margin: 0;
}
.input-split2 + .input-split2 {
    margin-left: 8px;
}
.input-split3 {
    float: left;
    min-width: calc((100% - 16px) / 3) !important;
    width: calc((100% - 16px) / 3) !important;
    margin: 0;
}
.input-split3 + .input-split3 {
    margin-left: 8px;
}
.input-split4 {
    float: left;
    min-width: calc((100% - 24px) / 4) !important;
    width: calc((100% - 24px) / 4) !important;
    margin: 0;
}
.input-split4 + .input-split4 {
    margin-left: 8px;
}

.align-left {
    text-align: left !important;
}
.align-right {
    text-align: right !important;
}
.align-center {
    text-align: center !important;
}
.f-left {
    float: left;
}
.f-right {
    float: right;
}

.like > a {
    display: block;
    width: 32px;
    height: 32px;
    transition: all 0.5s;
    background: url(/image/mobile/icon_heart_n.png) center center no-repeat;
    background-size: contain;
    transform: scale(1);
}
.like > a.active {
    background: url(/image/mobile/icon_heart_s.png) center center no-repeat;
    background-size: contain;
}

/* quantity-change */
.quantity-change {
    float: right;
    width: 72px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 16px 0 0;
}
.quantity-change .btn-minus {
    width: 24px;
    height: 24px;
    transition: all 0.5s;
    display: flex;
    justify-content: center;
    align-items: center;
}
.quantity-change .btn-minus span {
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_minus.png) center center no-repeat;
    background-size: contain;
    text-indent: -5000px;
}
.quantity-change .input {
    width: 24px;
    height: 24px;
    line-height: 42px;
    font-size: 13px;
    text-align: center;
    border-top: 1px solid #d6d6d6;
    border-bottom: 1px solid #d6d6d6;
}
.quantity-change .btn-plus {
    width: 24px;
    height: 24px;
    transition: all 0.5s;
    display: flex;
    justify-content: center;
    align-items: center;
}
.quantity-change .btn-plus span {
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_plus.png) 0 0 no-repeat;
    background-size: contain;
    text-indent: -5000px;
}

.img-list {
    margin: 0 0 16px;
}
.img-list > ul {
    overflow: hidden;
}
.img-list > ul > li {
    float: left;
    width: 80px;
    height: 80px;
    border-radius: 8px;
    overflow: hidden;
    background: url(/image/mobile/no_image_type_a.png) center center no-repeat;
    background-size: contain;
    margin: 0 8px 0 0;
}
.img-list > ul > li .img-popup {
    margin: 0;
    padding: 0;
}
.img-list > ul > li .img-popup .inner-wrap {
    margin: 0;
    padding: 0;
}
.img-list > ul > li img {
    width: 80px;
    height: 80px;
}

/*인덱스팝업*/
.index-popup {
    min-width: calc(100% - 48px) !important;
    max-width: calc(100% - 48px) !important;
}
.index-popup .btn-split2 {
    width: 50% !important;
}
.index-popup .btn-split2.btn-medium {
    border: 0 !important;
    border-top: 1px solid #e6e6e6 !important;
    border-radius: 0 !important;
}
.index-popup .btn-split2.btn-medium + .btn-split2.btn-medium {
    border-left: 1px solid #e6e6e6 !important;
}
.index-popup .popup-content img {
    width: 100%;
}

/*mobile용*/
.popup {
    min-width: 320px;
    width: auto !important;
    margin-top: 80px;
    left: 50% !important;
    top: 0;
    transform: translate(-50%, 0);
    max-width: 400px !important;
}
.popup .inner-wrap {
    padding: 32px 16px 16px;
}
.popup .inner-wrap .popup-header {
    margin-bottom: 24px;
    font-size: 18px;
}
/* full */
.popup.full {
    min-width: auto;
    max-width: 700px !important;
    width: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    position: fixed !important;
    left: 50% !important;
    top: 50% !important;
    height: 100%;
    transform: translate(-50%, -50%);
}
.popup.full .inner-wrap {
    padding: 44px 0 24px;
    overflow-y: auto;
}
.popup.full .popup-header {
    position: fixed;
    left: 50%;
    top: 0;
    display: block;
    width: 100%;
    transform: translate(-50%, -0);
    z-index: 100;
    max-width: 700px;
    width: 100%;
    height: 44px;
    line-height: 44px;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid #e6e6e6;
    background-color: #fff;
}
.popup.full .inner-wrap .popup-close {
    position: fixed;
    top: 6px;
    right: 6px;
    z-index: 100;
}
.popup.full .btn-group-type1 {
    padding: 16px 0 0;
}
.popup.full .block-type-area {
    margin-top: 8px;
}

/*temp-content*/
.temp-content {
    position: fixed;
    top: 44px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 700px;
    height: calc(100% - 60px);
    background: #fff;
    padding: 24px 16px 0;
}
.temp-content pre {
    padding: 8px 16px;
    height: 100%;
    background: #f6f6f6;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: -0.39px;
    text-align: left;
    color: #909094;
    overflow-x: hidden;
    overflow-y: auto;
    white-space: pre-line;
    border: solid 1px #ebebec;
}

.btn-switch {
    width: 54px !important;
    height: 26px !important;
    border-radius: 50vh;
}
.btn-switch:after {
    width: 22px;
    height: 22px;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
    background: #fff;
    content: "";
    border-radius: 50vh;
    margin-top: -11px;
    right: 1px;
}
.btn-switch.inactive:after {
    left: 1px !important;
}

/* app-setting */
.app-setting {
    background-color: #fff;
    border-bottom: 1px solid #e6e6e6;
}
.app-setting > ul {
    overflow: hidden;
}
.app-setting > ul > li h1 {
    padding: 16px 16px;
    float: left;
    font-size: 14px;
    font-weight: 500;
}
.app-setting > ul > li .switch-setting {
    padding: 10px 16px;
    float: right;
    text-align: right;
}
.app-setting > ul > li p {
    clear: both;
    font-size: 11px;
    font-weight: normal;
    line-height: 1.55;
    letter-spacing: -0.7px;
    text-align: left;
    color: #767676;
    padding: 0 16px 12px;
}

.datepickers-container {
    z-index: 102;
}
.datepicker-here.icon-type {
    background: #ffffff url(/image/component/icon_date.png) right 12px center no-repeat;
    background-size: 16px;
    padding-right: 37px;
}

/*tab-menu*/
.tab-menu .inner-wrap .tab-content {
    height: auto;
    margin-top: 0;
    border: 0;
    padding: 0;
}

/*type-b*/
.tab-menu.type-b {
    background: #ffffff;
}
.tab-menu.type-b .inner-wrap .tab-header {
    position: relative;
    height: 35px;
    border: 0;
    padding: 0 16px;
    background: #ffffff;
}
.tab-menu.type-b .inner-wrap .tab-header li {
    border: 1px solid #e9e9e9;
    border-bottom: 1px solid #161616;
    color: #a6a6a6;
    font-size: 12px;
    font-weight: 400;
    background-color: #ffffff;
}
.tab-menu.type-b .inner-wrap .tab-header li + li {
    border-left: 1px solid #e6e6e6;
}
.tab-menu.type-b .inner-wrap .tab-header li.active {
    background: #fff;
    color: #565656;
    border: 1px solid #252c3a;
    border-bottom: 1px solid #fff;
    font-weight: 600;
}
.tab-menu.type-b .inner-wrap .tab-header li.active:hover {
    background: #fff;
    color: #252c3a;
    border-bottom: 1px solid #fff;
}
.tab-menu.type-b .inner-wrap .tab-content {
    height: auto;
    margin-top: 0;
    border: 0;
    padding: 0;
}

/* type-c */
.tab-menu.type-c > .inner-wrap > .tab-header {
    border: 0;
    padding: 8px 16px 0;
}
.tab-menu.type-c > .inner-wrap > .tab-header li {
    font-size: 13px;
    font-weight: normal;
    line-height: 1.46;
    letter-spacing: -0.39px;
    text-align: center;
    color: #868686;
    border: 0;
    border-bottom: 2px solid #a6a6a6;
}
.tab-menu.type-c > .inner-wrap > .tab-header li.active {
    border: 0;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.46;
    letter-spacing: -0.39px;
    text-align: center;
    background-color: #fff;
    color: #ff6636;
    border-bottom: 2px solid #ff6636;
}

/* tab-menu-pview */
.tab-menu-pview.active {
    padding-top: 40px;
}
.tab-menu-pview .tab-header {
    display: table;
    width: 100%;
    table-layout: fixed;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #e6e6e6;
}
.tab-menu-pview .tab-header li {
    transition: all 0.5s;
    display: table-cell;
    color: #161616;
    vertical-align: middle;
    cursor: pointer;
    height: 44px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.46;
    letter-spacing: -0.39px;
    text-align: center;
    color: #c6c6c9;
    border: 0;
}
.tab-menu-pview .tab-header li.active {
    border: 0;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.46;
    letter-spacing: -0.39px;
    text-align: center;
    background-color: #fff;
    color: #ff6636;
    border-bottom: 2px solid #ff6636;
}
.tab-menu-pview .tab-header li a {
    color: #c6c6c9;
}
.tab-menu-pview .tab-header li.active a {
    font-weight: bold;
    color: #ff6636;
}
.tab-menu-pview .tab-content {
    width: 100%;
    background: #fff;
    margin-top: 0;
    border: 0;
    padding: 0;
}
.tab-menu-pview .tab-content > div {
    display: none;
    font-size: 13px;
}
.tab-menu-pview .tab-content > div.active {
    display: block;
}
.pv-content {
    padding: 24px 16px;
}

/* category-slider */
.category-slider {
    border: 0;
    margin-bottom: 8px;
}
.category-slider .swiper-container .swiper-wrapper .swiper-slide .category {
    font-size: 13px;
    color: #a6a6a6;
    line-height: 40px;
    padding: 0 4px 9px;
    margin: 0 4px;
    font-weight: 500;
}
.category-slider .swiper-container .swiper-wrapper .swiper-slide .category.active {
    font-weight: 600;
    color: #5cc4ef;
    border-bottom: 2px solid #5cc4ef;
}

.search-type1 {
    padding: 16px 16px 0;
    background-color: #fff;
}
.search-type1 form {
    padding: 0 0 16px;
    display: flex;
    border-bottom: 1px solid #e6e6e6;
}
.search-type1 select.input-regular {
    min-width: 120px;
}
.search-type1 .search-regular {
    width: calc(100% - 120px);
    padding-left: 8px;
}
.search-type1 .search-regular .input-regular {
    width: 100%;
}

/* btn-switch 제거 */
.theme1-c-btn:not(.btn-switch):hover {
    background-color: #ff6636 !important;
    color: #fff !important;
    border: 1px solid #ff6636 !important;
}
.theme1-c-btn.line:not(.btn-switch):hover {
    background-color: #fff !important;
    color: #ff6636 !important;
    border: 1px solid #ff6636 !important;
}
.theme2-c-btn.line:not(.btn-switch):hover {
    background-color: #ffa023 !important;
    color: #fff !important;
    border: 1px solid #ffa023 !important;
}
.theme2-c-btn.line:not(.btn-switch):hover {
    background-color: #fff !important;
    color: #ffa023 !important;
    border: 1px solid #ffa023 !important;
}
.theme3-c-btn.line:not(.btn-switch):hover {
    background-color: #00c993 !important;
    color: #fff !important;
    border: 1px solid #00c993 !important;
}
.theme3-c-btn.line:not(.btn-switch):hover {
    background-color: #fff !important;
    color: #00c993 !important;
    border: 1px solid #00c993 !important;
}
.btn-small:not(.btn-switch):hover,
.btn-regular:not(.btn-switch):hover,
.btn-medium:not(.btn-switch):hover,
.btn-large:not(.btn-switch):hover {
    border: solid 1px #d6d6d6;
    background-color: #fff;
    color: #565656;
}
.btn-small,
.btn-regular,
.btn-medium,
.btn-large {
    border-radius: 4px;
}

.btn-medium:disabled,
.btn-medium:hover:disabled {
    border-color: #d6d6d6 !important;
    background-color: #d6d6d6 !important;
    color: #fff !important;
}

.btn-large:disabled,
.btn-large:hover:disabled {
    border-color: #d6d6d6 !important;
    background-color: #d6d6d6 !important;
    color: #fff !important;
}

.input-small,
.input-regular,
.input-medium {
    border-radius: 4px !important;
}

/*======================================
1. 공통 요소 영역 (헤더/푸터/퀵메뉴 등)
======================================*/
html {
    width: 100%;
}
body {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
}
#sb-site {
    width: 100%;
}
#wrapper {
    position: relative;
    max-width: 700px;
    margin: 0 auto;
    padding: 44px 0 0;
    background-color: #fff;
}

#content {
    width: 100%;
    min-height: 524px;
    padding-bottom: 40px;
}

.left-menu {
    display: none;
}

/* 헤더 */
#header {
    position: fixed;
    left: 50%;
    top: 0;
    display: block;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 700px;
    height: 44px;
    border-bottom: 1px solid #e6e6e6;
    background-color: #ffffff;
    z-index: 10;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#header .left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-left: 10px;
}
#header .right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding-right: 10px;
}
#header .right > a {
    margin-left: 8px;
}
#header > h1 {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: none;
    width: 78px;
    height: 35px;
}
#header > h1 a {
    display: inline-block;
    width: 100%;
    height: 100%;
    background: url(/image/mobile/logo.png) center center no-repeat;
    background-size: contain;
    text-indent: -5000px;
}
#header .back {
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_back.png) center center no-repeat;
    background-size: contain;
    text-indent: -5000px;
    margin-top: 0;
}
/*alirm*/
#header .alirm {
    display: none;
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_alirm.png) center center no-repeat;
    background-size: contain;
}
#header .alirm.new {
    background: url(/image/mobile/icon_alirm_new.png) center center no-repeat;
    background-size: contain;
}
/*menu*/
#header .menu {
    /* 2023-06-22 display: none;*/
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_menu.png) center center no-repeat;
    background-size: contain;
    text-indent: -5000px;
}
#header .menu.active {
    display: inline-block;
}

/* 푸터 */
#footer {
    display: none;
    width: 100%;
    padding: 24px 32px;
    border-top: 1px solid #e6e6e6;
}

#footer .fnb1 ul {
    display: flex;
    justify-content: center;
    align-items: center;
}

#footer .fnb1 li {
    margin: 0 8px 0 0;
    line-height: 0.6;
}

#footer .fnb1 li + li {
    padding: 0 0 0 8px;
    border-left: 1px solid #565656;
}

#footer .fnb1 a {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.6;
    letter-spacing: normal;
    text-align: right;
    color: #565656;
}

#footer .fnb2 ul {
    display: flex;
    justify-content: center;
    align-items: center;
}

#footer .fnb2 li {
    margin: 0 8px 0 0;
}

#footer .fnb2 li + li {
    padding: 0 0 0 8px;
    line-height: 0.6;
    border-left: 1px solid #a6a6a6;
}

#footer .fnb2 a {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.6;
    letter-spacing: normal;
    text-align: right;
    color: #a6a6a6;
}

.footer-info {
    margin: 45px 0 0;
}

.footer-info .tit {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

.footer-info p {
    margin: 8px 0 0;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

.footer-info p span + span {
    display: inline-block;
}

.footer-info p span + span {
    margin-left: 6px;
}

.footer-info .tel {
    display: block;
    margin: 8px 0 0;
    font-size: 20px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #ff6636;
}

.footer-info + .footer-info {
    margin: 24px 0 0;
}
.copyright {
    margin: 8px 0 40px;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

/* 하단 네비게이션 바 */
.footer-fixed-menu {
    position: fixed;
    left: 50%;
    bottom: 0;
    display: none;
    transform: translate(-50%, 0);
    width: 100%;
    max-width: 700px;
    height: 55px;
    padding: 8px 0 9px;
    background-color: #fff;
    border-top: 1px solid #d6d6d6;
    z-index: 50;
}
.footer-fixed-menu ul {
    display: flex;
    align-items: center;
}
.footer-fixed-menu li {
    width: 25%;
    text-align: center;
}
.footer-fixed-menu li a {
    font-size: 10px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}
.footer-fixed-menu li a img {
    display: block;
    margin: 0 auto;
    width: 24px;
    height: 24px;
}

/* 메뉴레이어 */
.con_bg {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    text-indent: -5000px;
    z-index: 200;
}
.con_bg.on {
    display: block;
}
.sb-slidebar {
    background: #fff;
    overflow: hidden;
    z-index: 100;
}
.sb-slidebar .top {
    background: #fff;
    text-align: left;
    overflow: hidden;
    border-bottom: 1px solid #e6e6e6;
}
.sb-slidebar .top h1 {
    margin: 5px 0 4px 16px;
    display: inline-block;
    width: auto;
    height: 35px;
}
.sb-slidebar .top h1 a {
    display: block;
    width: 100%;
    height: 100%;
}
.sb-slidebar .top h1 a img {
    width: 100%;
    height: 100%;
}
.sb-slidebar .top .sb-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    background: url(/image/component/icon_modal_close.png);
    background-size: contain;
    text-indent: -5000px;
    z-index: 10;
}
.sb-slidebar .top .btn {
    overflow: hidden;
    padding: 13px 16px 0;
}
.sb-slidebar .top .myinfo {
    height: 44px;
    flex-grow: 0;
    padding: 13px 16px;
    border-top: 1px solid #e6e6e6;
    display: flex;
    align-items: center;
}
.sb-slidebar .top .myinfo .name {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #ff6636;
}
.sb-slidebar .top .myinfo .name span {
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}
.sb-slidebar .top .myinfo .level {
    margin: 0 0 0 15px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

/* gnbWrap */
.gnbWrap {
    height: 100%;
    overflow: auto;
    background: #f6f6f6;
    padding-bottom: 160px;
}
.gnbWrap .gnbBox {
    margin: 0;
    padding: 0;
}
.gnbWrap .gnbBox > li {
    background: #fff;
    border-bottom: 1px solid #f3f3f3;
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.gnbWrap .gnbBox > li > a,
.gnbWrap .gnbBox > li .title {
    position: relative;
    display: block;
    padding: 14px 20px 14px 16px;
    height: auto;
    line-height: 1.47;
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
    background: #fff;
}
.gnbWrap .gnbBox > li .title {
    background: url(/image/component/icon_accordion_arrow_down.png) right 10px center no-repeat;
    background-size: 24px;
}
.gnbWrap .gnbBox > li .title a {
    color: #464646;
}
.gnbWrap .gnbBox > li ul {
    display: none;
    background: #f6f6f6;
    border-bottom: 1px solid #f3f3f3;
    padding: 4px 4px 4px;
    margin: 0;
}
.gnbWrap .gnbBox > li ul li a {
    display: block;
    height: 19px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
    margin: 12px 0 12px 12px;
}
.gnbWrap .gnbBox > li ul li a:before {
    content: " - ";
}
.gnbWrap .gnbBox > li.on .title {
    background: url(/image/component/icon_accordion_arrow_up.png) right 10px center no-repeat;
    background-size: 24px;
}
.gnbWrap .gnbBox > li.on ul {
    display: block;
}
.gnbWrap .btn {
    margin: 64px 16px 0;
}

.a-underline {
    display: inline-block;
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #9e9ea2;
    margin: 0 8px;
    text-decoration: underline;
}

/*========== 컨텐츠 공용 시작 ==========*/
/*swiper*/
.slider .swiper-container {
    height: auto;
}
.swiper-container.main-visual .swiper-slide img {
    width: 100%;
}
.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 8px;
}
.swiper-pagination-bullet.swiper-pagination-bullet {
    width: 6px;
    height: 6px;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #c8242c;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 2px;
}
.swiper-pagination {
    max-width: 700px;
    width: 100%;
}

.list-empty {
    padding: 100px 0;
    text-align: center;
}
.list-empty img {
    width: 80px;
    height: 80px;
}
.list-empty p {
    font-size: 12px;
    font-weight: 400;
    color: #d6d6d6;
    text-align: center;
    margin: 10px 0 0;
    letter-spacing: normal;
}
.list-empty.small {
    padding: 24px 0;
}
.list-empty.large {
    padding: 160px 0 262px;
}

/*서브타이틀*/
.sub-title-area h1 {
    position: fixed;
    top: 0;
    left: 50%;
    width: 200px;
    transform: translate(-50%, 0);
    max-width: 700px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    font-size: 16px;
    font-weight: normal;
    z-index: 100;
}
.sub-title-area.type-b h1 {
    left: 45px;
    width: calc(100% - 90px);
}

/*결과*/
.result-area {
    padding: 50px 16px;
    text-align: center;
    background: #fff;
}
.result-area.border-top {
    border-top: 1px solid #e6e6e6;
}

.result-area .icon-result {
    display: block;
    margin: 0 auto;
    width: 64px;
    height: 64px;
    border-radius: 32px;
    background: url(/image/mobile/icon_result_chk.png) center center no-repeat;
    background-size: contain;
}
.result-area h1 {
    font-size: 18px;
    font-weight: bold;
    line-height: 1.5;
    letter-spacing: -0.54px;
    text-align: center;
    margin: 20px 0 0;
}
.result-area p {
    font-size: 13px;
    text-align: center;
    color: #565656;
    margin: 8px 0 16px;
}
.result-area p strong {
    font-weight: bold;
    color: #868686;
}
.result-area .text-decoration {
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -0.33px;
    text-align: center;
    color: #a6a6a6;
    margin-top: 16px;
    display: block;
    text-decoration: underline;
}
.result-area .block-type-area > ul {
    padding: 0;
}
.result-area .logo {
    width: auto;
    height: 55px;
}

/*게시판 목록 공통*/
.board-list-area {
    background: #fff;
    padding: 16px 16px 0;
}
.board-list-area > button {
    float: right;
    margin: 0 0 12px;
}
.board-list-area > .board-list-header {
    clear: both;
}
.board-list-area ul {
    display: table;
    width: 100%;
}
.board-list-area ul li {
    display: table-cell;
    vertical-align: middle;
}
.board-list-area ul li.num {
    width: 14%;
}
.board-list-area ul li.class {
    width: 14%;
}
.board-list-area ul li.error {
    width: 16%;
}
.board-list-area ul li.chk {
    width: 12%;
}
.board-list-area ul li.writer {
    width: 20%;
}
.board-list-area ul li.board {
    width: 24%;
}
.board-list-area ul li.date {
    width: 20%;
}
.board-list-area ul li.status {
    width: 20%;
}
.board-list-area ul li.term {
    width: 20%;
}
.board-list-area ul li.price {
    width: 22%;
}
.board-list-area ul li.split2 {
    width: 50%;
}
.board-list-area ul li.split3 {
    width: 33.3%;
}
.board-list-area ul li.split4 {
    width: 25%;
}
.board-list-area ul li.split5 {
    width: 20%;
}
.board-list-area ul li.split6 {
    width: 16.66%;
}
.board-list-area ul li.split7 {
    width: 14.28%;
}

.board-list-area .board-list-header ul li {
    padding: 10px 0;
    text-align: center;
    font-size: 10px;
    color: #a6a6a6;
    background: #f9f9f9;
    border-top: 1px solid #707070;
}
.board-list-area.not-border .board-list-header ul li {
    border-top: 0;
}
.board-list-area .board-list-header > div {
    width: 100%;
    display: block;
    height: auto;
    background: #f9f9f9;
    padding: 0;
}
.board-list-area .board-list-content > div {
    position: relative;
    width: 100%;
    display: block;
    height: auto;
    background: #fff;
    padding: 0;
    border-bottom: 1px solid #e6e6e6;
}
.board-list-area .board-list-content > div > ul > li {
    padding: 8px 0;
    height: 50px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -0.33px;
    text-align: center;
    color: #a6a6a6;
}
.board-list-area .board-list-content > div > ul > li.subject {
    padding-left: 4px;
}
.board-list-area .board-list-content > div > ul > li.subject a {
    text-align: left;
    overflow: hidden;
    display: block;
}
.board-list-area .board-list-content > div > ul > li.subject > a p {
    float: left;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: -0.65px;
    text-align: left;
    color: #565656;
    max-width: 95%;
    display: -webkit-box;
    line-height: 1.5em;
    height: 1.5em;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}
.board-list-area .board-list-content > div > ul > li.subject > a p.small {
    max-width: 140px;
}
.board-list-area .board-list-content > div > ul > li.subject > a p:hover {
    text-decoration: underline;
}
.board-list-area .board-list-content > div > ul > li.subject > a .comn {
    float: left;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -0.55px;
    text-align: left;
    color: #5cc4ef;
    margin: 0 0 0 8px;
}
.board-list-area .board-list-content > div > ul > li.subject .writer-date {
    display: block;
    width: 100%;
    text-align: left;
    margin-top: 4px;
}
.board-list-area li.subject .writer-date .writer {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -0.55px;
    text-align: left;
    color: #868686;
    margin-right: 8px;
}
.board-list-area li.subject .writer-date .date {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -0.33px;
    text-align: left;
    color: #a6a6a6;
    margin-right: 8px;
}
.board-list-area li.subject .writer-date .hit {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.55;
    letter-spacing: -0.55px;
    text-align: center;
    color: #a6a6a6;
}
.board-list-area li.subject .writer-date .hit:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    margin: -2px 2px 0 0;
    background: url(/image/mobile/icon_hit.png);
    background-size: contain;
}
.board-list-content > div > ul > li.status span {
    font-weight: 600;
    color: #a6a6a6;
}
.board-list-area .board-list-content > div > ul > li.term {
    text-align: right;
}
.board-list-area .board-list-content > div > ul > li.term span {
    display: block;
    color: #a6a6a6;
}
.board-list-area .board-list-content > div.notice .num {
    font-weight: bold;
    color: #ff6636;
}
.board-list-area .board-list-content > div.notice ul > li.subject > a p {
    font-weight: 500;
}

/* board-file */
.board-file {
    margin: 16px 0 0;
}
.board-file a {
    display: inline-block;
    height: 32px;
    padding: 0 8px;
    border-radius: 4px;
    border: solid 1px #d6d6d6;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 30px;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}
.board-file a:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    margin: -3px 8px 0 0;
    background: url(/image/mobile/icon_download.png);
    background-size: contain;
}
.board-file + .board-file {
    margin: 8px 0 0;
}

/* 게시판형 faq */
.board-list-content .accordion {
    width: auto;
}
.board-list-content .accordion > ul > li {
    height: auto;
    position: relative;
    background: #fff;
    padding: 16px;
}
.board-list-content .accordion > ul > li p {
    width: calc(100% - 50px);
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: -0.6px;
    text-align: left;
    color: #565656;
    text-decoration: none;
    cursor: pointer;
}
.board-list-content .accordion > ul > li p:after {
    display: block;
    content: "";
    width: 24px;
    height: 24px;
    background: red;
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -12px;
    background: url(/image/component/icon_accordion_arrow_down.png) no-repeat 0 0;
    background-size: contain;
}
.board-list-content .accordion .accordion-content {
    display: none;
    background: #fff;
    width: 100%;
    min-height: auto;
}
.board-list-content .accordion.active .accordion-content {
    display: block;
    border-top: 1px solid #e9e9e9;
}
.board-list-content .accordion .accordion-content > p {
    padding: 16px;
    font-size: 13px;
    color: #565656;
}
.board-list-content .accordion.active > ul > li p:after {
    background: url(/image/component/icon_accordion_arrow_up.png) no-repeat 0 0;
    background-size: contain;
}
.board-list-content .accordion .accordion-content {
    position: relative;
    background-color: #fff;
    min-height: auto;
}
.board-list-content .accordion .accordion-content p {
    padding: 16px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: -0.65px;
    text-align: left;
    color: #161616;
}
.board-list-content .accordion .accordion-content img {
    display: block;
    max-width: 100%;
    margin: 16px 0 0;
}

/*검색*/
.board-search {
    position: relative;
    background: #fff;
    overflow: hidden;
    padding: 16px 16px 0;
}
.board-search select.input-regular {
    float: left;
    min-width: 120px;
}
.board-search input.input-regular {
    float: left;
    width: calc(100% - 128px);
    margin-left: 8px;
}
.board-search button {
    position: absolute;
    top: 22px;
    right: 22px;
    width: 24px;
    height: 24px;
    border: 0;
    background: url(/image/mobile/icon_search.png) center center no-repeat;
    background-size: contain;
    text-indent: -5000px;
}
.board-search:after {
    content: "";
    clear: both;
    display: block;
    padding-top: 16px;
    width: 100%;
    border-bottom: 1px solid #e6e6e6;
}
/* type-b */
.board-search.type-b select.input-regular {
    float: left;
    min-width: calc(50% - 4px);
    width: calc(50% - 4px);
}
.board-search.type-b select.input-regular + select.input-regular {
    margin-left: 8px;
}
.board-search.type-b input.input-regular {
    min-width: 100%;
    width: 100%;
    margin: 8px 0 0;
}
.board-search.type-b button {
    top: 65px;
}

/* faq */
.accordion.faq {
    background: #fff;
    padding: 0 16px;
    width: 100%;
}
.accordion.faq .inner-wrap > ul {
    border: 0;
}
.accordion.faq .inner-wrap > ul > li {
    border-bottom: 1px solid #e9e9e9;
}
.accordion.faq .inner-wrap > ul > li .accordion-header {
    position: relative;
    height: auto;
    padding: 16px 32px 16px 0;
    border-bottom: 0;
    display: flex;
}

.accordion.faq .inner-wrap > ul > li .accordion-header .num {
    width: 48px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #909094;
}

.accordion.faq .inner-wrap > ul > li .accordion-header p {
    width: calc(100% - 48px);
    padding: 0;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
    display: -webkit-box;
    line-height: 1.5em;
    height: 1.5em;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    word-wrap: normal;
    overflow: hidden;
}
.accordion.faq .inner-wrap > ul > li.active .accordion-header p {
    display: block;
    height: auto;
}
.accordion.faq .inner-wrap > ul > li.active .accordion-content {
    display: block;
}

.accordion.faq .inner-wrap > ul > li .accordion-header > p:after {
    right: 0;
    top: 14px;
    margin-top: 0;
}

.accordion.faq .inner-wrap > ul > li .accordion-content {
    position: relative;
    min-height: 40px;
    border-bottom: 0;
    padding: 16px;
    background-color: #f6f6f6;
}

.accordion.faq .inner-wrap > ul > li .accordion-content p {
    padding: 0;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.54;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}
.accordion.faq .inner-wrap > ul > li .accordion-content img {
    display: block;
    max-width: 100%;
    margin: 16px 0 0;
}

/*게시판 보기*/
.board-view-area {
    background: #fff;
    padding: 0 16px;
    overflow: hidden;
    border-bottom: 1px solid #e6e6e6;
}
.board-view-area .header {
    position: relative;
    border-bottom: 1px solid #e6e6e6;
    display: inline-block;
    width: 100%;
    height: auto;
    padding: 16px 0;
}
.board-view-area .header h1 {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.43;
    letter-spacing: -0.7px;
    word-break: keep-all;
}
.board-view-area .header .info {
    margin: 4px 0 0;
    overflow: hidden;
}
.board-view-area .header .info li {
    float: left;
    font-size: 12px;
    color: #909094;
    margin: 0 8px 0 0;
}
.board-view-area .header .info li a {
    font-size: 12px;
    color: #a6a6a6;
    text-decoration: underline;
}
.board-view-area .header.scrap {
    padding-right: 32px;
}
.board-view-area .btn-scrap {
    position: absolute;
    top: 16px;
    right: 0;
    width: 24px;
    height: 24px;
    background: url(/image/mobile/scrap_n.png) center center no-repeat;
    background-size: contain;
}
.board-view-area .btn-scrap.active {
    background: url(/image/mobile/scrap_s.png) center center no-repeat;
    background-size: contain;
}

.board-view-area .content {
    padding: 16px 0;
    font-size: 13px;
    line-height: 1.4;
    word-break: break-all;
}
.board-view-area .content.small {
    min-height: 100px;
}
.board-view-area .content img {
    max-width: 100%;
    margin-top: 16px;
}
.board-view-area .img img {
    max-width: 100%;
    height: auto;
}

.board-view-area .swiper-container {
    margin: 16px 0 0;
}

.board-view-area .swiper-container .swiper-slide {
    position: relative;
    width: 64px !important;
    padding-bottom: 64px !important;
    height: 0;
    overflow: hidden;
    border-radius: 8px;
}

.board-view-area .swiper-container .swiper-slide img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0;
}

/*답변*/
.board-view-area .re-header {
    text-align: center;
    height: 32px;
    line-height: 32px;
    background-color: #f3f3f3;
    font-size: 12px;
    font-weight: 500;
    color: #767676;
}

/*board-re*/
.board-re {
    margin: 16px 0;
}
.board-re > h1 {
    background-color: #f9f9f9;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 12px;
    color: #a6a6a6;
    border-top: 1px solid #e6e6e6;
}
.board-re > div {
    font-size: 13px;
    color: #161616;
    line-height: 1.46;
    min-height: 216px;
    padding: 16px 0 24px;
}

/* 댓글 작성 */
.board-comment-area {
    width: 100%;
    height: auto;
    background: #fff;
    overflow: hidden;
    margin: 32px 0 0;
}
.board-comment-area h1 {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: -0.48px;
    text-align: left;
    color: #161616;
    margin-bottom: 12px;
}
.board-comment-write {
    position: relative;
    width: 100%;
    height: auto;
    display: inline-block;
    margin-top: 24px;
    padding: 0 16px 16px;
}
.board-comment-write textarea {
    width: 100%;
    height: 120px;
    border: solid 1px #e6e6e6;
    border-radius: 4px;
    padding: 10px 12px;
}
.board-comment-write .btn-group-type1 {
    margin: 16px 0 0;
    padding: 0;
}

.board-comment-list {
    width: 100%;
    height: auto;
    border-top: 1px solid #e6e6e6;
}
.board-comment-list > div {
    width: 100%;
    height: auto;
}
.board-comment-list > div > ul {
    display: inline-block;
    width: 100%;
    height: auto;
}
.board-comment-list > div > ul > li {
    display: inline-block;
    width: 100%;
    height: auto;
}
.board-comment-list > div > ul > li > .comment-box {
    width: 100%;
    height: auto;
    padding: 16px;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
}
.board-comment-list > div > ul > li .comment-top-area {
    display: inline-block;
    width: 100%;
    height: auto;
    margin: -4px 0 0;
}
.board-comment-list > div > ul > li .comment-top-area > ul.comment-info {
    display: block;
    float: left;
}
.board-comment-list .comment-btn {
    display: block;
    float: right;
    position: relative;
    margin-right: -8px;
}
.board-comment-list .comment-btn:before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_cm_btn.png);
    background-size: contain;
    cursor: pointer;
}
.board-comment-list .comment-btn ul {
    display: none;
}
.board-comment-list .comment-btn.active ul {
    display: block;
    position: absolute;
    top: 16px;
    right: 8px;
    width: 88px;
    height: 105px;
    margin: 0 0 0 60px;
    padding: 8px 0 16px 16px;
    border-radius: 8px;
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.08);
    background-color: #ffffff;
    z-index: 1;
}
.board-comment-list .comment-btn li button {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: -0.65px;
    text-align: left;
    color: #868686;
}
.board-comment-list .comment-btn li + li {
    margin-top: 8px;
}
.board-comment-list .comment-btn li button:hover {
    text-decoration: underline;
}
.board-comment-list > div > ul > li .comment-top-area > ul.comment-info li {
    display: inline-block;
    margin-right: 12px;
}
.board-comment-list .comment-top-area > ul.comment-info li {
    font-size: 11px;
    color: #a6a6a6;
}
.board-comment-list .comment-top-area > ul.comment-info li.userid {
    color: #565656;
}

.board-comment-list > div > ul > li .comment-content-area {
    width: 100%;
    display: block;
    height: auto;
}
.board-comment-list > div > ul > li .comment-content-area > p {
    width: 100%;
    height: auto;
    line-height: 1.46;
    display: block;
    color: #161616;
    font-size: 13px;
    padding: 4px 0;
}

.board-comment-list > div > ul > li .bottom-btn button {
    font-size: 12px;
    color: #b6b6b6;
    margin: 0 16px 0 0;
}

.board-comment-list > div > ul > li .comment-reply-write {
    width: 100%;
    height: auto;
    padding: 12px 12px 16px 44px;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
    background: #f9f9f9 url(/image/mobile/icon_re.png) 16px 12px no-repeat;
    background-size: 24px;
}
.board-comment-list > div > ul > li .comment-reply-write textarea {
    width: 100%;
    height: 120px;
}

.board-comment-list > div > ul > li .comment-reply-write .btn-group-type1 {
    margin: 16px 0 0;
    padding: 0;
}
.board-comment-list > div > ul > li .comment-reply-write .btn-regular {
    width: calc(50% - 5px);
    height: 44px;
    line-height: 42px;
    border-radius: 22px;
    font-size: 13px;
    margin: 0;
}
.board-comment-list .comment-reply-write .btn-regular + .btn-regular {
    margin: 0 0 0 8px;
}

.board-comment-list > div > ul > li > .comment-box.re {
    width: 100%;
    height: auto;
    padding: 12px 12px 12px 44px;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
    background: url(/image/mobile/icon_re.png) 16px 12px no-repeat;
    background-size: 24px;
}
.board-comment-list > .comment-box.re .comment-content-area > p {
    color: #868686;
}
.comment-content-area ul {
    display: flex;
    margin: 8px 0;
}
.comment-content-area li.tit {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: -0.6px;
    text-align: left;
    color: #a6a6a6;
    width: 64px;
    height: 18px;
}
.comment-content-area li.con {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: -0.65px;
    text-align: left;
    color: #161616;
    width: calc(100% - 64px);
    padding-left: 8px;
}

/*table-type-area*/
.table-type-area {
    background: #fff;
}
.table-type-area > h1 {
    margin: 0 16px 16px;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #000;
}
.table-type-area > ul {
    padding: 0 16px 24px;
    border-top: 0;
}
.table-type-area > ul.border {
    padding: 16px 0;
    margin: 0 16px;
    border-top: 1px solid #a6a6a6;
    border-bottom: 1px solid #a6a6a6;
}
.table-type-area > ul > li {
    display: table;
    width: 100%;
    margin: 0;
    height: 16px;
}
.table-type-area > ul > li + li {
    margin-top: 8px;
}
.table-type-area > ul > li > * {
    display: table-cell;
    vertical-align: middle;
}
.table-type-area > ul > li > .title {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
    width: 96px;
}
.table-type-area > ul > li > .title.required::before {
    content: "*";
    display: inline-block;
    color: #e6291f;
    margin-right: 4px;
}
.table-type-area > ul > li > .con {
    text-align: left;
    font-size: 13px;
    color: #161616;
}
.table-type-area > ul > li .input-regular {
    min-width: auto;
    width: 100%;
    height: 40px;
}
.table-type-area > ul > li > .con .input-regular.btn-add {
    width: calc(100% - 63px);
}
.table-type-area > ul > li > .con .input-regular.btn-add + button {
    min-width: 55px;
    height: 40px;
    padding: 0;
    margin-left: 8px;
}
.table-type-area > ul > li > .con .input-regular.btn-add + button + .input-regular.flexible {
    margin: 8px 0 0;
}
.table-type-area > ul > li > .con .input-regular.unit-add {
    width: calc(100% - 38px);
    margin-right: 8px;
}
.table-type-area .valign-top {
    vertical-align: top !important;
    padding-top: 12px;
}
/* type-b */
.table-type-area.type-b {
    padding: 29px 4px 0;
}
.table-type-area.type-b > ul > li > .title {
    width: 106px;
}
.table-type-area.type-b > ul {
    padding: 0 20px 8px;
    border-top: 0;
}
.table-type-area.type-b .btn-group-type1 {
    padding-top: 0;
}
.table-type-area.type-b > ul > li > .title .btn-regular {
    width: 90px;
    height: 40px;
    line-height: 38px;
    font-size: 16px;
}

.valign-middle {
    vertical-align: middle !important;
}

/* sub-small-title */
.sub-small-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sub-small-title > h1 {
    margin: 24px 11px 16px 16px;
    font-family: Pretendard;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #ff6636;
}

.sub-small-title .total-payment-amount {
    margin: 0 16px 0 0;
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

/*block-type-area*/
.block-type-area > ul {
    background: #fff;
    padding: 0 16px;
    overflow: hidden;
    border-bottom: 0;
    text-align: left;
}
.block-type-area > ul > li {
    margin: 24px 0 0;
}
.block-type-area > ul > li > .title {
    font-size: 13px;
    font-weight: 400;
    color: #161616;
}
.block-type-area > ul > li > .title.required::before {
    content: "*";
    display: inline-block;
    color: #e6291f;
    margin-right: 4px;
}
.block-type-area > ul > li > .title > span {
    color: #5cc4ef;
}
.block-type-area > ul > li > .con {
    margin: 8px 0 0;
    font-size: 13px;
    color: #565656;
}
.block-type-area > ul > li > .con .unit-box .input-regular {
    width: calc(100% - 40px);
}
.block-type-area > ul > li input[type="radio"] {
    vertical-align: middle;
    margin-top: -2px;
}
.block-type-area > ul > li > .con .search-date input.input-regular {
    width: calc(50% - 10px);
}
.block-type-area > ul > li > .con input[type="radio"] {
    margin-left: 0;
}
.block-type-area > ul > li > .con .input-regular {
    width: 100%;
    height: 40px;
    border-radius: 4px;
}
.block-type-area > ul > li > .con .input-regular.btn-add {
    width: calc(100% - 82px);
}
.block-type-area > ul > li > .con .input-regular.btn-add + button {
    width: 74px;
    height: 40px;
    border-radius: 4px;
    padding: 0;
    margin-left: 8px;
}
.block-type-area > ul > li > .con .input-regular {
    width: 100%;
}
.block-type-area .btn-group-type1 {
    padding: 40px 32px 0;
    background: #fff;
}
/* type-b */
.block-type-area.type-b {
    padding-bottom: 16px;
    border-bottom: 1px solid #a6a6a6;
}

.block-type-area.type-b > ul > li {
    margin: 16px 0 0;
}

.block-type-area.type-b > ul > li > .title {
    font-size: 15px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.07;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

.block-type-area.type-b > ul > li > .con {
    margin: 16px 0 0 16px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.23;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

/* popup-report */
.popup-report {
    width: 320px;
    padding-bottom: 8px;
}
.popup-report .block-type-area {
    padding: 0 0 24px;
}
.popup-report .block-type-area > ul {
    padding: 0;
    border-bottom: 0;
}
.popup-report .block-type-area > ul > li:first-child {
    margin-top: 0;
}
.popup-report .btn-group-area {
    padding: 0 8px 24px;
}

.push-list {
    background: #fff;
    padding: 16px 16px 0;
}
.push-list > button {
    float: right;
    margin: 0 0 8px;
}
.push-list > ul {
    margin-top: -8px;
    overflow: hidden;
    clear: both;
}
.push-list > ul > li {
    position: relative;
    margin: 8px 0 0;
}
.push-list > ul > li a {
    display: block;
    border: 1px solid #e6e6e6;
    border-radius: 4px;
    padding: 14px 16px;
    background: #fff;
}
.push-list > ul > li .date {
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.09;
    letter-spacing: normal;
    text-align: left;
    color: #868686;
}
.push-list > ul > li .con {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.23;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
    word-break: keep-all;
    margin: 8px 0 0;
}
.push-list > ul > li .delete {
    position: absolute;
    top: 10px;
    right: 10px;
    display: block;
    width: 20px;
    height: 20px;
    background: url(/image/component/icon_modal_close.png) center center no-repeat;
    background-size: contain;
    z-index: 1;
}
.push-list > ul > li.read a {
    background: #f9f9f9;
}
.push-list > ul > li.read .con {
    color: #a6a6a6;
}
.push-list > ul > li.read .date {
    color: #a6a6a6;
}
.push-list .list-empty {
    padding: 126px 0 306px;
}

.block-type-area.my_info_c > ul {
    padding-bottom: 24px;
    border-bottom: 0;
}
.block-type-area.my_info_c + .btn-group-type1 {
    padding-top: 0;
}

.block-type-area.member_out {
    background-color: #ffffff;
    padding: 0 0 32px;
}
.block-type-area.member_out ul {
    border-bottom: 0;
    padding-bottom: 8px;
}

/* Login */
.login-area {
    background: #fff;
    padding: 32px 24px 64px;
    text-align: center;
}
.login-area h1 {
    margin: 0 0 16px;
    line-height: 1;
    text-align: center;
}
.login-area h1 img {
    width: 192px;
    height: auto;
}
.login-area .input {
    width: 100%;
    height: 50px;
    border-radius: 4px;
    padding: 15px 16px;
    font-size: 14px;
    letter-spacing: -0.65px;
}
.login-area li + li {
    margin-top: 8px;
}
.login-area li input.input-large {
    font-size: 14px;
}
.login-area button[type="submit"] {
    margin: 16px 0 0;
}
.login-chk-link {
    margin-top: 12px;
}
.login-chk-link:after {
    content: "";
    display: block;
    clear: both;
}
.login-chk-link .chk {
    float: left;
}
.login-chk-link .chk > label {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    font-size: 12px;
    letter-spacing: -0.55px;
    cursor: pointer;
    color: #565656;
}
.login-chk-link .chk input {
    margin: 0 4px 0 0;
}
.login-chk-link .link {
    float: right;
}
.login-chk-link .link a {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
    text-decoration: underline;
    display: inline-block;
    margin-left: 8px;
}
.login-area .login-join {
    text-align: center;
    margin: 40px 0 0;
    font-size: 12px;
    color: #565656;
}
.login-area .login-join a {
    font-size: 12px;
    text-decoration: underline;
    display: inline-block;
    margin: 0 0 0 8px;
}

.login-area button[type="button"].sns {
    width: 100%;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.7px;
    text-align: center;
    color: #565656;
    margin: 8px 0 0;
}
.login-area .kakaotalk:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin: -2px 4px 0 0;
    width: 32px;
    height: 32px;
    background: url(/image/mobile/icon_s_kakaotalk.png) center center no-repeat;
    background-size: contain;
}
.login-area .naver:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin: -2px 4px 0 0;
    width: 32px;
    height: 32px;
    background: url(/image/mobile/icon_s_naver.png) center center no-repeat;
    background-size: contain;
}
.login-area .facebook:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin: -2px 4px 0 0;
    width: 32px;
    height: 32px;
    background: url(/image/mobile/icon_s_facebook.png) center center no-repeat;
    background-size: contain;
}
.login-area .google:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin: -2px 4px 0 0;
    width: 32px;
    height: 32px;
    background: url(/image/mobile/icon_s_google.png) center center no-repeat;
    background-size: contain;
}
.login-area .apple,
.login-area .apple:hover {
    background: #000;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: -0.36px;
    border: 0;
    color: #ffffff !important;
}
.login-area .apple:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    margin: -2px 4px 0 0;
    width: 32px;
    height: 32px;
    background: url(/image/mobile/icon_s_apple.png) center center no-repeat;
    background-size: contain;
}

/*회원약관*/
.member-content {
    background: #fff;
    padding: 0 16px 0;
}
.member-content .member-agree {
    margin: 24px 0 0;
}
.member-content .member-agree h1 {
    font-size: 12px;
}
.member-content .member-agree textarea.input-regular {
    height: 160px;
    border-radius: 4px;
    background-color: #f9f9f9;
    padding: 12px 16px;
    border: 0;
    font-size: 12px;
    color: #868686;
    margin: 8px 0 0;
}
.member-content .member-agree label {
    display: flex;
    align-items: center;
}
.member-content label span {
    font-size: 13px;
    color: #161616;
}
.member-content label input {
    margin: 0 8px 0 0 !important;
}
.member-content .member-checked-all {
    margin: 24px 0 0;
}
.member-content .btn-group-type1 {
    padding: 32px 16px 0;
}

.margin-t48 {
    margin-top: 48px !important;
}

.margin-t173 {
    margin-top: 173px !important;
}

/* 회원용 */
.member-write-area {
    padding: 0 32px;
}

.member-write-area .icon-result {
    display: block;
    margin: 50px auto 0;
    width: 64px;
    height: 64px;
    border-radius: 32px;
    background: url(/image/mobile/icon_result_chk2.png) center center no-repeat;
    background-size: contain;
}

.member-write-area .icon-empty {
    display: block;
    margin: 50px auto 0;
    width: 80px;
    height: 80px;
    border-radius: 40px;
    background: url(/image/mobile/icon_empty.png) center center no-repeat;
    background-size: contain;
}

.member-write-area h1 {
    margin: 24px 0 16px;
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}

.member-write-area .member-guide-text {
    margin: 16px 0 0;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}

/*btn-group-type1*/
.btn-group-type1 {
    max-width: 360px;
    margin: 0 auto;
    padding: 16px 16px 0;
    text-align: center;
    overflow: hidden;
}
.btn-group-type1 .btn-small + .btn-small,
.btn-group-type1 .btn-regular + .btn-regular,
.btn-group-type1 .btn-medium + .btn-medium {
    margin-left: 8px;
}
.block-type-area + .btn-group-type1 {
    padding: 24px 24px 0;
}

.service-info {
    min-height: 600px;
    padding: 16px;
    background-color: #ffffff;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.46;
    letter-spacing: -0.39px;
    text-align: left;
    color: #565656;
}

/* .event-list-type2 */
.event-list-type2 {
    background-color: #ffffff;
    padding: 0;
    border-top: 1px solid #d6d6d6;
}
.event-list-type2 .img img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.event-list-type2 .subject {
    margin: 16px 32px 8px;
    text-align: center;
}
.event-list-type2 .subject a {
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.75px;
    text-align: center;
    color: #000;
}
.event-list-type2 .subject a:hover {
    text-decoration: underline;
}
.event-list-type2 .term {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #909094;
    margin-bottom: 16px;
}

/* member-out */
.member-out {
    padding: 140px 24px 0;
    text-align: center;
    background: #fff;
}
.member-out .icon-result {
    display: block;
    margin: 0 auto;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: url(/image/mobile/icon_result_chk.png) center center no-repeat;
    background-size: contain;
}
.member-out h1 {
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
    margin: 16px 0 0;
}
.member-out p {
    margin: 16px 0 100px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #9e9ea2;
}
.member-out p strong {
    font-weight: bold;
    color: #868686;
}

.froala-view .f-video-editor {
    width: 100%;
    height: auto;
}
.froala-view .f-video-editor iframe {
    width: 100%;
    height: 30vh;
}

body.index #content {
    padding-bottom: 0;
}
body.content-padding-b0 #content {
    padding-bottom: 0;
}

/* 활성화 */
body.active-logo #header > h1 {
    display: inline-block;
}
body.active-alirm #header .alirm {
    display: inline-block;
}
body.active-menu #header .menu {
    display: inline-block;
}
body.active-footer #footer {
    display: block;
}
body.active-footer-fixed-menu .footer-fixed-menu {
    display: block;
}
body.active-footer-fixed-menu #wrapper {
    padding-bottom: 55px;
}

/* 비활성화 */
body.inactive-back #header .back {
    display: none;
}
body.inactive-footer #footer {
    display: none;
}

.file-upload .gallery-scroll {
    overflow-x: auto;
    overflow-y: hidden;
}
.file-upload .gallery-scroll::-webkit-scrollbar {
    width: 100%;
    height: 0;
}
.file-upload .gallery-scroll .gallery {
    width: 700px;
}
.file-upload .upload > input {
    top: -6px;
    height: 35px;
}

/* main-notice */
.main-notice {
    padding: 24px 16px 40px;
}

.main-notice .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 8px;
}

.main-notice .title h1 {
    font-size: 18px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

.main-notice .title .more {
    width: 24px;
    height: 24px;
    background: url(/image/mobile/icon_more.png);
    background-size: contain;
}

.main-notice > ul > li {
    display: flex;
    align-items: center;
    padding: 10px 0;
}

.main-notice > ul > li:last-child {
    padding-bottom: 0;
}

.main-notice > ul > li + li {
    border-top: 1px solid #e9e9e9;
}

.main-notice > ul > li a {
    width: calc(100% - 86px);
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
    padding-right: 24px;
}

.main-notice > ul > li span {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    text-align: right;
    color: #565656;
}

.main-notice .empty {
    height: 68px;
    padding: 24px;
    border-radius: 16px;
    background-color: #f6f6f6;
    margin: 16px 0 0;
}

.main-notice .empty p {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.67;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}
/*========== 컨텐츠 공용 끝 ==========*/

/*========== 컨텐츠 시작 ==========*/
.popup-Refund-list .total-price {
    padding: 34px 24px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.popup-Refund-list .total-price .tit,
.popup-Refund-list .total-price .con {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #000;
}

.popup-Refund-list .help-text {
    margin: 18px 23px 18px 24px;
    font-size: 11px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

.popup-Refund-list .table01 {
    margin: 0 16px;
    width: calc(100% - 32px);
}

/* table01 */
.table01 {
    width: 100%;
    border-top: 1px solid #565656;
}

.table01 thead th {
    padding: 10px 0;
    background-color: #fafafa;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #9e9ea2;
}

.table01 tbody td {
    padding: 16px 0;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #9e9ea2;
    border-bottom: 1px solid #ebebec;
}

/* table02 */
.table02 {
    width: 100%;
}

.table02 thead th {
    padding: 12px 0;
    background-color: #fafafa;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

.table02 tbody td {
    height: 40px;
    vertical-align: middle;
    padding: 4px 0;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

/* date-search */
.date-search {
    padding: 16px 16px 0;
}

.date-search .st1 {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.date-search .st1 select.input-regular {
    min-width: calc(100% - 218px);
    margin-right: 11px;
}

.date-search .st1 .input-regular.datepicker-here {
    width: 218px;
}

/* board-list */
.board-list {
    margin: 12px 16px 0;
}

.search-type1 + .board-list {
    margin-top: 16px;
}

.board-list > ul > li {
    position: relative;
    border-bottom: 1px solid #d6d6d6;
    display: flex;
    align-items: center;
    padding: 16px 0;
}

.board-list > ul > li.out:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
}

.board-list .info {
    width: 100%;
}

.board-list .info a {
    display: block;
}

.board-list .info a.arrow {
    padding-right: 74px;
    background: url(/image/mobile/icon_arrow_right.png) no-repeat right center;
    background-size: 24px;
}

.board-list .info .title-datetime {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 0 8px;
}

.board-list .info .title-datetime + .subject {
    font-size: 12px;
    color: #565656;
}

.board-list .info .datetime {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #a6a6a6;
}

.board-list .info .title {
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

.board-list .subject {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

.board-list .date-status {
    display: flex;
    align-items: center;
    margin: 8px 0 0;
}

.board-list .date-status .date {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

.board-list .date-status .status {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
    margin-left: 8px;
}

.board-list .date-status .status.theme1-c-font {
    font-weight: bold;
}

.board-list .date-status .status:before {
    content: " ";
    display: inline-block;
    margin-right: 8px;
}

/* schedule-list */
.schedule-list > ul {
    padding: 8px 0;
    border-top: 1px solid #d6d6d6;
}
.schedule-list > ul > li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 40px;
    margin: 8px 0 0;
    padding: 13px 25px 13px 13px;
    border-radius: 4px;
    border: solid 1px #d6d6d6;
}

.schedule-list .date {
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

.schedule-list .amount {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

.schedule-list .name {
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ff6636;
}

/* title-area */
.title-area {
    margin: 24px 0 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.title-area h1 {
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

/* main-index */
.main-index {
    padding: 24px 16px 0;
}
.main-index .st1 .btn-group-type1 {
    padding: 16px 0 16px;
}
.main-index .st2 .link {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.main-index .st2 .link p {
    position: relative;
    padding-bottom: calc((100% - 16px) / 2);
    width: calc((100% - 16px) / 2);
    height: 0;
    overflow: hidden;
}
.main-index .st2 .link p a {
    display: block;
    border-radius: 4px;
    border: solid 1px #d6d6d6;
    padding: 17px 9px 16.4px 19px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #000;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.main-index .st2 .link p.n1 a {
    background: url(/image/mobile/main_st2_n1.png) right bottom 12px no-repeat;
    background-size: 60%;
}
.main-index .st2 .link p.n2 a {
    background: url(/image/mobile/main_st2_n2.png) right bottom 12px no-repeat;
    background-size: 60%;
}
.main-index .st2 .btn-group-type1 {
    padding: 24px 0 0;
}

/* product-list */
.product-list {
    border-top: 1px solid #d6d6d6;
}
.product-list > ul > li {
    margin: 16px 19px 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.product-list .img img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    border-radius: 4px;
}

.product-list .info {
    padding: 0 0 0 24px;
    width: calc(100% - 100px);
    text-align: right;
}

.product-list .info .pname {
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: right;
    color: #000;
    line-height: 1.2em;
    height: 2.4em;
}

.product-list .info .price {
    margin: 2px 0 0;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #ff6636;
}

.product-list .info .delivery-fee {
    margin: 2px 0 0;
    font-size: 11px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #a6a6a6;
}

.product-list .info .btn {
    margin: 6px 0 0;
    border-radius: 4px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.product-list .info .btn .btn-small + .btn-small {
    margin-left: 8px;
}

/* category-select */
.category-select > ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px 0;
}

.category-select > ul > li {
    width: calc((100% - 90px) / 4);
    margin: 16px 30px 0 0;
}

.category-select > ul > li:nth-child(4n) {
    margin-right: 0;
}

.category-select > ul > li a {
    display: block;
    margin: 0 auto;
    width: 54px;
    height: 54px;
    border-radius: 4px;
    border: solid 1px #ff6636;
    font-size: 11px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #000;
    padding: 8px 0 0;
}

.category-select > ul > li a:before {
    content: "";
    display: block;
    width: 24px;
    height: 24px;
    margin: 0 auto 1px;
    background-size: contain !important;
}

.category-select > ul > li.all a:before {
    background: url(/image/mobile/icon_all.png);
}

/*.category-select > ul > li.n1 a:before {
    background: url(/image/mobile/icon_bread.png);
}

.category-select > ul > li.n2 a:before {
    background: url(/image/mobile/icon_wreath.png);
}

.category-select > ul > li.n3 a:before {
    background: url(/image/mobile/icon_flower.png);
}

.category-select > ul > li.n4 a:before {
    background: url(/image/mobile/icon_jewel.png);
}

.category-select > ul > li.n5 a:before {
    background: url(/image/mobile/icon_shop.png);
}

.category-select > ul > li.n6 a:before {
    background: url(/image/mobile/icon_gift.png);
}

.category-select > ul > li.n7 a:before {
    background: url(/image/mobile/icon_adult.png);
}*/

.paginate-area {
    position: relative;
}

.paginate-area .btn-cart {
    position: absolute;
    top: -4px;
    right: -34px;
    z-index: 1;
    width: 30px;
    height: 30px;
    padding: 5px;
    border-radius: 50%;
    border: solid 1px #ff6636;
    background: url(/image/mobile/icon_shoping.png) center center no-repeat;
    background-size: 20px;
}

/* basket-list */
.basket-list {
    padding: 16px;
}

.basket-list .btn-group-type1 {
    padding: 0 0 16px;
}

.basket-list > ul {
    border-top: 1px solid #d6d6d6;
}

.basket-list > ul > li {
    padding: 16px 19px 16px 18px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 1px solid #d6d6d6;
}

.basket-list .img img {
    width: 136px;
    height: 136px;
    object-fit: cover;
    border-radius: 4px;
}

.basket-list .info {
    padding: 0 0 0 24px;
    width: calc(100% - 160px);
    text-align: right;
}

.basket-list .info .pname {
    margin: 7px 0 0;
    font-size: 14px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: right;
    color: #000;
    line-height: 1.2em;
    height: 2.4em;
}

.basket-list .info .price {
    margin: 2px 0 0;
    font-size: 13px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #ff6636;
}

.basket-list .info .delivery-fee {
    margin: 2px 0 0;
    font-size: 11px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #a6a6a6;
}

.basket-list .info .delete {
    width: 24px;
    height: 24px;
    background: url(/image/component/icon_modal_close.png) center center no-repeat;
    background-size: contain;
}

.basket-list .total-price {
    margin: 16px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.basket-list .total-price .tit {
    font-size: 16px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

.basket-list .total-price .con {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ff6636;
}

.basket-list .guide-text {
    margin: 22px 8px 0;
}

.basket-list .guide-text li {
    position: relative;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
    padding-left: 12px;
}

.basket-list .guide-text li:before {
    content: "-";
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
}

/* payment-info */
.payment-info > ul > li {
    display: flex;
    align-items: center;
    padding: 0 16px 8px;
}

.payment-info > ul > li .tit {
    width: 84px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

.payment-info > ul > li .con {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

.payment-info > ul > li.total {
    margin-top: 8px;
    padding-top: 16px;
    border-top: 1px solid #000;
}

.payment-info > ul > li.total .con {
    font-size: 15px;
    font-weight: bold;
}

/* method-of-payment */
.method-of-payment {
    padding: 0 16px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}
.method-of-payment > label {
    display: block;
    margin: 16px 0 0;
}

.method-of-payment > label:first-child {
    margin: 0;
}

.method-of-payment > label input {
    margin: 0 8px 0 0;
}

.method-of-payment select.input-regular {
    margin: 10px 0 0;
}

/* choose-card-bg */
.choose-card-bg {
    padding: 24px 16px 16px;
    text-align: right;
}

.choose-card-bg .card {
    margin: 0 auto 16px;
    border-radius: 4px;
    position: relative;
    width: 100%;
}

.choose-card-bg .card p {
    min-height: 180px;
    border-radius: 4px;
    background-color: #ff6636;
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.choose-card-bg .card p.type-b {
    background-color: #e1e1e1;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}

.type-selection {
    margin: 0 0 16px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

.type-selection .input-small {
    min-width: 80px;
    width: 80px;
    height: 30px;
    border-radius: 4px;
    margin: 0 0 0 24px;
}

/* card-bg-selection */
.card-bg-selection {
    padding: 24px 16px 0;
}

.card-bg-selection > h1 {
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

.card-bg-selection .card ul {
    margin: 24px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-bg-selection .card li {
    width: calc((100% - 80px) / 5);
}

.card-bg-selection .card a {
    display: inline-block;
    width: 100%;
    height: 24px;
    border-radius: 4px;
    border: solid 1px #d6d6d6;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 22px;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
}

.card-bg-selection .card a.active {
    background-color: #ff6636;
    color: #fff;
}

.card-bg-selection .bg ul {
    margin: 4px 0 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.card-bg-selection > h1 + .bg ul {
    margin: 16px 0 0;
}

.card-bg-selection .bg li {
    width: calc((100% - 16px) / 3);
    margin: 8px 8px 0 0;
    position: relative;
    padding-bottom: 52.5%;
    height: 0;
    overflow: hidden;
}

.card-bg-selection .bg li.direct {
    border: solid 1px #ff6636;
}

/*  */

.card-bg-selection .bg li.direct .file-upload.inner-btn .gallery {
    position: relative;
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100%;
    margin: 0;
}
.card-bg-selection .bg li.direct .file-upload.inner-btn .gallery .img-thumb {
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 0;
    border: 0;
    margin: 0 !important;
}
.card-bg-selection .bg li.direct .file-upload.inner-btn .gallery .img-thumb img {
    position: relative;
    z-index: 2;
}
.card-bg-selection .bg li.direct .file-upload.inner-btn .gallery .delete {
    top: 8px;
    left: calc(100% - 8px);
    z-index: 3 !important;
}
.card-bg-selection .bg li.direct .file-upload.inner-btn .upload {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.card-bg-selection .bg li.direct .file-upload.inner-btn .upload button {
    width: 100%;
    height: 100%;
    padding: 0;
    background: #fff;
    border-radius: 0;
    border: 0;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #ff6636;
}
.card-bg-selection .bg li.direct .file-upload.inner-btn .upload > input {
    top: 0;
    height: 100%;
}

/*  */
.card-bg-selection .bg li:nth-child(3n) {
    margin-right: 0;
}

.card-bg-selection .bg li img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.card-bg-selection .bg span {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    transform: translate(-50%, -50%);
    width: 63px;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #ff6636;
}

/* condolence-money-gift */
.condolence-money-gift {
    padding: 24px 0 16px;
}

.condolence-money-gift .card {
    margin: 0 auto 16px;
    padding: 0 16px;
    border-radius: 4px;
    position: relative;
    width: 100%;
}

.condolence-money-gift .card p {
    /* min-height: 400px; */
    height: auto;
    border-radius: 4px;
    background-color: #ff6636;
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}

.condolence-money-gift .card img + p {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background: none !important;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
    display: flex;
    justify-content: center;
    align-items: center;
}

.condolence-money-gift .card p.type-b {
    background-color: #e1e1e1;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}

.condolence-money-gift ul {
    border-top: 1px solid #d6d6d6;
}

.condolence-money-gift li {
    padding: 16px;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.23;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
    border-bottom: 1px solid #d6d6d6;
}

.condolence-money-gift li.greetings {
    display: flex;
}

.condolence-money-gift li.greetings .tit {
    width: 42px;
}

.condolence-money-gift li.greetings .con {
    width: calc(100% - 42px);
}

.condolence-money-gift .map {
    position: relative;
    margin: 16px;
}

.condolence-money-gift .map .marker {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 44px;
    height: 44px;
    background: url(/image/mobile/icon_marker.png);
    background-size: contain;
}

/* chedule-area */
.chedule-area .top {
    position: relative;
    padding: 24px 0 16px;
    margin: 0 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #000;
}

.chedule-area .top select.input-small {
    min-width: 80px;
    width: 80px;
}

.chedule-area .top .btn-small {
    min-width: 80px;
    width: 80px;
}

.chedule-area .top input.input-small {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);

    min-width: 160px;
    width: 160px;
    padding: 0;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    border: 0;
}

.chedule-area .list {
    padding: 0 16px;
}

.chedule-area .list h1 {
    margin: 16px 0 0;
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #000;
}

.chedule-area .list li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 30px;
    margin: 8px 0 0;
    border-radius: 4px;
    border: solid 1px #d6d6d6;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
    padding: 0 16px;
}

.chedule-area .list .t1 {
    width: 30px;
}

.chedule-area .list .t2 {
    width: 100px;
    text-align: center;
}

.chedule-area .list .t3 {
    width: calc(100% - 130px);
}

/* type-b */
.chedule-area .list.type-b li a {
    display: block;
    padding: 0 8px;
    height: auto;
}

.chedule-area .list.type-b li a > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px;
}

.chedule-area .list.type-b li a > div + div {
    border-top: 1px solid #d6d6d6;
    padding: 2px 8px;
}

.chedule-area .list.type-b li .t3 {
    width: 100%;
    margin: 6px 0;
}

.chedule-area .list .t4 {
    width: 80px;
    text-align: center;
}

.chedule-area .list .t5 {
    width: 50px;
    text-align: center;
}

/* refund-nonmember */
.refund-nonmember {
    padding: 56px 16px 0;
}

.refund-nonmember .step2,
.refund-nonmember .step3 {
    display: none;
}

.refund-nonmember .step2,
.refund-nonmember .step3 {
    margin-top: 32px;
    border-top: 1px solid #a6a6a6;
}

/* refund-member */
.refund-member {
    padding: 32px 16px 0;
}

.refund-member .st1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 16px 16px;
}

.refund-member .st1 .tit {
    color: #565656;
}

.refund-member .st2 {
    border-top: 1px solid #a6a6a6;
    padding: 8px 16px 16px;
}

.refund-member .help-text {
    margin: 16px 0 0;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

.refund-member .st3 {
    border-top: 1px solid #a6a6a6;
    padding: 16px 16px 16px;
}

.refund-member .st3 .btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.refund-member .st3 .btn .btn-medium {
    width: calc((100% - 8px) / 2);
}

.refund-member .st3 .table-type-area > ul > li > .title {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

.refund-member .st3 .table-type-area > ul > li > .con {
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #565656;
}

.refund-member .st3 input[readonly] {
    background: #fff;
    cursor: not-allowed;
    color: #ff6636;
    border: 1px solid #ff6636;
    font-size: 14px;
}

.refund-member .st3 .input-regular.unit-add {
    height: 32px;
    font-size: 14px;
    font-weight: 500;
}

.refund-member .st4 {
    border-top: 1px solid #a6a6a6;
    padding: 24px 16px 16px;
}

.refund-member .st5 {
    border-top: 1px solid #a6a6a6;
    padding: 40px 16px 16px;
}

.refund-member .gallery .img-thumb {
    margin: 8px 0 0;
}

/* mypage-card */
.mypage-card {
    padding: 8px 16px 0;
}

.mypage-card .title {
    margin: 16px 0 0;
    padding-bottom: 15px;
    border-bottom: 1px solid #d6d6d6;
}

.mypage-card .title h1 {
    font-size: 14px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #000;
}

.mypage-card .help-text {
    margin: 0 0 0 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #a6a6a6;
}

.mypage-card .btn-medium.flexible {
    margin: 0 16px 8px;
    width: calc(100% - 32px) !important;
}

/* card-insert */
.card-insert {
    position: relative;
    width: 300px;
    height: 150px;
    border-radius: 8px;
    border: dashed 1px #ff6636;
    background-color: #fff;
    margin: 16px auto;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.card-insert.bankinfo {
    border: solid 3px #ff6636;
}

.card-insert.bankinfo .btn .btn-regular {
    border: 0;
}

.card-insert .card-bank-wrap {
    position: absolute;
    top: -1px;
    left: -1px;
    z-index: 1;
    width: 300px;
    height: 150px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.card-insert button.btn-load {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: 12px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #a6a6a6;
}

.card-insert button.btn-load:before {
    content: "";
    display: block;
    width: 56px;
    height: 56px;
    margin-bottom: 16px;
    background: url(/image/mobile/icon_add.png);
    background-size: contain;
}

.card-insert .card-name {
    font-size: 16px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}

.card-insert .card-number {
    margin: 2px 0 0;
    font-size: 15px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}

.card-insert .btn {
    margin: 16px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.card-insert .btn .btn-regular {
    width: 117px;
}

.card-insert .btn .btn-regular + .btn-regular {
    margin: 0 0 0 16px;
}

/* Lotte-Card */
.card-insert .card-bank-wrap.Lotte-Card {
    background: url(/image/mobile/bg_Lotte-Card.png) 0 0 no-repeat;
    background-size: contain;
}

.card-insert .card-bank-wrap.KBbank {
    background: #ffd232;
}

.btn-floating-cart {
    position: fixed;
    right: 20px;
    bottom: 43px;
    z-index: 1;
    width: 64px;
    height: 64px;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
    border: solid 1px #ff6636;
    background-color: #ff6636;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-floating-cart:before {
    content: "";
    width: 36px;
    height: 36px;
    background: url(/image/mobile/icon_floating_cart.png);
    background-size: contain;
}

/* file-upload.img-wrap */
.file-upload.img-wrap .gallery {
    position: relative;
    width: 100%;
    min-height: 180px;
    border-radius: 4px;
    background-color: #e1e1e1;
    margin: 0 0 16px;
    border: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.file-upload.img-wrap .gallery .img-thumb {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    width: 100%;
    height: auto;
    margin: 0;
    border: 0;
}
.file-upload.img-wrap .gallery span {
    display: block;
    width: 166px;
    height: 32px;
    font-size: 12px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.33;
    letter-spacing: normal;
    text-align: center;
    color: #161616;
}
.file-upload.img-wrap .gallery .delete {
    top: 0;
    left: calc(100% - 32px);
    z-index: 3 !important;
}

/* family-add-list */
.family-add-list .input-btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.family-add-list .input-btn .input-regular {
    width: calc(100% - 96px);
}

.family-add-list .input-btn button {
    width: 88px;
    height: 40px;
}

.family-add-list li {
    display: flex;
    align-items: center;
    margin: 8px 0 0;
}

.family-add-list li:before {
    content: "";
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background-color: #565656;
    margin: 0 8px 0 0;
}

.family-add-list li input {
    min-width: 50px;
    width: 50px;
}

.family-add-list li .btn-del {
    width: 22px;
    height: 22px;
    background: url(/image/component/icon_file_upload_delete.png) no-repeat 0 0;
    background-size: contain;
}

/* delivery-status */
.delivery-status {
    border-top: 1px solid #565656;
    padding: 16px 16px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.delivery-status .date {
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #565656;
}

.delivery-status .status {
    font-size: 15px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

/* btn-cc */
.btn-cc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 19px 0 32px;
}

.btn-cc a {
    width: calc((100% - 16px) / 2);
    height: 38px;
    border-radius: 90px;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 38px;
    letter-spacing: normal;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.btn-cc a:before {
    content: "";
    width: 24px;
    height: 24px;
    margin: 0 10px 0 0;
}

.btn-cc .btn-congratulatory {
    background-color: #ff6636;
    color: #fff;
}

.btn-cc .btn-congratulatory:before {
    background: url(/image/mobile/icon_plus_cw.png);
    background-size: contain;
}

.btn-cc .btn-condolence {
    background-color: #f6f6f6;
    color: #161616;
}

.btn-cc .btn-condolence:before {
    background: url(/image/mobile/icon_plus_cb.png);
    background-size: contain;
}

/* card-change */
.card-change {
    margin: 16px 0 0;
    height: 67px;
    padding: 25px 16px;
    border-radius: 8px;
    border: solid 1px #e9e9e9;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-change .number,
.card-change .bname {
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #161616;
}

.card-change .btn-change {
    font-size: 10px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: right;
    color: #a6a6a6;
    display: flex;
    align-items: center;
}

.card-change .btn-change:after {
    content: "";
    width: 12px;
    height: 12px;
    background: url(/image/mobile/icon_page_move.png);
    background-size: contain;
}

/* general-payment */
.general-payment {
    margin: 16px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.general-payment label {
    width: calc((100% - 8px) / 2);
    height: 40px;
    padding: 10px 0 10px 24px;
    border-radius: 8px;
    border: solid 1px #e9e9e9;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 13px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: left;
    color: #000;
}

.general-payment label input {
    margin: 0 8px 0 0;
}

/* 2023-03-14 */
body.inactive-header #header {
    display: none;
}
body.inactive-header #wrapper,
body.inactive-header #content {
    padding: 0;
}
.onboarding {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: 750px;
    width: 100%;
    height: 100%;
    background-color: #000;
}
.onboarding img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cumulative-number {
    display: none;
    margin: 2px 0 0 6px;
}
.cumulative-number .tit {
    font-size: 10px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.4px;
    text-align: left;
    color: #000;
}
.cumulative-number .con {
    font-size: 10px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: -0.4px;
    text-align: left;
    color: #ff6636;
}
body.active-cumulative-number .cumulative-number {
    display: block;
}

/* 2023-04-10 */
.main-regi-btn-group {
    margin: 16px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
/* .main-regi-btn-group a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: calc((100% - 16px) / 2);
	padding: 3px 30px 8px;
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
	background-color: #f9f9f9;
	border-radius: 8px;
}
.main-regi-btn-group a:first-child {
	background-color: #ec4511;
}
.main-regi-btn-group .img {
	position: relative;
	width: 100%;
	padding-bottom: 100%;
	height: 0;
	overflow: hidden;
}*/
.main-regi-btn-group .img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* .main-regi-btn-group .name {
	margin: -8px 0 0;
	font-size: 14px;
	font-weight: 600;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: normal;
	text-align: center;
	color: #565656;
}
.main-regi-btn-group a:first-child .name {
	color: #fff;
}*/
.main-regi-btn-group a small {
    width: 124px;
    font-size: 10px;
    font-weight: 300;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: center;
    color: #fff;
    transform: scale(0.7);
}
.main-regi-btn-group a:first-child .icon {
    margin: 4px 0 0;
    display: inline-block;
    width: 31px;
    height: 31px;
    background: url(../../image/mobile/icon_mrb_1.png) no-repeat;
    background-size: contain;
}
.main-regi-btn-group .icon {
    margin: 12px 0 0;
    display: inline-block;
    width: 31px;
    height: 31px;
    background: url(../../image/mobile/icon_mrb_2.png) no-repeat;
    background-size: contain;
}
/* 2023-07-25 코드 변경 start */
.main-regi-btn-group a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: calc((100% - 16px) / 2);
    padding: 3px 0 8px;
}
.main-regi-btn-group .img {
    position: relative;
    width: 100%;
    padding-bottom: 100%;
    height: 0;
    overflow: hidden;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
    background-color: #f9f9f9;
    border-radius: 8px;
}
.main-regi-btn-group .name {
    margin: 8px 0 0;
    padding-left: 24px;
    font-size: 15px;
    font-weight: 400;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
    background: url(../../image/mobile/icon_post.png) no-repeat;
    background-size: contain;
}
/* 2023-07-25 코드 변경 end */

/* link2 */
.st2 .link2 > ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.st2 .link2 > ul > li {
    width: calc((100% - 16px) / 2);
}
.st2 .link2 .img {
    position: relative;
    width: 100%;
    padding-bottom: 100%;
    height: 0;
    overflow: hidden;
}
.st2 .link2 .img img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.st2 .link2 .name {
    margin: 8px 0 0;
    font-size: 15px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    text-align: center;
    color: #565656;
    display: flex;
    justify-content: center;
    align-items: center;
}
.st2 .link2 .name:before {
    content: "";
    width: 20px;
    height: 20px;
    background: url(../../image/mobile/icon_post.png) no-repeat;
    background-size: contain;
    margin: 0 8px 0 0;
}

/* 2023-04-14 */
.family-add-list li input {
    width: auto;
}
.family-add-list li .btn-del {
    margin: 0 4px 0 0;
}
.family-add-list li:before {
    display: none;
}
.chedule-area .list .t1 {
    width: 40px;
}
.chedule-area .list .t3 {
    position: relative;
    width: calc(100% - 140px);
    padding-right: 48px;
}
.chedule-area .list li a {
    padding: 0 6px 0 16px;
}
.chedule-area .list .t3 .btn-delete {
    position: absolute;
    top: 0;
    right: 0;
    min-width: auto;
    width: 40px;
    height: 18px;
    line-height: 16px;
    font-size: 10px;
    padding: 0;
}

/* 2023-05-09 */
.card-insert {
    border: solid 3px #ff6636;
    border-radius: 8px;
    margin: 16px auto 8px;
}
.card-insert .card-bank-wrap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.card-insert .card-bank-wrap.Lotte-Card,
.card-insert .card-bank-wrap.KBbank {
    background: #fff;
}
.card-insert .card-bank-wrap .btn-regular {
    border: 0;
    font-size: 13px;
}
.card-insert + .help-text {
    width: 300px;
    margin: 8px auto 0;
}

/* 2023-07-17 */
.bankinfo-add {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.bankinfo-add .input-regular.n11 {
    width: calc(100% - 98px);
}
.bankinfo-add > button {
    width: 88px;
    height: 40px;
    margin: 0 0 0 8px;
}
.bankinfo-add li {
    display: flex;
    align-items: center;
    margin: 8px 0 0;
}
.bankinfo-add li input {
    min-width: 50px;
    width: 50px;
}
.bankinfo-add li .btn-del {
    width: 22px;
    height: 22px;
    background: url(../../image/component/icon_file_upload_delete.png) no-repeat 0 0;
    background-size: contain;
    margin: 0 4px 0 0;
}


/* 2023-08-30 */
.title-btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 16px;
}
ul + .title-btn {
  padding-top: 8px;
}
.title-btn.center {
  justify-content: center;
}
.title-btn .title {
  color: var(--colors-gray-scale-100, #161616);
  text-align: center;
  font-family: Pretendard;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px; /* 80% */
}
.choose-card-bg .card {
  position: relative;
  width: 100%;
  padding-bottom: 54.87%;
  height: 0;
  overflow: hidden;
}
.choose-card-bg .card img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.step-insert {
  display: none;
}
.step-insert.active {
  display: block;
}


/* 2023-08-31 추가 */
.condolence-money-gift .card p {
	font-size: 16px !important;
	text-shadow: -1px 0px #fff, 0px 1px #fff, 1px 0px #fff, 0px -1px #fff !important;
}


/* 2023-09-12 */
.help-text.red {
	color: #ff6636;
}
.file-upload-required {
	font-size: 12px;
}

/* 2023-09-15 */
.main-index > a {
  display: block;
  position: relative;
  width: 100%;
  padding-bottom: 25.55%;
  height: 0;
  overflow: hidden;
}
.main-index > a img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 1px solid #d6d6d6;
  border-radius: 4px;
}


/* 2023-09-20 */
.main-regi-btn-group .img {
	padding-bottom: 70%;
}
.main-regi-btn-group .name {
	padding-left: 0;
	color: #565656;
	background: none;
}