/**
 * Toppage
 */
 :root {
    --color-Background-Primary: #FFFFFF;
    --color-Background-Secondary: #F5F5F5;
    --color-Text-Primary: #202E30;
    --color-Text-White: #FFFFFF;
    --color-Theme-Primary: #80A81B;
    --color-Theme-Light: #B7CD7C;
    --color-Accent-Primary: #FFA81B;
    --color-Accent-Secondary: #FFDB1B;
    --color-Gray-Light: #EDEEEE;
    --color-Gray-Medium: #BFBFBF;
    --color-Gray-Dark: #676E6E;

    --section-padding: 64px;
    @media (min-width: 768px) {
        --section-padding: 80px;
    }
}
.header-navigation .navigation-list .item-01 a {
	background-color: #FFFFFF;
	cursor: default;
}
.header-navigation .navigation-list .item-01 a:hover, .header-navigation .navigation-list .item-01 a:focus, .header-navigation .navigation-list .item-01 a:active {
	opacity: 1;
}

@media screen and (min-width: 64em) {
	.header-navigation .navigation-list .item-01 {
		position: relative;
	}
	.header-navigation .navigation-list .item-01::after {
		display: block;
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 2px;
		content: "";
		background-color: #80A31B;
	}
}
/* common.css 追加 */
.l-main {
	line-height: 1.0;
}
.topsp-only {
	display: block;
}
.toppc-only {
	display: none;
}
@media (min-width: 768px) {
	.topsp-only {
		display: none;
	}
	.toppc-only {
		display: block;
	}
}
figure {
	margin: 0;
	padding: 0;
}
section {
	position: relative;
	padding: var(--section-padding) 0;
}
.container {
    position: relative;
	width: calc(100% - 40px);
	max-width: 1200px;
	margin: 0 auto;
}
@media (min-width: 768px) {
	.container {
		width: calc(100% - 64px);
	}
}
@media (min-width: 1024px) {
	.container {
		width: calc(100% - 96px);
	}
}
.child-content + .child-content {
	margin-top: 48px;
}
@media (min-width: 768px) {
	.child-content + .child-content {
		margin-top: 64px;
	}
}

/* button */
.cta-button {
	margin: 48px auto 0;
	width: 100%;
	max-width: 480px;
	p {
		position: relative;
		&::before {
			content: "";
			position: absolute;
			top: 0;
			left: 50%;
			z-index: 1;
			transform: translate(-50%, -50%);
			width: 280px;
			height: auto;
			aspect-ratio: 280 / 39;
			background-position: center;
			background-repeat: no-repeat;
			background-size: cover;
			background-image: url(/web/jp/channel/top/img/new/img_btn_bubble.svg);
		}
		.btn {
			font-size: 24px;
			font-weight: bold;
			letter-spacing: .05em;
		}
	}
}
/* button */
.more-button {
	margin-top: 48px;
	margin-inline: auto;
	max-width: 480px;
	.btn {
		background-color: var(--color-Text-Primary);
		color: var(--color-Text-White);
		font-size: 18px;
		font-weight: bold;
		&:hover {
			color: var(--color-Text-Primary);
			background-color: var(--color-Text-White);
		}
	}
	.btn-icon-self:hover::after {
		background-image: url(/web/jp/channel/img/icon_self_black.png);
	}
	.btn-icon-blank:hover::after {
		background-image: url(/web/jp/channel/img/icon_blank_black.png);
	}
}
.function-button {
	.btn {
		width: 190px;
		height: 48px;
		background-color: var(--color-Text-Primary);
		color: var(--color-Text-White);
		font-size: 14px;
		font-weight: bold;
		&:hover {
			color: var(--color-Text-Primary);
			background-color: var(--color-Text-White);
			&::after {
			background-image: url(/web/jp/channel/img/icon_self_black.png);
			}
		}
	}
}
.color-theme {
	color: var(--color-Theme-Primary);
}
.color-accent {
	color: var(--color-Accent-Primary);
}
.text-band {
	display: inline-block;
	padding: 0 .25em;
	background-color: var(--color-Theme-Primary);
	color: var(--color-Text-White);
}
.text-dot {
	padding-top: 0.4em;
	background-repeat: repeat-x;
	background-position: left top;
	background-size: 1.0em .20em;
	background-image: radial-gradient(circle at center, var(--color-Text-Primary) 20%, transparent 20%);
	font-weight: 700;
}
.text-dot.color-theme {
	background-image: radial-gradient(circle at center, var(--color-Theme-Primary) 20%, transparent 20%);
}
.text-dot.color-white {
	background-image: radial-gradient(circle at center, var(--color-Text-White) 20%, transparent 20%);
}

