:root {
    --header-height: 157px;
}

body {overflow: hidden;}
#footer {margin-top: 0 ; padding-top: 0;}

/* 메인 비주얼 */
.promo-main-image {width: 100%; height: auto;}
.promo-main-image img {width: 100%; height: auto;}

/* 풀페이지 컨테이너 */
.LOVE16th-promotion {position: relative; width: 100%; z-index: 1;}

/* 풀페이지 섹션 */
.promo-fullpage {width: 100%;}
.promo-section {width: 100%; height: calc(100vh - var(--header-height, 157px)); overflow: hidden; position: relative;}
.promo-section-inner {width: 100%; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; -ms-overflow-style: none;}
.promo-section-inner::-webkit-scrollbar {display: none;}

/* 내부 페이지 (일반 스크롤 콘텐츠) */
.promo-page {width: 100%; min-height: 100%; display: flex; align-items: center; justify-content: center; position: relative; box-sizing: border-box; background: #0b0d30;}
.promo-page * {box-sizing: border-box;}
/* .promo-page img {width: 100%; height: 100%; object-fit: cover;} */

/* 각 섹션 배경 색상 (구분용) */
/* #section-new .promo-page:nth-child(odd) {background: #fafafa;}
#section-new .promo-page:nth-child(even) {background: #f5f5f5;}
#section-gift .promo-page:nth-child(odd) {background: #faf8f5;}
#section-gift .promo-page:nth-child(even) {background: #f5f0eb;}
#section-all .promo-page:nth-child(odd) {background: #f5f8fa;}
#section-all .promo-page:nth-child(evn) {background: #edf2f5;}
#section-promo .promo-page {backgrouned: #f5f5f0;} */

/* 우측 메인 섹션 인디케이터 */
.promo-page-indicator {position: fixed; right: 24px; top: 50%; transform: translateY(-50%); z-index: 999; display: flex; flex-direction: column; gap: 12px; opacity: 0; pointer-events: none; transition: opacity 0.3s ease;}
.promo-page-indicator.visible {opacity: 1; pointer-events: auto;}
.promo-page-indicator .indicator-dot {width: 10px; height: 10px; border-radius: 50%; background: rgba(0, 0, 0, 0.15); cursor: pointer; transition: background 0.3s ease, transform 0.3s ease; border: none; padding: 0; outline: none;}
.promo-page-indicator .indicator-dot.active {background: rgba(0, 0, 0, 0.6); transform: scale(1.4);}
.promo-page-indicator .indicator-dot:hover {background: rgba(0, 0, 0, 0.4);}

/* 리사이즈 페이드 오버레이 */
.promo-resize-overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #fff; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.35s ease;}
.promo-resize-overlay.active {opacity: 1; pointer-events: auto;}


/* 카운트다운 영역 */
.countdown-wrap {position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; }
.countdown-wrap * {color: #fff !important;}
.countdown-wrap-cont {position: relative;width: 100%;max-width: 500px;height: 100%;margin: 0 auto 0;background: url('https://energyscoop.hgodo.com/energyscoop/homepage/love16th_promotion/assets/countdown-wrap-bg.jpg')no-repeat center top / cover;/* padding: 255px 0 0 0;  *//* padding: 246px 0 0 0; */display: flex;align-items: center;justify-content: center;padding: 123px 0 0 0;align-items: flex-start}
.countdown-wrap-cont .inner {}

h2.countdown-title {display: block;line-height: 1.2;text-align: center;font-weight: 500;letter-spacing: -0.010em;font-size: 31px;}
img.D-DAY {display: block;width: 253px;margin: 14px auto 39px;}

.countdown-box {display: flex; align-items: flex-start; justify-content: center; width: 100%; height: auto; gap: 20px;}
.countdown-box > div {position: relative; width: 95px;}
.countdown-box > div img {display: flex; width: auto; height: 9px; margin: 0 auto 10px;}
.countdown-box .time {display: flex;align-items: center;justify-content: center;width: 100%;background: #0b0d30;position: relative;height: 85px;border-radius: 9px;}
.countdown-box .time span {font-weight: 500;display: flex;justify-content: center;align-items: center;font-size: 60px;width: 38px;}

.countdown-box #hours:after, .countdown-box #minutes:after {content :""; position: absolute; left: 100%; bottom:0; width: 20px; height: 85px; background: url('https://energyscoop.hgodo.com/energyscoop/homepage/love16th_promotion/assets/dots.png')no-repeat center / 5px;}




/* SINCE 2013 */
.love-since {position: relative; display: flex; align-items: center; justify-content: center; width: 100%; min-height: 100%;}
.love-since--inner {position: relative; display: block; width: 100%; max-width: 500px; /* padding: 79px 0 133px; */ padding: 0;}
@media all and (max-height: 1049px) {
    /* .love-since--inner {padding: 79px 0 133px;} */
}
img.since-title {display: block; width: 296.5px; margin: 0 auto 0;}
p.love-since-txt {display: block; width: 100%; text-align: center; line-height: 1.4; letter-spacing: -0.025em; font-weight: 300; color: #fff; font-size: 21px; margin: 35px 0 45px 0;}
p.love-since-txt b {font-weight: 600;}
p.love-since-txt span.br {display: block; margin: 0 0 10px 0;}

/* 유튜브 비디오 */
.love-since-video {position: relative; width: 100%; height: auto; cursor: pointer;}
.love-since-video .ytb-player {display: block; width: 100%; height: 250px; background: #000;}
.love-since-video .ytb-player iframe {width: 100% !important; height: 100%; border: 0; margin: 0; padding: 0; pointer-events: none;}
.love-since-video .btn-ytb {position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; cursor: pointer; z-index: 2; transition: opacity 0.25s ease;}
.love-since-video .btn-ytb img {display: block; width: 100%; height: 100%; object-fit: cover;}

/* 풀 비디오 (섹션 03) */
.full-video {position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #0b0d30; cursor: pointer;}
.full-video-player {position: relative; height: 100%; aspect-ratio: 9 / 16; max-width: 100%; margin: 0 auto;}
.full-video-player iframe {position: absolute; left: 0; top: 0; width: 100% !important; height: 100% !important; border: 0; margin: 0; padding: 0; display: block; pointer-events: none;}


/* love-my-name */
.love-my-name {max-width: 500px; margin: 0 auto 0; width: 100%;}
.love-my-name--inner {padding: 0;}
@media all and (min-height: 1049px) {
    .love-my-name--inner {/* padding: 79px 0 100px 0; */ /* padding: 79px 0 150px 0; */}
}
img.my-name-title {display: block; width: 390px; margin: 0 auto;}
.love-my-name--inner > p {display: block; text-align: center; line-height: 1.415; font-weight: 300; color: #fff; letter-spacing: -0.010em; font-size: 21px; margin: 33px auto 0;}
.love-my-name--inner > p span {letter-spacing: -0.040em;}
.ytb-my-name {position: relative; display: block; width: 100%; background: #000; height: 281.50px; margin: 55px 0 0;}
.ytb-my-name-player {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.ytb-my-name-player iframe {position: absolute; left: 0; top: 0; width: 100% !important; height: 100% !important; border: 0; margin: 0; padding: 0; display: block; pointer-events: none;}
.love-my-name--inner > a {display: block; width: fit-content; max-width: 100%; margin: 41px auto 0;}
.love-my-name--inner > a img {display: block; width: 178px; }

/* .love-event */
.love-event {font-size: 0; position: relative; display: block; width: 100%; height: auto; max-width: 500px; margin: 0 auto;}
.love-event > img {display: block; width: 100%;}
.love-event > a {display: block; margin: 0 auto; width: calc(719px / 2);}
.love-event > a img {display: block; width: 100%;}

.info_box {position: relative; width: 100%; height: auto; padding: 0 15px 50px;}
.info_box .btn {position: relative; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 41px; cursor: pointer; border-top: 1px solid #cfcdcc; border-bottom: 1px solid #cfcdcc; padding: 0 10px; font-size: 14px; font-weight: 600; color: #fff;}
.info_box .btn img {display: block; width: 13px;}

.info_box__inner {position: relative; width: 100%; height: auto; display: none;}
.info_box__inner ul {font-size: 0; padding-top: 15px;}
.info_box__inner ul strong {color: #fff; margin-left: -10px; padding-bottom: 10px;}
.info_box__inner ul li {font-size: 12px;line-height: 1.5;color: #c8c8c8;position: relative;display: block;padding-left: 18px;letter-spacing: -0.025em;word-break: keep-all;}
.info_box__inner ul li span {position: absolute;font-size: 18px;font-weight: 400;top: -9px;left: 10px;}

/* 폰트가 너무 작음 키움 */
.info_box .btn {font-size: 16px}
.info_box__inner ul li {font-size: 14px;}

.info_box .btn.active {}
.info_box .btn.active img {transform: rotate(180deg); }
.info_box .btn.active ~ .info_box__inner,
.info_box .btn.active + .info_box__inner {display: block;}


.commtent_box {position: relative; display: block; width: 100%; height: auto; background: #fff; padding: 30px 15px 100px; box-sizing: border-box;}
.commtent_box * {box-sizing: border-box;}
.commtent_box .editor {position: relative; display: flex; width: 100%; height: auto;}
.commtent_box .editor textarea {width: calc(100% - 77px); height: 60px; background: #e6e6e6; border-radius: 5px; overflow: hidden; line-height: 1.3; font-size: 12px; font-size: 13px; font-weight: 400; letter-spacing: -0.025em; color: #000; border: 0; padding: 10px 15px; resize: none;}
.commtent_box .editor textarea::placeholder {color: #969696;}
.commtent_box .editor button {display: flex; align-items: center; justify-content: center; line-height: 1; width: 71px; height: 60px; background: #357e6b; border-radius: 5px; text-align: center; line-height: 1; font-size: 15px; font-weight: 600; color: #fff; margin-left: 6px;}


.commtent_box .article-comments {}
.commtent_box .article-comments .total-count {line-height: 1; display: block; width: 100%; height: auto; font-size: 14px; font-weight: 600; letter-spacing: -0.025em; color: #000; height: 45px; padding-top: 23px;}
.commtent_box .article-comments > ul {}
.commtent_box .article-comments > ul > li {letter-spacing: -0.0250em; border-top: 1px solid #000; padding: 15px 10px 18px;}

.commtent_box .article-comments .text-muted {display: block; padding-bottom: 5px; font-size: 12px;}
.commtent_box .article-comments .text-muted span {
    font-size: 13px; font-weight: 400; color: #7d7d7d;
}
.commtent_box .article-comments .comment {display: block; font-size: 14px; color: #1e1e1e; font-weight: 400; line-height: 1.286;}

.commtent_box .pagination {}
.commtent_box .pagination > a {margin: 0 15px;}


.ms-auto button.btn {box-sizing: border-box; display: block; width: fit-content; font-size: 12px; font-weight: 400; padding: 4px 7px; margin: 5px 0 0 0;}