/* International page (page-international.php) */
:root {
	/* Light theme */
	--intl-bg: #ffffff;
	--intl-surface: rgba(17, 24, 39, 0.04);
	--intl-surface-2: rgba(17, 24, 39, 0.06);
	--intl-border: rgba(17, 24, 39, 0.12);
	--intl-text: rgba(17, 24, 39, 0.92);
	--intl-muted: rgba(17, 24, 39, 0.70);
	--intl-muted-2: rgba(17, 24, 39, 0.55);
	--intl-accent: #7cf6c6;
	--intl-accent-2: #77b8ff;
	--intl-warning: #ffd36f;
	--intl-max: 1200px;
	--intl-radius: 18px;
	--intl-shadow: 0 24px 80px rgba(17, 24, 39, 0.14);
}

body.roca-intl-body {
	margin: 0;
	color: var(--intl-text);
	background: #ffffff;
	font-family: system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
	line-height: 1.6;
}

.roca-intl * { box-sizing: border-box; }
.roca-intl a { color: inherit; }

.roca-intl__container {
	max-width: 1800px;
	margin: 0 auto;
	padding: 0 18px;
}

/* Main visual, Why choose us, Pricing: 1300px */
.roca-intl__hero .roca-intl__container,
.roca-intl__section--why .roca-intl__container,
.roca-intl__section--pricing .roca-intl__container,
.roca-intl__section--route-setting .roca-intl__container {
	max-width: 1300px;
}

@media (max-width: 739px) {
	.roca-intl__container {
		padding: 0 10px;
	}
}

.roca-intl__top {
	position: sticky;
	top: 0;
	z-index: 10;
	background-color: #ffffff;
	backdrop-filter: blur(14px);
	border-top: 5px solid #323c48;
	border-bottom: 1px solid var(--intl-border);
	/* 0..1 (scroll progress up to 100px) */
	--roca-header-t: 0;
	--roca-logo-scale: 1;
	--roca-top-padding: 14px;
}

.roca-intl__topInner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: var(--roca-top-padding) 0;
}

.roca-intl__snsList {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.roca-intl__snsItem { margin: 0; }
.roca-intl__snsLink {
	/* display: inline-flex; */
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 14px;
	transition: transform 140ms ease, box-shadow 140ms ease, background-color 140ms ease;
}
.roca-intl__snsLink:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 34px rgba(17, 24, 39, 0.14);
	background: rgba(255, 255, 255, 0.92);
}
.roca-intl__snsLink:focus-visible {
	outline: 2px solid rgba(119, 184, 255, 0.9);
	outline-offset: 2px;
}
.roca-intl__snsIcon {
	display: block;
	width: 40px;
	height: 40px;
}

.roca-intl__jpLink {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 12px;
	border-radius: 14px;
	border: 1px solid var(--intl-border);
	background: rgba(255, 255, 255, 0.72);
	color: var(--intl-text);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: transform 140ms ease, box-shadow 140ms ease, background-color 140ms ease;
	white-space: nowrap;
}
.roca-intl__jpLink:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 34px rgba(17, 24, 39, 0.14);
	background: rgba(255, 255, 255, 0.92);
}
.roca-intl__jpLink:focus-visible {
	outline: 2px solid rgba(119, 184, 255, 0.9);
	outline-offset: 2px;
}

@media (max-width: 739px) {
	.roca-intl__snsList { gap: 8px; }
	.roca-intl__snsLink {
		width: 40px;
		height: 40px;
		border-radius: 13px;
	}
	.roca-intl__jpLink {
		height: 40px;
		border-radius: 13px;
		padding: 0 10px;
	}
	/* .roca-intl__snsIcon {
		width: 25px;
		height: 25px;
	} */
}

.roca-intl__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	letter-spacing: 0.02em;
}
.roca-intl__brandLink {
	display: inline-flex;
	align-items: center;
	line-height: 0;
	height: calc(65px * var(--roca-logo-scale));
}
.roca-intl__brandLogo {
	display: block;
	height: 100%;
	width: auto;
}
.roca-intl__brandSub {
	font-size: 13px;
	color: var(--intl-muted);
}
.roca-intl__badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--intl-muted);
	border: 1px solid var(--intl-border);
	background: rgba(255, 255, 255, 0.65);
	padding: 8px 10px;
	border-radius: 999px;
}
.roca-intl__badgeDot {
	width: 8px;
	height: 8px;
	border-radius: 999px;
	background: linear-gradient(135deg, var(--intl-accent) 0%, var(--intl-accent-2) 100%);
	box-shadow: 0 0 0 3px rgba(124, 246, 198, 0.14);
}

