@charset "UTF-8";
/*** ★" ***/

/*[ Base Sectioning ]----------------------------------------------------------------*/

/*:: Body ::*/





/*[ Documents Style ]----------------------------------------------------------------*/

/*:: Document ::*/
html {
	position: relative;
	background-color: white;
	background-image: url(/assets/img/bg_body_start.jpg);
	background-repeat: no-repeat;
	background-position: top right;
	background-size: 100% auto;
}


/*:: Body ::*/
body {
	position: relative;
	height: auto;
	background-image: url(/assets/img/bg_body_end.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	background-size: 100% auto;
}


/*[ UI Style ]----------------------------------------------------------------*/

/*:: Link ::*/
	a[href],
	button,
	input[type="submit"]{
		display: inline-block;
		transform: scale(1);
		transition: transform 0.3s, background 0.3s;
	}
	a[href]:hover,
	button:hover,
	input[type="submit"]:hover{
		transform: scale(1.05);
		transition: transform 0.2s, background 0.2s;
	}
	a[href]:active,
	button:active,
	input[type="submit"]:active{
		transform: scale(0.95);
		transition: transform 0.1s, background 0.1s;
	}

/*:: Button ::*/
	menu[data-type="button"] a[href]{
		position: relative;
		display: inline-flex;
		justify-content: space-between;
		align-items: center;
		background: linear-gradient(90deg, #4F8BCA, #193B7D);
		width: 100%;
		max-width: 360px;
		min-width: 256px;
		word-break: keep-all;
		height: 60px;
		border-radius: 30px;
		padding: 0.25rem 1.5rem;
		color: white;
		font-size: 1.25rem;
		line-height: 1;
		font-family: 'Noto Sans JP', sans-serif;
	}
		menu[data-type="button"] a[href]::before{
			position: absolute;
			top: calc(50% - 1.5rem / 2);
			right: 1.5rem;
			font-family: 'Material Symbols Rounded';
			content: '\e5c8';
			font-size: 1.5rem;
		}
@media screen and (max-width: 768px) {
	menu[data-type="button"] a[href]{
		max-width: 260px;
		min-width: 260px;
		height: 48px;
		border-radius: 24px;
		padding: 0.25rem 1rem;
		font-size: 1rem;
	}
}

@media screen and (max-width: 480px) {
	menu[data-type="button"] a[href]{
		min-width: 240px;
	}
}



  [data-module="modalDialog"]{
		overflow: scroll;
		position: fixed;
    z-index: 5000;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;

		width: 100vw;
		height: 100vh;
		margin: 0;
    display: grid;
    place-items: center;
  }
  [data-module="modalDialog"][aria-hidden="true"]{
    display: none;
  }
	[data-module="modalDialog"][aria-modal="true"]{
		display: grid;
		place-items: center;
	}

		[data-module="modalDialog"] > [data-command="close"]{
      -webkit-appearance: none;
			position: fixed;
			z-index: 5000;
			top: 0;
			right: 0;
			bottom: 0;
			left: 0;
	
			width: 100vw;
			height: 100vh;
			margin: 0;
			background: rgba(0,55,129,0.8);
      border: none;
      padding: 0;
		}

    [data-module="modalDialog"] > [data-module="modalContents"]{
      position: relative;
      z-index: 5001;
      background: rgba(255,255,255,0.9);
      box-shadow: 0 0 0.5rem rgba(0,0,0,0.33);
      padding: 2em;
      margin: 2rem 1rem 2rem 1rem;
      max-height: calc(100vh - 4rem);
      max-width: 768px;
      overflow: scroll;
			border-radius: 0.5rem;
    }
@media only screen and (max-width: 768px){
	[data-module="modalDialog"] {
		height: auto;
	}
    [data-module="modalDialog"] > [data-module="modalContents"]{
      padding: 1em;
      margin: 1rem 1rem 1rem 1rem;
      max-height: calc(100vh - 2rem);
    }
  
}
















/*[Section]----------------------------------------------------------------*/

/*:: Global Footer ::*/
	#globalFooter{
		width: 100%;
		margin: 10rem 0 0 0;
	}

	#globalFooter > div{
		display: flex;
		justify-content: center;
		align-items: stretch;
		width: 100%;
		padding: 8rem 2rem;
		border: 1px solid #CCE2EE;
		background: rgba(255,255,255,0.6);
		box-shadow: 0 0 6px rgba(0,0,0,0.16);
	}
@media screen and (max-width: 1080px) {
	#globalFooter > div{
		padding: 6rem 2rem;
	}
}
@media screen and (max-width: 960px) {
	#globalFooter > div{
		padding: 4rem 2rem;
	}
}
@media screen and (max-width: 768px) {
	#globalFooter > div{
		flex-direction: column;
		padding: 0;
		border: none;
		background: none;
		box-shadow: none;
		background-image: url(/assets/img/bg_body_end.jpg);
		background-repeat: no-repeat;
		background-position: bottom left;
		background-size: 100% auto;
	}
		#globalFooter > div > *{
			margin: 0 auto;
			width: auto;
		}

}




		#globalFooter > div > address{
		}
			#globalFooter > div > address > dl{
				display: grid;
				grid-template-areas: 
					"logo name"
					"logo info"
					"logo contact";
				grid-template-columns: repeat(2, 1fr);
				column-gap: 5rem;
				grid-template-rows: repeat(3, auto);
				row-gap: 1.5rem;
			}
@media screen and (max-width: 1080px) {
			#globalFooter > div > address > dl{
				grid-template-areas: 
					"logo name"
					"logo contact"
					"info info";
				grid-template-columns: repeat(2, auto);
				column-gap: 3rem;
				grid-template-rows: repeat(3, auto);
				row-gap: 2rem;
			}
}
@media screen and (max-width: 960px) {
			#globalFooter > div > address > dl{
				grid-template-areas: 
					"logo"
					"name"
					"info"
					"contact";
				grid-template-columns: 1fr;
				column-gap: 0;
				grid-template-rows: repeat(4, auto);
				row-gap: 1rem;
			}
}
@media screen and (max-width: 768px) {
			#globalFooter > div > address > dl{
				place-items: center;
			}
}

			
				#globalFooter > div > address > dl [itemprop="name"]{
					grid-area: name;
					font-family: 'Noto Sans JP', sans-serif;
				}
					#globalFooter > div > address > dl [itemprop="name"] > b{
						display: block;
						font-size: 1.25em;
						font-weight: 500;
						word-break: keep-all;
						}
					#globalFooter > div > address > dl [itemprop="name"] > i{
						display: block;
						font-size: 0.8em;
						font-weight: 500;
						word-break: keep-all;
					}
@media screen and (max-width: 960px) {
					#globalFooter > div > address > dl [itemprop="name"] > b{
						font-size: 1.1em;
						}
					#globalFooter > div > address > dl [itemprop="name"] > i{
						font-size: 0.75em;
					}
}


				#globalFooter > div > address > dl [itemprop="info"]{
					grid-area: info;
				}
					#globalFooter > div > address > dl [itemprop="info"] > dl{
						display: grid;
						grid-template-columns: 4.5rem auto;
						column-gap: 1.5rem;
						grid-template-rows: 1fr;
						row-gap: 0;
						align-items: center;
					}
@media screen and (max-width: 768px) {
					#globalFooter > div > address > dl [itemprop="info"] > dl{
						grid-template-columns: 1fr;
						column-gap: 0;
						grid-template-rows: repeat(2, auto);
						row-gap: 0;
						align-items: center;
					}
					#globalFooter > div > address > dl [itemprop="info"] > dl + dl{
						margin: 0.5rem 0 0 0;
					}

}

						#globalFooter > div > address > dl [itemprop="info"] > dl > dt{
							font-size: 1em;
							font-weight: 400;
							word-break: keep-all;
						}
						#globalFooter > div > address > dl [itemprop="info"] > dl > dd{
							font-size: 1em;
							font-weight: 400;
							word-break: keep-all;
						}
							#globalFooter > div > address > dl [itemprop="info"] > dl > dd > b{
								font-size: 1.5em;
								font-weight: 400;
							}
@media screen and (max-width: 960px) {
						#globalFooter > div > address > dl [itemprop="info"] > dl > dt{
							font-size: 0.9em;
						}
						#globalFooter > div > address > dl [itemprop="info"] > dl > dd{
							font-size: 0.9em;
							font-weight: 400;
							word-break: keep-all;
						}
							#globalFooter > div > address > dl [itemprop="info"] > dl > dd > b{
								font-size: 1.4em;
								font-weight: 400;
							}
}




				#globalFooter > div > address > dl [itemprop="logo"]{
					grid-area: logo;
				}
					#globalFooter > div > address > dl [itemprop="logo"] img{
						width: 100%;
						min-width: 256px;
					}
@media screen and (max-width: 1080px) {
					#globalFooter > div > address > dl [itemprop="logo"] img{
						max-width: 256px;
					}
}



				#globalFooter > div > address > dl [itemprop="contact"]{
					grid-area: contact;
				}



		#globalFooter > div > nav{
			margin: 0 0 0 5rem;
		}
@media screen and (max-width: 1080px) {
		#globalFooter > div > nav{
			margin: 0 0 0 4rem;
		}
}
@media screen and (max-width: 960px) {
		#globalFooter > div > nav{
			margin: 0 0 0 3rem;
		}
}
@media screen and (max-width: 768px) {
		#globalFooter > div > nav{
			margin: 4rem 0 0 0;
		}
}

			#globalFooter > div > nav > ul{
				
			}
				#globalFooter > div > nav > ul > li{
					
				}
				#globalFooter > div > nav > ul > li + li{
					margin: 0.8rem 0 0 0;
				}
					#globalFooter > div > nav > ul > li > a{
						font-family: 'Noto Sans JP', sans-serif;
						word-break: keep-all;
						letter-spacing: 0;
					}
@media screen and (max-width: 768px) {
				#globalFooter > div > nav > ul{
					border-top: 1px solid #9CA6B4; 
				}
				#globalFooter > div > nav > ul > li + li{
					margin: 0;
					border-top: 1px solid #9CA6B4; 
				}
					#globalFooter > div > nav > ul > li > a{
						display: block;
						padding: 0.75rem 1rem;
						text-align: center;
						font-family: 'Noto Serif JP', serif;
					}
	
}




	#globalFooter > nav{
		width: 100%;
		margin: 3.5rem 0 0 0;
		padding: 2.5rem 2rem;
		background: #003781;
	}
@media screen and (max-width: 768px) {
	#globalFooter > nav{
		margin: 0;
	}
}

		#globalFooter > nav > dl{
			display: flex;
			justify-content: center;
			align-items: center;
		}