/* heading h2 */
.common-heading {
	margin-bottom: 2em;
	font-size: min(calc(24 / 390 * 100vw), 24px);
	line-height: 1.5;
	text-align: center;
}
@media (min-width: 768px) {
	.common-heading {
		font-size: min(calc(32 / 1200 * 100vw), 32px);
	}
}
.common-heading-line {
    position: relative;
    margin-inline: auto;
	width: fit-content;
    padding-bottom: 0.5em;
    border-bottom: 3px solid var(--color-Theme-Primary);
}
.common-heading-line::after {
    content: "";
    position: absolute;
    bottom: -16px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 16px 0 16px;
    border-color: var(--color-Theme-Primary) transparent transparent transparent;
}

/* hedding h3 */
.child-heading {
	border-bottom: 1px solid #E2E2E2;
	text-align: center;
	margin: 0 auto 32px auto;
}
.child-heading span {
	display: inline-block;
	position: relative;
	padding: 0 0 8px 0;
	color: var(--color-Text-Primary);
	font-size: min(calc(18 / 390 * 100vw), 18px);
	font-weight: 700;
}
.child-heading span::after {
	content: "";
	width: 100%;
	height: 3px;
	position: absolute;
	bottom: -2px;
	left: 50%;
	transform: translate(-50%, 0);
	background-color: var(--color-Theme-Primary);
	z-index: 1;
}
@media (min-width: 767px) {
	.child-heading {
		margin-bottom: 48px;
	}
	.child-heading span {
		font-size: min(calc(24 / 1200 * 100vw), 24px);
	}
}

