@charset "utf-8";

/* -------------------------------------------------- */
/* PC*/
/* -------------------------------------------------- */
#fv {
	
}

#fvImg {
  width: 100%;
  height: calc(100vh - 150px);
  overflow: hidden;
  position: relative;
}

#fvImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.1);
  transition: transform 4s ease-in-out;
}


/* メインコピー */
/* ----------------------------------- */
#fvCopy {
  width: 100%;
  height: 150px;
  padding: 0 0 0 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
}

#fvCopy h1 {
  order: 2;
  font-size: 2rem;
  font-weight: bold;
}

#mainCopy {
  order: 1;
  font-size: clamp(2rem , 3.8vw , 4.9rem);
  color: #007b43;
  font-weight: bold;
}

/* h1アニメーション */
#fvCopy h1 {
  opacity: 0;
  transform: translateY(50px);
  transition: transform 1s ease, opacity 1s ease;
}

#fvCopy.animate h1 {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.4s;
}

/* mainCopy 一文字ずつ初回スライドイン＋少し跳ねる */
#mainCopy span {
  display: inline-block;
  opacity: 0;
  transform: translateY(50px);
  transition: transform 0.6s ease, opacity 0.6s ease;
}

#mainCopy span.animate {
  opacity: 1;
  animation: jump 0.6s ease forwards; /* 最初の出現時だけ跳ねる */
}

/* 跳ねるアニメーション */
@keyframes jump {
  0% { transform: translateY(50px); }
  60% { transform: translateY(-5px); }
  80% { transform: translateY(2px); }
  100% { transform: translateY(0); }
}

/* バナー */
/* ----------------------------------- */
#sliderBnr {
	margin-bottom: 30px;
}


#sliderBnr .swiper-slide {
   width: 380px; /* バナーサイズを固定 */
}

/* 共通設定 */
#sliderBnr .swiper-button-prev,
#sliderBnr .swiper-button-next {
  width: 40px;
  height: 40px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* 左矢印（prev） */
#sliderBnr .swiper-button-prev {
  background-image: url("../../img/common/icon_slider_left.svg");
}

/* 右矢印（next） */
#sliderBnr .swiper-button-next {
  background-image: url("../../img/common/icon_slider_right.svg");
}

/* デフォルトの矢印アイコンを消す */
#sliderBnr .swiper-button-prev::after,
#sliderBnr .swiper-button-next::after {
  display: none;
}

/*  商品を探す  */
/* ----------------------------------- */
#topSearch {
	padding: 50px 40px;
	margin-bottom: 100px;
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	background: #f2f2ea;
}

#genreWrap {
	width: calc(50% - 15px);
}

.topSearchTit {
	margin-bottom: 20px;
	font-size: 2.4rem;
	font-weight: bold;
	color: #014928;
	text-align: center;
}

.topSearchTit .genre {
	font-size: 1.4rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 5px;
}

.topSearchTit .genre::before {
	content: "";
	width: 14px;
	height: 14px;
	background: url(../../img/common/icon_search2.svg) 0 0 no-repeat;
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
}

#genreWrap ul {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	gap: 20px 2%;
}

.genreBtn {
	width: 49%;
}

.genreBtn a {
	width: 100%;
	height: 100%;
	padding: 0 15px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	background: #FFF;
	border-radius: 10px;
	transition: all 0.3s ease-in-out 0s;
}

.genreBtn a:hover {
	background: #007b43;
}

.genreTit {
	width: 100%;
	height: 60px;
	font-size: clamp(1.4rem , 1.5vw , 2rem);
	font-weight: bold;
	color: #007b43;
	border-bottom: 2px dotted #007b43;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
	line-height: 1;
}

.genreBtn a:hover .genreTit {
	color: #FFF;
	border-bottom: 2px dotted #FFF;
}

.genreTit::before {
	content: "";
	display: inline-block;
	vertical-align: middle;
}

