@charset "utf-8";
/* CSS Document */
*, *:before, *:after { box-sizing:border-box; margin:0; }
img { max-width:100%; height:auto; vertical-align:top; }
a{color: #333; text-decoration: none;}
a:hover{opacity: 0.5;text-decoration: underline;}

body {
/*font-family: "meiryo","メイリオ","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif;*/
font-family: "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", Georgia, "ＭＳ Ｐ明朝", "MS PMincho", serif;

font-size: 16px;
font-weight: 300;
line-height: 1.5;
color: #333;
/*background: #000;*/
}
.sp{display:none;}
.pc{display:block;}
@media screen and (max-width:768px){
.sp{display:block;}
.pc{display:none;}
}
.b{font-weight: bold;}
.s07{font-size: 0.7em;}
.s09{font-size: 0.9em;}
.s18{font-size: 1.8em;}
.r180 {transform: rotate(180deg);}
.flip{transform: scale(-1, 1);}
.block{display: block;}
ol, ul {list-style: none;padding: 0;}
ul li{margin-bottom: 0.3em;}
ul.list li{
list-style-type: disc;
margin-left: 1em;
margin-bottom: 0.3em;
}
ul.disc_list{margin-top: 0.5em;}
ul.disc_list li{
list-style-type: disc;
margin-left: 1em;
}

/* マージン・パディング ------------------------------------------*/
.mt10{margin-top:1em !important;}
.mt15{margin-top:1.5em !important;}
.mb5{margin-bottom:0.5em !important;}
.mb10{margin-bottom:1em !important;}
.mb15{margin-bottom:1.5em !important;}
.mb20{margin-bottom:2em !important;}
.m-auto {margin:0 auto !important;}

/* パディング ------------------------------------------*/
.p5{padding: 5px !important;}
.p-1em{padding:1em !important;}
.pt10{padding-top: 1em !important;}
.pt20{padding-top: 2em !important;}
.pb10{padding-bottom: 1em !important;}
.pb20{padding-bottom: 2em !important;}
.pl-15 {padding-left: 15px;}
.pl-50 {padding-left: 50px;}

/*header -----------------------------------------------------------------*/
header{
width: 100%;
height: 60px;
position: fixed;
top: 0;
z-index: 10;
background: #000;
}
.logo_asakusa{
width: 1100px;
margin: 0 auto;
padding: 4px 2em;
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.link_logo{
display: flex;
align-items: center;
margin-top: 4px;
}
.link_logo img{width: 46px;}
.link_logo p{
color: #fff;
font-weight: bold;
font-size: 1.2em;
margin-left: 0.5em;
}

.header_wrap{
width: 100%;
position: relative;
background: #dcdcdc;
margin-top: 60px;
}
.swiper{
width: 100%;
height: 600px;
}
.swiper-wrapper{
width: 100%;
height: 600px;
}
.swiper-slide{height: 600px;position: relative;}
.swiper-slide img{
max-width: unset;
position: absolute;
transform: translate(-50%, -50%);
min-width: 1000px;
}

.swiper-slide img.slide_img01 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img02 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img03 {width: 100%;top: 50%;left: 50%;}
.swiper-slide img.slide_img04 {width: 100%;top: 50%;left: 50%;}


.title_wrap{
position: absolute;
height: 400px;
z-index: 2;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
opacity: 0;

/* アニメーション */
animation: fadeIn 3s linear;
animation-fill-mode: both;
}
.title_wrap h1{
font-size: 1.6em;
text-align: center;
color: #fff;
}
.title_wrap img{max-height: 100%;}

@keyframes fadeIn{
0%{opacity: 0;}
40%{opacity: 0;}
100%{opacity: 1;}
}

/*Language -----------------------------------------------------------------*/
.lang_btn{width: 70px;padding-top: 6px;}
.lang_btn_co{
position: relative;
text-align: center;
}
.lang_btn label{
display: block;
line-height: 1;
cursor: pointer;
font-size: 0.8em;
color: #fff;
}
.lang_btn label i{font-size: 2em;margin-bottom: 2px;}
.lang_btn a{display: block;text-decoration: none;}
input{display: none;}
.lang_btn li{height: 0;overflow: hidden;transition: all 0.5s;}
ul#lang_lists{width: 150px;margin-top: 10px;margin-left: -57px;}
#lang_lists li{text-align: center;opacity: 0;margin-bottom: 0}
#lang_list:checked ~ 
#lang_lists li{
height: 50px;
opacity: 1;
}
#lang_lists li a{
padding: 1em;
background: rgba(0, 0, 0, 0.7);
color: #fff;
}
#lang_lists li a:hover{
opacity: 1;
background: #fff;
color: #4c4c4c;
}