@media screen and (max-width: 1080px) {
		#globalFooter > nav > dl{
			display: grid;
			grid-template-areas: 
				"title"
				"contents";
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: repeat(2, auto);
			row-gap: 2rem;
		}
}

			#globalFooter > nav > dl > dt{
				grid-area: title;
				font-size: 20px;
				font-weight: 500;
				line-height: 1;
				color: white;
				text-align: center;
				word-break: keep-all;
				font-family: 'Noto Sans JP', sans-serif;
			}
			#globalFooter > nav > dl > dd{
				grid-area: contents;
			}
				#globalFooter > nav > dl > dd > ul{
					display: grid;
					grid-template-columns: repeat(4, 1fr);
					column-gap: 1rem;
					row-gap: 0;
					margin: 0 0 0 2rem;
				}
					#globalFooter > nav > dl > dd > ul > li{
					}
@media screen and (max-width: 1080px) {
}
@media screen and (max-width: 960px) {
				#globalFooter > nav > dl > dd > ul{
					grid-template-columns: repeat(2, 1fr);
					column-gap: 1rem;
					row-gap: 1rem;
					margin: 0;
				}
}
@media screen and (max-width: 640px) {
				#globalFooter > nav > dl > dd > ul{
					grid-template-columns: 1fr;
					column-gap: 0;
					row-gap: 1rem;
				}
}

						#globalFooter > nav > dl > dd > ul > li > a{
							display: flex;
							justify-content: center;
							align-items: center;
							width: 100%;
							height: 100%;
							border: 1px solid white;
							padding: 1.5rem 1rem;
							background: #003781;
							box-shadow: 10px 10px 6px rgba(0,0,0,0.16);
							color: white;
							line-height: 1;
							text-align: center;
							word-break: keep-all;
							font-family: 'Noto Sans JP', sans-serif;
						}
							#globalFooter > nav > dl > dd > ul > li > a::before{
								font-family: 'Material Symbols Rounded';
								content: '\e5e1';
								font-size: 1.5rem;
								display: inline-block;
								margin: 0 0.5rem 0 0;
							}
@media screen and (max-width: 640px) {
						#globalFooter > nav > dl > dd > ul > li > a{
							padding: 1rem 1rem;
						}
}



	


	#globalFooter > small{
		display: block;
		width: 100%;
		padding: 1.75rem 2rem;
		background: linear-gradient(180deg, #648CC6, #193B7D);
		color: white;
		font-size: 1rem;
		line-height: 1;
		text-align: center;
	}
@media screen and (max-width: 768px) {
	#globalFooter > small{
		padding: 1rem 1rem;
		font-size: 0.8em;
	}
}








/*:: Global Header ::*/
	#globalHeader {
		position: sticky;
		z-index: 1001;
		top: 0;
		left: 0;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		line-height: 1;
		padding: 1rem 2rem;
	}
@media screen and (max-width: 768px) {
	#globalHeader {
		padding: 1rem 1.5rem;
	}
}
@media screen and (max-width: 480px) {

}

	#globalHeader [itemprop="logo"]{
		transition: height 0.1s;
		height: 128px;
		display: block;
	}
@media screen and (max-width: 768px) {
	#globalHeader [itemprop="logo"]{
		height: 80px;
	}
}
@media screen and (max-width: 480px) {
	#globalHeader [itemprop="logo"]{
		height: 64px;
	}
}


	#actionSiteNavi{
		height: 100%;
	}
		#actionSiteNavi button{
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			height: 100%;
			width: 64px;
		}
			#actionSiteNavi button > span{
				font-family: 'Noto Sans JP', sans-serif;
				display: inline-block;
				margin: 0;
			}
			#actionSiteNavi button > i{
				font-size: 3rem;
			}


	#SiteNavigation{
		
	}
		#SiteNavigation > * > ul{
			
		}
			#SiteNavigation > * > ul > li{
				
			}
			#SiteNavigation > * > ul > li + li{
				border-top: 1px solid rgba(0,55,129,0.25);
			}
				#SiteNavigation > * > ul > li > a{
					display: grid;
					place-items: center;
					padding: 1.5rem 0.5rem;
					font-family: 'Noto Sans JP', sans-serif;
				}


		#SiteNavigation > * > menu{
			margin: 1rem auto;
		}
















/*:: Main Contents ::*/
	main{
		
	}

		main > section{
			
		}
			main > section > section{
				max-width: 1280px;
				margin: 0 auto;
				padding: 0 2rem;
			}


	body.index{
			background-image: url(/assets/img/deco_index.png);
			background-repeat: no-repeat;
			background-position: right -3rem top 6rem;
			background-size: 66%;
			overflow: hidden;
	}
		body.index > main{
		}
			body.index > main > section{
				
			}
				body.index > main > section > header{
					position: relative;
					max-width: 1280px;
					margin: 0 auto;
					display: flex;
					flex-direction: column;
					min-height: 480px;
					padding: 2rem;
					align-self: center;
					justify-content: center;
				}
					body.index > main > section > header::before{
						position: absolute;
						bottom: -6rem;
						right: -4rem;
						content: '';
						display: block;
						width: 33%;
						height: 312px;
						background-image: url(/assets/img/deco_index_header.png);
						background-repeat: no-repeat;
						background-size: contain;
						background-position: right bottom;
				}
					body.index > main > section > header > h1{
					}
						body.index > main > section > header > h1 > b{
								border: 0;
								clip: rect(0 0 0 0);
								height: 1px;
								margin: -1px;
								overflow: hidden;
								padding: 0;
								position: absolute;
								white-space: nowrap;
								width: 1px;
						}
						body.index > main > section > header > h1 > i{
							font-family: 'Noto Serif JP', serif;
							color: rgba(0,55,129,0.5);
							font-size: 2.5em;
							font-weight: 600;
							letter-spacing: 0.1em;
						}
					body.index > main > section > header > p{
						margin: 3rem auto 0 0;
						max-width:768px;
					}
@media screen and (max-width: 1280px) {
					body.index > main > section > header::before{
						bottom: -6rem;
						right: -4rem;
						width: 30%;
				}
}

@media screen and (max-width: 960px) {
	body.index{
			background-position: right -2rem top 8rem;
			background-size: 75%;
	}

						body.index > main > section > header > h1 > i{
							font-size: 2em;
						}
					body.index > main > section > header > p{
						margin: 3rem auto 0 0;
						max-width:640px;
					}
}
@media screen and (max-width: 768px) {
	body.index{
			background-position: right -2rem top 6rem;
			background-size: 80%;
	}
					body.index > main > section > header::before{
						bottom: -5rem;
						right: -3rem;
						width: 40%;
				}

						body.index > main > section > header > h1 > i{
							font-size: 1.5em;
						}
					body.index > main > section > header > p{
						margin: 2rem auto 0 0;
						max-width:512px;
					}
}
@media screen and (max-width: 640px) {
				body.index > main > section > header{
					min-height: 320px;
				}
}
					body.index > main > section > header::before{
						bottom: -10rem;
						right: -2rem;
						width: 40%;
				}

@media screen and (max-width: 480px) {
				body.index > main > section > header{
					min-height: 240px;
				}
					body.index > main > section > header::before{
						bottom: -7rem;
						right: -2rem;
						width: 40%;
				}
						body.index > main > section > header > h1 > i{
							font-size: 1.25em;
						}
					body.index > main > section > header > p{
						margin: 1.5rem auto 0 0;
						max-width:312px;
					}
}




	body.index > main > section > section{
		padding: 5rem 2rem;
	}
		body.index > main > section > section > header,
		body.index > main > section > section > div > header{
			margin: 0 0 3.5rem 0;
		}
			body.index > main > section > section header > h2{
				display: flex;
				flex-direction: column;
			}
				body.index > main > section > section header > h2 > b{
					order: 2;
					font-size: 3em;
					font-weight: 500;
					margin: 0.75rem 0 0 0;
					word-break: keep-all;
				}
				body.index > main > section > section header > h2 > i{
					order: 1;
					color: rgba(0,55,129,0.5);
					font-size: 1.5em;
					font-weight: 500;
				}
	body.index > main > section > section > p{
		font-size: 1.1em;
		line-height: 2;
	}
@media screen and (max-width: 960px) {
				body.index > main > section > section header > h2 > b{
					font-size: 2.5em;
				}
				body.index > main > section > section header > h2 > i{
					font-size: 1.25em;
				}
	body.index > main > section > section > p{
			font-size: 1.1em;
		}
}
@media screen and (max-width: 768px) {
				body.index > main > section > section header > h2 > b{
					font-size: 2.25em;
				}
				body.index > main > section > section header > h2 > i{
					font-size: 1.215em;
				}
	body.index > main > section > section > p{
		font-size: 1.05em;
	}
}
@media screen and (max-width: 640px) {
				body.index > main > section > section header > h2 > b{
					font-size: 2em;
				}
				body.index > main > section > section header > h2 > i{
					font-size: 1em;
				}
	body.index > main > section > section > p{
		font-size: 1em;
	}
}
@media screen and (max-width: 640px) {
				body.index > main > section > section header > h2 > b{
					font-size: 2em;
				}
				body.index > main > section > section header > h2 > i{
					font-size: 0.95em;
				}
	body.index > main > section > section > p{
		font-size: 1em;
	}
}





	.index #intro{
		margin: 0 auto;
		display: grid;
		grid-template-areas: 
			"deco title"
			"deco text";
		grid-template-columns: 2fr 3fr;
		column-gap: 2rem;
		grid-template-rows: repeat(2, auto);
		row-gap: 0;
	}
		.index #intro > figure{
			grid-area: deco;
			margin-left: -7.5rem;
		}
		.index #intro > header{
			grid-area: title;
		}
			.index #intro > header > h2{
				
			}
				.index #intro > header > h2 > b{
					font-size: 2.5em;
				}
				.index #intro > header > h2 > i{
					
				}
		.index #intro > div{
			grid-area: text;
		}
		.index #intro > div > p{
			font-size: 1.2em;
		}
@media screen and (max-width: 1440px) {
		.index #intro > figure{
			margin-left: -5rem;
		}
}
@media screen and (max-width: 1280px) {
		.index #intro > figure{
			margin-left: -2.5rem;
		}
}
@media screen and (max-width: 960px) {
		.index #intro > figure{
			margin-left: 0;
		}
				.index #intro > header > h2 > b{
					font-size: 2.25em;
				}
		.index #intro > div > p{
			font-size: 1.2em;
		}
}
@media screen and (max-width: 768px) {
	.index #intro{
		grid-template-areas: 
			"deco"
			"title"
			"text";
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(3, auto);
		row-gap: 0;
	}
		.index #intro > figure > img{
			width: 50%;
			margin: 0 auto 2rem 0;
		}

				.index #intro > header > h2 > b{
					font-size: 2.125em;
				}
		.index #intro > div > p{
			font-size: 1.1em;
		}
}
@media screen and (max-width: 640px) {
				.index #intro > header > h2 > b{
					font-size: 2em;
				}
		.index #intro > div > p{
			font-size: 1.05em;
		}
}





	.index #kango{
		background-image: 
			url(/assets/img/deco_kango.png),
			linear-gradient(to bottom, #E0F1F7, white);
		background-repeat: no-repeat;
		background-position: 
			right top,
			center top 4rem;
		background-size: 
			40%,
			100% calc(100% - 8rem);
		padding-top: 8rem;
		padding-right: calc((100vw - 1200px) / 2); 
		padding-left: calc((100vw - 1200px) / 2); 
		max-width: none;
		display: grid;
		grid-template-areas: 
			"title title"
			"text menu";
		grid-template-columns: repeat(2, auto);
		column-gap: 5rem;
		grid-template-rows: repeat(2, auto);
		row-gap: 0;
	}
		.index #kango > header{
			grid-area: title;
		}
		.index #kango > p{
			grid-area: text;
		}
		.index #kango > menu{
			grid-area: menu;
			align-self: end;
		}