.genreTit.set::before {
	width: 28px;
	height: 24px;
	background: url(../../img/common/icon_set.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.set::before {
	width: 28px;
	height: 24px;
	background: url(../../img/common/icon_set_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.light::before {
	width: 23px;
	height: 23px;
	background: url(../../img/common/icon_light.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.light::before {
	width: 23px;
	height: 23px;
	background: url(../../img/common/icon_light_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.out::before {
	width: 23px;
	height: 18px;
	background: url(../../img/common/icon_out.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.out::before {
	width: 23px;
	height: 18px;
	background: url(../../img/common/icon_out_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.office::before {
	width: 43px;
	height: 20px;
	background: url(../../img/common/icon_office.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.office::before {
	width: 43px;
	height: 20px;
	background: url(../../img/common/icon_office_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.exhibition::before {
	width: 24px;
	height: 34px;
	background: url(../../img/common/icon_exhibition.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.exhibition::before {
	width: 24px;
	height: 34px;
	background: url(../../img/common/icon_exhibition_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.ceremony::before {
	width: 26px;
	height: 23px;
	background: url(../../img/common/icon_ceremony.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.ceremony::before {
	width: 26px;
	height: 23px;
	background: url(../../img/common/icon_ceremony_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.cooking::before {
	width: 25px;
	height: 24px;
	background: url(../../img/common/icon_cooking.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.cooking::before {
	width: 25px;
	height: 24px;
	background: url(../../img/common/icon_cooking_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.party::before {
	width: 30px;
	height: 28px;
	background: url(../../img/common/icon_party.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.party::before {
	width: 30px;
	height: 28px;
	background: url(../../img/common/icon_party_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.audio::before {
	width: 17px;
	height: 24px;
	background: url(../../img/common/icon_audio.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.audio::before {
	width: 17px;
	height: 24px;
	background: url(../../img/common/icon_audio_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.electric::before {
	width: 29px;
	height: 19px;
	background: url(../../img/common/icon_electric.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.electric::before {
	width: 29px;
	height: 19px;
	background: url(../../img/common/icon_electric_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.sports::before {
	width: 26px;
	height: 29px;
	background: url(../../img/common/icon_sports.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.sports::before {
	width: 26px;
	height: 29px;
	background: url(../../img/common/icon_sports_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreTit.other::before {
	width: 20px;
	height: 25px;
	background: url(../../img/common/icon_other.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreBtn a:hover .genreTit.other::before {
	width: 20px;
	height: 25px;
	background: url(../../img/common/icon_other_hover.svg) 0 0 no-repeat;
	background-size: contain;
}

.genreDetail {
	width: 100%;
	height: 60px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	color: #7d7d7d;
	font-size: clamp(1rem , 1vw , 1.4rem);
}

.genreBtn a:hover .genreDetail {
	color: #fff;
}

#sceneWrap {
	width: calc(50% - 15px);
}

.topSearchTit .scene {
	font-size: 1.4rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 5px;
}

.topSearchTit .scene::before {
	content: "";
	width: 14px;
	height: 14px;
	background: url(../../img/common/icon_search2.svg) 0 0 no-repeat;
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
}

#sceneWrap ul {
	width: 100%;
	height: calc(100% - 77px);
	display: flex;
	flex-wrap: wrap;
	gap: 20px 2%;
}

.sceneBtn {
	width: 49%;
	height: calc(25% - 15px);
}

.sceneBtn a {
	width: 100%;
	height: 100%;
	padding: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #FFF;
	border-radius: 10px;
	transition: all 0.3s ease-in-out 0s;
	gap: 10px;
}

.sceneBtn a:hover {
	background: #007b43;
}

.sceneImg {
	width: 50%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.sceneImg img{
	width: 100%;
	height: auto;
	max-height: 100%;
}

.sceneTit {
	font-size: 1.6rem;
	font-weight: bold;
	display: block;
	color: #007b43;
}

.sceneBtn a:hover .sceneTit {
	color: #FFF;
}

.sceneDetail {
	font-size: 1.2rem;
	color: #7d7d7d;
}

.sceneBtn a:hover .sceneDetail {
	color: #FFF;
}

/* 新着情報 */
/* ----------------------------------- */
#topInfo {
	padding: 0 40px 100px;
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
}

.topInfoWrap {
	width: calc(50% - 20px);
}

.topInfoWrap::before {
	content: attr(data-en);
	font-size: 6rem;
	font-weight: 500;
	color: #cfe5da;
	display: inline-block;
	vertical-align: middle;
	font-family: "Outfit", sans-serif;
}

.topInfoIn {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.topInfoTitWrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	flex-direction: column;
}

.topInfoTit {
	font-size: 2.4rem;
	font-weight: bold;
	color: #014928;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}

.topInfoAll a {
	color: #007b43;
	font-weight: bold;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	display: inline-block;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 10px;
}

.topInfoAll a::after {
	content: "";
	width: 15px;
	height: 15px;
	background: url(../../img/common/icon_arrow1.svg) 0 0 no-repeat;
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
}

.topInfoNewsWrap {
	height: 500px;
	border: 1px solid #007b43;
	border-radius: 10px;
	position: relative;
	padding: 30px;
	overflow: hidden;
	flex: 1;
}

.topInfoNews > li {
	padding-bottom: 10px;
	margin-bottom: 10px;
	border-bottom: 1px solid #d2d2d2;
}

.topInfoNews a {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}

.newsTitWrap {
	padding: 20px 0;
	flex: 1;
}

.newsDate {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.newsDate .date {
	color: #7d7d7d;
}

.topInfoNews a:hover .newsDate .date {
	color: #007b43;
}

.newsDate .cat {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 3px;
}

.newsDate .cat li {
	padding: 0 5px;
	border: 1px solid #007b43;
	font-size: 1.2rem;
	font-weight: bold;
	border-radius: 100vw;
	color: #007b43;
}

.newsTit {
	font-size: 1.5rem;
}

.newsImg {
	width: 80px;
	height: 80px;
	overflow: hidden;
	border-radius: 10px;
	background: #CCC;
}

.newsImg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* スクロールバー */
.ps__thumb-y {
	width: 8px;
	background-color: #007b43;
	border-radius: 0px;
	transition: none;
}

.ps--active-x>.ps__rail-x,
.ps--active-y>.ps__rail-y {
	background-color: #e8f0ec;
}

.ps__rail-y.ps--clicking .ps__thumb-y {
	background-color: #007b43;
	width: 10px;
}

.ps__rail-y:hover>.ps__thumb-y,
.ps__rail-y:focus>.ps__thumb-y,
.ps__rail-y.ps--clicking .ps__thumb-y {
	background-color: #007b43;
	width: 10px;
}

.ps__rail-x,
.ps__rail-y {
	opacity: 1 !important;
	width: 10px;
}

/* 稲尾レントオールについて */
/* ----------------------------------- */
#topAboutWrap {
	padding-bottom: 100px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 90px;
}

#topAbout {
	flex: 1;
}

#topAbout h2 {
	padding-bottom: 10px;
	font-size: 2.4rem;
	font-weight: bold;
	color: #014928;
}

#topAbout p {
	padding-bottom: 1em;
	font-size: 1.6rem;
	line-height: 1.8;
}

#topAbout::before {
	content: attr(data-en);
	background-size: contain;
	display: inline-block;
	vertical-align: middle;
	color: #cfe5da;
	font-size: 6rem;
	font-weight: 500;
}

#aboutLink {
	width: 340px;
}

#calendar {
	padding-bottom: 100px;
}

#calendar h3 {
	padding-bottom: 10px;
	font-size: 2rem;
	color: #007b43;
	font-weight: bold;
}

#calendar .calendars {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 2%;
}

#calendar .calendar {
	width: 48%;
}

.month-prev {
	display: none;
}

.month-next {
	display: none;
}

.xo-event-calendar table.xo-month .month-header > span {
	font-size: 2rem;
}

.xo-event-calendar table {
	height: 400px;
}

@media screen and (min-width: 1024px) and (max-width: 1260px) {
	.sceneBtn {
		height: auto;
	}

	.sceneBtn a {
		flex-direction: column;
		padding: 15px;
	}

	#genreWrap ul {
		height: calc(100% - 80px);
	}

	.genreBtn a {
		flex-direction: column;
	}

	#topAboutWrap {
		gap: 40px;
	}

	#topAbout h2 {
		font-size: 2rem;
	}

	#topAbout p {
		font-size: 1.4rem;
	}
}

/* リンク */
/* ----------------------------------- */
#topLinkWrap {
	padding-bottom: 100px;
}

/* -------------------------------------------------- */
/* TAB&SP */
/* -------------------------------------------------- */
@media screen and (max-width: 1024px) {
	#topSearch {
		padding: 50px 4%;
		flex-direction: column;
	}

	#genreWrap {
		width: 100%;
		margin-bottom: 40px;
	}

	.genreTit {
		font-size: clamp(1.4rem , 2vw , 2rem);
	}

	#sceneWrap {
		width: 100%;
	}

	.sceneBtn {
		height: auto;
	}

	.sceneBtn a {
		padding: 15px;
	}

	#topInfo {
		flex-direction: column;
		gap: 40px;
	}

	.topInfoWrap {
		width: 100%;
	}

	#topInfo {
		padding: 0 4% 100px;
		display: flex;
		flex-wrap: wrap;
		gap: 40px;
	}

	#topAboutWrap {
		flex-direction: column;
		gap: 30px;
	}

	#topAbout {
		width: 100%;
	}

	#aboutLink {
		margin: 0 auto;
	}
}


/* -------------------------------------------------- */
/* TAB(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {

}
/* -------------------------------------------------- */
/* SP(調整) */
/* -------------------------------------------------- */
@media screen and (max-width: 767px) {
	#topAboutImg img {
		width: 100%;
	}

	#fvImg {
	position: relative;
	width: 100%;
	/* height: 100%; */
	overflow: hidden;
	}

	@keyframes slideLoop {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(calc(-100% + 100vw)); /* 画像の右端が画面右に来る位置まで */
	}
	}

	#fvImg img {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: auto; /* ← object-fitの代わりに比率維持 */
	transform: translateX(0);
	animation: slideLoop 30s ease-in-out infinite alternate;
	object-fit: contain;
	}

	#mainCopy {
		width: 12em;
		line-height: 1.2;
	}

	#fvCopy {
		width: 100%;
		height: 120px;
		padding: 0 4%;
	}

	#fvCopy h1 {
		font-size: 1.4rem;
		font-feature-settings: "palt";
	}

	/* slider */
	/* ----------------------------------- */
	#sliderBnr .swiper-slide {
		width: 70%;
	}
	
	.swiper-slide img {
		width: 100%;
		height: auto;
	}

	/* 商品ジャンルから探す */
	/* ----------------------------------- */
	#topSearch {
		padding: 30px 4%;
		margin-bottom: 60px;
	}

	.genreBtn {
		width: 100%;
	}

	#genreWrap {
		margin-bottom: 20px;
	}

	#genreWrap ul {
		height: auto;
		gap: 10px 2%;
	}
	
	.genreTit {
		padding: 10px;
		height: auto;
	}

	.genreDetail {
		padding: 10px;
		height: auto;
	}
	
	#sceneWrap ul {
		height: auto;
		gap: 10px 2%;
	}

	.sceneBtn a {
		flex-direction: column;
		justify-content: flex-start;
	}

	.sceneImg {
		width: 80%;
		height: 120px;
	}

	.sceneImg img {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}

	.sceneTit {
		font-size: clamp(1.4rem , 2vw , 2rem);
	}

	/* NEWS */
	/* ----------------------------------- */
	#topInfo {
		padding: 0 4% 80px;
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		gap: 40px;
	}

	.topInfoNewsWrap {
		height: 400px;
	}

	.topInfoIn {
		display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		gap: 10px;
	}

	.topInfoTitWrap {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		flex-direction: row;
	}

	.topInfoTit {
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
	}

	.topInfoAll a {
		-ms-writing-mode: lr-tb;
		writing-mode: horizontal-tb;
	}

	.newsImg {
		width: 60px;
		height: 60px;
	}

	.newsTitWrap {
		padding: 0;
		flex: 1;
	}

	.newsTit {
		font-size: 1.3rem;
	}

	.topInfoWrap::before {
		font-size: 5rem;
		line-height: 1;
	}

	/* ABOUT US */
	/* ----------------------------------- */
	#topAbout::before {
		font-size: 5rem;
	}

	#topAboutWrap {
		padding-bottom: 80px;
	}

	/* LINK */
	/* ----------------------------------- */
	#topLinkWrap {
		padding-bottom: 80px;
	}

	#calendar {
		padding-bottom: 80px;
	}

	#calendar h3 {
		padding-bottom: 10px;
		font-size: 1.8rem;
		color: #007b43;
		font-weight: bold;
	}

	#calendar .calendar {
		width: 100%;
	}

	.xo-event-calendar table {
		height: 300px;
	}

}