
/* ------------------------------------------------------------------------- */
/* Hero
/* ------------------------------------------------------------------------- */
/*
.sec.hero {  width: 100%; min-height: 100dvh;  position: relative; background: rgba(0, 0, 0, 0.1); overflow: hidden;  padding: 0;}
.sec.hero::after {content: '';  width: 100%; height: 51.5rem;  position: absolute; left: 0; bottom: 0; z-index: 1; }
.sec.hero video {  width: 100vw; height: 100%;  position: absolute; inset: 0;  object-fit: cover; z-index: 0;}
.sec.hero .inner {  position: relative; z-index: 2;  padding-top: clamp(15rem, 30dvh, 32.6rem);  background: rgba(0, 0, 0, 0.1); padding-bottom: clamp(4rem, 5dvh, 8rem);}
.sec.hero .sec-tit {margin-top: 1rem; margin-bottom: 2.8rem;}
.ai-notice {  position: absolute; right: 2rem; bottom: 2rem; z-index: 2;  padding: 1.2rem 2rem;  background-color: var(--BK-a50); border-radius: var(--radius);  font: 500 1.4rem / 1.5 "pretendard"; letter-spacing: 0.05rem; color: var(--WT);}
*/

.sec.hero {  width: 100%; min-height: 100dvh;  position: relative;  overflow: hidden;  padding: 0;}
.sec.hero::after {content: '';width: 100%;/*height: 1.5rem;*/position: absolute;left: 0;bottom: 0;z-index: 1;background: rgba(0, 0, 0, 0.1);}
.sec.hero video {  width: 100vw; height: 100%;  position: absolute; inset: 0;  object-fit: cover; z-index: 0;}
.sec.hero .inner {position: relative;z-index: 2;padding-top: clamp(15rem, 30dvh, 32.6rem);padding-bottom: clamp(4rem, 5dvh, 8rem);}
.sec.hero .sec-tit {margin-top: 1rem; margin-bottom: 2.8rem;}
.ai-notice {position: absolute;right: 2rem;bottom: 2rem;z-index: 2;padding: 1.2rem 2rem;/* background-color: var(--BK-a50); */border-radius: var(--radius);font: 500 1.4rem / 1.5 "pretendard";letter-spacing: 0.05rem;color: var(--WT);}


/* ------------------------------------------------------------------------- */
/* 큐레이션
/* ------------------------------------------------------------------------- */
.sec.curation .tab {margin-block: 4rem 6rem;}
.marquee-wrap { overflow: hidden; }
.marquee {  width: max-content;  display: flex; gap: 2rem;  animation: marquee 20s linear infinite;}
.marquee-item {width: 20vw; flex-shrink: 0;}
.marquee-item img {width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; transition: filter 0.2s ease;}
.marquee:hover { animation-play-state: paused;}
.marquee-item:hover img {filter: brightness(1.08);}

@keyframes marquee {  0% { transform: translateX(0); }  100% { transform: translateX(-50%); }}

/* ------------------------------------------------------------------------- */
/* 큐레이션2
/* ------------------------------------------------------------------------- */
.sec.curation2 .sec-head {max-width: 40rem; flex-shrink: 0;}
.sec.curation2 .tab {flex-wrap: wrap; justify-content: flex-start;}
.sec.curation2 .tab-contents {min-width: 0; min-height: 25.7rem; flex: 1; position: relative;} /*min-height: 43.7rem; */
.sec.curation2 .swiper.sw-item {overflow: visible; clip-path: inset(0 -100vw 0 0);}
.sec.curation2 .swiper.sw-item .swiper-slide img {width: 100%; aspect-ratio: 3 / 2; height: auto; object-fit: cover; transition: filter 0.2s linear;}
.sec.curation2 .swiper.sw-item .swiper-slide:hover img {filter: brightness(1.15);}