@media screen and (max-width: 1280px) {
	.index #kango{
		padding-right: 2rem; 
		padding-left: 2rem; 
	}
@media screen and (max-width: 960px) {
	.index #kango{
		column-gap: 4rem;
	}
}
@media screen and (max-width: 768px) {
	.index #kango{
		grid-template-areas: 
			"title"
			"text"
			"menu";
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(3, auto);
		row-gap: 0;
	}
		.index #kango > menu{
			margin: 3rem 0 0 0;
			justify-self: center;
		}
}

	
	.index #area{
		background: url(/assets/img/bg_area.jpg) no-repeat center center;
		background-size: cover;
		padding-right: calc((100vw - 1200px) / 2); 
		padding-left: calc((100vw - 1200px) / 2); 
		max-width: none;
	}
		.index #area > div{
			background-color: rgba(255,255,255,0.6);
			box-shadow: 0 0 30px #E0F1F7;
			display: grid;
			grid-template-areas: 
				"deco title menu"
				"deco text menu";
			grid-template-columns: 2fr 4fr 3fr;
			column-gap: 5rem;
			grid-template-rows: repeat(2, auto);
			row-gap: 0;
			padding: 5rem 5rem 5rem 0;
		}
			.index #area > div > figure{
				grid-area: deco;
			}
			.index #area > div > header{
				grid-area: title;
			}
			.index #area > div > p{
				grid-area: text;
			}
			.index #area > div > menu{
				grid-area: menu;
				align-self: end;
			}
				.index #area > div > menu > li + li{
					margin-top: 3rem
				}

@media screen and (max-width: 1280px) {
	.index #area{
		padding-right: 2rem; 
		padding-left: 2rem; 
	}
		.index #area > div{
			column-gap: 2rem;
			padding: 4rem 4rem 4rem 0;
		}

}

@media screen and (max-width: 960px) {
		.index #area > div{
			column-gap: 2rem;
			padding: 4rem 3rem 4rem 0;
			grid-template-columns: 2fr 3fr 2fr;
		}
}
@media screen and (max-width: 880px) {
		.index #area > div{
			grid-template-areas: 
				"deco title"
				"text text"
				"menu menu";
			grid-template-columns: auto 1fr;
			column-gap: 0;
			grid-template-rows: repeat(3, auto);
			row-gap: 0;
			padding: 3rem 2rem;
		}
			.index #area > div > figure{
				max-width: 200px;
				min-width: 96px;
				margin: -2rem 0 0 -2rem;
			}

			.index #area > div > menu{
				margin: 3rem 0 0 0;
				justify-self: center;
			}
			.index #area > div > menu a{
			}
}
@media screen and (max-width: 480px) {
		.index #area > div{
			padding: 2.5rem 1.5rem;
		}
			.index #area > div > menu{
				margin: 2.5rem 0 0 0;
			}
			.index #area > div > menu a{
				min-width: 200px;
			}
	
}



	.index #about{
		position: relative;
		display: grid;
		grid-template-areas: 
			"title title"
			"staff company";
		grid-template-columns: repeat(2, 1fr);
		column-gap: 5rem;
		grid-template-rows: repeat(2, auto);
		row-gap: 0;
		background: 
			linear-gradient(to bottom, #E0F1F7, white) 
			no-repeat center top 18rem;
		background-size: 100% calc(100% - 20rem);
		padding-right: calc((100vw - 1200px) / 2); 
		padding-left: calc((100vw - 1200px) / 2); 
		max-width: none;
	}
		.index #about > header{
			grid-area: title;
		}
		.index #about > figure{
			position: absolute;
			display: inline-block;
			width: 20%;
			right: 0;
			top: 4rem;
		}

		.index #about > section{
			display: grid;
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: auto 1fr auto;
			row-gap: 2rem;
			background: rgba(255,255,255,0.6);
			box-shadow: 0 0 30px #E0F1F7;
			padding: 4.5rem 5em;
		}
		.index #staff{
			grid-area: staff;
		}
		.index #company{
			grid-area: company;
		}
			.index #about > section > header{
			}
				.index #about > section > header > h3{
					font-size: 2rem;
				}
@media screen and (max-width: 1280px) {
	.index #about{
		column-gap: 3rem;
		padding-right: 2rem;
		padding-left: 2rem;
	}
		.index #about > section{
			padding: 4rem 3em;
		}
}

@media screen and (max-width: 960px) {
	.index #about{
		column-gap: 2rem;
	}
		.index #about > section{
			padding: 4rem 2em;
		}
				.index #about > section > header > h3{
					font-size: 1.75rem;
				}	
}
@media screen and (max-width: 768px) {
	.index #about{
		grid-template-areas: 
			"title"
			"staff"
			"company";
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(3, auto);
		row-gap: 2.5rem;
		padding-right: 1rem;
		padding-left: 1rem;
	}
		.index #about > figure{
			width: 33%;
			right: 0;
			top: 8rem;
		}
		.index #about > section{
			padding: 4rem 4em;
		}
				.index #about > section > header > h3{
					font-size: 1.5rem;
				}	
		.index #about > section > menu{
			justify-self: center;
		}

}
@media screen and (max-width: 640px) {
	.index #about{
		column-gap: 2rem;
	}
		.index #about > section{
			padding: 3rem 3em;
		}
				.index #about > section > header > h3{
					font-size: 1.5rem;
				}	
}
@media screen and (max-width: 480px) {
	.index #about{
		column-gap: 1.5rem;
	}
		.index #about > figure{
			width: 33%;
			right: 0;
			top: 10rem;
		}
		.index #about > section{
			padding: 3rem 1.5em;
		}
				.index #about > section > header > h3{
					font-size: 1.44rem;
				}	
}



	.index #contact{
	}
		.index #contact > div{
			position: relative;
			background: rgba(255,255,255,0.6);
			box-shadow: 0 0 30px #E0F1F7;
			display: grid;
			grid-template-areas: 
				"voice text"
				"voice menu";
			grid-template-columns: 3fr 2fr;
			column-gap: 5rem;
			grid-template-rows: repeat(2, auto);
			row-gap: 3rem;
			padding: 5rem 5rem 5rem 0;
		}
			.index #contact > div > figure{
				grid-area: voice;
			}
				.index #contact > div > figure > img{
					margin: 2rem 0 0 3rem;
				}
				.index #contact > div > figure > ul{
					margin-top: -2rem;
				}
					.index #contact > div > figure > ul > li{
						display: inline-block;
						background: rgba(246,222,227,0.6);
						padding: 0.5rem 1rem 0.5rem 4rem;
						font-size: 1.25em;
						font-weight: 600;
						word-break: keep-all;
					}
					.index #contact > div > figure > ul > li + li{
						margin: 1.25rem 0 0 0;
					}
			.index #contact > div > p{
				grid-area: text;
			}
			.index #contact > div > menu{
				grid-area: menu;
				justify-self: center;
			}
@media screen and (max-width: 960px) {
		.index #contact > div{
			column-gap: 4rem;
			row-gap: 3rem;
			padding: 4rem 4rem 4rem 0;
		}	
				.index #contact > div > figure > img{
					margin: 2rem 0 0 2rem;
				}
				.index #contact > div > figure > ul{
					margin-top: -1.5rem;
				}
					.index #contact > div > figure > ul > li{
						padding: 0.5rem 1rem 0.5rem 3.5rem;
						font-size: 1.1em;
					}
}
@media screen and (max-width: 768px) {
		.index #contact > div{
			column-gap: 3rem;
			row-gap: 2rem;
			padding: 3rem 3rem 3rem 0;
		}	
				.index #contact > div > figure > img{
					margin: 2rem 0 0 1rem;
				}
				.index #contact > div > figure > ul{
					margin-top: -1rem;
				}
					.index #contact > div > figure > ul > li{
						padding: 0.5rem 1rem 0.5rem 1rem;
						font-size: 1.1em;
					}
}
@media screen and (max-width: 640px) {
		.index #contact > div{
			grid-template-areas: 
				"voice"
				"text"
				"menu";
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: repeat(3, auto);
			row-gap: 2rem;
			padding: 3rem;
		}	
				.index #contact > div > figure > img{
					margin: 1rem 0 -2rem 0;
				}
				.index #contact > div > figure > ul{
					position: relative;
					max-width: none;
					top: auto;
					left: auto;
					margin: 0 0 0 -3rem;
				}
					.index #contact > div > figure > ul > li{
						padding: 0.5rem 1rem 0.5rem 2rem;
						font-size: 1.1em;
					}

}
@media screen and (max-width: 480px) {
		.index #contact > div{
			row-gap: 2rem;
			padding: 2rem;
		}	
				.index #contact > div > figure > ul{
					margin: 0 0 0 -2rem;
				}
}




	body.article{
		
	}
		body.article > main{
			
		}

			body.article > main > section{
					background: url(/assets/img/deco_article_start.png) no-repeat;
					background-position: right -2rem top 10rem;
					background-size: 50% auto;
			}

				body.article > main > section p{
					line-height: 2;
				}

				body.article > main > section p mark{
					border-bottom: 4px solid #F6DEE3;
					padding-bottom: 4px;
					font-family: 'Noto Sans JP', sans-serif;
					font-weight: 500;
				}

				body.article > main > section .message{
					text-align: center;
					font-size: 1.5rem;
					line-height: 1.8;
					letter-spacing: 0.02em;
					width: 100%;
					margin: 10rem auto;
					padding: 0 2rem;
					word-break: keep-all;
				}
