/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/


/* ------------------------ 基本設定 ここから ------------------------*/
/* サイト背景色 */
.site-content{
	background-color:#004d86;
}
/* コンテンツ部分のフォントと背景色の設定 */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #fff;
    color: #333;
    margin: 0;
    padding: 0;
}
/* パディング調整 */
#content {
    padding: 10px 40px 40px; /* ヘッダーが固定されていない場合、上部のパディングを調整 */
}
.site-primary-header-wrap.ast-builder-grid-row-container.site-header-focus-item.ast-container{
	padding:0;
}
.site-below-header-wrap.ast-builder-grid-row-container.site-header-focus-item.ast-container{
	padding:0 20px 20px 20px;
}
/* コンテナの設定 */
.container, .ast-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px;
}
/* タイトルスタイル */
.site-title {
    font-size: 16px;
}
/* リンクの基本スタイル */
a {
    color: #ED6C00;
    text-decoration: none;
    transition: color 0.3s;
}
a:hover {
    color: red;
    text-decoration: none;
}
a:focus, a:active {
    outline: none;
    border: none;
}

.mab20{ margin-bottom: 20px!important; }
.red{ color:red; }

.title1 {
    position: relative;
    width: 100%;
    font-size: clamp(1.1rem, 1.8vw, 1.4rem)!important;
    padding: 0.5em 1em!important;
    margin-bottom: 1em!important;
    color: #fff!important;
    /*letter-spacing: 0.1em;*/
    background: #0072b2;
    text-align: left;
    font-weight: bold!important;
    line-height:normal!important;
}

.title2 {
    font-size: clamp(1rem, 1.5vw, 1.3rem)!important;
    color: #333!important;
    font-weight: bold;
    margin:  0.5em 0!important;
    padding: 0.4em 0.8em!important;
    border-top: 3px solid #0072b2;
    border-bottom: 1px solid #0072b2;
    text-align: left;
    /*letter-spacing: 0.1em;*/
}
.title3 {
    font-size: clamp(0.9rem, 1.4vw, 1.1rem)!important;
    color: #43AAD6!important;
    font-weight: bold;
    margin: 1em 1em 1em 2em;
    padding: 0.2em 0;
    border-bottom: 1px solid #004d86;
    text-align: left;
}

/* 404検索窓を非表示 */
.ast-404-search{
  display: none;;
}
/* ------------------------ 基本設定 ここまで ------------------------*/





/* --------------------- ボタンのスタイル ここから ---------------------*/
/* アカウント情報を変更ボタン */
.custom-dashboard-links {
    display: flex;
    gap: 20px; /* リンク間のスペース */
    justify-content: center; /* 中央配置を追加 */
    flex-wrap: wrap; /* 必要に応じて折り返し */
    margin-top: 10px;
}
.dashboard-link {
    display: flex;
    align-items: center;
    background-color: #ED6C00;
    color: #ffffff;
    padding: 10px 20px;
    text-decoration: none!important;
    transition: background-color 0.3s, transform 0.3s;
    font-weight: 500;
    border-radius: 5px!important;
}
.dashboard-link .dashicons {
    margin-right: 8px;
    font-size: 20px;
}
.dashboard-link span {
    display: inline-block;
}
.dashboard-link:hover {
    opacity: .7;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

}
.dashboard-link:hover .dashicons {
    color: #ffffff;
}

/* ログアウトボタン */
.logout-link {
    background-color: #e74c3c;
}
.logout-link:hover {
    background-color: #c0392b;
}

/* 支払い完了メッセージのスタイル */
.payment-complete {
    background-color: #dff0d8;
    color: #3c763d;
    padding: 15px;
    border-radius: 4px;
    margin-top: 20px;
    font-weight: bold;
}

