@charset "utf-8";

/*----------------------------------------*/
/* 閲覧補助：フォントサイズ設定（大） */
/*----------------------------------------*/
.font_change_large{
    font-size: 78%; /* 約20px */
}



/*----------------------------------------*/
/* 閲覧補助：背景設定（黒） */
/*----------------------------------------*/

.bg_change_black:root{
    --bgchange-black: #222222;
    --bgchange-yellow: #fff000;
    --bgchange-white: #f2f2f2;
    --bgchange-gray: #444444;
    --bgchange-light-gray: #cccccc;

    --main-font-color: #f2f2f2;
    --main-purple: #222222;
    --sub-link-purple: #fff000;
    --sub-light-gray: #cccccc;
    --sub-gray: #f2f2f2;
    --sub-white: #222222;
    --sub-pale-pink: #444444;
    --sub-light-red: #444444;
    --sub-red: #cccccc;
}


/* --- 全体 -------------------- */

.bg_change_black{
    background-color: var(--bgchange-black);
}

.bg_change_black p{
    color: var(--bgchange-white);
}

.bg_change_black a{
    color: var(--bgchange-yellow);
    text-decoration: underline;
}

.bg_change_black a:hover{
    color: var(--bgchange-yellow);
    text-decoration: none;
}


/* --- ヘッダー?フッター -------------------- */
.bg_change_black .header_logo img{
    filter: brightness(0) saturate(100%) invert(89%) sepia(100%) saturate(2%) hue-rotate(210deg) brightness(108%) contrast(101%);
}

.bg_change_black header{
    border-bottom: 1px solid var(--bgchange-white);
} 

.bg_change_black .header_menu li a {
    color: var(--bgchange-yellow);
}

/* サイドメニュー */
.bg_change_black #sidemenu{
    background-color: var(--bgchange-gray);
}

.bg_change_black .sidemenu_btn span{
    color: var(--bgchange-yellow);
}

/* ハンバーガーメニュー */
.bg_change_black .toggle{
    background-color: var(--bgchange-gray);
}

.bg_change_black .togglebtn span{
    background-color: var(--bgchange-white);
}

/* サイドメニュー展開共通 */
.bg_change_black nav{
    border-top: 1px solid var(--bgchange-white);
    background-color: var(--bgchange-black);
}

.bg_change_black nav .title p{
    color: var(--bgchange-white);
}

.bg_change_black nav .menu_list .child a::before{
    border-top: 1px solid var(--bgchange-white);
    border-right: 1px solid var(--bgchange-white);
}

.bg_change_black #sidemenu_main .subtitle{
    color: var(--bgchange-white);
}


/* 閲覧補助メニュー展開（PC） */
.bg_change_black #sidemenu_support_pc{
    border-bottom: 1px solid var(--bgchange-white);
}

.bg_change_black #sidemenu_support_pc .subtitle{
    color: var(--bgchange-white);
}

.bg_change_black #sidemenu_support_pc a{
    border: 1px solid var(--bgchange-yellow);
    background-color: var(--bgchange-black);
}

.bg_change_black #sidemenu_support_pc a.active{
    background-color: var(--bgchange-yellow);
    color: var(--bgchange-black);
}

/* フッター */
.bg_change_black footer{
    border-top: 1px solid var(--bgchange-white);
    background-color: var(--bgchange-black);
}

.bg_change_black #PageTop a{
    border: 1px solid var(--bgchange-white);
}


/* --- トップページ -------------------- */

/* --- ページネーション?ボタン等 --- */
#mv .swiper_stopbtn{
    background-color: var(--bgchange-white);
}

.bg_change_black #mv .swiper-pagination-bullet-active{
    background-color: var(--bgchange-white);
}

/* キャッチコピー */
.bg_change_black #catch_copy{
    background: linear-gradient(45deg, rgba(50, 50, 50, 0.7), rgba(100, 100, 100, 0.7));
}

.bg_change_black #catch_copy p{
    color: var(--bgchange-white);
}

/* コンテンツ */
.bg_change_black #contents p{
    color: var(--bgchange-white);
}


/* --- 固定ページ -------------------- */

/* ページタイトル?パンくずリスト */
.bg_change_black #page_title{
    background-color: var(--bgchange-black);
}

.bg_change_black #page_title h1,
.bg_change_black #page_title .news_title{
    max-width: 100%;
    width: 100%;
    background: var(--bgchange-black);
    border-bottom: 1px solid var(--bgchange-white);
    color: var(--bgchange-white);
}

