@charset "UTF-8";
/* CSS Document */


html{
font-size: 62.5%;/*デフォ16px x 62.5%=10px*/
-webkit-text-size-adjust: 100%;
font-family: helvetica, arial, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
font-feature-settings: "pkna" 1;
font-weight: 300;
scroll-behavior: smooth;
}
body{
background-color: white;
font-size: 1.6rem;/*デフォに戻す*/
color:#594b3c;
 @extend html;
}
h1, h2, h3, h4, h5, h6, strong {
@extend html;
font-family: helvetica, arial, "游ゴシック体", YuGothic, "Yu Gothic Medium", sans-serif;
font-weight: 700;
}
a{
color: #594b3c;
text-decoration: none;
cursor: pointer;
}
li{
 text-decoration: none;
 list-style-type:none;
}
p{
line-height: 1.8;
}
img{
max-width: 100%;
height: auto;/*画像のレスポンシブ対応*/
}
.img-sp{
display: none;
}
.navmenu, .navmenu-kasou{
display: none;
}
.spbr{
display: none;
}


/*fadein*/
 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}
.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}

 /*--------------------
 *top header
 --------------------*/
.top-header{
position: fixed;
height:50px;
top: 0;
z-index: 200;
transition: .3s;
width:100%;
text-align: center;
margin:0 auto;
}
.top-header-inner{
display: flex;
align-items: center;/*垂直方向中央揃え*/
justify-content: space-between;
height:50px;
padding: 0 10%;
margin: 0 auto;
}
.header-logoimg {
width: 15%;
}
.top-header-inner img:nth-of-type(2){
display: none;/*緑色のロゴは一旦隠しておく*/
}
.header-menus-wrapper{
display:flex;
}
.header-menus{
display: flex;
margin-left:40px;
}

.header-menus1{
margin-left: 40px;
}
.header-menus1 a,.header-menus2 a{
color: white;
display:block;
}
.header-menus2 span{
color:white;
border-bottom: solid 1px;
}
/*.header-menus1 a:hover,.header-menus2 a:hover{
 opacity:0.7;
}*/
.hover9 {
  display: inline-block;
  position: relative;
  text-decoration: none;
}
.hover9::after {
  position: absolute;
  content: '';
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: #fff/*#594b3c*/;
  transition: all 0.3s ease 0s;
}
.hover9:hover {
  cursor: pointer;
}
.hover9:hover::after {
  width: 100%;
}

/*スクロール時*/
.is-animation {
background-color: #fff;
}
.is-animation img:first-of-type{
display: none;
}
.is-animation img:nth-of-type(2){
display: inline;
}
.is-animation a{
color:#594b3c;
}
.is-animation span{
color:#594b3c;
}
/*.is-animation a:hover{
 opacity:0.7;
}*/
.is-animation .toggle span{
    border-bottom: solid 2px #594b3c;
}
.is-animation .hover9 {
  display: inline-block;
  position: relative;
  text-decoration: none;
}
.is-animation .hover9::after {
  position: absolute;
  content: '';
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: #594b3c;
  transition: all 0.3s ease 0s;
}
.is-animation .hover9:hover {
  cursor: pointer;
}
.is-animation .hover9:hover::after {
  width: 100%;
}

 /*--------------------
 *kasou header
 --------------------*/
.header-kasou{
position: fixed;
height:50px;
top: 0;
left: 0;
z-index: 200;
width: 100%;
background-color: #fff;
}
.kasou-header-inner{
display: flex;
align-items: center;/*垂直方向中央揃え*/
justify-content: space-between;
height:50px;
margin:0 auto;
padding: 0 10%;
}
.kasou-header-inner a{
width:15%;
}
.header-menus-kasou{
display: flex;
margin-left:40px;
}

.header-menus-kasou1{
color:#594b3c;
margin-left: 40px;
display:inline-block;
position:relative;
}
.header-menus-kasou1 a,.header-menus-kasou2 a{
color: #594b3c;

}
.header-menus-kasou2 span{
color:#6b6868;
border-bottom: solid 1px;
}
/*.header-menus-kasou1 a:hover,.header-menus-kasou2 a:hover{
 opacity:0.7;
}*/

