@charset "UTF-8";

.grecaptcha-badge { visibility: hidden; }

.rexlimail-form{
text-align: left;
padding: 50px 50px 50px 50px;
margin: 2em 0;
color: #5d627b;
background: white;
border-top: solid 5px #35a8a5;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.22);
	border-radius:10px;
}

@media print, screen and (max-width: 768px) {
.rexlimail-form {
padding: 20px !important; 
}
}

/* ラジオボタンやチェックボックスのテキストのフォントサイズを14pxに設定 */
.wpforms-form label.wpforms-field-label-inline {
    font-size: 14px !important;
}

.mailform-text2{
	font-size:16px;
	padding:10px 0px;
	font-weight:600;
}
.hissu{
	font-size:14px;
	color:#ce0000;
}
/* フォームの入力欄背景色を変更 */
body .wpforms-container .wpforms-form input[type="text"],
body .wpforms-container .wpforms-form input[type="email"],
body .wpforms-container .wpforms-form input[type="tel"],
body .wpforms-container .wpforms-form textarea {
    background-color: #E7F5F5 !important; /* 通常時の背景色 */
    border: 0px solid #fff !important; /* 通常時のボーダー色 */
    padding: 10px !important; /* パディングを調整 */
    width: 100% !important; /* フル幅に設定 */
    outline: none !important; /* デフォルトのフォーカスアウトラインを無効にする */
}

/* フォーカス時のスタイル（クリック時） */
body .wpforms-container .wpforms-form input[type="text"]:focus,
body .wpforms-container .wpforms-form input[type="email"]:focus,
body .wpforms-container .wpforms-form input[type="tel"]:focus,
body .wpforms-container .wpforms-form textarea:focus {
    background-color: #fff3fe !important; /* フォーカス時の背景色 */
    border: 2px solid #e27daf !important; /* フォーカス時のボーダー色 */
    outline: none !important; /* デフォルトのアウトラインを消す */
    box-shadow: none !important; /* 追加のシャドウ効果も無効にする */
}

/* チェックボックスとラジオボタンの背景色を変更 */
body .wpforms-container .wpforms-form input[type="checkbox"],
body .wpforms-container .wpforms-form input[type="radio"] {
    background-color: #E7F5F5 !important; /* 同じ背景色を強制適用 */
    margin-right: 10px !important;
}

/* 送信ボタンのスタイル */
body .wpforms-container .wpforms-form .wpforms-submit {
	font-weight:600;
    margin: 30px auto 0 auto !important;
    background: #ffb600 !important;
    color: #ffffff !important;
    display: block !important;
    padding: 20px 50px !important;
    border-radius: 30px !important;
    font-size: 21px !important;
    width: auto !important;
    height: auto !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    filter: none !important; /* フィルター効果を無効化 */
    backdrop-filter: none !important; /* バックドロップフィルターを無効化 */
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

/* 送信ボタンのホバー時のスタイル */
body .wpforms-container .wpforms-form .wpforms-submit:hover {
    background-color: #ff9d00 !important;
    color: #ffffff !important;
    cursor: pointer !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    filter: none !important; /* ホバー時のフィルター効果を無効化 */
    backdrop-filter: none !important; /* ホバー時のバックドロップフィルターを無効化 */
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}


/* プレースホルダーの文字サイズを変更 */
body .wpforms-container .wpforms-form ::placeholder {
    font-size: 14px !important; /* プレースホルダーの文字サイズ */
    color: #888 !important; /* 必要に応じて色も変更 */
}

/* Webkit系ブラウザ (Chrome, Safari) 向けのプレースホルダースタイル */
body .wpforms-container .wpforms-form ::-webkit-input-placeholder {
    font-size: 14px !important;
    color: #888 !important;
}

/* Firefox向けのプレースホルダースタイル */
body .wpforms-container .wpforms-form ::-moz-placeholder {
    font-size: 14px !important;
    color: #888 !important;
}

/* Microsoft Edge 向けのプレースホルダースタイル */
body .wpforms-container .wpforms-form ::-ms-input-placeholder {
    font-size: 14px !important;
    color: #888 !important;
}
html body div.wpforms-confirmation-container {
    background-color: transparent !important; /* 背景を透明に */
    font-size: 18px !important; /* 文字サイズを18pxに */
    font-weight: bold !important; /* 文字を太字に */
    color: #333 !important; /* テキストカラー */
    border: none !important; /* ボーダーを削除 */
    padding: 20px !important; /* パディングを追加 */
}


@media screen and (max-width: 768px) {
    /* 固有クラス名を使用して、メールアドレス入力欄を縦に並べる */
    .wpforms-container .wpforms-form .email-field {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        margin-bottom: 20px !important; /* 下にスペースを追加 */
    }

    /* 確認用メールアドレスフィールドにも固有クラスを使用 */
    .wpforms-container .wpforms-form .email-confirm-field {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        margin-bottom: 20px !important;
    }
}