@charset "UTF-8";

/* ==================================================

	style.css
	Version: 0.1
	
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto:wght@400;500;700&display=swap');

@font-face {
  font-family: 'icon';
  src: url('../fonts/icon.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^="icon-"], [class*=" icon-"] {
	font-family: 'icon' !important;
	speak: never;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.icon-arrow-next:before {
  content: "\e900";
}
.icon-arrow-prev:before {
  content: "\e901";
}
.icon-link-call:before {
  content: "\e902";
}
.icon-link-search:before {
  content: "\e903";
}

/* ==================================================

	RESET

*/
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	background-color: transparent;
	background-repeat: no-repeat;
	text-decoration: none;
	text-indent: 0;
	text-transform: none;
	font-style: inherit;
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
}
html, body {
	width: 100%;
}
body {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
ul, ol {
	list-style-type: none;
}
table {
	border-collapse: collapse;
}
a, button {
	cursor: pointer;
}
img,
picture {
	display: block;
	width: 100%;
	height: auto;
}
input, select, textarea, button {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	border: 0;
	border-radius: 0;
	resize: none;
}

/* ==================================================

	HTML

*/
html {
	/* 1rem = 10px */
	font-size: 10px;
}
@media screen and (max-width: 1280px) {
	html {
		/* 1rem = 10px */
		font-size: 0.78125vw;
	}
}
/* SP */
@media screen and (max-width: 820px) {
	html {
		/* 375px 1rem = 10px */
		font-size: 2.66666vw;
	}
}

body {
	background-color: #fff;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1.4rem;
	line-height: 1.5;
	color: #000;
	transition: background-color 0.4s ease;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body.inversion {
	background-color: #000;
}
/* SP */
@media screen and (max-width: 820px) {
	body {
		font-size: 1.2rem;
	}
}

main {
	position: relative;
	overflow: hidden;
}

.body {
	position: relative;
	overflow: hidden;
	padding: 8rem 0 10rem 0;
}
/* SP */
@media screen and (max-width: 820px) {
	.body {
		padding: 6rem 0 6rem 0;
	}
}

/* ==================================================

	VISIBLE

*/
@media screen and (max-width: 820px) {
	.visible-pc {
		display: none;
	}
}
@media screen and (min-width: 821px) {
	.visible-sp {
		display: none;
	}
}

/* ==================================================

	SIZE CHECKER

*/
@media screen and (max-width: 820px) {
	.size-checker {
		display: none;
	}
}

/* ==================================================

	HEADER

*/
header {
	position: fixed;
	z-index: 9001;
	top: 0;
	left: 0;
	width: 100%;
}
/**/
.header {
	background-color: rgba(0,0,0,0.8);
	border-bottom: 1px solid #666;
}
.header .inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 0 0 5rem;
	height: 8rem;
}
.header .logo {
	width: 16rem;
}
.header .nav {
	display: flex;
	height: 100%;
	color: #fff;
}
.header .nav a {
	overflow: hidden;
	display: block;
	width: 3rem;
	height: 3rem;
	background-size: contain;
	text-indent: -999em;
}
.header .nav .megamenu-opener {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 14rem;
	border-left: 1px solid #666;
	font-family: "Roboto", sans-serif;
	font-size: 1.6rem;
	letter-spacing: 0.1em;
}
.header .nav .megamenu-opener i {
	display: none;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -1.1rem;
	width: 2.2rem;
	height: 1px;
	background-color: #363636;
	transform: rotate(45deg);
}
.header .nav .megamenu-opener i::before,
.header .nav .megamenu-opener i::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #fff;
}
.header .nav .megamenu-opener i::after {
	transform: rotate(90deg);
}
.header .nav .megamenu-opener[aria-expanded="true"] span {
	display: none;
}
.header .nav .megamenu-opener[aria-expanded="true"] i {
	display: block;
}
.header .nav .sns {
	display: flex;
	align-items: center;
	padding: 0 2rem;
	border-left: 1px solid #666;
}
.header .nav .sns li {
	padding: 0 0.5rem;
}
.header .nav .sns .x {
	background-image: url(../img/common/icon-x.svg);
}
.header .nav .sns .instagram {
	background-image: url(../img/common/icon-instagram.svg);
}
.header .nav .sns .facebook {
	background-image: url(../img/common/icon-facebook.svg);
}
.header .nav .sns .line {
	background-image: url(../img/common/icon-line.svg);
}
.header .nav .sns .youtube {
	width: 4rem;
	background-image: url(../img/common/icon-youtube.svg);
}
.header .nav .contact {
	display: flex;
	align-items: center;
	padding: 0 2.5rem;
	border-left: 1px solid #666;
}
.header .nav .contact .call {
	background-image: url(../img/common/icon-call.svg);
}
/* HOVER */
@media (any-hover: hover) {

}
/* SP */
@media screen and (max-width: 820px) {
	.header .inner {
		padding: 0 0 0 1rem;
		height: 6rem;
	}
	.header .logo {
		width: 8.4rem;
	}
	.header .nav a {
		width: 2.2rem;
		height: 2.2rem;
	}
	.header .nav .megamenu-opener {
		order: 8;
		width: 6.8rem;
		font-size: 1.2rem;
	}
	.header .nav .sns {
		padding: 0 1rem;
	}
	.header .nav .sns li {
		padding: 0 0.2rem;
	}
	.header .nav .sns .youtube {
		width: 2.8rem;
	}
	.header .nav .contact {
		order: 9;
		padding: 0 1rem;
	}
}