/* 支払い未完了メッセージのスタイル */
.payment-pending {
    background-color: #ffd1e8;
    color: red;
    padding: 15px;
    border-radius: 4px;
    margin-top: 20px;
    font-weight: bold;
}
.payment-pending a{
    color: red;
}
.payment-pending a:hover{
    color: #ff8820;
}

/* ログインボタン */
.user-registration-Button.button {
    display: block!important;
    width: fit-content!important;
    margin: 1em!important;
    padding: 0.5em 4em 0.5em 3em!important;
    font-size: clamp(1rem, 1.5vw, 1.2rem)!important;
    font-weight: 500!important;
    text-decoration: none!important;
    text-align: center!important;
    background-color: #ED6C00!important;
    color: #FFF;
    letter-spacing: 0.2em!important;
    cursor: pointer!important;
    position: relative!important;
    border-radius: 0!important;
    border:none!important;
    border-radius: 5px!important;
}
.ur-form-container .button,.ur-form-container button,.user-registration .button,.user-registration button {
    box-shadow: none!important;
}
.user-registration-Button.button:after{
    content: "";
    display: block;
    width: 1.5em;
    height: 1.5em;
    background: url(img/pik.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    right: 2em;
    transform: translate(0,-50%);
}
.user-registration-Button.button:hover,
.user-registration-Button.button:active,
.user-registration-Button.button:focus {
    /*transform: translate(2px 2px);*/
    color: #FFF;
    background-color: #ED6C00!important;
    transform: translateY(-2px)!important;
}
.ur-form-container .button:hover,
.ur-form-container button:hover,
.user-registration .button:hover,
.user-registration button:hover {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}


.btn_orange {
    display: block;
    width: fit-content;
    margin: 1em;
    padding: 0.5em 4em 0.5em 3em;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    font-weight: 500!important;
    text-decoration: none!important;
    text-align: center;
    background-color: #ED6C00;
    color: #FFF!important;
    letter-spacing: 0.1em;
    cursor: pointer;
    position: relative;
    transition: background-color 0.3s, transform 0.3s;
    border-radius: 5px;
}
.btn_orange:after {
    content: "";
    display: block;
    width: 1.5em;
    height: 1.5em;
    background: url(img/pik.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    right: 2em;
    transform: translate(0,-50%);
}
.btn_orange:hover {
    opacity: .7;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.btn_red {
    display: block;
    width: fit-content;
    margin: 1em;
    padding: 0.5em 4em 0.5em 3em;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    font-weight: 500!important;
    text-decoration: none!important;
    text-align: center;
    background-color: red;
    color: #FFF!important;
    letter-spacing: 0.1em;
    cursor: pointer;
    position: relative;
    transition: background-color 0.3s, transform 0.3s;
    border-radius: 5px;
}
.btn_red:after {
    content: "";
    display: block;
    width: 1.5em;
    height: 1.5em;
    background: url(img/pik.png);
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    top: 50%;
    right: 2em;
    transform: translate(0,-50%);
}
.btn_red:hover {
    color: #FFF;
    background-color: #2980b9;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}


.btn_glay{
    display: block;
    width: fit-content;
    margin: 1em;
    padding: 0.5em 4em 0.5em 3em;
    font-size: clamp(1rem, 1.5vw, 1.2rem);
    font-weight: bold!important;
    text-decoration: none!important;
    text-align: center;
    background-color: #a9a9a9;
    color: #FFF!important;
    letter-spacing: 0.1em;
    position: relative;
    border-radius: 5px;
}



/* --------------------- ボタンのスタイル ここまで ---------------------*/




/* ----------------- TOPメッセージ ここから -----------------*/
/* 新規アカウント登録 */
.registration-message {
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 4px 16px 0 rgba(17, 17, 26, .05), 0 8px 32px 0 rgba(17, 17, 26, .05);
    border: 0;
}

/* ログイン */
body.user-registration-membership_page_user-registration-login-forms #user-registration:not(.user-registration-MyAccount),
body.user-registration-membership_page_user-registration-login-forms .user-registration:not(.user-registration-MyAccount),
body.user-registration-page #user-registration:not(.user-registration-MyAccount), 
body.user-registration-page .user-registration:not(.user-registration-MyAccount){
    max-width: 1200px!important;
    /*padding: 20px!important;*/
}

.ur-frontend-form.login {
max-width: 1200px!important;
    padding: 20px!important;
}

/* ----------------- TOPメッセージ ここまで -----------------*/




/* ----------------- ユーザー情報表のスタイル ここから -----------------*/
.user-registration-MyAccount-navigation{
    display: none;
}

.custom-dashboard-content {
    background-color: #ffffff;
    padding: 20px;
    border-radius: 8px;
    text-align: left;
}
.custom-dashboard-content h1 {
    color: #2c3e50;
    margin-bottom: 20px;
    font-size: 24px;
}
.dashboard_box{
    padding: 10px 10px 30px 10px;
}

.dashboard_list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 10px;
}

.dashboard_list li {
    display: inline-block;
}

.dashboard_list a {
    display: block;
    padding: 10px 15px;
    background-color: #ED6C00 ;
    color: #fff;
    text-decoration: none!important;
    border-radius: 5px;
    transition: background 0.3s;
}

.dashboard_list a:hover {
    opacity: .7;
}


.user-info-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
    table-layout: auto; /* 自動調整に変更 */
    box-sizing: border-box; /* パディングの影響を幅に含める */
}
.user-info-table th,
.user-info-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #e1e1e1;
    word-wrap: break-word; /* コンテンツを折り返し */
    word-break: break-word; /* 長い単語も折り返し */
    white-space: normal; /* 改行を許可 */
}
.user-info-table th {
    background-color: #f5f5f5;
    width: 35%;
    font-weight: bold;
    color: #333;
}
.user-info-table td {
    color: #555;
}
.user-info-table tr:nth-child(even) td {
    background-color: #fafafa;
}
.user-info-table tr:hover td {
    background-color: #f1f1f1;
}
/* ----------------- ユーザー情報表のスタイル ここまで -----------------*/





/* -------------- パスワード編集フォームのスタイル ここから --------------*/
.edit-user-password-form {
    max-width: 500px;
    margin: 0 auto;
}
.edit-user-password-form p {
    margin-bottom: 15px;
}
.edit-user-password-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}
.edit-user-password-form input[type="password"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.edit-user-password-form button {
    background-color: #3498db;
    color: #ffffff;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
    transition: background-color 0.3s;
}
.edit-user-password-form button:hover {
    background-color: #2980b9;
}
/* エラーメッセージのスタイル */
.password-edit-errors {
    background-color: #f8d7da;
    color: #721c24;
    padding: 10px 15px;
    border-radius: 4px;
    margin-bottom: 15px;
}
.password-edit-errors p {
    margin: 0;
}
/* パスワード変更後のメッセージスタイル */
.password-changed-message {
    background-color: #dff0d8;
    color: #3c763d;
    padding: 15px;
    border: 1px solid #d6e9c6;
    border-radius: 4px;
    margin-bottom: 20px;
}
/* -------------- パスワード編集フォームのスタイル ここまで --------------*/





/* ----------------- 参加登録フォームのスタイル ここから -----------------*/
/* フォーム全体を中央に配置し、最大幅を設定 */
#cp_calculatedfieldsf_pform_1,
#main {
    max-width: 1100px;
    margin: 0 auto;
    background-color: #ffffff;
    padding: 30px;
    border-radius: 8px;
    /*box-shadow: 0 2px 8px rgba(0,0,0,0.05);*/
}

