/* スマホとPC版での基本幅の違いを定義 */
@media (max-width: 719px) {
    :root {
        --base-width: 100vw;
    }

    /* アンカリンククリック時、TOPの固定ヘッダ分をずらす定義 */
    :target {
        padding-top: 30px;
        margin-top: -30px;
    }
}

@media (min-width: 720px) {
    :root {
        --base-width: 720px;
        --menubar-width: calc(var(--base-width) * 1.12);
        --non-scrollbar : calc(100vw - 16px);
    }

    /* アンカリンククリック時、TOPの固定ヘッダ分をずらす定義 */
    :target {
        padding-top: 65px;
        margin-top: -65px;
    }
}


body{
    font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif;
    font-weight: 300;
    font-size: 20px;
    letter-spacing: 0.2em;
    margin: 0;
    max-width: var(--non-scrollbar);
    overflow-x: hidden;
}

/* 上位階層に入ってしまう左側余白を消す */
#app {
    position: absolute;
    left: 0;
    top: 0;;
}

/* loadingレイヤーの定義 */
#loading_layer{
    position: fixed;
    display: flex;
    flex-direction: column;
    top: 0;
    left: 0;
    width: var(--non-scrollbar);
    height: 100vh;
    background-color: white;
    color: black;
    z-index: 10000;
}

#loading_layer .loading_img {
    display: block;
    width: 20vw;
    height: auto;
    margin: auto auto 1px;
    z-index: 1001;
}

#loading_layer p {
    display: block;
    margin: 1px auto auto;
    z-index: 1001;
}

/* TOPロゴの部分はマージンを空けておく */
#top_page, #layouts, #free_items, #systems, #add_options, #estimate, #reserve {
    position: absolute;
    width: var(--non-scrollbar);
    top: 0;
    margin-top: 72px;
    content-visibility: auto;   /* 初期表示外の要素の描画は、描画の必要があるまで行わない */
    contain-intrinsic-size: 100px;
}

/* SP版では表示させる(PC版では表示させない)アイテムのクラス定義 */
.for_sp {
    display: none;
}

/* PC版では表示させる(SP版では表示させない)アイテムのクラス定義 */
.for_pc {
    display: initial;
}

/* 固定メニュー定義 */
#fixed_menu {
    position: fixed;
    left : 0;
    top: 0;
    width: var(--non-scrollbar);
    background-color: white;
    z-index: 101;
}

.menu_inner {
    position: relative;
    width: 100%;
    height: 72px;
    margin: 0;
    background-color: white;
}

.menu_bar {
    position: relative;
    display: block;
    width: var(--non-scrollbar);
    height: 33px;
    margin: 4px auto -5px;
    background-color: white;
    z-index: 100;
}

.menu_logo {
    display: flex;
    width: var(--menubar-width);
    margin: -1px auto 0;
    justify-content: space-between;
}

.menu_logo .fixed_logo {
    display: block;
    width: 25%;
    height: auto;
    object-fit: contain;
    margin: -3px 10px 0;
}

.menu_logo .menu_inq_tel{
    display: flex;
    text-align: center;
    font-size: 0.6em;
    letter-spacing: 0;
    right: 10px;
    position: relative;
    margin: -1.5px 0 0;
    color: #EB1E79;
    align-items: center;
}

.menu_logo .menu_inq_tel .tel_larger{
    display: block;
    font-size: 1.6em;
    font-weight: bold;
    color: #EB1E79;
    text-decoration: none;
}

.rsv_tab:hover {
    background-image: url(img_hp/menu_img/menu-reserve2.png);
}

.menu_title {
    display: flex;
    width: var(--menubar-width);
    font-size: 0.8em;
    margin: -3px auto 5px;
}

.menu_title .item_selected {
    color: #EB1E79;
}

.menu_shadow {
    position: relative;
    display: block;
    width: 100%;
    height: 10px;
    margin: 0;
    z-index: 100;
    background-image: url(img_hp/menu_img/shadow1.png);
    background-size: cover;
    overflow-x: hidden;
}

.menu_shadow_bottom {
    height: 23px;
    background-color: rgba(255,255,255,0);
    background-repeat: no-repeat;
    overflow: hidden;
}

.menu_title div {
    flex: 1;
    height: auto;
    margin: 7px auto 4px;
    color: black;
    font-size: 0.75em;
    letter-spacing: 0;
    text-align: center;
    border-right: 1px solid black;
    transition: color 0.3s linear;
}

.menu_title div:first-child {
    border-left: 1px solid black;
}

.menu_title div:hover {
    cursor: pointer;
    color: #EB1E79;
    transition: color 0.3s linear;
}

.top_exp {
    display: block;
    height: 90px;
    margin: 100px auto 0;
}

.inc_tax.for_pc {
    position: fixed;
    display: block;
    width: 48px;
    top: 130px;
    left: 50%;
    transform: translateX(335px);
    z-index: 50;
}

.modal_container {
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 200;
    background-color: rgba(0,0,0,0.6);
    align-items: center;
}

.modal_inner {
    position: relative;
    width: var(--base-width);
    height: 90%;
    margin: auto;
    border-radius: 20px;
    background-color: white;
    font-size: 0.7em;
    letter-spacing: 0;
    line-height: 1.1em;
    padding: 20px;
}

.modal_close_btn {
    position: absolute;
    width: 35px;
    height: auto;
    right: 12px;
    top: 12px;
}

.modal_close_btn:hover {
    opacity: 0.8;
}

/* TOPイメージ関連 */
#top_page .top_img_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--non-scrollbar);
    height: 720px;
    background-image: url(img_hp/top_img/top-photo2.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.webp #top_page .top_img_container {
    background-image: url(img_hp/top_img/top-photo2.webp);
}

#top_page .top_img {
    width: 390px;
    height: auto;
    margin-top: 78px;
    z-index: 2;
}

#top_page .top_line {
    position: relative;
    margin: 0 auto;
    opacity: 0.4;
    top: 25px;
    z-index: 2;
}

#top_page .bottom_line {
    opacity: 0.4;
    bottom: -4px;
    z-index: 2;
}

#top_page .intro_container {
    display: flex;
    width: var(--base-width);
    margin: 14px auto 13px;
    align-items: center;
    flex-direction: column;
}

#top_page .intro_container img {
    width: 284px;
    margin: 0 auto;
}

#top_page .intro_carousel {
    display: flex;
    width: var(--base-width);
    margin: 0 auto;
    justify-content: space-evenly;
    align-items: center;
}

#top_page .carousel_button {
    width: 50px;
    height: 50px;
}

#top_page .carousel_button:hover {
    opacity: 0.8;
    cursor: pointer;
}

#top_page .carousel_area {
    position: relative;
    width: 500px;
    height: 500px;
    flex-shrink: 0;
    overflow: hidden;
    z-index: 30;
}

#top_page .carousel_area img:not(.carousel_overlay){
    position: absolute;
    top: 0;
    left: 0;
}

#top_page .carousel_area img.current {
    transform: initial;
    transition: transform 0.5s ease;
}

#top_page .carousel_area img.on_right {
    transform: translateX(100%);
    transition: transform 0.5s ease;
}

#top_page .carousel_area img.on_left {
    transform: translateX(-100%);
    transition: transform 0.5s ease;
}

#top_page .carousel_overlay {
    position: absolute;
    top: 0;
    left:0;
    height: 500px;
    height: 500px;
    z-index: 31;
}

#top_page .carousel_area img:not(.carousel_overlay) {
    width: 500px;
}

#top_page .hr_area {
    width: var(--base-width);
    margin: 50px auto 0;
}

#top_page .insta_area {
    display: flex;
    width: var(--base-width);
    margin: 52px auto 0;
    align-items: center;
    flex-direction: column;
}

#top_page .insta_area .notification {
    display: block;
    width: 285px;
    margin: 0 auto;
}

#top_page .instgram_logo{
    display: block;
    width: 390px;
    margin: 62px auto;
}

#top_page .instgram_footer{
    display: block;
    width: 390px;
}

#top_page .hr_area2 {
    width: 670px;
    margin: 53px auto 0;
}

#top_page .banned_area {
    display: table;
    width: var(--base-width);
    margin: 48px auto 0;
}

#top_page .banned_area .banned_title {
    display: block;
    width: 283px;
    margin: 0 auto;
}

#top_page .banned_table {
    width: 500px;
    margin: 8px auto;
    border-collapse: separate;
    border-spacing: 23px 41px;
}

#top_page table.banned_table tr td img {
    width: 213px;
    height: auto;
}

#top_page .other_banned {
    display: block;
    width: 571px;
    margin: 8px auto;
}

