@charset "utf-8";
/*--------------------------------------------------
 * pc　769px以上
 *--------------------------------------------------*/

@media only screen and (min-width: 769px), print {
    /* スマホ用コンテンツ */
    .sp_only {
        display: none !important;
    }
    /* Flex系 */
    .flex_box_pc {
        display: flex;
        width: 100%;
    }
    .pcmulti_sp1 {
        flex-wrap: wrap;
    }
    .margin_auto_center_pc {
        margin: 0 auto;
    }
    .flex_auto_c_pc {
        margin: 0 auto;
    }
    .center-align_pc {
        text-align: center;
    }
    .left-align_pc {
        text-align: left;
    }
    .right-align_pc {
        text-align: right;
    }
    /*フォーム*/
    .form_input_1_left, .form_input_1_right {
        width: 45%;
    }
    .drawer-hamburger {
        position: fixed;
    }
    /*container_PC用*/
    .container_pc {
        margin: 0 auto;
        max-width: 1280px;
        width: 95%;
    }
    .container_pc2 {
        margin: 0 auto;
        max-width: 1280px;
        width: 70%;
    }
    .container_pc_95 {
        margin: 0 auto;
        width: 95%;
    }
    .container_pc_90 {
        margin: 0 auto;
        width: 90%;
    }
    .container_pc_80 {
        margin: 0 auto;
        width: 80%;
    }
    /*----------------------------------
        /*ヘッダーの調整
        /*--------------------------------*/
    header {
        margin-bottom: 20px;
    }
    /*ユーザー名部分*/
    .head_user {
        font-size: 24px;
        background-color: #ffffff;
        box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.178);
        color: rgb(0, 0, 0);
        display: flex;
        text-align: center;
        align-items: center;
        justify-content: center;
    }
    h1.apk_h1_title {
        font-size: 40px;
        font-weight: bold;
        color: white;
        text-align: center;
        margin: 20px 0;
    }
    /*header .drawer-menu li:nth-last-child(1), header .drawer-menu li:nth-last-child(2) {
        float: right;
    }*/
    /*--------------------------------------
        *用途 ：paddingとかmargin用
        *名前1：padding_　　margin_
        *名前2：t=上 l=左 r=右 b=下
        *名前2の後の数字：○PX等。(pをつけたら％にしてるmはマイナス。vhはvh vwはvw)
        --------------------------------------*/
    .margin_b_0_pc {
        margin-bottom: 0px !important;
    }
    .margin_t_30m_pc {
        margin-top: -30px !important;
    }
    .margin_t_0_pc {
        margin-top: 0px !important;
    }
    .margin_t_10_pc {
        margin-top: 10px !important;
    }
    .margin_t_20_pc {
        margin-top: 20px !important;
    }
    .margin_t_30_pc {
        margin-top: 30px !important;
    }
    .margin_t_40_pc {
        margin-top: 40px !important;
    }
    .margin_t_50_pc {
        margin-top: 50px !important;
    }
    .margin_t_60_pc {
        margin-top: 60px !important;
    }
    .margin_t_70_pc {
        margin-top: 70px !important;
    }
    .margin_t_80_pc {
        margin-top: 80px !important;
    }
    .margin_t_90_pc {
        margin-top: 90px !important;
    }
    .margin_t_100_pc {
        margin-top: 100px !important;
    }
    .margin_b_10_pc {
        margin-bottom: 10px !important;
    }
    .margin_b_20_pc {
        margin-bottom: 20px !important;
    }
    .margin_b_40_pc {
        margin-bottom: 40px !important;
    }
    .margin_b_50_pc {
        margin-bottom: 50px;
    }
    .margin_b_60_pc {
        margin-bottom: 60px;
    }
    .margin_b_10vh_pc {
        margin-bottom: 20vh;
    }
    .margin_b_20vh_pc {
        margin-bottom: 20vh;
    }
    .margin_b_30vh_pc {
        margin-bottom: 30vh;
    }
    .margin_b_40vh_pc {
        margin-bottom: 40vh;
    }
    .margin_b_10vh_pc {
        margin-bottom: 10vh;
    }
    .margin_r_5_pc {
        margin-right: 5px !important;
    }
    .margin_r_10_pc {
        margin-right: 10px !important;
    }
    .margin_r_4p_pc {
        margin-right: 4% !important;
    }
    .margin_r_10p_pc {
        margin-right: 10% !important;
    }
    .margin_r_10_pc {
        margin-right: 10% !important;
    }
    .margin_r_20_pc {
        margin-right: 20px !important;
    }
    .margin_r_30_pc {
        margin-right: 30px !important;
    }
    .margin_r_40_pc {
        margin-right: 40px !important;
    }
    .margin_r_45_pc {
        margin-right: 45px !important;
    }
    .margin_r_50_pc {
        margin-right: 50px !important;
    }
    .margin_l_10_pc {
        margin-left: 10px !important;
    }
    .margin_l_20_pc {
        margin-left: 20px !important;
    }
    .margin_l_30_pc {
        margin-left: 30px !important;
    }
    .margin_l_40_pc {
        margin-left: 40px !important;
    }
    .margin_l_50_pc {
        margin-left: 50px !important;
    }
    .padding_t_20_pc {
        padding-top: 20px !important;
    }
    .padding_t_30_pc {
        padding-top: 30px !important;
    }
    .padding_t_40_pc {
        padding-top: 40px !important;
    }
    .padding_t_50_pc {
        padding-top: 50px !important;
    }
    .padding_t_60_pc {
        padding-top: 60px !important;
    }
    .padding_t_70_pc {
        padding-top: 70px !important;
    }
    .padding_t_80_pc {
        padding-top: 80px !important;
    }
    .padding_t_90_pc {
        padding-top: 90px !important;
    }
    .padding_t_100_pc {
        padding-top: 100px !important;
    }
    .padding_b_20_pc {
        padding-bottom: 20px !important;
    }
    .padding_b_30_pc {
        padding-bottom: 30px !important;
    }
    .padding_b_40_pc {
        padding-bottom: 40px !important;
    }
    .padding_b_50_pc {
        padding-bottom: 50px !important;
    }
    .padding_b_60_pc {
        padding-bottom: 60px !important;
    }
    .padding_b_70_pc {
        padding-bottom: 70px !important;
    }
    .padding_b_80_pc {
        padding-bottom: 80px !important;
    }
    .padding_b_90_pc {
        padding-bottom: 90px !important;
    }
    .padding_b_100_pc {
        padding-bottom: 100px !important;
    }
    .padding_b_110_pc {
        padding-bottom: 110px !important;
    }
    .padding_b_120_pc {
        padding-bottom: 120px !important;
    }
    .padding_b_300_pc {
        padding-bottom: 300px !important;
    }
    .padding_20_pc {
        padding: 20px !important;
    }
    .padding_30_pc {
        padding: 30px !important;
    }
    .padding_40_pc {
        padding: 40px !important;
    }
    .padding_l_10_pc {
        padding-left: 10px !important;
    }
    .padding_l_20_pc {
        padding-left: 20px !important;
    }
    .padding_l_30_pc {
        padding-left: 30px !important;
    }
    .padding_r_10_pc {
        padding-right: 10px !important;
    }
    .padding_r_20_pc {
        padding-right: 20px !important;
    }
    .padding_r_30_pc {
        padding-right: 30px !important;
    }
    .padding_rl_30_pc, .padding_lr_30_pc {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    .padding_rl_40_pc, .padding_lr_40_pc {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }
    .padding_rl_50_pc, .padding_lr_50_pc {
        padding-left: 50px !important;
        padding-right: 50px !important;
    }
    .width_10_pc {
        width: 10% !important;
    }
    .width_20_pc {
        width: 20% !important;
    }
    .width_30_pc {
        width: 30% !important;
    }
    .width_40_pc {
        width: 40% !important;
    }
    .width_45_pc {
        width: 45% !important;
    }
    .width_48_pc {
        width: 48% !important;
    }
    .width_50_pc {
        width: 50% !important;
    }
    .width_60_pc {
        width: 60% !important;
    }
    .width_80_pc {
        width: 80% !important;
    }
    .width_100_pc {
        width: 100% !important;
    }
    .width_o_105_pc {
        width: 105%;
        margin-left: -2.5%;
    }
    .width_o_110_pc {
        width: 110%;
        margin-left: -5%;
    }
    .width_o_120_pc {
        width: 120%;
        margin-left: -10%;
    }
    .width_o_130_pc {
        width: 130%;
        margin-left: -15%;
    }
    .height_100_pc {
        height: 100%;
    }
    /*
/*margin、paddingの可変_PC
================================*/
    .margin_t_pc {
        margin-top: var(--m_t_pc) !important;
    }
    .margin_b_pc {
        margin-bottom: var(--m_b_pc) !important;
    }
    .margin_r_pc {
        margin-right: var(--m_r_pc) !important;
    }
    .margin_l_pc {
        margin-left: var(--m_l_pc) !important;
    }
    .margin_pc {
        margin: var(--m_pc) !important;
    }
    .padding_t_pc {
        padding-top: var(--p_t_pc) !important;
    }
    .padding_b_pc {
        padding-bottom: var(--p_b_pc) !important;
    }
    .padding_r_pc {
        padding-right: var(--p_r_pc) !important;
    }
    .padding_l_pc {
        padding-left: var(--p_l_pc) !important;
    }
    .padding_pc {
        padding: var(--p_pc) !important;
    }
    .width_pc {
        width: var(--width_pc) !important;
    }
    /*--------------------------------------
        *用途 ：fontサイズ
        *名前1：font_
    *名前2：s はpx　rはrem
    *※クラス名にドットが使えないので「1rem=10」
--------------------------------------*/
    .font_bold {
        font-weight: bold !important;
    }
    .font_s_10_pc {
        font-size: 10px !important;
    }
    .font_s_11_pc {
        font-size: 11px !important;
    }
    .font_s_12_pc {
        font-size: 12px !important;
    }
    .font_s_13_pc {
        font-size: 13px !important;
    }
    .font_s_14_pc {
        font-size: 14px !important;
    }
    .font_s_15_pc {
        font-size: 15px !important;
    }
    .font_s_16_pc {
        font-size: 16px !important;
    }
    .font_s_17_pc {
        font-size: 17px !important;
    }
    .font_s_18_pc {
        font-size: 18px !important;
    }
    .font_s_19_pc {
        font-size: 19px !important;
    }
    .font_s_20_pc {
        font-size: 20px !important;
    }
    .font_s_21_pc {
        font-size: 21px !important;
    }
    .font_s_22_pc {
        font-size: 22px !important;
    }
    .font_s_23_pc {
        font-size: 23px !important;
    }
    .font_s_28_pc {
        font-size: 28px !important;
    }
    .font_s_30_pc {
        font-size: 30px !important;
    }
    .font_r_08_pc {
        font-size: 0.8rem !important;
    }
    .font_r_09_pc {
        font-size: 0.9rem !important;
    }
    .font_r_10_pc {
        font-size: 1rem !important;
    }
    .font_r_11_pc {
        font-size: 1.1rem !important;
    }
    .font_r_12_pc {
        font-size: 1.2rem !important;
    }
    .font_r_13_pc {
        font-size: 1.3rem !important;
    }
    .font_r_14_pc {
        font-size: 1.4rem !important;
    }
    .font_r_16_pc {
        font-size: 1.6rem !important;
    }
    .font_r_17_pc {
        font-size: 1.7rem !important;
    }
    .font_r_18_pc {
        font-size: 1.8rem !important;
    }
    .font_r_19_pc {
        font-size: 1.9rem !important;
    }
    .font_r_20_pc {
        font-size: 2rem !important;
    }
    .font_r_40_pc {
        font-size: 4rem !important;
    }
    .font_vw_10_pc {
        font-size: 1vw !important;
    }
    .font_vw_15_pc {
        font-size: 1.5vw !important;
    }
    .font_vw_20_pc {
        font-size: 2vw !important;
    }
    .font_vw_25_pc {
        font-size: 2.5vw !important;
    }
    .font_vw_30_pc {
        font-size: 3vw !important;
    }
    .font_vw_35_pc {
        font-size: 3.5vw !important;
    }
    .font_vw_40_pc {
        font-size: 4vw !important;
    }
    .font_vw_45_pc {
        font-size: 4.5vw !important;
    }
    .font_vw_50_pc {
        font-size: 5vw !important;
    }
    .font_vw_55_pc {
        font-size: 5.5vw !important;
    }
    .font_vw_60_pc {
        font-size: 6vw !important;
    }
    .font_vw_65_pc {
        font-size: 6.5vw !important;
    }
    .font_vw_70_pc {
        font-size: 7vw !important;
    }
    .font_vw_75_pc {
        font-size: 7.5vw !important;
    }
    .font_vw_80_pc {
        font-size: 8vw !important;
    }
    .font_vw_85_pc {
        font-size: 8.5vw !important;
    }
    .font_vw_90_pc {
        font-size: 9vw !important;
    }
    .font_vw_95_pc {
        font-size: 9.5vw !important;
    }
    /*文字スペース*/
    .f_sp_01_pc {
        letter-spacing: 0.1rem;
    }
    .f_sp_03_pc {
        letter-spacing: 0.3rem;
    }
    .f_sp_05_pc {
        letter-spacing: 0.5rem;
    }
    .f_sp_08_pc {
        letter-spacing: 0.8rem;
    }
    .f_sp_10_pc {
        letter-spacing: 1rem;
    }
    /*
    /*モーダルの強制
    ================================*/
    .container #modalform.modal {
        height: 85%;
        max-height: 85%;
    }
    /*
    /*予約フォームのポップアップ
    ================================*/
    .my_modal_wrapper .my_modal_window.big{
        width: 80%;
        max-width: 80%;
    }
    .my_modal_window.big{
        margin-top: -20px;
    }
    .my_modal_wrapper .my_modal_window .my_modal_content.big{
        max-height: 500vh;
    }
}