.roca-intl__hero {
	position: relative;
	padding: 34px 0 26px;
}
.roca-intl__heroCard {
	position: relative;
	overflow: hidden;
	/* border-radius: calc(var(--intl-radius) + 6px);
	box-shadow: var(--intl-shadow); */
	border: 1px solid var(--intl-border);
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.86) 50%, rgba(255, 255, 255, 0.92) 100%);
	min-height: 420px;
}
.roca-intl__heroCard.hasImage {
	min-height: 0;
}
.roca-intl__heroBg {
	position: relative;
}
.roca-intl__heroPicture {
	display: block;
}
.roca-intl__heroImg {
	display: block;
	width: 100%;
	height: auto;
}
.roca-intl__heroBg.hasImage::after {
	content: none;
}
.roca-intl__heroBg.hasImage .roca-intl__heroImg {
	filter: saturate(1.05) contrast(1.02);
}
.roca-intl__heroInner {
	position: relative;
	padding: 28px 18px 22px;
}
.roca-intl__heroGrid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
	align-items: end;
}

.roca-intl__kicker {
	color: var(--intl-muted);
	font-size: 12px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.roca-intl__title {
	margin: 10px 0 0;
	font-size: clamp(28px, 4.2vw, 46px);
	line-height: 1.12;
	letter-spacing: -0.01em;
}
.roca-intl__lead {
	margin: 14px 0 0;
	max-width: 62ch;
	color: var(--intl-muted);
	font-size: clamp(14px, 1.7vw, 16px);
}

.roca-intl__heroMeta {
	display: grid;
	grid-template-columns: 1fr;
	gap: 10px;
}
.roca-intl__pill {
	display: grid;
	gap: 2px;
	padding: 12px 14px;
	border-radius: 16px;
	border: 1px solid var(--intl-border);
	background: rgba(255, 255, 255, 0.78);
}
.roca-intl__pillLabel {
	font-size: 12px;
	color: var(--intl-muted-2);
}
.roca-intl__pillValue {
	font-size: 14px;
	color: var(--intl-text);
}

.roca-intl__section {
	padding: 18px 0;
}

.roca-intl__section--visit {
	background: #f7fafd;
	padding: 100px 0;
}

.roca-intl__section--testimonials {
	background: #f7fafd;
	padding: 100px 0;
}

.roca-intl__section--route-setting {
	position: relative;
	background-image: url('../images/international/gallery4.jpg');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	padding: 100px 0;
}

.roca-intl__section--route-setting::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: rgba(17, 24, 39, 0.85); /* 濃いネイビーの透過処理 */
	z-index: 1;
}

.roca-intl__section--route-setting .roca-intl__container {
	position: relative;
	z-index: 2;
}

.roca-intl__section--visit .roca-intl__sectionCard {
	background: transparent;
}

.roca-intl__section--testimonials .roca-intl__sectionCard {
	background: transparent;
}

.roca-intl__section--route-setting .roca-intl__sectionCard {
	background: transparent;
}

.roca-intl__routeSetting {
	/* 古いブラウザ対応: Flexboxフォールバック */
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* モダンブラウザ: Gridを使用 */
@supports (display: grid) {
	.roca-intl__routeSetting {
		display: grid;
		grid-template-columns: 1fr;
		gap: 30px;
		align-items: center;
	}
}

/* 古いブラウザ用: gapの代わりにmargin */
.roca-intl__routeSetting > *:not(:first-child) {
	margin-top: 30px;
}

@supports (display: grid) {
	.roca-intl__routeSetting > *:not(:first-child) {
		margin-top: 0;
	}
}

.roca-intl__routeSettingCarousel {
	position: relative;
}

/* Route setting: Splide carousel */
.roca-intl__routeSettingCarousel .roca-intl__routeSettingSplide {
	overflow: hidden;
}

.roca-intl__routeSettingCarousel .splide__slide {
	margin: 0;
}

.roca-intl__routeSettingSlide {
	position: relative;
	overflow: hidden;
	border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, 0.2);
}

.roca-intl__routeSettingSlide img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

.roca-intl__routeSettingCarousel .roca-intl__routeSettingPagination {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

/* 古いブラウザ用: gapの代わりにmargin */
.roca-intl__routeSettingCarousel .roca-intl__routeSettingPagination > *:not(:first-child) {
	margin-left: 10px;
}

/* モダンブラウザ: gapを使用 */
@supports (gap: 10px) {
	.roca-intl__routeSettingCarousel .roca-intl__routeSettingPagination {
		gap: 10px;
	}
	.roca-intl__routeSettingCarousel .roca-intl__routeSettingPagination > *:not(:first-child) {
		margin-left: 0;
	}
}

.roca-intl__routeSettingCarousel .roca-intl__routeSettingDot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 0;
	background: rgba(255, 255, 255, 0.4);
	cursor: pointer;
	transition: background-color 200ms ease, transform 200ms ease;
	padding: 0;
}