/*footer -----------------------------------------------------------------*/
footer{padding: 2em 0 5.5em;}
.footer_wrap{color: #fff;}
.footer_logo{
color: #fff;
font-weight: bold;
margin: 0 auto 1em;
display: flex;
align-items: center;
}
.footer_logo img{width: 70px;}
.footer_logo p{margin-left: 0.5em;font-size: 1.4em;}
.footer_menu{
display: flex;
flex-wrap: wrap;
width: 100%;
margin-bottom: 2em;
}
.footer_menu a{
color: #fff;
margin-right: 2em;
}
.footer_wrap .footer_title{
font-size: 1.3em;
color: #fff;
border-bottom: solid 1px #666;
line-height: 1.7;
width: 100%;
margin-bottom: 0.6em;
}
.footer_wrap .footer_title a{color: #fff;}
.footer_wrap .copy{
width: 100%;
text-align: center;
font-size: 0.9em;
}

/*footer-fix -----------------------------------------------------------------*/
#shop-fix{
position: fixed;
bottom: 0;
width: 100%;
z-index: 5;
height: 70px;
}
#shop-fix ul{
display: flex;
align-items: flex-start;
padding: 0;
}
#shop-fix li{
width: calc(100% / 2);
text-align: center;
border-right: solid 1px #fff;
list-style: none;
}
#shop-fix li a{
text-align: center;
display: block;
padding: 1.0em;
color: #fff;
background: rgba(80, 45, 17, 0.9);
font-size: 22px;
font-weight: bold;
}
#shop-fix li:last-child{
border: none;
width: 75px;
padding: 0;
}
#shop-fix li i{padding-right: 0.3em;}
#shop-fix li .fa-angle-up{padding-right: 0;font-size: 1.4em;}
@media screen and (min-width: 767px) {
  a[href^="tel:"] {
    pointer-events: none;
  }
}

