/* to embed a font */
@import url('/assets/css/font-33091213e788152b36b9a399f7a80453.css');

:root {
    --black: #000000;
    --white: #FFFFFF; /* text title */

    --gray90: #0E0E0E; /* background */
    --gray80: #1A1A1A; /* background */
    --gray70: #262626; /* line, disabled */
    --gray60: #323232; /* icon */
    --gray50: #3E3E3E;
    --gray40: #565656; /* text disabled */
    --gray30: #9F9F9F; /* text */
    --gray20: #B7B7B7;
    --gray10: #CFCFCF;
    --gray5: #E7E7E7; /* text body */

    --blue50: #00D8EE; /* main */
    --blue40: #99EFF8;
    --blue30: #B3F3FA;
    --blue20: #CCF7FC;
    --blue10: #E6FBFD;
    
    --point1: #FF7E1B;
    --point2: #124559;
    --point3: #B8B3BE;
    --point4: #D2CCA1;
    --point5: #292A2D;

    --danger: #EB003B;
    --warning: #FFB724;
    --success: #008A1E;
    --information: #0066FF;
}

/* header : 미노출 */
header {height: 6rem; display: none; align-items: center; justify-content: center; position: relative; padding: 0 2rem;}
header h1 {font-size: 1.8rem; font-weight: 600;}

/* main */
main {padding: 1rem 1.6rem 3.4rem;}

.cont-box + .cont-box {margin-top: 4rem;}
.cont-box.line + .cont-box {border-top: 1rem solid var(--gray80); width: 100vw; margin: 4rem -1.6rem 0; padding: 4rem 1.6rem 0;}

.box + .box {margin-top: 2.4rem;}

/* 계정 ----------------------- */
/* 로그인 */
.login-wrap {height: calc(100dvh - 1rem - 3.4rem); display: flex; flex-flow: column; row-gap: 2rem; align-items: center; justify-content: center;}
.login-wrap > div {display: flex; flex-flow: column; row-gap: 1.2rem; align-items: center; margin-bottom: 2rem;}
.login-wrap > div > p {text-align: center; font-size: 1.4rem; font-weight: 500; text-align: center;}

.login-wrap .info {width: 100%; display: flex; flex-flow: column; row-gap: .8rem;}
.login-wrap .info > li {display: flex; flex-flow: column; row-gap: .8rem; flex-wrap: wrap;}
.login-wrap .info > li > input + label {margin-top: .4rem; column-gap: .6rem;}
.login-wrap .info > li > input + label > p {color: var(--gray30);}
.login-wrap .info > li > span {font-size: 1.2rem; color: var(--point1);}
.login-wrap .info > li > button {margin-top: 1.2rem;}

.login-wrap .link {display: flex; align-items: center; justify-content: center; column-gap: 1.2rem;}
.login-wrap .link > li {display: flex; align-items: center; column-gap: 1.2rem;}
.login-wrap .link > li + li::before {content: ''; width: 1px; height: 1.2rem; background-color: var(--gray70);}
.login-wrap .link > li > a {font-size: 1.4rem; font-weight: 500; color: var(--gray30);}

.login-wrap .sns {margin-top: 1rem; border-top: 1px solid var(--gray70); padding-top: 3rem; display: flex; flex-flow: column; row-gap: 2rem; align-items: center; width: 100%;}
.login-wrap .sns > p {text-align: center; font-size: 1.4rem; font-weight: 500; color: var(--gray30);}
.login-wrap .sns > ul {display: flex; align-items: center; justify-content: center; column-gap: 2rem;}
.login-wrap .sns > ul > li > button {width: fit-content; height: fit-content; padding: 0; border-radius: 100%; background-color: transparent;}

/* 아이디 찾기 */
.address {display: flex; flex-flow: column; row-gap: .8rem;}
.address > li {display: flex; align-items: center; column-gap: .8rem;}
.address > li > button {width: 9.6rem; height: 4.4rem; background-color: var(--gray40); font-size: 1.4rem; font-weight: 500;}

/* 비밀번호 찾기 */
.accredit-wrap {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem; }
.accredit-wrap > li > button {width: 100%; height: 14.4rem; flex-flow: column; row-gap: 1.2rem; background-color: var(--gray80); box-shadow: 4px 4px 12px 0px rgba(7, 29, 61, 0.04);}
.accredit-wrap > li > button > p {font-size: 1.4rem; font-weight: 500;}

/* 회원가입 */
.signup-step {margin-bottom: 3rem; display: flex; align-items: center; justify-content: center; column-gap: .4rem;}
.signup-step > li {display: flex; align-items: center; justify-content: center; column-gap: .4rem; font-size: 1.6rem; color: var(--gray30);}
.signup-step > li.active {font-weight: 600; color: var(--white);}
.signup-step > li + li::before {content: ''; width: 2.4rem; height: 2.4rem; background-image: url(/assets/img/ico/ic-arrow-right-24-gr-13bb54ea7ceae8053335d0142a5e65dc.svg); background-repeat: no-repeat; background-size: contain; background-position: center;}

.signup-wrap .title {margin-bottom: 3rem;}
.signup-wrap .title > h2 {font-weight: 400;}
.signup-wrap .title > h2 > span {font-weight: 700;}

.terms-chk {display: flex; flex-flow: column; row-gap: 1.6rem;}
.terms-chk .all {margin-bottom: .4rem; padding-bottom: 2rem; border-bottom: 1px solid var(--gray70);}
.terms-chk > li {display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; grid-gap: .8rem;}
.terms-chk > li > input + label {flex: 1;}
.terms-chk > li > a {font-size: 1.4rem; color: var(--gray30);}
.terms-chk > li > ul {width: 100%; display: flex; flex-flow: column; row-gap: .8rem; padding: 1.2rem; background-color: var(--gray80);}

/* 이용약관 상세 */
.terms-wrap {display: flex; flex-flow: column; row-gap: 2rem;}
.terms-wrap > div {padding-bottom: 2rem; border-bottom: 1px solid var(--gray70); font-size: 1.4rem; line-height: 1.6; word-break: keep-all;}
.terms-wrap > div > ul {display: flex; flex-flow: column; row-gap: 1.2rem;}
.terms-wrap > div > ol {display: flex; flex-flow: column; row-gap: 1.2rem; list-style: decimal; margin-left: 1.6rem;}
.terms-wrap > div:nth-child(1):nth-last-child(1) {border: 0;}
.terms-wrap > div > p {margin-bottom: 1.2rem;}
.terms-wrap > div > p + ul {margin-top: 1.2rem;}
.terms-wrap .scroll {margin-top: 1.6rem;}
.terms-wrap table tbody td {text-align: left; padding: 1rem .8rem; line-height: 1.4;}
.terms-wrap table thead th {padding: .8rem;}

/* 개인정보처리방침 목차 */
.privacy-index {padding: 1.6rem; background-color: var(--gray80); border-radius: .4rem; border: 0!important;}
.privacy-index ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem;}
.privacy-index ul li a {display: flex; align-items: flex-start; column-gap: .6rem; font-size: 1.3rem; color: var(--gray10); line-height: 1.4;}
.privacy-index ul li a span {display: flex; align-items: center; justify-content: center; min-width: 1.8rem; height: 1.8rem; background-color: var(--blue50); color: var(--gray90); font-size: 1.1rem; font-weight: 600; border-radius: .2rem;}

/* 메뉴 ----------------------- */
.menu-wrap {display: flex; flex-flow: column; row-gap: 1.2rem;}
.menu-wrap > li {background-color: var(--gray80); border-radius: .4rem;}
.menu-wrap > li > p {height: 6rem; display: flex; align-items: center; column-gap: .8rem; padding: 0 1.6rem; font-size: 1.6rem; font-weight: 600; position: relative;}
.menu-wrap > li > p::after {content: ''; width: 2rem; height: 2rem; background-image: url(/assets/img/ico/ic-arrow-down-20-85ce341a0a14f87c68bf437d8590ee68.svg); background-repeat: no-repeat; background-size: contain; background-position: center; position: absolute; right: 1.6rem;}
.menu-wrap > li > ul {display: none; flex-flow: column; padding: .6rem 1.6rem; border-top: 1px dashed var(--gray40);}
.menu-wrap > li > ul > li {height: 5rem; display: flex; align-items: center; justify-content: space-between;}
.menu-wrap > li > ul > li::after {content: ''; width: 2rem; height: 2rem; background-image: url(/assets/img/ico/ic-menu-more-50eab2a0639d73f94c541821ab6b81a4.svg); background-repeat: no-repeat; background-size: contain; background-position: center;}
.menu-wrap > li > ul > li + li {border-top: 1px solid var(--gray70);}
.menu-wrap > li > ul > li > p {font-size: 1.4rem; font-weight: 500;}


.menu-wrap > li.active > p::after {background-image: url(/assets/img/ico/ic-arrow-up-20-bd1031963b75a94a1f14d1d72f8bb159.svg);}
.menu-wrap > li.active > ul {display: flex;}

