@charset "utf-8";
/* --------------------------------------------
 * STORYトビラページ
 * ----------------------------------------- */

/* lead
---------------------------------------------*/
/* 見出し */
.story .lead .content-title {
	font-weight: 600;
	text-align: center;
	line-height: 2;
}
.story .lead .content-title-main {
	font-family: 'Shippori Mincho B1', serif;
	font-size: 2.4rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-align: center;
	line-height: 2;
	color: #023969;
}
/* レイアウト */
.story .lead .inner:nth-of-type(2) {
	margin-top: 100px;
	padding: 50px 0;
	background-color: rgba(2, 99, 162, 0.1);
}
.story .lead .inner:nth-of-type(2) .box {
	margin: 0 auto;
	width: 57.5%;
}

/* tobira
---------------------------------------------*/
/* レイアウト */
.story .tobira .inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
}
.story .tobira .box {
	margin-top: 100px;
	margin-right: 8.125%;
	width: 45.9375%;
}
.story .tobira .box:nth-of-type(2n) {
	margin-right: 0;
}

@media (max-width: 640px) {
.story .tobira .box {
	margin: 100px auto 0;
	width: 100%;
}
.story .tobira .box:nth-of-type(2n) {
	margin: 100px auto 0;
}
}
/* 画像 */
.story .tobira .image img {
	width: 100%;
}
.story .tobira a:hover .image {
	opacity: 0.8;
}
/* 見出し */
.story .tobira .content-title-main {
	margin-top: 30px;
	margin-bottom: 1em;
	font-weight: 500;
}
.story .tobira .content-title-main span {
	font-size: 2.4rem;
}

/* --------------------------------------------
 * STORY中身ページ
 * ----------------------------------------- */
 
/* 共通レイアウト
---------------------------------------------*/
.story-content {
	padding-top: 200px;
}
.story-content .inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.story-content.story02-5 .inner {
	justify-content: flex-end;/* 右寄せ */
}
.story-content .story-title {
	margin-top: 200px;
	margin-bottom: 100px;
	width: 34.375%;
}
.story-content .box {
	width: 57.5%;
}

@media (max-width: 960px) {
.story-content .story-title {
	margin-top: 0;
	width: 100%;
	text-align: center;
}
.story-content .box {
	width: 100%;
}
}
/* 偶数 */
.story-content:nth-of-type(even) .inner {
	flex-direction: row-reverse;
}
.story-content:nth-of-type(even) .story-title {
	text-align: right;
}

@media (max-width: 960px) {
.story-content:nth-of-type(even) .story-title {
	text-align: center;
}
}
/* 画像 */
.story-content .inner {
	position: relative;
}
.story-content .image {
	position: absolute;
	right: 65.625%;
	bottom: 0;
}

@media (max-width: 960px) {
.story-content .image {
	position: static;
	right: auto;
	bottom: auto;
	margin: 50px auto 0;
	text-align: center;
}
.story-content .image img {
	width: 100%;
}
}
/* 画像：右寄せ */
.story-content.story01-4 .image, .story-content.story04-1 .image, .story-content.story04-2 .image {
	right: auto;
	left: 65.625%;
}

@media (max-width: 960px) {
.story-content.story01-4 .image, .story-content.story04-1 .image, .story-content.story04-2 .image {
	left: auto;
}
}

/* ストーリー：コンテンツタイトル
---------------------------------------------*/
.story-title {
	font-family: 'Shippori Mincho B1', serif;
	font-size: 3.6rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 2;
}
.story-title-main {
	margin-top: 50px;
	font-size: 2.4rem;
	font-weight: bold;
	color: #023969;
	padding-bottom: 8px;
	margin-bottom: 12px;
	background: url("../story/img/bar.gif") no-repeat left bottom;
	border-bottom: 1px #ccc solid;
}
.story-title-main:first-of-type {
	margin-top: 0;
}

/* ストーリー：本文
---------------------------------------------*/
.story-content .honbun strong {
	color: #0263a2;
}

/* --------------------------------------------
 * Story01
 * ----------------------------------------- */
 