/* ==================================================

	MEGAMENU

*/
.megamenu {
	overflow: hidden;
	overscroll-behavior: none;
	display: block;
	position: fixed;
	z-index: 9000;
	top: 8rem;
	left: 0;
	width: 100%;
	height: 0;
	font-weight: 700;
	font-size: 1.6rem;
	color: #fff;
}
.megamenu[aria-hidden="false"] {
	height: auto;
}
.megamenu .outer {
	overflow: hidden;
	height: 0;
	transition: height 0.4s ease;
}
.megamenu .nav {
	display: flex;
}
.megamenu .nav-root {
	overflow: hidden;
	flex-basis: 32rem;
	padding: 5rem 0;
	background-color: rgba(0,0,0,0.8);
}
.megamenu .nav-root ul li a,
.megamenu .nav-root ul li button {
	position: relative;
	display: flex;
	align-items: center;
	padding: 0 4rem;
	width: 100%;
	min-height: 6rem;
}
.megamenu .nav-root ul li a,
.megamenu .nav-root ul li button[aria-expanded="false"] {
	opacity: 0.4;
}
.megamenu .nav-root ul li button[aria-expanded="true"] {
	pointer-events: none;
}
.megamenu .nav-root ul li span.text {
	display: block;
}
.megamenu .nav-root ul li span:last-child {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -1.6rem;
	width: 1.6rem;
	height: 3.2rem;
	font-size: 1.3rem;
}
.megamenu .nav-root ul li span:last-child::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: -100%;
	bottom: 0;
	border: 1px solid #fff;
	transform: rotate(45deg);
}
.megamenu .nav-child {
	overflow: hidden;
	position: relative;
	flex: 1;
	background-color: rgba(0,0,0,0.9);
}
.megamenu .nav-child .block {
	position: absolute;
	top: 0;
	left: 100vw;
	padding: 5rem 4rem;
}
.megamenu .nav-child .block[aria-hidden="false"] {
	left: 0;
}
.megamenu .nav-child .h {
	padding: 0.8rem 0 0.6rem 0;
	font-size: 2rem;
}
.megamenu .nav-child .row {
	display: flex;
	gap: 8rem;
}
.megamenu .nav-child ul li a {
	position: relative;
	display: flex;
	align-items: center;
	padding-right: 7rem;
	min-height: 5.4rem;
}
.megamenu .nav-child ul li span:first-child {
	display: block;
	position: relative;
}
.megamenu .nav-child ul li span:last-child {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -1.6rem;
	width: 3.2rem;
	height: 3.2rem;
	font-size: 1.3rem;
}
.megamenu .nav-child ul li span:last-child::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #fff;
	transform: rotate(45deg);
}
.megamenu .nav-child ul li span:last-child i {
	position: relative;
}
.megamenu .nav-root ul li span.text {
	opacity: 0;
	transform: translateX(-4rem);
	transition: all 0.4s ease;
}
.megamenu[aria-hidden="false"] .nav-root ul li span.text {
	opacity: 1;
	transform: translateX(0rem);
}
.megamenu .nav-child .h {
	opacity: 0;
	transition: all 0.4s ease;
}
.megamenu .nav-child .block[aria-hidden="false"] .h {
	opacity: 1;
}
.megamenu .nav-child ul li {
	opacity: 0;
	transform: translateX(-4rem);
	transition: all 0.4s ease;
}
.megamenu .nav-child .block[aria-hidden="false"] ul li {
	opacity: 1;
	transform: translateX(0rem);
}
.megamenu .nav-child .foot {
	display: none;
}
.megamenu .nav-child .foot .c-btn {
	width: auto;
	background-color: transparent;
}
/* HOVER */
@media (any-hover: hover) and (min-width: 821px) {
	.megamenu .nav-root ul li a,
	.megamenu .nav-root ul li button {
		transition: all 0.4s ease;
	}
	.megamenu .nav-root ul li a:hover,
	.megamenu .nav-root ul li button:hover {
		opacity: 1;
	}
	.megamenu .nav-child ul li span:first-child::before {
		content: '';
		display: block;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 100%;
		height: 1px;
		background-color: #fff;
		transition: all 0.4s ease;
	}
	.megamenu .nav-child ul li a:hover span:first-child::before {
		right: 0;
	}
	.megamenu .nav-child ul li span:last-child i {
		transition: color 0.4s ease;
	}
	.megamenu .nav-child ul li a:hover span:last-child i {
		color: #000;
	}
	.megamenu .nav-child ul li span:last-child::before {
		transition: background-color 0.4s ease;
	}
	.megamenu .nav-child ul li a:hover span:last-child::before {
		background-color: #fff;
	}
}

