/* BASIC css start */
/* ============================================================
	피시위즈 PC 로그인 (login) — 디자인(CSS) 탭   2026-08-11 · PC 세트 31265

	부품표 값만 씁니다.
	  본문 폭 1260 · 가운데 정렬 · 로그인 두 칸은 960 으로 좁혀 가운데 둡니다
	  글자 : 진함 #14181D · 보통 #2B3138 · 흐림 #8A9099
	  선 #DFE3E8 · 바탕 흰 #fff · 연회색 #F7F8FA
	  입력칸 높이 48 · 모서리 10 · 큰 단추 56 골드 #F0D025 글자 #14181D

	상품 카드 규칙은 한 줄도 넣지 않았습니다.
	선택자는 모두 #wrap 으로 시작합니다. container 라는 칸은 만들지 않습니다 (PC 에는 그 칸이 없습니다).
============================================================ */

#wrap #fwLogin {
	box-sizing: border-box;
	width: 100%;
	max-width: 1260px;
	margin: 0 auto;
	padding: 32px 0 80px;
	font-family: 'Pretendard Variable', 'Pretendard', 'Apple SD Gothic Neo', system-ui, sans-serif;
	font-size: 15px;
	line-height: 1.6;
	color: #2B3138;
	text-align: left;
}
#wrap #fwLogin * { box-sizing: border-box; }
#wrap #fwLogin a { text-decoration: none; color: inherit; }

/* 제목 */
#wrap #fwLogin .fw-head {
	max-width: 960px;
	margin: 0 auto;
	text-align: center;
}
#wrap #fwLogin .fw-head h2 {
	margin: 0;
	font-size: 22px;
	font-weight: 700;
	letter-spacing: -0.5px;
	color: #14181D;
}
#wrap #fwLogin .fw-head p { margin: 12px 0 0; font-size: 15px; color: #8A9099; }

/* 두 칸 */
#wrap #fwLogin .fw-cols {
	display: flex;
	gap: 24px;
	width: 100%;
	max-width: 960px;
	margin: 32px auto 0;
	align-items: stretch;
}
#wrap #fwLogin .fw-colmain { flex: 1.25; min-width: 0; }
#wrap #fwLogin .fw-colside { flex: 1; min-width: 0; }
#wrap #fwLogin .fw-col.hide { display: none; }
#wrap #fwLogin .fw-box {
	height: 100%;
	border: 1px solid #DFE3E8;
	border-radius: 10px;
	background: #fff;
	padding: 32px;
}
#wrap #fwLogin .fw-boxpad { background: #F7F8FA; }

/* 폼 */
#wrap #fwLogin .fw-field { margin: 0; padding: 0; border: 0; }
#wrap #fwLogin .fw-field legend {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}
#wrap #fwLogin .fw-ln { margin-bottom: 12px; }
#wrap #fwLogin .fw-lab {
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 600;
	color: #14181D;
}
#wrap #fwLogin .fw-inp input[type="text"],
#wrap #fwLogin .fw-inp input[type="password"],
#wrap #fwLogin .fw-inp input[type="email"] {
	width: 100%;
	height: 48px;
	padding: 0 14px;
	border: 1px solid #DFE3E8;
	border-radius: 9px;
	background: #fff;
	font-family: inherit;
	font-size: 14px;
	color: #2B3138;
}
#wrap #fwLogin .fw-inp input:focus { outline: none; border-color: #14181D; }

/* 단추 */
#wrap #fwLogin .fw-btn1 {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 56px;
	margin-top: 20px;
	border: 1px solid #14181D;
	border-radius: 10px;
	background: #14181D;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
}
#wrap #fwLogin .fw-btn1:hover { background: #2B3138; border-color: #2B3138; }
#wrap #fwLogin .fw-btn2 {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 56px;
	border: 1px solid #14181D;
	border-radius: 10px;
	background: #fff;
	font-size: 16px;
	font-weight: 700;
	color: #14181D;
}
#wrap #fwLogin .fw-btn2:hover { background: #14181D; color: #fff; }

/* 보안접속 · 찾기 */
#wrap #fwLogin .fw-sub {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 16px;
}
#wrap #fwLogin .fw-ck {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: #2B3138;
	cursor: pointer;
}
#wrap #fwLogin .fw-ck input { width: 18px; height: 18px; margin: 0; }
#wrap #fwLogin .fw-ck.hide { display: none; }
#wrap #fwLogin .fw-tlink {
	font-size: 14px;
	color: #8A9099;
	text-decoration: underline;
	text-underline-offset: 2px;
	white-space: nowrap;
}
#wrap #fwLogin .fw-tlink:hover { color: #14181D; }

/* 회원 혜택 */
#wrap #fwLogin .fw-colside h3 {
	margin: 0 0 16px;
	font-size: 16px;
	font-weight: 700;
	color: #14181D;
}
#wrap #fwLogin .fw-benefit {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}
#wrap #fwLogin .fw-benefit li {
	position: relative;
	padding-left: 16px;
	font-size: 14px;
	color: #2B3138;
}
#wrap #fwLogin .fw-benefit li + li { margin-top: 8px; }
#wrap #fwLogin .fw-benefit li:before {
	content: '';
	position: absolute;
	left: 0;
	top: 10px;
	width: 4px;
	height: 4px;
	border-radius: 4px;
	background: #F0D025;
}

