﻿
body {
    margin: 0;
    padding: 0;
    /*line-height: 1.3 !important;*/
    color: #000;
}

ul {
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    color: #4b505e;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0.5rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.3;
    color: inherit;
}
a, .btn, button {
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
p {
    word-break: keep-all;
}
.header-top.off-white-bg, .header-middle.white-bg {
    background: #fff;
    color: #646464;
}

.header-top {
    border-bottom: 1px solid #394452;
}

.off-white-bg {
    background: #f9f9f9;
}
.header-list-menu {
    display: flex;
    justify-content: flex-end; /* 오른쪽 정렬 */
    align-items: center; /* 세로 가운데 정렬 */
    gap: 20px; /* li 사이 간격 */
    padding: 0;
    margin: 0;
    list-style: none;
}

    /* li 기본 스타일 */
    .header-list-menu > li {
        position: relative;
    }

        /* a 태그 스타일 */
        .header-list-menu > li > a {
            display: flex;
            align-items: center;
            font-size: 16px;
            color: #646464;
            text-decoration: none;
            padding: 10px 0;
        }

        /* a 태그 hover */
        .header-list-menu > li:hover > a {
            color: #fed700;
        }

        /* 아이콘과 텍스트 간격 */
        .header-list-menu > li > a i {
            margin-right: 5px;
        }

        /* li 사이 구분선 */
        .header-list-menu > li + li::before {
            content: "";
            position: absolute;
            left: -10px; /* 구분선 위치 */
            top: 50%;
            transform: translateY(-50%);
            width: 1px;
            height: 20px;
            background: hsl(0, 0%, 88%);
        }

        /* 첫 번째 li는 구분선 제거 */
        .header-list-menu > li:first-child::before {
            display: none;
        }

/* 장바구니 카운트 span */
.cart-count {
    display: inline-block;
    min-width: 20px;
    text-align: center;
    font-weight: bold;
    margin-right: 5px;
}

/* 반응형: 작은 화면에서 일부 li 숨기기 */
@media (max-width: 767px) {
    .header-list-menu > li.d-md-block {
        display: none;
    }
}
 .middle-menu-list > li {
    float: left;
    position: relative;
}

li {
    list-style: none;
}
.middle-menu-list > li > a {
    background: transparent none repeat scroll 0 0;
    color: #363f4d;
    display: block;
    font-size: 18px;
    font-weight: 500;
    line-height: 25px;
    padding: 30px 0 30px 25px;
    text-transform: uppercase;
}
.middle-menu-list > li > a {
    color: #646464;
}

/*
.header-list-menu > li > a, .homeo-2 .ht-dropdown.megamenu li a {
    color: #363f4d;
    display: block;
    font-size: 16px;
    padding: 10px 10px 10px 0;
    text-transform: capitalize;
    margin-right: 10px;
}

.header-list-menu > li > a, .header-list-menu > li i, .middle-menu-list > li > a {
    color: #646464;
}
.header-list-menu > li:nth-child(1n+1)::after {
    background: hsl(0, 0%, 88%) none repeat scroll 0 0;
    content: "";
    height: 20px;
    position: absolute;
    right: 10px;
    top: 15px;
    width: 1px;
    z-index: 22;
}

.header-list-menu > li:first-child::after {
    background: hsl(0, 0%, 88%) none repeat scroll 0 0;
    content: "";
    height: 20px;
    position: absolute;
    right: 10px;
    top: 6px;
    width: 1px;
    z-index: 22;
}*/

.header-list-menu > li:hover > a,
.header-list-menu > li > ul.ht-dropdown > li:hover a,
.megamenu-three-column > ul > li ul > li:hover > a,
.catergorie-product .single-product .pro-content h4 a:hover,
.cat-list li a:hover,
.middle-menu-list > li > ul.ht-dropdown > li:hover > a {
    color: #fed700;
}

.justify-content-end {
    justify-content: flex-end !important;
}

.d-flex {
    display: flex !important;
}

.d-none {
    display: none !important;
}

@media (min-width: 768px) {
    .d-md-block {
        display: block !important;
    }
}

.header-list-menu > li > span {
    display: inline-block;
    font-size: 16px;
    /*margin-top: 10px;*/
/*    margin-right: 10px;
    padding-right: 10px;*/
}
/*.header-list-menu > li:not(:last-child)::after {
    background: hsl(0, 0%, 88%) none repeat scroll 0 0;
    content: "";
    height: 20px;
    position: absolute;
    right: 10px;
    top: 15px;
    width: 1px;
    z-index: 22;
}*/



.header-list-menu > li:last-child::after {
    content: none; /* 마지막 항목에서는 ::after를 없앰 */
}

.header-middle-two {
    padding: 28px 0;
}

.white-bg {
    background: #fff;
}

.header-middle-two {
    padding: 28px 0;
}



.logo img {
    width: 200px;
}

.position-relative {
    position: relative !important;
}

.fix {
    overflow: hidden;
}

.search-box-style-two.search-box-view {
    margin-top: 0;
}

a.button-border span, a.button-border-white span, input, select, textarea {
    -webkit-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}

input {
    background: #eceff8;
    border: 2px solid #eceff8;
    height: auto;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-left: 10px;
    font-size: 14px;
    color: #626262;
}

.search-box-view .email {
    background: #fff none repeat scroll 0 0;
    border: medium none;
    border-radius: 5px;
    color: #888;
    float: left;
    font-size: 13px;
    font-weight: 400;
    height: 49px;
    line-height: 45px;
    padding: 0 50px 0 20px;
    position: relative;
    width: calc(100% - 10px);
    border: 1px solid #646464;
}

.search-box-view .submit {
    background: #4380db none repeat scroll 0 0;
    border: medium none;
    border-radius: 5px;
    color: #fff;
    float: left;
    font-size: 16px;
    font-weight: 400;
    height: 49px;
    line-height: 49px;
    position: absolute;
    right: 0;
    text-transform: capitalize;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 49px;
}


.search-box-view .submit, .newsletter-box .submit {
    background: #e94052;
    color: #1a1a1a;
}

.search-box-view .submit, .newsletter-box .submit:hover {
    color: #fff;
}

.search-box-view .submit:before {
    content: "\f002";
}
.text-end {
    text-align: right !important;
}
.cart-box ul li {
    position: relative;
    display: inline-block;
}
.cart-box > ul > li > a {
    color: #8d98aa;
    display: inline-block;
    font-size: 25px;
    line-height: 29px;
    margin: 0;
    padding: 10px 0 10px 10px;
}
.cart-box > ul > li > a, .news-desc h3 span, .single-footer li:hover a, .pro-content h4:hover a, .single-categorie li a:hover {
    color: #e94052;
}
.cart-style-two.cart-box > ul > li > a {
    font-size: 26px;
    line-height: 49px;
    padding: 0 0 0 15px;
}


.cart-box ul li a span {
    background: #ea3a3c none repeat scroll 0 0;
    border-radius: 100%;
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    height: 18px;
    line-height: 19px;
    position: absolute;
    right: 0px;
    text-align: center;
    text-transform: capitalize;
    top: 12px;
    width: 18px;
}
.cart-counter {
    color: #fff;
    font-size: 11px;
    font-weight: 400;
    display: inline-block;
    vertical-align: top;
    text-transform: uppercase;
    text-align: center;
    line-height: 15px;
}

.header-bottom, .vertical-menu {
    position: relative;
}

.align-items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.home-2-mid-menu {
    position: relative;
}


.home-2-mid-menu .middle-menu-list > li > a {
    padding: 20px 30px 20px 0;
}
.home-2-mid-menu .middle-menu-list > li a, .home-2 .middle-menu-list > li > ul.ht-dropdown > li a {
    text-transform: uppercase;
}

.ht-dropdown {
    background: #fff;
    left: 0;
    opacity: 0;
    padding: 10px 20px;
    position: absolute;
    top: 100%;
    -webkiit-transform: scaleY(0);
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 0 0 0;
    transform-origin: 0 0 0;
    width: 150px;
    text-align: left;
    visibility: hidden;
    z-index: 99999999;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.2);
}