/* フォームタイトルのスタイル */
#cp_calculatedfieldsf_pform_1 h2 {
    text-align: center;
    color: #2c3e50;
    margin-bottom: 20px;
    font-size: 24px;
}
/* 各フォームフィールドのラベルをスタイリッシュに */
#cp_calculatedfieldsf_pform_1 label {
    display: block;
    margin-bottom: 8px;
    font-weight: bold;
    color: #34495e;
}
/* 入力フィールドのスタイル */
#cp_calculatedfieldsf_pform_1 input[type="text"],
#cp_calculatedfieldsf_pform_1 input[type="email"],
#cp_calculatedfieldsf_pform_1 input[type="password"] {
    width: 100%;
    padding: 10px 15px;
    margin-bottom: 5px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color 0.3s;
}
#cp_calculatedfieldsf_pform_1 input[type="text"]:focus,
#cp_calculatedfieldsf_pform_1 input[type="email"]:focus,
#cp_calculatedfieldsf_pform_1 input[type="password"]:focus {
    border-color: #3498db;
    outline: none;
}
/* 必須フィールドのスタイル */
#cp_calculatedfieldsf_pform_1 .r {
    color: #e74c3c;
}
/* キャプチャ画像のスタイル */
#cp_calculatedfieldsf_pform_1 .captcha img {
    display: block;
    margin: 10px auto 15px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