#top_page .hr_area3 {
    width: 670px;
    margin: 42px auto 0;
}

#top_page .address_title {
    display: block;
    width: 283px;
    margin: 49px auto 0;
}

#top_page .address_desc1{
    display: block;
    width: 677px;
    margin: 39px auto 0;
}

#top_page .address_detail{
    font-size: 1em;
    text-align: center;
    margin: 9px auto 0;
}

#top_page .address_desc2 {
    display: block;
    width: 668px;
    margin: 5px auto 0;
}

#top_page .map_img_container {
    width: var(--non-scrollbar);
    height: 586px;
    margin-top: 52px;
    overflow: hidden;
}

#top_page .map_img {
    position: relative;
    width: 100%;
    margin: 0;
    overflow: hidden;
    z-index: 1;
}

#top_page .footer_area {
    display:block;
    width: var(--base-width);
    margin: 0 auto;
}

#top_page .footer_area > img{
    width: var(--base-width);
}

/* 以下、レイアウトページ関連 */
#layouts div.layouts_container {
    display: block;
    width: var(--base-width);
    margin: 0 auto;
}

#layouts div.concierge {
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;
    margin: 23px auto 0;
}

#layouts div.concierge .concierge_header {
    display: block;
    width: 657px;
    margin: 26px auto 0;
}

#layouts div.concierge .concierge_main {
    display: flex;
    height: 236px;
    width: 560px;
    margin: 23px auto 0;
}

#layouts div.concierge .concierge_main .concierge_img {
    height: 106%;
    display: block;
}

#layouts div.concierge .concierge_footer {
    display: block;
    width: 512px;
    margin: 21px auto;
}
#layouts div.concierge .concierge_info {
    display: flex;
    flex-direction: column;
}

#layouts div.concierge .concierge_inq_tel {
    width: 380px;
    margin: 0 auto;
    display: block;
}

#layouts div.concierge .concierge_tel_no {
    width: 396px;
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
    margin: 4px auto 12px;
}

#layouts div.concierge .concierge_tel_no a{
    text-decoration: none;
    color: #29ABE2;
}

#layouts div.concierge .concierge_inq_line {
    width: 380px;
    margin: 0 auto;
}

#layouts div.concierge .concierge_line_img {
    width: 380px;
    margin: 0 auto;
    display: block;
}

#layouts .layout_menu {
    display: flex;
    width: 613px;
    flex-direction: column;
    margin: 60px auto 43px;
}

#layouts .layout_menu_row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 57px;
    margin-bottom: 10px;
}

#layouts .layout_menu_row .link_item{
    width: 200px;
    background-size: cover;
    background-repeat: no-repeat;
}

#layouts .layout_menu .link_item {
    transition: background-image 0.3s linear;
}

#layouts .layout_menu .link_item:hover {
    transition: background-image 0.3s linear;
}

#layouts .layout_menu_row .link_item a{
    display: block;
    text-decoration: none;
}

#layouts .layout_menu .link_item.party_layout{
    background-image: url(img_hp/layouts/layout-bt1-1.png);
}

#layouts .layout_menu .link_item.party_layout:hover{
    background-image: url(img_hp/layouts/layout-bt1-2.png);
}

#layouts .layout_menu .link_item.watching_layout{
    background-image: url(img_hp/layouts/layout-bt2-1.png);
}

#layouts .layout_menu .link_item.watching_layout:hover{
    background-image: url(img_hp/layouts/layout-bt2-2.png);
}

#layouts .layout_menu .link_item.lecture_layout{
    background-image: url(img_hp/layouts/layout-bt3-1.png);
}

#layouts .layout_menu .link_item.lecture_layout:hover{
    background-image: url(img_hp/layouts/layout-bt3-2.png);
}

#layouts .layout_menu .link_item.meeting_layout{
    background-image: url(img_hp/layouts/layout-bt4-1.png);
}

#layouts .layout_menu .link_item.meeting_layout:hover{
    background-image: url(img_hp/layouts/layout-bt4-2.png);
}

#layouts .layout_menu .link_item.wedding_layout{
    background-image: url(img_hp/layouts/layout-bt5-1.png);
}

#layouts .layout_menu .link_item.wedding_layout:hover{
    background-image: url(img_hp/layouts/layout-bt5-2.png);
}

#layouts .layout_menu .link_item.yoga_layout{
    background-image: url(img_hp/layouts/layout-bt6-1.png);
}

#layouts .layout_menu .link_item.yoga_layout:hover{
    background-image: url(img_hp/layouts/layout-bt6-2.png);
}

#layouts div.layout_base_container {
    width: 100%;
    margin: 0 auto 40px;
}

#layouts .layout_title {
    display: block;
    width: 458px;
    margin: 48px auto 30px;
}

#layouts .explain_container {
    text-align: center;
    font-size: 1em;
    letter-spacing: 0;
    line-height: 1.6em;
    padding: 7px 0;
}

#layouts .layout_container{
    width: 100%;
    display: flex;
    flex-direction: column;
    margin: 31px auto 0;
}

#layouts .layout_item_row{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 40px;
}

#layouts .layout_item_row .layout_base_container:nth-child(2){
    margin-top: 35px;
}

#layouts .layout_subtitle {
    display: block;
    width: 55%;
    margin: 0 auto;
}

#layouts .main_img_container {
    width: 720px;
    height: 405px;
}

#layouts .main_img {
    width: 100%;
    margin: auto;
}

#layouts div.sub_img_container {
    display: flex;
    width: 100%;
    justify-content: space-between;
    margin: 5px auto 0;
}

#layouts .sub_img {
    width: 19.5%;
}

#layouts .sub_img source,
#layouts .sub_img img {
    width: 100%;
}

#layouts .sub_img:hover {
    opacity: 0.8;
    cursor: pointer;
}

#layouts .layout_pdf_link {
    width: 100%;
    display: block;
    margin: 38px auto 0;
    text-align: center;
}

#layouts .layout_pdf_link a {
    font-size: 1em;
}

#layouts .footer {
    width: 713px;
    margin: 5px auto;
}

/* 以下、フリーアイテムページ分*/
#free_items .free_items_container {
    width: var(--base-width);
    margin: 0 auto;
}

#free_items .free_menu {
    display: flex;
    width: 613px;
    flex-direction: column;
    margin: 60px auto 94px;
}

#free_items .free_menu_row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 57px;
    margin-bottom: 10px;
}

#free_items .free_menu_row .link_item{
    width: 200px;
    background-size: cover;
    background-repeat: no-repeat;
}

#free_items .free_menu_row .link_item a{
    display: block;
    text-decoration: none;
}

#free_items .free_menu .link_item{
    transition: background-image 0.3s linear;
}

#free_items .free_menu .link_item:hover{
    transition: background-image 0.3s linear;
}

#free_items .free_menu .link_item.kitchen{
    background-image: url(img_hp/free_items/free-bt1-1.png);
}

#free_items .free_menu .link_item.kitchen:hover{
    background-image: url(img_hp/free_items/free-bt1-2.png);
}

#free_items .free_menu .link_item.toilet{
    background-image: url(img_hp/free_items/free-bt2-1.png);
}

#free_items .free_menu .link_item.toilet:hover{
    background-image: url(img_hp/free_items/free-bt2-2.png);
}

#free_items .free_menu .link_item.tables{
    background-image: url(img_hp/free_items/free-bt3-1.png);
}

#free_items .free_menu .link_item.tables:hover{
    background-image: url(img_hp/free_items/free-bt3-2.png);
}
#free_items .free_menu .link_item.tv_tabs{
    background-image: url(img_hp/free_items/free-bt4-1.png);
}

#free_items .free_menu .link_item.tv_tabs:hover{
    background-image: url(img_hp/free_items/free-bt4-2.png);
}

#free_items .free_menu .link_item.toys{
    background-image: url(img_hp/free_items/free-bt5-1.png);
}

#free_items .free_menu .link_item.toys:hover{
    background-image: url(img_hp/free_items/free-bt5-2.png);
}

#free_items .free_menu .link_item.others{
    background-image: url(img_hp/free_items/free-bt6-1.png);
}

#free_items .free_menu .link_item.others:hover{
    background-image: url(img_hp/free_items/free-bt6-2.png);
}

#free_items .free_items_title {
    display: block;
    width: 458px;
    margin: 48px auto 52px;
}

#free_items .free_item_row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin: 1px 0 33px;
}

#free_items .free_item_piece {
    display: block;
    width: 30%;
    margin: 0;
}

#free_items .free_item_piece img {
    display: block;
    width: 100%;
    margin: 0;
}

#free_items .free_item_piece p {
    font-size: 0.7em;
    line-height: 1.8em;
    letter-spacing: 0.22em;
}

