/* ==================================================
   Contact Page
================================================== */

.contact-page{
    max-width:1200px;
    margin:180px auto 100px;
    padding:0 20px;
}

.contact-lead{
    max-width:900px;
    margin:0 auto 60px;
    text-align:center;
    color:#666;
    font-size:20px;
    line-height:2;
    letter-spacing:.05em;
}

.contact-lead strong{
    color:#1e88e5;
    font-weight:700;
}

/* ==================================================
   Contact Form
================================================== */

.wpcf7{
    max-width:850px;
    margin:0 auto;
    padding:45px;
    background:#fff;
    border-radius:20px;
    box-shadow:0 8px 30px rgba(0,0,0,.08);
}

/* ラベル */

.wpcf7 label{
    display:block;
    color:#333;
    font-size:15px;
    font-weight:600;
    margin-bottom:10px;
}

/* 必須 */

.required{
    display:inline-block;
    margin-left:6px;
    padding:2px 8px;
    background:#e53935;
    color:#fff;
    font-size:11px;
    font-weight:700;
    border-radius:999px;
}

/* ==================================================
   Input
================================================== */

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea{

    width:100%;
    box-sizing:border-box;

    margin-top:8px;
    margin-bottom:24px;

    padding:15px 16px;

    border:1px solid #ddd;
    border-radius:10px;

    background:#fff;

    font-size:16px;

    transition:.25s;

}

.wpcf7 input[type="text"]:hover,
.wpcf7 input[type="email"]:hover,
.wpcf7 input[type="tel"]:hover,
.wpcf7 textarea:hover{

    border-color:#1e88e5;

}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus{

    outline:none;

    border-color:#1e88e5;

    box-shadow:0 0 0 3px rgba(30,136,229,.15);

}

.wpcf7 textarea{

    min-height:220px;

    resize:vertical;

}

/* ==================================================
   Contact Type（お問い合わせ種別）
================================================== */

.wpcf7-radio:first-of-type{

    display:grid;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:16px;

    margin:15px 0 30px;

}

.wpcf7-radio:first-of-type .wpcf7-list-item{

    display:block;

    margin:0;

}

.wpcf7-radio:first-of-type .wpcf7-list-item label{

    display:flex;

    align-items:center;

    gap:12px;

    height:100%;

    padding:18px;

    border:2px solid #e5e5e5;

    border-radius:14px;

    background:#fff;

    cursor:pointer;

    transition:.25s;

}

.wpcf7-radio:first-of-type .wpcf7-list-item label:hover{

    border-color:#1e88e5;

    background:#f7fbff;

    transform:translateY(-2px);

    box-shadow:0 6px 16px rgba(30,136,229,.08);

}

.wpcf7-radio:first-of-type input[type="radio"]{

    accent-color:#1e88e5;

    transform:scale(1.2);

}

/* ==================================================
   Reply Method（返信方法）
================================================== */

.wpcf7-radio:not(:first-of-type){

    display:flex;

    flex-wrap:wrap;

    gap:20px;

    margin:15px 0 30px;

}

.wpcf7-radio:not(:first-of-type) .wpcf7-list-item{

    margin:0;

}

/* ==================================================
   File Upload
================================================== */

.wpcf7 input[type="file"]{

    width:100%;

    margin-bottom:30px;

    padding:14px;

    border:2px dashed #d6d6d6;

    border-radius:12px;

    background:#fafafa;

    cursor:pointer;

    transition:.25s;

}

.wpcf7 input[type="file"]:hover{

    border-color:#1e88e5;

    background:#f5faff;

}

/* ==================================================
   Privacy Policy
================================================== */

.wpcf7-acceptance{

    margin:35px 0;

}

.wpcf7-acceptance label{

    display:flex;

    align-items:flex-start;

    gap:12px;

    line-height:1.8;

    cursor:pointer;

}

.wpcf7-acceptance input{

    margin-top:4px;

    transform:scale(1.15);

}

.wpcf7-acceptance a{

    color:#1e88e5;

    text-decoration:none;

}

.wpcf7-acceptance a:hover{

    text-decoration:underline;

}

/* ==================================================
   Submit Button
================================================== */

.wpcf7-submit{

    display:block;

    width:260px;

    margin:40px auto 0;

    padding:16px;

    border:none;

    border-radius:999px;

    background:#1e88e5;

    color:#fff;

    font-size:17px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}

.wpcf7-submit:hover{

    background:#1565c0;

    transform:translateY(-2px);

    box-shadow:0 10px 20px rgba(30,136,229,.25);

}

/* ==================================================
   Validation
================================================== */

.wpcf7-not-valid{

    border-color:#e53935 !important;

}

