@charset "utf-8";
#main * { box-sizing: border-box;}
th, td { border: 1px solid #b5b5b5; padding: 10px 12px;}
tbody th, th { vertical-align: middle; background-color: #f0f7fb; text-align: center;}
tbody td, td { vertical-align: middle; text-align: left;}
table .sp { display: none;}
section p, section table, section dl, section ul, section ol, section li { font-size: 1rem;}
section p.lead { font-size: 1.2rem;}
section ul li, section ol li { list-style: none; margin: 0 0 0.5em; padding-left: 1em; text-indent: -1em; line-height: 1.8;}
caption { font-size: 1.2rem;}
thead th { background: #6994c9; color: #fff;}
.flex { display: flex; flex-wrap: wrap;}
#main ul, #main ol { background: none; border: none; padding: 0;}
#main ul li, #main ol li { list-style: none; margin-inline: 0;}
.box01 tbody th { min-width: 12em;}
.box01 td { min-width: 6em;}
.box01 dl.f_bold.flex dt, .box01 dl.f_bold.flex dd { font-weight: bold; font-size: 1.4rem;}
.box01 dl.f_bold.flex dt { margin-right: 1em;}
.box01 .flex > table { width: 48%; margin: 0 0 1em;}
.box01 .flex > table tbody th { width: 15em;}
.box02 ol > li { margin-bottom: 2em; text-indent: 0; padding: 0;}
.box02 ol li > .f_bold { font-size: 1.3rem; background: #f0f7fb; display: inline-block; width: 100%; padding: 0.5em; margin-bottom: 1em;}
.box02 ol .f_bold > span { font-weight: inherit;}
.box02 ol > li dt, .box02 ol > li dd { text-indent: 0;}
.box02 ol > li .img_area { margin-left: 50px;}
.box02 ol > li.flow01 dl { display: flex; flex-wrap: wrap; justify-content: flex-start;}
.box02 ol > li.flow01 dl dt { font-weight: bold; margin-bottom: 1em; width: 100%;}
.box02 ol > li.flow01 dl dd { padding-left: 1em; text-indent: -1em;}
.box02 ol > li.flow01 dl dd:first-of-type { margin-right: 60px;}
.box02 ol > li.flow05 .flex { flex-wrap: wrap; justify-content: space-between; grid-gap: 1em;}
.box02 ol > li.flow05 .flex > dl { /*width: calc( ( 100% - 60px ) / 3 );*/ border: solid 3px #6994c9; border-radius: 20px; overflow: hidden; display: flex; flex-wrap: wrap; align-content: flex-start;}
.box02 ol > li.flow05 .flex > dl dt { background: #6994c9; text-align: center; color: #fff; padding: 0.3em; font-size: 1.2rem; width: 100%;}
.box02 ol > li.flow05 .flex > dl dd { padding: 1em 1em 0.5em; width: 100%;}
.box02 ol > li.flow05 .flex > dl dd:first-of-type { background: #d3e4f8; text-align: center;}
.box02 ol > li.flow05 .flex > dl dd:last-of-type { border-top: dotted 1px #ccc;}
.box02 ol > li.flow05 .flex > dl dd li span { display: inline-block; text-indent: 0;}
.box02 ol > li.flow05 .flex > dl dd .f_bold { font-weight: bold; margin-right: 1em;}
.box02 ol > li.flow05 .memo { width: 66%; margin: 1em 0 0 auto;}
.box02 ol > li.flow05 .memo .indent { padding-left: 1em; text-indent: -1em;}
.box02 ol > li.flow05 .smt { display: none;}
.box02 ol > li.flow06 .txt_area { width: 48%;}
.box02 ol > li.flow06 .img_area { width: calc( 52% - 50px );}
.box03 ol.flow > li { text-indent: 0; padding: 0;}
.box03 ol.flow dt { font-weight: bold; font-size: 1.4rem;}
.box03 .s_type { display: inline-block;line-height: 1; padding: 0.3em 0.8em; background: #6994c9; color: #fff; margin-right: 0.5em; font-weight: normal; font-size: 1rem; vertical-align: middle;}
.box03 ol.flow > li.flow01 { border: solid 3px #0b3c85; background: #f0f7fb; padding: 1em 2em; border-radius: 10px; margin-bottom: 50px;}
.box03 ol.flow > li.flow01 dl { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; font-size: 1.2rem;}
.box03 ol.flow > li.flow01 dt { font-weight: bold; font-size: 120%;}
.box03 ol.flow > li.flow02 { background: #6994c9; padding: 1em 2em; border-radius: 10px;}
.box03 ol.flow > li.flow02 dl { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; color: #fff;}
.box03 ol.flow > li.flow02 dt { font-weight: bold; font-size: 2rem; letter-spacing: 0.2em; margin-right: 1em;}
.box03 ol.flow > li.flow02 dd { width: calc( 100% - 12rem ); max-width: 600px;}
.box03 ol.flow > li.flow03 { column-gap: 1em;}
.box03 ol.flow > li.flow03 dl, .box03 ol.flow > li.flow04 dl { border: solid 3px #0b3c85; background: #f0f7fb; padding: 1.5em 2em; border-radius: 10px;}
.box03 ol.flow > li.flow03 dt, .box03 ol.flow > li.flow04 dt { margin-bottom: 0.6em; text-align: center;}
.box03 ol.flow > li.flow03 ol { margin: 0;}
.box03 ol.flow > li.flow03 .arrow { max-width: 60%;}
.box03 ol.flow > li.flow04 { column-gap: 1em;}
.box03 ol.flow > li.flow04 dl { width: calc( 50% - .5em ); align-content: center;}
.box03 .arrow { position: relative; margin-top: 40px;}
.box03 .arrow::after { content: ""; position: absolute; left: 50%; bottom: calc( 100% - 20px ); transform: translateX( -50% ); width: 0; height: 0; display: block; border: solid 30px transparent; border-top-color: #0b3c85;}
.box03 .arrow_large { background: #0b3c85; width: 10px; margin: 0 auto -30px calc( 24% - 5px );}
.box03 .btn { margin: 2em auto; text-align: center; font-size: 2rem;}
.box03 .btn a { display: inline-block; color: #fff; background: #ff9a3b; padding: 0.5em 2em; border-radius: 10px; text-decoration: none;}
.box03 .btn a:hover { text-decoration: none;}
.box04 ul li { padding-left: 0; text-indent: 0;}
.box04 .pledge { border: solid 1px #ccc; padding: 40px; margin: 1em auto; max-width: 800px;}
.box04 .pledge h4 { font-size: 1.2rem; margin-bottom: 1em;}
.box04 .pledge dt { text-align: center; margin: 2em auto;}
.box04 .agreement { text-align: center; background: #ffffd7; margin-top: 1em; padding: 1.5em; font-size: 1.4rem;}
.box04 .agreement .btn { margin-top: 0.8em;}
.box04 .agreement .btn a { display: inline-block; color: #fff; background: #ff9a3b; padding: 0.5em 2em; border-radius: 5px;}
.box04 .agreement .btn a:hover { text-decoration: none;}
.box05 li { padding-left: 2em; text-indent: -2em;}

@media (max-width: 999px) {
	.box01 tbody th { min-width: 12em;}
	.box03 ol.flow > li.flow03 .arrow { max-width: calc( 100% - 150px );}
	.box03 ol.flow > li.flow03 .arrow::after, .box03 ol.flow > li.flow04 dl.arrow:last-of-type::after { transform: none; right: 50px; left: unset;}
	.box03 .arrow_large { margin: 0 auto -30px 79px;}
	.box03 ol.flow > li.flow04 dl.arrow:first-of-type::after { transform: none; left: 50px;}
}

@media (max-width: 799px) {
	.box01 .flex > table { width: 100%;}
	.box02 ol > li.flow01 dl dd:first-of-type { margin-right: 0;}
	.box02 ol > li.flow05 .flex > dl { width: 100%; margin-bottom: 1em;}
	.box02 ol > li.flow05 .flex > dl dd li span.wide { width: 100%;}
	.box02 ol > li.flow05 .memo { width: 100%; margin: 0 0 auto;}
	.box02 ol > li.flow05 .smt { display: block;}
	.box03 ol.flow > li.flow03 dt .dib, .box03 ol.flow > li.flow04 dt .dib { width: 100%;}
}

@media (max-width: 599px) {
	section p.lead { font-size: 1rem;}
	.box02 ol li > .f_bold { font-size: 1.2rem;}
	.box02 ol > li .img_area { margin-left: 30px;}
	.box02 ol > li.flow06 .txt_area { width: 100%;}
	.box02 ol > li.flow06 .img_area { width: 100%; margin: 0; text-align: center;}
	.box03 ol.flow dt { font-size: 1.2rem;}
	.box03 ol.flow > li.flow01 { padding: 1em;}
	.box03 ol.flow > li.flow01 dl { font-size: 100%;;}
	.box03 ol.flow > li.flow02 { padding: 1em;}
	.box03 ol.flow > li.flow02 dt { font-size: 1.6rem; margin: auto;}
	.box03 ol.flow > li.flow02 dd { width: 100%;}
	.box03 ol.flow > li.flow03 dl, .box03 ol.flow > li.flow04 dl { padding: 1em;}
	.box03 .btn { font-size: 5vw;}
}

@media (max-width: 499px) {
	.box01 > table thead { display: none;}
	.box01 > table tr, .box01 > table th, .box01 > table td { display: block; border: none;}
	.box01 > table tr { border: solid 1px #6994c9; margin-bottom: 10px;}
	.box01 > table .sp { display: block;}
	.box01 > table th { background: #6994c9; color: #fff;}
	.box01 > table td:not(:last-of-type) { border-bottom: dotted 1px #ccc;}
	.box01 > table td br { display: none;}
	.box01 .flex > table th { min-width: unset; max-width: 12em; width: auto;}
	.box03 ol.flow > li.flow03 .arrow { max-width: calc( 100% - 100px );}
	.box03 ol.flow > li.flow04 { flex-direction: column-reverse;}
	.box03 ol.flow > li.flow04 dl { width: 100%;}
	.box03 ol.flow > li.flow04 dl.arrow:last-of-type { max-width: calc( 100% - 100px ); margin-left: auto;}
	.box03 ol.flow > li.flow04 dl.arrow:first-of-type { margin-top: 10px;}
	.box03 .arrow_large { margin: 0 auto -220px 49px;}
	.box03 ol.flow > li.flow04 dl.arrow:first-of-type::after { left: 20px;}
	.box04 .pledge { padding: 2em;}
}

@media (max-width: 399px) {
	caption { font-size: 1rem;}
	.box01 dl.f_bold.flex dt, .box01 dl.f_bold.flex dd { font-size: 1.2rem;}
	.box01 .flex > table th, .box01 .flex > table td { padding: 0 0.5em; font-size: 0.875rem;}
	.box02 ol li > .f_bold { font-size: 1rem;}
	.box04 .pledge { padding: 1.5em;}
	.box04 .pledge h4 { font-size: 1rem;}
	.box04 .agreement { font-size: 1.2rem;}
	.box04 .agreement .btn a { padding: 0.5em; width: 100%;}
}

@media (max-width: 359px) {
	.box03 .arrow_large { margin-bottom: -240px;}
}