/* 패밀리사이트 롤링 배너 (메인·서브 공통) */
.main_family_banner {
	background-color: #fff;
	border-top: 1px solid #eee;
}
.main_family_banner .top_con { background-color: #fff; }
.main_family_banner .roling-wrap {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.main_family_banner .roling-box {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	height: 100px;
	overflow: hidden;
}
.main_family_banner .roling-box::before,
.main_family_banner .roling-box::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 10px;
	z-index: 2;
	pointer-events: none;
}
.main_family_banner .roling-box::before {
	left: 0;
	background: linear-gradient(to right, #fff 0%, rgba(255, 255, 255, 0) 100%);
}
.main_family_banner .roling-box::after {
	right: 0;
	background: linear-gradient(to left, #fff 0%, rgba(255, 255, 255, 0) 100%);
}
.main_family_banner .rolling-list {
	display: flex;
	gap: 0 40px;
	width: max-content;
	align-items: center;
	will-change: transform;
}
.main_family_banner .rolling-list.is-rolling {
	animation: familyRolling var(--family-roll-duration, 40s) linear infinite;
}
.main_family_banner .rolling-list.is-rolling:hover {
	animation-play-state: paused;
}
@keyframes familyRolling {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}
.main_family_banner .rolling-list li.roll {
	width: 175px;
	height: 59px;
	cursor: pointer;
	flex-shrink: 0;
}
.main_family_banner .rolling-list li.roll.roll-kpsm {
	width: 120px;
}
.main_family_banner .rolling-list li.roll a {
	position: relative;
	display: block;
	height: 100%;
}
.main_family_banner .rolling-list li.roll a > img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: left center;
}
@media (prefers-reduced-motion: reduce) {
	.main_family_banner .rolling-list.is-rolling {
		animation: none;
	}
}
@media screen and (max-width: 834px) {
	.main_family_banner .roling-wrap {
		padding-left: 20px;
		padding-right: 20px;
		box-sizing: border-box;
	}
}
@media screen and (max-width: 768px) {
	.main_family_banner .roling-box { height: 65px; }
}