@charset "utf-8";
.l-content {
	margin: 70px 0 0 0;
}
section + section {
	margin-top: 70px;
}
section .inner {
	padding: 0 25px;
}
.ttl-area {
	position: relative;
	margin-bottom: 70px;
	text-align: center;
}
.btn-area {
	margin: 36px -15px 0 -15px !important;
}
.new-application .balloon {
	text-align: center;
}
.mainvisual {
	position: relative;
	text-align: center;
	background-color: #fff;
	padding-bottom: 35px;
}
.mainvisual .btn {
	position: relative;
	margin: 35px auto 0;
}
.benefits {
	position: relative;
	padding-top: 50px;
	margin-top: 0;
}
.new-application .inner.-s {
	position: relative;
}
.new-application .inner.-s::after {
	display: block;
	content: "";
	position: absolute;
	top: -47px;
	left: 0;
	width: 100%;
	height: 102.56vw;
	background: url(/assets/images/top/bg_main_sp.png) no-repeat center top;
	background-size: 100% auto;
	z-index: -1;
}

.benefits .frame {
	overflow: hidden;
	padding: 0;
}
.benefits .balloon {
	margin-bottom: 0;
}
.benefits .balloon p {
	margin-bottom: -4px;
	z-index: 1;
}

.use {
	position: relative;
	margin-top: 100px;
}
.use::after {
	display: block;
	content: "";
	position: absolute;
	top: 60px;
	left: 0;
	width: 100%;
	height: 235.64vw;
	background: url(/assets/images/top/bg_use_sp.png) no-repeat left top;
	background-size: 100% auto;
	z-index: -1;
}
.use .inner {
	padding: 0 15px;
}
.use .inner.-s .frame {
	padding: 20px;
}
.use .balloon {
	margin-left: 15px;
}
.use .use-list li:nth-child(1) {
	margin: 0 8.333333% 0 8.333333%;
}
.use .use-list li:nth-child(n + 2) {
	margin-top: 30px;
}
.lineup {
	position: relative;
	margin-top: 100px;
}
.lineup::after {
	display: block;
	content: "";
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	height: 415.9vw;
	background: url(/assets/images/top/bg_circle_sp.png) no-repeat left top;
	background-size: 100% auto;
	z-index: -1;
}
.lineup .frame {
	padding: 0;
}
.lineup .lineup-list {
	padding: 0 0 37px 0;
}
.lineup .lineup-list li:nth-child(n + 2) {
	margin-top: 40px;
}
.lineup .lineup-list figure {
	text-align: center;
}
.lineup .lineup-list figcaption {
	margin-top: 15px;
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1.3;
}
.lineup .lineup-list figcaption span {
	display: block;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom: 7px;
}
.lineup .lineup-list .standard {
	margin-top: -15px;
}
.lineup .lineup-list .standard img {
	width: 175px;
	height: auto;
}
.lineup .lineup-list .mymelody img {
	width: 286px;
	height: auto;
}
.lineup h3 {
	margin: 75px 0 60px 0;
	text-align: center;
}
.lineup h3 img {
	width: 312px;
	height: auto;
}
.lineup .support-list .frame {
	padding: 15px;
}
.lineup .support-list .frame figure {
	margin-top: -34px;
}
.lineup .support-list .text-link {
	margin-top: 15px;
}


.what {
	position: relative;
	margin-top: 195px;
}
.what::after {
	display: block;
	content: "";
	position: absolute;
	top: -98px;
	left: 0;
	width: 100%;
	height: 181.54vw;
	background: url(/assets/images/top/bg_what_sp.png) no-repeat left top;
	background-size: 100% auto;
	z-index: -1;
}
.what .inner {
	padding: 0 15px;
}
.what .ttl-area {
	margin-bottom: 50px;
}
.what .ttl-area h2 img {
	width: 238px;
	text-align: center;
}

.what .btn-area {
	margin-top: 60px !important;
}

.great-deal {
	position: relative;
	margin-top: 105px;
}
.great-deal::after {
	display: block;
	content: "";
	position: absolute;
	top: 20px;
	left: 0;
	width: 100%;
	height: 239.23vw;
	background: url(/assets/images/top/bg_deal_sp.png) no-repeat left top;
	background-size: 100% auto;
	z-index: -1;
}
.great-deal .ttl-area h2 img {
	width: 238px;
	text-align: center;
}
.great-deal .deal-list {
	counter-reset: number;
}
.great-deal .deal-list li {
	margin-top: 70px;
}
.great-deal .deal-list li .frame {
	padding: 20px 20px 30px 20px;
}
.great-deal .deal-list li figure {
	margin-bottom: 20px;
}
.great-deal .deal-list .balloon-cap figcaption {
	padding: 15px 10px;
	font-size: 1.6rem;
	font-weight: 700;
	margin-bottom: 15px;
}

