img {
image-rendering: -webkit-optimize-contrast;

}

body.home,
body.interview,
body.gourmet,
body.shop,
body.map
 {
 font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  width:100%;
  height: 100%;
  background-color:#b8a591;
color:#0e0c0b;
}

body.toshi{background:url(bg.jpg) repeat;}


a{text-decoration:none;color:#735026;}
.header {
  position: absolute;
  padding: 20px;
}

.hamburger {
  position: fixed;
  top: 15px;
  left: 15px;
  z-index: 100;
  width: 48px;
  height: 48px;
border:0;
  background: rgba(51, 51, 51, 0.3);
  cursor: pointer;
}

.hamburger__line {
  position: fixed;
  left: 25px;
  top: 30px ;
  width: 26px;
  height: 2px;
  background-color: #f5f5f5;

  transition: all .4s;
}

.hamburger__line:nth-of-type(1) {
  top: 29px;
}
.hamburger__line:nth-of-type(2) {
  top: 38px;
}
.hamburger__line:nth-of-type(3) {
  top: 47px;
}

/* メニューオープン時 */
.hamburger.active .hamburger__line:nth-of-type(1) {
  transform: translateY(9px) rotate(-45deg);
left:350px;background-color: #ddd ;
}
.hamburger.active .hamburger__line:nth-of-type(2) {
  opacity: 0;
}
.hamburger.active .hamburger__line:nth-of-type(3) {
  transform: translateY(-9px) rotate(45deg);
left:350px; background-color: #ddd ;
}
.hamburger.active {
  background: rgba(51, 51, 51, 0.0); 
}
.nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 350px;
  height: 100vh;
  background-color: rgba(255,255,255,0.9);
  box-shadow: 2px 0 4px rgba(0,0,0,.1);
  transform: translateX(-100%);
  transition: transform .4s;
  z-index: 90;
overflow-y: scroll;
}

.nav.active {
  transform: translateX(0);
}

.nav__list {
  margin: 0;
  padding: 100px 0 0;
  list-style: none;
}

.nav__item {
  padding: 0 20px;
}
.nav__item.kakoi img {
padding:10px;
  border:1px #333 solid;
margin-bottom:0px;
}
.nav__link {
  display: block;
  padding: 8px 0;
  color: #333;
  text-decoration: none;
  border-bottom: 1px solid #eee;
}
.nav__item img{width:300px;height:auto;max-width100%;}



@media screen and (max-width:680px){
/* メニューオープン時 */
.hamburger.active .hamburger__line:nth-of-type(1) {
left:250px;background-color: #666 ;
}
.hamburger.active .hamburger__line:nth-of-type(3) {
left:250px;background-color: #666 ;
}

.nav {
  width: 250px;
max-width:100%;
}
.nav__item {
  padding: 0 8px;
}
.nav__item img{width:220px;height:auto;max-width:100%;}

}



.container {
  position: absolute;
top:70%;
left:11%;
  width: 24px;
  height: 24px;
}

.chevron {
  position: absolute;
  width: 28px;
  height: 8px;
  opacity: 0;
  transform: scale3d(0.5, 0.5, 0.5);
  animation: move 3s ease-out infinite;
}

.chevron:first-child {
  animation: move 3s ease-out 1s infinite;
}

.chevron:nth-child(2) {
  animation: move 3s ease-out 2s infinite;
}

.chevron:before,
.chevron:after {
  content: ' ';
  position: absolute;
  top: 0;
  height: 100%;
  width: 51%;
  background: #fff;
}

.chevron:before {
  left: 0;
  transform: skew(0deg, 30deg);
}

.chevron:after {
  right: 0;
  width: 50%;
  transform: skew(0deg, -30deg);
}

@keyframes move {
  25% {
    opacity: 1;

  }
  33% {
    opacity: 1;
    transform: translateY(30px);
  }
  67% {
    opacity: 1;
    transform: translateY(40px);
  }
  100% {
    opacity: 0;
    transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
  }
}

.text {
  display: block;
  margin-top: 75px;
  margin-left: -30px;
  font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
  font-size: 12px;
  color: #fff;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: .25;
  animation: pulse 2s linear alternate infinite;
}

