@charset 'UTF-8';
/*
Theme Name: M-kanayama
Author: Alicenet
Author URI: https://●●●.com
Description: サンプルのテーマ
Text Domain: M-kanayama
Version: 1.0.0
License: GNU General Public License version 3
License URI: license.txt
*/

html
{
    font-family: sans-serif;
    line-height: 1.8em;
    -ms-text-size-adjust: 100%;
}

body{
    margin: 0;
}

a{
    text-decoration: none;
}

img{
    vertical-align: top;
}

h2{
    width: 100%;
    margin: 0;
    color: #682f25;
    font-family: bickham-script-pro-3, sans-serif;
    font-style: normal;
    font-size: 48px;
    font-weight: 400;
    border-bottom: solid 2px #682f25;
}

.container{
    background-image: url('http://mrsj-meieki.com/wp-content/uploads/2024/04/bgmeieki.png');
}

.middle_container{
    max-width: 1180px;
    margin: 0 auto;
}

.flex{
    display: flex;
    flex-wrap: wrap;
}

.flex_between{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.flex_center{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.flex_end{
    align-items: flex-end;
}

.sp{
    display: none;
}

/******** header ********/

header{
    margin: 0 auto;
    padding: 12px 36px;
    background-color: #682f25;
    border-bottom: solid 8px #C49C43;
}

.header_content{
    height: 100px;
}

.header_logo{
    width: 33%;
    padding-bottom: 16px;
}

.header_logo img{
    width: 80%;
}

.header_menu{
    width: 66%;
}

.header_menu ul{
    padding: 0;
    text-align: right;
}

.header_menu ul li{
    display: inline-block;
    padding: 0 6px;
    color: #fff;
}

.header_menu ul li a{
    color: #fff;
}

/******** main ********/

main{
    background-color: #fff;
}

.top_heading{
    width: 100%;
    margin: 0 auto;
    position: relative;
}

.top_heading img{ 
    width: 100%;
}

.shop_image_content{
}

.shop_image{
    width: 33.333333%;
}

.shop_image img{
    width: 100%;
}

/******** event ********/

#event_section{
    padding: 256px 64px 0 64px;
}

.event_infomation{
    width: 38%;
}

.street_view{
    width: 58%;
}

.street_view iframe{
    width: 100%;
}

.cast_banner{
    width: 100%;
    margin-top: 64px;
}

.cast_banner img{
    width: 100%;
}

/******** system ********/

#system_section{
    padding: 128px 64px;
}

.system_table{
    width: 100%;
    margin: 32px 0;
    text-align: center;
}

.system_table_heading{
    width: 100%;
    margin-top: 32px;
    background-color: #682f25;
    color: #fff;
    text-align: center;
}

.set_heading{
    width: 24%;
    background-color: #EFEDEE;
}

.time,
.price{
    width: 38%;
    padding: 16px 0;
    border-bottom: solid 1px #EFEDEE;
}

.nomination_fee{
    margin: 32px 0;
    text-align: center;
}

.drinks{
    padding: 32px;
    background-color: #EFEDEE;
    text-align: center;
}

.service{
    margin: 32px 0;
    text-align: center;
}

/******** access ********/

#access_section{
    padding: 0 64px;
}

.access_map{
    margin-top: 32px;
}

.access_text{
    margin-top: 32px;
    text-align: center;
}

/******** recruit ********/

#recruit_section{
    padding: 128px 64px;
}

.recruit_heading{
    margin-top: 64px;
    color: #682f25;
    text-align: center;
}

.recruit_text{
    text-align: center;
}

.recruit_table{
    width: 100%;
    margin: 64px 0;
}

.recruit_table_heading{
    width: 20%;
    padding: 16px 0;
    color: #fff;
    background-color: #682f25;
    text-align: center;
}

.recruit_table_text{
    width: 80%;
    padding: 16px 0 16px 32px;
    background-color: #EFEDEE;
    line-height: 1.7em;
}

.experience_banner{
    width: 100%;
}

.experience_banner img{
    width: 100%;
}

.recruit_rink{
    width: 66.666666%;
    margin: 16px auto 0 auto;
    padding: 16px 0;
    background-color: #682f25;
    border-radius: 32px;
    font-size: 20px;
    text-align: center;
    color: #fff;
}

.worry_content{
    margin: 64px 0;
    padding: 32px;
    background-color: #FFF9F4;
}

.worry_content_left{
    width: 66%;
}

.worry_content_right{
    width: 33%;
}

.worry_content_left_heading{
    color: #FF79CC;
    font-size: 22px;
    font-weight: 600;
}

