@charset "utf-8";

:root {
    --Color-primary-core : #E31837;
}



/* 매거진 허브 */
.magazine-intro.magazine_container {margin-top:0;padding-bottom:70px}
.magazine-intro .section-hero-wrap {min-height:600px;height:31.25vw;background: url('/resource/content/magazine/pc/hub/bg_hero.png') no-repeat 50% 0 / cover;}
.magazine-intro .section-hero-content {width:1320px;margin:0 auto;padding: 272px 20px;color:#fff}
.magazine-intro .section-hero-title {font-family: 'NovaECB';font-size:80px;line-height: 1;}
.magazine-intro .section-hero-text {margin-top:40px;font-size:24px;line-height: 1.25;}
.magazine-intro .episode-open-state {width:928px;margin:-80px auto 0}
.magazine-intro .episode-open-state ol {display: flex;align-items: center;gap:0 20px;}
.magazine-intro .episode-open-state li {display:flex;flex-direction:column;width: 217px;height:230px;padding:40px 20px 36px;background-color: #000;text-align: center;}
.magazine-intro .episode-open-state .current-state {display:block;font-size: 24px;color:#4C4C4C;font-weight: 700;line-height: 1;}
.magazine-intro .episode-open-state .open-date {display:block;margin-top:18px;font-size: 20px;color:#4C4C4C;font-weight: 700;line-height: 1;}
.magazine-intro .episode-open-state .episode-name {display:block;margin-top:auto;font-size: 56px;font-family:'NovaECB';color:#4C4C4C;font-weight: 800;line-height: 1;}
.magazine-intro .episode-open-state li.is-open {font-size:32px;background-color: var(--Color-primary-core);color:#fff;}
.magazine-intro .episode-open-state li.is-open .current-state {margin-top:18px;color:#fff;}
.magazine-intro .episode-open-state li.is-open .episode-name {font-size:32px;color:#fff;}  
.magazine-intro .comment-event-notice {margin-top:120px;padding:90px 0;text-align: center;background: url('/resource/content/magazine/pc/hub/bg_event.png') no-repeat 50% 0 / cover}
.magazine-intro .event-content {overflow:hidden;position:relative;max-width:1280px;margin:0 auto;padding:104px 20px 70px;background: #fff;}
.magazine-intro .event-content .event-badge {position: absolute;top:0;left:0;width:100%;padding:18px 18px;font-size: 24px;font-weight:700;color:#fff;background: var(--Color-primary-core);}
.magazine-intro .event-title {display: block;font-size: 48px;font-weight: 700;color: #000;}
.magazine-intro .event-desc {margin-top:24px;font-size: 24px;font-weight: 500;color: #000;line-height: 1.4;}
.magazine-intro .event-desc .point {color: var(--Color-primary-core);font-weight: 600;}
.magazine-intro .event-info {width:520px;margin:40px auto 50px;}
.magazine-intro .event-info dl {display: flex;flex-wrap:wrap;align-items: center;gap:16px;text-align: left;}
.magazine-intro .define-item {flex-shrink:0;padding:0 16px;font-size: 16px;font-weight: 600;line-height:36px;border:1px solid #000;border-radius: 100px;text-align: center;}
.magazine-intro .define-cont {font-size: 20px;font-weight: 500;color:#000;}
.magazine-intro .event-step {display:inline-flex;align-items: center;gap:0 60px}
.magazine-intro .event-step li {display: flex;align-items:center;flex-direction:column;align-items:flex-start;justify-content:center;position:relative;min-height:80px;padding-left: 100px}
.magazine-intro .event-step li::before {content:"";position:absolute;top:0;left:0;width:80px;height:80px;border-radius: 100px;background: var(--Color-primary-core);}
.magazine-intro .event-step li::after {content:"";position:absolute;top:17px;left:16px;width:48px;height:48px;background: url('/resource/content/magazine/pc/ico_hub_event_step_01.png') no-repeat 50% 0;}
.magazine-intro .event-step .step-02::after {background-image: url('/resource/content/magazine/pc/ico_hub_event_step_02.png')}
.magazine-intro .event-step .step-03::after {background-image: url('/resource/content/magazine/pc/ico_hub_event_step_03.png')}
.magazine-intro .event-step .step-title {display:block;font-size: 18px;color:#000;font-weight: 700;}
.magazine-intro .event-step .step-cont {margin-top:4px;font-size: 16px;color:#000;font-weight: 500;}
.magazine-intro .episode-list-wrap {margin-top:120px;text-align: center;}
.magazine-intro .episode-title {font-size:48px;font-weight: 700;line-height: 1;}
.magazine-intro .episode-subtitle {margin-top:30px;font-size:24px;font-weight: 500;}
.magazine-intro .episode-list {display:flex;flex-wrap:wrap;justify-content: center;gap:60px 27px;width:1240px;margin:60px auto 0;}
.magazine-intro .episode-item {width:calc(50% - 14px);box-shadow: 0px 6px 24px 0px rgba(0, 0, 0, 0.12);text-align: left;background-color: #F5F6F7;}
.magazine-intro .episode-thumb {overflow:hidden;position: relative;display:flex;flex-direction:column;min-height:380px;padding:30px 24px;background:url('/resource/content/magazine/pc/hub/img_episode_coming_soon.png') no-repeat 50% 106px / 168px 168px; }
.magazine-intro .thumb-img {position: absolute;top:50%;left: 50%;transform: translate(-50%, -50%);}
.magazine-intro .episode-tag {display:inline-block;position:absolute;top:30px;left:30px;padding: 11px 22px;font-size: 20px;font-weight: 500;background: #ccc;color: #fff;border-radius: 100px;z-index: 1;}
.magazine-intro .target-pro {display: block;margin-top:auto;font-size: 20px;font-weight: 500;color: #fff;z-index: 1}
.magazine-intro .episode-desc {margin-top: 20px;font-size: 32px;color: #fff;font-weight: 700;line-height: 1.15;z-index: 1;}
.magazine-intro .episode-info {min-height:170px;padding:26px 24px 24px;background-color: #fff;text-align: center;}
.magazine-intro .cheer-comment {padding-left:60px;font-size:20px;line-height:1.25;background: url('/resource/content/magazine/pc/hub/ico_comment.png') no-repeat 0 0;}
.magazine-intro .btn-episode-detail {display:block;margin-top:30px;border:1px solid #989898;color:#000;font-size: 18px;text-align: center;line-height: 40px;}
.magazine-intro .btn-episode-detail:hover {background-color: #000;color:#fff;}
.magazine-intro .coming-soon {display: block;margin-top:31px;font-size:24px;font-weight:700}
.magazine-intro .open-target-date {display: block;margin-top:16px;font-size:18px;font-weight:500;color:#4C4C4C}
.magazine-intro .is-open .episode-info {text-align: left;}
.magazine-intro .is-open .episode-tag {background: var(--Color-primary-core);font-weight: 700;}


/* 매거진 상세 */
.magazine-detail {padding-top:124px;background: #000;}
.magazine-detail .magazine_container {margin:0;background: #fff;}
.magazine-detail .sec-comm {max-width: 1400px;margin:0 auto;padding:0 60px;}
.magazine-detail .magazine-title {padding:70px 0 50px;background-color: #000;}
.magazine-detail .magazine-title .pro-name {font-size:50px;font-weight:700;color: #fff;}
.magazine-detail .magazine-title .flag-em {display:inline-block;margin-left:24px;padding:0 16px;font-size:24px;font-weight:500;color: #fff;border:1px solid #fff;border-radius: 4px;line-height: 40px;vertical-align: text-bottom;}
.magazine-detail .episode-num {display:block;margin-top:100px;font-family:'NovaECB';font-size: 72px;font-weight:800;line-height: 1;}
.magazine-detail .episode-title {margin-top:60px;font-size: 56px;font-weight: 800;line-height: 1.25;word-break: break-all;}
.magazine-detail .gnb-hidden-wrap {position:relative;background-color: #fff;z-index: 101;}
.magazine-detail .gnb-hidden-wrap.is-under {z-index: 1;}
.hub-contents-wrap {display: flex;align-items: flex-start;gap:0 90px;margin-top:80px}
.hub-contents-wrap .interview-wrap {flex:1}
.hub-contents-wrap .nav-sticky-wrap {overflow: hidden;position: sticky;top: 20px;flex:0 0 356px;}
.hub-contents-wrap .figure {margin-top:80px}
.hub-contents-wrap .figure:first-child {margin-top:0}
.hub-contents-wrap .figure + .cont-text {margin-top:27px}
.hub-contents-wrap .cont-text + .cont-text {margin-top:16px}
.hub-contents-wrap .cont-text + .question {margin-top:40px}
.hub-contents-wrap .cont-text {font-size: 16px;line-height: 1.4;}
.hub-contents-wrap .cont-text strong {font-weight: 700;}
.magazine-detail .nav-sticky-wrap .video-thumb-wrap {position:relative;padding-top:63.48%;background: #F5F6F7;}
.magazine-detail .nav-sticky-wrap .video-thumb-wrap .img-vertical {width:auto;height:100%}
.magazine-detail .nav-sticky-wrap .video-thumb-wrap .dim-desc {position:absolute;left:0;bottom:0;width:100%;height:32px;font-weight:500;color:#fff;line-height:32px;background: rgba(0, 0, 0, 0.7);}
.magazine-detail .nav-sticky-wrap .btn-video {position:absolute;top:0;left:0;width:100%;height:100%}
.magazine-detail .nav-sticky-wrap .btn-video::after {content: "";position:absolute;top:50%;left:50%;width:56px;height:56px;background: url('/resource/content/magazine/pc/ico_play.png') no-repeat 50% 50% / 56px 56px;transform: translate(-50%, -50%);}
.magazine-detail .nav-sticky-wrap img {width:100%;height:100%;object-fit: cover;}
.magazine-detail .nav-sticky-wrap .episode-item {position:relative;border-bottom:1px solid #D9D9D9;}
.magazine-detail .nav-sticky-wrap .episode-link {display:block;padding:18px 118px 18px 10px}
.magazine-detail .nav-sticky-wrap .episode-label {display: block;font-size:24px;font-weight:700;color:#fff;line-height:56px;background: #000;text-align: center;}
.magazine-detail .nav-sticky-wrap .episode-wrap {margin-top:40px;}
.magazine-detail .nav-sticky-wrap .epi-count {display: inline-block;padding:0 11px;font-size:14px;font-weight:500;color:#fff;background: #ccc;border-radius: 100px;line-height: 24px;}
.magazine-detail .nav-sticky-wrap .epi-title {overflow:hidden;display:block;margin-top:12px;font-size: 16px;font-weight:700;white-space: nowrap;text-overflow: ellipsis;line-height: 1;}
.magazine-detail .nav-sticky-wrap .epi-thumb {position:absolute;top:18px;right:0;width: 98px;height: 78px;object-fit: cover;}
.magazine-detail .nav-sticky-wrap .episode-item.is-open .epi-count {background: var(--Color-primary-core);}
.magazine-detail .epi-hero {display:block;margin-top:10px;font-size: 14px;font-weight: 500;color:#4C4C4C;word-break: break-all;}
.magazine-detail .question, 
.magazine-detail .answer {display:flex;align-items: center;position:relative;min-height:30px;margin-top:6px;padding-left: 42px;font-size: 16px;line-height: 1.5;word-break:break-all;}
.magazine-detail .answer + .question {margin-top:24px}
.magazine-detail .question {font-weight: 700;}
.magazine-detail .mark {position:absolute;top:0;left:0;display:inline-block;width:30px;height:30px;border-radius: 100px;font-size: 16px;font-weight:700;color:#fff;text-align: center;line-height:30px;background-color: #000;;}
.magazine-detail .answer .mark {color:#000;background-color: #fff;border:1px solid #000}
.magazine-detail .sec-recommend .inner-sec {padding-top:160px}
.magazine-detail ~ .comment-area {border-top: none;}
.magazine-detail ~ .comment-area .comment-question {margin-bottom: 30px;}
.magazine-event {margin-top:80px;padding:120px 0;background: url('/resource/content/magazine/pc/bg_magazin_hub_comments.png') no-repeat 50% 0 / cover;}
.magazine-detail .event-content {position:relative;max-width:1280px;margin:0 auto;padding:88px 80px;background: #fff;}
.magazine-detail .event-content .event-badge {position: absolute;top:0;left:0;padding:15px 18px;font-size: 24px;font-weight:700;color:#fff;background: #E31837;}
.magazine-detail .event-title {display: block;font-size: 32px;font-weight: 700;color: #000;}
.magazine-detail .event-desc {margin-top:8px;font-size: 20px;font-weight: 500;color: #000;line-height: 1.4;}
.magazine-detail .event-desc .point {color: #E31837;font-weight: 600;}
.magazine-detail .event-info {margin-top:30px;}
.magazine-detail .event-info dl {display: flex;flex-wrap:wrap;align-items: center;gap:16px}
.magazine-detail .define-item {flex-shrink:0;width:105px;font-size: 16px;font-weight: 600;color:#fff;line-height:36px;background:#000;border-radius: 100px;text-align: center;}
.magazine-detail .define-cont {width:calc(100% - 105px - 16px); font-size: 20px;font-weight: 500;color:#4c4c4c;}
.magazine-detail .flex-wrap {display: flex;justify-content: space-between;gap:0 20px}
.magazine-detail .event-step {flex:0 0 420px;}
.magazine-detail .event-step li {display: flex;align-items:center;flex-direction:column;align-items:flex-start;justify-content:center;position:relative;min-height:80px;margin-top:24px;padding-left: 100px}
.magazine-detail .event-step li:first-child {margin-top:0;}
.magazine-detail .event-step li::before {content:"";position:absolute;top:0;left:0;width:80px;height:80px;border-radius: 100px;background: #E31837;}
.magazine-detail .event-step li::after {content:"";position:absolute;top:17px;left:16px;width:48px;height:48px;background: url('/resource/content/magazine/pc/ico_hub_event_step_01.png') no-repeat 50% 0;}
.magazine-detail .event-step .step-02::after {background-image: url('/resource/content/magazine/pc/ico_hub_event_step_02.png')}
.magazine-detail .event-step .step-03::after {background-image: url('/resource/content/magazine/pc/ico_hub_event_step_03.png')}
.magazine-detail .event-step .step-title {display:block;font-size: 18px;color:#000;font-weight: 700;}
.magazine-detail .event-step .step-cont {margin-top:4px;font-size: 16px;color:#000;font-weight: 500;}
.magazine-detail .q-a-wrap .answer > span {flex:1;}
.magazine-detail .btn-photo {display:inline;padding:4px 26px 2px 10px;font-size:12px;font-weight:700;color:var(--Color-primary-core);border:1px solid var(--Color-primary-core);border-radius:100px;background: url('/resource/content/magazine/pc/btn_pop_photo.png') no-repeat right 10px top 50% / 12px 12px}
.layer-video-view .layer-popup, 
.layer-photo-view .layer-popup {width:960px;height:615px;border-radius: 0;}
.layer-photo-view .layer-popup {overflow:hidden;}
.layer-video-view .layer-content, 
.layer-photo-view .layer-content {position:relative;padding: 60px 0;}
.layer-video-view .layer-content .video-wrap, 
.layer-photo-view .layer-content .swiper {overflow:hidden;width:960px;height:495px;}
.layer-photo-view .layer-content .swiper .swiper-slide img {width:100%;height:100%;object-fit: cover;}
.layer-video-view .layer-content .video-wrap video {width:100%;height: 100%;object-fit: cover;}
.layer-video-view .layer-popup .layer-inner .btn-layer-close, 
.layer-photo-view .layer-popup .layer-inner .btn-layer-close {top:18px;right:20px;width:24px;height:24px;background: url('/resource/content/magazine/pc/ico_pop_close1.png') no-repeat 50% 50% / cover}
.layer-video-view .layer-popup .layer-inner .btn-layer-close {top:-32px;right:0;width:16px;height:16px;background-image: url('/resource/content/magazine/pc/ico_pop_close2.png')}
.layer-video-view .layer-popup.vertical-type {width: 24.083vw;height:37.5vw;min-height: 90vh;background-color: transparent;}
.layer-video-view .layer-popup.vertical-type .layer-inner,
.layer-video-view .layer-popup.vertical-type .layer-body,
.layer-video-view .layer-popup.vertical-type .layer-content {height: 100%;}
.layer-video-view .layer-popup.vertical-type .layer-content {padding: 0;}
.layer-video-view .layer-popup.vertical-type .video-wrap {width:100%;height: 100%;}
.layer-photo-view .swiper-button-prev,
.layer-photo-view .swiper-button-next {width:64px;height:64px;left:0;background:url('/resource/content/magazine/pc/blt_arrow_white.png') no-repeat 50% 50% / 64px auto}
.layer-photo-view .swiper-button-next {left:auto;right:0;transform: rotate(-180deg);}
.layer-photo-view .swiper .swiper-pagination-bullets {bottom:28px;height:12px;}
.layer-photo-view .swiper .swiper-pagination-bullet {width:12px;height:12px;margin:0 2.5px;vertical-align: top;}
.layer-photo-view .swiper .swiper-pagination-bullet-active {background:var(--Color-primary-core)}