@charset "utf-8";
.res_img{width:100%; max-width:100%;}
.m_con{display:none;}

/* tablet */
@media all and (min-width:768px) and (max-width:1216px){
    /* header */
    #hd{
        padding: 20px;
    }
    .logo{
        position: initial;
        transform: none;
    }
    .logo>a{
        width: 140px;
        height: 52px;
    }
    /* m_gnb */
    .btn_m_gnb_open,.btn_m_gnb_close{
        top: 30px;
        right: 20px;
    }
    /* search_icon */
    .search_box{
        top: 30px;
        right: 80px;
    }
    /* mb */
    .bx1>div{
        height: 500px;
    }
    /* mb_a */
    .bx1_in>a{
        width: 120px;
        height: 45px;
        font-size: 1.5rem;
        padding: 13px;
    }
    .bx1_in{
        padding-top:50px;
    }
    .bx1_0>div>div{
        padding-top:90px;
        text-align: center;
    }
    .bx1_0>div>div>strong{
        color: #FFF;
        font-size: 4.0rem;
        font-weight: 500;
        line-height: 40px;
    }
    .bx1_0>div>div>p{
        color: #8a1f1e;
        font-size: 1.5rem;
        margin: 7px auto;
    }
    .bx1_0>div>div>span{
        color: #6c0f0f;
        font-size: 2.8rem;
    }
    .bx1_1 p,.bx1_2 p,.bx1_3 p,.bx1_4 p{/**/
        line-height: 20px;
        font-size: 1.5rem;
    }
    .bx1_1 h3{
        margin: 8px auto;
        font-size: 2.8rem;
        line-height: 30px;
    }
    .bx1_2 h3{
        margin: 15px auto;
        font-size: 4.0rem;
        font-weight: 500;
        line-height: 40px;
    }
    .bx1_3 h3{
        margin: 15px auto;
        font-size: 4.0rem;
        font-weight: 500;
        line-height: 40px;
    }
    .bx1_4 h3{
        margin: 15px auto;
        font-size: 4.0rem;
        font-weight: 500;
        line-height: 40px;
    }
    /* search_area */
    #search_area{
        padding:20px;
        margin: 60px auto 40px;
    }
    #search_area>h2{
        font-size: 3.0rem;
    }
    #search_area>h2>span{
        font-size: 1.8rem;
        margin: 40px auto 40px;
    }
    #search_area>div>fieldset{
        padding: 30px 30px;
        border-radius: 40px 40px;
    }
    .dropdown{
        margin: 0px 0px 10px 0px;
        width: 49%;
    }
    .drop1{
        margin-right: 10px;
    }
    .dropdown-content{
        min-width: 44%;
    }
    .search{
        margin:0px;
        width: calc(100% - 134px);
    }

    /* search_btn */
    .search_btns{
    }
    .search_button{
        margin:0px
    }
    .local_button{
        margin:0px 0px 0px 7px;
    }

    /* main_month */
    #main_month{
        padding: 60px 0px 40px 0px; 
    }
    #main_month>h2{
        font-size: 3.0rem;
    }
    #main_month>h2>span{
        font-size: 1.8rem;
        margin: 40px;
    }
    .main_month_list{
        margin-bottom: 40px;
    }
    .main_month_list>a{
        width: 140px;
        margin: 0px 5px;
        font-size: 1.7rem;
    }
    .month_content{
        margin-bottom: 40px;
    }
    .month_link_more{
        font-size: 1.4rem;
        width: 110px;
        height: 50px;
    }

    /* notice */
    #notice{
        padding: 20px;
        margin: 60px auto 20px;
    }
    #notice>h2{
        font-size: 3.0rem;
        margin-bottom: 40px;
    }
    #notice>div>div{
        padding: 20px;
        width:31%;
    }
    #notice>div>div:nth-of-type(2){
        margin: 0px 3.5%;
    }
    .notice_wrap>div>h3{
        font-size: 1.4rem;
        margin-bottom: 20px;
    }
    .notice_wrap>div>strong{
        font-size: 1.9rem;
        line-height: 30px;
        margin-bottom: 20px;
        min-height:90px;
    }
    .notice_wrap>div>p{
        font-size: 1.4rem;
        line-height: 25px;
        margin-bottom: 40px;
    }
    .notice_wrap>div>span{
        font-size: 1.3rem;
        margin-bottom: 40px;
    }
    #notice>a{
        font-size: 1.4rem;
        width: 110px;
        height: 50px;
        margin-top: 40px;
    }
    .notice_wrap>div>a{
        right: 20px;
        bottom: 20px;
        width: 25px;
        height: 25px;
    }

    /* event */
    #event{
        max-width:80vw;
        margin:0px auto;
        padding: 60px 0px 60px 0px;
    }
    #event .bx-viewport{
        overflow:visible !important;
    }
    .bx2>div{
        max-width:90vw !important;
        font-size: 0px;
        padding:0px 5vw;
    }
    #event>h2{
        font-size: 3.0rem;
        margin-bottom: 40px;
    }
    
    /* footer */
    #ft{
        padding: 40px 20px 30px;
    }
    .ft_top_area{
        margin-bottom: 10px;
    }
    .ft_menu>a{
        font-size: 1.5rem;
    }
    .ft_sns>a{
        margin-right: 10px;
        width: 25px;
        height: 25px;
    }
    .info>p{
        font-size: 1.4rem;
    }
    .info>p>span{
        font-size: 2.0rem;
    }
    .adress_area>a{
        margin-top: 20px;
        width: 130px;
        height: 50px;
    }
    .site_wrap>a{
        font-size: 1.6rem;
        margin: 20px 0px 20px 0px;
    }
    .copy{
        font-size: 1.2rem;
    }
}/* tablet E */

