/* 0. 共通グローバル ------------------------------------------------- */
body#bodyId {
    background: #F7F9FC;
    font-size: 112.5%;
}

@media(min-width:768px) {
    body#bodyId {
        font-size: 125%;
    }
}

/* 1. 動的コンテナ(lpeCDiv_****) を中央寄せ --------------------------- */
div[id^="lpeCDiv_"].lpeCElement {
    /* ここが重要 */
    position: static !important;
    margin: 0 auto !important;
    width: 100% !important;
}

/* 2. フォームカード --------------------------------------------------- */
form.mktoForm {
    background: #FFF;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .06);
    padding: 32px;
    margin: 0 auto;
    max-width: 680px;
    overflow: hidden;
}

@media (min-width:768px){
  form.mktoForm{ max-width:860px !important; }

  form.mktoForm label[for="inquiry_service"]
    ~ .mktoLogicalField.mktoCheckboxList{
      width:720px !important;
    }
}

/* 3. タイポグラフィ --------------------------------------------------- */
form.mktoForm h1 {
    font: 700 2rem/1.3 sans-serif;
    text-align: center;
    margin: 0 0 28px;
}

form.mktoForm .mktoHtmlText {
    /* 長文のはみ出し防止 */
    width: 100% !important;
    font-size: .9rem;
    line-height: 1.7;
    color: #555;
    word-break: break-word;
}

/* 4. ラベル & バッジ --------------------------------------------------- */
form.mktoForm .mktoLabel {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    width: 260px;
    font: 600 1rem/1.4 sans-serif;
    color: #1A1A1A;
}

form.mktoForm .mktoRequiredField>label::after {
    content: "必須";
    background: #FFE69D;
    color: #7B5B00;
}

form.mktoForm .mktoFieldWrap:not(.mktoRequiredField)>label::after {
    content: "任意";
    background: #E5E8EF;
    color: #555;
}

form.mktoForm .mktoRequiredField>label::after,
form.mktoForm .mktoFieldWrap:not(.mktoRequiredField)>label::after {
    font-size: .75rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    margin-left: 8px;
}

form.mktoForm .mktoAsterix {
    display: none !important;
}

/* 赤 * を消す */

/* 5. 入力フィールド --------------------------------------------------- */
form.mktoForm .mktoField {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    font-size: 1rem;
    border: 1px solid #DDE2EB;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color .2s;
}

form.mktoForm .mktoField:focus {
    border-color: #0070E0;
    outline: none;
}

form.mktoForm textarea.mktoField {
    height: 120px;
    resize: vertical;
}

form.mktoForm input[type=checkbox],
form.mktoForm input[type=radio] {
    width: 18px;
    height: 18px;
    margin-right: 6px;
    vertical-align: middle;
    accent-color: #0070E0;
    position:relative;
    top:4px;                 /* ← ここで下げる */
}

form.mktoForm .mktoCheckboxList label,
form.mktoForm .mktoRadioList label {
    font-size: .95rem;
    line-height: 1.6;
}

form.mktoForm .mktoFormRow {
    margin-bottom: 20px;
}

form.mktoForm .mktoOffset {
    width: 0 !important;
    margin: 0 !important;
}

/* 左10px余白を0に */

/* 6. 送信ボタン ------------------------------------------------------- */
form.mktoForm .mktoButtonRow {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 24px 0 0;
}

form.mktoForm .mktoButtonWrap {
    display: inline-block !important;
    margin: 0 auto !important;
    float: none !important;
}

form.mktoForm .mktoButton {
    width: 280px !important;
    max-width: 360px !important;
    padding: 16px 0 !important;
    font: 700 1.1rem sans-serif !important;
    letter-spacing: .06em !important;
    color: #fff !important;
    background: linear-gradient(90deg, #FF7A1C 0%, #FF6200 100%) !important;
    background-color: #FF6200 !important;
    background-image: linear-gradient(90deg, #FF7A1C 0%, #FF6200 100%) !important;
    border: 0 !important;
    border-radius: 48px !important;
    cursor: pointer !important;
    transition: opacity .2s !important;
}

form.mktoForm .mktoButton:hover {
    opacity: .85 !important;
    background: linear-gradient(90deg, #FF7A1C 0%, #FF6200 100%) !important;
    background-image: linear-gradient(90deg, #FF7A1C 0%, #FF6200 100%) !important;
}

form.mktoForm .mktoButton:active,
form.mktoForm .mktoButton:focus {
    background: linear-gradient(90deg, #FF7A1C 0%, #FF6200 100%) !important;
    background-image: linear-gradient(90deg, #FF7A1C 0%, #FF6200 100%) !important;
    outline: none !important;
}

form.mktoForm .mktoLabel{
  /* cross-axis（縦方向）の揃えを中央 → 上端へ */
  align-items: flex-start !important;
}

/* 行高の影響でバッジがわずかに下がるケースの微調整 */
form.mktoForm .mktoLabel::after{
  margin-top: 0 !important;
}

/* ラベル内 <span> 全体を "細字 + 小さめサイズ" にしておく */
form.mktoForm label[for="inquiry_service"] span{
  font-weight: 400 !important;   /* ボールド解除 */
  font-size: .85rem !important;  /* ← お好みで調整 (.8–.9rem 目安) */
}

/* 先頭行 (=「問い合わせサービス」) だけ元の太字＆標準サイズに戻す */
form.mktoForm label[for="inquiry_service"] span::first-line{
  font-weight: 600 !important;   /* 太字維持 */
  font-size: 1rem !important;    /* 標準サイズに復帰 */
}