/*@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;600&display=swap');*/

/*=====================Reset Css Start==================================*/
* {box-sizing: border-box;}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; 
/*    font-family: 'Noto Serif JP', serif; */
    font-family: "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", serif;
    font-weight:400; background: #fff;}
table { border-collapse: collapse; border-spacing: 0; }
img { max-width: 100%; height: auto; display: block; }
img:hover, img:focus{outline: none;}
a{text-decoration: none; color: #1860CD; font-weight: 500; line-height: 20px; transition: all 0.2s;}
a:hover, a:focus{text-decoration: none; outline: none;}
/*=====================Reset Css End==================================*/

/*===========Global CSS=================*/

.container{max-width: 1107px; margin-left: auto; margin-right: auto; padding: 0 15px;}

h1{font-size: 32px; margin: 0 0 10px; font-weight: 600; color: #333;}
h2{font-size: 28px; margin: 0 0 10px; font-weight: 500; color: #333;}
h3{font-size: 22px; margin: 0 0 10px; font-weight: 500; color: #333;}
h4{font-size: 20px; margin: 0 0 10px; font-weight: 500; color: #333;}
h5{font-size: 18px; margin: 0 0 10px; font-weight: 500; color: #333;}
h6{font-size: 16px; margin: 0 0 10px; font-weight: 500; color: #333;}

b {font-weight: bold;}
p{font-size: 14px; color: #333; line-height: 28px; margin: 0 0 10px;}

button{padding: 10px 16px; border: none; display: inline-block; cursor: pointer; border-radius: 6px; font-size: 14px; text-align: center; background-color: #efefef; font-weight: 500; box-shadow: 1px 1px 3px 0 rgba(0,0,0,.25); transition: all 0.2s;}

.btn-effect{position: relative; overflow: hidden; box-shadow: 0px 3px 8px 2px rgba(0,0,0,0.15);}
.btn-effect:hover{box-shadow: 0px 4px 20px 2px rgba(0,0,0,0.3);}
.btn-effect:after{content: ""; position: absolute; z-index: 1; top: 0; right: 1px; width: 100%; height: 100%; display: block; background-color: #000; transform: translate3d(-100%, 0, 0); transition: transform .4s cubic-bezier(.38, .33, .23, .99) 0s;}
.btn-effect:hover:after{right: 0; transform: translateZ(0);}
.btn-effect .effect-cnt{position: relative; z-index: 2; display: flex; align-items: center; justify-content: center;}
.btn-effect:hover .effect-cnt {color: #fff;}
.btn-effect .effect-cnt span {margin: 0 16px 0 0;}
.btn-effect .effect-cnt svg{width: 24px; transition: all .4s 0s;}
.btn-effect:hover .effect-cnt svg{transform: translateX(5px);}

.full-link{position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: 9;}

ul{padding: 0 0 0 20px; margin: 0 0 10px;}
ul li{font-size: 16px; color: #333; line-height: 20px; padding: 0 0 10px;}

.bg-cm{background-repeat: no-repeat; background-size: cover; background-position: center center;}
.bg-cm img{opacity: 0; visibility: hidden; display: none; width: 100%;}

.cm-blk{margin: 0 0 30px;}
.cm-title{text-align: center; margin: 0 0 16px;}
.cm-title h2:before {content: ''; display: inline-block; background: #382902; width: 120px; height: 1px; position: absolute; right: 100%; top: 50%; transform: translateY(-50%);}
.cm-title h2{font-weight: 600; font-size: 36px; line-height: 52px; text-align: center; letter-spacing: 0.1em; color: #382902; margin: 0; padding: 0 4px; position: relative; display: inline-flex; align-items: center; justify-content: center;}
.cm-title h2:after {content: ''; display: inline-block; background: #382902; width: 120px; height: 1px; position: absolute; left: 100%; top: 50%; transform: translateY(-50%);}
.cm-title h2 img {width: 52px;}
.cm-title h2 span {padding: 0 30px;}
.cm-blk h2.english{font-weight: 600; font-size: 18px; text-align: center; color: #382902; margin: 0 0 26px;}
.cm-blk h3{font-weight: 600; font-size: 18px; text-align: center; color: #382902; margin: 0 0 26px;}
.cm-blk p{font-size: 16px; text-align: center; color: #382902; margin: 0; line-height: 1.6;}

/*============Loader Css===============*/
.loader{position: fixed; right: 0; top: 0; height: 100%; width: 100%; background: #fff; z-index: 999; opacity: 0; visibility: hidden; transition: all 0.2s;}
.page-loading{overflow: hidden;}
.page-loading .loader{opacity: 1; visibility: visible;}
.loader-inner{height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.loader-inner img:nth-child(1){margin: 0 0 20px; width: 90px;}

@keyframes blink {
    0% {
        opacity:1;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}

.loader-inner img:nth-child(2){margin: 0 0 50px; animation: blink 5s infinite linear;}
.progress{position: relative; width: 70%; height: 22px; overflow: hidden; background: #e5e5e5; border-radius: 6px;}
.bar{position: absolute; height: 100%; background: #2ecc71;}
.percent{position: absolute; z-index: 5; top: 50%; left: 50%; margin: 0; font-size: 12px; color: #000; transform: translate(-50%,-50%);}

/*============Mobile Menu Css===============*/
.mobile-menu{display: none;}

/*============Mobile Reservation Css===============*/
.mobile-reservation{display: none;}

.wrapper{}

/*============Header Css===============*/
header{position: fixed; right: 100px; top: 80px; z-index: 9;}
nav{}
nav ul{margin: 0; padding: 0; display: flex;}
nav ul > li{width: 40px; list-style-type: none; padding: 0 10px; line-height: inherit;}
nav ul > li > a{font-weight: 600; font-size: 14px; line-height: 23px; color: #FFFFFF; letter-spacing: 11px; writing-mode: vertical-rl;}

/*============Shortcut Css===============*/
.shortcut-blk{position: fixed; right: 0; top: 15%; z-index: 9;}
.shortcut-blk ul{margin: 0; padding: 0;}
.shortcut-blk ul li{list-style-type: none; padding: 10px 0; line-height: inherit;}
.shortcut-blk ul li a{font-weight: 600; font-size: 14px; line-height: 20px; color: #000000; height: 130px; width: 50px; letter-spacing: 6px; writing-mode: vertical-rl; display: flex; align-items: center; justify-content: center;}
.shortcut-blk ul li.telephone a{background: #B39D7D;}
.shortcut-blk ul li.booking a{background: #FFFFFF;}
.shortcut-blk ul li.access a{background: #484848; color: #fff;}

/*============Course Css===============*/
.course-blk{margin: 0 0 70px;}
.course-tp{margin: 0 0 70px;}
.course-list{margin-left: -30px; margin-right: -30px; display: flex; flex-wrap: wrap;}
.course-list-cm{width: 50%; padding: 0 30px; margin: 0 0 50px;}
.course-list-inr{background: #FFFFFF; height: 100%; position: relative; box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.20);}
.course-list-img{position: relative;}
.course-list-imgblk{height: 320px;}
.course-list-imgblk img{}
.course-tag:before{position: absolute; z-index: -1; content: ''; display: block; border: 5px solid #c59b05; border-top-color: transparent; border-left-color: transparent; top: 0; right: 0;}
.course-tag {width: 150px; height: 150px; overflow: hidden; position: absolute; top: -10px; left: -10px; z-index: 1;}
.course-tag:after {position: absolute; z-index: -1; content: ''; display: block; border: 5px solid #c59b05; border-top-color: transparent; border-left-color: transparent; bottom: 0; left: 0;}
.course-tag span {position: absolute; display: block; width: 225px; padding: 15px 0; background-color: #826e24; color: #fff; font-size: 18px; font-weight: 700; letter-spacing: 1px; text-align: center; right: -25px; top: 30px; transform: rotate(-45deg); box-shadow: 0 4px 10px rgba(0,0,0,.65); text-shadow: 0 1px 1px rgba(0,0,0,.2);}
.course-list-content{padding: 20px; word-break: break-word;}
.course-cnt-tp{border-bottom: 1px solid #000000; padding: 0 0 16px; margin: 0 0 14px;}
.course-cnt-tp h3{font-weight: bold; font-size: 16px; line-height: 18px; color: #000000; margin: 0 0 8px;}
.course-cnt-tp h4{font-weight: 400; font-size: 13px; line-height: 18px; color: #888580; margin: 0 0 8px;}
.course-cnt-tp h5{font-weight: bold; font-size: 16px; line-height: 20px; text-align: right; color: #3a2c18; margin: 0;}
.course-cnt-btm{}
.course-cnt-btm h6{font-weight: normal; font-size: 14px; line-height: 20px; color: #000000;}
.course-cnt-btm p{font-weight: normal; font-size: 12px; line-height: 20px; color: #000000;}
.course-btn{display: flex; justify-content: flex-end;}
.course-btn a{background: #79694d; font-weight: bold; font-size: 14px; line-height: 20px; text-align: center; color: #FFFFFF; padding: 4px 30px;}

/*============Reservation Css===============*/
.reservation-outer{padding: 50px 0 0;}
.reservation-blk{padding: 20px; position: relative; background: #F2F2F2; width: 1099px; z-index: 1; margin: 0 auto;}
.reservation-image{width: 100%;}
.reservation-main{position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%, -50%);}
.reservation-tp{}
.reservation-mdl{margin: 0 0 30px;}
.reservation-mdl ul{margin: 0 auto; padding: 0; max-width: 831px;}
.reservation-mdl ul li{list-style-type: none; font-weight: 600; font-size: 18px; line-height: 26px; color: #000000;}
.reservation-mdl ul li:last-child{padding: 0px;}
.reservation-mdl ul li:nth-child(3){color: #B84444;}
.reservation-btm{padding: 0 50px;}
.reservation-btm ul{margin-left: -8px; margin-right: -8px; margin-bottom: 0px; padding: 0; display: flex; align-items: center; justify-content: center;}
.reservation-btm ul li{list-style-type: none; padding: 0 8px; width: 48%;}
.reservation-btm ul li a{padding: 10px; position: relative; overflow: hidden; display: block; height: 109px;}
.reservation-bdr{border: 1px solid #FFFFFF; padding: 10px; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
.reservation-bdr h3{font-weight: 600; font-size: 36px; line-height: 52px; color: #f2f2f2; margin: 0; text-align: center;}
.reservation-bdr h3 span{font-weight: 400; font-size: 18px; line-height: 28px; letter-spacing: 1.12px; color: #fff; margin: 0; display: block;}
.reservation-btm ul li.phone{}
.reservation-btm ul li.phone a{background: linear-gradient(180deg, rgba(179, 157, 125, 0.8) 0%, #B39D7D 100%);}
.reservation-btm ul li.web{}
.reservation-btm ul li.web a{background: linear-gradient(180deg, rgba(205, 205, 205, 0.82) 0%, #CDCDCD 100%);}
.web .reservation-bdr h3{color: #000; font-weight: 400; font-size: 18px; line-height: 28px; letter-spacing: 1.12px;}


/*============Common Nav Css===============*/
.cm-nav{}
.cm-nav ul{margin: 0; padding: 0; display: flex; align-items: center; justify-content: center;}
.cm-nav ul li{list-style-type: none; padding: 0 10px;}
.cm-nav ul li a{border: 1px solid #000000; font-weight: normal; font-size: 18px; text-align: center; color: #000000; display: block; width: 265px; padding: 16px 0;}

/*============Footer Css===============*/
footer{padding: 140px 0px 0; background-repeat: no-repeat !important; background-position: center center !important; background-size: cover !important;}
@media screen and (min-width: 768px){
    .webp footer{background: url(../../../images/ginza-no-yoshoku/top-page/footer-bg.webp);}
    .no-webp footer{background: url(../../../images/ginza-no-yoshoku/top-page/footer-bg.jpg);}
}

.footer-blk{max-width: 1500px; margin: 0 auto 60px; padding: 0 40px; display: flex;}
.footer-lft{width: 50%; padding: 0 10px;}
.footer-lft-tp {margin: 0 0 30px;}
.footer-logo{margin: 0 0 30px;}
.footer-logo a{display: flex; align-items: center;}
.footer-logo a img{width: 75px;}
.footer-logo a span{font-weight: 600; font-size: 26px; line-height: 69px; color: #FFFFFF; margin: 0 0 0 20px;}
.footer-address{margin: 0 0 14px;}
.footer-address span{font-size: 16px; line-height: 26px; text-align: center; color: #FFFFFF;}
.footer-address address{font-size: 16px; line-height: 26px; color: #FFFFFF; font-style: normal;}
.hours-blk{margin: 0 0 14px; display: flex;}
.hours-blk h3{font-size: 16px; line-height: 26px; color: #FFFFFF; margin: 0; min-width: 65px;}
.hours-blk h4{font-size: 16px; line-height: 26px; color: #FFFFFF; margin: 0 0 0 20px; max-width: 400px;}
.holiday-blk{display: flex;}
.holiday-blk h3{font-size: 16px; line-height: 26px; color: #FFFFFF; margin: 0;}
.holiday-blk h4{font-size: 16px; line-height: 26px; color: #FFFFFF; margin: 0 0 0 20px;}
.mobile-info{display: none;}
.footer-lft-btm{}
.footer-lft-btm p{font-size: 18px; color: #FFFFFF; margin: 0;}
.footer-lft-btm p a{color: #FFFFFF; text-decoration: underline;}
.footer-rgt{width: 50%; padding: 0 10px;}
.footer-reservation{}
.footer-reservation .cm-blk{display: none;}
.footer-reservation > h3{font-weight: 600; font-size: 20px; line-height: 34px; color: #FFFFFF; display: inline-block; padding: 0 0 10px; border-bottom: 1px solid #FFFFFF;}
.footer-reservation h4{font-size: 16px; line-height: 26px; color: #FFFFFF; margin: 0 0 6px;}
.footer-reservation h4 br{display: none;}
.footer-reservation p{font-size: 13px; line-height: 20px; color: #cecece; margin: 0 0 20px;}
.footer-resr-btm{}
.footer-resr-btm ul{margin-left: -10px; margin-right: -10px; margin-bottom: 0px; padding: 0; display: flex;}
.footer-resr-btm ul li{width: 50%; padding: 0 10px; list-style-type: none;}
.footer-resr-btm ul li h5{font-weight: 600; font-size: 18px; line-height: 26px; color: #FFFFFF;margin-top:10px;}
.footer-resr-btm ul li a{border: 1px solid #FFFFFF; padding: 20px 0; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.footer-resr-btm ul li a h6{display: none;}
.footer-resr-inr {display: flex; align-items: center;}
.footer-resr-btm ul li a svg{color: #fff; width: 20px;}
.footer-resr-btm ul li a span{font-weight: 600; font-size: 18px; line-height: 26px; text-align: center; color: #FFFFFF; margin: 0 0 0 12px;}
.footer-resr-btm ul li.phone a{background: rgba(178, 157, 125, 0.47);}
.footer-resr-btm ul li.internet a{background: rgba(206, 206, 206, 0.38);}
.copyright-blk {}
.copyright-blk p {padding: 20px 0; background: #00000045; color: #bbac95; font-size: 13px; text-align: center; margin: 0;}

/*============Responsive Css===============*/
@media all and (min-width:1920px) {
    header{right: 60px;}
}
@media all and (max-width:1366px) {
    
}

@media all and (max-width:1024px) {
    /*===========Global CSS=================*/
    .container{max-width: 960px;}
    
    .cm-blk {margin: 0 0 20px;}
    .cm-title{margin: 0 0 10px;}
    .cm-title h2{font-size: 30px; line-height: 40px;}
    
    /*============Shortcut Css===============*/
    .shortcut-blk{top: 20%;}
    .shortcut-blk ul li{padding: 6px 0;}
    
    /*============Reservation Css===============*/
    .reservation-blk{width: auto;}
    .reservation-tp{margin: 0px;}
    
    /*============Footer Css===============*/
    .footer-resr-btm ul li h5{font-size: 16px;}
}

@media all and (max-width:960px) {
    /*===========Global CSS=================*/
    .container{max-width: 720px;}
    .cm-blk {margin: 0 0 10px;}
    .cm-title {margin: 0 0 10px;}
    .cm-title h2{font-size: 22px; line-height: 22px;}
    
    .btn-effect .effect-cnt span{margin: 0 10px 0 0;}
    .btn-effect .effect-cnt svg{width: 20px;}
    
    /*============Course Css===============*/
    .course-list{margin-left: -20px; margin-right: -20px;}
    .course-list-cm{padding: 0 20px; margin: 0 0 40px;}
    .course-list-imgblk {height: 230px;}
    
    /*============Reservation Css===============*/
    .reservation-tp .cm-title h2{font-size: 26px; line-height: 42px;}
    .reservation-tp .cm-title h2:before{width: 60px;}
    .reservation-tp .cm-title h2:after{width: 60px;}
    .reservation-main{width: 80%;}
    .reservation-mdl {margin: 0 0 20px;}
    .reservation-mdl ul li{font-size: 14px; line-height: 16px; padding: 0 0 6px;}
    .reservation-btm ul li a{height: 79px;}
    .reservation-btm {padding: 0;}
    .reservation-btm ul li{width: 50%;}
    .reservation-bdr h3{font-size: 18px; line-height: 26px;}
    .reservation-bdr h3 span {font-size: 14px; line-height: 14px;}
    .web .reservation-bdr h3{font-size: 18px; line-height: 26px;}
    
    /*============Footer Css===============*/
    .footer-logo a span{font-size: 20px; line-height: 30px;}
    .footer-resr-btm ul{flex-direction: column;}
    .footer-resr-btm ul li{width: 100%;}
}

@media screen and (max-width:767px) {
    /*============Global Css===============*/
    .cm-blk {margin: 0 0 20px;}
    .cm-title{margin: 0 0 8px;}
    .cm-title h2:before{width: 42px;}
    .cm-title h2{font-size: 20px; line-height: 26px;}
    .cm-title h2:after{width: 42px;}
    .cm-title h2 img {width: 46px;}
    .cm-title h2 span {padding: 0 10px;}
    .cm-blk h2.english{font-size: 14px; margin: 0 0 12px;}
    .cm-blk h3{font-size: 14px; margin: 0 0 12px;}
    .cm-blk p{font-size: 12px;}
    
    /*============Loader Css===============*/
    .loader-inner img:nth-child(2){width: 224px; margin: 0 0 30px;}
    .progress{width: 90%; height: 20px;}
    
    /*============Mobile Menu Css===============*/
    .navbar-toggle {width: 40px; height: 40px; display: inline-block; position: fixed; top: 30px; right: 30px; cursor: pointer; vertical-align: middle; z-index: 99; background: rgba(255,255,255,0.6); border-radius: 100%; transform: rotate(0deg); transition: .5s ease-in-out;}
    .menu-open .navbar-toggle {display: none;}
    .navbar-toggle span {display: block; height: 3px; width: 60%; background: #000; opacity: 1; position: absolute;left: 8px; transform: rotate(0deg); transition: .25s ease-in-out; transform-origin: left center;}
    .navbar-toggle span:nth-child(1) {top: 12px;}
    .navbar-toggle span:nth-child(2) {top: 19px;}
    .navbar-toggle span:nth-child(3) {top: 26px;}
    
    body.menu-open{position: relative;}
    body:before{background-image: url(../../../images/ginza-no-yoshoku/common/mobile-menu-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; content: ''; display: inline-block; position: fixed; top: 0; left: 0; z-index: 99; height: 100%; width: 100%; opacity: 0; visibility: hidden; transition: all 0.2s;}
    body.menu-open:before {opacity: 1; visibility: visible;}
    .mobile-menu{padding: 30px 20px; position: fixed; right: 0; left: 0; top: 40%; width: 94%; max-height: 100%; overflow: auto; margin: 0 auto; z-index: 99; background: rgba(255, 255, 255, 0.82); text-align: center; display: block; opacity: 0; visibility: hidden; transition: all 0.2s; transform: translateY(-40%);}
    .menu-open .mobile-menu{opacity: 1; visibility: visible;}
    .mobile-menu-tp{margin: 0 0 20px;}
    .mobile-menu-logo{}
    .mobile-menu-logo img{margin: 0 auto 10px; width: 80px;}
    .mobile-menu-logo span{font-weight: 600; font-size: 14px; line-height: 20px; letter-spacing: 0.1em; color: #000000; margin: 0;}
    .mobile-menu-tp .navbar-toggle{display: inline-block; background: transparent; right: 10px;}
    .mobile-menu-tp .navbar-toggle span {background: #000;}
    .mobile-menu-tp .navbar-toggle span:nth-child(1) {top: 0; left: 0; transform: rotate(45deg);}
    .mobile-menu-tp .navbar-toggle span:nth-child(2) {width: 0%; opacity: 0;}
    .mobile-menu-tp .navbar-toggle span:nth-child(3) {top: 17px; left: 0; transform: rotate(-45deg);}
    .mobile-menu-mdl{margin: 0 0 10px;}
    .mobile-menu-mdl ul{margin: 0; padding: 0;}
    .mobile-menu-mdl ul li{list-style-type: none; padding: 0;}
    .mobile-menu-mdl ul li a{font-weight: 600; font-size: 20px; line-height: 29px; letter-spacing: 0.37em; color: #000000; padding: 16px 0; display: block; width: 75%; margin: 0 auto; border-bottom: 1px solid #A7A7A7;}
    .mobile-menu-mdl ul li:last-child a {border: none;}
    
    /*============Mobile Reservation Css===============*/
    .mobile-reservation{display: block; position: fixed;  left: 0; right: 0; bottom: 0; z-index: 99; background: #000; padding: 16px 14px; opacity: 0; visibility: hidden; transition: all 0.2s;}
    body.scroll .mobile-reservation{opacity: 1; visibility: visible;}
    body.menu-open .mobile-reservation {display: none;}
    .m-reser-blk{}
    .m-reser-blk > h3{font-weight: 600; font-size: 12px; color: #FFFFFF; margin: 0 0 6px;}
    .m-reser-inr{background: #FFFFFF; border: 1px solid #BBBBBB; border-radius: 3px;}
    .m-reser-inr ul{margin: 0; padding: 0; display: flex;}
    .m-reser-inr ul li{width: 50%; list-style-type: none; padding: 8px;}
    .m-reser-inr ul li.phone{width: 60%; border-right: 1px solid #BBBBBB;}
    .m-reser-inr ul li.online{width: 40%;}
    .m-reser-inr ul li a{height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;}
    .m-reser-inr .phone h4{font-weight: 600; font-size: 12px; line-height: 13px; text-align: center; color: #000000; margin: 0;}
    .phone-inr{display: flex; align-items: center; justify-content: center;}
    .phone-inr svg{width: 22px; color: #000;}
    .phone-inr span{font-weight: 600; font-size: 18px; color: #000000; padding: 0 0 0 8px;}
    .m-reser-inr .online{}
    .online-inr{display: flex; align-items: center; justify-content: center;}
    .online-inr svg{width: 22px; color: #000;}
    .online-inr span{font-weight: 600; font-size: 12px; color: #000000; padding: 0 0 0 8px;}
    
    /*============Header Css===============*/
    header{display: none;}
    
    /*============Shortcut Css===============*/
    .shortcut-blk{display: none;}
    
    /*============Course Css===============*/
    .course-blk {margin: 0 0 60px;}
    .course-tp {margin: 0 0 30px;}
    .course-list{margin: 0; flex-direction: column;}
    .course-list-cm{width: 100%; margin: 0 0 40px; padding: 0px;}
    .course-list-cm:last-child {margin: 0;}
    .course-tag{width: 140px; height: 140px;}
    .course-tag span{width: 215px; font-size: 14px;}
    .course-list-content{padding: 14px;}
    .course-cnt-tp h3{font-size: 14px; line-height: 18px; margin: 0 0 8px;}
    .course-cnt-tp h4{font-size: 12px; line-height: 14px; margin: 0 0 8px;}
    .course-cnt-tp h5{font-size: 14px;}
    .course-cnt-btm h6{font-size: 12px; line-height: 14px;}
    .course-cnt-btm p{font-size: 12px; line-height: 14px;}
    .course-btn a{font-size: 12px; line-height: 17px;}
    .cm-nav ul{flex-direction: column;}
    .cm-nav ul li{margin: 0 0 16px;}
    .cm-nav ul li:last-child {margin: 0;}
    .cm-nav ul li a{font-size: 12px; width: 187px; padding: 6px 0;}
    
    /*============Reservation Css===============*/
    .reservation-outer{padding: 0px;}
    .reservation-blk{height: auto;}
    .reservation-tp .cm-title h2{font-size: 15px; line-height: 28px; border-bottom: 1px solid #A3A3A3; padding: 0 0 10px;}
    .reservation-tp .cm-title h2:before, .reservation-tp .cm-title h2:after{display: none;}
    .reservation-tp .cm-title h2 img{display: none;}
    .reservation-tp .cm-blk h3{display: none;}
    .reservation-mdl ul li{font-size: 12px; line-height: 17px;}
    .reservation-btm ul{flex-direction: column;}
    .reservation-btm ul li {width: 100%;}
    .reservation-btm ul li.phone {margin: 0 0 10px;}
    
     /*============Footer Css===============*/
    footer{padding: 60px 0px 114px;}
    .webp footer{background: url(../../../images/ginza-no-yoshoku/top-page/footer-bg-mobile.webp);}
    .no-webp footer{background: url(../../../images/ginza-no-yoshoku/top-page/footer-bg-mobile.jpg);}
    .footer-blk{margin: 0 auto 50px; padding: 0 20px; flex-direction: column-reverse;}
    .footer-rgt{width: 100%; margin: 0 0 50px;}
    .footer-reservation .cm-blk{display: block; margin: 0 0 30px;}
    .footer-reservation .cm-title h3{color: #fff; font-size: 20px; line-height: 26px; font-weight: 600; text-align: center; letter-spacing: 0.1em; margin: 0; padding: 0 4px; position: relative; display: inline-flex; align-items: center; justify-content: center;}
    .footer-reservation .cm-title h3:before{content: ''; display: inline-block; background: #fff; width: 42px; height: 1px; position: absolute; right: 100%; top: 50%; transform: translateY(-50%);}
    .footer-reservation .cm-title h3:after{content: ''; display: inline-block; background: #fff; width: 42px; height: 1px; position: absolute; left: 100%; top: 50%; transform: translateY(-50%);}
    .footer-reservation .cm-title h3 span{padding: 0 10px;}
    .footer-reservation .cm-blk h3.english{color: #fff;}
    .footer-reservation > h3{display: none;}
    .footer-reservation h4{font-size: 12px; line-height: 19px; text-align: center;}
    .footer-reservation h4 br{display: block;}
    .footer-reservation p{font-size: 12px; line-height: 16px; text-align: center; margin: 0 0 10px;}
    .footer-resr-btm ul li.phone{margin: 0 0 14px;}
    .footer-resr-btm ul li h6{display: none;}
    .footer-resr-btm ul li a{padding: 8px 0;}
    .footer-resr-btm ul li a h6{display: block; margin: 0; font-size: 15px; color: #fff;}
    .footer-resr-btm ul li a svg{}
    .footer-resr-btm ul li a span{font-size: 16px; line-height: 20px; margin: 0 0 0 8px;}
    .footer-lft{width: 100%;}
    .footer-lft-tp {margin: 0 0 20px;}
    .footer-logo {margin: 0 0 20px;}
    .footer-logo a img{width: 65px;}
    .footer-logo a span{margin: 0 0 0 10px;}
    .footer-address, .hours-blk, .holiday-blk{display: none;}
    .mobile-info{display: block; margin: 0; padding: 0;}
    .mobile-info > li{color: #fff; list-style-type: none; padding: 0 0 16px; display: flex;}
    .mobile-info > li:last-child {padding: 0;}
    .mobile-info > li h3{font-weight: 600; font-size: 12px; line-height: 17px; color: #FFFFFF; margin: 0 10px 0 0; min-width: 50px;}
    .footer-lft .more-info{}
    .footer-lft .more-info h4{font-weight: 600; font-size: 12px; line-height: 17px; color: #FFFFFF; margin: 0;}
    .footer-lft .more-info address{font-weight: 600; font-size: 12px; line-height: 17px; color: #FFFFFF; font-style: normal;}
    .footer-lft-btm p{font-size: 14px;}
    .copyright-blk{}
    .copyright-blk p{font-size: 12px; padding: 16px 60px; line-height: 18px;}
    
}

@media screen and (max-width:364px) {
    .cm-title h2:before{width: 20px;}
    .cm-title h2:after{width: 20px;}
}