/* BASIC css start */
/* ============================================================
	피시위즈 PC 회원가입 1 · 약관 동의 (join_terms) — 디자인(CSS) 탭   2026-08-11 · PC 세트 31265

	부품표 값만 씁니다.
	  본문 폭 1260 · 가운데 정렬 · 약관 읽는 칸은 900 으로 좁힙니다 (글줄이 너무 길면 읽기 어렵습니다)
	  글자 : 진함 #14181D · 보통 #2B3138 · 흐림 #8A9099 · 빨강 #EF6253
	  선 #DFE3E8 · 바탕 흰 #fff · 연회색 #F7F8FA
	  모서리 10 · 큰 단추 56 · 골드 #F0D025 에 글자 #14181D

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

#wrap #fwTerms {
	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 #fwTerms * { box-sizing: border-box; }
#wrap #fwTerms a { text-decoration: none; color: inherit; }
#wrap #fwTerms em { font-style: normal; color: #EF6253; }

/* 가입 진행 단계 */
#wrap #fwTerms .fw-steps {
	display: flex;
	gap: 8px;
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}
#wrap #fwTerms .fw-steps li {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 48px;
	border: 1px solid #DFE3E8;
	border-radius: 10px;
	background: #F7F8FA;
	font-size: 14px;
	color: #8A9099;
}
#wrap #fwTerms .fw-steps li i {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border-radius: 10px;
	background: #DFE3E8;
	font-style: normal;
	font-size: 12px;
	font-weight: 700;
	color: #fff;
}
#wrap #fwTerms .fw-steps li b { font-weight: 500; }
#wrap #fwTerms .fw-steps li.on {
	border-color: #14181D;
	background: #14181D;
	color: #fff;
}
#wrap #fwTerms .fw-steps li.on i { background: #F0D025; color: #14181D; }
#wrap #fwTerms .fw-steps li.on b { font-weight: 700; }

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

/* 폼 틀 */
#wrap #fwTerms .fw-field { margin: 0; padding: 0; border: 0; }
#wrap #fwTerms .fw-field legend {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* 약관 상자 */
#wrap #fwTerms .fw-agree {
	width: 100%;
	max-width: 900px;
	margin: 24px auto 0;
	padding: 8px 24px 24px;
	border: 1px solid #DFE3E8;
	border-radius: 10px;
	background: #fff;
}
#wrap #fwTerms .fw-aall {
	padding: 20px 0;
	border-bottom: 1px solid #DFE3E8;
}
#wrap #fwTerms .fw-aall label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 16px;
	color: #14181D;
	cursor: pointer;
}
#wrap #fwTerms .fw-aall b { font-weight: 700; }
#wrap #fwTerms .fw-aall input { width: 20px; height: 20px; margin: 0; }
#wrap #fwTerms .fw-aall.hide { display: none; }

#wrap #fwTerms .fw-aitem { padding: 24px 0 0; }
#wrap #fwTerms .fw-aitem.hide { display: none; }
#wrap #fwTerms .fw-ahd {
	margin-bottom: 12px;
	font-size: 15px;
	font-weight: 700;
	color: #14181D;
}
#wrap #fwTerms .fw-asub {
	margin: 12px 0 4px;
	font-size: 13px;
	font-weight: 700;
	color: #8A9099;
}
#wrap #fwTerms .fw-abody.hide { display: none; }
#wrap #fwTerms .fw-abody textarea {
	display: block;
	width: 100%;
	padding: 16px;
	border: 1px solid #DFE3E8;
	border-radius: 9px;
	background: #F7F8FA;
	font-family: inherit;
	font-size: 13px;
	line-height: 1.7;
	color: #2B3138;
	resize: vertical;
}
#wrap #fwTerms .fw-abody table { width: 100%; border-collapse: collapse; font-size: 13px; }
#wrap #fwTerms .fw-abody th,
#wrap #fwTerms .fw-abody td {
	padding: 12px;
	border: 1px solid #DFE3E8;
	text-align: left;
}
#wrap #fwTerms .fw-abody th { background: #F7F8FA; font-size: 13px; font-weight: 700; color: #8A9099; }

#wrap #fwTerms .fw-ack { padding: 12px 0 0; }
#wrap #fwTerms .fw-ack.hide { display: none; }
#wrap #fwTerms .fw-ack label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	color: #2B3138;
	cursor: pointer;
}
#wrap #fwTerms .fw-ack input { width: 18px; height: 18px; margin: 0; }

/* 단추 */
#wrap #fwTerms .fw-btns {
	display: flex;
	gap: 12px;
	width: 100%;
	max-width: 900px;
	margin: 32px auto 0;
}
#wrap #fwTerms .fw-btn1 {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 2;
	height: 56px;
	border: 1px solid #14181D;
	border-radius: 10px;
	background: #14181D;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
}
#wrap #fwTerms .fw-btn1:hover { background: #2B3138; border-color: #2B3138; }
#wrap #fwTerms .fw-btn2 {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1;
	height: 56px;
	border: 1px solid #DFE3E8;
	border-radius: 10px;
	background: #fff;
	font-size: 16px;
	font-weight: 700;
	color: #8A9099;
}
#wrap #fwTerms .fw-btn2:hover { border-color: #14181D; color: #14181D; }

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

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

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

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

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

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

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

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

/* 체크 · 라디오 18 */
#wrap #fwTerms input[type="checkbox"]:not([hidden]),
#wrap #fwTerms 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 #fwTerms .fw-lab:not([hidden]),
#wrap #fwTerms .fw-flab:not([hidden]),
#wrap #fwTerms .fw-flabel:not([hidden]) { font-size: 12.5px; font-weight: 700; color: #2B3138; }
#wrap #fwTerms .fw-help:not([hidden]),
#wrap #fwTerms .fw-fmsg:not([hidden]),
#wrap #fwTerms .fw-fhelp:not([hidden]),
#wrap #fwTerms .fw-snshelp:not([hidden]) { font-size: 11.5px; }

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

/* BASIC css end */