/*.middle-menu-list > li > ul.ht-dropdown {
    width: 200px;
}*/



.header-list-menu > li > ul.ht-dropdown > li > a, .middle-menu-list > li > ul.ht-dropdown > li > a {
    font-size: 13px;
    padding: 5px 0;
    line-height: 24px;
    display: block;
    text-transform: capitalize;
    text-align: left;
    color: #888;
    font-weight: 400;
}
.home-2-mid-menu .middle-menu-list > li > ul.ht-dropdown > li a {
    color: #444;
}
.header-list-menu > li:hover > ul.ht-dropdown,
.vertical-menu-list > li:hover ul.ht-dropdown,
.cart-box > ul > li:hover ul.ht-dropdown,
.middle-menu-list > li:hover > ul.ht-dropdown,
.cart-box > ul > li.search-bar-xs:hover .ht-dropdown {
    visibility: visible;
    -webkiit-transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
}
.middle-menu-list > li > ul.ht-dropdown {
    width: 200px;
}

.header-top-left .header-list-menu li a i, .middle-menu-list > li a i {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    vertical-align: inherit;
    font-size: 10px;
    margin-left: 4px;
}
.header-top-left {
    display: flex;
    height: 100%;
}
.black-bg {
    background: #000000;
}
.ld-bg {
    background: #055330;
}

.header-bottom, .vertical-menu {
    position: relative;
}
@media (max-width: 767px) {
    .header-bottom.black-bg {
        background: #fff none repeat scroll 0 0;
    }
    .ld-bg {
        background: #FFFFFF;
    }
}

@media (max-width: 767px) {
    .header-bottom-style-two.header-bottom.black-bg {
        background: #ffffff;
    }
    .ld-bg {
        background: #FFFFFF;
    }
}

@media (max-width: 767px) {
    .search-box-view .email {
        border: 1px solid #e1e1e1;
    }
}

@media (max-width: 767px) {
    .search-box-view .submit, .search-box-view .email {
        border-radius: 0;
    }
}

@media (max-width: 767px) {
    .search-box-view .submit, .search-box-view .email {
        border-radius: 0;
    }
}

@media (max-width: 767px) {
    .header-middle-two, .header-middle-three {
        display: none;
    }
}
@media (min-width: 768px) {
    .d-md-none {
        display: none !important;
    }
}

.mobile-menu {
    position: relative;
}

@media (max-width: 767px) {
    .cart-box > ul > li > a {
        padding-left: 0 0 0 15px;
        line-height: 30px;
        font-size: 18px;
    }
}


.cart-box > ul > li.search-bar-xs .ht-dropdown {
    padding: 0;
    width: 300px;
    right: 0;
    left: auto;
}

@media (max-width: 767px) {
    .cart-box > ul > li.search-bar-xs .ht-dropdown {
        width: 270px;
    }
}
.vertical-menu {
    width: 100%;
}
@media (max-width: 767px) {
    .mobile-vertical-menu .vertical-menu {
        margin: 15px 0;
    }
    .ht-dropdown {
        width: 270px;
    }
    .serveul {
        display: grid;
    }
    .serverli {
        margin-top: 10px;
        width: 54% !important;
    }
        .serverli:first-child {
            margin-top: 0;
        }
}


.megamenu_h3_a {
    color: #444;
    font-size: 14px;
    font-weight: 400;
}
.vertical-menu > span {
    background: #4380db none repeat scroll 0 0;
    border-radius: 5px;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 13px;
    font-weight: 500;
    margin: 0;
    padding: 11px 30px 12px;
    position: relative;
    text-transform: uppercase;
}
.vertical-menu > span {
    background: #055330;
}

