@charset "UTF-8";
/* ------------------------ */
/* アニメーションの動き */
@keyframes twinkle {
	0%, 100% {
		opacity: 1;
	}
	50% {
		opacity: .3;
	}
}
/* ------------------------ */
/* 共通 */
/* ------------------------ */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;700&display=swap");
* {
	box-sizing: border-box;
}
body {
	background: #011021;
	color: #ffffff;
	letter-spacing: .02em;
	font-size: 16px;
	font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
	line-height: 1.6;
}
img {
	max-width: 100%;
	height: auto;
}
.sp, .sp--img {
	display: none!important;
}
.inner {
	margin: 0 auto;
	padding: 0 20px;
	max-width: 1000px;
}
.section__inner {
	margin: 0 auto;
	padding: 80px 20px;
	max-width: 1000px;
}
.text--note {
	padding-left: 1.5rem;
	text-indent: -1.5em;
}
.text--note a {
	text-indent: 0;
}
.text--bold {
	font-weight: bold;
}
.text--l {
	font-size: 26px;
	line-height: 1.8;
}
.text--m {
	font-size: 22px;
	line-height: 1.8;
}
.text--s {
	font-size: 18px;
	line-height: 1.6;
}
.text--ss {
	font-size: 16px;
	line-height: 1.6;
}
.text--center {
	text-align: center;
}
.text--right {
	text-align: right;
}
.text--accent {
	color: #ffe154;
}
.text--big {
	font-size: 140%;
}
.text--small {
	font-size: 70%;
}
.margin--m {
	margin-bottom: 50px!important;
}
.margin--s {
	margin-bottom: 30px!important;
}
.margin--ss {
	margin-bottom: 15px!important;
}
a {
	display: inline-block;
	color: #ffe154;
	text-decoration: underline;
	cursor: pointer;
}
a:hover {
	opacity: .8;
}
.link--arrow {
	position: relative;
	margin: 5px 0;
	padding-right: 15px;
}
.link--hatena {
	padding-left: 25px;
	background: url(../images/text_hatena.png) no-repeat left center / 19px 19px;
}
.link--arrow::after {
	position: absolute;
	top: 8px;
	right: 0;
	display: block;
	width: 8px;
	height: 8px;
	border-right: solid 2px #ffe154;
	border-bottom: solid 2px #ffe154;
	content: "";
	transform: rotate(-45deg);
}
.btn {
	padding: 30px 15px;
}
.btn a {
	position: relative;
	z-index: 100;
	display: inline-block;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	width: 600px;
	height: 87px;
	border-radius: 100px;
	background: linear-gradient(180deg, rgba(180,159,63,1) 0%, rgba(211,199,137,1) 100%);
	box-shadow: 0 6px 0 #b18b0d;
	color: #ffffff;
	text-decoration: none;
	font-weight: bold;
	font-size: 30px;
	transition: all .2s ease;
}
.btn a:hover {
	box-shadow: none;
	opacity: 1;
	transform: translateY(6px);
}