.this{
color:#6b6868;
margin-left: 40px;
display: inline-block;
position: relative;
}
/*.hover10 {
  display: inline-block;
  position: relative;
  text-decoration: none;
}*/
.hover10::after {
  position: absolute;
  content: '';
  bottom: 0;
  left: 0;
  width: 0;
  height: 1.5px;
  background: #594b3c;
  transition: all 0.3s ease 0s;
}
.hover10:hover {
  cursor: pointer;
}
.hover10:hover::after {
  width: 100%;
}


 
 /*--------------------
 *footer
 --------------------*/
.footer-content-sp{
display: none;
}
footer{
background-image: url("../images/1_common/footer-bg.jpg");
background-repeat: no-repeat;
background-size:cover;
color:#fff;
padding:80px 0;
}
footer a{
color: #fff;

}
.footer-menus{
display: flex;
padding-bottom:24px;
justify-content: space-between;
width:100%;
}
.footer-content{
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.address{
padding-bottom:24px;
}
.footer-logo{
height:145px;
width:auto;
}
.footer-inner{
width:55%;
}
.footer-inner2{
width:14.9%;
display: flex;
justify-content: space-between;
}
.footer-inner2 i{
font-size:2.8rem;
justify-content: space-around;
}
.footer-inner2 img{
width:35px;
margin-left:20px;
}
footer>p{
text-align: center;
}
footer>p:first-of-type{
font-size:1.2rem;
}


 /*--------------------
 *main
 --------------------*/
 main{
 width: 100%;
 margin: 0 auto;
 }


 /*--------------------
 *icon
 --------------------*/
 .icon{
 width:30px;
 }
  .icon2{
 height:16px;
 }
 
 
 /*--------------------
 *btn
 --------------------*/
 .btn{
  -webkit-appearance: none;
  appearance: none;
  /*background-color: #594b3c#51886c;*/
  border:solid 1px #594b3c;
  background-image: url("../images/2_top/bg_facebook.jpg");
  display: flex;
  color:#594b3c;
  width: 317px;
  height:55px;
  justify-content: center;
  align-items: center;
  margin: 72px 0;
  cursor: pointer;
 }
 .btn:hover{
   background-image: url("../images/1_common/button-pattern.png");
   background-color: #594b3c;
  color:#fff;
 }
 .btn img{
 padding-right: 10px;
 }
 .btn i{
 font-size:2.4rem;
 }
 .btn:hover{
 opacity:0.7;
 }
 .btn-top{
 margin:104px auto;
 }
  .btn-sp{
  display:none;
  }
  .short-btn{
  width:230px;
  height:55px;
  margin: 0 0 30px 0;
  }
  .short-btn2{
  margin: 30px 0 0 0;
  }
  .btn-google{
  margin:48px auto 0 auto;
  }


 /*--------------------
 *見出し
 --------------------*/
 h1{
 margin-top:60px;
 padding: 104px 0 25px;
 font-size: 3.2rem;
  position: relative;
  display: flex;
  justify-content: center;
 }
 .h1_top{
 text-align: center;
 padding-bottom:72px;
 }
/* .h1_english{
 font-size: 1.4rem;
 padding: 20px 0 80px;
 }
 .h1_top>img{
 text-align: center;
 display: block;
 margin:0 auto;
 width:70px;
 }*/
  .h1_text{
  padding-bottom: 80px;
  }
  .title-img{
  height:28px;
  }
   h2{
   font-size: 2.8rem;
   padding: 0 0 48px 0;
   }
   h3{
   font-size:2.2rem;
   padding: 0 0 30px 0;
   }
  /*--------------------
 *section
 --------------------*/
 .section-inner{
 padding: 104px 13px;
 }
  .section-inner2{
 padding: 80px 13px;
 }
  .flex-inner{
  max-width:874px;
  margin:0 auto;
  display: flex;
  box-sizing: border-box;
  justify-content: space-between;
  align-items: flex-start;
  }

  .single-inner{
  max-width:874px;
  margin:0 auto;
  }
  

 
 /*--------------------
 *index.html
 --------------------*/
.kv-wrap{
text-align: center;
margin:0 auto;
position: relative;

}

.kv{
  width:100%;
  z-index:10;
  position:relative;
  }
.kv-text{
z-index:11;
position:absolute;
top:46%;
height:60%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
width:100%;
background-color:rgba(255,255,255,0.5);
padding-top:10px;
}
.kv-text img{
align-items: center;
height:90%;
}
.scroll{
display:block;
position:absolute;
bottom:10px;
z-index:11;
left:50%;
-webkit-transform: translate(-50%,0%);
transform: translate(-50%,0%);
}

.scroll img{
width:70%;
}


  .h2-text>span{
  position: absolute;
  z-index:2;
  left: 0;
  right: 0;
  margin: auto;

  }

  .h2-underline{
  position: relative;
  width:13em;
  bottom:-10px;
  z-index:1;
  }
    .h2-underline2{
  position: relative;
  width:6em;
  bottom:-10px;
  z-index:1;
  }
  #concept{
  background: url("../images/2_top/top_concept.jpg") no-repeat center center /cover;
  }
  
  
  .concept-coffee{
  height:28px;
  padding-left:1rem;
  }
  .cencept-text{
    margin-left:46%;
    width:40%;
    padding:0 0 72px 0;
  }
    .cencept-text p{
    line-height: 2.2;
    }
  .top-text2{
  padding:32px 0 48px;
  }
  .top-arrow{
  position: relative;
  padding-right:3rem;
  }
  .top-arrow i{
  font-size:1.8rem;
  padding-right:1rem;
  }
  .top-arrow img{
  position:absolute;
  top:18px;
  right:0px;
  width:140px;
  }
  .bold{
  font-weight: bold;
  }

  /*メニューボタン*/
  .index-wrapper{
  display: flex;
  justify-content: center;
  margin: 80px 4% 0;
  position: relative;
    z-index: 1;
  } 
  .index_img{
  position: relative;
  text-align: center;
  height:125px;
  width:140px;
  margin-right: 5%;
  }
    .index_img:last-of-type{
  margin-right: 0%;
  }
  .index_content_wrapper{
  left: 50%;
  position: absolute;
  top: 50%;
  }
 .index_content{
 transform: translate(-50%,-50%);
 }
  .index_content>p{
  font-size: 1.4rem;
  line-height: 1.4;
  height:3.5rem;
  padding-top:8px;
  width:5em;
  font-weight: bold;
  }
  .index_img:hover{
    /* 透明度を上げることで、画像の色を薄く見せる。*/
    opacity:0.8;
    /* リンクをホバーしたときのカーソルにする。*/
    cursor: pointer;
    position: relative;
    top: 3px;
  }


