*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:'Pretendard','Noto Sans KR','Malgun Gothic',Arial,sans-serif;
    background:#fff7d1;
    color:#251d0c;
    line-height:1.85;
    word-break:keep-all;
}
body:before{
    content:"";
    position:fixed; inset:0; z-index:-1;
    background:
      radial-gradient(circle at 10% 8%, rgba(255,225,65,.45), transparent 26%),
      radial-gradient(circle at 88% 10%, rgba(255,178,0,.25), transparent 30%),
      linear-gradient(180deg,#fff9df 0%,#fff1b6 45%,#fffaf0 100%);
}
a{color:inherit}
.wrap{max-width:1160px;margin:0 auto;padding:0 18px 70px}
.nav{
    position:sticky;top:0;z-index:20;
    background:rgba(255,248,220,.92);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(123,81,0,.16);
}
.nav-inner{max-width:1160px;margin:0 auto;padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{font-size:20px;font-weight:950;letter-spacing:-.04em}
.logo span{color:#1d1609}
.menu{display:flex;gap:14px;flex-wrap:wrap;font-size:14px;font-weight:850;color:#674800}
.menu a{text-decoration:none}
.hero{
    margin:28px 0 22px;
    padding:58px 28px 52px;
    text-align:center;
    border-radius:34px;
    border:1px solid rgba(118,78,0,.22);
    background:
      radial-gradient(circle at 14% 18%, rgba(255,255,255,.95), transparent 25%),
      linear-gradient(135deg,#fff5a9 0%,#ffd638 48%,#ffb000 100%);
    box-shadow:0 22px 52px rgba(143,96,0,.23);
    overflow:hidden;
}

.top-logo{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    max-width:640px;
    margin:20px auto 18px;
    padding:12px 14px;
    border:5px solid #1d1609;
    border-radius:24px;
    background:#fff;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.top-logo img{
    display:block;
    width:100%;
    max-width:560px;
    height:auto;
    border:3px solid #1d1609;
    border-radius:0;
    background:#fff;
    padding:0;
    box-shadow:none;
}
@media(max-width:850px){
    .top-logo{
        max-width:96%;
        padding:12px 16px;
        border-radius:20px;
    }
    .top-logo img{
        max-width:100%;
        border:2px solid #1d1609;
    }
}

.kicker{
    display:inline-flex;align-items:center;gap:8px;
    padding:8px 18px;border-radius:999px;
    background:#21190a;color:#ffe05b;
    font-size:14px;font-weight:950;margin-bottom:16px;
}
h1{margin:0;font-size:56px;line-height:1.08;letter-spacing:-.07em;color:#1d1609}
.hero-sub{font-size:21px;font-weight:950;color:#513700;margin:18px 0 0}
.hero-desc{max-width:850px;margin:18px auto 0;color:#4b3915;font-size:17px}
.comic-top{
    display:block;width:100%;max-width:980px;margin:30px auto 0;
    border-radius:24px;border:5px solid #1d1609;background:#fff;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.btn-area{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{
    display:inline-flex;align-items:center;justify-content:center;
    min-width:230px;padding:15px 30px;border-radius:999px;
    text-decoration:none;font-weight:950;font-size:18px;border:0;cursor:pointer;
}
.btn-main{background:#1d1609;color:#ffdd39;box-shadow:0 9px 18px rgba(0,0,0,.25)}
.btn-main:hover{transform:translateY(-2px)}
section{
    background:#fffef4;border:1px solid rgba(159,105,0,.15);
    border-radius:28px;padding:38px 34px;margin:18px 0;
    box-shadow:0 10px 28px rgba(110,75,0,.08);
}
h2{margin:0 0 15px;font-size:30px;letter-spacing:-.05em;color:#241a05}
h3{font-size:22px;margin:24px 0 10px;color:#3b2900}
p{margin:0 0 14px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:20px 0}
.card{
    background:#fff8c8;border:1px solid rgba(155,101,0,.15);
    border-radius:24px;padding:24px;box-shadow:0 8px 18px rgba(100,70,0,.06)
}
.card b{display:block;font-size:20px;margin-bottom:7px}
.badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.badges span{background:#fff0a1;border:1px solid rgba(154,103,0,.18);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:850}
.area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}
.area-grid div{background:#fff6be;border-radius:16px;text-align:center;padding:13px 10px;font-weight:900;border:1px solid rgba(155,101,0,.13)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
.info{background:#fff8c8;border-radius:20px;padding:21px;border:1px solid rgba(155,101,0,.13)}
.info b{display:block;font-size:18px;margin-bottom:8px}
.faq{
    background:#fff9d7;border:1px solid rgba(155,101,0,.14);
    border-radius:18px;margin:10px 0;padding:0;overflow:hidden
}
.faq summary{cursor:pointer;font-weight:950;padding:16px 18px;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq p{padding:0 18px 18px;margin:0;color:#4b3915}
.notice{
    margin-top:20px;padding:38px 24px;text-align:center;
    border-radius:30px;background:#21190a;color:#fff3b0;
    box-shadow:0 16px 34px rgba(0,0,0,.18)
}
.notice h2{color:#ffdd39}
.copy-box{
    max-width:560px;margin:18px auto 0;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,243,176,.25);
    border-radius:20px;padding:18px
}
.copy-url{display:block;margin:8px 0 12px;font-weight:950;color:#fff9cf;word-break:break-all}
.copy-btn{background:#ffdd39;color:#1d1609;border:0;border-radius:999px;padding:12px 24px;font-size:16px;font-weight:950;cursor:pointer}
.copy-msg{display:none;margin-top:10px;color:#ffdd39;font-weight:950}
.footer{text-align:center;color:#705826;font-size:14px;margin-top:0!important;padding:4px 0 0!important}
@media(max-width:850px){
    h1{font-size:40px}
    .hero{padding:44px 20px}
    .cards,.two-col{grid-template-columns:1fr}
    .area-grid{grid-template-columns:repeat(2,1fr)}
    section{padding:30px 22px}
    .nav-inner{flex-direction:column;align-items:flex-start}
}

.top-logo-link{
    display:block;
    line-height:0;
}
.top-logo-link img{
    cursor:pointer;
    transition:transform .25s ease, filter .25s ease;
}
.top-logo-link img:hover{
    animation:catLogoMove .7s ease-in-out;
    filter:brightness(1.04);
}
@keyframes catLogoMove{
    0%{transform:translateY(0) rotate(0deg)}
    25%{transform:translateY(-5px) rotate(-1deg)}
    50%{transform:translateY(0) rotate(1deg)}
    75%{transform:translateY(-3px) rotate(-.5deg)}
    100%{transform:translateY(0) rotate(0deg)}
}


.top-logo{
    transition:transform .25s ease, box-shadow .25s ease;
}
.top-logo:hover{
    transform:translateY(-4px);
    box-shadow:0 22px 42px rgba(0,0,0,.24);
}


.hello-btn{
display:inline-flex;
align-items:center;
justify-content:center;
min-width:420px;
height:110px;
background:#fff;
color:#111;
font-size:34px;
font-weight:900;
text-decoration:none;
border:6px solid #111;
border-radius:999px;
box-shadow:0 16px 0 #000;
transition:transform .18s ease,box-shadow .18s ease;
}
.hello-btn:hover{
animation:bounceBtn .55s ease;
transform:translateY(-5px);
box-shadow:0 22px 0 #000;
}
.hello-btn:active{
transform:translateY(10px);
box-shadow:0 6px 0 #000;
}
@keyframes bounceBtn{
0%{transform:scale(1)}
30%{transform:scale(1.06)}
60%{transform:scale(.97)}
100%{transform:scale(1)}
}


.hello-button-area{
    display:flex;
    justify-content:center;
    margin:24px 0 4px;
}


/* 광고주 안내 섹션 */
.ad-section{
    background:#fffef4;
    border:1px solid rgba(159,105,0,.15);
    border-radius:28px;
    padding:38px 34px;
    margin:22px 0;
    box-shadow:0 10px 28px rgba(110,75,0,.08);
}
.ad-section h2{
    text-align:center;
    margin:0 0 22px;
    font-size:32px;
    letter-spacing:-.05em;
    color:#241a05;
}
.ad-comic{
    display:block;
    width:100%;
    max-width:1050px;
    margin:0 auto 24px;
    border:5px solid #1d1609;
    border-radius:24px;
    background:#fff;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.ad-features{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
    margin-top:16px;
}
.ad-feature{
    background:#fff8c8;
    border:1px solid rgba(155,101,0,.18);
    border-radius:20px;
    padding:18px 14px;
    text-align:center;
    font-size:17px;
    font-weight:950;
}
.ad-gift{
    margin-top:18px;
    padding:22px;
    border-radius:22px;
    background:#1d1609;
    color:#ffdd39;
    text-align:center;
    font-size:24px;
    font-weight:950;
}
@media(max-width:850px){
    .ad-section{padding:30px 18px}
    .ad-features{grid-template-columns:1fr}
    .ad-compare{grid-template-columns:1fr}
    .vs-banner{min-height:80px}
    .vs-burst{width:118px;height:72px;font-size:40px}
    .ad-card.blue .ad-price b{font-size:42px}
}


/* 광고주 안내 최종 수정 */
.ad-section{
    background:#fffef4;
    border:1px solid rgba(159,105,0,.15);
    border-radius:30px;
    padding:38px 34px;
    margin:22px 0;
    box-shadow:0 12px 32px rgba(110,75,0,.10);
}
.ad-section h2{
    text-align:center;
    margin:0 0 10px;
    font-size:34px;
    letter-spacing:-.05em;
    color:#241a05;
}
.ad-intro{
    text-align:center;
    max-width:760px;
    margin:0 auto 26px;
    font-size:18px;
    font-weight:800;
    color:#4b3915;
    line-height:1.7;
}
.ad-comic{
    display:block;
    width:100%;
    max-width:1050px;
    margin:0 auto 30px;
    border:5px solid #1d1609;
    border-radius:24px;
    background:#fff;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.ad-compare-title{
    text-align:center;
    margin:0 0 20px;
    font-size:28px;
    font-weight:950;
    letter-spacing:-.04em;
    color:#241a05;
}
.ad-compare{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:18px;
}
.ad-card{
    border-radius:28px;
    padding:26px 24px;
    border:4px solid transparent;
}
.ad-card.gray{
    background:linear-gradient(180deg,#f3f4f6,#e2e2e2);
    border-color:#9ca3af;
    color:#262626;
}
.ad-card.blue{
    background:linear-gradient(180deg,#eaf4ff,#cfe8ff);
    border-color:#1687ff;
    color:#063b73;
    box-shadow:0 16px 34px rgba(22,135,255,.18);
}
.ad-card h3{
    margin:0 0 18px;
    font-size:30px;
    text-align:center;
}
.ad-row{
    background:rgba(255,255,255,.82);
    border-radius:18px;
    padding:15px;
    margin:11px 0;
}
.ad-label{
    display:block;
    font-size:14px;
    font-weight:950;
    opacity:.65;
    margin-bottom:4px;
}
.ad-value{
    font-size: 18px;
    font-weight:950;
    line-height:1.45;
}
.ad-price{
    margin-top:18px;
    border-radius:22px;
    padding:20px;
    background:#fff;
    text-align:center;
}
.ad-price span{
    display:block;
    font-size:15px;
    font-weight:950;
    color:#5b5b5b;
    margin-bottom:8px;
}
.ad-price b{
    display:block;
    font-size:40px;
    line-height:1.1;
}
.ad-card.blue .ad-price b{
    font-size:52px;
    color:#006ee6;
}
.ad-saving{
    margin-top:24px;
    padding:26px 20px;
    border-radius:26px;
    background:linear-gradient(135deg,#003b79,#1687ff);
    color:#fff;
    text-align:center;
    box-shadow:0 16px 30px rgba(22,135,255,.25);
}
.ad-saving strong{
    display:block;
    font-size:42px;
    line-height:1.15;
}
.ad-saving div{
    font-size:30px;
    font-weight:950;
    margin-top:10px;
}
.ad-note{
    margin-top:20px;
    text-align:center;
    font-size:21px;
    font-weight:950;
    line-height:1.65;
    color:#2b210c;
}
.vs-banner,
.vs-left,
.vs-right,
.vs-burst{
    display:none !important;
}
@media(max-width:850px){
    .ad-section{padding:30px 18px}
    .ad-compare{grid-template-columns:1fr}
    .ad-card.blue .ad-price b{font-size:42px}
    .ad-saving strong{font-size:34px}
    .ad-saving div{font-size:24px}
    .ad-note{font-size:18px}
}


.ad-basic-features{
    margin-top:24px;
    padding:24px 22px;
    border-radius:24px;
    background:#fff8c8;
    border:2px solid rgba(155,101,0,.22);
    box-shadow:0 10px 24px rgba(110,75,0,.08);
}
.ad-basic-features-title{
    text-align:center;
    font-size:24px;
    font-weight:950;
    margin-bottom:14px;
    color:#1d1609;
}
.ad-basic-features-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px 14px;
    max-width:760px;
    margin:0 auto;
}
.ad-basic-features-grid div{
    background:#fffef4;
    border-radius:16px;
    padding:12px 14px;
    font-size:18px;
    font-weight:900;
    border:1px solid rgba(155,101,0,.14);
}
.ad-basic-features-grid .wide{
    grid-column:1 / -1;
    text-align:center;
}
@media(max-width:850px){
    .ad-basic-features-grid{grid-template-columns:1fr}
    .ad-basic-features-grid .wide{grid-column:auto}
}


/* 상단 추천사이트 버튼 / 주소복사 박스 정렬 */
.hero .hello-button-area{
    max-width:560px;
    width:100%;
    margin:22px auto 14px;
}
.hero .hello-button-area .hello-btn{
    width:100%;
    min-width:0;
    max-width:560px;
}
.hero .copy-box{
    max-width:560px;
    width:100%;
    margin:0 auto;
}
@media(max-width:850px){
    .hero .hello-button-area,
    .hero .copy-box{
        max-width:100%;
    }
    .hero .hello-button-area .hello-btn{
        width:100%;
        font-size:28px;
        height:96px;
    }
}


/* 안녕밤알바 로고 박스 */
.hello-logo-box{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    max-width:640px;
    margin:22px auto 18px;
    padding:12px 14px;
    border:5px solid #1d1609;
    border-radius:24px;
    background:#fff;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
    transition:transform .25s ease, box-shadow .25s ease;
}
.hello-logo-box:hover{
    transform:translateY(-4px);
    box-shadow:0 22px 42px rgba(0,0,0,.24);
}
.hello-logo-link{
    display:block;
    line-height:0;
    width:100%;
}
.hello-logo-link img{
    display:block;
    width:100%;
    max-width:560px;
    height:auto;
    margin:0 auto;
    border:3px solid #1d1609;
    background:#fff;
    cursor:pointer;
    transition:transform .25s ease, filter .25s ease;
}
.hello-logo-link img:hover{
    animation:catLogoMove .7s ease-in-out;
    filter:brightness(1.04);
}
@media(max-width:850px){
    .hello-logo-box{
        max-width:96%;
        padding:12px 16px;
        border-radius:20px;
    }
    .hello-logo-link img{
        max-width:100%;
        border:2px solid #1d1609;
    }
}


.notice{
    margin-bottom:10px !important;
}


/* 하단 하이밤알바 박스 배경색만 변경 */
.notice{
    background:#fffef4 !important;
    color:#251d0c !important;
    border:1px solid rgba(159,105,0,.15) !important;
    box-shadow:0 10px 28px rgba(110,75,0,.08) !important;
}
.notice h2{
    color:#241a05 !important;
}
.notice .hello-logo-box{
    margin-top:22px !important;
}
.footer{
    margin-top:10px !important;
    padding:8px 0 0 !important;
}


/* 하단 안내 간격 통일 */
.notice h2{margin:0 0 20px!important;}
.notice .hero-sub,
.notice p:first-of-type{margin:0 0 20px!important;line-height:1.6!important;}
.notice .hello-logo-box{margin:0 auto 20px!important;}
.notice .hello-button-area{margin:0 auto!important;}


/* 하단 안내 이미지 크기 조정 */
.notice .hello-logo-box{
    max-width:640px !important;
}
.notice .hello-logo-link img{
    max-width:560px !important;
    object-fit:contain !important;
}


/* 맨 위로 TOP 버튼 */
#topBtn{
    position:fixed;
    right:24px;
    bottom:24px;
    width:66px;
    height:66px;
    padding:0;
    margin:0;
    border:0;
    border-radius:50%;
    background:#222;
    color:#fff;
    cursor:pointer;
    display:none;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    z-index:9999;
    box-shadow:0 8px 18px rgba(0,0,0,.25);
    font-family:Arial,sans-serif;
    transition:transform .2s ease, opacity .2s ease;
}
#topBtn:hover{
    transform:translateY(-3px);
}
#topBtn .top-arrow{
    width:16px;
    height:16px;
    border-left:2px solid #fff;
    border-top:2px solid #fff;
    transform:rotate(45deg);
    margin-top:7px;
    margin-bottom:2px;
}
#topBtn .top-text{
    font-size:18px;
    font-weight:400;
    line-height:1;
    letter-spacing:-.02em;
}
@media(max-width:850px){
    #topBtn{
        right:16px;
        bottom:16px;
        width:58px;
        height:58px;
    }
    #topBtn .top-text{font-size:16px;}
    #topBtn .top-arrow{width:14px;height:14px;}
}



/* footer spacing fix */
.notice{padding-bottom:18px!important;}
.footer{
margin-top:18px!important;
padding-top:0!important;
padding-bottom:30px!important;
text-align:center;
}


/* 자주 묻는 질문 제목 옆 고양이 */
.faq-title-cat{
    display:inline-block;
    width:62px;
    height:auto;
    vertical-align:middle;
    margin-left:10px;
}
@media(max-width:850px){
    .faq-title-cat{
        width:50px;
        margin-left:8px;
    }
}


/* 하단 바로가기 버튼 밑 공간 추가 */
.notice .hello-button-area{
    margin-bottom:34px !important;
}


/* 하단 SEO 키워드 블록 */
.seo-keyword-block{
    margin:28px 0 18px;
    padding:0;
}
.seo-keyword-inner{
    background:#fffef4;
    border:1px solid rgba(159,105,0,.15);
    border-radius:24px;
    padding:26px 24px;
    color:#4b3915;
    box-shadow:0 8px 22px rgba(110,75,0,.07);
}
.seo-keyword-inner h2{
    margin:0 0 12px;
    font-size:24px;
    text-align:center;
    color:#241a05;
}
.seo-keyword-inner h3{
    margin:0 0 8px;
    font-size:18px;
    color:#241a05;
}
.seo-keyword-inner p{
    margin:0;
    font-size:14px;
    line-height:1.8;
}
.seo-keyword-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    margin:18px 0;
}
.seo-keyword-grid div{
    background:#fff8c8;
    border:1px solid rgba(155,101,0,.14);
    border-radius:18px;
    padding:18px;
}
.seo-hashtags{
    text-align:center;
    color:#705826;
    font-size:13px!important;
}
@media(max-width:850px){
    .seo-keyword-grid{grid-template-columns:1fr;}
    .seo-keyword-inner{padding:22px 18px;}
}



/* SEO 블록 카드 겹침 제거 + 위 카드들과 가로폭 동일 */
.seo-keyword-block{
    max-width:1160px !important;
    margin:18px auto !important;
    padding:0 18px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
}
.seo-keyword-inner{
    max-width:none !important;
    margin:0 !important;
    background:#fffef4 !important;
    border:1px solid rgba(159,105,0,.15) !important;
    border-radius:28px !important;
    padding:38px 34px !important;
    box-shadow:0 10px 28px rgba(110,75,0,.08) !important;
}
@media(max-width:850px){
    .seo-keyword-block{
        padding:0 18px !important;
    }
    .seo-keyword-inner{
        padding:30px 22px !important;
    }
}


/* 자매 사이트 블록 */
.sister-site-block{
    max-width:1160px !important;
    margin:18px auto !important;
    padding:0 18px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}
.sister-site-inner{
    background:#fffef4;
    border:1px solid rgba(159,105,0,.15);
    border-radius:28px;
    padding:38px 34px;
    text-align:center;
    box-shadow:0 10px 28px rgba(110,75,0,.08);
}
.sister-site-inner h2{
    margin:0 0 18px;
    font-size:28px;
    letter-spacing:-.05em;
    color:#241a05;
}
.sister-card{
    max-width:640px;
    margin:0 auto;
    background:#fff8c8;
    border:2px solid rgba(155,101,0,.18);
    border-radius:26px;
    padding:32px 24px;
}
.sister-card-title{
    font-size:34px;
    font-weight:950;
    color:#1d1609;
    margin-bottom:12px;
    letter-spacing:-.05em;
}
.sister-card-desc{
    font-size:18px;
    font-weight:850;
    color:#4b3915;
    line-height:1.7;
    margin-bottom:22px;
}
.sister-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:250px;
    padding:14px 28px;
    border-radius:999px;
    background:#1d1609;
    color:#ffdd39;
    text-decoration:none;
    font-size:18px;
    font-weight:950;
    box-shadow:0 9px 18px rgba(0,0,0,.22);
    transition:transform .2s ease;
}
.sister-btn:hover{transform:translateY(-3px);}
@media(max-width:850px){
    .sister-site-block{padding:0 18px!important;}
    .sister-site-inner{padding:30px 22px;}
    .sister-card{padding:28px 18px;}
    .sister-card-title{font-size:30px;}
    .sister-card-desc{font-size:16px;}
    .sister-btn{width:100%;min-width:0;}
}


/* 자매 사이트 - 여우꿀알바 로고형 */
.sister-site-block{
    max-width:1160px !important;
    margin:18px auto !important;
    padding:0 18px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}
.sister-site-inner{
    background:#fffef4;
    border:1px solid rgba(159,105,0,.15);
    border-radius:28px;
    padding:34px 28px;
    text-align:center;
    box-shadow:0 10px 28px rgba(110,75,0,.08);
}
.sister-logo-link{
    display:inline-block;
    line-height:0;
    transition:transform .25s ease, filter .25s ease;
}
.sister-logo-link:hover{
    animation:sisterLogoBounce .65s ease-in-out;
    filter:brightness(1.04);
}
.sister-logo-img{
    display:block;
    width:100%;
    max-width:520px;
    height:auto;
    margin:0 auto 20px;
}
.sister-text{
    font-size:20px;
    font-weight:900;
    color:#3b2900;
    line-height:1.7;
    margin:0 0 24px;
}
.sister-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:250px;
    padding:14px 28px;
    border-radius:999px;
    background:#1d1609;
    color:#ffdd39;
    text-decoration:none;
    font-size:18px;
    font-weight:950;
    box-shadow:0 9px 18px rgba(0,0,0,.22);
    transition:transform .2s ease;
}
.sister-btn:hover{
    transform:translateY(-3px);
}
@keyframes sisterLogoBounce{
    0%{transform:translateY(0) scale(1)}
    30%{transform:translateY(-5px) scale(1.025)}
    60%{transform:translateY(0) scale(.995)}
    100%{transform:translateY(0) scale(1)}
}
@media(max-width:850px){
    .sister-site-block{padding:0 18px!important;}
    .sister-site-inner{padding:28px 18px;}
    .sister-logo-img{max-width:92%; margin-bottom:18px;}
    .sister-text{font-size:17px;}
    .sister-btn{width:100%; min-width:0;}
}


/* 자매 사이트 만화카드 + 주황 버튼 */
.sister-site-inner{
    background:#fffef4 !important;
    border:1px solid rgba(159,105,0,.15) !important;
    border-radius:28px !important;
    padding:34px 28px !important;
    text-align:center !important;
    box-shadow:0 10px 28px rgba(110,75,0,.08) !important;
}
.sister-comic-card{
    max-width:760px;
    margin:0 auto;
    background:#fff;
    border:5px solid #1d1609;
    border-radius:30px;
    padding:34px 28px 30px;
    box-shadow:10px 10px 0 #ffd638, 0 14px 34px rgba(0,0,0,.16);
    transition:transform .25s ease, box-shadow .25s ease;
}
.sister-comic-card:hover{
    animation:sisterCardPop .7s ease-in-out;
}
.sister-logo-img{
    display:block;
    width:100%;
    max-width:520px;
    height:auto;
    margin:0 auto 20px;
}
.sister-text{
    font-size:20px;
    font-weight:900;
    color:#3b2900;
    line-height:1.7;
    margin:0 0 24px;
}
.sister-btn{
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-width:280px;
    padding:12px 24px;
    border-radius:0;
    background:linear-gradient(180deg,#ff9a20 0%,#ff7a00 100%) !important;
    color:#fff !important;
    border:3px solid #1d1609;
    text-decoration:none;
    font-size:18px;
    font-weight:950;
    letter-spacing:-.04em;
    box-shadow:0 5px 0 #1d1609;
    text-shadow:
        -1px -1px 0 #1d1609,
         1px -1px 0 #1d1609,
        -1px  1px 0 #1d1609,
         1px  1px 0 #1d1609;
    animation:sisterBtnBounce 1.8s ease-in-out infinite;
    transition:transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.sister-btn::after{
    content:"›";
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    border-radius:50%;
    background:#1d1609;
    color:#fff;
    font-size:22px;
    line-height:1;
    text-shadow:none;
    margin-left:2px;
}
.sister-btn:hover{
    transform:translateY(-3px) scale(1.03);
    box-shadow:0 8px 0 #1d1609;
    filter:brightness(1.05);
}
.sister-btn:active{
    transform:translateY(4px);
    box-shadow:0 1px 0 #1d1609;
}
@keyframes sisterBtnBounce{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-4px)}
}
@keyframes sisterCardPop{
    0%{transform:translateY(0) scale(1)}
    35%{transform:translateY(-5px) scale(1.01)}
    70%{transform:translateY(0) scale(.997)}
    100%{transform:translateY(0) scale(1)}
}
@media(max-width:850px){
    .sister-site-inner{padding:28px 18px!important;}
    .sister-comic-card{
        padding:28px 18px 26px;
        border-width:4px;
        box-shadow:7px 7px 0 #ffd638, 0 12px 26px rgba(0,0,0,.14);
    }
    .sister-text{font-size:17px;}
    .sister-btn{
        width:100%;
        min-width:0;
        font-size:17px;
    }
}


/* 수정: 카드 전체가 아니라 여우꿀알바 로고에만 애니메이션 */
.sister-comic-card:hover{
    animation:none !important;
}
.sister-logo-link{
    display:inline-block !important;
    line-height:0 !important;
    transition:transform .25s ease, filter .25s ease !important;
}
.sister-logo-link:hover{
    animation:sisterLogoPop .7s ease-in-out !important;
    filter:brightness(1.04) !important;
}
@keyframes sisterLogoPop{
    0%{transform:translateY(0) scale(1)}
    35%{transform:translateY(-5px) scale(1.035)}
    70%{transform:translateY(0) scale(.998)}
    100%{transform:translateY(0) scale(1)}
}


/* 여우꿀알바 로고 전용 만화 테두리 */
.sister-logo-comic-box{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:100%;
    max-width:640px;
    margin:0 auto 22px;
    padding:12px 34px;
    background:#fff;
    border:5px solid #1d1609;
    border-radius:24px;
    box-shadow:none !important;
}
.sister-logo-comic-box .sister-logo-link{
    display:block !important;
    width:100%;
    padding:8px 12px;
    border:3px solid #1d1609;
    background:#fff;
    line-height:0 !important;
}
.sister-logo-comic-box .sister-logo-img{
    display:block;
    width:100%;
    max-width:560px;
    height:auto;
    margin:0 auto !important;
}
.sister-logo-comic-box .sister-logo-link:hover{
    animation:sisterLogoPop .7s ease-in-out !important;
    filter:brightness(1.04) !important;
}
.sister-comic-card{
    box-shadow:none !important;
}
@media(max-width:850px){
    .sister-logo-comic-box{
        max-width:100%;
        padding:10px 14px;
        border-width:4px;
        border-radius:20px;
    }
    .sister-logo-comic-box .sister-logo-link{
        padding:7px 8px;
        border-width:2px;
    }
}


/* 최종 수정: 잘못 만든 큰 카드 제거, 로고에만 만화 테두리 */
.sister-comic-card{
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    padding:0 !important;
    box-shadow:none !important;
    max-width:none !important;
    margin:0 !important;
}
.sister-site-inner{
    background:#fffef4 !important;
    border:1px solid rgba(159,105,0,.15) !important;
    border-radius:28px !important;
    padding:34px 28px !important;
    text-align:center !important;
    box-shadow:0 10px 28px rgba(110,75,0,.08) !important;
}
.sister-logo-comic-box{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:100% !important;
    max-width:640px !important;
    margin:0 auto 22px !important;
    padding:12px 34px !important;
    background:#fff !important;
    border:5px solid #1d1609 !important;
    border-radius:24px !important;
    box-shadow:none !important;
}
.sister-logo-comic-box .sister-logo-link{
    display:block !important;
    width:100% !important;
    padding:8px 12px !important;
    border:3px solid #1d1609 !important;
    background:#fff !important;
    line-height:0 !important;
}
.sister-logo-comic-box .sister-logo-img{
    display:block !important;
    width:100% !important;
    max-width:560px !important;
    height:auto !important;
    margin:0 auto !important;
}
.sister-logo-comic-box .sister-logo-link:hover{
    animation:sisterLogoPop .7s ease-in-out !important;
    filter:brightness(1.04) !important;
}
@media(max-width:850px){
    .sister-site-inner{padding:28px 18px!important;}
    .sister-logo-comic-box{
        max-width:100% !important;
        padding:10px 14px !important;
        border-width:4px !important;
        border-radius:20px !important;
    }
    .sister-logo-comic-box .sister-logo-link{
        padding:7px 8px !important;
        border-width:2px !important;
    }
}


/* 최종: 상단 안녕밤알바 로고와 동일한 자매 사이트 로고 박스 */
.sister-site-block{
    max-width:1160px !important;
    margin:18px auto !important;
    padding:0 18px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
}
.sister-site-inner{
    background:#fffef4 !important;
    border:1px solid rgba(159,105,0,.15) !important;
    border-radius:28px !important;
    padding:38px 34px !important;
    text-align:center !important;
    box-shadow:0 10px 28px rgba(110,75,0,.08) !important;
}
.sister-logo-box{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    width:100% !important;
    max-width:640px !important;
    margin:0 auto 20px !important;
    padding:12px 14px !important;
    border:5px solid #1d1609 !important;
    border-radius:24px !important;
    background:#fff !important;
    box-shadow:0 14px 34px rgba(0,0,0,.18) !important;
    transition:transform .25s ease, box-shadow .25s ease !important;
}
.sister-logo-box:hover{
    transform:translateY(-4px) !important;
    box-shadow:0 22px 42px rgba(0,0,0,.24) !important;
}
.sister-logo-link{
    display:block !important;
    line-height:0 !important;
    width:100% !important;
}
.sister-logo-img{
    display:block !important;
    width:100% !important;
    max-width:560px !important;
    height:auto !important;
    margin:0 auto !important;
    border:3px solid #1d1609 !important;
    background:#fff !important;
    cursor:pointer !important;
    transition:transform .25s ease, filter .25s ease !important;
}
.sister-logo-img:hover{
    animation:catLogoMove .7s ease-in-out !important;
    filter:brightness(1.04) !important;
}
.sister-comic-card,
.sister-logo-comic-box{
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:0 !important;
    max-width:none !important;
}
.sister-text{
    font-size:20px !important;
    font-weight:900 !important;
    color:#3b2900 !important;
    line-height:1.7 !important;
    margin:0 0 24px !important;
}
@media(max-width:850px){
    .sister-site-inner{padding:30px 22px!important;}
    .sister-logo-box{
        max-width:96% !important;
        padding:12px 16px !important;
        border-radius:20px !important;
    }
    .sister-logo-img{
        max-width:100% !important;
        border:2px solid #1d1609 !important;
    }
    .sister-text{font-size:17px!important;}
}


/* 여우꿀알바 바로가기 버튼 최종 수정: 평소 정지, hover 때만 효과 */
.sister-btn{
    position:relative !important;
    overflow:hidden !important;
    isolation:isolate !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    min-width:280px !important;
    padding:13px 26px !important;
    border-radius:999px !important;
    background:linear-gradient(180deg,#ff9a20 0%,#ff7a00 100%) !important;
    color:#fff !important;
    border:none !important;
    box-shadow:none !important;
    text-decoration:none !important;
    font-size:18px !important;
    font-weight:950 !important;
    letter-spacing:-.04em !important;
    text-shadow:
        -1px -1px 0 #1d1609,
         1px -1px 0 #1d1609,
        -1px  1px 0 #1d1609,
         1px  1px 0 #1d1609 !important;
    animation:none !important;
    transition:transform .22s ease, filter .22s ease !important;
}
.sister-btn::before{
    content:"" !important;
    position:absolute !important;
    top:-40% !important;
    left:-70% !important;
    width:42% !important;
    height:180% !important;
    background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.55) 50%,transparent 100%) !important;
    transform:skewX(-22deg) !important;
    opacity:0 !important;
    z-index:-1 !important;
}
.sister-btn::after{
    content:"›" !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:24px !important;
    height:24px !important;
    border-radius:50% !important;
    background:#1d1609 !important;
    color:#fff !important;
    font-size:24px !important;
    line-height:1 !important;
    text-shadow:none !important;
    margin-left:2px !important;
    transition:transform .22s ease !important;
}
.sister-btn:hover{
    transform:scale(1.035) !important;
    filter:brightness(1.04) !important;
    box-shadow:none !important;
    animation:sisterBtnJelly .38s ease !important;
}
.sister-btn:hover::before{
    animation:sisterBtnShine .72s ease forwards !important;
}
.sister-btn:hover::after{
    transform:translateX(5px) !important;
}
.sister-btn:active{
    transform:scale(.98) !important;
    box-shadow:none !important;
}
@keyframes sisterBtnShine{
    0%{left:-70%;opacity:0}
    20%{opacity:1}
    100%{left:130%;opacity:0}
}
@keyframes sisterBtnJelly{
    0%{transform:scale(1)}
    35%{transform:scale(1.055,.965)}
    70%{transform:scale(.985,1.025)}
    100%{transform:scale(1.035)}
}
@media(max-width:850px){
    .sister-btn{
        width:100% !important;
        min-width:0 !important;
        font-size:17px !important;
    }
}


/* 버튼 폰트/아이콘 수정 */
.sister-btn{
    text-shadow:none !important;
}
.sister-btn::after{
    background:#35c84a !important;
    color:#fff !important;
    font-size:18px !important;
    font-weight:900 !important;
    line-height:24px !important;
    text-align:center !important;
    padding-left:1px !important;
    width:24px !important;
    height:24px !important;
}


/* 버튼 원형 아이콘 흰색 + > 위치 위로 보정 */
.sister-btn::after{
    background:#fff !important;
    color:#ff7a00 !important;
    font-size:18px !important;
    font-weight:950 !important;
    line-height:22px !important;
    padding-left:1px !important;
    padding-bottom:2px !important;
    transform:translateY(-1px) !important;
}
.sister-btn:hover::after{
    transform:translateX(5px) translateY(-1px) !important;
}


/* > 아이콘 미세 위치 조정 */
.sister-btn::after{
    transform:translate(-1px,-2px) !important;
    padding-left:0 !important;
    padding-bottom:3px !important;
}
.sister-btn:hover::after{
    transform:translate(4px,-2px) !important;
}


/* 원은 그대로 두고 >만 이동 */
.sister-btn::after{
    transform:none !important;
    background:#fff !important;
    color:#ff7a00 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    padding-top:2px !important;
    padding-left:7px !important;
}
.sister-btn:hover::after{
    transform:none !important;
    padding-left:8px !important;
    padding-top:2px !important;
}


/* 최종: 원 크기 고정, > 위치만 정상 조정 */
.sister-btn::after{
    content:none !important;
    display:none !important;
}
.sister-arrow{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:24px !important;
    height:24px !important;
    min-width:24px !important;
    min-height:24px !important;
    max-width:24px !important;
    max-height:24px !important;
    border-radius:50% !important;
    background:#fff !important;
    color:#ff7a00 !important;
    font-size:18px !important;
    font-weight:950 !important;
    line-height:1 !important;
    margin-left:2px !important;
    padding:0 !important;
    text-shadow:none !important;
    position:relative !important;
    top:-1px !important;
    left:0 !important;
    box-sizing:border-box !important;
    transition:transform .22s ease !important;
}
.sister-btn:hover .sister-arrow{
    transform:translateX(5px) !important;
}


/* 원은 아래로 3px, >는 원 안에서 위로 3px */
.sister-arrow{
    top:3px !important;
}
.sister-arrow::before{
    content:"›";
    position:relative;
    top:-3px;
}


/* 원만 1px 위로 */
.sister-arrow{
    top:2px !important;
}


/* 이벤트 이미지 → 자매 사이트 → 여우꿀알바 카드 순서 */
.sister-heading{
    margin:0 0 18px !important;
    font-size:30px !important;
    font-weight:950 !important;
    color:#241a05 !important;
    text-align:center !important;
    letter-spacing:-.04em !important;
}
.sister-event-image-box{
    width:100% !important;
    max-width:760px !important;
    margin:0 auto 30px !important;
    text-align:center !important;
}
.sister-event-image{
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 auto !important;
    border-radius:22px !important;
    box-shadow:0 12px 30px rgba(110,75,0,.12) !important;
}
@media(max-width:850px){
    .sister-heading{
        font-size:26px !important;
        margin-bottom:16px !important;
    }
    .sister-event-image-box{
        max-width:100% !important;
        margin-bottom:24px !important;
    }
    .sister-event-image{
        border-radius:18px !important;
    }
}




/* 안녕밤알바 주소 복사 한 줄 버튼 */
.address-copy-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    width:100%;
    max-width:560px;
    margin:8px 0 0;
    padding:10px 12px;
    border-radius:14px;
    background:#fff8c8;
    border:1px solid rgba(155,101,0,.18);
}
.address-copy-url{
    font-size:15px;
    font-weight:900;
    color:#241a05;
    word-break:break-all;
}
.address-copy-btn{
    flex:0 0 auto;
    border:0;
    border-radius:999px;
    background:#1d1609;
    color:#ffdd39;
    padding:9px 16px;
    font-size:14px;
    font-weight:950;
    cursor:pointer;
}
.address-copy-msg{
    display:none;
    margin-top:8px;
    font-size:14px;
    font-weight:900;
    color:#006ee6;
}
@media(max-width:850px){
    .address-copy-row{
        max-width:100%;
        gap:8px;
    }
    .address-copy-url{font-size:14px;}
    .address-copy-btn{padding:8px 13px;font-size:13px;}
}

/* 상단 로고 '스토리' 색상 검정 */
.logo span{
    color:#1d1609 !important;
}


/* 상단 추천 문구 */
.hero h1{
    font-size:clamp(34px, 5vw, 52px) !important;
}
.hero-keywords{
    font-size:20px !important;
    font-weight:950 !important;
    color:#513700 !important;
}


/* 안녕밤알바 소개 섹션 */
.marketing-intro-section{
    text-align:left;
}
.marketing-intro-section h2{
    text-align:center;
    margin:0 0 22px;
    font-size:32px;
}
.marketing-intro-image{
    display:block;
    width:100%;
    max-width:980px;
    height:auto;
    margin:0 auto 30px;
    border:5px solid #1d1609;
    border-radius:24px;
    background:#fff;
    box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.marketing-intro-text{
    max-width:900px;
    margin:0 auto;
}
.marketing-intro-text p{
    font-size:18px;
    line-height:1.9;
    margin:0 0 16px;
    color:#3b2900;
}
.marketing-intro-text strong{
    font-weight:950;
    color:#1d1609;
}
@media(max-width:850px){
    .marketing-intro-section h2{font-size:28px;}
    .marketing-intro-image{border-width:4px;border-radius:18px;margin-bottom:24px;}
    .marketing-intro-text p{font-size:16px;}
}



/* 바로가기 버튼 최종 수정: 상단 버튼 기준으로 전체 동일 적용 */
.hello-button-area{
    display:flex !important;
    justify-content:center !important;
    width:100% !important;
    max-width:560px !important;
    margin:24px auto 14px !important;
    padding:0 !important;
    box-sizing:border-box !important;
}
.hello-button-area .hello-btn{
    width:100% !important;
    max-width:560px !important;
    min-width:0 !important;
    height:96px !important;
    padding:0 22px !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-align:center !important;
    font-size:28px !important;
    line-height:1 !important;
    letter-spacing:-.06em !important;
}
@media(max-width:850px){
    .hello-button-area{
        max-width:100% !important;
        width:100% !important;
        margin:22px auto 14px !important;
    }
    .hello-button-area .hello-btn{
        width:100% !important;
        max-width:100% !important;
        min-width:0 !important;
        height:88px !important;
        padding:0 16px !important;
        font-size:24px !important;
        border-width:5px !important;
        box-shadow:0 12px 0 #000 !important;
        border-radius:999px !important;
        white-space:nowrap !important;
    }
}
@media(max-width:380px){
    .hello-button-area .hello-btn{
        font-size:22px !important;
        height:84px !important;
        padding:0 12px !important;
    }
}


/* SEO 3차 리뉴얼: 내부링크·렌더링 안정화 */
.area-grid a{display:block;color:inherit;text-decoration:none}
.area-grid a:hover{text-decoration:underline}
.badges a{background:#fff0a1;border:1px solid rgba(154,103,0,.18);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:850;color:inherit;text-decoration:none}
.badges a:hover{text-decoration:underline}
.hero-sub{font-size:21px;line-height:1.35}
@media (min-width:851px){section:not(:first-of-type){content-visibility:auto;contain-intrinsic-size:800px}}
img{max-width:100%;height:auto}