/* SP */
@media screen and (max-width: 820px) {
	.megamenu {
		top: 6rem;
		width: 200vw;
		font-size: 2rem;
	}
	.megamenu .nav {
		height: calc(100vh - 6rem);
		transition: transform 0.5s ease-in-out;
	}
	.megamenu .nav-root {
		overflow-y: auto;
		padding: 4rem 0;
		height: 100%;
		flex-basis: 100vw;
	}
	.megamenu .nav-root ul li a,
	.megamenu .nav-root ul li button {
		padding: 0 2.5rem;
		min-height: 9rem;
	}
	.megamenu .nav-root ul li a,
	.megamenu .nav-root ul li button[aria-expanded="false"] {
		opacity: 1;
	}
	.megamenu .nav-child {
		height: 100%;
		overflow-y: auto;
	}
	.megamenu .nav-child .row {
		display: block;
	}
	.megamenu .nav-child .block {
		position: static;
		padding: 0;
	}
	.megamenu .nav-child .h {
		padding: 4rem 0 1rem 2.5rem;
		font-size: 2.4rem;
	}
	.megamenu .nav-child .block ul li {
		opacity: 1 !important;
		transform: translateX(0rem) !important;
	}
	.megamenu .nav-child .block[aria-hidden="true"] {
		overflow: hidden;
		height: 0;
	}
	.megamenu .nav-child .block[aria-hidden="false"] {
		overflow: visible;
		height: auto;
	}
	.megamenu .nav-child .block .text {
		opacity: 0;
		transform: translateX(-4rem);
		transition: all 0.4s ease;
	}
	.megamenu .nav-child .block[aria-hidden="false"] .text {
		opacity: 1;
		transform: translateX(0rem);
	}
	.megamenu .nav-child ul li a {
		padding: 0 2.5rem;
		min-height: 6rem;
	}
	.megamenu .nav-child ul li span:last-child {
		width: 1.6rem;
	}
	.megamenu .nav-child ul li span:last-child::before {
		right: -100%;
	}
	.show-nav-child .megamenu .nav {
		transform: translateX(-50%);
	}
	.megamenu .nav-child .foot {
		display: block;
		padding: 0 2.5rem 2rem 2.5rem;
		opacity: 0.5;
	}
	.megamenu .nav-child .foot .c-btn .c-btn-text {
		font-size: 2rem;
	}
}