#whatsnew{
/*background-color: #f0ebe9#f9f7e5;*/
background-image:url("../images/3_about/about_bg.png");
background-repeat: no-repeat;
background-position: right top;
background-size:80%;
/*margin:0 10%;*/
padding-bottom:104px;
}

.whatsnew-text{
width:40%;
}
.eric{
padding-top:32px;
text-align: left;
position: relative;
width:200px;
margin: 0 auto;
}

.eric-text{
padding-right:40px;
font-size:1.4rem;
text-align:center;
position:absolute;
top:14px;
left:65px;
line-height:1;
}

.eric-img{
width:200px;
z-index:0;
}

#top-about{
background-image: url("../images/2_top/top_about_visual.jpg");
background-size: cover;
background-repeat: no-repeat;
background-position: top;
/*margin-top:104px;*/
}
.top-about-text{
    margin-left:56%;
}

.top-about-text p{
line-height: 2.2;
}   

/*#instagram{*/
#instagram{
background-color: #fff;
}
  .gallery{
  display: flex;
  flex-wrap: wrap;
  }
  .gallery-item{
/*  flex: 1 1 33.333%;
  -ms-flex: 1 1 33.333%;*/
  width:33%;
  margin:0 1px;
  }


 
 /*--------------------
 *about.html
 --------------------*/

 
 .bx-wrapper {/*枠をけしてセンター揃え*/
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none;
  background: none;
  margin: 0 auto;
  display: block;
}
  /*コントローラーのデザイン変更*/
  .bx-wrapper .bx-prev,
  .bx-wrapper .bx-next {/*次へボタンを消す*/
      background: none;
  }
  .bx-wrapper .bx-prev:after,
  .bx-wrapper .bx-next:after {/*fontawesome*/
      position: absolute;
      top: 50%;
      left: 0px;
      transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      color: #fff;
      font-size: 30px;
      font-family: FontAwesome;
      text-indent: 0px;
  }
  .bx-wrapper .bx-prev:after {
      content: "\f137";
  }
  .bx-wrapper .bx-next:after {
      content: "\f138";
  }
  .bx-wrapper .bx-controls-direction a {
      z-index: 9;
  }