.vertical-menu > span::after {
    content: "\e68e";
    font-family: "themify";
    font-size: 18px;
    font-weight: normal;
    position: absolute;
    right: 16px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.search-box-view .submit::before {
    content: "\e610";
    font-family: "themify";
    font-size: 18px;
    font-weight: normal;
    position: absolute;
    right: 16px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.menu-hidden {
    display: none;
}
.vertical-menu-list {
    background: #fff none repeat scroll 0 0;
    left: 0;
    padding: 0 25px;
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 999;
    border: 2px solid #0162bd;
    border-top-width: 0;
}
.vertical-menu-list {
    border-color: #232f3e;
}
.vertical-menu-list>li {
    position: relative;
}

.vertical-menu-list > li > a, .category-menu li a {
    border-bottom: 1px solid #d7d7d7;
    color: #666666;
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    overflow-wrap: break-word;
    padding: 17px 0;
    position: relative;
    text-align: left;
    text-transform: capitalize;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

@media (max-width: 767px) {
    .vertical-menu-list > li > a, .category-menu li a {
        line-height: 18px;
        padding: 12px 0;
    }
}


.home-2-mid-menu .middle-menu-list > li > ul.ht-dropdown.megamenu {
    width: 765px;
    left: auto;
    padding: 30px 30px 40px;
}
.megamenu-three-column > ul > li {
    float: left;
    margin-right: 20px;
    padding-right: 0;
    width: 32.33%;
}
.home-2-mid-menu .megamenu-three-column h3 {
    font-size: 13px;
    font-weight: 500;
    line-height: 22px;
}

.megamenu-three-column h3 {
    border-bottom: 2px solid #f1f1f1;
    color: #444;
    font-family: "Rubik", sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 8px;
    padding-bottom: 6px;
    text-transform: uppercase;
}
.c-w {
    color: white !important;
}
.com-info {
    float: left;
    width: 25%;
    height: 200px;
    padding: 20px 40px;
    border-right: 1px solid #333;
    overflow: hidden;
}
.com-info:last-child {
    border-right: 0;
}
.com-cs {
    width: 100%;
    height: 100%;
    line-height: 1.4;
    letter-spacing: -0.02em;
}

.com-cs h2 {
    color: white;
    margin-bottom: 25px;
    font-size: 16.25px
}
.com-cs strong {
    font-size: 19.5px;
    color: white;
    margin-bottom: 10px;
}
.com-cs p {
    font-size: 13px;
    color: #777;
    margin: 5px 0 10px 0;
}

.com-cs ul li p a {
    display: block;
    color: #777;
    line-height: 1.3;
    margin-bottom: 5px;
}
.com-cs ul li p a i {
    margin-right: 10px;
    width: 15px;
    height: 15px;
}
.font-14 {
    font-size: 14px !important;
}
.footer-menu {
    background: #333;
}
.footer-menu ul {
    padding: 20px 0;
    max-width: 1300px;
    margin: 0 auto;
    text-align: left;
}
.footer-menu ul li {
    display: inline-block;
    margin: 0 5px;
}
.footer-menu ul li:first-child {
    margin-left: 0;
}
.footer-menu ul li a {
    color: white;
    font-size: 13px;
}
.footer-sec-menu {
    margin: 0 auto;
    width: 100%;
    max-width: 1300px;
}
.footer-thi-menu {
    margin: 0 auto;
    width: 100%;
    max-width: 1300px;
    padding: 35px 0 50px 0;
}
.footer-copy {
    width: 100%;
    border-top: 1px solid #333;
}

.com-con {
    padding: 35px 0;
}

.copyright {
    width: 100%;
    margin: 0;
    border-top: 1px solid #333;
}

.footer-compinfo ul li {
    display: inline-block;
    line-height: 0;
}
.footer-compinfo ul li p, .footer-compinfo ul li p span {
    color: #777;
    font-size: 13px;
}
.footer-compinfo ul li p {
    margin-right: 5px;
}
.footer-compinfo ul li p span {
    margin-right: 25px;
}
.footer-thi-menu h2 {
    color: white;
    margin-bottom: 10px;
    font-size: 16.25px;
}
.footer-sec-menu::after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}
/*.slider-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    max-height: 70vh;*/ /* 적당한 높이 조정 */
/*}

.slider {
    display: flex;
    transition: transform 1.5s ease-in-out;
}
.m-slider {
    display: flex;
    transition: transform 1.5s ease-in-out;
}

.slide {
    object-fit: cover;
    max-height: 70vh;*/ /* 적당한 높이 조정 */
    /*flex: 0 0 100%;
}
.m-slide {
    object-fit: cover;
    max-height: 40vh;*/ /* 적당한 높이 조정 */
    /*flex: 0 0 100%;
}*/

.paging {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 40px; /* 이미지 하단에서의 거리 조정 */
    left: 0;
    right: 0;
}

.m-paging {
    display: flex;
    justify-content: center;
    position: absolute;
    bottom: 350px; /* 이미지 하단에서의 거리 조정 */
    left: 0;
    right: 0;
}

.dote {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: gray;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.dote.active {
    background-color: black;
}

.mdote {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: gray;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.mdote.active {
    background-color: black;
}
.m-slider-container {
    display: none;
}
.pb-50 {
    padding-bottom: 50px;
}
.pt-50 {
    padding-top: 50px;
}
.universal-padding {
    padding-left: 15px;
    padding-right: 15px;
}

.border-default {
    padding-bottom: 30px;
}
.group-title {
    color: #363f4d;
    margin-bottom: 20px;
    padding-bottom: 25px;
    padding-top: 25px;
    position: relative;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: center;
    flex-wrap: wrap;
}
.group-title h2 {
    font-size: 26px;
    font-weight: 700;
    color: #000000;
}

.group-title h2:after {
    display: block;
    clear: both;
    content: "";
    width: 30px;
    padding-bottom: 20px;
    margin: 0 auto;
    border-bottom: 1px solid #000;
    visibility: visible;
}


.single-categorie img {
    width: 100%;
}

.categorie-content {
    padding-bottom: 30px;
}

.single-categorie h3 {
    color: #363f4d;
    font-size: 18px;
    font-weight: 600;
    /*margin: 20px 0 0 0;*/
    /*border-bottom: 1px solid #ebebeb;*/
    padding-bottom: 10px;
    margin-right: 20px;
}
.single-categorie h2 {
    color: #000000;
    font-size: 18.85px;
    font-weight: 600;
    padding-bottom: 10px;
    margin:5px 0 10px;
}

@media (max-width: 768px) {
    .single-categorie h3 {
        font-size: 14px;
    }
    .single-categorie h2 {
        font-size: 15px;
        margin: 5px 0 5px;
    }
}

.text-capitalize {
    text-transform: capitalize !important;
}
.single-categorie span {
    color: #7a7a7a;
    font-size: 14px;
    line-height: 25px;
}

.single-categorie .cat-link {
    background: #363f4d none repeat scroll 0 0;
    border-radius: 5px;
    color: #fff;
    display: inline-block;
    font-size: 12px;
    margin-top: 30px;
    padding: 5px 30px;
}
@media (max-width: 767px) {
    .com-info {
        width: 50%;
        border-bottom: 1px solid #333;
        padding: 25px 20px;
        height: 180px;
    }

    .com-cs h2 {
        color: white;
        margin-bottom: 15px;
        font-size: 15px;
    }

    .footer-menu ul {
        text-align: center;
    }
    .com-con {
        padding: 0;
    }
    .footer_top {
        border-bottom: 1px solid #333;
    }
    .footer-thi-menu h2 {
        padding: 15px;
        text-align: center;
        font-size: 14.25px;
    }
    .footer-compinfo {
        padding: 0 15px;
    }
    .m-slider-container {
        display: block;
    }
    .slider-container {
        display: none;
    }
}

.container-shop {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-right: auto;
    margin-left: auto;
}

@media (min-width:1200px) {
    .container-shop {
        max-width: 1170px
    }
}


@media (min-width:1400px) {
    .container-shop {
        max-width: 1170px;
    }
}


.mb-50 {
    margin-bottom: 50px;
}

.nav-pills {
    --bs-nav-pills-border-radius: 0.375rem;
    --bs-nav-pills-link-active-color: #fff;
    --bs-nav-pills-link-active-bg: #0d6efd;
}

.universal-margin {
    margin-left: 15px;
    margin-right: 15px;
}

.nav-pills .nav-link {
    background: 0 0;
    border: 0;
    border-radius: var(--bs-nav-pills-border-radius);
}

.new-products .product-list {
    border-bottom: 1px solid #ebebeb;
    margin-bottom: 40px;
    padding: 25px 0 20px 0;
}

    .new-products .product-list li button, .best-selling-items .product-list li button {
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        font-weight: 600;
        padding-left: 5px;
        padding-right: 30px;
        position: relative;
    }

.product-list li button.nav-link {
    font-size: 13px;
    font-weight: normal;
    text-transform: capitalize;
    padding-top: 0;
    padding-bottom: 0;
}

.product-tab-list li button.nav-link {
    font-size: 20px;
    font-weight: 600;
    text-transform: uppercase;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: var(--bs-nav-pills-link-active-color);
    background-color: var(--bs-nav-pills-link-active-bg);
}

.new-products .product-list li button.nav-link, .best-selling-items .product-list li button.nav-link {
    color: #aaa;
}

.product-list button.active, .best-selling-items .product-list li button.active {
    color: #363f4d !important;
    background-color: transparent !important;
}

.fade {
    transition: opacity .15s linear;
}

    .fade:not(.show) {
        opacity: 0;
    }

.no-js .owl-carousel, .owl-carousel.owl-loaded {
    display: block;
}

.product-tab-content .tab-pane {
    display: block;
    height: 0;
    visibility: hidden;
}

.tab-content > .active {
    /* height: auto; */
}

.product-tab-content .tab-pane.active {
    height: auto;
    visibility: visible;
}

.item-cont {
    zoom: 1;
    font-size: 0;
}

    .item-cont .item-list {
        text-align: left;
        display: inline-block;
        *display: inline;
        vertical-align: top;
        /*width: 18.2%;
    margin-right: 2%;*/
        margin-bottom: 80px;
        position: relative;
    }

        .item-cont .item-list dt {
            position: relative;
            border: 1px solid #eee;
        }

            .item-cont .item-list dt a {
                vertical-align: top;
                display: block;
            }

            .item-cont .item-list dt img {
                width: 100%;
                display: block;
            }

        .item-cont .item-list dd {
            position: relative;
            font-size: 15px;
        }

            .item-cont .item-list dd .prd-icon {
                position: relative;
                margin-top: 10px;
                text-align: right;
                overflow: hidden;
                height: 19px;
            }

                .item-cont .item-list dd .prd-icon .style-code {
                    float: left;
                    font-size: 12px;
                    color: #999;
                }

.crema-product-reviews-count {
    position: absolute;
    color: #ef987f;
    font-size: 12px;
    right: 0;
    text-align: right;
    font-weight: normal;
}

.item-cont .item-list dd .crema-product-reviews-count {
    position: absolute;
    top: 0;
}

.item-cont .item-list dd .prd-name {
    margin-top: 10px;
    overflow: hidden;
    font-weight: 600;
    letter-spacing: -0.5px;
    word-wrap: break-word;
    word-break: keep-all;
    color: #111;
    font-size: 18px;
}

.item-cont .item-list dd .priceBox {
    position: relative;
    margin: 7px 0 3px;
}

    .item-cont .item-list dd .priceBox .percent {
        padding-right: 3px;
        color: #ff4000;
        font-weight: 500;
        font-size: 14px;
    }

.item-cont .item-list dd .prd-price {
    display: inline-block;
    *display: inline;
    margin-right: 3px;
    font-weight: 600;
    font-size: 18px;
    color: #363f4d;
    
}
.categorie-img{
    border: 1px solid #eee;
}
.item-cont .item-list dd .prd-price strike {
    color: #979797;
    font: inherit;
    font-weight: normal;
    font-size: 12px;
}

.item-cont .item-list dd .MK-product-icons {
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 0px;
    padding-right: 0px;
}

.item-cont .item-list dd .prd-name-sub {
    position: relative;
    color: #999;
    line-height: 18px;
    font-size: 13px;
    padding-top: 7px;
    margin-top: 7px;
    border-top: 1px solid #e5e5e5;
    word-wrap: break-word;
    word-break: keep-all;
}
.px-10 {
    padding-right: 10px;
    padding-left: 10px;
}
.py-50 {
    padding: 50px 0;
}

.py-10 {
    padding: 10px 0;
}
.memjoin {
    display: flex;
    flex-direction: column;
    padding: 20px;
}

.breadcrumb {
    --bs-breadcrumb-padding-x: 0;
    --bs-breadcrumb-padding-y: 0;
    --bs-breadcrumb-margin-bottom: 1rem;
    --bs-breadcrumb-bg: 0;
    --bs-breadcrumb-border-radius: 0;
    --bs-breadcrumb-divider-color: #6c757d;
    --bs-breadcrumb-item-padding-x: 0.5rem;
    --bs-breadcrumb-item-active-color: #6c757d;
    display: flex;
    flex-wrap: wrap;
    padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
    margin-bottom: var(--bs-breadcrumb-margin-bottom);
    font-size: var(--bs-breadcrumb-font-size);
    list-style: none;
    background-color: var(--bs-breadcrumb-bg);
    border-radius: var(--bs-breadcrumb-border-radius);
}

.breadcrumb-area .breadcrumb {
    background-color: #f5f5f5;
    margin-bottom: 0;
    padding: 25px 15px;
}

.breadcrumb li {
    display: inline-block;
}

    .breadcrumb li + li::before {
        padding: 0 5px;
        color: #ccc;
        content: "/\00a0";
    }

.main-product-thumbnail .tab-content img, .product-thumbnail .thumb-menu div img {
    width: 100%;
    border: 1px solid #ebebeb;
}

.product-thumbnail {
    margin-top: 15px;
}

.nav {
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: 0;
    --bs-nav-link-color: var(--bs-link-color);
    --bs-nav-link-hover-color: var(--bs-link-hover-color);
    --bs-nav-link-disabled-color: #6c757d;
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.nav-tabs {
    --bs-nav-tabs-border-width: 1px;
    --bs-nav-tabs-border-color: #dee2e6;
    --bs-nav-tabs-border-radius: 0.375rem;
    --bs-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #dee2e6;
    --bs-nav-tabs-link-active-color: #495057;
    --bs-nav-tabs-link-active-bg: #fff;
    --bs-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #fff;
    border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color);
}

.thubmnail-desc {
    padding: 0 10px;
}

.product-header {
    font-weight: 500;
    color: #000;
    padding-bottom: 10px;
    border-bottom: 2px solid #000;
}

.opttable {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    word-wrap: break-word;
    word-break: keep-all;
}

.tb-right {
    text-align: right;
}

.opttable th {
    padding: 14px 0;
    font-size: 13px;
    font-weight: 500;
    vertical-align: middle;
    color: #111;
}

.opttable td {
    position: relative;
    font-size: 16px;
    font-weight: 500;
    vertical-align: middle;
    letter-spacing: 0.05px;
}

.cs-price {
    color: #aaaaaa;
    text-decoration: line-through;
}

.price {
    padding-left: 10px;
    font-weight: 600;
    color: #000;
}

.opt_added {
    margin: 0;
    padding: 0;
    border-bottom: 0;
    list-style: none;
}

.opt_list {
    padding: 10px 15px;
    background: #f9f9f9;
    border: 1px solid #e6e9ed;
    margin: 10px 0;
    position: relative;
}

.opt_added li .opt_name {
    line-height: 28px;
    font-weight: bold;
}

.opt_subj {
    display: inline-block;
    margin: 0 5px 15px 0px;
    color: #666;
    letter-spacing: 0;
}

.sound_only {
    display: inline-block !important;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 0;
    line-height: 0;
    border: 0 !important;
    overflow: hidden !important;
}

.td_number .opt_count {
    display: flex;
}

.td_number button,
.opt_added button {
    float: left;
    width: 30px;
    height: 30px;
    border: 1px solid #bdc9dc;
    border-radius: 0;
    background: #fff;
    color: #666;
    font-size: 0.92em;
}

.td_number .num_input,
.opt_added .num_input {
    float: left;
    border: 0;
    height: 30px;
    border-top: 1px solid #e4e4e4;
    border-bottom: 1px solid #e4e4e4;
    text-align: center;
    padding: 0;
}

.opt_added li:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}

.opt_count button i {
    line-height: 2;
}

.opt_added .opt_price {
    display: block;
    float: right;
    width: 100px;
    padding: 0 3px;
    text-align: right;
    line-height: 30px;
    font-size: 15.4px;
    font-weight: bold;
    color: #666;
}

.tot_price {
    margin-bottom: 20px;
    margin-top: 20px;
    font-size: 19px;
    line-height: 45px;
    font-weight: bold;
    text-align: right;
    border-top: 2px solid #000;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}
    /*.tot_price:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}*/
    .tot_price span {
        display: inline-block;
        /*margin: 0 5px 15px 0px;*/
        color: #666;
        letter-spacing: 0;
        float: left;
    }

    .tot_price strong span {
        margin-left: 15px;
        color: #000;
        font-size: 19px;
        letter-spacing: -1px;
    }

.buy_btn {
    margin-top: 10px;
}
/*@media (max-width: 768px) {
    .buy_btn {
        display: none;
    }
}*/
.btn_cart {
    float: left;
    height: 50px;
    font-weight: bold;
    font-size: 16px;
    width: 49%;
    margin-right: 1%;
    margin-bottom: 0;
    background: #fff;
    color: #000;
    border: 1px solid #98a3b3;
}

.btn_buy {
    float: left;
    height: 50px;
    width: 100%;
    font-weight: bold;
    font-size: 16px;
    width: 49%;
    margin-right: 1%;
    margin-bottom: 0;
    background: #222;
    border: 1px solid #222;
    color: #fff;
}

.tr_opt {
    border-top: 1px solid #e2e2e2;
}

.pdt_detail {
    display: inline-block;
    width: 100%;
    position: relative;
    min-height: 600px;
    margin-top: 20px;
    margin-bottom: 30px;
    border: 1px solid #e8e8e8;
    background: #fff;
}

.pdt_tab {
    border-bottom: 1px solid #e8e8e8;
    background: #fff;
    padding: 0;
}

.tab_item {
    background: #fff;
    padding: 25px 15px;
}

.pdt_tab li {
    width: 25%;
    border-right: 1px solid #eee;
    box-sizing: border-box;
    display: inline-block;
    float: left;
}

    .pdt_tab li button {
        height: 50px;
        padding: 15px 0;
        line-height: 20px;
        display: block;
        width: 100%;
        position: relative;
        border: 0;
        color: #666;
        background: #fff;
        text-align: center;
        z-index: 1;
    }

    .pdt_tab li .selected {
        background: #222;
        color: #fff;
        z-index: 2;
        border-bottom-color: #fff;
        font-weight: bold;
    }

.pdt_tab:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}

.pdt_explain img {
    max-width: 100%;
    height: auto;
}

.btn_mobile {
    display: none;
}

.btn_close {
    display: none;
}

@media (max-width: 900px) {
    .btn_mobile {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 10px;
        background: #fff;
        border-top: 1px solid #000;
        z-index: 100;
        -webkit-box-shadow: 0 0 9px rgba(0,0,0,0);
        -moz-box-shadow: 0 0 9px rgba(0,0,0,0);
        box-shadow: 0 0 6px rgba(0,0,0,0);
    }

        .btn_mobile button {
            width: 100%;
            text-align: center;
            font-weight: bold;
            background: #222;
            border: 1px solid #222;
            color: #fff;
            height: 45px;
        }

    .box-quantity {
        display: none;
        position: fixed;
        padding: 20px;
        bottom: 0;
        left: 0;
        width: 100%;
        background: #fff;
        z-index: 90;
        border-top: 1px solid #000;
        -webkit-box-shadow: 0 0 9px rgba(0,0,0,0);
        -moz-box-shadow: 0 0 9px rgba(0,0,0,0):;
        box-shadow: 0 0 6px rgba(0,0,0,0);
    }

    .btn_close {
        display: block;
        position: absolute;
        top: -25px;
        left: 50%;
        width: 60px;
        height: 25px;
        margin-left: -30px;
        border: 1px solid #000;
        border-bottom: 0;
        background: #fff;
        border-radius: 3px 3px 0 0;
    }
}

@media (max-width: 480px) {
    .pdt_tab li button {
        font-size: 12px;
    }

    .pdt_desc {
        font-size: 12px;
    }

    .pdt_explain {
        font-size: 12px;
    }

    .pdt_desc p {
        font-size: 12px;
    }
}

.list_show {
    display: list-item;
}

.item_selected {
    margin-bottom: 20px;
}
.order_my_title {
    font-size: 31px;
    font-weight: bold;
    padding: 40px 0;
    margin: 0 !important;
    text-align: center;
}
@media (max-width: 768px) {
    div {
        font-size: 12px;
    }

    .order_title {
        text-align: center;
        margin: 0px 0;
        font-weight: bold;
        padding: 20px 0;
        font-size: 20px;
    }
    .order_my_title {
        font-size: 20px;
        font-weight: bold;
        padding: 30px 0;
        margin: 0 !important;
        text-align: center;
    }
    .tbl_selected thead {
        display: none;
    }
    .tbl_selected tbody td:first-child:before {
        content: "상품명"
    }

    .tbl_selected tbody td:nth-child(2):before {
        content: "총수량"
    }

    .tbl_selected tbody td:nth-child(3):before {
        content: "판매가"
    }

    .tbl_selected tbody td:nth-child(4):before {
        content: "GV"
    }

    .tbl_selected tbody td:nth-child(5):before {
        content: "소계"
    }

    .tbl_selected tbody td:nth-child(6):before {
        content: "소계GV"
    }
/*    .tbl_selected tbody td:nth-child(7):before {
        content: "소계PV"
    }*/
/*    .tbl_selected tbody td:nth-child(7):before {
        content: "배송비"
    }*/

    .tbl_selected tbody td {
        display: block;
        position: relative;
        float: right;
        width: 100%;
        padding: 10px 10px;
        padding-left: 28% !important;
        text-align: left;
    }

        .tbl_selected tbody td:before {
            display: block;
            position: absolute;
            left: 0;
            top: 0;
            float: left;
            width: 25%;
            height: 100%;
            padding: 10px 10px;
            font-size: 1em;
            text-align: left;
            vertical-align: middle;
            background: #f8f8f8;
            white-space: nowrap;
            overflow: hidden;
        }

    .tbl_selected tbody .pdt_img {
        position: relative;
        top: 0;
        left: 0;
    }

    .tbl_selected tbody .pdt_name {
        min-height: auto;
    }

    .pdt_left {
        display: block;
        width: 100% !important;
        padding: 0;
        margin-right: 0;
        margin-top: 25px;
    }

    .ord_form table th {
        display: block;
        width: 100%;
        line-height: 30px;
        padding: 0px 10px;
    }

    .ord_form table td {
        display: block;
        width: 100%;
        padding: 10px;
        line-height: 45px;
    }

    .pdt_right {
        display: block;
        width: 100% !important;
        padding: 0;
    }
}

.order_title {
    font-size: 21px;
    font-weight: bold;
    padding: 20px 0;
    margin: 0 !important;
}

.tbl_selected {
    position: relative;
    border-bottom: 1px solid #d3d3d3;
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

    .tbl_selected th {
        padding: 20px 0;
        border-top: 2px solid #959da6;
        border-bottom: 1px solid #d3d3d3;
        color: #383838;
        font-size: 16px;
        text-align: center;
        letter-spacing: -0.01px;
    }

    .tbl_selected td:first-child {
        border-left: 0;
    }

    .tbl_selected td:last-child {
        border-right: 0;
    }

    .tbl_selected .td_pdt {
        position: relative;
        padding-left: 120px;
        min-height: 100px;
        border-left: 0;
    }


    .tbl_selected td {
        background: #fff;
        background-clip: padding-box;
        padding: 25px 15px;
        border-top: 1px solid #ccd2d9;
        border-left: 1px solid #f6f6f6;
        line-height: 1.5em;
        word-break: break-all;
        color: #000;
        font-size: 13px;
    }



.td_number {
    width: 80px;
    text-align: center;
}
.td_addr {
    width: 120px;
    text-align: center;
}

.td_price {
    width: 100px;
    text-align: right;
}
.td_pdtname {
    width: 150px;
    text-align: right;
}

.td_deli {
    width: 100px;
    text-align: center;
}

.pdt_img {
    position: absolute;
    top: 25px;
    left: 20px;
}

.pdt_name {
    min-height: 80px;
}

.pdt_opt {
    margin: 5px 0;
}

    .pdt_opt ul {
        display: inline-block;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .pdt_opt li {
        color: #000;
        padding: 3px 0;
        line-height: 2.3em;
    }

        .pdt_opt li:before {
            content: "옵션";
            display: inline-block;
            margin: 1px 5px 2px 0;
            padding: 3px;
            border-radius: 3px;
            background: #e2eaf6;
            line-height: 1em;
            color: #3a8afd;
        }

.pdt_left {
    margin: 0 0 30px;
    /*border: 1px solid #e3e5e8;*/
    background: #fff;
    width: 62%;
    display: inline-block;
    float: left;
    margin-right: 0;
    margin-top: 25px;
}

    .pdt_left h2 {
        background-color: #f7f7f7;
        border-bottom: 1px solid #e2e4e7;
        padding: 20px;
        font-size: 1.167em;
        font-weight: bold;
    }

.ord_form {
    border: 1px solid #e3e5e8;
    margin: 0 0 30px;
    background: #fff;
}

.tbl_content {
    padding: 0px 10px;
    margin: 0 0 20px;
}

    .tbl_content table {
        margin: 20px auto;
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
    }

    .tbl_content th {
        width: 94px;
        padding: 10px;
        line-height: 45px;
        text-align: left;
        font-weight: normal;
        vertical-align: top;
    }

    .tbl_content td {
        padding: 10px;
        line-height: 45px;
        text-align: left;
    }

.order_text {
    width: 100%;
    height: 40px;
    margin: 0 0 5px;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 3px;
}

.btn_address {
    background: #434a54;
    color: #fff;
    width: 128px;
    height: 45px;
    border: 0;
    border-radius: 3px;
}

.pdt_receive {
    /*margin: 0 0 30px;*/
    border: 1px solid #e3e5e8;
    background: #fff;
    padding: 0;
}

.pdt_right {
    float: right;
    width: 35%;
    margin-top: 25px;
    display: inline-block;
    height: 100%;
    vertical-align: top;
}

.pdt_tot_price {
    border: 1px solid #e3e5e8;
}



    .pdt_tot_price li {
        position: relative;
        float: left;
        background: #fff;
        height: 70px;
        text-align: center;
        border-bottom: 1px solid #e7ebf1;
        padding: 15px 0;
    }

        .pdt_tot_price li:last-child {
            border-bottom: 0 none;
        }

        .pdt_tot_price li:after {
            display: block;
            visibility: hidden;
            clear: both;
            content: "";
        }

.ord_sell {
    border-right: 1px solid #e7ebf1;
    width: 50%;
}

.pdt_tot_price li span {
    display: block;
    color: #777;
    margin-bottom: 5px;
    font-weight: bold;
}

.ord_deli {
    width: 50%;
}

    .ord_deli:before {
        display: block;
        content: "+";
        position: absolute;
        top: 25px;
        left: -11px;
        width: 20px;
        height: 20px;
        background: #fff;
        color: #ff006c;
        border-radius: 50%;
        border: 1px solid #e7ebf1;
        font-weight: bold;
        font-size: 16px;
        line-height: 17px;
    }

.pdt_tot_price .ord_tot {
    width: 100%;
    clear: both;
    height: 40px;
    padding: 0 15px;
    line-height: 40px;
    text-align: right;
}

.tot_span {
    float: left;
    margin: 0;
}

.pdt_tot_price:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}

.ord_tot strong {
    color: #ff006c;
    font-size: 16px;
}

.pdt_pay {
    position: relative;
    margin: 10px 0 0;
    padding: 0;
}

.pay_deli {
    border: 1px solid #e3e5e8;
    border-bottom: 0 none;
}

    .pay_deli table {
        width: 100%;
        border-collapse: collapse;
    }

        .pay_deli table th {
            text-align: center;
            background: #f8f8f8;
            padding: 10px;
            width: 180px;
            border-bottom: 1px solid #e7ebf1;
            font-weight: bold;
            color: #777;
        }

        .pay_deli table td {
            text-align: right;
            padding: 10px;
            height: 30px;
            border-bottom: 1px solid #e7ebf1;
            background: #fff;
        }

.od_tot_price {
    border: 1px solid #e3e5e8;
    background: #e5f0ff;
    line-height: 20px;
    text-align: right;
    padding: 15px;
    margin: 10px 0;
    display: flex;
    justify-content: space-between;
}

    .od_tot_price span {
        /*float: left;*/
        font-weight: bold;
    }

    .od_tot_price strong {
        font-size: 19px;
        color: #ff006c;
    }

.pay_cont h3 {
    font-size: 15px;
    margin: 20px 0 5px;
}

.pay_cont input[type="radio"] {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    visibility: hidden;
    text-indent: -999px;
    left: 0;
}

    .pay_cont input[type="radio"]:checked + .lb_icon {
        color: #3a8afd;
        z-index: 3;
        border: 1px solid #ff006c;
    }

.pay_cont [class~=lb_icon] {
    width: 100%;
}

.pay_cont .lb_icon {
    display: inline-block;
    position: relative;
    cursor: pointer;
    z-index: 1;
    float: left;
    height: 60px;
    padding-left: 65px;
    padding-top: 20px;
    margin: -1px 0 0 -1px;
    border: 1px solid #eceff4;
}

.pay_cont .bank_icon {
    background: url('../../../img/pay_icon1.png') no-repeat 15px 50% #fff;
}

.pay_cont .card_icon {
    background: url('../../../img/pay_icon4.png') no-repeat 15px 50% #fff;
}

#case_bank {
    border: 1px solid #e3e5e8;
    border-top: 0 none;
    background: #fff;
    padding: 10px;
    clear: both;
    line-height: 32px;
}

    #case_bank label {
        float: left;
        width: 30%;
        line-height: 30px;
    }


#case_card {
    border: 1px solid #e3e5e8;
    /*border-top: 0 none;*/
    background: #fff;
    padding: 10px;
    clear: both;
    line-height: 32px;
}

    #case_card label {
        float: left;
        width: 30%;
        line-height: 30px;
    }