.wpcf7-not-valid-tip{

    display:block;

    margin-top:-16px;

    margin-bottom:18px;

    color:#e53935;

    font-size:14px;

    font-weight:500;

}

/* ==================================================
   Response Message
================================================== */

.wpcf7-response-output{

    margin-top:30px !important;

    padding:18px 22px;

    border:none !important;

    border-radius:12px;

    font-size:15px;

    line-height:1.8;

}

.wpcf7 form.sent .wpcf7-response-output{

    background:#e8f5e9;

    color:#2e7d32;

}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output{

    background:#ffebee;

    color:#c62828;

}

/* ==================================================
   Loading
================================================== */

.wpcf7-spinner{

    margin-left:12px;

}

/* ==================================================
   Contact Information
================================================== */

.contact-info{

    margin-top:80px;

    padding:60px;

    background:#fff;

    border-radius:20px;

    box-shadow:0 8px 30px rgba(0,0,0,.08);

    text-align:center;

}

.contact-icon{

    display:flex;

    justify-content:center;

    align-items:center;

    width:80px;

    height:80px;

    margin:0 auto 30px;

    border-radius:50%;

    background:#1e88e5;

    color:#fff;

    font-size:34px;

}

.contact-card{

    max-width:720px;

    margin:40px auto 0;

    padding:40px;

    background:#f8faff;

    border-radius:16px;

}

.contact-card h3{

    margin-bottom:18px;

    font-size:24px;

}

.contact-card p{

    margin:10px 0;

    color:#666;

    line-height:1.9;

}

.mail-address{

    margin-top:25px;

}

.mail-address a{

    color:#1e88e5;

    font-size:28px;

    font-weight:700;

    text-decoration:none;

    transition:.25s;

}

.mail-address a:hover{

    text-decoration:underline;

}
/* ==================================================
   Tablet
================================================== */

@media (min-width:769px) and (max-width:1024px){

    .contact-page{

        margin:150px auto 80px;

        padding:0 30px;

    }

    .contact-lead{

        max-width:750px;

        font-size:18px;

        line-height:1.9;

    }

    .wpcf7{

        max-width:100%;

        padding:35px;

        border-radius:18px;

    }

    .wpcf7 label{

        font-size:15px;

    }

    .wpcf7 textarea{

        min-height:200px;

    }

    /* お問い合わせ種別 */

    .wpcf7-radio:first-of-type{

        grid-template-columns:repeat(2,1fr);

        gap:14px;

    }

    /* 返信方法 */

    .wpcf7-radio:not(:first-of-type){

        gap:16px;

    }

    /* ボタン */

    .wpcf7-submit{

        width:240px;

    }

    /* Contact */

    .contact-info{

        padding:45px 30px;

    }

    .contact-card{

        padding:30px;

    }

    .contact-card h3{

        font-size:22px;

    }

    .contact-card p{

        font-size:15px;

    }

    .mail-address a{

        font-size:24px;

    }

}

/* ==================================================
   Mobile
================================================== */

@media (max-width:768px){

    .contact-page{

        margin:110px auto 50px;

        padding:0 15px;

    }

    .contact-lead{

        max-width:100%;

        font-size:15px;

        line-height:1.8;

    }

    .wpcf7{

        padding:22px;

        border-radius:15px;

    }

    .wpcf7 label{

        font-size:14px;

    }

    .wpcf7 input[type="text"],
    .wpcf7 input[type="email"],
    .wpcf7 input[type="tel"],
    .wpcf7 textarea{

        font-size:16px;

        padding:14px;

    }

    .wpcf7 textarea{

        min-height:170px;

    }

    /* お問い合わせ種別 */

    .wpcf7-radio:first-of-type{

        grid-template-columns:1fr;

        gap:12px;

    }

    .wpcf7-radio:first-of-type .wpcf7-list-item label{

        padding:14px;

    }

    /* 返信方法 */

    .wpcf7-radio:not(:first-of-type){

        flex-direction:column;

        gap:10px;

    }

    /* ファイル */

    .wpcf7 input[type="file"]{

        padding:12px;

    }

    /* ボタン */

    .wpcf7-submit{

        width:100%;

        font-size:16px;

        padding:15px;

    }

    /* Contact */

    .contact-info{

        margin-top:50px;

        padding:30px 18px;

    }

    .contact-icon{

        width:60px;

        height:60px;

        font-size:26px;

    }

    .contact-card{

        margin-top:20px;

        padding:20px 18px;

    }

    .contact-card h3{

        font-size:19px;

    }

    .contact-card p{

        font-size:14px;

        line-height:1.8;

    }

    .mail-address{

        margin-top:18px;

    }

    .mail-address a{

        font-size:18px;

        word-break:break-word;

    }

}