/*---------- main visual----------*/
.fv {
	padding : 32px 0 96px;
	position: relative;
	width: 100%;
    overflow: hidden;
	background-color: var(--color-Background-Secondary);
    background-image: url(/web/jp/channel/top/img/new/fv_bg.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
	.container {
		display: flex;
		flex-flow: column;
		align-items: center;
		.fv-content {
			display: contents;
			.fv-title {
				display: flex;
				flex-flow: column;
				align-items: center;
				.subtitle {
					margin-bottom: 12px;
					width: min(calc(280 / 390 * 100vw), 352px);
				}
				h1 {
					display: flex;
					flex-flow: column;
					align-items: center;
					gap: 16px;
					font-weight: bold;
					line-height: 1.0;
					letter-spacing: .05em;
					.firstLine {
						font-size: min(calc(32 / 390 * 100vw), 48px);
						span {
							font-size: min(calc(20 / 390* 100vw), 32px);
						}
					}
					.secondLine {
						font-size: min(calc(40 / 390 * 100vw), 60px);
					}
					.logo {
						width: min(calc(300 / 390 * 100vw), 448px);
						padding: 8px;
						background-color: #fff;
					}
				}
			}
		}
		.cta-button {
			order: 3;
		}
		.fv-img {
			margin-top: 24px;
			width: min(calc(300 / 390 * 100vw), 400px);
			order: 2;
		}
	}
}
@media (min-width: 768px) {
	.fv {
		padding: 32px 0 144px;
		background-position: top center;
   		background-image: url(/web/jp/channel/top/img/new/fv_bg.png);
		.container {
			flex-flow: row;
			align-items: flex-end;
			justify-content: flex-start;
			.fv-content {
				display: flex;
				flex-flow: column;
				align-items: flex-start;
				width: 440px;
				.fv-title {
					h1 {
						align-items: flex-start;
						gap: 20px;
						.logo {
							width: 98%;
						}
					}
				}
				.cta-button {
					margin-top: 64px;
					max-width: 80%;
					order: inherit;
				}
			}
			.fv-img {
				position: absolute;
				margin-top: 0;
				width: 608px;
				left: 456px;
				bottom: 0;
				max-width: inherit;
				order: inherit
			}
		}
	}
}
@media (min-width: 960px) {
	.fv {
   		background-image: url(/web/jp/channel/top/img/new/fv_bg.png);
		background-position: bottom left;
		background-size: contain;
		background-repeat: repeat-x;
		.container {
			padding-left: 48px;
			.fv-content {
				width: 460px;
				.fv-title {
					h1 {
						.secondLine {
							font-size: 64px;
						}
						.firstLine {
							font-size: 48px;
							letter-spacing: .05em;
							span {
								font-size: 32px;
							}
						}
					}
				}
				.cta-button {
					max-width: 80%;
				}
			}
			.fv-img {
				left: 560px;
			}
		}
	}
}

/* offer */
.sec-offer {
	padding-top: 0;
	.container {
		margin-top: -48px;
		max-width: 480px;
	}
}
.offer-wrap {
	display: flex;
	flex-flow: row wrap;
	gap: 16px;
	.offer-item {
		width: 100%;
		padding: 0;
		background-color: var(--color-Background-Primary);
		border: 1px solid var(--color-Text-Primary);
		border-radius: 8px;

		display: flex;
		flex-flow: row wrap;
		align-items: center;
		.head {
			position: relative;
			display: flex;
			align-items: center;
			padding: 12px 12px 12px 20px;
			width: min(calc(144 / 390 * 100vw), 160px);
			height: 100%;
			background-color: var(--color-Text-Primary);
			border-radius: 7px 0 0 7px;
			color: var(--color-Text-White);
			&::after {
				content: "";
				position: absolute;
				top: 50%;
				right: -10px;
				transform: translateY(-50%);
				width: 0;
				height: 0;
				border-style: solid;
				border-width: 10px 0 10px 10px;
				border-color: transparent transparent transparent var(--color-Text-Primary);
			}
			h3 {
				font-size: min(calc(18 / 390 * 100vw), 18px);
				line-height: 1.5;
				font-weight: bold;
				text-align: left;
				.bottom {
					display: block;
					margin-top: .5em;
					line-height: 1.75;
				}
				.large {
					font-size: 1.25em;
				}
			}
		}
		.body  {
			display: flex;
			align-items: center;
			flex: 1;
			padding: 12px 16px 12px 24px;
			p {
				font-size: min(calc(16 / 390 * 100vw), 18px);
				font-weight: bold;
				line-height: 1.75;
				text-align: left;
				font-feature-settings: "palt";
			}
		}
	}
}
@media (min-width: 768px) {
	.sec-offer {
		padding-top: 0;
		.container {
			margin-top: -96px;
			max-width: 1200px;
		}
	}
	.offer-wrap {
		gap: 24px;
		.offer-item {
			display: block;
			width: calc(33.33333% - 24px * 2 / 3);
			.head {
				display: block;
				width: 100%;
				height: auto;
				padding: 20px 16px 16px;
				border-radius: 7px 7px 0 0;
				color: var(--color-Text-White);
				&::after {
					top: initial;
					right: initial;
					bottom: -13px;
					left: 50%;
					transform: translateX(-50%);
					border-style: solid;
					border-width: 14px 15px 0 15px;
					border-color: var(--color-Text-Primary) transparent transparent transparent;
				}
				h3 {
					font-size: min(calc(18 / 1200 * 100vw), 18px);
					line-height: min(calc(40 / 1200 * 100vw), 40px);
					text-align: center;
					.large {
						font-size: min(calc(24 / 1200 * 100vw), 24px);
					}
				}
			}
			.body  {
				align-items: flex-start;
				justify-content: center;
				padding: 24px 8px 16px;
				p {
					font-size: min(calc(18 / 1200 * 100vw), 18px);
					text-align: center;
				}
			}
		}
	}
}

/* company */
.sec-company {
	padding-top: 0;
	background: var(--color-Background-Primary);
	overflow-x: hidden;
	.container {
		width: 100%;
		height: calc(134 / 390 * 100vw);
		.company-img {
			width: 100%;
			height: inherit;
			position: initial;
		}
		.company-img img {
			max-width: none;
		}
	}
}
.company-loopSlide {
	display: flex;
	width: 100vw;
	height: inherit;
}
.company-loopSlide img {
	width: auto;
	height: 100%;
}
.company-loopSlide img:first-child {
	animation: slide1 60s -30s linear infinite;
}
.company-loopSlide img:last-child {
	animation: slide2 60s linear infinite;
}
@keyframes slide1 {
	0% {transform: translateX(100%);}
	to {transform: translateX(-100%);}
}
@keyframes slide2 {
	0% {transform: translateX(0);}
	to {transform: translateX(-200%);}
}

@media (min-width: 768px) {
	.sec-company {
		.container {
			height: 168px;
		}
	}
}
/* problem */
.sec-problem {
	padding-bottom: calc(var(--section-padding) + 32px);
	background-image: linear-gradient(rgb(64, 73, 74) 0px, rgb(245, 245, 245) 100%);
    background-repeat: no-repeat;
	clip-path: polygon(100% 0px, 100% 95%, 50% 100%, 0px 95%, 0px 0px);
	h2 {
		color: var(--color-Text-White);
		.heading-flex {
			display: flex;
			flex-flow: row wrap;
			justify-content: center;
			.small {
				font-size: .75em;
			}
			.text-band {
				background-color: var(--color-Text-Primary);
				margin-inline: 4px;
			}
			& + .heading-flex {
				margin-top: .5em;
			}
		}
	}
}
.problem-wrap {
	display: flex;
	flex-flow: row wrap;
	gap: 16px;
	.problem-item {
		width: calc(50% - 16px * 1 / 2);
		background-color: var(--color-Text-Primary);
		border-radius: 8px;
		figure img {
			width: 100%;
			border-radius: 8px 8px 0 0;
		}
		.text {
			padding: 16px 12px 12px;
		}
		h3 {
			color: var(--color-Text-White);
			font-size: min(calc(14 / 390 * 100vw), 16px);
			line-height: 1.75;
			text-align: center;
			font-feature-settings: "palt";
			.large {
				margin-top: .5em;
				font-size: min(calc(16 / 390 * 100vw), 18px);
				line-height: 1.5;
			}
		}
	}
}
@media (min-width: 768px) {
	.sec-problem {
		padding-bottom: calc(var(--section-padding) + 32px);
		clip-path: polygon(100% 0px, 100% 85%, 50% 100%, 0px 85%, 0px 0px);
	}
	.problem-wrap {
		gap: 8px;
		.problem-item {
			width: calc(25% - 8px * 3 / 4);
			h3 {
				font-size: min(calc(16 / 1200 * 100vw), 16px);
				line-height: 1.75;
				.large {
					font-size: min(calc(20 / 1200 * 100vw), 20px);
				}
			}
		}
	}
}
/* feature */
.sec-feature {
	padding-top: calc(var(--section-padding) / 2);
	background: var(--color-Background-Primary);
	h2 {
		.heading-flex {
			display: flex;
			flex-flow: row wrap;
			align-items: center;
			justify-content: center;
			gap: 4px;
			.logo {
				width: min(calc(280 / 390 * 100vw), 280px);
			}
			& + .heading-flex {
				margin-top: .5em;
			}
		}
	}
}
.feature-wrap {
	display: flex;
	flex-flow: row wrap;
	gap: 16px;
	.feature-item {
		width: 100%;
		padding: 16px 16px 16px min(calc(20 / 390 * 100vw), 48px);
		background-color: var(--color-Background-Secondary);
		border-radius: 8px;
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		gap: calc(24 / 390 * 100vw);
		figure img {
			display: block;
			margin-inline: auto;
			width: min(calc(96 / 390 * 100vw), 160px);
			aspect-ratio: 96 / 96;
		}
		.text {
			flex: 1;
		}
		h3 {
			font-size: min(calc(16 / 390 * 100vw), 18px);
			line-height: 2.0;
			text-align: center;
			.color-theme {
				font-size: 1.25em;
				line-height: 2.0;
			}
		}
	}
}
@media (min-width: 768px) {
	.sec-feature {
		h2 {
			.heading-flex {
				.logo {
					width: min(calc(496 / 1200 * 100vw), 496px);
				}
			}
		}
	}
	.feature-wrap {
		gap: 24px;
		.feature-item {
			width: calc(33.33333% - 24px * 2 / 3);
			padding: 24px 20px 20px;
			display: block;
			figure img {
				width: min(calc(200 / 1200 * 100vw), 200px);
				aspect-ratio: 200 / 200;
			}
			.text {
				margin-top: 24px;
			}
		}
	}
}

/* solution */
.sec-solution {
	background: var(--color-Background-Secondary);
	picture {
		img {
			display: block;
			width: 100%;
			margin-inline: auto;
		}
	}
}
@media (min-width: 767px) {
	.sec-solution {
		.picture {
			max-width: 1040px;
			margin-inline: auto;
			img {
				width: auto;
			}
		}
	}
}

/* function */
.sec-function {
	background: var(--color-Background-Primary);
}
.function-wrap {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: 48px calc(20 / 390 * 100vw) 32px;
	background-color: var(--color-Background-Secondary);
	h3 {
		padding-left: .5em;
		border-left: 4px solid var(--color-Text-Primary);
		font-size: min(calc(20 / 390 * 100vw), 20px);
		font-weight: bold;
		line-height: 1.5;
		letter-spacing: .05em;
	}
	.function-point {
		display: flex;
		align-items: center;
		gap: 0 8px;
		position: absolute;
		top: 0;
		left: calc(20 / 390 * 100vw);
		transform: translateY(-50%);
		width: 120px;
		height: 40px;
		padding-left: 1em;
		background-color: var(--color-Gray-Dark);
		color: var(--color-Text-White);
		font-weight: bold;
		line-height: 1.5;
		letter-spacing: 0.05em;
		clip-path: polygon(90% 0, 100% 50%, 90% 100%, 0 100%, 0 0);
		.en {
			border-bottom: 2px solid var(--color-Text-White);
			font-size: 14px;
		}
		.num {
			font-size: 20px;
		}
	}
	.function-text {
		display: contents;
		.function-list {
			li {
				position: relative;
				padding-left: 24px;
				font-size: min(calc(16 / 390 * 100vw), 16px);
				font-weight: bold;
				line-height: 1.75;
				letter-spacing: 0.05em;
				font-feature-settings: "palt";
				& + li {
					margin-top: 18px;
				}
				&::before {
					content: "";
					position: absolute;
					top: 8px;
					left: 0;
					width: 16px;
					height: 16px;
					background-position: center;
					background-repeat: no-repeat;
					background-size: contain;
					background-image: url(/web/jp/channel/top/img/new/icn_checkbox.svg);
				}
				.large {
					color: var(--color-Theme-Primary);
					font-size: 18px;
				}
				p.small {
					margin-top: 18px;
					font-size: 14px;
					font-weight: normal;
					line-height: 1.5;
					letter-spacing: 0.05em;
				}
			}
		}
	}
	.function-button {
		margin-inline: auto;
		order: 3;
	}
}
@media (min-width: 768px) {
	.function-wrap {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
		/*gap: calc(60 / 1200 * 100%); */
		padding: min(calc(64 / 1200 * 100vw), 64px) min(calc(96 / 1200 * 100vw) ,96px) min(calc(48 / 1200 * 100vw), 48px);
		h3 {
			margin-bottom: 1.5em;
			font-size: min(calc(24 / 1200 * 100vw), 24px);
		}
		.function-point {
			gap: 0 min(calc(8 / 1200 * 100vw), 8px);
			left: min(calc(96 / 1200 * 100vw), 100px);
			width: min(calc(144 / 1200 * 100vw), 144px);
			height: min(calc(48 / 1200 * 100vw), 48px);
			padding-left: min(calc(18 / 1200 * 100vw), 18px);
			.en {
				font-size: min(calc(18 / 1200 * 100vw), 18px);
			}
			.num {
				font-size: min(calc(28 / 1200 * 100vw), 28px);
			}
		}
		.function-text {
			display: block;
			width: calc(620 / 1200 * 100%);
			.function-list {
				li {
					padding-left: calc(16/ 1200 * 100vw + 8px);
					font-size: min(calc(16 / 1200 * 100vw), 16px);
					& + li {
						margin-top: min(calc(24 / 1200 * 100vw), 24px);
					}
					&::before {
					top: min(calc(8 / 1200 * 100vw), 8px);
					width: min(calc(16 / 1200 * 100vw), 16px);
					height: min(calc(16 / 1200 * 100vw), 16px);
					}
					.large {
						font-size: min(calc(20 / 1200 * 100vw), 20px);
					}
					p {
						margin-top: 1.0em;
						font-size: min(calc(15 / 1200 * 100vw), 15px);
					}
				}
			}
		}
		.function-report {
			width: calc(520 / 1200 * 100%);
		}
		.function-button {
			margin-inline: 0;
			margin-top: 48px;
		}
	}
}

/* service */
.sec-service {
	background: var(--color-Background-Secondary);
	h2 {
		.heading-flex {
			display: flex;
			flex-flow: row wrap;
			align-items: center;
			justify-content: center;
			gap: 4px;
		}
	}
}
.service-wrap {
	display: flex;
	flex-flow: row wrap;
	gap: 48px;
	max-width: 480px;
	margin-inline: auto;
	.service-item {
		width: 100%;
		h3 {
			font-size: 18px;
			font-weight: bold;
			line-height: 1.75;
			text-align: center;
			.text-band {
				margin-left: .25em;
			}
			.small {
				font-size: .8em;
				font-feature-settings: "palt";
			}
		}
		figure {
			margin-top: 16px;
			margin-bottom: 16px;
			img {
				display: block;
				width: 100%;
				border-radius: 16px;
				border: 1px solid var(--color-Theme-Primary);
			}
		}
		.text {
			p {
			font-size: 16px;
			line-height: 1.75;
			font-feature-settings: "palt";
			}
		}
	}
}
@media (min-width: 768px) {
	.service-wrap {
		justify-content: space-between;
		gap: 48px;
		max-width: 1024px;
		.service-item {
			width: calc(50% - 48px * 1 / 2);
			h3 {
				font-size: 20px;
			}
			figure {
				margin-top: 24px;
				margin-bottom: 24px;
			}
			.text {
				padding-right: 1em;
				padding-left: 1em;
			}
		}
	}
}

/* case */
.sp-slide a {
	text-decoration: none;
	color: var(--color-Text-Primary) ;
}
.case-box {
	min-height: min(calc(215 / 1280 * 100vw), 215px);
	padding: 0 min(calc(15 / 1280 * 100vw), 15px) min(calc(20 / 1280 * 100vw), 20px);
	background-color: #fff;
}
#slider_shop1 .sp-slides {
	counter-reset: num;
}
#slider_shop1 .sp-slide {
	opacity: 0.5;
}
#slider_shop1 .sp-slide.is-active,
#slider_shop1 .sp-slide.sp-selected,
#slider_shop1 .sp-slide:has(+.sp-selected),
#slider_shop1 .sp-slide.sp-selected+.sp-slide,
#slider_shop1 .sp-slide.sp-selected+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide+.sp-slide {
	opacity: 1;
}
#slider_shop1 .sp-slide a.sp-slide-inner {
	display: inline-block;
	box-shadow: 0 0 min(calc(8 / 1280 * 100vw), 8px) rgba(0,0,0,0.16);
	transition: all 0.3s ease!important;
}
#slider_shop1 .sp-slide-inner:hover {
	opacity: 0.7;
}
.case-box-con {
	position: relative;
	margin-top: -16px;
	margin-bottom: min(calc(16 / 1280 * 100vw), 16px);
	margin-left:  max(-1.25vw, -15px);
	padding: 7px calc(24px + 1.5em) 7px 16px;
	width: fit-content;
	background-color: var(--color-Text-Primary);
	color: #FFF;
	font-size: min(calc(16 / 1280 * 100vw), 16px);
	font-weight: 700;
	line-height: 1.25;
}
.case-box-con::before{
	content: '';
	position: absolute;
	top: 50%;
	left: 4em;
	transform: translateY(-50%);
	counter-increment: num;
	content: counter(num, decimal-leading-zero);
}
@media (max-width: 1040px) {
	.case-box-con::before{
		left: 5em;
	}
}
.case-box-tx01 {
	position: relative;
	margin-bottom: min(calc(15 / 1280 * 100vw), 15px);
	padding-bottom: min(calc(14 / 1280 * 100vw), 14px);
	font-size:min(calc(20 / 1280 * 100vw), 20px);
	font-weight: 700;
	line-height: 1.25;
}
.case-box-tx01::before{
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
	width: min(calc(60 / 1280 * 100vw), 60px);
	height: min(calc(4 / 1280 * 100vw), 4px);
	background-color: var(--color-Text-Primary);
}
.case-box-tx02 {
	font-size:min(calc(16/ 1280 * 100vw), 16px);
	line-height: 1.5;
}
@media (max-width: 767px) {
	#slider_shop1 .sp-slide a.sp-slide-inner{
		margin: 0 calc(20 / 375 * 100vw);
		box-shadow: 0 0 calc(8 / 375 * 100vw) rgba(0,0,0,0.16);
	}
	.case-box {
		min-height: auto;
		padding: 0 calc(20 / 375 * 100vw) calc(20 / 375 * 100vw);
	}
	.case-box-con {
		margin-top: -17px;
		margin-bottom: calc(16 / 375 * 100vw);
		margin-left: -5.3333vw;
		padding: 7px calc(24px + 1.5em) 7px 16px;
		font-size: calc(14 / 375 * 100vw);
	}
	.case-box-con::before{
		left: 4em;
	}
	.case-box-tx01 {
		font-size: calc(18 / 375 * 100vw);
		padding-bottom: calc(14 / 375 * 100vw);
		margin-bottom: calc(15 / 375 * 100vw);
	}
	.case-box-tx01::before{
		width: calc(60 / 375 * 100vw);
		height: calc(4 / 375 * 100vw);
	}
	.case-box-tx02 {
		font-size: calc(16 / 375 * 100vw);
	}
}