/* ==================================================

	FOOTER

*/
footer {
	position: relative;
	background-color: #000;
	color: #fff;
}
footer .wrapper {
	display: flex;
	gap: 2rem;
	padding: 5rem 0;
}
footer .col:first-child {
	flex: 1;
	display: flex;
	flex-direction: column;
}
footer .col:last-child {
	flex-basis: 30rem;
}
footer .nav-content {
	display: flex;
	flex: 1;
	margin-bottom: 2rem;
	text-align: center;
	gap: 8rem;
	font-weight: 700;
}
footer .nav-content .h {
	display: flex;
	justify-content: center;
	margin-bottom: 2.2rem;
	font-family: "Roboto", sans-serif;
	font-size: 1.6rem;
	line-height: 1.1;
}
footer .nav-content ul li {
	display: flex;
	justify-content: center;
	margin-bottom: 1.8rem;
}
footer .nav-content ul li:last-child {
	margin-bottom: 0;
}
footer .nav-other {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
footer .nav-other .banner-ju {
	flex-basis: 46rem;
}
footer .nav-other .sns {
	display: flex;
	align-items: center;
}
footer .nav-other .sns a {
	overflow: hidden;
	display: block;
	width: 4rem;
	height: 4rem;
	background-size: contain;
	text-indent: -999em;
}
footer .nav-other .sns li {
	padding: 0 1rem 0 0;
}
footer .nav-other .sns .x {
	background-image: url(../img/common/icon-x.svg);
}
footer .nav-other .sns .instagram {
	background-image: url(../img/common/icon-instagram.svg);
}
footer .nav-other .sns .facebook {
	background-image: url(../img/common/icon-facebook.svg);
}
footer .nav-other .sns .line {
	background-image: url(../img/common/icon-line.svg);
}
footer .nav-other .sns .youtube {
	width: 5.3rem;
	background-image: url(../img/common/icon-youtube.svg);
}
footer .sponsor {
	margin-bottom: 3rem;
}
footer .sponsor dl {
	display: flex;
	align-items: center;
}
footer .sponsor dt {
	width: 13rem;
}
footer .sponsor dd {
	flex: 1;
	padding-left: 1rem;
}
footer .footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 8rem;
	border-top: 1px solid #666;
}
footer .footer h3 {
	width: 12rem;
}
footer .footer small {
	display: block;
	text-align: right;
	font-family: "Roboto", sans-serif;
	font-size: 1.2rem;
}
/* HOVER */
@media (any-hover: hover) {
	footer .nav-content a {
		display: block;
		position: relative;
	}
	footer .nav-content a::before {
		content: '';
		display: block;
		position: absolute;
		bottom: 0;
		left: 0;
		width: 0;
		height: 1px;
		background-color: #fff;
		transition: width 0.4s ease;
	}
	footer .nav-content a:hover::before {
		width: 100%;
	}
}
/* SP */
@media screen and (max-width: 820px) {
	footer .wrapper {
		display: block;
		padding: 5rem 0;
	}
	footer .nav-content {
		flex-wrap: wrap;
		gap: 0;
		margin: 0 -1rem;
	}
	footer .nav-content > div {
		flex-basis: 50%;
		margin-bottom: 5rem;
	}
	footer .nav-content .h {
		margin-bottom: 2rem;
		font-family: "Roboto", sans-serif;
		font-size: 1.6rem;
	}
	footer .nav-content ul li {
		margin-bottom: 2rem;
	}
	footer .nav-other {
		display: block;
	}
	footer .nav-other .sns {
		justify-content: center;
		margin-bottom: 3rem;
	}
	footer .nav-other .sns li {
		padding: 0 0.5rem;
	}
	footer .nav-other .banner-ju {
		margin-bottom: 3rem;
	}
	footer .sponsor {
		margin-bottom: 3rem;
		font-size: 1.2rem;
	}
	footer .sponsor dt {
		width: 9rem;
	}
	footer .footer {
		display: block;
		padding: 2rem 0;
		min-height: initial;
	}
	footer .footer small {
		margin-top: 1rem;
		text-align: left;
	}
}

