/* CSS Document */
@keyframes title_deco{
  0%{
    opacity:0;
    transform: translateY(100%);
  }
  100%{
    opacity:1;
    transform: translateY(0);
  }
}
@keyframes title{
  0%{
    opacity:0;
    transform: translateY(100%);
  }
  100%{
    opacity:1;
    transform: translateY(0);
  }
}
@keyframes up01{
  0%{
    opacity:0;
    transform: translateY(3rem);
  }
  100%{
    opacity:1;
    transform: translateY(0);
  }
}
/*コンテンツタイトル*/
div.title.wcvisible > p span:nth-of-type(1){
  animation: title_deco 800ms ease forwards;
}
div.title.wcvisible > p span:nth-of-type(2){
  animation: title_deco 800ms ease 200ms forwards;
}
div.title.wcvisible > p span:nth-of-type(3){
  animation: title_deco 800ms ease 300ms forwards;
}
div.title.wcvisible > p span:nth-of-type(4){
  animation: title_deco 800ms ease 400ms forwards;
}
div.title.wcvisible > h1{
  animation: title 800ms ease forwards;
}

body{
  font-family: "Noto Sans JP";
}
/*タイトル*/
div.title{
  flex-direction: column-reverse;
  display: flex;
  margin-bottom: 1.5rem;
}
div.title.left{
  padding-left: 2rem;
  box-sizing: border-box;
  align-items: flex-start; 
}
div.title > h1{
  font-size: 1.2rem;
  color: #29221a;
  opacity: 0;
  text-align: center;
  font-weight: 700;
}
div.title > p{
  display: flex;
  justify-content: center;
}
section.news div.title > p{
  flex-direction: column;
  width: 2.8rem;
}
div.title > p span{
  color: #29221a;
  font-size: 2.8rem;
  line-height: 1em;
  padding-bottom: 0.5rem;
  font-family: "Gothic";
  font-weight: 700;
  opacity: 0;
}
div.title > p span.margin{
  margin-left: 1rem
}
body[wc-view-type="tb-l"] div.title > p span,
body[wc-view-type="pc"] div.title > p span{
  font-size: 3.5rem;
}

/*ページタイトル*/
section.page_title{
  position: relative;
  z-index: 1;
  background-color: #fff;
  margin-top: 0 !important;
  display: flex;
}
body[wc-view-type="sp"] section.page_title{
  flex-direction: column;
}
body[wc-view-type="sp"] section.page_title div.title{
  margin-bottom: 1rem;
  padding-top: 1.5rem;
}
body:not([wc-view-type="sp"]) section.page_title div.title{
  justify-content: center;
}
body[wc-view-type="pc"] section.page_title div.title{
  margin-left: calc((100vw - 1100px) / 2);
}
section.page_title::before{
  content: "";
  position: absolute;
  left: 0;
  background-color: #f2ece0;
  z-index: -1;
}
body[wc-view-type="sp"] section.page_title::before{
  right: 0;
  height: 50vw;
  top: 0.5rem;
  border-radius: 0 5rem 0 0;
}
body[wc-view-type="tb"] section.page_title::before{
  right: 0;
  height: 30vw;
  top: 1rem;
  border-radius: 0 5rem 0 0;
}
body[wc-view-type="tb-l"] section.page_title::before{
  right: 2rem;
  height: 25vw;
  top: 1rem;
  border-radius: 0 5rem 0 0;
}
body[wc-view-type="pc"] section.page_title::before{
  right: calc((100vw - 1100px + 4rem) / 2);
  height: 225px;
}
body[wc-view-type="sp"] section.page_title div.title.sp_left{
  padding-top: 1.5rem;
  margin-bottom: 1rem;
}
body[wc-view-type="tb-l"] section.page_title div.title.sp_left,
body[wc-view-type="tb"] section.page_title div.title.sp_left{
  justify-content: center;
}
body[wc-view-type="sp"] section.page_title figure{
  width: calc(100vw - 2rem);
  margin-left: auto;
  margin-right: 0;
  height: 50vw;
}
body[wc-view-type="tb"] section.page_title figure{
  margin-top: var(--headerHeight);
  width: 50vw;
  margin-left: auto;
}
body[wc-view-type="tb-l"] section.page_title figure{
  margin-right: 4rem;
  height: 30vw;
  width: 50vw;
  margin-left: auto;
  margin-top: var(--headerHeight);
}
body[wc-view-type="pc"] section.page_title figure{
  width: 550px;
  height: 280px;
  margin-top: var(--headerHeight);
  margin-right:  calc((100vw - 1100px) / 2);
  margin-left: auto;
}
section.page_title figure picture{
  width: 100%;
  height: 100%;
  display: block;
}
section.page_title figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 0 0 5rem;
}

/*メニューコンテンツ*/
div.menu{
  width: 100vw;
  background-color: #fff;
  padding: var(--headerHeight) 0;
}
div.menu > p{
  text-align: center;
  font-size: 0.97em;
  line-height: 1.8rem;
  margin-bottom: 2rem;
}
body[wc-view-type="sp"] div.menu > p{
  text-align: left;
  padding: 0 2rem;
  box-sizing: border-box;
}
body[wc-view-type="tb"] div.menu > p{
  padding: 0 3rem;
  box-sizing: border-box;
}

