@charset "UTF-8";

/*for PC*/
@media screen and (min-width: 768px) {
  .ttlEn.-type02{
    font-size: clamp(calc(150px * 0.6), calc(90vw / 9.76), 150px);/*150 / 45*/
  }
}


.galTtl{
  position: relative;
  padding: 0 0 25px 0;
}
.galTtl h3{
  margin-top: -1em;
  line-height: 1.0;
}
.galTtl h3 span{
  font-size: 70%;
}
.btnGen{
  margin-top: 40px;
}
/*for SP*/
@media screen and (max-width: 767px) {
  .galTtl{
    padding-bottom: 25px;
  }
  
  .btnGen{
    width: 100%;
    max-width: 340px;
    margin-top: 30px;
  }

}


/*
intro
---------------------------*/
.intro{
  text-align: center;
}
/*for SP*/
@media screen and (max-width: 767px) {
  .intro{}
}




/*
town
---------------------------*/
.town{}
.galMain.galMainTown figcaption{
  display: none;
}
/*for SP*/
@media screen and (max-width: 767px) {
  .town{}
}

.galMain.galMainFac figcaption,
.galMain.galMainPlan1502 figcaption,
.galMain.galMainPlan3802 figcaption{
  color: #fff;
  text-shadow: 1px 1px 0 #222, -1px -1px 0 #222,-1px 1px 0 #222, 1px -1px 0 #222;
}
.galMain.galMainPlan2010 figcaption,
.galMain.galMainPlan1501 figcaption{
  color: #222;
  text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff,-1px 1px 0 #fff, 1px -1px 0 #fff;
}





/*galMain
--------------------------------- */
.swiper{}
.swiper img{
  display: block;
  width: 100%;
  vertical-align: bottom;
  border: none;
}
.galMain{
  position: relative;
  overflow: visible;
}
.galMain figcaption{
  position: absolute;
  right: 2px;
  bottom: 2px;
  font-size: clamp(calc(10px * 0.7), calc(10vw / 3.75), 10px);/*10 / 11*/
  text-align: right;
  line-height: 1.2;
  color: #fff;
}

.galbtnPrev,
.galbtnNext{
  position: absolute;
  top: 50%;
  display: block;
  width: 30px;
  height: 30px;
  background: rgba(117,135,115,0.9);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 50%; 
  -webkit-transform: translate(0,-50%);
  transform: translate(0,-50%);
  z-index: 50;
  cursor: pointer;
  transition: .3s;
}
.galbtnPrev::after,
.galbtnNext::after{
  content: none; 
}
.galbtnPrev {
  left: -10px;
  background-image: url("../images/plan/btn_prev.svg"); 
}
.galbtnNext {
  left: auto;
  right: -10px;
  background-image: url("../images/plan/btn_next.svg"); 
}


/* for pc*/
@media screen and (min-width: 768px) {
  .galMain{}
  .galMain figcaption{
    font-size: clamp(calc(11px * 0.7), calc(11vw / 9.76), 11px);/*11 / 10*/
  }
  
  .galbtnPrev,
  .galbtnNext{
    top: 50%;
    width: 60px;
    height: 60px;
  }
  .galbtnPrev{
    left: -30px;
  }
  .galbtnNext{
    right: -30px;
  }
  .galbtnPrev:hover,
  .galbtnNext:hover{
    cursor: pointer;
  }
  
}

/*galThumbnail
--------------------------------- */
.galThumbnail{
  margin: 10px 0 0 0;
}
.galThumbnail::after{
  content: none;
}
.galThumbnail .swiper-wrapper{
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 7px 1.33%;
}
.galThumbnail .swiper-slide{
  position: relative;
  /*width: 20% !important;*/
  width: 24%;
  padding-bottom: 5px;
  transition: .3s;
}
/*.galThumbnail .swiper-slide:last-of-type{
  margin-right: 0 !important;
}*/
.galThumbnail .swiper-slide::before{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 0;
  height: 4px;
  background-color: #758773;
  transition: 1.0s;
}
.galThumbnail .swiper-slide:hover{
  cursor: pointer;
  opacity: 0.8;
}
.galThumbnail .swiper-slide.swiper-slide-thumb-active::before{
  width: 100%;
}
.galThumbnail img{
  vertical-align: bottom;
  border: 1px solid #eee;
}
/* for pc*/
@media screen and (min-width: 768px) {
  .galThumbnail{}
  .galThumbnail .swiper-slide{
  }
}