/* CSS Document */

html{
	line-height: 100%;
	-webkit-text-size-adjust:100%;
	}

body{
	color: #333;
	fill: #333;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	font-size: 1.6rem;
	line-height: 1.6em;
	text-align: justify;
	font-feature-settings : "palt";
	}

a{
	color: #425377;
	fill: #425377;
	text-decoration: underline;
	transition-property: color,background-color,background-size,border-color,box-shadow,opacity;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	}
	a:hover,
	a:active{
		color: #868fda;
		fill: #868fda;
		}
	a svg{
		transition-property: fill,opacity;
		transition-duration: 0.2s;
		transition-timing-function: ease-out;
		}

img{
	max-width: 100%;
	height: auto;
	vertical-align: top;
	}

svg{
	width: 1em;
	height: 1em;
	}

article{}
	article header,
	article footer{
		text-align: center;
		}

#wrapper{
	width: 100%;
	opacity: 0;
	transition: opacity 0.2s ease-out;
	}
	.done #wrapper{
		opacity: 1;
		}

#siteName{}
	#siteName a{
		position: relative;
		padding-left: 5em;
		color: #333;
		font-family: "Noto Sans JP";
		font-weight: 500;
		text-decoration: none;
		}
		#siteName a:hover,
		#siteName a:active{
			color: #425377;
			}
	#siteName svg{
		position: absolute;
		left: 0;
		top: calc(50% - 0.75em);
		width: 4.66em;
		height: 1.5em;
		}

#gNav{}
	#gNav ul{
		list-style: none;
		}
	#gNav li{
		position: relative;
		font-weight: bold;
		}
	#gNav a{
		display: block;
		line-height: 1em;
		text-decoration: none;
		}
	#gNav i{
		margin-right: 1.2em;
		}
		#gNav i svg{
			position: absolute;
			top: calc(50% - 0.5em);
			}

#subject{
	text-align: center;
	}

#pagination{
	overflow: hidden;
	}
	#pagination ul,
	#pagination ol{
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		list-style: none;
		width: calc(100% + 0.4em);
		margin: -0.2em;
		}
	#pagination li{
		margin: 0.2em;
		text-align: center;
		}
	#pagination a{
		position: relative;
		display: block;
		padding: 0.8em;
		text-decoration: none;
		background: #425377;
		color: #fff;
		fill: #fff;
		line-height: 1em;
		}
		#pagination a:hover,
		#pagination a:active{
			background: #868fda;
			}
	#pagination i{
		position: absolute;
		top: calc(50% - 0.5em);
		}
	#pagination [rel]{
		position: relative;
		}
	#pagination [rel="prev"]{
		padding-left: 1.8em;
		}
		#pagination [rel="prev"] i{
			left: 0.5em;
			transform: scale(-1, 1);
			}
	#pagination [rel="next"]{
		padding-right: 1.8em;
		}
		#pagination [rel="next"] i{
			right: 0.5em;
			}
	#pagination .lsc-current-page{
		background: #ccc;
		color: #fff;
		}

#footer{
	background-color: #e6e6e6;
	background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiDQoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOmE9Imh0dHA6Ly9ucy5hZG9iZS5jb20vQWRvYmVTVkdWaWV3ZXJFeHRlbnNpb25zLzMuMC8iDQoJIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTBweCIgaGVpZ2h0PSIxMHB4IiB2aWV3Qm94PSIwIDAgMTAgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDEwIDEwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KCS5zdDB7ZmlsbDojRkZGRkZGO30NCjwvc3R5bGU+DQo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMCwwdjRsNC00SDB6IE0wLDEwaDRsNi02VjBMMCwxMHoiLz4NCjwvc3ZnPg==');
	background-size: 5px;
	border-top: 1px solid #ccc;
	}