@media screen and (max-width: 960px) {
				body.article > main > section .message{
					font-size: 1.44rem;
					margin: 9rem auto;
				}
}
@media screen and (max-width: 768px) {
				body.article > main > section .message{
					font-size: 1.33rem;
					margin: 8rem auto;
				}	
}
@media screen and (max-width: 640px) {
			body.article > main > section{
					background-position: right -2rem top 12rem;
			}
				body.article > main > section .message{
					font-size: 1.25rem;
				}	
}
@media screen and (max-width: 480px) {
				body.article > main > section .message{
					font-size: 1.2rem;
				}	
}
				body.article > main > section > .message{
					margin: 0 auto !important;
				}



				body.article > main > section .point{
					color: #003781;
					font-size: 1.75em;
					border-bottom: 4px solid #003781;
					margin: 3rem 0 0 0;
				}


				body.article > main > section > header{
					max-width: calc(1200px + 4rem);
					margin: 0 auto;
					padding: 8rem 2rem;
				}
					body.article > main > section > header > h1{
						padding: 0 0 8rem 0;
						display: inline-flex;
						flex-direction: column;
						position: relative;
					}
						body.article > main > section > header > h1::before{
							content: '';
							position: absolute;
							right: -128px;
							top: -32px;
							height: 128px;
							width: 128px;
							background: url(/assets/img/deco_leaf.png) no-repeat top right;
							background-size: contain;
						}

						body.article > main > section > header > h1 > b{
							order: 2;
							margin: 0.75rem 0 0 0;
							line-height: 1.4;
							font-size: 5em;
							letter-spacing: 0.1em;
							color: rgba(0,55,129,0.5);
							font-weight: 400;
						}
						body.article > main > section > header > h1 > i{
							order: 1;
							line-height: 1;
							font-size: 1em;
							letter-spacing: 0.1em;
							color: rgba(0,55,129,0.5);
							font-weight: 500;
						}

					body.article > main > section > header > p.lead{
						font-size: 1.75rem;
						line-height: 1.4;
						letter-spacing: 0.05em;
						word-break: keep-all;
						max-width: 600px;
						width: 100%;
						margin: 0 auto 0 0;
						font-weight: 500;
					}
					body.article > main > section > header > p:not(.lead){
						max-width: 600px;
						width: 100%;
						margin: 2rem auto 0 0;
						letter-spacing: 0.02em;
						line-height: 2;
						word-break: keep-all;
					}

@media screen and (max-width: 960px) {
						body.article > main > section > header > h1::before{
							right: -96px;
							top: -24px;
							height: 96px;
							width: 96px;
						}
						body.article > main > section > header > h1 > b{
							font-size: 4em;
							letter-spacing: 0.075em;
						}
						body.article > main > section > header > h1 > i{
							font-size: 1em;
						}
					body.article > main > section > header > p.lead{
						font-size: 1.75rem;
					}
					body.article > main > section > header > p:not(.lead){
						margin: 1.75rem auto 0 0;
					}

}
@media screen and (max-width: 768px) {
						body.article > main > section > header > h1::before{
							right: -80px;
							top: -16px;
							height: 80px;
							width: 80px;
						}
						body.article > main > section > header > h1 > b{
							font-size: 3.5em;
							letter-spacing: 0.05em;
						}
						body.article > main > section > header > h1 > i{
							font-size: 0.9em;
						}
					body.article > main > section > header > p.lead{
						font-size: 1.5rem;
					}
					body.article > main > section > header > p:not(.lead){
						margin: 1.5rem auto 0 0;
					}
}
@media screen and (max-width: 640px) {
						body.article > main > section > header > h1::before{
							right: -64px;
							top: -16px;
							height: 64px;
							width: 64px;
						}
						body.article > main > section > header > h1 > b{
							font-size: 3em;
							letter-spacing: 0.04em;
							margin: 0.5rem 0 0 0;
						}
						body.article > main > section > header > h1 > i{
							font-size: 0.85em;
						}
					body.article > main > section > header > p.lead{
						font-size: 1.44rem;
					}
					body.article > main > section > header > p:not(.lead){
						margin: 1.44rem auto 0 0;
					}
}
@media screen and (max-width: 480px) {
						body.article > main > section > header > h1::before{
							right: -40px;
							top: 0;
							height: 40px;
							width: 40px;
						}
						body.article > main > section > header > h1 > b{
							font-size: 2.25em;
							letter-spacing: 0.03em;
						}
						body.article > main > section > header > h1 > i{
							font-size: 0.8em;
						}
					body.article > main > section > header > p.lead{
						font-size: 1.25rem;
					}
					body.article > main > section > header > p:not(.lead){
						margin: 1.25rem auto 0 0;
					}
}




	body.article > main > section > section:not([class]),
	body.article > main > section > section.area{
		padding: 0rem 2rem 8rem 2rem;
	}
	body.article > main > section > section + section:not([class]),
	body.article > main > section > section + section.area{
		padding: 8rem 2rem;
	}
@media screen and (max-width: 960px) {
	body.article > main > section > section:not([class]),
	body.article > main > section > section.area{
		padding: 0rem 2rem 7rem 2rem;
	}
	body.article > main > section > section + section:not([class]),
	body.article > main > section > section + section.area{
		padding: 7rem 2rem;
	}
}
@media screen and (max-width: 768px) {
	body.article > main > section > section:not([class]),
	body.article > main > section > section.area{
		padding: 0rem 2rem 6rem 2rem;
	}
	body.article > main > section > section + section:not([class]),
	body.article > main > section > section + section.area{
		padding: 6rem 2rem;
	}
}
@media screen and (max-width: 640px) {
	body.article > main > section > section:not([class]),
	body.article > main > section > section.area{
		padding: 0rem 2rem 5rem 2rem;
	}
	body.article > main > section > section + section:not([class]),
	body.article > main > section > section + section.area{
		padding: 5rem 2rem;
	}
}
@media screen and (max-width: 480px) {
	body.article > main > section > section:not([class]),
	body.article > main > section > section.area{
		padding: 0rem 2rem 4rem 2rem;
	}
	body.article > main > section > section + section:not([class]),
	body.article > main > section > section + section.area{
		padding: 4rem 2rem;
	}
}

		body.article > main > section > section:not([class]) > header,
		body.article > main > section > section.area > header,
		body.article > main > section > section.target > header{
			border-bottom: 1px solid #98A6B5;
			padding: 0 0 1.5rem 0;
			margin: 0 0 3rem 0;
		}
			body.article > main > section > section:not([class]) > header > h2,
			body.article > main > section > section.area > header > h2,
			body.article > main > section > section.target > header > h2{
				font-size: 2.5rem;
				font-weight: 500;
				line-height: 1.4;
				letter-spacing: 0.05em;
			}
@media screen and (max-width: 960px) {
		body.article > main > section > section:not([class]) > header,
		body.article > main > section > section.area > header,
		body.article > main > section > section.target > header{
			padding: 0 0 1.5rem 0;
			margin: 0 0 2.75rem 0;
		}
			body.article > main > section > section:not([class]) > header > h2,
			body.article > main > section > section.area > header > h2,
			body.article > main > section > section.target > header > h2{
				font-size: 2.25rem;
			}
}
@media screen and (max-width: 768px) {
		body.article > main > section > section:not([class]) > header,
		body.article > main > section > section.area > header,
		body.article > main > section > section.target > header{
			padding: 0 0 1.25rem 0;
			margin: 0 0 2.5rem 0;
		}
			body.article > main > section > section:not([class]) > header > h2,
			body.article > main > section > section.area > header > h2,
			body.article > main > section > section.target > header > h2{
				font-size: 2rem;
			}
}
@media screen and (max-width: 640px) {
		body.article > main > section > section:not([class]) > header,
		body.article > main > section > section.area > header,
		body.article > main > section > section.target > header{
			padding: 0 0 1.25rem 0;
			margin: 0 0 2.25rem 0;
		}
			body.article > main > section > section:not([class]) > header > h2,
			body.article > main > section > section.area > header > h2,
			body.article > main > section > section.target > header > h2{
				font-size: 1.75rem;
			}
}
@media screen and (max-width: 480px) {
		body.article > main > section > section:not([class]) > header,
		body.article > main > section > section.area > header,
		body.article > main > section > section.target > header{
			padding: 0 0 1rem 0;
			margin: 0 0 2rem 0;
		}
			body.article > main > section > section:not([class]) > header > h2,
			body.article > main > section > section.area > header > h2{
				font-size: 1.5rem;
			}
}

		body.article > main > section > section:not([class]) > section{
			margin: 5rem auto;
		}
			body.article > main > section > section:not([class]) > section > header{
				margin: 0 0 2.5rem 0;
			}
				body.article > main > section > section:not([class]) > section > header > h3{
					font-size: 2rem;
					font-weight: 500;
					letter-spacing: 0.2em;
					line-height: 1.2;
				}
@media screen and (max-width: 960px) {
				body.article > main > section > section:not([class]) > section > header > h3{
					font-size: 1.75rem;
				}
}
@media screen and (max-width: 768px) {
				body.article > main > section > section:not([class]) > section > header > h3{
					font-size: 1.5rem;
				}
}
@media screen and (max-width: 640px) {
				body.article > main > section > section:not([class]) > section > header > h3{
					font-size: 1.44rem;
				}
}
@media screen and (max-width: 480px) {
				body.article > main > section > section:not([class]) > section > header > h3{
					font-size: 1.25rem;
				}

}




		body.article > main > section > section:not([class]) > header.specialTitle{
			position: relative;
			margin: 0 0 8rem 0;
		}
			body.article > main > section > section:not([class]) > header.specialTitle > i{
				position: absolute;
				bottom: -5rem;
				font-size: 3rem;
				line-height: 1;
				color: rgba(0,55,129,0.3);
			}
@media screen and (max-width: 960px) {
		body.article > main > section > section:not([class]) > header.specialTitle{
			margin: 0 0 7rem 0;
		}
			body.article > main > section > section:not([class]) > header.specialTitle > i{
				bottom: -4.5rem;
				font-size: 2.5rem;
			}
}
@media screen and (max-width: 768px) {
		body.article > main > section > section:not([class]) > header.specialTitle{
			margin: 0 0 6.5rem 0;
		}
			body.article > main > section > section:not([class]) > header.specialTitle > i{
				bottom: -4rem;
				font-size: 2.25rem;
			}
}
@media screen and (max-width: 640px) {
		body.article > main > section > section:not([class]) > header.specialTitle{
			margin: 0 0 6rem 0;
		}
			body.article > main > section > section:not([class]) > header.specialTitle > i{
				bottom: -3.5rem;
				font-size: 2rem;
			}
}
@media screen and (max-width: 480px) {
		body.article > main > section > section:not([class]) > header.specialTitle{
			margin: 0 0 5.5rem 0;
		}
			body.article > main > section > section:not([class]) > header.specialTitle > i{
				bottom: -3.5rem;
				font-size: 1.5rem;
			}
}



	body.article > main > section > section.area{
		display: grid;
		grid-template-areas: 
			"title title"
			"text list"
			"point list";
		grid-template-columns: repeat(2, 1fr);
		column-gap: 5rem;
		grid-template-rows: repeat(3, auto);
		row-gap: 0;
	}
		body.article > main > section > section.area > [itemprop="title"]{
			grid-area: title;
		}
		body.article > main > section > section.area > [itemprop="text"]{
			grid-area: text;
		}
		body.article > main > section > section.area > [itemprop="list"]{
			grid-area: list;
			background: rgba(193,227,239,0.25);
			border: 1px solid rgba(112,112,112,0.25);
			padding: 2rem;
			align-self: start;
		}
			body.article > main > section > section.area > [itemprop="list"] figcaption{
				font-size: 1.5em;
				margin: 0 0 0.25rem 0;
			}
			body.article > main > section > section.area > [itemprop="list"] ul{
				
			}
				body.article > main > section > section.area > [itemprop="list"] ul > li{
					background: white;
					border: 1px solid rgba(152,166,181,0.8);
					border-radius: 4px;
					line-height: 1;
					display: inline-block;
					padding: 0.5rem 1.25rem;
					margin: 0.25rem 0.125rem;
					font-family: 'Noto Sans JP', sans-serif;
				}

		body.article > main > section > section.area > [itemprop="point"]{
			grid-area: point;
			line-height: 1.4;
			word-break: keep-all;
		}
