@charset "utf-8";

.idx01 {
	background: #f1f0f3;
}

.idx01In {
	max-width: 1140px;
	margin: 0 auto;
	min-height: 440px;
}

.idx01In .pcfvImg {
	vertical-align: bottom;
	position: relative;
}

.idx01In .pcfvImg img {
	width: 79%;
	position: absolute;
	right: -65px;
}

.introduce {
	font-family: 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', sans-serif;
	position: absolute;
	top: 93px;
}
.introduceIn {
	margin-top: 62px;
	margin-left: -20px;
}

.introduceIn_1 {
	font-size: 3.4rem;
	font-weight: 600;
	margin-bottom: 20px;
}

.introduceIn_2 {
	font-size: 1.5rem;
	line-height: 1.8;
	margin-left: 20px;
	font-weight: bold;
}

.idx03In {
	max-width: 1140px;
	margin: 0 auto 90px;
}

/*.idx03に限ってはコンテンツ枠の装飾内容を.bx-wrapperに記載する*/
.bx-wrapper {
	height: 500px;
	background: #efefef;
	border: none;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-box-shadow: 23px 0px 0px -20px #efefef, 0px 23px 0px -20px #efefef, 0px -23px 0px -20px #efefef, -23px 0px 0px -20px #efefef, 0 0 0 3px #b4b4b4;
	box-shadow: 23px 0px 0px -20px #efefef, 0px 23px 0px -20px #efefef, 0px -23px 0px -20px #efefef, -23px 0px 0px -20px #efefef, 0 0 0 3px #b4b4b4;
}

.bx-wrapper .bx-prev {
	background: url( "../imgs/index/l_arrow.png" ) no-repeat;
	left: -3px;
}

.bx-wrapper .bx-next {
	background: url( "../imgs/index/r_arrow.png" ) no-repeat;
	right: -3px;
}

.bx-wrapper .bx-controls-direction a {
	width: 60px;
	height: 60px;
}

.slide {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	height: 500px;
	word-break: break-all;
}