.roca-intl__routeSettingCarousel .roca-intl__routeSettingDot:hover {
	background: rgba(255, 255, 255, 0.6);
	transform: scale(1.1);
}

.roca-intl__routeSettingCarousel .roca-intl__routeSettingDot.is-active {
	background: #ffffff;
	transform: scale(1.2);
}

.roca-intl__routeSettingCarousel .roca-intl__routeSettingDot:focus-visible {
	outline: 2px solid rgba(255, 255, 255, 0.9);
	outline-offset: 2px;
}

.roca-intl__routeSettingContent {
	color: #ffffff;
}

.roca-intl__section--route-setting .roca-intl__h2 {
	color: #ffffff;
	margin-bottom: 32px;
}

.roca-intl__section--route-setting .roca-intl__text {
	color: #ffffff;
}

.roca-intl__routeSettingItems {
	/* 古いブラウザ対応: Flexboxフォールバック */
	display: flex;
	flex-direction: column;
}

/* モダンブラウザ: Gridを使用 */
@supports (display: grid) {
	.roca-intl__routeSettingItems {
		display: grid;
		grid-template-columns: 1fr;
		gap: 0;
	}
}

.roca-intl__routeSettingItem {
	display: flex;
	flex-direction: column;
	padding-bottom: 28px;
	margin-bottom: 20px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}

/* 古いブラウザ用: gapの代わりにmargin */
.roca-intl__routeSettingItem > *:not(:first-child) {
	margin-top: 12px;
}

/* モダンブラウザ: gapを使用 */
@supports (gap: 12px) {
	.roca-intl__routeSettingItem {
		gap: 12px;
	}
	.roca-intl__routeSettingItem > *:not(:first-child) {
		margin-top: 0;
	}
}

.roca-intl__routeSettingItem:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.roca-intl__routeSettingItemTitle {
	margin: 0 0 8px;
	font-size: clamp(20px, 2.2vw, 28px);
	font-weight: 700;
	letter-spacing: -0.01em;
	color: #ffffff;
	line-height: 1.3;
	font-family: "Oswald", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}

.roca-intl__routeSettingItemText {
	margin: 0;
	color: rgba(255, 255, 255, 0.92);
	font-size: 16px;
	line-height: 1.65;
}

@media (min-width: 740px) {
	/* 古いブラウザ対応: Flexboxフォールバック */
	.roca-intl__routeSetting {
		flex-direction: row;
		align-items: flex-start;
	}
	
	.roca-intl__routeSetting > *:not(:first-child) {
		margin-top: 0;
		margin-left: 40px;
	}
	
	/* モダンブラウザ: Gridを使用 */
	@supports (display: grid) {
		.roca-intl__routeSetting {
			grid-template-columns: 1fr 1fr;
			gap: 40px;
		}
		
		.roca-intl__routeSetting > *:not(:first-child) {
			margin-left: 0;
		}
	}
	
	.roca-intl__routeSettingItem {
		padding-bottom: 32px;
	}
}

/* Sections with #f7fafd background: reduce padding on mobile */
@media (max-width: 739px) {
	.roca-intl__section--visit {
		padding: 20px 0;
	}
	.roca-intl__section--testimonials {
		padding: 15px;
	}
	.roca-intl__section--route-setting {
		padding: 40px 0;
	}
	.roca-intl__section--route-setting .roca-intl__h2 {
		text-align: center;
	}
}

.roca-intl__section--pricing .roca-intl__h2,
.roca-intl__section--pricing .roca-intl__muted,
.roca-intl__section--testimonials .roca-intl__h2,
.roca-intl__section--photos .roca-intl__h2,
.roca-intl__section--photos .roca-intl__text {
	text-align: center;
}
.roca-intl__section--pricing .roca-intl__muted {
	margin-left: auto;
	margin-right: auto;
	max-width: 72ch;
}

.roca-intl__sectionCard {
	padding: 18px;
}
@media (max-width: 739px) {
	.roca-intl__sectionCard {
		padding: 10px;
	}
}

.roca-intl__h2 {
	margin: 0 0 10px;
	font-size: clamp(28px, 3.2vw, 48px);
	letter-spacing: -0.01em;
	font-family: "Oswald", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}
.roca-intl__muted {
	color: var(--intl-muted);
	margin: 0;
}

.roca-intl__visit {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	align-items: start;
}

.roca-intl__visitMap {
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(17, 24, 39, 0.12);
	box-shadow: 0 18px 60px rgba(17, 24, 39, 0.14);
	min-height: 600px;
	background: #eef1f5;
}

