@charset "UTF-8";
/* CSS Document */
.page #billboard .inner01 {
	display: block;
	padding: 0;
	background: transparent;
	position: relative;
}
.page #billboard .inner01 .img01 {
	width: 90%;
	max-width: 579px;
	height: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
	margin: auto;
}
.page #billboard .inner01 .img02 {
	width: 100%;
	height: auto;
}
#contents {
	padding: 0 0 8em;
	overflow: hidden;
}
#section01 {
	padding: 7em 0;
	background: linear-gradient(to bottom right, #ffffff, #efefef);
}
#section01 .inner01 > .txt01 {
	color: #ab9b8b;
	font-size: 125%;
	font-weight: bold;
	text-align: center;
	line-height: 2;
	letter-spacing: 0.4em;
	margin-bottom: 5em;
}
#section01 .inner01 .box01 {
	width: 100%;
	max-width: 1400px;
	margin: auto;
	position: relative;
}
#section01 .inner01 .box01 .imgWrap01 {
	width: 100%;
	max-width: 629px;
	position: relative;
}
#section01 .inner01 .box01 .imgWrap01 span {
	position: absolute;
	bottom: 0;
	right: 0;
	font-size: 62.5%;
	line-height: 1.2;
	padding: 4px 5px;
	color: #fff;
	letter-spacing: 0.15em;
	background: rgba(0,0,0,0.6);
	z-index: 100;
}
#section01 .inner01 .box01 .imgWrap01 img {
}
#section01 .inner01 .box01 .txtWrap01 {
	width: 97%;
	max-width: 700px;
	height: 25em;
	padding: 5em 5em;
	box-sizing: border-box;
	background: linear-gradient(to right, transparent 0%, #fff 25%, #fff 50%, #fff 75%, transparent);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	box-shadow: 0 -9px 12px -12px rgba(0,0,0,0.2), 0 9px 12px -12px rgba(0,0,0,0.2);
}
#section01 .inner01 .box01 .txtWrap01 .ttl01 {
	color: #333;
	font-size: 112.5%;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 1.5;
}
#section01 .inner01 .box01 .txtWrap01 .ttl01:after {
	content: '';
	display: block;
	width: 4em;
	height: 1px;
	background: #333;
	margin: 2em 0;
}
#section01 .inner01 .box01 .txtWrap01 .txt01 {
	font-size: 93.75%;
	line-height: 2;
}
#section01 .inner01 .box01.fix01 {
	max-width: 1400px;
	margin: 5em auto 0;
}
#section01 .inner01 .box01.fix01 .imgWrap01 {
	max-width: 840px;
	margin: 0 0 0 auto;
}
#section01 .inner01 .box01.fix01 .txtWrap01 {
	left: 0;
	right: auto;
	padding: 5em 4em;
	background: linear-gradient(to right, transparent 0%, #fff 15%, #fff 50%, #fff 85%, transparent);
}
#section02 {
	padding: 5em 0 15em;
}
#section02 .inner01 {
	max-width: 1000px;
	margin: auto;
}
#section02 .inner01 > .txt01 {
	color: #ab9b8b;
	font-size: 125%;
	font-weight: bold;
	text-align: center;
	line-height: 2;
	letter-spacing: 0.2em;
	margin-bottom: 3.0em;
}
#section02 .inner01 .img01 {
	margin-bottom: 6em;
}
#section02 .inner01 ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#section02 .inner01 ul li {
	width: 48%;
	margin-bottom: 2%;
	position: relative;
}
#section02 .inner01 ul li:nth-child(7),
#section02 .inner01 ul li:nth-child(8) {
	width: 100%;
}
#section02 .inner01 ul li:nth-child(8) .txtWrap01 {
	width: 30%;
}
#section02 .inner01 ul li .ttl01 {
	font-weight: bold;
	text-indent: -2em;
	line-height: 1.5;
	margin-bottom: 1em;
	padding-left: 2em;
}
#section02 .inner01 ul li .ttl01 span {
	display: inline-block;
	color: #fff;
	line-height: 1.5;
	text-indent: 0;
	text-align: center;
	width: 1.5em;
	margin-right: 0.5em;
	background: #ef7805;
}
#section02 .inner01 ul li .txt01 {
	font-size: 87.5%;
	line-height: 1.5;
	margin-bottom: 1em;
}
#section02 .inner01 ul li:nth-child(2) img {
	max-width: 420px;
	margin: 3em auto 0;
}
#section02 .inner01 ul li:nth-child(8) img {
	width: 66%;
	max-width: 627px;
	position: absolute;
	top: 0;
	right: 0;
}

