.font-en { font-family: 'Josefin Sans', sans-serif; }

.font-maru { font-family: 'Zen Maru Gothic', sans-serif; }

.font-num { font-family: 'Roboto', sans-serif; }

.ps-nav { max-width: 1280px; margin: 0 auto 130px; border-bottom: 1px solid #0d3078; }
@media screen and (max-width: 750px) { .ps-nav { margin-bottom: 80px; } }
.ps-nav .nav-con { display: flex; }
@media screen and (max-width: 750px) { .ps-nav .nav-con { display: block; } }
.ps-nav .nav-fig { position: relative; width: 50%; }
@media screen and (max-width: 750px) { .ps-nav .nav-fig { width: 100%; } }
.ps-nav .nav-fig .nav-fig-box { position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: 40px; color: #fff; text-align: center; }
.ps-nav .nav-fig .nav-fig-box dl dt { font-size: 2.5rem; font-weight: bold; line-height: 1.2; }
@media screen and (max-width: 960px) { .ps-nav .nav-fig .nav-fig-box dl dt { font-size: 1.875rem; } }
.ps-nav .nav-fig .nav-fig-box dl dd { font-size: 16.875rem; font-style: italic; }
@media screen and (max-width: 960px) { .ps-nav .nav-fig .nav-fig-box dl dd { font-size: 10.625rem; } }
.ps-nav .nav-box { position: relative; width: 50%; }
@media screen and (max-width: 750px) { .ps-nav .nav-box { width: 100%; } }
.ps-nav .nav-box a { display: flex; align-items: center; justify-content: center; text-decoration: none; width: 100%; height: 100%; padding: 40px; color: #0d3078; }
.ps-nav .nav-box dl dt { margin-bottom: 0.5em; padding-bottom: 45px; background: url("../img/project_story/arrow_i001.png") no-repeat left bottom; background-size: contain; font-size: 3.75rem; font-weight: 700; line-height: 1.2; }
@media screen and (max-width: 960px) { .ps-nav .nav-box dl dt { font-size: 2.5rem; } }
.ps-nav .nav-box dl dd { font-size: 1.875rem; font-weight: bold; }
@media screen and (max-width: 960px) { .ps-nav .nav-box dl dd { font-size: 1.25rem; } }

.mainttl-con .ttl-note { position: absolute; bottom: 0.5em; right: 1em; font-size: 0.8rem !important; }
@media screen and (max-width: 750px) { .mainttl-con .ttl-note { font-size: 0.625rem !important; } }


.ps-ttl { position: relative; background-color: #0e3078; }
.ps-ttl figure { max-width: 1280px; margin: 0 auto; }
.ps-ttl .ttl-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.ps-ttl .inner { height: 100%; }
.ps-ttl .ttl-con { position: relative; width: 100%; height: 100%; }
.ps-ttl .ttl-no { position: absolute; bottom: 0; left: 0; color: #fff; text-align: center; margin-bottom: -4.5em; }
@media screen and (max-width: 960px) { .ps-ttl .ttl-no { margin-bottom: -3em; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-no { margin-bottom: -0.8em; } }
.ps-ttl .ttl-no.is-inverse { color: #0e3078; }
.ps-ttl .ttl-no dt { font-size: 2.5rem; font-weight: bold; line-height: 1.2; }
@media screen and (max-width: 960px) { .ps-ttl .ttl-no dt { font-size: 1.875rem; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-no dt { font-size: 1rem; } }
.ps-ttl .ttl-no dd { font-size: 16.875rem; font-style: italic; line-height: 1; }
@media screen and (max-width: 960px) { .ps-ttl .ttl-no dd { font-size: 10.625rem; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-no dd { font-size: 3.125rem; } }
.ps-ttl .ttl-box { position: absolute; top: 50%; right: 0%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); }
.ps-ttl .ttl-heading { font-size: 3.8125rem; font-weight: bold; color: #0d3078; }
@media screen and (max-width: 1200px) { .ps-ttl .ttl-heading { font-size: 2.5rem; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-heading { font-size: 1.25rem; } }
.ps-ttl .ttl-heading span { padding: 0.2em 0.5em; background-color: #fff; }
.ps-ttl .ttl-name { margin: 5em 0 0 5em; color: #fff; }
@media screen and (max-width: 1200px) { .ps-ttl .ttl-name { margin: 3em 0 0 3em; } }
@media screen and (max-width: 960px) { .ps-ttl .ttl-name { margin: 2em 0 0 2em; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-name { margin: 0.5em 0 0 0.5em; } }
.ps-ttl .ttl-name dt { font-size: 1.25rem; font-weight: bold; }
@media screen and (max-width: 960px) { .ps-ttl .ttl-name dt { font-size: 1.125rem; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-name dt { font-size: 0.625rem; } }
.ps-ttl .ttl-name dd { font-size: 2.9375rem; }
@media screen and (max-width: 960px) { .ps-ttl .ttl-name dd { font-size: 1.875rem; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-name dd { font-size: 1.125rem; } }


.ps-ttl .ttl-note { margin: 0 0 0 5rem; color: #fff; font-size: .8rem; }
@media screen and (max-width: 1200px) { .ps-ttl .ttl-note { margin: 0 0 0 3em; } }
@media screen and (max-width: 960px) { .ps-ttl .ttl-note { margin: 0 0 0 2rem; } }
@media screen and (max-width: 750px) { .ps-ttl .ttl-note { margin:  0 0 0 0.5rem; font-size: 0.625rem; width: 9rem; } }


.ps-copy { padding: 55px 0; font-size: 1.875rem; font-weight: bold; color: #0d3078; }
@media screen and (max-width: 750px) { .ps-copy { font-size: 1.25rem; } }

.ps-con { background-color: #0d3078; color: #fff; }
.ps-con .ps-box { position: relative; padding: 90px 0 120px; border-bottom: 1px solid #42579d; }
@media screen and (max-width: 750px) { .ps-con .ps-box { padding: 80px 0; } }
.ps-con .ps-box .ps-item { width: 66.6666666667%; }
@media screen and (max-width: 750px) { .ps-con .ps-box .ps-item { width: 100%; } }
.ps-con .ps-box .ps-box-txt { margin-bottom: 70px; font-size: 1.125rem; line-height: 2; }
@media screen and (max-width: 750px) { .ps-con .ps-box .ps-box-txt { margin-bottom: 40px; line-height: 1.6; } }
.ps-con .ps-box .ps-box-txt small { font-size: 1rem; font-weight: 300; }
.ps-con .ps-box .ps-box-txt:last-child { margin-bottom: 0; }
.ps-con .ps-box .ps-box-txt.ps-box-txt_s { width: 67.5%; }
@media screen and (max-width: 750px) { .ps-con .ps-box .ps-box-txt.ps-box-txt_s { width: 100%; } }
.ps-con .ps-box .ps-box-txt.ps-box-bl { margin-bottom: 190px; }
@media screen and (max-width: 750px) { .ps-con .ps-box .ps-box-txt.ps-box-bl { margin-bottom: 40px; } }
.ps-con .ps-box .ps-fig { position: absolute; top: 0; }
@media screen and (max-width: 750px) { .ps-con .ps-box .ps-fig { position: static; } }
.ps-con .ps-box-r .ps-fig { right: 0; margin-top: 90px; }
@media screen and (max-width: 1200px) { .ps-con .ps-box-r .ps-fig { width: 46.875%; } }
@media screen and (max-width: 750px) { .ps-con .ps-box-r .ps-fig { width: 100%; } }
.ps-con .ps-box-r .ps-fig figure { position: relative; margin-right: 40px; padding-bottom: 56.6666666667%; }
@media screen and (max-width: 750px) { .ps-con .ps-box-r .ps-fig figure { margin-right: 0; padding-bottom: 10.9375%; } }
.ps-con .ps-box-r .ps-fig figure img { position: relative; }
.ps-con .ps-box-r .ps-fig figure::before { content: ''; position: absolute; top: 0; right: 0; width: 56.6666666667%; height: 56.6666666667%; margin-top: 26.6666666667%; background-color: #42579d; margin-right: -40px; }
@media screen and (max-width: 750px) { .ps-con .ps-box-r .ps-fig figure::before { width: 90.625%; margin-right: 0; } }
.ps-con .ps-box-l .ps-item { margin: 0 0 0 auto; }
.ps-con .ps-box-l .ps-fig { left: 0; margin-top: 7.03125%; }
@media screen and (max-width: 1200px) { .ps-con .ps-box-l .ps-fig { width: 29.6875%; } }
@media screen and (max-width: 750px) { .ps-con .ps-box-l .ps-fig { width: 100%; } }
.ps-con .ps-box-l .ps-fig figure { position: relative; padding-bottom: 51.8421052632%; }
@media screen and (max-width: 750px) { .ps-con .ps-box-l .ps-fig figure { padding-bottom: 10.9375%; } }
.ps-con .ps-box-l .ps-fig figure img { position: relative; }
.ps-con .ps-box-l .ps-fig figure::before { content: ''; position: absolute; top: 0; left: 0; width: 51.8421052632%; height: 51.8421052632%; margin-top: 26.3157894737%; background-color: #42579d; }
@media screen and (max-width: 750px) { .ps-con .ps-box-l .ps-fig figure::before { width: 90.625%; height: 56.6666666667%; margin-top: 26.6666666667%; } }

.ps-prf { position: relative; margin-top: -20px; margin-bottom: 100px; padding: 160px 0; }
@media screen and (max-width: 750px) { .ps-prf { margin-bottom: 80px; padding: 80px 0; } }
.ps-prf::before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: #42579d; transform: skewY(4deg); z-index: -1; }
.ps-prf .prf-heading { margin-bottom: 50px; font-size: 6.25rem; font-weight: bold; color: #fff; }
@media screen and (max-width: 750px) { .ps-prf .prf-heading { margin-left: 0; margin-bottom: 30px; font-size: 3.125rem; } }
.ps-prf .prf-txt { max-width: 800px; margin: 0 auto; color: #fff; }
.ps-prf .prf-fig { position: absolute; top: 0; right: 0; width: 58.3333333333%; max-width: 884px; margin-top: -20px; }
@media screen and (max-width: 1200px) { .ps-prf .prf-fig { width: 49.75%; } }
@media screen and (max-width: 750px) { .ps-prf .prf-fig { position: static; width: 100%; margin-bottom: 30px; } }

.ps-lnav { margin-bottom: 140px; }
@media screen and (max-width: 750px) { .ps-lnav { margin-bottom: 80px; } }
.ps-lnav .lnav-heading { font-size: 3.125rem; font-weight: bold; text-align: center; color: #0d3078; }
@media screen and (max-width: 750px) { .ps-lnav .lnav-heading { font-size: 2.25rem; } }
.ps-lnav ul { display: flex; flex-wrap: wrap; width: 100%; max-width: 788px; margin: 0 auto; }
@media screen and (max-width: 750px) { .ps-lnav ul { display: block; } }
.ps-lnav ul li { width: 48.2233502538%; margin-right: 3.5532994924%; margin-bottom: 3.5532994924%; }
@media screen and (max-width: 750px) { .ps-lnav ul li { width: 100%; margin-right: 0; margin-bottom: 40px; } }
.ps-lnav ul li:nth-child(2n) { margin-right: 0; }
.ps-lnav ul li:last-child { margin-right: 0; }
@media screen and (max-width: 750px) { .ps-lnav ul li:last-child { margin-bottom: 0; } }
.ps-lnav ul li a { position: relative; display: block; width: 100%; height: 100%; }
.ps-lnav ul li .ps-lnav-ttl { position: absolute; top: 0; left: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #fff; }
.ps-lnav ul li .ps-lnav-ttl dl dt { display: flex; align-items: flex-end; justify-content: flex-start; line-height: 1; }
.ps-lnav ul li .ps-lnav-ttl dl dt p { margin-bottom: 1.5em; font-size: 1.4375rem; font-weight: bold; }
.ps-lnav ul li .ps-lnav-ttl dl dt span { font-size: 10rem; font-weight: bold; font-style: italic; }
.ps-lnav ul li .ps-lnav-ttl dl dd { margin-top: -0.5em; font-size: 2.1875rem; font-weight: bold; line-height: 1.2; }
.ps-lnav ul li .ps-lnav-txt { position: absolute; bottom: 0; right: 0; width: 100%; max-width: 160px; padding: 10px; background-color: #0d3078; font-size: 1rem; font-weight: bold; color: #fff; text-align: center; line-height: 1; }


.ps-lnav .ttl-note { font-size: .8rem; max-width: 788px; margin: -1rem auto; text-align: right; }
@media screen and (max-width: 750px) { .ps-lnav .ttl-note { font-size: 0.625rem; margin: 0.5rem auto; } }



/*# sourceMappingURL=project_story.css.map */