/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap");
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-size: 62.5%;
		vertical-align: baseline;
		background: transparent;
}

body {
		line-height: 1;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block;
}

ul {
		list-style: none;
}

blockquote, q {
		quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
		content: '';
		content: none;
}

a {
		margin: 0;
		padding: 0;
		vertical-align: baseline;
		background: transparent;
}

ins {
		background-color: #ff9;
		color: #000;
		text-decoration: none;
}

mark {
		background-color: #ff9;
		color: #000;
		font-style: italic;
		font-weight: bold;
}

del {
		text-decoration: line-through;
}

abbr[title], dfn[title] {
		border-bottom: 1px dotted;
		cursor: help;
}

table {
		border-collapse: collapse;
		border-spacing: 0;
}

hr {
		display: block;
		height: 1px;
		border: 0;
		border-top: 1px solid #cccccc;
		margin: 1em 0;
		padding: 0;
}

input, select {
		vertical-align: middle;
}

html {
		width: 100%;
		height: 100%;
}

* {
		box-sizing: border-box;
}

body {
		font-family: YakuHanJP,'Noto Sans JP', sans-serif;
		position: relative;
		background: #fff;
		width: 100%;
		height: 100%;
		color: #000;
}

img {
		max-width: 100%;
}

a {
		text-decoration: none;
}

.indent {
		padding-left: 1em;
		text-indent: -1em;
}

b {
		font-weight: bold;
}

.pc {
		display: block;
}

.sp {
		display: none;
}

.br-pc {
		display: block;
}

.br-sp {
		display: none;
}

.wrapper {
		width: 100%;
		margin: 0 auto;
		overflow-x: hidden;
}

header {
		width: 100%;
		max-height: 100px;
		background-color: #fff;
		padding: 1.94vw 0;
}

.inner {
		max-width: 900px;
		width: min(900px, 80vw);
		margin: 0 auto;
}

.header_lt {
		display: flex;
		justify-content: space-between;
		align-items: center;
}

.header_logo {
		width: 142px;
		width: min(7.89vw, 142px);
		max-width: 142px;
}

.header_logo img {
		max-width: 100%;
}

.header_id {
		width: 204px;
		font-size: min(1.06vw, 19px);
}

#kv {
		width: 100%;
		height: 1017px;
		background-image: url(../img/kv_bg.png);
		background-repeat: repeat-x;
		background-position: center;
		background-size: auto;
}

#kv .inner {
		position: relative;
}

#kv .inner h1 {
		font-size: 33px;
		font-weight: 700;
		line-height: 1;
		color: #fff;
		position: absolute;
		top: 28px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		white-space: nowrap;
}

#kv .inner h2 {
		font-size: 30px;
		font-weight: 700;
		line-height: 1;
		color: #357ca8;
		position: absolute;
		top: 120px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		white-space: nowrap;
}

#kv .inner h3 {
		font-size: 62px;
		font-weight: 700;
		line-height: 1.3;
		color: #357ca8;
		position: absolute;
		top: 240px;
		left: 0;
		z-index: 10;
}

#kv .inner .kv_img {
		position: absolute;
		top: 180px;
		right: 0;
}

.cp_info {
		position: absolute;
		top: 670px;
		left: 0;
}

.cp_info .cp_info_flex {
		display: flex;
		justify-content: space-between;
		align-items: center;
		flex-wrap: wrap;
		width: 900px;
		margin: 0 auto;
}

.cp_info .cp_info_flex .ttl {
		flex-basis: 205px;
		max-width: 205px;
		background-color: #fff;
		color: #357ca8;
		font-size: 20px;
		text-align: center;
		padding: 10px 0;
		margin-bottom: 20px;
}

.cp_info .cp_info_flex .summary {
		padding-left: 20px;
		flex-basis: 695px;
		max-width: 695px;
		font-size: 20px;
		color: #fff;
		margin-bottom: 20px;
}

.cp_info .cp_info_flex .summary span {
		display: block;
		font-size: 11px;
		line-height: 1;
		margin-top: 5px;
}

