:root{
  --teal:#13c2a5;
}

/* ---------- layout ---------- */
.wrap{max-width:628px;margin:0 auto;padding:56px 0 80px;}
@media (max-width:660px){ .wrap{padding-left:16px;padding-right:16px;} }

.card{background:#fff;border:1px solid #e9eef4;border-radius:14px;
  padding:32px 20px 24px;box-shadow:0 1px 3px rgba(20,45,85,.05);}
.page-title{font-size:21px;font-weight:700;margin:0 0 10px;letter-spacing:-.01em;}
.page-sub{font-size:13px;color:#7c8894;line-height:1.75;margin:0 0 22px;}

.errorbox{border-radius:8px;color:#CC0000;background:#fff0f0 url(/common/images_app/pc/default/icon_error.svg) no-repeat 20px center;
  background-size:70px;padding:20px 20px 20px 100px;font-size:13.5px;line-height:1.8;margin:0 0 20px;}
.errorbox p{margin:0;}
@media (max-width:600px){
  .errorbox{background-position-x:14px;padding-left:90px;}
}

/* ---------- panels ---------- */
.panels{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;}
.panel{display:flex;flex-direction:column;border:1px solid #e6ecf3;border-radius:10px;
  background:#fafcfe;padding:20px 18px;}
.panel-head{display:flex;align-items:center;gap:11px;font-size:14.5px;font-weight:700;
  padding-bottom:14px;border-bottom:1px solid #e6ecf3;margin-bottom:18px;}
.panel-head .ico{flex:none;color:var(--blue);}
.panel-new .panel-head .ico{color:var(--teal);}
.panel p{font-size:12.5px;color:#5f6b78;line-height:1.9;margin:0 0 16px;}
.panel form{display:flex;flex-direction:column;flex:1;}

/* 新規登録の特長 */
.feature{background:#fff;border:1px solid #e6ecf3;border-radius:9px;padding:14px 15px;margin-bottom:20px;}
.feature-t{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;
  color:#16202c;margin-bottom:9px;}
.feature-t .ico{flex:none;color:var(--teal);}
.feature ul{margin:0;padding:0;list-style:none;}
.feature li{position:relative;padding-left:13px;font-size:12px;color:#5f6b78;
  line-height:1.85;margin-bottom:3px;}
.feature li:last-child{margin-bottom:0;}
.feature li::before{content:"・";position:absolute;left:0;color:#a9b4c1;}

/* ---------- form ---------- */
.field{margin-bottom:16px;}
.field-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:7px;}
.field label{display:block;font-size:12px;font-weight:700;color:#3d4753;}
.field-head a{font-size:11.5px;color:var(--blue);text-decoration:none;}
.field-head a:hover{text-decoration:underline;}
.field input{width:100%;border:1px solid #e0e6ee;border-radius:7px;padding:11px 13px;
  font-size:13.5px;color:#26303c;font-family:inherit;background:#fff;}
.field input::placeholder{color:#b8c0cb;}
.field input:focus{outline:none;border-color:var(--blue-border);box-shadow:0 0 0 3px rgba(26,95,208,.10);}

.keep{display:flex;align-items:center;gap:9px;font-size:12px;color:#3d4753;
  cursor:pointer;margin-bottom:20px;}
.keep input{display:none;}
.chk{width:15px;height:15px;border-radius:3px;border:1.5px solid #bcc5d1;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;flex:none;}
.keep input:checked ~ .chk{background:var(--blue);border-color:var(--blue);}
.keep input:checked ~ .chk::after{content:"";width:4px;height:8px;border:solid #fff;
  border-width:0 2px 2px 0;transform:rotate(45deg) translateY(-1px);}

/* ---------- buttons ---------- */
.btn{margin-top:auto;width:100%;border:none;border-radius:8px;color:#fff;
  font-size:13px;font-weight:700;font-family:inherit;padding:17px 10px;cursor:pointer;
  line-height:1;white-space:nowrap;letter-spacing:-.01em;transition:background .15s;
  display:flex;align-items:center;justify-content:center;text-decoration:none;}
.btn-teal{background:var(--teal);}
.btn-teal:hover{background:#0fae94;}
.btn-blue{background:var(--blue);}
.btn-blue:hover{background:#1550b8;}

/* ---------- responsive ---------- */
@media (max-width:600px){
  .brand{justify-content:center;}
  .wrap{padding:36px 14px 60px;}
  .card{padding:26px 16px 20px;}
  .page-title{font-size:18px;}
  .page-sub{font-size:12.5px;margin-bottom:18px;}
  .panels{grid-template-columns:minmax(0,1fr);gap:14px;}
  .panel-new{order:2;}
  .panel{padding:18px 15px;}
  .panel-head{font-size:13.5px;}
  .btn{padding:16px 8px;font-size:12.5px;white-space:normal;line-height:1.5;}
}
