@charset "utf-8";

.mainbody__logo {
    display: none;
}
@media (max-width: 767px) {
    .mainbody__logo {
        display: block;
        padding: 2rem 2rem 0;
    }
    .mainbody__logo img {
        width: 7rem;
    }
}

/* mainbody general */
.mainbody__in {
    position: relative;
}
.mainbody__kv {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    margin: auto;
	z-index: 1;
}
.mainbody__kv img {
    width: 100%;
	height: auto;
    background: url(/img/for-business/pict-corp_kv.jpg) no-repeat;
    background-size: 100%;
}
[data-load-progress="5"] .mainbody__kv .kv__pict {
    height: 4.6rem;
    transition: height 1000ms ease-out;
}
[data-load-progress="5"] .mainbody__mv .mv__pict p {
    height: 4.6rem;
    line-height: 4.6rem;
    opacity: 1;
    transition: height 1200ms, line-height 600ms, opacity 1800ms;
    transition-delay: 400ms;
    transition-timing-function: ease-out;
}
.mainbody__background-pc {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    background: url("../img/pict-story00-anniversary.jpg") no-repeat left 50% bottom 114px;
}
.mv__scroll {
    position: absolute;
    writing-mode: vertical-rl;
    width: 1.6rem;
    height: 138px;
    bottom: 0;
    right: 20px;
}
.mv__scroll-text {
    position: relative;
    width: 100%;
    height: 100%;
    line-height: 1;
    color: #222;
    font-family: 'Source Han Serif Japanese', serif;
    font-size: 1.6rem;
    letter-spacing: .05em;
}
.mv__scroll-bar-clip {
    position: absolute;
    right: 10px;
    bottom: 0;
    overflow: hidden;
    width: 1px;
    height: 80px;
    background-color: #222;
}
.mv__scroll-bar {
    position: absolute;
    width: 1px;
    height: 80px;
    top: -80px;
    right: 0;
    background-color: rgba(255, 255, 255, .57);
}
.mv__scroll-bar {
    animation: scroll-bar 3.5s cubic-bezier(.455, .03, .515, .955) infinite;
}
@keyframes scroll-bar {
    0%,
    5% {transform:translate3d(0, 0, 0)}
    100% {transform:translate3d(0, 160px, 0)}
}
@media (max-width: 767px) {
    .mainbody__mv .mv__pict-logo {
        position: absolute;
        top: 1rem;
        left: 1rem;
    }
    .mainbody__mv .mv__pict-logo img {
        width: 10rem;
    }
    .mainbody__background-sp {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        background: url("../img/bg-story00-lead-sp.png") no-repeat left 50% bottom 9.4rem / 100% auto;
    }
    .mv__scroll {
        width: 1.7rem;
        height: 10rem;
        right: .5rem;
        overflow: hidden;
    }
    .mv__scroll-text {
        font-family: 'Times New Roman', Times, serif;
        font-size: 1.7rem;
    }
    .mv__scroll-bar-clip {
        height: 4.7rem;
    }
    .mv__scroll-bar {
        height: 2rem;
        top: -2rem;
	}
	.mainbody__kv {
		width: 100%;
		margin: 40px 0 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.mainbody__kv .sp1 {
		width: 90%;
		height: auto;
		background: url(/img/for-business/pict-corp_kv-sp1.jpg) no-repeat;
		background-size: 100%;
	}
	.mainbody__kv .sp2 {
		width: 90%;
		height: auto;
		background: url(/img/for-business/pict-corp_kv-sp2.jpg) no-repeat;
		background-size: 100%;
	}
	.mainbody__kv .el__rectangle {
        width: 3.6rem;
        height: 1.8rem;
        clip-path: polygon(50% 0, 100% 100%, 0 100%);
        background: #222;
        rotate: 180deg;
        margin: 1.2rem 0;
	}
	.mainbody__kv .space {
        margin: 1.2rem 0;
	}
}
@media (max-width: 767px) {
    .story__heading {
        position: fixed;
        top: 0;
        left: calc(360 / 390 * 100vw);
        bottom: 0;
        margin: auto;
        writing-mode: vertical-rl;
        line-height: 1.4rem;
        font-size: 1.2rem;
        text-align: center;
        opacity: 0;
        transition: opacity 500ms;
    }
    .js-fadein-heading-show .story__heading {
        opacity: 1;
    }
    .story__heading span {
        display: inline-block;
        margin-bottom: .5em;
        writing-mode: initial;
        font-family: 'Times New Roman', Times, serif;
        font-size: 1.4rem;
        text-combine-upright: all;
    }
}

/* mainbody content */
.mainbody__cont {
	position: relative;
    //padding: 110px 0 140px;
}
.mainbody__cont .el__heading {
    line-height: 5rem;
    font-weight: 500;
    font-size: 3.4rem;
	letter-spacing: .1em;
	margin-bottom: 6rem;
}
.mainbody__cont .el__heading p{
    line-height: 2.8rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .1em;
}
.mainbody__cont .el__heading2 {
    line-height: 5rem;
    font-weight: 500;
    font-size: 2.8rem;
    letter-spacing: .08em;
}
.mainbody__cont .el__textgroup,
.mainbody__cont .el__textgroup2 {
    line-height: 2.125;
    font-size: 1.6rem;
}
.mainbody__cont .el__textgroup2-pict img {
    width: 100%;
    height: auto;
}
.mainbody__cont .el__figure img {
    width: 100%;
    height: auto;
}
.mainbody__cont .el__figure figcaption {
    margin-top: 1rem;
    line-height: 1.8333;
    font-size: 1.2rem;
}
.mainbody__cont .el__catch {
    font-size: 0;
    text-align: center;
}
.mainbody__cont .el__catch p {
    display: inline-block;
    writing-mode: vertical-rl;
    text-orientation: upright;
    line-height: 6.4rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .1em;
    text-align: left;
    white-space: nowrap;
}
.mainbody__cont .el__parabutton-wrap {
	display: flex;
	justify-content: space-between;
}
.mainbody__cont .el__parabutton {
	margin: 4rem 0 4rem;
    width: calc(100% / 2 - 16px);
}
.mainbody__cont .el__parabutton a {
    display: block;
    margin: 0 auto;
    padding: 3rem 0;
    background: #feefe2;
    border-radius: 8rem;
    line-height: 2rem;
    color: currentColor;
    font-size: 1.6rem;
    text-align: center;
    text-decoration: none;
    transition: background-color 300ms;
}
.mainbody__cont .el__parabutton a:hover {
    background: #e5d8cd;
}
.mainbody__cont .el__button {
    margin: 4rem 0 4rem;
}
.mainbody__cont .el__button a {
    display: block;
    width: 500px;
    margin: 0 auto;
    padding: 3rem 0;
    background: #feefe2;
    border-radius: 8rem;
    line-height: 2rem;
    color: currentColor;
    font-size: 1.6rem;
    text-align: center;
    text-decoration: none;
    transition: background-color 300ms;
}
.mainbody__cont .el__button a:hover {
    background: #e5d8cd;
}
.mainbody__cont .el__face {
    position: relative;
    padding-left: 257px;
}
.mainbody__cont .el__face p {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 445px;
    height: 215px;
    padding: 0 0 0 6.2rem;
    background: #faf8f5;
    border-radius: 1.7rem;
    line-height: 2.125;
    font-size: 1.6rem;
}
.mainbody__cont .el__face p::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -34px;
    width: 0;
    height: 0;
    margin: auto 0;
    border-width: 16px 34px 16px 0;
    border-style: solid;
    border-color: transparent #faf8f5;
}
.mainbody__cont .el__face::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 204px;
    height: 215px;
    background: url("../img/pict-matoil-face.gif") no-repeat 50% 50% / 240px auto;
}
@media (max-width: 767px) {
    .mainbody__cont {
        padding: 0 0 8.5rem;
    }
    .mainbody__cont .el__heading {
        line-height: 4.4rem;
        font-size: 2.8rem;
    }
    .mainbody__cont .el__heading p{
        line-height: 2.4rem;
        font-size: 2rem;
    }
    .mainbody__cont .el__heading2 {
        line-height: 4.2rem;
        font-size: 2rem;
        letter-spacing: .02em;
    }
    .mainbody__cont .el__figure figcaption {
        margin-top: 1.1rem;
			}
	.mainbody__cont .el__parabutton-wrap {
		display: block;
	}
	.mainbody__cont .el__parabutton {
		margin: 4rem 0 4rem;
		width: auto;
	}
	.mainbody__cont .el__parabutton a {
		width: auto;
	}
    .mainbody__cont .el__button a {
        width: auto;
        padding: 2rem 0;
    }
    .mainbody__cont .el__face {
        padding-left: 0;
    }
    .mainbody__cont .el__face p {
        width: 100%;
        height: auto;
        min-height: 19.6rem;
        margin-bottom: 5rem;
        padding: 3rem;
    }
    .mainbody__cont .el__face p::after {
        top: auto;
        right: 0;
        bottom: -3.2rem;
        left: 0;
        margin: 0 auto;
        border-width: 3.2rem 1.7rem 0;
        border-style: solid;
        border-color: #faf8f5 transparent;
    }
    .mainbody__cont .el__face::after {
        content: "";
        display: block;
        position: static;
        width: 14.6rem;
        height: 15.4rem;
        margin: 0 auto;
        background: url("../img/pict-matoil-face.gif") no-repeat 50% 50% / 17rem auto;
    }
}