/* ------------------------ */
/* 個別 */
/* ------------------------ */
/* ヘッダー */
header {
	padding: 6px 15px;
	background-color: #ffffff;
	text-align: center;
}
header .logo {
	width: 147px;
	height: auto;
}
/* メインビジュアル */
.mainvisual {
	position: relative;
	overflow: hidden;
	background: #0a0d15 url(../images/mv_bg.png) no-repeat center top/contain;
	text-align: center;
}
.mainvisual .section__inner {
	position: relative;
	padding: 50px 15px 20px;
	max-width: 1200px;
}
.mainvisual__copy {
	margin-bottom: 30px;
	font-size: 32px;
}
.mainvisual__copy span {
	display: inline-block;
}
.mainvisual__sub-title {
	margin-bottom: 30px;
}
.mainvisual__title {
	margin-bottom: 50px;
}
.mainvisual__main {
	display: flex;
	justify-content: center;
}
.mainvisual__main__card:last-of-type {
	margin-top: 110px;
}
.mainvisual__main__card:first-of-type {
	position: relative;
	margin-right: 40px;
}
.mainvisual__main__copy {
	padding: 10px 10px;
	color: #c6c6c6;
	text-align: left;
	font-size: 12px;
}
.mainvisual__main__catch {
	position: absolute;
	top: -80px;
	right: -144px;
}
.mainvisual__main__img {
	position: relative;
	display: inline-block;
}
.mainvisual__banner {
	position: relative;
	z-index: 50;
	padding: 30px 15px;
	background-color: #252834;
}
.mainvisual__list__wrapper {
	position: relative;
	z-index: 50;
	margin: 0 auto 80px;
	max-width: 1200px;
}
.mainvisual__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 30px 0;
}
.mainvisual__item {
	position: relative;
	width: calc(100% / 3);
}
.mainvisual__item:nth-of-type(4) .link {
	position: absolute;
	top: 29%;
	right: 21%;
	width: 21%;
	height: 2em;
	font-size: 12px;
}
.mainvisual__item .link--anker {
	position: absolute;
	bottom: 30px;
	left: 50%;
	color: #ffffff;
	text-decoration: none;
	transform: translateX(-50%);
}
.mainvisual__item .link {
	position: absolute;
	top: 87px;
	right: 70px;
}
.mainvisual__star {
	position: absolute;
	z-index: 10;
	width: 2px;
	height: 2px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, .5);
	animation: twinkle 2s infinite ease-in-out;
}
.mainvisual__note li {
	display: flex;
	justify-content: start;
	margin-bottom: 8px;
	padding: 0 15px;
	text-align: left;
	font-size: 16px;
}
.mainvisual__note li span {
	margin-right: 8px;
}
/* 特徴 */
.feature {
	position: relative;
	padding-top: 30px;
	background: #02122c url(../images/feature_bg.png) no-repeat left bottom / 100%;
	background-attachment: fixed;
}
.feature::after {
	position: absolute;
	top: -1px;
	left: 0;
	display: block;
	width: 100%;
	height: 6vw;
	background: url(../images/feature_bg-top.png) no-repeat center top 0 / contain;
	content: "";
}
.feature__comic {
	padding: 50px 0 80px;
}
.feature__comic h3 {
	margin-bottom: 50px;
	text-align: center;
}
.feature h2 {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
	color: #ffe154;
	font-size: 32px;
}
.feature h2 span {
	margin-right: 20px;
}
.feature__img {
	position: relative;
	margin: 0 0 15px;
}
.feature__item {
	padding-bottom: 80px;
}
.feature__item01 .feature__item01__mission {
	margin: 80px 0 30px;
	padding-bottom: 50px;
}
.feature__item01 .feature__item01__mission div {
	position: relative;
	margin-bottom: 50px;
	padding-left: 50px;
}
.feature__item01 .feature__item01__mission dd, .feature__item01 .feature__item01__mission dt {
	position: relative;
	z-index: 50;
}
.feature__item01 .feature__item01__mission div::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	display: block;
	width: 28px;
	height: 21px;
	background: url(../images/feature_comma.png) no-repeat left top / contain;
	content: "";
}
.feature__item01 .feature__item01__mission div:nth-of-type(1)::before {
	position: absolute;
	top: -80px;
	left: -40px;
	z-index: 10;
	display: block;
	width: 291px;
	height: 226px;
	background: url(../images/feature_text_bg01.png) no-repeat left center / contain;
	content: "";
}
.feature__item01 .feature__item01__mission div:nth-of-type(2) {
	margin-left: auto;
	max-width: 640px;
}
.feature__item01 .feature__item01__mission div:nth-of-type(2)::before {
	position: absolute;
	top: -80px;
	right: 0;
	z-index: 10;
	display: block;
	width: 353px;
	height: 265px;
	background: url(../images/feature_text_bg02.png) no-repeat right center / contain;
	content: "";
}
.feature__item01 .feature__item01__mission::after {
	position: absolute;
	left: 50%;
	display: block;
	width: 134px;
	height: 48px;
	background-color: #c3b667;
	content: "";
	transform: translateX(-50%);

	clip-path: polygon( 0 0,50% 100%,100% 0);
}
.feature__item01__table {
	margin-bottom: 20px;
}
.feature__item01__table table {
	min-width: 600px;
	width: 100%;
}
.feature__item01__table table, .feature__item01__table td, .feature__item01__table th {
	border: 1px solid #ffffff;
	border-collapse: collapse;
}
.feature__item01__table td, .feature__item01__table th {
	padding: 10px;
	min-width: 100px;
	height: 25px;
	vertical-align: middle;
	text-align: center;
}
.feature__item01__table th {
	width: 120px;
	color: #ffe154;
}
.feature__item01__table td:last-of-type {
	text-align: left;
}