/* 메인 ----------------------- */
/* 메인 */
.cont-box:has(.main-banner-swiper) + .cont-box {margin-top: 1rem;}
.main-banner-swiper.swiper {width: 100vw; margin: -1rem -1.6rem 0; position: relative; display: flex; align-items: center; justify-content: flex-end; flex-flow: column;}
.main-banner-swiper.swiper .swiper-slide {width: 100%; height: 32.3rem; position: relative; display: flex; align-items: center; justify-content: flex-end; flex-flow: column; padding: 1rem 1.6rem 7rem;}
.main-banner-swiper.swiper .swiper-slide::before {content: ''; width: 100%; height: 100%; display: block; background: linear-gradient(180deg, rgba(18, 18, 18, 0.00) 38.41%, #121212 100%); background-blend-mode: darken; mix-blend-mode: luminosity; position: absolute; left: 0; bottom: 0; z-index: 1;}
.main-banner-swiper.swiper .swiper-slide::after {content: ''; width: 100%; height: 100%; display: block; background: linear-gradient(180deg, rgba(18, 18, 18, 0.00) 38.41%, #121212 100%); background-blend-mode: darken; mix-blend-mode: luminosity; position: absolute; left: 0; bottom: 0; z-index: 1;}
.main-banner-swiper.swiper .swiper-slide .img {width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; top: 0; left: 0;}
.main-banner-swiper.swiper .swiper-slide .img::before {content: ''; width: 100%; height: 23.8rem; display: block; background: linear-gradient(0deg, rgba(18, 18, 18, 0.00) 38.41%, #121212 100%); background-blend-mode: darken; mix-blend-mode: luminosity; position: absolute; left: 0; top: 0; z-index: 1;}
.main-banner-swiper.swiper .swiper-slide .desc {display: flex; flex-flow: column; align-items: center; position: relative; z-index: 2; font-size: 3.6rem; font-weight: 700; color: var(--white); line-height: 1.2;}
.main-banner-swiper.swiper .swiper-slide .desc > span {font-size: 2.6rem;}

.main-banner-swiper.swiper .swiper-pagination-wrap {position: absolute; bottom: 3rem; z-index: 2; display: flex; align-items: center; justify-content: center; column-gap: .8rem;}
.main-banner-swiper.swiper .swiper-pagination-wrap > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}
.main-banner-swiper.swiper .swiper-pagination-wrap .swiper-pagination {position: relative; top: initial; right: initial; bottom: initial; left: initial; margin: 0; padding: 0; display: flex; align-items: center; justify-content: center; column-gap: .2rem; font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.main-banner-swiper.swiper .swiper-pagination-wrap .swiper-pagination > span {display: block; width: 1.6rem;}
.main-banner-swiper.swiper .swiper-pagination-wrap .swiper-pagination .swiper-pagination-current {color: var(--white);}

.mini-banner{display: grid;grid-template-columns: repeat(2, 1fr);gap: .9rem}
.mini-banner li{border-radius:.8rem;overflow:hidden;background-color:var(--point5);}
.mini-banner li a{display:flex;flex-direction:column;height:10rem;gap:.8rem;padding:1.6rem;background-position:bottom right;background-repeat:no-repeat;background-size:cover;}
.mini-banner li:first-child a{background-image:url("/assets/img/banner/mini-banner1-73fc5abf51afa95ce409470304b43087.png");}
.mini-banner li:last-child a{background-image:url("/assets/img/banner/mini-banner2-de80f3226d0f81cb9f0183b2861cc0f8.png");}
.mini-banner li a strong{font-size:1.6rem;font-weight:600;}
.mini-banner li a span{color:#C2C4C8;font-size:1.2rem;font-weight:400;display:flex;align-items:center;}
.mini-banner li a span:after{content:"";display:block;width:1.4rem;height:.4rem;background-position:center;background-repeat:no-repeat;background-size:contain;background-image:url("/assets/img/ico/ic-arrow-right-10-5ceca051961ef0194f7bb75a05aa6e42.svg");}

.main-summary {display: flex; flex-flow: column;}
.main-summary .title {align-items: flex-end;}
.main-summary .title > h2 {font-size: 2.2rem; font-weight: 400;}
.main-summary .title > h2 > span {font-weight: 700;}
.main-summary .title > a {font-weight: 600; height: 3.6rem; color: var(--gray30);}
.main-summary .title > a .ic-arrow-right-16 {background-image: url(/assets/img/ico/ic-arrow-right-16-gr-c99532aa158a27a335c77c8759f38744.svg);}

.main-summary-swiper.swiper {width: 100vw; height: fit-content; margin: 0 -1.6rem; padding: 0 1.6rem; position: relative;}
.main-summary-swiper.swiper .swiper-slide {width: 100%; min-height: 20.9rem; padding: 1.6rem 1.6rem 0; display: flex; flex-flow: column; row-gap: 2rem; border-radius: .4rem; overflow: hidden; background: var(--gray70); box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, 0.12); backdrop-filter: blur(4px); position: relative;}
.main-summary-swiper.swiper .swiper-slide::before {content: ''; width: 1.6rem; height: 1.6rem; border-radius: 100%; background-color: var(--gray90); position: absolute; left: -.8rem; bottom: 4.4rem;}
.main-summary-swiper.swiper .swiper-slide::after {content: ''; width: 1.6rem; height: 1.6rem; border-radius: 100%; background-color: var(--gray90); position: absolute; right: -.8rem; bottom: 4.4rem;}
.main-summary-swiper.swiper .swiper-slide .info {display: flex; align-items: center; column-gap: 1rem; justify-content: space-between; margin-bottom: .8rem;}
.main-summary-swiper.swiper .swiper-slide .info > ul {display: flex; align-items: center; column-gap: .6rem;}
.main-summary-swiper.swiper .swiper-slide .info > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.4rem; font-weight: 500;}
.main-summary-swiper.swiper .swiper-slide .info > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray5);}

.main-summary-swiper.swiper .swiper-slide .option {display: flex; align-items: center;flex-wrap: wrap; gap: .9rem .7rem; margin-top: -.4rem;}
.main-summary-swiper.swiper .swiper-slide .option > div {width: 100%;height: 3rem; border-radius: .4rem; background-color: var(--gray90); display: flex;  align-items: center; column-gap: .6rem; justify-content: center;}
.main-summary-swiper.swiper .swiper-slide .option > div.small{width: calc(50% - .45rem);}
.main-summary-swiper.swiper .swiper-slide .option > div .img {width: 1.8rem; height: 1.8rem; background-color: var(--gray10); border-radius: 100%; background-image: url(/assets/img/ico/ic-mom-vote-52f01268f0c846b08de5d036c146ec96.svg); background-repeat: no-repeat; background-size: cover; background-position: top center;}
.main-summary-swiper.swiper .swiper-slide .option > div > div {display: flex; align-items: center; font-size: 1.2rem; font-weight: 500;}
.main-summary-swiper.swiper .swiper-slide .option > div > div > i {width: 1.4rem; height: 1.4rem;}
.main-summary-swiper.swiper .swiper-slide .option > div > span {font-size: 1rem; font-weight: 500;}

.main-summary-swiper.swiper .swiper-slide .option .mom.disabled > span {color: var(--gray40);}
.main-summary-swiper.swiper .swiper-slide .option .mom.disabled > div {color: var(--gray40);}
.main-summary-swiper.swiper .swiper-slide .option .mom.disabled > div > i {display: none;}


.main-summary-swiper.swiper .swiper-slide .btn {border-top: 1px dashed rgba(255, 255, 255, .25); padding: 1rem 0;}
.main-summary-swiper.swiper .swiper-slide .btn button {height: 3rem; background-color: transparent; font-size: 1.4rem;}
.main-summary-swiper.swiper .swiper-slide .btn button.blue {background-color: var(--blue50); color: #fff;}

.main-summary-swiper.swiper .swiper-slide .empty {width: 100%; height: 100%; padding-bottom: 6rem!important; display: flex; flex-flow: column; row-gap: 1.2rem; align-items: center; justify-content: center;}
.main-summary-swiper.swiper .swiper-slide .empty > i {width: 5rem; height: 5rem;}
.main-summary-swiper.swiper .swiper-slide .empty > p {text-align: center; font-size: 1.4rem; font-weight: 600;}

.game-info {display: flex; align-items: center; justify-content: center; column-gap: 1.6rem;}
.game-info > div {flex: 1; display: flex; align-items: center; column-gap: 1rem;}
.game-info > div:first-child {flex-flow: row-reverse;}
.game-info > div > i {width: 2.8rem; height: 2.8rem;}
.game-info > div > p {font-size: 1.6rem; font-weight: 600;}
.game-info > ul {display: flex; align-items: center; column-gap: .8rem; justify-content: center; min-width: 6.2rem;}
.game-info > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.8rem; font-weight: 700; width: 2rem; justify-content: center;}
.game-info > ul > li:nth-child(2) {width: fit-content;}

.main-summary-swiper.swiper .swiper-pagination {position: relative; top: initial; left: initial; bottom: initial; right: initial; margin-top: 1.2rem; display: flex; align-items: center; column-gap: .8rem; justify-content: center;}
.main-summary-swiper.swiper .swiper-pagination .swiper-pagination-bullet {width: .6rem; height: .6rem; margin: 0; background-color: var(--white); opacity: .2;}
.main-summary-swiper.swiper .swiper-pagination .swiper-pagination-bullet-active {opacity: 1;}

/* 메인 > 배너 */
.banner-swiper.swiper {height: fit-content; position: relative; border-radius: .4rem; overflow: hidden;}
.banner-swiper.swiper .swiper-slide {height: initial;}
.banner-swiper.swiper .swiper-slide img {width: 100%; height: 100%; object-fit: cover;}
.banner-swiper.swiper .swiper-pagination {width: fit-content; min-width: 3.6rem; height: 2rem; border-radius: 2rem; padding: 0 .6rem; display: flex; align-items: center; column-gap: .2rem; justify-content: center; position: absolute; top: initial; left: initial; bottom: .8rem; right: .8rem; background-color: var(--black); font-size: 1.2rem; color: rgba(255, 255, 255, .4);}
.banner-swiper.swiper .swiper-pagination > span {width: .8rem; text-align: center;}
.banner-swiper.swiper .swiper-pagination .swiper-pagination-current {font-weight: 500; color: var(--white);}

/* 메인 > 팀 순위 */
.team-rank-table01 table tbody td:nth-child(1) {font-family: 'Roboto'; font-weight: 700; font-style: italic; font-size: 1.6rem;}
.team-rank-table01 table tbody .point td:nth-child(1),
.team-rank-table01 table tbody .point td:nth-child(2) {color: var(--blue50);}
.team-rank-table01 table tbody .more button {background-color: transparent; font-size: 1.4rem; height: 4rem;}

/* 메인 > MD 컬렉션 */
.collection-swiper.swiper {width: 100vw; margin: 0 -1.6rem; padding: 0 1.6rem;}
.collection-swiper.swiper .swiper-slide {width: 11rem; display: flex; flex-flow: column; row-gap: 1rem;}
.collection-swiper.swiper .swiper-slide .img {width: 11rem; height: 11rem; border-radius: .4rem; background-repeat: no-repeat; background-size: cover; background-position: center;}
.collection-swiper.swiper .swiper-slide .info {display: flex; flex-flow: column; row-gap: .8rem;}
.collection-swiper.swiper .swiper-slide .info > p {font-size: 1.1rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.collection-swiper.swiper .swiper-slide .info > div {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; font-weight: 600;}
.collection-swiper.swiper .swiper-slide .info > div > span {color: var(--point1);}

/* 메인 > 성남FC SNS */
.media-summary {display: flex; flex-flow: column; row-gap: 2rem;}
.media-summary > div {display: flex; flex-flow: column; row-gap: 1rem;}
.media-summary > div .img {width: 100%; height: 50vw; background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; border-radius: .4rem;}
.media-summary > div .info {display: flex; flex-flow: column; row-gap: 1rem;}
.media-summary > div .info > p {font-size: 1.4rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.media-summary > div .info > ul {display: flex; align-items: center; column-gap: .6rem;}
.media-summary > div .info > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.media-summary > div .info > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray70);}

.media-summary > ul {display: flex; flex-flow: column; row-gap: 1rem;}
.media-summary > ul > li {display: flex; flex-flow: row-reverse; column-gap: 4rem;}
.media-summary > ul > li + li {border-top: 1px solid var(--gray70); padding-top: 1rem;}
.media-summary > ul > li .img {width: 13.2rem; height: 7.4rem; border-radius: .4rem; background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center;}
.media-summary > ul > li .img > i {width: 3.2rem; height: 3.2rem;}
.media-summary > ul > li .info {display: flex; flex-flow: column; row-gap: 1.2rem; flex: 1;}
.media-summary > ul > li .info > p {height: 4rem; font-size: 1.2rem; font-weight: 500; line-height: 1.6; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.media-summary > ul > li .info > ul {display: flex; align-items: center; column-gap: .6rem;}
.media-summary > ul > li .info > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.media-summary > ul > li .info > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray70);}

.instagram-wrap {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: .6rem;}
.instagram-wrap > li {width: 100%; height: calc((100vw - 3.2rem - .6rem) / 2); border-radius: .4rem; overflow: hidden; object-fit: cover;}
.instagram-wrap > li > img {width: 100%;}

/* 메인 > SNS */
.sns-wrap {display: grid; grid-template-columns:1fr 1fr; gap: .8rem;}
.sns-wrap > li {height: 4.4rem; border-radius: .4rem; border: 1px solid var(--gray70); background-color: var(--gray80); display: flex; align-items: center; justify-content: center; column-gap: .4rem;}
.sns-wrap > li > p {font-size: 1.4rem; font-weight: 600;}

/* 메인 > 스폰서 */
.sponsor-swiper.swiper {width: 100vw; margin: 0 -1.6rem; padding: 0 1.6rem;}
.sponsor-swiper.swiper .swiper-slide {width: fit-content;}
.sponsor-swiper.swiper .swiper-slide img {height: 3.4rem;}

/* 경기 ----------------------- */
/* 경기 > 일정 결과 */
.nav-wrap {display: flex; align-items: center; justify-content: center; margin-bottom: 2rem; position: relative;}
.nav-wrap > ul {display: flex; align-items: center; column-gap: 1.2rem;}
.nav-wrap > ul > li > p {font-size: 1.8rem; font-weight: 700;}
.nav-wrap > ul > li > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}
.nav-wrap > button {width: fit-content; height: 2.4rem; padding: 0 .6rem; border-radius: 2rem; border-color: var(--gray70); background-color: var(--gray80); font-size: 1.2rem; font-weight: 500; position: absolute;}
.nav-wrap > button:last-child {right: 0;}

.schedule-list {display: flex; flex-flow: column; row-gap: 2rem;}
.schedule-list > li {display: flex; flex-flow: column; row-gap: 2rem; border: 1px solid var(--gray70); background-color: var(--gray80); border-radius: .4rem; padding: 1.6rem;}
.schedule-list > li .info {display: flex; align-items: center; column-gap: 1rem; justify-content: space-between; margin-bottom: .8rem;}
.schedule-list > li .info > ul {display: flex; align-items: center; column-gap: .6rem;}
.schedule-list > li .info > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.4rem; font-weight: 500;}
.schedule-list > li .info > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray5);}
.schedule-list > li .btn {border-top: 1px dashed rgba(255,255,255,.3); padding-top: 2rem; display: flex; align-items: center; justify-content: center; column-gap: .8rem;}
.schedule-list > li .btn > div {display: flex; align-items: center; column-gap: 1rem; flex: 1;}
.schedule-list > li .btn > div .img {width: 3.2rem; height: 3.2rem; border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: top center; background-color: var(--gray10);}
.schedule-list > li .btn > div .desc {display: flex; flex-flow: column; row-gap: .6rem;}
.schedule-list > li .btn > div .desc > span {font-size: 1rem; font-weight: 500;}
.schedule-list > li .btn > div .desc > div {font-size: 1.4rem; font-weight: 700; display: flex; align-items: center; column-gap: .2rem;}
.schedule-list > li .btn > div.coming .desc {color: var(--gray40);}
.schedule-list > li .btn > div + button {width: 8rem;}
.schedule-list > li .btn > button {height: 3.2rem; font-size: 1.4rem; width: 100%;}
.schedule-list > li .btn > button:nth-child(1):nth-last-child(1) {width: 100%; background-color: var(--blue50);}
.schedule-list > li .btn > button:disabled {color: var(--white)!important; background-color: var(--gray40)!important;}


.empty.game {height: calc(100dvh - 4.5rem - 2rem - 2.6rem - 2rem - 3.4rem);}

/* 경기 > 일정 결과 > 매치센터 */
.match-summary {display: flex; flex-flow: column; row-gap: 2rem; align-items: center; width: 100vw; margin: -1rem -1.6rem 0; padding-top: 1rem; background-color: var(--gray80);}
.match-summary .goal {border-top: 1px dashed rgba(255,255,255,.3); width: 100%; padding: 1.2rem 1.6rem; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 4rem;}
.match-summary .goal > ul {display: flex; flex-flow: column; row-gap: .8rem;}
.match-summary .goal > ul > li {display: flex; align-items: center; column-gap: .6rem;}
.match-summary .goal > ul > li > i {width: 1.2rem; height: 1.2rem;}
.match-summary .goal > ul > li > p {font-size: 1.2rem; color: var(--gray5); font-weight: 500; display: flex; align-items: center; column-gap: .4rem;}
.match-summary .goal > ul > li > p > span {color: var(--gray30); font-weight: 400;}
.match-summary .goal > ul:nth-child(1) > li {flex-flow: row-reverse;}

.game-info-detail {display: flex; flex-flow: column; row-gap: 2rem; align-items: center; width: 100%; padding: 0 1.6rem;}
.game-info-detail > ul {display: flex; align-items: center; column-gap: .6rem;}
.game-info-detail > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.4rem; font-weight: 500;}
.game-info-detail > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--white);}
.game-info-detail > div {width: 100%; display: flex; align-items: center; column-gap: 2rem; justify-content: center;}
.game-info-detail > div .team {flex: 1; display: flex; flex-flow: column; row-gap: .8rem; align-items: center;}
.game-info-detail > div .team > i {width: 3.8rem; height: 3.8rem;}
.game-info-detail > div .team > p {font-size: 1.4rem; font-weight: 600;}
.game-info-detail > div .score {display: flex; flex-flow: column; align-items: center; row-gap: .8rem;}
.game-info-detail > div .score > ul {display: flex; align-items: center; column-gap: .6rem; justify-content: center;}
.game-info-detail > div .score > ul > li {font-size: 3.2rem; font-weight: 700; width: 4rem; text-align: center;}
.game-info-detail > div .score > ul > li:nth-child(2) {width: fit-content;}

.match-ground-wrap {display: flex; flex-flow: column; row-gap: 2rem;}
.match-ground-wrap .ground {border-radius: .4rem; position: relative;}
.match-ground-wrap .ground > img {width: 100%;}
.match-ground-wrap .ground > div {position: absolute; display: flex; flex-flow: column; align-items: center; row-gap: .2rem; width: 6.4rem; height: 4.6rem; margin-left: -3.2rem; margin-top: -2.3rem;}
.match-ground-wrap .ground > div > p {width: 2.8rem; height: 2.8rem; background-color: var(--black); display: flex; align-items: center; justify-content: center; border-radius: 100%; font-size: 1.4rem;}
.match-ground-wrap .ground > div > div {height: 1.6rem; padding: 0 .4rem; border-radius: 2rem;  background-color: rgba(14,14,14,.5); display: flex; align-items: center; justify-content: center;}
.match-ground-wrap .ground > div > div > p {max-width: 5.6rem; font-size: 1rem; font-weight: 500; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
/*.match-ground-wrap > ul {display: flex; flex-flow: column; row-gap: 1.6rem; max-height: 10rem; overflow-y: auto;}*/
.match-ground-wrap > ul {display: flex; flex-flow: column; row-gap: 1.6rem;}
.match-ground-wrap > ul > li {display: flex; flex-flow: column; row-gap: .4rem;}
.match-ground-wrap > ul > li > div {display: flex; align-items: center; column-gap: .6rem;}
.match-ground-wrap > ul > li > div  > p {font-size: 1.4rem; font-weight: 500; color: var(--gray5); display: flex; align-items: center; column-gap: .4rem;}
.match-ground-wrap > ul > li > div > p > span {color: var(--gray30); font-weight: 400;}

/*.match-ground-wrap > ul::-webkit-scrollbar {width: .2rem; height: 100%; background-color: rgba(255, 255, 255, .25); display: block; border-radius: .4rem;}*/
/*.match-ground-wrap > ul::-webkit-scrollbar-thumb {background-color: var(--white);}*/

/* 경기 > 일정 결과 > 매치센터 > 경기 정보 */
.graph-wrap {display: flex; flex-flow: column; row-gap: 1.2rem;}
.graph-wrap .team {display: flex; align-items: center; column-gap: .6rem; justify-content: center;}
.graph-wrap .team > li:nth-child(1) {flex: 1;}
.graph-wrap .team > li:nth-child(1) > p {text-align: right;}
.graph-wrap .team > li:nth-child(2) {width: fit-content;}
.graph-wrap .team > li:nth-child(3) {flex: 1;}
.graph-wrap .team > li > p {font-size: 1.6rem; font-weight: 600;}
.graph-wrap .team > li > span {width: 5.2rem; font-size: 1.4rem; color: var(--gray40); display: block; text-align: center;}

.graph-wrap .graph {display: flex; flex-flow: column; row-gap: 1.2rem;}
.graph-wrap .graph > li {display: flex; align-items: center; column-gap: .6rem;}
.graph-wrap .graph > li > p {width: 5.2rem; text-align: center; font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.graph-wrap .graph > li > div {flex: 1; display: flex; align-items: center; column-gap: .6rem;}
.graph-wrap .graph > li > div > p {width: 3.6rem; font-size: 1.2rem; font-weight: 500;}
.graph-wrap .graph > li > div > div {flex: 1; height: .4rem; border-radius: .1rem; background-color: var(--gray70); display: flex; align-items: center;}
.graph-wrap .graph > li > div > div > span {display: block; height: 100%; border-radius: .1rem; background-color: var(--blue50);}

.graph-wrap .graph > li > div:nth-child(1) > p {text-align: right;}
.graph-wrap .graph > li > div:nth-child(1) > div {justify-content: flex-end;}
.graph-wrap .graph > li > div:nth-child(3) {flex-flow: row-reverse;}
.graph-wrap .graph > li > div:nth-child(3) > div > span {background-color: var(--gray30);}

/* 경기 > 일정 결과 > 매치센터 > 타임라인 */
.timeline {display: flex; flex-flow: column; background-color: var(--gray80); border-radius: .4rem;}
.timeline > li {display: flex; align-items: center; column-gap: .6rem; height: 4.6rem; padding: 0 1.6rem;}
.timeline > li > div {flex: 1; display: flex; align-items: center; column-gap: .8rem; justify-content: space-between;}
.timeline > li > div > div {display: flex; flex-flow: column; row-gap: .4rem;}
.timeline > li > div > div > p {font-size: 1.4rem; font-weight: 600;}
.timeline > li > div > div > span {font-size: 1.2rem; color: var(--gray30);}
.timeline > li > div:nth-child(3) {flex-flow: row-reverse;}
.timeline > li > div:nth-child(3) > div {align-items: flex-end;}
.timeline > li > p {width: 3.6rem; text-align: center; font-size: 1.4rem; font-weight: 500; color: var(--gray30);}
.timeline > li + li {border-top: 1px dashed rgba(159,159,159,.3);}

/* 경기 > 팀 순위 */
.team-rank-table02 {position: relative;}
.team-rank-table02 tr > *:nth-child(1) {position: sticky; left: 0; z-index: 1;}
.team-rank-table02 tr > *:nth-child(2) {position: sticky; left: 4rem; z-index: 1;}
.team-rank-table02 tr > *:nth-child(2)::before {content: ''; width: 1px; height: 100%; background-color: #272727; display: block; position: absolute; top: 0; left: initial; right: 0;}
.team-rank-table02 tr > *:nth-child(2)::after {content: ''; width: 1.4rem; height: 100%; background: linear-gradient(90deg, rgba(23, 23, 23, 0.55) -10%, rgba(28, 28, 28, 0.00) 100%); display: block; position: absolute; right: -1.4rem; top: 0;}
.team-rank-table02 tr > *:nth-child(2) + td::before {content: none;}
.team-rank-table02 tr > td:nth-child(1) {font-family: 'Roboto'; font-weight: 700; font-style: italic; font-size: 1.6rem;}

/* 까치같이 ----------------------- */
/* 까치같이 > 구단 뉴스 */
main .search-wrap:first-child {margin-top: -1rem; position: sticky; top: 0;}
.tab-cont .search-wrap:first-child {margin-top: -2rem; position: sticky; top: 4.5rem;}

.search-wrap {width: 100vw; margin: 0 -1.6rem 2rem; padding: 1.2rem 1.6rem; display: flex; align-items: center; grid-gap: .6rem; flex-wrap: wrap; border-bottom: 1px solid var(--gray70); background-color: var(--gray90); z-index: 10;}
.search-wrap:has(> *:nth-child(1):nth-last-child(3)) > select {width: calc((100% - .6rem) / 2);}
.search-wrap > select {width: 11rem;}
.search-wrap > div {flex: 1; position: relative; display: flex; align-items: center;}
.search-wrap > div > input {padding-right: 4.4rem;}
.search-wrap > div > button {width: fit-content; height: fit-content; padding: 0; position: absolute; right: 1.2rem; background-color: transparent;}

.notice-list {display: flex; flex-flow: column; row-gap: 2rem;}
.notice-list > li {display: flex; flex-flow: column; row-gap: 1.2rem;}
.notice-list > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.notice-list > li .img img {width: 100%;}
.notice-list > li .desc {display: flex; flex-flow: column; row-gap: .8rem;}
.notice-list > li .desc > p {font-size: 1.4rem; font-weight: 600; line-height: 1.4; word-break: keep-all;}
.notice-list > li .desc > ul {display: flex; align-items: center; column-gap: .6rem;}
.notice-list > li .desc > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.notice-list > li .desc > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray70);}

.empty.news {height: calc(100dvh - 4.5rem - 6.9rem - 2rem - 3.4rem);}

/* 까치같이 > 구단뉴스 > 상세 */
.notice-detail {display: flex; flex-flow: column;}
.notice-detail .cont {display: flex; flex-flow: column; row-gap: 3.2rem; padding-bottom: 4rem;}
.notice-detail .cont .tit {display: flex; flex-flow: column; row-gap: 1.2rem;}
.notice-detail .cont .tit > p {font-size: 1.6rem; font-weight: 600; line-height: 1.6; word-break: keep-all;}
.notice-detail .cont .tit > ul {display: flex; align-items: center; column-gap: .6rem;}
.notice-detail .cont .tit > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.notice-detail .cont .tit > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray70);}
.notice-detail .cont .desc {display: flex; flex-flow: column; row-gap: 2.4rem; font-size: 1.4rem; line-height: 1.6;}
.notice-detail .cont .desc h2 {font-size: 2rem; font-weight: 700; line-height: 1.6;}
.notice-detail .cont .desc img {width: 100vw!important; margin: 0 -1.6rem!important;}