/* video */
.sec-video {
	background-color: var(--color-Background-Secondary);
}
.video-wrap {
	display: flex;
	flex-flow: row wrap;
	gap: 24px;
	.video-item {
		width: 100%;
		padding: 20px 16px 16px;
		background-color: var(--color-Background-Primary);
		border-radius: 8px;
		box-shadow: 0 0 min(calc(8 / 390 * 100vw), 8px) rgba(0, 0, 0, 0.12);
	}
	h4 {
		position: relative;
		margin-bottom: 24px;
		padding-bottom: .5em;
		font-size: 16px;
		font-weight: bold;
		line-height: 1.5;
		text-align: center;
		&::before {
			position: absolute;
			content: '';
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
			width: 48px;
			height: 2px;
			background-color: var(--color-Text-Primary);
		}
		span {
			font-size: 12px;
		}
	}
	.text {
		padding-top: 24px;
		font-size: 14px;
		line-height: 1.75;
	}
}
@media (min-width: 600px) {
	.video-wrap {
		gap: 24px;
		.video-item {
			width: calc(50% - 24px * 1 / 2);
			padding: 24px 20px 20px 20px;
			border-radius: 8px;
		}
	}
}
@media (min-width: 1024px) {
	.video-wrap {
		.video-item {
			width: calc(33.33333% - 24px * 2 / 3);
			box-shadow: 0 0 min(calc(8 / 1200 * 100vw), 8px) rgba(0, 0, 0, 0.12);
		}
	}
}
iframe.size-16_9 {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}
/* cta */
.sec-cta {
	&::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: url(/web/jp/channel/top/img/new/cta_bg.png);
	}
	.container {
		max-width: 480px;
	}
}
.cta-main {
	position: relative;
	margin-top: 32px;
	background-color: var(--color-Background-Primary);
	border: 1px solid var(--color-Text-Primary);
	border-radius: 8px;
	.head {
		position: relative;
		padding: 16px 16px 16px 20px;
		background-color: var(--color-Text-Primary);
		border-radius: 7px 7px 0 0;
		color: var(--color-Text-White);
		&::after {
			content: "";
			position: absolute;
			bottom: -9px;
			left: 50%;
			transform: translateX(-50%);
			border-style: solid;
			border-width: 10px 11px 0 11px;
			border-color: var(--color-Text-Primary) transparent transparent transparent;
		}
		.head-flex {
			font-size: min(calc(16 / 390 * 100vw), 16px);
			line-height: 1.5;
			font-weight: bold;
			.left {
				display: inline-block;
				margin-bottom: .5em;
				padding: .25em .5em;
				border: 1px solid var(--color-Text-White);
			}
			.right {
				letter-spacing: .05em;
				.large {
					font-size: 1.5em;
					font-feature-settings: "palt";
				}
			}
		}
		.head-img {
			position: absolute;
			top: calc(-16 / 390 * 100vw);
			right: 1em;
			width: min(calc(120 / 390 * 100vw), 176px);
			aspect-ratio: 228 / 137;
		}
	}
	.body  {
		padding: 32px 16px 20px;
		.cta-list {
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			gap: calc(12 / 390 * 100vw);
			li {
				position: relative;
				font-size: min(calc(16 / 390 * 100vw), 18px);
				font-weight: 700;
				line-height: 1.5;
				letter-spacing: 0.05em;
				padding-bottom: .5em;
				border-bottom: 2px dotted var(--color-Gray-Dark);
				padding-left: calc((16 / 390 * 100vw) + 4px);
				font-feature-settings: "palt";
				&::before {
					content: "";
					position: absolute;
					top: min(calc(5 / 390 * 100vw), 5px);
					left: 0;
					width: min(calc(16 / 390 * 100vw), 18px);
					height: min(calc(16 / 390 * 100vw), 18px);
					background-position: center;
					background-repeat: no-repeat;
					background-size: contain;
					background-image: url(/web/jp/channel/top/img/new/icn_checkbox.svg);
				}
			}
		}
	}
}
@media (min-width: 768px) {
	.sec-cta {
		&::after {
			background-image: url(/web/jp/channel/top/img/new/cta_bg.png);
		}
		.container {
			max-width: 1200px;
		}
	}
	.cta-main {
		margin-top: 48px;
		.head {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0 min(calc(24 / 1200 * 100vw), 48px);
			padding: 16px;
			height: min(calc(72 / 1200 * 100vw), 72px);
			&::after {
				top: initial;
				right: initial;
				bottom: -13px;
				left: 50%;
				transform: translateX(-50%);
				border-style: solid;
				border-width: 14px 15px 0 15px;
				border-color: var(--color-Text-Primary) transparent transparent transparent;
			}
			.head-flex {
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 8px;
				font-size: min(calc(16 / 1200 * 100vw), 16px);
				.left {
					display: block;
					margin-bottom: 0;
				}
				.right {
					font-size: min(calc(18 / 1200 * 100vw), 18px);
				}
			}
			.head-img {
				top: -32px;
				right: min(calc(96 / 1200 * 100vw), 96px);
				width: min(calc(228 / 1200 * 100vw), 228px);
			}
		}
		.body  {
			padding: 48px 16px 32px;
			.cta-list {
				flex-flow: row wrap;
				align-items: center;
				justify-content: center;
				gap: 0 min(calc(24 / 1200 * 100vw), 24px);
				li {
					font-size: min(calc(18 / 1200 * 100vw), 18px);
					padding-left: calc((18 / 1200 * 100vw) + 8px);
					&::before {
						top: min(calc(5 / 1200 * 100vw), 5px);
						width: min(calc(18 / 1200 * 100vw), 18px);
						height: min(calc(18 / 1200 * 100vw), 18px);
					}
				}
			}
		}
	}
}