#free_items .have_other {
    display: block;
    width: 732px;
    margin: -12px auto;
}

div#others {
    padding-top: 19px;
}

#free_items .footer {
    width: 715px;
    margin: -13px auto;
}

/* 以下、利用システムの説明 */
#systems .systems_container {
    width: var(--base-width);
    margin: 0 auto 0;
}

#systems .exp_title,
#systems .exp_title2 {
    display: block;
    width: 510px;
    margin: 66px auto 0;
}

#systems .basic_fee_exp_txt {
    text-align: center;
    margin: 31px auto 0;
    font-size: 0.9em;
    line-height: 1.95em;
    letter-spacing: 0.24em;
}

#systems .basic_fee_exp_txt span{
    color: #E21373;
}

#systems .basic_fee_exp_txt span.exp_txt_under {
    color: #E15A24;
    font-size: 0.8em;
    font-weight: 600;
    letter-spacing: 0.21em;
}

#systems .basic_fee_exp1{
    display: block;
    width: 720px;
    margin: 18px auto;
}

#systems .basic_fee_exp2{
    display: block;
    width: 720px;
    margin: 0 auto;
}

#systems .basic_fee_exp_main{
    display: block;
    width: 720px;
    margin: 31px auto 0;
}

#systems .basic_fee_exp_text{
    display: block;
    width: 700px;
    font-size: 0.7em;
    letter-spacing: 0.144em;
    line-height: 1.7em;
    margin: 54px auto 0;
    text-align: center;
}

#systems .drink_exp_txt {
    text-align: center;
    font-size: 0.88em;
    letter-spacing: 0.26em;
    line-height: 1.8em;
    margin: 64px auto 0;
}

#systems .drink_exp_txt span{
    color: #DD1E79;
}

#systems .drink_detail_img_cold {
    width: 720px;
    margin: 46px auto 0;
}

#systems .drink_detail_img_hot {
    width: 720px;
    margin: 36px auto 0;
}

#systems .drink_detail_img_exp {
    width: 720px;
    margin: 48px auto 0;
}

#systems .drink_exp_notice {
    text-align: center;
    font-size: 0.7em;
    letter-spacing: 0.144em;
    line-height: 1.7em;
    margin: 29px auto 0;
}

#systems .cleaning_exp_notice {
    text-align: center;
    font-size: 0.7em;
    letter-spacing: 0.144em;
    line-height: 1.7em;
    margin: 0 auto 30px;
}

#systems .layout_exp_notice {
    text-align: center;
    font-size: 0.7em;
    letter-spacing: 0.144em;
    line-height: 1.7em;
    margin: 0 auto 30px;
}

#systems .cancel_exp_notice {
    text-align: center;
    font-size: 0.7em;
    letter-spacing: 0.144em;
    line-height: 1.7em;
    margin: 0 auto 30px;
}

#systems .cleaning_exp {
    width: 720px;
    margin: 45px auto 0;
}

#systems .cleaning_exp_txt {
    text-align: center;
    font-size: 0.9em;
    margin: 68px auto 0;
}

#systems .last_minute_exp {
    width: 720px;
    margin: 59px auto 0;
}

#systems .layout_exp_txt{
    text-align: center;
    font-size: 0.9em;
    margin: 69px auto 0;
}

#systems .layout_exp_img {
    width: 720px;
    margin: 0 auto 0;
}

#systems .cancel_fee_table{
    width: 720px;
    margin: 59px auto 0;
}

#systems .cancel_fee_detail{
    width: 720px;
    margin: 34px auto 0;
}

#systems .insurance_title{
    width: 700px;
    margin: 0 auto;
}

#systems .cancel_fee_exp_txt {
    display: block;
    width: 561px;
    font-size: 1em;
    font-weight: 200;
    letter-spacing: 0;
    line-height: 1.6em;
    margin: 26px auto 0;
}

#systems .cancel_fee_exp_txt span{
    color: #DC1E79;
}

#systems .insulance_fee_img{
    display: block;
    width: 700px;
    margin: 10px auto 0;
}

#systems .footer {
    display: block;
    width: 715px;
    margin: 15px auto;
}

/* 以下、追加オプションの説明 */
#add_options .add_options_container {
    width: var(--base-width);
    margin: 0 auto 0;
}

#add_options .top_title{
    display: block;
    width: 561px;
    margin: 50px auto 0;
}

#add_options .options_title {
    display: block;
    width: auto;
    height: 75px;
    margin: 60px auto 0;
}

#add_options .options_desc_img {
    display: block;
    width: 700px;
    margin: 16px auto 0;
}

#add_options .top_options_container {
    display: flex;
    flex-direction: row;
    width: 100%;
    margin: 25px auto 0;
}

#add_options .top_options_item {
    display: flex;
    flex-direction: column;
    width: 50%;
}

#add_options .top_options_item img {
    display: block;
    width: 100%;
    height: auto;
}

#add_options .top_options_item img.top_options_price {
    margin-top: 17px;
}

#add_options .top_options_item p {
    display: block;
    width: 84%;
    height: 50%;
    margin: 9px auto 5px;
    font-size: 0.72em;
    letter-spacing: 0.3em;
    line-height: 1.7em;
}

#add_options .event_item_container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin: 25px auto 0;
}

#add_options .event_item_container .event_item {
    width: 25%;
    display: flex;
    flex-direction: column;
    margin: 17px 0;
}

#add_options .event_item_container .event_item img{
    display: block;
    width: 100%
}

#add_options .event_item img.event_options_price {
    margin-top: 11px;
}

#add_options .options_title_sub {
    display: block;
    width: 290px;
    margin: 53px auto 0;
}

#add_options .app_item_container {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin: 36px auto 0;
}

#add_options .app_item_row {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin-bottom: 13px;
}

#add_options .app_item_container .app_item {
    width: 25%;
    display: flex;
    flex-direction: column;
    margin: 17px 0;
}

#add_options .app_item_container .event_item img{
    display: block;
    width: 100%
}

#add_options .event_item .can_hover,
#add_options .app_item .can_hover {
    display: block;
    width: 100%;
    margin: 3px 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    text-decoration: none;
}

#add_options .event_item .can_hover:hover,
#add_options .app_item .can_hover:hover {
    background-color: rgba(255,255,255,0.2);
    background-blend-mode: overlay;
}

#add_options .event_item .projector {
    background-image:url(img_hp/paid_items/option-event2-2.png);
    background-size: contain;
}

#add_options .event_item .whiteboard {
    background-image:url(img_hp/paid_items/option-event2-2.png);
    background-size: contain;
}

#add_options .event_item .cracker {
    background-image:url(img_hp/paid_items/option-event3-2.png);
}

#add_options .app_item .ih_heater {
    background-image:url(img_hp/paid_items/option-app-cooking1-2.png);
}

#add_options .app_item .ricejar {
    background-image:url(img_hp/paid_items/option-app-cooking2-2.png);
}

#add_options .app_item .nonfrier {
    background-image:url(img_hp/paid_items/option-app-cooking3-2.png);
    background-size: contain;
}

#add_options .app_item .hotplate {
    background-image:url(img_hp/paid_items/option-app-cooking4-2.png);
    background-size: contain;
}

#add_options .app_item .bruno {
    background-image:url(img_hp/paid_items/option-app-cooking5-2.png);
}

#add_options .app_item .grillplate {
    background-image:url(img_hp/paid_items/option-app-cooking6-2.png);
}

#add_options .app_item .oden {
    background-image:url(img_hp/paid_items/option-app-app1-2.png);
}

#add_options .app_item .yakitori {
    background-image:url(img_hp/paid_items/option-app-app2-2.png);
}

#add_options .app_item .takoyaki {
    background-image:url(img_hp/paid_items/option-app-app3-2.png);
}

#add_options .app_item .seiro {
    background-image:url(img_hp/paid_items/option-app-app4-2.png);
}

#add_options .app_item .atukan {
    background-image:url(img_hp/paid_items/option-app-app5-2.png);
}

#add_options .app_item .beer {
    background-image:url(img_hp/paid_items/option-app-app6-2.png);
}

#add_options .app_item .popcorn {
    background-image:url(img_hp/paid_items/option-app-sweets.png);
    background-size: contain;
}

#add_options .app_item .shaveice {
    background-image:url(img_hp/paid_items/option-app-sweets.png);
    background-size: contain;
}

#add_options .app_item .candyfloss {
    background-image:url(img_hp/paid_items/option-app-sweets.png);
    background-size: contain;
}

#add_options .app_item .fonde {
    background-image:url(img_hp/paid_items/option-app-sweets4-2.png);
}

