/* =========================================================
  FV
========================================================= */
.contact-fv-container{
    background-image: url(assets/image/contact-fv.webp);
    background-size: cover;
    background-position: center;
}

.contact-fv-content{
    padding-top: calc(100vw * 81.5 / 1440);
    padding-bottom: calc(100vw * 81.5 / 1440);
    padding-left: calc(100vw * 200 / 1440);
    padding-right: calc(100vw * 200 / 1440);
}

.contact-fv-content h1{
    font-size: calc(100vw * 40 / 1440);
    line-height: calc(100vw * 44 / 1440);
    font-weight: bold;
    color: #ffffff;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
}

.contact-fv-content p{
    font-size: calc(100vw * 25 / 1440);
    line-height: calc(100vw * 44 / 1440);
    color: #ffffff;
    font-family: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
}

@media(max-width:768px){
    .contact-fv-container{
        background-image: url(assets/image/contact-fv.webp);
        background-size: cover;
        background-position: center;
    }

    .contact-fv-content{
        padding-top: calc(100vw * 23 / 375);
        padding-bottom: calc(100vw * 23 / 375);
        padding-left: calc(100vw * 18 / 375);
        padding-right: calc(100vw * 18 / 375);
        height: calc(100vw * 95 / 375);
    }

    .contact-fv-content h1{
        font-size: calc(100vw * 20 / 375);
        line-height: calc(100vw * 44 / 375);
    }

    .contact-fv-content p{
        font-size: calc(100vw * 10 / 375);
        line-height: 1;
        margin-top: -2px;
    }
}

/* =========================================================
  Contact Form
  - 769px以上: 1440基準
  - 768px以下: 375基準
========================================================= */
.contact-input-container{
    padding-top: calc(100vw * 94 / 1440);
    background-color:#F0F2FA;
}

.contact-heading{
    text-align:center;
}

.contact-heading h2{
    font-size: calc(100vw * 32 / 1440);
    color: #28476B;
    font-weight:bold;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    line-height:160%;
}

.contact-heading p{
    font-size: calc(100vw * 18 / 1440);
    color: #28476B;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    margin-top: calc(100vw * 40 / 1440);
    line-height:160%;
}

.cf7-form{
    width: calc(100vw * 1040 / 1440);
    margin: 0 auto;
    margin-top: calc(100vw * 30 / 1440);
}

.cf7-section-title{
    font-size: calc(100vw * 24 / 1440);
    font-weight: 700;
    line-height: 160%;
    color: #28476B;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    padding-bottom: calc(100vw * 20 / 1440);
    margin-bottom: calc(100vw * 30 / 1440);
    border-bottom: 1px solid #E6EAF5;
}

.cf7-headline p{
    display:flex;
    align-items:center;
    gap: calc(100vw * 10 / 1440);
}

.cf7-row{
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 8 / 1440);
    margin-bottom: calc(100vw * 40 / 1440);
}

.cf7-label{
    display: flex;
    align-items: center;
    gap: calc(100vw * 10 / 1440);
}

.cf7-label__text{
    font-size: calc(100vw * 20 / 1440);
    font-weight: bold;
    line-height: 160%;
    color: #000000;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
}

.cf7-badge{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-left: calc(100vw * 10 / 1440);
    padding-right: calc(100vw * 10 / 1440);
    height: calc(100vw * 26 / 1440);
    background: #28476B;
    color: #ffffff;
    font-size: calc(100vw * 16 / 1440);
    font-weight: 700;
    letter-spacing: 0.02em;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    flex: 0 0 auto;
}

.cf7-field{
    width: 100%;
}

.cf7-field input[type="text"],
.cf7-field input[type="email"],
.cf7-field input[type="tel"],
.cf7-field textarea{
    width: 100%;
    border: 1px solid #D6DEEF;
    background: #ffffff;
    color: #0B1B2B;
    font-size: calc(100vw * 16 / 1440);
    line-height: 160%;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    padding: calc(100vw * 14 / 1440) calc(100vw * 14 / 1440);
    outline: none;
    box-shadow: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    height: calc(100vw * 60 / 1440);
}

.cf7-field textarea{
    min-height: calc(100vw * 200 / 1440);
    resize: vertical;
}

.cf7-field input[type="text"]::placeholder,
.cf7-field input[type="email"]::placeholder,
.cf7-field input[type="tel"]::placeholder,
.cf7-field textarea::placeholder{
    color: rgba(40, 71, 107, 0.55);
}

.cf7-field input[type="text"]:focus,
.cf7-field input[type="email"]:focus,
.cf7-field input[type="tel"]:focus,
.cf7-field textarea:focus{
    border-color: #28476B;
    box-shadow: 0 0 0 calc(100vw * 3 / 1440) rgba(40, 71, 107, 0.15);
}