.notice-img-swiper.swiper {width: 100vw; height: fit-content; margin: -1rem -1.6rem 0; position: relative;}
.notice-img-swiper.swiper .swiper-slide {width: 100%;}
.notice-img-swiper.swiper .swiper-slide .img {width: 100%; height: 20rem; background-image: url(/assets/img/media/media-thumbnail01-8b881b6f4d12df25d5adf535fd07c436.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.notice-img-swiper.swiper .swiper-slide .img::before {content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(0deg, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.00) 69.97%);}
.notice-img-swiper.swiper .swiper-pagination {width: calc(100% - 3.2rem); height: .2rem; top: initial; bottom: 2rem; left: 1.6rem; right: initial; background-color: rgba(255, 255, 255, .2);}
.notice-img-swiper.swiper .swiper-pagination > span {background-color: var(--white);}

.comment-wrap > div {width: 100vw; height: 4.8rem; padding: 0 1.6rem; margin: 0 -1.6rem; background-color: var(--gray80); display: flex; align-items: center; justify-content: space-between;}
.comment-wrap > div > ul {display: flex; align-items: center; column-gap: 1.2rem;}
.comment-wrap > div > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.comment-wrap > div i {width: 2rem; height: 2rem;}
.comment-wrap > div button {width: fit-content; height: fit-content; padding: 0; background-color: transparent; font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.comment-wrap > div button.active {font-weight: 600; color: var(--blue50);}
.comment-wrap > ul {display: flex; flex-flow: column;}
.comment-wrap > ul > li {display: flex; flex-flow: column; row-gap: 2rem; width: 100vw; margin: 0 -1.6rem; padding: 2rem 1.6rem;}
.comment-wrap > ul > li + li {border-top: 1px solid var(--gray70);}
.comment-wrap > ul > li > div {display: flex; flex-flow: column; row-gap: 1rem;}
.comment-wrap > ul > li > ul {display: flex; flex-flow: column; row-gap: 2rem; padding-left: 4rem;}
.comment-wrap > ul > li .info {display: flex; justify-content: space-between;}
.comment-wrap > ul > li .info > div {display: flex; column-gap: 1.2rem;}
.comment-wrap > ul > li .info > div .img {width: 2.8rem; height: 2.8rem; border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: center; border: 1px solid var(--gray30);}
.comment-wrap > ul > li .info > div .info {display: flex; flex-flow: column; row-gap: .6rem;}
.comment-wrap > ul > li .info > div .info > p {font-size: 1.2rem; font-weight: 600; display: flex; align-items: center; column-gap: .6rem;}
.comment-wrap > ul > li .info > div .info > span {font-size: 1.2rem; color: var(--gray30);}
.comment-wrap > ul > li .info .more {position: relative;}
.comment-wrap > ul > li .info .more > ul {display: flex; align-items: center; border: 1px solid var(--gray70); background-color: var(--gray80); border-radius: .4rem; position: absolute; top: 2rem; right: 0; z-index: 10;}
.comment-wrap > ul > li .info .more > ul > li {position: relative; display: flex; align-items: center;}
.comment-wrap > ul > li .info .more > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray60); position: absolute; left: 0;}
.comment-wrap > ul > li .info .more > ul > li > button {width: 4.5rem; height: 3.6rem; padding: 0; font-size: 1.2rem; font-weight: 500; color: var(--white); background-color: transparent;}
.comment-wrap > ul > li .info > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}
.comment-wrap > ul > li .desc {padding-left: 4rem; display: flex; flex-flow: column; row-gap: 1rem;}
.comment-wrap > ul > li .desc > p {font-size: 1.4rem; line-height: 1.6; color: var(--gray5);}
.comment-wrap > ul > li .desc > ul {display: flex; align-items: center; column-gap: 1rem;}
.comment-wrap > ul > li .desc > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1rem; color: var(--gray5);}
.comment-wrap > ul > li .desc > ul > li i {width: 1.2rem; height: 1.2rem;}
.comment-wrap > ul > li .desc > ul > li button {font-size: 1rem; color: var(--gray5); font-weight: 400; column-gap: .4rem; width: fit-content; height: fit-content; padding: 0; background-color: transparent;}
.comment-wrap > ul > li .desc > ul > li button.active {color: var(--blue50);}

.comment-wrap > ul > li .info > div > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}

.comment-wrap > ul > li .desc > ul > li > div button {font-size: 1rem; color: var(--gray5); font-weight: 400; column-gap: .4rem; width: fit-content; height: fit-content; padding: 0; background-color: transparent;}

.more-wrap {position: relative; z-index: 5;}
.more-wrap .more-layer {position: absolute; top: 2rem; right: 0; align-items: center; border: 1px solid var(--gray200); background-color: var(--white); border-radius: .4rem;}
.more-wrap .more-layer button {width: fit-content; height: 4.6rem; padding: 0 1.6rem; font-size: 1.4rem; font-weight: 500; color: var(--black); background-color: transparent; border-color: transparent; white-space: nowrap; position: relative;}
.more-wrap .more-layer button + button::before {content: ''; width: 1px; height: 1.2rem; display: block; background-color: var(--gray200); position: absolute; left: 0;}

.notice-detail .list {width: 100vw; margin: 0 -1.6rem .4rem; padding: 0 1.6rem; border-top: 1rem solid var(--gray80);}
.notice-detail .list > li {height: 4.4rem; display: flex; align-items: center; column-gap: 1rem;}
.notice-detail .list > li + li {border-top: 1px solid var(--gray70);}
.notice-detail .list > li > span {font-size: 1.2rem; color: var(--gray30);}
.notice-detail .list > li > p {flex: 1; font-size: 1.2rem; color: var(--gray5); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}

.bottom-fixed:has(.comment-input)::after {height: calc(1rem + 4.4rem);}
.bottom-fixed:has(.comment-input) > div {background-color: var(--gray80); border-top: 1px solid var(--gray70);}
.comment-input {display: flex; align-items: center; column-gap: .8rem;}
.comment-input input {background-color: var(--gray70); border-color: var(--gray60);}
.comment-input button {width: 8rem; height: 4.4rem; font-size: 1.4rem;}

/* 까치같이 > 구단뉴스 > 상세 > 댓글 수정 */
main .modify-wrap:first-child {width: 100vw; margin: -1rem -1.6rem 0; padding: 1.6rem; border-top: 1rem solid var(--gray80);}
main .modify-wrap:first-child textarea {padding: 0; height: 36rem; background-color: transparent; border: 0;}

/* 까치같이 > 구단뉴스 > 상세 > 신고 */
.notify-wrap {display: flex; flex-flow: column; width: 100vw; margin: 0 -1.6rem; border-top: 1px solid var(--gray70);}
.notify-wrap > li {padding: 0 1.6rem; height: 5.2rem; display: flex; align-items: center; font-size: 1.4rem; font-weight: 500; border-bottom: 1px solid var(--gray70);}

/* 까치같이 > MOM 투표 */
.mom-list {width: 100vw; margin: -2rem -1.6rem 0; padding: 3rem 1.6rem 0; background-image: url(/assets/img/talk/mom-bg-263a8e95ffb9e7f68b954e8ec0c1c039.png); background-repeat: no-repeat; background-size: 100% auto; background-position: top center;}
.mom-list > div {display: flex; flex-flow: column; row-gap: 1rem; align-items: center; margin-bottom: 1rem;}
.mom-list > div .tit-txt{width: 9.9rem;}
.mom-list > div .tit-logo {width: 14.5rem;margin-top: 1rem;}

.empty.mom {height: calc(100dvh - 4.5rem - 3rem - 14.8rem - 2rem - 3.4rem);}

.btn-mom-history { height: 3rem; font-size: 1.2rem; margin-top: 2rem; }
.btn-mom-history:after { content: ""; display: block; width: 1.4rem; height: 1.4rem; background-image: url(/assets/img/ico/ic-arrow-right-16-16dc5b65e779d9ca4a75a55bb507fa70.svg); background-repeat: no-repeat; background-size: contain; }

/* 까치같이 > MOM 투표 > 상세 */
.mom-summary {display: flex; flex-flow: column; row-gap: 2rem; align-items: center; width: 100vw; margin: -1rem -1.6rem 0; padding: 3rem 1.6rem 2rem; background-image: url(/assets/img/talk/mom-bg-263a8e95ffb9e7f68b954e8ec0c1c039.png); background-repeat: no-repeat; background-size: 100% auto; background-position: top center;}
.mom-summary > img {height: 7.4rem;}
.mom-summary .league {display: flex; flex-flow: column; align-items: center; row-gap: 1rem;}
.mom-summary .league img {width: 4rem; height: 4rem;}
.mom-summary .league p {text-align: center; font-size: 1.2rem; font-weight: 700;}

.mom-summary .mom-player {display: flex; align-items: flex-end; justify-content: center; position: relative;}
.mom-summary .mom-player > img {width: 100%;}
.mom-summary .mom-player > div {display: flex; flex-flow: column; align-items: center; position: absolute; width: 100%;}
.mom-summary .mom-player > div .player {width: 16rem; height: 16rem; background-repeat: no-repeat; background-size: 100% auto; background-position: top center;}
.mom-summary .mom-player > div > p {width: 100%; height: 3.6rem; display: flex; align-items: center; justify-content: center; background-color: var(--gray80); font-size: 1.6rem; font-weight: 700;}

.vote-state {display: flex; flex-flow: column; row-gap: 1rem;}
.vote-state > li {height: 4.8rem; display: flex; align-items: center; justify-content: space-between; padding: 0 1.6rem; background-color: var(--gray80); border: 1px solid var(--gray70); border-radius: .4rem;}
.vote-state > li > div {display: flex; align-items: center; column-gap: 1rem;}
.vote-state > li > div .img {width: 3.2rem; height: 3.2rem; border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-color: var(--gray10); background-repeat: no-repeat; background-size: cover; background-position: center top;}
.vote-state > li > div > p {font-size: 1.4rem; font-weight: 500;}
.vote-state > li > p {font-size: 1.4rem; font-weight: 700;}
.vote-state > li:nth-child(1) > p {color: var(--blue50);}

.media-list01 {display: flex; flex-flow: column; row-gap: 3rem;}
.media-list01 > li {display: flex; flex-flow: column; row-gap: 2rem;}
.media-list01 > li .img {width: 100%; height: 50vw; border-radius: .4rem; background-image: url(/assets/img/media/media-thumbnail01-8b881b6f4d12df25d5adf535fd07c436.png); background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden;}
.media-list01 > li .img:has(i)::before {content: ''; background-color: rgba(0, 0, 0, 0.25); width: 100%; height: 100%; position: absolute; z-index: 1;}
.media-list01 > li .img > i {position: relative; z-index: 2;}
.media-list01 > li .desc {display: flex; flex-flow: column; row-gap: 1.2rem;}
.media-list01 > li .desc > div {display: flex; flex-flow: column; row-gap: .6rem;}
.media-list01 > li .desc > div > p {font-size: 1.4rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.media-list01 > li .desc > ul {display: flex; align-items: center; column-gap: .6rem;}
.media-list01 > li .desc > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.media-list01 > li .desc > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray40);}

/* 까치같이 > MOM 히스토리 */
.tab-history {overflow:auto;width: 100vw;gap: 3rem; justify-content: space-evenly; margin: 0 -1.6rem 3rem;padding: 0 1.6rem; border-bottom: none; }
.tab-history > li { flex: unset; }
.tab-history > li > p { color: var(--gray40); font-size: 2.8rem; font-weight: 800; }
.tab-history > li.active > p { color: var(--white);font-weight: 800; }
.tab-history > li.active > p::after { display: none; }

.mom-histroy-vip { position: relative; overflow: hidden; border-radius: 4px; border: 1px solid var(--gray30); background: var(--gray80); box-shadow: 0 0 20px 0 rgba(242, 196, 143, 0.40); z-index: 1; padding: 2rem 1.6rem; min-height: 15.9rem; }
.mom-histroy-vip .logo{width: 14rem; }
.mom-histroy-vip .info { display: flex; flex-direction: column; gap: .5rem; margin-top: 2.1rem; }
.mom-histroy-vip .info span { color: var(--gray30); font-size: 1.2rem; font-weight: 600; }
.mom-histroy-vip .info p { font-size: 1.6rem; font-weight: 600; }
.mom-histroy-vip .bg-year { color: var(--gray70); font-size: 14rem; font-weight: 800; letter-spacing: -7px; position: absolute; bottom: -.9rem; left: 50%; transform: translateX(-50%); z-index: -1; }
.mom-histroy-vip .img { width: 17rem; aspect-ratio: 170/158; overflow: hidden; position: absolute; bottom: 0; right: .8rem;height: 100%; }
.mom-histroy-vip .img img { width: 100%; height: 100%; object-fit: contain;object-position: bottom center; }

.mom-history-list { display: flex; flex-direction: column; gap: 2rem; }
.mom-history-list .mom-history-tit { text-align: center; }
.mom-history-list .mom-history-tit img { width: 14.5rem; }
.mom-history-list ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; }
.mom-history-list ul li { display: flex; flex-direction: column; gap: 1.4rem; }
.mom-history-list ul li .img { border-radius: 4px; overflow: hidden; width: 100%; aspect-ratio: 1/1; background-size: cover; background-image: url(/assets/img/talk/bg-player-mom-07cb53b7dd7333cef4d201fe2866ee75.png); }
.mom-history-list ul li .img img { width: 100%; height: 100%; object-fit: cover; }
.mom-history-list ul li .txt { display: flex; justify-content: space-between; align-items: flex-end; }
.mom-history-list ul li .txt .tag-month { display: inline-flex; padding: 4px 8px; justify-content: flex-end; align-items: center; border-radius: 4px; background: var(--point1); font-size: 1rem; font-weight: 400; line-height: 1; }
.mom-history-list ul li .txt .info { display: flex; gap: .6rem; align-items: flex-end; }
.mom-history-list ul li .txt .info span { color: var(--gray30); font-weight: 600; font-size: 1.2rem; }
.mom-history-list ul li .txt .info p { font-weight: 600; font-size: 1.6rem; }