/*--------------------------------------------------
 * スマホ・タブレット 768px以下
 *--------------------------------------------------*/

@media only screen and (max-width: 768px) {
    br {
        content: “”;
    }
    br:after {
        margin-right: -.333em;
        content: ””;
    }
    .pc_only {
        display: none !important;
    }
    .drawer-menu li a.btn {
        margin: 20px auto;
        width: 80%;
        text-align: center;
        display: block;
    }
    .content_box {
        overflow: hidden;
    }
    .center-align_sp {
        text-align: center;
    }
    .left-align_sp {
        text-align: left;
    }
    .right-align_sp {
        text-align: right;
    }
    img {
        max-width: 100%;
    }
    .flex_box_sp {
        display: flex;
    }
    .flex_auto_c_sp {
        margin: 0 auto;
    }
    .flex_1_sp {
        flex-direction: column;
    }
    /* Flex系 */

    .item_resp_no1_sp{
        order: 1;
    }
    .item_resp_no2_sp{
        order: 2;
    }
    .item_resp_no3_sp{
        order: 3;
    }
    .item_resp_no4_sp{
        order: 4;
    }
    .item_resp_no5_sp{
        order: 5;
    }
    /*---------ここからスマホ用のheader---------*/
    .drawer-navbar .drawer-navbar-header {
        display: flex;
    }
    .drawer-hamburger {
        position: block;
    }
    header {
        margin-bottom: 20px;
    }
    /*ユーザー名部分*/
    .head_user {
        font-size: 5vw;
        background-color: #ffffff;
        box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.178);
        text-align: center;
        color: rgb(0, 0, 0);
        height: 8vh;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    h1.apk_h1_title {
        font-size: 8vw;
        font-weight: bold;
        color: white;
        text-align: center;
        margin: 0.3em 0;
    }
    /*テーブルのスクロールを許可*/
    .max_5, .max_10, .max_11, .max_12, .max_13, .max_14, .max_15 {
        overflow: auto;
        white-space: nowrap;
    }
    .table_scroll_sp {
        overflow: auto;
        white-space: nowrap;
        overflow-x: scroll;
    }
    /*--------------------------------------
    *用途 ：paddingとかmargin用
    *名前1：padding_　　margin_
    *名前2：t=上 l=左 r=右 b=下
    *名前2の後の数字：○PX等。(pをつけたら％にしてるmはマイナス。)
    --------------------------------------*/
    .margin_t_20m_sp {
        margin-top: -20px;
    }
    .margin_t_40m_sp {
        margin-top: -40px;
    }
    .margin_t_10_sp {
        margin-top: 10px;
    }
    .margin_t_20_sp {
        margin-top: 20px;
    }
    .margin_t_30_sp {
        margin-top: 30px;
    }
    .margin_t_40_sp {
        margin-top: 40px;
    }
    .margin_t_50_sp {
        margin-top: 50px;
    }
    .margin_t_60_sp {
        margin-top: 60px;
    }
    .margin_t_70_sp {
        margin-top: 70px;
    }
    .margin_t_80_sp {
        margin-top: 80px;
    }
    .margin_t_90_sp {
        margin-top: 90px;
    }
    .margin_t_100_sp {
        margin-top: 100px;
    }
    .margin_b_10_sp {
        margin-bottom: 10px;
    }
    .margin_b_20_sp {
        margin-bottom: 20px;
    }
    .margin_b_40_sp {
        margin-bottom: 40px;
    }
    .margin_b_50_sp {
        margin-bottom: 50px;
    }
    .margin_b_60_sp {
        margin-bottom: 60px;
    }
    .margin_b_10vh_sp {
        margin-bottom: 20vh;
    }
    .margin_b_20vh_sp {
        margin-bottom: 20vh;
    }
    .margin_b_30vh_sp {
        margin-bottom: 30vh;
    }
    .margin_b_40vh_sp {
        margin-bottom: 40vh;
    }
    .margin_b_10vh_sp {
        margin-bottom: 10vh;
    }
    .margin_r_10_sp {
        margin-right: 10px !important;
    }
    .margin_r_4p_sp {
        margin-right: 4% !important;
    }
    .margin_r_10_sp {
        margin-right: 10% !important;
    }
    .margin_r_20_sp {
        margin-right: 20px !important;
    }
    .margin_r_30_sp {
        margin-right: 30px !important;
    }
    .margin_r_40_sp {
        margin-right: 40px !important;
    }
    .margin_r_45_sp {
        margin-right: 45px !important;
    }
    .margin_r_50_sp {
        margin-right: 50px !important;
    }
    .margin_l_10_sp {
        margin-left: 10% !important;
    }
    .margin_l_20_sp {
        margin-left: 20px !important;
    }
    .margin_l_30_sp {
        margin-left: 30px !important;
    }
    .margin_l_40_sp {
        margin-left: 40px !important;
    }
    .margin_l_45_sp {
        margin-left: 45px !important;
    }
    .margin_l_50_sp {
        margin-left: 50px !important;
    }
    .padding_0_sp {
        padding: 0px !important;
    }

    .padding_5_sp {
        padding: 5px !important;
    }

    .padding_10_sp {
        padding: 10px !important;
    }

    .padding_20_sp {
        padding: 20px !important;
    }

    .padding_30_sp {
        padding: 30px !important;
    }

    .padding_40_sp {
        padding: 40px !important;
    }

    .padding_t_20_sp {
        padding-top: 20px !important;
    }
    .padding_t_30_sp {
        padding-top: 30px !important;
    }
    .padding_t_40_sp {
        padding-top: 40px !important;
    }
    .padding_t_50_sp {
        padding-top: 50px !important;
    }
    .padding_t_60_sp {
        padding-top: 60px !important;
    }
    .padding_t_70_sp {
        padding-top: 70px !important;
    }
    .padding_t_80_sp {
        padding-top: 80px !important;
    }
    .padding_t_90_sp {
        padding-top: 90px !important;
    }
    .padding_t_100_sp {
        padding-top: 100px !important;
    }
    .padding_b_20_sp {
        padding-bottom: 20px !important;
    }
    .padding_b_30_sp {
        padding-bottom: 30px !important;
    }
    .padding_b_40_sp {
        padding-bottom: 40px !important;
    }
    .padding_b_50_sp {
        padding-bottom: 50px !important;
    }
    .padding_b_60_sp {
        padding-bottom: 60px !important;
    }
    .padding_b_70_sp {
        padding-bottom: 70px !important;
    }
    .padding_b_80_sp {
        padding-bottom: 80px !important;
    }
    .padding_b_90_sp {
        padding-bottom: 90px !important;
    }
    .padding_b_100_sp {
        padding-bottom: 100px !important;
    }
    .padding_b_250_sp {
        padding-bottom: 250px !important;
    }
    .padding_rl_10_sp, .padding_lr_10_sp{
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .padding_l_10_sp {
        padding-left: 10px !important;
    }
    .padding_l_20_sp {
        padding-left: 20px !important;
    }
    .padding_l_30_sp {
        padding-left: 30px !important;
    }
    .padding_l_40_sp {
        padding-left: 40px !important;
    }
    .padding_l_50_sp {
        padding-left: 50px !important;
    }
    .padding_r_10_sp {
        padding-right: 10px !important;
    }
    .padding_r_20_sp {
        padding-right: 20px !important;
    }
    .padding_r_30_sp {
        padding-right: 30px !important;
    }
    .padding_r_40_sp {
        padding-right: 40px !important;
    }
    .padding_r_50_sp {
        padding-right: 50px !important;
    }
    .padding_rl_20_sp, .padding_lr_20_sp{
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .padding_bt_10_sp {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
    .padding_bt_15_sp {
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
    .width_30_sp {
        width: 30% !important;
    }
    .width_35_sp {
        width: 35% !important;
    }
    .width_40_sp {
        width: 40% !important;
    }
    .width_45_sp {
        width: 45% !important;
    }
    .width_48_sp {
        width: 48% !important;
    }
    .width_50_sp {
        width: 50% !important;
    }
    .width_60_sp {
        width: 60% !important;
    }
    .width_70_sp {
        width: 70% !important;
    }
    .width_80_sp {
        width: 80% !important;
    }
    .width_90_sp {
        width: 90% !important;
    }
    .width_100_sp {
        width: 100% !important;
    }
    .width_o_105_sp {
        width: 105%;
        margin-left: -2.5%;
    }
    .width_o_110_sp {
        width: 110%;
        margin-left: -5%;
    }
    .width_o_120_sp {
        width: 120%;
        margin-left: -10%;
    }
    .width_o_130_sp {
        width: 130%;
        margin-left: -15%;
    }
    .height_100_sp {
        height: 100%;
    }
    /*
/*margin、paddingの可変_SP
================================*/
    .margin_t_sp {
        margin-top: var(--m_t_sp) !important;
    }
    .margin_b_sp {
        margin-bottom: var(--m_b_sp) !important;
    }
    .margin_r_sp {
        margin-right: var(--m_r_sp) !important;
    }
    .margin_l_sp {
        margin-left: var(--m_l_sp) !important;
    }
    .margin_sp {
        margin: var(--m_sp) !important;
    }
    .padding_t_sp {
        padding-top: var(--p_t_sp) !important;
    }
    .padding_b_sp {
        padding-bottom: var(--p_b_sp) !important;
    }
    .padding_r_sp {
        padding-right: var(--p_r_sp) !important;
    }
    .padding_l_sp {
        padding-left: var(--p_l_sp) !important;
    }
    .padding_sp {
        padding: var(--p_sp) !important;
    }
    .width_sp {
        width: var(--width_sp) !important;
    }
    /*--------------------------------------
        *用途 ：fontサイズ
        *名前1：font_
    *名前2：s はpx　rはrem
    *※クラス名にドットが使えないので「1rem=10」
--------------------------------------*/
    .font_s_10_sp {
        font-size: 10px !important;
    }
    .font_s_11_sp {
        font-size: 11px !important;
    }
    .font_s_12_sp {
        font-size: 12px !important;
    }
    .font_s_13_sp {
        font-size: 13px !important;
    }
    .font_s_14_sp {
        font-size: 14px !important;
    }
    .font_s_15_sp {
        font-size: 15px !important;
    }
    .font_s_16_sp {
        font-size: 16px !important;
    }
    .font_s_17_sp {
        font-size: 17px !important;
    }
    .font_s_18_sp {
        font-size: 18px !important;
    }
    .font_s_19_sp {
        font-size: 19px !important;
    }
    .font_s_20_sp {
        font-size: 20px !important;
    }
    .font_s_21_sp {
        font-size: 21px !important;
    }
    .font_s_22_sp {
        font-size: 22px !important;
    }
    .font_s_23_sp {
        font-size: 23px !important;
    }
    .font_s_28_sp {
        font-size: 28px !important;
    }
    .font_r_06_sp {
        font-size: 0.6rem !important;
    }
    .font_r_07_sp {
        font-size: 0.7rem !important;
    }
    .font_r_08_sp {
        font-size: 0.8rem !important;
    }
    .font_r_09_sp {
        font-size: 0.9rem !important;
    }
    .font_r_10_sp {
        font-size: 1rem !important;
    }
    .font_r_11_sp {
        font-size: 1.1rem !important;
    }
    .font_r_12_sp {
        font-size: 1.2rem !important;
    }
    .font_r_13_sp {
        font-size: 1.3rem !important;
    }
    .font_r_14_sp {
        font-size: 1.4rem !important;
    }
    .font_r_16_sp {
        font-size: 1.6rem !important;
    }
    .font_r_17_sp {
        font-size: 1.7rem !important;
    }
    .font_r_18_sp {
        font-size: 1.8rem !important;
    }
    .font_r_19_sp {
        font-size: 1.9rem !important;
    }
    .font_r_20_sp {
        font-size: 2rem !important;
    }
    .font_vw_10_sp {
        font-size: 1vw
    }
    .font_vw_15_sp {
        font-size: 1.5vw
    }
    .font_vw_20_sp {
        font-size: 2vw
    }
    .font_vw_25_sp {
        font-size: 2.5vw
    }
    .font_vw_30_sp {
        font-size: 3vw
    }
    .font_vw_35_sp {
        font-size: 3.5vw
    }
    .font_vw_40_sp {
        font-size: 4vw
    }
    .font_vw_45_sp {
        font-size: 4.5vw
    }
    .font_vw_50_sp {
        font-size: 5vw
    }
    .font_vw_55_sp {
        font-size: 5.5vw
    }
    .font_vw_60_sp {
        font-size: 6vw
    }
    .font_vw_65_sp {
        font-size: 6.5vw
    }
    .font_vw_70_sp {
        font-size: 7vw
    }
    .font_vw_75_sp {
        font-size: 7.5vw
    }
    .font_vw_80_sp {
        font-size: 8vw
    }
    .font_vw_85_sp {
        font-size: 8.5vw
    }
    .font_vw_90_sp {
        font-size: 9vw
    }
    .font_vw_95_sp {
        font-size: 9.5vw
    }
    /*文字スペース*/
    .f_sp_01_sp {
        letter-spacing: 0.1rem;
    }
    .f_sp_03_sp {
        letter-spacing: 0.3rem;
    }
    .f_sp_05_sp {
        letter-spacing: 0.5rem;
    }
    .f_sp_08_sp {
        letter-spacing: 0.8rem;
    }
    .f_sp_10_sp {
        letter-spacing: 1rem;
    }
    /*containerの強制*/
    .container_sp_95 {
        margin: 0 auto;
        width: 95%;
    }
    .container_sp_90 {
        margin: 0 auto;
        width: 90%;
    }
    /*--------------------------------------
        *用途 ：fontリサイズ
        *使い方：<element class="font_s_20 resize_sp">
    *フォントサイズがあるものにresize_spを
   入れるとある程度調整してくれる。
    --------------------------------------*/
    .font_s_20.resize_sp {
        font-size: 18px;
    }
    /*
    /*materialize_追加
    ================================*/
    /*カードのマージンを追加*/
    .row .col.cord_mb_sp {
        margin-bottom: 20px;
    }
    /*
    /*モーダルの強制
    ================================*/
    .container #modalform.modal {
        width: 80%;
        height: 80%;
        max-height: 80%;
    }
    .modal .modal-footer {
        height: 100px;
    }
    .modal-content h4{
        font-size: 1.5rem;
    }

    .modal-content .overbox {
        width:100%;
    }
    .modal-content .radio2{
        width:100%;
    }
    /*
    /*予約フォームのポップアップ
    ================================*/
    .my_modal_wrapper .my_modal_window.big{
        width: 90%;
        max-width: 90%;
    }
}


/*--------------------------------------------------
 * タブレット用の分
 *--------------------------------------------------*/

@media screen and (min-width:500px) and (max-width:800px) {
    .pc_only.pad_only {
        display: block !important;
    }
    .sp_only.pad_only {
        display: none !important;
    }
    .pc_only.pad_only._line {
        display: inline !important;
    }
}

/*--------------------------------------------------
 * PCとスマホの共通
 *--------------------------------------------------*/

body {
    background-color: #ffffff;
}

h1 {
    font-size: 10px;
}

a.btn {
    display: block;
}

/* Flex系 */

.item_resp_no1{
    order: 1;
}
.item_resp_no2{
    order: 2;
}
.item_resp_no3{
    order: 3;
}
.item_resp_no4{
    order: 4;
}
.item_resp_no5{
    order: 5;
}

.center-align {
    text-align: center;
}
.left-align {
    text-align: left;
}
.right-align {
    text-align: right;
}

.multi_sp1, .flex_multi,.flex_wrap {
    flex-wrap: wrap;
}

.single_sp1, .flex_single {
    flex-direction: column;
}

.flex_box {
    display: flex;
}

.flex_auto_c {
    margin: 0 auto;
}

.margin_auto_center {
    margin: 0 auto;
}

.all_center {
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.flex_all_center {
    display: flex;
    align-items: center;
    justify-content: center;
}
.one_flex{
    flex-direction: column;
}

.all_center.blk {
    display: block;
}

footer {
    padding-top: 100px;
}

/*----------------------------------
/*リセット用
/*--------------------------------*/

.float_delete, .valcheck-err {
    clear: both;
}

/*----------------------------------
/*パーツ類
/*--------------------------------*/

/* ページトップに戻る*/

.page_top {
    display: block;
    display: none;
}

/* ページの仕分け下線(小) */

.line_gray_mini {
    width: 100%;
    max-width: 5rem;
    height: 2px;
    background: #FFFFFF;
    margin: 0 auto;
}

/* buttonの色 */

.btn_white, .btn-large_white, .btn-small_white {
    color: #1B1C20;
    background-color: #FFFFFF;
}

.btn_white:hover, .btn-large_white:hover, .btn-small_white:hover {
    /*background-color: #2bbbad;*/
}

/*
/*シンプルなボタン
================================*/

/*背景白・文字が黒*/

.my_s_btn_1 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #1B1B1B;
    background: #fff;
    border: 1px solid #1B1B1B;
}

.my_s_btn_1:hover {
    background: #1B1B1B;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

.my_s_btn_1:hover i::before {
    color: #fff;
}

.my_s_btn_2 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #000;
    border: 1px solid #000;
}

.my_s_btn_2:hover {
    background: #1B1B1B;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

.my_s_btn_2:hover i::before {
    color: #fff;
}
.my_s_btn_3 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #929292;
    border: 1px solid #929292;
}

.my_s_btn_3:hover {
    background: #1B1B1B;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

.my_s_btn_3:hover i::before {
    color: #fff;
}

.my_s_btn_4 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #dc143c;
    border: 1px solid #dc143c;
}

.my_s_btn_4:hover {
    background: #dc143c;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

.my_s_btn_4:hover i::before {
    color: #fff;
}
/*グリーンボタン*/

.my_btn_green {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #ffffff;
    background: #0F7F5A;
}

.my_btn_green:hover {
    background: #2D9E78;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

/*背景白・文字が黒の丸っこい*/

.my_sc_btn_1 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #1B1B1B;
    background: #fff;
    border: 1px solid #1B1B1B;
    border-radius: 20px;
}

.my_sc_btn_1:hover {
    background: #565656;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
    border-radius: 20px;
}

.my_sc_btn_1:hover i::before {
    color: #fff;
}

/*背景黒・文字が白*/

.my_s_btn_2 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #1B1B1B;
    border: 1px solid #1B1B1B;
}

.my_s_btn_2:hover {
    background: #565656;
    border: 1px solid #565656;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

.my_s_btn_3 {
    display: block;
    position: relative;
    padding: 0.8em;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: #929292;
    border: 1px solid #929292;
}

.my_s_btn_3:hover {
    background: #565656;
    border: 1px solid #565656;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}

/*ボタンに丸み*/

.btn_c_5 {
    border-radius: 5px;
}

.btn_c_10 {
    border-radius: 10px;
}

.btn_c_20 {
    border-radius: 20px;
}
/*ボタンの枠を消す*/
.btn_n_line {
    border: 0px !important;
}

/* ラジオボタン */

.multiple_box input[type="radio"] {
    display: none;
}

.multiple_box label {
    display: inline-block;
    color: #000;
    background-color: #e2e2e2;
    text-align: center;
    width: 48%;
}

.multiple_box label.width_100 {
    width: 100%;
}

.multiple_box input[type="radio"]:checked+label {
    background-color: #313131;
    color: white;
}

.multiple_box input[type="radio"]:checked+label::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 800;
    content: "\f00c";
    margin-right: 10px;
}

/* ラジオボタン(項目多い分) */

.plan_box input[type="radio"] {
    display: none;
}

.plan_box label {
    display: inline-block;
    color: #fff;
    background-color: #929292;
    text-align: center;
    border: initial;
}

.plan_box input[type="radio"]:checked+label, .plan_box input[type="checkbox"]:checked+label {
    background-color: #D97D54;
    border: initial;
}

.plan_box input[type="radio"]:checked+label::before, .plan_box input[type="checkbox"]:checked+label::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 800;
    content: "\f00c";
    margin-right: 10px;
}

/* CheckBox */

.multiple_box input[type="CheckBox"] {
    display: none;
}

.multiple_box input[type="CheckBox"]:checked+label {
    background-color: #D97D54;
}

.multiple_box input[type="CheckBox"]:checked+label::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 800;
    content: "\f00c";
    margin-right: 10px;
}

/* 装飾(boxとかに) */

.rbn_box-wrapper {
    position: relative;
}

.rbn_box {
    position: absolute;
    left: 0;
    top: 5px;
    box-sizing: border-box;
    padding: 0 5px;
    margin: 0;
    height: 30px;
    line-height: 30px;
    font-size: 18px;
    letter-spacing: 0.1em;
    color: white;
    background: #ff7470;
    box-shadow: 1px -1px 1px rgba(0, 0, 0, 0.1);
}

.rbn_box:before {
    position: absolute;
    content: '';
    top: -8px;
    left: -7px;
    border: none;
    height: 38px;
    width: 7px;
    background: #ff7470;
    border-radius: 5px 0 0 5px;
}

.rbn_box:after {
    position: absolute;
    content: '';
    top: -7px;
    left: -5px;
    border: none;
    height: 7px;
    width: 5px;
    background: #b25552;
    border-radius: 5px 0 0 5px;
}

td .rbn_box {
    display: none;
}

td.rbn_box-wrapper .rbn_box {
    display: inline-block;
}

/* iconの補助 */

i.tb_50 {
    vertical-align: middle;
}

/*--------------------------------------
* フォームのエラー部分 ：
*--------------------------------------*/

.valcheck-err {
    color: red;
    font-size: 12px;
}

.valcheck-err::before {
    /*font-family: 'Font Awesome 5 Free';
    font-weight: 800;
    content: "\f071";
    margin-right: 10px;*/
}

/*--------------------------------------
* CSSオンリーのモーダルウィンドウ ：
*--------------------------------------*/

/*--------------------------------------
* CSSオンリーのモーダルウィンドウ2
*--------------------------------------*/

.my_modal_wrapper {
    z-index: 999;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 40px 10px;
    text-align: center
}

.my_modal_wrapper:not(:target) {
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s;
}

.my_modal_wrapper:target {
    opacity: 1;
    visibility: visible;
    transition: opacity .4s, visibility .4s;
}

.js-not.my_modal_wrapper {
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s;
}

.js.my_modal_wrapper {
    opacity: 1;
    visibility: visible;
    transition: opacity .4s, visibility .4s;
}

.my_modal_wrapper::after {
    display: inline-block;
    height: 100%;
    margin-left: -.05em;
    vertical-align: middle;
    content: ""
}

.my_modal_wrapper .my_modal_window {
    box-sizing: border-box;
    display: inline-block;
    z-index: 20;
    position: relative;
    width: 70%;
    max-width: 600px;
    padding: 30px 30px 15px;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 0 30px rgba(0, 0, 0, .6);
    vertical-align: middle
}

.my_modal_wrapper .my_modal_window .my_modal_content {
    max-height: 80vh;
    overflow-y: auto;
    text-align: left
}

.my_modal_overlay {
    z-index: 10;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, .8)
}

.my_modal_wrapper .my_modal_close {
    z-index: 20;
    position: absolute;
    top: 0;
    right: 0;
    width: 35px;
    color: #95979c !important;
    font-size: 20px;
    font-weight: 700;
    line-height: 35px;
    text-align: center;
    text-decoration: none;
    text-indent: 0
}

.my_modal_wrapper .my_modal_close:hover {
    color: #2b2e38 !important
}

/*--------------------------------------
* 画像に文字を入れる
*--------------------------------------*/

figure.hover-parent {
    width: 100%;
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

figcaption.hover-mask {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    color: #fff;
    display: flex;
    align-items: center;
    text-align: center;
    padding: 30px;
}

/*--------------------------------------
* GoogleMAPを入れる
*--------------------------------------*/

.g_map_box {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.g_map_box iframe, .g_map_box object, .g_map_box embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*--------------------------------------
*用途 ：paddingとかmargin用
*名前1：padding_　　margin_
*名前2：t=上 l=左 r=右 b=下 o=枠を出る。
※省略時は全て
*名前2の後の数字：○PX等。
*mを数字につけるとマイナス
--------------------------------------*/

.margin_0 {
    margin: 0px;
}

.margin_10 {
    margin: 10px;
}

.margin_20 {
    margin: 20px;
}

.margin_t_0 {
    margin-top: 0px !important;
}

.margin_t_10 {
    margin-top: 10px !important;
}

.margin_t_15 {
    margin-top: 15px !important;
}

.margin_t_20 {
    margin-top: 20px !important;
}

.margin_t_30 {
    margin-top: 30px !important;
}

.margin_t_40 {
    margin-top: 40px !important;
}

.margin_t_50 {
    margin-top: 50px !important;
}
.margin_t_100 {
    margin-top: 100px !important;
}
.margin_t_150 {
    margin-top: 150px !important;
}

.margin_t_m20 {
    margin-top: -20px !important;
}

.margin_t_25 {
    margin-top: 25px !important;
}

.margin_b_0 {
    margin-bottom: 0px !important;
}

.margin_b_10 {
    margin-bottom: 10px !important;
}

.margin_b_15 {
    margin-bottom: 15px !important;
}

.margin_b_20 {
    margin-bottom: 20px !important;
}

.margin_b_25 {
    margin-bottom: 25px !important;
}

.margin_b_30 {
    margin-bottom: 30px !important;
}

.margin_b_40 {
    margin-bottom: 40px !important;
}

.margin_b_45 {
    margin-bottom: 45px !important;
}

.margin_b_50 {
    margin-bottom: 50px !important;
}

.margin_b_55 {
    margin-bottom: 55px !important;
}

.margin_b_60 {
    margin-bottom: 60px !important;
}

.margin_b_65 {
    margin-bottom: 65px !important;
}

.margin_b_70 {
    margin-bottom: 70px !important;
}

.margin_b_75 {
    margin-bottom: 75px !important;
}

.margin_b_80 {
    margin-bottom: 80px !important;
}

.margin_b_85 {
    margin-bottom: 85px !important;
}

.margin_b_90 {
    margin-bottom: 90px !important;
}
.margin_b_100 {
    margin-bottom: 100px !important;
}
.margin_b_150 {
    margin-bottom: 150px !important;
}

.margin_r_10 {
    margin-right: 10px !important;
}
.margin_r_5 {
    margin-right: 5px !important;
}

.margin_r_4p {
    margin-right: 4%;
}

.margin_r_10p {
    margin-right: 10%;
}

.margin_r_20 {
    margin-right: 20px;
}

.margin_r_30 {
    margin-right: 30px;
}

.margin_r_40 {
    margin-right: 40px;
}

.margin_r_45 {
    margin-right: 45px;
}

.margin_r_50 {
    margin-right: 50px;
}

.margin_l_10 {
    margin-left: 10%;
}

.margin_l_20 {
    margin-left: 20px;
}

.margin_l_30 {
    margin-left: 30px;
}

.margin_l_40 {
    margin-left: 40px;
}

.margin_l_45 {
    margin-left: 45px;
}

.margin_l_50 {
    margin-left: 50px;
}
.width_10 {
    width: 10%;
}
.width_20 {
    width: 20%;
}
.width_30 {
    width: 30%;
}

.width_40 {
    width: 40%;
}

.width_50 {
    width: 50%;
}

.width_60 {
    width: 60%;
}

.width_70 {
    width: 70%;
}

.width_80 {
    width: 80%;
}

.width_90 {
    width: 90%;
}

.width_95 {
    width: 95%;
}

.width_100 {
    width: 100% !important;
}

.width_o_105 {
    width: 105%;
    margin-left: -2.5%;
}

.width_o_110 {
    width: 110%;
    margin-left: -5%;
}

.width_o_120 {
    width: 120%;
    margin-left: -10%;
}

.width_o_130 {
    width: 130%;
    margin-left: -15%;
}

.width_m_80 {
    max-width: 80%;
}

.width_m_90 {
    max-width: 90%;
}

.width_m_100 {
    max-width: 100%;
}

.pad_0_075rem {
    padding: 0 0.75rem;
}

.padding_5 {
    padding: 5px;
}
.padding_10 {
    padding: 10px;
}

.padding_20 {
    padding: 20px;
}

.padding_30 {
    padding: 30px;
}

.padding_40 {
    padding: 40px;
}

.padding_b_20 {
    padding-bottom: 20px;
}

.padding_b_30 {
    padding-bottom: 30px;
}

.padding_b_40 {
    padding-bottom: 40px;
}

.padding_b_50 {
    padding-bottom: 50px;
}

.padding_b_60 {
    padding-bottom: 60px;
}

.padding_b_70 {
    padding-bottom: 70px;
}

.padding_b_80 {
    padding-bottom: 80px;
}

.padding_b_90 {
    padding-bottom: 90px;
}

.padding_b_100 {
    padding-bottom: 100px;
}

.padding_b_120 {
    padding-bottom: 120px;
}

.padding_t_20 {
    padding-top: 20px;
}

.padding_t_30 {
    padding-top: 30px;
}

.padding_t_40 {
    padding-top: 40px;
}

.padding_t_50 {
    padding-top: 50px;
}

.padding_t_60 {
    padding-top: 60px;
}

.padding_t_70 {
    padding-top: 70px;
}

.padding_t_80 {
    padding-top: 80px;
}

.padding_t_90 {
    padding-top: 90px;
}

.padding_t_100 {
    padding-top: 100px;
}

.padding_tb_5, .padding_bt_5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.padding_tb_10, .padding_bt_10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.padding_tb_15, .padding_bt_15 {
    padding-top: 15px;
    padding-bottom: 15px;
}

.padding_tb_20, .padding_bt_20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

.padding_tb_40, .padding_bt_40 {
    padding-top: 40px;
    padding-bottom: 40px;
}

.padding_tb_50, .padding_bt_50 {
    padding-top: 50px;
    padding-bottom: 50px;
}

.padding_tb_60, .padding_bt_60 {
    padding-top: 60px;
    padding-bottom: 60px;
}

.padding_tb_70, .padding_bt_70 {
    padding-top: 70px;
    padding-bottom: 70px;
}

.padding_tb_80, .padding_bt_80 {
    padding-top: 80px;
    padding-bottom: 80px;
}

.padding_rl_10, .padding_lr_10 {
    padding-left: 10px;
    padding-right: 10px;
}
.padding_rl_20, .padding_lr_20 {
    padding-left: 20px;
    padding-right: 20px;
}
.padding_rl_30, .padding_lr_30 {
    padding-left: 30px;
    padding-right: 30px;
}
.padding_l_10 {
    padding-left: 10px !important;
}
.padding_l_20 {
    padding-left: 20px !important;
}
.padding_l_30 {
    padding-left: 30px !important;
}
.padding_r_10 {
    padding-right: 10px !important;
}
.padding_r_20 {
    padding-right: 20px !important;
}
.padding_r_30 {
    padding-right: 30px !important;
}
/*
/*margin、paddingの可変_ALL
================================*/

.margin_t_all {
    margin-top: var(--m_t_all) !important;
}

.margin_b_all {
    margin-bottom: var(--m_b_all) !important;
}

.margin_r_all {
    margin-right: var(--m_r_all) !important;
}

.margin_l_all {
    margin-left: var(--m_l_all) !important;
}
.margin_all {
    margin: var(--m_all) !important;
}

.padding_t_all {
    padding-top: var(--p_t_all) !important;
}

.padding_b_all {
    padding-bottom: var(--p_b_all) !important;
}

.padding_r_all {
    padding-right: var(--p_r_all) !important;
}

.padding_l_all {
    padding-left: var(--p_l_all) !important;
}
.padding_all {
    padding: var(--p_all) !important;
}

.width_all {
    width: var(--width_all) !important;
}
/*文字スペース*/

.f_sp_01 {
    letter-spacing: 0.1rem;
}
.f_sp_02 {
    letter-spacing: 0.2rem;
}

.f_sp_03 {
    letter-spacing: 0.3rem;
}

.f_sp_05 {
    letter-spacing: 0.5rem;
}

.f_sp_08 {
    letter-spacing: 0.8rem;
}

.f_sp_10 {
    letter-spacing: 1rem;
}

/*containerの強制*/

.container_95 {
    margin: 0 auto;
    width: 95%;
}

.container_90 {
    margin: 0 auto;
    width: 90%;
}

/*--------------------------------------
        *用途 ：fontサイズ
        *名前1：font_
    *名前2：s はpx　rはrem
    *※クラス名にドットが使えないので「1rem=10」
--------------------------------------*/

.font_bold,.bold {
    font-weight: bold !important;
}
.font_s_10 {
    font-size: 10px !important;
}

.font_s_11 {
    font-size: 11px !important;
}

.font_s_12 {
    font-size: 12px !important;
}

.font_s_13 {
    font-size: 13px !important;
}

.font_s_14 {
    font-size: 14px !important;
}

.font_s_15 {
    font-size: 15px !important;
}

.font_s_16 {
    font-size: 16px !important;
}

.font_s_17 {
    font-size: 17px !important;
}

.font_s_18 {
    font-size: 18px !important;
}

.font_s_19 {
    font-size: 19px !important;
}

.font_s_20 {
    font-size: 20px !important;
}

.font_s_21 {
    font-size: 21px !important;
}

.font_s_22 {
    font-size: 22px !important;
}

.font_s_23 {
    font-size: 23px !important;
}
.font_s_28 {
    font-size: 28px !important;
}

.font_r_08 {
    font-size: 0.8rem !important;
}

.font_r_09 {
    font-size: 0.9rem !important;
}

.font_r_10 {
    font-size: 1rem !important;
}

.font_r_11 {
    font-size: 1.1rem !important;
}

.font_r_12 {
    font-size: 1.2rem !important;
}

.font_r_13 {
    font-size: 1.3rem !important;
}

.font_r_14 {
    font-size: 1.4rem !important;
}

.font_r_16 {
    font-size: 1.6rem !important;
}

.font_r_17 {
    font-size: 1.7rem !important;
}

.font_r_18 {
    font-size: 1.8rem !important;
}

.font_r_19 {
    font-size: 1.9rem !important;
}

.font_r_20 {
    font-size: 2rem !important;
}

.font_vw_10 {
    font-size: 1vw !important;
}

.font_vw_15 {
    font-size: 1.5vw !important;
}

.font_vw_20 {
    font-size: 2vw !important;
}

.font_vw_25 {
    font-size: 2.5vw !important;
}

.font_vw_30 {
    font-size: 3vw !important;
}

.font_vw_35 {
    font-size: 3.5vw !important;
}

.font_vw_40 {
    font-size: 4vw !important;
}

.font_vw_45 {
    font-size: 4.5vw !important;
}

.font_vw_50 {
    font-size: 5vw !important;
}

.font_vw_55 {
    font-size: 5.5vw !important;
}

.font_vw_60 {
    font-size: 6vw !important;
}

.font_vw_65 {
    font-size: 6.5vw !important;
}

.font_vw_70 {
    font-size: 7vw !important;
}

.font_vw_75 {
    font-size: 7.5vw !important;
}

.font_vw_80 {
    font-size: 8vw !important;
}

.font_vw_85 {
    font-size: 8.5vw !important;
}

.font_vw_90 {
    font-size: 9vw !important;
}

.font_vw_95 {
    font-size: 9.5vw !important;
}

.f_bold {
    font-weight: bold;
}

.white-text2 {
    color: #e8eaed
}

.f_del_red {
    color: red;
    text-decoration: line-through;
}

.widh_title {
    letter-spacing: 0.5rem;
}

/*--------------------------------------
        *用途 ：ZOOM
        *名前1：max_
    *名前2：テーブルの数(数字)
--------------------------------------*/

.zoom_150 {
    zoom: 150%;
}

.zoom_200 {
    zoom: 200%;
}

/*--------------------------------------
        *用途 ：テーブルの最高表示
        *名前1：max_
    *名前2：テーブルの数(数字)
    *50px × 数　+20pxぐらい。
--------------------------------------*/

.max_1 {
    max-height: 70px;
    overflow-x: auto;
    overflow-y: scroll;
}

.max_2 {
    max-height: 120px;
    overflow-x: auto;
    overflow-y: scroll;
}

.max_5 {
    max-height: 270px;
    overflow-x: auto;
    overflow-y: scroll;
}

.max_10 {
    height: 520px;
    overflow-x: scroll;
    overflow-y: scroll;
}

.max_11 {
    height: 570px;
    overflow-x: scroll;
    overflow-y: scroll;
}

.max_12 {
    height: 620px;
    overflow-x: scroll;
    overflow-y: scroll;
}

.max_13 {
    height: 670px;
    overflow-x: auto;
    overflow-y: scroll;
}

.max_14 {
    height: 720px;
    overflow-x: auto;
    overflow-y: scroll;
}

.max_15 {
    height: 770px;
    overflow-x: auto;
    overflow-y: scroll;
}

/*--------------------------------------
        *用途 ：エラーメッセージ
--------------------------------------*/

.error-message {
    color: #e32;
}

.valcheck-err {
    display: none;
}

.valcheck-err-msg {
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    color: #fd0001;
    padding: 3px 6px;
    display: inline-block;
    margin: 3px 0;
}

.valcheck-err-msg::before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: "\f071";
}

/*--------------------------------------
        *用途 ：リセット用のクラス
    *名前1：リセットしたい要素(tableとかCheckBoxとか)
    *名前2：_reset
    *
--------------------------------------*/

.CheckBox_reset {
    position: initial;
    opacity: initial;
    pointer-events: initial;
}

[type="checkbox"].CheckBox_reset:not(:checked), [type="checkbox"].CheckBox_reset:checked {
    position: initial;
    opacity: initial;
    pointer-events: initial;
}

/*
/*materialize_追加
================================*/

/*カードのマージンを追加*/

.row .col.cord_mb {
    margin-bottom: 20px;
}

/*
/*画像の位置
/*数字の後にrをつけるとrem
================================*/

.top_10 {
    top: 10%;
}

.top_20 {
    top: 20%;
}

.top_30 {
    top: 30%;
}

.top_40 {
    top: 40%;
}

.top_50 {
    top: 50%;
}

.top_55 {
    top: 55%;
}

.top_60 {
    top: 60%;
}

.top_70 {
    top: 70%;
}

.top_75 {
    top: 75%;
}

.top_1r {
    top: 1rem;
}

.top_2r {
    top: 2rem;
}

.top_3r {
    top: 3rem;
}

.top_4 {
    top: 4rem;
}

.top_5r {
    top: 5rem;
}

.top_6r {
    top: 6rem;
}

.top_7r {
    top: 7rem;
}

.top_8r {
    top: 8rem;
}

.top_9r {
    top: 9rem;
}

.top_10r {
    top: 11rem;
}

.top_12r {
    top: 12rem;
}

.left_10 {
    left: 10%;
}

.left_20 {
    left: 20%;
}

.left_30 {
    left: 30%;
}

.left_40 {
    left: 40%;
}

.left_50 {
    left: 50%;
}

/*
/*下線を入れる
/*名前1：t=top,b=bottom
/*名前2：line(固定)
/*名前3：線の太さ
/*名前4：色
================================*/

.b_line_2_gray {
    margin-left: 20px;
    border-top: solid 2px #585858;
}
/*
/*予約フォームのポップアップ
================================*/

.img_block_c{
    margin: 0 auto;
    display: block;
}

/*
/*縁取り
================================*/

.text_border_w {
    text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0-1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF;
}

.text_border_b {
    text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, 0-1px 0 #000, -1px 0 0 #000, 1px 0 0 #000;
}

/*
/*フォント
================================*/

.fon_min {
    font-family: serif;
}

.fon_app {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.fon_sans{
    font-family: 'Allura', cursive;
}

/* 通常のﾁｪｯｸボックス */
input[type="checkbox"].normal{
    position: initial;
    opacity: initial;
    pointer-events: auto;
}

.line-clamp2 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.line-clamp4 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.info_alert {
    background: #ee0000;
    position: absolute;
    right: -30%;
    top: -50%;
    color: #fff;
    border-radius: 100%;
    height: 24px;
    width: 24px;
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    line-height: 1.5;
}