.feature_point_service {
	position: relative;
	margin: 50px 0 15px;
}
.feature_point_service .link {
	position: absolute;
	right: 21.5em;
	bottom: 41.5em;
	width: 10em;
	height: 2em;
}
.feature__note li {
	margin-bottom: 6px;
}
.feature__note a {
	text-indent: 0;
}
.feature__item02 {
	padding-bottom: 30px;
}
.feature__shop {
	margin: 50px 0;
	text-align: center;
}
.feature__shop h3 {
	text-align: center;
	font-weight: bold;
	font-size: 26px;
}
.feature__shop__list {
	margin: 20px 0;
	padding: 20px;
	border-radius: 10px;
	background-color: rgba(255, 255, 255, .1);
}
.feature__shop ul {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}
.feature__shop li {
	padding: 0 3px;
}
.feature__list .btn {
	margin-bottom: 50px;
	padding: 30px 15px;
	background: #222a3b;
}
.feature__coupon {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 30px 0 15px;
	padding: 20px;
	border-radius: 10px;
	background-color: rgba(255, 255, 255, .1);
}
.feature__coupon p {
	padding: 0 30px;
	width: 50%;
}
.feature__item04 .feature__simulation {
	margin: 20px 0;
}
.feature__item04 .feature__simulation p {
	display: flex;
	align-items: center;
}
.feature__item04 .feature__simulation p span {
	margin-right: 20px;
}
.feature__item04 .feature__simulation dl {
	padding-bottom: 30px;
	background-color: #ffffff;
	color: #111111;
}
.feature__item04 .feature__simulation dt {
	padding: 10px 15px;
	background-color: #ffe154;
	text-align: center;
	font-weight: bold;
	font-size: 28px;
}
.feature__item04 .feature__simulation dd {
	padding: 25px 20px 0;
}
.feature__item05 .feature__box {
	margin-top: 30px;
	padding: 20px 40px 30px;
	border-radius: 10px;
	background-color: rgba(255, 255, 255, .1);
}
.feature__item05 .feature__box dl {
	margin: 20px 0;
}
.feature__item__list li {
	margin-bottom: 30px;
}
.feature__item__list li dt {
	margin-bottom: 20px;
	border-bottom: 1px solid #ffffff;
}

/* カード詳細 */
.detail {
	background-color: #111111;
}
.detail__box {
	margin-bottom: 50px;
}
.detail h2 {
	margin-bottom: 30px;
	text-align: center;
	font-weight: bold;
	font-size: 32px;
}
.detail__box__inner {
	border-top: 1px solid #ffffff;
	border-right: 1px solid #ffffff;
	border-left: 1px solid #ffffff;
}
.detail__box__inner th, .detail__box__inner td {
	padding: 20px;
	border-bottom: 1px solid #ffffff;
}
.detail__box__inner th {
	background: #323232;
	text-align: left;
	font-size: 15px;
	white-space: nowrap;
}
.detail__box__inner td {
	width: 40%;
	border-left: 1px solid #ffffff;
	font-size: 13px;
}
.detail__box__inner .visa img {
	width: 57px;
	height: auto;
	vertical-align: top;
}

/* お問い合わせ */
.contact {
	background: #222a3b;
}
.contact h2 {
	margin-bottom: 30px;
	text-align: center;
	font-weight: bold;
	font-size: 32px;
}
.contact__box {
	border: 1px solid #ffffff;
	border-radius: 10px;
	background: rgba(255, 255, 255, .1);
}
.contact__box dl {
	display: flex;
	align-items: center;
	padding: 30px 20px;
}
.contact__box dl dt {
	width: 50%;
	text-align: center;
	font-weight: bold;
	font-size: 26px;
}
.contact__box dl > div {
	padding-left: 30px;
	width: 50%;
	border-left: 1px solid #ffffff;
}
.contact__box dd.tel a {
	color: #ffffff;
	text-decoration: none;
	font-size: 40px;
}
.contact a[href^="tel:"] {
	pointer-events: none;
}
/* フッター */
.scroll-top {
	position: fixed;
	right: 10px;
	bottom: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 60px;
	height: 60px;
	border: 1px solid #ffffff;
	border-radius: 60px;
	background: rgba(255, 255, 255, .1);
	cursor: pointer;
	transition: .3s;
}
.scroll-top:hover {
	background: rgba(255, 255, 255, .3);
}
.scroll-top span {
	position: relative;
	padding-top: 15px;
}
.scroll-top span::after {
	position: absolute;
	top: 6px;
	left: 50%;
	display: block;
	width: 8px;
	height: 8px;
	border-right: solid 2px #ffffff;
	border-bottom: solid 2px #ffffff;
	content: "";
	transform: translateX(-50%) rotate(-135deg);
}
footer {
	padding: 10px 0 20px;
	background-color: #222a3b;
	text-align: center;
	font-size: 14px;
}