/*table*/
.table{
line-height: 2.5;
font-size:1.5rem;
}
.cashless{
height: 18px;
padding-right:1rem;
}
.cashless:last-of-type{
padding-right:0;
}

.table-left{
font-weight: bolder;
margin-left:1rem;
}
.table-title img{
width:12px;
height:auto;
}
.about-table1{
margin-right:7%;
}
.table-title{
display: flex;
align-items: center;
margin-right:2rem;
font-weight: 700;
}
.note{
font-size:1.5rem;
line-height: 1.6;
}

.service-inner{
padding:8%;
background-color: #f9f7e5;
width:40%;
text-align:left;
}
.service-inner2{
width:60%;
}





 /*--------------------
 *access.html
 --------------------*/
 #googlemap{
 margin: 0 auto;
 text-align: center;  
 }
 #googlemap iframe{
 margin: 0 auto;
 text-align: center;
 }
 #access{
 padding-bottom:0px;
 }
 .access-table{
 line-height:2.0;
 margin: 0 auto;
 } 
 .access-table{
 
 }
 .access-table img{
 display:block;
 width:386px;
 height:324px;
 }
 .access-table1{
 padding-right:4%;
 }
 .access-table-last{
 padding-bottom:48px;
 }
 .access-table i{
font-size:2rem;
padding-right:2rem;
}

 /*--------------------
 *menus
 --------------------*/
 #kodawari{
 margin:0 auto;
 text-align: center;
 max-width:1200px;
 }
 .menu-banner{
 position: relative;
 z-index:10;
 }
 .menu-banner{

 }
 .menu-text{
 color:white;
 position: absolute;
 width:100%;
  z-index:11;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;
  padding:0;
  font-size:2.8rem;
 }
 .oswald{
 font-size:4.8rem;
 }
 .kodawari{
 align-items:baseline;
 padding-top:0;
 }
 .kodawari-text{
 text-align: left;
 width:50%;
 margin-right:5%;
 }
  .kodawari-text2{
 text-align: left;
 width:50%;
 margin-left:5%;
 }
 .serihu, .serihu2{
 background: url("../images/5_menu/menu_bg_01.png") no-repeat;
 background-size:100% 100%;
 text-align: center;
 width:40%;
 padding:5% 5%;
 }
 .under{
 background: linear-gradient(transparent 70%, #f0ebe9 70%);
 }
 .under2{
  background: linear-gradient(transparent 70%, #f9f7e5 70%);
 }
.serihu2{
 background: url("../images/5_menu/menu_bg_02.png") no-repeat;
  background-size:100% 100%;
 }
.serihu-name{
font-weight:bold;
}
.serihu-person{
display: flex;
justify-content: center;
align-items: baseline;
}
.menus-circle{
width:25%;
}
.serihu-text{
padding: 0 10%;
font-size:1.4rem;
}
.thumnail{
height:321px;
}
#menus-pdf{
background-color: #f0ebe9/*#f9f7e5*/;
background-size: 1200px;
}
.menus-title{
display: flex;
align-items: center;
  justify-content: center;
}
.menus-title>p:first-of-type{
font-weight: bold;
margin-right:30px;
}
.menus{
padding-top:56px;
}
.menus-inner1{
padding-right:32px;
}
.reverse{
flex-direction:row-reverse;
}


 /*--------------------
 *stayhome
 --------------------*/
 
 .menus-note{
 border:1px #594b3c solid;
 padding:3px 10px;
 text-align: center;
 }
 .menus-title{
 margin-bottom:3px;
 }
.h1_text2{
text-align: center;
}
.stayhome-sns{
display: flex;
vertical-align: top;
justify-content: space-between;
}
.menus-inner1 .short-btn{
width:230px;
}
#stayhome .menus-title{
display:block;
margin-top:32px;
}

