@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&family=Quicksand:wght@300..700&display=swap');

/*---------*/
.l-philosophy { counter-reset: section; }
.l-kv { background-image: url("../../img/philosophy/kv-bg.jpg"); background-repeat: no-repeat; background-attachment: fixed; background-size: 100%; background-position: left top }
.c-parallax { color: #fff; position: relative; min-height: 100vh; display: flow-root; padding: 0; }
.c-parallax__img { position: -webkit-sticky; position: sticky; top: 0; width: 100%; height: 100vh; z-index: 0; }
.c-parallax__content { margin-bottom: 5em; line-height: 1.8; position: relative; z-index: 1; margin-top: -100vh; }
.c-parallax__content .c-ttl { position: relative; counter-increment: section; margin-bottom: 3em; padding-left: 9em; }
.c-parallax:first-of-type .c-ttl { padding-left: 8em; }
.c-parallax:nth-of-type(4) .c-ttl { padding-left: 10em; }
.c-parallax__content a { color: #fff !important; }
.c-parallax__content .c-ttl::before { font-size: 6em; content: counter(section, decimal-leading-zero); position: absolute; transform: translateY(-50%); top: 50%; left: 0; font-weight: 500; line-height: 1; font-family: "Montserrat", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; font-display: swap; opacity: 0.6; }
.c-parallax__content .c-ttl .c-ttl__main { font-family: "Quicksand", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; font-display: swap; line-height: 1; padding-bottom: 0.3em; margin-bottom: 0.3em; border-bottom: 1px solid #fff; }
.c-parallax__content .c-ttl p { line-height: 1; margin-bottom: 0; text-align: right; font-size: 0.88em; }
.c-parallax__content .c-op-box_white { background: rgba(255, 255, 255, 0.1); }
.c-parallax__content .c-op-box_white p { margin-bottom: 2em; }
.c-parallax__content p + .c-ttl__sub, .c-parallax__content dl + .c-ttl__sub, .c-parallax__content dl + p, .c-parallax__content ul + p { margin-top: 3em; }
.c-list__table01 { margin-bottom: 1em; }
.c-list__table01 dt { text-align: center; }
.c-list__table01 dt span { padding: 0.3em 0.8em; background-color: #fff; font-weight: 700; font-size: 0.8em; color: #081c42; border-radius: 0.8em; line-height: 1.5; display: block; }
.c-ttl__sub { position: relative; padding-left: 1.5em; margin-bottom: 1.5em; line-height: 1.6; font-size: 1.3em; }
.c-ttl__sub::before { position: absolute; content: ''; transform: translateY(-50%); top: 50%; left: 0; width: 0.4em; height: 100%; background-color: #fff; }
.c-chart__box, .c-timeline { margin-bottom: 6em; }
.c-timeline .c-timeline__box { position: relative; padding: 1.5em 0; }
.c-timeline .c-timeline__box::before { position: absolute; content: ''; background-color: #fff; width: 1px; height: 100%; }
.c-timeline .c-timeline__date { font-weight: 500; line-height: 1; font-family: "Montserrat", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; font-display: swap; position: relative; }
.c-timeline .c-timeline__date::before { position: absolute; content: ''; background-color: #fff; width: 0.524em; height: 0.524em; border-radius: 50%; }
.c-timeline .c-timeline__disc { background: rgba(12, 29, 64, 0.8); padding: 1em 2em; border-radius: 1.875em; }
.c-timeline .c-timeline__disc p:last-of-type { margin-bottom: 0 !important }
.c-timeline .c-timeline__disc h3 { font-size: 1.2em; margin-bottom: 0.5em; }
.l-method { counter-reset: method; }
.c-ttl__num { position: relative; counter-increment: method; margin-bottom: 1.5em; padding-left: 3.5em; font-size: 2em; }
.c-ttl__num::before { content: counter(method); position: absolute; transform: translateY(-50%); top: 50%; left: 0; font-weight: 500; line-height: 1; font-family: "Montserrat", sans-serif; font-optical-sizing: auto; font-weight: 500; font-style: normal; font-display: swap; width: 1.5em; text-align: center; }
.c-ttl__num::after { position: absolute; content: ''; top: 50%; left: 0; transform: translateY(-50%); border: 1px solid #fff; width: 1.5em; height: 1.5em; }
.c-ttl__num span { position: relative; }
.c-ttl__num span::before { position: absolute; content: ''; top: 50%; left: -1.95em; transform: translateY(-50%); width: 1.5em; height: 1px; background-color: #fff; }
.c-method__img { margin: 0 auto 3em; }
.c-method__img img { width: 100%; height: auto; }
.c-chart__box dl { margin-bottom: 7em; position: relative; }
.c-chart__box dl::before { position: absolute; content: ''; background: url(../../img/philosophy/ic-arrows.png) no-repeat center / 100%; left: 50%; transform: translateX(-50%); bottom: -5em; width: 1.688em; height: 3.188em; }
.c-chart__box dt { background-color: #0C1D40; padding: 1em; text-align: center; }
.c-chart__box dt span { background-color: #FFE602; padding: 0.3em 0; width: 10em; border-radius: 3em; font-size: 0.875em; color: #0C1D40; font-weight: 700; display: inline-block; }
.c-chart__box dt strong { font-weight: 700; font-size: 1.375em;}
.c-chart__box dd { background-color: #fff; width: 100%; color: #0C1D40; padding: 2em; }
.c-chart__box dd .c-ttl__line { text-align: center; font-weight: 700; margin-bottom: 1em; padding-bottom: 0.7em; border-bottom: 1px solid #0C1D40; line-height: 1; }
.c-chart__box dd li { margin-bottom: 0.5em; }
.c-chart__box .c-txt { text-align: center; }
.c-chart__box .c-txt a { color: #fff; text-decoration: none; position: relative; font-weight: 700; padding-left: 1em;}
.c-chart__box .c-txt a::before { position: absolute; content: ''; background: url(../../img/philosophy/ic-arrows.png) no-repeat center / 100%; left: 0; transform: translateY(-50%) scaleY(-1); top: 50%; width: 0.525em; height: 1.275em; }
.u-list__circle li { position: relative; padding-left: 1em }
.u-list__circle li::before { position: absolute; content: ''; width: 0.4em; height: 0.4em; background-color: #0C1D40; border-radius: 1em; left: 0; top: 0.7em; }
.l-what .c-op-box_white { margin-bottom: 4em; }
.l-method .u-list__circle li:before { background-color: #fff; }
.l-author { width: 100%; margin: 3em auto 0; background-color: #0C1D40;}
.l-author dl { display: block; }
.l-author dt { margin: 0 auto 2em; width: 12.5em; }
.l-author dd { width: auto; }
@media only screen and (min-width:768px) {
	.l-history-p .c-parallax__img { background: url(../../img/philosophy/bg-history.webp) no-repeat center / cover; }
	.l-what .c-parallax__img { background: url(../../img/philosophy/bg-what.webp) no-repeat center / cover; }
	.l-method .c-parallax__img { background: url(../../img/philosophy/bg-method.webp) no-repeat center / cover; }
	.l-chart .c-parallax__img { background: url(../../img/philosophy/bg-chart.webp) no-repeat center / cover; }
	.c-section__disc { text-align: center; }
	.c-parallax__content { padding-top: 6em; }
	.c-parallax__content .c-ttl .c-ttl__main { font-size: 2.3em; }
	.c-parallax__content .c-op-box_white { padding: 3em 3.3em; border-radius: 2em; }
	.c-list__table01 { display: flex; gap: 1em; }
	.c-list__table01 dt { width: 25%; flex: 0 0 10em; }
	.c-list__table01 dd { width: 75%; }
	.l-what.l-section { padding-top: 0; margin-top: 0.8em; }
	.l-what .c-parallax__content { width: 45%; margin-left: 50%; }
	.l-history-p .c-parallax__content { width: 80%; max-width: 62.5em; margin: -100vh auto 5em; }
	.c-timeline .c-timeline__box { display: flex; gap: 3em; justify-content: flex-start; width: 80%; max-width: 50em; margin: 0 auto; }
	.c-timeline .c-timeline__box::before { top: 0; left: 11em; }
	.c-timeline .c-timeline__date { font-size: 2.625em; flex: 0 0 5em; margin-top: 0.6em; }
	.c-timeline .c-timeline__date::before { top: 0.2em; left: 3.93em; }
	.l-method .c-parallax__content { width: 80%; max-width: 62.5em; margin: -100vh auto 5em; }
	.c-method__box { width: 80%; max-width: 50em; margin: 0 auto 5em; }
	.c-method__img { max-width: 31.25em }
	.l-chart .c-parallax__content { width: 80%; max-width: 50em; margin: -100vh auto 5em; }
	.c-chart__box dl { display: flex; justify-content: stretch; }
	.c-chart__box dt { flex: 0 0 15.625em; border-radius: 1.875em 0 0 1.875em; display: flex; flex-direction: column; position: relative; justify-content: center; align-items: center; background: #0C1D40 url(../../img/philosophy/ic-chart.png) no-repeat center 64% / 50%; }
	.c-chart__box dt span { position: absolute; top: 2em; left: 50%; transform: translateX(-50%);}
	.c-chart__box dt strong { display: block; text-align: center; transform: translateY(1em);}
	.c-chart__box dd { border-radius: 0 1.875em 1.875em 0; }
	.c-chart__box dd .c-ttl__line { font-size: 2em; }
	.c-chart__box .c-txt a { font-size: 2.625em; }
	.l-author { border-radius: 2em;}
}
@media screen and (min-width:768px) and (max-width:1200px) {
	.c-parallax { font-size: 1.294498vw; }
}
@media only screen and (max-width:767px) {
	.breadcrumb { padding: 0.5em 20px }
	.c-parallax { font-size: 3.2vw; }
	.l-history-p .c-parallax__img { background: url(../../img/philosophy/sp/bg-history.webp) no-repeat center / cover; }
	.l-what .c-parallax__img { background: url(../../img/philosophy/sp/bg-what.webp) no-repeat center / cover; }
	.l-method .c-parallax__img { background: url(../../img/philosophy/sp/bg-method.webp) no-repeat center / cover; }
	.l-chart .c-parallax__img { background: url(../../img/philosophy/sp/bg-chart.webp) no-repeat center / cover; }
	.c-parallax__content { padding: 0 5%; padding-top: 3em; }
	.c-parallax__content .c-op-box_white { border-radius: 1.5em; padding: 2.5em 2.5em; }
	.c-parallax__content .c-ttl .c-ttl__main { font-size: 2em; }
	.c-list__table01 dt { margin: 0 auto 0.8em; }
	.c-list__table01 dt span {font-size: 1.2em; }
	.c-list__table01 dd { margin-bottom: 2em; padding: 0 1em; }
	.c-timeline .c-timeline__box { padding-left: 3em; }
	.c-timeline .c-timeline__box::before { top: 0; left: 1em; }
	.c-timeline .c-timeline__date { font-size: 2.625em; margin-bottom: 0.5em; }
	.c-timeline .c-timeline__date::before { top: 0.2em; left: -1em; }
	.c-method__img { width: 80%; max-width: 21.875em }
	.l-chart .c-section__disc br { display: none; }
	.c-chart__box dt { border-radius: 1.875em 1.875em 0 0; background: #0C1D40 url(../../img/philosophy/ic-chart.png) no-repeat 95% center / 21%; }
	.c-chart__box dt span { margin-bottom: 0.5em; }
	.c-chart__box dt strong { display: block;}
	.c-chart__box dd { border-radius: 0 0 1.875em 1.875em; }
	.c-chart__box dd .c-ttl__line { font-size: 1.8em; }
	.c-chart__box .c-txt a { font-size: 2.625em; }
	.l-author { border-radius: 1.5em;}
}