/* 까치같이 > 이벤트 */
.event-list {display: flex; flex-flow: column; row-gap: 2rem;}
.event-list > li {border-bottom: 1px solid var(--gray70); padding-bottom: 2rem; display: flex; flex-flow: column; row-gap: .6rem;}
.event-list > li > div {display: flex; align-items: center; justify-content: space-between; column-gap: 4rem;}
.event-list > li > div > div {display: flex; flex-flow: column; row-gap: .8rem; flex: 1;}
.event-list > li > div > div > p {font-size: 1.4rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.event-list > li > div > div > span {font-size: 1.2rem; color: var(--gray30);}
.event-list > li > div > ul {display: flex; align-items: center; column-gap: 2rem;}
.event-list > li > div > ul > li {text-align: center; font-size: 1.8rem; font-weight: 700; color: var(--gray5);}
.event-list > li > div > ul > li > i {width: 2.8rem; height: 2.8rem;}

.empty.event {height: calc(100dvh - 4.5rem - 2rem - 3rem - 2rem - 3.4rem);}

/* 까치같이 > 이벤트 > 상세 */
.event-type01 {display: flex; flex-flow: column; align-items: center; padding-top: 2.4rem;}
.event-type01 .tit {padding-bottom: 5.6rem;}
.event-type01 .tit img {height: 4.4rem;}
.event-type01 .tit > p {font-size: 1.4rem; font-weight: 500; color: var(--gray5); line-height: 1.6; text-align: center;}

.event-type01 .game {display: flex; flex-flow: column; row-gap: 2rem; width: 100%;}
.event-type01 .game > ul {display: flex; align-items: center; column-gap: .6rem;}
.event-type01 .game > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.4rem; font-weight: 500; color: var(--gray5);}
.event-type01 .game > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray5);}
.event-type01 .game > div {display: flex; flex-flow: column; row-gap: 2rem;}
.event-type01 .game > div > a {display: flex; align-items: center; justify-content: center; column-gap: .4rem; font-size: 1.4rem; color: var(--gray5);}

.guess-winner {display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 1.2rem;}
.guess-winner > li input + label {height: 12rem; border-radius: .4rem; background-color: var(--gray80); border: 1px solid var(--gray70); flex-flow: column; align-items: center; justify-content: center; row-gap: 1rem;}
.guess-winner > li input + label::before {content: none;}
.guess-winner > li input + label > i {width: 4.8rem; height: 4.8rem;}
.guess-winner > li input + label > p {flex: initial; text-align: center; font-size: 1.4rem; font-weight: 500;}
.guess-winner > li input:checked + label {border-color: var(--blue50);}

.notice.event {height: calc(100dvh - 1rem - 14.4rem - 22.2rem - 4rem);}

.event-type01 .result {margin: -1.4rem 0 3rem; display: flex; align-items: center; flex-flow: column; row-gap: 4rem;}
.event-type01 .result > ul {display: flex; align-items: center; column-gap: .6rem;}
.event-type01 .result > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.4rem; font-weight: 500; color: var(--gray5);}
.event-type01 .result > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray5);}
.event-type01 .result > div {display: flex; flex-flow: column; align-items: center; row-gap: 2rem;}
.event-type01 .result > div > div {display: flex; flex-flow: column; align-items: center; row-gap: .8rem;}
.event-type01 .result > div > div > p {font-size: 2rem; font-weight: 700; text-align: center;}
.event-type01 .result > div > div > span {font-size: 1.4rem; text-align: center;}

.event-type01 .box {width: 100%;}
.event-type01 .game-info-detail {background-color: var(--gray80); border: 1px solid var(--gray70); border-radius: .4rem; padding: 3rem 0;}

.event-type02 {display: flex; flex-flow: column; align-items: center; row-gap: 2rem; padding-top: 2.4rem;}
.event-type02 .tit {display: flex; flex-flow: column; align-items: center; row-gap: 2rem;}
.event-type02 .tit img {height: 3.2rem;}
.event-type02 .tit > p {font-size: 1.4rem; font-weight: 500; color: var(--gray5); line-height: 1.6; text-align: center;}

.event-type02 .game {position: relative; display: flex; align-items: center; justify-content: center; padding-top: 1rem; width: 100%;}
.event-type02 .game .roulette-picker {width: 5rem; height: 6rem; position: absolute; top: -0.3rem; z-index: 1; background-repeat: no-repeat; background-size: contain; background-position: center;}
.event-type02 .game .roulette-pan {overflow: hidden;}
.event-type02 .game .roulette-btn {width: 8.4rem; height: 8.4rem; padding: 0; border-radius: 100%; background-color: transparent; position: absolute; z-index: 1; background-size: contain;}

#canvas {
    width:100%;
    height:100%;
    /*position:absolute;*/
}

.calendar-wrap { margin-top: 2.4rem; border-radius: 4px; padding: 3rem 0 1rem; background-color: var(--gray70); background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; background-image: url("/assets/img/talk/bg-calendar-4c0b4fd9c6bc49d002f1f89a6ad8f874.png"); }
.calendar-tit { display: flex; padding: 0 1.9rem; justify-content: space-between; align-items: center; }
.calendar-tit strong { font-size: 2.8rem; font-weight: 700; }
.calendar-tit span { font-size: 1.3rem; display: flex; gap: .4rem; justify-content: space-between; align-items: center; }
.calendar-tit span:before { content: ""; display: block; width: .8rem; height: .8rem; border-radius: 100px; background: var(--blue50); }

.checkin-calendar table thead { padding-bottom: 0; }
.checkin-calendar table thead th { background: none; border: none; font-size: 1.4rem; height: 5.5rem; color: var(--white); }
.checkin-calendar table tbody td { background: none; border: none; color: #747479; font-size: 1.6rem; height: 5.5rem; font-weight: 600; position: relative; z-index: 1; }
.checkin-calendar table tbody td.today { color: var(--white); }
.checkin-calendar table tbody td.today:before { content: ""; display: block; width: 4.2rem; height: 4.2rem; border-radius: 100px; background: var(--blue50); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: -1; }
.checkin-calendar table tbody td.check:before { content: ""; display: block; width: 3rem; height: 3rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: var(--gray70); background-position: 50% 50%; background-repeat: no-repeat; background-size: contain; background-image: url("/assets/img/ico/ic-magpie-ffdf4b52b2e13df306eb8e3870f68b08.svg"); z-index: 2; }
.checkin-calendar .event-info{margin-left: -1.6rem;margin-right: -1.6rem;}

.pop-wrap .ic-draw{margin-top: 2.6rem;}

/* 까치같이 > 팬토크 */
.floating-btn {position: fixed; right: 2rem; bottom: 3rem; z-index: 100;}
.floating-btn button {height: 4rem; padding: 0 1.2rem; border-radius: 4rem; font-size: 1.4rem; font-weight: 500;}

.search-wrap + .notice-point {margin-top: -2rem;}
.notice-point {width: 100vw; height: 5rem; margin: 0 -1.6rem 2rem; padding: 0 1.6rem; display: flex; align-items: center; column-gap: .6rem; border-bottom: 1px solid var(--gray70);}
.notice-point > p {flex: 1; font-size: 1.4rem; font-weight: 500; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical}

.talk-list {display: flex; flex-flow: column;}
.talk-list > li {display: flex; flex-flow: column; row-gap: .8rem; padding-top: 2rem;padding-bottom: 2rem; border-bottom: 1px solid var(--gray70);order:2;}
.talk-list > li .cont {display: flex; column-gap: 2rem; justify-content: space-between;}
.talk-list > li .cont .desc {display: flex; flex-flow: column; row-gap: .6rem; flex: 1;}
.talk-list > li .cont .desc .tag-row {display: flex; align-items: center; gap: .4rem;}
.talk-list > li .cont .desc .title {font-size: 1.6rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.talk-list > li .cont .desc > div {font-size: 1.6rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical}
.talk-list > li .cont .desc > p {font-size: 1.4rem; color: var(--gray10); line-height: 1.4; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical}
.talk-list > li .cont .img {width: 4.8rem; height: 4.8rem; border-radius: .2rem; background-repeat: no-repeat; background-size: cover; background-position: center; border: 1px solid var(--gray30);}
.talk-list > li .info {display: flex; align-items: center; justify-content: space-between; column-gap: 2rem;}
.talk-list > li .info > div {display: flex; align-items: center; column-gap: 1rem;}
.talk-list > li .info > div .img {width: 2.8rem; height: 2.8rem; border: 1px solid var(--gray70); border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.talk-list > li .info > div > ul {display: flex; align-items: center; column-gap: .4rem;}
.talk-list > li .info > div > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; color: var(--gray30);}
.talk-list > li .info > div > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; color: var(--gray30);}
.talk-list > li .info > div > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray50);}
.talk-list > li .info > ul {display: flex; align-items: center; column-gap: .8rem;}
.talk-list > li .info > ul > li {display: flex; align-items: center; column-gap: .2rem; font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.talk-list > li .info > ul > li > i {width: 1.2rem; height: 1.2rem;}
.talk-list>li.best-list{order:1;margin-left:-1.6rem;margin-right:-1.6rem;padding:2rem 1.6rem;background:rgba(255,255,255,0.1);}
.talk-list > li.best-list .tag-row .label.point{margin-left: 2rem;position: relative;}
.talk-list > li.best-list .tag-row .label.point:before { content: ""; width: 1.6rem; height: 1.6rem; position: absolute; top: 0; left: -2rem; background-size: contain; background-image: url(/assets/img/ico/ic-pin-501cf393468feff0a1e8612962c34e41.svg); }

.empty.talk {height: calc(100dvh - 4.5rem - 6.9rem - 5rem - 2rem - 3rem - 2rem - 3.4rem);}

/* 까치같이 > 팬토크 > 작성 */
.write-wrap {display: flex; flex-flow: column;}
.write-wrap .category {width: 100vw; margin: -1rem -1.6rem 0; padding: 0 1.6rem; height: 5.6rem; display: flex; align-items: center; justify-content: space-between; border-bottom: 1rem solid var(--gray80);}
.write-wrap .category > p {font-size: 1.6rem; font-weight: 600;}
.write-wrap .category > ul {display: flex; align-items: center; border: 1px solid var(--gray50); border-radius: .2rem;}
.write-wrap .category > ul > li + li {border-left: 1px solid var(--gray50);}
.write-wrap .category > ul > li input + label {min-width: 6rem; height: 3.2rem; text-align: center; font-size: 1.2rem; font-weight: 500; color: var(--gray30); align-items: center; justify-content: center;}
.write-wrap .category > ul > li input + label::before {content: none;}
.write-wrap .category > ul > li input:checked + label {background-color: var(--gray40); font-weight: 600; color: var(--white);}
.write-wrap .write > input {background-color: transparent; width: 100vw; height: 5rem; margin: 0 -1.6rem; padding: 0 1.6rem; border: 0; border-radius: 0; font-size: 1.8rem; font-weight: 500; border-bottom: 1px solid var(--gray70);}
.write-wrap .write > textarea {height: calc(100dvh - 5.6rem - 5rem - 14.4rem - 5.8rem - 3.4rem); background-color: transparent; width: 100vw; margin: 0 -1.6rem; padding: 1.6rem; border: 0; border-radius: 0;}

.photo-wrap {border-top: 1rem solid var(--gray80); width: 100vw; margin: 0 -1.6rem; padding: 1.2rem 1.6rem 2rem; display: flex; flex-flow: column; row-gap: 1rem;}
.photo-wrap > div {display: flex; align-items: center; justify-content: space-between;}
.photo-wrap > div > p {font-size: 1.6rem; font-weight: 600; display: flex; align-items: center; column-gap: .4rem;}
.photo-wrap > div > p > span {font-size: 1.2rem; font-weight: 500; color: var(--gray40);}
.photo-wrap > div .file input + label {width: 12rem; height: 3.2rem; border: 1px solid var(--gray50); background-color: transparent; font-size: 1.2rem; color: var(--gray10);}
.photo-wrap > ul {display: flex; align-items: center; column-gap: 1rem;}
.photo-wrap > ul > li {width: 6rem; height: 6rem; padding: .4rem; border-radius: .2rem; background-image: url(/assets/img/talk/photo-default-1d1e5cc69c48bc52c64fbad4f42987a4.png); background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: flex-start; justify-content: flex-end;}
.photo-wrap > ul > li > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}