@media (max-width: 739px) {
	.roca-intl__visitMap {
		min-height: 400px;
	}
}
.roca-intl__visitMap iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.roca-intl__visitPin {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	pointer-events: none;
}
.roca-intl__visitPin i {
	width: 76px;
	height: 76px;
	border-radius: 999px;
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, 0.78);
	border: 2px solid rgba(17, 24, 39, 0.14);
	color: rgba(17, 24, 39, 0.86);
	backdrop-filter: blur(8px);
	font-size: 30px;
}

.roca-intl__visitTitle {
	margin: 0;
	font-size: clamp(28px, 3.2vw, 48px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	font-family: "Oswald", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}
.roca-intl__visitLead {
	margin: 12px 0 0;
	color: var(--intl-muted);
	font-size: 16px;
}

.roca-intl__visitGrid {
	margin-top: 20px;
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
}

.roca-intl__visitItem {
	display: grid;
	grid-template-columns: 60px 1fr;
	gap: 16px;
	align-items: start;
}

.roca-intl__visitIcon {
	width: 60px;
	height: 60px;
	border-radius: 12px;
	background: rgba(119, 184, 255, 0.18);
	border: 1px solid rgba(119, 184, 255, 0.22);
	display: grid;
	place-items: center;
	color: rgba(17, 24, 39, 0.78);
}
.roca-intl__visitIcon i {
	font-size: 22px;
	line-height: 1;
}

@media (max-width: 739px) {
	.roca-intl__visitGrid { gap: 14px; margin-top: 14px; }

	.roca-intl__visitItem {
		grid-template-columns: 45px 1fr;
		gap: 12px;
	}
	.roca-intl__visitIcon {
		width: 45px;
		height: 45px;
		border-radius: 10px;
	}
	.roca-intl__visitIcon i { font-size: 18px; }

	.roca-intl__visitItemTitle { font-size: 18px; }
	.roca-intl__visitItemText { font-size: 14px; margin-top: 4px; }
}

.roca-intl__visitItemTitle {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: rgba(17, 24, 39, 0.92);
}
.roca-intl__visitItemText {
	margin-top: 6px;
	color: rgba(17, 24, 39, 0.74);
	font-size: 16px;
	line-height: 1.55;
}

.roca-intl__visitList {
	list-style: none;
	margin: 0;
	padding: 0;
}
.roca-intl__visitList li {
	position: relative;
	padding-left: 1.2em;
}
.roca-intl__visitList li::before {
	content: "■";
	position: absolute;
	left: 0;
	top: 0.4em;
	font-size: 0.95em;
	line-height: 1;
}
.roca-intl__visitList li + li {
	margin-top: 8px;
}

.roca-intl__visitCta {
	margin-top: 18px;
}
.roca-intl__visitLink {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	color: rgba(17, 24, 39, 0.88);
	text-decoration: none;
	border-bottom: 1px solid rgba(17, 24, 39, 0.28);
	padding-bottom: 2px;
}
.roca-intl__visitLink:hover {
	border-bottom-color: rgba(17, 24, 39, 0.55);
}

/* Why Choose Us Section */
.roca-intl__section--why {
	padding: 100px 0;
	background: #ffffff;
}

@media (max-width: 739px) {
	.roca-intl__section--why {
		padding: 20px 0;
	}
}

.roca-intl__why {
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
	align-items: center;
}

.roca-intl__whyBody {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.roca-intl__whyKicker {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 4px;
}

.roca-intl__whyKickerDot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #ff6b35;
	flex-shrink: 0;
}

.roca-intl__whyKickerText {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #ff6b35;
}

.roca-intl__whyTitle {
	margin: 0;
	font-size: clamp(28px, 3.2vw, 48px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	font-family: "Oswald", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
	color: rgba(17, 24, 39, 0.92);
	font-weight: 800;
}

.roca-intl__whyLead {
	margin: 0;
	max-width: 60ch;
	color: var(--intl-muted);
	font-size: 16px;
	line-height: 1.6;
}

.roca-intl__whyQuote {
	position: relative;
	margin: 18px 0 0;
	padding: 20px 20px 20px 60px;
	background: rgba(17, 24, 39, 0.04);
	border-radius: 12px;
	border: 0;
}

.roca-intl__whyQuoteIcon {
	position: absolute;
	left: 20px;
	top: 20px;
	font-size: 48px;
	line-height: 1;
	color: #ff6b35;
	font-family: serif;
}

.roca-intl__whyQuoteText {
	margin: 0;
	font-style: italic;
	color: rgba(17, 24, 39, 0.78);
	font-size: 16px;
	line-height: 1.6;
}

.roca-intl__whyList {
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.roca-intl__whyListItem {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.roca-intl__whyListIcon {
	color: #ff6b35;
	font-size: 18px;
	line-height: 1.5;
	flex-shrink: 0;
}

.roca-intl__whyListText {
	color: rgba(17, 24, 39, 0.78);
	font-size: 16px;
	line-height: 1.5;
}

.roca-intl__whyCta {
	margin-top: 8px;
}

.roca-intl__whyButton {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	background: #ff6b35;
	color: #ffffff;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	border-radius: 12px;
	transition: transform 140ms ease, box-shadow 140ms ease, background-color 140ms ease;
}

.roca-intl__whyButton:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 24px rgba(255, 107, 53, 0.35);
	background: #ff5722;
}

.roca-intl__whyButton:focus-visible {
	outline: 2px solid rgba(255, 107, 53, 0.9);
	outline-offset: 2px;
}

.roca-intl__whyButton i {
	font-size: 14px;
}

.roca-intl__whyMedia {
	position: relative;
}

/* ===== ギャラリーレイアウト本体 ===== */
.roca-intl__whyGallery {
	position: relative;
	padding-left: 25px; /* 左の縦ラベル分 */
}

.roca-intl__whyGallerySideLabel {
	position: absolute;
	left: 0;
	top: 8px;
	margin: 0;
	letter-spacing: .28em;
	font-weight: 700;
	color: rgba(15, 31, 46, .12);
	transform: rotate(-90deg);
	transform-origin: left top;
	/* 位置微調整 */
	translate: -18px 120px;
	white-space: nowrap;
	user-select: none;
}

.roca-intl__whyGalleryTitle {
	margin: 0 0 16px;
	font-size: 18px;
	font-weight: 700;
	color: #182b3c;
}

.roca-intl__whyGalleryGrid {
	display: grid;
	gap: 14px;
	align-items: end;
}

/* 画像共通 */
.roca-intl__whyGalleryItem {
	margin: 0;
	overflow: hidden;
	background: #f3f6f9;
}
.roca-intl__whyGalleryItem img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

/* モバイル：縦積み */
.roca-intl__whyGalleryItem--1 { aspect-ratio: 16 / 9; }
.roca-intl__whyGalleryItem--2 {
	aspect-ratio: 1 / 1;
	width: 200px;
	height: 200px;
}
.roca-intl__whyGalleryItem--3 { aspect-ratio: 3 / 2; }

/* View more */
.roca-intl__whyGalleryMore {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: 18px;
	text-decoration: none;
	color: #1a2a3a;
	font-weight: 600;
}
.roca-intl__whyGalleryMore:hover {
	text-decoration: underline;
}
.roca-intl__whyGalleryArrow {
	display: inline-block;
	translate: 0 1px;
}

/* ===== タブレット以上：コラージュ配置 ===== */
@media (min-width: 768px) {
	.roca-intl__whyGalleryGrid {
		display: grid;
		grid-template-columns: 1.2fr 200px 1fr;
		grid-template-areas:
			"img1 img1 img1"
			"img2 img3 img3";
		gap: 22px 0;
		column-gap: 10px;
		align-items: end;
	}

	.roca-intl__whyGalleryItem--1 {
		grid-area: img1;
		aspect-ratio: 3 / 2; /* 上の横長 */
	}

	.roca-intl__whyGalleryItem--2 {
		grid-area: img2;
		aspect-ratio: 1 / 1;
		width: 200px;
		height: 200px;
		justify-self: start;
		align-self: center;
	}

	.roca-intl__whyGalleryItem--3 {
		grid-area: img3;
		aspect-ratio: 3 / 2;
		/* 右下を少し大きく＆上に食い込ませてコラージュ感 */
		width: 100%;
		justify-self: start;
		transform: translateY(-24px);
	}

	.roca-intl__whyGalleryMore {
		display: inline-flex;
		align-items: center;
		gap: 10px;
		margin-top: 18px;
		margin-left: 0;
	}
}

/* ===== PC：さらに少しだけ詰める ===== */
@media (min-width: 1024px) {
	.roca-intl__whyGallery {
		gap: 26px;
	}
	.roca-intl__whyGalleryGrid {
		gap: 26px;
		column-gap: 10px;
	}
	.roca-intl__whyGalleryItem--3 {
		aspect-ratio: 3 / 2;
		width: 100%;
	}
}

/* ===== 1280px：見た目微調整 ===== */
@media (min-width: 1280px) {
	.roca-intl__whyGallerySideLabel {
		translate: -18px 140px;
	}
}

@media (min-width: 740px) {
	.roca-intl__why {
		grid-template-columns: 5fr 7fr;
		gap: 40px;
		align-items: center;
	}
}


.roca-intl__grid2 {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
	margin-top: 12px;
}

.roca-intl__list {
	margin: 12px 0 0;
	padding-left: 18px;
	color: var(--intl-muted);
}
.roca-intl__list li { margin: 6px 0; }

.roca-intl__steps {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin-top: 12px;
}
.roca-intl__step {
	border-radius: 16px;
	border: 1px solid var(--intl-border);
	background: rgba(255, 255, 255, 0.72);
	padding: 14px;
}
.roca-intl__stepNo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 12px;
	font-weight: 800;
	background: linear-gradient(135deg, rgba(124, 246, 198, 0.20) 0%, rgba(119, 184, 255, 0.18) 100%);
	border: 1px solid var(--intl-border);
	margin-bottom: 8px;
}
.roca-intl__stepTitle {
	margin: 0 0 6px;
	font-size: 15px;
}
.roca-intl__stepBody {
	margin: 0;
	color: var(--intl-muted);
	font-size: 14px;
}

.roca-intl__tableWrap {
	overflow: auto;
	border: 1px solid var(--intl-border);
	background: rgba(255, 255, 255, 0.78);
	margin-top: 12px;
}

.roca-intl__priceGroups {
	margin-top: 16px;
	display: grid;
	gap: 32px;
}

.roca-intl__priceGroup {
	padding: 18px;
	background: rgba(255, 255, 255, 0.65);
}

.roca-intl__priceGroupTitle {
	margin: 0;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -0.01em;
	border-bottom: 1px solid #999999;
	padding-bottom: 5px;
}

.roca-intl__priceGroupLead {
	margin: 8px 0 0;
	color: var(--intl-muted);
}
.roca-intl__table {
	width: 100%;
	min-width: 520px;
	border-collapse: collapse;
	table-layout: fixed;
}
.roca-intl__table th,
.roca-intl__table td {
	padding: 12px 14px;
	border-bottom: 1px solid rgba(17, 24, 39, 0.10);
	text-align: left;
	vertical-align: top;
	font-size: 18px;
}

/* Pricing tables: align first column widths */
.roca-intl__priceGroups .roca-intl__table th:first-child,
.roca-intl__priceGroups .roca-intl__table td:first-child {
	width: 220px;
}
.roca-intl__table th {
	color: var(--intl-muted);
	font-weight: 700;
	background: #f7fafd;
}
.roca-intl__price {
	font-weight: 800;
	letter-spacing: 0.01em;
}

/* Pricing: 740px–1024px — prevent layout break, allow horizontal scroll */
@media (max-width: 1024px) and (min-width: 740px) {
	.roca-intl__priceGroup {
		min-width: 0; /* allow grid child to shrink so overflow works */
	}
	.roca-intl__tableWrap {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		min-width: 0;
	}
	.roca-intl__priceGroups .roca-intl__table th:first-child,
	.roca-intl__priceGroups .roca-intl__table td:first-child {
		width: 180px; /* slightly narrower to fit mid-range viewports */
	}
	.roca-intl__table th,
	.roca-intl__table td {
		font-size: 16px;
		padding: 10px 12px;
	}
}

/* Pricing: mobile adjustments to prevent overflow/breakage */
@media (max-width: 739px) {
	.roca-intl__priceGroups { gap: 22px; }
	.roca-intl__priceGroup { padding: 0px; }

	.roca-intl__tableWrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.roca-intl__table { min-width: 0; }
	.roca-intl__table th,
	.roca-intl__table td {
		font-size: 14px;
		padding: 10px 12px;
	}

}
.roca-intl__note {
	margin: 20px 0 0;
	padding: 18px 20px;
	background-color: rgba(255, 200, 200, 0.3);
	border-radius: 8px;
	color: rgba(17, 24, 39, 0.85);
	font-size: 16px;
	line-height: 1.6;
}
.roca-intl__note strong {
	color: rgba(17, 24, 39, 0.90);
	font-weight: 700;
	display: block;
	margin-bottom: 8px;
}
.roca-intl__noteList {
	margin: 0;
	padding-left: 20px;
	list-style: disc;
}
.roca-intl__noteList li {
	margin: 6px 0;
}

/* International Visitors: Splide carousel */
.roca-intl__photosCarousel {
	margin-top: 18px;
}

.roca-intl__photosCarousel .roca-intl__photosSplide {
	overflow: hidden;
}

.roca-intl__photosCarousel .splide__slide {
	margin: 0;
}

.roca-intl__photosSlide {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
}

.roca-intl__photosSlide img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
}

.roca-intl__photosCarousel .roca-intl__photosPagination {
	display: flex;
	justify-content: center;
	margin-top: 28px;
	gap: 10px;
}

.roca-intl__photosCarousel .roca-intl__photosDot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 0;
	background: rgba(17, 24, 39, 0.25);
	cursor: pointer;
	transition: background-color 200ms ease, transform 200ms ease;
	padding: 0;
}

