/*
Theme Name: SWELL Child
Template: swell
Version: 1.0.0
*/

.l-header__bar {
    padding: 10px 0;
}

.l-header__bar .c-catchphrase {
    font-size: 16px;
    font-weight: 600;
}

/* visibility: hidden を全画面サイズで上書き */
.p-postSlider__swiper:not(.swiper-initialized) {
    visibility: visible !important;
}

.p-mainVisual__slideText {
    font-size: 5.0vw;
}

@media (min-width: 600px) {
    .p-mainVisual__slideText {
        font-size: 22px;
        margin-top: 0.5em;
    }
}

/* PC版でスライダー機能を無効化 */
@media (min-width: 960px) {

    .p-postSlider .swiper {
        overflow: visible;
    }

    .p-postSlider .postSlider__postList {
        transform: none !important;
        transition: none !important;
        flex-wrap: wrap;
        justify-content: center;
    }

    .p-postSlider .swiper-wrapper {
        transform: none !important;
        transition: none !important;
        flex-wrap: wrap;
        justify-content: center;
    }

    /* ナビゲーションボタンとページネーションを非表示 */
    .p-postSlider .swiper-button-prev,
    .p-postSlider .swiper-button-next,
    .p-postSlider .swiper-pagination {
        display: none;
    }
}

/* Contact Form 7 スタイル調整 */

/* フォーム全体の余白調整 */
.wpcf7 form {
    max-width: 800px;
    margin: 0 auto;
}

/* 各段落（入力項目）の間隔を追加 */
.wpcf7 form p {
    margin-bottom: 0.8em;
}

/* ラベル（質問文）を含む段落の下余白を小さく */
.wpcf7 form p:not(:has(input)):not(:has(textarea)):not(:has(select)):not(:has(.wpcf7-checkbox)):not(:has(.wpcf7-radio)) {
    margin-bottom: 0.3em;
}

/* 入力欄を含む段落の下余白を大きく（次の項目との間隔） */
.wpcf7 form p:has(input[type="text"]),
.wpcf7 form p:has(input[type="email"]),
.wpcf7 form p:has(input[type="tel"]),
.wpcf7 form p:has(input[type="date"]),
.wpcf7 form p:has(textarea),
.wpcf7 form p:has(select),
.wpcf7 form p:has(.wpcf7-checkbox),
.wpcf7 form p:has(.wpcf7-radio) {
    margin-bottom: 1.5em;
}

/* テキスト入力欄のスタイル */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 input[type="date"],
.wpcf7 textarea,
.wpcf7 select {
    width: 100%;
    padding: 12px 16px;
    font-size: 16px;
    line-height: 1.5;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #fff;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    box-sizing: border-box;
}

/* フォーカス時のスタイル */
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 input[type="date"]:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
    outline: none;
    border-color: #4a90e2;
    box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.1);
}

/* テキストエリアの高さ調整 */
.wpcf7 textarea {
    min-height: 150px;
    resize: vertical;
}

/* セレクトボックスのスタイル */
.wpcf7 select {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 40px;
}

/* チェックボックス・ラジオボタンのコンテナ */
.wpcf7 .wpcf7-form-control-wrap {
    display: block;
}

/* チェックボックス・ラジオボタンの配置 */
.wpcf7 .wpcf7-checkbox,
.wpcf7 .wpcf7-radio {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
}

.wpcf7 .wpcf7-list-item {
    margin: 0;
    display: flex;
    align-items: center;
}

/* チェックボックス・ラジオボタンのスタイル */
.wpcf7 input[type="checkbox"],
.wpcf7 input[type="radio"] {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    cursor: pointer;
}

.wpcf7 .wpcf7-list-item-label {
    cursor: pointer;
    user-select: none;
}

/* 送信ボタンのスタイル */
.wpcf7 input[type="submit"] {
    background-color: #4a90e2;
    color: #fff;
    padding: 14px 40px;
    font-size: 16px;
    font-weight: bold;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.1s ease;
    min-width: 200px;
}

.wpcf7 input[type="submit"]:hover:not(:disabled) {
    background-color: #357abd;
    transform: translateY(-1px);
}

.wpcf7 input[type="submit"]:disabled {
    background-color: #ccc;
    cursor: not-allowed;
    opacity: 0.6;
}

/* 確認チェックボックスのスタイル */
.wpcf7 .wpcf7-acceptance {
    margin: 1.5em 0;
}

.wpcf7 .wpcf7-acceptance .wpcf7-list-item {
    align-items: flex-start;
}

.wpcf7 .wpcf7-acceptance input[type="checkbox"] {
    margin-top: 4px;
    flex-shrink: 0;
}

/* エラーメッセージのスタイル */
.wpcf7-not-valid-tip {
    color: #d9534f;
    font-size: 14px;
    margin-top: 5px;
    display: block;
}

.wpcf7-response-output {
    margin: 2em 0 1em;
    padding: 15px;
    border-radius: 4px;
}

.wpcf7-validation-errors {
    border: 2px solid #d9534f;
    background-color: #f9e6e6;
    color: #d9534f;
}

.wpcf7-mail-sent-ok {
    border: 2px solid #5cb85c;
    background-color: #e6f9e6;
    color: #5cb85c;
}

/* レスポンシブ対応 */
@media (max-width: 600px) {
    .wpcf7 input[type="text"],
    .wpcf7 input[type="email"],
    .wpcf7 input[type="tel"],
    .wpcf7 input[type="date"],
    .wpcf7 textarea,
    .wpcf7 select {
        font-size: 16px; /* iOS のズーム防止 */
    }
    
    .wpcf7 .wpcf7-checkbox,
    .wpcf7 .wpcf7-radio {
        flex-direction: column;
        gap: 12px;
    }
    
    .wpcf7 input[type="submit"] {
        width: 100%;
        min-width: auto;
    }
}