/*content -----------------------------------------------------------------*/
main {padding-top: 60px;}
section{
margin: 0px 0 3em;
padding: 2em 0;
}
.bg_dc{background: #f4ece1;}
.bg_f1{background: #f1f1f1;}
.bg_b{background: #000;}
.header_sub{
text-align: center;
padding: 2em 0 2em;
position: relative;
overflow: hidden;
height: 170px;
background: #000;
}
.header_sub h1{
font-size: 2em;
}
.header_sub .content {
position: absolute;
color: #fff;
transform: translate(-50%, -50%);
top: 50%;
left: 50%;
z-index: 1;
}
.header_sub_img {
position: absolute;
transform: translate(-50%, -50%);
max-width: unset !important;
width: 102%;
filter: blur(4px);
opacity: 0.8;
}
.content{
width: 1100px;
margin: 0 auto ;
padding: 0 2em;
display: flex;
flex-wrap: wrap;
}
.content h2{
width: 100%;
text-align: center;
font-size: 1.8em;
margin-bottom: 1em;
}
.content h3{
width: 100%;
font-size: 1.5em;
border-bottom: 1px solid;
margin: 0.5em 0;
}
.content h4{
width: 100%;
font-size: 1.2em;
margin: 0.3em 0;
}

.top_info{text-align: center;}
.top_info p{
margin-bottom: 1em;
width: 100%;
font-size: 1.2em;
}
.reserve_btn{
width: 400px;
margin: 1.5em auto 1em;
}
.reserve_btn a{
font-size: 1.3em;
font-weight: bold;
display: block;
background: #502d11;
color: #fff;
text-align: center;
padding: 0.7em;
border-radius: 10px;
}

.img_wrap{justify-content: space-between;}
.asakusa_img{
width: calc(100% / 3 - 10px);
margin: 0 5px 10px;
}
.insta_wrap{margin-bottom: 0em;}
.insta_wrap h2,
.about_use_wrap h2{
width: 100%;
text-align: center;
color: #502d11;
font-size: 2em;
margin-bottom: 0.5em;
}
.insta_wrap h2 i,
.about_use_wrap h2 i{margin-right: 0.3em;}
.insta_wrap p{
text-align: center;
width: 100%;
line-height: 1.9;
}
.insta_wrap p i{margin-left: 0.3em;}
.insta_btn_wrap{
margin: 2em auto 1em;
text-align: center;
width: 50%;
}
.insta_btn_wrap a{
font-size: 1.5em;
background: #502d11;
color: #fff;
font-weight: bold;
border-radius: 50px;
padding: 0.3em 0 0.2em;
display: block;
}
.insta_btn_wrap a i{margin-right: 0.3em;}
.map_wrap{
width: 100%;
height: 500px;
margin-top: -2em;
}
.shop_detail{padding-top: 1em;}
.shop_detail p{
width: 100%;
text-align: center;
font-size: 1.3em;
}
.shop_detail i{margin-right: 0.3em;}

.about_use_wrap{
margin-bottom: 0;
padding: 3em 0;
}
.about_use_wrap h2{font-size: 1.8em;}

.about_use_wrap ul{
background: #fff;
margin-top: 1em;
padding: 1.5em 1em 1em;
border-radius: 10px;
list-style: disc;
}
.about_use_wrap li{margin:0 0 0.8em 1em;}


@media screen and (max-width:768px){
/*header -----------------------------------------------------------------*/
header{height: 51px;}
.logo_asakusa{width: 100%;padding: 8px 8px 0;}
.link_logo{margin-top: 0;}
.link_logo img{width: 35px;}
.link_logo p{font-size: 1em;margin-left: 0.3em;}

.lang_btn {padding-top: 0px;margin-right: 10px;}
.lang_btn_co{height: 43px;}
.lang_btn label i{font-size: 1.7em;}
ul#lang_lists{
width: 150px;
margin-top: 0px;
margin-left: -62px;
}
a.link_lang{font-size: 0.9em;}
.header_wrap{margin-top: 51px;}
.swiper{height: 500px;}
.swiper-wrapper{height: 500px;}
.swiper-slide{height: 500px;}
.swiper-slide img{transform: none;min-width: auto;}
.swiper-slide img.slide_img01 {width: 240%; left: -70%; top: 0;}
.swiper-slide img.slide_img02 {width: 240%; left: -70%; top: 0;}
.swiper-slide img.slide_img03 {width: 240%; left: -30%; top: 0;}
.swiper-slide img.slide_img04 {width: 240%; left: -110%; top: 0;}

.title_wrap{width: 75%;height: auto;}
.title_wrap h1{font-size: 5vw;}

/*footer -----------------------------------------------------------------*/
footer{}
.footer_logo{margin: 0 auto 2em;}
.footer_logo img{width: 50px;}
.footer_logo p{font-size: 1.1em;}
.footer_menu{}
.footer_menu a{line-height: 2.5em;}
.footer_wrap .footer_title{}
.footer_wrap .copy{}

/*footer-fix -----------------------------------------------------------------*/
#shop-fix{height: 60px;}
#shop-fix ul{}
#shop-fix li{width: 43%;}
#shop-fix li a{font-size: 17px;padding: 1em 1em 1.4em;}
#shop-fix li:last-child{width: 14%;}

/*content -----------------------------------------------------------------*/
main {padding-top: 51px;}
section{margin: 0px 0 2em; padding: 1.5em 0;}
.header_sub{height: 140px;}
.header_sub h1{font-size: 1.6em;}
.header_sub .content {}
.header_sub_img {width: 120%;top: 50%;}
.content{width: 94%; padding: 0;}
.content h2{font-size: 1.5em;margin-bottom: 0.7em;}
.content h3{font-size: 1.3em}
.content h4{}
.top_info{text-align: left;}
.top_info p{font-size: 1.1em;}
.reserve_btn{width: 85%;}
.reserve_btn a{font-size: 1.2em;}
.img_wrap{}
.asakusa_img{width: calc(100% / 2 - 4px); margin: 0 2px 5px;}
.insta_wrap h2{font-size: 1.8em;}
.insta_wrap h2 i{display: block;font-size: 2em;margin: 0;}
.insta_btn_wrap{margin: 2em auto 2em;width: 90%;}
.insta_btn_wrap a{font-size: 1.3em;padding: 0.5em 0 0.3em;}
.map_wrap{height: 350px;}
.shop_detail{padding-top: 1em;}
.shop_detail p{font-size: 1.1em;}
.about_use_wrap{padding: 1.5em 0 3em;}
.about_use_wrap h2{font-size: 1.5em;}
.about_use_wrap ul{margin-top: 0em;padding: 1em 0.7em 0.5em;}
.about_use_wrap li{margin-bottom: 0.5em;}
}

/*イベント募集バナー -----------------------------------------------------------------*/
.project-bnr{width: 600px;margin: -2em auto 3em;}
@media screen and (max-width:768px){
.project-bnr{width: 90%;margin: -1em auto 4em;}
}

/*--- パンクズ ---------------------------------------------------------------------------------------------------*/
#breadcrumb{
display: flex;
flex-wrap: wrap;
padding: 0.5rem 1rem;
list-style: none;
background-color: #f0f0f0;
}
#breadcrumb ul{
width: 1100px;
margin: 0 auto;
padding: 0 2em;
}
#breadcrumb li{
display: inline;
list-style: none;
font-size: 0.9em;
}
#mainNav .fa-home,
#breadcrumb .fa-home{
margin-right: 0.3em !important;
}
#breadcrumb li:after {content: '>';/* >を表示*/ }
#breadcrumb li:last-child:after {content: '';/* last >を非表示*/}
#breadcrumb li:last-child a{ /* last リンク切る*/
pointer-events: none;
color: #333;
}
@media (max-width: 768px) {
#breadcrumb{padding: 0.2rem 0.5rem;line-height: 1.4em;}
#breadcrumb ul{
width: 100%;
overflow: auto;
word-break: keep-all;
white-space: nowrap;
padding: 0 5px;
}
#breadcrumb li{font-size: 0.8em;}
}