/* content */
.content {
    max-width: 702px;
    margin: 0 auto;
    padding: 6rem 0 12rem;
}
.content > .el__heading {
    margin-bottom: 3.1rem; /* 5rem */
}
	@media (max-width: 767px) {
		.content {
			max-width: none;
			margin: 0 3rem;
			padding: 5rem 0 12rem;
		}
}
		
/* content */
.content > .el__heading {
    margin-bottom: 3.1rem; /* 5rem */
}
.content .el__heading2 {
    padding-bottom: .8rem;
    border-bottom: 1px solid #707070;
}
.plan__section-block.-p1 > header .el__heading2 {
    margin-bottom: 3rem; /* 4rem */
}
.plan__section-block.-p1 > header .el__textgroup {
    margin-bottom: 3.8rem; /* 5rem */
}

/* intro */
.introduction {
    margin-bottom: 6.3rem; /* 8rem */
}
.introduction > header .el__heading {
    margin: 0 0 3.6rem; /* 3rem */
    font-size: 3.4rem;
}
.introduction > header p {
    margin-bottom: 1.1rem; /* 3rem */
    line-height: 4rem;
    font-weight: 500;
    font-size: 2rem;
    letter-spacing: .02em;
}
.introduction .el__textgroup {
    margin-bottom: 3.1rem; /* 4rem */
}
.introduction .el__figure img + img {
    margin-top: 3rem;
}
.introduction .el__figure figcaption {
    margin-top: 2.5rem; /* 3rem */
    padding-left: 1em;
    text-indent: -1em;
}
.introduction .el__figure figcaption + figcaption {
    margin-top: .8rem;
}
.introduction .el__figure figcaption + figcaption {
    margin-top: .8rem;
}
@media (max-width: 767px) {
    .introduction {
        max-width: none;
        margin-bottom: 3.6rem;
	}
}
		