.bg_change_black #page_title h1::before,
.bg_change_black #page_title .news_title::before{
    background-color: var(--bgchange-black);
}

/* コンテンツ（大枠） */
.bg_change_black .contents a{
	color: var(--bgchange-yellow);
	text-decoration: underline;
}

.bg_change_black .contents a:hover{
    text-decoration: none;
}

/* 下層メニュー（右） */
.bg_change_black .lower_page li.parent a{
    background-color: var(--bgchange-gray);
}
.bg_change_black .lower_page li.child a,
.bg_change_black .lower_page li.parent a:hover,
.bg_change_black .lower_page li.child a:hover{
    background-color: var(--bgchange-black);
}

.bg_change_black .lower_page li.child.current a{
    color: var(--bgchange-black);
    background-color: var(--bgchange-white);
}

/* template01、02（扉ページ） */
.bg_change_black .tobira_btn_box li a{
    border: 1px solid var(--bgchange-white);
    background-color: var(--bgchange-black);
}

.bg_change_black .tobira_btn_box li a::before{
    content: none;
}

.bg_change_black .tobira_btn_box li a:hover{
    background-color: var(--bgchange-yellow);
    color: var(--bgchange-black);
}


/* --- コンテンツ（見出し?テキスト?表等） --- */

.bg_change_black h2,
.bg_change_black h3,
.bg_change_black h4,
.bg_change_black h5,
.bg_change_black h6{
    color: var(--bgchange-white);
}

.bg_change_black h2::after{
    background: linear-gradient(to right, var(--bgchange-light-gray), var(--bgchange-white));
}

.bg_change_black h3{
    border: 1px solid var(--bgchange-white);
    background-color: var(--bgchange-gray);
}

.bg_change_black h4::before,
.bg_change_black h5::before{
    background-color: var(--bgchange-light-gray);
}

/* ボタン */
.bg_change_black a.btn:hover{
    color: var(--bgchange-black);
}

/* 箇条書きリスト */
.bg_change_black .contents.column01 ul:not(.tobira_btn_box) li::marker,
.bg_change_black .contents_left ul:not(.tobira_btn_box) li::marker,
.bg_change_black .contents ol li::marker{
	color: var(--bgchange-white);
}



/* --- お問い合わせフォーム -------------------- */
.bg_change_black table.table-form tr td:first-child{
    background-color: var(--bgchange-gray);
    color: var(--bgchange-white);
}

.bg_change_black #alphaform .action_button input{
    background-color: var(--bgchange-black);
    border: 2px solid var(--bgchange-yellow);
    color: var(--bgchange-yellow);
}

.bg_change_black #alphaform .button:active,
.bg_change_black #alphaform .button:focus,
.bg_change_black #alphaform .button:hover, #alphaform .button.hover{
    background-color: var(--bgchange-yellow);
    border: 2px solid var(--bgchange-yellow);
    color: var(--bgchange-black);
}

.bg_change_black #alphaform div.error{
    color: var(--bgchange-yellow);
}

/* セレクトボタン?ラジオボタンの項目調整 */
.bg_change_black #alphaform label:has(input){
    color: var(--bgchange-white);
}



@media screen and (max-width: 1280px) {

    /* ヘッダー部分アイコン色変更 */
    .bg_change_black .sidemenu_btn img {
        filter: brightness(0) saturate(100%) invert(89%) sepia(100%) saturate(2%) hue-rotate(210deg) brightness(108%) contrast(101%);
    }

    /* フッター固定メニュー */
    .bg_change_black #footermenu_sp > ul li a{
        border: 1px solid var(--bgchange-black);
        background-color: #fff000 !important;
        font-weight: 500;
    }

    .bg_change_black #footermenu_sp > ul li img{
        filter: brightness(0) saturate(100%) invert(0%) sepia(17%) saturate(49%) hue-rotate(220deg) brightness(120%) contrast(73%);
    }

    .bg_change_black #sidemenu_support_sp .subtitle{
        color: var(--bgchange-white);
    }

    .bg_change_black #sidemenu_support_sp a{
        border: 2px solid var(--bgchange-yellow);
        background-color: var(--bgchange-black);
    }

    .bg_change_black #sidemenu_support_sp a.active{
        background-color: var(--bgchange-yellow);
        color: var(--bgchange-black);
    }
}