/*스트레스케어 (앰버서더) 리뉴얼 */
.stress-care-layout{font-family: 'Pretendard';!important; padding-bottom: px;}
.stress-care-layout i {font-style: normal;}
.stress-care-layout .img-intro{background-color: #000}
.stress-care-layout .scroll-nav{display:flex; position: sticky; top: var(--scroll-nav-top, 92px); z-index: 15;}
.stress-care-layout .scroll-nav > li{flex: 1 1 100%; padding:15px; text-align: center; font-weight:700; background-color:#2b2b2b; color:#8a8a8a; cursor: pointer}
.stress-care-layout .scroll-nav > li.is-active{background-color: #ff6001; color: #fff;}
.stress-care-layout .influencer-nav-container{display: flex; background-color: #f5f5f5; padding: 12px 15px;}
.stress-care-layout .influencer-nav > li{background-color:#fff; color:#666; border: 1px solid #EEE; border-radius: 8px; padding:10px; width: auto; display: inline-block; cursor: pointer;}
.stress-care-layout .influencer-nav > li.is-active{color:#ff6001; border: 1px solid #ff6001; border-radius: 8px; padding:10px;}
.stress-care-layout .influencer-box{background-color: #fff; display: grid; padding: 15px 4.6666% 30px;  gap: 8px;  grid-template-columns: repeat(3, 1fr);}
.stress-care-layout .influencer-box .list-box{padding:15px 0px; border-radius: 8px; border: 1px solid #f6f6f6; }
.stress-care-layout .influencer-box .list-box:nth-last-child(1){padding: 0; border-radius: 0; border: none;}
.stress-care-layout .influencer-box .list-box .content{display: flex; flex-direction: column; gap: 6px; align-items:center;}
.stress-care-layout .influencer-box .list-box .content .img{width: 98px;}
.stress-care-layout .influencer-box .list-box h5{font-size: 14px; font-weight: 700}
.stress-care-layout .influencer-box .list-box p{font-size:10px; color: #999;}
.stress-care-layout .influencer-box .list-box ul{display: flex; gap: 2px;}
.stress-care-layout .black-box{padding:30px 15px; background-color:#141414;}
.stress-care-layout .black-box .title{color:#fff; font-size:18px; margin-bottom: 12px;}
.stress-care-layout .black-box .desc{color: #8a8a8a; font-size: 12px;}
.stress-care-layout .img-banner{width: 100%; background-color: transparent; border-radius: 8px; overflow: hidden;}
.stress-care-layout .exhibitionCd .tm-specials-list .tm-cate{padding: 0px;}
.stress-care-layout .exhibitionCd .tm-specials-list .tm-cate .swiper-slide a{background-color: #fff; color: #666; border: 1px solid #EEE; border-radius: 8px; padding: 0 10px; width: auto; display: inline-block; cursor: pointer; font-size: 13px; line-height: 38px;}
.stress-care-layout .exhibitionCd .tm-specials-list .tm-cate .swiper-slide.swiper-slide-active a{color: #fff; background-color:#141414; font-weight: 700}
.stress-care-layout .exhibitionCd .tm-specials-list .tm-cate .swiper-slide a span{line-height: normal;}
.stress-care-layout .section3 .tm-specials-list{background-color: #f5f5f5; padding: 12px 0px 15px 12px;}
.stress-care-layout .section3.is-login{padding-bottom: 60px;}
.stress-care-layout .section4{display:flex; justify-content:center; align-items:center; background-image: url("https://file.rankingdak.com/image/event/m/stress_care/bg_section4.png");background-repeat: no-repeat;background-size: 100% 100%;background-position: center center; aspect-ratio: 750/1174; padding: 30px 4.6666% 88px;}
.stress-care-layout .section4 >div {display: flex; flex-direction: column; text-align: center; padding-top: 130px;}
.stress-care-layout .section4 .img{width: 100%; margin: 11px auto 11px; padding: 0 4.6666%}
.stress-care-layout .section4 .title span{color: #ff6001;}
.stress-care-layout .section4 .sub-title{color: #a5a5a5; font-size: 13px; font-weight: 500; color:#555; line-height: 1.7}
.stress-care-layout .section4 .sub-title span{color: #f0f0f0;}
.stress-care-layout .section4 .caption{font-size:12px; color:#8A8A8A; margin-bottom: 11px;}
.stress-care-layout .section4 .btn{background-color: #ff6001; width:100%; padding: 13px; border-radius:9px; margin-bottom: 20px;}
.stress-care-layout .section4 .btn span{color: #fff; font-size: 14px; margin-bottom: 11px;}
.stress-care-layout .section4 .middle-dot-list{font-size: 11px; color: #6B6B6B; text-align: left;}
.stress-care-layout .section4 .middle-dot-list > li{margin-bottom: 5px;}
.stress-care-layout .section4 .middle-dot-list > li:last-child{margin: 0;}
.stress-care-layout .prod-default-list{padding: 16px 0 0}
.stress-care-layout .content-wrap{padding: 0 0 15px;}



/*badge*/
.icon-badge{display:inline-block; font-size: 10px; padding: 4px 8px; border-radius: 6px; font-weight:600;}
.ico-badge-running{color: #0c91e7; background-color: #e8f6ff; }
.ico-badge-hyrox{background-color: #fff0e8; color: #ff6001;}
.ico-badge-diet{background-color: #e5f8ec; color: #14a452;}
.ico-badge-health{background-color: #F1EBFF; color: #7B3FF2;}
.ico-badge-pro{background-color: #ffe9ec; color: #e5304f;}
.ico-badge-daily{background-color:#fff5d6; color: #c98700;}

/*스트레스케어 개인페이지*/
.stress-care-personal-layout {font-family: 'Pretendard'; !important; padding: 60px 0;}
@media (max-width: 480px) {
    .stress-care-personal-layout{padding: 0px 0px 60px}
}
.stress-care-personal-layout i{font-style: normal;}
.stress-care-personal-layout .custom-layer-popup .layer-popup.modal-middle{width: 80%; padding: 30px 15px 15px;}
.stress-care-personal-layout .history-nav{display: flex; padding: 15px 4.6666%; background-color: #141414; align-items: center;}
.stress-care-personal-layout .history-nav li:nth-child(1){color: #9a9a9a; font-size: 12px;}
.stress-care-personal-layout .history-nav li:nth-child(2){color: #fff; font-size: 12px;}
.stress-care-personal-layout .prod-wide-list .prd-item .img{border-radius: 4px;}

.stress-care-personal-layout .section1 .banner-box{padding: 15px 4.6666%;}
.stress-care-personal-layout .section1 .data-box{display: flex; justify-content: space-between; padding-bottom: 15px; border-bottom: 1px solid #333; margin-bottom: 15px;}
.stress-care-personal-layout .section1 .area-badge{display: flex; gap: 4px;}
.stress-care-personal-layout .section1 .link-area{display: flex; gap: 8px;}
.stress-care-personal-layout .section1 .text{color: #aaa; margin-left: 4px;}
.stress-care-personal-layout .section1 .name-box{display: flex; align-items: center; gap: 8px; margin-bottom: 8px;}
.stress-care-personal-layout .section1 .content-box h4{font-size: 12px; color: #8A8A8A; margin-bottom: 8px;}
.stress-care-personal-layout .section1 .content-box h4 span{font-size: 10px; color: #6B6B6B; margin-left: 8px; }
.stress-care-personal-layout .section1 .content-box .self{color: #D8D8D8; font-size: 12px;}
.stress-care-personal-layout .section1 .content-box .copy{font-size: 15px; color: #fff; font-weight: 700; padding: 10px 14px; display: inline-block; background-color: #232323; border-radius: 8px; margin-bottom: 15px; cursor: pointer}
.stress-care-personal-layout .prod-default-list{padding: 0}
.stress-care-personal-layout h5{color: #fff; font-size: 22px;}
.stress-care-personal-layout .section1 .content{background: #141414; padding: 30px 4.6666%; }
.stress-care-personal-layout .section2 > .sub-title{font-size: 18px; color: #171717; margin-bottom: 4px;}
.stress-care-personal-layout .section2 > .desc{margin-bottom: 15px; font-size: 12px; color: #999;}
.stress-care-personal-layout .section3 > .sub-title{font-size: 18px; color: #171717; margin-bottom: 10px;}
.stress-care-personal-layout .section2{padding:15px 4.6666%;}
.stress-care-personal-layout .section3{padding:0 4.6666% 50px;}
.stress-care-personal-layout .section3 .caption{color: #999; font-size: 12px; margin-top: 10px;}
.stress-care-personal-layout .prod-wide-list ul li{border-top: none;}
.stress-care-personal-layout .icon-badge{background-color:rgba(255, 96, 1, 0.16); color: #FF8A4C; font-size: 12px; padding: 3px 10px; border-radius: 999px;}

/* Youtube */
.stress-care-personal-layout .yt-thumb__title {
    position: absolute; top: 0; left: 0; right: 0;
    padding: 8px 10px 20px;
    background: linear-gradient(to bottom, rgba(0,0,0,.75), rgba(0,0,0,0));
    color: #fff;
    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
    font-size: 13px; font-weight: 600; line-height: 1.3;
}
.stress-care-personal-layout .yt-wrap { width:100%; margin: 0 auto; box-sizing: border-box; }
.stress-care-personal-layout .yt-main { position: relative; width: 100%; aspect-ratio: 16 / 9; background: #000; border-radius: 4px; overflow: hidden; }
.stress-care-personal-layout .yt-main iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.stress-care-personal-layout .yt-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 12px 0 0; padding: 0; list-style: none; }
.stress-care-personal-layout .yt-list li{border-radius: 4px; overflow: hidden;}
.stress-care-personal-layout .yt-thumb { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; text-align: left; font: inherit; color: inherit; position:relative; }
.stress-care-personal-layout.yt-thumb__img { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: #ddd; outline: 3px solid transparent; outline-offset: -3px; transition: outline-color .15s; }
.stress-care-personal-layout .yt-thumb__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 480px) {
    .stress-care-personal-layout .yt-list { gap: 6px; }
    .stress-care-personal-layout .yt-thumb__title { font-size: 12px; }
}
/*팝업*/
.stress-care-personal-layout .copy-popup .title{font-size:22px; color: #333; margin-bottom: 5px;}
.stress-care-personal-layout .copy-popup .desc{color: #999; font-size: 14px; margin-bottom: 20px;}