@charset "utf-8";
/* CSS Document */
:root{
  --color:#65A534;
}
html{text-size-adjust: none;}
/* ==========================
main
============================= */
main{
  box-sizing: border-box;
  *{
    box-sizing: border-box;
  }
}
.contents_box {
    background: url("../img/bg_right.png")no-repeat right bottom;
}
.f_cor{
  font-family: 'Cormorant Infant', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', sans-serif;
}
.paper_button {
    position: relative;
    margin: 30px auto 0;
    max-width: 360px;
    width: 100%;
   font-family: "Hiragino Kaku Gothic ProN";
    text-align: center;
    color: #fff;
    border-radius: 2px;
  > p{
      width: 100%;
      height: 100%;
      padding: 25px 30px;
      background: #6baecf;
      position: relative;
      z-index: 1;
  }
}
.paper_button::before, .paper_button::after {
    content: '';
    position: absolute;
    bottom: 10px;
    width: 43%;
    height: 13px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.7);
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.paper_button::before {
    left: 15px;
    -webkit-transform: skew(-5deg) rotate(-5deg);
    -ms-transform: skew(-5deg) rotate(-5deg);
    transform: skew(-7deg) rotate(-7deg);
}
.paper_button::after {
  right: 15px;
  -webkit-transform: skew(5deg) rotate(5deg);
      -ms-transform: skew(5deg) rotate(5deg);
          transform: skew(5deg) rotate(5deg);
}
.paper_button:hover::before,
.paper_button:hover::after {
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.4);
}
.paper_button:hover::before {
  left: 5px;
}
.paper_button:hover::after {
  right: 5px;
}
.paper_button a:link {
    color: #fff;
}
.paper_button a:visited {
    color: #fff;
}
/* ==========================
category
============================= */
.category {
    background: url(../img/category.png)no-repeat center right;
    padding: 90px 0;
    background-size: cover;
}
.cate_tit {
    background: url(../img/title_bg.png)no-repeat center;
    padding: 30px 0;
    margin: 0 auto 0 10%;
    max-width: 360px;
}
.cate_name {
    text-align: center;
    line-height: 0.8em;
    font-size: 230%;
}
.cate_name span {
    font-size: 40%;
}
p.contents_title span {
    font-size: 50%;
}
.intro {
  max-width: 1200px;
  width: 90%;
  margin: 60px auto;
  line-height: 2;
  display: flex;
  justify-content: center;
}

p.title_text{
    text-align: center;
    line-height: 1.0em;
    font-size: 230%;
    margin-top: 80px;
}
p.title_text span {
    font-size: 40%;
}
.sp_block {
  display: none;
}

