@charset "utf-8";

/* ======================================================
 * history.css
 * ------------------------------------------------------
 * @media print, screen and (min-width: 768px)
 * - Common
 * - Page Component
 * PC Media Queries
 * @media only screen and (max-width: 767px)
 * - Common
 * - Page Component
====================================================== */

/* ======================================================
 * PC
====================================================== */
@media print, screen and (min-width: 768px) {
	/* ------------------------------------------------------
	 * Common
	------------------------------------------------------ */
	/* ----- MainBody ----- */
	.MainBody {
		overflow: hidden;
	}
	/* ------------------------------------------------------
	 * Page Component
	------------------------------------------------------ */
	/* ----- history-layout ----- */
	.history-layout.type-image .history_inner,
	.history-layout.type-image .history_heading {
		height: 490px;
	}
	.history-layout.type-text .history_inner,
	.history-layout.type-text .history_heading {
	}
	.history-layout {
		margin: 3.75em 0 0;
	}
	.history-layout .history_outer {
		position: relative;
		padding: 120px 0 0;
	}
	.history-layout.type-image .history_outer {
		padding-bottom: 50px;
	}
	.history-layout .history_inner {
		margin: 0 calc(((100vw - 100%) / 2) * -1);
		padding: 0 calc((100vw - 100%) / 2);
		background-color: #c3b9ab;
	}
	.history-layout .history_heading {
		position: relative;
		top: -120px;
		left: 0;
		padding: 35px 0;
		z-index: 2;
	}
	.history-layout.type-image .history_heading {
		width: 618px;
	}
	.history-layout.type-text .history_heading {
		padding-bottom: 45px;
	}
	.history-layout .history_heading::before {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		transform: skewX(-37.5deg);
		width: 500%;
		min-height: 100%;
		background-color: #f1f1f0;
		opacity: 0.85;
		z-index: -1;
	}
	.history-layout.type-image .history_heading::before {
		right: 188px;
	}
	.history-layout.type-text .history_heading::before {
		right: 124px;
	}
	.history-layout .history_heading .heading_title {
		color: #af4b27;
		font-size: 13rem;
		font-weight: 700;
		font-family: Arial, Helvetica, "sans-serif";
		line-height: 1;
	}
	.history-layout .history_heading .heading_text {
		margin: 0.625em 0 0;
	}
	.history-layout.type-image .history_heading .heading_text {
		width: 450px;
	}
	.history-layout.type-text .history_heading .heading_text {
		width: 1000px;
	}
	.history-layout .history_heading .heading_text .text_lead {
		font-size: 2.0rem;
		font-weight: 700;
		line-height: 1.8;
	}
	.history-layout .history_heading .heading_text .text_summary {
		margin: 1.11em 0 0;
		font-size: 1.8rem;
	}
	.history-layout .history_image {
		position: absolute;
		top: 120px;
		right: 0;
		width: 750px;
		height: 540px;
		z-index: 1;
	}
	.history-layout .history_image .image_figure {
		position: relative;
	}
	.history-layout .history_image .image_figure figcaption {
		position: absolute;
		bottom: 0;
		left: 0;
		padding: 8px 15px;
		background-color: rgba(0,0,0,0.6);
		color: #fff;
		font-size: 1.7rem;
	}
	.history-layout .history_image .image_figure figcaption span {
		font-size: 1.6rem;
	}
	.history-layout .history_image [class*="type-"] {
		position: absolute;
	}
	.history-layout .history_image .type-lt {
		top: 0;
		left: 0;
	}
	.history-layout .history_image .type-lb {
		bottom: 0;
		left: 0;
	}
	.history-layout .history_image .type-rb {
		bottom: 0;
		right: 0;
	}

	/* v2 */
	.history-layout-v2 {
		margin: 3.75em 0 0;
	}
	.history-layout-v2 > *:first-child {
		margin-top: 0 !important;
	}
	.history-layout-v2 .history_heading {
		margin: 0.859375em 0 0;
		border-bottom: 1px solid #af4b27;
		color: #af4b27;
		font-size: 6.4rem;
		font-weight: 700;
		font-family: Arial, Helvetica, "sans-serif";
		line-height: 1;
	}
	.history-layout-v2 .column-layout[data-row-pc="2"] > .column_item > .history_heading,
	.history-layout-v2 .history_column_2 > .column_text > .history_heading {
		margin-right: -36px;
		padding-right: 36px;
	}
	.history-layout-v2 .history_heading > span {
		position: relative;
		top: -0.1em;
	}
	.history-layout-v2 .history_text {
		margin: 0.8em 0 0;
		font-size: 1.8rem;
	}
	.history-layout-v2 .history_image {
		margin: 1.5625em 0 0;
	}
	.history-layout-v2 .history_image img {
		width: 100%;
	}
	.history-layout-v2 .history_image figcaption {
		margin: 0.4375em 0 0;
	}
	.history-layout-v2 .column-layout,
	.history-layout-v2 .history_column {
		margin-top: 3.4375em;
	}
	.history-layout-v2 .history_text + .column-layout {
		margin-top: 0.9375em;
	}
	.history-layout-v2 .history_column {
		display: flex;
	}
	.history-layout-v2 .history_column > .column_left {
		flex: 1;
	}
	.history-layout-v2 .history_column > .column_right {
		width: calc((100% - 36px * 3) / 4);
		margin: 0 0 0 36px;
	}
	.history-layout-v2 .history_column > * > *:first-child,
	.history-layout-v2 .history_column > * > section:first-child *:first-child {
		margin-top: 0 !important;
	}
	.history-layout-v2 .history_column_2 {
		display: flex;
	}
	.history-layout-v2 .history_column_2 > .column_text {
		width: calc((100% - 36px * 2) / 3);
		margin: 0 36px 0 0;
	}
	.history-layout-v2 .history_column_2 > .column_image {
		flex: 1;
	}
	.history-layout-v2 .history_column_2 > * > *:first-child,
	.history-layout-v2 .history_column_2 > * > section:first-child *:first-child {
		margin-top: 0 !important;
	}
}

