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

@media only screen and (min-width: 769px), print {
    body {
        background-color: #ffffff;
    }
    ul.bottom-menu {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        margin: 0;
        padding-top: 10px;
        /*背景色*/
        background-color: white;
        z-index: 30;
    }
    .bottom-menu.pc_only i {
        margin-right: 10px
    }
    /* .row .col.s12 {
        width: 100%;
        margin-left: auto;
        left: auto;
        right: auto;
    }
    .row .col {
        float: left;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 0 0.75rem;
        min-height: 1px;
    }*/
    /*
        /*ヘッダー部分
    ================================*/
    header.drawer-navbar {
        background: white;
    }
    header .drawer-container {
        max-width: 1280px;
    }
    header .hp_top_logo {
        width: 120px;
        height: auto;
        margin-top: 20px;
    }
    .drawer-navbar.d_header .drawer-nav {
        width: 100%;
        height: 80px;
    }
    header .drawer-navbar-header {
        margin-left: 3rem;
        margin-right: 3rem;
    }
    header .drawer-menu--left {
        float: left;
    }
    header .drawer-menu.drawer-menu--right {
        margin-right: 3rem;
    }
    header .h_d_menu li {
        padding-top: 3rem;
    }
    header .drawer-menu-item {
        margin-left: 1.0rem;
        margin-right: 1.0rem;
        /* font-size: 0.9rem; */
    }
    header .up_bar {
        position: absolute;
        right: 0;
    }
    header.drawer-navbar .drawer-menu-item {
        line-height: 2.5rem;
    }
    .menu_select {
        border-top: solid 2px #585858;
    }
    h1.h1_logo {
        margin: 0;
    }
    .drawer-menu--right.up_bar.margin_t_10_pc {
        margin-top: 10px;
    }
    .h_d_menu {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        position: absolute;
    }
    /*----------------------------------
    /*フッター調整
    /*---------------------------------*/
    footer .btn {
        border-radius: 20px;
        height: initial;
        line-height: 8vh;
    }
    .fixed-action-btn {
        bottom: 13vh;
    }
    /*----------------------------------
    /*予約状況カード
    /*---------------------------------*/
    .reservation {
        font-size: 20px;
    }
    .reservation_time {
        font-weight: bold;
    }
}

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

@media only screen and (max-width: 768px) {
    body {
        background-color: #ffffff;
    }
    h1 {
        font-size: 10px;
    }
    a.btn {
        display: block;
    }
    .drawer-navbar .drawer-menu {
        padding-bottom: 0rem;
    }
    /*
    /*ヘッダー
    ================================*/
    .hed_menu_w{
        width: 4rem;
    }
    /*---------ここからスマホ用のfooter---------*/
    .mini-text {
        font-size: 0.8rem;
    }
    /*文字大きさ*/
    ul.bottom-menu {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 50px;
        margin: 0;
        padding: 0;
        /*背景色*/
        background-color: white;
        z-index: 30;
    }
    ul.bottom-menu li {
        float: left;
        width: 20%;
        height: 100%;
        /*バーの上の線の色*/
        /* border: 1px solid #616161; */
        border-collapse: collapse;
        background-color: rgb(255, 255, 255);
        /*背景色*/
        list-style-type: none;
        text-align: center;
        /* font-size: 200%; */
        /*アイコンのサイズ*/
        font-size: 1.5rem;
    }
    .bottom-menu li a {
        display: block;
        color: #404040;
        /*アイコン＆文字の色*/
        padding-top: 0.4rem;
        padding-bottom: 5px;
        line-height: 3vh;
        text-decoration: none;
    }
    .bottom-menu li a:hover {
        color: #a9a9a9;
        /*マウスオーバー時の色*/
    }
    /* === 展開メニュー === */
    ul.menu-second-level {
        visibility: hidden;
        opacity: 0;
        z-index: 1;
    }
    ul.menu-second-level li a {
        border-top: 1px dashed #a9a9a9;
        /*展開の枠点線色*/
        font-size: 15px;
        /*展開メニューの文字サイズ*/
        line-height: 30px;
        /*文字の縦幅*/
    }
    .menu-second-level li a:hover {
        height: 100%;
        background: lightgrey;
        /*マウスオーバーの色*/
    }
    li.menu-width-max ul.menu-second-level {
        position: absolute;
        bottom: 47px;
        /*高さ*/
        left: 0;
        box-sizing: border-box;
        width: 100%;
        padding: 0;
    }
    li.menu-width-max:hover ul.menu-second-level {
        bottom: 47px;
        /*高さ*/
        visibility: visible;
        opacity: 1;
    }
    li.menu-width-max ul.menu-second-level li {
        float: left;
        width: 100%;
        border: none;
    }
    /*ボトムメニュー付けたのでフッタを底上げする*/
    footer {
        margin-bottom: 100px;
    }
    .flex_sp {
        display: flex;
        z-index: 1000;
        position: fixed;
        bottom: 5%;
        left: 43%;
        width: 100%
    }
    .circle {
        padding: 5px;
        background-color: #404040;
        left: 0;
        right: 0;
        margin: 0 auto;
        border: 1px solid;
        border-radius: 50%;
        color: #D97D54;
        border: solid 1px #c7c7c7;
        box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.25);
    }
    .circle_shadow {
        position: fixed;
        width: 20vw;
        /* height: 20vw; */
        background-color: white;
        bottom: 0.2rem;
        left: 0;
        right: 0;
        margin: 0 auto;
        border: 1px solid;
        border-radius: 50%;
        color: #D97D54;
        border: solid 5px #ffffff;
    }
    .bottom_square {
        margin-top: 15%;
    }
    .circle i, .circle span {
        color: #ffffff;
    }
    .circle .mini-text {
        font-size: 12px;
    }
    ul.bottom-menu li.select_page {
        float: left;
        width: 20%;
        height: 100%;
        background-color: #404040;
        list-style-type: none;
        text-align: center;
        font-size: 1.5rem;
    }
    .bottom-menu li.select_page a {
        display: block;
        color: #ffffff;
    }
    /*----------------------------------
    /*予約状況カード
    /*---------------------------------*/
    .reservation_card {
        padding-top: 20px;
        flex-direction: column;
    }
    .reservation .card .card-content {
        padding: 12px;
    }
    .reservation {
        font-size: 20px;
    }
    .reservation_time {
        font-weight: bold;
    }
    /*----------------------------------
    /*TOP用カード
    /*---------------------------------*/
    .top_shop_news_table td:nth-child(2) {
        width: 90%;
        margin: 0 auto;
    }
    /*----------------------------------
    /*来店履歴
    /*---------------------------------*/
    .top_history_table td:nth-child(2) {
        width: 90%;
        margin: 0 auto;
    }
}

