@charset "utf-8";
/* --------------------------------------------
 * TOPページ
 * ----------------------------------------- */
 
/* はじめに
---------------------------------------------*/
/* フォント */
.welcome {
	font-family: 'Shippori Mincho B1', serif;
	font-size: 1.8rem;
}
.welcome .top-midashi {
	margin-top: 100px;
	font-size: 2.4rem;
}
.welcome .top-midashi+.honbun {
	margin-top: 2.5em;
}
.welcome .honbun {
	line-height: 2.5;
}
/* 一段目 */
.welcome01 .box {
	margin: 0 auto;
	width: 65%;
}
.welcome01 .box .image img {
	width: 100%;
}
/* 二段目 */
.welcome02 {
	margin-top: 75px;
	position: relative;
}
.welcome02 .image {
	position: absolute;
	top: 0;
	left: 56.875%;
}
.welcome02 .box {
	margin-bottom: 75px;
	width: 46.875%;
}

@media (max-width: 960px) {
.welcome02 {
	margin-bottom: 75px;
	min-height: 416px;/* 写真の高さ */
}
.welcome02 .box {
	margin-bottom: 0;
}
}

@media (max-width: 640px) {
.welcome02 .image {
	position: static;
	top: auto;
	left: auto;
}
.welcome02 .image img {
	margin-top: 20px;
	width: 100%;
}
.welcome02 .box {
	width: 100%;
}
}
/* 三段目 */
.welcome03 {
	padding-top: 150px;
	padding-bottom: 75px;
	background: #f3f5dd;
}

@media (max-width: 960px) {
.welcome03 {
	padding-top: 75px;
}
}
/* 四段目 */
.welcome04 {
	margin-top: 75px;
}
/* 五段目 */
.welcome05 {
	margin-top: 75px;
	position: relative;
}
.welcome05 .image {
	position: absolute;
	top: 0;
	right: 56.875%;
}
.welcome05 .box {
	margin-left: 53.125%;
	margin-bottom: 48px;/* 行間によるズレ27px分を差し引く */
	width: 46.875%;
}

@media (max-width: 960px) {
.welcome05 {
	margin-bottom: 75px;
	min-height: 416px;/* 写真の高さ */
}
.welcome05 .box {
	margin-bottom: 0;
}
}

@media (max-width: 640px) {
.welcome05 .image {
	position: static;
	top: auto;
	right: auto;
}
.welcome05 .image img {
	margin-top: 20px;
	width: 100%;
}
.welcome05 .box {
	margin-left: 0;
	width: 100%;
}
}
/* 六段目 */
.welcome06 {
	padding-top: 100px;
	padding-bottom: 100px;
	background: url("../img/welcome03_bg.jpg") no-repeat center center;
	background-size: cover;
}

@media (max-width: 960px) {
.welcome06 {
	padding-top: 75px;
}
}
.welcome .signature {
	margin-top: 2.5em;
	line-height: 1.5;
	text-align: right;
}
.welcome .signature span {
	font-size: 1.5rem;
}
.welcome .signature strong {
	font-size: 2.4rem;
	font-weight: normal;
}
/* INFORMATION
---------------------------------------------*/
/* 背景 */
.info {
	padding-bottom: 150px;
	background: #aaa878;
}
.info .top-content-title {
	padding-top: 150px;
}
/* フィード：レイアウト */
#feed {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#feed dl {
	width: 30%;
}
#feed dl:nth-of-type(n+4) {
	margin-top: 50px;
}
#feed dt, #feed dd {
	width: 100%;
}
#feed dt img {
	width: 100%;
}

@media (max-width: 767px) {
#feed dl {
	width: 100%;
}
#feed dl:not(:first-of-type) {
	margin-top: 50px;
}
}
/* フィード：テキスト */
#feed dd {
	margin-top: 10px;
}
#feed dd a, .info .honbun a {
	color: #fff;
}
#feed dd a:hover, .info .honbun a:hover {
	color: #fff;
	text-decoration: none;
}
/* 記事一覧へのリンク */
.info .honbun {
	margin-top: 1.875em;
	text-align: right;
}
.info .honbun a::after {
	content: "≫";
}

/* 動画
---------------------------------------------*/
/* レイアウト */
.movie .box {
	margin: 0 auto;
}
@media (max-width: 960px) {
.movie iframe {
	width: 100%;
}
}
@media (max-width: 640px) {
.movie iframe {
	height: 315px;
}
}

/* フューチャーエリア
---------------------------------------------*/
/* レイアウト */
.featured-content {
	margin-top: 100px;
	position: relative;
}
.featured-content .inner {
	height: 600px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;/* 縦中央 */
}
.featured-content .box {
	width: 60%;
}
.featured-content .image {
	position: absolute;
	top: 0;
	left: 45%;
	z-index: -100;
}
/* レイアウト：About */
.top-about.featured-content .box {
	margin-left: 40%;
	text-align: right;
}
.top-about.featured-content .image {
	left: auto;
	right: 45%;
}
.top-about.featured-content .button {
	margin: 30px 0 0 auto;
}

/* レイアウト：レスポンシブ */
@media (max-width: 1023px) {
.featured-content .image {
	left: 35%;
}
.top-about.featured-content .image {
	right: 35%;
}
}

@media (max-width: 768px) {
.featured-content .box {
	width: 55%;
}
.top-about.featured-content .box {
	margin-left: 45%;
}
.featured-content .image {
	left: 25%;
}
.top-about.featured-content .image {
	right: 25%;
}
}

@media (max-width: 640px) {
.featured-content .inner {
	height: auto;
	align-items: flex-start;/* フレックスアイテムを先頭にまとめる */
}
.featured-content .box {
	width: 100%;
}
.top-about.featured-content .box {
	margin-left: 0;
}
.featured-content .image {
	position: static;
	top: auto;
	left: auto;
	z-index: auto;
}
.top-about.featured-content .image {
	right: auto;
}
.featured-content .image, .top-about.featured-content .image {
	margin: 50px auto 0;
	width: 100%;
}
.featured-content .image img, .top-about.featured-content .image img {
	width: 100%;
}
}
/* 見出し */
.featured-content .top-midashi, .top-connect .top-midashi {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 6.0rem;
	font-weight: 700;
	line-height: 1.2;
}
.featured-content.top-wibio .top-midashi {
	letter-spacing: -0.02em;
}
/* 本文 */
.featured-content .top-midashi+.honbun, .top-connect .top-midashi+.honbun {
	margin-top: 0.5em;
}
/* ボタン */
.featured-content .button {
	margin-top: 30px;
}
/* CONNECT
---------------------------------------------*/
/* 背景 */
.top-connect {
	margin-top: 100px;
	min-height: 427px;
	color: #fff;
	background: #0d0d0d;
}
/* レイアウト */
.top-connect .inner {
	position: relative;
}
.top-connect .box {
	margin-left: 50%;
	padding-left: 10%;
	padding-top: 70px;
	width: 50%;
}
.top-connect .image {
	position: absolute;
	top: 0;
	right: 50%;
}

@media (max-width: 768px) {
.top-connect .box {
	margin-left: 0;
	padding-left: 0;
	width: 100%;
}
.top-connect .image {
	margin: 50px auto 0;
	padding-bottom: 100px;
	position: static;
	top: auto;
	right: auto;
}
.top-connect .image img {
	width: 100%;
}
}
/* ボタン */
.top-connect .button {
	margin: 30px 0 0 auto;
	border: 3px solid #fff;
}
.top-connect .button a {
	color: #fff;
}