/* ==================================================

	BREADCRUMB

*/
.breadcrumb {
	padding: 4rem 0 5rem 0;
}
.breadcrumb ul {
	display: flex;
	font-size: 1.2rem;
}
.breadcrumb ul li {
	position: relative;
	padding-right: 2rem;
}
.breadcrumb ul li:last-child {
	padding-right: 0;
}
.breadcrumb ul li::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 0.4rem;
	margin-top: -0.6rem;
	width: 1.2rem;
	height: 1.2rem;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url(../img/common/icon-breadcrumb-arrow.svg);
	background-size: contain;
}
.breadcrumb ul li:last-child::after {
	content: none;
}
.breadcrumb ul li a {
	font-weight: 500;
	text-decoration: underline;
}
/* SP */
@media screen and (max-width: 820px) {
	.breadcrumb {
		padding: 1rem 0 2rem 0;
	}
	.breadcrumb ul {
		font-size: 1rem;
	}
	.breadcrumb ul li {
		padding-right: 1.8rem;
	}
	.breadcrumb ul li::after {
		margin-top: -0.5rem;
		width: 1rem;
		height: 1rem;
	}
}

/* ==================================================

	INVIEW

*/
.fade {
	opacity: 0;
	transition: opacity 0.4s ease;
}
.inview-fade {
	opacity: 1;
}

/* ==================================================

	MAIN

*/
.c-main .c-container {
	display: flex;
	align-items: center;
	min-height: 41rem;
}
.c-main .detail {
	width: 50%;
}
.c-main h1 {
	font-weight: 700;
	font-size: 4.8rem;
	line-height: 1.2;
}
.c-main h2 {
	margin-bottom: 2rem;
	margin-top: 1.5rem;
	font-weight: 700;
	font-size: 1.8rem;
}
.c-main h2:last-child {
	margin-bottom: 0;
}
.c-main .indent {
	text-indent: -0.5em;
}
.c-main .kv {
	position: absolute;
	top: 1rem;
	left: 50%;
	margin-left: 3rem;
	width: 65rem;
}
.c-main .kv .base span {
	display: block;
	clip-path: polygon(23% 0%, 100% 0%, 77% 100%, 0 100%);
}
.c-main .kv .front {
	position: absolute;
	left: 1rem;
	bottom: 0;
	width: 30rem;
}
.c-main .kv .front span {
	display: block;
}

.inversion .c-main {
	color: #fff;
}

/* SP */
@media screen and (max-width: 820px) {
	.c-main .c-container {
		min-height: 16rem;
	}
	.c-main .detail {
		width: 48%;
	}
	.c-main h1 {
		font-size: 1.82rem;
		line-height: 1.3;
	}
	.c-main h2 {
		margin-bottom: 2rem;
		margin-top: 1.5rem;
		font-size: 1.4rem;
	}
	.c-main .kv {
		top: 0.5rem;
		margin-left: -1rem;
		width: 26rem;
	}
	.c-main .kv .front {
		left: 0;
		bottom: 0;
		width: 30rem;
	}
}

/* ==================================================

	NUM HEADING

*/
.c-num-heading {
	position: relative;
	margin-bottom: 2rem;
	padding-left: 5.6rem;
	font-weight: 700;
	font-size: 2rem;
	line-height: 1.5;
}
.c-num-heading .num {
	position: absolute;
	top: 50%;
	left: 0.8rem;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 3rem;
	height: 3rem;
	transform: translateY(-50%);
}
.c-num-heading .num::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	transform: rotate(45deg);
}
.c-num-heading .num i {
	display: block;
	position: relative;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 93%;
	color: #fff;
}
/* SP */
@media screen and (max-width: 820px) {
	.c-num-heading {
		margin-bottom: 1.5rem;
		padding-left: 4.8rem;
		font-size: 1.6rem;
	}
	.c-num-heading .num {
		left: 0.8rem;
		width: 2.6rem;
		height: 2.6rem;
	}
	.c-num-heading .num i {
		font-size: 100%;
	}
}