/* Story01-3
---------------------------------------------*/
/* 背景 */
.story-content.story01-3 {
	margin-top: 200px;
	padding-top: 0;
	background: url("../story/img/story01-3.jpg") no-repeat center top;
	background-size: contain;
}
.story-content.story01-3 .inner-wide {
	padding-top: 200px;
	background-color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 960px), (min-width: 1441px) {
.story-content.story01-3 {
	background: url("../story/img/story01-3.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story01-3 .inner-wide {
	padding-bottom: 200px;
}
}

/* Story01-4
---------------------------------------------*/
/* 背景 */
.story-content.story01-4 {
	padding-top: 0;
	background: url("../story/img/story01-4.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story01-4 .inner-wide {
	padding-top: 200px;
	padding-bottom: 200px;
	background-color: rgba(255, 255, 255, 0.8);
}

/* --------------------------------------------
 * Story02
 * ----------------------------------------- */

/* Story02-1
---------------------------------------------*/
/* 背景 */
.story-content.story02-1 {
	padding-top: 0;
	background: url("../story/img/story02-1.jpg") no-repeat center top;
	background-size: contain;
}
.story-content.story02-1 .inner-wide {
	padding-top: 200px;
	background-color: rgba(255, 255, 255, 0.7);
}

@media (max-width: 960px), (min-width: 1441px) {
.story-content.story02-1 {
	background: url("../story/img/story02-1.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story02-1 .inner-wide {
	padding-bottom: 200px;
}
}

/* Story02-3
---------------------------------------------*/
/* 背景 */
.story-content.story02-3 {
	margin-top: 200px;
	padding-top: 0;
	background: url("../story/img/story02-3.jpg") no-repeat center top;
	background-size: contain;
}
.story-content.story02-3 .inner-wide {
	padding-top: 200px;
	background-color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 960px), (min-width: 1441px) {
.story-content.story02-3 {
	background: url("../story/img/story02-3.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story02-3 .inner-wide {
	padding-bottom: 200px;
}
}

/* Story02-5
---------------------------------------------*/
/* 背景 */
.story-content.story02-5 {
	margin-top: 200px;
	padding-top: 0;
	background: url("../story/img/story02-5.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story02-5 .inner-wide {
	padding-top: 200px;
	padding-bottom: 200px;
	background-color: rgba(255, 255, 255, 0.8);
}

/* --------------------------------------------
 * Story03
 * ----------------------------------------- */

/* Story03-2
---------------------------------------------*/
/* レイアウト */
.story-content.story03-2 .inner:nth-of-type(2) {
	margin-top: 100px;
}
/* 背景 */
.story-content.story03-2 {
	margin-top: 200px;
	padding-top: 0;
	background: url("../story/img/story03-2.jpg") no-repeat center top;
	background-size: contain;
}
.story-content.story03-2 .inner-wide {
	padding-top: 200px;
	background-color: rgba(255, 255, 255, 0.8);
}

@media (max-width: 960px), (min-width: 1441px) {
.story-content.story03-2 {
	background: url("../story/img/story03-2.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story03-2 .inner-wide {
	padding-bottom: 200px;
}
}

/* --------------------------------------------
 * Story04
 * ----------------------------------------- */
 
/* Story04-1
---------------------------------------------*/
/* レイアウト */
.story-content.story04-1 .inner:nth-of-type(2) {
	margin-top: 100px;
}
/* 背景 */
.story-content.story04-1 {
	padding-top: 0;
	background: url("../story/img/story04-1.jpg") no-repeat center top;
	background-size: contain;
}
.story-content.story04-1 .inner-wide {
	padding-top: 200px;
	background-color: rgba(255, 255, 255, 0.7);
}

@media (max-width: 960px), (min-width: 1441px) {
.story-content.story04-1 {
	background: url("../story/img/story04-1.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story04-1 .inner-wide {
	padding-bottom: 200px;
}
}

/* Story04-3
---------------------------------------------*/
/* 背景 */
.story-content.story04-3 {
	margin-top: 200px;
	padding-top: 0;
	background: url("../story/img/story04-3.jpg") no-repeat center top;
	background-size: cover;
}
.story-content.story04-3 .inner-wide {
	padding-top: 200px;
	padding-bottom: 200px;
	background-color: rgba(255, 255, 255, 0.8);
}

/* --------------------------------------------
 * Key Message
 * ----------------------------------------- */
.key-message {
	margin-top: 200px;
}
.key-message .inner {
	padding: 30px 50px;
	min-height: 540px;
	background: #01223f;
	color: #fff;
	position: relative;
}
.key-message-no {
	font-family: 'EB Garamond', serif;
	font-size: 2.4rem;
	font-weight: 600;
	letter-spacing: 0.2em;
}
.key-message-title {
	position: absolute;
	top: 55px;
	right: 50px;
}
.key-message .box {
	position: absolute;
	bottom: 30px;
	left: 50px;
}

@media (max-width: 767px) {
.key-message .inner {
	padding: 30px 5.208333333333333%;
}
.key-message-title {
	position: static;
	top: auto;
	right: auto;
	margin: 50px 5.208333333333333%;
	text-align: center;
}
.key-message .box {
	position: static;
	bottom: auto;
	left: auto;
}
}

@media (max-width: 375px) {
.key-message-title img {
	width: 100%;
}
}
/* ネクストボタン */
.next-button .button {
	background: #0263a2;
}