@keyframes pulse {
  to {
    opacity: 1;
  }
}


/*内部ページ要素*/
.wrap{width:100%;}

.main{
width:1400px;max-width:100%;margin:0 auto 10vh;background:#f1f1f1;border-right:5px solid #ddd;border-left:5px solid #ddd;padding:0 40px 100px;
}
.main_in{padding:30px 0;line-height:180%;font-size:0.9rem;font-weight:300;}
.main img{max-width:100%;}

h3{line-height:250%;font-size:140%;color:#14872c;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}
.mb60{margin-bottom:60px;}
.mb70{margin-bottom:70px;}
.pt0{padding-top:0px;}
.pt1{padding-top:1px;}
.pt10{padding-top:10px;}
.pt20{padding-top:20px;}
.pt30{padding-top:30px;}
.pb20{padding-bottom:20px;}
.pb30{padding-bottom:30px;}
.alignright{text-align:right;}
b{font-weight:bold;}
.clear{clear:both;}
img.fl{float:left;margin-right:20px;max-width:35%;}
.aligncenter{display:block;margin:70px auto 90px;}
img.aligncenter0{display:block;margin:0px auto 0px;}
img.aligncenter1{display:block;margin:90px auto 40px;}
.text-13{font-size:13px;line-height:160%;margin-top:0;}
.oya-d div .text-12{font-size:12px;line-height:140%;margin-top:0;}
.oya-d div h4{line-height:120%;margin-top:0;margin-bottom:10px;}
.text-11{font-size:11px;line-height:170%;margin-top:0;}
.text-12{font-size:12px;line-height:160%;}
.text-small{font-size:10px;line-height:160%;}
h3 span.text-small{display:block;font-size:10px;line-height:110%;margin-bottom:30px;}
.shop h3 span.text-small{display:block;font-size:13px;line-height:100%;margin-bottom:15px;}
.shop .oya-e h3 {font-size:16px;}
.shop h3 {line-height:180%;margin-top:0px;}
.shop h3 span.t-small{display:inline-block;font-size:13px;line-height:100%;}
.waku{border:1px solid #0e0c0b;padding:10px;margin-bottom:20px;}
.waku700{width:700px;max-width:100%;border:1px solid #0e0c0b;padding:10px;margin-bottom:20px;}
.oya {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:50% 50%;
margin:50px 0;
}
.oya .box-1{
     grid-column:1 / 2;
     grid-row:1 / 3;
padding:15px;
background:#fff;
}
.oya .box-2{
     grid-column:2 / 3;
     grid-row:2 / 3;
padding:15px;

}
.oya .box-2 img{float:left;width:40%;margin-right:15px;}
.oya .box-3{
     grid-column:2 / 3;

padding:15px;
background:#f1f1f1;
}
.oya .box-3 img{float:left;width:40%;margin-right:15px;}
.oya p{margin-top:15px;}

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

.oya_0 {
width:100%;
display:block;
margin:50px 0;
}
.oya .box-10{
display:block;
width:100% !important;
padding:15px;
background:#fff;
}

.oya .box-20{
width:100%;
display:block;
}

img.fl{max-width:100%;display:block;margin-bottom:20px;}



}




.oya-a {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:28% 36% 36%;
margin:0;
}
.oya-a .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 15px 0 0px;
}
.oya-a .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 15px 0;
}
.oya-a .box-3{
     grid-column:3 / 4;
     grid-row:1 / 2;
padding:10px 15px 0 0;

}

.oya-b {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:50% 50%;
margin:0px;
}
.oya-b .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 15px 0;
}
.oya-b .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 15px 0;
}


.shop .oya-b {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:50% 50%;
margin:0px;
}
.shop .oya-b .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 10px 0 0;
}
.shop .oya-b .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 0px 0 10px;
}
.shop .oya-b .oya-b .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:0px 10px 10px 0;
}
.shop .oya-b .oya-b .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:0px 0px 10px 10px;
}
.oya-bb{display:block;overflow:hidden;}


.mh120{min-height:110px;}

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

.mh120{min-height:50px;}