/* ------------------------------------------------------------------------- */
/* 만월대 컬렉션
/* ------------------------------------------------------------------------- */
.sec.collection {background-image: url(../img/collection_bg.png); background-repeat: no-repeat; background-size: cover;}
.sec.collection .inner {width: 100%; position: relative; gap: 2.4rem;}
.swiper.sw-collec {width: 125.6rem; margin-left: 0 !important; margin-right: 0 !important;}
.swiper.sw-collec .swiper-wrapper {width: calc(100% - 42.4rem);}
.swiper.sw-collec .swiper-slide {width: 100%; height: 100%; overflow: hidden;}
.swiper.sw-collec .swiper-slide img {transition: transform 0.5s linear, filter 0.2s ease; }
.swiper.sw-collec .swiper-slide:hover img {transform: scale(1.1); filter: brightness(1.1);}
.swiper.sw-collec .swiper-slide .sub-tit{  position: absolute; left: 3.4rem; bottom: 2.7rem;  font: var(--Pretendard-28-600); color: var(--WT);}
.swiper-controls-collec {  width: 100%; padding: 0 12rem; color: var(--WT);  display: flex; align-items: center; justify-content: space-between; gap: 4rem;  margin-top: 11.5rem;}
.swiper-controls-collec .sw-btns {display: flex; align-items: center; gap: 0.4rem;}
.swiper-controls-collec .sw-btns button {opacity: 0.5; transition: opacity 0.2s ease;}
.swiper-controls-collec .sw-btns button.swiper-pause,
.swiper-controls-collec .sw-btns button.swiper-pause.is-played {opacity: 1;}
.swiper-controls-collec .sw-btns button:hover, 
.swiper-controls-collec .sw-btns button:active {opacity: 1;}
.swiper-controls-collec .sw-btns button:disabled,
.swiper-controls-collec .sw-btns button:disabled:hover,
.swiper-controls-collec .sw-btns button:disabled:active {opacity: 0.3; cursor: not-allowed; pointer-events: none;}
.swiper-controls-collec .swiper-progressbar {  position: relative;  display: flex; align-content: center; gap: 0.4rem;  flex: 1;}
.swiper-controls-collec .swiper-progressbar span {  width: 5rem; height: 2px;  background-color: var(--WT-a30);  transition: width 0.2s ease, background-color 0.2s ease;}
.swiper-controls-collec .swiper-progressbar span.on {width: 14rem; background-color: var(--WT);}
.swiper-controls-collec .swiper-pagination {  width: auto !important; position: relative;  flex-shrink: 0; font: var(--Pretendard-14); color: var(--WT-a30); letter-spacing: 3px;}
.swiper-controls-collec .swiper-pagination .swiper-pagination-current {color: var(--WT);}

/* ------------------------------------------------------------------------- */
/* 발굴의 성과
/* ------------------------------------------------------------------------- */
/*.sec.outcome {background-color: var(--BK-5);}*/
.sec.outcome .inner {gap: 2.4rem;}
.outcome-list {max-width: 125.6rem; display: flex; align-items: center; gap: 2rem;}
.outcome-list a {display: inline-block; overflow: hidden; position: relative; }
.outcome-list a.on {  outline-color: var(--YL-30);}

/* 선택된 T */
.outcome-list a.on::after {  content: '';  position: absolute;  inset: 0;  background-color: transparent; border: 10px solid var(--YL-30);  box-sizing: border-box;  pointer-events: none;  z-index: 5;}
.outcome-list a img {transition: transform 1s linear;}
.outcome-list a .sub-tit {color: var(--WT); position: absolute; top: 2rem; left: 3rem;}
.outcome-list a .btn.num {  position: absolute; right: -5.2rem; bottom: 2.8rem;  display: flex; align-items: center; gap: 1.7rem;  font: var(--Arita-xl); color: var(--WT); transition: right 0.3s linear;}
.outcome-list a .btn.num::after {content: ''; display: inline-block;  width: 5.2rem; height: 5.2rem;  position: absolute; top: 50%; transform: translateY(-50%); right: 0rem;  border: 1px solid var(--WT-a30); border-radius: var(--radius);  background-color: transparent;  transition: background-color 0.2s ease;}
.outcome-list a .btn.num > span {display: inline-flex;  width: 5.2rem; height: 5.2rem;  mask: url(../img/ico_outLink.svg) no-repeat center / 3.2rem;  -webkit-mask: url(../img/ico_outLink.svg) no-repeat center / 3.2rem;  position: relative; z-index: 2;  background-color: var(--WT);  transition: background-color 0.2s ease;}
.outcome-list a:hover img {transform: scale(1.1);}
.outcome-list a:hover .btn.num {right: 2.8rem;}
.outcome-list a .btn.num:has(>span:hover)::after {background-color: var(--WT);}
.outcome-list a .btn.num > span:hover {background-color: var(--BK-80);}

