@charset "utf-8";

#pageBody > section#keyvisual {
	position : relative;
	padding : 0;
	background-image : url(../img/img_keyvisual.jpg);
	background-size : cover;
}
#keyvisual .copy {
	display : flex;
	font-family : "Noto Serif JP";
	font-size : 2.4em;
	line-height : 1.45;
	flex-direction : column;
	justify-content : center;
	height : 760px;
	padding-left : 65vw;
	text-shadow : 0 0 0.1em #000000, 0 0 0.25em #000000, 0 0 0.5em #000000;
	color : #ffffff;
}
#keyvisual .copy span {
	font-family : "Mulish", sans-serif;
	font-size : 0.4em;
	margin-top : 1em;
}

/* policy */
#pageBody > section#policy {
	text-align : center;
	background-color : #ffffff;
}
#policy > .inner > p:not(:last-child) {
	margin-bottom : 1.2em;
}

/* whats */
#pageBody > section#whats {
	background : url(../img/bg_whats.jpg) 0 0 no-repeat;
	background-size : cover;
}
#whats > .inner > h2 {
	text-align : center;
	text-shadow : 0 0 0.1em #ffffff, 0 0 0.2em #ffffff, 0 0 0.35em #ffffff,
	0 0 0.4em #ffffff, 0 0 0.5em #ffffff, 0 0 0.75em #ffffff;
}
#whats > .inner > .content > .leadTxt {
	font-size : 1.2em;
}
#whats > .inner > .content > p:not(:last-child) {
	margin-bottom : 1.2em;
	text-shadow : 0 0 0.1em #ffffff, 0 0 0.2em #ffffff, 0 0 0.35em #ffffff,
	0 0 0.4em #ffffff, 0 0 0.5em #ffffff, 0 0 0.75em #ffffff;
}
#whats > .inner .button {
	text-align : center;
}
#whats > .inner .button a {
	display : inline-block;
	padding : 0.8em 1.4em;
	color : #ffffff;
	background-color : #e8a8a8;
}

/* sitemenu */
#pageBody > section#sitemenu {
	padding : 120px 0;
	background : url(../img/bg_sitemenu.jpg) 0 0 #eae3e3 no-repeat;
	background-size : contain;
}

#sitemenu > ul {
	display : grid;
	grid-template-columns : 1fr 1fr;
	grid-gap : 32px;
}
#sitemenu > ul > li {
	display : flex;
	flex-direction : column;
	padding : 60px 32px;
	color : #000000;
	background-color : #ffffff;
	background-position : 50%;
	background-size : cover;
	box-shadow : 0 0 2px rgba(0, 0, 0, 0.2);
}
#sitemenu > ul > li:nth-child(1) {
	background-image : url(../img/bg_sitemenu_01.jpg);
}
#sitemenu > ul > li:nth-child(2) {
	background-image : url(../img/bg_sitemenu_02.jpg);
}
#sitemenu > ul > li:nth-child(3) {
	background-image : url(../img/bg_sitemenu_03.jpg);
}
#sitemenu > ul > li:nth-child(4) {
	background-image : url(../img/bg_sitemenu_04.jpg);
}
#sitemenu > ul > li h3 {
	font-family : "Noto Serif JP";
	font-size : 1.8em;
	text-shadow : 0 0 1px #ffffff, 0 0 2px #ffffff, 0 0 2px #ffffff, 0 0 2px #ffffff,
	0 0 2px #ffffff, 0 0 4px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff,
	0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff,
	0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff;
}
#sitemenu > ul > li h3 .caption {
	display : inline-block;
	font-size : 0.7em;
	text-indent : -0.6em;
}
#sitemenu > ul > li h3 .eng {
	display : inline-block;
	font-size : 0.5em;
	margin-top : 0.4em;
}
#sitemenu > ul > li .txt {
	line-height : 1.45;
	flex-grow : 1;
	margin-bottom : 1em;
	text-shadow : 0 0 1px #ffffff, 0 0 2px #ffffff, 0 0 2px #ffffff, 0 0 2px #ffffff,
	0 0 2px #ffffff, 0 0 4px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff,
	0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff,
	0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff, 0 0 6px #ffffff;
}

/* company */
#pageBody > section#company {
	background : url(../img/bg_company.jpg) 0 0 no-repeat;
	background-size : cover;
}
#company .txt {
	padding-right : 50%;
}
#company .txt > p {
	margin-bottom : 1em;
}

/* news */
#news > .inner {
	max-width : 976px;
	margin : 0 auto;
	padding : 24px;
}
#news h2 {
	text-align : center;
}
#news ul {
	margin-bottom : 24px;
	border-top : 1px solid #dddddd;
}
#news ul > li {
	display : flex;
	padding : 1em;
	border-bottom : 1px solid #dddddd;
}
#news ul > li .date {
	display : flex;
	flex-basis : 8em;
	align-items : center;
	color : #999999;
}
#news ul > li h3 {
	display : flex;
	flex-grow : 1;
	margin-bottom : 0;
}
#news .link {
	text-align : center;
}



/* --- for 2K or more pc --- */
@media screen and (min-width: 1980px) {
}

/* --- for HD pc --- */
@media screen and (min-width: 1440px) and (max-width: 1979px) {
}

/* --- for normal pc --- */
@media screen and (min-width: 1024px) and (max-width: 1439px) {
}

/* --- for tablet --- */
@media screen and (min-width: 768px) and (max-width: 1023px) {
	#keyvisual .copy {
		height : 420px;
	}
}

/* --- for mobile --- */
@media screen and (max-width: 767px) {
	#keyvisual .copy {
		font-size : 1.6em;
		height : auto;
		min-height : 220px;
		padding : 1em;
	}

	#whats > .inner > .content > p br {
		display : none;
	}
	#pageBody > section#sitemenu {
		padding : 60px 0;
	}
	#sitemenu > ul {
		grid-template-columns : 1fr;
	}

	#company .txt {
		padding-right : 0;
	}

	#news ul > li {
		display : block;
	}
	#news ul > li span.date {
		display : block;
		margin-bottom : 0.2em;
	}
}