.roca-intl__photosCarousel .roca-intl__photosDot:hover {
	background: rgba(17, 24, 39, 0.45);
	transform: scale(1.1);
}

.roca-intl__photosCarousel .roca-intl__photosDot.is-active {
	background: #ff6b35;
	transform: scale(1.2);
}

.roca-intl__photosCarousel .roca-intl__photosDot:focus-visible {
	outline: 2px solid rgba(255, 107, 53, 0.9);
	outline-offset: 2px;
}

/* 既存のphotoGridスタイル（他の場所で使用されている可能性があるため保持） */
.roca-intl__photoGrid:not([data-carousel-track]) {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
	margin-top: 12px;
}

.roca-intl__carousel {
	margin-top: 18px;
}

.roca-intl__carouselControls {
	display: flex;
	justify-content: center;
	gap: 14px;
	margin-top: 28px;
}

.roca-intl__carouselBtn {
	width: 56px;
	height: 56px;
	border-radius: 12px;
	border: 0;
	background: rgba(119, 184, 255, 0.5);
	color: rgba(17, 24, 39, 0.88);
	display: grid;
	place-items: center;
	cursor: pointer;
}
.roca-intl__carouselBtn:disabled {
	opacity: 0.35;
	cursor: default;
}

.roca-intl__carouselViewport {
	position: relative;
}