/* mobile */
@media all and (max-width:767px){
    #hd{
        padding: 10px;
    }
    .logo{
        position: initial;
        transform: none;
    }
    .logo>a{
        width: 100px;
        height: 38px;
    }
    .btn_m_gnb_open,.btn_m_gnb_close{
        top: 10px;
        right: 10px;
    }
    .search_box{
        top: 10px;
        right: 60px;
    }

    /* mb */
    .bx1>div{
        height: 300px;
    }
    .bx-wrapper .bx-controls-direction a{
        width: 40px;
        height: 40px;
    }

    /* mb_a */
    .bx1_in>a{
        width: 75px;
        height: 30px;
        font-size: 1.2rem;
        padding: 7px;
    }
    .mb_bk_detail>a{
        display: inline-block;
        position: absolute;
        height: 30px;
        width: 100px;
        text-align: center;
        color: #fff;
        font-size: 1.3rem;
        padding: 5px;
    }
    .bx1_in{
        padding-top:30px;
    }
    .bx1_0>div>div{
        padding-top:60px;
        text-align: center;
    }
    .bx1_0>div>div>strong{
        color: #FFF;
        font-size: 2.0rem;
        font-weight: 500;
        line-height: 20px;
    }
    .bx1_0>div>div>p{
        color: #8a1f1e;
        font-size: 1.1rem;
        margin: 3px auto;
    }
    .bx1_0>div>div>span{
        color: #6c0f0f;
        font-size: 1.8rem;
    }
    .bx1_0>div>div>span{
        color: #6c0f0f;
        font-size: 1.8rem;
    }
    .bx1_1>div>div:nth-of-type(1){
        position: absolute;
        top: 20%;
        left:10%;
    }
    .bx1_2>div>div:nth-of-type(1){
        position: absolute;
        top: 20%;
        left:10%;
    }
    .bx1_3>div>div:nth-of-type(1){
        position: absolute;
        top: 20%;
        left:10%;
    }
    .bx1_4>div>div:nth-of-type(1){
        position: absolute;
        top: 20%;
        left:10%;
    }
    .bx1_1 p,.bx1_2 p,.bx1_3 p,.bx1_4 p{/**/
        line-height: 12px;
        font-size: 1.1rem;
    }
    .bx1_1 h3{
        margin: 3px auto;
        font-size: 1.5rem;
        line-height: 20px;
    }
    .bx1_2 h3{
        margin: 8px auto;
        font-size: 2.0rem;
        font-weight: 500;
        line-height: 20px;
    }
    .bx1_3 h3{
        margin: 8px auto;
        font-size: 2.0rem;
        font-weight: 500;
        line-height: 20px;
    }
    .bx1_4 h3{
        margin: 8px auto;
        font-size: 2.0rem;
        font-weight: 500;
        line-height: 20px;
    }
    .btn_book{
        border-radius: 3px 3px;
    }
    .mb_bk_detail{
        position: absolute;
        top: 50%;
        left:10%;
    }
    .btn_detail{
        margin-left: 110px;
        border-radius: 3px 3px;
    }
    /* search_area */
    #search_area{
        padding:10px;
        margin: 40px auto 20px;
    }
    #search_area>h2{
        font-size: 2.0rem;
    }
    #search_area>h2>span{
        font-size: 1.4rem;
        margin: 20px auto 20px;
    }
    #search_area>div>fieldset{
        padding: 10px 10px;
        border-radius: 20px 20px;
    }
    .dropdown{
        margin: 0px 0px 10px 0px;
        width: 48%;
        background-size: 30px 30px;
    }
    .drop1{
        margin-right: 8px;
    }
    .dropdown-content{
        min-width: 43%;
    }
    .dropdown-button{
        height: 40px;
        font-size:1.4rem;
    }
    .dropdown-content>a{
        padding: 6px;
        font-size:1.3rem;
    }
    .search{
        margin:0px;
        width: calc(100% - 90px);
        font-size: 1.4rem;
    }
    .search>label>input{
        height: 40px;
    }
    .search_button{
        width: 40px;
        height: 40px;
        margin: 0px 3px 0px 3px;
    }
    .local_button{
        width: 40px;
        height: 40px;
        margin: 0px;
    }

    /* main_month */
    #main_month{
        padding: 40px 0px 20px 0px; 
    }
    #main_month>h2{
        font-size: 2.0rem;
    }
    #main_month>h2>span{
        font-size: 1.4rem;
        margin: 20px;
    }
    .main_month_list{
        margin-bottom: 20px;
    }
    .main_month_list>a{
        width: 13.3333%;
        line-height: 40px;
        margin: 0px 3px;
        font-size: 1.2rem;
    }
    .main_month_list>a:nth-of-type(1){
        background-image:none;
    }
    .main_month_list>a:nth-of-type(1):hover,.main_month_list>a:nth-of-type(1):focus,.main_month_list>a:nth-of-type(1).on{
        background-image:none;
    }
    .main_month_list>a:nth-of-type(2){
        background-image:none;
    }
    .main_month_list>a:nth-of-type(2):hover,.main_month_list>a:nth-of-type(1):focus{
        background-image:none;
    }
    .main_month_list>a:nth-of-type(3){
        background-image:none;
    }
    .main_month_list>a:nth-of-type(3):hover,.main_month_list>a:nth-of-type(1):focus{
        background-image:none;
    }
    .main_month_list>a:nth-of-type(4){
        background-image:none;
    }
    .main_month_list>a:nth-of-type(4):hover,.main_month_list>a:nth-of-type(1):focus{
        background-image:none;
    }
    .main_month_list>a:nth-of-type(5){
        background-image:none;
    }
    .main_month_list>a:nth-of-type(5):hover,.main_month_list>a:nth-of-type(1):focus{
        background-image:none;
    }
    .line_height{
        width: 200px;
    }
    .month_content{
        height: 285px;
        margin-bottom: 20px;
    }
    .month_content>div>div{
        margin: 0px 5px;
    }
    .hover_con{
        padding: 10px;
    }
    .hover_con>span{
        width: 55px;
        margin: 10px 0px 20px 0px;
        border-radius: 20px;
    }
    .hover_con>strong{
        font-size: 1.8rem;
        line-height: 10px;
        margin-bottom: 20px;
    }
    .line_height>div>strong{
        line-height: 20px;
    }
    .hover_con>a{
        line-height: 50px;
        width: 55px;
        height: 55px;
    }
    .month_link_more{
        font-size: 1.2rem;
        width: 80px;
        height: 40px;
        line-height: 3.5rem;
    }

    /* notice */
    #notice{
        padding: 10px;
        margin: 40px auto 20px;
    }
    #notice>h2{
        font-size: 2.0rem;
        margin-bottom: 30px;
    }
    #notice>div>div{
        padding: 30px;
        width:100%;
        float: none;
    }
    #notice>div>div:nth-of-type(2){
        margin: 10px 0px 10px 0px;
    }
    .notice_wrap>div>h3{
        font-size: 1.3rem;
        margin-bottom: 5px;
    }
    .notice_wrap>div>strong{
        font-size: 1.7rem;
        font-weight: 500;
        line-height: 30px;
        margin-bottom: 20px;
        min-height: 40px;
    }
    .notice_wrap>div>p{
        font-size: 1.3rem;
        line-height: 25px;
        margin-bottom: 30px;
    }
    .notice_wrap>div>span{
        font-size: 1.2rem;
        margin-bottom: 40px;
    }
    #notice>a{
        font-size: 1.2rem;
        width: 80px;
        height: 40px;
        margin-top: 20px;
        line-height: 3.5rem;
    }
    .notice_wrap>div>a{
        right: 30px;
        bottom: 30px;
        width: 20px;
        height: 20px;
    }
    
    /* event */
    #event{
        max-width:85vw;
        margin:0px auto;
        padding: 40px 0px 40px 0px;
    }
    #event .bx-viewport{
        overflow:visible !important;
    }
    .bx2>div{
        max-width:90vw !important;
        font-size: 0px;
        padding:0px 5vw;
    }
    #event>h2{
        font-size: 2.2rem;
        margin-bottom: 40px;
    }
    #event .bx-wrapper .bx-controls-direction a{
        margin-top: -10px;
        width: 30px;
        height: 30px;
    }
    #event .bx-wrapper .bx-prev{
        left: 10px;
    }
    #event .bx-wrapper .bx-next{
        right: 10px;
    }
    #event .bx-wrapper .bx-pager{
        padding: 0px 0px;
    }

    /* footer */
    #ft{
        padding: 40px 10px 30px;
    }
    .ft_menu{
        float: none;
    }
    .ft_top_area{
        text-align: center;
        margin-bottom: 10px;
    }
    .ft_menu>a{
        font-size: 1.3rem;
    }
    .ft_sns{
        float: none;
        margin-top: 15px;
    }
    .ft_sns>a{
        margin-right: 10px;
        width: 25px;
        height: 25px;
    }
    .info>p{
        font-size: 1.2rem;
    }
    .info>p>span{
        font-size: 2.0rem;
    }
    .adress_area>a{
        margin-top: 20px;
        width: 100px;
        height: 38px;
        text-align: center;
    }
    .adress_area{
        text-align: center;
        float: none;
    }
    .ft_list{
        float: none;
        text-align: center;
    }
    .site_wrap>a{
        font-size: 1.5rem;
        margin: 20px 0px 20px 0px;
    }
    .copy{
        font-size: 1.1rem;
    }
}/* mobile E */