/* ------------------------ */
/* TB */
/* ------------------------ */
@media (max-width: 960px) {
	/* メインビジュアル */
	.mainvisual__title {
		padding: 0 50px;
	}
	.mainvisual__main__copy {
		padding: 20px 40px 20px 0;
	}
	.mainvisual__list {
		flex-wrap: wrap;
		justify-content: center;
		padding-bottom: 0;
	}
	.mainvisual__item {
		margin-bottom: 30px;
		width: 45%;
	}
}

/* ------------------------ */
/* SP */
/* ------------------------ */
@media (max-width: 768px) {
	/* ------------------------ */
	/* 共通 */
	/* ------------------------ */
	body {
		font-size: 14px;
	}
	.pc, .pc--img {
		display: none!important;
	}
	.sp {
		display: block!important;
	}
	.sp--img {
		display: inline-block!important;
	}
	.text--l {
		font-size: 20px;
		line-height: 1.8;
	}
	.text--m {
		font-size: 18px;
		line-height: 1.8;
	}
	.text--s {
		font-size: 15px;
		line-height: 1.6;
	}
	.text--ss {
		font-size: 13px;
		line-height: 1.6;
	}
	.section__inner {
		padding: 30px 15px;
	}

	.btn {
		padding: 30px 0;
	}
	.btn a {
		width: 100%;
		height: 60px;
		font-size: 20px;
	}
	/* ------------------------ */
	/* 個別 */
	/* ------------------------ */
	header .logo {
		width: 30%;
	}
	/* メインビジュアル */
	.mainvisual .section__inner {
		padding: 20px 20px 0;
	}
	.mainvisual__copy {
		font-size: 22px;
	}
	.mainvisual__sub-title {
		margin: 0 auto 2vw;
		width: 80%;
	}
	.mainvisual__title {
		margin: 0 auto 2vw;
		padding: 0;
	}
	.mainvisual__list__wrapper {
		margin-bottom: 20px;
		padding: 30px 20px ;
	}
	.mainvisual__list {
		margin-bottom: 20px;
		/* display: block; */
		padding: 0;
	}
	.mainvisual__note li {
		padding: 0;
		font-size: 14px;
	}
	.mainvisual__item {
		display: flex;
		flex-direction: column;
		justify-content: center;
		margin: 0 auto 10px;
		padding: 15px 0;
		width: 49%;
		border: 1px solid #ffffff;
		border-radius: 10px;
		background-color: rgba(255, 255, 255, .1);
		box-shadow: 0 0 6px #2455b7;
	}
	.mainvisual__item:nth-of-type(4) .link {
		position: absolute;
		top: 20%;
		right: 18%;
		width: 27%;
		height: 2em;
		font-size: 11px;
	}
	.mainvisual__item .link--anker {
		position: relative;
		position: relative;
		bottom: -10px;
		left: 0;
		display: block;
		padding: 10px;
		transform: translateX(0);
	}
	.mainvisual__main {
		display: block;
	}
	.mainvisual__main__card {
		position: relative;
		min-width: 230px;
		width: 72%;
		text-align: left;
	}
	.mainvisual__main__card:first-of-type {
		margin: 0 auto 0 10px;
	}
	.mainvisual__main__catch {
		top: 0;
		right: -144px;
	}
	.mainvisual__main__card:last-of-type {
		margin: 0 20px 0 auto;
		text-align: right;
	}
	.mainvisual__main__copy {
		margin-top: 10px;
		padding: 0 10px 10px;
		max-width: 100%;
	}
	.mainvisual__main__card:last-of-type .mainvisual__main__copy {
		text-align: right;
	}
	.mainvisual__banner {
		padding: 20px;
	}
	/* 特徴 */
	.feature {
		padding-top: 5vw;
		background-size: contain;
	}
	.feature h2 {
		display: block;
		text-align: center;
		font-size: 22px;
	}
	.feature h2 span {
		display: block;
		margin: 0 auto 10px;
		width: 22%;
	}
	.feature__item01 .feature__item01  div:nth-of-type(2)::before {
		top: -50px;
		right: auto;
		bottom: auto;
		left: -130px;
		width: 100%;
		height: 100%;
		background: url(../images/feature_text_bg02.png) no-repeat right bottom / contain;
	}
	.feature__item {
		padding-bottom: 10vw;
	}
	/* 特徴1 */
	.feature__item01 .feature__item01  div {
		margin-bottom: 12vw;
		padding-left: 0;
	}
	.feature__item01 .feature__item01  div::after {
		top: -20px;
		width: 20px;
		height: 20px;
	}
	.feature__item01__table {
		overflow-x: scroll;
	}
	.feature__comic {
		margin: 0;
		padding: 50px 0;
	}
	.feature__comic h3 {
		margin-bottom: 30px;
	}
	.feature__comic img {
		margin: 0 auto;
		width: 80%;
	}
	.feature__item01 .feature__item01__mission::after {
		width: 90px;
		height: 30px;
	}
	.feature__item01__catch span {
		display: inline-block;
	}
	.feature_point_service .link {
		right: auto;
		bottom: 36.5%;
		left: 4%;
		width: 33%;
		height: 3em;
	}
	/* 特徴2 */
	.feature__shop h3 {
		margin-bottom: 5vw;
		font-size: 20px;
	}
	.feature__shop__list ul {
		flex-wrap: wrap;
	}
	.feature__shop ul {
		margin-bottom: 2vw;
	}
	.feature__shop__list {
		padding: 2vw;
	}
	.feature__shop li {
		padding: 5px;
		width: 50%;
	}
	.feature__shop {
		margin: 30px 0 0;
	}
	/* 特徴3 */
	.feature__coupon {
		flex-direction: column;
	}
	.feature__coupon p {
		padding: 0;
		width: 100%;
	}
	.feature__coupon p img {
		margin-bottom: 20px;
	}
	/* 特徴4 */
	.feature__item04 .feature__simulation dt {
		font-size: 18px;
	}
	.feature__item04 .feature__simulation dd {
		padding: 15px;
	}
	.feature__item04 .feature__simulation dd img {
		width: 100%;
	}
	/* 特徴7・9 */
	.feature__item__list li {
		margin-bottom: 8vw;
	}
	.feature__item__list li:last-of-type {
		margin-bottom: 0;
	}
	/* カード詳細情報 */
	.detail h2 {
		margin-bottom: 10vw;
		font-size: 22px;
	}
	.detail__box {
		overflow-x: scroll;
		margin-bottom: 0;
		padding-left: 10px;
		width: 100%;
	}
	.detail__box__inner {
		width: 130vw;
	}
	.detail__box__inner th, .detail__box__inner td {
		padding: 10px;
		font-size: 12px;
	}
	/* お問い合わせ */
	.contact h2 {
		margin-bottom: 5vw;
		font-size: 22px;
	}
	.contact__box dl {
		display: block;
	}
	.contact__box dl dt {
		padding-bottom: 5vw;
		width: 100%;
		font-size: 20px;
	}
	.contact__box dl > div {
		padding: 5vw 0 0;
		width: 100%;
		border-top: 1px solid #ffffff;
		border-left: none;
		text-align: center;
	}
	.contact__box dd.tel a {
		font-size: 34px;
	}
	.contact a[href^="tel:"] {
		pointer-events: auto;
	}
	/* フッター */
	footer {
		font-size: 12px;
	}
	.scroll-top {
		width: 45px;
		height: 45px;
		font-size: 12px;
	}
}