.news {
	position: relative;
	overflow: hidden;
}
.news::after {
	display: block;
	content: "";
	position: absolute;
	top: 37px;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(/assets/images/top/bg_circle_sp.png) no-repeat center top;
	background-size: 100% auto;
	z-index: -1;
}
.news .inner {
	padding-bottom: 100px;
}
.news .ttl-area h2 {
	width: 192px;
	margin: 0 auto 70px auto;
}
.news .frame {
	padding: 0;
}
.news .news-list {
	text-align: left;
}
.news .news-list li:nth-child(n+6) {
	display: none;
}
.news .news-list li + li {
	border-top: solid 1px #000;
}
.news .news-list li time {
	display: block;
	margin-bottom: 3px;
	font-size: 1.2rem;
	font-weight: 700;
	color: #666;
}
.news .news-list a {
	display: block;
	position: relative;
	padding: 20px 35px 20px 18px;
	font-size: 1.4rem;
}
.news .news-list a::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	right: 15px;
	width: 12px;
	height: 12px;
	margin: auto;
	border-top: 2px solid #666;
	border-right: 2px solid #666;
	transform: rotate(45deg);
	z-index: 2;
}

.news a[target="_blank"]::before,
.news a[target="_blank"]::after {
	position: absolute;
	content: "";
	top: 0;
	bottom: 0;
	right: 15px;
}
.news a[target="_blank"]::before {
	right: 10px;
	width: 15px;
	height: 2px;
	background: #666;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}
.news a[target="_blank"]::after {
	right: 11px;
	width: 12px;
	height: 12px;
	border-top: 2px solid #666;
	border-right: 2px solid #666;
	transform: rotate(0deg);
}
.news a[href$=".pdf"]::after {
	right: 10px;
	width: 14px;
	height: 14px;
	background: url(../../images/ico_file-pdf.svg) no-repeat;
	border: none;
}


@media (min-width: 768px) {
	section + section {
		margin-top: 150px !important;
	}
	section .inner {
		padding: 0;
	}
	.btn-area {
		margin: 30px auto 0 auto;
	}
	.balloon-cap figcaption {
		padding: 8px 20px;
		font-size: 1.6rem;
	}
	.benefits .frame {
		padding: 0;
	}
	.great-deal .deal-list li .frame {
		padding: 49px;
	}
	.mainvisual {
		position: relative;
		text-align: center;
		background-color: transparent;
		padding-bottom: 35px;
	}
	.new-application .inner.-s::after {
		content: none;
	}
	.benefits::after {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 404px;
		background: url(/assets/images/top/bg_benefit_pc.png) no-repeat center top;
		z-index: -1;
	}
	.use::after {
		top: -7px;
		height: 791px;
		background: url(/assets/images/top/bg_use_pc.png) no-repeat center top;
	}
	.lineup::after {
		top: 75px;
		height: 1116px;
		background: url(/assets/images/top/bg_circle_pc.png) no-repeat center top;
	}
	.what::after {
		top: -76px;
		width: 100%;
		height: 682px;
		background: url(/assets/images/top/bg_what_pc.png) no-repeat center top;
	}
	.great-deal::after {
		top: 2px;
		height: 869px;
		background: url(/assets/images/top/bg_deal_pc.png) no-repeat center top;
	}
	.news::after {
		top: 75px;
		width: 100%;
		height: 1116px;
		background: url(/assets/images/top/bg_news_pc.png) no-repeat center top;
	}
	.use .ttl-area {
		margin-bottom: 97px;
	}
	.use .ttl-area h2,
	.lineup .ttl-area h2,
	.lineup h3 img,
	.what .ttl-area h2,
	.great-deal .ttl-area h2,
	.news .ttl-area h2 {
		width: auto;
	}
	.use .inner.-s .frame {
		padding: 50px;
	}
	.use .use-list li:nth-child(1),
	.use .use-list li:nth-child(n + 2) {
		margin: 0;
	}

	.use .use-list li:nth-child(1) {
		margin-left: 8.333333%;
	}
	.use .use-list li:nth-child(2) {
		margin-right: 8.333333%;
	}
	.use .use-list li:nth-child(n + 3) {
		margin-top: 40px;
	}
	.lineup h3 {
		margin: 75px 0 80px 0;
	}
	.lineup .lineup-list {
		padding: 40px 100px;
	}
	.lineup .lineup-list li:nth-child(2n + 1) {
		border-right: dashed 3px #000;
	}
	.lineup .lineup-list .standard {
		margin-top: 0;
	}
	.what .ttl-area {
		margin-bottom: 70px;
	}
	.what .ttl-area h2 img {
		width: auto;
	}
	.what .swiper-area .swiper-button-prev:hover::before,
	.what .swiper-area .swiper-button-next:hover::before {
		background: #EF8200;
	}
	.great-deal .ttl-area h2 img {
		width: auto;
	}
	.great-deal .deal-list .balloon-cap figcaption {
		margin-bottom: 30px;
	}
	.great-deal .deal-list {
		display: flex;
		gap: 30px;
	}
	.great-deal .deal-list li {
		width: 50%;
		margin-top: 0;
	}
	.support-list .balloon-cap figcaption {
		width: 290px;
		margin: 0 auto 30px;
	}
	
	.lineup .support-list .text-link {
		margin-top: 30px;
	}
	
	.lineup .support-list .frame {
		padding-bottom: 30px;
	}
	.news .news-list li:nth-child(n+6) {
		display: block;
	}
	.news .news-list li a:hover span {
		color: #EF8200;
	}


}