/* ======================================================
 * PC Media Queries
====================================================== */
@media screen and (min-width: 768px) and (max-width: 1260px) {
	.history-layout .history_inner {
		margin: 0 -30px;
		padding: 0 30px;
	}
	.history-layout.type-text .history_heading::before {
		right: 154px;
	}
}

/* ======================================================
 * SP
====================================================== */
@media only screen and (max-width: 767px) {
	/* ------------------------------------------------------
	 * Common
	------------------------------------------------------ */
	/* ----- width ----- */
	.gp-w-sp-100per {
		width: 100% !important;
	}

	/* ------------------------------------------------------
	 * Page Component
	------------------------------------------------------ */
	/* ----- history-layout ----- */
	.history-layout {
		margin: 2.3em -15px 0;
	}
	.history-layout .history_heading {
		overflow: hidden;
		position: relative;
		padding: 10px 15px 15px;
		z-index: 0;
	}
	.history-layout.type-text .history_heading {
		padding-bottom: 20px;
	}
	.history-layout .history_heading::before {
		content: "";
		position: absolute;
		top: 0;
		right: 490px;
		transform: skewX(-37.5deg);
		width: 980px;
		height: 1278px;
		background-color: #f3f3f2;
		z-index: -1;
	}
	.history-layout .history_heading .heading_title {
		color: #af4b27;
		font-size: 7.5rem;
		font-weight: 700;
		font-family: Arial, Helvetica, "sans-serif";
		line-height: 1;
	}
	.history-layout .history_heading .heading_text {
		margin: 0.38em 0 0;
	}
	.history-layout .history_heading .heading_text .text_lead {
		font-size: 1.5rem;
		font-weight: 700;
		line-height: 1.8;
	}
	.history-layout .history_heading .heading_text .text_summary {
		margin: 0.35em 0 0;
		font-size: 1.4rem;
	}
	.history-layout .history_image .image_figure {
		position: relative;
	}
	.history-layout .history_image .image_figure img {
		width: 100%;
		vertical-align: bottom;
		line-height: 1;
	}
	.history-layout .history_image .image_figure figcaption {
		position: absolute;
		bottom: 0;
		left: 0;
		padding: 5px 8px;
		background-color: rgba(0,0,0,0.6);
		color: #fff;
		font-size: 1rem;
		line-height: 1.2;
	}
	.history-layout .history_image .image_figure figcaption span {
		font-size: 0.8rem;
	}
	.history-layout .history_image [class*="type-"] {
		position: absolute;
	}
	.history-layout .history_image .type-lt {
		top: 0;
		left: 0;
	}
	.history-layout .history_image .type-lb {
		bottom: 0;
		left: 0;
	}
	.history-layout .history_image .type-rb {
		bottom: 0;
		right: 0;
	}
	.history-layout .history_image.type-comb1,
	.history-layout .history_image.type-comb2,
	.history-layout .history_image.type-comb3 {
		position: relative;
		padding: 72% 0 0;
	}
	.history-layout .history_image.type-comb1 .image_figure.type-lt,
	.history-layout .history_image.type-comb1 .image_figure.type-lb {
		width: 56.8%;
	}
	.history-layout .history_image.type-comb1 .image_figure.type-rb {
		width: 43.2%;
	}
	.history-layout .history_image.type-comb2 .image_figure.type-lt,
	.history-layout .history_image.type-comb2 .image_figure.type-lb {
		width: 43.7333%;
	}
	.history-layout .history_image.type-comb2 .image_figure.type-rb {
		width: 56.2667%;
	}
	.history-layout .history_image.type-comb3 .image_figure.type-lt {
		width: 54.6666%;
	}
	.history-layout .history_image.type-comb3 .image_figure.type-rb {
		width: 45.3334%;
	}

	/* v2 */
	.history-layout-v2 {
		margin: 2.3em 0 0;
	}
	.history-layout-v2 > *:first-child {
		margin-top: 0 !important;
	}
	.history-layout-v2 .history_heading {
		margin: 0.625em 0 0;
		border-bottom: 1px solid #af4b27;
		color: #af4b27;
		font-size: 4.8rem;
		font-weight: 700;
		font-family: Arial, Helvetica, "sans-serif";
		line-height: 1;
	}
	.history-layout-v2 .column-layout[data-row-pc="2"] > .column_item > .history_heading {
		margin-right: -15px;
		padding-right: 15px;
	}
	.history-layout-v2 .history_heading > span {
		position: relative;
		top: -0.1em;
	}
	.history-layout-v2 .history_text {
		margin: 0.8em 0 0;
		font-size: 1.4rem;
	}
	.history-layout-v2 .history_image {
		margin: 1.15em 0 0;
	}
	.history-layout-v2 .history_image img {
		width: 100%;
	}
	.history-layout-v2 .history_image figcaption {
		margin: 0.41em 0 0;
		font-size: 1.2rem;
	}
	.history-layout-v2 .column-layout,
	.history-layout-v2 .history_column {
		margin-top: 1.92em;
	}
	.history-layout-v2 .column-layout > .column_item,
	.history-layout-v2 .history_column > * {
		margin-top: 1.92em;
	}
	.history-layout-v2 .column-layout > .column_item:first-child,
	.history-layout-v2 .history_column > *:first-child {
		margin-top: 0;
	}
	.history-layout-v2 .history_text + .column-layout {
		margin-top: 0.76em;
	}
	.history-layout-v2 .history_column > .column_right {
		width: calc((100% - 15px) / 2);
	}
}