.worry_content_left_text{
    margin-top: 32px;
}

.worry_content_right img{
    width: 80%;
}

.recruit_rink2{
    width: 100%;
    margin: 16px auto 0 auto;
    padding: 20px 0;
    background-color: #682f25;
    border-radius: 36px;
    font-size: 20px;
    text-align: center;
    color: #fff;
    align-items: flex-end;
}

.recruit_rink2_left img{
    width: 50%;
}

.recruit_address{
    margin-top: 16px;
    text-align: center;
}

/******** rink ********/

#rink_section{
    padding: 0 64px 64px 64px;
}

.rink_content{
    margin-top: 64px;
}

.rink_content_left,
.rink_content_right{
    width: 49%;
}

.rink_content_left img,
.rink_content_right img{
    width: 100%;
}

.shop_rink_content{
    margin: 64px -64px;
    padding: 64px;
    background-color: #EFEDEE;
}

.shop_rink_content_heading{
    margin-bottom: 16px;
    color: #682f25;
    font-size: 20px;
    text-align: center;
}

.shop_rink_content_left,
.shop_rink_content_right{
    width: 49%;
    margin-bottom: 16px;
}

.shop_rink_content_left img,
.shop_rink_content_right img{
    width: 100%;
}

.footer_shop_image{
    width: 25%;
}

.footer_shop_image img{
    width: 100%;
}

/******** footer ********/

footer{
    background-color: #682f25;
    border-top: solid 8px #C49C43;
}

.footer_content{
    max-width: 1180px;
    margin: 0 auto;
    padding: 32px 0;
    color: #fff;
    align-items: center;
}

.footer_content_left{
    width: 15%;
    text-align: center;
}

.footer_content_right{
    width: 35%;
}

.footer_content_right a{
    color: #fff;
}

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

    .pc{
        display: none;
    }

    .sp{
        display: block;
    }

/******** header ********/

    header{
        margin: 0 auto;
        padding: 12px 16px 0 12px;
    }

    .header_content{
        height: 100px;
        display: block;
    }

    .header_logo{
        width: 100%;
        padding-bottom: 12px;
        text-align: center;
    }

    .header_logo img{
        width: 50%;
    }

    .header_menu{
        width: 100%;
        font-size: 14px;
    }

    .header_menu ul{
        margin: 0;
        text-align: center
    }

    .header_menu ul li{
        display: inline-block;
        padding: 0 1px;
        color: #fff;
    }

    .header_menu ul li a{
        color: #fff;
    }

    /******** main ********/

    main{
        font-size: 14px;
    }

    .shop_image_content{
        position: static;
    }

    /******** event ********/

    #event_section{
        padding: 64px 16px 0 16px;
    }

    .event_infomation{
        width: 100%;
        margin: 32px 0;
    }

    .street_view{
        width: 100%;
    }

    /******** system ********/

    #system_section{
        padding: 64px 16px;
    }

    /******** access ********/

    #access_section{
        padding: 0 16px;
    }

    .access_map{
        margin-top: 32px;
    }

    .access_text{
        margin-top: 32px;
        text-align: center;
    }

    /******** recruit ********/

    #recruit_section{
        padding: 64px 16px;
    }

    .recruit_rink{
        padding: 14px 0;
        font-size: 18px;
    }

    .worry_content{
        margin: 64px 0;
        padding: 32px;
        background-color: #FFF9F4;
        text-align: center;
    }

    .worry_content_left{
        width: 100%;
    }

    .worry_content_right{
        width: 100%;
        margin-bottom: 16px;
    }

    .worry_content_left_heading{
        font-size: 18px;
    }

    .worry_content_left_text{
        margin-top: 16px;
    }

    .worry_content_right img{
        width: 80%;
    }

    .recruit_rink2{
        width: 100%;
        margin: 16px auto 0 auto;
        padding: 16px 0;
        background-color: #682f25;
        border-radius: 36px;
        font-size: 18px;
    }

    /******** rink ********/

    #rink_section{
        padding: 0 16px 32px 16px;
    }

    .rink_content_left,
    .rink_content_right{
        width: 100%;
        margin-bottom: 16px;
    }

    .shop_rink_content{
        margin: 32px -16px;
        padding: 32px 16px;
    }

    .shop_rink_content_heading{
        font-size: 18px;
    }

    .shop_rink_content_left,
    .shop_rink_content_right{
        width: 100%;
        margin-bottom: 16px;
    }

    /******** footer ********/

    .footer_content{
        padding: 24px 0;
    }

    .footer_content_left{
        width: 30%;
    }

    .footer_content_right{
        width: 70%;
    }
}