/* color */
:root {
    --color-main-bg: #6554FF;
    --color-main-font: #8585ff;
    --color-main-bg-white: #f4f4ff;
    --color-main-border_font: #6d6bd1;
}

@media print {
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
    @page {
        size: auto;
    }
}
pre {
    white-space: pre-wrap;
    word-break: break-all;
    line-height: 16px;
}

/*취소선*/
.td-line {
    text-decoration: line-through !important;
}

.fd-col {
    flex-direction: column;
    flex-wrap: nowrap !important;
}
.fd-row {
    flex-direction: row;
    flex-wrap: nowrap !important;
}
@media (max-width: 991px) {
    .fd-m-col {
        flex-direction: column;
        flex-wrap: nowrap !important;
    }
}
@media (max-width: 470px) {
    .fd-sm-col {
        flex-direction: column;
    }
}
@media (max-width: 400px) {
    .fd-s-col {
        flex-direction: column;
        flex-wrap: nowrap !important;
    }
    .flex-s-vc {
        align-items: center;
    }
}


.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ellipsis_flex {
    flex: 1;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    word-break: break-all;
}
.ellipsis2 {
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-align: left;
}
.ellipsis3 {
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    text-align: left;
}

/*icon*/
.material-symbols-rounded {
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url("../../public/images/icons.png");
    background-repeat: no-repeat;
    background-size: auto 200px;
    background-position: 0 0;
    cursor: pointer;
}
.material-symbols-rounded.big-icon {
    width: 40px;
    height: 40px;
    background-size: auto 300px;
}

.material-symbols-rounded.search-big {
    background-position: -252px -4px;
}
.material-symbols-rounded.search-small {
    background-position: -252px -39px;
}
.material-symbols-rounded.menu {
    background-position: -284px -2px;
}
.material-symbols-rounded.shopping_bag {
    background-position: -317px -2px;
}
.material-symbols-rounded.shopping_cart {
    background-position: -249px -39px;
}
.material-symbols-rounded.close-black {
    background-position: -32px -46px;
}
.material-symbols-rounded.arrow_back_ios_new {
    background-position: -285px -66px;
}
.material-symbols-rounded.chevron_right {
    background-position: -285px -39px;
}
.material-symbols-rounded.face {
    background-position: -66px -47px !important;
}
.material-symbols-rounded.face-black {
    background-position: -66px -161px;
}
.material-symbols-rounded.face-purple {
    background-position: -66px -47px;
}
.material-symbols-rounded.arrow_forward_ios {
    background-position: -284px -39px;
}
.material-symbols-rounded.arrow_forward_ios_big {
    background-position: -313px -66px;
}
.material-symbols-rounded.favorite {
    background-position: -168px -127px;
}
.wish.active .material-symbols-rounded.favorite {
    background-position: -168px -156px;
}
.material-symbols-rounded.big-icon.favorite {
    background-position: -249px -189px;
}
.material-symbols-rounded.big-icon.favorite-red {
    background-position: -249px -232px;
}
.material-symbols-rounded.share {
    background-position: -199px -127px;
}
.material-symbols-rounded.big-icon.share {
    background-position: -297px -189px;
}
.material-symbols-rounded.send {
    background-position: -65px -69px;
}
.material-symbols-rounded.add_photo_black {
    background-position: -345px -26px;
}

/* container */
.container {max-width:1224px; margin:0 auto; padding:0 12px; width:100%;}