.idx03In__left {
	width: 45%;
	padding: 60px 0 0 150px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.idx03In__left .number {
	font-size: 9.6rem;
	font-weight: bold;
	display: block;
	margin-bottom: 30px;
	color: #efefef;
	font-family: "Roboto Slab", "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", "HiraMinProN-W3", "MS PMincho", serif;
}

.idx03In__left h2 {
	font-family: 'Shippori Mincho', serif;
	font-size: 2.5rem;
	letter-spacing: 5px;
	font-weight: bold;
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 3px solid #ffffff;
	display: inline-block;
	color: #3b3839;
}
.idx03In__left h2 span {
	font-size: 1.7rem;
}

.idx03In__left article {
	line-height: 1.9;
	margin-bottom: 36px;
	font-weight: bold;
	letter-spacing: 1px;
	font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #5d5d5d;
	font-size: 1.6rem;
}

.idx03In__left .arrow img {
	width: 150px;
}

.idx03In__right {
	width: 55%;
	position: relative;
}

/*商品画像は長辺400pxで作成*/
.idx03In__right img {
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.idx04In {
	max-width: 1000px;
	margin: 0 auto 70px;
	background: #efefef;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 35px 45px;
	overflow: hidden;
	overflow-y: scroll;
	height: 500px;
}

/*スクロールバー本体*/
.idx04In::-webkit-scrollbar {
	width: 15px;
}

/*スクロールバー背景*/
.idx04In::-webkit-scrollbar-track {
	background: #dedede;
}

/*スクロールバーグリップ部分*/
.idx04In::-webkit-scrollbar-thumb {
	background: #888888;
}

.idx04In time {
	display: block;
	text-align: right;
}

.idx04In h3 {
	font-size: 2.3rem;
	font-weight: 400;
	margin-bottom: 15px;
	color: #505050;
}

.idx04In .news_txt {
	word-break: break-all;
	line-height: 1.8;
	font-size: 1.5rem;
	padding-bottom: 20px;
	border-bottom: 2px solid #888888;
	margin-bottom: 12px;
	color: #707070;
}

.idx04In .period {
	color: #ce0000;
}

.news_txt a {
	text-decoration: underline;
}

.idx04In h2 {
	font-size: 1.8rem;
	font-weight: bold;
	font-family: "Roboto Slab", "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", "HiraMinProN-W3", "MS PMincho", serif;
	letter-spacing: 4px;
	width: 25%;
	margin: 0 auto 35px;
	text-align: center;
	color: #ffffff;
	background: #888888;
	padding: 5px 0;
}

.idx05In {
	max-width: 1000px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0 auto;
}

.idx05In h2 {
	font-size: 1.8rem;
	font-weight: bold;
	font-family: "Roboto Slab", "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", "HiraMinProN-W3", "MS PMincho", serif;
	letter-spacing: 4px;
	width: 25%;
	margin: 0 auto 35px;
	text-align: center;
	color: #ffffff;
	background: #888888;
	padding: 5px 0;
}

.idx05In__qabox {
	max-width: 1000px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 20px 15px;
	margin-bottom: 35px;
	word-break: break-all;
	background: #efefef;
	-webkit-box-shadow: 23px 0px 0px -20px #efefef, 0px 23px 0px -20px #efefef, 0px -23px 0px -20px #efefef, -23px 0px 0px -20px #efefef, 0 0 0 3px #b4b4b4;
	box-shadow: 23px 0px 0px -20px #efefef, 0px 23px 0px -20px #efefef, 0px -23px 0px -20px #efefef, -23px 0px 0px -20px #efefef, 0 0 0 3px #b4b4b4;
}

.idx05In__qabox_q ul {
	padding-bottom: 10px;
}

.idx05In__qabox_q li, .idx05In__qabox_a li {
	display: inline-block;
}

.idx05In__qabox_q li:first-child, .idx05In__qabox_a li:first-child {
	width: 30px;
	margin: 0 20px 0 20px;
	display: inline-block;
}

.idx05In__qabox_q li:nth-child(2) {
	font-size: 2.3rem;
	line-height: 1.8;
	vertical-align: top;
	width: calc(100% - (30px + 40px + 15px));
	display: inline-block;
}
.idx05In__qabox_a li:nth-child(2) {
	font-size: 1.5rem;
	line-height: 1.8;
	vertical-align: top;
	width: calc(100% - (30px + 40px + 15px));
	display: inline-block;
}

.idx05In__qabox_q {
	border-bottom: 1px solid #8a8a8a;
	margin-bottom: 13px;
}

/* フェードインここから */
.fadeIn-1 {
	opacity: 0;
	animation-name: fadeIn-1;
	animation-duration: 2.9s;
	animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;
	animation-delay: 0.3s;
}

/*animetion-nameで設定した値を書く*/
@keyframes fadeIn-1 {
	0% {opacity: 0}
	100% {opacity: 1}
}
/* フェードインここまで */

@media screen and (max-width: 767px) {
	.idx01 {
		background-color: initial;
	}

	.idx01In {
		max-width: 1140px;
		margin: 0 auto;
		min-height: auto;
	}


	.idx01In .spfvImg img {
		width: 100%;
		height: 23vh;
		margin: 0 auto;
		-o-object-fit: scale-down;
		object-fit: scale-down;
		vertical-align: bottom;
		background-color: #f1f0f3;
	}

	.introduce {
		display: block;
		background: #ffffff;
		position: initial;
		top: initial;
	}

	.introduceIn {
		font-family: 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', sans-serif;
		padding: 25px 0;
		text-align: center;
		width: 91%;
		margin: 0 auto;
	}

	.introduceIn_1 {
		font-weight: 600;
		font-size: 4.55vw;
		margin-bottom: 20px;
	}

	.introduceIn_2 {
		line-height: 1.5;
		margin-left: 0;
		font-weight: inherit;
		font-size: 3.45vw;
	}

	/*.idx03に限ってはコンテンツ枠の装飾内容を.bx-wrapperに記載すること*/
	.bx-wrapper {
		width: 90%;
		height: 525px;
		margin: 0 auto 90px;
		background: #efefef;
		border: none;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-box-shadow: none;
		box-shadow: none;
	}

	.slide {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		height: 500px;
		word-break: break-all;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
		padding: 15px;
	}

	/*スライダー左右送りのボタン*/
	.bx-controls-direction {
		display: none;
	}

	.idx03In__left {
		width: 100%;
		padding: 0;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	.idx03In__left .number {
		font-size: 13.4vw;
		font-weight: bold;
		display: block;
		margin-bottom: 0px;
		color: #efefef;
		font-family: "Roboto Slab", "Times New Roman", "Yu Mincho", "YuMincho", "Hiragino Mincho Pro", "HiraMinProN-W3", "MS PMincho", serif;
	}

	.idx03In__left h2 {
		font-family: 'Shippori Mincho', serif;
		font-size: 6.7vw;
		letter-spacing: 1px;
		font-weight: bold;
		padding-bottom: 0px;
		margin-bottom: 0px;
		border-bottom: 0px;
		display: block;
		text-align: center;
		color: #3b3839;
	}

	.idx03In__left h2 span {
		font-size: 3.8vw;
	}

	.idx03In__left article {
		line-height: 1.5;
		margin-bottom: 36px;
		font-weight: bold;
		letter-spacing: 1px;
		font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
		color: #5d5d5d;
		font-size: 3.75vw;
		position: absolute;
		bottom: -3px;
		width: 91%;
	}

	.idx03In__right {
		width: none;
		position: static;
		width: 0;
	}

	/*商品画像は長辺400pxで作成*/
	.idx03In__right img { 
		position: absolute;
		max-width: 80%;
		max-height: 45%;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}

	.idx03In__left .arrow {
		position: absolute;
		bottom: 0;
		left: 41%;
	}

	.idx03In__left .arrow img {
		width: 30%;
	}

	.idx04In {
		width: 90%;
		padding: 0 5px 0 0;
		background: #ffffff;
	}

	.idx04In h2 {
		width: 60%;
	}

	.idx04In time {
		margin-bottom: 5px;
	}

	.idx04In h3 {
		margin-top: 1.5vh;
		margin-bottom: 2.5vh;
		font-size: 4.8vw;
	}

	.idx04In .news_txt {
		font-size: 4vw;
	}

	.news_txt a {
		text-decoration: underline;
	}

	.idx05In {
		width: 90%;
	}

	.idx05In h2 {
		width: 60%;
	}

	.idx05In__qabox {
		width: 100%;
		-webkit-box-shadow: 23px 0px 0px -20px #efefef, 0px 23px 0px -20px #efefef, 0px -23px 0px -20px #efefef, -23px 0px 0px -20px #efefef, 0 0 0 2px #b4b4b4;
		box-shadow: 23px 0px 0px -20px #efefef, 0px 23px 0px -20px #efefef, 0px -23px 0px -20px #efefef, -23px 0px 0px -20px #efefef, 0 0 0 2px #b4b4b4;
	}

	.idx05In__qabox_q li:first-child, .idx05In__qabox_a li:first-child {
		margin: 0 auto;
		display: block;
	}

	.idx05In__qabox_q li:nth-child(2) {
		font-size: 4.8vw;
		line-height: 1.8;
		width: 100%;
		text-align: center;
	}

	.idx05In__qabox_a li:nth-child(2) {
		font-size: 4vw;
		line-height: 1.8;
		width: 100%;
	}

	.idx05In__qabox_q {
		border-bottom: none;
		margin-bottom: 0;
	}

	.idx05In__qabox_q ul {
		padding-bottom: 0;
	}

	/*SP版ではPCのh1のフェードインを停止させる_ここから*/
	.fadeIn-1 {
		opacity: inherit;
		animation-name: fadeIn-1;
		animation-duration: inherit;
		animation-timing-function: inherit;
		animation-fill-mode: inherit;
		animation-delay: inherit;
	}

	@keyframes fadeIn-1 { /*animetion-nameで設定した値を書く*/
		0% {opacity: inherit} /*アニメーション開始時は不透明度0%*/
		100% {opacity: inherit} /*アニメーション終了時は不透明度100%*/
	}
	/*SP版ではPCのh1のフェードインを停止させる_ここまで*/

	/*SP版_introduceのフェードイン_ここから*/
	.fadeIn-2 {
		opacity: 0;
		animation-name: fadeIn-2;
		animation-duration: 2.9s;
		animation-timing-function: ease-in-out;
		animation-fill-mode: forwards;
		animation-delay: 0.3s;
	}

	@keyframes fadeIn-2 { /*animetion-nameで設定した値を書く*/
		0% {opacity: 0} /*アニメーション開始時は不透明度0%*/
		100% {opacity: 1} /*アニメーション終了時は不透明度100%*/
	}
	/*SP版_introduceのフェードイン_ここまで*/
}