#case_card_3 {
    border: 1px solid #e3e5e8;
    /*border-top: 0 none;*/
    background: #fff;
    padding: 10px;
    clear: both;
    line-height: 32px;
}

#case_card_3 label {
    float: left;
    width: 30%;
    line-height: 30px;
}
.deposit_name {
    height: 32px;
    padding: 0 5px;
    border: 1px solid #e3e5e8;
    width: 100%;
    margin: 0 0 5px;
    background: #fff;
}

.pay_btn_cont {
    border: 0;
    background: #fff;
    padding: 20px;
    text-align: center;
}

.btn_order {
    width: 45%;
    background: #333;
    border: 1px solid #333;
    margin: 0px 5px;
    font-weight: normal;
    height: 50px;
    cursor: pointer;
    color: #fff;
    border-radius: 3px;
}

.btn_cancel {
    width: 45%;
    background-color: #fff;
    border: 1px solid #333;
    margin: 0px 5px;
    height: 50px;
    line-height: 50px;
    font-weight: bold;
    font-size: 16px;
    display: inline-block;
    vertical-align: middle;
    border-radius: 3px;
}

.text-center {
    text-align: center !important;
}

.btn_cart_container {
    padding: 20px 0;
    border-bottom: 1px solid #ccd2d9;
}

