@charset "UTF-8";

/* fade animation ----------*/
.fade { opacity:0; transition:all 1s ease-out!important; }
.fade-left { transform:translateX(-100%); }
.fade-right { transform:translateX(100%); }
.fade-up { transform:translateY(100px); }
.fade-down { transform:translateY(-100px); }
.fade.active {
  transform:translate(0,0)!important;
  opacity:1!important;
}

/* common ----------*/
body { 
  color:#484848;
  background:#FAF7F2;
}
main {
/*  font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", "Times New Roman", Meiryo, serif;*/
  font-family:YuGothic,"游ゴシック","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  line-height:1.6;
}
.inner { max-width:124rem; width:100%; padding:0 2rem; margin:0 auto; }
#page { width:auto; }

div.fs-l-page { margin-top:11rem!important; }
@media screen and (max-width:768px){
  div.fs-l-page { margin-top:9rem!important; }
}


.whitebox {
  padding:4rem 5rem;
  background:#fff;
  border-left:solid 1rem #B8A600;
  box-shadow:1rem 1rem 0.6rem 0 rgb(0,0,0,.15);
  position:relative;
}
.whitebox .num_mark {
  position:absolute;
  top:-3.5rem;
  right:0;
  font-size:7rem;
  line-height:1;
  color:#8A8A8A;
}

.font_min {
  font-family:"游明朝", YuMincho, "ヒラギノ明朝 ProN W6", "Hiragino Mincho ProN", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", "Times New Roman", Meiryo, serif;
}

.slick-dotted.slick-slider { margin:0; }
.slick-dots { position:initial; margin-top:1rem; }
.slick-dots li { background:#B8B8B8; width:1.5rem; height:1.5rem; }
.slick-dots li.slick-active { background:#484848; }
.slick-dots li button {}
.slick-dots li button:before{ display:none; }


div:after,ul:after { display:none; }
p { margin:0; }

/* responsive ----------*/
.pc { display:block; }
.sp-only { display:none; }
.br102 { display:none; }
.br82 { display:none; }
.br82-only { display:none; }
.br60 { display:none; }
@media screen and (max-width:1020px){
  .br102 { display:block; }
}
@media screen and (max-width:820px){
  .pc-only { display:none; }
  .br82-only { display:block; }
  .br82 { display:block; }
}
@media screen and (max-width:600px){
  .pc { display:none; }
  .br82-only { display:none; }
  .sp-only { display:block; }
}

h2 { font-size:3.4rem; text-align:center; position:relative; margin-bottom:5rem; padding-bottom:1rem; }
h2 span { display:block; font-size:60%; font-weight:normal; }
h2:after {
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  max-width:20rem;
  width:100%;
  height:1px;
  background:#707070;
}

ul.tag { display:flex; margin-bottom:3rem; }
ul.tag li { background:#A4AA00; color:#fff; padding:5px 1em; font-weight: bold; font-size:1.6rem; }
ul.tag li:nth-of-type(n+2) { margin-left:2rem; }

#mv { padding-bottom:3rem; }
#mv h2 {
  font-size:3rem;
  font-weight: bold;
  margin:2rem 0 0;
  border:none;
}
#mv h2:after {
  display:none;
}
#mv .wrap { max-width:100rem; width:100%; margin:0 auto; }
#mv .lead { margin-top:2rem; font-size:1.8rem; text-align:center; font-weight:normal; line-height:1.8; }
#mv .ancbtn { max-width:28rem; width:100%; margin:2rem auto 0; border-radius:12px; overflow:hidden; }
#mv .ancbtn a {
  display:block;
  padding:1rem 0;
  background:#D9CFB4;
  color:#fff;
  font-size:2rem;
  font-weight: bold;
  text-align:center;
}
#mv .ancbtn a p { position:relative; display:inline-block; }
#mv .ancbtn a p i {
  font-size:3rem;
  position:absolute;
  right:-18%;
  top:45%;
  transform:translateY(-50%);
}