/* slider pro */
#slider_shop1 .sp-next-arrow:before,
.slider-report .sp-next-arrow:before {
	content:' ';
	display: block;
	background: url(/web/jp/channel/top/img/new/icn_slider_right.svg) no-repeat left top / contain;
	text-indent: -9999px;
	width: 38px;
	height: 38px;
	transition: all 0.3s ease;
}

#slider_shop1 .sp-previous-arrow:before,
.slider-report .sp-previous-arrow:before {
	content:' ';
	display: block;
	background: url(/web/jp/channel/top/img/new/icn_slider_left.svg) no-repeat left top / contain;
	text-indent: -9999px;
	width: 38px;
	height: 38px;
	transition: all 0.3s ease;
}
#slider_shop1 .sp-next-arrow:hover:before,
.slider-report .sp-next-arrow:hover:before {
	background: url(/web/jp/channel/top/img/new/icn_slider_right_gray.svg) no-repeat left top / contain;
}
#slider_shop1 .sp-previous-arrow:hover:before,
.slider-report .sp-previous-arrow:hover:before {
	background: url(/web/jp/channel/top/img/new/icn_slider_left_gray.svg) no-repeat left top / contain;
}
#slider_shop1 .sp-button,
.slider-report .sp-button {
	width: 10px;
	height: 10px;
	border: none;
}
#slider_shop1 .sp-selected-button,
.slider-report .sp-selected-button {
	background-color: var(--color-Theme-Primary);
	border: none;
}