.roca-intl__testimonialsGrid {
	display: flex;
	gap: 18px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 2px;
	-webkit-overflow-scrolling: touch;
	padding: 4px 2px 10px;
	scroll-behavior: smooth;
}
.roca-intl__testimonialsGrid::-webkit-scrollbar { display: none; }
.roca-intl__testimonialsGrid { scrollbar-width: none; }
.roca-intl__testimonialsGrid.isDragging { cursor: grabbing; }
.roca-intl__testimonial {
	display: flex;
	flex-direction: column;
	border: 1px solid rgba(17, 24, 39, 0.10);
	background: #ffffff;
	padding: 28px 28px 24px;
	border-radius: 12px;
	box-shadow: 0 0px 10px rgba(17, 24, 39, 0.08);
	flex: 0 0 86%;
	max-width: 520px;
	scroll-snap-align: start;
}

@media (max-width: 739px) {
	.roca-intl__testimonial {
		padding: 15px;
	}
}

.roca-intl__testimonialStars {
	display: inline-flex;
	gap: 10px;
	color: #f59e0b;
	font-size: 18px;
	line-height: 1;
}

.roca-intl__testimonialDate {
	margin-top: 16px;
	display: flex;
	gap: 10px;
	align-items: baseline;
	color: rgba(17, 24, 39, 0.72);
	font-size: 18px;
}
.roca-intl__testimonialDateLabel {
	font-weight: 800;
	color: rgba(17, 24, 39, 0.92);
}
.roca-intl__testimonialDateValue {
	font-weight: 400;
}
.roca-intl__testimonialText {
	margin: 18px 0 0;
	color: rgba(17, 24, 39, 0.78);
	font-size: 16px;
	line-height: 1.65;
}
.roca-intl__testimonialMeta {
	margin-top: auto;
	padding-top: 26px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.roca-intl__testimonialName {
	font-weight: 800;
	color: rgba(17, 24, 39, 0.92);
	font-size: 18px;
}
.roca-intl__photo {
	position: relative;
	overflow: hidden;
	border-radius: 16px;
	border: 1px solid var(--intl-border);
	background:
		radial-gradient(220px 160px at 25% 30%, rgba(124, 246, 198, 0.16), transparent 60%),
		radial-gradient(220px 160px at 80% 10%, rgba(119, 184, 255, 0.16), transparent 60%),
		linear-gradient(180deg, rgba(255,255,255,0.90) 0%, rgba(255,255,255,0.75) 100%);
	aspect-ratio: 3 / 4;
}
.roca-intl__photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(1.02);
}
.roca-intl__photoLabel {
	position: absolute;
	left: 10px;
	bottom: 10px;
	font-size: 12px;
	color: rgba(17, 24, 39, 0.82);
	background: rgba(255, 255, 255, 0.72);
	border: 1px solid var(--intl-border);
	padding: 6px 8px;
	border-radius: 999px;
	backdrop-filter: blur(10px);
}