#fAddress{
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	}
	#fAddress address{
		margin-right: auto;
		}
	#fAddress dt{
		display: block;
		color: #425377;
		font-family: "Noto Sans JP";
		font-weight: 500;
		}
	#fAddress dd{
		float: left;
		margin-top: 0.5em;
		line-height: 1.2em;
		}
		#fAddress dd:nth-of-type(odd){
			clear: both;
			}
		#fAddress dd:nth-of-type(even){
			margin-left: 0.5em;
			}
	#fAddress p{
		text-align: center;
		}
		#fAddress p a{
			display: inline-block;
			padding: 0.5em 2em;
			background: #fff;
			border: 1px solid #ccc;
			color: #000;
			font-size: 0.8em;
			font-weight: bold;
			text-decoration: none;
			text-align: center;
			line-height: 1em;
			}
			#fAddress p a:hover,
			#fAddress p a:active{
				border-color: #425377;
				}
		#fAddress p svg{
			width: 10em;
			height: 2.8em;
			margin-bottom: 0.5em;
			}
	#fAddress p+div{
		text-align: center;
		line-height: 1em;
		}
		#fAddress p+div span{
			display: block;
			font-size: 0.5em;
			font-weight: 700;
			}

#copyright{
	padding: 1em 0;
	background: #000;
	}
	#copyright p{
		margin: 0;
		padding: 0;
		color: #fff;
		font-size: 0.7em;
		line-height: 1em;
		text-align: center;
		}

#pageTop{
	text-align: center;
	}
	#pageTop a{
		display: block;
		width: 1em;
		height: 1em;
		margin: auto;
		background: #ce5a4a;
		border-radius: 100%;
		fill: #fff;
		}
		#pageTop a:hover,
		#pageTop a:active{
			background: #d87b6e;
			}
	#pageTop svg{
		width: 0.7em;
		height: 0.95em;
		vertical-align: top;
		}

.wrap{
	width: calc(100% - 2em);
	margin: auto;
	}

.flex{
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	}

.headline{
	position: relative;
	display: inline-block;
	padding-bottom: 1em;
	font-weight: bold;
	text-align: center;
	line-height: 1.4em;
	}
	.headline:before{
		content: "";
		position: absolute;
		left: 50%;
		bottom: 0.2em;
		width: 0;
		border-bottom: 0.1em solid #ce5a4a;
		transition: all 0.2s ease-out;
		}
	.headline.done:before{
		left: 0;
		width: 100%;
		}
	.headline+*{
		margin-top: 1em;
		}

.title{
	color: #425377;
	font-weight: bold;
	line-height: 1.4em;
	}
	.title+*{
		margin-top: 1em;
		}

.linkBut{
	position: relative;
	display: inline-block;
	padding: 1em 1.5em;
	background: #425377;
	color: #fff;
	fill: #fff;
	font-weight: bold;
	line-height: 1em;
	text-align: center;
	text-decoration: none;
	}
	.linkBut:hover,
	.linkBut:active{
		background: #868fda;
		color: #fff;
		fill: #fff;
		}
	.linkBut i{
		margin-right: 1.2em;
		}
	.linkBut svg{
		position: absolute;
		top: calc(50% - 0.5em);
		}
	.linkBut.min{
		padding: 0.8em;
		background: none;
		border: 1px solid #425377;
		color: #425377;
		fill: #425377;
		font-size: 0.9em;
		}
		.linkBut.min:hover,
		.linkBut.min:active{
			background: none;
			border-color: #868fda;
			color: #868fda;
			fill: #868fda;
			}
	.linkBut.more{
		font-size: 1.1em;
		}
		.linkBut.more i{
			float: right;
			margin-right: 0.5em;
			}

.thumb{}
.thumbBox{
	position: relative;
	display: block;
	width: 100%;
	margin: 0;
	padding: 100% 0 0 0;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	background-color: #eee;
	}
	.thumbBox img{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiDQoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOmE9Imh0dHA6Ly9ucy5hZG9iZS5jb20vQWRvYmVTVkdWaWV3ZXJFeHRlbnNpb25zLzMuMC8iDQoJIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTBweCIgaGVpZ2h0PSIxMHB4IiB2aWV3Qm94PSIwIDAgMTAgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDEwIDEwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KCS5zdDB7ZmlsbDojRkZGRkZGO30NCjwvc3R5bGU+DQo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMCwwdjRsNC00SDB6IE0wLDEwaDRsNi02VjBMMCwxMHoiLz4NCjwvc3ZnPg==');
		background-size: 5px;
		object-fit: contain;
		object-position: center;
		}