@media screen and (max-width: 960px) {
	body.article > main > section > section.area{
		column-gap: 3rem;
	}	
		body.article > main > section > section.area > [itemprop="list"]{
			padding: 1.5rem;
		}
				body.article > main > section > section.area > [itemprop="list"] ul > li{
					padding: 0.5rem 1.125rem;
				}
		body.article > main > section > section.area > [itemprop="point"]{
			font-size: 1.75rem;
			margin: 2.5rem 0 0 0;
		}
}
@media screen and (max-width: 768px) {
	body.article > main > section > section.area{
		column-gap: 2.5rem;
		grid-template-areas: 
			"title title"
			"text list"
			"point point";
		}	
		body.article > main > section > section.area > [itemprop="list"]{
			padding: 1.25rem;
		}
				body.article > main > section > section.area > [itemprop="list"] ul > li{
					padding: 0.5rem 1rem;
				}
		body.article > main > section > section.area > [itemprop="point"]{
			font-size: 1.5rem;
			margin: 2rem 0 0 0;
		}
}
@media screen and (max-width: 640px) {
	body.article > main > section > section.area{
		grid-template-areas: 
			"title"
			"text"
			"point"
			"list";
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(4, auto);
		row-gap: 3rem;
	}	
		body.article > main > section > section.area > [itemprop="title"]{
			margin: 0;
		}
		body.article > main > section > section.area > [itemprop="list"]{
			padding: 1.25rem 1rem;
		}
				body.article > main > section > section.area > [itemprop="list"] ul > li{
					font-size: 0.95rem;
				}
		body.article > main > section > section.area > [itemprop="point"]{
			font-size: 1.25rem;
			margin: 0;
		}
}





	body.article > main > section > section.target{
		padding-top: 16rem;
		padding-bottom: 8rem;
		padding-right: calc((100vw - 1200px) / 2 + 2rem); 
		padding-left: calc((100vw - 1200px) / 2 + 2rem); 
		margin: 0;
		max-width: none;

		background-image: 
			url('/assets/img/deco_target_01.png'),
			url('/assets/img/deco_target_02.png'),
			url('/assets/img/deco_target_03.png'),
			url('/assets/img/deco_target_04.png'),
			linear-gradient(to bottom, #E0F1F7, white);
		background-position: 
			left -2rem top 0,
			right -2rem top 25%,
			left -2rem top 50%,
			right -2rem top 75%,
			center top 8rem;
		background-repeat: no-repeat;
		background-size: 
			20%,
			20%,
			20%,
			20%,
			100% 10%;
	}
@media screen and (max-width: 1200px) {
	body.article > main > section > section.target{
		padding-top: 12rem;
		padding-bottom: 8rem;
		padding-right: 2rem; 
		padding-left: 2rem; 
		background-position: 
			left -1rem top 0,
			right -1rem top 25%,
			left -1rem top 50%,
			right -1rem top 75%,
			center top 3rem;
		background-size: 
			25%,
			25%,
			25%,
			25%,
			100% 10%;
	}
}
@media screen and (max-width: 960px) {
	body.article > main > section > section.target{
		padding-top: 10rem;
		padding-bottom: 7rem;
		padding-right: 2rem; 
		padding-left: 2rem; 
	}
}
@media screen and (max-width: 640px) {
	body.article > main > section > section.target{
		padding-top: 8rem;
		padding-bottom: 6rem;
		padding-right: 2rem; 
		padding-left: 2rem; 
		background-size: 
			30%,
			30%,
			30%,
			30%,
			100% 10%;
	}
}
@media screen and (max-width: 480px) {
	body.article > main > section > section.target{
		padding-top: 8rem;
		padding-bottom: 5rem;
		padding-right: 2rem; 
		padding-left: 2rem; 
		background-size: 
			33%,
			33%,
			33%,
			33%,
			100% 10%;
	}
}

		body.article > main > section > section.target > ol{
			counter-reset: item;
			display: grid;
			grid-template-columns: repeat(3,1fr);
			column-gap: 4rem;
			grid-template-rows: 1fr;
			row-gap: 0;
		}
			body.article > main > section > section.target > ol > li{
				position: relative;
				padding: 4rem 0 0 0;
			}
				body.article > main > section > section.target > ol > li::before{
					position: absolute;
					top: 0;
					left: 0;
					counter-increment: item;
					content: counter(item)'.';
					color: rgba(0,55,129,0.5);
					font-size: 3em;
					line-height: 1;
				}
@media screen and (max-width: 960px) {
		body.article > main > section > section.target > ol{
			column-gap: 3rem;
		}
}
@media screen and (max-width: 768px) {
		body.article > main > section > section.target > ol{
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: repeat(3, auto);
			row-gap: 4rem;
		}
			body.article > main > section > section.target > ol > li{
				position: relative;
				padding: 3rem 0 0 0;
			}
				body.article > main > section > section.target > ol > li::before{
					position: absolute;
					top: 0;
					left: 0;
					counter-increment: item;
					content: counter(item)'.';
					color: rgba(0,55,129,0.5);
					font-size: 2em;
					line-height: 1;
				}
	
}

	[data-region="caseList"]{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 5rem;
		grid-template-rows: 1fr;
		row-gap: 6rem;
	}
		[data-region="caseList"] > section{
			
		}
			[data-region="caseList"] > section > header{
				padding: 0 0 0 2rem;
				margin: 0 0 2rem 0;
				border-left: 8px solid #193B7D;
				display: grid;
				place-items: center start;
				min-height: 4.5rem;
			}
				[data-region="caseList"] > section > header > h3{
					font-size: 1.5em;
					font-weight: 500;
					word-break: keep-all;
				}
@media screen and (max-width: 960px) {
	[data-region="caseList"]{
		column-gap: 4rem;
		row-gap: 5rem;
	}
		[data-region="caseList"] > section{
			
		}
			[data-region="caseList"] > section > header{
				padding: 0 0 0 2rem;
				margin: 0 0 2rem 0;
				min-height: 4rem;
			}
				[data-region="caseList"] > section > header > h3{
					font-size: 1.44em;
				}
}
@media screen and (max-width: 768px) {
	[data-region="caseList"]{
		column-gap: 3rem;
		row-gap: 5rem;
	}
			[data-region="caseList"] > section > header{
				padding: 0 0 0 1.5rem;
				margin: 0 0 1.5rem 0;
				min-height: 3.5rem;
			}
				[data-region="caseList"] > section > header > h3{
					font-size: 1.25em;
				}
}
@media screen and (max-width: 640px) {
	[data-region="caseList"]{
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: auto;
		row-gap: 5rem;
	}
			[data-region="caseList"] > section > header{
				padding: 0 0 0 1rem;
				margin: 0 0 1.5rem 0;
				min-height: 3.5rem;
			}
				[data-region="caseList"] > section > header > h3{
					font-size: 1.125em;
				}
}
@media screen and (max-width: 480px) {
			[data-region="caseList"] > section > header{
				min-height: 3rem;
			}
				[data-region="caseList"] > section > header > h3{
					font-size: 1.1em;
				}

}























	body.article > main > section > section.plusFlame{
		max-width: none;
		padding: 0;
		margin: 0;
		margin-right: calc((100vw - 1200px) / 2 ); 
		background: rgba(255,255,255,0.8);
		box-shadow: 0 0 30px #E0F1F7;
		display: grid;
		grid-template-areas: 
			"text image";
		grid-template-columns: repeat(2, 1fr);
		column-gap: 5rem;
		grid-template-rows: 1fr;
		row-gap: 0;
		align-items: center;
		justify-content: end;
	}
	body.article > main > section > section:nth-of-type(2n-1) + section.plusFlame{
		margin: 8rem 0;
		margin-left: calc((100vw - 1200px) / 2 ); 
		grid-template-areas: 
			"image text";
	}
	body.article > main > section > section:nth-of-type(2n) + section.plusFlame{
		margin: 8rem 0;
		margin-right: calc((100vw - 1200px) / 2 ); 
		justify-content: end;
	}
@media screen and (max-width: 1280px) {
	body.article > main > section > section.plusFlame{
		margin-right: 2rem;
		padding: 0;
		column-gap: 4rem;
	}	
	body.article > main > section > section:nth-of-type(2n-1) + section.plusFlame{
		margin-left: 2rem;
	}
	body.article > main > section > section:nth-of-type(2n) + section.plusFlame{
		margin-right: 2rem;
	}
}
@media screen and (max-width: 960px) {
	body.article > main > section > section.plusFlame{
		box-shadow: 0 0 25px #E0F1F7;
		column-gap: 3rem;
	}
}
@media screen and (max-width: 768px) {
	body.article > main > section > section.plusFlame,
	body.article > main > section > section:nth-of-type(2n-1) + section.plusFlame,
	body.article > main > section > section:nth-of-type(2n) + section.plusFlame{
		box-shadow: 0 0 20px #E0F1F7;
		grid-template-areas: 
			"text"
			"image";
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(2, auto);
		row-gap: 3rem;
		align-items: center;
		justify-content: start;
	}
}
@media screen and (max-width: 640px) {
	body.article > main > section > section.plusFlame,
	body.article > main > section > section:nth-of-type(2n-1) + section.plusFlame,
	body.article > main > section > section:nth-of-type(2n) + section.plusFlame{
		box-shadow: 0 0 12px #E0F1F7;
	}
}
@media screen and (max-width: 480px) {
	body.article > main > section > section.plusFlame{
		box-shadow: 0 0 6px #E0F1F7;
	}
}


		body.article > main > section > section.plusFlame > div{
			grid-area: text;
			max-width: 600px;
		}
		body.article > main > section > section.plusFlame:nth-of-type(2n-1) > div{
			padding: 4.5rem 0 4.5rem 2rem;
			margin-left: calc((100vw - 1200px) / 2 );
			margin-right: 0;
		}
		body.article > main > section > section.plusFlame:nth-of-type(2n) > div{
			padding: 4.5rem 2rem 4.5rem 0;
			margin-left: 0;
			margin-right: calc((100vw - 1200px) / 2 );
		}
@media screen and (max-width: 1280px) {
		body.article > main > section > section.plusFlame > div{
		}
		body.article > main > section > section.plusFlame:nth-of-type(2n-1) > div{
			margin-left: 0;
			margin-right: 0;
		}
		body.article > main > section > section.plusFlame:nth-of-type(2n) > div{
			margin-left: 0;
			margin-right: 0;
		}
}
@media screen and (max-width: 768px) {
		body.article > main > section > section.plusFlame:nth-of-type(2n-1) > div{
			padding: 4rem 2rem 0 3rem;
		}
		body.article > main > section > section.plusFlame:nth-of-type(2n) > div{
			padding: 4rem 2rem 0 2rem;
		}
	
}


		body.article > main > section > section.plusFlame > figure{
			grid-area: image;
			position: relative;
			height: 100%;
		}
			body.article > main > section > section.plusFlame > figure::before{
				position: absolute;
				left: 0;
				top: 0;
				z-index: 5;
				content: '';
				display: block;
				width: 20%;
				height: 100%;
				background: linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,0));
			}
			body.article > main > section > section.plusFlame:nth-of-type(2n) > figure::before{
				position: absolute;
				left: auto;
				right: 0;
				top: 0;
				z-index: 5;
				content: '';
				display: block;
				width: 20%;
				height: 100%;
				background: linear-gradient(-90deg, rgba(255,255,255,1), rgba(255,255,255,0));
			}

			body.article > main > section > section.plusFlame > figure > img{
				width: 100%;
				height: 100%;
				object-fit: cover;
			}