/* セキュリティコード入力フィールドのスタイル */
#cp_calculatedfieldsf_pform_1 .captcha input[type="text"] {
    width: 100%;
    padding: 10px 15px;
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    transition: border-color 0.3s;
}
#cp_calculatedfieldsf_pform_1 .captcha input[type="text"]:focus {
    border-color: #3498db;
    outline: none;
}
/* 送信ボタンのスタイル */
#cp_calculatedfieldsf_pform_1 .pbSubmit {
    display: flex;
    justify-content: center; /* 中央揃え */
    align-items: center;
    background-color: #3498db;
    color: #ffffff;
    padding: 12px 24px;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.3s;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
}
#cp_calculatedfieldsf_pform_1 .pbSubmit:hover {
    background-color: #2980b9;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
/* エラーメッセージのスタイル */
#cp_calculatedfieldsf_pform_1 .password-edit-errors,
#cp_calculatedfieldsf_pform_1 .cff-error-dlg {
    background-color: #f8d7da;
    color: #721c24;
    padding: 15px;
    border: 1px solid #f5c6cb;
    border-radius: 4px;
    margin-bottom: 20px;
}
/* メッセージのテキストスタイル */
#cp_calculatedfieldsf_pform_1 .password-changed-message {
    background-color: #dff0d8;
    color: #3c763d;
    padding: 15px;
    border: 1px solid #d6e9c6;
    border-radius: 4px;
    margin-bottom: 20px;
}
/* ----------------- 参加登録フォームのスタイル ここまで -----------------*/




/* -------------------- 領収証ページのスタイル ここから --------------------*/
.receipt {
    border: 1px solid #ccc;
    padding: 30px 60px;
    max-width: 600px;
    margin: 20px auto;
    /*background: #f9f9f9;*/
    background: #fff;
}
.receipt h2 {
    text-align: center;
    color: #333;
}
.receipt p {
    font-size: 14px;
    margin: 0;
}
.text_right{
    text-align: right;
}
.receipt_name{
    text-align:center;
    font-weight: bold;
    border-bottom: solid 1px #333;
    margin-top: 20px;
    margin-bottom: 20px;
}
.receipt_total{
    text-align:center;
    font-weight: bold;
    background-color: #d3d3d3;
    padding: 20px;
    margin-bottom: 20px;
}
.receipt_total p{
    font-size: 16px;
}
.receipt_table{
    width:100%;
}
.receipt_table,
.receipt_table th,
.receipt_table td{
    border-style: solid;
    border-width: 1px;
    border-collapse: collapse;
    font-size: 12px;
    margin-bottom: 20px;
}
.receipt_table th,
.receipt_table td{
    text-align: left;
    width:33%;
}
.receipt_table th{
    background-color: #dcdcdc;
}
.receipt_sign {
    width: 70%;
    position: relative;
    margin-top: 100px;
    margin-left:auto;
    margin-right: 0;
    text-align: right;
}
.receipt_sign p {
    position: relative;
    font-size:14px;
    z-index: 1000;
    margin-right: 20px;
}
/* 画像 */
.inkan {
    position: absolute;
    top: -90px; /* 30px */
    right: 0; /* 右上に配置 */
    max-width: 376px;
    height: auto;
    z-index: 1;
}
.fs22{ font-size:22px!important; }
.fs40{ font-size:40px!important; }
/* PDF専用の調整 */
@media print {
    div#page {
        height: auto; /* 高さを自動調整 */
        min-height: 90vh; /* ビューポートに合わせた高さを確保 */
        overflow: hidden; /* 内容のはみ出しを防ぐ */
        page-break-inside: avoid; /* ページ内で改ページを避ける */
    }
    body {
        margin: 0;
        padding: 0;
    }
}

