/*
Theme Name: 
Theme URI: NA
Author: T.Oka
Author URI: NA
Description: NA
Version: 1.0.0
	font-family: 'Akshar', sans-serif;

*/
 @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');
 @import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
 @charset "UTF-8";

 .body {
 	font-family: 'Noto Sans JP', sans-serif;
 }

 ul {
 	margin: 0;
 	padding: 0;
 }

 .wrapper {
 	width: 100%;
 	height: auto;
 	display: flex;
 	justify-content: center;
 }

 .heading {
 	width: 100%;
 	height: auto;
 	padding: 80px 10%;
 }

 .heading2 {
 	width: 100%;
 	height: auto;
 	padding: 80px 10%;
 }

 .heading3 {
 	width: 100%;
 	height: auto;
 	padding: 80px 25%;
 }

 .pc {
 	display: block;
 }

 .sp {
 	display: none;
 	margin-bottom: 10%;
 }

 h1 {
 	text-align: center;
 	font: normal normal bold 34px/51px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin: 0 0 40px 0;
 }

 h2 {
 	text-align: center;
 	font: normal normal bold 26px/39px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #FFFFFF;
 	margin: 0 0 40px 0;
 }

 h3 {
 	text-align: left;
 	font: normal normal bold 20px/30px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin: 0 0 32px 0;
 }

 p {
 	font: normal normal normal 16px/28px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin: 0;
 }

 .wh {
 	text-align: center;
 	color: #FFFFFF;
 	margin-bottom: 40px;
 }

 a:hover {
 	opacity: 0.8;
 }

 img {
 	width: 100%;
 	height: auto;
 }

 @media screen and (max-width: 1023px) {
 	.sp {
 		display: block;
 	}

 	.pc {
 		display: none;
 	}

 	.heading,
 	.heading2,
 	.heading3 {
 		padding: 80px 5.128%;
 	}

 	h1 {
 		font: normal normal bold 26px/39px Noto Sans JP;
 	}

 	h3 {
 		margin: 0 0 24px 0;
 	}
 }

 /* header */
 .block1 {
 	position: relative;
 	top: 0;
 	width: 100%;
 	height: auto;
 }

 a.logo {
 	position: absolute;
 	width: 8.833%;
 	height: auto;
 	margin: 20px;
 }

 @media screen and (max-width: 1023px) {
 	a.logo {
 		width: 27.179%;
 	}
 }


 /* kv */

 .block1 {
 	position: relative;
 }

 .kv_cta img {
 	width: 23vw;
 	position: absolute;
 	left: 16.75vw;
 	bottom: 20%;
 }

 .kv_cta2 img {
 	width: 23vw;
 	position: absolute;
 	left: 16.75vw;
 	bottom: 6%;
 }

 @media screen and (max-width: 1023px) {
 	.kv_cta img {
 		width: 70vw;
 		left: 14.6vw;
 		bottom: 9%;
 	}

 	.kv_cta2 img {
 		width: 70vw;
 		left: 14.6vw;
 		bottom: -1%;
 	}
 }

 /* about */
 #about {
 	background: transparent linear-gradient(139deg, #FFBACD 0%, #FF8AA3 100%) 0% 0% no-repeat padding-box;
 }

 .heading2 h1 img {
 	width: 26.66%;
 	height: auto;
 }

 p.backup {
 	text-align: center;
 	font: normal normal bold 24px/50px Noto Sans JP;
 	color: #fff;
 	margin-top: 40px;
 }

 p.backup span {
 	background: #fff;
 	color: #FFBACD;
 	padding: 6px 14px;
 	margin-right: 10px;
 }

 @media screen and (max-width: 1023px) {
 	.heading2 h1 img {
 		width: 74.358%;
 	}

 	p.backup {
 		font: normal normal bold 20px/32px Noto Sans JP;
 	}

 	p.backup span {
 		padding: 4px 2px;
 	}
 }

 /* problem */
 #problem {
 	background: #F2F2F2 0% 0% no-repeat padding-box;
 }

 #problem span {
 	color: #5AB3BE;
 }

 .check_list img {
 	display: block;
 	width: 24px;
 	height: 24px;
 	margin: 4px 8px 0 0;
 }

 li.check_list {
 	display: flex;
 	width: 100%;
 	height: auto;
 	text-align: left;
 	font: normal normal bold 20px/29px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin-bottom: 24px;
 }

 @media screen and (max-width: 1023px) {}

 /* suport */
 #support {
 	background-image: url(../img/support_bg.png);
 	background-repeat: no-repeat;
 	background-size: cover;
 }

 #support h1 span,
 #support p span {
 	color: #FFBACD;
 	margin: 0;
 }

 #support li p {
 	text-align: left;
 	font: normal normal bold 20px/29px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin: 0;
 }

 @media screen and (max-width: 1023px) {}

 /* point */
 .point_area {
 	background: #FFEFF3;
 }

 .point_area h1 {
 	width: 50%;
 	height: auto;
 	margin: 0 auto 80px auto;
 }

 .swap_content h2 {
 	text-align: left;
 	font: normal normal normal 20px/51px Oswald;
 	letter-spacing: 0px;
 	color: #AEAEAE;
 	text-transform: uppercase;
 	font-weight: 500;
 	margin: 0 0 18px 0;
 }

 .swap_content h2 span {
 	text-align: left;
 	font: normal normal normal 80px/51px Oswald;
 	letter-spacing: 0px;
 	color: #FFBACD;
 	font-weight: 500;
 	margin-left: 5px;
 }

 .swap_area {
 	width: 100%;
 	display: flex;
 	padding-bottom: 50px;
 }

 .swap_img {
 	width: 46.875%;
 	height: auto;
 }

 .swap_content {
 	width: 46.875%;
 	height: auto;
 	margin-right: 6.25%;
 }

 .swap .swap_img {
 	order: 1;
 }

 .swap .swap_content {
 	order: 2;
 	margin-left: 6.25%;
 	margin-right: 0;
 }

 @media screen and (max-width: 1023px) {
 	.point_area h1 {
 		width: 60%;
 	}

 	.swap_area {
 		display: block;
 	}

 	.swap_area.no_bottom {
 		padding-bottom: 0;
 	}

 	.swap_img {
 		width: 100%;
 		height: auto;
 		padding-top: 32px;
 	}

 	.swap_content {
 		width: 100%;
 		height: auto;
 		padding-right: 0;
 		padding-left: 0;
 	}

 	.swap_content h2 span {
 		font: normal normal normal 50px/51px Oswald;
 	}
 }

 /* service */
 #service h1 {
 	width: 50%;
 	height: auto;
 	margin: 0 auto 40px auto;
 }

 .service_area {
 	display: flex;
 	width: 100%;
 	height: auto;
 }

 .service_block {
 	width: 31.25%;
 	height: auto;
 	background: #FFFFFF 0% 0% no-repeat padding-box;
 	box-shadow: 0px 0px 6px #00000029;
 	border-radius: 20px;
 	margin-right: 3.125%;
 	padding: 30px 20px;
 }

 .service_block.last {
 	margin-right: 0;
 }

 .service_block img {
 	display: block;
 	width: 40%;
 	height: auto;
 	margin: 0 auto 16px auto;
 }

 .service_block h2 {
 	text-align: center;
 	font: normal normal bold 28px/38px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #FFBACD;
 	margin: 0 0 16px 0;
 }

 @media screen and (max-width: 1023px) {
 	#service h1 {
 		width: 60%;
 	}

 	.service_area {
 		display: block;
 	}

 	.service_block {
 		width: 100%;
 		margin: 0 0 30px 0;
 	}

 	.service_block.last {
 		margin: 0;
 	}
 }

 /* cta */
 #cta {
 	background: transparent linear-gradient(96deg, #FFBACD 0%, #FF8AA3 100%) 0% 0% no-repeat padding-box;
 	padding: 30px 0;
 }

 #cta a {
 	width: 23%;
 	height: auto;
 	display: inline-block;
 }

 @media screen and (max-width: 1023px) {
 	#cta a {
 		width: 70.769%;
 	}
 }

 /* qa */
 #qa {
 	background: #F2F2F2 0% 0% no-repeat padding-box;
 }

 #qa h2 {
 	text-align: center;
 	font: normal normal bold 34px/51px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin: 0 0 40px 0;
 }

 .qa_area {
 	width: 100%;
 	height: auto;
 }

 .qa_area img {
 	width: 40px;
 	height: 40px;
 }

 .accordion {
 	max-width: 100%;
 	border-bottom: 1px solid #D9D9D9;
 }

 .accordion summary {
 	display: flex;
 	position: relative;
 	cursor: pointer;
 	padding: 29px 0;
 	line-height: 40px;
 }

 .accordion summary span {
 	text-align: left;
 	font: normal normal bold 18px/27px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin-left: 10px;
 	line-height: 40px;
 }

 .accordion summary::-webkit-details-marker {
 	display: none;
 }

 .accordion summary::after {
 	content: '';
 	transform: translateY(-25%) rotate(45deg);
 	width: 12px;
 	height: 12px;
 	border-bottom: 2px solid #5AB3BE;
 	border-right: 2px solid #5AB3BE;
 	transition: transform .4s;
 	top: 45%;
 	right: 10px;
 	position: absolute;
 }

 .accordion[open] summary::after {
 	transform: rotate(225deg);
 }

 .accordion h4 {
 	transform: translateY(-10px);
 	opacity: 0;
 	margin: 0 0 0 10px;
 	text-align: left;
 	font: normal normal normal 15px/24px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #333333;
 	transition: transform .5s, opacity .5s;
 	line-height: 40px;
 }

 .accordion p {
 	text-align: left;
 	font: normal normal normal 16px/28px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #444444;
 	margin: 0 0 0 10px;
 	line-height: 40px;
 }

 .accordion[open] p {
 	transform: none;
 	opacity: 1;
 }

 .accordion ul {
 	list-style: none;
 	padding: 0;
 	margin: 0;
 }

 .accordion li {
 	text-align: left;
 	margin-left: 50px;
 }

 .last_accordion {
 	border-bottom: none;
 }

 .answer_wrapper {
 	padding-bottom: 30px;
 }

 .accordion a {
 	text-align: left;
 	text-decoration: underline;
 	font: normal normal normal 15px/18px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #18874E;
 }

 .answer {
 	display: flex;
 	line-height: 40px;
 }

 @media screen and (max-width: 1023px) {
 	#qa h2 {
 		font: normal normal bold 26px/39px Noto Sans JP;
 	}

 	.accordion summary {
 		line-height: 30px;
 	}

 	.accordion summary span {
 		width: 75%;
 		line-height: 20px;
 	}

 	.accordion p {
 		line-height: 30px;
 	}

 	.accordion li {
 		text-align: left;
 		margin-left: 40px;
 	}

 	.answer_wrapper {
 		padding-bottom: 30px;
 	}

 	.answer {
 		line-height: 30px;
 	}
 }

 /* footer */
 .footer {
 	width: 100%;
 	height: 90px;
 	display: flex;
 	justify-content: center;
 	background: #F2F2F2 0% 0% no-repeat padding-box;
 }

 .footer a {
 	display: inline-block;
 	text-decoration: none;
 	font: normal normal normal 14px/20px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #414141;
 }

 .copy {
 	text-align: center;
 	font: normal normal normal 14px/20px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #414141;
 	text-decoration: none;
 }

 @media screen and (max-width: 1023px) {
 	.footer a {
 		margin: 10px 0;
 	}

 	.cta_fixed {
 		position: fixed;
 		background: rgba(0, 0, 0, 0.6);
 		width: 100%;
 		height: 50px;
 		bottom: 0;
 	}

 	.cta_fixed_wrapper {
 		display: flex;
 		justify-content: center;
 		text-align: center;
 		line-height: 50px;
 	}

 	.cta_fixed_wrapper img {
 		width: 206px;
 		height: 40px;
 	}
 }

 /* privacy */
 #privacy,
 #thanks {
 	padding: 50px 133px;
 }

 #privacy h3 {
 	position: relative;
 	text-align: left;
 	font: normal normal bold 22px/33px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #FFFFFF;
 	padding-left: 14px;
 	margin: 0 0 24px 0;
 }

 #privacy h3::before {
 	content: "";
 	position: absolute;
 	background: #00DB01 0% 0% no-repeat padding-box;
 	width: 4px;
 	height: 32px;
 	left: 0;
 	top: 0;
 }

 #privacy p,
 #privacy a {
 	text-align: left;
 	text-decoration: none;
 	font: normal normal normal 16px/28px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #FFFFFF;
 	margin: 0 0 56px 0;
 }

 	{
 	text-align: left;
 	font: normal normal normal 16px/28px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #FFFFFF;
 	margin: 0 0 56px 0;
 }

 @media screen and (max-width: 1365px) {

 	#privacy,
 	#thanks {
 		padding: 32px 20px;
 	}
 }

 /* thanks */
 main.page02 {
 	width: 100%;
 	height: 75vh;
 	background: #000;
 }

 .page02 p,
 .page02 a {
 	font: normal normal normal 16px/28px Noto Sans JP;
 	letter-spacing: 0px;
 	color: #FFFFFF;
 }

 .thanks_wrapper {
 	display: flex;
 	justify-content: center;
 }

 .btn01 .btn {
 	background: #004096;
 	border-radius: 25px;
 	border: none;
 	width: 120px;
 	color: #fff;
 	padding: 4px;
 	margin-left: 20px;
 }

 .modal-dialog {
 	margin: 20% auto 0;
 	max-width: 600px;
 	width: calc(100% - 40px);
 }

 .modal-body {
 	position: relative;
 	padding: 15px;
 }

 .modal-footer {
 	padding: 15px;
 	text-align: right;
 	border-top: 1px solid #e5e5e5;
 	display: flex;
 	justify-content: center;
 }

 button.btn-default {
 	width: 80px;
 	border-radius: 25px;
 	margin: 0;
 	padding: 2px;
 }

 .modal-footer .btn+.btn {
 	margin-left: 5px;
 	margin-bottom: 0;
 	margin: 0 auto;
 }

 @media screen and (max-width: 1365px) {}