.oya_b0 {
width:100%;
display:block;
margin:50px 0;
}
.oya_b0 .box-10{
display:block;
width:100% !important;
background:#fff;
}

.oya-b0 .box-20{
width:100%;
display:block;
}

.shop .oya-b .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 5px 10px 5px;
}
.shop .oya-b .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 5px 10px 5px;
}
.shop .oya-b .oya-b .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 5px 10px 5px;
}
.shop .oya-b .oya-b .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 5px 10px 5px;
}

}






.oya-c {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:33.33% 33.33% 33.33%;
margin:0px;
}
.oya-c .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 15px 30px;
}
.oya-c .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 15px 30px;
}
.oya-c .box-3{
     grid-column:3 / 4;
     grid-row:1 / 2;
padding:10px 15px 30px;
}
.oya-c .box-4{
     grid-column:1 / 2;
     grid-row:2 / 3;
padding:10px 15px 30px;
}
.oya-c .box-5{
     grid-column:2 / 3;
     grid-row:2 / 3;
padding:10px 15px 30px;
}
.oya-c .box-6{
     grid-column:3 / 4;
     grid-row:2 / 3;
padding:10px 15px 30px;
}
.oya-c .box-7{
     grid-column:1 / 2;
     grid-row:3 / 4;
padding:10px 15px 30px;
}
.oya-c .box-8{
     grid-column:2 / 3;
     grid-row:3 / 4;
padding:10px 15px 30px;
}
.oya-c .box-9{
     grid-column:3 / 4;
     grid-row:3 / 4;
padding:10px 15px 30px;
}
.oya-c .box-10{
     grid-column:1 / 2;
     grid-row:4 / 5;
padding:10px 15px 30px;
}
.oya-c .box-11{
     grid-column:2 / 3;
     grid-row:4 / 5;
padding:10px 15px 30px;
}
.oya-c .box-12{
     grid-column:3 / 4;
     grid-row:4 / 5;
padding:10px 15px 30px;
}
.oya-c .box-13{
     grid-column:1 / 2;
     grid-row:5 / 6;
padding:10px 15px 30px;
}
.oya-c .box-14{
     grid-column:2 / 3;
     grid-row:5 / 6;
padding:10px 15px 30px;
}
.oya-c .box-15{
     grid-column:3 / 4;
     grid-row:5 / 6;
padding:10px 15px 30px;
}
.oya-c .box-16{
     grid-column:1 / 2;
     grid-row:6 / 7;
padding:10px 15px 30px;
}
.oya-c .box-17{
     grid-column:2 / 3;
     grid-row:6 / 7;
padding:10px 15px 30px;
}
.oya-c .box-18{
     grid-column:3 / 4;
     grid-row:6 / 7;
padding:10px 15px 30px;
}

.oya-c .box-19{
     grid-column:1 / 2;
     grid-row:7 / 8;
padding:10px 15px 30px;
}
.oya-c .box-20{
     grid-column:2 / 3;
     grid-row:7 / 8;
padding:10px 15px 30px;
}
.oya-c .box-21{
     grid-column:3 / 4;
     grid-row:7 / 8;
padding:10px 15px 30px;
}



.oya-d {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:50% 50%;
margin:0px;
align-items: end; 
}
.oya-d .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 5px 0 0;
}
.oya-d .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 0 0 5px;
}
.oya-d .box-3{
     grid-column:1 / 2;
     grid-row:2 / 3;
padding:10px 5px 0 0;
}
.oya-d .box-4{
     grid-column:2 / 3;
     grid-row:2 / 3;
padding:10px 0 0 5px;
}
.oya-d .box-5{
     grid-column:1 / 3;
     grid-row:3 / 4;
padding:10px 5px 5px 0;
}


.oya-d div p{margin-bottom:7px;}



.oya-e {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:25% 25% 25% 25%;
margin:0px;

}
.oya-e .box-1{
     grid-column:1 / 2;
     grid-row:1 / 2;
padding:10px 10px 0 0;
}
.oya-e .box-2{
     grid-column:2 / 3;
     grid-row:1 / 2;
padding:10px 5px 0  5px;
}
.oya-e .box-3{
     grid-column:3 / 4;
     grid-row:1 / 2;
padding:10px 5px 0 5px;
}
.oya-e .box-4{
     grid-column:4 / 5;
     grid-row:1 / 2;
padding:10px 0px 0 10px;
}




