
.collab_btn {
    display:inline-block;
    font-size:22px;
    font-weight:600;

    padding:7px 10px;    
    width:230px;
    height:50px;
    word-spacing:-2px;
     font-family:'Noto Sans KR';
    border:solid 1px #d2d2d2;
    border-radius:40px;

}


.plus-btn{
    position:absolute!important;
    top:28px;
    right:58px;
    width:52px;
    height:52px;
    border:0;
    border-radius:50%;
    background:#eee;
    position:relative;
    cursor:pointer;
}

.plus-btn::before,
.plus-btn::after{
    content:'';
    position:absolute;
    left:50%;
    top:50%;
    background:#666;
    transform:translate(-50%, -50%);
}

.plus-btn::before{
    width:24px;
    height:3px;
}

.plus-btn::after{
    width:3px;
    height:24px;
}



#certModal{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.8);
    display:none;

    justify-content:center;
    align-items:center;

    z-index:99999;
}

.certModalWrap{
    position:relative;
    display:inline-block;
}
#certModal img{
    max-width:80vw;
    max-height:90vh;
    object-fit:contain;

    box-shadow:0 0 30px rgba(0,0,0,0.5);
}

#btnClose{
    position:absolute;
    top:-60px;
    right:-100px;
    
    width:42px;
    height:42px;
    line-height:36px;

    border-radius:50%;
    background:rgba(160,160,160,0.75);
    color:#fff;

    font-size:32px;
    text-align:center;
    cursor:pointer;
    z-index:20;
}


#btnPrev,
#btnNext{
    position:absolute;
    top:50%;
    transform:translateY(-50%);

    width:35px;
    height:35px;
    line-height:20px;

    border-radius:50%;
    background:rgba(160,160,160,0.75);
    color:#fff;

    font-size:42px;
    text-align:center;
    cursor:pointer;
    user-select:none;
    z-index:20;
}

#btnPrev{
    left:calc(50% - 500px);
}

#btnNext{
    right:calc(50% - 500px);
}


#certModal{
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.8);
    display:none;

    justify-content:center;
    align-items:center;

    z-index:99999;
}


.certWrap{
    position:relative;
    width:100%;
    height:100%;
    overflow:hidden;
  
}



._certCover{
    position:absolute;  
    cursor:pointer;
    top:0;
    left:0;
    width:100%;
    height:100%;
background-color:rgb(14, 28, 96,0.8);
    display:none;
    z-index:10;
}


.certModalWrap{
    position:relative;
    display:inline-block;
}
#certModal img{
    max-width:80vw;
    max-height:90vh;
    object-fit:contain;

    box-shadow:0 0 30px rgba(0,0,0,0.5);
}




#btnPrev,
#btnNext{
    position:absolute;
    top:50%;
    transform:translateY(-50%);

    width:35px;
    height:35px;
    line-height:20px;

    border-radius:50%;
    background:rgba(160,160,160,0.75);
    color:#fff;

    font-size:42px;
    text-align:center;
    cursor:pointer;
    user-select:none;
    z-index:20;
}

#btnPrev{
    left:calc(50% - 500px);
}

#btnNext{
    right:calc(50% - 500px);
}




.whygmnCard
{    

    width:460px;
    height:460px;
    padding:110px 0px 0px 50px;
    background-color:#f6f7f8;
    border-radius:30px;
    text-align:left;
    
}

.whygmnCard .title { font-size:30px; font-family:'Noto Sans bold'}
.whygmnCard .content { font-family:'Noto Sans KR'; font-size:19px; line-height:22px; color:#808080}
.whygmnCard .content2 { font-family:'Noto Sans KR'; font-size:19px; line-height:23px; color:rgb(80, 80, 80)}


._collaImgList img{
    transition:
        transform 0.55s cubic-bezier(0.34, 1.56, 0.64, 1);
}

._collaImgList img:hover{
    transform:translateY(-12px);
}


.whygmnCard{
    transition:
        transform 0.55s cubic-bezier(0.34, 1.56, 0.64, 1),
        box-shadow 0.45s ease;

    will-change:transform;
}

.whygmnCard:hover{
    transform:translateY(-14px) scale(1.02);
}

/* ============================================================
   [2026-08-10] 협업문의 페이지 리디자인 (골드 무드) + 스크롤 등장
   ============================================================ */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .75s cubic-bezier(.22,1,.36,1), transform .75s cubic-bezier(.22,1,.36,1); }