/* 矢印位置 */
#slider_shop1 .sp-arrows,
.slider-report .sp-arrows {
	z-index: 1;
}
#slider_shop1 .sp-arrows {
	top: 45%;
	margin-top: 0;
}
#slider_shop1 .sp-next-arrow {
	right: calc(50% - 600px);
}
#slider_shop1 .sp-previous-arrow {
	left: calc(50% - 600px);
}
.slider-report .sp-arrows {
	top: 100%;
	margin-top: 13px;
}
.slider-report .sp-next-arrow {
	right: calc(50% - 70px);
}
.slider-report .sp-previous-arrow {
	left: calc(50% - 70px);
}
@media (max-width: 1250px) {
	#slider_shop1 .sp-next-arrow {
		right: 5vw;
	}
	#slider_shop1 .sp-previous-arrow {
		left: 5vw;
	}
}
@media (max-width: 767px) {
	#slider_shop1 .sp-arrows {
		top: 40%;
	}
	#slider_shop1 .sp-next-arrow {
		right: 8vw;
	}
	#slider_shop1 .sp-previous-arrow {
		left: 8vw;
	}
	.slider-report .sp-arrows {
		top: 100%;
		margin-top: 13px;
	}
	.slider-report .sp-next-arrow {
		right: calc(50% - 70px);
	}
	.slider-report .sp-previous-arrow {
		left: calc(50% - 70px);
	}
}
/* バレットの位置 */
#slider_shop1 .sp-buttons,
.slider-report .sp-buttons {
	padding-top: 20px;
}