.close_info {
		background-color: #6cc0d3;
		text-align: center;
		width: 100%;
		padding: 50px 0;
		font-size: 43px;
		font-weight: 500;
		line-height: 1.5;
		color: #fff;
		margin: -2px auto 0;
}

.s1 {
		padding: 75px 0;
		text-align: center;
		background-color: #f9f9f9;
}

.s1 .s1_flex {
		display: flex;
		justify-content: space-between;
		width: 840px;
		max-width: 100%;
		margin: 0 auto;
}

.s1 .s1_bx {
		flex-basis: 47.6%;
		max-width: 47.6%;
}

.s1 .s1_bx h4 {
		font-size: 34px;
		color: #357ca8;
		font-weight: 700;
		position: relative;
		display: inline;
}

.s1 .s1_bx h4:before {
		content: '';
		position: absolute;
		top: 50%;
		left: -40px;
		display: inline-block;
		width: 34px;
		height: 4px;
		background-color: #357ca8;
		-webkit-transform: rotate(60deg);
		transform: rotate(60deg);
}

.s1 .s1_bx h4:after {
		content: '';
		position: absolute;
		top: 50%;
		right: -40px;
		display: inline-block;
		width: 34px;
		height: 4px;
		background-color: #357ca8;
		-webkit-transform: rotate(-60deg);
		transform: rotate(-60deg);
}

.s1 .s1_bx .image {
		margin: 20px auto 40px;
}

.s1 .s1_bx .btn {
		background-color: #6cc0d3;
		font-size: 20px;
		line-height: 1;
		font-weight: 400;
		border-radius: 5px;
		color: #fff;
		padding: 20px 0;
		width: 100%;
		margin: 0 auto 2.22vw;
		position: relative;
}

.s1 .s1_bx .btn a {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
}

.s1 .s1_bx .btn:after {
		content: "";
		background-image: url(../img/btn_arrow.svg);
		width: 6px;
		height: 14px;
		background-repeat: no-repeat;
		background-size: contain;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		right: 20px;
		transition: 1s;
}

.s1 span {
		font-size: 10px;
}

.s2 {
		padding: 75px 0;
		text-align: center;
		background-color: #fff;
}

.s2 h5 {
		font-size: 23px;
		font-weight: 700;
		color: #fff;
		background-color: #357ca8;
		display: block;
		text-align: center;
		padding: 15px;
}

.s2 ul {
		display: flex;
		flex-direction: column;
		width: 100%;
		margin: 25px auto 50px;
}

.s2 ul .ttl {
		background-color: #8fcee0;
		font-size: 23px;
		font-weight: 500;
		color: #fff;
		line-height: 1;
		padding: 15px 0;
}

.s2 ul .summary {
		background-color: #f3f3f3;
		font-size: 19px;
		font-weight: 400;
		color: #000;
		line-height: 1;
		letter-spacing: 0.1em;
		padding: 20px 0;
}

.s2 ul .summary span {
		font-size: 12px;
		line-height: 1;
		margin: 10px auto 0;
}

.s2 h6 {
		font-size: 23px;
		font-weight: 500;
		line-height: 1.5;
		text-align: left;
		margin: 20px 0;
}

.s2 .step {
		margin: 0 0 50px -18px;
}

.s2 .step img {
		width: 100%;
}

.s2 .caution {
		font-size: 18px;
		line-height: 1;
		text-align: left;
		margin: 0 0 5px;
}

.s2 p {
		font-size: 10px;
		line-height: 1.5;
		text-align: left;
}

.s2 .s2_btn {
		width: 100%;
		margin: 40px auto;
}

.s2 .s2_flow {
		margin: 30px 0 50px -18px;
}

.s2 .s2_flow img {
		width: 100%;
}

.s2 .info {
		text-align: left;
}

.s2 .info p {
		font-size: 16px;
		line-height: 1;
		font-weight: 500;
		margin-bottom: 10px;
}

.s2 .info span {
		font-size: 10px;
		line-height: 1.5;
		font-weight: 400;
}

footer {
		padding: 30px 0;
		text-align: center;
		background-color: #357ca8;
}

footer span {
		font-size: 16px;
		line-height: 1.4;
		color: #fff;
}