#add_options .app_item .castella {
    background-image:url(img_hp/paid_items/option-app-sweets5-2.png);
}

#add_options .app_item .potatobaker {
    background-image:url(img_hp/paid_items/option-app-sweets6-2.png);
}

#add_options .app_item .item_count{
    width: 100%;
    margin: 17px auto 0;
}

#add_options .app_warning {
    display: block;
    width: 720px;
    margin: 0 auto 0;
}

#add_options .footer {
    display: block;
    width: 715px;
    margin: 0 auto 0;
}

/* 以下、見積もりページの説明 */
#estimate .estimate_container{
    width: var(--base-width);
    margin: 0 auto 0;
}

#estimate .estimate_container.no_select{
    user-select: none;
}

#estimate label{
    cursor: pointer;
}

#estimate .top_title{
    display: block;
    width: 576px;
    margin: 30px auto 0;
}

#estimate .choose_title{
    display: block;
    width: 507px;
    margin: 41px auto 0;
}

#estimate .max_persons{
    display: block;
    width: 507px;
    margin: 0 auto;
}

#estimate .choose_adults{
    display: block;
    width: 387px;
    margin: 27px auto 0;
}

#estimate .choose_teens{
    display: block;
    width: 252px;
    margin: 37px auto 0;
}

#estimate .choose_infants{
    display: block;
    width: 245px;
    margin: 38px auto 0;
}

#estimate .baby_free{
    display: block;
    width: 246px;
    margin: 10px auto 0;
}

#estimate .counter_box_container {
    position: relative;
    width: 284px;
    margin: 11px auto 0;
}

#estimate .counter_box {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

#estimate .counter_down {
    width: 46px;
    height: 46px;
    background-image: url(img_hp/estimate/estimate-q1-arrow1-1.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#estimate .counter_down:hover {
    background-image: url(img_hp/estimate/estimate-q1-arrow1-2.png);
    cursor: pointer;
}

#estimate .counter_up {
    width: 46px;
    height: 46px;
    background-image: url(img_hp/estimate/estimate-q1-arrow2-1.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#estimate .counter_up:hover {
    background-image: url(img_hp/estimate/estimate-q1-arrow2-2.png);
    cursor: pointer;
}

#estimate .counter_disp {
    display: grid;
    width: 95px;
    height: 95px;
    border: 1px solid black;
    border-radius: 15px;
    font-size: 2.5em;
    font-weight: bold;
    place-items: center;
}

#estimate .counter_disp.adults {
    color: #c21c66;
}

#estimate .counter_disp.teens {
    color: #d5742e;
}

#estimate .counter_disp.infants {
    color: #3086b8;
}

#estimate .choose_time_title {
    display: block;
    width: 561px;
    margin: 50px auto 0;
}

#estimate .choose_time_container {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin: 26px auto 0;
}

#estimate .choose_time_container input {
    display: none;
}

#estimate .choose_time_row {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin-bottom: 47px;
}

#estimate .choose_time_row .time_sel_container {
    position: relative;
    display: block;
    width: 312px;
}

#estimate .choose_time_row .time_sel_container img {
    width: 100%;
}

#estimate .choose_time_row .time_sel_container .sel_frame {
    display: none;
    position: absolute;
    top:0;
    left:0;
}

#estimate .choose_time_row input:checked + label .sel_frame {
    display: block;
}

#estimate .choose_title_drink{
    display: block;
    width: 486px;
    margin: 12px auto 0;
}

#estimate .choose_drink_container {
    position: relative;
    width: 300px;
    height: 213px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin: 30px auto 0;
}

#estimate .choose_drink_container input {
    display: none;
}

#estimate .choose_drink_item {
    position: relative;
    display:block;
    width: 100%;
}

#estimate .choose_drink_container .sel_frame {
    display: none;
    position: absolute;
    top:0;
    left:0;
}

#estimate .choose_drink_container input:checked + label .sel_frame {
    display: block;
}

#estimate .choose_drink_container img {
    width: 300px;
}

#estimate .choose_cleaning_container {
    width: 313px;
    height: 535px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin: 30px auto 0;
}

#estimate .choose_cleaning_container input {
    display: none;
}

#estimate .cleaning_type_item {
    position: relative;
    display:block;
    width: 100%;
}

#estimate .cleaning_type_item .sel_frame {
    display: none;
    position: absolute;
    top:0;
    left:0;
}

#estimate .choose_cleaning_container input:checked + label .sel_frame {
    display: block;
}

#estimate .choose_cleaning_container img {
    width: 313px;
}

#estimate .choose_options_subtitle {
    display: block;
    width: 186px;
    margin: 0px auto 0;
}

#estimate .choose_options_subtitle_2 {
    display: block;
    width: 191px;
    margin: 10px auto 0;
}

#estimate .choose_options_container {
    width: 313px;
    height: 446px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin: 28px auto 30px;
}

#estimate .choose_options_container img {
    width: 313px;
}

#estimate .choose_options_container input {
    display: none;
}

#estimate .choose_options_item {
    position: relative;
    display:block;
    width: 100%;
}

#estimate .choose_options_item .sel_frame {
    display: none;
    position: absolute;
    top:0;
    left:0;
}

#estimate .choose_options_container input:checked + label .sel_frame {
    display: block;
}

#estimate .choose_equip_container {
    width: 313px;
    height: 164px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    margin: 26px auto 14px;
}

#estimate .choose_equip_container img {
    width: 239px;
}
#estimate .choose_equip_radio {
    display: flex;
    flex-direction: row;
    justify-content: left;
}

#estimate .choose_equip_radio .equip_desc{
    width: 77%;
    margin: 0 auto 0;
}

#estimate .choose_equip_radio .equip_radio{
    width:58px;
    height:58px;
}

#estimate .choose_equip_container input {
    display: none;
}

#estimate .choose_equip_item {
    position: relative;
    display:block;
}

#estimate .choose_equip_item .sel_frame {
    display: none;
    position: absolute;
    top:0;
    left:0;
}

#estimate .choose_equip_container input:checked + label .sel_frame {
    display: block;
}

#estimate .choose_add_equip_pulldown_container {
    width: 430px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 30px auto 0;
}

#estimate .choose_add_equip_pulldown {
    position: relative;
    width: 300px;
    height: 90px;
    margin: 0;
}

#estimate .choose_add_equip_pulldown img{
    display: block;
    position: absolute;
    top:0;
    left:0;
    width: 300px;
    margin: auto;
}

#estimate .estimate_title {
    display: block;
    width: 304px;
    margin: 99px auto 0;
}

#estimate .shadow_line {
    display: block;
    width: 100%;
    margin: 75px auto 0;
}

#estimate .estimate_detail{
    text-align: center;
    margin: 39px auto 0;
    line-height: 2em;
}

#estimate .estimate_detail p{
    margin-top: 0;
}

#estimate .estimate_emp {
    color: #CD2572;
}

#estimate .estimate_total_disp {
    width: 100%;
    font-size: 2em;
    color: #2F91C3;
    letter-spacing: 0.2em;
    text-align: center;
    margin: 38px auto 0;
    padding: 17px 0;
    border-top: 2px solid #428fce;
    border-bottom: 2px solid #428fce;
}

#estimate .unit_price_area{
    text-align: center;
    line-height: 2.5em;
    margin: 38px auto 0;
}

#estimate .total_price_emp{
    font-weight: bold;
}

#estimate .unit_price_emp{
    color: #2F91C3;
}

#estimate .estimate_footer_notice {
    width: 720px;
    margin: 52px auto 0;
}

#estimate .footer {
    display: block;
    width: 715px;
    margin: 0 auto 0;
}

/* 以下、予約ページの説明 */
#reserve .reserve_container{
    position: relative;
    width: var(--base-width);
    margin: 75px auto 0;
}

#reserve .rsv_top_title {
    display: block;
    width: 576px;
    margin: 126px auto 0;
}

#reserve .piet_logo {
    display: block;
    width: 396px;
    margin: 0 auto;
}

#reserve .link_box {
    width: 431px;
    display: flex;
    flex-direction: row;
    margin: 22px auto 0;
}

#reserve .link_box a {
    width: 50%;
    margin: 0 auto 0;
    font-size: 0.8em;
    letter-spacing: 0;
    text-align: center;
}

#reserve .line_qr {
    display: block;
    width: 569px;
    margin: 35px auto 0;
}

#reserve .payment_method {
    display: block;
    width: 464px;
    margin: 28px auto 0;
}

#reserve .coupon {
    display: block;
    width: 494px;
    margin: 41px auto 0;
}

