@charset "utf-8";

/* ==========================================================================
   한빛시각장애인복지관 데모 — style.css
   ========================================================================== */

:root{
  --amber:#ffb648;
  --amber-d:#f2a02f;
  --yellow:#ffc927;
  --pink:#ff93ce;
  --pink-d:#ee75b8;
  --blue:#4ca6fa;
  --sky:#8ed3f7;
  --teal:#53c6ea;
  --mint:#53c6ca;
  --purple:#97a9eb;
  --lilac:#c1abff;
  --green:#a5db60;
  --bg-cream:#fffbec;
  --bg-pink:#fff6f9;
  --bg-blue:#e8f7ff;
  --bg-green:#f3fcec;
  --ink:#2f2f2f;
  --ink-2:#555;
  --gray:#767676;
  --line:#e5e5e5;
  --w-custom:1380px;
  --hd-h:135px;
  --fs:100%;
  --font:'SUITE','맑은 고딕','Malgun Gothic',dotum,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:var(--fs);}
body{
  margin:0;font-family:var(--font);color:var(--ink);
  font-size:1rem;line-height:1.6;letter-spacing:-.02em;
  background:#fff;overflow-x:hidden;word-break:keep-all;
}
img{max-width:100%;border:0;vertical-align:middle;}
a{color:inherit;text-decoration:none;}
ul,ol,li{margin:0;padding:0;list-style:none;}
dl,dd,dt,p,figure{margin:0;}
h1,h2,h3,h4,h5,h6{margin:0;font-weight:800;line-height:1.3;}
button{font-family:inherit;background:none;border:0;padding:0;color:inherit;cursor:pointer;}
address{font-style:normal;}
svg{display:block;}
svg[viewBox]{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}