/* for mobile */
@media (max-width: 767px) {
/*767px以下*/
main > *,
article{
	padding: 2em 0;
	}
	article header{
		margin-bottom: 2em;
		}
	article section{
		margin-top: 2em;
		}
	article footer{
		margin-top: 2em;
		}
#gNav{}
	#gNav a{
		padding: 1em;
		}
#pagePath{
	display: none;
	}
#pageTop{
	padding: 1.5em 0;
	}
	#pageTop a{
		font-size: 3em;
		}
#fAddress{
	padding: 1em 0;
	}
	#fAddress dt{
		font-size: 1.2em;
		}
.headline{
	font-size: 1.6em;
	}
.title{
	font-size: 1.2em;
	}
}
@media (max-width: 767px) and (orientation:portrait) {
/*767px以下 縦向き*/
html{
	font-size: 2.8vw;
	}
#wrapper{}
	.nav #wrapper > *{
		left: -60vw;
		}
#header{
	height: 18vw;
	}
#siteName{
	font-size: 5.5vw;
	line-height: 18vw;
	}
#navButton{
	font-size: 18vw;
	z-index: 100;
	}
	#navButton span{
		height: 0.8vw;
		}
#gNav{}
	.nav #gNav ul{
		width: 60vw;
		left: 40vw;
		}
	#gNav ul{
		padding-top: 18vw;
		}
#fAddress{
	display: block;
	}
	#fAddress dl{
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		-ms-flex-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		}
	#fAddress dt{
		width: 100%;
		text-align: center;
		}
	#fAddress dd{
		float: none;
		}
	#fAddress p{
		margin-top: 1em;
		}
	#fAddress p+div{
		display: none;
		}
}
@media (max-width: 767px) and (orientation:landscape) {
/*767px以下 横向き*/
html{
	font-size: 1.5vw;
	}
#wrapper{}
	.nav #wrapper > *{
		left: -40vw;
		}
#header{
	height: 8vw;
	}
#siteName{
	font-size: 3vw;
	line-height: 8vw;
	}
#navButton{
	font-size: 8vw;
	}
	#navButton span{
		height: 0.4vw;
		}
#gNav{}
	.nav #gNav ul{
		left: 60vw;
		width: 40vw;
		padding-top: 8vw;
		}
#fAddress{}
	#fAddress p+div{
		width: 3.5em;
		}
}


/* for tablet */
@media (min-width: 768px) {
/*768px以上*/
html{
	font-size: 62.5%;
	}
#pagePath{}
	#pagePath a{
		font-weight: normal;
		}
		#pagePath a:hover,
		#pagePath a:active{
			text-decoration: none;
			}
	#pagePath ul{
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		list-style: none;
		}
	#pagePath li{
		position: relative;
		padding-right: 1.5em;
		font-size: 0.8em;
		line-height: 1.2em;
		}
	#pagePath i{
		position: absolute;
		top: 0.1em;
		right: 0.25em;
		opacity: 0.5;
		}
#fAddress{
	padding: 2em 0;
	}
	#footer dt{
		font-size: 1.4em;
		}
.wrap{
	max-width: 720px;
	}
}
@media (min-width: 768px) and (max-width: 991px) {
/*768px～991px*/
main > *,
article{
	padding: 3em 0;
	}
	article header{
		margin-bottom: 3em;
		}
	article section{
		margin-top: 3em;
		}
	article footer{
		margin-top: 3em;
		}
#wrapper{}
	.nav #wrapper > *{
		left: -40vw;
		}
#header{
	height: 10vw;
	}
#siteName{
	line-height: 10vw;
	}
	#siteName a{
		font-size: 1.8em;
		}