/* standard */
.standard {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.standard .el__heading {
    margin-bottom: 4.2rem; /* 5rem */
}
.standard .comparison {
	text-align: center;
	position: relative;
}
.standard .el__compare-header {
	display: flex;
	justify-content: space-between;
	margin-top: 6.3rem;
	margin-bottom: 1.2rem;
}
.standard .el__compare-heading {
	width: 30rem;
	padding: .6rem 0;
}
.standard .el__compare-heading-or {
	border-radius: 9999px;
    background: #FF9548;
    color: #fff;
	font-size: 2rem;

}
.standard .el__compare-heading-gr {
	border-radius: 9999px;
	border: solid #222 1px;
	font-size: auto;
}
.standard .el__compare-list {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.standard .el__compare-row {
    width: auto;	
	display: flex;
    justify-content: space-between;
	align-items: center;
	margin-top: 2.1rem;
	padding: 1.2rem 0;
}
.standard .el__textgroup2 {
	display: flex;
	flex-direction: column;
	width: 30rem;
	line-height: 1.215;
}
.standard .catchcopy {
	font-size: 2rem;
	margin-bottom: 1.2rem;
}
.standard .bodytext {
	font-size: 1.4rem;
	margin-bottom: 0.6rem;
}
.standard .catchcopy-hv {
	font-size: 2.4rem;
	font-weight: 500;
	margin-bottom: 1.2rem;
}
.standard .bodytext-hv {
	font-size: 1.6rem;
	margin-bottom: 0.6rem;
}
.standard .el__rectangle {
	width: 2.4rem;
	height: 1.2rem;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
    background: #222;
    rotate: 90deg;
}
@media (max-width: 767px) {
    .standard {
        max-width: none;
        margin-bottom: 3.6rem;
		}
	.standard .el__compare-header {
		margin-top: 0;
		margin-bottom: 2.4rem;
		display: flex;
		justify-content: center;
	}
	.standard .el__compare-heading {
		padding-right: 2rem;
		padding-left: 2rem;
		width: auto;
	}
	.standard .el__compare-list {
		display: flex;
		justify-content: space-between;
	}
	.standard .el__compare-row {
		width: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		margin-top: 2.1rem;
		padding: 0;
	}
	.standard .el__compare-row:not(:first-of-type) {
		margin-top: 6.3rem; /*9.6rem;*/
	}
	.standard .el__textgroup2 {
		display: flex;
		flex-direction: column;
		width: 30rem;
		line-height: 1.215;
	}
	.standard .catchcopy {
		font-size: 2rem;
		margin-bottom: 1.2rem;
	}
	.standard .bodytext {
		font-size: 1.4rem;
		margin-bottom: 0.6rem;
	}
	.standard .catchcopy-hv {
		font-size: 2.4rem;
		font-weight: 500;
		margin-bottom: 1.2rem;
	}
	.standard .bodytext-hv {
		margin-bottom: 0.6rem;
	}
	.standard .el__rectangle {
		rotate: 180deg;
		margin: 2.1rem 0;
	}
	.standard .rectangle__wrap {
		display: flex;
		align-items: center;
		justify-content: center;
	}
}
		
/* value */
.value {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.value__section .el__heading {
    margin-bottom: 4.2rem; /* 5rem */
}
.value .el__textgroup2 {
    display: flex;
    justify-content: space-between;
}
.value .el__textgroup2:not(:last-child) {
    margin-bottom: 5rem; /* 5rem */
}
.value .el__textgroup2-text {
    width: 422px;
}
.value .el__textgroup2-text small {
    font-size: 1.4rem;
}
.value .el__textgroup2-text h5 {
    margin-top: -.9rem;
    margin-bottom: 1.4rem;
    line-height: 4.2rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .04em;
    white-space: nowrap;
}
.value .el__textgroup2-pict {
    width: 220px;
}
@media (max-width: 767px) {
    .value {
        max-width: none;
        margin: 0;
    }
    .value .el__textgroup2 {
        display: block;
    }
    .value .el__textgroup2:not(:last-child) {
        margin-bottom: 4.1rem; /* 5rem */
    }
    .value .el__textgroup2-text {
        width: auto;
        margin-top: 2rem;
    }
    .value .el__textgroup2-text h5 {
        margin-top: 0;
        margin-bottom: .5rem;
        line-height: 4rem;
        font-size: 2rem;
    }
	.value .el__textgroup2-pict {
        width: auto;
    }	
}
		
/* services */
.services {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.services__section .el__heading {
    margin-bottom: 4.2rem; /* 5rem */
}
.services .el__textgroup {
    margin-top: -4.2rem;
    margin-bottom: 4.7rem;
    line-height: 2.125;
	font-size: 1.6rem;
}
.services .el__textgroup2 {
    display: flex;
    justify-content: space-between;
}
.services .el__textgroup2:not(:last-child) {
    margin-bottom: 4.2rem; /* 5rem */
}
.services .el__textgroup2-text {
    width: 422px;
}
.services .el__textgroup2-text small {
    font-size: 1.4rem;
}
.services .el__textgroup2-text h5 {
    margin-top: -.9rem;
    margin-bottom: 1.4rem;
    line-height: 4.2rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .04em;
    white-space: nowrap;
}
.services .el__textgroup2 .order-heading {
	margin-bottom: 2.1rem;
	display: flex;
}
.services .el__textgroup2 .order-heading p {
	background-color: #FEEFE2;
    padding: .1rem 1.2rem;
    font-size: 1.2rem;
}
.services .el__textgroup2-pict {
    width: 240px;
}
.services .el__textgroup2-pict img {
	width: 268px;
	height: auto;
}
.services .el__textgroup2 dl > div {
    display: flex;
    padding: 0;
}
.services .el__textgroup2 dl dt {
    flex: 0 0 auto;
    width: 1;
}
.services .el__textgroup2 dl dd {
    flex: 0 1 auto;
}
.services .el__textgroup2 dl > div {
    display: flex;
    padding: 0;
}
@media (max-width: 767px) {
    .services {
        max-width: none;
        margin: 0;
    }
    .services .el__textgroup2 {
        display: block;
    }
    .services .el__textgroup2:not(:last-child) {
        margin-bottom: 6.3rem; /* 5rem */
    }
    .services .el__textgroup2-text {
        width: auto;
        margin-top: 2rem;
	}
	.services .el__textgroup2 .order-heading {
		margin-bottom: .6rem;
	}
    .services .el__textgroup2-text h5 {
        margin-top: 0;
        margin-bottom: .5rem;
        line-height: 4rem;
        font-size: 2rem;
    }
    .services .el__textgroup2-pict {
		width: auto;
		text-align: center;
    }	
}
		
/* report */
.report {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.report > header .el__textgroup {
			margin-bottom: 4.1rem; /* 5rem */
}
.report__section:not(:first-of-type) {
    margin-top: 6rem;
}
.report__section .el__category-heading {
    display: flex;
    align-items: center;
    margin-bottom: 2.4rem; /* 3rem */
}
.report__section .el__category-heading h5 {
	flex: 0 0 auto;
    width: 3.6em;
    margin-right: 2rem;
    background: #feefe2;
    line-height: 5rem;
    font-weight: 500;
    font-size: 2.4rem;
    font-family: 'source-han-serif-japanese', serif;
    text-align: center;
}
.report__section .el__category-heading p {
    flex: 0 1 auto;
    font-weight: 500;
	font-size: 2.4rem;
	font-weight: 500;
}
.report__section .el__category .el__textgroup {
	margin-bottom: 3.1rem;
	line-height: 2.125;
    font-size: 1.6rem;
}
.report__cases {
}
.report_cases::-webkit-scrollbar {
  display: none;
}
.report__case {
    padding: 4.1rem 4.2rem 5rem; /*5rem 4.2rem */
	background: #faf8f5;
	margin-bottom: 2.4rem;
	margin-right: 1.8rem;
}
.report__case-header {
}
.report__case-heading {
    margin-bottom: 1rem;
    line-height: 4.2rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .04em;
}
.report__case-header .bodytext {
			font-size: 1.6rem;
			margin-bottom: 3.6rem;
}
.report__case-body .el__heading2 {
    margin-bottom: 1rem; /* 3rem */
}
.report__case-body .el__pictgroup {
    display: flex;
    justify-content: space-between;
    margin-top: 2.1rem; /* 3rem */
	margin-bottom: 1.6rem; /* 3rem */
	max-width: 599px;
}
.report__case-body .el__pictgroup .el__figure {
	width: 48%;
	margin: 0 1.2rem 0 0
}
.report__case-body .el__pictgroup .el__figure .nowrap {
	white-space: nowrap;
}
.report__case-body dl {
	line-height: 1.615;
	margin-bottom: 4.8rem;
}
.report__case-body dl dt {
    flex: 0 0 auto;
	width: 1;
}
.report__case-body dl dd {
    flex: 0 1 auto;
			}
.report__case-body dl > div {
    display: flex;
    padding: 0;
}
.report__case-body dl > div:not(:first-of-type) {
    margin-top: 1.2rem;
}
.report__case-body h5 {
	font-weight: 500;
	margin: 4.3rem 0 1.6rem;
}
@media (max-width: 767px) {
    .report {
        max-width: none;
        margin: 0;
    }
	.report__section .el__category-heading h5 {
		width: 2.4em;
		margin-right: 1.4rem;
	}
	.report__case {
	margin: 0 -5rem 1.2rem -2rem;
	padding: 4.1rem 5rem 5rem 3rem; /*5rem 5rem 5rem 3rem */
	background: #faf8f5;
    }
    .report__case-body .el__pictgroup {
		display: block;
    }
    .report__case-body .el__pictgroup .el__figure {
		width: auto;
    }
    .report__case-body .el__pictgroup .el__figure:not(:last-child) {
        margin-bottom: 2rem;
    }
}
			
/* interview */
.interview {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.interview .el__heading2 {
    margin-bottom: 4.2rem; /* 3rem */
}
.interview__cards {
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 0;
    justify-content: space-between;
}
.interview__card {
	width: calc(100% / 2 - 16px);
	min-width: unset;
	margin-bottom: 32px;
	cursor: pointer;
    box-sizing: border-box;
    display: inline-block;
    border: solid 1px #222;
    border-radius: 4px;
	max-width: 378px;
	text-decoration: none;
	transition-property: opacity;
	transition-duration: 0.5s;
}
.interview__card:hover {
	opacity: 0.7;
}
.interview__card .el__cardimg {
	width: 100%;
    line-height: 0;
    background-color: var(--color-black);
	border-radius: 4px 4px 0 0;
}
.interview__card .el__cardimg img {
	width: 100%;
}
.interview__card .el__cardbody {
    padding: 2rem;
    border-radius: 0 0 4px 4px;
    text-align: left;
    word-wrap: break-word;
	white-space: normal;
	text-decoration: none;
}
.interview__card .el__cardbody-title {
	font-weight: 500;
	font-size: 1.6rem;
	line-height: 1.615;
    padding: 0;
    margin: 0.6rem 0;
}
.interview__card .el__cardbody-credit {
    padding: 0;
	margin: 0 0 2.4rem 0;
	font-size: 1.2rem;
}
.interview__card .el__cardbody-tag {
	margin: 1.8rem 0 0.6rem 0;
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}
.interview__card .el__cardbody-tag p {
	display: block;
    width: fit-content;
    margin: 0 0.3rem 0.3rem 0;
    padding: 0.3rem 0.6rem;
    background: #feefe2;
    border-radius: 8rem;
    line-height: 1.615rem;
    color: currentColor;
    font-size: 0.9rem;
    text-align: center;
    text-decoration: none;
	transition: background-color 300ms;
	text-align: left;
}
@media (max-width: 767px) {
    .interview {
        max-width: none;
        margin: 0;
    }
.interview__card {
	width: auto;
	margin-bottom: 4.2rem;
	}
}
			
/* keywords */
.keywords {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.keywords .el__textgroup {
	margin-top: -4.2rem;
	margin-bottom: 4.7rem;
	line-height: 2.125;
	font-size: 1.6rem;	
}
.keywords .el__keywords {
	width: 100%;
	padding: 3.6rem 4.2rem 4.3rem;
	background: #faf8f5;
	margin-bottom: 2.4rem;
	margin-right: 1.8rem;
}
.keywords .el__keywords .el__header {
	margin-bottom: 1.6rem; /* 4rem */
}
.keywords .el__keywords  .el__heading {
    margin-bottom: 1rem;
    line-height: 4.2rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .04em;
}
.keywords .el__keywords .el__roundwrap {
	display: flex;
	justify-content: space-around;
	text-align: center;
}
.keywords .el__keywords .el__round {
	width: 180px;
	height: 180px;
	background: #fff;
	clip-path: circle(90px at 50% 50%);
}
.keywords .el__keywords .el__textgroup2 {
	display: flex;
    flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 180px;
	line-height: 1.615;
}
.keywords .el__keywords .el__textgroup2-notes {
	font-size: 1.2rem;
	line-height: 1.4;
	display: block;
}
@media (max-width: 767px) {
    .keywords {
        max-width: none;
        margin-bottom: 3.6rem;
	}
	.keywords .el__keywords {
	width: auto;
	margin: 0 -5rem 3.1rem -2rem;
	padding: 4.1rem 5rem 5rem 3rem; /*5rem 5rem 5rem 3rem */
	background: #faf8f5;
	}
	.keywords .el__keywords .el__header {
		margin-bottom: 3.1rem;
	}
	.keywords .el__keywords .el__roundwrap {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.keywords .el__keywords .el__round {
		width: 27rem;
		height: 27rem;
		clip-path: circle(13.5rem at 50% 50%);
    }
	.keywords .el__keywords .el__round:not(:last-child) {
		margin-bottom: 2.4rem;
	}
	.keywords .el__keywords .el__textgroup2 {
		height: 27rem;
		font-size: 2rem;
	}
}	
			
/* lineup */
.lineup {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.lineup__section {
    margin-bottom: 7.2rem; /* 5rem */
}
.lineup__section .el__heading {
    margin-bottom: 4.2rem; /* 5rem */
}
.lineup__section .el__heading2 {
    margin-bottom: 4.2rem; /* 5rem */
}
.lineup .el__textgroup2 {
    display: flex;
    justify-content: space-around;
}
.lineup .el__textgroup2 a {
	text-decoration: none;
}
.lineup .el__textgroup2:not(:last-child) {
    margin-bottom: 4.8rem; /* 5rem */
}
.lineup .el__textgroup2-text {
    width: 422px;
}
.lineup .el__textgroup2-text small {
    font-size: 1.4rem;
}
.lineup .el__textgroup2-text h5 {
    margin-top: -.9rem;
    margin-bottom: 1.4rem;
    line-height: 4.2rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .04em;
    white-space: nowrap;
}
.lineup .el__textgroup2-pict {
    width: 200px;
		}
.lineup .el__textgroup2-pict p {
    margin-top: 1rem;
    line-height: 1.8333;
	font-size: 1.6rem;
    text-align: center;
}
.lineup .el__textgroup2-pict img {
	border-radius: 10px;
	transition-property: opacity;
	transition-duration: 0.5s;
}
.lineup .el__textgroup2-pict img:hover {
    opacity: 0.7; 
}
@media (max-width: 767px) {
    .lineup {
        max-width: none;
        margin: 0;
    }
    .lineup .el__textgroup2 {
		justify-content: space-between;
	}
    .lineup .el__textgroup2:not(:last-child) {
        margin-bottom: 4.1rem; /* 5rem */
    }
    .lineup .el__textgroup2-text {
        width: auto;
        margin-top: 2rem;
    }
    .lineup .el__textgroup2-text h5 {
        margin-top: 0;
        margin-bottom: .5rem;
        line-height: 4rem;
        font-size: 2rem;
    }
    .lineup .el__textgroup2-pict {
        width: 40vw;
	}
	.lineup .el__textgroup2-pict p {
		font-size: 1.4rem;
	}
}

/* faq */
.faq {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.faq > header .el__heading {
	margin-bottom: 3.3rem;
}
.faq > header .el__textgroup {
    margin-bottom: 4.1rem;
}
.faq__section {
    margin-bottom: 0; /* 5rem */
}
.faq__section .el__heading {
    margin-bottom: 4.2rem; /* 5rem */
}
.faq__section .el__heading2 {
    margin-bottom: 4.2rem; /* 5rem */
}
.faq__section .el__textgroup {
    margin-bottom: 2.1rem; /* 3rem */
	line-height: 1.8333;
}
.faq__section dl > div {
    display: flex;
    padding: 0;
}
.faq__section dl dt {
    flex: 0 0 auto;
    width: 2.4rem;
	text-align: center;
}
.faq__section .que {
    font-size: 1.6rem;
	font-weight: 500;
	padding: 1.2px;
	margin: 0 0 1.2rem 0.12rem;
	/* background-color: #faece1; */
	display: inline;
	-webkit-box-decoration-break: clone;
	box-decoration-break: close;
}
.faq__section .ans {
    font-size: 1.6rem;
	margin-bottom: 2.8rem;
}
@media (max-width: 767px) {
    .faq {
        max-width: none;
        margin: 0;
    }
}

/* corporate */
.corporate {
    max-width: 702px;
    margin: 0 auto;
    padding: 7.2rem 0 4rem; /* 8rem 0 12rem */
}
.corporate > header .el__heading {
	margin-bottom: 3.3rem;
}
.corp__section {
    margin-bottom: 7.2rem; /* 5rem */
}
.corp__section .el__heading {
	font-size: 1.8rem;			
	margin-bottom: 0;
}
.corp__section .el__heading2 {
    margin-bottom: 4.2rem; /* 5rem */
}
.corp__section .el__textgroup {
    margin-bottom: 2.1rem; /* 3rem */
	line-height: 1.8333;
}
.corp__section dl > div {
    display: flex;
    padding: 0;
}
.corp__section dl dt {
    flex: 0 0 auto;
    width: 120px;
	margin-bottom: 2.4rem;
}
.corp__section dt {
    flex: 0 0 auto;
    width: 120px;
}
.corp__section .el__figure {
    margin-bottom: 3.6rem;
}
.corp__section .el__pictgroup {
    display: flex;
    justify-content: space-between;
    margin-top: 1.2rem;
    margin-bottom: 3.6rem;
}
.corp__section .el__pictgroup .el__figure {
    width: 48%;
}
.corp__section .el__pictgroup figcaption {
    margin-top: 1rem;
    line-height: 1.8333;
    font-size: 1.4rem;
}
.corp__section .el__pictgroup a {
	text-decoration: none;
}
.corp__section .el__pictgroup .el__figure img{
	transition-property: opacity;
    transition-duration: 0.5s;
}
.corp__section .el__pictgroup .el__figure img:hover{
	opacity: 0.7;
}
@media (max-width: 767px) {
    .corporate {
        max-width: none;
        margin: 0;
    }
	.corp__section dl > div {
		display: block;
		padding: 0;
	}
	.corp__section dl dt {
		width: auto;
		margin-bottom: 0.8rem;
		font-weight: 500;
		font-size: 1.4rem;
		line-height: 1.4;
	}
	.corp__section dl dd {
		margin-bottom: 4.8rem;
		font-size: 1.6rem;
	}
	.corp__section .el__pictgroup {
		display: block;
	}
	.corp__section .el__pictgroup .el__figure {
		width: 100%;
		height: auto;
	}
}
		
/* contact from plan */
.content__contact {
    padding-top: 8.3rem; /* 10rem */
}
.content__contact .contact__item:not(:last-child) {
    margin-bottom: 7.2rem; /* 8rem */
}
.content__contact .contact__item .el__heading2 {
    margin-bottom: 4.2rem; /* 3rem */
}
.content__contact .contact__item.-p1 .el__textgroup:nth-child(2) {
    margin-bottom: 1.2rem; /* 2rem */
    font-size: 1.8rem;
}
.content__contact .contact__item .el__button {
    margin-top: 2.1rem; /* 3rem */
}
.content__contact .contact__item .el__button small {
    margin-left: .5em;
    font-size: 1.2rem;
}
.content__contact .contact__item .contact__detail {
    margin-bottom: 3rem; /* 2rem */
    padding: 2.1rem 2.5rem;
    background: #faf8f5;
    line-height: 2.8rem;
    font-size: 1.4rem;
}
.content__contact .contact__item .contact__detail h4 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 1em;
}
.content__contact .contact__item .contact__detail dl {
	margin-bottom: 1em;
}
.content__contact .contact__item .contact__detail dl > div {
    display: flex;
}
.content__contact .contact__item .contact__detail dl dt {
    flex: 0 0 auto;
}
.content__contact .contact__item .contact__detail dl dd {
    flex: 0 1 auto;
}
.content__contact .contact__item .contact__detail small {
	display: block;
	padding-left: 1em;
	text-indent: -1em;
	line-height: 1.8333;
}

/* contact added */
.mainbody .contact__item:not(:last-child) {
    margin-bottom: 7.2rem; /* 8rem */
}
.mainbody .contact__item .el__heading2 {
    margin-bottom: 4.2rem; /* 3rem */
}
.mainbody .contact__item.-p1 .el__textgroup:nth-child(2) {
    margin-bottom: 1.2rem; /* 2rem */
    font-size: 1.8rem;
}
.mainbody .contact__item .contact_group {
    display: flex;
    justify-content: space-between;
	margin-top: 2.4.rem
    margin-bottom: 4.8rem; /* 8rem */
}
.mainbody .contact__item .contact_group .el__button {
    position: relative;
    display: flex;
	margin: unset;
    width: 337px;
    height: 116px;
    background: #feefe2;
    border-radius: 1rem;
    transition: background-color 300ms;
}
.mainbody .contact__item .contact_group .el__button .container {
    position: absolute;
	display: block;
	width: inherit;
	height auto;
	margin: 24px auto;
}
.mainbody .contact__item .contact_group .el__button img {
	display: block;
	text-align: center;
	width: 45px;
	height: 45px;
	margin: 0 auto;
	z-index: 99;
}
.mainbody .contact__item .contact_group .el__button a {
	display: block;
    border-radius: inherit;
    width: inherit;
    height: inherit;
    text-align: center;
	vertical-align: center;
	padding: 74px 0 0 0;
	background-color: transparent;
}
.mainbody .contact__item .contact_group .el__button a:hover {
    background: #e5d8cd;
}
@media (max-width: 767px) {
	.mainbody .contact__item .contact_group {
		display: flex;
		justify-content: space-between;
		flex-direction: column;
		margin-bottom: 2rem;
	}
	.mainbody .contact__item .contact_group .el__button {
		position: relative;
		display: flex;
		width: auto;
		margin: inherit;
	}
	.mainbody .contact__item .contact_group .el__button .container {
		width: -webkit-fill-available;
	}
	.mainbody .contact__item .contact_group .el__button img {
		display: block;
		text-align: center;
		width: 45px;
		height 45px;
	}
	.mainbody .contact__item .contact_group .el__button a {
		margin: 0 auto;
		width: -webkit-fill-available;
	}
}


/* ----- fadein animation // ----- */
.js-fadein {
    opacity: 0;
    transition: opacity 1500ms;
}
.js-fadein-show {
    opacity: 1;
}
@media all and (-ms-high-contrast:none) {
    .js-fadein {
        opacity: 1 !important;
    }
}
@media (max-width: 767px) {
    .js-fadein {
        transition: opacity 2000ms;
    }
}
			
/* article header */
.article__header {
    margin-bottom: 6.3rem; /* 8rem */
}
.article__header > header .el__heading {
    margin: 0 0 3.6rem; /* 3rem */
    font-size: 3.4rem;
}
.article__header > header p {
    margin-bottom: 1.1rem; /* 3rem */
    line-height: 4rem;
    font-weight: 500;
    font-size: 2rem;
    letter-spacing: .02em;
}
.article__header .el__credit h6{
    margin-top: -.9rem;
    margin-bottom: 1.4rem;
    line-height: 2.125;
    font-weight: 500;
    font-size: 1.6rem;
    letter-spacing: .04em;
	white-space: nowrap;
}
.article__header .el__textgroup {
    margin-bottom: 3.1rem; /* 4rem */
}
.article__header .el__figure img + img {
    margin-top: 3rem;
}
.article__header .el__figure figcaption {
    margin-top: 2.5rem; /* 3rem */
    padding-left: 1em;
    text-indent: -1em;
}
.article__header .el__figure figcaption + figcaption {
    margin-top: .8rem;
}
.article__header .el__tagcontainer {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
}
.article__header .el__tagcontainer .el__tag {
    margin: 1.2rem 1.2rem 0 0;
}
.article__header .el__tagcontainer .el__tag p {
    display: block;
    width: auto;
    margin: 0;
    padding: 0.6rem 1.5rem;
    background: #feefe2;
    border-radius: 8rem;
    line-height: 2rem;
    color: currentColor;
    font-size: 1.2rem;
    text-align: center;
    text-decoration: none;
    transition: background-color 300ms;
	text-align: left;
}
@media (max-width: 767px) {
    .article__header {
        max-width: none;
        margin-bottom: 3.6rem;
    }
    .article__header .el__credit {
        margin-top: 0;
        margin-bottom: .5rem;
        line-height: 2.125;
        font-size: 1.6rem;
	}
}
			
/* article body */
.article__body {
    margin-bottom: 6.3rem; /* 8rem */
}
.lead, .infobox, .article {
    margin-bottom: 6.3rem; /* 8rem */
}
.article__body .infobox {
    padding: 4.1rem 4.2rem 4.1rem; /*5rem 4.2rem */
	background: #faf8f5;
    margin-bottom: 6.3rem;
}
.article__body .infobox .gosoudan {
    margin-bottom: 4.8rem; /* 4rem */
}
.article__body .infobox-header {
    margin-bottom: 1.8rem; /* 4rem */
}
.article__body .infobox-heading {
    margin-bottom: 1rem;
    line-height: 4.2rem;
    font-weight: 500;
    font-size: 2.4rem;
    letter-spacing: .04em;
}
.article__body .infobox-body dl > div {
    display: flex;
    padding: 0;
}
.article__body .infobox-body dl dt {
    flex: 0 0 auto;
    width: 1;
}
.article__body .infobox-body dl dd {
    flex: 0 1 auto;
}
.article__body .infobox-body dl > div {
    display: flex;
    padding: 0;
}
.article__body .el__pictgroup {
    display: flex;
    justify-content: space-between;
    margin-top: 3.6rem; /* 3rem */
    margin-bottom: 4.8rem; /* 3rem */
}
.article__body .el__pictgroup .el__figure {
	width: 100%;
	margin: 0 1.2rem 0 0
}
.article__body .el__pictgroup .el__figure figcaption {
    margin-top: 1rem;
    line-height: 1.8333;
	font-size: 1.2rem;
	text-align: center;
}
.article__body .el__textgroup {
    line-height: 2.125;
	font-size: 1.6rem;
}
.article__body .el__textgroup-br {
	line-height: 2.125;
	font-size: 1.6rem;
	margin-bottom: 4.8rem;
}
.article__body .el__textgroup h5{
	font-weight: bold;
	margin-bottom: .9rem;
}
.article__body .el__textgroup-br h5{
	font-weight: bold;
	margin-bottom: .9rem;
}
@media (max-width: 767px) {
    .article__body {
        max-width: none;
        margin: 0;
    }
	.article__body .infobox {
	margin: 0 -5rem 1.2rem -2rem;
	padding: 4.1rem 5rem 5rem 3rem; /*5rem 5rem 5rem 3rem */
	background: #faf8f5;
	}
    .article__body .el__pictgroup {
		display: block;
    }
    .article__body .el__pictgroup .el__figure {
		width: auto;
    }
    .article__body .el__pictgroup .el__figure:not(:last-child) {
        margin-bottom: 2rem;
    }
}
			
/* ----- // fadein animation ----- */

/* ----- loading animation // ----- */
.animation__loading {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10010;
    width: 100%;
    height: 100%;
    background: #fef0e7;
}
.animation__loading-logo {
    text-align: center;
    opacity: 0;
}
.animation__loading-logo img:nth-child(1) {
    display: block;
    width: 25rem;
}
.animation__loading-logo img:nth-child(2) {
    display: inline-block;
    width: 16.8rem;
}

/* progress 0 */
.header {
    left: -364px;
}
@media (max-width: 767px) {
    .header {
        left: 100vw;
    }
}
[data-load-progress="0"] {
    pointer-events: none;
}

/* progress 1 */
[data-load-progress="1"] .animation__loading-logo {
    opacity: 1;
    transition: opacity 1000ms;
}

/* progress 2 */
[data-load-progress="2"] .animation__loading {
    background-color: #fff;
    transition: background-color 1000ms;
}
[data-load-progress="2"] .animation__loading-logo {
    opacity: 0;
    transition: opacity 500ms;
}

/* progress 3 */
[data-load-progress="3"] .animation__loading {
    background-color: #fff;
}
[data-load-progress="3"] .header {
    z-index: 10020;
    left: 0;
    transition: left 1000ms;
}

/* progress 4 */
[data-load-progress="4"] .animation__loading {
    background-color: #fff;
    opacity: 0;
    transition: opacity 1000ms;
}
[data-load-progress="4"] .header {
    z-index: 10020;
    left: 0;
}

/* progress 5 */
[data-load-progress="5"] {
    pointer-events: auto;
}
[data-load-progress="5"] .animation__loading {
    display: none !important;
}
[data-load-progress="5"] .header {
    left: 0;
}
@media (max-width: 767px) {
    [data-load-progress="2"] .animation__loading {
        background-color: #feefe2;
    }
    [data-load-progress="2"] .animation__loading img {
        opacity: 1;
    }
    [data-load-progress="3"] .animation__loading {
        background-color: #fff;
        transition: background-color 1000ms;
    }
    [data-load-progress="3"] .animation__loading img {
        opacity: 0;
        transition: opacity 500ms;
    }
    [data-load-progress="3"] .header {
        left: 100vw;
    }
    [data-load-progress="4"] .header {
        left: 100vw;
    }
    [data-load-progress="5"] .header {
        left: 100vw;
    }
}
/* ----- // loading animation ----- */