.roca-intl__cta {
	margin: 18px 0 10px;
	border-radius: calc(var(--intl-radius) + 6px);
	border: 1px solid var(--intl-border);
	background: linear-gradient(135deg, rgba(124, 246, 198, 0.14) 0%, rgba(119, 184, 255, 0.12) 50%, rgba(255, 211, 111, 0.10) 100%);
	padding: 18px;
}
.roca-intl__ctaTitle {
	margin: 0 0 6px;
	font-size: 16px;
}
.roca-intl__ctaBody {
	margin: 0;
	color: var(--intl-muted);
	font-size: 14px;
}

.roca-intl__footer {
	padding: 12px 0;
	background: #323c48;
	color: rgba(255, 255, 255, 0.92);
	font-size: 12px;
	text-align: center;
}

@media (min-width: 740px) {
	.roca-intl__visit { grid-template-columns: 0.95fr 1.05fr; gap: 34px; align-items: center; }
	.roca-intl__visitBody { padding-left: 18px; }
	.roca-intl__visitGrid { grid-template-columns: 1fr 1fr; gap: 22px 26px; }

	.roca-intl__priceGroups { grid-template-columns: 1fr 1fr; gap: 26px; align-items: start; }

	.roca-intl__grid2 { grid-template-columns: 1fr 1fr; }
	.roca-intl__steps { grid-template-columns: repeat(2, 1fr); }
	.roca-intl__photoGrid:not([data-carousel-track]) { grid-template-columns: repeat(2, 1fr); gap: 12px; }
	.roca-intl__testimonial { flex-basis: 420px; }
}