#navButton{
	font-size: 10vw;
	}
	#navButton span{
		height: 0.4vw;
		}
#gNav{}
	.nav #gNav ul{
		left: 60vw;
		width: 40vw;
		padding-top: 10vw;
		}
	#gNav a{
		padding: 1.2em;
		font-size: 1.2em;
		}
#pagePath{
	padding-top: 2em;
	}
#pageTop{
	padding: 2em 0;
	}
	#pageTop a{
		font-size: 4em;
		}
.headline{
	font-size: 2.1em;
	}
.title{
	font-size: 1.3em;
	}
}
@media (max-width: 991px) {
/*991px以下*/
#wrapper{
	overflow: hidden;
	}
	#wrapper > *{
		position: relative;
		width: 100%;
		left: 0;
		transition-property: left,opacity;
		transition-duration: 0.2s;
		transition-timing-function: ease-out;
		}
#header{
	padding-left: 1em;
	}
#siteName{
	position: relative;
	z-index: 1;
	}
#navButton{
	position: fixed;
	top: 0;
	right: 0;
	width: 0.8em;
	height: 0.8em;
	margin: 0.1em;
	padding: 0;
	padding-top: 0.4em;
	background: rgba(255,255,255,0.7);
	border: none;
	border-radius: 100%;
	color: #425377;
	text-align: center;
	z-index: 100;
	transition-property: left,background,color,z-index;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
	}
	.nav #navButton{
		background: rgba(255,255,255,0.3);
		color: #fff;
		z-index: 1000;
		}
		.nav #navButton span{
			background: #fff;
			}
		.nav #navButton span:nth-child(1){
			top: 39%;
			transform: rotate(-45deg);
			-moz-transform: rotate(-45deg);
			-webkit-transform: rotate(-45deg);
			}
		.nav #navButton span:nth-child(2){
			left: 150%;
			}
		.nav #navButton span:nth-child(3){
			top: 39%;
			transform: rotate(45deg);
			-moz-transform: rotate(45deg);
			-webkit-transform: rotate(45deg);
			}
	#navButton div{
		display: block;
		font-family: Lato, sans-serif;
		font-size: 0.14em;
		font-weight: 700;
		text-transform: uppercase;
		line-height: 1em;
		}
	#navButton span{
		position: absolute;
		content: "";
		display: block;
		left: 25%;
		width: 50%;
		background: #425377;
		transition: all 0.2s ease-out;
		}
		#navButton span:nth-child(1){
			top: 24%;
			}
		#navButton span:nth-child(2){
			top: 39%;
			}
		#navButton span:nth-child(3){
			top: 54%;
			}
#gNav{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	opacity: 0;
	transition-property: opacity,left,z-index;
	transition-duration: 0.2s;
	transition-timing-function: ease-out;
	}
	.nav #gNav{
		background: rgba(0,0,0,0.1);
		opacity: 1;
		z-index: 100;
		}
	#gNav ul{
		position: fixed;
		left: 100vw;
		height: 100vh;
		text-align: left;
		background: #425377;
		border-left: 1px solid #fff;
		transition: left 0.2s ease-out;
		}
		#gNav ul:before{
			position: absolute;
			content: "";
			top: 0;
			left:0;
			width: 100%;
			height: 100%;
			background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiDQoJIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbG5zOmE9Imh0dHA6Ly9ucy5hZG9iZS5jb20vQWRvYmVTVkdWaWV3ZXJFeHRlbnNpb25zLzMuMC8iDQoJIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTBweCIgaGVpZ2h0PSIxMHB4IiB2aWV3Qm94PSIwIDAgMTAgMTAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDEwIDEwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KCS5zdDB7ZmlsbDojRkZGRkZGO30NCjwvc3R5bGU+DQo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMCwwdjRsNC00SDB6IE0wLDEwaDRsNi02VjBMMCwxMHoiLz4NCjwvc3ZnPg==');
			background-size: 5px;
			opacity: 0.1;
			}
	#gNav li{
		position: relative;
		background: #425377;
		border-top: 1px solid rgba(255,255,255,0.5);
		}
		#gNav li:last-child{
			border-bottom: 1px solid rgba(255,255,255,0.5);
			}
	#gNav a{
		color: #fff;
		fill: #fff;
		}
		#gNav a:hover,
		#gNav a:active{
			background: rgba(255,255,255,0.8);
			color: #425377;
			fill: #425377;
			}
	#gNav use+use{
		display: none;
		}
