@charset "utf-8";

/*============================
#downloadContent・#contactContent
============================*/

:is(#downloadContent, #contactContent) { padding: 6rem 0 8rem; background: #f6f6f6; color: #222; }
:is(#downloadContent, #contactContent) .title { font-size: clamp(1.375rem, 1rem + 1.2vw, 2.125rem); font-weight: 700; line-height: 1.4; letter-spacing: .02em; color: #2f4a89; text-align: center; }
:is(#downloadContent, #contactContent) .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: start; margin-top: 4rem; }

/* 左カラム：資料 */
:is(#downloadContent, #contactContent) .cover { line-height: 0; }
:is(#downloadContent, #contactContent) .cover .image, :is(#downloadContent, #contactContent) .slide .image { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; box-shadow: 0 2px 12px rgba(0, 0, 0, .04); }
:is(#downloadContent, #contactContent) .slides { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 1.25rem; line-height: 0; }
:is(#downloadContent, #contactContent) .lead { margin-top: 2.75rem; font-size: 1.0625rem; font-weight: 700; line-height: 2.1; letter-spacing: .04em; }
:is(#downloadContent, #contactContent) .heading { margin-top: 3rem; padding-bottom: 1rem; border-bottom: 1px dotted #aaa; font-size: 1.0625rem; font-weight: 700; line-height: 1.6; }
:is(#downloadContent, #contactContent) .points { display: grid; grid-template-columns: 1fr 1fr; gap: .375rem 1.5rem; margin-top: 1.25rem; }
:is(#downloadContent, #contactContent) .point { padding-left: 1em; font-size: 1rem; line-height: 1.9; letter-spacing: .04em; text-indent: -1em; }
:is(#downloadContent, #contactContent) .point::before { content: "・"; }

/* 右カラム：フォーム */
:is(#downloadContent, #contactContent) .formBox { padding: 3rem 2.75rem 3.25rem; border: 1px solid #dedede; border-radius: 30px; background: #eee; }
:is(#downloadContent, #contactContent) .formTitle { font-size: 1.25rem; font-weight: 700; line-height: 1.6; letter-spacing: .04em; text-align: center; }
:is(#downloadContent, #contactContent) .formLead { margin-top: 1.25rem; font-size: 1rem; line-height: 1.8; letter-spacing: .04em; }
:is(#downloadContent, #contactContent) .body { margin-top: 2.25rem; }
:is(#downloadContent, #contactContent) .body p { margin-top: 2rem; font-size: 1rem; font-weight: 700; line-height: 1.6; letter-spacing: .04em; }
:is(#downloadContent, #contactContent) .body form > p:first-of-type, :is(#downloadContent, #contactContent) .body > p:first-child { margin-top: 0; }
:is(#downloadContent, #contactContent) .body .required { margin-left: .5rem; font-size: .8125rem; font-weight: 700; color: #c0392b; }
:is(#downloadContent, #contactContent) .body .wpcf7-form-control-wrap { display: block; margin-top: .875rem; }
:is(#downloadContent, #contactContent) .body .wpcf7-form-control-wrap + .wpcf7-form-control-wrap { margin-top: 1.75rem; }
:is(#downloadContent, #contactContent) .body .note { display: block; margin-top: .75rem; font-size: .9375rem; font-weight: 400; }
:is(#downloadContent, #contactContent) .body a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }

/* 表組み（table / th / td）で作ったフォームも縦1列に並べる */
:is(#downloadContent, #contactContent) .body table, :is(#downloadContent, #contactContent) .body tbody, :is(#downloadContent, #contactContent) .body tr, :is(#downloadContent, #contactContent) .body th, :is(#downloadContent, #contactContent) .body td { display: block; width: 100%; padding: 0; border: 0; text-align: left; }
:is(#downloadContent, #contactContent) .body tr + tr { margin-top: 2rem; }
:is(#downloadContent, #contactContent) .body th p, :is(#downloadContent, #contactContent) .body td p { margin-top: 0; }
:is(#downloadContent, #contactContent) .body th span { margin-left: .5rem; font-size: .8125rem; font-weight: 700; color: #c0392b; }
:is(#downloadContent, #contactContent) .body td { margin-top: .875rem; }
:is(#downloadContent, #contactContent) .body td .wpcf7-form-control-wrap { margin-top: 0; }
:is(#downloadContent, #contactContent) .body .hosoku p { margin-top: .75rem; font-size: .9375rem; font-weight: 400; }
:is(#downloadContent, #contactContent) .body .button p { margin-top: 0; }
:is(#downloadContent, #contactContent) .body .button span:has(> .wpcf7-submit) { display: block; }
:is(#downloadContent, #contactContent) .body form > p:empty, :is(#downloadContent, #contactContent) .body form > p:has(> script:only-child) { display: none; }

/* 入力欄（現行サイトの contact.css に準拠） */
:is(#downloadContent, #contactContent) input[type="text"], :is(#downloadContent, #contactContent) input[type="email"], :is(#downloadContent, #contactContent) input[type="tel"], :is(#downloadContent, #contactContent) input[type="url"], :is(#downloadContent, #contactContent) input[type="number"], :is(#downloadContent, #contactContent) input[type="date"], :is(#downloadContent, #contactContent) select { width: 100%; max-width: 100%; padding: 1.0625rem 1.5rem .9375rem; border: 1px solid transparent; border-radius: 30px; background: #fafafa; box-shadow: 0 5px 20px 0 rgba(0, 0, 0, .03); font: inherit; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #222; outline: 0; -webkit-appearance: none; appearance: none; transition: .25s all; }
:is(#downloadContent, #contactContent) input[type="email"] { max-width: 85%; }
:is(#downloadContent, #contactContent) textarea { width: 100%; height: 200px; padding: 1.0625rem 1.5rem .9375rem; border: 1px solid transparent; border-radius: 20px; background: #fafafa; box-shadow: 0 5px 20px 0 rgba(0, 0, 0, .05); font: inherit; font-size: 1rem; font-weight: 400; outline: 0; -webkit-appearance: none; appearance: none; transition: .15s all; }
:is(#downloadContent, #contactContent) input:not([type="submit"]):focus, :is(#downloadContent, #contactContent) select:focus, :is(#downloadContent, #contactContent) textarea:focus { border: 1px solid #555; border-radius: 5px; background: #fff; box-shadow: none; }
:is(#downloadContent, #contactContent) input::placeholder, :is(#downloadContent, #contactContent) textarea::placeholder { color: #ccc; }

/* チェックボックス・ラジオ */
:is(#downloadContent, #contactContent) .wpcf7-checkbox > span, :is(#downloadContent, #contactContent) .wpcf7-acceptance > span, :is(#downloadContent, #contactContent) .wpcf7-radio > span { display: block; margin: 0 !important; }
:is(#downloadContent, #contactContent) .wpcf7-checkbox label, :is(#downloadContent, #contactContent) .wpcf7-acceptance label, :is(#downloadContent, #contactContent) .wpcf7-radio label { cursor: pointer; }
:is(#downloadContent, #contactContent) .wpcf7-checkbox input, :is(#downloadContent, #contactContent) .wpcf7-acceptance input, :is(#downloadContent, #contactContent) .wpcf7-radio input { position: absolute; width: 0; height: 0; margin: 0; opacity: 0; }
:is(#downloadContent, #contactContent) .wpcf7-list-item-label { display: inline-block; position: relative; padding: .5rem 0 .5rem 3.25rem; font-size: 1rem; font-weight: 400; }
:is(#downloadContent, #contactContent) .wpcf7-list-item-label::before { content: ""; position: absolute; top: 50%; left: 0; width: 2.25rem; height: 2.25rem; border-radius: 3px; background: #ddd; transform: translateY(-50%); transition: all .25s ease-out; }
:is(#downloadContent, #contactContent) .wpcf7-radio .wpcf7-list-item-label::before { border-radius: 50%; }
:is(#downloadContent, #contactContent) label:hover .wpcf7-list-item-label::before { background: rgba(0, 0, 0, .25); }
:is(#downloadContent, #contactContent) input:checked + .wpcf7-list-item-label::before { background: #3f5fc9; }
:is(#downloadContent, #contactContent) input[type="checkbox"]:checked + .wpcf7-list-item-label::after { content: ""; position: absolute; top: 50%; left: .875rem; width: .5625rem; height: 1.125rem; border: solid #fff; border-width: 0 2px 2px 0; transform: translateY(-65%) rotate(45deg); }
:is(#downloadContent, #contactContent) input[type="radio"]:checked + .wpcf7-list-item-label::after { content: ""; position: absolute; top: 50%; left: 1.125rem; width: .75rem; height: .75rem; border-radius: 50%; background: #fff; transform: translate(-50%, -50%); }
:is(#downloadContent, #contactContent) input:focus-visible + .wpcf7-list-item-label::before { outline: 2px solid #3f5fc9; outline-offset: 2px; }

/* 送信ボタン */
:is(#downloadContent, #contactContent) .body p:has(.wpcf7-submit) { position: relative; margin-top: 3rem; }
:is(#downloadContent, #contactContent) .wpcf7-submit { display: block; width: 100%; padding: 1.5rem 4.25rem; border: 0; border-radius: 2px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19' fill='none' stroke='%23fff' stroke-width='1.5'/%3E%3Cpath d='M17 13l7 7-7 7' fill='none' stroke='%23fff' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 1.25rem center / 2.25rem, var(--grad-main, linear-gradient(120deg, #33aadd 0%, #5566dd 100%)); font: inherit; font-size: 1.125rem; text-align: center; font-weight: 500; letter-spacing: .06em; color: #fff; cursor: pointer; -webkit-appearance: none; appearance: none; transition: filter .25s, box-shadow .25s; }
:is(#downloadContent, #contactContent) .wpcf7-submit:hover { box-shadow: 0 12px 24px -10px rgba(63, 95, 201, .55); filter: brightness(1.08); }
:is(#downloadContent, #contactContent) .wpcf7-submit:focus, :is(#downloadContent, #contactContent) .wpcf7-submit:active { border: 0; border-radius: 2px; color: #fff; outline: 0; }
:is(#downloadContent, #contactContent) .wpcf7-submit:focus-visible { outline: 2px solid #5566dd; outline-offset: 3px; }
:is(#downloadContent, #contactContent) .wpcf7-submit:disabled { opacity: .6; cursor: wait; box-shadow: none; filter: none; }
:is(#downloadContent, #contactContent) .wpcf7-spinner { position: absolute; top: 50%; right: 5rem; margin: 0; transform: translateY(-50%); }

/* Contact Form 7 のメッセージ（現行サイトの contact.css に準拠） */
:is(#downloadContent, #contactContent) .wpcf7-not-valid-tip { margin-top: .375rem; font-size: .875rem; font-weight: 700; color: #dc3232; }
:is(#downloadContent, #contactContent) .wpcf7 form .wpcf7-response-output { width: 100%; margin: 3em auto 1em !important; padding: 1.2em 1.5em 1.15em !important; border: none !important; border-radius: 10px; background: #00a0d2 !important; font-size: 1rem; font-weight: 700; color: #fff; text-align: center; }
:is(#downloadContent, #contactContent) .wpcf7 form.init .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.resetting .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.submitting .wpcf7-response-output { display: none; }
:is(#downloadContent, #contactContent) .wpcf7 form.sent .wpcf7-response-output { background: #46b450 !important; }
:is(#downloadContent, #contactContent) .wpcf7 form.failed .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.aborted .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.spam .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.invalid .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.unaccepted .wpcf7-response-output, :is(#downloadContent, #contactContent) .wpcf7 form.payment-required .wpcf7-response-output { background: #ff2222 !important; }

/* reCAPTCHA */
.grecaptcha-badge { visibility: inherit !important; z-index: 99; }

/*============================
#contactContent（お問い合わせページ）
============================*/

#contactContent .intro { max-width: 50rem; margin: 2rem auto 0; font-size: 1rem; line-height: 2; text-align: center; }
#contactContent .formBox { max-width: 50rem; margin: 4rem auto 0; }
#contactContent .formBox > .body { margin-top: 0; }
#contactContent .wpcf7-radio { display: flex; flex-wrap: wrap; gap: .25rem 2rem; }
#contactContent .wpcf7-radio > span { display: inline-block; }
#contactContent textarea { height: 14rem; resize: vertical; }

/*============================
#thanksArea（資料請求完了ページ）
============================*/

#formContent.isThanks .head .title { margin-top: 0; }
#formContent #thanksArea .md_container { max-width: none; padding: 0; }
#formContent #thanksArea .catch { font-size: 1.25rem; font-weight: 700; line-height: 1.7; letter-spacing: .04em; color: var(--color-text); }
#formContent #thanksArea .lead { margin-top: 1.75rem; padding: 1.75rem 2rem; border-radius: 1rem; background: var(--color-sky); font-size: var(--fs-base); line-height: 2; color: var(--color-text); }
#formContent #thanksArea .button { margin-top: 3.5rem; text-align: center; }
#formContent #thanksArea .button a { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; min-width: 18rem; padding: 1rem 2.5rem; border: 1px solid var(--color-blueDark); border-radius: 999px; background: var(--color-white); font-size: var(--fs-md); font-weight: 700; letter-spacing: .06em; color: var(--color-blueDark); text-decoration: none; transition: background-color .25s, color .25s; }
#formContent #thanksArea .button a::after { content: "→"; font-weight: 400; }
#formContent #thanksArea .button a:hover { background: var(--color-blueDark); color: var(--color-white); }