/* links */
.outcome-links {  width: 100%; margin-top: 6rem;  display: flex; align-items: center; justify-content: space-between; gap: 2rem;}
.outcome-links a {  position: relative;  display: flex; align-items: center; justify-content: center; flex-direction: column;  gap: 1.6rem;  /* 강조 효과 */  transition: transform 0.25s ease;}
.outcome-links a .ico-bg {  width: 8rem; height: 8rem;  display: flex; align-items: center; justify-content: center;  background-color: var(--WT);  border: 1px solid var(--BK-5); border-radius: var(--radius);  transition: background-color 0.3s ease, border-color 0.3s ease  	box-shadow 0.3s ease;}
.outcome-links a:hover .ico-bg,
.outcome-links a .ico-bg.on {border-color: var(--YL-30); background-color: var(--YL-10);}


/* 기본 상태 */
.outcome-links a .ico-bg {
    box-sizing: border-box;
    border: 3px solid transparent;
    border-radius: 50%;
    background-color: var(--WT);
    box-shadow: none;
    transition:
        border-color 0.3s ease,
        background-color 0.3s ease;
}

/* 마우스 오버 또는 JS로 on 클래스가 적용된 상태 */
.outcome-links a:hover .ico-bg,
.outcome-links a .ico-bg.on {
    border-color: var(--YL-30);
    background-color: var(--YL-10);
}

/* 연결된 항목 강조 */
.outcome-links a:has(.ico-bg.on) {  transform: scale(1.02);}
/* 연결된 항목의 아이콘 */
.outcome-links a .ico-bg.on {  box-shadow: 0 0 0 2px rgba(0, 150, 100, 0.12);}
.outcome-links a .desc {color: var(--BK-90);}


.outcome-links a:has(.ico-bg.on) {
    transform: none;
}

.outcome-links a .ico-bg.on {
    box-shadow: none;
    border: 1px solid var(--YL-30);
    background-color: var(--YL-10);
}

.outcome-links a .ico-bg {
    width: 8rem;
    height: 8rem;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;
    border: 1px solid var(--YL-30);
    border-radius: 50%;
}