.btn_cart_opt {
    background: #666;
    color: #fff;
    border: 1px solid #666;
    border-radius: 3px;
    height: 30px;
    padding: 0 10px;
}

.cart_tot {
    border: 1px solid #ddd;
    margin-bottom: 40px;
    margin: 20px 0;
}

    .cart_tot li {
        float: left;
        width: 33.33%;
        background: #4a505a;
        color: #fff;
        border-left: 1px solid #212a37;
        text-align: right;
        padding: 25px;
        font-size: 15px;
    }

        .cart_tot li:first-child {
            border: 0;
        }

.cart_tot_deli {
    background: #fff !important;
    color: #000 !important;
}

.cart_tot li span {
    display: inline-block;
    float: left;
}

.cart_tot_amt {
    width: 33.335% !important;
    background: #212a37 !important;
}

    .cart_tot_amt span {
        visibility: hidden;
        line-height: 0;
    }

        .cart_tot_amt span:before {
            font-size: 1em;
            color: #fff;
            display: block;
            content: "총금액";
            visibility: visible;
            line-height: 1.5em;
        }

.cart_tot ul:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}

.cart_go_container {
    margin: 30px 0;
    text-align: center;
}

.goonshop {
    width: 20%;
    font-weight: normal;
    padding: 0 20px;
    background: #fff;
    border: 1px solid #333;
    margin: 0px 5px;
    height: 50px;
    line-height: 50px;
    font-size: 16px;
    display: inline-block;
}

