@charset "UTF-8";

*,*::before,*::after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role='list'],ol[role='list']{list-style:none}body{min-height:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}

body{
  background:#FFFEF2;
  -webkit-text-size-adjust: 100%;
  color: #333;
  font-family: "Noto Sans JP", serif;
  font-optical-sizing: auto;
  font-weight: normal;
  font-style: normal;
}
ul,a{
  text-decoration: none;
  list-style: none;
}
a{
  transition: .2s ease;
}
a:hover{
  transition: .2s ease;
  opacity: .7;
  text-decoration: underline;
  cursor: pointer;
}
h1{
  font-weight: bold;
  font-size: clamp(21px,3vw,35px);
  margin-bottom: 1em;
  line-height: 1.4;
}
.content{
  padding: 2em 20px 0;
  margin: 1em auto 3em;
  max-width: 1200px;
  margin: auto;
  width: 100%;
}
p{
  line-height: 1.8;
  font-size: clamp(15px,2vw,19px);
  margin: 1.5em 0;
}
iframe{
  width: 100%;
  border: 0;
}
.flx{
  display: flex;
  justify-content: space-between;
}
.spots{
  flex-wrap: wrap;
  margin: 2em 0;
}
/* .spots ul:nth-child(odd){
  background-color: #F3FAFE;
}
.spots ul:nth-child(even){
  background-color: #F8F4E6;
} */
.spots ul{
  background-color:#FFF7CC;
}
ul.spot_box{
  width: 32%;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  padding: 1.5em;
}
ul.spot_box p{
  line-height: 1.5;
  text-align: center;
  font-size: clamp(14px, 2vw, 18px);
  margin: 1em 0;
  font-weight: 600;
}
ul.spot_box p.icon{
  width:13%;
  margin: 1em auto 0;
}
ul.spot_box li{
  text-align: center!important;
}
ul.spot_box a{
  display: inline-block;
  margin: .5em 0 .2em 0;
}
section{
  padding: 2em 0;
}
article{
  padding: 2em 0;
}
h2{
  color:#9f955c;
  font-size: clamp(25px,3vw,35px);
  margin:2em 0 1em;
  position: relative;
  text-align: center;
  width: 100%;
  margin: auto;
}
h2 span{
  background-color: #FFFEF2;
  display: inline-block;
  z-index: 1;
  position: relative;
  padding: 0 1em 5px;
}
.h2{
  overflow: hidden;
}
h2::before,h2::after{
  content: "";
  flex-grow: 1;
  border-bottom: 1px solid;
  position: absolute;
  width: 100%;
  top: calc(100% / 3 + 3px);
}
h2::before{
  left: calc(-30% - 1em);
}
h2::after{
  right: calc(-30% - 1em);
}
h2.box{
  background-color:#9f955c;
  color: #fff;
  padding: .5em;
}
h2.box::before,h2.box::after{
  display: none;
}
h2.box span{
  background-color:#9f955c;
}
h3{
  text-align: center;
  font-size: clamp(22px,2vw,28px);
  margin:1em 0 0;
  line-height: 1.4;
}
figure{
  margin: 3em auto;
  width: 100%;
  max-width: 800px;
}
figure.full{
  max-width: 1000px;
}
figure img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.flx figure{
  width: 48.5%;
  margin: 1em 0;
}
h4{
  border-top: solid 2px #ddd;
  border-bottom: solid 2px #ddd;
  font-size: clamp(18px,2vw,22px);
  padding: .8em;
}
.detail{
  border: solid 2px #ddd;
  padding: 1.5em;
}
.detail p{
  margin: 0;
  font-size: clamp(14px,1vw,16px);
}
h5{
  font-size: clamp(17px,2vw,20px);
  font-weight: initial;
  margin: 0 0 1em 0;
  font-weight: bold;
}
.detail .flx{
  margin-bottom: 2em;
}
.detail .flx figure{
  margin: 0 1.5em 0 0;
  display: grid;
  place-content: flex-start;
}
.detail .flx figure img{
  object-fit: contain;
}
.detail .flx .txt{
  width: 48.5%;
}
.detail .btn_content{
  margin: 2em 0 0;
}
.flx a.btn{
  color: #fff;
  border-radius: 100px;
  display: grid;
  place-content: center;
  width: 49%;
  padding: .8em;
  font-size: clamp(17px,2vw,19px);
  font-weight: bold;
}
.flx a.btn.width_100{
  width:100%;
}
.flx.no_map{
  margin-bottom:0;
}
.flx a.btn:hover{
  text-decoration: none;
}
.flx a.btn:nth-child(1){
  background-color: #9f955c;
}
.flx a.btn:nth-child(2){
  background-color: #80bfa3;
}
.other h3{
  background-color: #ebf8f4;
  padding: .5em;
}
.other .flx .box{
  width: 47%;
}
.other .flx .box figure{
  width: 100%;
}
.other .flx .box h4{
  text-align: center;
}
.other .flx .box p{
  font-size: clamp(14px,1vw,16px);
}
.other2 h3{
  font-weight: normal;
  line-height: 1.7;
}
.other2 h3 span{
  font-weight: bold;
}
.other2 h3 strong{
  font-size: clamp(24px, 5vw, 38px);
  font-weight: normal;
}
.t_center{
  text-align: center;
}
.m_center{
  margin: auto;
}
.btn.yellow{
  background-color: #f39800!important;
}
.other2 .btn_content{
  padding: 0 1em;
}
.btn.flx.yellow{
  width: 100%;
  position: relative;
  height: 3.2em;
  transition: .2s ease-in-out;
  max-width: 800px;
}
.btn .fa-chevron-right{
  position: absolute;
  right: 2em;
  display: flex;
  align-items: center;
  top: 0;
  bottom:0;
}
.btn:hover .fa-chevron-right{
  right: 1.8em;
  transition: .2s ease-in-out;
}
.sp{
  display: none;
}

header .logo {
  max-width: 200px;
  margin-bottom: 40px;
}
header .logo img {
  width: 100%;
  height: auto;
}
footer .link-box ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0 16px;
  list-style-type: none;
  margin: 4em 0 1.8em;
  padding: 0;
}
footer section{
  padding: initial;
}
footer .link-box ul li {
  width: 240px;
  background-color: #fff;
  text-align: center;
  border: 1px solid #aa8f63;
}
footer .link-box ul li a {
  display: block;
  width: 100%;
  color: #aa8f63;
  padding: 15px 0;
}
footer .copy {
  font-size: clamp(10px,1vw,13px);
  text-align: center;
  margin-bottom: 60px;
}


@media screen and (max-width: 780px) {
  .sp{
    display: block;
  }
  .content{
    padding: 1em 15px 0;
  }
  p{
    margin: 1em 0;
  }
  ul.spot_box{
    width: 100%;
    margin: .5em 0;
    padding: 1em;
  }
  h5{
    margin-top: 1em;
  }
  figure{
    margin: 1em auto;
  }
  .flx.imgs,.detail .flx,.other .flx{
    flex-wrap: wrap;
  }
  .flx.imgs figure,.detail figure,.flx a.btn,.detail .flx .txt{
    width: 100%;
  }
  .detail{
    padding: 1em;
  }
  .detail .flx figure{
    margin: 0;
  }
  .flx a.btn:nth-child(odd){
    margin-bottom: 1em;
  }
  .other .flx .box{
    width: 100%;
  }
  .other .flx .box:nth-child(2){
    margin-top: 1em;
  }
  footer .link-box ul li {
    margin-bottom: 1em;
  }
}