@media screen and (min-width: 768px) {
	.swiper-button-prev {
		display: block;
	}
	.swiper-button-next {
		display: block;
	}
}

@media screen and (max-width: 767.999px) {
	.tyc-swiper .swiper-button-prev {
		display: none;
	}
	.tyc-swiper .swiper-button-next {
		display: none;
	}
}

.swiper-container {
	position: relative;
	margin-bottom: 30px;
}

.tyc-swiper {
	width: 100%;
	/* スクロール問題修正: overflowをvisibleに設定 */
	overflow: visible !important;
	/* 確実な左寄せ設定 */
	text-align: left;
	justify-content: flex-start;
}

/* FreeModeで異なる幅のスライドに最適化されたCSS */
.tyc-swiper-slide {
	position: relative;/*ms  boのため*/
	/* freeModeでは各スライドが自然な幅を持つ */
	width: auto !important;
	flex-shrink: 0; /* 縮小を防ぐ */
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;

	/* スライド要素のドラッグ無効化 */
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-touch-callout: none;
}

.tyc-swiper-wrapper {
	/* シンプルで確実な左寄せ設定 */
	display: flex !important;
	align-items: stretch;
	flex-direction: row;

	/* 左端から開始 */
	justify-content: flex-start !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* 最初のスライドの左寄せを確保 */
.tyc-swiper-slide:first-child{
	margin-left: 0 !important;
	padding-left: 0 !important;
}

.tyc-swiper .swiper-pagination {
	display: none !important;
}


/* スマートフォン縦向き: 小さめの画面 (iPhone SE等) */
@media (max-width: 320px) and (orientation: portrait) {
	/* 最初のスライドがコンテナより大きい場合の調整 */
	.tyc-swiper-slide:first-child {
		margin-left: 0;
	}
}

/* スマートフォン縦向き */
@media (min-width: 320px) and (max-width: 430px) and (orientation: portrait) {
	/* スマートフォン縦向け専用：最初のスライドの強制左寄せ */
	.tyc-swiper-slide:first-child {
		margin-left: 0 !important;
		padding-left: 0 !important;
	}
	.tyc-swiper-wrapper {
		justify-content: flex-start !important;
		align-items: flex-start !important;
	}
	/* すべてのスライドの左寄せ */
	.tyc-swiper-slide {
		align-items: flex-start !important;
		justify-content: flex-start !important;
	}
}

/* スライド内の画像調整 */
.tyc-swiper-slide img.card {
	display: block;

	/* ドラッグ無効化 */
	-webkit-user-drag: none;
	-khtml-user-drag: none;
	-moz-user-drag: none;
	-o-user-drag: none;
	user-drag: none;
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	pointer-events: none;
}

.tyc-swiper-slide img.card {
	display: block;
	width: auto;
	height: 85vh; /* 高さ基準でのレスポンシブ対応 */

	/* 最大幅制限を削除してスライドの自然な幅を確保 */
	object-fit: contain;

	/* 左端表示のため margin: 0 auto を削除 */
	margin: 0;

	/* ドラッグ無効化（重複指定で確実に） */
	-webkit-user-drag: none;
	user-drag: none;
	user-select: none;
	-webkit-user-select: none;
	pointer-events: none;
}

/* 2025.09.18 */
.anchor-buttons {
	position: absolute;
	background-color: #fff;
	z-index: 10;
	width: 22.7vw;
	left: 4vw;
	bottom: 2vw;
	display: flex;
	gap: 0;
	justify-content: center;
	margin-top: 20px;
}

.anchor-buttons button {
	padding: 0;
	border: none;
	background-color: transparent;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	-webkit-tap-highlight-color: transparent;
	user-select: none;
}

.anchor-buttons button:active,
.anchor-buttons button:focus {
	background-color: transparent !important;
	outline: none !important;
}

.anchor-buttons button img {
	display: block;
	width: 100%;
	height: auto;
}

/* スマホ横向き */

/*  スマフォの横は全てここ */
@media screen and (max-width: 998px) and (orientation: landscape) {
	body.cs12-mobile-landscape .tyc-swiper img.card {
		height: 115vh;
		/* スクロール問題修正: overflowをvisibleに変更 */
		overflow: visible !important;
	}
	.anchor-buttons {
		width: 43vh !important;
		left: 10.5vh!important;
		bottom: 4vh!important;
	}
	.anchor-buttons button {
		width: calc(43vh / 5);
		height: calc(43vh / 5);
	}
}

/* スマホ縦向き */

/*  スマフォの縦は全てここ */
@media screen and (min-width: 320px) and (max-width: 500px) and (orientation: portrait) {
	body.cs12-mobile-portrait .tyc-swiper img.card {
		height: calc(100vw * 1.43);
	}
	/*2025.09.18*/
	.anchor-buttons {
		width: 53vw!important;
		left: 12.6vw!important;
		bottom: 4.5vw!important;
	}
	.anchor-buttons button {
		width: calc(53vw / 5);
		height: calc(53vw / 5);
	}
}

/* Surface Duo専用 - 縦向き */
@media (orientation: portrait)
       and (aspect-ratio >= 0.75/1)
       and (aspect-ratio <= 0.8/1)
       and (width >= 540px)
       and (width <= 720px) {

	body.cs12-mobile-portrait .tyc-swiper img.card {
		height: calc(100vw * 1.11);
	}
	.anchor-buttons {
		width: 41vw!important;
		left: 10vw!important;
		bottom: 3.5vw!important;
	}
	.anchor-buttons button {
		width: calc(41vw / 5);
		height: calc(41vh / 5);
	}
}

/* =================================================================
  3. Tablet (タブレット専用) 
  - 画面幅が 600px 以上 "かつ" タッチ操作のデバイス
  - これにより、Lenovo Tab P11 (2000x1200) も正しくここに分類されます
================================================================= */
@media screen and (min-width: 600px) {
  /*  タブレットの縦は全てここ surface Duo 除く*/
  @media (orientation: portrait) {
  	body.cs12-mobile-portrait .tyc-swiper img.card {
		height: calc(100vw * 1.11);
	}
	.anchor-buttons {
		width: 41vw!important;
		left: 10vw!important;
		bottom: 3.5vw!important;
	}
	.anchor-buttons button {
		width: calc(41vw / 5);
		height: calc(41vh / 5);
	}
  }
}
/*  タブレットの横は全てここ */
@media screen and (min-width: 700px) and (max-width: 1400px) and (orientation: landscape) and (aspect-ratio >= 1.25/1) and (aspect-ratio <= 1.6/1) {
	body.cs12-mobile-landscape .tyc-swiper img.card {
		height: 85vh;
	}
	.anchor-buttons {
		width: 32vh!important;
		left: 7.5vh!important;
		bottom: 3.5vh!important;
	}
}
/* =================================================================
  特殊デバイス専用 (例: Lenovo Tab P11 2000x1200など)
  - iPad (1024x768, 1366x1024など) や一般的なAndroidタブレット (800x1280など) を除外
  - 2000x1200付近の非常に特殊な解像度のみを対象
================================================================= */

/* 特殊デバイス 縦向き (Portrait) - 2000x1200系 */
@media screen
       and (orientation: portrait)
       and (min-width: 1180px) and (max-width: 1220px)
       and (min-height: 1980px) and (max-height: 2020px)
       and (aspect-ratio >= 0.59/1) and (aspect-ratio <= 0.61/1) {

  @media (orientation: portrait) {
		.anchor-buttons {
			width: 43vw !important;
			left: 8.6vw;
			bottom: 3vw;
		}
		.anchor-buttons button {
			width: calc(43vw / 5);
			height: calc(43vw / 5);
		}
	}
}

/* 特殊デバイス 横向き (Landscape) - 2000x1200系 */
@media screen
       and (orientation: landscape)
       and (min-width: 1980px) and (max-width: 2020px)
       and (min-height: 1180px) and (max-height: 1220px)
       and (aspect-ratio >= 1.64/1) and (aspect-ratio <= 1.70/1) {

  @media (orientation: landscape) {
    	.anchor-buttons {
			width: 31.5vh !important;
			left: 8vh;
			bottom: 3vh;
		}
		.anchor-buttons button {
			width: calc(31.5vh / 5);
			height: calc(31.5vh / 5);
		}
	}
}
/*
*
*
* PC
*
*
*/
@media screen and (width >= 768px) and (pointer: fine) {

	.swiper-container {
		position: relative;
		margin-bottom: 40px;
	}

	.tyc-swiper img.card {
		height: 580px; /* 固定高さを優先 */
		/* ms
		width: 100vw;
		max-width: 100%;オーバーフロー防止
		*/
		/* 高さ基準でのレスポンシブ対応 */
		min-height: 580px; /* 最小高さ保証 */
	}

	.anchor-buttons {
		width:210px;
		left: 56px;
		bottom: 30px;
	}
	.anchor-buttons button {
		width: calc(210px / 5);
		height: calc(210px / 5);
	}
}