/* 까치같이 > 팬토크 > 상세 */
.talk-detail {display: flex; flex-flow: column;}
.talk-detail .tit {display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2rem;}
.talk-detail .tit > div {display: flex; flex-flow: column; row-gap: 1.2rem;}
.talk-detail .tit > div > div {display: flex; align-items: center; column-gap: 1.2rem;}
.talk-detail .tit > div > div .img {width: 2.8rem; height: 2.8rem; border: 1px solid var(--gray70); border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.talk-detail .tit > div > div .desc {display: flex; flex-flow: column; row-gap: .6rem;}
.talk-detail .tit > div > div .desc > p {font-size: 1.2rem; font-weight: 600; color: var(--gray5);}
.talk-detail .tit > div > div .desc > span {font-size: 1.2rem; color: var(--gray30);}
.talk-detail .tit > p {font-size: 1.2rem; color: var(--gray30);}
.talk-detail .cont {display: flex; flex-flow: column; row-gap: 1.6rem; padding-bottom: 4rem;}
.talk-detail .cont > p {font-size: 1.8rem; font-weight: 600;}
.talk-detail .cont .desc {display: flex; flex-flow: column; row-gap: 2.4rem; font-size: 1.4rem; line-height: 1.6;}
.talk-detail .cont .desc img {width: 100%;}

/* 까치같이 > 1대1 문의 */
.inquiry-wrap {margin-top: -2rem; display: flex; flex-flow: column; row-gap: 2rem;}
.inquiry-wrap .desc {width: 100vw; margin: 0 -1.6rem; padding: 0 1.6rem; border-bottom: 1rem solid var(--gray80); height: 5.8rem; display: flex; align-items: center;}
.inquiry-wrap .desc > p {font-size: 1.2rem; color: var(--gray20);}
.inquiry-wrap .desc > p > span {color: var(--white);}
.inquiry-wrap .wrap > ul {display: flex; flex-flow: column; row-gap: 2rem;}
.inquiry-wrap .wrap > ul > li {display: flex; flex-flow: column; row-gap: 1rem;}
.inquiry-wrap .wrap > ul > li > div {display: flex; align-items: center; justify-content: space-between;}
.inquiry-wrap .wrap > ul > li > div > p {font-size: 1.4rem; font-weight: 600;}
.inquiry-wrap .wrap > ul > li > div > button {width: fit-content; height: fit-content; padding: 0; font-size: 1.4rem; font-weight: 500; color: var(--gray5); background-color: transparent;}
.inquiry-wrap .wrap > ul > li .captcha {border-radius: .4rem;}
.inquiry-wrap .wrap > ul > li .captcha img {width: 100%;}

/* 구단소개 ----------------------- */
/* 구단소개 > 연혁 */
.history-wrap {display: flex; flex-flow: column; row-gap: 2.4rem; align-items: center; position: relative; padding: 1rem 0;}
.history-wrap::before {content: ''; width: 1px; height: 100%; background-color: var(--gray70); position: absolute; top: 0;}
.history-wrap > li {display: flex; flex-flow: column; row-gap: 1.6rem;}
.history-wrap > li > * {width: calc((100% - 4rem) / 2);}
.history-wrap > li > div {display: flex; flex-flow: column; row-gap: .8rem; align-items: flex-end; position: relative;}
.history-wrap > li > div::after {content: ''; width: 2rem; height: 2rem; background-image: url(/assets/img/ico/ic-history02-aed27d0a5ad751d4e613a8e9dc8afa46.svg); background-repeat: no-repeat; background-size: contain; background-position: center; position: absolute; top: 0; right: -3rem; z-index: 1;}
.history-wrap > li > div > p {font-size: 1.8rem; font-weight: 600;}
.history-wrap > li > div > span {font-size: 1.4rem;}
.history-wrap > li > div > img {width: 100%; margin-top: .4rem;}
.history-wrap > li > ul {display: flex; flex-flow: column; row-gap: 1.2rem; margin-left: auto;}
.history-wrap > li > ul > li {display: flex; flex-flow: column; row-gap: .8rem; position: relative;}
.history-wrap > li > ul > li::before {content: ''; width: .4rem; height: .4rem; border-radius: 100%; background-color: var(--white); position: absolute; top: .5rem; left: -2.3rem; z-index: 1;}
.history-wrap > li > ul > li > p {font-size: 1.4rem; font-weight: 600;}
.history-wrap > li > ul > li > span {font-size: 1.4rem; line-height: 1.2; word-break: keep-all;}

.history-wrap > li:nth-child(1) > div::after {background-image: url(/assets/img/ico/ic-history01-35d7ef7f62c38fd3ad4af64d07a10b54.svg);}

/* 구단소개 > 엠블럼/마스코트 */
.intro-wrap {display: flex; flex-flow: column; row-gap: 2rem;}
.intro-wrap > p {font-size: 1.4rem; color: var(--gray5); line-height: 1.6; word-break: keep-all;}
.intro-wrap > img {width: 100%;}
.intro-wrap > ul {background-color: var(--gray80); border-radius: .4rem; padding: 1.6rem; display: flex; flex-flow: column; row-gap: .8rem;}
.intro-wrap > ul > li {display: flex; column-gap: 2.4rem; line-height: 1.6; font-size: 1.4rem; color: var(--gray5);}
.intro-wrap > ul > li > p {font-weight: 600; width: 5.6rem;}
.intro-wrap > ul > li > span .label {display: inline-flex; margin-right: .8rem;}

/* 구단소개 > 홈구장 */
.stadium-swiper.swiper {width: 100%; height: fit-content;}
.stadium-swiper.swiper .swiper-slide {border-radius: .4rem; overflow: hidden;}
.stadium-swiper.swiper .swiper-slide img {width: 100%;}

.stadium-swiper.swiper .swiper-pagination {width: fit-content; display: flex; align-items: center; column-gap: .2rem; justify-content: center; background-color: var(--black); font-size: 1.2rem; color: rgba(255, 255, 255, .4); position: relative; top: initial; left: initial; right: initial; bottom: initial; margin: .8rem auto 0;}
.stadium-swiper.swiper .swiper-pagination > span {width: .8rem; text-align: center;}
.stadium-swiper.swiper .swiper-pagination .swiper-pagination-current {font-weight: 500; color: var(--white);}

.assist-desc {display: flex; flex-flow: column; row-gap: 1.2rem; margin-top: 2rem;}
.assist-desc > p {font-size: 1.4rem; font-weight: 600;}
.assist-desc > span {font-size: 1.4rem; line-height: 1.6; color: var(--gray5); word-break: keep-all;}
.assist-desc > button {height: 3.2rem; background-color: var(--gray70); font-size: 1.4rem;}

.seat-view {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 1.2rem; margin-top: 2rem;}
.seat-view > li > button {height: 3.2rem; font-size: 1.4rem; padding: 0;}

/* 구단소개 > 클럽하우스 */
.intro-wrap .clubhouse {row-gap: 2rem;}
.intro-wrap .clubhouse > li {flex-flow: column; row-gap: .4rem;}
.intro-wrap .clubhouse > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.intro-wrap .clubhouse > li > p {width: fit-content;}
.intro-wrap .clubhouse > li > span {word-break: keep-all;}

.partner-wrap {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem;}
.partner-wrap > li {background-color: var(--gray80); border-radius: .4rem; display: flex; align-items: center; justify-content: center;}
.partner-wrap > li > img {height: 6.3rem;}

/* 구단소개 > 조직도 */
.organization-wrap {display: flex; flex-flow: column; row-gap: 6.8rem;}
.organization-wrap .management {display: flex; flex-flow: column; row-gap: 2rem; align-items: center; position: relative;}
.organization-wrap .management::before {content: ''; width: 1px; height: calc(100% + 3.4rem); background-color: var(--gray70); position: absolute;}
.organization-wrap .management > li {width: 12.8rem; height: 4.4rem; border-radius: .4rem; display: flex; align-items: center; justify-content: center; background-color: var(--gray40); font-size: 1.4rem; font-weight: 500; z-index: 1;}
.organization-wrap .management .ceo {background-color: var(--blue50);}
.organization-wrap .team-organization {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 1.2rem 2rem; position: relative;}
.organization-wrap .team-organization::before {content: ''; width: 1px; height: calc(100% + 7.4rem); background-color: var(--gray70); position: absolute; left: calc((100% - 2rem) / 4); bottom: -4rem; }
.organization-wrap .team-organization::after {content: ''; width: 1px; height: calc(100% + 3.4rem); background-color: var(--gray70); position: absolute; right: calc((100% - 2rem) / 4); bottom: 0; }
.organization-wrap .team-organization > li {grid-column: 2;padding: 2rem 1.2rem; background-color: var(--gray80); border-radius: .4rem; display: flex; flex-flow: column; align-items: center; row-gap: 1.2rem; position: relative; z-index: 1;}
.organization-wrap .team-organization > li > p {text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 1.4;}
.organization-wrap .team-organization > li > span {width: 100%; padding-top: 1.2rem; border-top: 1px dashed rgba(255,255,255,.3); text-align: center; font-size: 1.2rem; line-height: 1.8; color: var(--gray30);display: flex;align-items: center;justify-content: center;height: 100%;}
.organization-wrap .team-organization > li:nth-child(1)::before {content: ''; width: calc(100% + 2rem); height: 1px; background-color: var(--gray70); position: absolute; top: -3.4rem; left: calc(-50% - 2rem);}
.organization-wrap .team {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 1.2rem 2rem; position: relative;}
.organization-wrap .team::before {content: ''; width: 1px; height: calc(100% + 4rem); background-color: var(--gray70); position: absolute; left: calc((100% - 2rem) / 4); bottom: 0; }
.organization-wrap .team::after {content: ''; width: 1px; height: calc(100% + 4rem); background-color: var(--gray70); position: absolute; right: calc((100% - 2rem) / 4); bottom: 0; }
.organization-wrap .team > li {padding: 2rem 1.2rem; background-color: var(--gray80); border-radius: .4rem; display: flex; flex-flow: column; align-items: center; row-gap: 1.2rem; position: relative; z-index: 1;}
.organization-wrap .team > li.flex-center{justify-content:center}
.organization-wrap .team > li:nth-child(1)::before {content: ''; width: calc(50% + 1rem); height: 1px; background-color: var(--gray70); position: absolute; top: -4rem; left: 50%;}
.organization-wrap .team > li:nth-child(2)::before {content: ''; width: calc(50% + 1rem); height: 1px; background-color: var(--gray70); position: absolute; top: -4rem; right: 50%;}
.organization-wrap .team > li > p {text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 1.4;}
.organization-wrap .team > li > span {width: 100%; padding-top: 1.2rem; border-top: 1px dashed rgba(255,255,255,.3); text-align: center; font-size: 1.2rem; line-height: 1.8; color: var(--gray30);display: flex;align-items: center;justify-content: center;height: 100%;}

/* 선수단 ----------------------- */
/* 선수단 */
.player-list {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem;}
.player-list > li {display: flex; flex-flow: column; row-gap: 1.2rem;}
.player-list > li .img {width: 100%; height: calc((100vw - 3.2rem - 2rem) / 2); border-radius: .4rem; background-image: url(/assets/img/player/player-bg-90183a38b7e9f34653a197ab4b06105d.png); background-repeat: no-repeat; background-size: cover; background-position: center; overflow: hidden; display: flex; align-items: flex-start; justify-content: center;}
.player-list > li .img img {width: 100%;}
.player-list > li .info {display: flex; align-items: center; justify-content: space-between;}
.player-list > li .info > p {font-size: 1.6rem; font-weight: 600;}
.player-list > li .info > span {font-size: 1.2rem; font-weight: 600; color: var(--gray30);}

/* 선수단 > 상세 */
.player-summary {width: 100vw; height: 26.4rem; margin: -1rem -1.6rem 2rem; padding: 4rem 1.6rem; background-image: url(/assets/img/player/player-detail-bg-e80bcda90024df87d7ec285da4067433.png); background-repeat: no-repeat; background-size: cover; background-position: center; overflow: hidden; position: relative; display: flex; align-items: flex-end;}
.player-summary .img {width: 26rem; position: absolute; bottom: 0; right: 0; display: flex; align-items: flex-start; justify-content: center;}
.player-summary .img img {width: 100%;}
.player-summary .info {display: flex; flex-flow: column; row-gap: .8rem; position: relative; z-index: 1;}
.player-summary .info > span {font-size: 1.6rem; font-weight: 600; color: var(--gray30);}
.player-summary .info > p {font-size: 2.4rem; font-weight: 600;}

.player-info {display: flex; flex-flow: column; row-gap: 1.2rem;}
.player-info > li {display: flex; align-items: center; column-gap: 2rem;}
.player-info > li > p {width: 5.6rem; font-size: 1.4rem; color: var(--gray30);}
.player-info > li > span {font-size: 1.4rem; font-weight: 500;}

.player-record-table01 {position: relative;}
.player-record-table01 tr > *:nth-child(1) {position: sticky; left: 0; z-index: 1;}
.player-record-table01 tr > *:nth-child(2) {position: sticky; left: 4rem; z-index: 1;}
.player-record-table01 tr > *:nth-child(3) {position: sticky; left: 10rem; z-index: 1;}
.player-record-table01 tr > *:nth-child(3)::before {content: ''; width: 1px; height: 100%; background-color: #272727; display: block; position: absolute; top: 0; left: initial; right: 0;}
.player-record-table01 tr > *:nth-child(3)::after {content: ''; width: 1.4rem; height: 100%; background: linear-gradient(90deg, rgba(23, 23, 23, 0.55) -10%, rgba(28, 28, 28, 0.00) 100%); display: block; position: absolute; right: -1.4rem; top: 0;}
.player-record-table01 tr > *:nth-child(3) + td::before {content: none;}

.player-record-table02 {position: relative;}
.player-record-table02 tr > *:nth-child(1) {position: sticky; left: 0; z-index: 1;}
.player-record-table02 tr > *:nth-child(1)::before {content: ''; width: 1px; height: 100%; background-color: #272727; display: block; position: absolute; top: 0; left: initial; right: 0;}
.player-record-table02 tr > *:nth-child(1)::after {content: ''; width: 1.4rem; height: 100%; background: linear-gradient(90deg, rgba(23, 23, 23, 0.55) -10%, rgba(28, 28, 28, 0.00) 100%); display: block; position: absolute; right: -1.4rem; top: 0;}
.player-record-table02 tr > *:nth-child(1) + td::before {content: none;}

/* 선수단 > 유소년 */
.youth-wrap {display: flex; flex-flow: column; row-gap: 2rem;}
.youth-wrap > p {font-size: 1.4rem; color: var(--gray5); line-height: 1.6; word-break: keep-all;}
.youth-wrap > ul {background-color: var(--gray80); border-radius: .4rem; padding: 1.6rem; display: flex; flex-flow: column; row-gap: .8rem;}
.youth-wrap > ul > li {display: flex; column-gap: 2.4rem; line-height: 1.6; font-size: 1.4rem; color: var(--gray5);}
.youth-wrap > ul > li > p {font-weight: 600; width: 6.8rem;}
.youth-wrap > ul > li > span .label {display: inline-flex; margin-right: .8rem;} 
.youth-wrap > ul > li > ul {display: flex; align-items: center; column-gap: .8rem;}


.youth-swiper.swiper {width: 100%; height: fit-content;}
.youth-swiper.swiper .swiper-slide {border-radius: .4rem; overflow: hidden;}
.youth-swiper.swiper .swiper-slide img {width: 100%;}

.youth-swiper.swiper .swiper-pagination {width: fit-content; display: flex; align-items: center; column-gap: .2rem; justify-content: center; background-color: var(--black); font-size: 1.2rem; color: rgba(255, 255, 255, .4); position: relative; top: initial; left: initial; right: initial; bottom: initial; margin: .8rem auto 0;}
.youth-swiper.swiper .swiper-pagination > span {width: .8rem; text-align: center;}
.youth-swiper.swiper .swiper-pagination .swiper-pagination-current {font-weight: 500; color: var(--white);}


/* 미디어 ----------------------- */
/* 까치레터 */
.media-filter {display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.2rem;}
.media-filter > p {font-size: 1.2rem; font-weight: 600;}
.media-filter > p > span {color: var(--blue50);}
.media-filter > ul {display: flex; align-items: center; column-gap: .4rem;}
.media-filter > ul > li {display: flex; align-items: center; column-gap: .4rem;}
.media-filter > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray70);}
.media-filter > ul > li > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent; font-size: 1.2rem;}

.webtoon-summary {display: flex; flex-flow: column; row-gap: 1.6rem;}
.webtoon-summary .img {width: 100%; border-radius: .4rem; object-fit: cover; overflow: hidden;}
.webtoon-summary .img img {width: 100%;}
.webtoon-summary .desc {display: flex; flex-flow: column; row-gap: 1.2rem;}
.webtoon-summary .desc > p {font-size: 1.4rem; font-weight: 500;}
.webtoon-summary .desc > span {font-size: 1.2rem; color: var(--gray30); line-height: 1.6; word-break: keep-all;}

.webtoon-detail {display: flex; flex-flow: column; width: 100vw; margin: -1rem -1.6rem 0;}
.webtoon-detail .cont {display: flex; flex-flow: column;}
.webtoon-detail .cont img {width: 100%;}
.webtoon-detail .nav {margin-top: .8rem; background-color: var(--gray80); display: flex; align-items: center; justify-content: space-between; padding: 1.2rem 1.6rem; column-gap: 1rem;}
.webtoon-detail .nav > div {display: flex; align-items: center; column-gap: .8rem; flex: 1;}
.webtoon-detail .nav > div .img {width: 6rem; height: 6rem; border-radius: .4rem; background-repeat: no-repeat; background-size: cover; background-position: center;}
.webtoon-detail .nav > div > p {font-size: 1.4rem; font-weight: 500; flex: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 1; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.webtoon-detail .nav > button {width: fit-content; height: fit-content; padding: 0; font-size: 1.4rem; font-weight: 500; column-gap: .2rem; background-color: transparent;}
.webtoon-detail .nav > button > i {width: 2rem; height: 2rem;}

.webtoon-active {color: var(--gray60);}

.media-list02 {display: flex; flex-flow: column; row-gap: 2rem;}
.media-list02 > li {display: flex; column-gap: 1.2rem; align-items: center;}
.media-list02 > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.media-list02 > li .img {width: 15.6rem; height: 8.8rem; background-image: url(/assets/img/media/media-thumbnail01-8b881b6f4d12df25d5adf535fd07c436.png); background-repeat: no-repeat; background-size: cover; background-position: center; border-radius: .4rem;}
.media-list02 > li .desc {display: flex; flex-flow: column; row-gap: .8rem; flex: 1;}
.media-list02 > li .desc > p {font-size: 1.4rem; font-weight: 600; line-height: 1.4; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.media-list02 > li .desc > ul {display: flex; align-items: center; column-gap: .6rem;}
.media-list02 > li .desc > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.media-list02 > li .desc > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray40);}

.media-list03 {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem;}
.media-list03 > li {height: 68vw; padding: 1.6rem; position: relative; border-radius: .4rem; overflow: hidden; display: flex; align-items: flex-end; justify-content: center; background-image: url(/assets/img/media/media-thumbnail02-b0b5d42e1c73ca33cd87f8e1653eeeb8.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.media-list03 > li::before {content: ''; width: 100%; height: 100%; display: block; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(0, 0, 0, 0.75) 100%); background-blend-mode: darken; position: absolute; top: 0; left: 0;}
.media-list03 > li .desc {width: 100%; display: flex; flex-flow: column; row-gap: 1.2rem; position: relative; z-index: 1;}
.media-list03 > li .desc > p {font-size: 1.4rem; font-weight: 600; line-height: 1.4; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 2; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.media-list03 > li .desc > ul {display: flex; align-items: center; column-gap: .6rem;}
.media-list03 > li .desc > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.2rem; color: var(--gray30);}
.media-list03 > li .desc > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray40);}

.empty.media {height: calc(100dvh - 6.9rem - 2rem - 3.4rem);}

/* 팬 ----------------------- */
/* 원정신청 */
.away-img {width: 100vw; margin: 0 -1.6rem;}

/* 서포터즈 */
.supporters-list {display: flex; flex-flow: column; row-gap: 2rem;}
.supporters-list > li {display: flex; flex-flow: column; row-gap: 2rem;}
.supporters-list > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.supporters-list > li > div {display: flex; column-gap: .8rem;}
.supporters-list > li > div .img {width: 10rem; height: 10rem; border-radius: .4rem; background-repeat: no-repeat; background-size: cover; background-position: center;}
.supporters-list > li > div .desc {display: flex; flex-flow: column; row-gap: 1.2rem; flex: 1;}
.supporters-list > li > div .desc > p {font-size: 1.6rem; font-weight: 600;}
.supporters-list > li > div .desc > span {font-size: 1.2rem; color: var(--gray5); word-break: keep-all; line-height: 1.6;}
.supporters-list > li > button {height: 3.2rem; font-size: 1.4rem; font-weight: 500; background-color: var(--gray70);}

/* 응원가 */
.song-list {display: flex; flex-flow: column;}
.song-list > li {display: flex; flex-flow: column; row-gap: 2rem;}
.song-list > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.song-list > li .img {width: 100%; height: 50vw; border-radius: .4rem; background-image: url(/assets/img/media/media-thumbnail01-8b881b6f4d12df25d5adf535fd07c436.png); background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden;}
.song-list > li .img:has(i)::before {content: ''; background-color: rgba(0, 0, 0, 0.25); width: 100%; height: 100%; position: absolute; z-index: 1;}
.song-list > li .img > i {position: relative; z-index: 2;}
.song-list > li .desc {display: flex; flex-flow: column;}
.song-list > li .desc .info {display: flex; align-items: center; justify-content: space-between; margin-bottom: 2rem;}
.song-list > li .desc .info > p {font-size: 1.4rem; font-weight: 500;}
.song-list > li .desc .info > ul {display: flex; align-items: center; column-gap: 1.2rem;}
.song-list > li .desc .info > ul > li > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}
.song-list > li .desc .lyrics {display: none; width: 100%; background-color: var(--gray80); padding: 1.6rem; font-size: 1.4rem; line-height: 1.6; word-break: keep-all;}