.reveal.is-in{ opacity:1; transform:none; }

/* #6 슬라이더: 라운드 + 골드 도트 (금마니 소개 폼 통일) */
.mySwiper .swiper-slide{ border-radius:22px; overflow:hidden; }
.mySwiper .swiper-slide img{ display:block; width:100%; height:auto; border-radius:22px; }
.mySwiper .swiper-pagination{ bottom:22px !important; }
.mySwiper .swiper-pagination-bullet{ width:8px !important; height:8px !important; background:rgba(255,255,255,.55) !important; opacity:1 !important; border-radius:20px !important; margin:0 5px !important; transition:width .34s ease, background .34s ease; }
.mySwiper .swiper-pagination-bullet-active{ width:34px !important; background:#DDBD7E !important; }

/* #8 4장 사진: 라운드 썸네일 + 골드 pill 라벨 (가로 4개 유지) */
._collaImgList{ gap:26px; }
._collaImgList > div{ flex:1; min-width:0; text-align:center; }
._collaImgList .collab-thumb{ border-radius:20px; overflow:hidden; aspect-ratio:3/4; background:#efece6; box-shadow:0 26px 48px -34px rgba(20,16,8,.45); }
._collaImgList .collab-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.22,1,.36,1); }
._collaImgList > div:hover .collab-thumb img{ transform:scale(1.06); }
.collab_btn{ display:inline-block; width:auto !important; height:auto !important; margin-top:22px; padding:12px 34px !important; text-align:center; font-size:18px; font-weight:700; font-family:'Noto Sans KR'; color:#141110; border:1px solid #e2d7bd !important; border-radius:40px; background:#fff; transition:all .25s ease; }
._collaImgList > div:hover .collab_btn{ border-color:#DDBD7E !important; color:#b98a34; background:#fbf7ee; }

/* #9 3카드: 완전 재디자인 (아이콘 골드칩 + 라운드 카드 + 애니메이션) */
._collaCardList{ gap:30px; }
.whygmnCard{ flex:1; width:auto !important; height:auto !important; min-height:0 !important; padding:48px 40px !important; background:#fff !important; border:1px solid #eee5d2; border-radius:24px; box-shadow:0 30px 60px -40px rgba(120,90,30,.4); text-align:left; }
.whygmnCard > div:first-child{ width:66px; height:66px; border-radius:18px; background:linear-gradient(135deg,#f5ecd8,#e6d3a8); display:flex; align-items:center; justify-content:center; margin-bottom:6px; }
.whygmnCard > div:first-child img{ width:38px; height:38px; object-fit:contain; }
.whygmnCard .title{ font-size:24px !important; color:#141110; }
.whygmnCard .content{ font-size:16px !important; line-height:1.65 !important; color:#666 !important; }
.whygmnCard .content2{ font-size:15px !important; line-height:1.6 !important; color:#b98a34 !important; border-top:1px solid #f0e9d8; padding-top:18px !important; margin-top:4px; }
.whygmnCard:hover{ transform:translateY(-10px); box-shadow:0 42px 72px -40px rgba(185,138,52,.5); border-color:#e6d3a8; }
.whygmnCard.reveal.is-in{ transform:none; }

@media (max-width:1100px){
  ._collaImgList{ flex-wrap:wrap; }
  ._collaImgList > div{ flex:0 0 46%; }
  ._collaCardList{ flex-direction:column; }
}

/* [2026-08-10 #7] 협업문의 본문 텍스트 2pt 축소 (협업 페이지 전용) */
.main-sub-text-26, .main-sub-text-26-kr{ font-size:24px !important; line-height:33px !important; }
/* ============================================================
   [2026-08-28] 쇼룸 / 협업문의 모바일
   ============================================================ */
@media (max-width:720px){
  .pb-300{ padding-bottom:80px !important; }
  .pt-9{ padding-top:32px !important; }
  .pt-7{ padding-top:24px !important; }
}

/* [2026-08-28] 쇼룸 + 버튼이 왼쪽으로 4px 삐져나갔다. */
@media (max-width:720px){
  .plus-btn{ left:auto !important; right:auto !important; margin-left:0 !important; }
  .main-wrap .plus-btn{ position:relative; }
}