.outcome-links a .ico-bg img {
    display: block;
    max-width: 80%;
    max-height: 80%;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* 기본 상태: 테두리 없음 */
.outcome-links a .ico-bg {
    border: 1px solid transparent;
    border-radius: 50%;
    box-shadow: none;
    background-color: var(--WT);
    transition: border-color 0.3s ease,
                background-color 0.3s ease;
}

/* 마우스 오버 시에만 테두리 표시 */
.outcome-links a:hover .ico-bg {
    border: 3px solid transparent;
    border-color: var(--YL-30);
    background-color: var(--YL-10);
}



/* ------------------------------------------------------------------------- */
/* 웹진
/* ------------------------------------------------------------------------- */
.sec.webzine {  overflow: hidden; padding-bottom: 17rem;  background-image: url(../img/webzine_bg.jpg); background-repeat: no-repeat; background-size: cover;}
.sec.webzine .sec-con {position: relative; display: flex; align-items: center;}
.sec.webzine .text-wrap {display: flex; flex-direction: column; align-items: flex-start;}
.sec.webzine .text-wrap .desc {margin-top: 2rem; margin-bottom: 0.6rem;}
.sec.webzine .text-wrap .sec-label {font: var(--Pretendard-16-400); color: var(--GN-30);}
.webzine-visual {  width: 70rem;  display: flex;  position: absolute; top: 0; right: -20rem;}
.webzine-visual .webzine-item {  width: 33rem;  position: absolute; top: 7rem; transform: rotate(15deg);}
.webzine-visual .webzine-item.more {  transform: rotate(-15deg);  top: -8rem; left: -30rem;  cursor: pointer;  animation: floating 4s linear infinite;}
.webzine-visual .webzine-item.more:hover {  animation-play-state: paused;  filter: brightness(1.1);}
@keyframes floating {
  0%   { transform: rotate(-14deg) translateY(0) scale(0.95); }
  25%  { transform: rotate(-15deg) translateY(-1.5rem) scale(1); }
  50% { transform: rotate(-12deg) translateY(0) scale(0.98); }
  75%  { transform: rotate(-15deg) translateY(-1.5rem) scale(1); }
  100%   { transform: rotate(-14deg) translateY(0) scale(0.95); }
}

/*----- 웹진 > 아티클 -----*/
.webzine-wrap {  width: 100%; overflow: hidden;  padding: 0;  background-color: #F0F7F4;}
.webzine-wrap img { margin: auto; padding-top: 10rem; padding-bottom: 10rem;}

/* ------------------------------------------------------------------------- */
/* 공지사항 / sns
/* ------------------------------------------------------------------------- */
.sec.noti-sns .inner {gap: 8rem;}
.sec.noti-sns .sec-con.notice {flex: 42; min-width: 0;}
.sec.noti-sns .sec-con.sns {flex: 53; min-width: 0;}
.swiper.sw-sns .swiper-slide > img {transition: transform 0.8s ease; width: 100%;}
.swiper.sw-sns .swiper-slide:hover img {transform: scale(1.05);}
.swiper-controls-sns {display: flex; align-items: center; justify-content: center; gap: 1rem;}
.swiper-controls-sns button {  width: 4.4rem; height: 4.4rem;  display: flex; align-items: center; justify-content: center;  background-color: var(--WT);  border: 1px solid var(--border); border-radius: var(--radius);  transition: border-color 0.2s ease, opacity 0.2s ease;}
.swiper-controls-sns button::before {content: '';  display: inline-flex;  width: 2.6rem; height: 2.6rem;  background-color: var(--BK-80);}
.swiper-controls-sns button.swiper-prev::before {  mask: url(../img/ico_prev_BK.svg) no-repeat center / contain;  -webkit-mask: url(../img/ico_prev_BK.svg) no-repeat center / contain;}
.swiper-controls-sns button.swiper-next::before {  mask: url(../img/ico_next_BK.svg) no-repeat center / contain;  -webkit-mask: url(../img/ico_next_BK.svg) no-repeat center / contain;}

/* state */
.swiper-controls-sns button:hover,
.swiper-controls-sns button:active {border-color: var(--BK-80);}
.swiper-controls-sns button:disabled, 
.swiper-controls-sns button:disabled:hover,
.swiper-controls-sns button:disabled:active {opacity: 0.4; cursor: not-allowed; pointer-events: none; border: 1px solid var(--border);}









.outcome-list {
    display: flex;
    gap: 16px;
    width: 100%;
}

.outcome-item {
    flex: 1;
    min-width: 0;
}

.outcome-main {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1.5 / 1;
    overflow: hidden;
}

.outcome-main > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.outcome-main .sub-tit {
    position: absolute;
    top: 20px;
    left: 24px;
    color: #fff;
    font-size: 26px;
}

.outcome-main .num {
    position: absolute;
    right: 20px;
    bottom: 20px;
    color: #fff;
    font-size: 48px;
}


/* 각 분류 밑의 아이콘 */
.outcome-item .outcome-links {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 10px;
    margin-top: 16px;
    padding: 15px 10px;
    /*background: #fff;*/
}


/* 유구 3개 */
.outcome-yugu .outcome-links {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}


/* 유물 4개 */
.outcome-relics .outcome-links {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}


/* 기록 4개 */
.outcome-record .outcome-links {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}


.outcome-links > a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}


.outcome-links .ico-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: #f7f7f5;
}