.btn_order {
/*    width: 20%;*/
    display: inline-block;
    padding: 0 20px;
    background: #333;
    border: 1px solid #333;
    margin: 0px 5px;
    height: 50px;
    font-size: 16px;
}

.w-50px {
    width: 50px !important;
}

.radio-danger label {
    margin-left: 5px;
}
.header-top-right ul li a .cart-count {
    background: #ea3a3c none repeat scroll 0 0;
    border-radius: 100%;
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    line-height: 18px;
    position: absolute;
    right: -19px;
    text-align: center;
    text-transform: capitalize;
    top: 14px;
    width: 18px;
}
.single-categorie_li {
    color: #7a7a7a;
    font-size: 14px;
    line-height: 25px;
}

.point-use-label {
    position: absolute;
    padding: 10px;
    font-weight: 400;
}
.point-won {
    position: absolute;
    padding: 10px;
    font-weight: 400;
    right: 11%;
}

@media (max-width: 768px) {
    .point-won {
        right: 32%;
    }

}
    .point-use-container {
        padding-top: 20px;
        display: flex;
        justify-content: space-between;
    }

    .point_order {
        width: 74%;
        margin: 0 0 5px;
        border: 1px solid #ccc;
        background: #fff;
        border-radius: 3px;
        height: 40px;
        font-size: 15px;
        color: #000;
        position: relative;
        /*display: inline-block;*/
        padding-right: 30px;
    }

    .point_use_btn {
        display: inline-block;
        padding: 0 10px;
        background: #5997eb;
        height: 40px;
        font-size: 14px;
        border: 1px solid #5997eb;
        border-radius: 5px;
        font-weight: 600;
    }




    /*제품구독 등록내역*/
    @media (max-width: 768px) {
        .tbl_selected_autolist thead {
            display: none;
        }

        .tbl_selected_autolist tbody td:first-child:before {
            content: "제품구독번호"
        }

        .tbl_selected_autolist tbody td:nth-child(2):before {
            content: "상태"
        }

        .tbl_selected_autolist tbody td:nth-child(3):before {
            content: "등록일자"
        }

        .tbl_selected_autolist tbody td:nth-child(4):before {
            content: "상품명"
        }

        .tbl_selected_autolist tbody td:nth-child(5):before {
            content: "판매가"
        }

        .tbl_selected_autolist tbody td:nth-child(6):before {
            content: "GV"
        }

        .tbl_selected_autolist tr {
            border-bottom: 10px solid transparent;
        }

        .tbl_selected_autolist tbody td {
            display: block;
            position: relative;
            float: right;
            width: 100%;
            padding: 10px 10px;
            padding-left: 28% !important;
            text-align: left;
            font-size: 16px;
        }

            .tbl_selected_autolist tbody td:before {
                display: block;
                position: absolute;
                left: 0;
                top: 0;
                float: left;
                width: 25%;
                height: 100%;
                padding: 10px 10px;
                font-size: 0.9em;
                text-align: left;
                vertical-align: middle;
                background: #f8f8f8;
                white-space: nowrap;
                overflow: hidden;
            }

        .tbl_selected_autolist tbody .pdt_img {
            position: relative;
            top: 0;
            left: 0;
        }

        .tbl_selected_autolist tbody .pdt_name {
            min-height: auto;
        }
    }



    .tbl_selected_autolist {
        position: relative;
        border-bottom: 1px solid #d3d3d3;
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
    }

        .tbl_selected_autolist th {
            padding: 20px 0;
            border-top: 2px solid #959da6;
            border-bottom: 1px solid #d3d3d3;
            color: #383838;
            font-size: 18px;
            text-align: center;
            letter-spacing: -0.01px;
        }

        .tbl_selected_autolist td:first-child {
            border-left: 0;
        }

        .tbl_selected_autolist td:last-child {
            border-right: 0;
        }

        .tbl_selected_autolist .td_pdt {
            position: relative;
            padding-left: 270px;
            /*min-height: 100px;*/
            border-left: 0;
        }


        .tbl_selected_autolist td {
            background: #fff;
            background-clip: padding-box;
            padding: 25px 15px;
            border-top: 1px solid #ccd2d9;
            border-left: 1px solid #f6f6f6;
            line-height: 1.5em;
            word-break: break-all;
            color: #000;
            font-size: 18px;
        }



    /*제품구독 결제내역*/
    @media (max-width: 768px) {
        .tbl_selected_paylist thead {
            display: none;
        }

        .tbl_selected_paylist tbody td:first-child:before {
            content: "제품구독번호"
        }

        .tbl_selected_paylist tbody td:nth-child(2):before {
            content: "결제일"
        }

        .tbl_selected_paylist tbody td:nth-child(3):before {
            content: "결과"
        }

        .tbl_selected_paylist tbody td:nth-child(4):before {
            content: "상태"
        }

        .tbl_selected_paylist tbody td:nth-child(5):before {
            content: "카드명"
        }

        .tbl_selected_paylist tbody td:nth-child(6):before {
            content: "결제금액"
        }

        .tbl_selected_paylist tbody td:nth-child(7):before {
            content: "GV"
        }

        .tbl_selected_paylist tbody td:nth-child(8):before {
            content: "비고"
        }

        .tbl_selected_paylist tr {
            border-bottom: 10px solid transparent;
        }

        .tbl_selected_paylist tbody td {
            display: block;
            position: relative;
            float: right;
            width: 100%;
            padding: 10px 10px;
            padding-left: 28% !important;
            text-align: left;
            font-size: 16px;
        }

            .tbl_selected_paylist tbody td:before {
                display: block;
                position: absolute;
                left: 0;
                top: 0;
                float: left;
                width: 25%;
                height: 100%;
                padding: 10px 10px;
                font-size: 0.9em;
                text-align: left;
                vertical-align: middle;
                background: #f8f8f8;
                white-space: nowrap;
                overflow: hidden;
            }

        .tbl_selected_paylist tbody .pdt_img {
            position: relative;
            top: 0;
            left: 0;
        }

        .tbl_selected_paylist tbody .pdt_name {
            min-height: auto;
        }
    }



    .tbl_selected_paylist {
        position: relative;
        border-bottom: 1px solid #d3d3d3;
        width: 100%;
        border-collapse: collapse;
        border-spacing: 0;
    }

        .tbl_selected_paylist th {
            padding: 20px 0;
            border-top: 2px solid #959da6;
            border-bottom: 1px solid #d3d3d3;
            color: #383838;
            font-size: 18px;
            text-align: center;
            letter-spacing: -0.01px;
        }

        .tbl_selected_paylist td:first-child {
            border-left: 0;
        }

        .tbl_selected_paylist td:last-child {
            border-right: 0;
        }

        .tbl_selected_paylist .td_pdt {
            position: relative;
            padding-left: 170px;
            /*min-height: 100px;*/
            border-left: 0;
        }


        .tbl_selected_paylist td {
            background: #fff;
            background-clip: padding-box;
            padding: 25px 15px;
            border-top: 1px solid #ccd2d9;
            border-left: 1px solid #f6f6f6;
            line-height: 1.5em;
            word-break: break-all;
            color: #000;
            font-size: 18px;
        }




    /*.slider {
    position: relative;
    width: 100%;
    max-width: 1930px;*/ /* 배너 최대 크기 */
    /*height: 700px;*/ /* 배너 높이 */
    /*overflow: hidden;
    margin: auto;
}

.slides {
    display: flex;
    width: 300%;*/ /* 슬라이드 개수 * 100% */
    /*transition: transform 0.5s ease-in-out;
}

.slide {
    width: 100%;
    flex-shrink: 0;
}

    .slide img {*/
    /*width: 100%;*/
    /*height: auto;
        object-fit: cover;*/ /* 비율 유지하면서 꽉 채우기 */
    /*}

@media (max-width: 768px) {
    .slide img {
        height: 400px;*/ /* 모바일에서 원하는 높이 */
    /*}
}*/
    button.prev,
    button.next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(0,0,0,0.5);
        color: white;
        border: none;
        padding: 15px;
        cursor: pointer;
        font-size: 20px;
        border-radius: 50%;
    }

    button.prev {
        left: 20px;
    }

    button.next {
        right: 20px;
    }

        button.prev:hover,
        button.next:hover {
            background: rgba(0,0,0,0.8);
        }

    .flex-direction-column {
        flex-direction: column;
    }

    .form-group {
        margin-bottom: 1.75rem;
        position: relative;
    }

    .form-control {
        display: block;
        width: 100%;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5 -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
        transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    }

    .border-0 {
        border: 0 !important;
    }

    .footer_dark_ten .dark_f_bottom .f_menu li a:hover, .footer_dark_ten .dark_f_bottom a {
        font-weight: 600;
        color: #00532f;
    }


    .readonly-style {
        background-color: #e9ecef; /* 회색 배경 */
        pointer-events: none; /* 마우스 클릭, 포커스 등 비활성화 */
        /* 또는 JavaScript로 readonly 속성을 동적으로 추가/제거 */
    }

    .mt-10 {
        margin-top: 10px;
    }

    .bottom-text {
        font-size: 17px;
        font-weight: 400 !important;
    }

    @media (max-width: 768px) {
        .mo-line {
            margin-bottom: 0 !important;
            border-bottom: 1px solid #ccc;
        }

        .bottom-text {
            font-size: 14px;
            font-weight: 400 !important;
        }
    }

    .text-danger {
        color: red;
    }

    #add_card {
        background: #f1f1f1;
        border: 1px dashed #666;
        padding: 6px 10px;
        cursor: pointer;
        margin-bottom: 10px;
        border-radius: 4px;
    }

    .remove-card {
        border: 0;
        background: #fff;
        cursor: pointer;
    }

    .btn_pay_card {
        width: 100%;
        font-size: 16px;
        background: #222;
        border: 1px solid #222;
        color: #fff;
    }

    .s_prd {
        font-size: 1.2em;
        font-weight: bold;
        white-space: nowrap; /* 줄바꿈 방지 */
    }


    .e_prd {
        font-size: 1.2em;
        color: #555;
        white-space: nowrap;
    }

    @media (max-width: 768px) {
        .s_prd {
            font-size: 1.2em !important;
            ; /* 모바일에서 폰트 크기 조정 */
            margin-bottom: 3px; /* 모바일에서 가격 아래 여백 */
        }

        .e_prd {
            font-size: 1.2em !important; /* 모바일에서 폰트 크기 조정 */
        }
    }

    .btn_t_delete {
        border: 1px solid #ccc;
        color: #000;
    }

    .btn_t_write {
        border: 1px solid #d2d2d2;
        color: #000;
    }

    .border-1 {
        border-top: 1px solid #eee;
        border-bottom: 1px solid #eee;
    }

    .font-size-title {
        color: #000;
        font-weight: 600;
        font-size: 20px;
    }

    #<%= tbl_notice.ClientID % > {
        table-layout: fixed;
        width: 100%; /* 테이블 전체 너비를 100%로 설정 */
    }

    /* 제목 열 (가장 넓게) */
    .col-title {
        width: 60%; /* 전체 너비의 60%를 차지 */
        text-align: left; /* 제목은 보통 왼쪽 정렬이 보기 좋습니다 */
        white-space: nowrap; /* 내용이 길어도 한 줄로 표시 */
        overflow: hidden; /* 넘치는 내용은 숨김 */
        text-overflow: ellipsis; /* 넘치는 내용에 ... 표시 */
    }

    /* 작성자 열 */
    .col-userid {
        width: 15%;
        white-space: nowrap; /* 내용이 길어도 한 줄로 표시 */
    }

    /* 조회수 열 */
    .col-hit {
        width: 10%;
        white-space: nowrap; /* 내용이 길어도 한 줄로 표시 */
    }

    /* 등록일 열 */
    .col-date {
        width: 15%;
        white-space: nowrap; /* 내용이 길어도 한 줄로 표시 */
    }

    /* 체크박스 열 (만약 있다면) - 가장 좁게 */
    .col-checkbox { /* 필요하다면 체크박스 셀에도 클래스를 추가하세요 */
        width: 50px; /* 고정 픽셀 값으로 지정하는 것이 편할 수 있습니다 */
    }