.song-list > li.active .desc .ic-arrow-down-20 {background-image: url(/assets/img/ico/ic-arrow-up-20-bd1031963b75a94a1f14d1d72f8bb159.svg);}
.song-list > li.active .desc .lyrics {display: block;}

/* 분실물 센터 */
.lost-list {display: flex; flex-flow: column; row-gap: 2rem;}
.lost-list > li {display: flex; flex-flow: column; row-gap: 2rem;}
.lost-list > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.lost-list > li .img {width: 100%; height: 50vw; border-radius: .4rem; background-image: url(/assets/img/media/media-thumbnail01-8b881b6f4d12df25d5adf535fd07c436.png); background-repeat: no-repeat; background-size: cover; background-position: center; overflow: hidden;}
.lost-list > li > ul {display: flex; flex-flow: column;}
.lost-list > li > ul > li {display: flex; align-items: center; column-gap: 2rem;}
.lost-list > li > ul > li > p {font-size: 1.4rem; font-weight: 500; line-height: 1.8; width: 8rem;}
.lost-list > li > ul > li > span {font-size: 1.4rem; color: var(--gray5); line-height: 1.8; flex: 1;}

/* 사회공헌 ----------------------- */
/* 교육 ‧ 장학 */
.crs-banner {width: 100vw; height: 15.2rem; margin: -1rem -1.6rem 0; padding: 1rem 1.6rem; display: flex; flex-flow: column; row-gap: 1.2rem; justify-content: center; background-repeat: no-repeat; background-size: cover; background-position: center;}
.crs-banner > div {display: flex; flex-flow: column; align-items: center;}
.crs-banner > div > h2 {text-align: center; font-size: 2.4rem; font-weight: 900; text-transform: uppercase;}
.crs-banner > div > p {font-size: 1.4rem; font-weight: 500; word-break: keep-all;}
.crs-banner > p {text-align: center; font-size: 1.4rem; color: var(--gray5); text-align: center; line-height: 1.4;}

.crs-banner.banner01 {background-image: url(/assets/img/crs/crs-banner01-9c9bb0a095583416a5f30a27daf949e2.png);}
.crs-banner.banner02 {background-image: url(/assets/img/crs/crs-banner02-942ff31264fea3e9d9e4743f2074576c.png);}
.crs-banner.banner03 {background-image: url(/assets/img/crs/crs-banner03-fe9d9a6e6a1504e2709e14fd228366d7.png);}
.crs-banner.banner04 {background-image: url(/assets/img/crs/crs-banner04-094b67ef15ab480384e9450b75bbeabd.png);}

.crs-wrap {display: flex; flex-flow: column; row-gap: 2rem;}
.crs-wrap > div {display: flex; flex-flow: column; row-gap: 1.2rem;}
.crs-wrap > div > h3 {font-size: 2rem; font-weight: 600; line-height: 1.4;}
.crs-wrap > div > h3 > span {color: var(--blue50); display: block;}
.crs-wrap > div > h4 {font-size: 1.6rem; font-weight: 600;}
.crs-wrap > div > p {font-size: 1.4rem; color: var(--gray5); line-height: 1.4; word-break: keep-all;}
.crs-wrap > div > div {display: flex; flex-flow: column; row-gap: 1.2rem;}
.crs-wrap > div > div > p {font-size: 1.4rem;}
.crs-wrap > div > div > ul {background-color: var(--gray80); border-radius: .4rem; padding: 1.6rem; display: flex; flex-flow: column; row-gap: .8rem;}
.crs-wrap > div > div > ul > li {display: flex; column-gap: 2.4rem; line-height: 1.6; font-size: 1.4rem; color: var(--gray5);}
.crs-wrap > div > div > ul > li > p {font-weight: 600; width: 9.2rem;}
.crs-wrap > div > div > ul > li > span .label {display: inline-flex; margin-right: .8rem;}
.crs-wrap > img {width: 100%; border-radius: .4rem;}
.crs-wrap > button {height: 3.2rem; font-size: 1.4rem; font-weight: 500; background-color: var(--gray70);}

.partner-list {display: grid; grid-template-columns: repeat(2, 1fr); grid-gap: 2rem;}
.partner-list > li {display: flex; flex-flow: column; row-gap: 1.2rem; align-items: center;}
.partner-list > li .img {width: 100%; height: 32vw; border-radius: .4rem; background-repeat: no-repeat; background-size: cover; background-position: center;}
.partner-list > li > p {font-size: 1.6rem; font-weight: 600;}

#map {width: 100vw; height: 60vw; margin: 0 -1.6rem; background-color: var(--white);}

.map-list {width: 100vw; margin: 0 -1.6rem -4rem;}
.map-list > li .info {height: 8.4rem; padding: 0 1.6rem; display: flex; flex-flow: column; row-gap: 1.2rem; justify-content: center; background-image: url(/assets/img/ico/ic-arrow-down-20-85ce341a0a14f87c68bf437d8590ee68.svg); background-size: 2rem; background-repeat: no-repeat; background-position: center right 1.6rem; border-bottom: 1px solid var(--gray70);}
.map-list > li .info > p {font-size: 1.4rem;}
.map-list > li .info > span {font-size: 1.6rem; font-weight: 600; color: var(--blue50);}
.map-list > li .desc {display: none; padding: 2rem 1.6rem; background-color: var(--gray80); flex-flow: column; row-gap: 2rem; border-bottom: 1px solid var(--gray70);}
.map-list > li .desc > p {font-size: 1.2rem; font-weight: 600;}
.map-list > li .desc > ul {display: flex; flex-flow: column; row-gap: 2rem; position: relative;}
.map-list > li .desc > ul > li {display: flex; flex-flow: column; padding-left: 3.4rem; position: relative;}
.map-list > li .desc > ul > li > p {font-size: 1.4rem; line-height: 1.6; word-break: keep-all;}
.map-list > li .desc > ul > li > span {font-size: 1.4rem; line-height: 1.6; word-break: keep-all; color: var(--gray30);}
.map-list > li .desc > ul > li > img {width: 100%; margin-top: 1rem;}

.map-list > li .desc > ul::before {content: ''; width: 1px; height: 100%; background-color: var(--gray50); display: block; position: absolute; top: 0; left: 1.4rem;}
.map-list > li .desc > ul > li::before {content: ''; width: 2.8rem; height: 2.8rem; background-repeat: no-repeat; background-size: contain; background-position: center; position: absolute; left: 0;}
.map-list > li .desc > ul > li:nth-child(1):before {background-image: url(/assets/img/ico/ic-spot-start-0cbf08a5c15cc3f1f373fb18c6cd55c2.svg);}
.map-list > li .desc > ul > li:nth-last-child(1):before {background-image: url(/assets/img/ico/ic-spot-end-342de3c3baaf1d51251a0a836246357e.svg);}
.map-list > li .desc > ul > li:not(:nth-child(1), :nth-last-child(1))::before {width: .8rem; height: .8rem; background-image: url(/assets/img/ico/ic-spot-14579930a874c28fd1338f7df2126ba3.svg); top: .8rem; left: 1rem;}

.map-list > li.active .info {background-image: url(/assets/img/ico/ic-arrow-up-20-bd1031963b75a94a1f14d1d72f8bb159.svg);}
.map-list > li.active .desc {display: flex;}

/* 까치둥지 ----------------------- */
/* 까치둥지 > 까치둥지 소개 */
.magpie-img01 {width: 100vw; margin: -2rem -1.6rem 0;}

.apply-wrap {display: flex; flex-flow: column; row-gap: 2rem;}
.apply-wrap > img {width: 100%;}
.apply-wrap > ul {display: flex; flex-flow: column; row-gap: .6rem;}
.apply-wrap > ul > li {font-size: 1.4rem; line-height: 1.4; word-break: keep-all; display: flex; column-gap: .8rem;}
.apply-wrap > ul > li::before {content: '・';}


/* 까치둥지 > 가입 기업 소개 */
.magpie-list {display: flex; flex-flow: column; row-gap: 2rem;}
.magpie-list > li {display: flex; flex-flow: column; row-gap: 2rem;}
.magpie-list > li + li {border-top: 1px solid var(--gray70); padding-top: 2rem;}
.magpie-list > li .img {width: 100%; height: 50vw; border-radius: .4rem; background-image: url(/assets/img/media/media-thumbnail01-8b881b6f4d12df25d5adf535fd07c436.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.magpie-list > li .desc {display: flex; flex-flow: column; row-gap: 1.2rem;}
.magpie-list > li .desc > p {font-size: 2rem; font-weight: 600;}
.magpie-list > li .desc > ul {display: flex; flex-flow: column;}
.magpie-list > li .desc > ul > li {display: flex; align-items: center; column-gap: 2rem; line-height: 1.6; row-gap: .8rem;}
.magpie-list > li .desc > ul > li > p {font-size: 1.4rem; font-weight: 600; width: 5.2rem;}
.magpie-list > li .desc > ul > li > span {font-size: 1.4rem; color: var(--gray5);}
.magpie-list > li .btn {display: flex; align-items: center; column-gap: 1.2rem;}
.magpie-list > li .btn > button {height: 3.2rem; font-size: 1.4rem; font-weight: 500;}
.magpie-list > li .btn > button:nth-child(2) {background-color: var(--gray70);}

.magpie-certify {display: flex; column-gap: .4rem; justify-content: space-between;}
.magpie-certify-img {width: 2.8rem; height: 2.8rem; border: 1px solid var(--gray70); border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.magpie-certify > ul {display: flex; align-items: center; column-gap: .4rem;}
.magpie-certify > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; color: var(--gray30);}
.magpie-certify > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; color: var(--gray30);}

.magpie-certify > div > ul {display: flex; align-items: center; column-gap: .4rem;}
.magpie-certify > div > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; color: var(--gray30);}
.magpie-certify > div > ul > li {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; color: var(--gray30);}

/*.magpie-certify-detail {}*/

.magpie-certify-detail-label {width: fit-content; height: 2.5rem; padding: 0 .8rem; display: flex; align-items: center; justify-content: center; border-radius: .4rem; border: 1px solid var(--gray70); background-color: var(--gray80); font-size: 1.5rem; font-weight: 600;}
.magpie-certify-detail-label.point {background-color: var(--blue50);}

.magpie-certify-detail > p {font-size: 1.5rem}

.magpie-write {width: 100vw;
    padding: 0 1.6rem; height: 5.6rem; align-items: center; justify-content: space-between; border-bottom: 1rem solid var(--gray80);
    margin: -1rem -1.6rem 6rem;
}
.magpie-write > label > p{font-size: 1.6rem; font-weight: 600; margin-top: 1rem; margin-bottom: 1rem }
.magpie-write > input {margin-bottom: 1rem;}
.magpie-write > span {color:#FF7E1B; font-size: 1.0rem; margin-top: 1rem; margin-bottom: 2rem}

/* 예매안내 ----------------------- */
/* 예매안내 > 예매하기 */
.ticket-img01 {width: 100vw; margin: -2rem -1.6rem 0;}

/* 티켓 ----------------------- */
/* 티켓 > 좌석 시야 보기 */
.seatview-wrap {height: 39.6rem; background: #515151; display: flex; align-items: center; justify-content: center; margin-left: -1.6rem; margin-right: -1.6rem; }
.seatview-wrap .preview {width: 100%;height: 100%;position: relative;display: flex;}
.seatview-wrap .preview svg {width: 100%;height: auto;}
.seatview-wrap .preview .trigger-list{display:flex;flex-direction:column;gap:.4rem;position:absolute;right:1.6rem;bottom:1.6rem;}
.seatview-wrap .preview .trigger-btn{padding:0.5rem;width:100%;height:fit-content;background:var(--gray70);font-size:1.1rem;font-weight:500;}

.seatview-tit {display: flex; gap: .6rem; align-items: center; margin-top: 3rem; }
.seatview-tit h2 {font-size: 1.6rem; font-weight: 600; }
.seatview-tit span {color: var(--gray20); font-size: 1.2rem; font-weight: 500; }
.seat-view.seatview-detail li button {background: var(--gray70); font-size: 1.1rem; font-weight: 500; }
.seat-view.seatview-detail li button.active {border: 1px solid var(--blue50); }

.seat-view.seatview-detail li.empty-wrap{grid-column:1/-1;background-color: var(--gray80);width: calc(100% + 3.2rem);margin-left: -1.6rem;margin-right: -1.6rem;}
.seat-view.seatview-detail li.empty-wrap img{width: 6rem;}
.seat-view.seatview-detail li.empty-wrap p{font-size: 1.8rem;font-weight: 600;}
.seat-view.seatview-detail li.empty-wrap p{font-size: 1.8rem;font-weight: 600;}

/* 홈구장 > 좌석 후기 */
.review-swiper.swiper {width: 100%; height: fit-content;}
.review-swiper.swiper .swiper-slide{border-radius: .4rem;overflow: hidden;}
.review-swiper.swiper .swiper-slide img{width: 100%;}
.review-swiper.swiper .swiper-pagination {position: relative; top: initial; bottom: initial; left: initial; right: initial; margin-top: 1rem; display: flex; align-items: center; column-gap: .8rem; justify-content: center;}
.review-swiper.swiper .swiper-pagination .swiper-pagination-bullet {width: .6rem; height: .6rem; opacity: 1; border-radius: 100%; background-color: rgba(255,255,255,0.2); margin: 0;}
.review-swiper.swiper .swiper-pagination .swiper-pagination-bullet-active {background-color: var(--white);}

.cont-box.line + .cont-box.seatview-cont { margin-top: 1.6rem; }
.seatview-review-wrap { display: flex; flex-flow: column; row-gap: 2rem; }
.seatview-info { font-size: 2rem; font-weight: 600; text-align: center; margin-top: 1.4rem; }
.seatview-review-wrap .title { justify-content: flex-start; gap: 1rem; margin-bottom: .6rem; }
.seatview-review-wrap .title span { color: var(--gray20); font-size: 2rem; font-weight: 600; }

.seatview-review-wrap .btn-wrap { margin-top: 0; }
.seatview-review-wrap .btn-wrap ul { display: flex; gap: .7rem; }
.seatview-review-wrap .btn-wrap button { width: fit-content; height: fit-content; font-size: 1rem; padding: .4rem .8rem; border-radius: 4px; border: 1px solid var(--gray70); background: var(--gray80); gap: .4rem; }
.seatview-review-wrap .btn-wrap button.active { border: 1px solid var(--blue50); }
.seatview-review-wrap .btn-wrap > button { margin-left: auto; }

.review-user { display: flex; }
.review-user .btn-like { width: fit-content; height: fit-content; padding: 0; background: none; margin-left: auto; font-size: 1.1rem; line-height: 1.8; letter-spacing: -0.275px; }
.review-user .btn-like i { width: 2rem; height: 2rem; }

.user-info { display: flex; gap: 1rem; align-items: center; }
.user-info .img { width: 2.8rem; height: 2.8rem; border: 1px solid var(--gray70); border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: center; }
.user-info .info { display: flex; gap: .4rem; align-items: center; }
.user-info .info p { font-size: 1.2rem; color: var(--gray30); }
.user-info .info span { position: relative; display: flex; align-items: center; gap: .4rem; font-size: 1.2rem; color: var(--gray30); }
.user-info .info span:before { content: ""; display: block; width: .1rem; height: 1rem; background: var(--gray50); }

.seatview-review-list { display: flex; flex-direction: column; gap: 2rem; }
.seatview-review-list > li { padding-bottom: 2rem; border-bottom: 1px solid var(--gray70); }

.review-img-list {display: flex; gap: 1.2rem; overflow: auto; margin-left: -1.6rem; margin-right: -1.6rem; padding-left: 1.6rem; padding-right: 1.6rem; }
.review-img-list > li { width: 13.2rem; aspect-ratio: 1/1; border-radius: 10px; overflow: hidden; flex-shrink: 0; }
.review-img-list > li img { width: 100%; height: 100%; object-fit: cover; }
.review-item {position: relative;display: flex; flex-direction: column; gap: 1.6rem; }
.review-item > strong {padding-right: 2.2rem;font-size: 1.6rem; font-weight: 600; margin-top: .4rem; }
.review-item > p { font-size: 1.4rem; color: var(--gray10); line-height: 1.6; margin-top: .4rem; }
.review-item .more {position: absolute;top: 4.6rem;right: 0;}
.review-item .more > button {width: fit-content; height: fit-content; padding: 0; background-color: transparent;}
.review-item .more > ul {display: flex; align-items: center; border: 1px solid var(--gray70); background-color: var(--gray80); border-radius: .4rem; position: absolute; top: 2rem; right: 0; z-index: 10;}
.review-item .more > ul > li {position: relative; display: flex; align-items: center;}
.review-item .more > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray60); position: absolute; left: 0;}
.review-item .more > ul > li > button {width: 4.5rem; height: 3.6rem; padding: 0; font-size: 1.2rem; font-weight: 500; color: var(--white); background-color: transparent;}

.seatview-cont .floating-btn { z-index: 9; }