#fAddress{}
	#fAddress p+div{
		margin-left: 1em;
		}
}


/* for PC */
@media (min-width: 992px) {
/*992px以上*/
body{
	font-family: Lato, "Noto Sans JP", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, Meiryo, sans-serif;
	font-weight: 300;
	}
main > *,
article{
	padding: 4em 0;
	}
	article header{
		margin-bottom: 4em;
		}
	article section{
		margin-top: 4em;
		}
	article footer{
		margin-top: 4em;
		}
#header{
	padding-left: 1.5em;
	}
#navButton{
	display: none;
	}
#gNav{
	position: absolute;
	right: 0;
	z-index: 100;
	}
	#gNav ul{
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-ms-flex-pack: end;
		-webkit-justify-content: flex-end;
		justify-content: flex-end;
		padding-right: 12em;
		}
	#gNav li{
		margin-right: 1.5em;
		}
		#gNav li:first-child{
			display: none;
			}
		#gNav li:nth-of-type(5){
			position: absolute;
			right: 0;
			margin-top: -0.9em;
			}
			#gNav li:nth-of-type(5) a{
				padding: 0.8em 1.5em;
				background: none;
				background: #425377;
				color: #fff;
				fill:#fff;
				}
				#gNav li:nth-of-type(5) a:hover,
				#gNav li:nth-of-type(5) a:active{
					background: #868fda;
					}
				#gNav li:nth-of-type(5) a:before{
					content: none;
					}
			#gNav li:nth-of-type(5) i{
				margin-right: 1.5em;
				}
	#gNav a{
		position: relative;
		padding: 0 0 0.5em 0;
		font-weight: 400;
		}
		#gNav a:before{
			content: "";
			position: absolute;
			left: 50%;
			bottom: 0;
			width: 0;
			border-bottom: 0.1em solid #868fda;
			transition: all 0.2s ease-out;
			}
			#gNav a:hover:before,
			#gNav a:active:before{
				left: 0;
				width: 100%;
				}
		#gNav a:hover,
		#gNav a:active{
			background: none;
			}
	#gNav i{
		margin: 0;
		}
	#gNav use:first-child{
		display: none;
		}
#pagePath{
	padding-top: 3em;
	}
#pageTop{
	padding: 3em 0;
	}
	#pageTop a{
		font-size: 4em;
		}
#fAddress{}
	#fAddress p+div{
		margin-left: 2em;
		}
.wrap{
	max-width: 940px;
	}
.headline{
	font-weight: 500;
	line-height: 1em;
	}
.headline{
	font-size: 2.4em;
	}
.title{
	font-size: 1.6em;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
/*992px～1200px*/
#siteName{
	padding: 1.5em 0;
	}
	#siteName a{
		font-size: 1.6em;
		}
#gNav{
	top: 2em;
	}
}
@media (min-width: 1200px) {
/*1200px以上*/
body{
	font-size: 1.8rem;
	line-height: 1.8em;
	}
#siteName{
	padding: 2em 0;
	}
	#siteName a{
		font-size: 1.8em;
		}
#gNav{
	top: 2.4em;
	}
.wrap{
	max-width: 1140px;
	}
}


/* ie */
@media all and (-ms-high-contrast: none){
main{
	display: block;
	}
}


/* animation */
@-webkit-keyframes wrapper {
	0%{opacity: 0}
	100%{opacity: 1}
	}
@keyframes wrapper {
	0%{opacity: 0}
	100%{opacity: 1}
	}