@media screen and (max-width: 768px) {
		body.article > main > section > section.plusFlame > figure{
			max-height: 320px;
		}
}
@media screen and (max-width: 480px) {
		body.article > main > section > section.plusFlame > figure{
			max-height: 240px;
		}
}


		body.article > main > section > section.plusFlame header{
			margin: 0 0 3rem 0;
		}

			body.article > main > section > section.plusFlame header > h2{
				font-size: 1.5rem;
				line-height: 1.8;
				letter-spacing: 0.02em;
				max-width: 600px;
				width: 100%;
				margin: 0 auto 0 0;
				word-break: keep-all;
			}
@media screen and (max-width: 960px) {
		body.article > main > section > section.plusFlame header{
			margin: 0 0 2.75rem 0;
		}
			body.article > main > section > section.plusFlame header > h2{
				font-size: 1.5rem;
			}
}
@media screen and (max-width: 768px) {
		body.article > main > section > section.plusFlame header{
			margin: 0 0 2.5rem 0;
		}
			body.article > main > section > section.plusFlame header > h2{
				font-size: 1.44rem;
			}
}
@media screen and (max-width: 640px) {
		body.article > main > section > section.plusFlame header{
			margin: 0 0 2.25rem 0;
		}
			body.article > main > section > section.plusFlame header > h2{
				font-size: 1.25rem;
			}
}
@media screen and (max-width: 480px) {
		body.article > main > section > section.plusFlame header{
			margin: 0 0 2rem 0;
		}
			body.article > main > section > section.plusFlame header > h2{
				font-size: 1.2rem;
			}
}








		body.article > main > section > section > section.staff{
			display: grid;
			grid-template-areas: 
				"title contents";
			grid-template-columns: auto 1fr;
			column-gap: 6rem;
			grid-template-rows: 1fr;
			row-gap: 0;
		}
		body.article > main > section > section > section + section.staff{
			margin: 8rem 0 0 0;
			border-top: 1px solid #9CA6B4;
			padding: 4rem 0 0 0;
		}