/*タブレット用のfooter*/

@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とスマホの共通
 *--------------------------------------------------*/

/*
/*Header
================================*/

header a.btn {
    line-height: 30px;
    height: 30px;
}

/*----------------------------------
/*影を消す
/*---------------------------------*/

.z-depth-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-small, .btn-floating, .dropdown-content, .collapsible, .sidenav {
    -webkit-box-shadow: initial;
    box-shadow: initial;
}

.barcode_white {
    display: flex;
    padding-top: 20px;
    padding-bottom: 20px;
}

.barcode_white img {
    max-width: 4.5cm;
    display: flex;
}

.barcode_center {
    display: inline-block;
    max-width: 100%;
    margin: 0 auto;
}

/*TOP用カード仕分けのheader*/

h3.apk_top {
    position: relative;
    padding-left: 0px;
}

h3.apk_top:after {
    position: absolute;
    content: '';
    bottom: -12px;
    left: 0px;
    width: 95%;
    border-bottom: solid 3px #484848;
}

/*TOP用テーブル(お知らせ)*/

.top_shop_news_table td:nth-child(1) {
    width: 30%;
}

/*TOP用テーブル(履歴)*/

.top_history_table td:nth-child(1) {
    width: 50%;
}

/*
/*来店履歴・購入履歴
================================*/

.history_apk_tab .tabs .tab a {
    color: rgb(0, 0, 0);
    display: block;
    background-color: #cccccc;
    width: 100%;
    height: 100%;
    padding: 0 24px;
    font-size: 14px;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-transition: color .28s ease, background-color .28s ease;
    transition: color .28s ease, background-color .28s ease;
}

.history_apk_tab .tabs .tab a:focus, .tabs .tab a:focus.active {
    background-color: rgba(138, 138, 138, 0.4);
    outline: none;
}

.history_apk_tab .tabs .tab a:hover, .tabs .tab a.active {
    background-color: black;
    color: #ffffff;
}

.history_apk_tab .tabs .tab.disabled a, .tabs .tab.disabled a:hover {
    color: rgba(138, 138, 138, 0.4);
    cursor: default;
}

.history_apk_tab .tabs .indicator {
    position: absolute;
    bottom: 0;
    height: 2px;
    background-color: #909090;
    will-change: left, right;
}

.enter_shop_tab table tr td {
    padding: 5px 5px;
}

/*
/*請求明細
================================*/
.table_title a{
    color:white;
    text-decoration: underline;
}

/*
/*急遽変更分(後から不要部分を削除する)
================================*/

nav {
    -webkit-box-shadow: initial;
    box-shadow: initial;
}

.mp_top {
    padding: 10px;
}
.mp_top p {
    font-size: 1.6em;
}


.health_t_menu div {
    padding: 10px !important;
    color: #c2c2c2;
}
.health_t_menu a,.graf_t_menu a{
    color: #919191;
}

.health_t_menu .select_page a {
    color: black;
    border-radius: 10px;
}
.graf_t_menu .select_page a {
    color: black;
    border-radius: 10px;
}

.health_t_menu p {
    padding-top: 5px;
}
.break_container {
    width: 99.5vw;
    margin-left: calc(((100vw - 100%) / 2) * -1);
    margin-right: calc(((100vw - 100%) / 2) * -1);
}

@media only screen and (max-width: 768px) {
    .break_container_sp {
        width: 99.5vw;
        margin-left: calc(((100vw - 100%) / 2) * -1);
        margin-right: calc(((100vw - 100%) / 2) * -1);
    }
}

.non_row_mar, .row_mar_non {
    margin-bottom: 0px!important;
}

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

.text_bottom_set {
    line-height: 1.5rem;
}