.outcome-links .ico-bg img {
    width: 70px;
    height: 70px;
    object-fit: contain;
}


.outcome-links .desc {
    margin-top: 8px;
    font-size: 15px;
}

.outcome-list {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    width: 100%;
}

.outcome-item {
    flex: 1;
    min-width: 0;
    margin-top: 0 !important;
    padding-top: 0 !important;
    align-self: flex-start;
}

.outcome-main {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1.5 / 1;
    overflow: hidden;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.outcome-main > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    margin: 0 !important;
}





/* 기본 상태 */
.outcome-links a .ico-bg {
    box-sizing: border-box;
    border: 3px solid transparent;
    border-radius: 50%;
    background-color: var(--WT);
    box-shadow: none;
    transition:
        border-color 0.3s ease,
        background-color 0.3s ease;
}

/* 마우스 오버 또는 JS로 on 클래스가 적용된 상태 */
.outcome-links a:hover .ico-bg,
.outcome-links a .ico-bg.on {
    border-color: var(--YL-30);
    background-color: var(--YL-10);
}



/* 상단 이미지에 연결된 하단 아이콘도 테두리 표시 */
.outcome-list .outcome-links .ico-bg.on {
    border: 3px solid var(--YL-30) !important;
    background-color: var(--YL-10) !important;
    box-sizing: border-box;
    border-radius: 50%;
}


/* 모바일 */
@media (max-width: 767px) {
  /* sec-tit / sec-con 세로 배치 */
  .sec.outcome .inner {display: block;width: 100%;max-width: none;margin: 0;padding: 0 1.5rem;box-sizing: border-box;  }
  /* 제목 */
  .sec.outcome .sec-head {width: 100%;margin: 0 0 3rem;  }
  .sec.outcome .sec-tit {width: 100%;  }
  /* 내용 */
  .sec.outcome .sec-con {width: 100%;max-width: none;  }

  /* 성과 3개 → 세로 3줄 */
  .outcome-list {display: flex;flex-direction: column;width: 100%;gap: 1.5rem;  }
  .outcome-list a {width: 100%;height: 60vw;   /* 이미지 영역 높이 */overflow: hidden;position: relative;  }
  .outcome-list a img {width: 100%;height: auto;display: block;  }
  /* 링크 9개 → 3개 × 3줄 */
  .outcome-links {display: grid;grid-template-columns: repeat(3, 1fr);width: 100%;margin-top: 4rem;gap: 2rem 1rem;  }
  .outcome-links > a {width: 100%;  }
  .outcome-links a .ico-bg {width: 100%;height: auto;aspect-ratio: 1 / 1;box-sizing: border-box;  }

  .sec.outcome .sw-btns {display: flex !important;align-items: center;justify-content: center;gap: 10px;width: 100%;  }
  .sec.outcome .sw-btns button {display: flex !important;align-items: center;justify-content: center;width: 40px;height: 40px;padding: 0;border: 0;background: none;  }
  .sec.outcome .sw-btns button img {display: block;width: 100%;height: 100%;  }
  .sec.outcome .sw-btns button:disabled {display: flex !important;  }

/* =========================
   HERO
   ========================= */
  .sec.hero {width: 100%;min-height: 75rem;height: 100dvh;position: relative;overflow: hidden;padding: 0;}
  .sec.hero::after {width: 100%;height: 45%;left: 0;bottom: 0;z-index: 1;
	/*background: linear-gradient(to top,rgba(52, 144, 132, 0.85) 0%,rgba(84, 142, 134, 0) 100%  );*/
	}
/* =========================
   VIDEO
   ========================= */
  .sec.hero video {width: 100%;height: 100%;position: absolute;inset: 0;object-fit: cover;object-position: center center;z-index: 0;}
/* =========================
   CONTENT
   ========================= */
  .sec.hero .inner {position: relative;z-index: 2;width: 100%;height: 100%;min-height: 75rem;padding: 0 2rem 5rem;box-sizing: border-box;display: flex;align-items: flex-end;}
  .sec.hero .hero-wrap {width: 100%;}
  .sec.hero .sec-label {display: block;margin-bottom: 0.8rem;font-size: 1.4rem;line-height: 1.5;}
  .sec.hero .sec-tit {margin-top: 1rem;margin-bottom: 1.8rem;font-size: 3.2rem;line-height: 1.3;letter-spacing: -0.08em;}
  .sec.hero .desc {margin: 0;font-size: 1.3rem;line-height: 1.7;letter-spacing: -0.03em;word-break: keep-all;}
  .sec.hero .desc span { background-color: rgba(0, 0, 0, 0.1); -webkit-box-decoration-break: clone; box-decoration-break: clone;}
  .sec.hero .btn.more {display: inline-flex;align-items: center;justify-content: center;margin-top: 2rem;min-width: 10rem;height: 4.4rem;padding: 0 1.8rem;box-sizing: border-box;}
/* =========================
   AI 안내
   ========================= */
  .sec.hero .ai-notice {right: 1.5rem;bottom: 1.5rem;padding: 0.8rem 1.2rem;font-size: 1.1rem;line-height: 1.4;letter-spacing: 0;border-radius: var(--radius);}
}