/* ------------------------ */
/* SP スマホ 〜480px*/
/* ------------------------ */
@media (max-width: 480px) {
	.mainvisual__main__card:first-of-type {
		margin: 0 auto 0 10px;
		padding: 0;
	}
	.mainvisual__main__card:first-of-type::after {
		top: -9px;
		right: -36%;
		width: 36%;
		height: 36%;
	}
	.mainvisual__main__copy {
		font-size: 10px;
	}
	.mainvisual__item {
		width: 100%;
	}
	.mainvisual__copy {
		font-size: 18px;
	}
	.mainvisual__main__card {
		width: 100%;
	}
	.mainvisual__main__img {
		padding-right: 35%;
	}
	.mainvisual__main__catch {
		top: -20px;
		right: 10px;
		width: 30%;
	}
	.mainvisual__main__card:last-of-type {
		padding-left: 35%;
	}
	.mainvisual__item:nth-of-type(4) .link {
		top: 21%;
		right: 22%;
		font-size: 11px;
	}
	.feature__item01 .feature__item01__mission div {
		margin-bottom: 30px;
	}
	.feature__item01 .feature__item01__mission {
		margin: 50px 0 10px;
		padding-bottom: 40px;
	}
	.feature__item04 .feature__simulation dl {
		padding-bottom: 0;
	}
	.feature__item05 .feature__box {
		padding: 20px;
	}
}