.is-pc {display:block;}
.is-m {display:none;}
@media (max-width:991px){
.is-pc {display:none;}
.is-m {display:block;}
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
@media (max-width: 991px) {
    body {margin-top: 49px }
}
/* header */
header .header-top {border-bottom:1px solid #d9d9d9; padding:25px 0;}
header .header-top .container {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
header .header-top .top-left {display:flex; flex-wrap:wrap; align-items:center;}
header .header-top .top-left .top-left-mobile {display:none;}
header .header-top .top-left .top-left-logo {margin:0 42px 0 0; display: flex; flex-direction: row; align-items: center;}
header .header-top .top-left .top-left-logo a {font-size:30px; font-weight: 700}
header .header-top .top-left .top-left-logo .logo-img {height: 50px; margin-right: 10px;}
header .header-top .top-left .top-left-logo .logo-img img {width: 100%; height: 100%; object-fit: contain;}
@media (max-width: 991px) {
    .none-header {margin-top: 0;}
    .none-header header {display:none;}
    header {position: fixed; top: 0; left: 0; right: 0; width: 100%; background: #fff;z-index: 1050}
    header .header-top .top-left .top-left-logo a {font-size: 24px}
    header .header-top .top-left .top-left-logo .logo-img {height: 26px;}
}
header .header-top .top-left .top-left-form form {width:384px; border:2px solid #000; border-radius:50px; display:flex; flex-wrap:wrap; align-items:center; overflow:hidden;}
header .header-top .top-left .top-left-form form input {flex:1; min-width:0; height:50px; padding:0 20px; font-weight:500; color:#111;}
header .header-top .top-left .top-left-form form input::placeholder {color:#a2a2a2;}
header .header-top .top-left .top-left-form form .search {display:block; width:40px; height:40px; margin:0 12px 0 0;}
header .header-top .top-right {display:flex; flex-wrap:wrap; align-items:center;}
header .header-top .top-right .top-right-link ul {display:flex; flex-wrap:wrap; align-items:center;}
header .header-top .top-right .top-right-link ul li {display:flex; flex-wrap:wrap; align-items:center;}
header .header-top .top-right .top-right-link ul li:after {display:inline-block; content:""; width:1px; height:10px; margin:0 8px; background:#d9d9d9;}
header .header-top .top-right .top-right-link ul li:last-of-type:after {display:none;}
header .header-top .top-right .top-right-link ul li a {font-size:14px; font-weight:600; color:#a2a2a2;}
header .header-top .top-right .top-right-icon {margin:0 0 0 24px;}
header .header-top .top-right .top-right-icon ul {display:flex; flex-wrap:wrap; align-items:center;}
header .header-top .top-right .top-right-icon ul li {margin:0 12px 0 0;}
header .header-top .top-right .top-right-icon ul li:last-of-type {margin:0;}
header .header-top .top-right .top-right-icon ul li a {display:flex; font-size:0; width:42px; height:42px; justify-content: center; align-items: center;}
header .header-top .top-right .top-right-icon ul li a span.material-symbols-rounded {font-size: 30px}
/*header .header-top .top-right .top-right-icon ul li.cart a {background-image:url('../../public/images/icon_user_cart.png');}*/
/*header .header-top .top-right .top-right-icon ul li.mypage a {background-image:url('../../public/images/icon_user_mypage.png');}*/
header .header-bottom {border-bottom:1px solid #d9d9d9;}
header .header-bottom .container {display:flex; flex-wrap:nowrap; align-items:center; justify-content:space-between;}
header .header-bottom .bottom-left {width: 100%; margin-right: 20px; position: relative;} /*width: calc(85% - 20px);*/
header .header-bottom .bottom-left ul:not(.drop-menu) {width: fit-content; display:flex; flex-wrap:nowrap; align-items:center; justify-content:flex-start; overflow-x: scroll; overflow-y: hidden; user-select: none;}
header .header-bottom .bottom-left ul::-webkit-scrollbar {height: 5px;}
header .header-bottom .bottom-left ul::-webkit-scrollbar-thumb {background: #d9d9d9; border-radius: 10px}
header .header-bottom .bottom-left ul li {margin:0 38px 0 0;}
header .header-bottom .bottom-left ul li:last-of-type {margin:0;}
header .header-bottom .bottom-left ul li > * {display:flex; flex-wrap:nowrap; align-items:center; height:82px; font-size:18px; font-weight:600;word-break: keep-all;text-align: center;}

header .header-bottom .bottom-left ul li.first-menu > a {padding: 0 10px;}
header .header-bottom .bottom-left ul li.first-menu:after {content: ''; width:0; height:2px; background:#fff; position:relative; bottom:0; display:block; transition: all 0.4s}
header .header-bottom .bottom-left ul li.first-menu:hover:after {background:#000; width: 100%; }
header .header-bottom .bottom-left .drop-menu { opacity: 1; height: auto; width: calc(100% + 50px); padding: 20px; border:1px solid #d9d9d9; background: #ffffff; position: absolute; left: -15px; top: 89px; display:flex; flex-wrap:nowrap; align-items:flex-start; justify-content:flex-start; user-select: none; z-index: 99;}
.drop-menu .second-menu {display: flex; flex-direction: column; justify-content: center; align-items: center;}
.drop-menu .second-menu > * {height: auto !important; font-size: 16px !important;}
.drop-menu .second-menu > a {height: 40px !important; font-weight: 400 !important; border-bottom: 2px solid #fff}
.drop-menu .second-menu > a:hover {border-bottom: 2px solid #000;}
.drop-menu .second-menu .third-menu ul {display: flex; flex-direction: column; justify-content: center; align-items: center;}
.drop-menu .second-menu .third-menu ul li {margin: 0;}
.drop-menu .second-menu .third-menu ul li a {font-size: 14px; height: 28px; font-weight: 400; border: 2px solid #fff;}
.drop-menu .second-menu .third-menu ul li:hover a {border-bottom: 2px solid #000;}

/*header .header-bottom .bottom-left ul li.menu > *:before {display:block; content:""; margin:0 12px 0 0; width:34px; height:34px; background:url('../../public/images/icon_user_menu.png') no-repeat center / cover;}*/
header .header-bottom .bottom-right ul {display:flex; flex-wrap:nowrap; align-items:center;margin-bottom: 5px;}
header .header-bottom .bottom-right ul li {margin:0 38px 0 0;}
header .header-bottom .bottom-right ul li:last-of-type {margin:0;}
header .header-bottom .bottom-right ul li a {display:flex; flex-wrap:wrap; align-items:center; height:82px; font-size:18px; font-weight:600; color:#a2a2a2;word-break: keep-all;}
header .header-menu {pointer-events:none; opacity:0; position:fixed; left:0; top:0; width:100%; height:100%; transition:all ease 0.5s; background:rgba(0,0,0,0.7); z-index:1050;}
header .header-menu .box {pointer-events:none; opacity:0; padding:42px 64px; position:absolute; left:-424px; top:0; width:424px; height:100%; background:#fff; transition:all ease 0.5s;}
header .header-menu .box .close {display:block; width:42px; height:42px; position:absolute; top:0; right:-42px; background:#fff url('../../public/images/icon_user_close.png') no-repeat center / 24px; font-size:0;}
header .header-menu .box .header-menu-link {display:none;}
header .header-menu .box .header-menu-member {display:none;}
header .header-menu .box .header-menu-cate {margin:40px 0 0;}
header .header-menu .box .header-menu-cate ul li {margin:0 0 15px;}
header .header-menu .box .header-menu-cate ul li:last-of-type {margin:0;}
header .header-menu .box .header-menu-cate ul li > div {display: flex; flex-wrap:nowrap; align-items:center; justify-content:space-between;}
header .header-menu .box .header-menu-cate ul li > div a {font-size:18px; font-weight:600; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; height:30px; user-select: none;}
/*header .header-menu .box .header-menu-cate ul li > a:hover {border-bottom: 1px solid #000;}*/
header .header-menu .box .header-menu-cate ul li > .more span {display:block; width:20px; height:20px; transition: transform 0.3s; background:url('../../public/images/icon_user_cate_more.png') no-repeat center / cover; user-select: none; cursor:pointer;}
header .header-menu .box .header-menu-cate ul li > .more span.rotate {transform:rotate(180deg); transition: transform 0.3s;}
header .header-menu .box .header-menu-cate ul li > dl {display:none; margin:8px 0 0;}
header .header-menu .box .header-menu-cate ul li > dl dd a {display:flex; flex-wrap:wrap; align-items:center; padding:4px 0; font-size:16px; color:#6b6b6b;}
header .header-menu .box .header-menu-cate ul li.active > a.more:after {transform:rotate(180deg);}
header .header-menu .box .header-menu-cate ul li.active > dl {display:block;}
/*header .header-menu .box .header-menu-cate ul li.active > dl dd a:hover {border-bottom:1px solid #6b6b6b;}*/
header.fixed .header-menu {pointer-events:inherit; opacity:1;}
header.fixed .header-menu .box {pointer-events:inherit; opacity:1; left:0;}
@media (max-width:1300px){
header .header-top .top-left .top-left-form form {width:300px;}
header .header-bottom .bottom-left ul li {margin:0 20px 0 0;}
header .header-bottom .bottom-right ul li {margin:0 20px 0 0;}
}
@media (max-width:991px){
header .header-top {padding:12px 0; border-bottom:1px solid #d9d9d9;}
header .header-top .top-left {flex:1; min-width:0;}
header .header-top .top-left .top-left-logo {margin:0;}
header .header-top .top-left .top-left-form {display:none;}
header .header-top .top-left .top-left-mobile {display:flex; flex:1; min-width:0;}
header .header-top .top-left .top-left-mobile ul {display:flex; flex-wrap:wrap; align-items:center;}
header .header-top .top-left .top-left-mobile ul li {margin:0 12px 0 0;}
header .header-top .top-left .top-left-mobile ul li:last-of-type {margin:0;}
header .header-top .top-left .top-left-mobile ul li a {display:flex; font-size:0; width:24px; height:24px; justify-content: center; align-items: center;}
header .header-top .top-left .top-left-mobile ul li.menu a span.material-symbols-rounded {font-size: 24px}
/*header .header-top .top-left .top-left-mobile ul li.menu a {background-image:url('../../public/images/icon_user_menu_m.png');}*/
/*header .header-top .top-left .top-left-mobile ul li.search a {background-image:url('../../public/images/icon_user_search_m.png');}*/
header .header-top .top-left .top-left-mobile ul li.search a span.material-symbols-rounded {font-size: 24px}
/*header .header-top .top-left .top-left-mobile ul li.cart a {background-image:url('../../public/images/icon_user_cart_m.png');}*/
header .header-top .top-left .top-left-mobile ul li.cart a span.material-symbols-rounded {font-size: 24px}
header .header-top .top-right {display:none;}
header .header-bottom {display:none;}
header .header-menu .box {left:-280px; width: 80%; padding:0 12px 12px; overflow-y:auto;}
header .header-menu .box .close {display:none;}
header .header-menu .box .header-menu-logo {display:none;}
header .header-menu .box .header-menu-logo .logo-img {height: 100px;}
header .header-menu .box .header-menu-logo .logo-img img {width: 100%; height: 100%; object-fit: contain;}
header .header-menu .box .header-menu-link {display:block; border-bottom:1px solid #d9d9d9; padding:0 12px;}
header .header-menu .box .header-menu-link ul {display:flex; flex-wrap:wrap; align-items:center;}
header .header-menu .box .header-menu-link ul li {display:flex; flex-wrap:wrap; align-items:center;}
header .header-menu .box .header-menu-link ul li:after {display:inline-block; content:""; width:1px; height:10px; margin:0 8px; background:#d9d9d9;}
header .header-menu .box .header-menu-link ul li:last-of-type:after {display:none;}
header .header-menu .box .header-menu-link ul li a {display:flex; flex-wrap:wrap; align-items:center; padding:12px 0; font-size:15px; font-weight:600; color:#a2a2a2;}
header .header-menu .box .header-menu-cate {margin:24px 0 0; padding:0 12px;}
/*header .header-menu .box .header-menu-cate ul li > a:hover {border-bottom: 0;}*/
/*header .header-menu .box .header-menu-cate ul li.active > dl dd a:hover {border-bottom: 1px solid #fff;}*/
header .header-menu .box .header-menu-member {display:block; margin:50px 0 0; padding:12px 12px 24px; border-top:1px solid #d9d9d9;}
header .header-menu .box .header-menu-member ul li a {display:flex; flex-wrap:wrap; align-items:center; padding:12px 0; font-size:14px; color:#a2a2a2;}

}

/* footer */
.respond-view {display: none;}
footer .footer-top {background:#F6F6F6; padding:14px 0;}
footer .footer-top .container {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
footer .footer-top .footer-top-left ul {display:flex; flex-wrap:wrap; align-items:center;}
footer .footer-top .footer-top-left ul li {margin:0 24px 0 0;}
footer .footer-top .footer-top-left ul li:last-of-type {margin:0;}
footer .footer-top .footer-top-left ul li > * {font-size:16px; color:#a2a2a2;}
footer .footer-bottom {background:#121212; padding:60px 0;}
footer .footer-bottom .footer-bottom-info .container {display:flex; flex-wrap:wrap; align-items:center;}
footer .footer-bottom .footer-bottom-info .info-left {flex:1; min-width:0; padding-right:24px;}
footer .footer-bottom .footer-bottom-info .info-left ul {display:flex; flex-wrap:wrap;}
footer .footer-bottom .footer-bottom-info .info-left ul li {border-right:1px solid #a2a2a2; margin:0 24px 0 0; padding:0 24px 0 0;}
footer .footer-bottom .footer-bottom-info .info-left ul li:last-of-type {border:0; margin:0; padding:0;}
footer .footer-bottom .footer-bottom-info .info-left ul li h2 {font-size:16px; color:#d9d9d9;}
footer .footer-bottom .footer-bottom-info .info-left ul li h2:after {display:block; content:""; width:20px; height:1px; background:#fff; margin:6px 0 12px;}
footer .footer-bottom .footer-bottom-info .info-left ul li strong {display:block; font-size:28px; font-weight:600; color:#fff; margin:0 0 6px;}
footer .footer-bottom .footer-bottom-info .info-left ul li p {font-size:16px; line-height:1.3; color:#fff;}
footer .footer-bottom .footer-bottom-info .info-left ul li small {display:block; line-height:1.4; color:#a2a2a2;}
footer .footer-bottom .footer-bottom-info .info-right {width:160px;}
footer .footer-bottom .footer-bottom-info .info-right ul li {margin:0 0 12px;}
footer .footer-bottom .footer-bottom-info .info-right ul li:last-of-type {margin:0;}
footer .footer-bottom .footer-bottom-info .info-right ul li > * {border-radius:7px; border:1px solid #757575; height:39px; font-size:16px; font-weight:600; color:#fff; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
footer .footer-bottom .footer-bottom-info .social-box {display:none;}
footer .footer-bottom .footer-bottom-text {border-top:1px solid #a2a2a2; margin:42px 0 0; padding:42px 0 0;}
footer .footer-bottom .footer-bottom-text h2 {width:100%; margin:0 0 24px;}
footer .footer-bottom .footer-bottom-text h2 img {display:block; margin:0 auto;}
footer .footer-bottom .footer-bottom-text ul {width:100%;}
footer .footer-bottom .footer-bottom-text ul li {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; margin:0 0 8px;}
footer .footer-bottom .footer-bottom-text ul li:last-of-type {margin:24px 0 0;}
footer .footer-bottom .footer-bottom-text ul li div {display:flex; flex-wrap:wrap; align-items:center; margin:0 8px 0 0;}
footer .footer-bottom .footer-bottom-text ul li div:last-of-type {margin:0;}
footer .footer-bottom .footer-bottom-text ul li div b {font-size:14px; color:#d9d9d9; line-height:1.2; margin:0 8px 0 0;}
footer .footer-bottom .footer-bottom-text ul li div p {font-size:14px; color:#fff; line-height:1.2; font-weight:500;}
footer .footer-bottom .footer-bottom-text ul li div p a {font-size:14px; color:#fff; line-height:1.2; font-weight:500;}
@media (max-width:991px){
.respond-view {display: block;}
footer .footer-top {padding:0;}
footer .footer-top .footer-top-left {width:100%;}
footer .footer-top .footer-top-left ul {justify-content:center;}
footer .footer-top .footer-top-left ul li {margin:0;}
footer .footer-top .footer-top-left ul li > * {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; padding:13px 6px; font-size:14px;}
footer .footer-top .footer-top-right {display:none;}
footer .footer-bottom {padding:24px;}
footer .footer-bottom .footer-bottom-info .info-left {padding-right:0; flex:none; width:100%;}
footer .footer-bottom .footer-bottom-info .info-left ul li {width:100%; border:0; padding:0; margin:0 0 12px;}
footer .footer-bottom .footer-bottom-info .info-left ul li h2 {display:none;}
footer .footer-bottom .footer-bottom-info .info-left ul li strong {font-size:18px; margin:0 0 4px;}
footer .footer-bottom .footer-bottom-info .info-left ul li strong a {font-size:18px; font-weight:600; color:#fff;}
footer .footer-bottom .footer-bottom-info .info-left ul li p {font-size:14px;}
footer .footer-bottom .footer-bottom-info .info-left ul li p br {display:none;}
footer .footer-bottom .footer-bottom-info .info-left ul li small {font-size:12px;}
footer .footer-bottom .footer-bottom-info .info-right {display:none;}
footer .footer-bottom .footer-bottom-info .social-box {width:100%; display:block; margin:0 0 12px;}
footer .footer-bottom .footer-bottom-text {padding:24px 0 0; margin:24px 0 0;}
footer .footer-bottom .footer-bottom-text h2 {display:none;}
footer .footer-bottom .footer-bottom-text ul li {justify-content:flex-start; margin:0 0 4px;}
footer .footer-bottom .footer-bottom-text ul li div {width:100%; margin:0 0 4px;}
footer .footer-bottom .footer-bottom-text ul li div:last-of-type {margin:0;}
footer .footer-bottom .footer-bottom-text ul li div b {font-size:12px;}
footer .footer-bottom .footer-bottom-text ul li div p {font-size:12px;}
footer .footer-bottom .footer-bottom-text ul li div p a {font-size:12px; line-height:1.2; font-weight:500;}
}

/*top btn*/
#top-btn {
    position: fixed;
    bottom: 40px;
    right: 20px;
    color: #fff;
    background: #222;
    padding: 10px;
    border-radius: 50%;
    z-index: 99;
    cursor: pointer;
}

/* section */
section {padding:20px 0 20px; margin-bottom: 40px;flex-grow: 1;}
/*@media (max-width:991px){*/
/*    section {padding:0 0 20px;}*/
/*}*/

/* color */
.ft-black {color:#000000 !important;}
.ft-red {color:#ff0000 !important;}
.ft-blue {color:#0051FF !important;}
.ft-active {color:var(--color-main-bg) !important;}

/* social-box */
.social-box ul {display:flex; flex-wrap:wrap; align-items:center;}
.social-box ul li {margin:0 12px 0 0;}
.social-box ul li:last-of-type {margin:0;}
.social-box ul li > * {display:block; font-size:0; width:32px; height:32px; background-size:cover; background-position:center;}
.social-box ul li.social01 > * {background-image:url('../../public/images/icon_user_social_text.png');}
.social-box ul li.social02 > * {background-image:url('../../public/images/icon_user_social_text.png');}
.social-box ul li.social03 > * {background-image:url('../../public/images/icon_user_social_text.png');}
@media (max-width:991px){
.social-box ul li > * {width:24px; height:24px;}
}

/* location-box */
.location-box {margin:0 0 24px; padding: 0 10px;}
.location-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end;}
.location-box ul li {display:flex; flex-wrap:wrap; align-items:center;}
.location-box ul li:after {display:block; content:""; margin:0 8px; width:15px; height:15px; background:url('../../public/images/icon_user_location.png') no-repeat center / cover;}
.location-box ul li:last-of-type:after {display:none;}
.location-box ul li > * {font-size:14px; color:#303030;}
@media (max-width:991px){
.location-box {display:none;}
}

/* title-box */
.title-box {margin:0 0 24px; position:relative;}
.title-box h2 {font-size:28px; font-weight:600; line-height:1.3;}
.title-box h3 {font-size:16px; font-weight:500; line-height:1.3; color:#222;}
.title-box .back {display:none;}
.title-box.border {border-bottom:1px solid #000; padding:0 0 24px;}
.mypage-content .title-box h2 {font-size:20px; font-weight:600; line-height:1.3;}
.mypage-content .sub-title-box {margin:0 0 24px; position:relative;}
.mypage-content .sub-title-box {margin:0 0 24px; position:relative;}
.mypage-content .sub-title-box h2 {font-size:28px; font-weight:600; line-height:1.3;}
.mypage-content .sub-title-box h3 {font-size:16px; font-weight:500; line-height:1.3; color:#222;}
.mypage-content .sub-title-box .back {display:none;}
.mypage-content .sub-title-box.border {border-bottom:1px solid #000; padding:0 0 24px;}
@media (max-width:991px){
    .title-box {margin:0 0 20px;}
    .title-box h2 {font-size:20px; color:#5b5a5d; text-align:center;}
    .title-box .back {display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); width:24px; height:24px; font-size:0; background:url('../../public/images/icon_user_back.png') no-repeat center / cover;}
    .title-box.border {border:0; padding:0;}
    /*.mypage-content .title-box {display: none;}*/
    .mypage-content .title-box {margin: 0 0 10px;}
    .mypage-content .title-box h2 {color: #000; text-align: left}
    .mypage-content .title-box.border {border-bottom:1px solid #000; padding:0 0 12px;}
    .mypage-content .sub-title-box {margin:0 0 20px;}
    .mypage-content .sub-title-box h2 {font-size:20px; color:#5b5a5d; text-align:center;}
    .mypage-content .sub-title-box .back {display:block; position:absolute; left:0; top:50%; transform:translateY(-50%); width:24px; height:24px; font-size:0; background:url('../../public/images/icon_user_back.png') no-repeat center / cover;}
    .mypage-content .sub-title-box.border {border:0; padding:0;}
}

/* text-box */
.text-box p {font-size:16px; line-height:1.4; color:#6b6b6b; word-break:keep-all;}
@media (max-width:991px){
.text-box p {font-size:14px;}
}

/* member-box */
.member-box {width:100%; max-width:500px; margin:0 auto;}
.member-box .user-apply-success {width: 100%; height: 150px; margin-bottom: 30px; background: url("../../../../static/mall/public/images/user_apply_success.png") no-repeat center / contain;}
.member-secret-box a {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; color:#6b6b6b;}
.member-secret-box a:before {display:inline-block; content:""; margin:0 10px 0 0; width:18px; height:18px; background:url('../../public/images/icon_user_lock.png') no-repeat center / cover;}
.member-link-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.member-link-box ul li {display:flex; flex-wrap:wrap; align-items:center;}
.member-link-box ul li:after {display:inline-block; content:""; width:1px; height:10px; margin:0 12px; background:#d9d9d9;}
.member-link-box ul li:last-of-type:after {display:none;}
.member-link-box ul li a {font-size:16px; color:#a2a2a2;}
.member-register-box {display:flex; flex-wrap:wrap; align-items:center; padding:42px 0 0; margin:42px 0 0; border-top:1px solid #d9d9d9;}
.member-register-box > div {flex:1; min-width:0; padding:0 24px 0 0;}
.member-register-box > div p {font-size:16px; color:#6b6b6b; margin:0 0 5px;}
.member-register-box > div small {display:block; font-size:14px; color:#a2a2a2;}
.member-register-box > a {height:41px; border:1px solid #d9d9d9; padding:0 24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
@media (max-width:991px){
.member-link-box ul li a {font-size:14px;}
.member-register-box {margin:24px 0 0; padding:24px 0 0;}
.member-register-box > div {flex:none; width:100%;}
.member-register-box > div p {font-size:14px;}
.member-register-box > div small {font-size:12px;}
.member-register-box > a {width:100%; margin:12px 0 0;}
}

.login-sns-border {margin-top: 50px; margin-bottom: 15px; color: var(--color-gray-600); text-align: center;}
.login-sns-border p {position: relative; display: inline-block}
.login-sns-border p::before {content: ''; width: 100px; height: 1px; background: #d9d9d9; top: 7px; left: -112px; position: absolute;}
.login-sns-border p::after {content: ''; width: 100px; height: 1px; background: #d9d9d9; top: 7px; right: -112px; position: absolute;}

/* tab-box */
.tab-box {margin:0 0 24px; z-index: 99}
.tab-box ul {display:flex; flex-wrap:wrap;}
.tab-box ul li {flex:1; min-width:0;}
.tab-box ul li * {width:100%; height:59px; background:#f2f2f2; border:1px solid #f2f2f2; border-bottom-color:#000; font-size:16px; color:#757575; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.tab-box ul li.active * {border-color:#000; border-bottom-color:#fff; background:#fff; color:#000;}
@media (max-width:991px){
.tab-box ul li * {height:45px; font-size:15px;}
}

.tab-box.sticky {
    width: 100%;
    max-width: 1224px;
    margin: 0 auto;
    position: sticky;
    top: 0px;
}
@media (max-width:991px){
    .tab-box.sticky {
        top: 48px;
    }
}

/* tab-content-box */
.tab-content-box .content {display:none;}
.tab-content-box .content.active {display:block; max-width: 1224px; margin: 0 auto; padding: 20px}
.tab-content-box .content img {display:block; margin:0 auto; max-width:100%;}
.mypage-content .tab-content-box .content {padding: 0;}
@media (max-width:991px){
    .tab-content-box .content.active:not(:has(.guide-box)) {
        padding: 20px 0;
    }
}
/* input-box */
.input-box {display:flex; flex-wrap:wrap; align-items:center; border:1px solid #d9d9d9;}
.input-box input {flex:1; min-width:0; height:49px; padding:0 24px; font-size:16px; color:#111;}
.input-box input::placeholder {color:#6b6b6b;}
@media (max-width:991px){
.input-box input {font-size:14px; padding:0 12px; height:40px;}
}

/* quantity-box */
.quantity-box {display:flex; flex-wrap:nowrap; align-items:center; border:1px solid #d9d9d9; padding:12px 24px; justify-content: space-between}
.quantity-box > p {flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:16px; padding:0 12px 0 0;}
.quantity-box > b {font-size:16px; color:#000;}
.quantity-box .inner > div {display:flex; flex-wrap:wrap; align-items:center; width:118px; height:30px; border:1px solid #d9d9d9; margin:0 20px 0 0;}
.quantity-box .inner > div button {display:block; font-size:0; width:30px; height:30px;}
.quantity-box .inner > div button.minus {background:url('../../public/images/icon_user_minus.png') no-repeat center / 7.31px auto;}
.quantity-box .inner > div button.plus {background:url('../../public/images/icon_user_plus.png') no-repeat center / 7.31px auto;}
.quantity-box .inner > div input {flex:1; min-width:0; text-align:center; height:30px; font-size:16px; background:none; border:1px solid #d9d9d9; border-width:0 1px;}
.quantity-box .product-opt-info {flex-direction: column; width: 50%}
.quantity-box .product-opt-info .ellipsis {width: 100%;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.quantity-box .product-opt-price {align-items: center;flex-wrap: nowrap !important;}
.quantity-box .quantity-right {display: flex; flex-direction: row;}
.quantity-box .quantity-right .total-price {font-size: 17px}
@media (max-width:991px){
    .quantity-box .quantity-right {display: flex; flex-direction: row;width: auto;}
    .quantity-box .quantity-right .total-price {margin-top: 20px; margin-bottom: 10px; width: 100%; text-align: end;}
    .quantity-box .quantity-right .remove-quantity-box {align-self: center;}
    .quantity-box {padding:12px;}
    .quantity-box .inner > div {margin: 0;}
    .quantity-box > p {order:1; font-size:14px;}
    .quantity-box > b {font-size:14px; order:2;}
    .quantity-box > .inner {order:3; margin:8px 0 0; width:100%;}
    .quantity-box .product-opt-price {width:auto; flex-direction: column; justify-content: space-between;margin-top: 10px}
}
/* select-box */
.select-box {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; border:1px solid #d9d9d9;}
.select-box select {flex:1; min-width:0; height:49px; padding:0 32px 0 24px; font-size:16px; color:#111; background:url('../../public/images/icon_select.png') no-repeat calc(100% - 12px) center / 20px;}
.select-box.sm select {height:37px; padding:0 32px 0 12px; font-size:14px;}
@media (max-width:991px){
.select-box select {font-size:14px; padding:0 32px 0 12px; height:40px;}
}

/* textarea-box */
.textarea-box textarea {display:block; width:100%; border:1px solid #d9d9d9; padding:24px; font-size:16px; line-height:1.4; color:#111;}
.textarea-box textarea::placeholder {color:#6b6b6b;}
@media (max-width:991px){
.textarea-box textarea {padding:12px; font-size:14px;}
}

/* star-box */
.star-box {display:flex; flex-wrap:wrap; align-items:center;}
.star-box .star {position:relative; overflow:hidden;color: #8585ff;}
.star-box .star input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.star-box .star label {display:block; font-size:0; width:19.17px; height:18.23px; background:url('../../public/images/icon_user_star.png') no-repeat center / cover;}
.star-box .star.active label {background-image:url('../../public/images/icon_user_star_on.png');}

.star-gray {background: url("../../public/images/star_gray.png") repeat-x !important; background-size: 20px !important; width: 100px !important; height: 20px !important; display: inline-block !important;}
.star-purple {background: url("../../public/images/star_purple.png") repeat-x !important; background-size: 20px !important; width: 100%; height: 100% !important; display: block !important;}
.review-write-stars .star-gray {position: relative; overflow: hidden;}
.review-write-stars .star-gray .star-purple {width: 0; position: absolute; left: 0; overflow: hidden; pointer-events: none;}
.review-write-stars .star-gray input {width: 120%; height: 100%; position: absolute; left: -20px; opacity: 0; cursor: pointer;}

/* button-box */
.button-box {position:relative; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.button-box .btn {height:49px; font-size:16px; font-weight:600; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; flex:1; min-width:0;}
.button-box .btn.sm {height:33px; border-radius:4px; font-size:14px; font-weight:400;}
.button-box .btn.right {position:absolute; right:0; top:0; flex:0; width:120px;}
.button-box .btn-red {background:#FF0000; color:#fff;}
.button-box .btn-yellow {background:#E99F00; color:#fff;}
.button-box .btn-black {background:#000; color:#fff;}
.button-box .btn-bd-black {border:1px solid #000; color:#000;}
.button-box .btn-white {background:#fff; border:1px solid #d9d9d9; color:#000;}
.button-box .btn-gray {background:#A2A2A2; color:#fff;}
.button-box .btn-active {background:var(--color-main-bg); color:#fff;}
.button-box .btn-border-active {color:var(--color-main-bg); border:1px solid var(--color-main-bg);}
.button-box .btn-purpleGray {background: #b3b8d3; color:#fff;}
.button-box.bt {border-top:1px solid #d9d9d9; padding:42px 0 0; margin:42px 0 0;}
@media (max-width:991px){
.button-box .btn {font-size:14px; height:40px;}
.button-box .btn.right {position:static; width:100%; flex:none; margin:42px 0 0; border:0; text-decoration:underline;}
.button-box.bt {padding:24px 0 0; margin:24px 0 0;}
}

/* check-box */
.check-box {position:relative; overflow:hidden;}
.check-box input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.check-box label {display:flex; flex-wrap:wrap; align-items:center;}
.check-box label:before {display:inline-block; content:""; width:24px; height:24px; margin:0 8px 0 0; background-size:contain; background-position:center;}
.check-box input[type=checkbox] ~ label:before {background-image:url('../../public/images/icon_check.png');}
.check-box input[type=radio] ~ label:before {background-image:url('../../public/images/icon_radio.png');}
.check-box label b {flex:1; min-width:0; font-size:20px; font-weight:600; line-height:1.3;}
.check-box label p {flex:1; min-width:0; font-size:16px; line-height:1.3;}
.check-box input[type=checkbox]:checked ~ label:before {background-image:url('../../public/images/icon_check_on.png');}
.check-box input[type=radio]:checked ~ label:before {background-image:url('../../public/images/icon_radio_on.png');}
.check-box.f0 label {margin:0 auto; font-size:0;}
.check-box.f0 label p {font-size:0;}
.check-box.f0 label:before {margin:0;}
.check-total-box .check-total {border-bottom:1px solid #000; padding:0 24px 24px;}
.check-total-box .check-list {padding:24px 24px 0;}
.check-total-box .check-list ul li {margin:0 0 42px;}
.check-total-box .check-list ul li:last-of-type {margin:0;}
.check-total-box .check-list ul li strong {display:block; font-size:18px; line-height:1.3; margin:0 0 12px;}
.check-total-box .check-list ul li .text {border:1px solid #d9d9d9; height:200px; padding:14px; overflow-y:auto; margin:0 0 12px;}
.check-total-box .check-list ul li .text p {font-size:14px; line-height:1.5; word-break:keep-all; color:#333;}
.check-total-box .check-list ul li .container.personal ul li {font-size: 14px;}
.check-total-box .check-list ul li .container.personal table {
    th {padding: 10px 5px; font-size: 13px;}
    td {padding: 10px 5px; font-size: 13px;}
}
.check-total-box .check-list ul li .agree {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; margin:0 0 15px;}
.check-total-box .check-list ul li .agree:last-of-type {margin:0;}
.check-total-box .check-list ul li .agree p {font-size:16px; line-height:1.3;}
.check-total-box .button-box {border-top:1px solid #d9d9d9; margin:42px 0 0; padding:42px 0 0;}
.check-total-box .button-box .btn {flex:none; max-width:500px; margin:0 auto; width:100%;}
@media (max-width:991px){
.check-box label:before {width:20px; height:20px;}
.check-box label p {font-size:14px;}
.check-box label b {font-size:16px;}
.check-total-box .check-total {padding:0 0 20px;}
.check-total-box .check-list {padding:24px 0 0;}
.check-total-box .check-list ul li strong {font-size:16px;}
.check-total-box .check-list ul li .text {height:120px; padding:10px;}
.check-total-box .check-list ul li .text p {font-size:12px;}
.check-total-box .check-list .text pre {font-size:12px;}
.check-total-box .check-list ul li .container.personal ul li {font-size: 12px;}
.check-total-box .check-list ul li .container.personal table {
    th {padding: 10px 5px; font-size: 12px;}
    td {padding: 10px 5px; font-size: 12px;}
}
.check-total-box .check-list ul li .agree p {font-size:14px;}
}

/* write-box */
.write-box ul li {display:flex; flex-wrap:wrap; align-items:center; margin:0 0 12px;}
.write-box ul li:last-of-type {margin:0;}
.write-box ul li > strong {width:154px; font-size:16px; color:#6b6b6b; line-height:1.4; word-break:keep-all;}
.write-box ul li > strong.req {position:relative;}
.write-box ul li > strong.req:before {position:absolute; left:-12px; display:block; content:"*"; font-size:16px; line-height:1.4; color:#FF8F2E;}
.write-box ul li > .reg-title {margin-right: 30px;}
.write-box ul li > .reg-title strong {width:154px; font-size:16px; color:#6b6b6b; line-height:1.4; word-break:keep-all;}
.write-box ul li > .reg-title strong.req {position:relative;}
.write-box ul li > .reg-title strong.req:before {position:absolute; right:-12px; display:block; content:"*"; font-size:16px; line-height:1.4; color:#FF8F2E;}
.write-box ul li > div {flex:1; min-width:0;}
.write-box ul li.flex-vt > strong {padding:18px 0 0;}
.write-box.border {border-top:1px solid #000; border-bottom:1px solid #d9d9d9; padding:42px 24px;}
.mypage-content .write-box ul li.flex-vt > strong {padding-top: 0;}
@media (max-width:991px){
.write-box ul li {margin:0 0 24px;}
.write-box ul li > strong {width:100%; font-size:14px; margin:0 0 8px;}
.write-box ul li > div {flex:none; width:100%;}
.write-box ul li > strong.req {display:flex; flex-wrap:wrap; align-items:center;}
.write-box ul li > strong.req:before {position:static; margin:0 4px 0 0; font-size:14px;}
.write-box ul li.flex-vt > strong {padding:0;}
.write-box.border {padding:24px 0;}
.mypage-content .write-box ul li > strong.row-strong {width: auto; margin: 0 20px 0 0;}
}

/* message-box */
.message-box {margin:8px 0 0;}
.message-box p {font-size:14px; line-height:1.4; color:#333; word-break:keep-all;}
@media (max-width:991px){
.message-box p {font-size:12px;}
}

/* guide-box */
.guide-box dl {border-bottom:1px solid #eee; margin:0 0 32px; padding:0 0 32px;}
.guide-box dl:last-of-type {margin:0;}
.guide-box dl dt {margin:0 0 8px; font-size:14px; line-height:1.5; font-weight:bold;}
.guide-box dl dd {display:flex; flex-wrap:wrap;}
.guide-box dl dd em {font-size:14px; line-height:1.5; color:#777; margin:0 3px;}
.guide-box dl dd p {flex:1; min-width:0; font-size:14px; line-height:1.5; color:#777; word-break:keep-all;}
.guide-box dl dd b {display:block; width:100%; font-size:14px; line-height:1.5; font-weight:bold; color:#777; margin:0 0 3px;}

/* order-list-box */
.order-list-box ul li {margin:0 0 24px;}
.order-list-box ul li:last-of-type {margin:0;}
.order-list-box ul li h3 {display:flex; flex-wrap:wrap; align-items:center; font-size:16px; font-weight:600; border-bottom:1px solid #000; padding:0 10px 24px;}
.order-list-box ul li h3 .change {margin:0 0 0 20px; height:25px; border:1px solid #d9d9d9; padding:0 8px; font-size:14px; color:#424242; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.order-list-box ul li dl {padding:24px; border-bottom:1px solid #d9d9d9;border-left: 1px solid var(--color-gray-200);border-right: 1px solid var(--color-gray-200);}
.order-list-box ul li dl dd {margin: 0; padding: 10px; display:flex; flex-wrap:wrap; align-items:center;}
/*.order-list-box ul li dl dd:not(:last-of-type) {border-bottom: 1px solid var(--color-gray-200);}*/
.order-list-box ul li dl dd:first-child {padding-top: 0;}
/*.order-list-box ul li dl dd:last-of-type {margin:0;}*/
.order-list-box ul li dl dd > b {width:132px; font-size:16px; line-height:1.3; color:#757575;}
.order-list-box ul li dl dd > div {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center;}
.order-list-box ul li dl dd > div p {font-size:16px; line-height:1.3; color:#000;}
.order-list-box ul li dl dd > div small {margin:0 0 0 12px; font-size:14px; line-height:1.3; color:#424242;}
.order-list-box ul li dl dd > div strong {font-size:18px; font-weight:600; line-height:1.3;}
@media (max-width:991px){
.order-list-box ul li h3 {padding:0 0 12px;}
.order-list-box ul li dl {padding: 12px;}
.order-list-box ul li dl dd > b {width:90px; font-size:14px; word-break:keep-all;}
.order-list-box ul li dl dd > div p {font-size:14px;}
.order-list-box ul li dl dd > div small {font-size:12px;}
.order-list-box ul li dl dd > div strong {font-size:16px;}
}

/* order-item-box */
.order-item-box ul li .list-head {padding:24px 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.order-item-box ul li .list-head time {display:flex; flex-wrap:wrap; align-items:center; font-size:18px; font-weight:600;}
.order-item-box ul li .list-head small:before {display:inline-block; content:""; width:20px; height:20px; margin:0 8px 0 0; background:url('../../public/images/icon_user_paper.png') no-repeat center / cover;}
.order-item-box ul li .list-head small {margin:0 12px 0 0; font-size:18px; color:#6b6b6b; display: flex; justify-content: center; align-items: center;}
.order-item-box ul li .list-head small a {font-size:18px; color: var(--color-blue);margin-left: 5px;}
.order-item-box ul li .list-head small a:hover {text-decoration:underline;}
/*.order-item-box ul li .list-head a {display:flex; flex-wrap:wrap; align-items:center; font-size:18px; color:var(--color-main-bg);}*/
/*.order-item-box ul li .list-head a:after {display:inline-block; content:""; width:20px; height:20px; margin:0 0 0 8px; background:url('../../public/images/icon_user_oder_more.png') no-repeat center / cover;}*/
.order-item-box ul li .list-body {border: 1px solid #d9d9d9; padding:24px 36px;}
.order-item-box ul li .list-body:not(:last-child) {border-bottom: 0;}
.order-item-box ul li .list-body strong {display:block; font-size:16px; font-weight:600; margin:0 0 14px;}
.order-item-box ul li .list-body .list-one {padding: 20px; border-bottom: 1px solid #d9d9d9;}
.order-item-box ul li .list-body .list-one:first-child {padding-top: 8px;}
.order-item-box ul li .list-body .list-one:last-child {padding-bottom: 8px; border-bottom: 0;}
.order-item-box ul li .list-body > div {display:flex; flex-wrap:wrap; align-items:center;}
.order-item-box ul li .list-body > div > .list-thumb {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center;}
.order-item-box ul li .list-body > div > .list-thumb img {width:100px; height:100px; object-fit:cover;}
.order-item-box ul li .list-body > div > .list-thumb > div {flex:1; min-width:0; padding:0 0 0 24px;}
.order-item-box ul li .list-body > div > .list-thumb > div p {font-size:18px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; margin:0 0 12px;}
.order-item-box ul li .list-body > div > .list-thumb > div small {display:block; font-size:16px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#6b6b6b;}
.order-item-box ul li .list-body > div > .list-thumb > div dl {display:flex; flex-wrap:wrap; align-items:center;}
.order-item-box ul li .list-body > div > .list-thumb > div dl dd {font-size:16px; margin:0 12px 0 0;}
.order-item-box ul li .list-body > div > .list-thumb > div dl dd:last-of-type {margin:0;}
.order-item-box ul li .list-body > div > .list-button {gap: 10px; border-left:1px solid #d9d9d9; padding:0 0 0 42px; margin:0 0 0 42px;}
.order-item-box ul li .list-body > div > .list-button a {width:140px; height:40px; border:1px solid #d9d9d9; color:#303030; margin:0 0 12px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.order-item-box ul li .list-body > div > .list-button a:last-of-type {margin:0;}
.order-item-box ul li .list-body > div > .list-button b {display:block; text-align:center; width:140px; font-size:18px; font-weight:600; padding:35px 0;}
.order-item-box ul li .list-body > div > .list-button a.btn-red {border: 1px solid #FF0000; color:#FF0000;}
.order-item-box .list-total {padding:0 0 24px;}
.order-item-box .list-total p {font-size:18px; font-weight:600; color:#757575;}
.order-item-box .list-total p b {font-size:18px; font-weight:600; color:#000;}
.order-item-box .list-none {border-top:1px solid #000; border-bottom:1px solid #d9d9d9; padding:42px 0;}
.order-item-box .list-none p {text-align:center; padding:16px 0; font-size:16px; color:#121212;}
@media (max-width:991px){
.order-item-box ul li .list-head {padding:12px 0 6px; flex-wrap: wrap-reverse;}
.order-item-box ul li .list-head time {font-size:14px;}
.order-item-box ul li .list-head small:before {display:none;}
.order-item-box ul li .list-head small {margin:0 12px 0 0; font-size:18px; color:#6b6b6b; display: flex; justify-content: flex-start; align-items: center;}
.order-item-box ul li .list-head small {margin:0; font-size:12px;}
.order-item-box ul li .list-head a {font-size:14px;}
.order-item-box ul li .list-head a:after {width:12px; height:12px; margin:0 0 0 4px;}
.order-item-box ul li .list-body {padding:12px;}
.order-item-box ul li .list-body strong {font-size:16px; margin:0 0 12px;}
.order-item-box ul li .list-body > div > .list-thumb {flex:none; width:100%;}
.order-item-box ul li .list-body > div > .list-thumb img {width:80px; height:80px;}
.order-item-box ul li .list-body > div > .list-thumb > div {padding:0 0 0 10px;}
.order-item-box ul li .list-body > div > .list-thumb > div p {font-size:15px;}
.order-item-box ul li .list-body > div > .list-thumb > div small {font-size:13px;}
.order-item-box ul li .list-body > div > .list-thumb > div dl dd {font-size:12px;}
.order-item-box ul li .list-body > div > .list-button {width: 100%; border:0; padding:0; margin: 10px 0 0; display:flex; flex-wrap:wrap; justify-content: center;}
.order-item-box ul li .list-body > div > .list-button a {margin:0; min-width:0;width: 100%;}
.order-item-box ul li .list-body > div > .list-button a:last-of-type {margin:0;}
.order-item-box ul li .list-body > div > .list-button b {width:100%; padding:0 12px; text-align:left; font-size:16px;}
.order-item-box .list-total {padding:0 0 12px;}
.order-item-box .list-total p {font-size:14px;}
.order-item-box .list-total p b {font-size:14px;}
.order-item-box .list-none p {font-size:14px;}
}

/* order-detail-box */
.order-detail-box {width: 50%;}
.order-detail-box.col-12 {width:100%;}
.order-detail-box h3 {font-size:16px; font-weight:600; padding:0 0 24px; border-bottom:1px solid #000;}
.order-detail-box ul {padding:24px; border-bottom:1px solid #d9d9d9; border-left:1px solid #d9d9d9;}
.order-detail-box:last-child ul {border-right: 1px solid #d9d9d9;}
.order-detail-box:last-child .half ul:first-child {border-right: 0;}
.order-detail-box ul li {margin:0 0 12px; display:flex; flex-wrap:wrap;}
.order-detail-box ul li:last-of-type {margin:0;}
.order-detail-box ul li b {width:132px; font-size:16px; line-height:1.3; color:#757575;}
.order-detail-box ul li p {flex:1; min-width:0; font-size:16px; line-height:1.3;}
.order-detail-box ul li .order-request-img img {width:100px; height:100px; object-fit:cover;}
.order-detail-box .half {display:flex; flex-wrap:wrap;}
.order-detail-box .half ul {width:50%;}
.mypage-content .order-detail-box ul li p.order-request-img {flex: none; width: 31%;height: 100px;}
.mypage-content .order-detail-box ul li p.order-request-img img {width: 100%; object-fit: cover;}
@media (max-width:991px){
.order-detail-box {width: 100%;}
.order-detail-box h3 {padding:0 0 12px;}
.order-detail-box ul {padding:24px 12px; border-right:1px solid #d9d9d9;}
.order-detail-box ul li b {width:100px; font-size:14px;}
.order-detail-box ul li p {font-size:14px;}
.order-detail-box .half ul {width:100%;}
.order-detail-box:last-child .half ul:first-child {border-right: 1px solid #d9d9d9;;}
/*.mypage-content .order-detail-box ul li b {width: 65px;}*/
.mypage-content .order-detail-box ul li p.order-request-img {height: 100%;}
.mypage-content .order-detail-box ul li p.order-request-img:has(img) {height: 100px;}
}

/* order-total-box */
.order-total-box {width:50%;}
.order-total-box.col-12 {width:100%;}
.order-total-box h3 {font-size:16px; font-weight:600; padding:0 0 24px; border-bottom:1px solid #000;}
.order-total-box ul li {margin:0 0 12px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.order-total-box ul li:last-of-type {margin:0;}
.order-total-box ul li b {font-size:16px; line-height:1.3; color:#757575;}
.order-total-box ul li p {font-size:16px; line-height:1.3; text-align:right;}
.order-total-box .total {display:flex; flex-direction: column; border:1px solid #d9d9d9; border-top: 0;}
.order-total-box .total > div {padding:24px; min-width:0; width: 100%;}
.order-total-box .total > div.total-right {background:#f6f6f6;}
.order-total-box .sum {border-bottom:1px solid #d9d9d9; border:1px solid #d9d9d9; border-top: 0;}
.order-total-box .sum ul {width:100%; padding:24px;}
.order-total-box .sum ul li:last-of-type b {font-size:18px; color:#000;}
.order-total-box .sum ul li:last-of-type p {font-size:18px;}
@media (max-width:991px){
    .order-total-box {width:100%;}
.order-total-box h3 {padding:0 0 12px;}
.order-total-box ul li b {font-size:14px;}
.order-total-box ul li p {font-size:14px;}
.order-total-box .total > div {padding:24px 12px; width:100%; flex:none;}
.order-total-box .total > div.total-left {padding:12px; border-bottom:1px solid #d9d9d9;}
.order-total-box .sum ul {padding:24px 12px;}
.order-total-box .sum ul li:last-of-type b {font-size:16px;}
.order-total-box .sum ul li:last-of-type p {font-size:16px;}
}

/* search-box */
.search-box {max-width:550px; margin:0 auto; position: relative;}
.search-box form {display:flex; flex-wrap:wrap; align-items:center; border:2px solid #000; border-radius:50px; padding:0 20px;}
.search-box form input {flex:1; min-width:0; height:50px; padding-right:20px; font-size:14px; font-weight:500; color:#111;}
.search-box form input::placeholder {color:#a2a2a2;}
.search-box form .search {width:40px; height:40px; font-size:0; background:url('../../public/images/icon_user_search.png') no-repeat center / cover;}
.search-box ul {margin:24px -6px -12px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.search-box ul li {margin:0 6px 12px;}
.search-box ul li > * {border:1px solid #757575; padding:0 12px; font-size:16px; color:#757575; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:35px; border-radius:50px;}
.search-box ul li.active > * {border-color:var(--color-main-bg); color:var(--color-main-bg);}
@media (max-width:991px){
    .search-box ul {margin:15px -3px -6px;}
    .search-box ul li {margin:0 3px 6px;}
    .search-box ul li > * {font-size:14px; height:30px;}
}

/* popup-box */
.popup-box {pointer-events:none; opacity:0; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:1055; transition:all ease 0.5s;}
.popup-box .box {pointer-events:none; opacity:0; transition:all ease 0.5s; padding:24px 24px 40px; position:absolute; left:50%; top:45%; transform:translate(-50%,-50%); width:100%; max-width:700px; overflow-y:auto; max-height:85%; background:#fff;}
.popup-box .box.less-pd {padding:14px 24px 10px;}
.popup-box .popup-head {position:relative; padding:12px 0; margin:0 0 20px;}
.popup-box .popup-head h2 {font-size:20px; font-weight:600; text-align:center; line-height:1.3; color:#222;}
.popup-box .popup-head a {position:absolute; right:0; top:50%; transform:translateY(-50%); width:42px; height:42px; font-size:0; background:url('../../public/images/icon_popup_close.png') no-repeat center / cover;}
.popup-box.fixed {pointer-events:inherit; opacity:1;}
.popup-box.fixed .box.active {pointer-events:inherit; opacity:1; top:50%;}

.popup-box.bottom-modal .box .list-body .list-thumb {display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.popup-box.bottom-modal .box .list-body .list-thumb img {width: 60px; height: 60px}
.popup-box#register-popup > .box {overflow-y: auto; max-height: 85vh; display:flex; flex-direction: column;}
.popup-box#register-popup .popup-body {flex: 1; overflow-y: auto;}

@media (max-width:991px){
.popup-box .box {width:calc(100% - 24px); padding:24px 12px;}
.popup-box .popup-head {padding:0;}
.popup-box .popup-head h2 {font-size:18px;}
.popup-box .popup-head a {width:24px; height:24px;}
    .popup-box.bottom-modal .close {width: 24px; height: 24px;font-size:0; background:url('../../public/images/icon_popup_close.png') no-repeat center / cover;}
    .popup-box.bottom-modal .box {width: 100%; bottom: 0; border-radius: 10px 10px 0 0; transform: translate(-50%, 0%);}
    .popup-box.bottom-modal .box.active {top: 100%; bottom: -600px; opacity: 1; position: absolute;}
    .popup-box.bottom-modal .box.active.b_to_top {top: 30%; bottom: 0; transition: top 0.4s}
    .bottom-modal .box {padding: 0}
    .bottom-modal .box .popup-body {position: relative;}
    .bottom-modal .bt-fix-top {position: sticky; top: 0; background: #fff; width: 100%; padding: 15px 12px 10px;}
    .bottom-modal .bt-fix-btn {position: sticky; bottom: 0; background: #fff; width: 100%; padding: 10px 12px 20px; border-top: 1px solid #dfdfdf;}
    .bottom-modal .cart-quantity-box.quantity-box.cart-quantity-box {margin: 0 auto; width: calc(100% - 24px)}
}

/* addr-list-box */
.addr-list-box ul li {padding:24px; margin:0 0 24px; border:1px solid #d9d9d9;}
.addr-list-box ul li:last-of-type {margin:0;}
.addr-list-box ul li .adr-name {display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
.addr-list-box ul li .adr-name strong:first-child {margin-right: 20px; position: relative;}
.addr-list-box ul li .adr-name strong:first-child::after {content: ''; width: 1px; height: 14px; background: var(--color-black-700);position: absolute;right: -11px;}
.addr-list-box ul li strong {display:flex; flex-wrap:wrap; align-items:center; font-size:16px; font-weight:500; color:#222; margin:0 0 30px;}
.addr-list-box ul li strong span {margin:0 0 0 16px; font-size:12px; color:#111; display:flex; flex-wrap:wrap; align-items:center; border:1px solid #000; border-radius:50px; height:26px; padding:0 10px;}
.addr-list-box ul li p {margin:0 0 10px; font-size:14px; line-height:1.4; color:#222; word-break:keep-all;}
.addr-list-box ul li .button-box {margin:24px 0 0;}
.addr-list-box ul li.active {border:2px solid var(--color-main-bg);}
@media (max-width:991px){
.addr-list-box ul li {margin:0 0 12px; padding:24px 12px;}
.addr-list-box ul li strong {margin:0 0 12px;}
.addr-list-box ul li p {font-size:14px; margin:0 0 4px;}
}

/* mypage-box */
.mypage-box {border-bottom:1px solid #d9d9d9;}
.mypage-box ul {display:flex; align-items:center; justify-content:center;}
.mypage-box ul li {display:flex; flex-wrap:wrap; align-items:center;}
.mypage-box ul li:after {display:block; content:""; width:24px; height:24px; margin:0 24px; background:url('../../public/images/icon_user_mypage_arrow.png') no-repeat center / cover;}
.mypage-box ul li:last-of-type:after {display:none;}
.mypage-box ul li .inner {display:block; width:80px; padding:42px 0;}
.mypage-box ul li .inner p {display:block; text-align:center; font-size:20px; font-weight:500; color:#757575;}
.mypage-box ul li .inner strong {display:block; text-align:center; margin:10px 0 0; font-size:24px; font-weight:600; color:#6554ff; height:30px; line-height:30px;}
@media (max-width:991px){
.mypage-box {padding:6px 0; border-top:1px solid #000;}
.mypage-box ul li {width:33.33%; position:relative;}
.mypage-box ul li:after {width:18px; height:18px; position:absolute; right:0; top:50%; transform:translateY(-50%); margin:0;}
.mypage-box ul li .inner {flex:1; min-width:0; padding:6px 0;}
.mypage-box ul li .inner p {font-size:14px;}
.mypage-box ul li .inner strong {margin:4px 0 0; font-size:18px;}
.mypage-box ul li:nth-of-type(4):after {display:none;}
}
@media (max-width:420px) {
    .mypage-box ul li:nth-of-type(2):after {display:none;}
    .mypage-box ul {flex-wrap: wrap;}
    .mypage-box ul li {width: 50%;}
}

/* table-info-box */
.table-info-box {border-top:2px solid #000; border-bottom:1px solid #000;}
.table-info-box > ul > li {border-bottom:1px solid #d9d9d9;}
.table-info-box > ul > li:last-of-type {border:0;}
.table-info-box > ul > li dl {padding:18px 0;display:flex; flex-wrap:wrap; align-items:center;}
.table-info-box > ul > li dl dd {flex:1; min-width:0; padding:0 15px; display:flex; flex-wrap:wrap;}
.table-info-box > ul > li dl dd b {width:65px; font-size:14px; font-weight:600; line-height:1.3; color:#8B8B9E;}
.table-info-box > ul > li dl dd p {flex:1; min-width:0; font-size:14px; line-height:1.3;}
.table-info-box > ul > li dl dd p.order-item-thumb {height: 60px; display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-start;}
.table-info-box > ul > li dl dd p.order-item-thumb span {margin-left: 10px;}
.table-info-box > ul > li dl dd p.order-item-thumb img {width: 60px; height: 100%; object-fit: cover; flex-shrink: 0;}
@media (max-width:991px){
.table-info-box > ul > li dl {padding:0;}
.table-info-box > ul > li dl dd {flex:none; width:100%; padding:12px; border-bottom:1px solid #d9d9d9;}
.table-info-box > ul > li dl dd:last-of-type {border:0;}
}

/* table-thumb-box */
.table-thumb-box {width:250px;}
.table-thumb-box a {display:flex; flex-wrap:wrap; align-items:center;}
.table-thumb-box a img {width:54px; height:54px; object-fit:cover;}
.table-thumb-box a p {flex:1; min-width:0; padding-left:8px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:left;}

/* table-box */
.table-box {overflow-x:auto; white-space:nowrap;}
.table-box > p {margin:0 0 16px; font-size:16px; color:#222;}
.table-box > p b {font-size:16px; font-weight:600; color:#222;}
.table-box > table thead tr th {border:1px solid #D9D9D9; border-width:1px 0; padding:14px 10px; font-size:14px; font-weight:600; color:#8B8B9E;}
.table-box > table tbody tr td {border-bottom:1px solid #D9D9D9; padding:12px 10px; font-size:14px; color:#1C1B1F;}
.table-box > table tbody tr td .subject {max-width:700px; display:block; font-size:14px; color:#1C1B1F; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align:left;}
.table-box > table tbody tr td:hover .subject {text-decoration:underline;}
.table-box > table tbody tr td .button-box {margin:0 auto;}
.table-box > table tbody tr td .check-box label {justify-content:center;}
.table-box > table tbody tr td .review-image {display:block; background-size:cover; background-position:center; margin:0 auto; width:80px;}
.table-box > table tbody tr td .review-image:after {display:block; content:""; padding-bottom:90%;}
.table-box > table tbody tr td .banner-image {display:block; background-size:cover; background-position:center; margin:0 auto; width:250px;}
.table-box > table tbody tr td .banner-image:after {display:block; content:""; padding-bottom:30%;}
.table-box > table tbody tr td .delivery-image {
    width: 80px;
    height:80px;
    border-radius: 50%;
    overflow: hidden;
    img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
.guide-box .table-box {white-space:wrap;}

.delivery-qna-count {
    display: flex;
    align-items: center;
    justify-content: center;
    p {
        background: var(--color-hover);
        color: #ffffff;
        padding: 8px 12px 8px 10px;
        border-radius: 10px;
    }
}

/* review-item-box */
.review-item-box {display:flex; flex-wrap:wrap; align-items:center; padding:0 24px;}
.review-item-box img {width:84px; height:84px; object-fit:cover;}
.review-item-box div {flex:1; min-width:0; padding:0 0 0 24px;}
.review-item-box div p {font-size:14px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.review-item-box div small {margin: 3px 0 0; font-size:14px; color:#757575; display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
@media (max-width:991px){
.review-item-box {border-top:1px solid #000; padding:24px 12px 0;}
.review-item-box div {padding:0 0 0 12px;}
.mypage-content .review-item-box {border-top: 0; padding-top: 0;}
}

/* review-list-box */
.review-list-box ul li .inner {display:flex; flex-wrap:wrap; border-bottom:1px solid #d9d9d9; padding:24px 0;}
.review-list-box ul li .list-image img {width:84px; height:84px; object-fit:cover;}
.review-list-box ul li .list-image > div {display:none;}
.review-list-box ul li .list-content {flex:1; min-width:0; padding:0 0 0 24px;}
.review-list-box ul li .list-content .star {display:flex; flex-wrap:wrap; align-items:center;color: #8585ff;}
.review-list-box ul li .list-content .star p {font-size:0; width:13.91px; height:13.23px; background:url('../../public/images/icon_user_star.png') no-repeat center / cover;}
.review-list-box ul li .list-content .star p.active {background-image:url('../../public/images/icon_user_star_on.png');}
.review-list-box ul li .list-content > h3 {font-size:16px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.review-list-box ul li .list-content > strong {display:block; font-size:14px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:8px 0 0;}
.review-list-box ul li .list-content > p {font-size:14px; line-height:1.4; color:#6b6b6b; margin:0;}
.review-list-box ul li .list-content > dl {margin:24px 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.review-list-box ul li .list-content > dl dd {margin:0 12px 0 0; font-size:14px; color:#6b6b6b;}
.review-list-box ul li .list-content > dl dd span {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:18px; border-radius:4px; padding:0 8px; font-size:12px; color:#fff; background:var(--color-main-bg);}
.review-list-box ul li .review-item-img {width: 33.333%; aspect-ratio: 1/1;}
.mypage-content .review-item-img img {width: 100%; height: 100%; object-fit: cover;}
.mypage-content .review-list-box ul li .list-button {gap:10px; border-left:1px solid #d9d9d9; padding:0 0 0 42px; margin:0 0 0 42px;height: 100%; display: flex; align-items: center;}
.mypage-content .review-list-box ul li .list-content > dl dd .review-comment span {background: inherit; color: var(--color-black-700); font-size: 14px; height: 100%;}
.mypage-content .review-list-box ul li .list-content > dl dd .review-comment span.material-symbols-rounded {width: 24px; height: 24px;background-image: url(../../public/images/icons.png);background-repeat: no-repeat;background-size: auto 200px;background-position: 0 0;}
@media (max-width:991px){
.review-list-box {border-top:1px solid #000;}
.review-list-box ul li .inner {padding:24px 12px;}
.review-list-box ul li .list-image {width:100%; display:flex; flex-wrap:wrap; align-items:center;}
.review-list-box ul li .list-image > div {display:block; flex:1; min-width:0; padding:0 0 0 12px;}
.review-list-box ul li .list-image > div p {font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; margin:0 0 8px;}
.review-list-box ul li .list-image > div small {display:block; font-size:14px; color:#757575; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.review-list-box ul li .list-content {flex:none; width:100%; padding:0; margin:12px 0 0;}
.review-list-box ul li .list-content > h3 {display:none;}
.review-list-box ul li .lits-content > strong {display:none;}
.review-list-box ul li .list-conetnt > p {font-size:12px;}
.review-list-box ul li .list-content > dl {margin:12px 0 0;}
.review-list-box ul li .list-content > dl dd {margin:0 8px 0 0; font-size:12px;}
.mypage-content .review-list-box {border-top:0;}
.mypage-content .review-list-box ul li .inner {padding: 12px;}
.mypage-content .review-list-box ul li .list-button {border:0; padding:0; margin:12px 0 0; flex-wrap:wrap; justify-content: center;}
}

/* choice-box */
.choice-box {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    overflow: hidden;
    border: 1px solid #d9d9d9;
}
.choice-box > div {
    position: relative;
    overflow: hidden;
    border-right: 1px solid #d9d9d9;
}
.choice-box > div:last-child {
    border-right: none;
}
.choice-box > div:last-of-type {
    border: 0;
}
.choice-box > div input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.choice-box > div label {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    height: 36px;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-main-bg);
    background: #ffffff;
    text-align: center;
}
.choice-box > div input:checked ~ label {
    background: var(--color-main-bg);
    color: #fff;
}
.order-search-box {
    flex-wrap: nowrap !important;
    .select-box {
        margin-right: 10px;
        margin-bottom: 10px;
    }
    .choice-box {
        margin-right: 10px;
        margin-bottom: 10px;
    }
    .date-box {
        margin-right: 10px;
        margin-bottom: 10px;
    }
    .button-box {
        margin: 0 10px 10px;
        button {
            word-break: keep-all;
        }
    }
}
@media (max-width: 991px) {
    .order-search-box {
        flex-direction: column;
        justify-content: center;
        flex-wrap: wrap;
        .select-box {
            margin-right: 10px;
        }
        .choice-box {
            margin-right: 0;
            > div {
                width: 20%;
                label {
                    padding: 0 10px;
                }
            }
        }
        .date-box {
            margin-right: 0;
        }
        > div {
            width: 100%;
        }
        .button-box {
            margin: 0 0 10px;
        }
    }
}
@media (max-width: 470px) {
    .order-search-box {
        .select-box {
            width: 100%;
            margin-right: 0;
        }
    }
}

/* date-box */
.date-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.date-box .date {
    flex: 1;
    min-width: 0;
}
.date-box .date input {
    display: block;
    width: 100%;
    height: 38px;
    line-height: 36px;
    color: #222;
    border: 1px solid #d9d9d9;
    padding: 0 13px;
}
.date-box em {
    margin: 0 12px;
    font-size: 14px;
}
.choice-box ~ .date-box {
    margin-left: 20px;
}
.lg-none {display: block;}
@media (max-width: 991px) {
    .choice-box ~ .date-box {
        margin-left: 0;
        margin-top: 10px;
    }
    .lg-none {display: none;}
}
/* file-image-box */
.file-image-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.file-image-box > p {
    margin: 0 12px 0 0;
    flex: 1;
    min-width: 0;
    height: 36px;
    line-height: 35px;
    border: 1px solid #d9d9d9;
    padding: 0 12px;
    font-size: 14px;
    color: #222;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.file-image-box > label {
    width: 100%;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    height: 36px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-black-700);
    background: #ffffff;
    border: 1px solid var(--color-black-700);
}
.file-image-box > label input {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.file-image-box input[type="file"] {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
}
.file-image-box label:has(input[type="file"]) {
    cursor: pointer;
}
.file-image-box label:has(input[disabled]) {
    cursor: default;
}
.file-image-box > ul {
    width: 100%;
    margin: 12px 0 0;
    display: flex;
    flex-wrap: wrap;
}
.file-image-box > ul li {
    width: calc(33.33% - 8px);
    margin: 0 4px 8px !important;
    background-size: cover;
    background-position: center;
    position: relative;
    aspect-ratio: 1/0.6;
    border: 1px solid #ddd;
}
.file-image-box > ul li a.delete {
    position: absolute;
    right: 0;
    top: 0;
    width: 14px;
    height: 14px;
    font-size: 0;
    background: url("../../public/images/icon_file_remove.png") no-repeat center /cover;
}
.file-image-box > ul li.banner-thumb {
    width: 100%;
    height: 150px;
}
.file-image-box > ul li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* paging-box */
.paging-box {margin:42px 0 0;}
.paging-box ul {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.paging-box ul li {margin:0 12px 0 0;}
.paging-box ul li:last-of-type {margin:0;}
.paging-box ul li a {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; font-size:16px; font-weight:600;}
.paging-box ul li.active a {background:var(--color-main-border_font); color:#fff;}
.paging-box ul li.pg a {font-size:0; background-size:24px; background-position:center;}
.paging-box ul li.pg.first a {background-image:url('../../public/images/icon_user_paging_first.png');}
.paging-box ul li.pg.prev a {background-image:url('../../public/images/icon_user_paging_prev.png');}
.paging-box ul li.pg.next a {background-image:url('../../public/images/icon_user_paging_next.png');}
.paging-box ul li.pg.last a {background-image:url('../../public/images/icon_user_paging_last.png');}
@media (max-width:991px){
.paging-box ul li {margin:0 8px 0 0;}
.paging-box ul li a {width:24px; height:24px; font-size:14px;}
.paging-box ul li.pg a {background-size:16px;}
}

/* sca-box */
.sca-box ul {display:flex; flex-wrap:wrap; margin:0 -6px -12px;}
.sca-box ul li {width:calc(16.66% - 12px); margin:0 6px 12px;}
.sca-box ul li > * {border:1px solid #757575; color:#757575; height:43px; border-radius:50px; font-size:16px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.sca-box ul li.active > * {color:#000; border-color:#000; font-weight:500;}
@media (max-width:991px){
.sca-box ul li {width:calc(25% - 12px);}
.sca-box ul li > * {height:38px; font-size:14px;}
}
@media (max-width:767px){
.sca-box ul li {width:calc(33.33% - 12px);}
}

/* board-view-box */
.board-view-box .view-review {padding:24px; display:flex; flex-wrap:wrap; align-items:center; border-bottom:1px solid #d9d9d9;}
.board-view-box .view-review img {width:84px; height:84px; object-fit:cover;}
.board-view-box .view-review > div {flex:1; min-width:0; padding:0 0 0 20px;}
.board-view-box .view-review > div .star {display:flex; flex-wrap:wrap; align-items:center;color: #8585ff;}
.board-view-box .view-review > div .star p {font-size:0; width:13.91px; height:13.23px; background:url('../../public/images/icon_user_star.png') no-repeat center / cover;}
.board-view-box .view-review > div .star p.active {background-image:url('../../public/images/icon_user_star_on.png');}
.board-view-box .view-review > div p {margin:7px 0 0; font-size:14px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.board-view-box .view-review > div small {display:block; margin:5px 0 0; font-size:14px; color:#757575; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.board-view-box .view-info {border-bottom:1px solid #d9d9d9; padding:12px 24px;}
.board-view-box .view-info dl {display:flex; flex-wrap:wrap; align-items:center;}
.board-view-box .view-info dl dd {display:flex; flex-wrap:wrap; align-items:center; margin:0 24px 0 0;}
.board-view-box .view-info dl dd:last-of-type {margin:0;}
.board-view-box .view-info dl dd b {font-size:14px; color:#6b6b6b; margin:0 8px 0 0;}
.board-view-box .view-info dl dd p {font-size:14px; color:#6b6b6b; font-weight:600;}
.board-view-box .view-content {padding:42px 24px;}
.board-view-box .view-content p {font-size:14px; line-height:1.7; color:#121212;}
.board-view-box .view-content:has(img) {margin:0 auto;}
.board-view-box .view-content img {display:block; max-width:100%; width: 33.3%; margin: 0 5px}
.board-view-box .view-subject {border-bottom:1px solid #d9d9d9; padding:24px;}
.board-view-box .view-subject p {font-size:18px; font-weight:600; line-height:1.4; margin:0 0 15px;}
.board-view-box .view-subject span {font-size:16px;}
@media (max-width:991px){
.board-view-box {border-top:1px solid #000;}
.board-view-box .view-review {padding:12px;}
.board-view-box .view-review > div {padding:0 0 0 10px;}
.board-view-box .view-info {padding:12px;}
.board-view-box .view-info dl dd {margin:0 10px 0 0;}
.board-view-box .view-info dl dd b {font-size:12px; margin:0 5px 0 0;}
.board-view-box .view-info dl dd p {font-size:12px;}
.board-view-box .view-content {padding:24px 12px;}
.board-view-box .view-subject {padding:20px 12px;}
.board-view-box .view-subject p {font-size:16px; margin:0 0 10px;}
.board-view-box .view-subject span {font-size:14px;}
.mypage-content .board-view-box {border-top: 0;}
}

/* board-search-box */
.board-search-box {background:#F6F6F6; border-top:1px solid #000; padding:12px;}
.board-search-box form {display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.board-search-box form .select-box {background:#fff; margin:0 12px 0 0; min-width:90px;}
.board-search-box form .inner {display:flex; flex-wrap:wrap; align-items:center;}
.board-search-box form .inner .input-box {width:250px;}
.board-search-box form .inner .input-box input {height:37px;}
.board-search-box form .inner .button-box .btn {height:37px !important; margin:0 0 0 5px; background:#757575;}
@media (max-width:991px){
.board-search-box form .select-box {margin:0 0 5px; width:100%;}
.board-search-box form .inner {width:100%;}
.board-search-box form .inner .input-box {flex:1; min-width:0;}
}

/* board-list-box */
.board-list-box table thead tr th {border-top:1px solid #000; border-bottom:1px solid #d9d9d9; height:50px; padding:0 24px; font-size:14px; font-weight:600;}
.board-list-box table tbody tr td {border-bottom:1px solid #d9d9d9; padding:15px 24px; font-size:14px; color:#6b6b6b;}
.board-list-box table tbody tr td.m {display:none;}
.board-list-box table tbody tr td a.subject {display:block; text-align:left; width:600px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; color:#6b6b6b;}
@media (max-width:1300px){
.board-list-box table tbody tr td a.subject {width:350px;}
}
@media (max-width:991px){
.board-list-box table {border-top:1px solid #000;}
.board-list-box table thead {display:none;}
.board-list-box table tbody tr td.pc {display:none;}
.board-list-box table tbody tr td.m {display:table-cell; padding:0;}
.board-list-box table tbody tr td.m a {display:block; text-align:left; padding:15px 10px;}
.board-list-box table tbody tr td.m a p {font-size:15px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:#000;}
.board-list-box table tbody tr td.m a dl {margin:8px 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.board-list-box table tbody tr td.m a dl dd {margin:0 5px 0 0; font-size:12px; color:#6b6b6b;}
.board-list-box table tbody tr td.m a dl dd:last-of-type {margin:0;}
}

/* comment-write-box */
.comment-write-box {background:#F6F6F6; padding:24px; border-top:1px solid #000;}
.comment-write-box textarea {display:block; width:100%; height:150px; background:#fff; border:1px solid #d9d9d9; padding:14px; font-size:16px; line-height:1.4; color:#111;}
.comment-write-box textarea::placeholder {color:#6b6b6b;}
.comment-write-box .button-box {margin:24px 0 0; justify-content:flex-end;}
.comment-write-box .button-box .btn {width:115px; flex:none;}
@media (max-width:991px){
.comment-write-box {padding:12px;}
.comment-write-box textarea {height:100px; padding:10px; font-size:14px;}
.comment-write-box .button-box {margin:12px 0 0;}
.comment-write-box .button-box .btn {width:100px;}
}

/* comment-list-box */
.comment-list-box {border-top:1px solid #000; margin:24px 0 0;}
.comment-list-box ul li {border-bottom:1px solid #d9d9d9; padding:16px 24px;}
.comment-list-box ul li:last-of-type {border:0;}
.comment-list-box ul li strong {display:block; font-size:16px; font-weight:600; line-height:1.4; margin:0 0 12px;}
.comment-list-box ul li p {font-size:16px; line-height:1.4; color:#6b6b6b;}
@media (max-width:991px){
.comment-list-box ul li {padding:12px;}
.comment-list-box ul li strong {font-size:14px;}
.comment-list-box ul li p {font-size:14px;}
}

/* list-none-box */
.list-none-box {border-top:1px solid #000; border-bottom:1px solid #d9d9d9; padding:42px 0;}
.list-none-box p {text-align:center; font-size:16px; color:#121212; padding:16px 0;}

/* list-top-box */
.list-top-box {margin:0 0 24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.list-top-box p {font-size:18px; font-weight:600; color:#757575;}
.list-top-box p b {font-size:18px; font-weight:600; color:#000;}
.list-top-box ul {display:flex; flex-wrap:wrap; align-items:center;}
.list-top-box ul li {display:flex; flex-wrap:wrap; align-items:center;}
.list-top-box ul li:after {display:inline-block; content:""; width:1px; height:10px; margin:0 12px; background:#d9d9d9;}
.list-top-box ul li:last-of-type:after {display:none;}
.list-top-box ul li > * {font-size:16px;}
.list-top-box ul li.active > * {color:var(--color-main-bg);}
.list-top-box .select-box {display:none;}
@media (max-width:991px){
    .list-top-box p {font-size:14px;}
    .list-top-box p b {font-size:14px;}
    .list-top-box ul {display:none;}
    .list-top-box .select-box {display:flex; border:0;}
    .list-top-box .select-box select {border:0; height:24px; background-position:right center; padding:0 24px 0 12px;}
}

/* item-list-box */
.item-list-box ul {display:flex; flex-wrap:wrap; margin:0 -12px -42px;}
.item-list-box ul li {width:calc(25% - 24px); margin:0 12px 42px;}
.item-list-box ul li .list-image {display:block; content:""; position:relative; background-size:cover; background-position:center;}
.item-list-box ul li .list-image:after {display:block; content:""; padding-bottom:100%;}
.item-list-box ul li .sale {position:absolute; z-index: 9; right:10px; top:10px; width:44px; height:44px; border-radius:50%; background:#000; display:flex; flex-wrap:wrap; align-items:baseline; align-content:center; justify-content:center;}
.item-list-box ul li .sale strong {font-size:16px; font-weight:600; color:#fff;}
.item-list-box ul li .sale em {font-size:12px; font-weight:600; color:#fff;}
.item-list-box ul li .list-content {margin:24px 0 0; position:relative;}
.item-list-box ul li .list-content .subject {display:flex; align-items:center;}
.item-list-box ul li .list-content .subject p {flex:1; min-width:0; font-size:18px; font-weight:600;}/*padding-right:12px;*/
.item-list-box ul li .list-content .subject .like {display:none; width:20px; height:20px; font-size:0; position:relative; z-index:3;} /*background:url('../../public/images/icon_like.png') no-repeat center / cover;*/
/*.item-list-box ul li .list-content .subject .like.active {background-image:url('../../public/images/icon_like_on.png');}*/
.item-list-box ul li .list-content .content {margin:4px 0 0;}
.item-list-box ul li .list-content .content p {font-size:16px; color:#757575; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.item-list-box ul li .list-content .price {margin:12px 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.item-list-box ul li .list-content .price strong {font-size:18px; font-weight:600; margin:0 12px 0 0;}
.item-list-box ul li .list-content .price del {font-size:16px; color:#a2a2a2;}
.item-list-box ul li .list-content .sticker {display:flex; flex-wrap:wrap; align-items:center; margin:12px 0 0;}
.item-list-box ul li .list-content .sticker span {display:flex; flex-wrap:wrap; align-items:center; margin:0 4px 5px 0; height:18px; padding:0 8px; font-size:12px; border-radius:4px;}
.item-list-box ul li .list-content .sticker span.label-purple {background:var(--color-main-bg); color:#fff;}
.item-list-box ul li .list-content .sticker span.label-white {color:#a2a2a2; border:1px solid #a2a2a2;}
.item-list-box ul li .list-content .sticker span.label-pink {background:#FFABC4; color:#fff;}
.item-list-box ul li .list-content .sticker span.label-red {background:#EE4545; color:#fff;}
.item-list-box ul li .list-content .link {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0;}
@media (max-width:991px){
.item-list-box ul {margin:0 -6px -24px;}
/*.item-list-box ul li {width:calc(50% - 12px); margin:0 6px 24px;}*/
.item-list-box ul li .sale {right:4px; top:4px; width:34px; height:34px;}
.item-list-box ul li .sale strong {font-size:14px;}
.item-list-box ul li .sale em {font-size:11px;}
.item-list-box ul li .list-content {margin:12px 0 0;}
.item-list-box ul li .list-content .subject p {font-size:16px;}
.item-list-box ul li .list-content .subject .like {width:15px; height:15px;}
.item-list-box ul li .list-content .content p {font-size:13px; display:-webkit-box; white-space:normal; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-height:1.3;}
.item-list-box ul li .list-content .price {margin:4px 0 0; flex-direction: column-reverse; align-items:flex-start;}
.item-list-box ul li .list-content .price strong {font-size:14px;}
.item-list-box ul li .list-content .price del {font-size:12px; margin-bottom: 2px}
.item-list-box ul li .list-content .sticker {margin:4px 0 0;}
.item-list-box ul li .list-content .sticker span {height:16px; font-size:10px;}
}
/*@media (max-width: 690px) {*/
/*    .item-list-box ul li {width:calc(33% - 12px); margin:0 6px 24px;}*/
/*}*/
@media (max-width: 570px) {
    .item-list-box ul li {width:calc(50% - 12px); margin:0 6px 24px;}
}

/* item-view-box */
.item-view-box {display:flex; flex-wrap:wrap;}
.item-view-box .view-left {width:45%; height: auto; margin:0 70px 0 0;}
.item-view-box .view-left .big-swiper {margin:0 0 8px; position:relative; overflow:hidden; height: 540px;}
.item-view-box .view-left .big-swiper img {width: 100%; height:100%; object-fit:cover; }
.item-view-box .view-left .big-swiper .swiper-slide {background-size:cover; background-position:center;}
.item-view-box .view-left .big-swiper .swiper-slide:after {display:block; content:""; padding-bottom:100%;}
.item-view-box .view-left .big-swiper .sticker-box {position:absolute; right:0; top:0; z-index:11;}
.item-view-box .view-left .thumb-swiper {padding:0 1px;}
.item-view-box .view-left .thumb-swiper .swiper-slide-thumb-active {border: 1px solid var(--color-main-border_font)}
.item-view-box .view-left .thumb-swiper .swiper-slide button {cursor:pointer; position:relative; display:block; transition:all ease 0.5s; font-size:0; width:100%; background-size:cover; background-position:center; border:1px solid #eee;}
.item-view-box .view-left .thumb-swiper .swiper-slide button:before {display:block; content:""; padding-bottom:100%;}
.item-view-box .view-left .thumb-swiper .swiper-slide button:after {transition:all ease 0.5s; position:absolute; left:0; top:0; width:100%; height:100%; content:""; background:rgba(255,255,255,0.7);}
.item-view-box .view-left .thumb-swiper .swiper-slide.active button {border-color:#d9d9d9;}
.item-view-box .view-left .thumb-swiper .swiper-slide.active button:after {opacity:0;}
.item-view-box .view-left .thumb-swiper .swiper-slide.mini-thumb {object-fit: cover; aspect-ratio: 1/1;}
.item-view-box .view-right {flex:1; min-width:0;}
.item-view-box .view-right h2 {margin:0 0 12px; font-size:28px; font-weight:600; line-height:1.3;}
.item-view-box .view-right .sticker {display:flex; flex-wrap:wrap; align-items:center;}
.item-view-box .view-right .sticker span {display:flex; flex-wrap:wrap; align-items:center; margin:0 4px 5px 0; height:18px; padding:0 8px; font-size:12px; border-radius:4px;}
.item-view-box .view-right .sticker span.label-purple {background:var(--color-main-bg); color:#fff;}
.item-view-box .view-right .sticker span.label-white {color:#a2a2a2; border:1px solid #a2a2a2;}
.item-view-box .view-right .sticker span.label-pink {background:#FFABC4; color:#fff;}
.item-view-box .view-right .sticker span.label-red {background:#EE4545; color:#fff;}
.item-view-box .view-right .score {display:flex; flex-wrap:wrap; align-items:center; margin:5px 0 0;}
.item-view-box .view-right .score .star {color: #8585ff; font-size:16px;}
.item-view-box .view-right .score p {font-size:0; width:19.17px; height:18.23px;}
.item-view-box .view-right .score small {margin:0 0 0 12px; font-size:14px;}
.item-view-box .view-right .price {display:flex; flex-wrap:wrap; align-items:center; margin:12px 0 0;}
.item-view-box .view-right .price strong {font-size:18px; font-weight:600; color:#000;}
.item-view-box .view-right .price del {margin:0 0 0 12px; font-size:16px; color:#a2a2a2;}
.item-view-box .view-right .info {border:1px solid #d9d9d9; border-width:1px 0; margin:24px 0; padding:20px 0;}
.item-view-box .view-right .info dl dd {margin:6px 0 6px; display:flex; flex-wrap:wrap;}
.item-view-box .view-right .info dl dd b {width:100px; min-width: 100px; font-size:14px; font-weight:500; line-height:1.3;}
.item-view-box .view-right .info dl dd p {flex:1; min-width:0; font-size:14px; font-weight:500; line-height:1.3;}
.item-view-box .view-right .option:has(.select-box) {border-bottom: 1px solid #d9d9d9; padding-bottom: 15px; margin-bottom: 24px}
.item-view-box .view-right .option:has(.quantity-box) {border-bottom: 1px solid #d9d9d9; padding-bottom: 15px}
.item-view-box .view-right .option > p {font-size:14px; font-weight:500; line-height:1.3; color:#a2a2a2; margin:0 0 12px;}
.item-view-box .view-right .option > p b {font-size:14px; font-weight:500; line-height:1.3; color:#757575;}
.item-view-box .view-right .option .select-box {margin:0 0 12px;}
.item-view-box .view-right .option .select-box select {height:44px;}
.item-view-box .view-right .option .quantity-box {margin:0 0 12px;}
.item-view-box .view-right .total {margin:42px 0 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.item-view-box .view-right .total > b {font-size:14px; font-weight:500; color:#757575;}
.item-view-box .view-right .total > div {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:baseline; justify-content:flex-end;}
.item-view-box .view-right .total > div strong {font-size:24px; font-weight:600;}
.item-view-box .view-right .total > div em {margin:0 0 0 12px; font-size:18px;}
.item-view-box .view-right .button {margin:42px 0 0; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.item-view-box .view-right .button .like {width:45px; height:45px; font-size:0; border:1px solid #a2a2a2; border-radius:50%;}
.item-view-box .view-right .button .button-box {flex:1; min-width:0; margin:0 0 0 8px;}
.item-view-box .view-right .button .button-box .btn {font-size:18px;}
.all-product-move .button-box a.btn {height:30px; border-radius: 4px;}
@media (max-width:991px){
.item-view-box .view-left {width:100%; height: 350px; margin:0; overflow: hidden;}
.item-view-box .view-left .big-swiper {width:calc(100%); height: 100%}
    .item-view-box .view-left .thumb-swiper {display: none;}
.item-view-box .view-right {flex:none; width:100%; margin:24px 0 0;}
.item-view-box .view-right h2 {font-size:22px; margin:0 0 12px;}
.item-view-box .view-right .option .quantity-box .inner {width:auto;}
.item-view-box .view-right .total {margin:24px 0 0;}
.item-view-box .view-right .total > div strong {font-size:20px;}
.item-view-box .view-right .total > div em {margin:0 0 0 8px; font-size:16px;}
.item-view-box .view-right .button {margin:24px 0 0;}
.item-view-box .view-right .button .button-box .btn {height:45px;}
}

/* item-review-box */
.item-review-box ul {display:flex; flex-wrap:wrap; margin:0 auto;max-width: 1224px; width: 100%;}
.item-review-box ul li {width:calc(100% - 24px); height: 100%; margin:0 auto; padding:0 12px 45px; border-bottom:1px solid #d9d9d9;display: flex; flex-direction: column;justify-content: center; align-items: flex-start;}
.item-review-box ul li .star {display:flex; flex-wrap:wrap; align-items:center; margin:0;color: #8585ff;}
.item-review-box ul li .star p {font-size:0; width:13.91px; height:13.23px;}
.item-review-box ul li .text {margin:10px 0 0; text-align: left}
.item-review-box ul li .text p {font-size:14px; line-height:1.4; color:#6b6b6b; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; text-overflow:ellipsis;}
.item-review-box ul li .text dl {margin: 24px 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.item-review-box ul li .text dl dd {margin:0 12px 0 0; font-size:14px; color:#6b6b6b;}
.item-review-box ul li .text dl dd:last-of-type {margin:0;}
.item-review-box .review-img {
    width: 50%;
    height: 100%;
    margin-top: 20px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
.item-review-box .review-img.click-size {
    width: 100%;
    height: 100%;
}
.item-review-box .review-img img {
    width: 33%;
    height: 100px;
    aspect-ratio: 1/1;
    object-fit: cover;
    cursor: pointer;
    margin: 0 10px 0 0;
}
@media (max-width:991px){
    .item-review-box {margin:-24px 0 0;}
    .item-review-box ul li {width:100%; margin:0 auto; padding:12px 12px 20px;align-items: flex-start;}
    .item-review-box ul li .text dl {margin:12px 0 0;}
    .item-review-box ul li .text dl dd {font-size:12px; margin:0 5px 0 0;}
    .item-review-box .review-img {
        width: 100%;
        height: 100%;
        justify-content: flex-start;
    }
    .item-review-box .review-img.click-size {
        flex-direction: column;
        height: 100%;
    }
    .item-review-box .review-img.click-size img {
        margin-right: 0;
        margin-bottom: 10px;
        width: 100%;
        object-fit: contain;
    }
}

/* item-qna-box */
.item-qna-box {margin:-24px 0 0;}
.item-qna-box ul {width: 100%; max-width: 1224px; margin: 0 auto;}
.item-qna-box ul li {border-bottom:1px solid #d9d9d9;}
.item-qna-box ul li .inner {display:block; padding:24px 42px;}
.item-qna-box ul li .inner strong {display:block; font-size:16px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.item-qna-box ul li .inner p {margin:10px 0 0; font-size:14px; line-height:1.3; color:#6b6b6b; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}
.item-qna-box ul li .inner dl {margin:24px 0 0; display:flex; flex-wrap:wrap; align-items:center;}
.item-qna-box ul li .inner dl dd {margin:0 12px 0 0; font-size:14px; color:#6b6b6b;}
.item-qna-box ul li .inner dl dd span {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:18px; border-radius:4px; padding:0 8px; font-size:12px; color:#fff; background:var(--color-main-bg);}
@media (max-width:991px){
.item-qna-box ul li .inner {padding:24px 12px;}
.item-qna-box ul li .inner strong {font-size:14px;}
.item-qna-box ul li .inner p {font-size:13px; margin:8px 0 0;}
.item-qna-box ul li .inner dl {margin:8px 0 0;}
.item-qna-box ul li .inner dl dd {margin:0 8px 0 0; font-size:12px;}
}

/*item-view review*/
.review-comment {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: flex-start;
    margin-top: 20px;
    position: relative;
}
.review-comment p {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
.review-comment .face-icon {
    align-self: flex-start;
    margin-right: 10px;
    padding-top: 8px;
    color: var(--color-main-border_font);
    position: relative;
}
.review-comment .face-icon .material-symbols-rounded {
    font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}
.review-comment .face-icon .comment-triangle {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    z-index: -1;
    border-radius: 10px;
    border-bottom: 20px solid transparent;
    border-top: 20px solid #f4f4ff;
    right: -45px;
    border-right: 20px solid #f4f4ff;
    border-left: 20px solid transparent;
}
.review-comment .comment-box {
    padding: 13px 15px 15px;
    background: #f4f4ff;
    border-radius: 10px;
    text-align: left;
}
.review-comment.qna-comment .face-icon .comment-triangle {
    border-top: 20px solid var(--color-gray-200);
    border-right: 20px solid var(--color-gray-200);
}
.review-comment.qna-comment .comment-box {
    background: var(--color-gray-200);
}

.table-info-box > ul > li dl dd.dd-vertical {
    flex-wrap: nowrap;
}
.table-info-box > ul > li dl dd.dd-vertical .review-image {
    height: 100%;
    width: 100%;
    flex-direction: row;
    flex-wrap: nowrap !important;
    margin-bottom: 20px;
    padding-bottom: 5px;
    white-space: nowrap;
}
.table-info-box > ul > li dl dd.dd-vertical .review-image::-webkit-scrollbar {
    height: 10px;
}
.table-info-box > ul > li dl dd.dd-vertical .review-image::-webkit-scrollbar-thumb {
    cursor: pointer;
    background: #000;
    border-radius: 20px;
}
.table-info-box > ul > li dl dd.dd-vertical .review-image img {
    width: 90%;
    height: 97%;
    object-fit: cover;
    border: 1px solid #d9d9d9;
    border-radius: 6px;
}
.order-list-box ul li dl dd > div.order-product {
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    margin-left: 10px;
}
.order-list-box ul li dl dd > div.order-product > p {
    margin: 4px 0;
}
.order-list-box ul li dl dd .order-img {
    width: 80px;
    height: 80px;
    object-fit: cover;
}

/* item-cart-box */
.item-cart-box {display:flex; flex-direction: row; justify-content: center; align-items: stretch;}
.item-cart-box .item-cart-bottom {width: 455px; margin-left: 60px; flex: 3;}
.item-cart-box .item-cart-bottom .item-cart-sticky {position: sticky; top: 30px; padding: 20px; border: 1px solid var(--color-gray-200); border-radius: 10px; margin-top: 30px;}
/*.item-cart-box .cart-list .list-head {border-top:1px solid #000; display:flex; flex-wrap:wrap; align-items:center;}*/
.item-cart-box .cart-list table {height: 100%;}
.item-cart-box .cart-list .list-head > div {border-bottom:1px solid #d9d9d9; font-size:14px; color:#121212; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:50px;}
/*.item-cart-box .cart-list .list-head .check {width:68px; display:flex; flex-wrap:wrap; align-items:center;}*/
.item-cart-box .cart-list .list-head .check .check-box {margin:0 auto;}
.item-cart-box .cart-list .list-head .info {flex:1; min-width:0; padding:0 24px; justify-content:flex-start;}
.item-cart-box .cart-list .list-head .cell {width:120px; text-align:center;}
.item-cart-box .cart-list .list-head .quantity {width:140px;}
.item-cart-box .cart-list .list-body ul li {border-bottom:1px solid #d9d9d9; display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-list .list-body ul li .list-thumb {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; padding:14px 24px;}
.item-cart-box .cart-list .list-body ul li .list-thumb img {width:84px; height:84px; object-fit:cover;} /*margin:0 0 0 24px;*/
.item-cart-box .cart-list .list-body ul li .list-thumb .content {flex:1; min-width:0; padding:0 0 0 15px;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content p {margin:4px 0 0; font-size:14px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content .sticker {display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content .sticker span {display:flex; flex-wrap:wrap; align-items:center; margin:0 4px 5px 0; height:18px; padding:0 8px; font-size:12px; border-radius:4px;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content .sticker span.label-purple {background:var(--color-main-bg); color:#fff;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content .sticker span.label-white {color:#a2a2a2; border:1px solid #a2a2a2;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content .sticker span.label-pink {background:#FFABC4; color:#fff;}
.item-cart-box .cart-list .list-body ul li .list-thumb .content .sticker span.label-red {background:#EE4545; color:#fff;}
.item-cart-box .cart-list .list-body ul li .list-quantity {width:140px; display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-list .list-body ul li .list-quantity .quantity-box .inner > div {width:auto; height:23px; margin:0;}
.item-cart-box .cart-list .list-body ul li .list-quantity .quantity-box {border:0; padding:0; flex:1; min-width:0;}
.item-cart-box .cart-list .list-body ul li .list-quantity .quantity-box button {width:23px; height:23px;}
.item-cart-box .cart-list .list-body ul li .list-quantity .quantity-box input {width:44px; height:23px; font-size:14px;}
.item-cart-box .cart-list .list-body ul li .list-quantity .change {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:23px; border:1px solid #d9d9d9; padding:0 10px; font-size:12px; color:#303030; margin:0 0 0 8px;}
.item-cart-box .cart-list .list-body ul li .list-cell {width:120px; text-align:center; font-size:14px; font-weight:600; color:#6b6b6b;}
.item-cart-box .cart-list .list-body ul li .list-cell .link {width:84px; height:22px; margin:0 auto 4px; border:1px solid #d9d9d9; font-size:12px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.item-cart-box .cart-list .list-body ul li .list-cell .link.black {background:#303030; color:#fff; border-color:#303030;}
.item-cart-box .cart-list .list-body ul li .list-cell .link.delete:before {display:inline-block; content:""; margin:0 4px 0 0; width:13px; height:13px; background:url('../../public/images/icon_cart_delete.png') no-repeat center / cover;}
.item-cart-box .cart-list .list-body ul li .list-mobile {display:none;}
.item-cart-box .cart-guide {display:flex; flex-wrap:wrap; position:relative; border-bottom:1px solid #d9d9d9; padding:12px 24px;}
.item-cart-box .cart-guide p {font-size:12px; color:#121212; line-height:1.4; word-break:keep-all; padding:0 0 0 28px;}
.item-cart-box .cart-guide:before {display:inline-block; content:""; width:20px; height:20px; position:absolute; left:24px; top:10px; background:url('../../public/images/icon_cart_guide.png') no-repeat center / cover;}
.item-cart-box .cart-button {padding:24px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.item-cart-box .cart-button > div {display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-button > div > b {font-size:12px; font-weight:600; margin:0 20px 0 0;}
.item-cart-box .cart-button > div > div {display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-button .link {padding:0 12px; margin:0 8px 0 0; border:1px solid #d9d9d9; font-size:12px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:22px;}
.item-cart-box .cart-button .link:last-of-type {margin:0;}
.item-cart-box .cart-button .link.delete:before {display:inline-block; content:""; margin:0 4px 0 0; width:13px; height:13px; background:url('../../public/images/icon_cart_delete.png') no-repeat center / cover;}
.item-cart-box .cart-total {border-top:1px solid #000; padding: 0 10px; display: flex; flex-direction: column;}
.item-cart-box .cart-total .list-head {flex-direction: column; border-bottom: none; display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-total .list-head b {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:50px; font-size:14px; font-weight:600; color:#121212; flex:1; min-width:0;margin-bottom: 5px}
.item-cart-box .cart-total .list-body {display:flex; flex-wrap:wrap; flex-direction: column; align-items: flex-end}
.item-cart-box .cart-total .list-body > div {flex:1; min-width:0; height:72px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; position:relative; font-size:18px; font-weight:600; color:#1C1B1F;}
.item-cart-box .cart-total > .flex {justify-content: space-between; padding: 10px 0}
.item-cart-box .cart-total .list-mobile {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; border-top:1px solid #000; padding:15px 0 0;}
.item-cart-box .cart-total .list-mobile b {font-size:16px; font-weight:600;}
.item-cart-box .cart-total .list-mobile p {font-size:20px; font-weight:600;}
@media (max-width:1200px){
    .item-cart-box .cart-list .list-head > div {height:40px;}
    .item-cart-box .cart-list .list-head .check {flex:1; min-width:0; justify-content:flex-start;}
    .item-cart-box .cart-list .list-head .check .check-box {margin:0 5px;}
    .item-cart-box .cart-list .list-head .check .check-box label {margin:0;}
    .item-cart-box .cart-list .list-head .check .check-box label:before {width:20px; height:20px;}
    .item-cart-box .cart-list .list-head .info {display:none !important;}
    .item-cart-box .cart-list .list-head .cell {display:none !important;}
    .item-cart-box .cart-list .list-head .quantity {display:none !important;}
    .item-cart-box .cart-list .list-body ul li {padding:0 0 12px;}
    .item-cart-box .cart-list .list-body ul li .list-thumb {flex:none; width:100%; padding:12px 0;}
    .item-cart-box .cart-list .list-body ul li .list-thumb .check-box label:before {width:20px; height:20px;}
    .item-cart-box .cart-list .list-body ul li .list-thumb img {width:70px; height:70px; margin:0 0 0 8px;}
    .item-cart-box .cart-list .list-body ul li .list-thumb .content {padding:0 0 0 8px;}
    .item-cart-box .cart-list .list-body ul li .list-quantity {width:100%; justify-content:flex-end;}
    .item-cart-box .cart-list .list-body ul li .list-quantity .quantity-box {flex:none;}
    .item-cart-box .cart-list .list-body ul li .list-quantity .quantity-box > .inner {margin:0;}
    .item-cart-box .cart-list .list-body ul li .list-cell:not(.button) {display:none;}
    .item-cart-box .cart-list .list-body ul li .list-cell.button {width:100%; display:flex; flex-wrap:wrap; align-items:center; margin:12px 0 0;}
    .item-cart-box .cart-list .list-body ul li .list-cell.button .link {flex:1; min-width:0; margin:0 4px 0 0; height:33px; padding:0; font-size:14px;}
    .item-cart-box .cart-list .list-body ul li .list-cell.button .link:last-of-type {margin:0;}
    .item-cart-box .cart-list .list-body ul li .list-mobile {display:block; margin:12px 0 0; width:100%;}
    .item-cart-box .cart-list .list-body ul li .list-mobile dl dd {margin:0 0 8px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
    .item-cart-box .cart-list .list-body ul li .list-mobile dl dd:last-of-type {margin:0;}
    .item-cart-box .cart-list .list-body ul li .list-mobile dl dd b {font-size:15px; color:#121212;}
    .item-cart-box .cart-list .list-body ul li .list-mobile dl dd p {font-size:14px; font-weight:600; color:#6b6b6b;}
}
@media (max-width:991px){
    .item-cart-box {flex-direction: column; align-items: center;}
    .item-cart-box .item-cart-bottom {width: 100%; margin-left: 0;}
    .item-cart-box .item-cart-bottom .item-cart-sticky {position: static; padding: 0; border: none; margin: 0; border-radius: 0;}
    .item-cart-box .cart-guide {padding:12px;}
    .item-cart-box .cart-guide p {padding:0 0 0 20px;}
    .item-cart-box .cart-guide:before {width:16px; height:16px; top:12px; left:12px;}
    .item-cart-box .cart-button {padding:24px 10px;}
    .item-cart-box .cart-button > div {width:100%; margin:0 0 8px;}
    .item-cart-box .cart-button > div:last-of-type {margin:0;}
    .item-cart-box .cart-button > div > b {width:100%; margin:0 0 4px; line-height:1.5; font-size:14px;}
    .item-cart-box .cart-button > div > div {width:100%;}
    .item-cart-box .cart-button > div .link {flex:1; min-width:0; padding:0; height:27px; font-size:13px;}
    .item-cart-box .cart-list {border: none;}
}

.progress {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
    margin-top: 10px;
}
.progress span {
    font-size: 30px;
    animation: rotate_image 1s linear infinite;
    transform-origin: 50% 50%;
}

@keyframes rotate_image {
    100% {
        transform: rotate(360deg);
    }
}

/*장바구니*/
.guide-text-box {
    border: 1px solid #dddddd;
    padding: 20px;
    margin: 0 10px;
    color: var(--color-gray-700);
}
.guide-text-box h3 {
    color: #222222;
    font-weight: bold;
    font-size: 16px;
}
.guide-text-box dl {
    padding-left: 10px;
}
.guide-text-box dl dt {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 15px;
}
.guide-text-box dl dd {
    padding: 0 5px 10px;
}
.guide-text-box dl dd b {
    margin-right: 5px;
}
@media (max-width: 1200px) {
    .guide-text-box dl {
        padding: 0;
    }
    .guide-text-box dl dd {
        padding: 0 0 10px;
    }
}

.cart-thumb-info {
    flex-direction: column;
}
.list-body .check-box {
    margin: 0 5px;
}

.item-cart-box .cart-list {flex: 5; width: 100%; border-left: 1px solid var(--color-gray-200); border-right: 1px solid var(--color-gray-200);}
.item-cart-box .cart-list thead tr th {border-bottom: 1px solid #ddd}
.item-cart-box .cart-list .list-head th {padding: 20px; flex-direction: row;}
.item-cart-box .cart-list .list-head th p {width: 90%}
.item-cart-box .cart-list .list-head .check {display:flex; flex-wrap:wrap; align-items:center;} /*width:auto*/
.item-cart-box .cart-list .list-body {border-bottom:1px solid #d9d9d9; }
.item-cart-box .cart-list .list-body .list-state {flex-direction: row; justify-content: space-between;}
/*.item-cart-box .cart-list .list-body .list-state > div {width: 50%}*/
.item-cart-box .cart-list .list-body .list-thumb {flex:1; min-width:0; display:flex; flex-wrap:wrap; align-items:center; padding:14px 24px;}
.item-cart-box .cart-list .list-body .list-thumb img {width:84px; height:84px; object-fit:cover;} /*margin:0 0 0 24px;*/
.item-cart-box .cart-list .list-body .list-thumb .content {flex:1; min-width:0; padding:0 0 0 15px; width: 100%}
.item-cart-box .cart-list .list-body .list-thumb .content p {margin:4px 0 0; font-size:14px; font-weight:600; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; text-align: left;}
.item-cart-box .cart-list .list-body .list-thumb .content .sticker {display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-list .list-body .list-thumb .content .sticker span {display:flex; flex-wrap:wrap; align-items:center; margin:0 4px 5px 0; height:18px; padding:0 8px; font-size:12px; border-radius:4px;}
.item-cart-box .cart-list .list-body .list-thumb .content .sticker span.label-purple {background:var(--color-main-bg); color:#fff;}
.item-cart-box .cart-list .list-body .list-thumb .content .sticker span.label-white {color:#a2a2a2; border:1px solid #a2a2a2;}
.item-cart-box .cart-list .list-body .list-thumb .content .sticker span.label-pink {background:#FFABC4; color:#fff;}
.item-cart-box .cart-list .list-body .list-thumb .content .sticker span.label-red {background:#EE4545; color:#fff;}

.item-cart-box .cart-list .list-body .list-quantity {width:140px; display:flex; flex-wrap:wrap; align-items:center;}
.item-cart-box .cart-list .list-body .list-quantity .quantity-box .inner > div {width:auto; height:23px; margin:0;}
.item-cart-box .cart-list .list-body .list-quantity .quantity-box {border:0; padding:0; flex:1; min-width:0;}
.item-cart-box .cart-list .list-body .list-quantity .quantity-box button {width:23px; height:23px;}
.item-cart-box .cart-list .list-body .list-quantity .quantity-box input {width:44px; height:23px; font-size:14px;}
.item-cart-box .cart-list .list-body .list-quantity .change {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; height:23px; border:1px solid #d9d9d9; padding:0 10px; font-size:12px; color:#303030; margin:0 0 0 8px;}
.item-cart-box .cart-list .list-body .list-cell {width:120px; text-align:center; font-size:14px; font-weight:600; color:#6b6b6b;}
.item-cart-box .cart-list .list-body .list-cell .link {width:84px; height:22px; margin:0 auto 4px; border:1px solid #d9d9d9; font-size:12px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center;}
.item-cart-box .cart-list .list-body .list-cell .link.black {background:#303030; color:#fff; border-color:#303030;}
.item-cart-box .cart-list .list-body .list-cell .link.delete:before {display:inline-block; content:""; margin:0 4px 0 0; width:13px; height:13px; background:url('../../public/images/icon_cart_delete.png') no-repeat center / cover;}
.item-cart-box .cart-list .list-body .list-mobile {display:none;}
.item-cart-box .cart-list table th:first-child,
.item-cart-box .cart-list table td:first-child{padding-left: 10px}

.item-cart-box .cart-list table th:last-child,
.item-cart-box .cart-list table td:last-child{padding-right: 10px}
table .last-tr td {
    border-bottom: 10px solid #f5f5f5;
}
table .last-tr td:last-child {padding: 20px}

.cart-quantity-box.quantity-box .product-opt-info {align-items: flex-start}
@media (max-width: 1200px) {
    .item-cart-box .cart-list .list-head th {padding: 10px 5px}
    /*.list-body .check-box {margin: 0 5px; position: absolute; top: 20px}*/
    .item-cart-box .cart-list .list-body .list-thumb {padding: 0 5px 10px; flex-wrap: nowrap; width: 100%; align-items: flex-start}
    .item-cart-box .cart-list .list-body .list-thumb img {width: 80px; height: 80px;}
    .item-cart-box .cart-list .list-body .list-cell.button {width:100%; display:flex; flex-direction: column; flex-wrap:wrap; align-items:center; margin:12px 0 0; padding: 5px}
    .item-cart-box .cart-list .list-body .list-cell.button .link {flex:1; min-width:0; width: 50px; margin:0 0 5px; height:33px; padding:0; font-size:12px;}
    .item-cart-box .cart-list .list-body .list-cell.button .link:last-of-type {margin:0;}
    .item-cart-box .cart-list .list-body .list-thumb .content {padding-left: 5px; }

    table .last-tr td:last-child {padding: 10px 10px 20px 0;}

    .cart-quantity-box.quantity-box .inner {background: #fff}
    .cart-quantity-box.quantity-box .inner > div {height:25px; }
    .cart-quantity-box.quantity-box .inner > div button {height:25px;}
    .cart-quantity-box.quantity-box .inner > div input {height: 25px;}
    .cart-quantity-box.quantity-box .quantity-right .total-price {margin: 0;}
    .cart-quantity-box.quantity-box .quantity-right .quantity-right-price {display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}

    .popup-box.bottom-modal .box .popup-body .opt-total {width: 100%}
}
@media (max-width: 991px) {
    .cart-quantity-box.quantity-box.cart-quantity-box {padding: 15px; border: none; background: #f5f5f5; border-radius: 5px}
}
.order-suc-info {flex-direction: column; margin-top: 50px}
.order-suc-info .order-success-icon {
    width: 100px;
    height: 100px;
    margin-bottom: 30px;
    background: url("../../public/images/order_success.png") no-repeat center center;
    background-size: contain;
}
.order-suc-info .order-fail-icon {
    width: 100px;
    height: 100px;
    margin-bottom: 30px;
    background: url("../../public/images/order_fail.png") no-repeat center center;
    background-size: contain;
}

.big-swiper .swiper-pagination {
    /*background: #8585ff80;*/
    border-radius: 20px;
    width: auto;
    padding: 5px 15px;
    left: calc(50% - 30px);
    color: #2f2873;
}
.big-swiper .swiper-pagination .swiper-pagination-bullet-active {
    background: var(--color-main-bg);
}

.listSwiper .swiper-pagination .swiper-pagination-bullet-active {
    background: var(--color-main-bg);
}

.wish {
    position: absolute;
    z-index: 11;
    cursor: pointer;
    right: 20px;
    bottom: 30px;
    width: 24px;
    height: 24px;
}
.button-box:has(.btn_kakao) {
    width: 183px;
}
.button-box:has(.btn_apple) {
    width: 165px;
    margin-left: 20px;
}
.button-box .btn_kakao {
    background: url(../../public/images/kakao_login_medium_narrow.png) no-repeat center center;
    background-size: contain;
}
.button-box .btn_apple {
    background: url(../../public/images/apple_login.png) no-repeat center center;
    background-size: contain;
}
.container.personal .table-box {
    white-space: wrap;
}
.container.personal * {
    font-size: 15px;
    line-height: 20px;
}
.container.personal > div {
    margin: 20px 0;
}
.container.personal > div > p {
    margin-bottom: 5px;
}
.container.personal .title {
    font-weight: bold;
    font-size: 16px;
    margin-top: 30px;
}
.container.personal .box {
    margin-top: 20px;
    pointer-events: none;
    opacity: 1;
    transition: none;
    padding: inherit;
    position: static;
    transform: none;
    width: 100%;
    max-width: inherit;
    overflow-y: auto;
    max-height: inherit;
    background: #fff;
}
.container.personal div:has(table){
    margin-top: 10px;
}
.container.personal .text-box li {
    margin: 5px 0 5px 13px;
}
.container.personal table thead tr th {border:1px solid #D9D9D9; padding:14px 10px; font-size:14px; font-weight:600; color:#8B8B9E;}
.container.personal table tbody tr td {border:1px solid #D9D9D9; padding:12px 10px; font-size:14px; color:#1C1B1F;}

.mypage-nav {
    width: 20%;
}
.mypage-content {
    margin: 0 auto;
    width: 80%;
}
@media (max-width:991px) {
    .mypage-content {
        width: 100%;
    }
}
.mypage-nav ul {
    padding: 0 10px 10px;
    margin-right: 20px;
    li {
        width: 100%;
        padding: 15px 10px;
        margin: 5px 0;
        cursor: pointer;
        &:hover {
            background: var(--color-main-bg);
            color: #fff;
            transition: all 0.4s;
        }
        &.active {
            background: var(--color-main-bg);
            color: #fff;
            transition: all 0.4s;
        }
    }
}
@media (max-width: 991px) {
    .mypage-nav {
        width: 100%;
        margin-bottom: 14px;
        ul {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: flex-start;
            align-items: stretch;
            margin-right: 0;
            padding: 0;
            /*border: 1px solid var(--color-black-700);*/
            li {
                max-width: calc(33.33% - 2px);
                word-break: keep-all;
                text-align: center;
                position: relative;
                display: flex;
                justify-content: center;
                align-items: center;
                margin: 1px;
                border: 1px solid var(--color-black-700);
                &.active {
                    border: 1px solid var(--color-main-bg);
                }
            }
        }
    }
}

.mypage-content .delivery-adr-list {
    padding: 10px 0;
    margin: 10px 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    li {
        border-bottom: 1px solid #D9D9D9;
        padding: 10px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        * {
            font-size: 16px;
            margin: 5px 0;
        }
        .deli-name .deli-label {
            background: var(--color-main-bg-white);
            color: var(--color-main-font);
            padding: 6px 8px;
            font-size: 13px;
            border-radius: 4px;
            margin-left: 10px;
        }
        .button-box button:first-child {
            margin-right: 10px;
        }
    }
    .deli-name {
        font-weight: 700;
    }
    .deli-request {
        color: var(--color-gray-600);
        font-size: 13px;
    }
    .button-box button {
        padding: 5px 15px;
        font-size: 13px;
        height: 30px;
        max-height: 30px;
    }
}
@media (max-width: 991px) {
    .mypage-content .delivery-adr-list li .button-box {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        button:first-child {
            margin-right: 0;
        }
    }
}
.order-num:hover {
    text-decoration: underline;
}

#popup-body {
    min-width: 0;
    max-width: 100%;
    display: block;
    margin: 0;
}

.deli-qna-popup {
    overflow: hidden;
    position: relative;
    height: 100%;
    border-radius: 8px;
}
.deli-qna-popup .qna-popup-head {
    background: #f4f4ff;
    color: #000;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    padding: 10px;
}
.deli-qna-popup .qna-popup-head img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 10px;
}
.deli-qna-popup .qna-popup-head .product-info{
    padding-left: 20px;
    width: 100%;
}
.deli-qna-popup .qna-popup-head .order-product {
    margin-bottom: 3px;
    margin-top: 10px;
    font-weight: 600;
    font-size: 16px;
}
.deli-qna-popup .qna-popup-head .order-date-info {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.deli-qna-popup .qna-popup-head .order-num {
    font-size: 13px;
}
.deli-qna-popup .qna-popup-head .order-num a:hover {
    text-decoration: underline;
}
.deli-qna-popup .qna-popup-head .opt-name {
    font-size: 13px;
    color: var(--color-gray-600);
}
.deli-qna-popup .qna-popup-body {
    height: calc(100% - 64px);
    overflow-y: auto;
    padding-bottom: 140px;
}
.deli-qna-popup .qna-popup-body .qna-popup-date {
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.deli-qna-popup .qna-popup-body .qna-popup-date p {
    background: var(--color-gray-200);
    padding: 10px 20px;
    border-radius: 40px;
}
.deli-qna-popup .qna-popup-body .qna-popup-content {
    padding: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    width: 100%;
}
.deli-qna-popup .qna-popup-body .qna-popup-content.left {
    flex-direction: row;
    padding-right: 60px;
}
.deli-qna-popup .qna-popup-body .qna-popup-content.right {
    flex-direction: row-reverse;
    padding-left: 60px;
}
.deli-qna-popup .qna-popup-body .qna-popup-content .face-icon {
    align-self: flex-start;
    margin-right: 10px;
    padding-top: 8px;
    color: var(--color-main-border_font);
    position: relative;
}
.deli-qna-popup .qna-popup-body .qna-popup-content .face-icon .comment-triangle {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    border-radius: 10px;
    border-bottom: 20px solid transparent;
    border-top: 20px solid #f4f4ff;
}
.deli-qna-popup .qna-popup-body .qna-popup-content.left .face-icon .comment-triangle {
    right: -35px;
    border-right: 20px solid #f4f4ff;
    border-left: 20px solid transparent;
}
.deli-qna-popup .qna-popup-body .qna-popup-content.right .face-icon .comment-triangle {
    left: -25px;
    border-right: 20px solid transparent;
    border-left: 20px solid #f4f4ff;
}
.deli-qna-popup .qna-popup-body .qna-popup-content .qna-popup-text {
    padding: 12px 15px 15px;
    background: #f4f4ff;
    color: #000;
    border-radius: 10px;
    text-align: left;
    z-index: 2;
}
.deli-qna-popup .qna-popup-content.center .qna-popup-text {
    width: 80%;
    background: var(--color-gray-200);
}
.deli-qna-popup .qna-popup-body .qna-popup-content .qna-popup-text .user {
    font-weight: 600;
    margin-bottom: 10px;
}
.deli-qna-popup .qna-popup-body .qna-popup-content .qna-popup-time {
    margin-bottom: 10px;
    font-size: 13px;
}
.deli-qna-popup .qna-popup-body .qna-popup-content.left .qna-popup-time {
    margin-left: 10px;
}
.deli-qna-popup .qna-popup-body .qna-popup-content.right .qna-popup-time {
    margin-right: 10px;
}
.deli-qna-popup .qna-popup-input {
    width: 100%;
    background: #F0F0F5;
    padding: 15px 10px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-end;
    position: sticky;
    bottom: 0;
}
.deli-qna-popup .qna-popup-input textarea {
    padding: 10px;
    border-radius: 10px;
    margin-right: 10px;
    width: 100%;
    height: auto;
    resize: none;
    overflow: hidden;
}
.deli-qna-popup .qna-popup-input > span {
    color: #ffffff;
    background: #8585ff;
    padding: 5px 5px 5px 7px;
    border-radius: 50px;
    cursor: pointer;
}

.search-box-component {
    position: absolute;
    left: 0;
    top: 55px;
    border: 1px solid var(--color-gray-600);
    border-radius: 30px;
    background: #fff;
    z-index: 999;
    padding: 20px;
    width: 100%;
    box-shadow: #dddddd 0 3px 5px 2px;
    ul {
        margin: 0;
        flex-wrap: nowrap;
        flex-direction: column;
        align-items: flex-start;
        li {
            display: flex;
            flex-direction: row;
            justify-content: flex-start;
            align-items: center;
            width: 100%;
            margin: 0;
            &:not(:last-child) {
                margin: 0 0 10px;
            }
            > * {
                border: none;
                border-radius: 0;
                padding: 0;
            }
            .search-small {
                height: 24px;
                margin-right: 10px;
                cursor: auto;
            }
            .content {
                display: flex;
                flex-direction: row;
                justify-content: space-between;
                align-items: center;
                flex-wrap: nowrap;
                width: 100%;
                height: 100%;
                cursor: pointer;
                .search-li-del {
                    margin-left: 10px;
                }
                .search-li-del:hover {
                    text-decoration: underline;
                    cursor: pointer;
                }
            }
        }
    }
}

.item-list-category {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 20px 0;
    margin-bottom: 10px;
    ul {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        width: 100%;
        li {
            padding: 10px;
            margin: 0 5px;
            cursor: pointer;
        }
    }
    .first-category {
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 20px;
    }
    .second-category {
        overflow-x: auto;
        -ms-overflow-style: none; /* 인터넷 익스플로러 */
        scrollbar-width: none; /* 파이어폭스 */
        /* ( 크롬, 사파리, 오페라, 엣지 ) 동작 */
        &::-webkit-scrollbar {
            display: none;
        }
        li {
            border-bottom: 2px solid #fff;
            a {
                font-size: 16px;
                word-break: keep-all;
            }
            &.active {
                border-bottom: 2px solid #000;
            }
            &:hover {
                border-bottom: 2px solid #000;
            }
        }
    }
    .third-category {
        margin-bottom: 20px;
        background: var(--color-gray-100);
        overflow-x: auto;
        -ms-overflow-style: none; /* 인터넷 익스플로러 */
        scrollbar-width: none; /* 파이어폭스 */
        /* ( 크롬, 사파리, 오페라, 엣지 ) 동작 */
        &::-webkit-scrollbar {
            display: none;
        }

        li {
            a {
                color: var(--color-gray-800);
                word-break: keep-all;
            }
            &.active a {
                color: var(--color-main-font);
            }
            &:hover a {
                color: var(--color-main-font);
            }
        }
    }
}
@media (max-width: 991px) {
    .second-category li:hover {
        border-bottom: 2px solid #fff;
    }
    .third-category li:hover a {
        color: var(--color-gray-800);
    }
    .swal2-container {
        margin-top: 50px;
    }
}
.item-list-title {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 20px 0;
    margin-bottom: 20px;
    .main-title {
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 10px;
    }
    .sub-title {
        font-size: 18px;
        color: var(--color-gray-600);
    }
}

.loading_B {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-25px;
    margin-top:-25px;
    padding:0;
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 0px solid rgba(255,255,255,0);
    border-radius: 50%;
    animation: spin 6s infinite linear;
    -webkit-animation: spin 6s infinite linear;
    box-sizing: border-box;
    z-index:10;
}

@keyframes spin {
    to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    to { -webkit-transform: rotate(360deg); }
}


.loading_B .loading_img {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-25px;
    margin-top:-25px;
    padding:0;
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 3px solid #d7d7ff;
    border-radius: 50%;
    border-top-color: var(--color-main-bg);
    animation: spin2 1s ease-in-out  infinite;
    -webkit-animation: spin2 1s ease-in-out infinite;
    box-sizing: border-box;
}

@keyframes spin2 {
    to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin2 {
    to { -webkit-transform: rotate(360deg); }
}

.product-info-type-list {
    dl {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }
    dd {
        border-bottom: 1px solid var(--color-gray-300);
        width: 50%;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
        b {
            text-align: left;
            width: 30%;
            color: var(--color-gray-600);
            padding: 10px;
        }
        p {
            padding: 10px;
            text-align: left;
            width: 70%;
        }
        &:nth-child(odd):last-child {
            width: 100%;
            b {
                width: 15%;
            }
            p {
                width: 85%;
            }
        }
    }
    @media (max-width: 991px) {
        flex-direction: column;
        dd {
            width: 100%;
            b {
                padding: 3px 5px;
                width: 30%;
            }
            p {
                padding: 3px 5px;
                width: 70%;
            }
            &:nth-child(odd):last-child {
                b {
                    width: 30%;
                }
                p {
                    width: 70%;
                }
            }
        }
    }
}

/*dis-none*/
.dis-none {display: none !important}