/* Checkbox（行の箱） */
.cf7-field .wpcf7-checkbox{
    display: flex;
    gap: calc(100vw * 40 / 1440);
    padding-top: calc(100vw * 17 / 1440);
    padding-bottom: calc(100vw * 17 / 1440);
    padding-left: calc(100vw * 16 / 1440);
    font-weight: bold;
    background: #ffffff;
    height: calc(100vw * 60 / 1440);
    align-items: center;
    margin-top: calc(100vw * 8 / 1440);
}

.cf7-field .wpcf7-checkbox .wpcf7-list-item{
    margin: 0;
}

.cf7-field .wpcf7-checkbox .wpcf7-list-item label{
    display: flex;
    align-items: center;
    gap: calc(100vw * 10 / 1440);
    cursor: pointer;
    font-size: calc(100vw * 16 / 1440);
    line-height: 160%;
    color: #0B1B2B;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
}

/* Submit */
.cf7-actions{
    margin-top: calc(100vw * 32 / 1440);
    display: flex;
    flex-direction: column;
    gap: calc(100vw * 18 / 1440);
}

.cf7-actions p{
    font-size: calc(100vw * 14 / 1440);
    line-height: 160%;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    text-align:center;
}

.cf7-submit,
.cf7-actions input[type="submit"]{
    width: calc(100vw * 480 / 1440);
    height: calc(100vw * 60 / 1440);
    border: none;
    background: #28476B;
    color: #ffffff;
    font-size: calc(100vw * 18 / 1440);
    font-weight: 700;
    letter-spacing: 0.02em;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    cursor: pointer;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
    box-shadow: calc(100vw * 4 / 1440) calc(100vw * 4 / 1440) calc(100vw * 4 / 1440) 0 rgb(0 0 0 / 18%);
    display:flex;
    justify-content:center;
    margin:0 auto;
}

.cf7-actions input[type="submit"]:hover{
    transform: translateY(calc(100vw * -1 / 1440));
    box-shadow: 0 calc(100vw * 10 / 1440) calc(100vw * 22 / 1440) rgba(40, 71, 107, 0.22);
}

.cf7-actions input[type="submit"]:active{
    transform: translateY(0);
    opacity: 0.9;
}

.cf7-actions input[type="submit"]:disabled{
    opacity: 0.6;
    cursor: not-allowed;
    box-shadow: none;
}

/* CF7 message */
.wpcf7 form .wpcf7-response-output{
    margin: calc(100vw * 18 / 1440) 0 0;
    padding: calc(100vw * 12 / 1440) calc(100vw * 14 / 1440);
    border-radius: calc(100vw * 8 / 1440);
    font-size: calc(100vw * 14 / 1440);
    line-height: 160%;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
}

.wpcf7 form .wpcf7-not-valid-tip{
    margin-top: calc(100vw * 8 / 1440);
    font-size: calc(100vw * 13 / 1440);
    line-height: 160%;
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
}