.swipemainbtn.wcsticky{
  margin: 0 auto;
}
body[wc-view-type="sp"] .swipemainbtn.wcsticky {
  width: 100vw;
}
body[wc-view-type="sp"] .wcsetend {
  width: 100vw;
}
body[wc-view-type="tb"] .swipemainbtn.wcsticky {
  width: 100vw;
}
body[wc-view-type="tb"] .wcsetend {
  width: 100vw;
}
body[wc-view-type="tb-l"] .swipemainbtn.wcsticky {
  width: 100vw;
}
body[wc-view-type="tb-l"] .wcsetend {
  width: 100vw;
}
body[wc-view-type="pc"] .swipemainbtn.wcsticky {
  width: 1100px;
  margin: 0 auto;
}
body[wc-view-type="pc"] .wcsetend {
  width: 1100px;
  margin: 0 auto;
}
[swipemenu][menu-type="tab"]{
  background-color: #fff !important;
}
[swipemenu][menu-type="tab"][change-add="false"] .swipemenuinner [swipemenu-target].wcactive{
  background-color: #753815 !important;
}
[swipemenu][menu-type="tab"] .swipemenuinner [swipemenu-target]:not(.wcactive):not(.nonetarget){
  background-color: #f2ece0 !important;
  color: #753815 !important;
}
[swipemenu][menu-type="tab"][change-add="false"] .swipemenuinner [swipemenu-target].wcactive::before{
  background-color: #753815 !important;
}
 [swipemenu][menu-type="tab"] .swipemenuinner [swipemenu-target]:not(.wcactive):not(.nonetarget)::before{
   background-color: #f2ece0 !important;
}
[swipemenu][menu-type="tab"]::after{
  background-color: #753815 !important;
}
div.menu div.menu_inner{
  margin-top: 2rem;
  box-sizing: border-box;
}
body:not([wc-view-type="sp"]) div.menu div.menu_inner{
  display: flex;
  flex-wrap: wrap;
}
body[wc-view-type="sp"] div.menu div.menu_inner{
  width: 100vw;
  padding: 0 1rem;
}
body[wc-view-type="tb"] div.menu div.menu_inner{
  width: 100vw;
  padding: 0 1rem;
}
body[wc-view-type="tb-l"] div.menu div.menu_inner{
  width: 100vw;
  padding: 0 2rem;
}
body[wc-view-type="pc"] div.menu div.menu_inner{
  width: 1100px;  
  margin: 0 auto;
  padding: 2em 1rem 0 1rem;
  box-sizing: border-box
}
div.menu div.menu_inner article{
  position: relative;
  z-index: 1;
  background-color: #f2ece0;
  border-radius: 2rem;
}
body[wc-view-type="sp"] div.menu div.menu_inner article{
  width: 100%;
  margin-bottom: 1rem;
}
body[wc-view-type="tb"] div.menu div.menu_inner article,
body[wc-view-type="tb-l"] div.menu div.menu_inner article,
body[wc-view-type="pc"] div.menu div.menu_inner article{
  width: calc((100% / 3) - 2rem);
  margin: 0 1rem 2rem 1rem;
}
div.menu div.menu_inner article div.menu_text{
  padding: 1rem;
  box-sizing: border-box;
}
body[wc-view-type="sp"] div.menu div.menu_inner article div.menu_text{
  padding-left: calc(35vw + 1.75rem);
  height: calc(35vw + 1.5rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
body[wc-view-type="tb"] div.menu div.menu_inner article div.menu_text{
  padding-top: calc(160px + 1rem);
}
body[wc-view-type="tb-l"] div.menu div.menu_inner article div.menu_text,
body[wc-view-type="pc"] div.menu div.menu_inner article div.menu_text{
  padding-top: calc(240px + 1rem);
}
div.menu div.menu_inner article div.menu_text > h1{
  font-size: 1rem;
  font-weight: 700;
  color: #29221a;
  margin-bottom: 0.5rem;
  text-align: center;
}
body[wc-view-type="sp"] div.menu div.menu_inner article div.menu_text > h1{
  text-align: left;
}
div.menu div.menu_inner article div.menu_text > p.money{
  font-size: 1.8rem;
  font-weight: 700;
  color: #29221a;
  text-align: center;
  line-height: 1em;
  font-family: "Number";
}
body[wc-view-type="sp"] div.menu div.menu_inner article div.menu_text > p.money{
  text-align: right;
  padding-top: 0.75rem;
}
div.menu div.menu_inner article div.menu_text > p.money span{
  font-size: 0.95rem;
  font-weight: 700;
  color: #29221a;
}
div.menu div.menu_inner article figure{
  position: absolute;
  z-index: 2;
}
body[wc-view-type="sp"] div.menu div.menu_inner article figure{
  top: 0;
  left: 0;
  bottom: 0;
  width: 40vw;
}
body:not([wc-view-type="sp"]) div.menu div.menu_inner article figure{
  top: 0;
  left: 0;
  right: 0;
}
div.menu div.menu_inner article figure picture{
  width: 100%;
  height: 100%;
  display: block;
}
div.menu div.menu_inner article figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
body[wc-view-type="sp"] div.menu div.menu_inner article figure img{
  height: 100%;
  border-radius: 2rem;
}
body[wc-view-type="tb"] div.menu div.menu_inner article figure img{
  height: 160px;
  border-radius: 2rem 2rem 0 0;
}
body[wc-view-type="tb-l"] div.menu div.menu_inner article figure img,
body[wc-view-type="pc"] div.menu div.menu_inner article figure img{
  height: 240px;
  border-radius: 2rem 2rem 0 0;
}
div.menu div.menu_inner article a{
  position: absolute;
  top:0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  display: block;
}
div.menu div.menu_inner article a span{
  width: 0;
  height: 0;
  opacity: 0;
}