@charset "utf-8";

/********************************** API 제품목록 **********************************/
.prdList {max-width:1000px; margin:0 auto;}
.prdList * {font-family: "Pretendard";}
.prdList ul {display:grid; grid-template-columns:repeat(4, 1fr); gap:25px;}
.prdList ul li {position:relative; max-width:296px; overflow:hidden;}
/* */
.prdList ul li .pd .img {display:flex; justify-content:center; align-items:center; margin-bottom:18px; width:100%; height:auto; max-height:296px; aspect-ratio:1 / 1; border-radius:16px; overflow: hidden; background:#fff;}
.prdList ul li .pd .img img {width:auto; height:100%; max-height:180px;}
.prdList ul li .badge {display:flex; flex-wrap:wrap; gap:7px 9px; width:100%; margin-top:5px;}
.prdList ul li .badge em {display:inline-block; padding:3px 6.5px; font-size:15px; font-weight:500; color:#FFFFFF; white-space: nowrap; border-radius:6px; background: #B7A095;}
.prdList ul li .badge em.p {color:#fff; background:#EA1917;}
.prdList ul li .badge em.sale {color:#fff; background:#EA1917;}
.prdList ul li .badge + .txt {padding-top:13px;}
.prdList ul li .badge .sale + .sale {display:none;}
.prdList ul li .pd .txt {text-align:left;}
.prdList ul li .pd strong {display:block; font-size:20px; line-height:1.2; color:#1A1A1A; font-weight:600; border-bottom:1px solid #CEC7B4; display: flex; flex-direction: column;}
.prdList ul li .pd strong em {display:block; padding-bottom:6px; color:#7E7C77; font-weight:300; font-size:17px;}
.prdList ul li .pd dl {display:flex; flex-wrap: wrap; align-items: center; gap:8px 8px; padding-top:12px; white-space:nowrap;}
.prdList ul li .pd dl dt { flex:0 1 10%; font-size:17px; font-weight:600; color:#000; letter-spacing: -0.05em; color: #7E7C77;}
.prdList ul li .pd dl dt:nth-of-type(2) {color: black; font-weight: 400;}
.prdList ul li .pd dl dt:nth-of-type(3) {color: black;}
.prdList ul li .pd dl dt.last {display:inline-flex;}
.prdList ul li .pd dl dd {flex:1 0 70%; font-size:19px; color:#1A1A1A; letter-spacing: -0.05em; word-spacing:-0.06em;}
.prdList ul li .pd dl dd del {color:#7E7C77;}
.prdList ul li .pd dl dd del::after {content:' 원';}
.prdList ul li .pd dl dd em::after {content:' 원';}
.prdList ul li .pd dl dd.lastPrice {flex:1 0 50%;}
.prdList ul li .pd dl dd.lastPrice em {font-weight:600; font-size:22px; color: black;}
.prdList ul .typeBtn {display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:8px;}
.prdList ul .typeBtn a {position:relative; flex:1; display:flex; justify-content: center; align-items:center; height:42px; gap:11px; font-size:17px; font-weight:500; color:#000; border:1px solid #000; border-radius:9px; cursor:pointer; overflow:hidden; max-width: 47.5%;}
.prdList ul .typeBtn a::after {content:''; display:inline-block; width:8px; height:14px; background: url(/kr/event/2025/04/01_lgforme/images/img_pd_arrow_right.png) no-repeat center; background-size:cover;}
.prdList ul.careCase li .pd dl dd em::before {content:'월 ';}
.prdList ul.careCase li .pd dl dd em::after {content:' 원';}
.prdList ul.careCase li .pd dl dd.lastPrice em::after {content:' 원 ~';}
.prdList ul.careCase li .careItem {margin-top:8px; border:1px solid #000; border-radius:10px;}
.prdList ul.careCase li .careItem dt {display:flex; justify-content: center; align-items:center; height:42px; gap:14px; font-size:17px; font-weight:500; color:#000; cursor:pointer;}
.prdList ul.careCase li .careItem dt::after {content:''; display:inline-block; width:14px; height:8px; background: url(/kr/event/2025/04/01_lgforme/images/img_pd_arrow_down.png) no-repeat center; background-size:cover; transition:all 0.3s ease;}
.prdList ul.careCase li .careItem dd {display:none}
.prdList ul.careCase li .careItem.active dt::after {transform:rotate(180deg);}
.prdList ul.careCase li .careItem.active dd {display:block; padding:0 20px;}
.prdList ul.careCase li .careItem.active dd span {display:block; padding-top:10px; min-height:68px; text-align:right; font-weight:500; font-size:15px; color:#000; line-height:1.5; border-top:1px solid #000;}
.prdList ul.careCase li .careItem.active dd label {float:left; margin-right:5px; color:#7E7C77;}
.prdList.landscape ul {display:block; max-width:486px;}
.prdList.landscape ul li {max-width:none; width:100%; min-height:172px;}
.prdList.landscape ul li ~ li {margin-top:25px;}
.prdList.landscape ul li .pd {position:relative; display:block; width:100%; padding:0 0 0 190px;}
.prdList.landscape ul li .pd .img {position:absolute; left:0; top:0; width:172px; margin-bottom:0;}
.prdList.landscape ul li .pd .img img {max-height:140px;}
.prdList.landscape ul li .badge {margin-left:190px; width: calc(100% - 190px);}
.prdList.landscape ul li .typeBtn {margin-left:190px;}
.prdList.landscape ul li .careItem {margin-left:190px;}
.prdList.landscape ul li .pd dl dd:nth-child(2) {flex: 0 1 auto;}
.prdList.landscape ul li .pd dl dd:nth-child(4) {flex: 0 1 51%;}
.prdList.landscape ul li .pd dl dd.lastPrice {flex:1 0 50%;}
.prdList.landscape ul.careCase  li .pd dl dd:nth-child(2) {flex: 0 1 100%;}
.prdList.landscape ul.careCase  li .pd dl dd:nth-child(4) {flex: 1 0 50%;}
.prdList.landscape ul.careCase  li .pd dl dd.lastPrice {flex:1 0 50%;}
.prdList.interior ul {display:flex;}
.prdList.interior ul li {width:316px; padding-bottom:24px; border-radius:24px; max-width:none; overflow:hidden; background:#fff;}
.prdList.interior ul li span.prdType > a	{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.prdList.interior ul li .pcImg {display:inline-flex; justify-content:center; align-items:flex-start; margin-bottom:24px; width:100%; height:auto; max-height:461px; aspect-ratio:1 / 0.93; overflow: hidden; background:#fff;}
.prdList.interior ul li .pcImg img {display:block; width:100%;}
.prdList.interior ul li .pd .img {display:none;}
.prdList.interior ul li .pd .txt {display:block; padding:0 24px;}
.prdList.interior ul li .pd dl dd:nth-child(2) {flex: 0 1 auto;}
.prdList.interior ul li .pd dl dd:nth-child(4) {flex: 0 1 50%;}
.prdList.interior ul li .badge {padding:0 24px;}
.prdList.interior ul .typeBtn {padding:16px 24px 0;}
.prdList.interior ul.careCase li .pd dl dd:nth-child(2) {flex: 0 1 100%;}
.prdList.interior ul.careCase li .pd dl dd:nth-child(4) {flex: 1 0 50%;}
.prdList.interior ul.careCase li .pd dl dd.lastPrice {flex:1 0 50%;}
.prdList.interior ul.careCase li .careItem {margin:8px 24px 0; width: calc(100% - 48px);}
/* soldOut */
.prdList ul li.soldout::before {content:''; position:absolute; top:0; bottom:0; left:0; right:0; z-index: 3; background:rgba(0,0,0,.86) url(/kr/event/2025/04/01_lgforme/images/img_soldout.png) no-repeat center; background-size:140px;}
.prdList ul li.soldoutAll::before {content:''; position:absolute; top:0; bottom:0; left:0; right:0; z-index: 3; background:rgba(0,0,0,.86) url(/kr/event/2025/04/01_lgforme/images/img_soldout.png) no-repeat center; background-size:140px;}
.prdList.landscape ul li.soldout::before {background-size:120px;}
.prdList.landscape ul li.soldoutAll::before {background-size:120px;}
.prdList ul li .typeBtn a.soldout::before {content:'임시 품절'; position:absolute; top:0; bottom:0; left:0; right:0; z-index: 3; display:flex; justify-content:center; align-items:center; color:#fff; font-size:20px; background:rgba(0,0,0,.8);}
.prdList ul li.soldoutAll .typeBtn .soldout::before {display:none;}
/**/
.skeleton {position: relative; overflow: hidden; z-index: 2; width:100%;}
.skeleton .pd::after { content : ""; width: 100%; height: 100%; position:absolute; top:0; left: 0; z-index: 2;
    background-image: linear-gradient(270deg,
        rgba(255,255,255,0.2),
        rgba(255,255,255,0.1),
        rgba(255,255,255,0.2));
    transform: translateX(-100%);
    animation: skeleton-loader 2s infinite;
}
.skeleton .pd i { display:block;  height:18px;  border-radius:10px;  font-size:0 !important;  overflow:hidden;  background: #e3e3e3;}
.skeleton .pd strong { padding-bottom: 33px !important;}
.skeleton .pd strong em i {width: 50%;}
.skeleton .pd dl {gap: 16px 8px !important;}
@keyframes skeleton-loader{
    0%{
        transform: translateX(-100%);
    }
    100%{
        transform: translateX(100%);
    }
}


@media screen and (max-width: 767px) {
    .prdList {padding:0 calc(48 / 760* 100vw);}
    .prdList ul {grid-template-columns:repeat(2, 1fr); gap:calc(32 / 760* 100vw);}
    .prdList ul li {max-width:none; width:auto;}
    .prdList ul li .pd .img {margin-bottom:calc(24 / 760* 100vw); max-height:calc(296 / 760* 100vw); border-radius:calc(16 / 760* 100vw);}
    .prdList ul li .pd .img img {max-height:calc(220 / 760* 100vw);}
    .prdList ul li .badge {gap:calc(8 / 760* 100vw) calc(12 / 760* 100vw); margin-top:calc(16 / 760* 100vw);}
    .prdList ul li .badge em {padding:calc(4 / 760* 100vw) calc(8 / 760* 100vw); font-size:calc(20 / 760* 100vw); border-radius:calc(8 / 760* 100vw);}
    .prdList ul li .badge + .txt {padding-top:calc(14 / 760* 100vw);}
    .prdList ul li .pd strong {padding-bottom:calc(8 / 760* 100vw); font-size:calc(26 / 760* 100vw);}
    .prdList ul li .pd strong em {padding-top:calc(6 / 760* 100vw); font-size:calc(22 / 760* 100vw);}
    .prdList ul li .pd dl {gap:calc(8 / 760* 100vw) calc(8 / 760* 100vw); padding-top:calc(16 / 760* 100vw);}
    .prdList ul li .pd dl dt {font-size:calc(22 / 760* 100vw);}
    .prdList ul li .pd dl dd {font-size:calc(26 / 760* 100vw);}
    .prdList ul li .pd dl dd.lastPrice em {font-size:calc(28 / 760* 100vw);}
    .prdList ul .typeBtn {gap:calc(16 / 760* 100vw); padding-top:calc(16 / 760* 100vw);}
    .prdList ul .typeBtn a {height:calc(54 / 760* 100vw); gap:calc(4 / 760* 100vw); font-size:calc(22 / 760* 100vw); border-radius:calc(12 / 760* 100vw);}
    .prdList ul .typeBtn a::after {width:calc(9 / 760* 100vw); height:calc(18 / 760* 100vw);}
    .prdList ul.careCase li .careItem {margin-top:calc(8 / 760* 100vw); border-radius:calc(12 / 760* 100vw);}
    .prdList ul.careCase li .careItem dt { height:calc(54 / 760* 100vw); gap:calc(14 / 760* 100vw); font-size:calc(22 / 760* 100vw);}
    .prdList ul.careCase li .careItem dt::after {width:calc(18 / 760* 100vw); height:calc(10 / 760* 100vw);}
    .prdList ul.careCase li .careItem.active dd {padding:0 calc(24 / 760* 100vw);}
    .prdList ul.careCase li .careItem.active dd span {padding-top:calc(10 / 760* 100vw); min-height:calc(80 / 760* 100vw); font-size:calc(19 / 760* 100vw);}
    .prdList.landscape ul {max-width:none; }
    .prdList.landscape ul li {min-height:calc(220 / 760* 100vw); overflow:hidden;}
    .prdList.landscape ul li ~ li {margin-top:calc(32 / 760* 100vw);}
    .prdList.landscape ul li .pd {padding:0 0 0 calc(244 / 760* 100vw);}
    .prdList.landscape ul li .pd .img {width:calc(220 / 760* 100vw);}
    .prdList.landscape ul li .pd .img img {max-height:calc(160 / 760* 100vw);}
    .prdList.landscape ul li .typeBtn {margin-left:calc(244 / 760* 100vw);}
    .prdList.landscape ul li .careItem {margin-left:calc(244 / 760* 100vw);}
    .prdList.landscape ul li .badge {margin-left: calc(244 / 760* 100vw); width: calc(100% - 244px);}
    .prdList.interior ul li {width:calc(460 / 720 * 100vw);}
    .prdList.interior ul li .badge {padding:0 calc(24 / 760* 100vw);}
    .prdList.interior ul li .pcImg {margin-bottom:calc(24 / 760* 100vw);}
    .prdList.interior ul li .pd .txt {display:block; padding:0 calc(24 / 760* 100vw);}
    .prdList.interior ul li .pd dl dd:nth-child(2) {flex: 1 0 100%;}
    .prdList.interior ul li .pd dl dd:nth-child(4) {flex: 1 0 100%;}
    .prdList.interior ul .typeBtn {padding:calc(16 / 760* 100vw) calc(24 / 760* 100vw) 0;}
    .prdList.interior ul.careCase li .pd dl dd:nth-child(2) {flex: 1 0 100%;}
    .prdList.interior ul.careCase li .pd dl dd:nth-child(4) {flex: 1 0 50%;}
    .prdList.interior ul.careCase li .pd dl dd.lastPrice {flex:1 0 50%;}
    .prdList.interior ul.careCase li .careItem {margin:calc(8 / 760* 100vw) calc(24 / 760* 100vw) 0; width: calc(100% - calc(24 / 760* 100vw));}
    /**/
    .skeleton .pd strong { padding-bottom: calc(33 / 760* 100vw) !important;}
    .skeleton .pd strong em i {width: 50%;}
    .skeleton .pd dl {gap: calc(16 / 760* 100vw) calc(8 / 760* 100vw) !important;}
    /**/
    .prdList ul li.soldout::before {background-size:calc(176 / 760* 100vw);}
    .prdList ul li.soldoutAll::before {background-size:calc(176 / 760* 100vw);}
    .prdList.landscape ul li.soldout::before {background-size:calc(156 / 760* 100vw);}
    .prdList.landscape ul li.soldoutAll::before {background-size:calc(156 / 760* 100vw);}
    .prdList ul li .typeBtn a.soldout::before {font-size:calc(22 / 760* 100vw);}
}

/* 개발 css 커스텀 */
.event-benefit-template .survey-container {
    margin: 0 auto calc(80 / 1380 * 100%);
}
@media screen and (max-width: 767px) {
    .event-benefit-template .survey-container {
        margin: 0 auto calc(80 / 720 * 100vw);
    }
}
/* // 개발 css 커스텀 */

/* 기획전 추가된 부분 */
.event-benefit-template .cont-wrap  {padding-bottom: 0px !important;}
picture	{position: relative; display: inline-block;}

.btn_area   {width: fit-content; margin: 0 auto;}
.event_visual   {margin-bottom: -1px;}




@media screen and (max-width: 820px)    {
    .slide_wrap {
        width: 100%;
    }
}
@media screen and (max-width: 767px)    {
    body    {
        width: 100%;
    }
    .event-benefit-template    {
        width: 100%;
        height: auto;
        margin: 0 auto;
    }
    .hellobar-wrap .tab_container {top: 88px;}
    .tab_container li a.active::before  {height: 4px;}
    
}

/* 휘센 추가된 스타일 */


/* .prdList.interior ul li {width:460px; max-width:460px; padding-bottom:24px; border-radius:24px; overflow:hidden; background:#fff;} */
.prdList.interior ul {display:flex;}
.prdList.interior ul li {width:100% !important; padding-bottom:24px; border-radius:24px; max-width:none; overflow:hidden; background:#fff;}
.prdList.interior ul li .pcImg {display:inline-flex; justify-content:center; align-items:center; margin-bottom:24px; width:100%; height:auto; max-height:624px; aspect-ratio:1 / 1; overflow: hidden; background:#fff;}
.prdList.interior ul li .pcImg img {display:block; height:100%;}
.prdList.interior ul li .pd .img {display:none;}
/* .prdList.interior ul li .pd .badge {padding:0 24px 14px;} */
.prdList.interior ul li .pd .txt {display:block; padding:0 24px;}
.prdList.interior ul li .pd dl dd:nth-child(2) {flex: 0 1 22%;}
.prdList.interior ul li .pd dl dd:nth-child(4) {flex: 0 1 60%;}
.prdList.interior ul li .badge {padding:0 24px;}
.prdList.interior ul .typeBtn {padding:16px 24px 0;}
.prdList.interior ul.careCase li .pd dl dd:nth-child(2) {flex: 0 1 100%;}
.prdList.interior ul.careCase li .pd dl dd:nth-child(4) {flex: 1 0 50%;}
.prdList.interior ul.careCase li .pd dl dd.lastPrice {flex:1 0 50%;}
.prdList.interior ul.careCase li .careItem {margin:8px 24px 0; width: calc(100% - 48px);}

.product-more-arrow {}

@media screen and (max-width: 767px) {

    .prdList.interior ul li {width:calc(460 / 720 * 100vw);}
    .prdList.interior ul li .badge {padding:0 calc(24 / 760* 100vw);}
    .prdList.interior ul li .pcImg {margin-bottom:calc(24 / 760* 100vw);}
    .prdList.interior ul li .pd .txt {display:block; padding:0 calc(24 / 760* 100vw);}
    .prdList.interior ul li .pd strong {font-size:calc(28 / 760* 100vw);}
    .prdList.interior ul li .pd dl dd {font-size:calc(28 / 760* 100vw);}
    .prdList.interior ul li .pd dl dd.lastPrice em {font-size:calc(28 / 760* 100vw);}
    .prdList.interior ul li .pd dl dd:nth-child(2) {flex: 0 1 22%;}
    .prdList.interior ul li .pd dl dd:nth-child(4) {flex: 0 1 64%;}
    .prdList.interior ul .typeBtn {padding:calc(16 / 760* 100vw) calc(24 / 760* 100vw) 0;}
    .prdList.interior ul.careCase li .pd dl dd:nth-child(2) {flex: 1 0 100%;}
    .prdList.interior ul.careCase li .pd dl dd:nth-child(4) {flex: 1 0 50%;}
    .prdList.interior ul.careCase li .pd dl dd.lastPrice {flex:1 0 50%;}
    .prdList.interior ul.careCase li .careItem {margin:calc(8 / 760* 100vw) calc(24 / 760* 100vw) 0; width: calc(100% - calc(48 / 760* 100vw));}

}


.border_top_add{border-top:8px solid #E5E5E5;}
.padding_bottom_0{padding-bottom: 0;}

.contents.event .ev-detail-wrap .ev-detail-con .ev-cont{max-width:1380px; margin: 0 auto;}