@media (max-width: 767px) {

    /* =========================================
       전체
       ========================================= */

    .outcome-list {
        display: block !important;
        width: 100% !important;
    }

    .outcome-item {
        display: block !important;
        width: 100% !important;
        margin: 0 0 40px !important;
        padding: 0 !important;
        box-sizing: border-box;
    }

    .outcome-item:last-child {
        margin-bottom: 0 !important;
    }


    /* =========================================
       메인 이미지
       ========================================= */

    .outcome-main {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        aspect-ratio: 1.5 / 1;

        margin: 0 !important;
        padding: 0 !important;

        overflow: hidden;
        box-sizing: border-box;
    }

    .outcome-main > img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        object-fit: cover;
    }

    .outcome-main .sub-tit {
        top: 15px;
        left: 18px;
        font-size: 22px;
        line-height: 1.3;
    }

    .outcome-main .num {
        right: 15px;
        bottom: 15px;
        font-size: 32px;
        line-height: 1;
    }


    /* =========================================
       아이콘 영역
       ========================================= */

    .outcome-item .outcome-links {
        display: flex; /*grid !important;*/

        /*width: 99% !important;*/

        margin-top: 4rem !important;
        margin-left: 0 !important;
        margin-right: 0 !important;

        padding: 0 !important;

        box-sizing: border-box;

        background: transparent;

        column-gap: 1rem !important;
        row-gap: 2rem !important;
    }


    /* =========================================
       유구 : 3개
       ========================================= */

    .outcome-yugu .outcome-links {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }


    /* =========================================
       유물 : 4개
       ========================================= */

    .outcome-relics .outcome-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }


    /* =========================================
       기록 : 4개
       ========================================= */

    .outcome-record .outcome-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }


    /* =========================================
       각 아이콘 링크
       ========================================= */

    .outcome-item .outcome-links > a {
        display: flex !important;

        flex-direction: column;
        align-items: center;
        justify-content: flex-start;

        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box;

        text-align: center;
    }


    /* =========================================
       아이콘 원
       기존 화면과 비슷한 크기
       ========================================= */

    .outcome-item .outcome-links .ico-bg {
        display: flex !important;

        align-items: center;
        justify-content: center;

        width: 100px !important;
        height: 100px !important;

        min-width: 100px !important;
        min-height: 100px !important;

        flex: 0 0 100px !important;

        border-radius: 50%;

        background: #f7f7f5;

        box-sizing: border-box;
    }


    /* =========================================
       실제 아이콘
       ========================================= */

    .outcome-item .outcome-links .ico-bg img {
        display: block !important;

        width: 70px !important;
        height: 70px !important;

        min-width: 70px !important;
        min-height: 70px !important;

        max-width: 70px !important;
        max-height: 70px !important;

        object-fit: contain;
    }


    /* =========================================
       아이콘 이름
       ========================================= */

    .outcome-item .outcome-links .desc {
        display: block !important;

        width: 100% !important;

        margin-top: 10px !important;

        font-size: 14px !important;
        line-height: 1.3;

        text-align: center;

        white-space: nowrap;
    }

}
@media (max-width: 767px) {

    .outcome-item .outcome-links {
       /* display: grid !important;*/

        width: 99% !important;

        /* 기존 4rem → 줄임 */
        margin-top: 2rem !important;

        padding: 0 !important;

        /* 가로 간격 */
        column-gap: 1rem !important;

        /* 세로 간격 */
        row-gap: 0 !important;

        box-sizing: border-box;

        background: transparent;
    }

    /* 유구 3개 */
    .outcome-yugu .outcome-links {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    /* 유물 4개 */
    .outcome-relics .outcome-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    /* 기록 4개 */
    .outcome-record .outcome-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    /* 링크 */
    .outcome-item .outcome-links > a {
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;

        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box;
    }

    /* 원 */
    .outcome-item .outcome-links .ico-bg {
        width: 100px !important;
        height: 100px !important;

        min-width: 100px !important;
        min-height: 100px !important;

        flex: 0 0 100px !important;

        border-radius: 50%;
        box-sizing: border-box;
    }

    /* 아이콘 */
    .outcome-item .outcome-links .ico-bg img {
        width: 70px !important;
        height: 70px !important;

        max-width: 70px !important;
        max-height: 70px !important;

        object-fit: contain;
    }

    /* 글자 */
    .outcome-item .outcome-links .desc {
        width: 100% !important;

        margin-top: 8px !important;

        font-size: 14px !important;
        line-height: 1.3;

        text-align: center;
        white-space: nowrap;
    }
}


@media (max-width: 767px) {

    /* =========================================
       outcome-links
       PC처럼 콘텐츠 높이만 사용
       ========================================= */

    .outcome-item .outcome-links {
        /*display: grid !important;

        width: 99% !important;*/
		flex-wrap: nowrap;
        margin-top: 2rem !important;

        padding: 0 !important;

        height: auto !important;
        min-height: 0 !important;

        box-sizing: border-box;

        column-gap: 1rem !important;
        row-gap: 1.5rem !important;
        grid-auto-rows: max-content !important;

        align-items: start;
    }


    /* 유구 3개 */
    .outcome-yugu .outcome-links {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }


    /* 유물 4개 */
    .outcome-relics .outcome-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }


    /* 기록 4개 */
    .outcome-record .outcome-links {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }


    /* =========================================
       아이콘 링크
       ========================================= */

    .outcome-item .outcome-links > a {
        display: flex !important;
        flex-direction: column;

        align-items: center;
        justify-content: flex-start;

        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box;
    }


    /* =========================================
       아이콘 원
       PC와 비슷한 크기
       ========================================= */

    .outcome-item .outcome-links .ico-bg {
        display: flex !important;

        align-items: center;
        justify-content: center;

        width: 90px !important;
        height: 90px !important;

        min-width: 90px !important;
        min-height: 90px !important;

        flex: 0 0 90px !important;

        border-radius: 50%;
        box-sizing: border-box;
    }


    /* 실제 아이콘 */
    .outcome-item .outcome-links .ico-bg img {
        display: block !important;

        width: 65px !important;
        height: 65px !important;

        max-width: 65px !important;
        max-height: 65px !important;

        object-fit: contain;
    }


    /* 설명 */
    .outcome-item .outcome-links .desc {
        display: block !important;

        width: 100% !important;
        height: auto !important;

        margin-top: 8px !important;
        padding: 0 !important;

        font-size: 14px !important;
        line-height: 1.3;

        text-align: center;
        white-space: nowrap;
    }

}