/* ==================================================

	CTR

*/
.c-ctr {
	position: absolute;
	z-index: 2;
	top: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: -5rem;
	width: 5rem;
	height: 10rem;
	font-size: 2.4rem;
	color: #fff;
	transition: color 0.4s ease;
}
.c-ctr::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	width: 200%;
	height: 100%;
	background-color: #000;
	opacity: 0.8;
	transform: rotate(45deg);
	transition: all 0.4s ease;
}
.c-ctr-prev {
	left: 0;
	padding-left: 1rem;
}
.c-ctr-prev::before {
	right: 0;
}
.c-ctr-next {
	right: 0;
	padding-right: 1rem;
}
.c-ctr-next::before {
	left: 0;
}
.c-ctr i {
	display: block;
	position: relative;
	transition: all 0.3s ease;
}
/* inversion */
.inversion .c-ctr {
	color: #000;
}
.inversion .c-ctr::before {
	background-color: #fff;
}
/* HOVER */
@media (any-hover: hover) {
	.c-ctr:hover::before {
		opacity: 1;
	}
	.c-ctr-next:hover i {
		transform: translateX(25%);
	}
	.c-ctr-prev:hover i {
		transform: translateX(-25%);
	}
}
/* SP */
@media screen and (max-width: 820px) {
	.c-ctr {
		margin-top: -2.7rem;
		width: 2.7rem;
		height: 5.4rem;
		font-size: 1.8rem;
	}
	.c-ctr-prev {
		padding-left: 0.5rem;
	}
	.c-ctr-next {
		padding-right: 0.5rem;
	}
}

/* ==================================================

	BG

*/
.c-bg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.c-bg > div {
	position: absolute;
	width: 15rem;
	height: 40rem;
	transform: skewX(-21deg);
}
.c-bg > div span {
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 0%;
	background-color: rgba(198,198,198,0.14);
	transition: height 0.8s ease 0.2s;
}
/* INVIEW */
.c-bg > div.inview span {
	height: 100%;
}
/* SP */
@media screen and (max-width: 820px) {
	.c-bg > div {
		width: 12rem;
		height: 34rem;
	}
}

/* ==================================================

	MORE

*/
.c-more-wrap {
	display: flex;
}
.c-more .c-more-link {
	display: flex;
	align-items: center;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 1.5rem;
}
.c-more .c-more-text {
	display: block;
	position: relative;
}
.c-more .c-more-text br {
	display: none;
}
.c-more .c-more-arrow {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	margin-left: 2rem;
	width: 3rem;
	height: 3rem;
}
.c-more .c-more-arrow::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #000;
	transform: rotate(45deg);
}
.c-more .c-more-color-w .c-more-arrow::before {
	border-color: #fff;
}
.c-more .c-more-arrow i {
	display: block;
	position: relative;
	font-size: 1.4rem;
}
.inversion .c-more .c-more-link.dynamic .c-more-arrow::before {
	border-color: #fff;
}
/* HOVER */
@media (any-hover: hover) {
	.c-more .c-more-text::before {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		right: 100%;
		bottom: 0;
		height: 1px;
		background-color: #000;
		transition: all 0.4s ease;
	}
	.c-more .c-more-color-w .c-more-text::before,
	.inversion .c-more .c-more-text::before {
		background-color: #fff;
	}
	a:hover .c-more .c-more-link .c-more-text::before,
	.c-more a.c-more-link:hover .c-more-text::before {
		right: 0;
	}
	.c-more .c-more-link .c-more-arrow,
	.c-more .c-more-link .c-more-arrow::before {
		transition: all 0.4s ease;
	}
	a:hover .c-more .c-more-link .c-more-arrow,
	.c-more a.c-more-link:hover .c-more-arrow {
		color: #fff;
	}
	a:hover .c-more .c-more-link .c-more-arrow::before,
	.c-more a.c-more-link:hover .c-more-arrow::before {
		background-color: #000;
	}
	a:hover .c-more .c-more-color-w .c-more-arrow,
	.c-more a.c-more-color-w:hover .c-more-arrow,
	.inversion a:hover .c-more .dynamic.c-more-link .c-more-arrow,
	.inversion .c-more a.dynamic.c-more-link:hover .c-more-arrow {
		color: #000;
	}
	a:hover .c-more .c-more-color-w .c-more-arrow::before,
	.c-more a.c-more-color-w:hover .c-more-arrow::before,
	.inversion a:hover .c-more .dynamic.c-more-link .c-more-arrow::before,
	.inversion .c-more a.dynamic.c-more-link:hover .c-more-arrow::before {
		background-color: #fff;
	}
}
/* SP */
@media screen and (max-width: 820px) {
	.c-more .c-more-link {
		font-size: 1.4rem;
		line-height: 1.3;
	}
	.c-more .c-more-text br {
		display: block;
	}
	.c-more .c-more-arrow {
		margin-left: 1.2rem;
		width: 2rem;
		height: 2rem;
	}
	.c-more .c-more-arrow i {
		font-size: 1.1rem;
	}
}

