/* 기후 스쿨 · 기후 꾸러기 (school2_fix) */
/* 기후 스쿨 첫 화면: 네 칸(누르면 아래 목록이 그 칸으로) */
.fdsec .rtabs.scards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0;padding:0;background:none;border-radius:0;width:100%;overflow:visible;flex-wrap:nowrap}
.fdsec .rtabs.scards button{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:0;min-height:0;padding:0;border:2px solid var(--ink);border-radius:22px;background:#fff;color:var(--ink);font:inherit;text-align:left;cursor:pointer;overflow:hidden;transition:transform .2s var(--e),box-shadow .2s var(--e)}
.fdsec .rtabs.scards button .si{display:block;aspect-ratio:4/3;background:#F4F3EE;overflow:hidden}
.fdsec .rtabs.scards button .si img{display:block;width:100%;height:100%;object-fit:contain;padding:12px;box-sizing:border-box}
.fdsec .rtabs.scards button b{display:block;padding:14px 18px 16px;border-top:2px solid var(--ink);font-size:clamp(19px,1.7vw,24px);font-weight:900;letter-spacing:-.04em}
.fdsec .rtabs.scards button:hover{transform:translateY(-2px)}
.fdsec .rtabs.scards button[aria-selected="true"]{background:#fff;color:var(--ink);box-shadow:0 0 0 4px var(--lime),0 0 0 6px var(--ink)}
.fdsec .rtabs.scards button[aria-selected="true"] b{background:var(--lime)}
.fdsec .rtabs.scards button:focus-visible{outline:3px solid var(--peri-tx);outline-offset:6px}
.fdsec .sech.scardh{display:block;margin-bottom:18px}
.smake{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 6px}
.smake a{display:none}
.fdsec[data-cat="map"] .smake a[data-c="map"],.fdsec[data-cat="news"] .smake a[data-c="news"],.fdsec[data-cat="slogan"] .smake a[data-c="slogan"],.fdsec[data-cat="vow"] .smake a[data-c="vow"]{display:inline-flex}
.fdsec .fdempty .fdgo{display:none}
.fdsec .tvsec{margin:10px 0 24px;padding:0}
.fdsec:not([data-cat="news"]) .tvsec{display:none}
.fdsec .tvsec>.sech,.fdsec .tvsec .tvgo{display:none}
/* 기후 스쿨: 고른 칸의 활동을 바로 */
.fdsec .sacts{margin:18px 0 8px}
.fdsec .sacts>section.act{display:none}
.fdsec[data-cat="map"] .sacts>#a1-2-1,.fdsec[data-cat="news"] .sacts>#a1-2-2,.fdsec[data-cat="slogan"] .sacts>#a3-2-3,.fdsec[data-cat="vow"] .sacts>#a9-2-1{display:block}
.fdsec .sacts .ano,.fdsec .sacts .am{display:none}
.fdsec .sacts .qcard .wf span{color:#fff;font-weight:800;opacity:.95}
/* 기후 퀴즈: 주제별 세트 그림 카드 */
.card.qcard .qimg{display:block;margin:-6px -6px 14px;aspect-ratio:16/10;border-radius:18px;background:#fff;overflow:hidden}
.card.qcard .qimg img{display:block;width:100%;height:100%;object-fit:contain;padding:10px;box-sizing:border-box}
.th-guide.card.qcard .qimg{background:#F4F3EE}
/* 기후 랭킹: 맨 위 카드의 1 · 2 · 3등 단상 — 금 · 은 · 동 둥근 단상 + 메달 + 1등 왕관 + 꽃가루 */
.phead.hasrank .pstats{display:none}
.phead .rstage{grid-area:art;align-self:end;justify-self:end;position:relative;z-index:1;isolation:isolate;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:clamp(10px,1.4vw,18px);width:100%;max-width:600px;padding:0 6px 16px}
.phead .rstage::before{content:"";position:absolute;z-index:-1;left:-4%;right:-4%;top:-8%;bottom:34%;pointer-events:none;
  background:radial-gradient(circle,#5B4CF0 0 4px,transparent 5px) 8% 30%/20px 20px no-repeat,radial-gradient(circle,#FF7A59 0 5px,transparent 6px) 22% 8%/20px 20px no-repeat,radial-gradient(circle,#C6F24D 0 6px,transparent 7px) 38% 22%/20px 20px no-repeat,
  radial-gradient(circle,#4DB6FF 0 4px,transparent 5px) 62% 4%/20px 20px no-repeat,radial-gradient(circle,#FFC928 0 6px,transparent 7px) 78% 18%/20px 20px no-repeat,radial-gradient(circle,#FF7A59 0 4px,transparent 5px) 92% 36%/20px 20px no-repeat,
  linear-gradient(#5B4CF0,#5B4CF0) 14% 12%/12px 5px no-repeat,linear-gradient(#FFC928,#FFC928) 52% 30%/5px 12px no-repeat,linear-gradient(#4DB6FF,#4DB6FF) 86% 6%/12px 5px no-repeat,linear-gradient(#C6F24D,#C6F24D) 30% 40%/5px 12px no-repeat}
.phead .rstage::after{content:"";position:absolute;z-index:-1;left:2%;right:2%;bottom:0;height:34px;border-radius:50%;background:radial-gradient(closest-side,rgba(24,28,48,.26),rgba(24,28,48,0))}
.rs{position:relative;display:flex;flex-direction:column;min-width:0}
.rsn{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;min-height:5.4em;padding:0 4px 26px;text-align:center}
.rsn b{font-size:clamp(18px,1.9vw,27px);font-weight:900;letter-spacing:-.045em;line-height:1.22;color:var(--ink);word-break:keep-all}
.rs1 .rsn b{font-size:clamp(21px,2.5vw,36px)}
.rs1 .rsn::before{content:"";display:block;width:clamp(44px,4.4vw,62px);aspect-ratio:4/3;margin-bottom:4px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M6 40 2 12l16 12L32 4l14 20 16-12-4 28z' fill='%23FFC928' stroke='%23C98A00' stroke-width='3' stroke-linejoin='round'/%3E%3Cpath d='M8 38h48' stroke='%23C98A00' stroke-width='3'/%3E%3Ccircle cx='32' cy='27' r='4.5' fill='%23fff'/%3E%3Ccircle cx='16' cy='31' r='3' fill='%23fff' opacity='.8'/%3E%3Ccircle cx='48' cy='31' r='3' fill='%23fff' opacity='.8'/%3E%3C/svg%3E") center/contain no-repeat;filter:drop-shadow(0 4px 6px rgba(201,138,0,.35))}
.rsn span{font-size:clamp(14px,1.2vw,16px);font-weight:800;color:var(--mute);font-variant-numeric:tabular-nums}
.rsn .emp{color:rgba(15,17,23,.22)}
.rs.me .rsn b{color:var(--peri-tx)}
.rsb{--a:#FFE88A;--b:#FFD43B;--c:#E2A40A;--t1:#FFF4BE;--t2:#FFE173;--m1:#FFF6C8;--m2:#FFCB2E;--m3:#D99A00;--rb1:#5B4CF0;--rb2:#3E31C9;
  position:relative;display:grid;place-items:start center;border:0;border-radius:0 0 50% 50%/0 0 18px 18px;background:linear-gradient(90deg,var(--a) 0%,var(--b) 40%,var(--c) 100%);box-shadow:inset 0 -14px 0 rgba(0,0,0,.07)}
.rsb::before{content:"";position:absolute;left:0;right:0;top:-17px;height:34px;border-radius:50%;background:linear-gradient(180deg,var(--t1),var(--t2));box-shadow:inset 0 -3px 0 rgba(0,0,0,.06)}
.rs1 .rsb{height:clamp(150px,15vw,210px)}
.rs2 .rsb{height:clamp(112px,11vw,150px);--a:#FBFCFE;--b:#DCE2EA;--c:#A9B3C1;--t1:#FFFFFF;--t2:#EEF1F6;--m1:#FFFFFF;--m2:#D3D9E2;--m3:#97A2B2;--rb1:#4DB6FF;--rb2:#2A8FD8}
.rs3 .rsb{height:clamp(86px,8.4vw,116px);--a:#FCD9BA;--b:#F0AA74;--c:#C8763C;--t1:#FFE7D2;--t2:#F8C597;--m1:#FFE6CC;--m2:#E8A06A;--m3:#B4652E;--rb1:#FF7A59;--rb2:#E0553A}
.rsb i{position:relative;z-index:2;display:grid;place-items:center;width:clamp(50px,5.6vw,78px);aspect-ratio:1;margin-top:clamp(14px,1.6vw,22px);border-radius:50%;font-style:normal;font-size:clamp(26px,3vw,42px);font-weight:900;letter-spacing:-.04em;line-height:1;color:#1B1D26;
  background:radial-gradient(circle at 34% 28%,#fff 0 7%,var(--m1) 9%,var(--m2) 56%,var(--m3) 100%);box-shadow:0 0 0 4px rgba(255,255,255,.85),0 0 0 6px var(--m3),0 10px 16px rgba(0,0,0,.2)}
.rsb::after{content:"";position:absolute;z-index:1;left:50%;top:-8px;width:clamp(34px,3.6vw,50px);height:calc(clamp(14px,1.6vw,22px) + clamp(22px,2.4vw,32px));translate:-50% 0;background:linear-gradient(90deg,var(--rb1) 0 50%,var(--rb2) 50%);clip-path:polygon(0 0,36% 0,50% 58%,64% 0,100% 0,64% 100%,36% 100%)}
.sec #podium{display:none!important}
@media (max-width:820px){.phead .rstage{justify-self:stretch;max-width:none;margin-top:22px}}
@media (max-width:900px){.fdsec .rtabs.scards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){
  .fdsec .rtabs.scards{gap:10px}.fdsec .rtabs.scards button{border-radius:18px}.fdsec .rtabs.scards button b{padding:11px 14px 13px;font-size:18px}
}
