@charset "utf-8";
/* =====================================================================
   전라남도수영연맹 통합관리시스템 - 공통 스타일
   ===================================================================== */

:root{
  --navy:#0b3d6b;
  --navy-d:#082c4e;
  --blue:#1668b3;
  --blue-l:#e8f1f9;
  --aqua:#00a0c6;
  --red:#d93025;
  --green:#0f8a4d;
  --orange:#e07b00;
  --gray:#6b7280;
  --line:#dfe3e8;
  --line-d:#c2c8d0;
  --bg:#f5f7fa;
  --text:#222;
  --text-l:#555;
  --radius:4px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Malgun Gothic","맑은 고딕",-apple-system,"Apple SD Gothic Neo",
              "Noto Sans KR",sans-serif;
  font-size:14px; line-height:1.6; color:var(--text); background:#fff;
  -webkit-text-size-adjust:100%;
}
img{max-width:100%;height:auto;vertical-align:middle;border:0}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:none}

/* 메뉴·로고 등 내비게이션 성격의 링크는 마우스를 올려도 밑줄을 그리지 않는다.
   (본문 안의 일반 링크는 밑줄을 그대로 유지한다) */
.gnb a:hover,
.lnb a:hover,
.util-bar a:hover,
.logo:hover,
.logo a:hover,
.quick a:hover,
.foot a:hover,
.paging a:hover,
.btn:hover,
.hero-btn a:hover,
.card h3 a:hover,
.ct-list .info .t:hover{text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,h5{margin:0;font-weight:700;line-height:1.35}
table{border-collapse:collapse;width:100%}
input,select,textarea,button{font-family:inherit;font-size:14px}
hr{border:0;border-top:1px solid var(--line);margin:20px 0}

.skip{position:absolute;left:-9999px}
.skip:focus{left:0;top:0;z-index:9999;background:var(--navy);color:#fff;padding:8px 14px}

.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.clearfix::after{content:"";display:block;clear:both}

/* ---------- 헤더 ---------- */
.util-bar{background:var(--navy-d);color:#c8d9ea;font-size:12px}
.util-bar .wrap{display:flex;justify-content:flex-end;align-items:center;gap:14px;height:32px}
.util-bar a{color:#c8d9ea}
.util-bar a:hover{color:#fff}
.util-bar .me{color:#fff;font-weight:700}

/* ---- 로그인 사용자 메뉴 (상단 바 오른쪽) ---------------------------- */
.util-bar{position:relative;z-index:90}
.umenu{position:relative}
.umenu .utrig{display:flex;align-items:center;gap:7px;height:32px;padding:0 6px;
  background:none;border:0;color:#c8d9ea;font-size:12px;font-family:inherit;cursor:pointer}
.umenu .utrig b{color:#fff;font-weight:700}
.umenu .utrig:hover b{text-decoration:underline}
/* 펼침 표시 ▾ : 열리면 뒤집는다 */
.umenu .utrig .cv{width:0;height:0;border:4px solid transparent;border-top-color:#9db4cd;
  margin-top:3px;transition:transform .15s}
.umenu.open .utrig .cv{transform:rotate(180deg);margin-top:-3px}

/* 사진 자리. 사진이 없으면 이름 첫 글자를 보여 준다 */
.umenu .ava{display:block;width:40px;height:40px;border-radius:50%;overflow:hidden;
  flex:0 0 auto;background:#e6edf5;position:relative}
.umenu .ava img{width:100%;height:100%;object-fit:cover;display:block}
.umenu .ava em{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-style:normal;font-weight:700;color:var(--navy);font-size:16px}
.umenu .ava.sm{width:22px;height:22px}
.umenu .ava.sm em{font-size:11px}

.umenu .ubox{position:absolute;right:0;top:calc(100% + 6px);width:280px;z-index:200;
  background:#fff;border:1px solid var(--line);border-radius:8px;
  box-shadow:0 8px 24px rgba(20,35,60,.18);color:#333;text-align:left;overflow:hidden}
.umenu .uhd{display:flex;align-items:center;gap:11px;padding:14px;background:#f7f9fb;
  border-bottom:1px solid var(--line)}
.umenu .uhd .ut{min-width:0;line-height:1.35}
.umenu .uhd .l1{display:flex;align-items:center;gap:6px}
.umenu .uhd .l1 b{font-size:14px;color:#1f2a37;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 권한은 이름 옆 작은 표시로 둔다 */
.umenu .uhd .rol{flex:0 0 auto;padding:1px 7px;border-radius:10px;font-style:normal;
  font-size:10.5px;font-weight:700;color:var(--blue);background:var(--blue-l);
  border:1px solid #cfe2f3;white-space:nowrap}
.umenu .uhd .l2{display:block;margin-top:3px;font-size:11.5px;color:var(--gray);
  line-height:1.4;word-break:keep-all}
.umenu .ubox ul{padding:5px 0}
.umenu .ubox a{display:block;padding:9px 14px;font-size:13px;color:#333}
.umenu .ubox a:hover{background:#eef4fa;color:var(--navy)}
.umenu .ufoot{border-top:1px solid var(--line)}
.umenu .ufoot a{color:#c0392b}
.umenu .ufoot a:hover{background:#fdecea;color:#a1271c}

.head{border-bottom:1px solid var(--line);background:#fff}
.head .wrap{display:flex;align-items:center;gap:24px;height:78px}
.logo{display:flex;align-items:center;gap:10px;flex:0 0 auto}
/* 연맹 로고 (assets/img/logo.png, 원형 마크) */
.logo .mark{
  width:46px;height:46px;display:block;flex:0 0 auto;
  object-fit:contain;border-radius:50%;
}
.logo .txt{line-height:1.2}
.logo .txt b{display:block;font-size:16px;white-space:nowrap}

/* 단체명 로고 표기 (lib/html.php 의 site_nm_brand()) — 모든 화면이 함께 쓴다
   "전남광주" · "수영연맹" 은 진한 남색, "통합특별시" 는 밝은 파란색.
   어두운 바탕(.on-dark)에서는 흰 글자에 하늘빛 파랑으로 바꿔 읽히게 한다. */
.nm-brand{font-family:"Pretendard Variable",Pretendard,"Malgun Gothic","맑은 고딕",sans-serif;
  font-weight:800;letter-spacing:-.02em;color:#0b2e6f}
.nm-brand em{font-style:normal;color:#1a5fe2}
.nm-brand.on-dark{color:#fff}
.nm-brand.on-dark em{color:#7ab8ff}
/* 영문 표기를 한글 단체명과 똑같은 폭에 한 줄로 맞춘다.
   폭은 한글 줄이 정하고(width:0 + min-width:100%), 영문은 가로로 눌러 그 폭을 채운다.
   눌리는 비율은 swim.js 가 두 줄의 실제 폭을 재서 정한다.
   JS 가 안 돌아도 아래 기본값(.8)으로 거의 맞는다. */
.logo .txt .en{display:block;width:0;min-width:100%;overflow:hidden;
  font-size:10px;line-height:1.5;letter-spacing:0;color:var(--gray)}
.logo .txt .en i{display:inline-block;white-space:nowrap;font-style:normal;
  transform-origin:left center;transform:scaleX(.8)}

/* ---------- GNB ---------- */
.gnb{flex:1 1 auto}
.gnb>ul{display:flex;justify-content:flex-end;gap:6px}
.gnb>ul>li{position:relative}
.gnb>ul>li>a{
  display:block;padding:0 18px;line-height:78px;font-size:16px;
  font-weight:700;color:#1a1a1a;white-space:nowrap;
}
.gnb>ul>li:hover>a,.gnb>ul>li.on>a{color:var(--blue)}
.gnb .sub{
  display:none;position:absolute;left:50%;transform:translateX(-50%);top:78px;
  min-width:160px;background:#fff;border:1px solid var(--line);
  box-shadow:0 6px 18px rgba(0,0,0,.08);padding:8px 0;z-index:60;border-radius:var(--radius);
}
.gnb>ul>li:hover .sub,.gnb>ul>li:focus-within .sub{display:block}
.gnb .sub a{display:block;padding:7px 16px;font-size:13.5px;color:#333;white-space:nowrap}
.gnb .sub a:hover{background:var(--blue-l);color:var(--blue);text-decoration:none}

.mo-btn{display:none;width:40px;height:40px;border:1px solid var(--line);
  background:#fff;border-radius:var(--radius);cursor:pointer;font-size:18px}

/* ---------- 서브 페이지 ---------- */
/* 서브 상단 — 메인 비주얼(.hero)과 같은 수영장 사진 · 남색 덮개 · 물결을 작은 크기로 */
.sub-top{position:relative;overflow:hidden;color:#fff;
  background:#0b3d6b url(../img/hero-pool.jpg) center 62% / cover no-repeat}
.sub-top::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(6,38,68,.94) 0%, rgba(11,61,107,.86) 38%,
    rgba(13,92,138,.55) 66%, rgba(0,160,198,.22) 100%)}
.sub-top .wrap{position:relative;z-index:1;padding:28px 16px 38px}
.sub-top h2{font-size:26px;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.3)}
.sub-top .bc{margin-top:6px;font-size:12.5px;color:#cfe6f5;text-shadow:0 1px 8px rgba(0,0,0,.3)}
.sub-top .bc a{color:#cfe6f5}
.sub-top .bc a:hover{color:#fff}
.sub-top .bc .cur{color:#8fe3ff;font-weight:700}   /* 지금 페이지만 메인의 하늘색으로 */
.sub-top .sub-wave{position:absolute;left:0;right:0;bottom:-1px;z-index:2;line-height:0}
.sub-top .sub-wave svg{display:block;width:100%;height:26px}
/* 둥근 선수 사진 창 (메인 모바일 시안 B-2 와 같은 사진·물결 동그라미)
   배너보다 큰 창을 오른쪽에 두어 위·아래가 배너 밖으로 잘리고, 아랫부분은 흰 물결이 덮는다.
   PC 는 본문 폭(1200px) 오른쪽 끝에 맞춘다. 태블릿·모바일은 화면 오른쪽 가장자리에 반쯤 걸친다.
   크기·위치만 화면별로 바꾼다 — 아래 "메인 히어로 — 태블릿", "서브 상단 — 모바일" */
.sub-top .sub-lens{position:absolute;z-index:0;top:50%;transform:translateY(-54%);
  right:max(-40px, calc((100% - 1200px) / 2 - 10px));width:210px;height:210px}
.sub-top .sub-lens .ph{position:absolute;inset:0;border-radius:50%;
  background:#0b3d6b url(../img/hero-swimmer-lens.jpg) 30% center / cover no-repeat;
  border:5px solid rgba(255,255,255,.9);box-shadow:0 10px 26px rgba(0,20,40,.45)}
.sub-top .sub-lens::before,.sub-top .sub-lens::after{content:"";position:absolute;border-radius:50%;
  pointer-events:none;border:2px solid rgba(143,227,255,.40)}
.sub-top .sub-lens::before{inset:-14px}
.sub-top .sub-lens::after{inset:-30px;border-color:rgba(143,227,255,.2)}

.lnb{border-bottom:1px solid var(--line);background:#fff}
.lnb ul{display:flex;flex-wrap:wrap;max-width:1200px;margin:0 auto;padding:0 16px}
.lnb li a{display:block;padding:12px 18px;font-size:14px;color:#444;border-bottom:2px solid transparent}
.lnb li a:hover{color:var(--blue);text-decoration:none}
.lnb li.on a{color:var(--blue);font-weight:700;border-bottom-color:var(--blue)}

main{min-height:420px;padding:30px 0 60px}
.page-title{font-size:20px;color:var(--navy);margin-bottom:14px;padding-bottom:10px;
  border-bottom:2px solid var(--navy)}

/* 제목 밑줄(진한 선) 바로 다음에 표·목록의 진한 윗줄이 오면
   같은 굵기의 선이 두 줄로 나란히 보인다.
   앞의 제목 줄은 진하게 두고, 뒤따르는 쪽만 연한 1px 로 낮춘다. */
.page-title + .ct-list,
.page-title + .ct-sch-head,
.page-title + .tbl,
.page-title + .tbl-form,
.page-title + .view-head,
.page-title + .tbl-wrap > .tbl,
.page-title + .tbl-wrap > .tbl-form,
.page-head + .tbl-wrap > .tbl,
.page-head + .tbl-wrap > .tbl-form{border-top:1px solid var(--line)}

/* 제목과 버튼을 한 줄에 — 진한 남색 선은 이 줄 아래 하나만 긋는다.
   좁은 화면에서 자리가 모자라면 버튼이 제목 아래로 내려간다. */
.page-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  gap:8px 16px;margin-bottom:14px;padding-bottom:10px;border-bottom:2px solid var(--navy)}
.page-head .page-title{margin:0;padding:0;border:0}
.page-head .btns{margin:0}

/* 제목과 표 사이에 div·form 이 끼어 인접 선택자가 닿지 않는 화면(로그인·회원가입·내정보)은
   해당 표에 under-title 을 직접 지정한다. */
.tbl.under-title,
.tbl-form.under-title{border-top:1px solid var(--line)}
.sec-title{font-size:16px;color:var(--navy);margin:26px 0 10px}
.sec-title:first-child{margin-top:0}

/* ---------- 배지 ---------- */
.badge{display:inline-block;min-width:54px;text-align:center;padding:3px 9px;
  border-radius:12px;font-size:12px;font-weight:700;color:#fff;line-height:1.5}
.bg-red{background:var(--red)}
.bg-blue{background:var(--blue)}
.bg-green{background:var(--green)}
.bg-gray{background:#9aa3ad}
.bg-dark{background:#4b5563}
.bg-orange{background:var(--orange)}

/* ---------- 테이블 ---------- */
.tbl{border-top:2px solid var(--navy);font-size:13.5px}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:11px 8px;text-align:center}
.tbl thead th{background:#f7f9fb;color:#333;font-weight:700;white-space:nowrap}
.tbl td.l,.tbl th.l{text-align:left}
.tbl td.r,.tbl th.r{text-align:right}
.tbl tbody tr:hover{background:#fafcfe}
.tbl .none{padding:48px 0;color:var(--gray)}
.tbl .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.tbl-wrap{overflow-x:auto}

.tbl-form{border-top:2px solid var(--navy);font-size:13.5px}
.tbl-form th,.tbl-form td{border-bottom:1px solid var(--line);padding:9px 12px;text-align:left}
.tbl-form th{background:#f7f9fb;width:150px;font-weight:700;color:#333;vertical-align:middle}
.tbl-form .req::after{content:" *";color:var(--red)}
.tbl-form .help{display:block;margin-top:4px;font-size:12px;color:var(--gray)}

/* ---------- 폼 ---------- */
.f{border:1px solid var(--line-d);border-radius:var(--radius);padding:6px 9px;
  background:#fff;color:var(--text);max-width:100%}
.f:focus{outline:2px solid rgba(22,104,179,.35);outline-offset:0;border-color:var(--blue)}
.f[readonly],.f[disabled]{background:#f3f4f6;color:#666}
.f.w50{width:50px}.f.w80{width:80px}.f.w120{width:120px}.f.w160{width:160px}
.f.w220{width:220px}.f.w320{width:320px}.f.full{width:100%}
select.f{padding:6px 6px}
textarea.f{width:100%;min-height:110px;resize:vertical}
label.ck{display:inline-flex;align-items:center;gap:5px;margin-right:14px;cursor:pointer}

/* ---------- 버튼 ---------- */
.btn{display:inline-block;padding:8px 16px;border:1px solid var(--line-d);
  background:#fff;color:#333;border-radius:var(--radius);cursor:pointer;
  font-size:13.5px;font-weight:500;text-align:center;line-height:1.5;
  white-space:nowrap}   /* 좁은 칸에서 글자가 줄바꿈되지 않도록 */
.btn:hover{background:#f3f5f7;text-decoration:none}
.btn.p{background:var(--navy);border-color:var(--navy);color:#fff}
.btn.p:hover{background:var(--navy-d)}
.btn.b{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.b:hover{background:#12569a}
.btn.g{background:var(--green);border-color:var(--green);color:#fff}
.btn.g:hover{filter:brightness(.92)}
.btn.r{background:var(--red);border-color:var(--red);color:#fff}
.btn.r:hover{filter:brightness(.92)}
.btn.sm{padding:4px 10px;font-size:12.5px}
.btn.lg{padding:12px 30px;font-size:15px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
.btns{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.btns.c{justify-content:center;margin-top:22px}
/* 표 안의 관리 버튼처럼 한 줄에 붙여 두어야 하는 묶음 */
.btns.nw{flex-wrap:nowrap}
.btns.r{justify-content:flex-end}
.btns.sp{justify-content:space-between}

/* ---------- 검색바 ---------- */
.searchbar{background:#f7f9fb;border:1px solid var(--line);border-radius:var(--radius);
  padding:12px;margin-bottom:14px}
.searchbar form{display:flex;gap:6px;flex-wrap:wrap;align-items:center;justify-content:center}

/* ---------- 알림 ---------- */
.msg{padding:11px 14px;border-radius:var(--radius);margin-bottom:14px;font-size:13.5px}
.msg.ok{background:#e8f5ec;border:1px solid #b7e0c4;color:#11683c}
.msg.err{background:#fdecea;border:1px solid #f5c2bc;color:#a1271c}
.msg.info{background:var(--blue-l);border:1px solid #bcd8ee;color:#0f4f85}
.msg.warn{background:#fff7e6;border:1px solid #ffd591;color:#8a5300}

/* ---------- 페이징 ---------- */
.paging{display:flex;justify-content:center;gap:4px;margin-top:22px;flex-wrap:wrap}
.paging a,.paging strong{display:inline-flex;align-items:center;justify-content:center;
  min-width:32px;height:32px;padding:0 8px;border:1px solid var(--line-d);
  border-radius:var(--radius);font-size:13px;color:#444;background:#fff}
.paging a:hover{background:#f0f3f6;text-decoration:none}
.paging strong{background:var(--navy);border-color:var(--navy);color:#fff}

/* ---------- 메인 ---------- */
/* ---------- 메인 히어로 ----------
   PC·태블릿 : 수영장 사진 한 장(hero-pool-in.jpg). 선수가 오른쪽에 있으므로
               글자가 놓이는 왼쪽만 남색으로 덮고 오른쪽은 사진 그대로 둔다.
   모바일    : 아래 "메인 히어로 — 모바일" 참고 (둥근 창 안의 선수)           */
.hero{
  position:relative;overflow:hidden;color:#fff;
  /* 선수의 뻗은 손끝이 사진 아래쪽에 있으므로 사진 아랫단에 맞춘다 */
  background:#0b3d6b url(../img/hero-pool-in.jpg) 70% 100% / cover no-repeat;
}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,
    rgba(6,38,68,.93) 0%, rgba(8,50,88,.80) 30%,
    rgba(11,61,107,.35) 52%, rgba(11,61,107,0) 70%);
}
.hero-lens{display:none}     /* 모바일 전용 */
.hero-in{
  position:relative;z-index:1;max-width:1200px;margin:0 auto;
  padding:70px 16px 106px;   /* 아래를 넉넉히 두어 손끝이 물결에 가리지 않게 한다 */
}
.hero-in .eyebrow{margin:0 0 10px;font-size:12.5px;letter-spacing:1.4px;font-weight:700;color:#bfe6f5;
  line-height:1.5}
.hero-in h2{font-size:33px;line-height:1.3;letter-spacing:-.6px;margin:0;
  text-shadow:0 2px 14px rgba(0,0,0,.35)}
.hero-in h2 b{color:#8fe3ff}
/* 한 줄로 보이도록 폭 제한을 두지 않는다 (좁은 화면에서만 자연스럽게 줄바꿈) */
.hero-in .lead{margin:14px 0 0;font-size:15.5px;opacity:.95;line-height:1.7;
  text-shadow:0 1px 10px rgba(0,0,0,.35)}
.hero-btn{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
.hero-btn a{display:inline-block;padding:11px 22px;border-radius:24px;font-size:14.5px;
  font-weight:700;border:1px solid rgba(255,255,255,.6);color:#fff}
.hero-btn a:hover{background:rgba(255,255,255,.18);text-decoration:none}
.hero-btn a.solid{background:#fff;color:var(--navy);border-color:#fff}
.hero-btn a.solid:hover{background:#eaf4fb}
.hero-wave{position:relative;z-index:1;line-height:0;margin-top:-1px}
.hero-wave svg{display:block;width:100%;height:50px}

.main-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}
.card{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#fff}
.card h3{background:#f7f9fb;border-bottom:1px solid var(--line);padding:11px 14px;
  font-size:15px;color:var(--navy);display:flex;justify-content:space-between;align-items:center}
.card h3 a{font-size:12px;color:var(--gray);font-weight:400}
.card ul{padding:8px 14px 14px}
.card li{padding:6px 0;border-bottom:1px dotted #e8eaee;font-size:13.5px;
  display:flex;justify-content:space-between;gap:10px}
.card li:last-child{border-bottom:0}
.card li a{color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card li .dt{color:var(--gray);font-size:12px;flex:0 0 auto}
.card .empty{padding:26px 14px;color:var(--gray);text-align:center;font-size:13px}

.ct-now{border:1px solid #cfe0ef;background:var(--blue-l);border-radius:6px;padding:16px;margin:26px 0}
.ct-now h3{color:var(--navy);font-size:16px;margin-bottom:10px}
.ct-now .row{display:flex;flex-wrap:wrap;gap:12px}
.ct-now .item{flex:1 1 300px;background:#fff;border:1px solid #d6e3ef;border-radius:6px;padding:14px}
.ct-now .item .t{font-weight:700;font-size:15px;color:#1a1a1a;margin:6px 0 4px}
.ct-now .item .m{font-size:12.5px;color:var(--text-l)}
/* 버튼 줄 : 클래스명을 .b 로 두면 파랑 버튼 수식자 .btn.b 와 겹쳐
   안쪽 버튼까지 margin-top 이 먹어 높이가 어긋난다. .ct-act 로 분리한다. */
.ct-now .item .ct-act{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ct-now .item .ct-act .btn{flex:0 0 auto;min-width:72px}

.quick{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:26px 0}
.quick a{display:block;text-align:center;padding:16px 6px 14px;border:1px solid var(--line);
  border-radius:8px;color:#333;font-size:13.5px;background:#fff;transition:border-color .15s,box-shadow .15s}
.quick a:hover{border-color:var(--blue);color:var(--blue);text-decoration:none;
  box-shadow:0 4px 14px rgba(11,61,107,.10)}
.quick a svg{display:block;margin:0 auto 8px;width:28px;height:28px;
  fill:none;stroke:var(--blue);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.quick a:hover svg{stroke:var(--navy)}

/* ---------- 대회 목록 ---------- */
.ct-list{border-top:2px solid var(--navy)}
.ct-list li{border-bottom:1px solid var(--line);padding:16px 6px;display:flex;
  align-items:center;gap:16px;flex-wrap:wrap}
.ct-list li:hover{background:#fafcfe}
.ct-list .st{flex:0 0 78px;text-align:center}
.ct-list .info{flex:1 1 380px;min-width:0}
.ct-list .info .t{font-size:16px;font-weight:700;color:#1a1a1a;display:block;
  overflow:hidden;text-overflow:ellipsis}
.ct-list .info .t:hover{color:var(--blue)}
.ct-list .info .m{margin-top:5px;font-size:13px;color:var(--text-l);
  display:flex;gap:14px;flex-wrap:wrap}
.ct-list .info .m span::before{content:"";display:inline-block;width:3px;height:3px;
  background:#aab;border-radius:50%;margin:0 7px 3px 0}
.ct-list .info .m span:first-child::before{display:none;margin:0}
.ct-list .act{flex:0 0 auto;display:flex;gap:6px}

/* ---------- 대회일정 (좌측 D-day 박스 + 우측 제목·기간) ---------- */
.ct-sch-head{display:flex;align-items:center;border-top:2px solid var(--navy);
  border-bottom:1px solid var(--line-d);padding:14px 6px;font-weight:700;color:var(--navy)}
.ct-sch-head .c1{flex:0 0 116px;text-align:center;font-size:14px}
.ct-sch-head .c2{flex:1 1 auto;text-align:center;font-size:14px}

.ct-sch{list-style:none;margin:0;padding:0}
.ct-sch>li{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:20px 6px;border-bottom:1px solid #d9d9d9}
.ct-sch>li:hover{background:#fafcfe}

.ct-sch .dday{flex:0 0 116px;display:flex;justify-content:center}
.ct-sch .dday>div{width:77px;height:77px;border-radius:5px;background:var(--blue);
  color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ct-sch .dday.end>div{background:#6d6d6d}
.ct-sch .dday .lb{font-size:12px;line-height:1.2;opacity:.92}
.ct-sch .dday .dd{font-size:26px;font-weight:700;line-height:1.15;letter-spacing:-.5px}
.ct-sch .dday .dd em{font-style:normal;font-size:20px}

.ct-sch .info{flex:1 1 340px;min-width:0}
.ct-sch .info .hd{display:block;color:inherit}
.ct-sch .info .hd:hover{text-decoration:none}
.ct-sch .info .hd:hover .nm{color:var(--blue)}
.ct-sch .info .nm{font-size:17px;font-weight:700;color:#222}
.ct-sch .info .pl{font-size:14.5px;color:#828282}
.ct-sch .info .pr{margin:8px 0 0;font-size:13.5px;color:#6d6d6d}
.ct-sch .act{flex:0 0 auto;display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* ---------- 메인 대회일정 슬라이더 ---------- */
.ct-slide{margin:26px 0}
.ct-slide .hd{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.ct-slide .hd h3{font-size:21px;font-weight:700;color:var(--navy);margin:0}
.ct-slide .hd .more{margin-left:auto;font-size:13px;color:var(--text-l)}
.ct-slide .hd .more:hover{color:var(--blue)}

.ct-slide .stage{position:relative;padding:0 46px}
.ct-slide .track{display:flex;gap:15px;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:16px 2px 20px;scrollbar-width:none;-ms-overflow-style:none}
.ct-slide .track::-webkit-scrollbar{display:none}
/* 카드가 화면보다 적으면 가운데로 모은다.
   justify-content:center 는 넘칠 때 왼쪽이 잘려 스크롤이 막히므로
   양끝 카드에 auto 마진을 줘서 남는 공간이 있을 때만 가운데로 밀리게 한다. */
.ct-slide .track > :first-child{margin-left:auto}
.ct-slide .track > :last-child{margin-right:auto}
.ct-slide .track:focus{outline:2px solid var(--blue);outline-offset:2px}

.ct-slide .ct-card{flex:0 0 280px;scroll-snap-align:start;background:#fff;
  border:1px solid #e6e6e6;border-radius:10px;overflow:hidden;display:flex;flex-direction:column;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}
/* 마우스를 올리면 카드가 살짝 떠오르고 머리띠·참가신청 버튼이 밝은 파랑으로 바뀐다 */
.ct-slide .ct-card:hover,
.ct-slide .ct-card:focus-within{transform:translateY(-10px);border-color:#cfe0ef;
  box-shadow:5px 6px 15px rgba(22,104,179,.30)}
.ct-slide .ct-card:hover .c-top,
.ct-slide .ct-card:focus-within .c-top{background:var(--blue)}
.ct-slide .ct-card:hover .c-btn a.p,
.ct-slide .ct-card:focus-within .c-btn a.p{background:var(--blue)}
@media (prefers-reduced-motion:reduce){
  .ct-slide .ct-card,.ct-slide .c-top,.ct-slide .c-btn a{transition:none}
  .ct-slide .ct-card:hover,.ct-slide .ct-card:focus-within{transform:none}
}
.ct-slide .c-top{background:var(--navy);color:#fff;padding:16px;transition:background .18s ease}
/* 수영장 이름이 잘리지 않도록 줄바꿈을 허용한다 (말줄임표 쓰지 않음) */
.ct-slide .c-top h4{margin:0;font-size:13.5px;font-weight:400;color:#cfe0ef;
  line-height:1.35;word-break:keep-all}
.ct-slide .c-top p{margin:2px 0 0;font-size:16px;font-weight:700;letter-spacing:-.2px}

.ct-slide .c-bot{padding:14px 16px 14px;display:flex;flex-direction:column;flex:1 1 auto}
/* 대회명도 잘리지 않게 두 줄을 기본으로 하되 길면 늘어난다 */
.ct-slide .c-bot h5{margin:0;font-size:15px;font-weight:600;line-height:1.4;
  min-height:42px;word-break:keep-all}
.ct-slide .c-bot h5 a{color:#222;display:block}
.ct-slide .c-bot h5 a:hover{color:var(--blue)}
.ct-slide .c-bot .st{margin:12px 0 0;font-size:13.5px;font-weight:500;color:#6d6d6d}
.ct-slide .c-bot .st::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;
  background:#9aa3ad;margin:0 7px 3px 0}
.ct-slide .c-bot .st.ing{color:var(--blue)}
.ct-slide .c-bot .st.ing::before{background:var(--blue)}
.ct-slide .c-bot .sub{margin:3px 0 0;font-size:12.5px;color:#8a939c}
.ct-slide .c-btn{margin-top:auto;padding-top:14px;display:flex;flex-direction:column;gap:6px}
.ct-slide .c-btn a{display:block;text-align:center;padding:8px 0;border-radius:5px;
  font-size:13.5px;font-weight:500;background:#f1f1f1;color:#222;transition:background .18s ease}
.ct-slide .c-btn a:hover{background:#e6e8ea;text-decoration:none}
.ct-slide .c-btn a.p{background:var(--navy);color:#fff}
.ct-slide .c-btn a.p:hover{background:var(--navy-d)}

.ct-slide .nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);
  box-shadow:0 2px 8px rgba(11,61,107,.14);cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center}
.ct-slide .nav:hover{background:var(--blue-l);border-color:#bcd6ea}
.ct-slide .nav svg{width:20px;height:20px;fill:none;stroke:var(--navy);
  stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.ct-slide .nav.prev{left:0}
.ct-slide .nav.next{right:0}
.ct-slide .nav:disabled{opacity:.3;cursor:default;box-shadow:none}
.ct-slide .nav:disabled:hover{background:#fff;border-color:var(--line)}

/* ---------- 상세 본문 ---------- */
.view-head{border-top:2px solid var(--navy);border-bottom:1px solid var(--line);padding:16px 8px}
.view-head h3{font-size:18px;margin-bottom:8px}
.view-head .meta{font-size:12.5px;color:var(--gray);display:flex;gap:16px;flex-wrap:wrap}
.view-body{padding:24px 8px;min-height:180px;border-bottom:1px solid var(--line);
  font-size:14.5px;line-height:1.8;word-break:break-word}
.view-body img{max-width:100%;height:auto}
.view-body table{border-collapse:collapse}
.view-body table td,.view-body table th{border:1px solid var(--line);padding:6px 8px}
.view-files{padding:12px 8px;border-bottom:1px solid var(--line);background:#fafbfc}
.view-files li{padding:3px 0;font-size:13px}

/* ---------- 인쇄 미리보기 영역 ---------- */
.print-area{background:#fff}

/* ---------- 푸터 ---------- */
.foot{background:#2a3340;color:#9aa5b1;padding:26px 0;margin-top:40px;font-size:13px}
.foot .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.foot .foot-org{display:flex;gap:14px;align-items:flex-start}
.foot .foot-org img{width:52px;height:52px;object-fit:contain;flex:0 0 auto;
  background:#fff;border-radius:50%;padding:3px}
.foot b{color:#fff;display:block;font-size:15px;margin-bottom:8px}
/* 단체명 한글 + 영문을 한 덩어리로 붙여 놓고, 그 아래에 주소를 둔다 */
.foot .foot-org b{margin-bottom:2px}
.foot .foot-org .en{display:block;margin-bottom:9px;font-size:11.5px;line-height:1.45;
  letter-spacing:.2px;color:#8d98a4}
.foot .cr{margin-top:10px;font-size:12px;color:#78828d}
.foot a{color:#9aa5b1}

/* ---------- 엔트리타임 자동 채우기 표시 (assets/js/swim.js swimSeedFill) ----------
   내 기록           : 그 선수의 예전 대회 최고기록을 넣은 칸
   기록없음 · 기준값 : 기록이 없어 같은 성별·연령대 생활체육 기록의 가운데값을 넣은 칸
   사람이 칸을 고치면 표시는 사라진다. */
/* 입력칸과 표시를 한 줄에 둔다 (표 칸 안에서 줄이 나뉘지 않게) */
.seed-cell{white-space:nowrap}
/* 엔트리타임은 숫자 4~6자리만 들어가므로 칸을 짧게 둔다 */
/* 숫자만 넣는 칸이라 값은 가운데로 */
.seed-in,.seed-cell .f{display:inline-block;vertical-align:middle;text-align:center}
.seed-in{width:96px}
.seed-tag{display:inline-block;vertical-align:middle;margin-left:6px;
  font-size:11.5px;font-weight:700;line-height:1;
  padding:5px 8px;border-radius:11px;white-space:nowrap}
.seed-tag.is-best{background:#e8f1ff;color:#1a5fe2;border:1px solid #c5dbff}
.seed-tag.is-base{background:#fff4e5;color:#a05a00;border:1px solid #ffd9a8}

/* ---------- 반응형 ---------- */
@media (max-width:1024px){
  .main-cards{grid-template-columns:1fr}
  .quick{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:860px){
  .head .wrap{height:60px;gap:10px}
  .hero-in .eyebrow{font-size:11px;letter-spacing:1px}
  .mo-btn{display:block;margin-left:auto}
  .gnb{display:none;position:absolute;left:0;right:0;top:60px;background:#fff;
    border-bottom:1px solid var(--line);z-index:80;max-height:75vh;overflow:auto}
  .gnb.open{display:block}
  .gnb>ul{display:block}
  .gnb>ul>li>a{line-height:normal;padding:13px 16px;border-bottom:1px solid var(--line)}
  .gnb .sub{display:block;position:static;transform:none;border:0;box-shadow:none;
    padding:0 0 8px;background:#f7f9fb}
  .gnb .sub a{padding:8px 30px}
  .head{position:relative}
  .ct-list li{gap:10px}
  .ct-list .st{flex:0 0 auto}
  .ct-list .act{width:100%}
  .ct-slide .stage{padding:0 38px}
  .ct-slide .nav{width:38px;height:38px}
  .ct-slide .hd h3{font-size:18px}
  .ct-sch-head{display:none}
  .ct-sch>li{gap:12px;padding:16px 4px}
  .ct-sch .dday{flex:0 0 auto}
  .ct-sch .dday>div{width:66px;height:66px}
  .ct-sch .dday .dd{font-size:22px}
  .ct-sch .dday .dd em{font-size:17px}
  .ct-sch .info{flex:1 1 200px}
  .ct-sch .info .nm{font-size:15.5px}
  .ct-sch .act{width:100%}
  .tbl th,.tbl td{padding:8px 5px;font-size:12.5px}
  .tbl-form th{width:124px;padding:8px;font-size:12.5px}
  .tbl-form td{padding:8px}
  .hero-in{padding:44px 16px 50px}
  .hero-in h2{font-size:23px}
  .hero-in .lead{font-size:14px}
  .hero-btn a{padding:9px 16px;font-size:13.5px}
  .hero-wave svg{height:30px}
  .sub-top .wrap{padding:20px 16px 30px}
  .sub-top .sub-wave svg{height:16px}
}

/* ---------- 메인 히어로 — 태블릿 (641~860px) ----------
   글자를 위에 두고, 아래쪽을 밝게 열어 오른쪽 아래의 선수가 보이게 한다 */
@media (max-width:860px){
  .hero{background-position:84% 70%}
  .hero::before{background:linear-gradient(180deg,
    rgba(6,38,68,.90) 0%, rgba(8,50,88,.74) 55%, rgba(11,61,107,.12) 100%)}
  .hero-in{padding-bottom:120px}
  /* 서브 상단 둥근 창 : 배너가 낮아지므로 조금 작게, 화면 가장자리에 걸치게 */
  .sub-top .wrap{padding-right:170px}
  .sub-top .sub-lens{right:-36px;width:180px;height:180px}
  .sub-top .sub-lens::before{inset:-12px}
  .sub-top .sub-lens::after{inset:-26px}
}

/* ---------- 메인 히어로 — 모바일 (640px 이하) ----------
   화면이 좁아 사진 속 선수가 너무 작아지므로, 선수가 없는 수영장 사진을 배경으로 깔고
   제목 위 둥근 창(190px)에 선수 사진(hero-swimmer-lens.jpg)을 따로 보여 준다.
   창의 옅은 동그라미 두 겹은 물결.                                               */
@media (max-width:640px){
  .hero{background-image:url(../img/hero-pool.jpg);background-position:center 55%}
  .hero::before{background:linear-gradient(100deg,
    rgba(6,38,68,.94) 0%, rgba(11,61,107,.84) 42%,
    rgba(13,92,138,.55) 70%, rgba(0,120,170,.35) 100%)}
  .hero-in{display:flex;flex-direction:column;gap:26px;padding:36px 16px 44px}
  .hero-lens{display:block;position:relative;order:-1;width:190px;height:190px;margin:0 auto}
  .hero-lens .ph{position:absolute;inset:0;border-radius:50%;
    background:#0b3d6b url(../img/hero-swimmer-lens.jpg) center / cover no-repeat;
    border:6px solid rgba(255,255,255,.9);box-shadow:0 18px 40px rgba(0,20,40,.45)}
  .hero-lens::before,.hero-lens::after{content:"";position:absolute;border-radius:50%;
    pointer-events:none;border:2px solid rgba(143,227,255,.45)}
  .hero-lens::before{inset:-14px}
  .hero-lens::after{inset:-28px;border-color:rgba(143,227,255,.22)}
}

/* ---------- 서브 상단 — 모바일 (640px 이하) ----------
   둥근 창을 156px 로 줄이고, 제목·경로가 창과 겹치지 않게 오른쪽을 비운다. */
@media (max-width:640px){
  .seed-tag{padding:4px 6px;font-size:11px}

  .sub-top .wrap{padding-right:130px;min-height:118px;
    display:flex;flex-direction:column;justify-content:center}
  .sub-top .sub-lens{right:-34px;width:156px;height:156px}
  .sub-top .sub-lens .ph{border-width:4px}
  .sub-top .sub-lens::before{inset:-12px}
  .sub-top .sub-lens::after{inset:-26px}
}

/* 개인접수 신청종목 : 버튼은 넓은 화면에서 가운데, 좁은 화면에서 오른쪽 */
#pTbl td.pact .btns{justify-content:center}
/* 버튼 칸을 flex 로 만들면 표 칸이 아니게 되어 높이가 줄고 밑줄이 어긋난다.
   넓은 화면에서는 반드시 표 칸으로 둔다. (예전 마크업이 올라가 있어도 어긋나지 않게) */
@media (min-width:901px){
  #pTbl td.pact{display:table-cell}
  #pTbl td.pact .btn + .btn{margin-left:6px}
}

/* =====================================================================
   모바일 (640px 이하) — 입력 화면
   참가신청을 휴대폰으로 하는 경우가 많다.
   좁은 폭에서 라벨이 한 글자씩 세로로 쪼개지고 선택상자가 찌그러지는 것을 막는다.
   태블릿(손가락 기기)은 가로로 돌려도 같은 모양이 되게 한다.
   ===================================================================== */
@media (max-width:640px), (max-width:1180px) and (pointer:coarse){

  /* ---- 입력 폼 : 라벨과 입력칸을 위아래로 쌓는다 ---- */
  .tbl-form,
  .tbl-form tbody,
  .tbl-form tr,
  .tbl-form th,
  .tbl-form td{display:block;width:auto}
  .tbl-form tr{border-bottom:1px solid var(--line);padding:11px 2px}
  .tbl-form tr:last-child{border-bottom:0}
  .tbl-form th{background:none;border:0;padding:0 0 6px;
    font-size:13px;color:var(--navy);white-space:normal}
  .tbl-form td{border:0;padding:0}
  .tbl-form .help{margin-top:6px}

  /* 고정폭 입력칸은 화면 폭을 따르게 한다 */
  .tbl-form .f{max-width:100%}
  .tbl-form .f.w120,.tbl-form .f.w140,.tbl-form .f.w160,
  .tbl-form .f.w180,.tbl-form .f.w220,.tbl-form .f.w320{width:100%}
  /* 한 칸에 두 개가 들어가는 곳(비밀번호 확인, 부·참가부)은 사이 간격을 준다 */
  .tbl-form td > .f + .f{margin-top:6px}
  /* 시도·시군구·단체 선택은 줄바꿈해서 각각 한 줄씩 */
  .tbl-form td > select.f{display:block}
  /* 검색줄(걸러보기)의 선택상자·입력칸도 한 줄 가득 */
  .searchbar{flex-wrap:wrap}
  .searchbar > .f,
  .searchbar > select.f,
  .searchbar > input.f{width:100%;max-width:100%}
  /* 날짜·시각 칸도 한 줄 가득 (대회 기간 · 접수 기간 · 심판신청 기간) */
  .tbl-form td > input[type=date],
  .tbl-form td > input[type=datetime-local],
  .tbl-form td > input[type=url],
  .tbl-form td > input[type=email]{display:block;width:100%}
  .tbl-form td > input + input{margin-top:6px}

  /* 개인접수·단체접수 표는 공용 카드 구성(.rwd)을 쓴다. 따로 쌓지 않는다. */
}

/* =====================================================================
   대회별 결과 목록 (front/result_list.php)
   종목 칸이 남는 폭을 다 차지해 구분·조·기록이 멀리 떨어지던 것을 막는다.
   넓은 화면  : 표 그대로, 숫자 칸만 좁게
   태블릿     : 한 줄 목록 — 종목 [구분] 조 · 기록 을 붙여 두고 순위보기만 오른쪽 끝
   휴대폰     : 두 줄 카드 — 종목 [구분] / 조 · 기록, 순위보기는 오른쪽
   ===================================================================== */
/* 넓은 화면 : 칸 폭을 비율로 나눠 종목 칸이 표 폭을 혼자 다 차지하지 않게 한다.
   종목 이름이 가장 긴 것(… 개인혼영 200m / … 혼계영 200m (4인))도 한 줄에 들어가는 폭이다. */
.rlist .c-no {width:6%}
.rlist .c-gn {width:12%}
.rlist .c-ht {width:12%}
.rlist .c-rec{width:12%}
.rlist .c-act{width:16%}
.rlist .gn-tag,
.rlist .u,
.rlist .lb{display:none}
.rlist .gn-tag{margin-left:6px;padding:1px 7px;border-radius:9px;
  background:#eef3f8;color:var(--navy);font-size:11.5px;font-weight:700;
  vertical-align:1px;white-space:nowrap}

/* 태블릿 · 휴대폰 공통 : 표를 목록으로 푼다 */
@media (max-width:860px){
  .rlist thead,
  .rlist .c-no,
  .rlist .c-gn{display:none}
  .rlist,
  .rlist tbody{display:block}
  .rlist tr{display:grid;
    grid-template-columns:auto auto auto 1fr auto;
    grid-template-areas:"nm ht rec . act";
    column-gap:12px;align-items:center;
    padding:11px 4px;border-bottom:1px solid var(--line)}
  .rlist tr.empty{display:block}
  .rlist td,
  .rlist .c-ht,
  .rlist .c-rec,
  .rlist .c-act{display:block;border:0;padding:0;text-align:left;width:auto}
  .rlist .c-nm {grid-area:nm;font-weight:600;line-height:1.45}
  .rlist .c-ht {grid-area:ht; color:#666;font-size:12.5px;white-space:nowrap}
  .rlist .c-rec{grid-area:rec;color:#666;font-size:12.5px;white-space:nowrap}
  .rlist .c-act{grid-area:act;text-align:right}
  .rlist .gn-tag{display:inline-block}
  .rlist .u{display:inline}
  .rlist .lb{display:inline;margin-right:3px}
  .rlist .c-rec::before{content:"·";margin-right:8px;color:#bbb}
}

/* 휴대폰 : 종목 이름이 길어 한 줄에 다 못 담으므로 두 줄로 */
@media (max-width:640px){
  .rlist tr{grid-template-columns:auto auto 1fr auto;
    grid-template-areas:"nm nm nm act" "ht rec . act";
    row-gap:4px;column-gap:10px;padding:12px 2px}
}

/* =====================================================================
   반응형 표 (.rwd) — 태블릿·휴대폰에서 한 줄을 카드 한 장으로 푼다
   ---------------------------------------------------------------------
   쓰는 법 : <table class="tbl rwd"> 로 켜고, 머리칸(th)에 역할을 붙인다.
     rwd-title  카드 제목 (종목·성명·단체명…)          맨 위, 굵게, 이름표 없음
     rwd-lead   제목 위에 이름표와 함께 (레인 3 · 순위 1)
     rwd-act    관리 버튼                              맨 아래, 오른쪽 정렬
     rwd-chk    선택 체크박스                          카드 오른쪽 위 구석
     rwd-wide   카드 폭 전체를 쓰는 칸 (입력칸·긴 글)  이름표는 위에 따로
     rwd-no     순번처럼 카드에서는 필요 없는 칸        숨김
   이름표(data-label)는 swim.js 가 머리칸 글자를 읽어 칸마다 채운다.

   칸 안에 <br> 로 여러 줄이 든 경우가 많아(대회명+장소, 연령대+나이 …)
   칸을 flex 로 만들지 않는다. 이름표는 왼쪽에 띄우고(float) 값은 오른쪽 정렬.
   ===================================================================== */
/* 손가락으로 쓰는 기기(태블릿 · 휴대폰)는 가로로 돌려도 카드로 본다.
   마우스를 쓰는 PC 는 900px 아래에서만 카드가 된다. */
@media (max-width:900px), (max-width:1180px) and (pointer:coarse){
  table.rwd{min-width:0 !important;border-top:0 !important;background:transparent}
  table.rwd thead{display:none}
  table.rwd,
  table.rwd tbody{display:block;width:100%}
  table.rwd tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:5px 20px;align-items:start;
    background:#fff;border:1px solid var(--line);border-radius:8px;
    padding:12px 14px;margin-bottom:10px;position:relative}
  table.rwd tbody tr:hover{background:#fff}
  table.rwd td{display:flow-root;border:0 !important;padding:3px 0 !important;
    text-align:right !important;width:auto !important;min-width:0;
    font-size:13px;line-height:1.5;word-break:keep-all;overflow-wrap:anywhere}
  table.rwd td::before{content:attr(data-label);float:left;margin-right:12px;
    color:var(--gray);font-size:12px;font-weight:600;white-space:nowrap;line-height:1.65}
  table.rwd td[data-label=""]::before{display:none}

  /* 역할 */
  table.rwd td.rwd-lead{grid-column:1 / -1;order:-2;text-align:left !important;
    color:var(--blue);font-weight:700;padding:0 !important}
  table.rwd td.rwd-lead::before{float:none;display:inline;color:var(--blue);margin-right:5px}
  table.rwd td.rwd-title{grid-column:1 / -1;order:-1;text-align:left !important;
    font-size:15px;font-weight:700;color:var(--navy);line-height:1.45;
    padding:0 0 8px !important;margin-bottom:2px;border-bottom:1px solid var(--line) !important}
  table.rwd td.rwd-title::before{display:none}
  table.rwd td.rwd-wide{grid-column:1 / -1;text-align:left !important}
  table.rwd td.rwd-wide::before{float:none;display:block;margin:0 0 3px}
  table.rwd td.rwd-act{grid-column:1 / -1;order:99;text-align:right !important;
    padding:9px 0 0 !important;margin-top:2px;border-top:1px solid var(--line) !important}
  table.rwd td.rwd-act::before{display:none}
  table.rwd td.rwd-chk{position:absolute;top:11px;right:12px;padding:0 !important}
  table.rwd td.rwd-chk::before{display:none}
  table.rwd td.rwd-chk input{width:20px;height:20px;margin:0}
  table.rwd tr:has(> td.rwd-chk) td.rwd-title,
  table.rwd tr:has(> td.rwd-chk) td.rwd-lead{padding-right:34px !important}
  table.rwd td.rwd-no{display:none}

  /* 칸 안의 입력칸 · 선택상자는 칸 폭을 넘지 않게 */
  table.rwd td .f,
  table.rwd td select,
  table.rwd td input[type=text],
  table.rwd td input[type=number]{max-width:100%}
  table.rwd td.rwd-wide .f.full,
  table.rwd td.rwd-wide select{width:100%}
  /* 엔트리타임 : 칸은 짧게 두고 옆에 "내 기록 / 기록없음" 표시를 붙인다 */
  table.rwd td .seed-in{width:110px}
  table.rwd td .seed-tag{margin-left:8px}

  /* 좁은 화면 : 글이 긴 선택상자(종목 고르기 등)가 화면을 밀어내지 않게 */
  .f,select.f,input.f,select,textarea{max-width:100%}
  .toolbar .f{min-width:0}
  /* 옆으로 미는 표에는 손가락 스크롤을 부드럽게 */
  .tbl-wrap{-webkit-overflow-scrolling:touch}

  /* 관리자 목록(경기인 · 회원) : 카드 오른쪽 위에 증명사진 */
  table.rwd td.rwd-photo{position:absolute;top:10px;right:12px;padding:0 !important;width:46px}
  table.rwd td.rwd-photo::before{display:none}
  table.rwd td.rwd-photo img,
  table.rwd td.rwd-photo span{width:46px !important;height:58px !important;margin:0 !important}
  table.rwd tr:has(> td.rwd-photo) td.rwd-title,
  table.rwd tr:has(> td.rwd-photo) td.rwd-lead{padding-right:56px !important}
  /* 자격증 사진 : 증명사진 왼쪽에 나란히 */
  table.rwd td.rwd-card{position:absolute;top:10px;right:66px;padding:0 !important;width:70px;text-align:center !important}
  table.rwd td.rwd-card::before{display:none}
  table.rwd td.rwd-card img{width:70px !important;height:47px !important;margin:0 auto !important}
  table.rwd td.rwd-card a{font-size:11px}
  table.rwd tr:has(> td.rwd-card) td.rwd-title,
  table.rwd tr:has(> td.rwd-card) td.rwd-lead{padding-right:142px !important}
  /* 사진과 체크상자가 같이 있으면 체크상자는 왼쪽 위로 */
  table.rwd tr:has(> td.rwd-photo) td.rwd-chk{right:auto;left:12px;top:12px}
  table.rwd tr:has(> td.rwd-photo):has(> td.rwd-chk) td.rwd-title,
  table.rwd tr:has(> td.rwd-photo):has(> td.rwd-chk) td.rwd-lead{padding-left:30px !important}
  /* 관리 단추는 손가락으로 누르기 쉽게 */
  table.rwd td.rwd-act .btn,
  table.rwd td.rwd-act .btn.sm{padding:7px 16px;font-size:13.5px}
  /* 태블릿 : 한 줄에 카드 두 장 */
  @media (min-width:640px){
    table.rwd tbody{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    table.rwd tbody tr{margin-bottom:0}
    table.rwd tr:has(> td[colspan]:only-child){grid-column:1 / -1}
  }

  /* 참가신청 카드 : 엔트리타임 + 기록 표시 + 버튼을 한 줄에 둔다
     (종목 선택만 한 줄 전체를 쓰고, 그 아래 줄을 왼쪽=엔트리타임, 오른쪽=버튼으로 나눈다)
     엔트리타임 칸은 th 에 rwd-seed 를 붙여 표시한다 (swim.js 가 칸으로 옮긴다) */
  table.rwd td.rwd-seed{grid-column:1;order:50;text-align:left !important}
  table.rwd td.rwd-seed::before{float:none;display:block;margin:0 0 3px}
  #pTbl tbody tr,
  #gtbl tbody tr{grid-template-columns:1fr auto;align-items:end}
  #pTbl td.rwd-seed .f,
  #gtbl td.rwd-seed .f{width:110px}
  /* 엔트리타임과 같은 줄에 있으므로 위쪽 구분선은 두지 않는다 */
  #pTbl td.rwd-act,
  #gtbl td.rwd-act{grid-column:2;order:50;align-self:end;white-space:nowrap;
    border-top:0 !important;margin-top:0;padding:0 0 3px !important}
  #pTbl td.rwd-act .btns{justify-content:flex-end}
  /* 기록 입력칸은 손가락으로 누르기 쉽게 카드 폭 전체 */
  table.rwd td.rwd-wide input.rec{width:100%;max-width:260px}

  /* "자료가 없습니다" 처럼 한 칸이 줄 전체를 덮는 행 */
  table.rwd tr:has(> td[colspan]:only-child){display:block}
  table.rwd td[colspan]:only-child{text-align:center !important}
  table.rwd td[colspan]:only-child::before{display:none}
  /* 합계 줄처럼 묶은 칸 옆에 숫자가 있는 행 : 묶은 칸을 카드 제목으로 */
  table.rwd td[colspan]:not(:only-child):not(:empty){grid-column:1 / -1;order:-1;
    text-align:left !important;font-weight:700;color:var(--navy);
    padding:0 0 6px !important;border-bottom:1px solid var(--line) !important}
  table.rwd td:empty{display:none}

  /* 표를 감싼 가로 스크롤은 카드에서는 필요 없다 */
  .tbl-wrap:has(> table.rwd){overflow:visible}
}


/* 휴대폰 : 카드 안을 한 줄에 하나씩 */
@media (max-width:560px){
  table.rwd tbody tr{grid-template-columns:1fr;padding:12px}
}

/* 회원가입 : 가입 여부 확인 결과 */
.dup-msg{margin-left:8px;font-size:13.5px;color:#667085}
.dup-msg.ok{color:#11683c;font-weight:700}
.dup-msg.bad{color:#b42318;font-weight:700}
#dupLinks{display:block;margin-top:4px}
#dupLinks[hidden]{display:none}

/* 로그인 아래 : 회원가입 · 아이디 찾기 · 비밀번호 찾기 */
.login-links{display:flex;justify-content:center;flex-wrap:wrap;gap:0;margin:4px 0 6px;font-size:13.5px}
.login-links a{color:#475467;padding:2px 12px;text-decoration:none}
.login-links a+a{border-left:1px solid #d0d5dd}
.login-links a:hover{color:var(--navy);text-decoration:underline}
/* 찾기 결과 : 가린 아이디 */
.find-ids{list-style:none;margin:8px 0 0;padding:0}
.find-ids li{padding:8px 12px;border:1px solid #d0d5dd;border-radius:4px;margin-bottom:6px;background:#fff;
  display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.find-ids b{font-size:16px;letter-spacing:.5px;font-family:Consolas,monospace}

/* 경기인 등록 신청 : 자격증 보는 법 (A~G 가 아래 입력칸 표시와 짝) */
.lic-guide{max-width:460px;margin:4px 0 14px;border:1px solid #9cc3e6;border-radius:8px;overflow:hidden;
  background:linear-gradient(135deg,#bfe3fb,#8fcaf2);font-size:12.5px;color:#1d2939;user-select:none}
.lic-guide .lg-top{background:#1f3f8f;color:#fff;padding:6px 12px}
.lic-guide .lg-t{font-size:16px;font-weight:700;letter-spacing:2px}
.lic-guide .lg-body{display:flex;gap:12px;padding:10px 12px 4px}
.lic-guide .lg-photo{flex:0 0 58px;height:74px;background:#fff;border:1px solid #cfd8e3;display:flex;
  align-items:center;justify-content:center;color:#98a2b3;font-size:11px}
.lic-guide dl{display:grid;grid-template-columns:auto 1fr;gap:3px 8px;margin:0}
.lic-guide dt{font-weight:700;color:#344054}
.lic-guide dd{margin:0}
.lic-guide .lg-grade{grid-column:1/-1}
.lic-guide .lg-foot{display:flex;flex-wrap:wrap;gap:4px 12px;padding:4px 12px 8px;align-items:center}
.lic-guide .lg-org{margin-left:auto;font-weight:700;color:#1f3f8f}
.lic-guide i,.lg-k{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;
  background:#d92d20;color:#fff;font-style:normal;font-size:11px;font-weight:700;vertical-align:1px}
.lg-k{margin-right:4px}

/* 경기인 등록 신청 : 증명사진 (회원 사진 쓰기 · 바꾸기) */
.ph-wrap{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.ph-img{width:110px;height:146px;object-fit:cover;border:1px solid var(--line);border-radius:4px;background:#f4f6f8;display:block}
.ph-img[hidden],.ph-empty[hidden]{display:none}
.ph-empty{width:110px;height:146px;border:1px dashed var(--line-d);border-radius:4px;background:#f7f9fb;display:flex;align-items:center;justify-content:center;color:#9aa3ad;font-size:12.5px;text-align:center}
.ph-tag{display:inline-block;font-size:12px;border-radius:3px;padding:2px 7px;margin-bottom:6px}
.ph-tag.from{background:#e8f5ec;color:#11683c}
.ph-tag.newp{background:#fff4e5;color:#b54708}
.ph-tag.bad{background:#fdecea;color:#a1271c}
.ph-btns{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}

/* 심판배정 (front/my_referee.php) */
.rf-me{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:#f7f9fb;margin-bottom:6px;font-size:14px}
.rf-me .rf-cnt{margin-left:auto;font-size:13px;color:#475467}
.rf-card{border:1px solid var(--line);border-radius:8px;background:#fff;margin-bottom:12px;overflow:hidden}
.rf-hd{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding:12px 14px;border-bottom:1px solid var(--line);background:#f4f8fc}
.rf-ct{font-size:15.5px;font-weight:700;color:var(--navy)}
.rf-meta{font-size:12.5px;color:#667085;margin-top:3px}
.rf-tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.rf-tbl th{background:#fafbfc;color:#475467;font-weight:600;font-size:12.5px;padding:7px 10px;border-bottom:1px solid var(--line);text-align:left}
.rf-tbl td{padding:9px 10px;border-bottom:1px solid #eef1f4;vertical-align:top}
.rf-duty{display:inline-block;background:#0b3d6b;color:#fff;border-radius:4px;padding:2px 9px;font-weight:700;font-size:13px}
.rf-memo{color:#667085;font-size:12.5px}
.rf-ft{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;font-size:12.5px;color:#667085}
.rq-card.rq-on{border-color:#ffd591}
.rq-card.rq-done{border-color:#b7e0c4}
.rq-body{padding:10px 14px;font-size:13.5px}
.rq-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:8px}
.rq-lb{width:72px;color:#475467;font-weight:600;font-size:13px}
.rq-btns{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
@media (max-width:560px){ .rf-tbl thead{display:none} .rf-tbl td{display:block;border:0;padding:4px 14px} .rf-tbl tr{display:block;padding:6px 0;border-bottom:1px solid #eef1f4} }

/* =====================================================================
   기록 입력 — 현장 모드 (휴대폰 · 태블릿) / 표 모드 (PC)
   body.rec-field 면 현장 모드, body.rec-table 면 표 모드만 보인다.
   고르기 전(스크립트 전)에는 둘 다 감춰 두지 않고 표를 보여 준다.
   admin/record_input.php
   ===================================================================== */
.fi-mode{display:none}
body.rec-field .fi-mode{display:block}
body.rec-field #recForm .panel,
body.rec-field #recForm .btns,
body.rec-field .help-box{display:none}
body.rec-table .fi-mode{display:none}

.fi-mode .fi-state{display:flex;align-items:center;gap:8px;font-size:13px;color:#475467;margin:6px 2px 10px}
.fi-mode .fi-state .dot{width:8px;height:8px;border-radius:50%;background:#12b76a;flex:0 0 auto}
.fi-lane{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px;
  display:grid;grid-template-columns:52px 1fr 128px;gap:10px;align-items:center}
.fi-lane.on{border-color:var(--blue);box-shadow:0 0 0 3px rgba(22,104,179,.15)}
.fi-lane.saved{border-color:#12b76a}
.fi-lane.err{border-color:#d92d20}
.fi-lane.empty{opacity:.55}
.fi-no{width:46px;height:46px;border-radius:10px;background:#eef4fa;color:var(--navy);
  display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:700}
.fi-nm{font-size:17px;font-weight:700;color:#101828;line-height:1.25}
.fi-org{font-size:12.5px;color:#7a8794;margin-top:2px}
.fi-seed{font-size:12px;color:#98a2b3;margin-top:2px}
.fi-val{height:48px;border:2px solid var(--line-d);border-radius:10px;background:#fff;font-size:24px;font-weight:700;
  font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:center;color:#101828;letter-spacing:1px}
.fi-lane.on .fi-val{border-color:var(--blue);background:#f3f9ff}
.fi-val.empty{color:#c2c8d0;font-weight:500;font-size:16px}
.fi-val.foul{color:#b42318;font-size:19px}
.fi-tag{font-size:11.5px;font-weight:700;margin-top:3px;text-align:center}
.fi-tag.ok{color:#12b76a}
.fi-tag.wait{color:#b54708}
.fi-tag.bad{color:#d92d20}
.fi-pad{position:fixed;left:0;right:0;bottom:0;z-index:60;background:#eef1f5;border-top:1px solid var(--line-d);
  padding:8px 10px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -2px 12px rgba(0,0,0,.12)}
.fi-pad .in{max-width:820px;margin:0 auto}
.fi-pad .now{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:13px;color:#475467}
.fi-pad .now b{font-size:16px;color:var(--navy)}
.fi-pad .now .val{margin-left:auto;font-size:26px;font-weight:700;font-variant-numeric:tabular-nums;color:#101828}
.fi-keys{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.fi-keys button{height:54px;border:1px solid var(--line-d);background:#fff;border-radius:10px;font-size:23px;
  font-weight:700;color:#101828;cursor:pointer;font-family:inherit}
.fi-keys button:active{background:#e7eef6}
.fi-keys .act{font-size:15px}
.fi-keys .save{background:var(--navy);border-color:var(--navy);color:#fff}
.fi-keys .foul{background:#fff4f2;border-color:#f3b0a8;color:#b42318;font-size:16px}
.fi-keys .del{background:#f7f9fb}
.fi-foulbar{display:flex;gap:6px;margin-top:7px}
.fi-foulbar[hidden]{display:none}
.fi-foulbar button{flex:1;height:42px;border:1px solid #f3b0a8;background:#fff4f2;color:#b42318;border-radius:9px;
  font-size:14px;font-weight:700;cursor:pointer;font-family:inherit}
.fi-hint{font-size:12px;color:#667085;margin-top:6px;text-align:center}
body.rec-field .adm-main{padding-bottom:300px}
@media (min-width:700px){
  .fi-lane{grid-template-columns:56px 1fr 150px}
  .fi-keys button{height:60px;font-size:25px}
}

/* 기록 입력 현장 모드 : 위쪽 굵은 띠 (경기 번호 · 종목 · 이전/다음) */
.fi-top{position:sticky;top:0;z-index:50;background:var(--navy);color:#fff;border-radius:10px;
  padding:10px 12px;margin-bottom:8px;display:flex;align-items:center;gap:8px;
  box-shadow:0 2px 10px rgba(0,0,0,.18)}
.fi-top .tx{min-width:0}
.fi-top .ht{font-size:19px;font-weight:700;line-height:1.25;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fi-top .ht .sub{font-size:14px;font-weight:400;opacity:.8;margin-left:4px}
.fi-top .ht .st{font-size:12px;font-weight:700;background:#12507f;border:1px solid #3f6f9e;
  border-radius:20px;padding:2px 9px;white-space:nowrap}
.fi-top .ht .st.on{background:#0f9d58;border-color:#0f9d58}
.fi-top .rc{font-size:12.5px;color:#cfe0f0;margin-top:3px;line-height:1.4;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.fi-top .sp{flex:1}
.fi-top .nv{flex:0 0 auto;width:44px;height:44px;border:1px solid #3f6f9e;background:#12507f;color:#fff;
  border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:17px;text-decoration:none}
.fi-top .nv:hover{background:#17639b;color:#fff;text-decoration:none}
.fi-top .nv.off{opacity:.35}
/* 현장 모드에서는 위쪽 경기 선택줄 · 정보줄을 감춘다 (굵은 띠가 대신한다) */
body.rec-field .rec-pick,
body.rec-field .rec-info{display:none}
body.rec-field .rec-pick.show{display:block;margin-bottom:10px}