@media (min-width: 1024px) {
	.roca-intl__heroCard { min-height: 520px; }
	.roca-intl__heroCard.hasImage { min-height: 0; }
	.roca-intl__steps { grid-template-columns: repeat(3, 1fr); }
	.roca-intl__photoGrid:not([data-carousel-track]) { grid-template-columns: repeat(4, 1fr); gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	.roca-intl__top { scroll-behavior: auto; }
}

/* Photo Gallery */
.roca-intl__photosGallery {
	margin-top: 20px;
}

.roca-intl__photosGrid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-auto-rows: 8px;
	grid-auto-flow: row dense;
	gap: 14px;
	margin-top: 20px;
}

.roca-intl__photosGridItem {
	position: relative;
	overflow: hidden;
	border-radius: 12px;
	border: 1px solid var(--intl-border);
	background: #f3f6f9;
}

.roca-intl__photosGridItem a {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}

.roca-intl__photosGridItem a::before {
	content: '';
	position: absolute;
	inset: 0;
	background-color: rgba(255, 255, 255, 0);
	transition: background-color 0.3s ease;
	z-index: 1;
	pointer-events: none;
}

.roca-intl__photosGridItem:hover a::before {
	background-color: rgba(255, 255, 255, 0.3);
}

.roca-intl__photosGridItem img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.3s ease;
}

.roca-intl__photosGridItem:hover img {
	transform: scale(1.05);
}

/* アスペクト比のバリエーション - grid-row: spanで高さを制御してMasonry効果を実現 */
/* aspect-ratioは削除し、grid-row: spanの値だけで高さを制御 */
.roca-intl__photosGridItem--square {
	grid-row: span 10;
	/* 正方形の高さを表現 */
}

.roca-intl__photosGridItem--wide {
	grid-row: span 8;
	/* 3:2の横長の高さを表現 */
}

.roca-intl__photosGridItem--tall {
	grid-row: span 15;
	/* 2:3の縦長の高さを表現 */
}

.roca-intl__photosGridItem--wide-16-9 {
	grid-row: span 12;
	/* 16:9の横長の高さを表現 */
}

/* タブレット: 3列 */
@media (min-width: 768px) {
	.roca-intl__photosGrid {
		grid-template-columns: repeat(3, 1fr);
		gap: 16px;
		grid-auto-rows: 10px;
	}
	
	.roca-intl__photosGridItem--square {
		grid-row: span 10;
	}
	
	.roca-intl__photosGridItem--wide {
		grid-row: span 8;
	}
	
	.roca-intl__photosGridItem--tall {
		grid-row: span 15;
	}
	
	.roca-intl__photosGridItem--wide-16-9 {
		grid-row: span 12;
	}
}

/* デスクトップ: 4列 */
@media (min-width: 1024px) {
	.roca-intl__photosGrid {
		grid-template-columns: repeat(4, 1fr);
		gap: 18px;
		grid-auto-rows: 12px;
	}
	
	.roca-intl__photosGridItem--square {
		grid-row: span 10;
	}
	
	.roca-intl__photosGridItem--wide {
		grid-row: span 8;
	}
	
	.roca-intl__photosGridItem--tall {
		grid-row: span 15;
	}
	
	.roca-intl__photosGridItem--wide-16-9 {
		grid-row: span 12;
	}
}