@media screen and (max-width:840px){
.oya-e {
     display:block;
width:100%;
display:block;
}
.oya-e .box-1{
display:block;
width:100% !important;
padding:15px;
}
.oya-e .box-2{
display:block;
width:100% !important;
padding:15px;
}
.oya-e .box-3{
display:block;
width:100% !important;
padding:15px;
}
.oya-e .box-4{
display:block;
width:100% !important;
padding:15px;
}


}




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

.gourmet .oya-d {
     display:block;
width:100%;
margin:0px;
}
.gourmet .oya-d .box-1,
.gourmet .oya-d .box-2,
.gourmet .oya-d .box-3,
.gourmet .oya-d .box-4,
.gourmet .oya-d .box-5{
      display:block;
width:100%;
padding:10px;
}

.gourmet .oya-c {
     display:block;
width:100%;
margin:0px;
}
.gourmet .oya-c .box-1,
.gourmet .oya-c .box-2,
.gourmet .oya-c .box-3{
      display:block;
width:100%;
padding:10px;
}



.shop .oya-d {
     display:block;
width:100%;
margin:0px;
}
.shop .oya-d .box-1,
.shop .oya-d .box-2,
.shop .oya-d .box-3,
.shop .oya-d .box-4,
.shop .oya-d .box-5{
      display:block;
width:100%;
padding:10px;
}


}

@media screen and (max-width:680px){
.shop .oya-b {
     display:block;
width:100%;
margin:0px;
}
.shop .oya-b .box-1,
.shop .oya-b .box-2{
      display:block;
width:100%;
padding:10px;
}

}




@media screen and (max-width:920px){
.main{
border-right:0px;border-left:0px;padding:0 25px;
}
.main_in{padding:30px 0px 30px;line-height:180%;font-size:0.9rem;font-weight:300;}


}

/*内部ページ要素*/





/*ラッパー要素*/
.wrapper{padding:0;
	display: flex;
	justify-content: space-between;
	position: relative;
}
/*コンテンツのブロック*/
.wrapper .contents{ width: 50vw; padding-left:10%;}
.wrapper .contents div.scroll-box02{padding-top: 70vh;}
.wrapper .contents div.scroll-box03{padding-top: 70vh;}
.wrapper .contents div.scroll-box04{padding-top: 70vh;}
.wrapper .contents div.scroll-box05{padding-top: 70vh;}
.wrapper .contents div.scroll-box06{padding-top: 70vh;}

.wrapper .contents div.scroll-box01{ padding-top: 5vh;padding-bottom:20vh;}
.wrapper .contents div.scroll-box01 img.mh100{margin-left:30%;}



.wrapper .contents div.sato1{ padding-bottom:100px; }
/*画像のブロック*/
.wrapper .images{
	width: 50vw;
	height: 100vh;
	display: flex;
	align-items: center;
	position: sticky;
	position: -webkit-sticky;
	top:0;
}
.wrapper .images p {
	height: 100%;
	margin: auto;
	display: block;
	visibility: hidden;
	/* 画像が透過pngの時は背景色が必要です */
	background: #f1f1f1;
	position: absolute;
	top: 0;
	bottom: 0;
	/* フェード速度 */
	transition: .8s !important;
	opacity: 0;
}


.wrapper .images p img{max-width:100%; }

.wrapper .images p:first-child,
.wrapper .images p.active {
	visibility: visible;
	opacity: 1;
}