.scene{
}
.sce_block{
  padding-top: 50px;
  position: relative;
}
.sce_inner{
  max-width: 1200px;
  width: 90%;
  margin: auto;
  background: #fff url("../img/bg_right.png") no-repeat bottom right;
  padding: 60px 20px;
  box-shadow: 0 0 20px rgba(0,0,0,.15);
  position: relative;
}
.sce_title {
  font-size: 24px;
  font-weight: bold;
  padding-left: 230px;
  max-width: 62%;
}
.sce_com {
  display: flex;
  justify-content: center;
  margin: 50px auto 0;
  line-height: 2;
}
.sce_label {
  font-family: 'Cormorant Infant', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', sans-serif;
  position: absolute;
  top: 100px;
  left: 0;
  height: 60px;
  width: calc(50% - 390px);
  z-index: 1;
  p{
    width: 100%;
    height: 100%;
    background: #6BAECF;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 30px;
    font-size: 32px;
    font-weight: bold;
    position: relative;
  }
}
.sce_label::before {
  content: '';
  position: absolute;
  bottom: 10px;
  width: 43%;
  height: 13px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.7);
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  right: 15px;
  -webkit-transform: skew(5deg) rotate(5deg);
  -ms-transform: skew(5deg) rotate(5deg);
  transform: skew(5deg) rotate(5deg);
}
.sce_guide{
  max-width: 354px;
  width: 100%;
  position: absolute;
  top: 50px;
  right: 50px;
  background: #fff;
  border: 1px solid #ccc;
}
.guide_head {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #D9D9D9;
  font-size: 20px;
  font-weight: bold;
  height: 40px;
}
.guide_body{
  padding: 10px 20px;
  line-height: 2;
  li{
    text-indent: -1em;
    padding-left: 1em;
  }
}
.sce_map{
  margin-top: 30px;
  max-width: 1098px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  justify-content: center;
  position: relative;
}
.caution{
  max-width: 1200px;
  width: 90%;
  margin: 60px auto 0;
  line-height: 2;
  .indent{
    text-indent: -1em;
    padding-left: 1em;
  }
  .mt_20{
    margin-top: 20px;
  }
}
.bottom{
  padding: 60px 0 100px;
}
.bot_inner{
  max-width: 1200px;
  width: 90%;
  line-height: 2;
  margin: auto;
  padding: 30px 40px 0 80px;
  display: flex;
  gap:30px;
  align-items: center;
  background: #DDE7ED;
}
.bot_img{
  position: relative;
  margin-bottom: -60px;
}
.pop{
  display: none;
  max-height: calc(90vh - 20px);
  overflow: scroll;
}
.featherlight .featherlight-content{
  max-width: 1024px;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  padding-top: 40px;
}
.pop_inner{
}
.pop_head {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 32px;
  font-weight: bold;
  padding-bottom: 20px;
  border-bottom: 1px solid #65A534;
}
.pop_com{
  font-size: 20px;
  line-height: 2;
}
.pop_list {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 30px;
  flex-wrap: wrap;
  @media screen and ( max-width: 767px ){
    gap:10px;
  }
}
.pop_card{
  max-width: 209px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-size: 18px;
  margin-top: 10px;
  @media screen and ( max-width: 767px ){
    width:calc(50% - 5px);
  }
}
.pop_body {
  padding-top: 20px;
  padding-bottom: 30px;
}
.pop_btn{
  position: absolute;
  @media screen and ( max-width: 767px ){
    width: 5vw;
  }
}
.pin_01{bottom: 65%;right: 43.75%;}
.pin_02{bottom: 38%;right: 33%;}
.pin_03{bottom: 43%;right: 55%;}
.pin_04{bottom: 32%;right: 26%;}
.pin_05{bottom: 48%;right: 48%;}
.pin_06{bottom: 65%;right: 74%;}
.pin_07{bottom: 35%;right: 59%;}
.pin_08{bottom: 64%;right: 82.5%;}
.pin_09{bottom: 46%;right: 57%;}
.pin_10{bottom: 48%;right: 15%;}
.pin_11{bottom: 54%;right: 48%;}
.pin_12{bottom: 40%;right: 23%;}
.pin_13{bottom: 29%;right: 53%;}
.featherlight .featherlight-content {
  overflow: hidden;
}
.featherlight .featherlight-close-icon{
  width: 70px;
  background: none;
  top: 5px;
  right: 5px;
  &::after{
    content: ' 閉じる';
  font-size: 18px;
  }
}
@media screen and ( max-width: 1000px ){

}
@media screen and ( max-width: 767px ){
.category {
    background: url(../img/category.png)no-repeat center right;
    background-size: cover;
    padding: 0;
}
.cate_tit {
    width: 90%;
    margin: auto;
}
	
.sp_block {
    display: block;
}
.pc_block {
    display: none;
}
.intro{
  margin: 40px auto 0;
}
.sce_inner {
  padding: 100px 5% 40px;
}
.sce_label {
  max-width: 200px;
  width: calc(60%);
  top: 70px;
}
.sce_title {
  max-width: 100%;
  font-size: 18px;
  padding-left: 0;
}
.sce_com {
  margin-top: 30px;
}
p.title_text {
  margin-top: 0;
}
.sce_guide {
  position: static;
  max-width: 100%;
}
.bot_inner{
  flex-direction: column;
  align-items: center;
  padding: 30px 5% 90px;
  position: relative;
}
.bot_img{
  position: absolute;
  margin-bottom: 0;
  max-width: 115px;
  right: 5%;
  bottom: -75px;
}
.pop{
  max-height: calc(90svh - 50px);
}
.pop_head {
  font-size: 20px;
}
.pop_com {
  font-size: 14px;
  line-height: 1.5;
}
.pop_card{
  font-size: 14px;
}
.featherlight .featherlight-close-icon{
  &::after{
    font-size: 14px;
  }
}
}
@media print {


}