@charset "utf-8";
/* 회원가입 약관동의 (원본 global_responsive_b_home_mobile/tablet/pc.css 중 이 화면 규칙) */

/* 단계 표시 */
.glores-B-join-step { margin-bottom: 30px; }
.glores-B-join-step ol { margin: 0; padding: 0; }
.glores-B-join-step ol:after { content: ''; display: block; clear: both; }
.glores-B-join-step li { display: table; float: left; box-sizing: border-box; width: 33.3333%; height: 50px; margin: 0; background: #f7f7f7; list-style: none; }
.glores-B-join-step li > span { display: table-cell; font-size: 15px; font-weight: bold; line-height: 18px; letter-spacing: -.03em; color: #888; text-align: center; vertical-align: middle; }
.glores-B-join-step li.on { background: var(--point); }
.glores-B-join-step li.on > span { color: #fff; }

.glores-B-join-title { margin-bottom: 15px; padding-bottom: 10px; border-bottom: 2px solid #000; }
.glores-B-join-title .join-title { font-size: 20px; font-weight: bold; line-height: 25px; letter-spacing: -.03em; color: #000; }

/* 동그라미 체크박스: 실제 input 은 숨기고(키보드 포커스는 유지) label 앞에 그린다 */
.glores-B-all-agree input, .glores-B-agree-check input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
.glores-B-all-agree label, .glores-B-agree-check label { display: inline-block; position: relative; padding-left: 27px; font-size: 14px; line-height: 20px; letter-spacing: -.03em; vertical-align: top; cursor: pointer; }
.glores-B-all-agree label:before, .glores-B-agree-check label:before { content: ''; position: absolute; top: 1px; left: 0; box-sizing: border-box; width: 20px; height: 20px; border: 1px solid #ddd; border-radius: 50%; background: #fff; }
.glores-B-all-agree label:after, .glores-B-agree-check label:after { content: ''; position: absolute; top: 6px; left: 5px; box-sizing: border-box; width: 10px; height: 7px; border: 2px solid #e1e1e1; border-width: 0 0 2px 2px; transform: rotate(315deg); }
.glores-B-all-agree input:checked + label:before, .glores-B-agree-check input:checked + label:before { border-color: var(--point); background: var(--point); }
.glores-B-all-agree input:checked + label:after, .glores-B-agree-check input:checked + label:after { border-color: #fff; }
.glores-B-all-agree input:focus-visible + label:before, .glores-B-agree-check input:focus-visible + label:before { outline: 2px solid var(--point); outline-offset: 1px; }

.glores-B-all-agree { margin-bottom: 20px; font-size: 0; }
.glores-B-all-agree label { font-weight: bold; color: #000; }
.glores-B-agree-check { margin-top: 10px; }
.glores-B-agree-check label { margin-right: 20px; color: #666; }

.glores-B-agree-title { margin: 35px 0 10px; font-size: 15px; line-height: 20px; letter-spacing: -.03em; color: #444; }
.glores-B-agree-title.mgt-none { margin-top: 0; }
.glores-B-agree-title .point-color1 { color: var(--point); }
.glores-B-agree-box { box-sizing: border-box; height: 150px; overflow-y: auto; padding: 10px; border: 1px solid #ddd; background: #fff; font-size: 14px; line-height: 18px; letter-spacing: -.03em; color: #666; }

/* 버튼 */
.glores-B-btn-wrap { margin-top: 30px; text-align: center; }
.glores-B-btn-wrap:after { content: ''; display: block; clear: both; }
.glores-B-btn-wrap .btn-cell { float: left; box-sizing: border-box; width: 50%; padding-right: 2px; }
.glores-B-btn-wrap .btn-cell:nth-child(2n) { padding-left: 3px; }
.glores-B-btn-type1 { display: inline-block; box-sizing: border-box; width: 100%; margin: 0; padding: 15px 30px; border: 0; border-radius: 5px; background: #efefef; font-size: 15px; font-weight: bold; line-height: 20px; letter-spacing: -.03em; color: #666; text-align: center; vertical-align: top; }
.glores-B-btn-type1.glores-B-highlight { background: var(--point); color: #fff; }

@media (min-width: 768px) {
  .glores-B-btn-wrap { font-size: 0; }
  .glores-B-btn-wrap .btn-cell { display: inline-block; float: none; width: auto; padding-left: 4px; vertical-align: top; }
  .glores-B-btn-wrap .btn-cell:first-child { padding-left: 0; }
  .glores-B-btn-type1 { width: auto; }
}

/* 원본 PC 규칙은 1024px 부터 */
@media (min-width: 1024px) {
  .glores-B-join-step { margin-bottom: 55px; }
  .glores-B-join-step li { height: 60px; }
  .glores-B-join-step li > span { font-size: 18px; line-height: 22px; }
  .glores-B-join-title { margin-bottom: 20px; padding-bottom: 15px; border-bottom-width: 3px; }
  .glores-B-join-title .join-title { font-size: 30px; line-height: 35px; letter-spacing: -.05em; }
  .glores-B-all-agree { margin-bottom: 25px; }
  .glores-B-all-agree label { padding-left: 35px; font-size: 20px; line-height: 25px; letter-spacing: -.05em; }
  .glores-B-all-agree label:before { width: 25px; height: 25px; }
  .glores-B-all-agree label:after { top: 8px; left: 6px; width: 12px; height: 8px; }
  .glores-B-agree-title { margin: 45px 0 15px; font-size: 18px; line-height: 22px; }
  .glores-B-agree-box { height: 200px; padding: 25px; font-size: 15px; line-height: 20px; }
  .glores-B-agree-check { margin-top: 12px; }
  .glores-B-agree-check label { padding-left: 32px; font-size: 16px; line-height: 23px; }
  .glores-B-agree-check label:before { width: 23px; height: 23px; }
  .glores-B-agree-check label:after { top: 7px; left: 6px; width: 11px; height: 7px; }
  .glores-B-btn-wrap { margin-top: 60px; }
  .glores-B-btn-type1 { padding: 19px 60px; font-size: 18px; line-height: 22px; }
}