#reserve .reserve_container .now_prepareing{    /* 新システム稼働までの仮表示 */
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background-color: rgba(255,255,255,0.9);
    line-height: 2em;
    font-weight: bold;
}

#reserve .for_mobile_link {
    letter-spacing: 0.4em;
    display: block;
    text-align: center;
    text-decoration: underline;
    margin-top: 25px;
}

#reserve .pietspace_logo_area{
    width: 100%;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-top: 50px;
}

#reserve .pietspace_logo_inner{
    width: var(--base-width);
    margin: 0 auto;
    padding: 22px 0;
}

#reserve .available_exp {
    display: block;
    width: 720px;
    margin: 50px auto 0;
}

#reserve .calendar {
    width: 85%;
    margin: 10px auto;
}

#reserve .calendar .calendar_header {
    display: flex;
    flex-direction: row;
    width: 94%;
    align-items: center;
    justify-content: space-evenly;
    margin: 0 auto;
    font-size: 2em;
    font-weight: bold;
}

#reserve .calendar .calendar_header .month {
    margin: 0;
}

#reserve .calendar .calendar_header .arrow_img {
    width: 45px;
    height: 45px;
}

#reserve .calendar .calendar_header .arrow_img:hover {
    opacity: 0.8;
    cursor: pointer;
}

#reserve .calendar .weekday_header {
    width: 99%;
    display: flex;
    flex-direction: row;
    font-size: 0.8em;
    font-weight: bolder;
    align-items: center;
    justify-content: space-evenly;
    margin-bottom: 5px;
}

#reserve .calendar .weekday_header p {
    display:block;
    text-align: center;
    width: 70px;
}

#reserve .calendar .weekday_header .holiday,
#reserve .calendar .calendar_body .holiday {
    color: #ea3323;
}

#reserve .calendar .calendar_body .weekday {
    color: #5f6064;
}

#reserve .calendar .calendar_body {
    display: flex;
    flex-direction: column;
}

#reserve .calendar .calendar_body .calendar_week_row {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    margin-bottom: 28px;
}

#reserve .calendar .calendar_day_item {
    display: flex;
    flex-direction: column;
    width: 11%;
}

#reserve .calendar .calendar_day_item p {
    display: block;
    text-align: center;
    font-size: 0.7em;
    letter-spacing: 0.15em;
    margin: 0;
    width: 85%;
    margin-bottom: 1px;
}

#reserve .calendar .rsv_disp{
    display: flex;
    flex-direction: row;
    width: 71px;
    height: 36px;
    cursor: default;
    user-select: none;
}

#reserve .calendar .reserved{
    opacity: 0.2;
}

#reserve .calendar .rsv_disp .am,
#reserve .calendar .rsv_disp .pm {
    width: 42%;
    position: relative;
}

#reserve .calendar .rsv_disp .circle{
    position: absolute;
    top:0;
    left:0;
    width: 26px;
    height: 26px;
    border-radius: 50%;
}

#reserve .calendar .rsv_disp .flame{
    color: rgba(0, 0, 0, 0);
    position: absolute;
    top: 0px;
    left: 0px;
    width: 21px;
    border-radius: 50%;
    border: none;
    height: 21px;
}

#reserve .calendar .rsv_disp .flame.last_time{
    border: 3px solid #DB1E79;
}

#reserve .calendar .rsv_disp .am .circle{
    background-color: #4e98cc;
}

#reserve .calendar .rsv_disp .pm .circle{
    background-color: #822780;
}


#reserve .cancel_exp {
    display: block;
    width: 736px;
    margin: 0 auto 0;

}

#reserve .title_header {
    display: block;
    width: 474px;
    margin: 75px auto 0;
}

#reserve .tel_exp1{
    display: block;
    width: 720px;
    margin: 50px auto 0;
}

#reserve .tel_exp2 {
    display: block;
    width: 700px;
    margin: 0 auto 0;
}

#reserve .tel_link {
    display: block;
    text-align: center;
    font-size: 2.1em;
    letter-spacing: 0.3em;
    font-weight: bold;
    margin: 6px auto 0;
    text-decoration: none;
    color: #29ABE2;
}

#reserve .tel_link_smaller {
    display: block;
    text-decoration: none;
    color: #29ABE2;
}

#reserve .qa_container {
    margin-top: 50px;
}

#reserve .qa_block {
    width: 700px;
    margin: 10px auto 23px;
}

#reserve .faq_q {
    display: flex;
    flex-direction: row;
    padding-bottom: 20px;
}

#reserve .faq_q .q_img {
    content: '';
    display: inline-block;
    width: 58px;
    height: 58px;
    background-image: url(img_hp/reserve/reserve-faq-q.png);
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-right: -5px;
    margin-left: 18px;
}

#reserve .faq_q p {
    font-weight: bolder;
    display: block;
    width: 85%;
    margin: auto 0;
    padding: 5px 10px;
    font-size: 0.9em;
    letter-spacing: 0.05em;
    line-height: 1.1em;
}

#reserve .faq_a {
    display: flex;
    flex-direction: row;
}

#reserve .faq_a .a_img{
    content: '';
    display: inline-block;
    width: 58px;
    height: 58px;
    background-image: url(img_hp/reserve/reserve-faq-a.png);
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-right: -5px;
    margin-left: 18px;
}

#reserve .faq_a p {
    display: block;
    width: 85%;
    margin: auto 0;
    padding: 5px 10px;
    font-size: 0.9em;
    letter-spacing: 0.05em;
    line-height: 1.5em;
}

#reserve .footer {
    display: block;
    width: 745px;
    margin: 0px auto 0;
}