#stayhome .menus-title:first-child{
margin-top:-32px;
}
#stayhome .thumnail{
border:1px #7f7f7f solid;
}
.badge-stayhome{
    display: block;
    position: absolute;
    top: 20%;
    z-index: 11;
    left: 30%;

    width: 8%;
}

/*--------------------
 *
 *
 *      tablet     
 *
 *
 *
 --------------------*/


/*--------------------
 *
 *
 *      SP     
 *
 *
 *
 --------------------*/
@media screen and (max-width:959px){
    .img-sp{
    display:block;
    }
    .img-pc{
    display:none;
    }
     .btn-sp{
    display:flex;
    }
    .btn-pc{
    display:none;
    }
    .spbr{
    display:block;
    }
    .btn{
    width: 70%;
    height:55px;
    justify-content: center;
    align-items: center;
    margin-top: 40px;
    text-align: center;
    margin-bottom:0px;
    }
    .short-btn{
    margin: 0 0 20px;
    width:100%;
    }
    .short-btn2{
    margin: 20px 0 0;
    width:80%;
    text-align: center;
    }
     .btn-top{
     margin:80px 4%;
     }
     
    .inner{
    overflow: hidden;/*右端の空白を消す*/
    }
    .kv-text{
    position:absolute;
    top:46%;
    height:70%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width:100%;
    background-color:rgba(255,255,255,0.5);
    padding-top:0px;
    margin-top:20px;
    }
    .kv-text img{
    align-items: center;
    height:80%;
    padding-top:20px;
    }
    .header-logoimg{
    width:150px;
    }
    .language{
    text-align: right;
    width:7rem;
    color:white;
    font-size:1.4rem;
    }
    .language-kasou{
        text-align: right;
    width:7rem;
    color:#594b3c;
    font-size:1.4rem;
    }
    .language a{
    color:white;
    }
    .is-animation.language{
    color:#594b3c;
    }
   .kasou-header-inner>a{
   display:block;
   width:150px;
   }
    .top-header-inner,
    .kasou-header-inner{
    padding:0 0 0 17px;
   
    }
    .header-menus, .header-menus-kasou{
    display:none;
    }
    .section-inner{
    padding: 80px 4%;
    }
    .section-inner2{/*余白狭くとりたいとき*/
    padding: 80px 2%;
    }
    .is-animation img:nth-of-type(2) {
    display: block;
    position: absolute;
    left:17px;
    align-content: center;
    }
    .top-header{
    position: fixed;
    height:50px;
    top: 0;
    z-index: 200;
    transition: .3s;
    width:100%;
    }

 
      /*--------------------
      *humberger
      --------------------*/
   
      
      /*ナビメニューのスタイルを指定*/
      .navmenu, .navmenu-kasou{
      display: block;
      }
      .navmenu{
      position: fixed; /*表示位置を固定*/
      z-index: 20000; /*重ね順を変更*/
      top: 0; /*表示位置を指定*/
      right:0;
      padding:10px 45px 10px 45px;
      color: #594b3c; /*文字色*/
      background:rgba(240,235,233,0.92);
      text-align: center; /*テキストを中央揃え*/
      width: 60%; /*全幅表示*/
      height:110%;
      transform: translateX(100%); /*ナビを上に隠す*/
      transition: all 0.6s; /*アニメーションの時間を指定*/
      }
      /*トグルボタンが押されたときに付与するクラス*/
      .navmenu.active{
       transform: translateX(0%);
      }
      .nav-logo-sp{
      width:70%;
      }
      .navmenu ul{
      margin: 0 auto;
      }
      .navmenu-inner{
      font-size: 1.6rem;
      list-style-type: none;
      width: 100%;
      margin-top:48px;
      }
      .navmenu-item:first-of-type{
      margin-top:0px;
      }
      .navmenu-inner2{
      display: flex;
      justify-content: space-around;
      }
      .navmenu-inner2{
      margin-top:48px;
      display: flex;
      justify-content: center;
      }
      .navmenu-inner2 i{
      /*margin-left: 45px;*/
      font-size:2.6rem;
      }
      .navmenu-inner3{
      display: flex;
      justify-content: center;
      list-style-type: none;
      margin-top:48px;
      }
      .navmenu-inner3 span{
      margin-right:30px;
      }
      .navmenu-item{
      color: #594b3c;
      margin-top:48px;
      }
      .navmenu-item i{
      font-size:1.8rem;
      padding-right:1rem;
      }
      /*トグルボタンのスタイルを指定*/
      .toggle, .toggle-kasou {
      display: block;
      position: fixed;    /* bodyに対しての絶対位置指定 */
      right: 13px;
      top: 5px;
      width: 42px;
      height: 42px;
      cursor: pointer;
      z-index: 30000;
      }
      .toggle span, .toggle-kasou span{
      display: block;
      position: absolute;
      width: 30px;
      border-bottom: solid 2px #fff;
      -webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
      -moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
      transition: .35s ease-in-out;			/*変化の速度を指定*/
      left: 6px;
      }
      .toggle-kasou span {
      border-bottom: solid 2px #594b3c;
      }
      .toggle span:nth-child(1) {
      top: 9px;
      }
      .toggle-kasou span:nth-child(1) {
      top: 9px;
      }
      .toggle span:nth-child(2) {
      top: 18px;
      }
      .toggle-kasou span:nth-child(2) {
      top: 18px;
      }
      .toggle span:nth-child(3) {
      top: 27px;
      }
      .toggle-kasou span:nth-child(3) {
      top: 27px;
      }
      /* 最初のspanをマイナス45度に */
      .toggle.active span:nth-child(1), .toggle-kasou.active span:nth-child(1) {
      border-bottom: solid 2px #594b3c;
      top: 18px;
      left: 6px;
      -webkit-transform: rotate(-45deg);
      -moz-transform: rotate(-45deg);
      transform: rotate(-45deg);
      }
      /* 2番目と3番目のspanを45度に */
      .toggle.active span:nth-child(2), .toggle-kasou.active span:nth-child(2){
      border-bottom: solid 2px #594b3c;
      top: 18px;
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      transform: rotate(45deg);
      }
      .toggle.active span:nth-child(3), .toggle-kasou.active span:nth-child(3) {
      border-bottom: solid 2px #594b3c;
      top: 18px;
      -webkit-transform: rotate(45deg);
      -moz-transform: rotate(45deg);
      transform: rotate(45deg);
      }
      .is-animation img:first-of-type{
      display: inline;
      }
      
    /*--------------------
    * 見出し
    --------------------*/
    h1{
    margin-top:50px;
    padding: 48px 0 10px;/**/
    font-size: 1.6em;
    position: relative;
    display: flex;
    }
    .h1_top{
    text-align: center;
    }
    .h1_top>img{
    padding-top:16px;
    width:40px;
    }
    .h1_english{
    font-size: 1.3rem;
    padding: 0 0 48px;/**/
    }
    .h1_text{
    padding-bottom: 35px;/**/
    }
    h2{
    font-size: 2.0rem;
    padding:0 0 25px;/**/
    }
    h2 div{
/*    text-align: center;*/
    }
    .h2-text{
  /*  text-align: center;*/
 /*   margin:0 auto;*/
    }

    h3{
    font-size:1.8rem;
    padding:0 0 20px;
    }
    .flex-inner, .table, .kodawari{
    display: block;
    }

    .cencept-text,.whatsnew-text,.top-about-text,.chokubai-text,.table, .kodawari-text,.kodawari-text2, .serihu, .serihu2{
    text-align: left;
    width:100%;
    padding:0;
    margin-left:0;
    }

    #concept{
    padding-left:0;
    padding-right:0;
    padding-top:110px;
  background: url("../images/2_top/top_concept_img_sp.jpg") no-repeat center center /cover;
    }

    .cencept-text{
    background-color: rgba(255,255,255,0.75);
    padding: 40px 4% 40px 4%;
    width:92%;
    text-align: left;  
    line-height: 2.0;
    }
    .after-img{
    padding-top:35px;
    }
    .concept-coffee{
    height:20px;
    }
    .top-text2{
    padding:25px 0 40px;
    }
    #whatsnew{
    margin:0 4%;
    background-image: url(../images/3_about/about_bg.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: 100%;
    }
    #whatsnew iframe{
    padding-top:0px;
    }

    .eric{
    margin:0;
    }