/* SNS 로 로그인 : 그림 없이 글자와 CSS 만 */
#wrap #fwLogin .fw-sns {
	width: 100%;
	max-width: 960px;
	margin: 24px auto 0;
	padding: 24px;
	border: 1px solid #DFE3E8;
	border-radius: 10px;
	background: #F7F8FA;
	text-align: center;
}
#wrap #fwLogin .fw-sns.hide { display: none; }
#wrap #fwLogin .fw-snstit {
	margin: 0 0 16px;
	font-size: 15px;
	font-weight: 700;
	color: #14181D;
}
#wrap #fwLogin .fw-snsbtns {
	display: flex;
	gap: 8px;
	justify-content: center;
	flex-wrap: wrap;
}
#wrap #fwLogin .fw-snsbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-width: 200px;
	height: 48px;
	padding: 0 16px;
	border: 1px solid #DFE3E8;
	border-radius: 10px;
	background: #fff;
	font-size: 14px;
	font-weight: 600;
	color: #14181D;
}
#wrap #fwLogin .fw-kakao { background: #FEE500; border-color: #FEE500; }
#wrap #fwLogin .fw-naver { background: #03C75A; border-color: #03C75A; color: #fff; }
#wrap #fwLogin .fw-facebook { background: #1877F2; border-color: #1877F2; color: #fff; }
#wrap #fwLogin .fw-apple { background: #14181D; border-color: #14181D; color: #fff; }
#wrap #fwLogin .fw-snsbtn img { max-height: 20px; vertical-align: middle; }

/* ══════════════════════════════════════════════════════════════════════
   2026-08-14 · 부품표(2회차 · 입력 계열)에 맞춤

   재 보니 세 가지가 어긋나 있었습니다. 그 세 가지와, 부품표에 있는데
   빠져 있던 「입력칸 5상태」 · 체크·라디오 18 을 더했습니다.

     입력칸 모서리   10 → 9
     입력칸 글자     15 → 14
     라벨            14 보통 → 12.5 굵게 · 도움말 11.5

   ★ 짜임새(자리·폭·단추)는 한 줄도 손대지 않았습니다.
   ★ :not([hidden]) 은 규칙 세기를 맞추려고 붙인 것입니다. 화면에는 영향이 없습니다.
   ══════════════════════════════════════════════════════════════════════ */

/* 안내 글씨 · 값 색 (부품표 : 안내 #9AA0A8 · 값 #14181D) */
#wrap #fwLogin input:not([hidden])::placeholder,
#wrap #fwLogin textarea:not([hidden])::placeholder { color: #9AA0A8; }

/* 입력 중 — 선 #14181D 1.5 */
#wrap #fwLogin input:not([hidden]):focus,
#wrap #fwLogin select:not([hidden]):focus,
#wrap #fwLogin textarea:not([hidden]):focus { border-color: #14181D; border-width: 1.5px; outline: 0; }

/* 잠김 — 바탕 #F7F8FA 글자 #B3B9C0 */
#wrap #fwLogin input:not([hidden]):disabled,
#wrap #fwLogin input:not([hidden])[readonly],
#wrap #fwLogin select:not([hidden]):disabled,
#wrap #fwLogin textarea:not([hidden]):disabled,
#wrap #fwLogin textarea:not([hidden])[readonly] { background: #F7F8FA; color: #B3B9C0; }

/* 오류 — 칸에 fw-err 를 붙이면 붉게. 팝업으로 알리지 않습니다 */
#wrap #fwLogin input:not([hidden]).fw-err,
#wrap #fwLogin select:not([hidden]).fw-err,
#wrap #fwLogin textarea:not([hidden]).fw-err { border-color: #EF6253; }

/* 체크 · 라디오 18 */
#wrap #fwLogin input[type="checkbox"]:not([hidden]),
#wrap #fwLogin input[type="radio"]:not([hidden]) {
	box-sizing: border-box;
	width: 18px; height: 18px;
	min-width: 18px; min-height: 18px;
	accent-color: #14181D;
}

/* 라벨 12.5 굵게 · 도움말 11.5 */
#wrap #fwLogin .fw-lab:not([hidden]),
#wrap #fwLogin .fw-flab:not([hidden]),
#wrap #fwLogin .fw-flabel:not([hidden]) { font-size: 12.5px; font-weight: 700; color: #2B3138; }
#wrap #fwLogin .fw-help:not([hidden]),
#wrap #fwLogin .fw-fmsg:not([hidden]),
#wrap #fwLogin .fw-fhelp:not([hidden]),
#wrap #fwLogin .fw-snshelp:not([hidden]) { font-size: 11.5px; }

/* 필수 표시는 붉은 * (부품표) */
#wrap #fwLogin .fw-req:not([hidden]) { color: #EF6253; }

/* BASIC css end */