.bottom-fixed .review-item { gap: 1rem; }
.bottom-fixed .review-item strong { padding-left: 3.8rem; margin-top: 0; }
.review-detail-wrap { height: calc(100dvh - 4.9rem); margin-top: -1rem; margin-left: -1.6rem; margin-right: -1.6rem; padding-bottom: 4.9rem; display: flex; flex-flow: column; align-items: center; justify-content: center; }
.review-img-swiper.swiper { width: 100%; height: 100%; }
.review-img-swiper.swiper .swiper-slide { height: 100%; }
.review-img-swiper.swiper .swiper-slide img { width: 100%; height: 100%; object-fit: contain; }
.review-img-swiper.swiper .swiper-pagination { position: fixed; top: 1.6rem; left: auto; right: 1.6rem; width: fit-content; font-size: 1.4rem; }
.review-img-swiper.swiper .swiper-pagination .swiper-pagination-total { color: var(--gray30); }

.pop .bottom-fixed .seat-choice { display: flex; flex-direction: column; gap: 2rem; background: var(--gray80); border-radius: 20px 20px 0 0; padding-top: 3rem; }
.pop .bottom-fixed .seat-choice strong { font-size: 1.6rem; }
.pop .bottom-fixed .seat-choice button { margin-top: 1rem; }

.select-row { display: flex; align-items: center; gap: .6rem; }
.select-row select { background-size: 1.8rem; }
.select-row span { font-size: 1.2rem; }

/* 홈구장 > 좌석 후기 > 후기 작성 */
.seat-choice select { background-size: 1.8rem; }
.write-wrap { display: flex; flex-direction: column; gap: 4rem; }
.write-wrap .seat-choic-sub { display: flex; flex-direction: column; gap: 1rem; }
.star-choice { text-align: center; display: flex; flex-direction: column; gap: 1rem; }
.star-choice p { font-size: 1.6rem; font-weight: 600; }
.star-rating { display: flex; flex-direction: row-reverse; justify-content: center; gap: 0.5rem; }
.star-rating label { color: var(--gray70); cursor: pointer; }
.star-rating input[type="radio"] + label::before { content: ""; display: block; width: 3.2rem; height: 3.2rem; background-image: url(/assets/img/ico/ic-star-25d0a39321050c1f7471fdd4b2746c94.svg); background-repeat: no-repeat; background-size: contain; }
.star-rating input:checked ~ label:before { background-image: url(/assets/img/ico/ic-star-ov-1ef1d5021d9fd8039cc7aec6a5f23af4.svg); }
.write-wrap.review .write > textarea { height: 15.9rem; }
.write-wrap.review .photo-wrap > div > .file { width: fit-content; margin-left: auto; }
.write-wrap.review .photo-wrap > ul > li { order: 1; background-image: url(/assets/img/ticket/img-photo-default-d2c6d1c8d0866ea618a3b5d70a770a94.png); }
.write-wrap.review .photo-wrap > ul > li:first-child { order: 2; }

/* 멤버십 ----------------------- */
/* 멤버십 */
.membership-img01 {width: 100vw; margin: -2rem -1.6rem 0;}

.bottom-fixed:has(div > select)::after {height: 12.2rem;}
.bottom-fixed > div > select {margin-bottom: 2rem;}