#open { padding:5rem 0; background:#fff; }
#open ul { display:flex; justify-content:space-between; margin-top:2rem; }
#open ul li { width:24%; }
#open p { margin-top:2rem; text-align:center; font-size:1.8rem; line-height:1.8; }

#sp01 { background:#EBEAE0; padding:7rem 0 0; }
#sp01 .flb,#sp02 .flb { display:flex; justify-content:space-between; }
#sp01 .flb .slide,#sp02 .flb .slide { width:55%; order:2; }
#sp01 .flb .text,#sp02 .flb .text { width:40%; order:1; color:#0B2447; }
#sp01 .flb .text span,#sp02 .flb .text span { display:block; font-weight:bold; font-size:2rem; margin-bottom:2rem; color:#484848; }
#sp01 .flb .text .cap,#sp02 .flb .text .cap { margin-top:2rem; color:#484848; }
#sp01 .flb .text .btn,#sp02 .flb .text .btn { margin-top:2rem; max-width:35rem; width:100%; }
#sp01 .flb .text .btn a,#sp02 .flb .text .btn a {
  display:block;
  padding:10px 2em;
  background:#a4aa00;
  color:#fff;
  text-align:center;
  font-weight: bold;
  border-radius:8px;
}

#sp02 { padding:5rem 0 7rem; background:#EBEAE0; }
#sp02 .ttl {
  background:#B9B9B9;
  color:#fff;
  font-weight: bold;
  text-align:center;
  font-size:2rem;
  padding:1rem 0;
}
#sp02 .sns { max-width:46rem; width:100%; margin:3rem auto 0; }
#sp02 .sns ul { display:flex; justify-content:space-between; margin-top:2rem; }
#sp02 .sns ul li { width:46%; text-align:center; }
#sp02 .sns ul li p { text-align:center; color:#484848; margin-top:1rem; }
#sp02 .linktext { text-align:center; font-size:2rem; margin-top:5rem; font-weight: bold; }

@media screen and (max-width:1024px){
  #mv h2 { margin:2rem 2rem 0; }
  
  #sp01 .flb,#sp02 .flb { display:block; }
  #sp01 .flb .slide,#sp01 .flb .text { width:100%; }
  #sp02 .flb .slide,#sp02 .flb .text { width:100%; }
  #sp01 .flb .text,#sp02 .flb .text { margin-top:2rem; }
}
@media screen and (max-width:600px){
  h2 { font-size:3rem; }
  h3 { font-size:2.2rem; }
  h3.special { margin:1rem 0 2rem; }
  
  ul.tag li { margin-left:1rem; }
  
  #mv h2 { font-size:2.4rem; padding-bottom:1rem; }
  #mv .lead { padding:0 2rem; }
  
  #open { padding:3rem 0; }
  #open ul { flex-wrap:wrap; }
  #open ul li { width:calc(50% - 0.5rem); margin-right:1rem; }
  #open ul li:nth-of-type(2n) { margin-right:0; }
  #open ul li:nth-of-type(n+3) { margin-top:1rem; }
  
  .whitebox { padding:4rem 2rem 2rem; }
  #sp01 { padding:3rem 0 2rem; }
  #sp01 .cafe { width:100%; }
  #sp01 .cafe .bb { padding:2rem; }
  #sp01 .cafe .bb ul li:nth-child(2) { display:block; }
  #sp02 .sns ul { width:85%; margin:2rem auto 0; }
  #sp02 .sns ul li img { width:48%; }
  #sp01 .flb .text .btn,#sp02 .flb .text .btn { margin:2rem auto 0; }
  
  #sp02 { padding:3rem 0 4rem; }
  #sp02 .flb2 { width:100%; display:block; }
  #sp02 .flb2 > div { width:100%; }
  #sp02 .flb2 > div:last-child { margin-top:3rem; }
  
  #kichijoji { margin:3rem 0; }
  
  #shop { padding:3rem 0 9rem; }
}