.atention{margin-top:40px;font-size:0.8rem;color:#fff;font-weight:300;padding-right:30px;}
.unei{margin-top:300px;padding-bottom:100px;color:#fff;font-weight:300;}

.foot{padding-top:0px;padding-bottom:40px;text-align:center !important;margin:0 auto 40px;border-bottom:1px solid #ccc;}
.copy{padding-top:100px;padding-bottom:15px;text-align:center !important;margin:0 auto;}
.copy img{max-width:40%;margin:0 auto;width:600px;}
.home .copy{padding-top:100px;padding-bottom:15px;width:100%;text-align:left !important;}
.home .copy img{max-width:90%;width:400px;margin:0;}


@media screen and (max-width:1400px){
.wrapper .contents{ width: 50vw; padding-left:6%;}

/*画像のブロック*/
.wrapper .images{
	width: 50vw;}

.wrapper .images p img
{width:100%;height:100%;object-fit:cover; }
}

@media screen and (max-width:1160px){
.wrapper .images p{overflow:hidden;}
.wrapper .images p img{width:100%;height:100%;object-fit:cover; }

}

@media screen and (min-width:921px){
.wrapper1{display:none;}
.sm{display:none;}
}
@media screen and (max-width:920px){
.wrapper{display:none;}
.pc{display:none;}
.container {display:none;}
.wrapper1 .contents div {margin-top:0px; padding-top:0px !important;padding-bottom:0px !important;}
.wrapper1 .contents img.w300{width:300px; max-width:80%;margin:20px auto 0px !important;padding-bottom:0px !important;}
.wrapper1 .contents img.w300.mt50{width:300px; max-width:80%;margin:120px auto 0px !important;padding-bottom:0px !important;}
.scroll-space{
width:300px;height:20px;
  box-sizing: border-box;
  padding: 0px;
margin:0 auto;
}
.scroll-space .slidein{margin-top:0px!important; padding-top:0px !important;}

.copy img{max-width:80%;margin:auto;}
.home .copy{padding:0 11%;text-align:center;margin-bottom:15px;}
.home .copy img{max-width:80%;margin:auto;}

.atention{width:300px;margin:0 auto;font-size:11px;color:#f5f5f5;font-weight:200;}
.unei{width:300px;margin:200px auto 150px;font-size:12px;color:#f5f5f5;font-weight:300;}

.wrapper1 .contents div.pb150{padding-bottom:150px !important;}
h3{line-height:200%;font-size:120%;}

.oya {
     display:grid;
     grid-template-rows:auto auto auto;
     grid-template-columns:50% 50%;
margin:50px 0;
}

.oya .box-2 img{float:none;width:100%;margin-right:0px;display:block;}
.oya .box-3 img{float:none;width:100%;margin-right:0px;display:block;}



}



/*アニメ*/

.scroll-space{
  box-sizing: border-box;
  padding-top: 30px;
  height: 60px;

}
.scroll-space2{
  box-sizing: border-box;
  padding-top: 10px;
  height: 160px;
  overflow: hidden;
}

@media screen and (max-width:680px){
.scroll-space2{
  padding-top: 20px;
}
}

.scroll-space3{
  box-sizing: border-box;
  padding-top: 10px;
  overflow: hidden;
}

.scroll-space4{
  box-sizing: border-box;
  padding-top: 10px;
  overflow: hidden;
}
.slidein {
    opacity: 0;
    transform: translate(0,0);
    transition: all 0.5s;
  &.slidein-left{
      transform: translate(-100%,0);
  }
  &.slidein-right{
      transform: translate(100%,0);
  }
  &.slidein-up{
      transform: translate(0,-100%);
  }
  &.slidein-bottom{
      transform: translate(0,100%);
  }
  &.scrollin{
    transform: translate(0, 0)!important;
    opacity: 1!important;
  }
}

/*ここまでアニメ*/


/*blur*/
.blur-box{
  animation-name: blur;
  animation-duration: 1.3s;
  animation-fill-mode:none;
  animation-iteration-count: 1;

}

@keyframes blur{
  from {
    filter: blur(10px);
  }

  to {
    filter: blur(0) drop-shadow(5px 5px 5px rgba(97, 54, 25,0.5));
    transform: scale(1);
  }
}
/*ここまでblur*/



/*to top*/
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 12px;
  line-height: 1;
  z-index: 99;
}
#page-top a {
  background: #4e4e4e;
  text-decoration: none;
  color: #fff;
  width: 60px;
  padding: 23px 5px;
  text-align: center;
  display: block;
  border-radius: 90px;
  opacity: 0.8;
  transition: all .3s ease;
}
#page-top a:hover {
  text-decoration: none;
  opacity: .5;
}
/*ここまでtotop*/