/* -------------------- 領収証ページのスタイル ここまで --------------------*/






/* -------------------------- レスポンシブ ここから --------------------------*/
/* レスポンシブ対応 */
@media (max-width: 768px) {

    /* パディング調整 */
    #content {
        padding: 10px; /* ヘッダーが固定されていない場合、上部のパディングを調整 */
    }
    .site-primary-header-wrap.ast-builder-grid-row-container.site-header-focus-item.ast-container{
        padding:0;
    }
    .site-below-header-wrap.ast-builder-grid-row-container.site-header-focus-item.ast-container{
        padding:10px;
    }
    #user-registration.horizontal .user-registration-MyAccount-content{
        padding: 0!important;
    }
    /* コンテナの設定 */
    .container, .ast-container {
        padding: 10px!important;
    }

    /* ユーザー情報表 */
    .custom-dashboard-content {
        padding: 10px;
    }
    .custom-dashboard-content h1 {
        font-size: 22px;
    }
    .custom-dashboard-content h3 {
        font-size: 20px;
    }
    .user-info-table {
        display: block;
        width: 100%;
    }
    .user-info-table tr {
        display: block;
    }
    .user-info-table th,
    .user-info-table td {
        padding: 8px 10px;
        display: block;
        text-align: left;
        width: 100%;
    }
    .user-info-table th {
        background-color: #f5f5f5;
    }

    /* アカウント情報を変更ボタン */
    .custom-dashboard-links {
        gap: 10px;
    }
    .dashboard-link {
        padding: 8px 16px;
    }
    .dashboard-link .dashicons {
        font-size: 18px;
        margin-right: 6px;
    }

    /* 参加登録フォームのスタイル */
    #cp_calculatedfieldsf_pform_1,
    #main{
        padding: 10px;
    }
    #cp_calculatedfieldsf_pform_1 {
        padding: 20px;
    }
    #cp_calculatedfieldsf_pform_1 h2 {
        font-size: 20px;
    }
    #cp_calculatedfieldsf_pform_1 .pbSubmit {
        padding: 10px 20px;
    }

    /* 領収証ページのスタイル */
    .receipt {
        padding: 15px;
    }
    .receipt h2 {
        margin: 0;
    }
    .receipt_total{
        padding: 10px;
        margin-bottom: 10px;
    }
    .receipt_table,
    .receipt_table th,
    .receipt_table td{
        margin-bottom: 10px;
    }
    .receipt_sign {
        width: 80%;
        margin-top: 40px;
    }
    .receipt_sign p {
        font-size:12px;
    }
    /* 画像 */
    .inkan {
        top: -30px;
    }

    .dashboard_list {
        display: block; /* 縦並び */
        text-align: center; /* 中央揃え */
    }

    .dashboard_list li {
        display: block; /* ブロック要素に変更 */
        margin-bottom: 10px; /* 下の余白を追加 */
    }
}



/* -------------------------- レスポンシブ ここまで --------------------------*/