@charset "UTF-8";

/*----------------------------------------
	TOPページスライダー
----------------------------------------*/
/*----------------------------------------
	hero img
----------------------------------------*/

/*.hero__images {
  position: absolute;
  inset: 0;
    width: 100%;
  height: 100%;
}

.hero__img {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.5s ease;

}
  

*/

.hero__img.is-active {
  opacity: 1;
  animation: heroZoomOut 5s ease-out forwards;
}

.hero__slides {
  position: absolute;
  inset: 0;
}

.hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.5s ease;
}

.hero__slide.is-active {
  opacity: 1;
  z-index: 1;
}
.hero__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;

  animation: none;
}

.hero__slide.is-active img {
  animation: heroZoomOut 5s ease-out forwards;
}

.hero__slide .hero__text {
  position: absolute;
  inset: 0;
  z-index: 2;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

@keyframes heroZoomOut {
  from {
    transform: scale(1.1);
  }
  to {
    transform: scale(1);
  }
}




.hero--a {
  height: calc(100vh - 120px);
  max-height: 480px;
}

.hero--a .hero__title {
  font-size: clamp(28px, 2.6vw, 37px);
  text-shadow: 1px 3px 3px rgba(0,0,0,0.6);
}

.hero--a .hero__subtitle {
  display: none;
}



@media (max-width: 768px) {



    .hero__slide img {
    object-position: center center;
    transform-origin: center center;
  }



  /* A階層 */
  .hero--a {
    height: 340px;
  }

  .hero--a .hero__title {
    font-size: 24px;
    line-height: 1.7;
  text-shadow: 1px 2px 2px rgba(0, 0, 0, 0.6);
  text-shadow: 1px 2px 5px rgba(95, 89, 89, 0.6);
  }

 
}
/*----------------------------------------
	リンクボタンはstyle.cssのCardList component
----------------------------------------*/

/*----------------------------------------
	ニュースのもっと見る関連
----------------------------------------*/
.xj-newslist {
  overflow: hidden;
}

.xj-newslist.is-collapsed li:nth-child(n + 6) {
  display: none;
}
.more-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
  padding: 12px 24px;
  font-size: 16px;
  background: #fff;
  cursor: pointer;
}

.more-btn__icon {
  display: inline-block;
  margin-top: 2px;
  margin-left: 14px;
  transform: rotate(90deg); /* ＞を下向きに */
  font-size: 12px;
  line-height: 1;
  
}

@media screen and (max-width: 767px),print {
.more-btn, .more-btn__icon  {
  color:#333333;
}
}
/*----------------------------------------
	ニュースエリア
----------------------------------------*/
.topnewstit{
  margin-top: 140px;
  padding: 0;
}


  

.topnewstit{
  margin-top: 140px;
}

.newstit{
  margin: 0 0 14px;
  font-size: 70px;
  text-transform: uppercase;
  color: #009B73;
}

.newstit-sub{
  margin: -5px 0 0 5px;
  display: block;
  font-size: 16px;
color: #009B73;
font-weight: 600;
}

@media screen and (max-width: 767px),print {
.topnewstit{
  margin-top: 100px;
}

.newstit{
  margin: 0 0 16px;
  font-size: 50px;
}

.newstit-sub{
  margin: -5px 0 0 5px;
  display: block;
  font-size: 16px;
color: #009B73;
font-weight: 600;
}
}


/*----------------------------------------
	ニュースリスト
----------------------------------------*/
ul.newsList{
  margin-top: 22px;
   margin-bottom: 150px;
	width:100%;
	}
li.newsList__item{
  padding: 33px 0;
  border-bottom:1px solid #959595;
  
	}
li.newsList__item a{
	text-decoration:none;
	display: block;
	
	}
li.newsList__item a:hover{
	color:#009B73;
	}
li.newsList__item .date{
	color: #333333;
	vertical-align: middle;
	display: inline-block;
	margin-right: 42px;
	font-size: 15px;
	}
li.newsList__item .title{
	color: #333333;
	display: inline-block;
	margin: 0;
	padding: 0;
	vertical-align: middle;
	font-size: 17px;
	}


@media screen and (max-width: 767px),print {
li.newsList__item{
  padding: 20px 0;
  }	
  li.newsList__item .date{
	font-size: 14px;
	}

  li.newsList__item .title{
		font-size: 16px;
	}
	}

/* serviceList
----------------------------------------*/

@media screen and (max-width: 767px),print {
 
}

/* pickupList
----------------------------------------*/

@media screen and (max-width: 767px),print {

}