@charset "utf-8";
/* =====================================================
   자료실 — archive/css/archive.css
   ===================================================== */
.reveal {opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease;}
.reveal.on {opacity:1; transform:none;}

.note-line {margin-top:24px; font-size:var(--fs14); color:#999; text-align:center;}

.arc-list {display:grid; grid-template-columns:repeat(4, 1fr); gap:28px; justify-content:center;}
.arc-card {border:1px solid var(--border1); border-radius:16px; overflow:hidden; background:#fff; transition:all .25s;}
.arc-card:hover {box-shadow:0 16px 36px rgba(0,0,0,.1); transform:translateY(-5px);}

.arc-cover {aspect-ratio:1/1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:8px; padding:26px 20px; color:#fff;}
.arc-cover .ac-year {font-size:var(--fs18); font-weight:700; letter-spacing:.25em; opacity:.9;}
.arc-cover .ac-main {font-size:var(--fs14); font-weight:700; letter-spacing:.04em; opacity:.9; line-height:1.3;}
.arc-cover .ac-sub {margin-top:12px; font-size:var(--fs22); font-weight:800; line-height:1.3; text-shadow:0 2px 8px rgba(0,0,0,.25);}
.arc-cover.ac1 {background:linear-gradient(165deg, #163a6b 0%, #35659e 60%, #aac6e6 100%);}
.arc-cover.ac2 {background:linear-gradient(165deg, #b8500f 0%, #d6863a 60%, #ecc190 100%);}

.arc-info {padding:24px 26px 28px;}
.arc-info .arc-title {font-size:var(--fs20); font-weight:800; color:#1a1a1a;}
.arc-info .arc-desc {margin-top:8px; font-size:var(--fs15); color:#777; line-height:1.5;}
.arc-down {margin-top:20px;}
.arc-down .dl-ico {display:inline-block; width:16px; height:16px; background:center/contain no-repeat;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/><polyline points='7 10 12 15 17 10'/><line x1='12' y1='15' x2='12' y2='3'/></svg>");}

/* ── 태블릿 (~1199px) ── */
@media screen and (max-width: 1199px) {
	.arc-list {grid-template-columns:repeat(2, 1fr); gap:20px;}
}

/* ── 모바일 (~767px) ── */
@media screen and (max-width: 767px) {
	.arc-list {gap:18px;margin:0 auto;}
	.arc-info {padding:20px 22px 24px;}
}
