
:root { --navy:#17288b; --blue:#6461ff; --sky:#84afff; --gold:#C9A84C; --sans:'Noto Sans KR', sans-serif; --sans2:"pretendard";}

section a:link,section a:visited,
footer a:link,footer a:visited,
.fab a:link,.fab a:visited,
nav a:link,nav a:visited,
.sol-card a:link,.sol-card a:visited,
.rec-card a:link,.rec-card a:visited,
.rv-card a:link,.rv-card a:visited,
.glass-w a:link,.glass-w a:visited
.bt,.bs {
  text-decoration:inherit!important;
}
/* ══ PROGRESS BAR ══ */
#prog{position:fixed;top:0;left:0;z-index:9999;height:3px;width:0%;background:linear-gradient(90deg,var(--sky),var(--gold));transition:width .1s linear;}

/* ══ HERO ══ */
.hero-bg{position:relative;background:#ffffff;overflow:hidden;}
.hero-bg-img{position:absolute;inset:0;background:url(https://igm.or.kr/contents/img/main_bg04.png); center/cover no-repeat; opacity:.3; z-index:0;}
.hero-content{position:relative;z-index:2;}
.hero-photo{border-radius:15px; overflow:hidden;}
.hero-main-title{font-size:5rem;font-weight:900;}
/* ══ GLASS ══ */
.glass-w{background:rgba(255,255,255,.3);backdrop-filter:blur(12px);}

/* ══ BADGES ══ */
.badge{display:inline-flex;align-items:center;padding:2px 10px;border-radius:2px; transition:transform 1s,box-shadow .6s; font-size:1.6rem; font-weight:800;}
.b-purple{background:rgba(235,235,235);color:#8644ff;}
.b-blue{background:rgba(235,235,235);color:#6461ff;}
.b-red{background:rgba(255,73,49);color:rgb(255,255,255);}
.b-gray{background:rgba(235,235,235);color:#909090;}
.b-gold{background:rgba(235,235,235);color:#A07828;}
.b-sky{background:rgba(235,235,235);color:#1A6BFF;}

/* ══ SECTION BACKGROUNDS ══ */
.sec-light{background:#f4f4f4;}
.sec-slate{background:#F6F6FA;}
.sec-dark{background:#202020;}

/* ══ SECTION TYPOGRAPHY ══ */
.sec-label{display:flex;align-items:center;gap:8px;margin-bottom:12px;}
.sec-t{font-size:4.2rem; margin-bottom:20px; font-weight:600;color:#000000;letter-spacing:-.02em;line-height:1.2;}
.sec-s{color:#868686;font-size:1.8rem; line-height: 1.5;}5

/* ══ SOL NUM ══ */
.sol-num{font-size:1.8rem;font-weight:700;letter-spacing:.1em;}
.sol-num-box{justify-content:center;font-weight:800;margin-bottom:12px; text-align: right; color:#909090;}

/* ══ REC CARD ══ */
.rec-card{display:flex;border-radius:8px;background-image: url(https://igm.or.kr/contents/img/rec-card-bg.png); background-position: bottom; position: relative; overflow:hidden;}
.rec-card-img{position: absolute;right:10%; bottom:10%;  transition: transform 1.5s ease;}
.rec-card:hover,.ch:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.09);}
.rec-card:hover .rec-card-img{  transform: translateY(-15px);}
.rec-card:hover .rec-card-imgR{  transform: translateY(-20px) rotate(140deg);}
.rec-card:hover .badge{transform:translateY(-3px) scale(1.1);box-shadow:4px 4px 6px rgba(0,0,0,0.2);}
/* ══ SOL CARD ══ */
.sol-card{display:flex;flex-direction:column;background:#fff; border:1px solid#eeeeee; border-radius:8px;transition:transform .25s,box-shadow .25s,border-color .25s;cursor:pointer;}
.sol-card:hover{transform:translateY(-5px);box-shadow:0 10px 30px rgba(50,50,50,.1)}
.sol-card-text{padding:28px 24px; flex:1;}
.sol-card-icon{width:40px;height:40px;color:var(--sky);margin-bottom:12px;}
.sol-card-icon svg{width:100%;height:100%;}
.sol-cat{font-size:1.2rem;font-weight:700;color:var(--sky);letter-spacing:.03em;text-transform:uppercase;margin-bottom:10px;}
.sol-title{font-size:2.2rem; font-weight:800;color:#333333;line-height:1.5;margin-bottom:10px;}
.sol-desc{font-size:1.6rem;color:#64748B;line-height:1.65;flex:1;}
.sol-tags{padding:28px 24px; border-radius:0 0 8px 8px;}
.sol-tag{font-size:1.2rem;font-weight:600;background:#f2f2f2;color:#6461ff;padding:3px 9px;border-radius:9999px;}
/* ══ BANNER ══ */
.bt{display:flex;transition:transform .5s cubic-bezier(.22,1,.36,1);}
.bs{min-width:100%;}
.bt:hover{transform:scale(1.015);box-shadow:0 16px 40px rgba(0,0,0,.12);}

/* ══ REVEAL ══ */
.rv{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease;}
.rl{opacity:0;transform:translateX(-24px);transition:opacity .6s ease,transform .6s ease;}
.rr{opacity:0;transform:translateX(24px);transition:opacity .6s ease,transform .6s ease;}
.rv.on,.rl.on,.rr.on{opacity:1;transform:translate(0);}
/* ══ DIVIDER / SQUARE ══ */
.square{border-radius:4px;overflow:hidden;}

/* ══ RV-CARD ══ */
.rv-card{background:#fff;border:1px solid #E8ECF4;border-radius:16px;padding:28px 24px;transition:transform .25s,box-shadow .25s;}
.rv-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(0,0,0,.08);}

/* ══ INF-CARD ══ */
.inf-card{background:#fff;border:1px solid #E8ECF4;border-radius:16px;padding:24px;transition:transform .2s,box-shadow .2s;}
.inf-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.07);}
.inf-card-c{background:linear-gradient(135deg,#0D1B3E 0%,#1A3470 100%);border:none;color:#fff;}

/* ══ MARQUEE ══ */
.mq-wrap{overflow:hidden;}
.mq-track{display:flex;width:max-content;animation:marquee 28s linear infinite;}
.mq-track:hover{animation-play-state:paused;}
@keyframes marquee{0%{transform:translateX(0);}100%{transform:translateX(-50%);}}

/* ══ TABS ══ */
.tab{font-weight:500;color:#333333;cursor:pointer; border:1px solid#e0e0e0; transition:background .2s,color .2s; background:transparent;}
.tab:hover{background:#e0e0e0;}
.tab.act{background:#000000;color:#fff;}

/* ══ FAB ══ */
.fab{position:fixed;right:24px;bottom:24px;display:flex;flex-direction:column;gap:10px;z-index:800;}
.fab-btn{width:48px;height:48px;border-radius:9999px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;font-size:1.1rem;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 16px rgba(0,0,0,.15);}
.fab-btn:hover{transform:scale(1.1);box-shadow:0 8px 24px rgba(0,0,0,.2);}

/* ══ HIDE ══ */
.hide{display:none!important;}

/* ══ QUICK MENU ══ */
#quick-menu{position:fixed;right:24px;bottom:96px;z-index:850;}
.qm-panel{width:220px;background:#fff;border:1px solid #E8ECF4;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.14);overflow:hidden;transition:opacity .25s,transform .25s;}
.qm-header{background:#0D1B3E;padding:12px 16px;color:#fff;font-weight:700;font-size:.85rem;}
.qm-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#E8ECF4;}
.qm-item{background:#fff;padding:14px 12px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;transition:background .15s;text-decoration:none;color:inherit;}
.qm-item:hover{background:#F8FAFF;}
.qm-icon{font-size:1.25rem;}
.qm-num{font-size:.75rem;font-weight:800;color:#1A6BFF;}
.qm-name{font-size:.68rem;font-weight:600;color:#64748B;text-align:center;}
.qm-toggle{width:48px;height:48px;border-radius:9999px;background:#0D1B3E;color:#fff;border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;box-shadow:0 4px 16px rgba(0,0,0,.2);transition:transform .2s;}
.qm-toggle:hover{transform:scale(1.1);}

/* ══ BTT ══ */
#btt{position:fixed;right:24px;bottom:144px;width:44px;height:44px;border-radius:9999px;background:#fff;border:1px solid #E8ECF4;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:.85rem;box-shadow:0 4px 16px rgba(0,0,0,.1);transition:opacity .3s,transform .3s;opacity:0;transform:translateY(10px);z-index:800;}
#btt.show{opacity:1;transform:translateY(0);}
#btt:hover{box-shadow:0 8px 24px rgba(0,0,0,.15);}