/* 以下、スマホ版補正値 */
@media (max-width: 719px) {
    /* SP版では表示させる(PC版では表示させない)アイテムのクラス定義 */
    .for_sp {
        display: initial;
    }

    /* PC版では表示させる(SP版では表示させない)アイテムのクラス定義 */
    .for_pc {
        display: none;
    }

    #fixed_menu {
        position: fixed;
        top: -20px;
        left: 0px;
        padding-top: 7px;
    }

    #top_page, #layouts, #free_items, #systems, #add_options, #estimate, #reserve {
        margin-top: 5vw;
    }

    .rsv_tab {
        width: 60vw;
        right: 7px;
        left: initial;
        transform: initial;
    }

    /* スマホ専用メニュー定義 */
    .menu_logo {
        position: relative;
        width: 104vw;
        margin: 3vw auto 0;
        z-index: 100;
        background-color: white;
    }

    .menu_inner {
        height: 8vw;
    }

    .menu_shadow.menu_shadow_bottom {
        height: 5vw;
    }

    .menu_bar {
        display: flex;
        align-items: center;
        margin: 1vw auto 0;
        height: 9vw
    }

    .menu_humberger {
        position: fixed;
        width: 10vw;
        height: auto;
        right: 5vw;
        top: 9vw;
        opacity: 0.95;
    }
    
    .menu_logo .fixed_logo {
        display: block;
        width: 29vw;
        margin-left: 3vw;
    }

    .menu_logo .menu_inq_tel{
        font-size: 0.45em;
        right: 5vw;
        margin-right: 3vw;
    }

    .menu_logo .inq_hour {
        display: block;
        margin: 0;
        padding: 0;
    }
    
    .menu_logo .menu_inq_tel .tel_larger{
        display: block;
        font-size: 1.7em;
        font-weight: bold;
        color: #EB1E79;
        text-decoration: none;
    }

    .menu_shadow {
        height: 1vw;
    }

    .menu_logo .inq_hour{
        margin-top: 2px;
    }

    .fixed_tab_container {
        width: 43vw;
        margin-right: 2vw;
        left: initial;
        right: 1vw;
        transform: initial;
    }

    .rsv_tab_sp {
        width: 50vw;
        margin-right: 1vw;
        background-image: url(img_hp/menu_img/mb-menu1.png);
        background-size: contain;
        background-repeat: no-repeat;
    }
    
    .rsv_tab_sp.menu_open {
        background-image: url(img_hp/menu_img/mb-menu2.png);
    }

    .menu_for_sp {
        position: fixed;
        width: 50vw;
        height: 100vh;
        top:0;
        right: 0;
        transform: translateX(50vw);
        background-color: #65A9A1F3;
        transition: transform 0.5s ease;
        z-index: 50;
    }

    .menu_for_sp.is_visible {
        transform: translateX(0);
        transition: transform 0.5s ease;
        visibility: visible;
    }

    .menu_for_sp .sp_menu_close {
        position: absolute;
        display: block;
        background-image: url(img_hp/menu_img/mb_menu_close.png);
        width: 9vw;
        height: 9vw;
        background-size: contain;
        right: 5vw;
        top: 12vw;
        opacity: 0.95;
    }

    .menu_for_sp .sp_menu_logo {
        position: relative;
        display: block;
        width: 63%;
        height: auto;
        margin: 24vw auto 4vw;
    }

    .menu_for_sp a.sp_menu_item {
        display: block;
        color: white;
        border-top: 1px solid white;
        text-decoration: none;
        text-align: center;
        font-size: 0.7em;
        letter-spacing: 0.1em;
        font-weight: bold;
        padding-top: 4vw;
        padding-bottom: 4vw;
    }

    .menu_for_sp a.sp_menu_item:nth-child(2n) {
        background-color: #65A9A1;
    }

    .menu_for_sp a.item_selected {
        text-decoration: underline;
    }

    .menu_shadow {
    }

    .top_exp {
        height: 11vw;
        margin: 9vw auto 0;
    }

    .inc_tax.for_sp {
        position: fixed;
        width: 10vw;
        height: auto;
        right: 5vw;
        top: 20vw;
        opacity: 0.95;
    }

    .goto_top.for_sp {
        position: fixed;
        display: block;
        width: 10vw;
        height: auto;
        right: 5vw;
        bottom: 5vw;
        opacity: 0.95;
    }

    .modal_inner {
        width: 80%;
        height: 85%;
        font-size: 0.47em;
        letter-spacing: 0;
        line-height: 1.1em;
        padding: 5vw;
        margin: auto;
    }

    .modal_close_btn {
        position: absolute;
        width: 6vw;
        height: auto;
        right: 3vw;
        top: 3vw;
    }

    /* 以下、TOPイメージ関連 */
    #top_page .top_img_container {
        width: 100vw;
        height: 80vw;
        background-image: url(img_hp/top_img/top-photo2_sp.jpg);
    }

    .webp #top_page .top_img_container {
        background-image: url(img_hp/top_img/top-photo2_sp.webp);
    }

    #top_page .top_img {
        width: 43vw;
        margin-top: 9vw;
    }

    #top_page .intro_carousel {
        width: 100vw;
        margin: 0;
    }

    #top_page .intro_container {
        width: 100vw;
        margin: 10.5vw 0 0;
        align-items: initial;
    }

    #top_page .intro_container img {
        width: 44vw;
        margin: 0 auto;
    }

    #top_page .intro_container img:nth-child(2) {
        margin-top: 1vw;
    }

    #top_page .carousel_button.prev,
    #top_page .insta_carousel_area.prev
     {
        position: relative;
        width: 7vw;
        height: 7vw;
    }

    #top_page .carousel_button.prev{
        left: 0;
    }

    #top_page .insta_carousel_area .carousel_button.prev {
        left: -1vw;
    }

    #top_page .carousel_button.next,
    #top_page .insta_carousel_area.next
    {
        position: relative;
        width: 7vw;
        height: 7vw;
    }

    #top_page .carousel_button.next {
        left: -1vw;
    }

    #top_page .insta_carousel_area .carousel_button.next {
        left: 1vw;
    }

    #top_page .carousel_area {
        height: 67vw;
        width: 67vw;
        margin: 0;
    }

    #top_page .carousel_area img:not(.carousel_overlay) {
        width: 100%;
    }

    #top_page .carousel_overlay {
        height: 100%;
    }

    #top_page .hr_area {
        width: 95vw;
        margin: 7vw auto 0;
    }

    #top_page .insta_area {
        width: 100vw;
        margin: 0;
    }

    #top_page .insta_area .notification {
        width: 42vw;
        margin: 4vw 0;
    }

    #top_page .instgram_logo{
        width: 80vw;
        margin: 4vw 0;
    }
    
    #top_page .instgram_footer{
        width: 80vw;
        margin: 3vw 0;
    }

    #top_page .hr_area2 {
        width: 95vw;
        margin: 6vw auto 0;
    }

    #top_page .banned_area {
        width: 100vw;
        margin: 0;
    }

    #top_page .banned_area .banned_title {
        width: 41vw;
        margin: 3vw auto;
    }

    #top_page .banned_table {
        width: 100vw;
        margin: 6vw 0 0;
        border-collapse: separate;
        border-spacing: 1vw 3vw;
    }
    
    #top_page .banned_table tr td:first-child{
        padding: 0;
    }

    #top_page .banned_table tr td:last-child{
        padding: 0;
    }

    #top_page table.banned_table tr td {
        padding: 0;
    }

    #top_page table.banned_table tr td img {
        width: 32vw;
        height: auto;
    }

    #top_page .other_banned {
        width: 80vw;
        margin: 5vw auto 0;
    }

    #top_page .hr_area3 {
        width: 95vw;
        margin: 6vw auto 0;
    }

    #top_page .address_title {
        width: 44vw;
        margin: 7vw auto 0;
    }

    #top_page .address_desc1 {
        width: 98vw;
        margin: 5vw auto 0;
    }

    #top_page .address_detail {
        font-size: 0.45em;
        font-weight: bolder;
        width: 100vw;
        margin: 2vw 0 0;
    }

    #top_page .address_desc2 {
        width: 100vw;
        margin: 1vw 0;
    }

    #top_page .map_img_container {
        width: 100vw;
        height: 83vw;
        margin: 6vw 0 0;
    }

    #top_page .footer_area {
        position: relative;
        width: 100vw;
        margin: -2vw 0 0;
    }

    #top_page .footer_area > img {
        width: 100vw;
    }

    /* 以下、レイアウトページ対応分 */
    #layouts div.concierge {
        height: 65vw;
        margin: 0 auto 0;
    }
    
    #layouts div.concierge .concierge_header {
        width: 93vw;
        margin: 4vw auto 0;
    }
    
    #layouts div.concierge .concierge_main {
        height: 36vw;
        width: 85vw;
        margin: 0 auto;
    }
    
    #layouts div.concierge .concierge_main .concierge_img {
        height: 113%;
    }
    
    #layouts div.concierge .concierge_footer {
        width: 72vw;
        margin: 4vw auto;
    }
    
    #layouts div.concierge .concierge_inq_tel {
        width: 58vw;
        margin-top: 2vw;
    }
    
    #layouts div.concierge .concierge_tel_no {
        width: 58vw;
        font-size: 1em;
        font-weight: bold;
        letter-spacing: 0;
        margin: 1vw auto 1vw;
    }
    
    #layouts div.concierge .concierge_inq_line {
        width: 58vw;
    }
    
    #layouts div.concierge .concierge_line_img {
        width: 58vw;
    }
    
    #layouts .layout_menu {
        width: 85vw;
        margin: 6vw auto 6vw;
    }
    
    #layouts .layout_menu_row {
        height: 8vw;
        margin-bottom: 1vw;
    }
    
    #layouts .layout_menu_row .link_item{
        width: 30vw;
    }
    
    #layouts .layout_title {
        width: 67vw;
        margin: 9vw auto 5vw;
    }
    
    #layouts .main_img_container {
        width: 100%;
        height: 57vw;
    }

    #layouts div.sub_img_container {
        margin: 0 auto;
    }

    #layouts .explain_container {
        font-size: 0.54em;
        letter-spacing: 0em;
        line-height: 1.6em;
        padding: 0;
    }
    
    #layouts .layout_container{
        margin: 5vw auto 0;
    }
    
    #layouts .layout_item_row{
        margin-bottom: 4vw;
    }

    #layouts .layout_item_row .layout_base_container:nth-child(2){
        margin-top: 4vw;
    }
    
    #layouts .layout_pdf_link {
        margin: 5vw auto 0;
    }
    
    #layouts .layout_pdf_link a {
        font-size: 0.7em;
        letter-spacing: 0.08em;
    }
    
    #layouts .footer {
        width: 100vw;
        margin: 1vw auto;
    }
    
       /* スマホの場合のhover無効化 */
    #layouts .layout_menu .link_item.party_layout:hover{
        background-image: url(img_hp/layouts/layout-bt1-1.png);
        transition: none;
    }
    
    #layouts .layout_menu .link_item.watching_layout:hover{
        background-image: url(img_hp/layouts/layout-bt2-1.png);
        transition: none;
    }
    
    #layouts .layout_menu .link_item.lecture_layout:hover{
        background-image: url(img_hp/layouts/layout-bt3-1.png);
        transition: none;
    }
    
    #layouts .layout_menu .link_item.meeting_layout:hover{
        background-image: url(img_hp/layouts/layout-bt4-1.png);
        transition: none;
    }
    
    #layouts .layout_menu .link_item.wedding_layout:hover{
        background-image: url(img_hp/layouts/layout-bt5-1.png);
        transition: none;
    }
    
    #layouts .layout_menu .link_item.yoga_layout:hover{
        background-image: url(img_hp/layouts/layout-bt6-1.png);
        transition: none;
    }
    
    /* 以下、フリーアイテムページ分 */
    #free_items .free_items_container {
        width: 100vw;
    }

    #free_items .free_menu {
        width: 85vw;
        margin: 6vw auto 0;
    }

    #free_items .free_menu_row {
        height: 8vw;
        margin-bottom: 1vw;
    }

    #free_items .link_item {
        width: 30vw;
    }

    #free_items .free_items_title {
        width: 68vw;
        margin: 13vw auto 6vw;
    }

    #free_items .free_items_title.next{
        margin: 2vw auto 6vw;
    }

    #free_items .free_items_title.other{
        margin: 7vw auto 6vw;
    }

    #free_items .free_item_box {
        margin: 0vw auto 0;
        padding: 1vw;
    }

    #free_items .free_item_row {
        margin-bottom: 8vw;
        justify-content: space-evenly;
    }

    #free_items .free_item_piece img {
        margin: 0;
    }
    
    #free_items .free_item_piece p {
        font-size: 0.45em;
        letter-spacing: 0.05em;
        line-height: 1.4em;
    }
    
    #free_items .have_other {
        width: 100vw;
        margin: 0 auto 0;
    }

    div#others {
        padding-top: 0;
    }

    #free_items .footer {
        width: 98vw;
        margin: -9vw auto;
    }    

        /* スマホの場合はhoverを無効化する */
    #free_items .free_menu .link_item.kitchen:hover{
        background-image: url(img_hp/free_items/free-bt1-1.png);
        transition: none;
    }
    
    #free_items .free_menu .link_item.toilet:hover{
        background-image: url(img_hp/free_items/free-bt2-1.png);
        transition: none;
    }
    
    #free_items .free_menu .link_item.tables:hover{
        background-image: url(img_hp/free_items/free-bt3-1.png);
        transition: none;
    }

    #free_items .free_menu .link_item.tv_tabs:hover{
        background-image: url(img_hp/free_items/free-bt4-1.png);
        transition: none;
    }
    
    #free_items .free_menu .link_item.toys:hover{
        background-image: url(img_hp/free_items/free-bt5-1.png);
        transition: none;
    }
    
    #free_items .free_menu .link_item.others:hover{
        background-image: url(img_hp/free_items/free-bt6-1.png);
        transition: none;
    }

    /* 以下、システム・料金関連 */
    #systems .systems_container {
        width: var(--base-width);
        margin: 1vw auto 0;
    }
    
    #systems .exp_title {
        width: 80vw;
        margin: 10vw auto 0;
    }

    #systems .exp_title2 {
        width: 80vw;
        margin: 15vw auto 0;
    }

    #systems .basic_fee_exp_txt {
        margin: 3vw auto 0;
        font-size: 0.48em;
        line-height: 1.8em;
        letter-spacing: 0.24em;
    }
    
    #systems .basic_fee_exp_txt span.exp_txt_under {
        font-size: 0.8em;
        letter-spacing: 0.1em;
    }
    
    #systems .basic_fee_exp1{
        width: 100vw;
        margin: 4vw auto 0;
    }
    
    #systems .basic_fee_exp2{
        width: 100vw;
        margin: 4vw auto 0;
    }
    
    #systems .basic_fee_exp_main{
        width: 100vw;
        margin: 3vw auto 0;
    }
    
    #systems .basic_fee_exp_text{
        width: 100vw;
        font-size: 0.38em;
        letter-spacing: 0.1em;
        line-height: 1.6em;
        margin: 2vw auto 0;
    }
    
    #systems .drink_exp_txt {
        font-size: 0.45em;
        letter-spacing: 0.26em;
        line-height: 1.8em;
        margin: 8vw auto 0;
    }
        
    #systems .drink_detail_img_cold {
        width: 100vw;
        margin: 5vw auto 0;
    }
    
    #systems .drink_detail_img_hot {
        width: 100vw;
        margin: 5vw auto 0;
    }
    
    #systems .drink_detail_img_exp {
        width: 100vw;
        margin: 7vw auto 0;
    }
    
    #systems .drink_exp_notice {
        font-size: 0.4em;
        letter-spacing: 0.1em;
        line-height: 1.5em;
        margin: 4vw auto 0;
    }

    #systems .cleaning_exp_notice {
        font-size: 0.4em;
        letter-spacing: 0.1em;
        line-height: 1.5em;
        margin: 4vw auto 0;
    }
    
    #systems .layout_exp_notice {
        font-size: 0.4em;
        letter-spacing: 0.1em;
        line-height: 1.5em;
        margin: 4vw auto 0;
    }
    
    #systems .cancel_exp_notice {
        font-size: 0.4em;
        letter-spacing: 0.1em;
        line-height: 1.5em;
        margin: 4vw auto 0;
    }
    
    #systems .cleaning_exp {
        width: 100vw;
        margin: 6vw auto 0;
    }
    
    #systems .cleaning_exp_txt {
        font-size: 0.5em;
        letter-spacing: 0.8;
        margin: 8vw auto 0;
    }
    
    #systems .last_minute_exp {
        width: 100vw;
        font-size: 0.55em;
        margin: 9vw auto 0;
        letter-spacing: 0.2;
    }
    
    #systems .layout_exp_txt{
        font-size: 0.5em;
        letter-spacing: 0.8;
        margin: 9vw auto 0;
    }
    
    #systems .layout_exp_img {
        width: 100vw;
        margin: 0vw auto 0;
    }
    
    #systems .cancel_fee_table{
        width: 100vw;
        margin: 7vw auto 0;
    }
    
    #systems .cancel_fee_detail{
        width: 100vw;
        margin: 6vw auto 0;
    }
    
    #systems .insurance_title{
        width: 100vw;
        margin: 5vw auto;
    }
    
    #systems .cancel_fee_exp_txt {
        width: 86vw;
        font-size: 0.52em;
        font-weight: 200;
        letter-spacing: 0.15em;
        line-height: 1.75em;
        margin: 0vw auto 0;
    }
    
    #systems .insulance_fee_img{
        width: 90vw;
        margin: 1vw auto 0;
    }
    
    #systems .footer {
        display: block;
        width: 100vw;
        margin: 2vw auto;
    }

    /* 以下、追加オプションの説明 */
    #add_options .add_options_container {
        width: var(--base-width);
        margin: 0 auto 0;
    }

    #add_options .top_title{
        width: 75vw;
        margin: 5vw auto 0;
    }

    #add_options .options_title {
        height: 10vw;
        width: auto;
        margin: 9vw auto 0;
    }

    #add_options .options_desc_img {
        width: 99vw;
        margin: 3vw auto 0;
    }

    #add_options .top_options_container {
        margin: 4vw auto 0;
    }

    #add_options .top_options_item img.top_options_price {
        margin-top: 2vw;
    }

    #add_options .top_options_item p {
        margin: 0 auto;
        font-size: 0.4em;
        letter-spacing: 0.3em;
        line-height: 1.7em;
    }

    #add_options .event_item_container {
        margin: 3vw auto 0;
    }

    #add_options .event_item_container .event_item {
        margin: 3vw 0;
    }

    #add_options .event_item img.event_options_price {
        margin-top: -1vw;
    }

    #add_options .options_title_sub {
        width: 40vw;
        margin: 8vw auto 0;
    }

    #add_options .app_item_container {
        margin: 5vw auto 0;
    }

    #add_options .app_item_row {
        margin-bottom: 3vw;
    }

    #add_options .app_item_container .app_item {
        margin: 3vw 0;
    }

    #add_options .app_item .item_count{
        font-size: 0.4em;
        letter-spacing: 0.1em;
        margin: 2vw auto 0;
    }
    
    #add_options .event_item .can_hover,
    #add_options .app_item .can_hover {
        margin: 1vw 0 0;
        background-repeat: no-repeat;
        text-decoration: none;
        background-size: contain;
    }

    #add_options .app_warning {
        width: 98vw;
        margin: 0 auto 0;
    }

    #add_options .footer {
        width: 100vw;
        margin: 0 auto 0;
    }

    /* 以下、見積もりページの説明 */
    #estimate .estimate_container{
        width: var(--base-width);
        margin: 2vw auto 0;
    }

    #estimate .top_title{
        width: 80vw;
        margin: 5vw auto 0;
    }

    #estimate .choose_title{
        width: 69vw;
        margin: 6vw auto 0;
    }

    #estimate .max_persons{
        width: 69vw;
        margin: 0 auto;
    }

    #estimate .choose_adults{
        width: 50vw;
        margin: 5vw auto 0;
    }

    #estimate .choose_teens{
        width: 30vw;
        margin: 6vw auto 0;
    }

    #estimate .choose_infants{
        width: 32vw;
        margin: 6vw auto 0;
    }

    #estimate .baby_free{
        width: 33vw;
        margin: 1vw auto 0;
    }

    #estimate .counter_box_container {
        width: 38vw;
        margin: 1vw auto 0;
    }

    #estimate .counter_down {
        width: 6vw;
        height: 6vw;
    }

    #estimate .counter_up {
        width: 6vw;
        height: 6vw;
    }

    #estimate .counter_disp {
        width: 13vw;
        height: 13vw;
        border: 1px solid black;
        border-radius: 3vw;
        font-size: 1em;
    }

    /* スマホの場合のhover無効化 */
    #estimate .counter_down:hover {
        background-image: url(img_hp/estimate/estimate-q1-arrow1-1.png);
    }

    #estimate .counter_up:hover {
        background-image: url(img_hp/estimate/estimate-q1-arrow2-1.png);
    }
    
    #estimate .choose_time_title {
        width: 85vw;
        margin: 8vw auto 0;
    }

    #estimate .choose_time_container {
        margin: 4vw auto 0;
    }

    #estimate .choose_time_row {
        margin-bottom: 6vw;
    }

    #estimate .choose_time_row img {
        width: 43vw;
    }


    #estimate .choose_time_row .time_sel_container {
        width: 43vw
    }

    #estimate .choose_title_drink{
        width: 68vw;
        margin: 3vw auto 0;
    }

    #estimate .choose_drink_container {
        height: 32vw;
        margin: 3vw auto 0;
    }

    #estimate .choose_drink_container img {
        width: 45vw;
    }

    #estimate .choose_drink_item {
        width: initial;
    }

    #estimate .choose_cleaning_container {
        height: 70vw;
        margin: 3vw auto 0;
    }

    #estimate .choose_cleaning_container img {
        width: 44vw;
    }

    #estimate .cleaning_type_item {
        width: initial;
    }

    #estimate .choose_options_subtitle {
        display: block;
        width: 25vw;
        margin: 0 auto 0;
    }

    #estimate .choose_options_subtitle_2 {
        display: block;
        width: 25vw;
        margin: 5vw auto 0;
    }

    #estimate .choose_options_container {
        height: 66vw;
        margin: 4vw auto 0;
    }

    #estimate .choose_options_item {
        width: initial;
    }

    #estimate .choose_options_container img {
        width: 45vw;
    }

    #estimate .choose_equip_container {
        height: 25vw;
        margin: 3vw auto 3vw;
    }

    #estimate .choose_equip_container img {
        width: 28vw;
    }
    #estimate .choose_equip_radio .equip_desc{
        width: 39vw;
        margin: 0 auto 0;
    }
    
    #estimate .choose_equip_radio .equip_radio{
        width: 8vw;
        height: 8vw;
        margin-top: 1vw;
        margin-left: -3vw;
    }
    
    #estimate .choose_add_equip_pulldown_container {
        width: 65vw;
        margin: 5vw auto 12vw;
    }
    
    #estimate .choose_add_equip_pulldown {
        width: 44vw;
        height: 14vw;
        margin: 0 auto;
    }
    
    #estimate .choose_add_equip_pulldown img{
        width: 44vw;
    }
    
    #estimate .shadow_line {
        margin: 4vw auto 0;
    }

    #estimate .estimate_title {
        width: 40vw;
        margin: 8vw auto 0;
    }

    #estimate .estimate_detail{
        margin: 5vw auto 0;
        line-height: 2.35em;
        font-size: 0.7em;
        letter-spacing: 0em;
    }

    #estimate .estimate_total_disp {
        font-size: 1em;
        letter-spacing: 0.2em;
        font-weight: bold;
        margin: 5vw auto 0;
        padding: 2vw 0;
    }

    #estimate .unit_price_area{
        line-height: 2em;
        margin: 6vw auto 0;
        font-size: 0.8em;
        letter-spacing: 0.2em;
    }

    #estimate .unit_price_area .with_children{
        margin-top: 6vw;
    }

    #estimate .estimate_footer_notice {
        width: 100vw;
        margin: 4vw auto 0;
    }

    #estimate .footer {
        display: block;
        width: 95vw;
        margin: 0 auto 0;
    }

    /* 以下、予約ページの説明 */
    #reserve .reserve_container{
        width: var(--base-width);
        margin: 5vw auto 0;
    }

    #reserve .piet_logo {
        width: 58vw;
        margin: 0 auto;
    }

    #reserve .link_box {
        width: 65vw;
        margin: 3vw auto 0;
        font-size: 0.7em;
        letter-spacing: 0.18em;
    }

    #reserve .link_box a {
        margin: 0 auto 0;
        font-size: 0.65em;
        letter-spacing: 0;
        font-weight: bolder;
    }

    #reserve .line_qr {
        width: 80vw;
        margin: 5vw auto 0;
    }

    #reserve .payment_method {
        display: block;
        width: 68vw;
        margin: 13px auto 0;
    }

    #reserve .coupon {
        display: block;
        width: 73vw;
        margin: 7vw auto 0;
    }

    #reserve .reserve_container .now_prepareing{    /* 新システム稼働までの仮表示 */
        padding-top: 8vw;
        font-size: 0.5em;
        letter-spacing: 0.3em;
    }

    #reserve .for_mobile_link {
        font-size: 0.6em;
        letter-spacing: 0.2em;
        margin-top: 8vw;
    }

    #reserve .available_exp {
        width: 100vw;
        margin: 4vw auto 0;
    }

    #reserve .calendar {
        width: var(--base-width);
        margin: 3vw auto;
    }

    #reserve .calendar .calendar_header {
        width: 94%;
        font-size: 1em;
    }
    
    #reserve .calendar .calendar_header .arrow_img {
        width: 7vw;
        height: 7vw;
    }
    
    #reserve .calendar .weekday_header {
        width: 100%;
        font-size: 0.55em;
        margin-bottom: 0;
    }
    
    #reserve .calendar .weekday_header p {
        width: 9vw;
    }
    
    #reserve .calendar .calendar_body .calendar_week_row {
        margin-bottom: 0.5vw;
    }
    
    #reserve .calendar .calendar_day_item {
        width: 11%;
    }
    
    #reserve .calendar .calendar_day_item p {
        font-size: 0.5em;
        letter-spacing: 0.15em;
        width: 98%;
        margin-bottom: 0.5vw;
    }
    
    #reserve .calendar .rsv_disp{
        width: 19vw;
        height: 8.5vw;
    }
    
    #reserve .calendar .rsv_disp .am,
    #reserve .calendar .rsv_disp .pm {
        width: 29%;
    }
    
    #reserve .calendar .rsv_disp .circle{
        width: 4.5vw;
        height: 4.5vw;
    }
    
    #reserve .calendar .rsv_disp .flame{
        width: 3.5vw;
        height: 3.5vw;
    }
    
    #reserve .calendar .rsv_disp .flame.last_time{
        border: 3px solid #DB1E79;
    }

    #reserve .cancel_exp {
        width: 100vw;
        margin: 0 auto 0;

    }

    #reserve .title_header {
        width: 70vw;
        margin: 7vw auto 0;
    }

    #reserve .tel_exp1{
        width: 100vw;
        margin: 8vw auto 0;
    }

    #reserve .tel_exp2 {
        width: 98vw;
        margin: 0 auto 12vw;
    }

    #reserve .tel_link {
        font-size: 1.05em;
        letter-spacing: 0.3em;
        margin: 1vw auto 0;
    }

    #reserve .qa_container {
        margin-top: 6vw;
    }

    #reserve .qa_block {
        width: 100vw;
        margin: 3vw auto 5vw;
    }

    #reserve .faq_q {
        padding-bottom: 3vw;
    }

    #reserve .faq_q .q_img {
        width: 7vw;
        height: 8vw;
        margin-right: -2vw;
        margin-left: 4vw;
    }

    #reserve .faq_q p {
        margin: auto 0;
        padding: 1vw 3vw;
        font-size: 0.46em;
        letter-spacing: 0.1em;
        line-height: 1.1em;
    }

    #reserve .faq_a .a_img{
        width: 7vw;
        height: 8vw;
        margin-right: -2vw;
        margin-left: 4vw;
    }

    #reserve .faq_a p {
        margin: auto 0;
        padding: 2vw 3vw;
        font-size: 0.5em;
        letter-spacing: 0.05em;
        line-height: 1.3em;
    }

    #reserve .footer {
        width: 100vw;
        margin: -2px auto 0;
    }
}