/* 알림 ----------------------- */
/* 알림 */
.notify-list {display: flex; flex-flow: column;}
.notify-list > li {border-bottom: 1px solid var(--gray70); padding: 2rem 0; display: flex; column-gap: 1.2rem;}
.notify-list > li .img {width: 3.2rem; height: 3.2rem; border-radius: 100%; background-color: var(--gray50); background-repeat: no-repeat; background-size: cover; background-position: center;}
.notify-list > li .desc {flex: 1; display: flex; flex-flow: column; row-gap: .8rem;}
.notify-list > li .desc > p {font-size: 1.4rem; font-weight: 600; line-height: 1.4; word-break: keep-all;}
.notify-list > li .desc > span {font-size: 1.2rem; color: var(--gray30); line-height: 1.4; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; line-clamp: 3; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
.notify-list > li.new .desc > p::after {content: ''; width: .4rem; height: .4rem; border-radius: 100%; background-color: var(--blue50); display: inline-block; margin-left: .2rem; position: relative; top: -.8rem;}

/* 마이페이지 ----------------------- */
/* 마이페이지 */
.mypage-summary {display: flex; flex-flow: column; row-gap: 1.2rem;}
.mypage-summary .profile {margin-bottom: .8rem; display: flex; align-items: center; column-gap: 1.2rem;}
.mypage-summary .profile .img {width: 5.6rem; height: 5.6rem; border-radius: 100%; background-image: url(/assets/img/mypage/profile-img01-7435f3e514531e9dda7a25f15a4e4d61.png); background-repeat: no-repeat; background-size: cover; background-position: center;}
.mypage-summary .profile .img.female {background-image: url(/assets/img/mypage/profile-female-cc72c5405814be4d62bc6d2bb9ce51a2.png);}
.mypage-summary .profile .img.male {background-image: url(/assets/img/mypage/profile-male-bdf01c083521f2f33ee3d754154cb27a.png);}
.mypage-summary .profile .desc {display: flex; flex-flow: column; row-gap: .6rem;}
.mypage-summary .profile .desc > p {font-size: 1.8rem; display: flex; align-items: center; column-gap: .6rem;}
.mypage-summary .profile .desc > p > span {font-weight: 700;}
.mypage-summary .profile .desc > p > i {margin-left: -.4rem;}
.mypage-summary .profile .desc > span {font-size: 1.2rem; color: var(--gray50);}
.mypage-summary > p {width: 100%; height: 3.6rem; text-align: center; font-size: 1.2rem; font-weight: 500; background-color: var(--gray70); border-radius: .4rem; display: flex; align-items: center; justify-content: center;}
.mypage-summary > p + span {padding-bottom: .8rem;}
.mypage-summary > span {text-align: center; font-size: 1.2rem; color: var(--gray30); line-height: 1.4; font-weight: 500; display: block;}
.mypage-summary > button {height: 3.6rem; font-size: 1.2rem; font-weight: 500; background-color: var(--gray70);}

.mypage-summary .barcode {background-color: var(--gray80); border: 1px solid var(--gray70); border-radius: .4rem;}
.mypage-summary .barcode .grade {border-bottom: 1px solid var(--gray70); display: flex; align-items: center; justify-content: space-between; column-gap: .2rem; padding: 0 1.6rem; height: 5.4rem;}
.mypage-summary .barcode .grade > div {display: flex; align-items: center; column-gap: .8rem;}
.mypage-summary .barcode .grade > div > p {font-size: 1.4rem; font-weight: 600;}
.mypage-summary .barcode .grade > button {width: fit-content; height: 2.4rem; padding: 0 .4rem; font-size: 1.2rem; font-weight: 500; background-color: var(--gray70); border-color: var(--gray60);} 
.mypage-summary .barcode .grade > button:disabled .ic-expand {background-image: url(/assets/img/ico/ic-expand-dis-b07570d803007fdd28877e358fdb5678.svg);}
.mypage-summary .barcode .desc {display: flex; flex-flow: column; row-gap: .8rem; align-items: center; padding: 2rem 0;}
.mypage-summary .barcode .desc > img {height: 4.8rem;}
.mypage-summary .barcode .desc > p {font-size: 1.2rem; font-weight: 500; text-align: center; line-height: 1.4;}

/* 2026 이후 삭제 */
.mypage-summary .score {display: flex; flex-flow: column; row-gap: .8rem;}
.mypage-summary .score .graph {background-color: var(--gray80); border: 1px solid var(--gray70); border-radius: .4rem; padding: 2rem 1.6rem; display: flex; flex-flow: column; row-gap: .8rem;}
.mypage-summary .score .graph > p {font-size: 1.2rem; font-weight: 500; margin-bottom: .4rem;}
.mypage-summary .score .graph > div {width: 100%; height: .4rem; border-radius: .4rem; background-color: var(--gray60); display: flex; align-items: center; justify-content: flex-start;}
.mypage-summary .score .graph > div > span {height: .4rem; display: block; border-radius: .4rem; background-color: var(--blue50);}
.mypage-summary .score .graph > ul {display: flex; align-items: center; column-gap: .2rem; width: fit-content; margin-left: auto;}
.mypage-summary .score .graph > ul > li {display: flex; align-items: center; column-gap: .2rem; font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.mypage-summary .score .graph > ul > li + li::before {content: '/';}
.mypage-summary .score .graph > ul > li > p {font-weight: 600; color: var(--blue50);}

.mypage-summary .score .guide {position: relative;}
.mypage-summary .score .guide > p {display: flex; align-items: center; column-gap: .4rem; font-size: 1.2rem; font-weight: 600; color: var(--gray30); margin-left: auto; width: fit-content;}
.mypage-summary .score .guide > div {background-color: var(--gray70); border-radius: .4rem; padding: 1.6rem; display: none; flex-flow: column; row-gap: .8rem; align-items: center; width: fit-content; position: absolute; top: 2.6rem; right: 4.2rem;}
.mypage-summary .score .guide > div::before {content: ''; width: 1.4rem; height: 1.4rem; background-image: url(/assets/img/ico/ic-bubble-4b235f9aa65847755f03c1ac176bf2b2.svg); background-repeat: no-repeat; background-size: cover; background-position: center top; position: absolute; top: -.8rem; right: 4rem;}
.mypage-summary .score .guide > div > p {font-size: 1.4rem; font-weight: 600;}
.mypage-summary .score .guide > div > ul {display: flex; flex-flow: column; align-items: center;}
.mypage-summary .score .guide > div > ul > li {font-size: 1.2rem; line-height: 1.6;}
.mypage-summary .score .guide > div > ul > li > span {font-weight: 600;}
.mypage-summary .score .guide > div.active {display: flex;}
/* //2026 이후 삭제 */
.mypage-summary .score-2026 {background-color: var(--gray80); border: 1px solid var(--gray70); border-radius: .4rem;}
.mypage-summary .score-2026 .title {border-bottom: 1px solid var(--gray70); display: flex; align-items: center; justify-content: flex-start; column-gap: .4rem; padding: 0 1.6rem; height: 5.4rem;}
.mypage-summary .score-2026 .title h3{font-size: 1.4rem;font-weight: 600;}
.mypage-summary .score-2026 .guide {position: relative;}
.mypage-summary .score-2026 .desc {display: flex; flex-flow: column; row-gap: .8rem; align-items: center; padding: 0 1.6rem 2rem;}

.mypage-summary .score-2026 .guide > div.tooltip-info {background-color: var(--gray70); border-radius: .4rem; padding: 1.6rem; display: none; flex-flow: column; row-gap: 1.8rem; align-items: center; width: fit-content; position: absolute; left: -13rem; top:2.6rem;}
.mypage-summary .score-2026 .guide > div.tooltip-info::before {content: ''; width: 1.4rem; height: 1.4rem; background-image: url(/assets/img/ico/ic-bubble-4b235f9aa65847755f03c1ac176bf2b2.svg); background-repeat: no-repeat; background-size: cover; background-position: center top; position: absolute; top: -.8rem; left: 13rem;}
.mypage-summary .score-2026 .guide > div.tooltip-info.active {display: flex;}

.tooltip-info p { color: #fff; font-size: 1.4rem; font-weight: 600; text-align: center; }
.tooltip-info .table-wrap { width: 31.1rem; }
.tooltip-info .table-wrap thead th { background: #323232; color: #fff; font-size: 1.2rem; line-height: 1; font-weight: 400; text-align: center; height: 3.2rem;border-bottom: none; }
.tooltip-info .table-wrap tbody td { height: 4rem; color: #fff; font-size: 1.2rem; line-height: 1; font-weight: 400; text-align: center; background-color: #1A1A1A; border-bottom: .2rem solid #262626; }
.tooltip-info .table-wrap tbody td span { font-size: 1rem; line-height: 1; display: block; margin-top: .2rem; }
.score-grid { display: flex; justify-content: center; gap: 1rem; }
.score-grid dl { margin: 0; }
.score-grid dt { font-size: 1.2rem; margin-bottom: 0.2rem; font-weight: 400; }
.score-grid dd { font-size: 1.2rem; margin: 0; }

.record-list {width:100%;display: flex; flex-direction: column; justify-content: space-between; gap: 1.3rem; }
.record-list li { display: flex; align-items: center; }
.record-list li strong { color: var(--white); font-size: 1.2rem; line-height: 1; font-weight: 500; }
.record-list .record { margin-left: auto; color: var(--white); display: flex; gap: .2rem; font-size: 1.2rem; line-height: 1; align-items: center;font-weight: 700;}
.record-list .record span { display: flex; font-size: 1rem; line-height: 1;font-weight: 500;}
.record-list .record .num { font-size: 1.8rem; line-height: 1; margin-left: .5rem; }


/* //2026 이후 삭제 */
.mypage-summary .score-2026 {background-color: var(--gray80); border: 1px solid var(--gray70); border-radius: .4rem;}
.mypage-summary .score-2026 .title {border-bottom: 1px solid var(--gray70); display: flex; align-items: center; justify-content: flex-start; column-gap: .4rem; padding: 0 1.6rem; height: 5.4rem;}
.mypage-summary .score-2026 .title h3{font-size: 1.4rem;font-weight: 600;}
.mypage-summary .score-2026 .guide {position: relative;}
.mypage-summary .score-2026 .desc {display: flex; flex-flow: column; row-gap: .8rem; align-items: center; padding: 0 1.6rem 2rem;}

.mypage-summary .score-2026 .guide > div.tooltip-info {background-color: var(--gray70); border-radius: .4rem; padding: 1.6rem; display: none; flex-flow: column; row-gap: 1.8rem; align-items: center; width: fit-content; position: absolute; left: -13rem; top:2.6rem;}
.mypage-summary .score-2026 .guide > div.tooltip-info::before {content: ''; width: 1.4rem; height: 1.4rem; background-image: url(/assets/img/ico/ic-bubble-4b235f9aa65847755f03c1ac176bf2b2.svg); background-repeat: no-repeat; background-size: cover; background-position: center top; position: absolute; top: -.8rem; left: 13rem;}
.mypage-summary .score-2026 .guide > div.tooltip-info.active {display: flex;}

.tooltip-info p { color: #fff; font-size: 1.4rem; font-weight: 600; text-align: center; }
.tooltip-info .table-wrap { width: 31.1rem; }
.tooltip-info .table-wrap thead th { background: #323232; color: #fff; font-size: 1.2rem; line-height: 1; font-weight: 400; text-align: center; height: 3.2rem;border-bottom: none; }
.tooltip-info .table-wrap tbody td { height: 4rem; color: #fff; font-size: 1.2rem; line-height: 1; font-weight: 400; text-align: center; background-color: #1A1A1A; border-bottom: .2rem solid #262626; }
.tooltip-info .table-wrap tbody td span { font-size: 1rem; line-height: 1; display: block; margin-top: .2rem; }
.score-grid { display: flex; justify-content: center; gap: 1rem; }
.score-grid dl { margin: 0; }
.score-grid dt { font-size: 1.2rem; margin-bottom: 0.2rem; font-weight: 400; }
.score-grid dd { font-size: 1.2rem; margin: 0; }

.record-list {width:100%;display: flex; flex-direction: column; justify-content: space-between; gap: 1.3rem; }
.record-list li { display: flex; align-items: center; }
.record-list li strong { color: var(--white); font-size: 1.2rem; line-height: 1; font-weight: 500; }
.record-list .record { margin-left: auto; color: var(--white); display: flex; gap: .2rem; font-size: 1.2rem; line-height: 1; align-items: center;font-weight: 700;}
.record-list .record span { display: flex; font-size: 1rem; line-height: 1;font-weight: 500;}
.record-list .record .num { font-size: 1.8rem; line-height: 1; margin-left: .5rem; }

.mypage-summary.basic > p {background-color: var(--blue10); color: var(--blue50);}
.mypage-summary.vip > p {background-color: var(--point4); color: var(--point5);}

.quick-list {display: flex; flex-flow: column; row-gap: .8rem;}
.quick-list > li > a {font-size: 1.6rem; font-weight: 600; display: flex; align-items: center; column-gap: .8rem; background-color: var(--gray80); border-radius: .4rem; height: 6rem; padding: 0 1.6rem; background-image: url(/assets/img/ico/ic-arrow-right-20-606012fd7d7b912528a0082a68023ebc.svg); background-repeat: no-repeat; background-size: 2rem; background-position: center right 1.6rem;}

/* 마이페이지 > 바코드 확대 */
.barcode-wrap {width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; z-index: 1000;}
/* perspective-origin: 50% 0%; */
.barcode-wrap > div {display: flex; flex-flow: column; row-gap: 2rem; justify-content: center; align-items: center; transform: rotate(90deg);}
.barcode-wrap > div > p {font-size: 3.2rem; font-weight: 500;}
.barcode-wrap > div > img {height: 8.8rem;}
.barcode-wrap > div > span {font-size: 2rem;}

/* 마이페이지 > 멤버십 티켓 등록 */
.mem-ticket-rotate {position: relative; width: 22rem; height: 36.4rem; margin: 0 auto; perspective: 900px; overflow: hidden; border-radius: .4rem;}
.mem-ticket-rotate .ticket {position: absolute; transition: transform .3s ease; z-index: 1; width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center;  border: 1px solid var(--gray70);}
.mem-ticket-rotate .ticket.back {z-index: 0; padding: 0!important;}

.mem-ticket-rotate.active .ticket {transform: rotateY(-180deg); transition: transform 0.3s ease; z-index: 0;}
.mem-ticket-rotate.active .ticket.back {z-index: 1; transform: rotateY(-180deg) scaleX(-1);}

.mem-ticket-swiper.swiper {width: 100%; height: fit-content;}
.mem-ticket-swiper.swiper .swiper-slide {display: flex; flex-flow: column; row-gap: 1.2rem; align-items: center;}
.mem-ticket-swiper.swiper .swiper-slide > ul {display: flex; align-items: center; column-gap: 1.2rem;}
.mem-ticket-swiper.swiper .swiper-slide > ul > li {font-size: 1.2rem; color: var(--gray30);}
.mem-ticket-swiper.swiper .swiper-slide > ul > li.active {font-weight: 600; color: var(--blue50);}

.mem-ticket-swiper.swiper .swiper-button-prev::after,
.mem-ticket-swiper.swiper .swiper-button-next::after {content: none;}
.mem-ticket-swiper.swiper .swiper-button-prev {position: absolute; top: 16rem; bottom: initial; left: 0; right: initial; width: fit-content; height: fit-content; margin: 0;}
.mem-ticket-swiper.swiper .swiper-button-next {position: absolute; top: 16rem; bottom: initial; left: initial; right: 0; width: fit-content; height: fit-content; margin: 0;}
.mem-ticket-swiper.swiper .swiper-button-prev::before {content: ''; width: 4.6rem; height: 4.6rem; background-image: url(/assets/img/ico/ic-swiper-prev-5ea7d1a22a65a16bc35b8834a39d511a.svg);} 
.mem-ticket-swiper.swiper .swiper-button-next::before {content: ''; width: 4.6rem; height: 4.6rem; background-image: url(/assets/img/ico/ic-swiper-next-04d40d8a90196b5f14d2291bd8fa6a0b.svg);} 

.mem-ticket-swiper.swiper .swiper-pagination {position: relative; top: initial; bottom: initial; left: initial; right: initial; margin-top: 2rem; display: flex; align-items: center; column-gap: .8rem; justify-content: center;}
.mem-ticket-swiper.swiper .swiper-pagination .swiper-pagination-bullet {width: .6rem; height: .6rem; opacity: 1; border-radius: 100%; background-color: var(--gray70); margin: 0;}
.mem-ticket-swiper.swiper .swiper-pagination .swiper-pagination-bullet-active {background-color: var(--white);}

.ticket-input {display: flex; flex-flow: column; row-gap: .8rem;}
.ticket-input > li {font-size: 1.2rem; color: var(--gray30);}
.ticket-input > li:last-child {margin-top: .4rem;}

/* 마이페이지 > 설정 */
.setting-list {display: flex; flex-flow: column;}
.setting-list > li {height: 4.8rem; display: flex; align-items: center; justify-content: space-between;}
.setting-list > li + li {border-top: 1px solid var(--gray70);}
.setting-list > li > p {font-size: 1.4rem; font-weight: 500;}
.setting-list > li > div {display: flex; align-items: center; column-gap: 1.2rem; font-size: 1.4rem; font-weight: 500;}
.setting-list > li > div > button {width: 7.2rem; height: 3.2rem; background-color: var(--gray70); padding: 0; font-size: 1.4rem; font-weight: 500;}
.setting-list > li > span {flex: 1; text-align: center; font-size: 1.2rem; font-weight: 500; color: var(--gray30); margin-top: 3.2rem;}
.setting-list > li > span > a {text-decoration: underline; color: var(--gray5); font-weight: 600;}

/* 마이페이지 > 회원탈퇴 */
.withdrawal-wrap .title > h2 {font-weight: 500;}
.withdrawal-wrap > p {font-size: 1.2rem; line-height: 1.6; color: var(--gray30);}

/* 마이페이지 > 체크인 */
.checkin-info dd,.checkin-info dt{font-weight:500;color:var(--white);line-height:1.5}
.checkin-info{display:flex;flex-direction:column;gap:2rem}
.checkin-info .img{display:flex;align-items:center;justify-content:center;height:26rem;border-radius:4px;border:1px solid var(--gray70);background:var(--gray80)}
.checkin-info .img img{width:21.1rem}
.checkin-info dt{font-size:1.6rem}
.checkin-info dd{font-size:1.4rem;padding-left:1.8rem;word-break:keep-all;position:relative}
.checkin-info dd:before{content:"";display:block;width:.2rem;height:.2rem;border-radius:100%;background:var(--white);position:absolute;top:.9rem;left:.9rem}

.checkin-select{background-size:20px;background-image:url(/assets/img/ico/ic-arrow-drop-20-91ab2c6181c4ee102ec1c2262243e200.svg)}
.win-rate{margin:2.1rem auto 0;display:flex;gap:1rem;justify-content:center;align-items:center;height:4.8rem;max-width:23.9rem;border-radius:4px;color:var(--white);background:var(--blue50)}
.win-rate p{font-size:1.6rem;font-weight:600}
.win-rate strong{align-items:flex-end;display:flex;gap:.2rem;font-size:1.2rem;font-weight:700}
.win-rate strong span{font-weight:700;font-size:2rem}

.checkin-desc {text-align: center; font-size: 2rem; font-weight: 600; color: var(--white); line-height: 1.4; padding-top: 4rem;}
.checkin-desc > span {color: var(--blue50);}

.checkin-wrap {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 2rem;}
.checkin-wrap > li {display: flex; flex-flow: column; align-items: center; row-gap: .2rem;}
.checkin-wrap > li > div {display: flex; flex-flow: column; align-items: center; row-gap: .2rem; height: 2.8rem; justify-content: center;}
.checkin-wrap > li > div > span {font-size: 1.2rem; font-weight: 500; color: var(--gray30);}
.checkin-wrap > li > div > p {font-size: 1.4rem; font-weight: 500; color: var(--gray40);}

.checkin-wrap > li.on > i {background-image: url(/assets/img/ico/ic-chkin-ov-0d19c6afead5a5c82313fedca6199431.svg);}
.checkin-wrap > li.on > div > p {color: var(--white);}

.checkin-list {display: flex; flex-flow: column; row-gap: 2rem;}
.checkin-match {display: flex; flex-flow: column; row-gap: 2rem; border: 1px solid var(--gray70); background-color: var(--gray80); border-radius: .4rem; padding: 1.6rem;}
.checkin-match .info {display: flex; align-items: center; column-gap: 1rem; justify-content: center; margin-bottom: .8rem;}
.checkin-match .info > ul {display: flex; align-items: center; column-gap: .6rem;}
.checkin-match .info > ul > li {display: flex; align-items: center; column-gap: .6rem; font-size: 1.4rem; font-weight: 500;}
.checkin-match .info > ul > li + li::before {content: ''; width: 1px; height: 1rem; background-color: var(--gray5);}
.checkin-match .btn {border-top: 1px dashed rgba(255,255,255,.3); padding-top: 2rem; display: flex; align-items: center; justify-content: center; column-gap: .8rem;}
.checkin-match .btn > button {height: 3.2rem; font-size: 1.4rem; width: 100%; background-color: var(--blue50);}
.checkin-match .btn > button:disabled {color: var(--white)!important; background-color: var(--gray40)!important;}

.event-tit {display: flex; flex-direction: column; gap: 1.2rem; color: var(--white); text-align: center; margin-top: 4rem; }
.event-tit h2 {font-size: 2.4rem; font-weight: 600; line-height: 1; }
.event-tit p {color:var(--gray10);font-size: 1.4rem;line-height:1.3;}
.event-tit .logo{width: fit-content;height: 3rem;margin: 0 auto;}
.event-tit span{width: 6.1rem;height: 1.1rem;margin: 0 auto;}
.event-tit span img{width:100%}
.checkin-event-detail:nth-child(2) .event-tit p{color: var(--white);}

.giveaway-list {margin-top: 2rem; display: flex;justify-content: center;flex-wrap: wrap;gap:2rem 1.4rem;}
.giveaway-list dt{width: 100%;font-size: 1.4rem; font-weight: 500; }
.giveaway-list dt.blind{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}
.giveaway-list dd {flex:0 0 calc(50% - 1.4rem / 2);text-align: center;display: flex; flex-direction: column; gap: 1rem;}
.giveaway-list dd:only-of-type{flex:0 0 100%;}
.giveaway-list dd:first-of-type:nth-last-of-type(2n+1)~dd:nth-last-of-type(3),
.giveaway-list dd:first-of-type:nth-last-of-type(2n+1)~dd:nth-last-of-type(3)~dd{flex:0 0 calc(100% / 3 - 1.4rem * 2 / 3);}
.giveaway-list dd:only-of-type .img{width:16.2rem;}
.giveaway-list dd .img {margin: 0 auto;}
.giveaway-list dd .img img {width: 100%;}
.giveaway-list dd p {font-size: 1.4rem; line-height: 1.3; font-weight: 400;word-break:keep-all}
.giveaway-list dd p strong{font-weight: 600;}
.giveaway-list dd:first-of-type:nth-last-of-type(2n+1) p~dd:nth-last-of-type(3) p,
.giveaway-list dd:first-of-type:nth-last-of-type(2n+1) p~dd:nth-last-of-type(3)~dd p{font-size: 1.2rem;line-height: 1.2em;}
.giveaway-list dd:first-of-type:nth-last-of-type(2n+1) p span~dd:nth-last-of-type(3) p span,
.giveaway-list dd:first-of-type:nth-last-of-type(2n+1) p span~dd:nth-last-of-type(3)~dd p span{display: block;}

.empty.checkin {margin-top: 4rem;}

.checkin-event .btn{margin-top: 1.6rem;}

.event-info {margin-top: 2rem;display: flex; flex-direction: column; gap: 2rem; padding: 2rem 1.6rem; background: var(--gray80); }
.event-info dl {display: flex; flex-direction: column; gap: 1rem; }
.event-info dl dt {font-size: 1.2rem; line-height: 1; font-weight: 700; }
.event-info dl dd {font-size: 1.2rem; line-height: 1.4; color: var(--gray30); padding-left: 1.8rem; position: relative; }
.event-info dl dd:before{content:"";display:block;width:.4rem;height:.4rem;border-radius:100%;background:var(--gray30);position:absolute;top:.6rem;left:.6rem}
.event-info .add-info{font-size: 1.2rem;}

.checkin-event-detail .btn{margin-top: 9.8rem;}
.checkin-event .bottom-fixed > div{border-top: 1rem solid var(--gray80);padding-top: 1.6rem;}
.checkin-event .bottom-fixed::after{height: calc(1rem + 4.8rem + 6rem);margin-top: 5.6rem;}
.checkin-event input[type="checkbox"] + label > p{font-size: 1.2rem;}

/* 마이페이지 > 체크인 > QR */
.checkin-qr{height: calc(100vh - 18.2rem);}
.checkin-qr .qr-wrap {position: relative;display: flex;flex-direction: column;align-items: center;justify-content: center;overflow: hidden;height: 100%;}
.checkin-qr .qr-detail {position: absolute;top: 0; left: 0; right: 0; bottom: 0;display: flex;align-items: center;justify-content: center;z-index: 1;}
.checkin-qr .qr-frame {position: relative;width: 18rem;height: 18rem;box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.6);=background: transparent;}
.checkin-qr .guide-text {position: relative;z-index: 2;margin-top: 24.4rem;color: var(--white);text-align: center;font-size: 1.4rem;line-height: 1.5;}
.checkin-qr .focus-box{content: "";position: absolute;width: 2.5rem;height: 2.5rem;border: .4rem solid var(--white);}
.checkin-qr .focus-box:nth-child(1){top: 0;left: 0;border-right: none;border-bottom: none;}
.checkin-qr .focus-box:nth-child(2){top: 0;right: 0;border-left: none;border-bottom: none;}
.checkin-qr .focus-box:nth-child(3){bottom: 0;left: 0;border-right: none;border-top: none;}
.checkin-qr .focus-box:nth-child(4){bottom: 0;right: 0;border-left: none;border-top: none;}
.qr-info{font-size: 1.4rem;font-weight: 500;line-height: 1.4;margin-top: 3.1rem;margin-bottom: 2rem;text-align: center}
.checkin-input {display: flex; align-items: center; column-gap: .8rem;}
.checkin-input input {background-color: var(--gray70); border-color: var(--gray60);}
.checkin-input button {width: 8rem; height: 4.4rem; font-size: 1.4rem;}

/* 마이페이지 > 체크인 > 이벤트 당첨 */
.draw-tit {display: flex; flex-direction: column; gap: 2rem;}
.draw-tit .draw-txt{display: flex; flex-direction: column; gap: 2rem;}
.draw-tit .img {width: 8.1rem;margin: 1rem auto 0;}
.draw-tit .img img {width: 100%; }
.draw-tit h3{ font-size: 2rem; line-height: 1.4; font-weight: 800;text-align: center}
.draw-tit h3 strong {color: var(--blue50);font-weight: 800;}
.draw-tit button { width: 14.5rem; border-radius: 50px; margin: 0 auto; font-size: 1.3rem; font-weight: 500; }

.draw-list {display: grid; grid-template-columns: repeat(1, 1fr); gap:1.2rem;margin-bottom: 1.5rem;}
.draw-list dt { font-size: 1.4rem; font-weight: 500; }
.draw-list dd {text-align: center; padding: 1.4rem; display: flex; flex-direction: column; gap: 2.3rem; border-radius: 4px; background: var(--gray80); border: 1px solid var(--gray70); }
.draw-list dd p {margin-top: 1rem;font-size: 1.4rem; line-height: 1; font-weight: 500; }

.prizes-spec .img {width: 6.2rem;margin: 1.2rem auto 0;}
.prizes-spec .img img {width: 100%;}
.prizes-spec strong{font-size: 2rem;line-height: 1;}

.prizes-list { display: flex; flex-direction: column; gap: .4rem; }
.prizes-list li { padding: .8rem; border-radius: 4px; border: 1px solid var(--gray70); background: var(--black); font-size: 1.4rem; line-height: 1; font-weight: 500; }

.answer-img > p > img {width: 80vw!important; margin: 0 -1.6rem!important;}

/* 매치 토크 */
.match-talk-wrap { display: flex; flex-direction: column; gap: 3rem;padding: 4rem 0;}
.match-talk:not(.talk-my) { padding-left: 4rem; display: flex; gap: .6rem; flex-direction: column; }
.match-talk .user-info { position: relative; }
.match-talk .user-info .img { width: 2.8rem; height: 2.8rem; border: 1px solid var(--gray70); border-radius: 100%; background-image: url(/assets/img/player/thumbnail-img01-7940f82665200da12b11fa69a644de13.png); background-repeat: no-repeat; background-size: cover; background-position: center; position: absolute; left: -4rem; top: 0; }
.match-talk .user-info p { font-size: 1.2rem; color: var(--gray5); font-weight: 600; }

.talk-box { padding: 1.6rem; width: fit-content; max-width: 21.5rem; border-radius: 0 24px 24px 24px; background: var(--gray80); border: 1px solid var(--gray70); }
.talk-box p { font-size: 1.4rem; line-height: 1.5; }
.talk-wrap { display: flex; gap: .2rem; align-items: flex-end; }
.talk-wrap span { font-size: 1.2rem; color: var(--gray30); padding-bottom: .4rem; }

.match-talk:not(.talk-my) .talk-wrap span { margin-left: .4rem; }
.match-talk.talk-my .talk-wrap span { margin-right: .4rem; }
.talk-wrap button { background: none; padding: 0; width: auto; height: auto; }
.talk-wrap button .ic-more { transform: rotate(90deg); }
.talk-my { margin-left: auto; }
.talk-my .talk-wrap { flex-direction: row-reverse; }
.talk-my .talk-box { border-radius: 24px 24px 0 24px;background: var(--gray50);border-color:var(--gray40) }

/* 신규 설문조사 */
.program-wrap .img{border-radius: 6px;background: #404040;overflow: hidden;}
.program-wrap .img img{width: 100%;}
.info-list{display: flex;flex-direction:column;gap:1rem;padding-bottom: 2rem;margin-top:2rem;margin-bottom:2rem;border-bottom:1px solid var(--gray40);}
.info-list strong{font-size:1.6rem}
.info-list li{font-size:1.4rem;line-height:1.4;padding-left:1.8rem;word-break:keep-all;position:relative}
.info-list li:before{content:"";display:block;width:.2rem;height:.2rem;border-radius:100%;background:var(--white);position:absolute;top:.9rem;left:.9rem}
.info-list .number{ counter-reset: my-counter; list-style: none; }
.info-list .number li{counter-increment: my-counter;}
.info-list .number li::before{ content: counter(my-counter) ".";background:none;top:0;left:.3rem;}