/*    #whatsnew{
    /*background-image:url("../images/1_common/bg.jpg");*/
    /*background-color: #f9f7e5*/
   
    #top-about{
    background-image: url("../images/2_top/top_about_visual_sp.jpg");
    background-repeat: no-repeat;
    background-position: top;
    padding-left:0;
    padding-right:0;
    }
    .top-about-text{
    background-color: rgba(255,255,255,0.8);
    padding: 40px 4% 40px 4%;
    width:92%;
    text-align: left;
    line-height: 2.0;
    }
    .index-wrapper{
    display: flex;
    justify-content: center;
    } 
    .gallery-item{
    width:49%;
    margin:0 1px;
    }
    .table{
    font-size:1.5rem;
    }

    .table-title{
    width:11rem;
    padding-right:5px;
    }
    .table-left{
    margin-left:5px;
    }
    .table i, .access-table i{
    font-size:1.4rem;
    }
    .about-table1 {
    margin-right: 0;
    }
    .about-table2{
    margin-bottom:40px;
    }
    .service{
    margin-left:0;
    }
    .service-inner{
    padding:32px 4% 32px 4%;
    width:92%;
    text-align:left
    }
    .footer-sp,.footer-content-sp{
    display:block;

    }
    .footer-pc,.footer-content{
    display:none;
    }

    footer{
    padding:0;
    background-image: url("../images/1_common/footer-bg-sp.jpg");
    background-repeat: no-repeat;
    background-size:cover;
    color:#fff;
    }
    .footer-content-sp{
    display: block;
    }
    .footer-inner-sp{
    display:flex;
    align-items: center;
    padding-top:80px;
    }
    .footer-inner-sp2{
    padding-top:24px;
    }
    .footer-sp li{
    padding-top:24px;
    text-decoration: underline;
    }
    .footer-sp li:first-of-type{
    padding-top:0;
    }
    .footer-logo{
    margin-right: 10%;
    width:50%;
    height:auto;
    }
    .footer-inner p{
    padding:25px 0 35px;
    line-height:1.8;
    }
    .footer-inner2{
    width:40%;
    }
    .footer-inner2 i{
    font-size:2.4rem;
    }
    small{
    font-size:1.1rem;
    margin-top:24px;
    }
    
    /*access*/
    .access-table{
    font-size:1.5rem;
    }
    .access-table img{
    display:block;
    max-width:100%;
    height:auto;
    }
    .access-table1{
    width:30%;
    }
     .access-table i{
    padding-right:5px;
    }
    
    /*menus*/
    .oswald{
    font-size:3.2rem;
    }
    .menu-text{
    font-size:2.4rem;
    }
    .menu-text-p{
    font-weight: bold;
    }
    .serihu, .serihu2{
    text-align: center;
    padding-bottom:40px;
    }
    .kodawari{
    padding: 40px 4% 80px 4%;
    }
    .kodawari-text{
    padding-bottom: 24px;
    }

    .serihu-text{
    padding:40px 20% 1% 20%;
    }
    .serihu-person{
    align-items: center;
    }
    .serihu-name{
    padding-left:1rem;
    font-size:1.4rem;
    }

    .btn-menus{
    display: flex;
    flex-wrap: wrap;
    }
    .menus-item{
    width:40%;
    margin: 2%;
    padding: 20px 0 20px;
    }
    .menus-circle{
    width:15%;
    }
    .pdf-name{
    padding-top:3px;
    }
    .thumnail{
width:100%;
height:auto;
}
    #menus-pdf{
    margin:0 4%;
    }
    .menus{
    padding-top:0;
    }
   .menus-inner1{
   padding:0;
   }
 
 /*stayhome*/
   .menus-inner1 .short-btn{
width:100%;
}

#stayhome .menus-title:first-child{
margin-top:32px;
}
.badge-stayhome{
    display: block;
    position: absolute;
    top: 15%;
    z-index: 11;
    left: 10%;
    width: 23%;
}
   
}



/*iphoneSE*/
@media screen and (max-width:321px){
    .language, .language-kasou{
    padding-right:7rem;
    font-size:1.4rem;
    }
}