@media screen and (max-width: 960px) {
		body.article > main > section > section > section.staff{
			column-gap: 4rem;
		}
		body.article > main > section > section > section + section.staff{
			margin: 7rem 0 0 0;
		}
}
@media screen and (max-width: 768px) {
		body.article > main > section > section > section.staff{
			column-gap: 3rem;
		}
		body.article > main > section > section > section + section.staff{
			margin: 6rem 0 0 0;
		}
}
@media screen and (max-width: 640px) {
		body.article > main > section > section > section.staff{
			grid-template-areas: 
				"title"
				"contents";
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: repeat(2,auto);
			row-gap: 2rem;
			margin: 0;
		}
		body.article > main > section > section > section + section.staff{
			margin: 3rem 0 0 0;
			padding: 3rem 0 0 0;
		}
}
@media screen and (max-width: 480px) {
		body.article > main > section > section > section.staff{
			row-gap: 2.5rem;
		}
		body.article > main > section > section > section + section.staff{
			padding: 3rem 0 0 0;
		}
	
}


			body.article > main > section > section > section.staff > header{
				grid-area: title;
				width: 200px;
			}
				body.article > main > section > section > section.staff > header > small{
					font-size: 1.125em;
					font-weight: 500;
				}

				body.article > main > section > section > section.staff > header > h3{
					font-size: 1rem;
					margin: 1.5rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > h3 > b{
						display: block;
						font-size: 1.75em;
						font-weight: 500;
					}
					body.article > main > section > section > section.staff > header > h3 > i{
						display: block;
						font-size: 0.9em;
						font-weight: 400;
						margin: 1rem 0 0 0;
					}
@media screen and (max-width: 960px) {
			body.article > main > section > section > section.staff > header{
				width: 180px;
			}
				body.article > main > section > section > section.staff > header > small{
					font-size: 1em;
				}

				body.article > main > section > section > section.staff > header > h3{
					margin: 1.5rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > h3 > b{
						font-size: 1.5em;
					}
					body.article > main > section > section > section.staff > header > h3 > i{
						font-size: 0.9em;
						margin: 1rem 0 0 0;
					}	
}
@media screen and (max-width: 768px) {
			body.article > main > section > section > section.staff > header{
			}
				body.article > main > section > section > section.staff > header > small{
					font-size: 0.95em;
				}

				body.article > main > section > section > section.staff > header > h3{
					margin: 1.25rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > h3 > b{
						font-size: 1.44em;
					}
					body.article > main > section > section > section.staff > header > h3 > i{
						font-size: 0.9em;
						margin: 0.5rem 0 0 0;
					}	
}
@media screen and (max-width: 640px) {
			body.article > main > section > section > section.staff > header{
			}
				body.article > main > section > section > section.staff > header > small{
					font-size: 0.9em;
				}

				body.article > main > section > section > section.staff > header > h3{
					margin: 1.125rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > h3 > b{
						font-size: 1.25em;
					}
					body.article > main > section > section > section.staff > header > h3 > i{
						font-size: 0.85em;
						margin: 0.5rem 0 0 0;
					}		
}

				body.article > main > section > section > section.staff > header > ul{
					margin: 3rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > ul > li{
						font-size: 1em;
						font-weight: 400;
					}
						body.article > main > section > section > section.staff > header > ul > li + li{
							margin: 0.5rem 0 0 0;
						}
@media screen and (max-width: 960px) {
				body.article > main > section > section > section.staff > header > ul{
					margin: 3rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > ul > li{
						font-size: 1em;
					}
}
@media screen and (max-width: 768px) {
				body.article > main > section > section > section.staff > header > ul{
					margin: 2.5rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > ul > li{
						font-size: 0.95em;
					}
						body.article > main > section > section > section.staff > header > ul > li + li{
							margin: 0.25rem 0 0 0;
						}
}
@media screen and (max-width: 640px) {
				body.article > main > section > section > section.staff > header > ul{
					margin: 2rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > ul > li{
						font-size: 0.95em;
					}
}
@media screen and (max-width: 480px) {
				body.article > main > section > section > section.staff > header > ul{
					margin: 1.5rem 0 0 0;
				}
					body.article > main > section > section > section.staff > header > ul > li{
						font-size: 0.9em;
					}
}	
	
	
			body.article > main > section > section > section.staff > [data-region="staffInfoList"]{
				grid-area: contents;
			}

			[data-region="staffInfoList"]{
				
			}
				[data-region="staffInfoList"] > section{
					
				}
				[data-region="staffInfoList"] > section + section{
					margin: 1rem 0 0 0;
				}
					[data-region="staffInfoList"] > section > header{
						position: relative;
						background: rgba(246,222,227,0.5);
						padding: 1rem 1rem 1rem 4rem;
					}
						[data-region="staffInfoList"] > section > header::before{
							position: absolute;
							top: calc(50% - 1rem / 2);
							left: 1.5rem;
							font-family: 'Material Symbols Rounded';
							content: '\e5cf';
							font-size: 1rem;
							line-height: 1;
							color: #98A6B5;
						}


						[data-region="staffInfoList"] > section > header > h4{
							
						}
					[data-region="staffInfoList"] > section > div{
						padding: 2.5rem 1rem 3rem 4rem;
					}
@media screen and (max-width: 768px) {
				[data-region="staffInfoList"] > section + section{
					margin: 0.75rem 0 0 0;
				}
					[data-region="staffInfoList"] > section > header{
						padding: 0.75rem 1rem 0.75rem 3.5rem;
					}
						[data-region="staffInfoList"] > section > header::before{
							left: 1.5rem;
						}
						[data-region="staffInfoList"] > section > header > h4{
						}
					[data-region="staffInfoList"] > section > div{
						padding: 2rem 1rem 2rem 3.5rem;
					}	
}
@media screen and (max-width: 640px) {
				[data-region="staffInfoList"] > section + section{
					margin: 0.5rem 0 0 0;
				}
					[data-region="staffInfoList"] > section > header{
						padding: 0.75rem 1rem 0.75rem 3rem;
					}
						[data-region="staffInfoList"] > section > header::before{
							left: 1rem;
						}
						[data-region="staffInfoList"] > section > header > h4{
							font-size: 0.95em;
						}
					[data-region="staffInfoList"] > section > div{
						padding: 2rem 1rem 2rem 3rem;
					}
}
@media screen and (max-width: 480px) {
				[data-region="staffInfoList"] > section + section{
					margin: 0.5rem 0 0 0;
				}
					[data-region="staffInfoList"] > section > header{
						padding: 0.75rem 0.5rem 0.75rem 2rem;
					}
						[data-region="staffInfoList"] > section > header::before{
							left: 0.5rem;
						}
						[data-region="staffInfoList"] > section > header > h4{
							
						}
					[data-region="staffInfoList"] > section > div{
						padding: 2rem 0.5rem 2rem 2rem;
					}
	
}


	.company{
		max-width: 1200px;
		margin: 0 auto;
		padding: 5rem 6rem 4rem 6rem;
		background: rgba(255,255,255,0.8);
		box-shadow: 0 0 20px #E0F1F7;
		display: grid;
		grid-template-areas: 
			"name name"
			"photo info";
		grid-template-columns: 1fr 2fr;
		column-gap: 4rem;
		grid-template-rows: repeat(2, auto);
		row-gap: 2rem;
		align-items: center;		
	}
		.company > header {
			grid-area: name;
			justify-self: center;
		}
			.company > header > h2{
				text-align: center;
			}
				.company > header > h2 > small{
					font-size: 0.9em;
					font-weight: 400;
					letter-spacing: 0.1em;
					word-break: keep-all;
					display: block;
					font-family: 'Noto Sans JP', sans-serif;
				}
				.company > header > h2 > i{
					font-size: 1.2em;
					font-weight: 400;
					letter-spacing: 0.1em;
				}
				.company > header > h2 > b{
					font-size: 1.5em;
					font-weight: 500;
					letter-spacing: 0.1em;
				}
		.company > ul {
			grid-area: info;
			border-top: 1px solid rgba(156,166,180,0.5);
		}
			.company > ul > li{
				padding: 1.5rem 0;
				border-bottom: 1px solid rgba(156,166,180,0.5);
			}
				.company > ul > li > dl{
					display: grid;
					grid-template-columns: 6rem 1fr;
					column-gap: 2rem;
					grid-template-rows: 1fr;
					row-gap: 0;
				}
					.company > ul > li > dl > dt{
						font-weight: 400;
						letter-spacing: 0.05em;
						font-family: 'Noto Sans JP', sans-serif;
					}
					.company > ul > li > dl > dd{
						font-size: 0.95em;
						font-weight: 400;
						letter-spacing: 0.05em;
						word-break: keep-all;
						font-family: 'Noto Sans JP', sans-serif;
					}

		.company > figure {
			grid-area: photo;
			max-width: 280px;
		}

@media screen and (max-width: 1280px) {
	.company{
		margin: 0 2rem;
		padding: 5rem 5rem 4rem 5rem;
		column-gap: 4rem;
		row-gap: 2rem;
	}
	
}
@media screen and (max-width: 960px) {
	.company{
		padding: 4.5rem 4rem 3.5rem 4rem;
		box-shadow: 0 0 20px #E0F1F7;
		column-gap: 3.5rem;
		row-gap: 2rem;
	}
			.company > ul > li{
				padding: 1.25rem 0;
			}
				.company > ul > li > dl{
					grid-template-columns: 6rem 1fr;
					column-gap: 2rem;
					grid-template-rows: 1fr;
					row-gap: 0;
				}
					.company > ul > li > dl > dt{
					}
					.company > ul > li > dl > dd{
						font-size: 0.95em;
					}

}
@media screen and (max-width: 768px) {
	.company{
		padding: 4rem 3rem 3rem 3rem;
		box-shadow: 0 0 20px #E0F1F7;
		grid-template-areas: 
			"name"
			"info"
			"photo";
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(3, auto);
		row-gap: 3rem;
	}
				.company > header > h2 > small{
					font-size: 0.85em;
				}
				.company > header > h2 > i{
					font-size: 1.1em;
				}
				.company > header > h2 > b{
					font-size: 1.44em;
				}

		.company > figure {
			justify-self: center;
			max-width: 320px;
		}

}
@media screen and (max-width: 640px) {
	.company{
		padding: 4rem 2rem 2rem 2rem;
		box-shadow: 0 0 12px #E0F1F7;
		row-gap: 2rem;
	}
				.company > header > h2 > small{
					font-size: 0.825em;
				}
				.company > header > h2 > i{
					font-size: 0.9em;
					display: block;
					margin: 0.5rem 0 0 0;
				}
				.company > header > h2 > b{
					font-size: 1.25em;
					display: block;
				}
				.company > ul > li > dl{
					grid-template-columns: 1fr;
					column-gap: 0;
					grid-template-rows: repeat(2,auto);
					row-gap: 0.5rem;
				}
					.company > ul > li > dl > dt{
					}
					.company > ul > li > dl > dd{
						font-size: 0.95em;
					}
}
@media screen and (max-width: 480px) {
	.company{
		row-gap: 1.5rem;
		padding: 4rem 1.5rem 2rem 1.5rem;
		box-shadow: 0 0 6px #E0F1F7;
	}
	
}

	[data-region="GoogleMap"]{
		height: 400px;
		width: 100%;
		background: #eee;
		margin: 8rem 0 0 0;
		display: grid;
		place-items: center;
		color: #ccc;
	}
	[data-region="GoogleMap"] + section{
		padding-top: 6rem !important;
	}
		[data-region="GoogleMap"] > iframe{
			height: 100%;
			width: 100%;
		}


@media screen and (max-width: 960px) {
	[data-region="GoogleMap"]{
		margin: 7rem 0 0 0;
	}
	[data-region="GoogleMap"] + section{
		padding-top: 5rem !important;
	}
	
}
@media screen and (max-width: 768px) {
	[data-region="GoogleMap"]{
		margin: 6rem 0 0 0;
	}
	[data-region="GoogleMap"] + section{
		padding-top: 4.5rem !important;
	}
	
}
@media screen and (max-width: 640px) {
	[data-region="GoogleMap"]{
		margin: 5rem 0 0 0;
	}
	[data-region="GoogleMap"] + section{
		padding-top: 4rem !important;
	}
	
}




	[data-region="officeMap"]{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 1rem;
		grid-template-rows: 1fr;
		row-gap: 0;
	}
@media screen and (max-width: 768px) {
	[data-region="officeMap"]{
		grid-template-columns: 1fr;
		column-gap: 0;
		grid-template-rows: repeat(2, auto);
		row-gap: 1rem;
	}
	
}




	.officeList{
	}
		.officeList > li{
			max-width: 1200px;
			margin: 0 auto;
			padding: 4rem;
			background: rgba(255,255,255,0.8);
			box-shadow: 0 0 20px #E0F1F7;
		}
		.officeList > li + li{
			margin: 5rem auto;
		}

			.officeList > li > dl{
				display: grid;
				grid-template-areas: 
					"name photo"
					"menu photo";
				grid-template-columns: repeat(2, 1fr);
				column-gap: 5rem;
				grid-template-rows: repeat(2, 1fr);
				row-gap: 0;
				align-items: center;
			}
				.officeList > li > dl > [itemprop="name"]{
					grid-area: name;
				}
				.officeList > li > dl > [itemprop="photo"]{
					grid-area: photo;
				}
				.officeList > li > dl > [itemprop="menu"]{
					grid-area: menu;
				}

	.officeList menu[data-type="button"] a[href]{
		display: flex;
		margin: 0 auto;
		width: 100%;
		max-width: 400px;
		min-width: 320px;
		height: 80px;
		border-radius: 40px;
		padding: 0.25rem 2rem;
		font-size: 1.5em;
		letter-spacing: 0.1em;
	}
		.officeList menu[data-type="button"] a[href]::before{
			top: calc(50% - 2rem / 2);
			right: 2rem;
			font-size: 2rem;
		}


@media screen and (max-width: 960px) {
		.officeList > li{
			padding: 3.5rem 3rem;
			box-shadow: 0 0 20px #E0F1F7;
		}
		.officeList > li + li{
			margin: 4rem auto;
		}
			.officeList > li > dl{
				column-gap: 3rem;
				row-gap: 0;
			}
	.officeList menu[data-type="button"] a[href]{
		display: flex;
		margin: 0 auto;
		width: 100%;
		max-width: 400px;
		min-width: 320px;
		height: 64px;
		border-radius: 32px;
		padding: 0.25rem 1.5rem;
		color: white;
		font-size: 1.25em;
		letter-spacing: 0.1em;
	}
		.officeList menu[data-type="button"] a[href]::before{
			top: calc(50% - 2rem / 2);
			right: 2rem;
			font-size: 2rem;
		}
}
@media screen and (max-width: 768px) {
		.officeList > li{
			padding: 3rem 2rem;
			box-shadow: 0 0 20px #E0F1F7;
		}
		.officeList > li + li{
			margin: 3.5rem auto;
		}
			.officeList > li > dl{
				column-gap: 2rem;
				row-gap: 0;
			}
	.officeList menu[data-type="button"] a[href]{
		height: 56px;
		border-radius: 28px;
		padding: 0.25rem 1.5rem;
		font-size: 1em;
	}
		.officeList menu[data-type="button"] a[href]::before{
			top: calc(50% - 1.2rem / 2);
			right: 1.5rem;
			font-size: 1.2rem;
		}

}
@media screen and (max-width: 640px) {
		.officeList > li{
			padding: 4rem 1.5rem 1.5rem 1.5rem;
			box-shadow: 0 0 12px #E0F1F7;
		}
		.officeList > li + li{
			margin: 3rem auto;
		}
			.officeList > li > dl{
				grid-template-areas: 
					"name"
					"menu"
					"photo";
				grid-template-columns: 1fr;
				column-gap: 0;
				grid-template-rows: repeat(3, auto);
				row-gap: 3rem;
				max-width: 400px;
				margin: 0 auto;
			}
				.officeList > li > dl > [itemprop="name"]{
					justify-self: center;
				}

	.officeList menu[data-type="button"] a[href]{
		max-width: 260px;
		min-width: 260px;
	}
}
@media screen and (max-width: 480px) {
		.officeList > li{
			box-shadow: 0 0 6px #E0F1F7;
		}
}


	#relatedLink{
		margin: 0 2rem;
	}
		#relatedLink > ul{
			max-width: 1200px;
			margin: 0 auto;
			padding: 4rem;
			background: rgba(255,255,255,0.8);
			box-shadow: 0 0 30px #E0F1F7;
		}
			#relatedLink > ul > li{
				max-width: 700px;
				margin: 0 auto;
			}
			#relatedLink > ul > li + li{
				margin: 3rem auto 0 auto;
			}
				#relatedLink > ul > li > a{
					position: relative;
					display: flex;
					justify-content: space-between;
					align-items: center;
					background: linear-gradient(90deg, #4F8BCA, #193B7D);
					width: 100%;
					word-break: keep-all;
					min-height: 60px;
					border-radius: 8px;
					padding: 0.5rem 3rem 0.5rem 1.5rem;
					color: white;
					font-size: 1.25rem;
					letter-spacing: 0.1em;
					line-height: 1.4;
					font-family: 'Noto Sans JP', sans-serif;
				}
					#relatedLink > ul > li > a::before{
						position: absolute;
						top: calc(50% - 1rem / 2);
						right: 1.5rem;
						font-family: 'Material Symbols Rounded';
						content: '\e5e1';
						font-size: 1rem;
					}

@media screen and (max-width: 960px) {
		#relatedLink > ul{
			padding: 4rem 3rem;
			box-shadow: 0 0 20px #E0F1F7;
		}
			#relatedLink > ul > li{
				max-width: 700px;
				margin: 0 auto;
			}
			#relatedLink > ul > li + li{
				margin: 3rem auto 0 auto;
			}	
				#relatedLink > ul > li > a{
					font-size: 1.25rem;
				}
}
@media screen and (max-width: 768px) {
		#relatedLink > ul{
			padding: 3rem 2rem;
			box-shadow: 0 0 20px #E0F1F7;
		}
			#relatedLink > ul > li + li{
				margin: 3rem auto 0 auto;
			}	
				#relatedLink > ul > li > a{
					font-size: 1.125rem;
				}
}
@media screen and (max-width: 640px) {
		#relatedLink > ul{
			padding: 2.5rem 1.5rem;
			box-shadow: 0 0 12px #E0F1F7;
		}
			#relatedLink > ul > li + li{
				margin: 2.5rem auto 0 auto;
			}	
				#relatedLink > ul > li > a{
					font-size: 1.1rem;
					letter-spacing: 0.075em;
					padding: 0.5rem 2rem 0.5rem 1rem;
				}
					#relatedLink > ul > li > a::before{
						right: 0.5rem;
					}
	
}
@media screen and (max-width: 480px) {
		#relatedLink > ul{
			padding: 2rem 1rem;
			box-shadow: 0 0 6px #E0F1F7;
		}
			#relatedLink > ul > li + li{
				margin: 2rem auto 0 auto;
			}	
				#relatedLink > ul > li > a{
					font-size: 1rem;
					letter-spacing: 0.05em;
				}
}
@media screen and (max-width: 360px) {
				#relatedLink > ul > li > a{
					font-size: 0.95rem;
					letter-spacing: 0em;
				}
}



	section.aboutSoudan{
		padding: 0rem 2rem 8rem 2rem;
	}
	section + section.aboutSoudan{
		padding: 8rem 2rem;
	}