.blind{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* 포커스 표시 (접근성) */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{
  outline:3px solid #1a73e8;outline-offset:2px;border-radius:4px;
}

/* 스킵 내비게이션 */
.skip_nav{position:relative;z-index:2000;}
.skip_nav a{
  position:absolute;left:0;top:-100px;width:100%;
  padding:14px 0;text-align:center;background:#222;color:#fff;
  font-size:1rem;font-weight:700;transition:top .2s;
}
.skip_nav a:focus{top:0;}

.w_custom{max-width:var(--w-custom);margin:0 auto;padding:0 20px;}

/* ================================ HEADER ================================ */
#header{
  position:relative;z-index:500;background:#fff;
}
#header .cont{
  position:relative;max-width:var(--w-custom);margin:0 auto;padding:0 20px;
  height:var(--hd-h);display:flex;align-items:center;gap:24px;
}
.logo a,.logo{display:flex;align-items:center;gap:12px;}
.logo_mark{width:50px;height:44px;flex:none;}
.logo_txt{display:flex;flex-direction:column;gap:2px;}
.logo_txt em{font-size:.75rem;font-style:normal;color:var(--gray);letter-spacing:-.03em;}
.logo_txt strong{font-size:1.4rem;font-weight:800;letter-spacing:-.05em;color:#222;}

#gnb{flex:1;display:flex;justify-content:center;}
.gnb{display:flex;align-items:center;}
.gnb > li{position:relative;}
.gnb > li + li::before{
  content:'';position:absolute;left:0;top:50%;width:4px;height:4px;
  border-radius:50%;background:var(--amber);transform:translateY(-50%);
}
.gnb > li > a{
  display:block;padding:calc((var(--hd-h) - 24px)/2) 22px;
  font-size:1.125rem;font-weight:700;letter-spacing:-.04em;line-height:24px;
  transition:color .2s;
}
.gnb > li:hover > a,.gnb > li:focus-within > a{color:var(--amber-d);}
.dep02{
  position:absolute;left:50%;top:100%;transform:translateX(-50%);
  min-width:180px;background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:14px 0;box-shadow:0 12px 26px rgba(0,0,0,.08);
  opacity:0;visibility:hidden;transition:opacity .22s,visibility .22s,top .22s;
}
.gnb > li:hover .dep02,.gnb > li:focus-within .dep02{opacity:1;visibility:visible;}
.dep02 a{display:block;padding:8px 22px;font-size:.95rem;color:var(--ink-2);white-space:nowrap;}
.dep02 a:hover{color:var(--amber-d);background:var(--bg-cream);}

.right_link{display:flex;align-items:center;gap:16px;}
.font_size{display:flex;align-items:center;gap:4px;}
.fs_label{font-size:.75rem;color:var(--gray);margin-right:2px;}
.fs_btn{
  width:30px;height:30px;border:1px solid var(--line);border-radius:8px;
  font-size:.8rem;font-weight:700;color:var(--ink-2);background:#fff;
  display:grid;place-items:center;transition:all .2s;
}
.fs_btn sup{font-size:.6rem;}
.fs_btn:hover{border-color:var(--amber);color:var(--amber-d);}
.fs_btn.on{background:var(--amber);border-color:var(--amber);color:#fff;}
.link_list{display:flex;gap:14px;}
.right_link .link_list a{font-size:.95rem;color:var(--gray);}
.right_link .link_list a:hover{color:var(--ink);}
.menu_trigger{
  width:36px;height:26px;display:flex;flex-direction:column;justify-content:space-between;
}
.menu_trigger span{display:block;height:3px;border-radius:3px;background:#333;transition:.25s;}
.menu_trigger span:nth-child(2){width:80%;margin-left:auto;}

/* 전체메뉴 */
.all_menu{
  position:fixed;right:0;top:0;z-index:1200;width:min(520px,92vw);height:100%;
  background:#fff;transform:translateX(100%);transition:transform .35s ease;
  overflow-y:auto;box-shadow:-8px 0 30px rgba(0,0,0,.12);
}
.all_menu.on{transform:none;}
.all_menu_inner{padding:40px 36px 60px;}
.all_menu_tit{font-size:1.5rem;font-weight:800;margin-bottom:26px;}
.all_menu_close{
  position:absolute;right:26px;top:32px;width:40px;height:40px;
  display:grid;place-items:center;border-radius:50%;background:var(--bg-cream);
}
.all_menu_close svg{width:20px;height:20px;}
.all_menu_list dl{padding:18px 0;border-top:1px solid var(--line);}
.all_menu_list dt{font-size:1.1rem;font-weight:800;margin-bottom:10px;color:var(--amber-d);}
.all_menu_list dd{display:flex;flex-wrap:wrap;gap:8px 18px;}
.all_menu_list dd a{font-size:.95rem;color:var(--ink-2);}
.all_menu_list dd a:hover{color:var(--amber-d);text-decoration:underline;}
.dim{
  position:fixed;inset:0;z-index:1100;background:rgba(0,0,0,.4);
  opacity:0;visibility:hidden;transition:.3s;
}
.dim.on{opacity:1;visibility:visible;}

/* ============================ 메인 비주얼 ============================ */
.visual_swiper{position:relative;background:var(--bg-cream);overflow:hidden;}
.visual_wrap{position:relative;height:820px;}
.visual_slide{
  position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s ease;
}
.visual_slide.on{opacity:1;visibility:visible;}
.visual_slide .thumb{
  position:absolute;inset:0;
  background-image:var(--pc);background-size:cover;background-position:center bottom;
  background-repeat:no-repeat;
}
.visual_slide .txt_wrap{
  position:relative;z-index:2;height:100%;
  display:flex;flex-direction:column;justify-content:center;padding-top:40px;
}
.visual_slide h2{
  font-size:3.5rem;font-weight:800;line-height:1.28;letter-spacing:-.055em;color:#333;
  opacity:0;transform:translateY(24px);
  transition:opacity .7s ease .15s,transform .7s ease .15s;
}
.visual_slide h2 strong{display:inline-block;color:var(--amber);font-weight:800;}
.visual_slide .lead{
  margin-top:26px;font-size:1.125rem;color:#555;letter-spacing:-.03em;
  opacity:0;transform:translateY(24px);
  transition:opacity .7s ease .35s,transform .7s ease .35s;
}
.visual_slide.on h2,.visual_slide.on .lead{opacity:1;transform:none;}

.visual_swiper .controller{
  position:absolute;left:50%;bottom:52px;transform:translateX(-50%);z-index:5;
  display:flex;align-items:center;justify-content:center;gap:6px;width:100%;
}
.swiper_btn{
  width:38px;height:38px;border-radius:10px;background:#fff;color:#555;
  display:grid;place-items:center;box-shadow:0 3px 10px rgba(0,0,0,.08);transition:.2s;
}
.swiper_btn:hover{background:var(--amber);color:#fff;}
.swiper_btn svg{width:18px;height:18px;}
.play_btn .ico_play{display:none;}
.play_btn.is-paused .ico_play{display:block;}
.play_btn.is-paused .ico_pause{display:none;}
.v_count{
  margin-left:14px;font-size:.9rem;color:#555;font-weight:600;
  background:rgba(255,255,255,.8);padding:6px 14px;border-radius:999px;
}

/* ============================ 바로가기 메뉴 ============================ */
.main_category{padding:64px 0 96px;}
.main_category .menu_list{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:22px;
}
.main_category .menu_list a{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  padding:34px 12px;border-radius:20px;background:#f7f7f5;
  transition:background-color .25s,transform .25s,box-shadow .25s;
  min-height:200px;text-align:center;
}
.main_category .menu_list a:hover{
  background:#fff;transform:translateY(-6px);box-shadow:0 14px 26px rgba(0,0,0,.08);
}
.main_category .ico{width:52px;height:52px;display:grid;place-items:center;}
.main_category .ico svg{width:52px;height:52px;stroke-width:2.2;}
.ico.c1{color:var(--pink-d);}
.ico.c2{color:var(--amber);}
.ico.c3{color:var(--blue);}
.ico.c4{color:var(--mint);}
.ico.c5{color:var(--pink);}
.ico.c6{color:var(--purple);}
.main_category .tit{font-size:1.0625rem;font-weight:700;letter-spacing:-.04em;}

/* ============================ 복지관 소식 ============================ */
.main_welfare{padding:0 0 100px;}
.main_welfare .w_custom{display:grid;grid-template-columns:minmax(0,1020fr) minmax(0,330fr);gap:30px;}
.main_title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;}
.main_title h3{font-size:1.9rem;font-weight:800;letter-spacing:-.05em;}
.main_title h3 strong{color:var(--amber);}
.main_title .link{display:flex;align-items:center;gap:22px;}
.tab_list{display:flex;gap:18px;}
.tab_list button{
  position:relative;font-size:1rem;font-weight:600;color:var(--gray);padding:4px 2px;
  transition:color .2s;
}
.tab_list button.on{color:var(--ink);font-weight:800;}
.tab_list button.on::after{
  content:'';position:absolute;right:-7px;top:2px;width:5px;height:5px;
  border-radius:50%;background:var(--pink);
}
.all_more{
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);
  display:grid;place-items:center;color:var(--ink-2);transition:.22s;
}
.all_more svg{width:15px;height:15px;}
.all_more:hover{background:var(--amber);border-color:var(--amber);color:#fff;transform:rotate(90deg);}

.tab_cont{
  margin-top:24px;border:1px solid var(--line);border-radius:22px;padding:14px 32px;
  background:#fff;
}
.board_list li + li{border-top:1px solid #f0f0f0;}
.board_list a{display:flex;align-items:center;gap:18px;padding:17px 4px;}
.board_list .icon{
  flex:none;min-width:78px;text-align:center;padding:6px 12px;border-radius:999px;
  font-size:.8125rem;font-weight:700;color:#fff;
}
.icon.pink{background:var(--pink-d);}
.icon.yellow{background:var(--amber);}
.icon.blue{background:var(--blue);}
.icon.purple{background:var(--purple);}
.board_list .tt{
  flex:1 1 auto;min-width:0;font-size:1rem;font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.board_list .tt em{
  font-style:normal;font-weight:700;color:var(--amber-d);margin-right:6px;
}
.board_list .tt em::before{content:'[';}
.board_list .tt em::after{content:']';}
.board_list time{flex:none;font-size:.9rem;color:var(--gray);}
.board_list a:hover .tt{color:var(--amber-d);text-decoration:underline;}

.letter .main_title{align-items:center;}
.letter_card{
  display:block;margin-top:24px;border:1px solid var(--line);border-radius:22px;
  overflow:hidden;background:#fff;transition:box-shadow .25s,transform .25s;
}
.letter_card:hover{box-shadow:0 14px 28px rgba(0,0,0,.08);transform:translateY(-4px);}
.letter_card .thumb{display:block;height:286px;overflow:hidden;background:#fbe9ef;}
.letter_card .thumb img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.letter_card .info{display:block;padding:20px 22px 24px;}
.letter_card strong{
  display:block;font-size:1rem;font-weight:700;letter-spacing:-.04em;line-height:1.45;
}
.letter_card em{
  display:block;margin-top:8px;font-size:.85rem;font-style:normal;color:var(--gray);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}

/* ============================ 함께 참여해요 ============================ */
.main_participation{background:var(--bg-pink);padding:110px 0 120px;position:relative;overflow:hidden;}
.main_participation::before{
  content:'';position:absolute;right:-90px;top:60px;width:340px;height:340px;
  border:64px solid rgba(255,147,206,.09);border-radius:50%;
}
.main_title.cen{flex-direction:column;align-items:center;text-align:center;gap:0;}
.main_title.cen .illust{display:block;width:124px;margin-bottom:6px;}
.main_title.cen h2{font-size:2.5rem;font-weight:800;letter-spacing:-.05em;}
.main_title.cen h2 strong{color:var(--pink-d);}
.main_title.cen h2 em{font-style:normal;color:var(--teal);}
.main_title.cen p{margin-top:14px;font-size:1.0625rem;color:var(--ink-2);}

.parti_wrap,.share_wrap{position:relative;margin-top:44px;display:flex;align-items:center;gap:18px;}
.swiper_arw{
  flex:none;width:52px;height:52px;border-radius:50%;background:#fff;color:#555;
  display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.09);transition:.22s;
}
.swiper_arw svg{width:20px;height:20px;}
.swiper_arw:hover{background:var(--pink-d);color:#fff;}
.share_wrap .swiper_arw:hover{background:var(--teal);color:#fff;}
.swiper_arw:disabled{opacity:.35;cursor:default;}
.swiper_arw:disabled:hover{background:#fff;color:#555;}

.parti_swiper,.share_swiper{flex:1 1 auto;min-width:0;overflow:hidden;}
.gallery_list{display:flex;gap:32px;transition:transform .55s cubic-bezier(.22,.61,.36,1);}
.parti_swiper .gallery_list > li{flex:0 0 286px;}
.gallery_list a{display:block;}
.gallery_list .thumb{
  display:block;position:relative;width:100%;height:290px;border-radius:18px;overflow:hidden;
  background:#eee;
}
.gallery_list .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s;}
.gallery_list a:hover .thumb img{transform:scale(1.06);}
.gallery_list .info{display:block;padding:18px 4px 0;}
.gallery_list .info strong{
  display:block;font-size:1rem;font-weight:700;line-height:1.45;letter-spacing:-.04em;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.gallery_list .info em{
  display:block;margin-top:8px;font-size:.875rem;font-style:normal;color:var(--gray);
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}
.gallery_list a:hover .info strong{color:var(--pink-d);}
.share_track a:hover .info strong{color:var(--teal);}

/* 그라디언트 포스터 썸네일 */
.thumb.art{display:grid;place-items:center;}
.thumb.art svg{width:44%;height:auto;color:rgba(255,255,255,.95);stroke-width:2.4;}
.thumb.a1{background:linear-gradient(140deg,#ffd9a0,#ffb648);}
.thumb.a2{background:linear-gradient(140deg,#c9b4ff,#8f7ae8);}
.thumb.a3{background:linear-gradient(140deg,#6f6a8f,#33304a);}
.thumb.a4{background:linear-gradient(140deg,#ffe07a,#ffc927);}
.thumb.a5{background:linear-gradient(140deg,#a9d8ff,#4ca6fa);}
.thumb.a6{background:linear-gradient(140deg,#bdeb9a,#7cc94a);}
.thumb.a7{background:linear-gradient(140deg,#d9e7c4,#8fbf7a);}
.thumb.a8{background:linear-gradient(140deg,#8fe3f5,#2fb6dd);}
.thumb.v1{background:linear-gradient(140deg,#9be0b4,#3fb67c);}
.thumb.v2{background:linear-gradient(140deg,#ffc9dd,#f07fae);}
.thumb.v3{background:linear-gradient(140deg,#b0c6ff,#6f8de0);}
.thumb.v4{background:linear-gradient(140deg,#ffd2a6,#f59b4a);}
.thumb.s1{background:linear-gradient(140deg,#ffe2a8,#ffb648);}
.thumb.s2{background:linear-gradient(140deg,#a9e5ff,#4ca6fa);}
.thumb.s3{background:linear-gradient(140deg,#ffbcd7,#ee75b8);}
.thumb.s4{background:linear-gradient(140deg,#c8f0b9,#83c95f);}
.thumb.s5{background:linear-gradient(140deg,#d4c9ff,#9b86ee);}
.thumb.s6{background:linear-gradient(140deg,#9ee6e0,#3fb8ae);}

/* ============================ 함께 공유해요 ============================ */
.main_share{padding:120px 0 150px;position:relative;overflow:hidden;}
.main_share::before{
  content:'';position:absolute;left:-120px;top:120px;width:300px;height:300px;
  border:56px solid rgba(83,198,234,.08);border-radius:50%;
}
.main_share .w_custom{position:relative;z-index:2;}
.main_share .tab_wrap{margin-top:36px;display:flex;justify-content:center;}
.main_share .tab_list{
  display:flex;gap:10px;background:var(--bg-blue);padding:8px;border-radius:999px;
}
.main_share .tab_list button{
  padding:10px 30px;border-radius:999px;font-size:1rem;font-weight:700;color:var(--ink-2);
  transition:.22s;
}
.main_share .tab_list button.on{background:var(--teal);color:#fff;}
.main_share .tab_list button.on::after{display:none;}
.share_swiper .item{display:none;}
.share_swiper .item.on{display:block;}
.share_track > li{flex:0 0 386px;}
.share_track .thumb{height:245px;}
.thumb .play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:62px;height:62px;border-radius:50%;background:rgba(0,0,0,.55);
  display:block;
}
.thumb .play::after{
  content:'';position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);
  border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;
}

/* ============================ 사업 안내 ============================ */
.main_business{background:var(--bg-cream);padding:96px 0 104px;}
.main_business .main_title{align-items:flex-end;margin-bottom:42px;}
.main_business .main_title h2{
  display:flex;align-items:center;gap:12px;
  font-size:2.3rem;font-weight:800;letter-spacing:-.05em;
}
.main_business .main_title h2 b{color:var(--amber);}
.main_business .vec{width:60px;height:24px;color:var(--green);stroke-width:2.6;}
.main_business .main_title p{font-size:1.0625rem;color:var(--ink-2);text-align:right;}
.main_business .menu_list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;}
.main_business .menu_list a{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
  min-height:170px;padding:30px 12px;border-radius:20px;background:#fff;text-align:center;
  transition:transform .25s,box-shadow .25s;
}
.main_business .menu_list a:hover{transform:translateY(-6px);box-shadow:0 14px 26px rgba(0,0,0,.08);}
.main_business .ico{width:54px;height:54px;}
.main_business .ico svg{width:54px;height:54px;stroke-width:2.2;}
.main_business .tit{font-size:1.0625rem;font-weight:700;letter-spacing:-.04em;}

/* ============================ 후원 / 자원봉사 ============================ */
.main_event{padding:96px 0 110px;}
.bnr_list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
.bnr{
  position:relative;border-radius:26px;padding:52px 48px;min-height:280px;overflow:hidden;
  display:flex;align-items:center;
}
.bnr.b1{background:linear-gradient(120deg,#fff0f6,#ffe1ef);}
.bnr.b2{background:linear-gradient(120deg,#eaf6ff,#dbefff);}
.bnr h3{font-size:2rem;font-weight:800;letter-spacing:-.05em;}
.bnr p{margin-top:14px;font-size:1.0625rem;color:var(--ink-2);}
.more_btn{
  display:inline-flex;align-items:center;gap:10px;margin-top:28px;
  height:50px;padding:0 26px;border-radius:999px;background:#fff;
  font-size:.95rem;font-weight:700;transition:.22s;
}
.more_btn svg{width:17px;height:17px;}
.bnr.b1 .more_btn:hover{background:var(--pink-d);color:#fff;}
.bnr.b2 .more_btn:hover{background:var(--blue);color:#fff;}
.bnr_ico{position:absolute;right:26px;bottom:-16px;width:190px;height:190px;opacity:.5;}
.bnr_ico svg{width:100%;height:100%;stroke-width:3;}
.bnr.b1 .bnr_ico{color:var(--pink);}
.bnr.b2 .bnr_ico{color:var(--sky);}

/* ============================ 함께하는 기관 ============================ */
.main_agency{padding:0 0 110px;}
.main_agency .main_title{align-items:center;margin-bottom:26px;}
.main_agency .main_title h3{font-size:1.25rem;font-weight:700;color:var(--ink-2);}
.main_agency .controller{display:flex;gap:6px;}
.partner_swiper{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;}
.partner_swiper ul{display:flex;gap:20px;transition:transform .5s ease;}
.partner_swiper li{flex:0 0 196px;}
.partner_swiper span{
  display:flex;align-items:center;justify-content:center;height:60px;padding:0 10px;
  border:1px solid var(--line);border-radius:12px;background:#fafafa;
  font-size:.875rem;font-weight:600;color:#8a8a8a;text-align:center;line-height:1.3;
  transition:.22s;
}
.partner_swiper li:hover span{color:var(--ink);border-color:var(--amber);background:#fff;}

/* ================================ FOOTER ================================ */
#footer{position:relative;background:transparent;padding:190px 0 60px;margin-top:-110px;}
#footer::after{
  content:'';position:absolute;left:0;right:0;top:168px;bottom:0;
  background:var(--bg-green);z-index:0;
}
.ftr_path{position:absolute;left:0;top:0;width:100%;height:170px;z-index:1;}
.ftr_path path{fill:var(--bg-green);stroke:none;}
#footer .w_custom{position:relative;z-index:2;}
#footer .top_sec{
  display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  padding-bottom:26px;border-bottom:1px solid rgba(0,0,0,.08);
}
#footer .link_list{display:flex;gap:26px;flex-wrap:wrap;}
#footer .link_list a{font-size:.95rem;color:var(--ink-2);}
#footer .link_list a:hover{color:var(--amber-d);}

#footer .agree{
  display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
  margin-top:30px;padding:26px 34px;border-radius:20px;background:#fff;
}
.agree_list{display:flex;gap:40px;flex-wrap:wrap;}
.agree_list dl{display:flex;align-items:baseline;gap:14px;}
.agree_list dt{font-size:.95rem;font-weight:600;color:var(--ink-2);}
.agree_list dd{font-size:1.4rem;font-weight:800;letter-spacing:-.04em;}
.bullet_list{margin-top:12px;}
.bullet_list li{position:relative;padding-left:12px;font-size:.875rem;color:var(--gray);}
.bullet_list li::before{content:'·';position:absolute;left:2px;}
.blank_list{display:flex;gap:10px;}
.blank_list a{
  width:44px;height:44px;border-radius:50%;background:#4a4a4a;color:#fff;
  display:grid;place-items:center;transition:.22s;
}
.blank_list a:hover{background:var(--amber);}
.blank_list svg{width:22px;height:22px;stroke-width:1.6;}

#footer .info{
  margin-top:28px;display:flex;align-items:flex-start;justify-content:space-between;
  gap:30px;flex-wrap:wrap;
}
.exp_list li{display:flex;gap:22px;flex-wrap:wrap;font-size:.9rem;color:var(--ink-2);}
.exp_list dl{display:flex;}
.exp_list dt{font-weight:600;}
.exp_list .copy{margin-top:12px;display:block;}
.copyright{font-size:.875rem;color:var(--gray);}
.designed{font-size:.8125rem;color:#a8b0a0;margin-top:2px;}

.family_site{position:relative;width:240px;}
.fs_toggle{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;
  height:52px;padding:0 20px;border:1px solid rgba(0,0,0,.14);border-radius:12px;
  background:#fff;font-size:.95rem;font-weight:700;
}
.fs_toggle svg{width:17px;height:17px;transition:transform .25s;}
.family_site.on .fs_toggle svg{transform:rotate(180deg);}
.family_site ul{
  position:absolute;left:0;bottom:56px;width:100%;max-height:260px;overflow-y:auto;
  background:#fff;border:1px solid rgba(0,0,0,.12);border-radius:12px;padding:8px 0;
  box-shadow:0 10px 24px rgba(0,0,0,.1);
}
.family_site a{display:block;padding:9px 20px;font-size:.9rem;}
.family_site a:hover{background:var(--bg-green);color:var(--amber-d);}

.demo_note{margin-top:26px;font-size:.6875rem;color:#a9b3a2;}

/* 최상단 버튼 */
.btn_top{
  position:fixed;right:28px;bottom:28px;z-index:600;width:52px;height:52px;border-radius:50%;
  background:var(--amber);color:#fff;display:grid;place-items:center;
  box-shadow:0 8px 18px rgba(0,0,0,.16);
  opacity:0;visibility:hidden;transform:translateY(12px);transition:.3s;
}
.btn_top.on{opacity:1;visibility:visible;transform:none;}
.btn_top svg{width:20px;height:20px;}

/* 스크롤 등장 모션 */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease;}
.reveal.is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .visual_slide h2,.visual_slide .lead{opacity:1;transform:none;transition:none;}
  html{scroll-behavior:auto;}
}

/* ================================ 반응형 ================================ */
@media (max-width:1280px){
  :root{--hd-h:110px;}
  .gnb > li > a{padding:calc((var(--hd-h) - 24px)/2) 14px;font-size:1.0625rem;}
  .font_size{display:none;}
  .visual_wrap{height:700px;}
  .visual_slide h2{font-size:2.8rem;}
  .main_category .menu_list{grid-template-columns:repeat(3,minmax(0,1fr));}
  .main_welfare .w_custom{grid-template-columns:minmax(0,1fr);}
  .letter_card{display:flex;gap:22px;}
  .letter_card .thumb{flex:0 0 220px;height:240px;}
  .letter_card .info{flex:1 1 auto;min-width:0;align-self:center;}
}

@media (max-width:1024px){
  :root{--hd-h:82px;}
  #gnb,.right_link .link_list{display:none;}
  .logo_txt strong{font-size:1.2rem;}
  .logo_mark{width:42px;height:38px;}
  .visual_wrap{height:600px;}
  .visual_slide h2{font-size:2.3rem;}
  .visual_slide .lead{font-size:1rem;}
  .main_participation,.main_share{padding:80px 0 90px;}
  .main_business .menu_list{grid-template-columns:repeat(3,minmax(0,1fr));}
  .main_business .main_title{flex-direction:column;align-items:flex-start;gap:12px;}
  .main_business .main_title p{text-align:left;}
  .bnr_list{grid-template-columns:minmax(0,1fr);}
  .share_track > li{flex:0 0 320px;}
  .share_track .thumb{height:205px;}
  #footer{padding:150px 0 50px;}
  .exp_list li{gap:6px 18px;}
}

@media (max-width:767px){
  :root{--hd-h:66px;}
  .w_custom{padding:0 20px;}
  .logo_txt em{display:none;}
  .logo_txt strong{font-size:1.05rem;}

  .visual_wrap{height:auto;}
  .visual_slide{position:relative;inset:auto;display:none;}
  .visual_slide.on{display:block;}
  .visual_slide .thumb{
    position:absolute;inset:0;background-image:var(--mo);
    background-size:cover;background-position:center bottom;
  }
  .visual_slide .txt_wrap{height:auto;min-height:520px;padding:44px 0 160px;justify-content:flex-start;}
  .visual_slide h2{font-size:1.75rem;}
  .visual_slide .lead{margin-top:16px;font-size:.9375rem;}
  .visual_swiper .controller{bottom:26px;}
  .v_count{display:none;}
  .for_m{display:block;}

  .main_category{padding:40px 0 44px;}
  .main_category .menu_list{gap:12px;}
  .main_category .menu_list a{min-height:120px;padding:22px 8px;gap:10px;border-radius:16px;}
  .main_category .ico,.main_category .ico svg{width:40px;height:40px;}
  .main_category .tit{font-size:.9rem;}

  .main_welfare{padding:0 0 60px;}
  .main_title h3{font-size:1.5rem;}
  .main_title .link{gap:12px;flex-wrap:wrap;}
  .tab_list{gap:12px;overflow-x:auto;}
  .main_welfare .main_title{flex-direction:column;align-items:flex-start;gap:14px;}
  .tab_cont{padding:6px 18px;border-radius:16px;}
  .board_list a{gap:10px;padding:14px 2px;flex-wrap:wrap;}
  .board_list .icon{min-width:64px;font-size:.72rem;padding:4px 10px;order:1;}
  .board_list time{order:2;font-size:.78rem;margin-left:auto;}
  .board_list .tt{order:3;flex:1 1 100%;white-space:normal;font-size:.9375rem;}
  .letter_card{display:block;}
  .letter_card .thumb{height:230px;}

  .main_participation{padding:56px 0 64px;}
  .main_share{padding:56px 0 64px;}
  .main_title.cen h2{font-size:1.7rem;}
  .main_title.cen .illust{width:92px;}
  .main_title.cen p{font-size:.9375rem;}
  .parti_wrap,.share_wrap{gap:0;margin-top:28px;}
  .parti_wrap .swiper_arw,.share_wrap .swiper_arw{display:none;}
  .gallery_list{gap:16px;}
  .parti_swiper .gallery_list > li{flex:0 0 220px;}
  .gallery_list .thumb{height:225px;}
  .share_track > li{flex:0 0 260px;}
  .share_track .thumb{height:165px;}
  .main_share .tab_list button{padding:8px 18px;font-size:.9rem;}

  .main_business{padding:56px 0 60px;}
  .main_business .main_title h2{font-size:1.6rem;}
  .main_business .menu_list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .main_business .menu_list a{min-height:130px;gap:12px;}
  .main_business .ico,.main_business .ico svg{width:42px;height:42px;}

  .main_event{padding:56px 0 60px;}
  .bnr{padding:34px 26px;min-height:0;border-radius:20px;}
  .bnr h3{font-size:1.4rem;}
  .bnr p{font-size:.9375rem;}
  .bnr_ico{width:120px;height:120px;right:-6px;bottom:-20px;}
  .more_btn{height:44px;padding:0 20px;margin-top:20px;}

  .main_agency{padding:0 0 60px;}
  .partner_swiper li{flex:0 0 150px;}
  .partner_swiper span{height:52px;font-size:.78rem;}

  #footer{padding:110px 0 40px;margin-top:-50px;}
  .ftr_path{height:90px;}
  #footer::after{top:88px;}
  #footer .top_sec{flex-direction:column;align-items:flex-start;gap:18px;}
  #footer .agree{flex-direction:column;align-items:flex-start;padding:22px;gap:20px;}
  .agree_list{flex-direction:column;gap:10px;}
  .agree_list dd{font-size:1.2rem;}
  #footer .info{flex-direction:column;}
  .family_site{width:100%;}
  .family_site ul{bottom:auto;top:56px;}
  .btn_top{right:16px;bottom:16px;width:44px;height:44px;}
}

@media (max-width:389px){
  .visual_slide h2{font-size:1.55rem;}
  .main_title.cen h2{font-size:1.5rem;}
}