@media (max-width: 780px) {
		.pc {
				display: none;
		}
		.sp {
				display: block;
		}
		.br-sp {
				display: block;
		}
		.br-pc {
				display: none;
		}
		header {
				padding: 4.375vw 0;
				width: 100vw;
				margin: 0 auto;
				z-index: 999;
		}
		header .inner {
				max-width: 92vw;
				width: 92vw;
				margin: 0 auto;
		}
		.inner {
				max-width: 100vw;
				width: 100vw;
				margin: 0 auto;
		}
		.header_lt {
				display: flex;
				justify-content: space-between;
				align-items: center;
		}
		.header_logo {
				width: 18.90625vw;
				max-width: 18.90625vw;
		}
		.header_logo img {
				max-width: 100%;
		}
		.header_id {
				width: 30.90625vw;
				max-width: 30.90625vw;
		}
		#kv {
				width: 100%;
				height: auto;
				background-image: url(../img/kv_bg-s.png);
				background-repeat: repeat-x;
				background-position: top;
				background-size: contain;
		}
		#kv .inner {
				position: relative;
				width: 100%;
				height: 300.75vw;
		}
		#kv .inner h1 {
				font-size: 4.375vw;
				font-weight: 700;
				line-height: 1;
				color: #fff;
				position: absolute;
				top: 5.5vw;
				left: 50%;
				transform: translateX(-50%);
				-webkit-transform: translateX(-50%);
				-ms-transform: translateX(-50%);
				white-space: nowrap;
		}
		#kv .inner h2 {
				font-size: 4.79167vw;
				font-weight: 700;
				line-height: 1.5;
				text-align: center;
				color: #357ca8;
				position: absolute;
				top: 20vw;
				left: 50%;
				transform: translateX(-50%);
				-webkit-transform: translateX(-50%);
				-ms-transform: translateX(-50%);
				white-space: nowrap;
		}
		#kv .inner h3 {
				font-size: 8.95833vw;
				font-weight: 700;
				line-height: 1.3;
				letter-spacing: -0.01em;
				color: #fff;
				position: absolute;
				top: 130vw;
				left: 10vw;
				right: 10vw;
				z-index: 10;
		}
		#kv .inner .kv_img {
				position: absolute;
				top: 39vw;
				left: 12vw;
				right: 16vw;
		}
		#kv .inner .kv_img img {
				max-width: 72vw;
		}
		.cp_info {
				position: absolute;
				top: 175vw;
				left: 10vw;
		}
		.cp_info .cp_info_flex {
				display: flex;
				justify-content: space-between;
				align-items: center;
				flex-wrap: wrap;
				width: 84vw;
				margin: 0 auto;
		}
		.cp_info .cp_info_flex .ttl {
				flex-basis: 100%;
				max-width: 100%;
				background-color: #fff;
				color: #357ca8;
				font-size: 3.95833vw;
				text-align: center;
				padding: 2vw 0;
				margin-bottom: 4vw;
		}
		.cp_info .cp_info_flex .summary {
				padding-left: 2vw;
				flex-basis: 100%;
				max-width: 100%;
				font-size: 3.33333vw;
				line-height: 1.5;
				color: #fff;
				margin-bottom: 4vw;
		}
		.cp_info .cp_info_flex .summary span {
				display: block;
				font-size: 1.875vw;
				line-height: 1.5;
				margin-top: 2vw;
		}
		.close_info {
				background-color: #6cc0d3;
				text-align: center;
				width: 100%;
				padding: 8vw 0;
				font-size: 4.16667vw;
				font-weight: 500;
				line-height: 1.5;
				color: #fff;
				margin: -2px auto 0;
		}
		.s1 {
				padding: 10vw 0 0;
				text-align: center;
				background-color: #f9f9f9;
		}
		.s1 .s1_flex {
				display: flex;
				justify-content: space-between;
				flex-direction: column;
				flex-wrap: wrap;
				width: 84vw;
				max-width: 100%;
				margin: 0 auto;
		}
		.s1 .s1_bx {
				flex-basis: 100%;
				max-width: 100%;
				margin-bottom: 10vw;
		}
		.s1 .s1_bx h4 {
				font-size: 7.08333vw;
				color: #357ca8;
				font-weight: 700;
				position: relative;
				display: inline;
		}
		.s1 .s1_bx h4:before {
				content: '';
				position: absolute;
				top: 50%;
				left: -8vw;
				display: inline-block;
				width: 7.08333vw;
				height: 0.83333vw;
				background-color: #357ca8;
				-webkit-transform: rotate(60deg);
				transform: rotate(60deg);
		}
		.s1 .s1_bx h4:after {
				content: '';
				position: absolute;
				top: 50%;
				right: -8vw;
				display: inline-block;
				width: 7.08333vw;
				height: 0.83333vw;
				background-color: #357ca8;
				-webkit-transform: rotate(-60deg);
				transform: rotate(-60deg);
		}
		.s1 .s1_bx .image {
				margin: 5vw auto;
		}
		.s1 .s1_bx .btn {
				background-color: #6cc0d3;
				font-size: 4.16667vw;
				line-height: 1;
				font-weight: 400;
				border-radius: 5px;
				color: #fff;
				padding: 5vw 0;
				width: 100%;
				margin: 0 auto 2.22vw;
				position: relative;
		}
		.s1 .s1_bx .btn a {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
		}
		.s1 .s1_bx .btn:after {
				content: "";
				background-image: url(../img/btn_arrow.svg);
				width: 1.25vw;
				height: 2.91667vw;
				background-repeat: no-repeat;
				background-size: contain;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				-webkit-transform: translateY(-50%);
				-ms-transform: translateY(-50%);
				right: 3vw;
				transition: 1s;
		}
		.s1 span {
				font-size: 10px;
		}
		.s2 {
				padding: 10vw 0;
				text-align: center;
				background-color: #fff;
		}
		.s2 h5 {
				font-size: 4.79167vw;
				font-weight: 700;
				color: #fff;
				background-color: #357ca8;
				display: block;
				text-align: center;
				padding: 3.5vw;
				width: 84vw;
				margin: 0 auto;
		}
		.s2 ul {
				display: flex;
				flex-direction: column;
				width: 84vw;
				margin: 5vw auto 10vw;
		}
		.s2 ul .ttl {
				background-color: #8fcee0;
				font-size: 3.54167vw;
				font-weight: 500;
				color: #fff;
				line-height: 1;
				padding: 3vw 0;
		}
		.s2 ul .summary {
				background-color: #f3f3f3;
				font-size: 2.70833vw;
				font-weight: 400;
				color: #000;
				letter-spacing: 0;
				line-height: 1;
				padding: 5vw 0;
		}
		.s2 ul .summary span {
				font-size: 2.29167vw;
				line-height: 1;
				margin: 1vw auto 0;
				display: block;
		}
		.s2 h6 {
				font-size: 2.91667vw;
				font-weight: 500;
				line-height: 1.5;
				text-align: left;
				margin: 3vw 8vw 5vw;
		}
		.s2 .step {
				margin: 0 8vw 10vw 4vw;
		}
		.s2 .step img {
				width: 100%;
		}
		.s2 .caution {
				font-size: 3.33333vw;
				line-height: 1;
				text-align: left;
				margin: 0 8vw 1vw;
		}
		.s2 p {
				font-size: 2.08333vw;
				line-height: 1.3;
				text-align: left;
				margin: 0 8vw 1vw;
		}
		.s2 .s2_btn {
				width: 84vw;
				margin: 10vw auto;
		}
		.s2 .s2_flow {
				margin: 5vw 10vw 10vw 5vw;
		}
		.s2 .s2_flow img {
				width: 100%;
		}
		.s2 .info {
				text-align: left;
				margin: 0 8vw 0;
		}
		.s2 .info p {
				font-size: 3.54167vw;
				line-height: 1;
				font-weight: 500;
				margin: 0 0 2vw 0;
		}
		.s2 .info span {
				font-size: 2.91667vw;
				line-height: 1.6;
				font-weight: 400;
		}
		footer {
				padding: 3vw 0;
				text-align: center;
				background-color: #357ca8;
		}
		footer span {
				font-size: 3.33333vw;
				line-height: 1.4;
				color: #fff;
		}
}