@media screen and (max-width: 960px) {
	section.aboutSoudan{
		padding: 0rem 2rem 7rem 2rem;
	}
	section + section.aboutSoudan{
		padding: 7rem 2rem;
	}
}
@media screen and (max-width: 768px) {
	section.aboutSoudan{
		padding: 0rem 2rem 6rem 2rem;
	}
	section + section.aboutSoudan{
		padding: 6rem 2rem;
	}
}
@media screen and (max-width: 640px) {
	section.aboutSoudan{
		padding: 0rem 2rem 5rem 2rem;
	}
	section + section.aboutSoudan{
		padding: 5rem 2rem;
	}
}
@media screen and (max-width: 960px) {
	section.aboutSoudan{
		padding: 0rem 2rem 4rem 2rem;
	}
	section + section.aboutSoudan{
		padding: 4rem 2rem;
	}
}

		section.aboutSoudan > header{
			border-bottom: 1px solid #98A6B5;
			padding: 0 0 1.5rem 0;
			margin: 0 0 3rem 0;
		}
			section.aboutSoudan > header > h2{
				font-size: 2.5rem;
				font-weight: 500;
				line-height: 1.4;
				letter-spacing: 0.05em;
			}
@media screen and (max-width: 960px) {
		section.aboutSoudan > header{
			padding: 0 0 1.5rem 0;
			margin: 0 0 2.75rem 0;
		}
			section.aboutSoudan > header > h2{
				font-size: 2.25rem;
			}
}
@media screen and (max-width: 768px) {
		section.aboutSoudan > header{
			padding: 0 0 1.25rem 0;
			margin: 0 0 2.5rem 0;
		}
			section.aboutSoudan > header > h2{
				font-size: 2rem;
			}
}
@media screen and (max-width: 640px) {
		section.aboutSoudan > header{
			padding: 0 0 1.25rem 0;
			margin: 0 0 2.25rem 0;
		}
			section.aboutSoudan > header > h2{
				font-size: 1.75rem;
			}
}
@media screen and (max-width: 480px) {
		section.aboutSoudan > header{
			padding: 0 0 1rem 0;
			margin: 0 0 2rem 0;
		}
			section.aboutSoudan > header > h2{
				font-size: 1.5rem;
			}
}

		section.aboutSoudan > p{
			text-align: center;
			font-size: 1.5rem;
			line-height: 1.8;
			letter-spacing: 0.05em;
			word-break: keep-all;
		}
		section.aboutSoudan > ul{
			margin: 1.5rem auto;
		}
			section.aboutSoudan > ul > li{
				text-align: center;
			}
			section.aboutSoudan > ul > li + li{
				margin: 0.5rem 0 0 0;
			}

@media screen and (max-width: 960px) {
		section.aboutSoudan > p{
			font-size: 1.44rem;
		}
}
@media screen and (max-width: 768px) {
		section.aboutSoudan > p{
			font-size: 1.33rem;
		}	
}
@media screen and (max-width: 640px) {
		section.aboutSoudan > p{
			font-size: 1.25rem;
		}	
}
@media screen and (max-width: 480px) {
		section.aboutSoudan > p{
			font-size: 1.2rem;
		}	
}
		section.aboutSoudan > section{
			margin: 5rem auto;
		}
			section.aboutSoudan > section > header{
				margin: 0 0 2.5rem 0;
			}
				section.aboutSoudan > section > header > h3{
					font-size: 2rem;
					font-weight: 500;
					letter-spacing: 0.05em;
					line-height: 1.2;
				}

			section.aboutSoudan > section > ul{
				display: grid;
				grid-template-columns: repeat(3, 1fr);
				column-gap: 3rem;
				grid-template-rows:1fr;
				row-gap: 0;
				
			}
				section.aboutSoudan > section > ul > li{
					padding: 2.5rem 2rem;
					box-shadow: 0 0 20px #E0F1F7;
					background: white;
				}


			section.aboutSoudan > section > p{
					font-size: 1.5rem;
					font-weight: 500;
					letter-spacing: 0.05em;
					text-align: center;
					margin: 2rem 0 0 0;
					word-break: keep-all;
			}


@media screen and (max-width: 960px) {
				section.aboutSoudan > section > header > h3{
					font-size: 1.75rem;
				}
			section.aboutSoudan > section > p{
					font-size: 1.4rem;
			}
			section.aboutSoudan > section > ul{
				column-gap: 2rem;
			}
				section.aboutSoudan > section > ul > li{
					padding: 2rem 1.5rem;
				}

}
@media screen and (max-width: 768px) {
				section.aboutSoudan > section > header > h3{
					font-size: 1.5rem;
				}
			section.aboutSoudan > section > p{
					font-size: 1.3rem;
			}
			section.aboutSoudan > section > ul{
				column-gap: 1.5rem;
			}
				section.aboutSoudan > section > ul > li{
					padding: 1.5rem 1.25rem;
				}

}
@media screen and (max-width: 640px) {
				section.aboutSoudan > section > header > h3{
					font-size: 1.44rem;
				}
			section.aboutSoudan > section > p{
					font-size: 1.2rem;
			}
			section.aboutSoudan > section > ul{
				grid-template-columns: 1fr;
				column-gap: 0;
				grid-template-rows: repeat(3, auto);
				row-gap: 1.5rem;
			}
}
@media screen and (max-width: 480px) {
				section.aboutSoudan > section > header > h3{
					font-size: 1.25rem;
				}
			section.aboutSoudan > section > p{
					font-size: 1.1rem;
			}
}







	/*

	section.form{
		position: relative;
		padding: 8rem 2rem;
	}
		section.form::before{
			position: absolute;
			content: '';
			height: 145px;
			width: 100%;
			top: 0;
			left: 0;
			z-index: -1;
			background: linear-gradient(180deg, #E0F1F7, #ffffff);
		}
		*/


		section.form > header{
			margin: 0 0 3rem 0;
		}
			section.form > header > h2{
				font-size: 2em;
				font-weight: 500;
			}
			section.form > header > small{
				display: block;
				font-family: 'Noto Sans JP', sans-serif;
				font-size: 0.9em;
				font-weight: 400;
				margin: 1.5rem 0 0 0;
			}

			section.form .red{
				color: firebrick;
			}

		section.form > form{
			background: rgba(255,255,255,0.8);
			box-shadow: 0 0 30px #E0F1F7;
			padding: 4rem 2rem;
		}

		section.form > form table{
			width: 100%;
			max-width: 760px;
			margin: 0 auto;
		}
			section.form > form table th{
				padding: 0 0 2rem 0;
				font-weight: 500;
				font-family: 'Noto Sans JP', sans-serif;
				vertical-align: middle;
				word-break: keep-all;
				min-width: 10em;
			}

			section.form > form table td{
				padding: 0 0 2rem 2rem;
				font-family: 'Noto Sans JP', sans-serif;
			}
			section.form > form table tr + tr th{
				border-top: 1px solid #CCE2EE;
				padding: 2rem 0;
			}

			section.form > form table tr + tr td{
				border-top: 1px solid #CCE2EE;
				padding: 2rem 0 2rem 2rem;
			}

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

		section.form > form{
			box-shadow: 0 0 30px #E0F1F7;
			padding: 2rem;
		}

			section.form > form table th,
			section.form > form table td{
				display: block !important;
			}
			section.form > form table th{
				padding: 0 !important;
				min-width: none !important;
			}
			section.form > form table tr + tr th{
				padding: 1.5rem 0 0 0 !important;
			}
			section.form > form table td{
				border: none !important;
				padding: 1rem 0 1.5rem 1rem !important;
			}

	
	
}







			section.form > form menu{
				max-width: 760px;
				margin: 2rem auto 0 auto;
				width: 100%;
				display: flex;
				justify-content: center;
				flex-direction: row-reverse;
			}
				section.form > form menu li{
					max-width: 360px;
					min-width: 144px;
					margin: 0 0.5rem;
				}

				section.form > form menu button[type="submit"],
				section.form > form menu input[type="button"],
				section.form > form menu input[type="submit"]{
					position: relative;
					display: inline-flex;
					justify-content: center;
					align-items: center;
					background: linear-gradient(90deg, #4F8BCA, #193B7D);
					width: 100%;
					max-width: 360px;
					min-width: 128px;
					word-break: keep-all;
					height: 60px;
					border-radius: 30px;
					padding: 0.25rem 2rem;
					color: white;
					font-size: 1.25rem;
					line-height: 1;
					font-family: 'Noto Sans JP', sans-serif;
				}
				section.form > form menu input[value="戻る"]{
					background: #e3d7dd;
					color: #15377c;
				}
				
	section.form input[type="text"],
	section.form textarea{
		position: relative;
		border: 1px solid #CCE2EE;
		padding: 0.75rem 1rem;
		width: 100%;
	}

	section.form select{
		position: relative;
		border: 1px solid #CCE2EE;
		padding: 0.75rem 2rem;
	}
	
	section.form .error{
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 0.9em;
				color: firebrick;
				text-align: center;
		}


	.formSelector{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		column-gap: 5rem;
		grid-template-rows:1fr;
		row-gap: 0;
	}
		.formSelector > li{
			padding: 2.5rem 2rem;
			box-shadow: 0 0 20px #E0F1F7;
			background: white;
			display: grid;
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: 1fr auto;
			row-gap: 2rem;
			place-items: center;
			text-align: center;
			}
			.formSelector > li > span{
				font-size: 1.75rem;
				font-weight: 500;
				letter-spacing: 0.05em;
				line-height: 1.4;
			}
				.formSelector > li a{
					font-size: 1rem !important;
					min-width: 240px !important;
				}

	.formSelector.solo{
		display: block;
	}
		.formSelector.solo > li{
			padding: 2.5rem 2rem;
			box-shadow: 0 0 20px #E0F1F7;
			background: white;
			display: grid;
			grid-template-columns: repeat(2,auto);
			column-gap: 2rem;
			grid-template-rows: 1fr;
			row-gap:0;
			place-items: center;
			text-align: center;
			}

@media screen and (max-width: 960px) {
	.formSelector{
		column-gap: 3rem;
	}
			.formSelector > li > span{
				font-size: 1.5rem;
			}

}
@media screen and (max-width: 768px) {
	.formSelector{
		column-gap: 1rem;
	}
			.formSelector > li > span{
				font-size: 1.44rem;
			}

}
@media screen and (max-width: 720px) {
	.formSelector{
		grid-template-columns:1fr;
		column-gap: 0;
		grid-template-rows: auto;
		row-gap:1.5rem;
	}
		.formSelector > li{
			grid-template-columns: 1fr;
			column-gap: 0;
			grid-template-rows: repeat(2,auto);
			row-gap:1rem;
			}

			.formSelector > li > span{
				font-size: 1.33rem;
			}
}
@media screen and (max-width: 480px) {
	.formSelector{
		row-gap:1rem;
	}
			.formSelector > li > span{
				font-size: 1.25rem;
			}
}