@charset "utf-8";
/* * {-webkit-font-smoothing: antialiased;} */
/* title */
.pretendard { font-family: 'Pretendard'; }
.T1  { font-size: 40px !important; font-weight: 700 !important; }
.T1a { font-size: 32px !important; font-weight: 400 !important; }
.T2  { font-size: 24px !important; font-weight: 700 !important; }
.T3  { font-size: 20px !important; font-weight: 700 !important; }
.T4  { font-size: 18px !important; font-weight: 700 !important; }
.ST1 { font-size: 18px !important; font-weight: 400 !important; }
.C1  { font-size: 17px !important; font-weight: 500 !important; }
.C2  { font-size: 13px !important; font-weight: 500 !important; }
.bb1 { font-size: 17px !important; font-weight: 700 !important;}
.bb2 { font-size: 15px !important; font-weight: 700 !important;  }
.bb3 { font-size: 14px !important; font-weight: 700 !important; }
.bb4 { font-size: 13px !important; font-weight: 700 !important; }
.bb5 { font-size: 12px !important; font-weight: 700 !important; }
.b1  { font-size: 17px !important; font-weight: 400 ;  }
.b2  { font-size: 15px !important; font-weight: 400 ;  }
.b3  { font-size: 14px !important; font-weight: 400 ; }
.b4  { font-size: 13px !important; font-weight: 400 ;  }
.b5  { font-size: 12px !important; font-weight: 400 ;  }
.tg1 { font-size: 14px !important; font-weight: 700 !important;  }
.tg2 { font-size: 13px !important;  }
.MT1 { font-size: 20px !important; font-weight: 700 !important; }
.P1  { font-size: 20px !important; font-weight: 700 !important; }
.P2  { font-size: 32px !important; font-weight: 700 !important; }
.N1  { font-size: 16px !important; font-weight: 700 !important;  }
.N2  { font-size: 15px !important; font-weight: 400 !important; }
.V1  { font-size: 11px !important; font-weight: 500 !important; }
.g1 { font-size: 20px !important; font-weight: 500 !important; }
.o1 { font-size: 14px !important; font-weight: 400 !important;  }
.m_block {display: none !important; }
@media(max-width: 992px) {
    .T1  { font-size: 24px !important;  }
    .T1a { font-size: 22px !important; }
    .T2  { font-size: 20px !important; }
    .T3  { font-size: 16px !important;  }
    .T4  { font-size: 16px !important; }
    .ST1 { font-size: 13px !important; }
    .C1  { font-size: 20px !important; }
    .C2  { font-size: 16px !important; }
    .bb1 { font-size: 15px !important; }
    .bb2 { font-size: 14px !important; }
    .bb3 { font-size: 13px !important; }
    .bb4 { font-size: 12px !important; }
    .bb5 { font-size: 11px !important; }
    .b1  { font-size: 15px !important; }
    .b2  { font-size: 14px !important; }
    .b3  { font-size: 13px !important; }
    .b4  { font-size: 12px !important; }
    .b5  { font-size: 12px !important; }
    .tg1 { font-size: 13px !important; }
    .tg2 { font-size: 11px !important; }
    .MT1 { font-size: 16px !important; }
    .P1  { font-size: 16px !important; }
    .P2  { font-size: 28px !important; }
    .N1  { font-size: 15px !important; }
    .N2  { font-size: 14px !important; }
    .g1 { font-size: 18px !important; }
    .m_block {display: block !important;}
    .m_none { display: none !important; }
}
.page-title { padding: 35px 0 25px 0; }
.page-title > .T1 { }
.page-title > .ST1 { display: inline-block; margin-left: 10px; color: var(--colorgray); }
@media(max-width: 992px) {
    .page-title { padding: 25px 0 15px 20px; }
    .page-title > .T1 { }
    .page-title > .ST1 { }
}
/* mshop list default */
#list-top-wrapper { }
.top-wrap-inner { display: flex; height: 50px; }
.top-wrap-inner .top-left  { position: relative; display: flex; flex: 1 1 auto; align-self: center; }
.top-wrap-inner .top-right { margin-left: auto; flex: 0 0 auto; display: flex; padding-right: 10px; display: none !important; }
.top-wrap-inner .top-right > div:not(:last-child) { margin-right: 10px; }
.top-wrap-inner .top-left > .total-count { align-self: center; }
.top-wrap-inner .top-left > .total-count b {margin-left: 2px;}
.top-wrap-inner .top-left > .icon-list-type { display: none; }
@media(max-width: 768px) {
    .top-wrap-inner .top-left > .total-count { align-self: center; }
    .top-wrap-inner .top-left > .icon-list-type { display: flex; align-items: center; margin-left: auto; }
    .top-wrap-inner .top-left > .icon-list-type > a { display: inline-block; }
    .top-wrap-inner .top-left > .icon-list-type > a + a { margin-left: 15px; }
    .top-wrap-inner .top-left > .icon-list-type > a svg { }
    .top-wrap-inner .top-left > .icon-list-type > a svg rect { fill: #b4b4b4; }
    .top-wrap-inner .top-left > .icon-list-type > a.on svg rect { fill: #131313; }
}
.top-layer-box { position: relative; width: auto; min-width: 160px; display: flex; margin-top: 10px; }
.top-layer-box.top-layer-bill { width: 310px; }
.layer-select-box { position: relative; width: 100%; }
.layer-select-box > ul { position: relative;  width: 100%; height: 40px; border: 1px solid #ededed; border-radius: 8px; background-color: #fff; z-index: 10; color: #3b3b3b; overflow: hidden; }
.layer-select-box > ul:hover {  }
.layer-select-box > ul.open { overflow-y: auto; height: auto; max-height: 360px; background-color: #fff; border: 1px solid #EDEDED; }
.layer-select-box > ul.open::-webkit-scrollbar{ width: 0px; box-sizing: border-box; }
.layer-select-box > ul.open::-webkit-scrollbar-thumb{ width: 0px; box-sizing: border-box; border-radius: 0; }
.layer-select-box > ul.open::-webkit-scrollbar-track{}
.layer-select-box > ul.open > li:first-child {  }
.layer-select-box > ul > li { display: none; padding: 0 55px 0 20px; width: 100%; cursor: pointer; height: 38px; line-height: 38px; white-space: nowrap; }
.layer-select-box > ul > li.open { display: block; }
.layer-select-box > ul > li.open:not(:first-child):hover { color: var(--fontaccent); }
.layer-select-box > ul > li span { line-height: 38px; }
.layer-select-box > .select-open { position: absolute; top: 0; right: 0; bottom: 0; background-color: transparent; width: 30px; height: 38px; z-index: 10; }
.layer-select-box > .select-open.open { z-index: 21; }
.layer-select-box > ul.open + button svg { transform: rotate(180deg); }
#list-container-wrap { position: relative; width: 100%; display: flex; }
.item-list-container { position: relative; flex: 1 1 auto; max-width: 100%; }
.list-container-top { margin: 55px 0 15px; }
.list-filter-multi { position: relative; width: 100%; display: flex; }
.list-filter-multi > .page-row-title { flex: 0 0 auto; margin-right: 25px; color: #000; font-weight: 600; align-self: center; margin-bottom: 35px; }
.list-filter-multi > .multi-filter { flex: 1 1 auto; display: flex; flex-wrap: wrap; margin-bottom: 35px; }
.list-filter-multi > .multi-filter > li { margin-right: 7px; }
.list-filter-multi > .multi-filter > li:last-child { margin-right: 0; }
.list-filter-multi > .multi-filter > li > a { display: inline-block; padding: 6px 16px; min-width: 90px; border: 1px solid #ddd; border-radius: 25px; text-align: center; color: #ababab; font-size: 15px; }
.list-filter-multi > .multi-filter > li > a.active {  color: #000; }
.list-filter-sort { position: relative; width: 100%; display: flex; }
.list-filter-sort > .list-title { flex: 0 0 auto; }
.list-filter-sort > .list-title > p { font-weight: 600; font-size: 24px; line-height: 1; }
.list-filter-sort > .list-title > span { font-size: 13px; color: #5d5d5d; }
.list-filter-sort > .sort-item-row { flex: 0 0 auto; margin-left: auto; align-self: flex-end; padding-bottom: 3px; }
.list-filter-sort > .sort-item-row > ul { display: flex; }
.list-filter-sort > .sort-item-row > ul > li { display: flex; }
.list-filter-sort > .sort-item-row > ul > li:not(:last-child):after { display: inline-block; content: ''; width: 1px; height: 12px; background-color: #5d5d5d; margin: 0 8px; align-self: center; }
.list-filter-sort > .sort-item-row > ul > li > a { display: inline-block; font-size: 14px; }
.list-filter-sort > .sort-item-row > ul > li > a.active { color: #000; }
.list-filter-sort > .total-count { flex: 0 0 auto; margin-left: 10px; align-self: flex-end; padding-bottom: 3px; font-size: 14px; }
.list-filter-sort > .total-count > span { }
.list-filter-sort > .total-count > span > b { display: inline-block; padding: 0 1px 0 2px; color: #dc3545; }
/* item-list */
#item-list-wrapper { width: 100%; min-height: 460px; margin-bottom: 100px; }
#list-wrapper {margin-bottom: 100px;}
.search-item-list { position: relative; width: 100%; max-width: 100%; display: flex; flex-wrap: wrap; margin: 0; }
.search-item-list.swiper-wrapper { flex-wrap: nowrap; }
.search-item-list > .item-list { position: relative; padding: 0 14px; margin-bottom: 60px; }
.search-item-list.swiper-wrapper > .item-list { } /*메인 하단 swiper 크기는 여기 말고 다른 파일에서 수정할것, 전체적으로 다 영향받음*/
.item-list > .goods-box { position: relative; display: block; background-color: #fff; text-align: center;  }
.item-list > .goods-box > .list-image { padding: 50px 20px 28px; border-radius: 16px; background-color: #f8f8f8; }
.item-list > .goods-box > .list-image img { width: 100%; }
.item-list > .goods-box > .list-image .item-color { margin: 0 auto; display: flex; justify-content: center; }
.item-list > .goods-box > .list-item { margin-top: 24px; }
.item-list > .goods-box > .list-item > .list-tags { margin-bottom: 8px; /* height: 21px; */ display: flex; justify-content: center; }
.item-list > .goods-box > .list-item > .list-tags > .tag { color: #E51E20; position: relative; }
.item-list > .goods-box > .list-item > .list-tags > .tag:before { content: '#'; }
.item-list > .goods-box > .list-item > .list-tags > .tag:not(:first-child) { margin-left: 5px; }
.item-list > .goods-box > .list-item > .list-name { }
.item-list > .goods-box > .list-item > .list-exp { margin-top: 5px; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;color: #b4b4b4; display: none; }
.item-list > .goods-box > .list-item > .list-exp > span { color: #b4b4b4;}
.item-list > .goods-box > .list-item > .list-price { margin-top: 6px; }
.item-list > .goods-box > .list-item > .list-price > p { display: flex; justify-content: center; }
.item-list > .goods-box > .list-item > .list-price > p > b { flex: 0 0 50px; max-width: 50px; align-self: center; }
.item-list > .goods-box > .list-item > .list-price > p > span { display: inline-block; }
.item-list > .goods-box > .list-item > .list-price > .model_price { align-self: center; color: #B4B4B4; }
.item-list > .goods-box > .list-item > .list-price > .model_price .strike { position: relative; display: inline-block; }
.item-list > .goods-box > .list-item > .list-price > .model_price .strike:after { position: absolute; content: ''; left: 3px; right: 0; top: 50%; width: calc( 100% - 3px ); height: 1px; background: #B4B4B4; }
.item-list > .goods-box > .list-item > .list-price > .sale_price { margin-top: 3px; }
.item-list > .goods-box > .list-item .discount-price .discount_amount { margin: 6px 0 12px; display: inline-flex; align-items: center; padding: 3px; padding-right: 4px; background-color: var(--accent); border-radius: 2px;}
.item-list > .goods-box > .list-item .discount-price .discount_amount .dis_price { background-color: #fff; border-radius: 1px; padding: 0 3px; }
.item-list > .goods-box > .list-item .discount-price .discount_amount .dis_txt { color: #fff; margin-left: 3px; }
.item-list > .goods-box .item-icon-wrap { top: 28px; left: 50%; transform: translateX(-50%); justify-content: center; }
/* .mypage .item-list.list-style1 > .goods-box,
.item-list.list-style2 > .goods-box { border: 1px solid #ededed; border-radius: 8px; } */
.list-empty { flex: 1 1 100%; max-width: 100%; padding: 50px; text-align: center; }
#item-list-more { display: none; width: 100%; text-align: center; margin: 35px 0; border: 1px solid #ddd; line-height: 45px; border-radius: 8px; }
#item-list-more > span { display: inline-block; margin-right: 3px; cursor: pointer; font-size: 15px; }
#item-list-more > span img { width: 50%; }
/* .item-icon-wrap { top: 0; left: 5px; } */
@media (max-width: 768px) {
    #item-list-wrapper  {margin-bottom: 50px;}
    .mypage #item-list-wrapper  {margin-bottom: 0;}
    #list-wrapper { /*margin-bottom: 50px;*/ margin-bottom: 0; }
    #list-top-wrapper { background: transparent; }
    .top-wrap-inner { display: flex; flex-wrap: wrap; min-height: 60px; height: auto; }
    .top-wrap-inner .top-left  { flex: 1 1 100%; max-width: 100%; justify-content: space-between; flex-wrap: wrap; padding: 0 20px;  }
    .top-wrap-inner .top-right { flex: 1 1 100%; max-width: 100%; display: flex; margin: 0; margin-top: 12px; padding: 0; }
    .top-wrap-inner .top-right > div:not(:last-child) { margin: 0px; }
    .top-wrap-inner .top-right * { box-sizing: border-box; }
    .top-layer-box { margin: 0; flex: 1 1 30%; max-width: 30%; }
    .top-layer-box.top-layer-bill { width: 70%; max-width: 70%; }
    .layer-select-box > ul { border-radius: 0; border-left-color: transparent; }
    .layer-select-box > ul.open { position: absolute; top: 0; right: 0; left: 0; z-index: 20; max-height: 360px; overflow-y: auto; }
    .layer-select-box > ul > li.open:not(:first-child):hover { background-color: #fff; color: #3b3b3b; }
    .top-layer-box.top-layer-bill .layer-select-box > ul { border-right-color: transparent; }
    .top-layer-box.top-layer-bill .layer-select-box > ul.open { border-left: 1px solid #EDEDED; }
    .item-list-container { margin: 0; }
    .list-container-top { padding: 0; margin: 40px 0 0 0; }
    .list-filter-multi { position: relative; width: 100%; display: block; }
    .list-filter-multi > .page-row-title { display: block; order: 0; margin-bottom: 15px; }
    .list-filter-multi > .multi-filter { display: flex; flex-wrap: nowrap; width: 100%; overflow-x: auto; margin-bottom: 15px; }
    .list-filter-multi > .multi-filter > li { padding: 4px 0 12px 0; }
    .list-filter-multi > .multi-filter > li > a { padding: 4px 8px; font-size: 12px; white-space: nowrap; }
    .list-filter-sort { flex-wrap: wrap; margin-bottom: 10px; }
    .list-filter-sort > .list-title { flex: 1 1 100%; margin-bottom: 10px; }
    .list-filter-sort > .list-title > p { font-size: 19px; }
    .list-filter-sort > .list-title > span { font-size: 12px; }
    .list-filter-sort > .sort-item-row { margin-left: auto; order: 3; align-self: center; }
    .list-filter-sort > .sort-item-row > ul { }
    .list-filter-sort > .sort-item-row > ul > li { }
    .list-filter-sort > .sort-item-row > ul > li > a { font-size: 13px; letter-spacing: -1px; }
    .list-filter-sort > .total-count { order: 1; margin-left: 0; font-size: 14px; align-self: center; padding: 0;  }
    .search-item-list { position: relative; width: 100%; display: flex; flex-wrap: wrap; margin: 0; padding: 0 3px; }
    .search-item-list.swiper-wrapper { flex-wrap: nowrap; }
    .search-item-list .item-list {  }
    .search-item-list.swiper-wrapper > .item-list { padding: 0 10px;}
    .item-list > .goods-box { position: relative; display: block; height: 100%; }
    .item-list > .goods-box > .list-image { padding: 33px 6px 15px; }
    .item-list > .goods-box > .list-image img { }
    .item-list > .goods-box > .list-image .item-color { position: relative; top: -2px; }
    .item-list > .goods-box > .list-item { margin-top: 15px; }
    .item-list > .goods-box > .list-item > .list-tags { height: auto; }
    .item-list > .goods-box > .list-item > .list-tags > .tag { margin-bottom: 5px; }
    .item-list > .goods-box > .list-item > .list-tags > .tag:before { }
    .item-list > .goods-box > .list-item > .list-tags > .tag:not(:first-child) { }
    .item-list > .goods-box > .list-item { }
    .item-list > .goods-box > .list-item > .list-name { }
    .item-list > .goods-box > .list-item > .list-exp { }
    .item-list > .goods-box > .list-item > .list-exp > span { color: #b4b4b4; }
    .item-list > .goods-box > .list-item > .list-price { margin-top: 7px; }
    .item-list > .goods-box > .list-item > .list-price > p { display: flex; }
    .item-list > .goods-box > .list-item > .list-price > p > b {  }
    .item-list > .goods-box > .list-item > .list-price > p > span { }
    .item-list > .goods-box > .list-item > .list-price > .model_price { margin-bottom: 0; }
    .item-list > .goods-box > .list-item > .list-price > .model_price .strike { }
    .item-list > .goods-box .item-icon-wrap { top: 15px; }
    /* item-rows */
    .search-item-list.rows { margin: 0; padding: 0; }
    .search-item-list > .item-list { flex: 1 1 100% !important; max-width: 100% !important; padding: 0; margin-bottom: 0; }
    .mypage .search-item-list > .item-list.list-style1 > .goods-box { border-radius: 0; border: none; display: flex;}
    .search-item-list > .item-list.list-style2 > .goods-box { border-radius: 0; border-top: none; border-left: none; border-right: none; display: flex; }
    .search-item-list > .item-list.list-style2:not(:first-child) > .goods-box { }
    .mypage .search-item-list > .item-list.list-style1 > .goods-box > .list-image { flex: 1 1 30%; max-width: 30%; }
    .search-item-list > .item-list.list-style2 > .goods-box > .list-image { flex: 1 1 160px; max-width: 160px; padding: 40px 0 18px; position: relative; }
    .mypage .search-item-list > .item-list.list-style1 > .goods-box > .list-item { flex: 1 1 70%; max-width: 70%; padding-left: 15px; display: flex; flex-direction: column; justify-content: center; }
    .search-item-list > .item-list.list-style2 > .goods-box > .list-item { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: center; }
    .search-item-list.rows > .item-list.list-style2 > .goods-box > .list-item { padding-left: 15px; }
    /* item-album */
    .search-item-list.album { margin: 0; padding: 0; }
    .search-item-list.album > .item-list { flex: 0 0 50%!important; max-width: 50%!important; position: relative; padding: 0 4px; margin-bottom: 15px; }
    .search-item-list.album > .item-list.list-style2 > .goods-box { border-radius: 0; border-top: none; border-left: none; border-right: none; display: block; }
    .search-item-list.album > .item-list.list-style2:not(:first-child) > .goods-box { }
    .search-item-list.album > .item-list.list-style2 > .goods-box > .list-image { flex: 1 1 100%; max-width: 100%; }
    .search-item-list.album > .item-list.list-style2 > .goods-box > .list-item { flex: 1 1 100%; max-width: 100%; padding-left: 0; }
    .search-item-list.album > .item-list.list-style2 > .goods-box > .list-item > .list-tags { margin-top: 8px;}

    #item-list-more { display: none; width: auto; text-align: center; margin: 25px 7px 35px 7px; border: 1px solid #ddd; line-height: 45px; border-radius: 8px; }
}
/* color bg */
.item-color { }
.color-bg { width: 14px; height: 14px; display: inline-block; border-radius: 50%; margin-right: 6px; border: none!important; }
.color-bg:last-child { margin-right: 0; }

@media (max-width: 768px) {
    .color-bg { width: 12px; height: 12px; margin-right: 4px; }
}

/* review */
.list-review-box { border-top: 2px solid #131313; margin-bottom: 100px; }
.article-desc1 { position: relative; display: block; border-bottom: 1px solid #131313; padding: 15px 0 0 0; }
.article-desc1 .article-list { display: flex; padding-bottom: 15px; }
.article-desc1 .article-list * { cursor: pointer; }
.article-desc1 .article-list > .article-image { flex: 0 0 100px; max-width: 100px; padding: 0 10px; }
.article-desc1 .article-list > .article-image img { width: 100%; height: auto; }
.article-desc1 .article-list > .article-subject { align-self: center; flex: 1 1 auto; max-width: calc( 100% - 260px ); padding: 0 15px; }
.article-desc1 .article-list > .article-subject > .star { cursor: pointer; }
.article-desc1 .article-list > .article-subject > .star .star_div:not(:first-child) { margin-left: 3px; }
.article-desc1 .article-list > .article-subject > .star .star_wrap .star_div:before,
.article-desc1 .article-list > .article-subject > .star .star_wrap .star_div:after { font-size: 16px; }
.article-desc1 .article-list > .article-subject > p { padding: 10px 0 15px 0; cursor: pointer; }
.article-desc1 .article-list > .article-subject > span { color: #b4b4b4; }
.article-desc1 .article-list > .article-name { flex: 0 0 60px; max-width: 60px; align-self: center; text-align: center; color: #b4b4b4; }
.article-desc1 .article-list > .article-date { flex: 0 0 100px; max-width: 100px; align-self: center; text-align: center; color: #b4b4b4; }
.article-desc1 > .article-content { padding: 22px; background-color: #fafafa; border-top: 1px solid #EDEDED; }
.article-desc1 > .article-content img { width: auto; max-width: 100%; height: auto; }
.article-desc1 > .article-content * { font-family: 'Pretendard'!important; font-size: 14px!important; line-height: 1.4!important; }
@media(max-width: 768px) {
    .article-desc1 > .article-content * { font-size: 13px!important; }
}
/* 상세 - 리뷰 */
.content-box .item-use-wrapper { border-top: 1px solid #EDEDED;}
.content-box .article-desc1 { border-color: #EDEDED; }
@media(max-width: 768px) {
    .list-review-box { margin-bottom: 0; }
    .article-desc1 { position: relative; display: block; border-bottom: 1px solid #131313; padding: 15px 0 0 0; }
    .article-desc1 > .article-content { padding: 20px; }
    .article-desc1 > .article-content p { font-size: 12px; }
    .article-desc1 .article-list {padding-left: 20px; }
    .article-desc1 .article-list > .article-image { flex: 0 0 70px; max-width: 70px; padding: 0 0; }
    .article-desc1 .article-list > .article-image img { width: 100%; height: auto; }
    .article-desc1 .article-list > .article-subject { align-self: center; flex: 1 1 auto; max-width: calc( 100% - 200px ); padding: 0 10px; }
    .article-desc1 .article-list > .article-subject > .star { }
    .article-desc1 .article-list > .article-subject > .star .star_div:not(:first-child) { margin-left: 3px; }
    .article-desc1 .article-list > .article-subject > .star .star_wrap .star_div:before,
    .article-desc1 .article-list > .article-subject > .star .star_wrap .star_div:after { font-size: 14px; }
    .article-desc1 .article-list > .article-subject > p { padding: 7px 0 15px 0; }
    .article-desc1 .article-list > .article-subject > span { color: #b4b4b4; }
    .article-desc1 .article-list > .article-name { flex: 0 0 50px; max-width: 50px; }
    .article-desc1 .article-list > .article-date { flex: 0 0 80px; max-width: 80px; text-align: left;}
}

.myModal.view-content { }
.myModal.view-content .myModal-dialog { max-width: 760px; height: auto; border-radius: 0; }
.myModal.view-content .myModal-dialog { height: auto; }
.myModal.view-content .myModal-dialog .myModal-content { border: none; border-radius: 0; }
.myModal.view-content .myModal-dialog .myModal-content .myModal-header { background: var(--primary); border-radius: 0; padding: 0; }
.myModal.view-content .myModal-dialog .myModal-content .myModal-header .header-title { color: #fff; padding-left: 10px; letter-spacing: -1px; font-size: 1.25rem; }
.myModal.view-content .content-view-wrap { }
.myModal.view-content .content-view-wrap h2 { padding-bottom: 8px; border-bottom: 1px solid #ddd; margin-bottom: 12px; }
.myModal.view-content .content-view-wrap .content-view-head { display: flex; }
.myModal.view-content .content-view-wrap .content-view-head > div { margin-left: 12px; }
.myModal.view-content .content-view-wrap .content-view-head > div.score { margin-left: auto; align-self: center; }
.myModal.view-content .content-view-wrap .content-view-body { margin-top: 10px; border: 1px solid #ddd; padding: 25px; min-height: 460px; }
.myModal.view-content .content-view-wrap .content-view-body img { width: 100%; height: auto; }

/* foot board */
.foot-board-wrapper { position: relative; display: flex; }
.foot-board-wrapper > div { flex: 0 0 50%; max-width: 50%; height: 66px; display: inline-flex; align-items: center; }
.foot-board-wrapper > div > div { width: calc( var(--maxwidth) / 2 ); display: flex; }
.foot-board-wrapper > div.foot-notice { background-color: var(--accent); }
.foot-board-wrapper > div.foot-notice > .ft-notice-list { margin-left: auto; }
.foot-board-wrapper > div.foot-faq { background-color: #414141; }
.foot-board-wrapper > div > div > h5 { color: var(--colorwhite); flex: 0 0 90px; align-self: center; }
.foot-board-wrapper > div > div > h5 a { color: var(--colorwhite); }
.foot-board-wrapper > div > div > ul { align-self: center; flex: 1 1 auto; }
.foot-board-wrapper > div > div > a { flex: 0 0 auto; display: flex; align-items: center; }
.foot-board-wrapper > div > div.ft-faq-list > h5 { text-align: center; }
.ft-notice-list > a { padding-right: 28px; }
ul.board-roll { position: relative; overflow: hidden; height: 19px; }
ul.board-roll > li { position: absolute; height: 19px; width: 100%; }
ul.board-roll > li > a { display: block; line-height: 18px; color: var(--colorwhite); /*display: -webkit-box; text-decoration: none; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;*/ width: calc(100% - 10px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 
ul.board-roll > li.current { top: 0px; transition: top 2s ease; }
ul.board-roll > li.prev { top: -24px; transition: top 2s ease; }
ul.board-roll > li.next { top: 24px; }


.foot-board-wrapper > div.foot-notice > *,
.foot-board-wrapper > div.foot-faq > *,
.foot-board-wrapper > div > div > h5,
.foot-board-wrapper > div > div > h5 a { height: 100%; }
.foot-board-wrapper > div > div > h5 a { display: flex; align-items: center; }
.foot-board-wrapper > div.foot-faq > div > h5 a { padding-left: 28px;}

ul.board-roll2 { position: relative; overflow: hidden; height: 19px; } 
ul.board-roll2 > li { position: absolute; height: 19px; width: 100%; } 
ul.board-roll2 > li > a { display: block; line-height: 18px; color: var(--colorwhite); /*display: -webkit-box; text-decoration: none; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;*/ width: calc(100% - 10px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 
ul.board-roll2 > li.current2 { top: 0px; transition: top 2s ease; } 
ul.board-roll2 > li.prev2 { top: -24px; transition: top 2s ease; } 
ul.board-roll2 > li.next2 { top: 24px; }

@media(max-width: 768px) {
    .foot-board-wrapper { flex-wrap: wrap; }
    .foot-board-wrapper > div { flex: 1 1 100%; max-width: 100%; padding: 0 22px; }
    .foot-board-wrapper > div > div { width: 100%; }
    .foot-board-wrapper > div > div > h5 { flex: 0 0 80px; text-align: left; }
    .foot-board-wrapper > div > div.ft-faq-list > h5 { text-align: left; }
    .ft-notice-list > a { padding-right: 0; }
    .foot-board-wrapper > div.foot-faq > div > h5 a { padding-left: 0;}
}




/* 이벤트 */
#template8 .item-list-box {
    border-radius: 12px;
    overflow: hidden;
}


/* 상시배너 */
#template10 .max-layout {
    width: 100%;
    max-width: 1200px !important;
}

#template10 .item-list-box {
    border-radius: 12px;
    overflow: hidden;
}

#template10 .list-item-image img {
    width: 100% !important;
}


#template14 + #page-wrap {
    padding-top: 0;
}

/* 메인 - 지금 인기 많은 제품*/
#template2 .search-item-list > .item-list { margin-bottom: 0; }
.item-list > .goods-box > .list-item > .list-telecom { display: flex; align-items: center; justify-content: center; margin-top: 15px; }
.item-list > .goods-box > .list-item > .list-telecom div { width: 28px; height: 28px; border: 1px solid #EDEDED; border-radius: 4px; display:flex; align-items: center; justify-content: center; margin: 0 2px; }
.item-list > .goods-box > .list-item > .list-telecom div img { max-width: 16px; max-height: 11px; }

/* 상품 리스트 페이지 */
#item-list-wrapper .search-item-list .item-list { cursor: pointer;}


@media(max-width: 768px) {
    .item-list > .goods-box > .list-item > .list-telecom div { width: 26px; height: 26px; }

    /* 베스트상품 */
    #template2 .search-item-list > .item-list.list-style2,
    #template11 .search-item-list > .item-list.list-style2 { flex: 0 0 50% !important; max-width: 50% !important; padding: 0 10px; }

    #template2 .search-item-list > .item-list.list-style2 > .goods-box,
    #template11 .search-item-list > .item-list.list-style2 > .goods-box,
    #template15 .search-item-list > .item-list.list-style2 > .goods-box,
    #template17 .search-item-list > .item-list.list-style2 > .goods-box,
    #template19 .search-item-list > .item-list.list-style2 > .goods-box { display: block; }

    #template2 .search-item-list > .item-list.list-style2 > .goods-box > .list-image,
    #template11 .search-item-list > .item-list.list-style2 > .goods-box > .list-image,
    #template15 .search-item-list > .item-list.list-style2 > .goods-box > .list-image,
    #template17 .search-item-list > .item-list.list-style2 > .goods-box > .list-image,
    #template19 .search-item-list > .item-list.list-style2 > .goods-box > .list-image { flex: 1 1 180px; max-width: 100%; }


    #template2 .search-item-list,
    #template8 .search-item-list,
    #template11 .search-item-list,
    #template15 .search-item-list,
    #template17 .search-item-list,
    #template19 .search-item-list,
    #template13 .search-item-list {
        padding: 0;
    }

    #template2 .item-list,
    #template11 .search-item-list.swiper-wrapper > .item-list,
    #template15 .search-item-list.swiper-wrapper > .item-list,
    #template17 .search-item-list.swiper-wrapper > .item-list,
    #template19 .search-item-list.swiper-wrapper > .item-list {
        flex: 0 0 50% !important;
    }

    #template2 .item-list > .goods-box > .list-item > .list-tags,
    #template11 .item-list > .goods-box > .list-item > .list-tags,
    #template15 .item-list > .goods-box > .list-item > .list-tags,
    #template17 .item-list > .goods-box > .list-item > .list-tags,
    #template19 .item-list > .goods-box > .list-item > .list-tags {
        margin-top: 8px;
    }

    #template13 .search-item-list > .item-list { flex: 0 0 auto !important; }

    /* 추천상품 */
    #template5 .search-item-list {
        padding: 0;
    }

    #template5 .search-item-list .item-list {
        padding: 0;
        margin-bottom: 0;
    }

    #template5 .search-item-list .item-list:nth-child(odd) { }

    #template5 .item-list.list-style2 > .goods-box {
        border-radius: 0;
        border: none;
    }

    #template5 .search-item-list > .item-list { margin-bottom: 20px !important; padding: 0 20px; }

    #template5 .search-item-list > .item-list.list-style2 > .goods-box > .list-item { padding-left: 15px; }
    

    /* 추천상품 버튼 클릭에 따른 여백 잡기 */
    #template2 .search-item-list.album > .item-list,
    #template8 .search-item-list.album > .item-list {
        margin-bottom: 0;
    }

    #template2 .search-item-list.album > .item-list {
        padding: 0 5px;
    }

    /* 상시배너 */
    #template10 .max-layout {
        width: 100%;
    }

    #template10 .item-list-box {
        border-radius: 0;
    }

    

    /* 구매후기 */
    #template7 .item-title .title-more,
    #template22 .item-title .title-more {
        display: none;
    }

    /* 상품리스트페이지 */
    #item-list-wrapper .search-item-list {
        padding: 0;
    }

    #item-list-wrapper .search-item-list .item-list {
        padding: 0 20px;
        margin-bottom: 20px;
    }

    #item-list-wrapper .search-item-list.album {
        padding: 0 10px;
    }

    #item-list-wrapper .search-item-list.album .item-list {
        padding: 0 10px;
    }

    #item-list-wrapper .item-list.list-style2 > .goods-box {
        border-radius: 0;
        border: none;
    }

}


@media(max-width: 499px) {
    #template2 .search-item-list > .item-list.list-style2,
    #template11 .search-item-list > .item-list.list-style2,
    #template2 .item-list,
    #template11 .search-item-list.swiper-wrapper > .item-list,
    #template15 .search-item-list.swiper-wrapper > .item-list,
    #template17 .search-item-list.swiper-wrapper > .item-list,
    #template19 .search-item-list.swiper-wrapper > .item-list {
        flex: 0 0 auto !important;
        max-width: 499px !important;
    }
}


/* 게시글 공유 */
.share_area { position: absolute; right: 0; top: 0;}
.btn_share { width: 48px; height: 48px; border-radius: 50%; background-color: #F6F6F6; display: flex; align-items: center; justify-content: center; transition: .2s; }
.share_area .btn_share {padding-right: 2px; }
.share_area .btn_share:hover { background-color: #FBF3F7;}
.share_area .btn_share:hover path { fill: var(--accent); stroke: var(--accent); transition: .2s; }
.btn_share.kakao { background-color: #FAE100; }
.btn_share.kakao svg, .btn_share.url svg { width: 50%; height: auto; }


.modal {
	display: none;
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0,0,0,0.4);
}
.modal-tit { text-align: center; position: relative; }
.btn_close {
    position: fixed;
    right: 15px;
    top: 15px;
    width: 20px;
    height: 20px;
}
button.close {
    border-radius: 0;
    border: 0;
    background: transparent;
    outline: none;
    box-shadow: none;
    position: relative;
}
button.close::before, button.close::after {
    content: "";
    position: absolute;
    top: 7px;
    right: -8px;
    display: block;
    width: 15px;
    height: 2px;
    background: #000;
    border-radius: 20px;
}
button.close::before {
    transform: rotate(-45deg);
}
button.close::after {
    transform: rotate(45deg);
}
.modal-content {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
	background-color: #fefefe;
	padding: 40px;
	width: 300px;
    border-radius: 8px;
}

.modal .btn_area {
    display: flex !important;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-top: 30px;
}

.modal .btn_area > * {
    display: flex;
    flex-direction: column;
}

.modal .btn_area > *:not(:last-child) {
    margin-right: 20px;
}

.modal .btn_area span {
    padding-top: 5px;
}


@media (max-width: 992px) {
    .share_area { right: 22px; top: 22px; }
    .share_area .btn_share { width: 36px; height: 36px; }
}


/* 회원탈퇴 완료페이지 */
.member-out { display: flex; justify-content: center; align-items: center; flex-direction: column; text-align: center;}
.member-out img { margin-bottom: 15px; width: 44px; height: auto; }
.member-out p { margin: 20px 0 40px; }

.btn_home {
    width: 125px;
    background-color: #fff;
    border: 2px solid var(--accent);
    color: var(--accent);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.btn_home:hover { color: var(--accent)!important; }

@media (max-width: 992px) {
    .member-out img { width: 32px; margin-bottom: 12px; }
    .member-out p { margin: 15px 0 40px; }
}

/* join-process */
.join-process { text-align: center; font-size: 0; margin-bottom: 35px }
.join-process * { color: #000; text-align: center; margin: 0 auto; }
.join-process li { position: relative; display: inline-block; box-sizing: border-box; vertical-align: top; font-size: 17px; color: #ccc; letter-spacing: -1px; line-height: 35px; text-align: left; }
.join-process .svg_box { position: relative; margin-bottom: 5px; width: 44px; height: 44px; background-position: center; background-size: contain; background-repeat: no-repeat; }

.join-process span { display: block; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }

.join-process .c_step1 .svg_box { background-image: url(/images/bg_step1.svg); }
.join-process .c_step2 .svg_box { background-image: url(/images/bg_step2.svg); }
.join-process .c_step3 .svg_box { background-image: url(/images/bg_step3.svg); }

.register-btn .btn { width: 233px; height: 48px; flex: none; padding: 0 !important; }
@media (max-width: 500px) {
    .register-btn .btn { width: 180px; height: 52px !important; line-height: 52px; }
}


/* 이벤트 페이지 */
.book-button-wrap > a { height: 48px !important; line-height: 48px !important; }
@media (max-width: 992px) {
    .nb { padding: 15px 12px !important; }
    .nb .nb-link > .nb-arrow { flex: none !important; }
    .nb .nb-link * { display: inline-flex; align-items: center;}
    .book-button-wrap > a { height: 52px !important; line-height: 52px !important; }
    .book-content img { width: 100% !important; }
}

/* 상품 상세페이지 */
.desc-content * { background-color: transparent!important; }
.goods-option-row > .dtd > .radio_wrap > .radio_box > .input_radio_label > span img { height: 55% !important; }

/* 상세페이지 팝업 */
.card-list-title img,
.layer-list-title img,
.dispublic-list-title img { max-height: 27px; width: auto; }
.myModal .myModal-dialog .myModal-content,
.myModal.layer-union-list .myModal-content,
.myModal.layer-dispublic-list .myModal-content { border-radius: 20px !important; }
.myModal.layer-card-list .myModal-header,
.myModal.layer-dispublic-list .myModal-header,
.myModal.layer-union-list .myModal-header { background-color: #fff; border-bottom: 1px solid #000; padding: 27px 32px; display: flex; align-items: center; }

@media (max-width: 992px) {
    .card-list-title img,
    .layer-list-title img,
    .dispublic-list-title img { max-height: 22px; }
    .myModal .myModal-dialog .myModal-content,
    .myModal.layer-union-list .myModal-content,
    .myModal.layer-dispublic-list .myModal-content { border-radius: 12px !important; }
    .myModal.layer-card-list .myModal-header
    .myModal.layer-dispublic-list .myModal-header,
    .myModal.layer-union-list .myModal-header { padding: 24px; }
}

@media (max-width: 576px) {
    .myModal.layer-card-list .myModal-dialog,
    .myModal.layer-dispublic-list .myModal-dialog,
    .myModal.layer-union-list .myModal-dialog { max-width: 320px !important; }

}

/* 주문페이지 */
input::-internal-autofill-selected { background-color: transparent !important; }

/* 버튼사이즈 */
.sns-icon-wrap .sns-div > a,
.tbl-write-form + .tbl-button-wrap > .btn,
.calc-button-wrap > .btn-request,
.article-button-group .btn,
.btn-wrap > .btn,
.button-wrap > .btn,
.btn-leave,
.btn_home,
.btn-qna-write { height: 48px; line-height: 48px; border-radius: 8px; display: inline-block; }
@media (max-width: 500px) {
    .sns-icon-wrap .sns-div > a,
    .tbl-write-form + .tbl-button-wrap > .btn,
    .calc-button-wrap > .btn-request,
    .article-button-group .btn,
    .btn-wrap > .btn,
    .button-wrap > .btn,
    .btn-leave,
    .btn_home,
    .btn-qna-write { height: 52px; line-height: 52px; }
}

/* faq */
.s_css {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

.s_css::-webkit-scrollbar,
.faq-category-wrap::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera*/
}

/* 게시판 스타일 */
.board-wrap, #board-wrap,
.faq-list-wrap { margin-bottom: 100px !important; }
@media (max-width: 500px) {
    .board-wrap, #board-wrap,
    .faq-list-wrap { margin-bottom: 50px !important; }
}

.board-list-table > .board-list-body > div,
.faq-list-wrap > ul > li > .fa-list-subject > * {
    padding: 24px 3px !important;
}

.board-list-table > .board-list-row > div.date {
    color: #b4b4b4;
}



.error-message {
    position: absolute;
    color: red; 
    font-size: 13px;
    padding-top: 5px;
    letter-spacing: -.05em;
}