#site-content {
    /*height: calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right));
    margin: 0;
    padding: 0;*/
}

#top-header, #top-navbar {
    top: 0;
}
/* select, option */
.select_del { background-color: transparent; color: #fef102;  }
.select_del option { background : #000; color: #fef102; }

/* Top */
.subTop_padding { padding-top: 90px; }
.subTop_user_del { height: 100vh !important; }

#account-created-screen, #homescreen1-deatils-page, #home2-screen2 { height: 100% !important; padding-bottom: 50px; }

/* login */
#eye { line-height: 40px !important; }
.remember-section { padding-top: 20px !important; padding-bottom: 20px !important; }
#sign-in-section-page { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 100vh; }
#join-in-section-page { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 120vh; }
#join-in-section-page .imgaes { width: 40%; height: auto; margin: 0 auto; padding-top: 60px; padding-bottom: 32px; }

.join_term_txt { padding-left: 10px; }

/* UserInfo */
.userinfo_title {font-size: 1.2rem; color: #fff; font-weight: 500; text-align: left;}
.userinfo_content {font-size: 1.2rem; color: #fef102; font-weight: 600; text-align: right; padding-right: 15px;}

/*point*/
.mynenu-total { padding: .5rem; border: 2px solid #936F26; border-radius: 12px; width: 88%; margin: 0 auto; font-size: 1.5em !important; }
.mynenu-total .justify-content-center p { text-align: left; }
.mynenu-total .justify-content-center .point-txt { font-size: 1.2rem; color: #fff; font-weight: 500; text-align: left; }
.mynenu-total .justify-content-center .my-point { font-size: 1.2rem; color: #fef102; font-weight: 600; text-align: right; padding-right: 2px; }

/* system notice */
.sys_notice_container { }
.sys_notice_span { }
.sys_notice_div { }

.soldout_mask { border: #936f26 3px solid; box-sizing: border-box; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1000; background-color: rgba(0, 0, 0, 0.6); background-image: url("/images/gd/soldout_1.png"); background-repeat: no-repeat; background-size: auto; background-position: left bottom; }

/* modal */
#alarm-modal .modal-content { background: #936F26;width: 80%;margin: 0 auto;border-radius: 6px; border: 5px solid #fff; outline: 2px solid #fef102; }
#alarm-modal .modal-header { border: 0; }
#alarm-modal .modal-header .modal-txt { text-align: center; color: #fef102; font-weight: 600; width: 100%; font-size: 1.6rem; }
#alarm-modal .modal-body p { text-align: center; color: #fff; margin-bottom: 16px; }
#alarm-modal .modal-body input { width: 70%; margin: 0 auto; text-align: center; }
#alarm-modal .modal-body .image-btn img { width: 200px; }
#alarm-modal .modal-header button { filter: brightness(0) saturate(100%) invert(80%) sepia(100%) saturate(250%) hue-rotate(337deg) brightness(100%) contrast(102%); }

.custom-modal .modal-content { background: #936F26;width: 90%;margin: 0 auto;border-radius: 6px; border: 5px solid #fff; outline: 2px solid #fef102; }
.custom-modal .modal-content-1 { background: #936F26;width: 90%;margin: 0 auto;border-radius: 6px; border: 5px solid #e16b6b; outline: 2px solid #b73333; }
.custom-modal .modal-content-full { background: #936F26;width: 100%;margin: 0 auto;border-radius: 6px; border: 5px solid #e16b6b; outline: 2px solid #b73333; }
.custom-modal .modal-header { border: 0; }
.custom-modal .modal-header .modal-txt { text-align: center; color: #fef102; font-weight: 600; width: 100%; font-size: 1.6rem; }
.custom-modal .modal-body p { text-align: center; color: #fff; margin-bottom: 16px; }
/*.custom-modal .modal-body input { width: 70%; margin: 0 auto; text-align: center;  margin-bottom: 10px;}*/
.custom-modal .modal-body input { width: 70%; margin: 0 auto; text-align: center;}
.custom-modal .modal-body select { width: 70%; margin: 0 auto; text-align: center; margin-bottom: 10px;}
.custom-modal .modal-body .image-btn img { width: 200px; }
.custom-modal .modal-header button { filter: brightness(0) saturate(100%) invert(80%) sepia(100%) saturate(250%) hue-rotate(337deg) brightness(100%) contrast(102%); }

.custom-modal .modal-fullscreen-sm-down .modal-content { width: 100%!important; }

/* modal small button */
.custom-modal .open_btn_box { width: 100%; height: 26px; border-radius: 20%; position : relative; }
.custom-modal .open_btn_box button { background: url(/assets/images/gd/btn_bg21.png); background-repeat: no-repeat; background-position: 0px 0px; background-size: contain; font-size: 10px; line-height: 10px; }
.container_skip { display: none; }
.container_prd { display: none; }
.container_prd .out-item { border: 1px solid #555; background: #00000033; padding: .7rem;}
.container_prd .tab-home1-txt1 { width: 100%; overflow: hidden; text-overflow: ellipsis; text-align: left !important; margin-bottom: 6px !important; white-space: normal; }
.container_prd .tab-home1-txt2 { color: #fef102; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 16px; margin-top: 2px; float: left; }
.container_prd .cate { width: 100%; text-align: left !important; margin-bottom: 0px !important; }
.container_prd .home1-tab-img { width: 72px; height: 72px; margin-right: 10px; display: flex; align-items: center; justify-content: right; border-radius: 8px; background: #fff; }
.container_prd .home1-tab-img img { mix-blend-mode: multiply; width: 72px; border: 2px solid transparent; border-radius: 15%; background-image: linear-gradient(#fff, #fff), linear-gradient(180deg, #936F26 0%, #FEF102 100%); border-image-slice: 1; background-origin: border-box; background-clip: content-box, border-box; }
.container_prd .home1-tab-details { width: 68%; }
.container_prd .home1-tab-info { margin-left: 12px; position: relative; line-height: 8px; width: 20%; }

#OpenMultiModal .open_bg_multi { background-repeat: no-repeat; background-size: cover; background-position: center; }

.container_prd_over {
    width: 100%;
    margin: 0 auto;
    position: relative;
    top: 0; /* 화면 위에서 시작 */
    display: none; /* 초기에는 숨김 */
    z-index: 9999;
    padding: 0px 60px;
}

.container_prd_over_img {
    position: relative;
    z-index: 0;
    overflow: hidden;
    padding: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: sans-serif;
    font-weight: bold;
    &::before
    {
        content: '';
        position: absolute;
        z-index: -2;
        left: -50%;
        top: -50%;
        width: 200%;
        height: 200%;
        background-color: #399953;
        background-repeat: no-repeat;
        background-size: 50% 50%, 50% 50%;
        background-position: 0 0, 100% 0, 100% 100%, 0 100%;
        background-image: linear-gradient(#399953, #399953), linear-gradient(#fbb300, #fbb300), linear-gradient(#d53e33, #d53e33), linear-gradient(#377af5, #377af5);
        animation: rotate 2s linear infinite;
    }

    &::after {
        content: '';
        position: absolute;
        z-index: -1;
        left: 6px;
        top: 6px;
        width: calc(100% - 12px);
        height: calc(100% - 12px);
        background: white;
        border-radius: 5px;
    }
}

.container_prd_over_img img {
    width: 100%;
    border-radius: 50px;

}

@keyframes rotate {
    100% {
        transform: rotate(1turn);
    }
}
/*
.container_prd_over_img:before, .container_prd_over_img:after {
    content: '';
    position: absolute;
    left: -2px;
    top: -2px;
    background: linear-gradient(45deg, #fb0094, #0000ff, #00ff00,#ffff00, #ff0000, #fb0094, #0000ff, #00ff00,#ffff00, #ff0000);
    background-size: 400%;
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    z-index: -1;
    animation: steam 30s linear infinite;
}

@keyframes steam {
    0% {
        background-position: 0 0;
    }

    50% {
        background-position: 400% 0;
    }

    100% {
        background-position: 0 0;
    }
}

.container_prd_over_img:after {
    filter: blur(50px);
}*/

.container_prd_over_txt {
    display: none;
    background-color: rgba(0, 0, 0, 0.7); /* 검정색, 70% 투명도 */
}

.container_prd_over_title {
    width: 100%;
    overflow: hidden;
    text-align: center !important;
    margin-bottom: 6px !important;
    color: #f5e909;
    font-weight: bold;
    font-size: 1.2em;
}

.container_prd_over_name {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left !important;
    padding: 5px !important;
    white-space: normal;
    color: #FFF;
    font-weight: bold;
}

.container_prd_over_price {
    color: #fef102;
    font-family: Pretendard Variable;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 16px;
    padding: 5px !important;
}

/* Keyframes 정의 */
@keyframes rotateAndDrop {
    0% {
        transform: translateY(-100vh) rotate(-720deg); /* 화면 위에서 시작 */
        opacity: 0; /* 투명 */
    }

    70% {
        transform: translateY(0) rotate(0deg); /* 원래 위치에 도달 */
        opacity: 1; /* 완전히 보임 */
    }

    100% {
        transform: translateY(0) rotate(0deg); /* 원래 위치 고정 */
        opacity: 1;
    }
}

/* 애니메이션이 실행될 때의 상태 */
.animate {
    display: block; /* 애니메이션 시작 시 보이도록 */
    /*animation: rotateAndDrop 2s ease-out forwards;*/
    /* animation slide-in-elliptic-bottom-bck */
    /*-webkit-animation: slide-in-elliptic-bottom-bck 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-elliptic-bottom-bck 0.7s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;*/
    /* animation bounce-in-bck */
    /*-webkit-animation: bounce-in-bck 1.1s both;
    animation: bounce-in-bck 1.1s both;*/
    /**/
    /*-webkit-animation: slide-in-blurred-bottom 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
    animation: slide-in-blurred-bottom 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;*/
    /**/
    -webkit-animation: roll-in-blurred-bottom 1.0s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
    animation: roll-in-blurred-bottom 1.0s cubic-bezier(0.230, 1.000, 0.320, 1.000) both;
}

/**
 * ----------------------------------------
 * animation slide-in-elliptic-bottom-bck
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-elliptic-bottom-bck {
    0% {
        -webkit-transform: translateY(600px) rotateX(-30deg) scale(6.5);
        transform: translateY(600px) rotateX(-30deg) scale(6.5);
        -webkit-transform-origin: 50% -100%;
        transform-origin: 50% -100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% 500px;
        transform-origin: 50% 500px;
        opacity: 1;
    }
}

@keyframes slide-in-elliptic-bottom-bck {
    0% {
        -webkit-transform: translateY(600px) rotateX(-30deg) scale(6.5);
        transform: translateY(600px) rotateX(-30deg) scale(6.5);
        -webkit-transform-origin: 50% -100%;
        transform-origin: 50% -100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% 500px;
        transform-origin: 50% 500px;
        opacity: 1;
    }
}

/**
 * ----------------------------------------
 * animation bounce-in-bck
 * ----------------------------------------
 */
@-webkit-keyframes bounce-in-bck {
    0% {
        -webkit-transform: scale(7);
        transform: scale(7);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: scale(1.24);
        transform: scale(1.24);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    89% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

@keyframes bounce-in-bck {
    0% {
        -webkit-transform: scale(7);
        transform: scale(7);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: scale(1.24);
        transform: scale(1.24);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    89% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: scale(1.04);
        transform: scale(1.04);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

/* ----------------------------------------------
 * Generated by Animista on 2025-1-27 8:58:49
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * 아래에서 올라오는 기능
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-blurred-bottom
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-blurred-bottom {
    0% {
        -webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
        transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) scaleY(1) scaleX(1);
        transform: translateY(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

@keyframes slide-in-blurred-bottom {
    0% {
        -webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
        transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) scaleY(1) scaleX(1);
        transform: translateY(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

/* ----------------------------------------------
 * Generated by Animista on 2025-1-27 9:6:10
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * 아래서 위로 회전
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation roll-in-blurred-bottom
 * ----------------------------------------
 */
/*@-webkit-keyframes roll-in-blurred-bottom {
    0% {
        -webkit-transform: translateY(800px) rotate(720deg);
        transform: translateY(800px) rotate(720deg);
        -webkit-filter: blur(50px);
        filter: blur(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotate(0deg);
        transform: translateY(0) rotate(0deg);
        opacity: 1;
    }
}

@keyframes roll-in-blurred-bottom {
    0% {
        -webkit-transform: translateY(800px) rotate(720deg);
        transform: translateY(800px) rotate(720deg);
        -webkit-filter: blur(50px);
        filter: blur(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotate(0deg);
        transform: translateY(0) rotate(0deg);
        opacity: 1;
    }
}*/

@-webkit-keyframes roll-in-blurred-bottom {
    0% {
        -webkit-transform: translateY(-800px);
        transform: translateY(-800px);
        -webkit-filter: blur(50px);
        filter: blur(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotate(0deg);
        transform: translateY(0) rotate(0deg);
        opacity: 1;
    }
}

@keyframes roll-in-blurred-bottom {
    0% {
        -webkit-transform: translateY(-800px);
        transform: translateY(-800px);
        -webkit-filter: blur(50px);
        filter: blur(50px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotate(0deg);
        transform: translateY(0) rotate(0deg);
        opacity: 1;
    }
}

.bounce-in-top {
    display: block;
    -webkit-animation: bounce-in-top 1.1s both;
    animation: bounce-in-top 1.1s both;
}

/* ----------------------------------------------
 * Generated by Animista on 2025-2-4 13:49:2
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation bounce-in-top
 * ----------------------------------------
 */
@-webkit-keyframes bounce-in-top {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: translateY(-65px);
        transform: translateY(-65px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: translateY(-28px);
        transform: translateY(-28px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    90% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

@keyframes bounce-in-top {
    0% {
        -webkit-transform: translateY(-500px);
        transform: translateY(-500px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    38% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        opacity: 1;
    }

    55% {
        -webkit-transform: translateY(-65px);
        transform: translateY(-65px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    72% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    81% {
        -webkit-transform: translateY(-28px);
        transform: translateY(-28px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    90% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    95% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}



.input_100vw { width: 100% !important; }
.select_100vw { width : 100%!important; }

.prd-list-modal .modal-header { border: 0; }
.prd-list-modal .modal-txt { color: #fef102; font-size: 1.6rem; }
.prd-list-modal .modal-content { background: #936F26; background: #936F26; margin: 0 auto; border-radius: 6px; border: 5px solid #fff; outline: 2px solid #fef102; width: 100%; height: 100%; }
.prd-list-modal .modal-body p { color: #fff; }
.prd-list-modal .modal-body button { margin-left: 20px; line-height: 20px; letter-spacing: 0; }
.prd-list-modal .home1-tab-info .info-btn button { background: #fef102; color: #666; margin: 0 auto; }
.btn-search { background: #fef102; color: #666; font-size: 0.8em; border: 1px solid transparent; }
.prd-list-modal .homepage1-tab-details-wrapper { border: 1px solid #fef102; padding: .7rem; }
/*.prd-list-modal .out-item { border: 1px solid #555; filter: grayscale(100%); background: #00000033; }*/
.prd-list-modal .out-item { border: 1px solid #555; background: #00000033; }
.prd-list-modal .tab-home1-txt2 { color: #fef102; }
.prd-list-modal .home1-tab-info .select-checkbox-sec label { color: #fff; }

/* buy */
.buy_main_btn {width: 160px;height: 120px;display: flex;align-items: center;justify-content: center;border-radius: 10px;}
#quantity { background: #ffffff00 !important; color: #fff !important; }

/* news */
#boxnews_sec { height: auto; }
.topimg-wrapper p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; }

/* myinfo */
#myinfo_sec {  margin-bottom: 0px; background: url(/assets/images/gd/main_bg1.png); background-position: center; background-size: cover; height: 100% !important; padding-bottom: 80px;}
#myinfo_sec .imgaes { width: 45%; height: auto; margin: 0 auto; padding-bottom: 16px; text-align: center; } 
#myinfo_sec .imgaes img { margin-left: 0px; }
#myinfo_sec .imgaes a { margin: 0 auto; font-size: .85rem; color: #fef102; }

/*.userdel_container { height: 100% !important; padding-bottom: 150px;  }*/

/* pay complate */
.section_100vh { height : 85vh; }

/* shipping */
#shipping_sec .out-item-container { background: #936F26; }
#shipping_sec .out-item { border: 1px solid #555; background: #00000033; padding: .7rem; }

#shipping_sec .tab-home1-txt1 {color: #ffffff; font-family: Pretendard Variable; font-size: 14px; font-style: normal; font-weight: 600; line-height: 18px; text-overflow: clip; white-space: break-spaces; overflow: auto; }

#notice_sec .container { background: #fff; padding-bottom: 150px !important; }

/* button */
.btn_round_golden_box { width: 100%; height: 26px; text-align: center; border-radius: 20%; display: inline; position: relative; top: -5px; }
.btn_round_golden_box .btn { background: url(/assets/images/gd/btn_bg21.png); background-color: transparent; background-repeat: no-repeat; background-position: 0px 0px; background-size: 100%; font-size: 10px; letter-spacing: -1px; line-height: 18px; }

.storage-deatails .sub_active { border : 3px dashed #936f26; border-radius: 50%; }
/* bottom */
.list_bottom_clear { height: 120px; }
.list_bottom_clear_150 { height: 150px; }
.list_bottom_clear_100 { height: 100px; }
.list_bottom_clear_50 { height: 50px; }
.bottom-tabbar a:last-child { margin-right: 24px; width: 42px; line-height: .8rem; margin-top: 0px; }

/* shipping */
#shipping_main_sec { margin-top: 80px; }
#shipping_sec { background: #fff; padding-top: 60px; padding-bottom: 100px; background: url(/assets/images/gd/main_bg1.png); background-position: center; background-size: cover; /*height: 100vh;*/ }
#shipping_sec .cate { color: #fff; }
#shipping_sec .tab-home1-txt2 { color: #fef300; }
#shipping_sec .input-group button { color: #fff; border: 1px solid #fff; z-index: 0; }
#shipping_sec .boxbuy-point .input-group .form-control { color: #000; }
.shipping_memo { color: #edef0c; font-weight: bold; }
.shipping_memo_container { border-radius: 10px; }

.pay_complate { font-size: 1.0rem; color: #fef102; font-weight: 600; padding-right: 2px; text-align: center!important; }
.shipping_complate { font-size: 1.0rem; color: #fef102; font-weight: 600; padding-right: 2px; text-align: center !important; }
.shipping_memo h4 { color: #936f26; font-size: .95rem; line-height: 1.2rem; width: 100%; }

.bt-boxbuy { width: 70%; height: 100px; margin: 0 auto; background-size: contain; background-repeat: no-repeat; position: relative;
             /*background-image: url(/assets/images/gd/boxbuy_bt_bg.png);*/ }
.bt-boxbuy button { color: #fff; font-size: 1.2rem;  text-align: center; padding: 1.2rem; margin: 0 auto; position: absolute; width: 240px; font-weight: 500; }

.home1-tab-details-prd { width: 68% !important; }

.btn_golden_buy_container { background-image: url(/assets/images/gd/icon_boxbuy1.png)!important; background-repeat : no-repeat;background-size : cover; width: 70px; height: 70px; display: block; }
.btn_golden_buy { width: 65px; border-radius : 50%; position : relative; left : 0; top: 3px; }

#prd_detail_sec { margin-top : 80px; }
/*.product_detail_price { color: #000; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 16px; margin-top: 2px; margin-bottom: 10px; float: left; }
.product_detail_pname { color: #936F26; font-family: Pretendard Variable; font-size: 1.3em; font-style: normal; font-weight: 600; line-height: 18px; margin-bottom: 10px; }
.product_detail_content { font-size: 1em; font-family: Pretendard Variable; }
*/
.product_detail_price { color: #000; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 16px; margin-top: 2px; margin-bottom: 10px; float: left; }
.product_detail_pname { color: #000; font-family: Pretendard Variable; font-size: 1.3em; font-style: normal; font-weight: 600; line-height: revert; margin-bottom: 10px; margin-top: 10px; }
.product_detail_content { font-size: 1em; font-family: Pretendard Variable; color: #000; }
/*.product_detail_img { width: 100%; padding-top: 100%; position: relative; background-size: 100% 100%; background-repeat: no-repeat; background-position: center; }
.product_detail_img img{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: center; }
*/
.product_detail_img1 img { width: 100%; }

#event_sec { height: 100% !important; padding-bottom: 100px !important; }
.event_list_container { height: 100vh !important;}

.event-list .list-rank-1 { color: #fef102; font-size: .7em; background-image: url(../images/gd/event_rankbox_1.png); background-size: cover; text-align: center; height: 30px; line-height: 2.3rem; }
.event-list .list-rank-2 { color: #fef102; font-size: .7em; background-image: url(../images/gd/event_rankbox_2.png); background-size: cover; text-align: center; height: 30px; line-height: 2.3rem; }
.event-list .list-rank-3 { color: #fef102; font-size: .7em; background-image: url(../images/gd/event_rankbox_3.png); background-size: cover; text-align: center; height: 30px; line-height: 2.3rem; }

.footer_icon { width: 55px; }
.bottom-tabbar a:first-child { margin-left: 0px; }

#cs_sec .cs-wrap { height: 100% !important; padding-bottom: 150px; }
#friends_sec .friends-wrap { height: 100% !important; padding-bottom: 150px; }

#friends_sec { background: #fff; height: 910px; padding-top: 80px; }

.friends_ul { margin-top: 0px !important }
.frdaddtmpl_lst { padding-bottom: 7px !important; }

.frdrequest_btn {padding-right: 0px !important; padding-left: 0px !important; }
.frdsend_modal_title { line-height: 30px; }

nav1 { display: flex; align-items: center; background: #936F26; width: 100%; height: 86px; border-radius: 0px; justify-content: space-between; /*column-gap: 15px;*/ -webkit-box-shadow: 0px 0px 0.5rem 0px rgba(15, 15, 15, 0.3); box-shadow: 0px 0px 0.5rem 0px rgba(15, 15, 15, 0.3); }

/* my Box */
#mybox_sec { background: #fff; height: 100% !important; padding-top: 80px; padding-bottom: 100px; }
#mybox_sec .home2-first-sec { background-color: #fff; }


/* id pw find */

#findModal .modal-content { background: #936F26; width: 100%; height: 100%; margin: 0 auto; border-radius: 6px; border: 5px solid #fff; outline: 2px solid #fef102; }
#findModal .modal-header { border: 0; }
#findModal .modal-header .modal-txt { text-align: left; color: #fef102; font-weight: 600; width: 100%; font-size: 1.6rem; }
#findModal .modal-body input { width: 100%; margin: 0 auto; margin-bottom: 10px; text-align: center; }
#findModal .modal-body label { color: #fff; }
#findModal .modal-body p { color: #fff; }
#findModal .modal-body .image-btn img { width: 200px; }


.pointshop_sec_container { background: #000 !important; }

/*.pointshop_container img { mix-blend-mode: darken; max-width: 100%; border-radius: 8px; padding: 15px; }*/
/*.pointshop_container { background: #fff; width: 100%; height: auto; border-radius: 8px; border: 1px solid #aaa; padding-bottom: 10px; margin-right: 10px; }*/
.pointshop_container {
    /*background-image: url(/assets/images/gd/shop_list.jpg);
    background-repeat:no-repeat;
    background-size: cover;
    height: 300px;
    width: 220px;
    border: 1px solid red;*/
}
.pointshop_img img { width: 100%; padding : 40px 26px 0px 26px }
.pointshop_name { padding: 0px 25px 0px 30px; margin-top: 5px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-weight: 500; line-height: 18px; width: 100%; height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pointshop_price { padding: 0px 25px 0px 30px; margin-top: 5px; color: #936f26; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: line-through;text-decoration-thickness: 2px; }
.pointshop_point { padding: 0px 25px 0px 30px; margin-top: 3px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pointshop_number_container { background: #936f26; border-radius: 100px; padding-top: 3px; padding-bottom: 6px; }
.pointshop-tab-details-wrapper { display: flex; justify-content: space-evenly; border-bottom: 1px solid #eee; }
#pointshop_sec .out-item-container { background: #936F26; }
#pointshop_sec .cate { color: #fff; }
#pointshop_sec .out-item { border: 1px solid #555; background: #00000033; padding: .7rem; }
#pointshop_sec .tab-home1-txt1 { color: #ffffff; font-family: Pretendard Variable; font-size: 14px; font-style: normal; font-weight: 600; line-height: 18px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
.pointshop-tab-details { width: 100%; }
.pointshop-txt2 { color: #fef102; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 16px; margin-top: 2px; }
#pointshop_sec { padding-top: 60px; padding-bottom: 150px; background: url(/assets/images/gd/main_bg1.png); background-position: center; background-size: cover; }
.pointshop_buy .info-btn .btn { background: url(/assets/images/gd/btn_bg21.png ); background-color: transparent; background-repeat: no-repeat; background-position: 0px 0px; background-size: 100%; font-size: 10px;  letter-spacing: -1px; line-height: 18px; margin-left: 12px; /*position: relative;*/ line-height: 8px; width: 80px; height: 42px; }
.pointshop_buy .info-btn .btn_del { background: url(/assets/images/gd/btn_bg22.png ); background-color: transparent; background-repeat: no-repeat; background-position: 0px 0px; background-size: 100%; font-size: 10px; letter-spacing: -1px; line-height: 18px; margin-left: 12px; /*position: relative;*/ line-height: 8px; width: 80px; height: 42px; }
.shop_selectbox { position: relative; top: -3px }
.point_shop_list { background-image: url(/assets/images/gd/shop_list.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center center; height: 300px; width: 50%; position: relative; }
.point_shop_souldout { text-align: center; color: #fff; position: absolute; height: 100%; width: 100%; font-weight: bold; line-height: 300px; background: #000; opacity: 50%; font-size: 1.5em; }
.point_shop_souldout_txt { font-size: 2em !important; font-weight: bold;  }

.pointshop-page-nav { background: #000; margin: 0 auto; justify-content: center; -webkit-box-shadow: 0px 0px 0.5rem 0px rgba(15, 15, 15, 0); box-shadow: 0px 0px 0.5rem 0px rgba(15, 15, 15, 0); }
.pointshop-page-nav .page-link { position: relative; display: block; padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x); font-size: var(--bs-pagination-font-size); color: var(--bs-pagination-color); text-decoration: none; background-color: var(--bs-pagination-bg); border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color); transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out; }
#pointshop_sec .result-fl { margin-left: 4px; margin-right: 16px; margin-bottom: 8px; font-size: 20px; float: left; font-weight: 500; color: #936F26; font-family: Pretendard Variable; }

#pointshop_sec .home1-tab-details-full .pointshop-txt2:first-of-type { text-decoration: line-through; text-decoration-thickness: 2px; }
#shipping_sec .home1-tab-details-full .pointshop-txt2:first-of-type { text-decoration: line-through; text-decoration-thickness: 2px; }

/* payback */
.list-names { text-align : left !important; }
.list-title { font-size: 0.8em; font-weight: bold; text-align: center !important; }

.bubble-text {
    /* 둥근 계열 폰트가 있으면 먼저 사용 */
    font-family: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
    font-weight: 900;
    font-size: clamp(1.2em, 10vw, 1.2em) !important;
    letter-spacing: -0.03em;
    line-height: 1;
    color: #ffffff;
    text-shadow: 0 2px 0 #2a2a2a, 0 6px 12px rgba(0,0,0,.35), /* 하단 드롭섀도 */
    inset 0 2px 0 rgba(255,255,255,.35); /* 하이라이트 느낌(브라우저별 무시 가능) */
    /* 살짝 통통해 보이는 그라디언트 */
    background: radial-gradient(120% 120% at 30% 20%, #ff86a8, #ff5d7e 40%, #ff3d66 70%, #ff184c 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* 살짝 살아있는 느낌 애니메이션 */
    animation: wobble 3s ease-in-out infinite;
    display: inline-block;
    padding: 5px;
    border: 1px solid #ff184c;
    border-radius: 5px;
    cursor : pointer;
}

.bubble-text1 {
    font-family: "Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;
    font-weight: 600;
    font-size: clamp(1.2em, 10vw, 1.2em) !important;
    letter-spacing: -0.03em;
    line-height: 1;
    color: #fff;
    background-color: #000;
    display: inline-block;
    border-radius: 5px;
    padding: 5px;
}

.ErrorContainer {
    border: 2px solid powderblue;
    border-radius: 5px;
    padding: 5px;
    font-weight: 900 !important;
}

@keyframes wobble {
    0%, 100% {
        transform: translateY(0) scale(1);
        filter: drop-shadow(0 8px 10px rgba(0,0,0,.25));
    }

    50% {
        transform: translateY(-2px) scale(1.02);
        filter: drop-shadow(0 12px 14px rgba(0,0,0,.28));
    }
}

/* 작은 화면 높이 (예: 600px 이하) */
@media (max-height: 600px) {
    #boxbuy_sec { height: 150% !important; padding-bottom: 100px;}
    #account-created-screen, #homescreen1-deatils-page, #home2-screen2 {  }
    #sign-in-section-page { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 110vh; }
    #join-in-section-page { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 110vh; }
    #myinfo_sec { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 100%; padding-bottom: 120px;}
}

/* 중간 화면 높이 (예: 600px에서 800px 사이) */
@media (min-height: 601px) and (max-height: 800px) {
    #boxbuy_sec { height: 130% !important; padding-bottom: 100px; }
    #account-created-screen, #homescreen1-deatils-page, #home2-screen2 {  }
    #sign-in-section-page { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 120vh; }
    #join-in-section-page { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 150vh; }
    #myinfo_sec { background: url(/assets/images/gd/join_bg.jpg); background-position: center; background-size: cover; height: 100%; padding-bottom: 100px; }
}

/* 큰 화면 높이 (예: 800px 이상) */
@media (min-height: 801px) {
    #boxbuy_sec { height: 100% !important; padding-bottom: 100px; }
}

@media only screen and (min-width: 320px) and (max-width: 359px) {
    .point_shop_list { background-image: url(/assets/images/gd/shop_list.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center center; height: 220px; width: 50%; position: relative; }
    .pointshop_img img { width: 100%; padding : 33px 21px 0px 21px }
    .point_shop_souldout { text-align: center; color: #fff; position: absolute; height: 100%; width: 100%; font-weight: bold; line-height: 220px; background: #000; opacity: 50%; font-size: 1.2em; }
    .pointshop_name { padding: 0px 20px 0px 20px; margin-top: 0px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-weight: 500; line-height: 18px; width: 100%; height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_price { padding: 0px 20px 0px 20px; margin-top: 0px; color: #936f26; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_point { padding: 0px 20px 0px 20px; margin-top: 0px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media only screen and (min-width: 360px) and (max-width: 374px) {
    .point_shop_list { background-image: url(/assets/images/gd/shop_list.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center center; height: 250px; width: 50%; position: relative; }
    .pointshop_img img { width: 100%; padding : 35px 23px 0px 23px }
    .point_shop_souldout { text-align: center; color: #fff; position: absolute; height: 100%; width: 100%; font-weight: bold; line-height: 250px; background: #000; opacity: 50%; font-size: 1.5em; }
    .pointshop_name { padding: 0px 20px 0px 25px; margin-top: 0px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-weight: 500; line-height: 18px; width: 100%; height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_price { padding: 0px 20px 0px 25px; margin-top: 5px; color: #936f26; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_point { padding: 0px 20px 0px 25px; margin-top: 3px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media only screen and (min-width: 375px) and (max-width: 389px) {
    .point_shop_list { background-image: url(/assets/images/gd/shop_list.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center center; height: 260px; width: 50%; position: relative; }
    .pointshop_img img { width: 100%; padding : 37px 25px 0px 25px }
    .point_shop_souldout { text-align: center; color: #fff; position: absolute; height: 100%; width: 100%; font-weight: bold; line-height: 250px; background: #000; opacity: 50%; font-size: 1.5em; }
    .pointshop_name { padding: 0px 20px 0px 25px; margin-top: 0px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-weight: 500; line-height: 18px; width: 100%; height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_price { padding: 0px 20px 0px 25px; margin-top: 5px; color: #936f26; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_point { padding: 0px 20px 0px 25px; margin-top: 5px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media only screen and (min-width: 390px) and (max-width: 411px) {
    .point_shop_list { background-image: url(/assets/images/gd/shop_list.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center center; height: 280px; width: 50%; position: relative; }
    .pointshop_img img { width: 100%; padding : 42px 25px 0px 25px }
    .point_shop_souldout { text-align: center; color: #fff; position: absolute; height: 100%; width: 100%; font-weight: bold; line-height: 250px; background: #000; opacity: 50%; font-size: 1.5em; }
    .pointshop_name { padding: 0px 20px 0px 25px; margin-top: 0px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-weight: 500; line-height: 18px; width: 100%; height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_price { padding: 0px 20px 0px 25px; margin-top: 5px; color: #936f26; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_point { padding: 0px 20px 0px 25px; margin-top: 5px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

@media only screen and (min-width: 412px) and (max-width: 414px) {
    .point_shop_list { background-image: url(/assets/images/gd/shop_list.jpg); background-repeat: no-repeat; background-size: 100%; background-position: center center; height: 280px; width: 50%; position: relative; }
    .pointshop_img img { width: 100%; padding : 37px 25px 0px 25px }
    .point_shop_souldout { text-align: center; color: #fff; position: absolute; height: 100%; width: 100%; font-weight: bold; line-height: 250px; background: #000; opacity: 50%; font-size: 1.5em; }
    .pointshop_name { padding: 0px 20px 0px 28px; margin-top: 2px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-weight: 500; line-height: 18px; width: 100%; height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_price { padding: 0px 20px 0px 28px; margin-top: 5px; color: #936f26; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pointshop_point { padding: 0px 20px 0px 28px; margin-top: 5px; color: #ddbb5f; font-family: Pretendard Variable; font-size: 16px; font-style: normal; font-weight: 500; line-height: 20px; width: 100%; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}


.featured-slide.item-no {
    width: auto;
    display: flex;
    justify-content: center; /* Horizontal centering */
    align-items: center; /* Vertical centering */
}

.newproduct {
    background-color: #000 !important;
    padding: 20px;
}

    .newproduct .newproduct-banner-list {
        padding: 0px !important;
        height: 150px;
        overflow: hidden;
    }

    .newproduct .newproduct-banner {
        height: 150px !important;
        margin: 0 !important;
    }

        .newproduct .newproduct-banner .banner-item {
            height: 150px;
            padding: 0;
        }

            .newproduct .newproduct-banner .banner-item a {
                display: block;
                height: 100%;
                width: 100%;
            }

        .newproduct .newproduct-banner img {
            width: 100%;
            height: 150px;
            object-fit: cover;
            object-position: center;
            display: block;
        }

    .newproduct .newproduct-list {
        width: 100%;
        margin: 3% auto 0;
    }

        .newproduct .newproduct-list .newproduct-item {
            height: auto;
            padding: 0px;
            margin-bottom: 16px;
        }

            .newproduct .newproduct-list .newproduct-item:nth-child(odd) {
                padding-right: 8px;
            }

            .newproduct .newproduct-list .newproduct-item:nth-child(even) {
                padding-left: 8px;
            }

            .newproduct .newproduct-list .newproduct-item .newproduct-box {
                background-image: url(/assets/images/gd/newproduct_bg.png);
                background-repeat: no-repeat;
                background-size: 100% 100%;
                background-position: center;
                color: #000;
                height: auto;
                padding: 5% 8% 8%;
                text-align: center;
                display: flex;
                flex-direction: column;
                min-height: 280px;
            }

                .newproduct .newproduct-list .newproduct-item .newproduct-box .img {
                    width: 100%;
                    aspect-ratio: 1 / 1;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    margin-bottom: 8px;
                    overflow: hidden;
                    position: relative;
                }

                    .newproduct .newproduct-list .newproduct-item .newproduct-box .img img {
                        width: 100%;
                        height: 100%;
                        object-fit: cover;
                        border: none;
                        position: absolute;
                        top: 6px;
                        left: 0;
                    }

                .newproduct .newproduct-list .newproduct-item .newproduct-box hr {
                    border: none;
                    border-top: 3px solid #7a5a19;
                    width: 100%;
                    margin: 10px 0;
                }

                .newproduct .newproduct-list .newproduct-item .newproduct-box .name {
                    text-align: center;
                    font-size: 0.85rem;
                    font-weight: 600;
                    margin-top: 8px;
                    margin-bottom: 8px;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    line-height: 1.4;
                    min-height: calc(1.4em * 2);
                    word-break: break-word;
                }

                .newproduct .newproduct-list .newproduct-item .newproduct-box .price {
                    font-size: 1.1rem;
                    font-weight: 800;
                    text-align: left;
                    margin-top: auto;
                }

/* 태블릿 크기 */
@media (min-width: 576px) {
    .newproduct .newproduct-list .newproduct-item .newproduct-box {
        min-height: 320px;
        padding: 6% 10% 10%;
    }

        .newproduct .newproduct-list .newproduct-item .newproduct-box .name {
            font-size: 0.9rem;
        }

        .newproduct .newproduct-list .newproduct-item .newproduct-box .price {
            font-size: 1.2rem;
        }
}

/* 데스크탑 크기 */
@media (min-width: 768px) {
    .newproduct .newproduct-list .newproduct-item .newproduct-box {
        min-height: 360px;
        padding: 7% 12% 12%;
    }

        .newproduct .newproduct-list .newproduct-item .newproduct-box .name {
            font-size: 1rem;
        }

        .newproduct .newproduct-list .newproduct-item .newproduct-box .price {
            font-size: 1.3rem;
        }
}

/* 큰 데스크탑 */
@media (min-width: 992px) {
    .newproduct .newproduct-list .newproduct-item .newproduct-box {
        min-height: 400px;
    }
}

/* 매우 작은 화면 */
@media (max-width: 360px) {
    .newproduct .newproduct-list .newproduct-item .newproduct-box {
        min-height: 240px;
        padding: 4% 6% 6%;
    }

        .newproduct .newproduct-list .newproduct-item .newproduct-box .name {
            font-size: 0.75rem;
        }

        .newproduct .newproduct-list .newproduct-item .newproduct-box .price {
            font-size: 1rem;
        }
}

.board_view_title { display: none;  }
.board_view_content { display: none; }
.board_view_file1 { }