@media only screen and (max-width: 1200px) {
	#section01 .inner01 .box01 {
		padding-bottom: 20em;
	}
	#section01 .inner01 .box01 .txtWrap01 {
    top: 40em;
	}
	#section01 .inner01 .box01 .imgWrap01 span {
		top: 0;
		bottom: auto;
	}
	#section01 .inner01 .box01.fix01 .txtWrap01 {
    top: 20em;
	}
	#section01 .inner01 .box01.fix01 .imgWrap01 {
		margin-right: -20%;
	}
}

@media only screen and (max-width: 960px) {
	#contents {
    padding: 0 0 5em;
	}
	#section01 .inner01 {
		width: 94%;
		padding: 0 3%;
	}
	#section02 .inner01 {
		width: 94%;
		padding: 5em 3%;
	}
	#section01 .inner01 .box01 .txtWrap01 {
		height: 23em;
		padding: 3em 2em;
    background: #fff;
    top: 18em;
    right: -3%;
	}
	#section01 .inner01 .box01 .txtWrap01 .ttl01:after {
    margin: 1em 0;
	}
	#section01 .inner01 .box01 .imgWrap01 img {
    margin-left: -3%;
	}
	#section01 .inner01 .box01 .imgWrap01 span {
    right: 3%;
	}
	#section01 .inner01 .box01.fix01 {
    margin: 1em 0 5em;
	}
	#section01 .inner01 .box01.fix01 .txtWrap01 {
		height: 21.5em;
		padding: 3em 2em;
    background: #fff;
    top: 33em;
    left: -3%;
	}
	#section01 .inner01 .box01.fix01 .txtWrap01 .ttl01:after {
    margin: 1em 0;
	}
	#section01 .inner01 .box01 .txtWrap01 .txt01 {
    font-size: 100%;
	}
	#section01 .inner01 .box01.fix01 .imgWrap01 {
    margin-right: 0;
	}
	#section01 .inner01 .box01.fix01 .imgWrap01 img {
    margin: 0;
	}
	#section01 .inner01 .box01.fix01 .imgWrap01 span {
    top: auto;
		right: -3%;
    bottom: 0;
	}
}
@media (min-width: 768px) {
}
@media only screen and (max-width: 767px) {
	#contents {
    padding: 0 0 3em;
	}
	#section01 {
    padding: 4em 0;
	}
	#section01 .inner01 > .txt01 {
    letter-spacing: 0.2em;
    margin-bottom: 2em;
	}
	#section02 {
    padding: 0;
	}
	#section02 .inner01 .img01 {
    margin-bottom: 3em;
	}
	#section02 .inner01 > .txt01 {
    letter-spacing: 0;
	}
	#section02 .inner01 ul {
    display: block;
	}
	#section02 .inner01 ul li {
		width: 100%;
		margin-bottom: 6%;
	}
	#section02 .inner01 ul li .ttl01 {
    font-size: 125%;
	}
	#section02 .inner01 ul li .txt01 {
    font-size: 100%;
	}
	#section02 .inner01 ul li:nth-child(8) .txtWrap01 {
    width: 100%;
	}
	#section02 .inner01 ul li:nth-child(8) img {
    width: 100%;
    max-width: 100%;
    position: static;
	}
}
@media only screen and (max-width: 400px) {
}
@media only screen and (max-width: 768px) and (orientation: landscape) {
}