/* =========================================================
  Checkbox（丸）
========================================================= */
.cf7-field .wpcf7-checkbox input[type="checkbox"]{
    -webkit-appearance: none;
    appearance: none;
    width: calc(100vw * 19 / 1440);
    height: calc(100vw * 19 / 1440);
    border: 1px solid #000000;
    border-radius: 50%;
    background: #ffffff;
    display: inline-grid;
    place-content: center;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.cf7-field .wpcf7-checkbox input[type="checkbox"]::before{
    content: "";
    width: calc(100vw * 10 / 1440);
    height: calc(100vw * 10 / 1440);
    border-radius: 50%;
    transform: scale(0);
    transition: transform 0.15s ease;
    background: #28476B;
}

.cf7-field .wpcf7-checkbox input[type="checkbox"]:checked{
    border-color: #28476B;
}

.cf7-field .wpcf7-checkbox input[type="checkbox"]:checked::before{
    transform: scale(1);
}

.cf7-field .wpcf7-checkbox input[type="checkbox"]:focus{
    outline: none;
    box-shadow: 0 0 0 calc(100vw * 3 / 1440) rgba(40, 71, 107, 0.15);
}

/* =========================================================
  SP（<=768）：375基準
========================================================= */
@media(max-width:768px){
    .contact-input-container{
        padding-top: calc(100vw * 25 / 375);
    }

    .contact-heading{
        text-align:center;
    }

    .contact-heading h2{
        font-size: calc(100vw * 25 / 375);
        font-weight:bold;
        font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
        line-height:160%;
    }

    .contact-heading p{
        font-size: calc(100vw * 15 / 375);
        color: #28476B;
        width: calc(100vw * 332 / 375);
        margin: 0 auto;
        margin-top: calc(100vw * 30 / 375);
        margin-bottom: calc(100vw * 31 / 375);
        line-height:160%;
    }

    .cf7-form{
        width: calc(100vw * 339 / 375);
    }

    .cf7-section-title{
        font-size: calc(100vw * 18 / 375);
        padding-bottom: calc(100vw * 12 / 375);
        margin-bottom: calc(100vw * 18 / 375);
    }

    .cf7-row{
        gap: calc(100vw * 8 / 375);
        padding: 0;
        margin-bottom: calc(100vw * 25 / 375);
    }

    .cf7-label{
        gap: calc(100vw * 10 / 375);
    }

    .cf7-label__text{
        font-size: calc(100vw * 14 / 375);
    }

    .cf7-badge{
        padding-left: calc(100vw * 8 / 375);
        padding-right: calc(100vw * 8 / 375);
        height: calc(100vw * 22 / 375);
        border-radius: 0;
        font-size: calc(100vw * 11 / 375);
        background:#28476B;
        color:#ffffff;
    }

    .cf7-field input[type="text"],
    .cf7-field input[type="email"],
    .cf7-field input[type="tel"],
    .cf7-field textarea{
        border-radius: 0;
        font-size: calc(100vw * 14 / 375);
        padding: calc(100vw * 12 / 375) calc(100vw * 12 / 375);
        height: calc(100vw * 60 / 375);
    }

    .cf7-field textarea{
        min-height: calc(100vw * 170 / 375);
    }

    .cf7-field .wpcf7-checkbox{
        gap: calc(100vw * 10 / 375);
        padding-top: 0;
        padding-bottom: 0;
        padding-left: calc(100vw * 15 / 375);
        padding-right: 0;
        height: auto;
        margin-top: 0;
        flex-direction: column;
        justify-content: center;
        align-items: flex-start;
        padding: calc(100vw * 12 / 375);
    }

    .cf7-field .wpcf7-checkbox .wpcf7-list-item label{
        gap: calc(100vw * 5 / 375);
        font-size: calc(100vw * 14 / 375);
    }

    .cf7-actions{
        margin-top: calc(100vw * 25 / 375);
        gap: calc(100vw * 20 / 375);
        margin-left: auto;
        margin-right: auto;
    }
	
	.cf7-actions-p01{
		width: calc(100vw * 311 / 375);
	}
    .cf7-actions p{
        font-size: calc(100vw * 14 / 375);
        margin:0 auto;
    }

    .cf7-submit,
    .cf7-actions input[type="submit"]{
        height: calc(100vw * 54 / 375);
        width: calc(100vw * 339 / 375);
        font-size: calc(100vw * 14 / 375);
        box-shadow: calc(100vw * 4 / 375) calc(100vw * 4 / 375) calc(100vw * 4 / 375) 0 rgb(0 0 0 / 18%);
    }

    .cf7-actions input[type="submit"]:hover{
        transform: translateY(calc(100vw * -1 / 375));
        box-shadow: 0 calc(100vw * 10 / 375) calc(100vw * 22 / 375) rgba(40, 71, 107, 0.22);
    }

    .wpcf7 form .wpcf7-response-output{
        margin: calc(100vw * 14 / 375) 0 0;
        padding: calc(100vw * 10 / 375) calc(100vw * 12 / 375);
        border-radius: calc(100vw * 8 / 375);
        font-size: calc(100vw * 12 / 375);
    }

    .wpcf7 form .wpcf7-not-valid-tip{
        margin-top: calc(100vw * 6 / 375);
        font-size: calc(100vw * 12 / 375);
    }

    .cf7-field .wpcf7-checkbox input[type="checkbox"]{
        width: calc(100vw * 15 / 375);
        height: calc(100vw * 15 / 375);
		aspect-ratio:1/1;
    }

    .cf7-field .wpcf7-checkbox input[type="checkbox"]::before{
        width: calc(100vw * 10 / 375);
        height: calc(100vw * 10 / 375);
    }

    .cf7-field .wpcf7-checkbox input[type="checkbox"]:focus{
        box-shadow: 0 0 0 calc(100vw * 3 / 375) rgba(40, 71, 107, 0.15);
    }
}

/* =========================================================
  Tel
========================================================= */
.contact-tel-content{
    margin-top: calc(100vw * 31 / 1440);
    text-align:center;
    padding: calc(100vw * 10 / 1440);
    padding-bottom: calc(100vw * 66 / 1440);
}

.contact-tel-area01 a{
    font-size: calc(100vw * 18 / 1440);
    font-weight:bold;
    color:#28476B;
    line-height:120%;
}

.contact-tel-area01 span{
    border:1px solid #28476B;
    line-height:160%;
    padding-left: calc(100vw * 6 / 1440);
    padding-right: calc(100vw * 6 / 1440);
    margin-right: calc(100vw * 8 / 1440);
}


.contact-button-arrow {
  font-size: calc(100vw * 15 / 1440);
  line-height: 1;
  display: inline-flex;
  align-items: center;
}

.contact-button-arrow svg {
  width: 1em;
  height: 1em;
}

@media(max-width:768px){
    .contact-tel-content{
        margin-top: calc(100vw * 1 / 375);
        text-align:center;
        padding: calc(100vw * 10 / 375);
        padding-bottom: calc(100vw * 66 / 375);
    }

    .contact-tel-area01 a{
        font-size: calc(100vw * 18 / 375);
        font-weight:bold;
        color:#28476B;
        line-height:120%;
    }

    .contact-tel-area01 span{
        border:1px solid #28476B;
        line-height:160%;
        padding-left: calc(100vw * 6 / 375);
        padding-right: calc(100vw * 6 / 375);
        margin-right: calc(100vw * 8 / 375);
    }

  .contact-button-arrow{
    font-size: calc(100vw * 12 / 375);
  }
}
.wpcf7 form.sent .wpcf7-response-output{
	max-width:1040px;
	margin:0 auto;
}
.cf7-actions p:nth-of-type(2){
    display: flex;
    align-items: center;
    flex-direction: column;
}
.cf7-submit{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap:calc(100vw * 10 / 1440);
}

.cf7-submit .contact-button-arrow{
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.cf7-submit .contact-button-arrow svg{
	width: 1em;
    height: 1em;
  display: block;
}

.contact-container{
	display:none
}

.contact-thanks-container{
    background-color:#F0F2FA;
}

.contact-thanks-content{
    width:calc(100vw * 1040 / 1440);
    margin:0 auto;
    padding-top:calc(100vw * 46 / 1440);
    padding-bottom:calc(100vw * 111 / 1440);
}

.contact-thanks-text h2{
    font-size: calc(100vw * 32 / 1440);
    color: #28476B;
    font-weight:bold;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    line-height:160%;
}

.contact-thanks-text p.contact-thanks-text-on{
    font-size: calc(100vw * 24 / 1440);
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    line-height:160%;
    margin-top: calc(100vw * 49 / 1440);
    padding-top: calc(100vw * 15 / 1440);
}

.contact-thanks-text-under{
    padding-top:calc(100vw * 60 / 1440);
    padding-bottom:calc(100vw * 60 / 1440);
}

.contact-thanks-text p.contact-thanks-text-under{
    font-size: calc(100vw * 16 / 1440);
    font-family: "Noto Sans JP", "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    line-height:160%;
    margin-top:calc(100vw * 15 / 1440);
}

.contact-thanks-link{
    width: calc(100vw * 480 / 1440);
    height: calc(100vw * 60 / 1440);
    border: none;
    background: #28476B;
    color: #ffffff;
    font-size: calc(100vw * 18 / 1440);
    font-weight: 700;
    letter-spacing: 0.02em;
    font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
    cursor: pointer;
    transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.15s ease;
    box-shadow: calc(100vw * 4 / 1440) calc(100vw * 4 / 1440) calc(100vw * 4 / 1440) 0 rgb(0 0 0 / 18%);
    display: flex;
    justify-content: center;
    align-items:center;
    margin: 0 auto;
}

.more-arrow {
    font-size: calc(100vw * 15 / 1440);
    line-height: 1;
    display: inline-flex;
    align-items: center;
}

.more-arrow svg {
    width: 1em;
    height: 1em;
}

@media(max-width:768px){
    .contact-thanks-content{
        width:calc(100vw * 339 / 375);
        margin:0 auto;
        padding-top:calc(100vw * 26 / 375);
        padding-bottom:calc(100vw * 58.5 / 375);
    }

    .contact-thanks-text h2{
        font-size: calc(100vw * 25 / 375);
        color: #28476B;
        font-weight:bold;
        text-align:center;
    }

    .contact-thanks-text p.contact-thanks-text-on{
        font-size: calc(100vw * 20 / 375);
        line-height:160%;
        width:calc(100vw * 339 / 375);
        margin:0 auto;
        margin-top: calc(100vw * 45 / 375);
        padding-top: calc(100vw * 15 / 375);
    }

    .contact-thanks-text-under{
        padding-top:calc(100vw * 30 / 375);
        padding-bottom:calc(100vw * 30 / 375);
    }

    .contact-thanks-text p.contact-thanks-text-under{
        font-size: calc(100vw * 15 / 375);
        line-height:160%;
        width:calc(100vw * 339 / 375);
        margin:0 auto;
        margin-top:0;
    }

    .contact-thanks-link{
        width: calc(100vw * 339 / 375);
        height: calc(100vw * 60 / 375);
        border: none;
        font-size: calc(100vw * 18 / 375);
        font-weight: 700;
    }

    .more-arrow {
        font-size: calc(100vw * 10 / 375);
        line-height: 1;
        display: inline-flex;
        align-items: center;
    }
}