/* tablet & mobile */
@media all and (max-width:1216px){
    .center{width: initial;}
    .pc_con{display: none;}
    .m_con{display: initial;}
    #hd{
        top: 0px;
    }
    .btn_m_gnb_open,.btn_m_gnb_close{
        position: absolute;
        border: none;
        background: #fff;
        padding: 8px;
        width: 40px;
        height: 40px;
        border: 1px solid #888;
        border-radius: 50px;
    }
    .btn_m_gnb_open:hover,.btn_m_gnb_close:hover, .btn_m_gnb_open:focus,.btn_m_gnb_close:focus{
        border: none;
        background-color: rgba(0,0,0,0.1);
    }
    #m_gnb_wrap{
        position: fixed;
        top: 0px;
        right: -300px;
        z-index: 9999;
        width: 300px;
        height: 100vh;
        padding: 92px 20px 40px 20px;
        background: #fff;
        transition: 0.5s;
    }
    #m_gnb_wrap.on{
        right: 0px;
    }
    #m_gnb>ul>li{
        padding-right: 10px;
    }
    #m_gnb>ul>li>a{
        display: block;
        line-height: 40px;
        color:#333;
        font-size: 2.0rem;
        font-weight: 500;
        padding: 10px;
        border-bottom: 1px solid #ccc;
        background: url(../svg/mgnb_1depth_default.svg) no-repeat right center;
        background-size: 20px 20px;
    }
    #m_gnb>ul>li>a:hover{
        background: url(../svg/mgnb_1depth_hover.svg) no-repeat right center;
        background-size: 20px 20px;
        color:#d91b5c;
    }
    #m_gnb>ul>li>ul{
        display: none;
        background: #f4f4f4;;
    }
    #m_gnb>ul>li>ul>li>a{
        display: block;
        color:#666666;
        font-size: 1.7rem;
        padding-left: 30px;
        line-height: 40px;
    }
    #m_gnb>ul>li>ul>li>a:hover{
        color:#d91b5c;
    }
    .notice_wrap>div:hover{
        transform:none;
        box-shadow: none;
    } 
    .m_bg_gnb{
        display: none;
        position: fixed;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        z-index: 9990;
        background: rgba(0,0,0,0.7);
    }
    .ft_content{
        border-top: none;
    }
}/* tablet & mobile  E */