/* ==================================================

	CONTAINER

*/
.c-container {
	position: relative;
	margin: 0 auto;
	padding: 0 10rem;
	max-width: 128rem;
}
/* SP */
@media screen and (max-width: 820px) {
	.c-container {
		padding: 0 1.5rem;
		max-width: initial;
	}
}

/* ==================================================

	LINK

*/
.c-link {
	display: flex;
	align-items: center;
	font-weight: 700;
	font-size: 1.4rem;
}
.c-link.en {
	font-family: "Roboto", sans-serif;
	font-size: 1.5rem;
}
.c-link .c-link-text {
	display: block;
	position: relative;
}
.c-link .c-link-arrow {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	margin-left: 1.6rem;
	width: 3rem;
	height: 3rem;
}
.c-link .c-link-arrow::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #000;
	transform: rotate(45deg);
}
.c-link-color-w .c-link-arrow::before {
	border-color: #fff;
}
.c-link .c-link-arrow i {
	display: block;
	position: relative;
	font-size: 1.4rem;
}
.c-link .c-link-arrow i.icon-link-call {
	font-size: 1.7rem;
}

.inversion .c-link .c-link-arrow::before {
	border-color: #fff;
}

/* HOVER */
@media (any-hover: hover) {
	.c-link .c-link-text::before {
		content: '';
		display: block;
		position: absolute;
		left: 0;
		right: 100%;
		bottom: 0;
		height: 1px;
		background-color: #000;
		transition: all 0.4s ease;
	}
	.c-link-color-w .c-link-text::before {
		background-color: #fff;
	}
	a:hover .c-link .c-link-text::before,
	a.c-link:hover .c-link-text::before {
		right: 0;
	}
	.c-link .c-link-arrow,
	.c-link .c-link-arrow::before {
		transition: all 0.4s ease;
	}
	a:hover .c-link .c-link-arrow,
	a.c-link:hover .c-link-arrow {
		color: #fff;
	}
	a:hover .c-link .c-link-arrow::before,
	a.c-link:hover .c-link-arrow::before {
		background-color: #000;
	}
	a:hover .c-link-color-w .c-link-arrow,
	a.c-link-color-w:hover .c-link-arrow {
		color: #000;
	}
	a:hover .c-link-color-w .c-link-arrow::before,
	a.c-link-color-w:hover .c-link-arrow::before {
		background-color: #fff;
	}

	.inversion .c-link .c-link-text::before {
		background-color: #fff;
	}
	.inversion a:hover .c-link .c-link-arrow,
	.inversion a.c-link:hover .c-link-arrow {
		color: #000 !important;
	}
	.inversion a:hover .c-link .c-link-arrow::before,
	.inversion a.c-link:hover .c-link-arrow::before {
		background-color: #fff !important;
	}
}
/* SP */
@media screen and (max-width: 820px) {
	.c-link .c-link-arrow {
		margin-left: 1.2rem;
		width: 2.6rem;
		height: 2.6rem;
	}
	.c-link .c-link-arrow i {
		font-size: 1.1rem;
	}
}
/* ==================================================

	BUTTON

*/
.c-btn {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 32rem;
	height: 7rem;
	background-color: #000;
	font-weight: 700;
	font-size: 1.4rem;
	color: #fff;
	transition: all 0.4s ease;
}
.c-btn .c-btn-text {
	display: block;
	position: relative;
}
.c-btn .c-btn-arrow {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	margin-left: 1.6rem;
	width: 3rem;
	height: 3rem;
}
.c-btn .c-btn-arrow::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #fff;
	transform: rotate(45deg);
}
.c-btn .c-btn i {
	display: block;
	position: relative;
	font-size: 1.4rem;
}
.c-btn:disabled {
	opacity: 0.5;
	pointer-events: none;
}

.inversion .c-btn {
	background-color: #fff;
	color: #000;
}
.inversion .c-btn .c-btn-arrow::before {
	border-color: #000;
}

/* HOVER */
@media (any-hover: hover) {

}
/* SP */
@media screen and (max-width: 820px) {
	.c-btn {
		height: 6rem;
	}
	.c-btn .c-btn-arrow {
		margin-left: 1.6rem;
		width: 2.6rem;
		height: 2.6rem;
	}
}