/* students-voice-chat */

#students-voice250618 {
	background-image: url(../img/students-voice-bg250618.webp);

	background-size: cover;

	background-position: center center;

	/* background-attachment: fixed; */

	position: relative;

	z-index: 0;

	width: 100%;

	/* height: 251.6px; */

	display: flex;

	justify-content: center;

	align-items: center;

	text-align: center;

	aspect-ratio: 1496/3126;

	.slick-slider2 {
		position: absolute;

		width: 100%;

		height: auto;

		top: 16.5%;

		left: 0;

		.slick-arrow {
			display: none !important;
		}

		/* .slick-arrow:before { */

		/* デフォルトの矢印を削除 */

		/* content: "" !important; */

		/* } */

		/* .slick-slide {

			height: 100%;



		} */

		.slider01 {
			position: relative;

			#slider01-item {
				display: none;

				/* width: 82%; */

				width: 82%;

				height: auto;

				aspect-ratio: 2448/1064;

				margin: 0 auto -4% auto;

				position: absolute;

				top: 1%;

				left: 48%;

				transform: translateX(-50%) scale(0);

				/* transform: translate(-50%, 0%); */

				opacity: 0;

				transition: all 0.3s;

				/* animation: appear1 1.2s linear forwards; */
			}

			.slider01-voice {
				width: 77%;

				height: auto;

				margin: 34.3% auto 0 auto;

				object-fit: cover;

				aspect-ratio: 2216/3516;

				/* object-position: 50% 50%; */
			}
		}

		.slider02 {
			position: relative;

			#slider02-item {
				display: none;

				width: 84%;

				aspect-ratio: 2384 / 1000;

				margin: 0 auto -4% auto;

				position: absolute;

				/* top: 0; */

				top: 5px;

				left: 50%;

				transform: translateX(-50%) scale(0);

				opacity: 0;

				transition: all 0.3s;
			}

			.slider02-voice {
				width: 77%;

				height: auto;

				margin: 34.3% auto 0 auto;

				object-fit: cover;

				aspect-ratio: 2216/3638;

				/* object-position: 50% 50%; */
			}
		}

		.slider03 {
			position: relative;

			#slider03-item {
				display: none;

				width: 82%;

				aspect-ratio: 2372/1060;

				margin: 0 auto -4% auto;

				position: absolute;

				top: 0;

				left: 48%;

				transform: translateX(-50%) scale(0);

				opacity: 0;

				transition: all 0.3s;
			}

			.slider03-voice {
				width: 77%;

				height: auto;

				margin: 34.3% auto 0 auto;

				object-fit: cover;

				aspect-ratio: 2204/3372;

				/* object-position: 50% 50%; */
			}
		}
	}

	#slick2-left-arrow {
		position: absolute;

		top: 58%;

		left: 1.5%;

		transform: translateY(-50%);

		width: 9%;

		opacity: 0.5;

		transition: all 0.3s;

		&:hover {
			opacity: 0.5;
		}
	}

	#slick2-right-arrow {
		position: absolute;

		top: 58%;

		right: 1.5%;

		transform: translateY(-50%);

		width: 9%;

		transition: all 0.3s;

		&:hover {
			opacity: 0.5;
		}
	}
}