File "styles.css"
Full path: /home/xs854402/smcse.co.jp/public_html/test.smcse.co.jp/wp-content/themes/Sumitomo-Mitsui/css/styles.css
File
size: 245.18 B (245.18 KB bytes)
MIME-type: text/plain
Charset: utf-8
Download Open Edit Advanced Editor Back
@charset "UTF-8";
/* リキッドレイアウト対応 */
body {
font-family: "Noto Sans JP", sans-serif;
color: #333;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-transition: opacity 0.8s 0.3s ease-out;
transition: opacity 0.8s 0.3s ease-out;
opacity: 0;
-webkit-font-smoothing: antialiased;
line-break: strict;
}
footer {
margin-top: auto;
}
div[id^=track-], #chart, #history, #base {
scroll-margin-top: 80px;
}
@media screen and (min-width: 768px) {
div[id^=track-], #chart, #history, #base {
scroll-margin-top: 130px;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
}
html {
font-size: 10px;
}
@media (max-width: 375px) {
html {
font-size: 2.6666666667vw;
}
}
@media screen and (min-width: 768px) {
html {
font-size: 0.78125vw;
}
}
@media (min-width: 1280px) {
html {
font-size: 10px;
}
}
/* ホバー */
a {
text-decoration: none;
color: inherit;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
*,
*::before,
*::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
/* Remove default padding */
ul,
ol {
padding: 0;
}
/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
margin: 0;
}
/* Set core root defaults */
html {
scroll-behavior: smooth;
}
/* Set core body defaults */
body {
min-height: 100vh;
text-rendering: optimizeSpeed;
line-height: 1.5;
}
/* Remove list styles on ul, ol elements with a class attribute */
ul,
ol {
list-style: none;
}
/* A elements that don't have a class get default styles */
a:not([class]) {
text-decoration-skip-ink: auto;
}
/* Make images easier to work with */
img {
max-width: 100%;
display: block;
width: 100%;
}
/* Natural flow and rhythm in articles by default */
article > * + * {
margin-top: 1em;
}
/* Form reset */
input,
button,
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
border: none;
border-radius: 0;
font: inherit;
outline: none;
padding: 0;
}
textarea {
resize: vertical;
}
input[type=checkbox],
input[type=radio] {
display: none;
}
input[type=submit],
input[type=button],
label,
button,
select {
cursor: pointer;
}
select::-ms-expand {
display: none;
}
.c-breadcrumb {
padding-top: 8px;
padding-top: 0.8rem;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.c-breadcrumb {
padding-top: 1.6rem;
}
}
.c-button {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding-left: 64px;
padding-left: 6.4rem;
font-size: 20px;
font-size: 2rem;
position: relative;
letter-spacing: 0.1em;
min-height: 48px;
min-height: 4.8rem;
-webkit-transition: color 0.3s ease-out;
transition: color 0.3s ease-out;
line-height: 1.3;
}
.c-button:hover {
color: #4880E0;
}
.c-button::before {
content: "";
display: block;
width: 48px;
width: 4.8rem;
height: 48px;
height: 4.8rem;
border: 1px solid #D3D3D3;
border-radius: 50%;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
-webkit-transition: border 0.3s ease-out;
transition: border 0.3s ease-out;
}
.c-button:hover::before {
border-color: #4880E0;
}
.c-button::after {
content: "";
display: block;
width: 16px;
width: 1.6rem;
height: 16px;
height: 1.6rem;
background-image: url(../images/icon/button-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: 16px;
left: 1.6rem;
}
.c-entitle {
text-transform: capitalize;
color: #4880E0;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1;
}
@media screen and (min-width: 768px) {
.c-entitle {
font-size: 2.4rem;
}
}
.corporate .c-entitle {
color: #3E40A4;
text-transform: uppercase;
font-size: 32px;
font-size: 3.2rem;
font-weight: 400;
}
@media screen and (min-width: 768px) {
.corporate .c-entitle {
font-size: 6.4rem;
}
}
.c-entitle.c-entitle--capitalize {
text-transform: none;
}
.c-entitle.c-entitle--capitalize::first-letter {
text-transform: capitalize;
}
.c-img {
position: relative;
width: 100%;
}
.c-img::before {
content: "";
display: block;
}
.c-img img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.c-link {
display: block;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
min-width: 160px;
min-width: 16rem;
padding: 5.5px 5px;
padding: 0.55rem 0.5rem;
color: #FFF;
text-align: center;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
font-weight: 400;
background-color: #3E40A4;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.c-link {
font-size: 1.6rem;
padding: 1.2rem 0.5rem;
min-width: 24rem;
}
}
.c-link--construction {
font-size: 14px;
font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
.c-link--construction {
min-width: 20rem;
}
}
.c-link:hover {
background-color: #222470;
}
.c-text {
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
line-height: 2;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.c-text {
font-size: 1.6rem;
}
}
.c-theme {
font-weight: 500;
line-height: 1.25;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.c-theme {
font-size: 3.2rem;
}
}
.c-title {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
font-weight: 500;
font-size: 24px;
font-size: 2.4rem;
letter-spacing: 0.1em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 0.6rem;
-moz-column-gap: 0.6rem;
column-gap: 0.6rem;
margin-top: -3.5px;
margin-top: -0.35rem;
}
@media screen and (min-width: 768px) {
.c-title {
font-size: 4.8rem;
margin-top: -0.5rem;
-webkit-column-gap: 0.4rem;
-moz-column-gap: 0.4rem;
column-gap: 0.4rem;
}
}
.c-title::after {
content: "";
display: block;
width: 40px;
width: 4rem;
height: 1px;
background-color: #333;
line-height: 1;
}
@media screen and (min-width: 768px) {
.c-title::after {
width: 8rem;
}
}
.bottom .c-title {
width: auto;
line-height: 1.25;
margin-top: -0.5px;
margin-top: -0.05rem;
margin: 4px -2px 0 0;
margin: 0.4rem -0.2rem 0 0;
}
@media screen and (min-width: 768px) {
.bottom .c-title {
margin: 0.6rem 0 0 0;
}
}
.bottom .c-title::after {
content: none;
}
.corporate .c-title {
margin-top: 8px;
margin-top: 0.8rem;
font-size: 16px;
font-size: 1.6rem;
-webkit-column-gap: 0.65rem;
-moz-column-gap: 0.65rem;
column-gap: 0.65rem;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.corporate .c-title {
margin-top: 1.4rem;
font-size: 2rem;
-webkit-column-gap: 1.4rem;
-moz-column-gap: 1.4rem;
column-gap: 1.4rem;
}
}
.corporate .c-title::after {
width: 50px;
width: 5rem;
}
@media screen and (min-width: 768px) {
.corporate .c-title::after {
width: 10rem;
}
}
.l-404 {
padding-top: 120px;
padding-top: 12rem;
padding-bottom: 120px;
padding-bottom: 12rem;
}
.l-inner {
width: 100%;
padding-right: 16px;
padding-left: 16px;
margin-right: auto;
margin-left: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.l-inner {
max-width: 1330px;
padding-right: 25px;
padding-left: 25px;
}
}
@media screen and (min-width: 768px) {
.l-inner--narrow {
max-width: 1170px;
}
}
@media screen and (min-width: 768px) {
.l-inner--narrowest {
max-width: 1130px;
}
}
.l-related {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-related {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.l-topAbout {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 76px;
padding-bottom: 7.6rem;
}
@media screen and (min-width: 768px) {
.l-topAbout {
padding-top: 12.05rem;
padding-bottom: 16rem;
}
}
.l-topBlog {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topBlog {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.l-topHowto {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topHowto {
padding-top: 12.05rem;
padding-bottom: 12rem;
}
}
.l-topInformation {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topInformation {
padding-top: 12.05rem;
padding-bottom: 12rem;
}
}
.l-topInterview {
padding-top: 56px;
padding-top: 5.6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topInterview {
padding-top: 11.65rem;
padding-bottom: 12rem;
}
}
.l-topPerson {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topPerson {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.l-topResearch {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topResearch {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.l-topTalk {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-topTalk {
padding-top: 12.15rem;
padding-bottom: 12rem;
}
}
.l-wrapper {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.l-wrapper {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.wpcf7-form-control-wrap {
width: 100%;
}
@media screen and (min-width: 768px) {
.wpcf7-form-control-wrap {
max-width: 71.4rem;
margin-left: auto;
}
}
.p-form__birth .wpcf7-form-control-wrap {
width: auto;
}
@media screen and (min-width: 768px) {
.p-form__birth .wpcf7-form-control-wrap {
margin: 0;
}
}
.wpcf7-list-item {
margin: 0;
}
.wpcf7-not-valid-tip {
font-size: 16px;
font-size: 1.6rem;
white-space: nowrap;
font-weight: 500;
}
.p-form__radiobutton .wpcf7-not-valid-tip,
.p-form__check .wpcf7-not-valid-tip {
margin-left: 0;
}
.wpcf7 form .wpcf7-response-output {
display: none;
}
.wpcf7-spinner {
display: none;
}
.p-form__check .wpcf7-list-item-label {
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: 0.1em;
position: relative;
margin-left: 27px;
margin-left: 2.7rem;
margin-right: 3px;
margin-right: 0.3rem;
}
@media screen and (min-width: 768px) {
.p-form__check .wpcf7-list-item-label {
margin-right: 2.3rem;
}
}
@media screen and (min-width: 768px) {
.p-form__check--list .wpcf7-list-item-label {
font-size: 1.4rem;
}
}
.p-form__check .wpcf7-list-item-label:before {
content: "";
background: #FFF;
border: 1px solid #D9D9D9;
border-radius: 50%;
display: block;
position: absolute;
top: 4px;
top: 0.4rem;
left: -27px;
left: -2.7rem;
width: 16px;
width: 1.6rem;
height: 16px;
height: 1.6rem;
}
.p-form__check .wpcf7-list-item-label:after {
content: "";
background: #D9D9D9;
border-radius: 50%;
display: block;
opacity: 0;
position: absolute;
top: 12px;
top: 1.2rem;
left: -23px;
left: -2.3rem;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 8px;
width: 0.8rem;
height: 8px;
height: 0.8rem;
-webkit-transition: 0.3s ease;
transition: 0.3s ease;
}
input[type=checkbox]:checked + .wpcf7-list-item-label:after {
opacity: 1;
}
.wpcf7-form-control.wpcf7-radio.p-form__radio {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 15px;
row-gap: 1.5rem;
}
@media screen and (min-width: 768px) {
.wpcf7-form-control.wpcf7-radio.p-form__radio {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-column-gap: 3.6rem;
-moz-column-gap: 3.6rem;
column-gap: 3.6rem;
}
}
@media screen and (min-width: 768px) {
.wpcf7-form-control.wpcf7-radio.p-form__radio--category {
-webkit-column-gap: 1.5rem;
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
}
.wpcf7-form-control.wpcf7-radio.p-form__radioDay {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 9px 20px;
gap: 0.9rem 2rem;
width: 100%;
max-width: 238px;
max-width: 23.8rem;
}
@media screen and (min-width: 768px) {
.wpcf7-form-control.wpcf7-radio.p-form__radioDay {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
max-width: none;
-webkit-column-gap: 1.65rem;
-moz-column-gap: 1.65rem;
column-gap: 1.65rem;
}
}
.p-form__wrap--capabilities .wpcf7-list-item.last::after {
content: " ※ご記入ください。";
font-size: 15px;
font-size: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-form__wrap--capabilities .wpcf7-list-item.last::after {
font-size: 1.8rem;
}
}
.wp-pagenavi {
text-align: center;
font-size: 24px;
font-size: 2.4rem;
font-weight: 500;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
padding-bottom: 24px;
padding-bottom: 2.4rem;
}
@media screen and (min-width: 768px) {
.wp-pagenavi {
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
padding-bottom: 4.8rem;
}
}
.pagenavi-bottom {
margin-top: 24px;
margin-top: 2.4rem;
padding-bottom: 0;
}
@media screen and (min-width: 768px) {
.pagenavi-bottom {
margin-top: 4.8rem;
}
}
@media screen and (min-width: 768px) {
.pagenavi-jobs {
margin-left: auto;
}
}
.pagenavi-jobs .wp-pagenavi {
padding-bottom: 0;
}
.wp-pagenavi a, .wp-pagenavi span {
border-radius: 0.8rem;
background-color: #FFF;
padding: 0px 6.5px;
padding: 0rem 0.65rem;
white-space: nowrap;
-webkit-transition: color 0.3s, background-color 0.3s, border 0.3s;
transition: color 0.3s, background-color 0.3s, border 0.3s;
text-align: center;
text-decoration: none;
border: 1px solid #333;
width: 48px;
width: 4.8rem;
height: 48px;
height: 4.8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-weight: bold;
}
.corporate .wp-pagenavi a, .corporate .wp-pagenavi span {
border-radius: 0;
}
.corporate .wp-pagenavi span.current {
background-color: #3E40A4;
}
.wp-pagenavi .previouspostslink {
margin: 0;
padding: 0 11px;
padding: 0 1.1rem;
letter-spacing: 2px;
letter-spacing: 0.2rem;
position: relative;
color: transparent;
}
.wp-pagenavi .nextpostslink {
margin: 0;
padding: 0 11px;
padding: 0 1.1rem;
letter-spacing: 2px;
letter-spacing: 0.2rem;
position: relative;
color: transparent;
}
.wp-pagenavi .previouspostslink::after {
content: "";
position: absolute;
width: 12px;
width: 1.2rem;
height: 12px;
height: 1.2rem;
border-top: 3px solid #333;
border-left: 3px solid #333;
top: 50%;
left: 25px;
left: 2.5rem;
-webkit-transform: rotate(-45deg) translateY(-0.7rem);
transform: rotate(-45deg) translateY(-0.7rem);
}
.wp-pagenavi .nextpostslink::after {
content: "";
position: absolute;
width: 12px;
width: 1.2rem;
height: 12px;
height: 1.2rem;
border-bottom: 3px solid #333;
border-right: 3px solid #333;
top: 50%;
right: 14px;
right: 1.4rem;
-webkit-transform: rotate(-45deg) translateY(-0.7rem);
transform: rotate(-45deg) translateY(-0.7rem);
}
.wp-pagenavi .pages,
.wp-pagenavi .first,
.wp-pagenavi .last,
.wp-pagenavi .extend {
display: none;
}
.wp-pagenavi span.current {
color: #FFF;
background-color: #4880E0;
border: 1px solid #4880E0;
}
.wp-pagenavi a:hover {
color: #FFF;
background-color: #333;
opacity: 1;
}
.wp-pagenavi .previouspostslink:hover,
.wp-pagenavi .nextpostslink:hover {
color: transparent;
background-color: #333;
}
.wp-pagenavi .previouspostslink:hover::after {
border-top: 2px solid #FFF;
border-left: 2px solid #FFF;
}
@media screen and (min-width: 768px) {
.wp-pagenavi .previouspostslink:hover::after {
border-top: 3px solid #FFF;
border-left: 3px solid #FFF;
}
}
.wp-pagenavi .nextpostslink:hover::after {
border-bottom: 2px solid #FFF;
border-right: 2px solid #FFF;
}
@media screen and (min-width: 768px) {
.wp-pagenavi .nextpostslink:hover::after {
border-bottom: 3px solid #FFF;
border-right: 3px solid #FFF;
}
}
@media screen and (min-width: 768px) {
.p-topInterview .swiper-wrapper {
display: grid;
grid-template-columns: repeat(4, 1fr);
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
}
}
@media screen and (min-width: 768px) {
.p-topInterview .swiper-slide {
width: 100% !important;
}
}
.swiper .swiper-pagination-bullet {
background: #D9D9D9;
opacity: 1;
}
@media screen and (min-width: 768px) {
.p-fv .swiper-pagination-bullet,
.p-topHowto .swiper-pagination-bullet,
.p-internship .swiper-pagination-bullet {
width: 1.2rem;
height: 1.2rem;
}
}
@media screen and (min-width: 768px) {
.p-post .swiper-pagination-bullet {
width: 1.2rem;
height: 1.2rem;
}
}
.swiper .swiper-pagination-bullet-active {
background: #ABABAB;
}
.p-post .swiper .swiper-pagination-bullet-active {
background: #3E40A4;
}
.p-fv .swiper-horizontal > .swiper-pagination-bullets, .p-fv .swiper-pagination-bullets.swiper-pagination-horizontal, .p-fv .swiper-pagination-custom, .p-fv .swiper-pagination-fraction,
.p-topInterview .swiper-horizontal > .swiper-pagination-bullets,
.p-topInterview .swiper-pagination-bullets.swiper-pagination-horizontal,
.p-topInterview .swiper-pagination-custom,
.p-topInterview .swiper-pagination-fraction,
.p-internship .swiper-horizontal > .swiper-pagination-bullets,
.p-internship .swiper-pagination-bullets.swiper-pagination-horizontal,
.p-internship .swiper-pagination-custom,
.p-internship .swiper-pagination-fraction,
.p-post .swiper-horizontal > .swiper-pagination-bullets,
.p-post .swiper-pagination-bullets.swiper-pagination-horizontal,
.p-post .swiper-pagination-custom,
.p-post .swiper-pagination-fraction {
bottom: 0;
}
.p-topHowto .swiper-horizontal > .swiper-pagination-bullets, .p-topHowto .swiper-pagination-bullets.swiper-pagination-horizontal, .p-topHowto .swiper-pagination-custom, .p-topHowto .swiper-pagination-fraction {
bottom: 20px;
bottom: 2rem;
}
@media screen and (min-width: 768px) {
.p-fv .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .p-fv .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet,
.p-topHowto .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.p-topHowto .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet,
.p-internship .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.p-internship .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet,
.p-post .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.p-post .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 0.8rem;
}
}
.p-topHowto .swiper-slide,
.p-post .swiper-slide {
opacity: 0;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-topHowto .swiper-slide,
.p-post .swiper-slide {
opacity: 1;
}
}
.p-topHowto .swiper-slide-active,
.p-post .swiper-slide-active {
opacity: 1;
}
.p-topHowto .swiper-button-next,
.p-topHowto .swiper-button-prev {
color: #3E40A4;
}
.p-topHowto .swiper-button-next:after,
.p-topHowto .swiper-button-prev:after {
text-rendering: initial;
font-size: 26px;
font-size: 2.6rem;
}
@media screen and (min-width: 768px) {
.p-topHowto .swiper-button-next:after,
.p-topHowto .swiper-button-prev:after {
font-size: 3.8rem;
}
}
.p-topHowto .swiper-button-next, .p-topHowto .swiper-rtl .swiper-button-prev {
top: 96%;
left: calc(50% + 4rem);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
right: 5px;
right: 0.5rem;
}
@media screen and (min-width: 768px) {
.p-topHowto .swiper-button-next, .p-topHowto .swiper-rtl .swiper-button-prev {
left: calc(50% + 6rem);
}
}
.p-topHowto .swiper-button-prev, .p-topHowto .swiper-rtl .swiper-button-next {
top: 96%;
left: calc(50% - 4rem);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
.p-topHowto .swiper-button-prev, .p-topHowto .swiper-rtl .swiper-button-next {
left: calc(50% - 6rem);
}
}
.p-404__title {
text-align: center;
opacity: 0.4;
color: #333;
font-size: 32px;
font-size: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-404__title {
font-size: 6.4rem;
}
}
.p-404__title {
font-family: "Noto Sans JP", sans-serif;
letter-spacing: 0.1em;
font-weight: 300;
text-transform: uppercase;
}
.p-404__text {
text-align: center;
margin-top: 42px;
margin-top: 4.2rem;
}
@media screen and (min-width: 768px) {
.p-404__text {
font-size: 3rem;
}
}
.p-404__button {
margin-top: 80px;
margin-top: 8rem;
text-align: center;
}
.p-404__button a {
margin-inline: auto;
}
.p-accordion__theme {
border-left: 6px solid #4880E0;
padding-left: 4px;
padding-left: 0.4rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-accordion__theme {
border-width: 8px;
padding-left: 0.8rem;
font-size: 2.4rem;
}
}
.p-accordion__contents {
margin-top: 4px;
margin-top: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-accordion__contents {
margin-top: 0.75rem;
}
}
.p-accordion__wrap:nth-of-type(n+2) {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-accordion__wrap:nth-of-type(n+2) {
margin-top: 4.05rem;
}
}
.p-accordion__block {
border-bottom: 2px solid #F2F2F2;
padding: 6px 8px 8px;
padding: 0.6rem 0.8rem 0.8rem;
}
@media screen and (min-width: 768px) {
.p-accordion__block {
padding: 1.35rem 1.6rem;
}
}
.p-accordion__term {
position: relative;
cursor: pointer;
}
.p-accordion__term p,
.p-accordion__description p {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 1.55rem;
-moz-column-gap: 1.55rem;
column-gap: 1.55rem;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-accordion__term p,
.p-accordion__description p {
-webkit-column-gap: 1.5rem;
-moz-column-gap: 1.5rem;
column-gap: 1.5rem;
}
}
.p-accordion__description a {
color: #4880E0;
}
.p-accordion__term p {
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
padding-right: 24px;
padding-right: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-accordion__term p {
font-size: 2rem;
padding-right: 5rem;
}
}
.p-accordion__description p {
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-accordion__description p {
font-size: 1.6rem;
}
}
.p-accordion__term p::before {
content: "Q";
color: #4880E0;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
}
@media screen and (min-width: 768px) {
.p-accordion__term p::before {
font-size: 2.4rem;
}
}
.p-accordion__description p::before {
content: "A";
font-weight: 500;
font-size: 20px;
font-size: 2rem;
}
@media screen and (min-width: 768px) {
.p-accordion__description p::before {
font-size: 2.4rem;
}
}
.p-accordion__term span,
.p-accordion__description span {
display: block;
margin-top: 2px;
margin-top: 0.2rem;
}
@media screen and (min-width: 768px) {
.p-accordion__term span,
.p-accordion__description span {
margin-top: 0.3rem;
}
}
@media screen and (min-width: 768px) {
.p-accordion__description span {
margin-top: 0.55rem;
}
}
.p-accordion__open {
position: absolute;
top: 2px;
top: 0.2rem;
right: 0;
width: 16px;
width: 1.6rem;
height: 16px;
height: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-accordion__open {
top: 0.75rem;
}
}
.p-accordion__open::before,
.p-accordion__open::after {
content: "";
position: absolute;
display: block;
height: 2px;
height: 0.2rem;
width: 16px;
width: 1.6rem;
background-color: #4880E0;
top: 50%;
left: 50%;
}
.p-accordion__open::before {
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.p-accordion__open::after {
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
-webkit-transform: translate(-50%, -0.1rem) rotate(90deg);
transform: translate(-50%, -0.1rem) rotate(90deg);
}
.active .p-accordion__open::after {
-webkit-transform: translate(-50%, -50%) rotate(0deg);
transform: translate(-50%, -50%) rotate(0deg);
}
.p-accordion__description {
margin-top: 8px;
margin-top: 0.8rem;
display: none;
opacity: 0;
-webkit-transition: opacity 0.6s 0.2s;
transition: opacity 0.6s 0.2s;
}
@media screen and (min-width: 768px) {
.p-accordion__description {
margin-top: 1.05rem;
}
}
.p-accordion__description.open {
display: block;
opacity: 1;
}
.p-accordion__description a {
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 3px;
}
.p-archive__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-archive__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-archive__categories,
.p-archive__byYear {
display: grid;
gap: 8px;
gap: 0.8rem;
grid-template-columns: repeat(3, 1fr);
}
@media screen and (min-width: 768px) {
.p-archive__categories,
.p-archive__byYear {
grid-template-columns: repeat(8, 1fr);
}
}
.p-archive__categories {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-archive__categories {
margin-top: 4.8rem;
}
}
.p-archive__byYear {
margin-top: 16px;
margin-top: 1.6rem;
}
.p-archive__searchCategory {
background-color: #3E40A4;
color: #FFF;
text-align: center;
font-size: 16px;
font-size: 1.6rem;
padding: 8px 0;
padding: 0.8rem 0;
line-height: 1.25;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-archive__searchCategory {
font-size: 2rem;
padding: 1.15rem 0;
}
}
a.p-archive__searchCategory:hover {
background-color: #222470;
}
.p-archive__byYear a {
display: block;
background-color: #FFF;
border: 1px solid #3E40A4;
color: #3E40A4;
text-align: center;
font-size: 14px;
font-size: 1.4rem;
padding: 10px 0;
padding: 1rem 0;
line-height: 1.25;
letter-spacing: 0.1em;
-webkit-transition: color 0.3s ease-out, background-color 0.3s ease-out;
transition: color 0.3s ease-out, background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-archive__byYear a {
font-size: 1.6rem;
padding: 1.3rem 0;
}
}
.p-archive__byYear a:hover {
color: #FFF;
background-color: #3E40A4;
}
.p-archive__posts {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-archive__posts {
margin-top: 4.8rem;
}
}
.p-archive__items {
display: grid;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-archive__items {
grid-template-columns: repeat(2, 1fr);
-webkit-column-gap: 3.2rem;
-moz-column-gap: 3.2rem;
column-gap: 3.2rem;
}
}
.p-archive__info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
}
.p-archive__time {
display: block;
-ms-flex-negative: 0;
flex-shrink: 0;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
.p-archive__category {
background-color: #3E40A4;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
padding: 4px 16px;
padding: 0.4rem 1.6rem;
}
.p-archive__category:hover {
background-color: #222470;
}
.p-archive__title {
margin-top: 16px;
margin-top: 1.6rem;
font-weight: 500;
font-size: 24px;
font-size: 2.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-archive__title {
margin-top: 2.4rem;
font-size: 3.6rem;
}
}
.p-archive__thumbnail {
width: 100%;
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-archive__thumbnail {
margin-top: 4.8rem;
}
}
.p-archive__thumbnail img {
margin-inline: auto;
height: auto;
-o-object-fit: cover;
object-fit: cover;
width: auto;
}
.p-article__items {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-article__items {
margin-top: 4.8rem;
grid-template-columns: repeat(4, 1fr);
-webkit-column-gap: 2.4rem;
-moz-column-gap: 2.4rem;
column-gap: 2.4rem;
}
}
.p-archive__post {
margin-top: 27px;
margin-top: 2.7rem;
}
@media screen and (min-width: 768px) {
.p-archive__post {
margin-top: 5.4rem;
}
}
@media screen and (min-width: 768px) {
.p-archive__post .size-medium {
max-width: 68rem;
}
}
.p-archive__post img {
margin-top: 24px;
margin-top: 2.4rem;
width: auto;
height: auto;
-o-object-fit: cover;
object-fit: cover;
}
@media screen and (min-width: 768px) {
.p-archive__post img {
margin-top: 4.8rem;
}
}
.p-archive__post h2 {
margin-top: 24px;
margin-top: 2.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-weight: 500;
line-height: 1.25;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-archive__post h2 {
margin-top: 4.8rem;
font-size: 2.4rem;
}
}
.p-archive__post h2::before {
content: "";
display: block;
width: 6px;
width: 0.6rem;
background-color: #3E40A4;
}
@media screen and (min-width: 768px) {
.p-archive__post h2::before {
width: 0.8rem;
}
}
.p-archive__post h3 {
margin-top: 24px;
margin-top: 2.4rem;
border-bottom: 2px solid #3E40A4;
font-weight: 500;
line-height: 1.25;
font-size: 18px;
font-size: 1.8rem;
letter-spacing: 0.1em;
padding-bottom: 4px;
padding-bottom: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-archive__post h3 {
margin-top: 4.8rem;
font-size: 2rem;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
min-width: 54rem;
}
}
.p-archive__post h4 {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-archive__post h4 {
margin-top: 4.8rem;
font-size: 1.8rem;
}
}
.p-archive__post h5 {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
line-height: 1.25;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-archive__post h5 {
margin-top: 4.8rem;
font-size: 1.6rem;
}
}
.p-archive__post p, .p-archive__post ul, .p-archive__post ol {
margin-top: 16px;
margin-top: 1.6rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
line-height: 2;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-archive__post p, .p-archive__post ul, .p-archive__post ol {
margin-top: 2.4rem;
font-size: 1.6rem;
}
}
.p-archive__post ul li {
margin-left: 22px;
margin-left: 2.2rem;
list-style: disc;
}
.p-archive__post ol li {
margin-left: 22px;
margin-left: 2.2rem;
list-style: decimal;
}
.p-article__search {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-article__search {
margin-top: 4.8rem;
}
}
.p-archive__pagenavi {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-archive__pagenavi {
margin-top: 4.8rem;
}
}
.p-archive__pagenavi--bottom .wp-pagenavi {
padding-bottom: 0;
}
.p-blog__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-blog__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-blog__items {
margin-top: 24.5px;
margin-top: 2.45rem;
display: grid;
gap: 16px;
gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-blog__items {
margin-top: 4.75rem;
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
}
.p-blog__posts {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-blog__posts {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-blog__posts--taxonomy {
background-color: transparent;
}
.p-blog__container {
margin-top: 24px;
margin-top: 2.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-blog__container {
margin-top: 4.8rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
.p-blog__single .p-blog__container {
margin-top: 0;
}
.p-products__noResults {
font-size: 16px;
font-size: 1.6rem;
}
.p-blog__contents {
width: 100%;
}
@media screen and (min-width: 768px) {
.p-blog__sidebar {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 100%;
max-width: 36rem;
}
}
.p-blog__archivePosts {
display: grid;
gap: 24px;
gap: 2.4rem;
}
.p-blog__single {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-blog__single {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
@media screen and (min-width: 768px) {
.p-blog__postContents {
width: 100%;
max-width: 88rem;
}
}
.p-blog__postTitle {
margin-top: 6.5px;
margin-top: 0.65rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-blog__postTitle {
margin-top: 1.45rem;
font-size: 3.2rem;
}
}
.p-blog__tags {
margin-top: 4px;
margin-top: 0.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 8px;
gap: 0.8rem;
font-weight: 500;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-blog__tags {
margin-top: 0.8rem;
gap: 1.5rem;
font-size: 1.6rem;
}
}
.p-blog__thumbnail {
margin-top: 24.5px;
margin-top: 2.45rem;
}
@media screen and (min-width: 768px) {
.p-blog__thumbnail {
margin-top: 4.8rem;
}
}
.p-blog__thumbnail img {
border-radius: 1.6rem;
height: auto;
}
.p-blog__content {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-blog__content {
margin-top: 5.25rem;
}
}
.p-blog__content h2 {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
padding-left: 8px;
padding-left: 0.8rem;
padding-bottom: 4px;
padding-bottom: 0.4rem;
border-bottom: 2px solid #4880E0;
}
@media screen and (min-width: 768px) {
.p-blog__content h2 {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
min-width: 48rem;
margin-top: 4rem;
font-size: 2.4rem;
padding-left: 1.6rem;
padding-bottom: 0.85rem;
border-width: 4px;
}
}
.p-blog__content h3 {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
color: #4880E0;
}
@media screen and (min-width: 768px) {
.p-blog__content h3 {
margin-top: 4rem;
font-size: 2rem;
}
}
.p-blog__content h4 {
margin-top: 20px;
margin-top: 2rem;
font-weight: 500;
line-height: 1.25;
font-size: 15px;
font-size: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-blog__content h4 {
margin-top: 3.2rem;
font-size: 1.8rem;
}
}
.p-blog__content h5 {
margin-top: 20px;
margin-top: 2rem;
font-weight: 500;
line-height: 1.25;
font-size: 14px;
font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
.p-blog__content h5 {
margin-top: 3.2rem;
font-size: 1.6rem;
}
}
.p-blog__content p,
.p-blog__content ol,
.p-blog__content ul,
.p-blog__content table {
margin-top: 12px;
margin-top: 1.2rem;
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
line-height: 2;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-blog__content p,
.p-blog__content ol,
.p-blog__content ul,
.p-blog__content table {
margin-top: 2.4rem;
font-size: 1.6rem;
}
}
.p-blog__content a {
font-size: 14px;
font-size: 1.4rem;
line-height: 2;
letter-spacing: 0.1em;
color: #4880E0;
text-decoration: underline;
}
@media screen and (min-width: 768px) {
.p-blog__content a {
font-size: 1.6rem;
}
}
.p-blog__content ol {
list-style: decimal;
margin-left: 22px;
margin-left: 2.2rem;
}
@media screen and (min-width: 768px) {
.p-blog__content ol {
margin-left: 2.5rem;
}
}
.p-blog__content ul {
list-style: disc;
margin-left: 17px;
margin-left: 1.7rem;
}
@media screen and (min-width: 768px) {
.p-blog__content ul {
margin-left: 2rem;
}
}
.p-blog__content blockquote {
margin-top: 24px;
margin-top: 2.4rem;
border: 1px solid #AAAAAA;
border-radius: 0.3rem;
padding: 16px;
padding: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-blog__content blockquote {
padding: 2rem;
}
}
.p-blog__content blockquote p {
margin-top: 0;
}
@media screen and (min-width: 768px) {
.p-blog__content--jobs h2 {
min-width: none;
width: 100%;
}
}
.p-blog__content--jobs h3 {
color: #333;
}
.p-bottomCorporate {
margin-top: 80px;
margin-top: 8rem;
position: relative;
height: 240px;
height: 24rem;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (min-width: 768px) {
.p-bottomCorporate {
margin-top: 13rem;
display: block;
}
}
.p-bottomCorporate::after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, .4);
width: 100%;
height: 100%;
}
.p-bottomCorporate__container {
width: 100%;
padding-right: 16px;
padding-left: 16px;
margin-inline: auto;
max-width: 592px;
position: relative;
z-index: 1;
color: #FFF;
}
@media screen and (min-width: 768px) {
.p-bottomCorporate__container {
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: 0;
margin-inline-end: 0;
max-width: max(38.8888888889vw, 56rem);
height: 100%;
background-color: rgba(62, 64, 164, .8);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 4rem;
}
}
@media screen and (min-width: 768px) {
.p-bottomCorporate__wrap {
width: 100%;
max-width: 48rem;
}
}
.p-bottomCorporate__title {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-bottomCorporate__title {
font-size: 3.2rem;
}
}
.p-bottomCorporate__text {
font-size: 14px;
font-size: 1.4rem;
line-height: 2;
margin-top: 4px;
margin-top: 0.4rem;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-bottomCorporate__text {
margin-top: 0.8rem;
}
}
.p-bottomFv {
margin-top: 80px;
margin-top: 8rem;
position: relative;
height: 240px;
height: 24rem;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-bottomFv {
margin-top: 13rem;
}
}
.p-bottomFv::after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
background: rgba(0, 0, 0, .4);
width: 100%;
height: 100%;
}
.p-bottomFv__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 100%;
}
.p-bottomFv__container {
position: relative;
z-index: 1;
color: #FFF;
}
@media screen and (min-width: 768px) {
.p-bottomFv__container {
margin-top: 0.8rem;
}
}
.p-bottomFv__title {
font-weight: 600;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-bottomFv__title {
font-size: 3.2rem;
}
}
.p-bottomFv__text {
margin-top: 3px;
margin-top: 0.3rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-bottomFv__text {
margin-top: 0.8rem;
}
}
.p-business__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-business__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-business__arrow {
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 20px;
bottom: 2rem;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
width: 20px;
width: 2rem;
height: 20px;
height: 2rem;
}
@media screen and (min-width: 768px) {
.p-business__arrow {
bottom: 6.4rem;
}
}
@media screen and (min-width: 480px) and (max-width: 767px) {
.p-business__arrow {
bottom: 3rem;
}
}
.p-business__triangleCircle:hover .p-business__arrow {
-webkit-transform: translateX(calc(-50% + 0.3rem));
transform: translateX(calc(-50% + 0.3rem));
}
.p-business__arrow::before {
position: absolute;
content: "";
width: 20px;
width: 2rem;
height: 20px;
height: 2rem;
background: #3E40A4;
border-radius: 50%;
display: block;
top: 0;
left: 0;
content: "";
display: block;
}
.p-business__arrow::after {
position: absolute;
content: "";
width: 0;
height: 0;
border: solid 5px transparent;
border: solid 0.5rem transparent;
border-left: solid 7px #ffffff;
border-left: solid 0.7rem #ffffff;
display: block;
left: 7px;
left: 0.7rem;
top: 5px;
top: 0.5rem;
}
.p-business__triangle {
margin-top: 24px;
margin-top: 2.4rem;
margin-inline: auto;
position: relative;
width: 100%;
height: min(76vw, 465px);
height: min(76vw, 46.5rem);
}
@media screen and (min-width: 768px) {
.p-business__triangle {
margin-top: 4.8rem;
max-width: 80rem;
height: 66.4rem;
}
}
.p-business__triangle::before {
position: absolute;
top: 52.5%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
content: "";
display: block;
width: min(56vw, 353px);
width: min(56vw, 35.3rem);
height: min(40vw, 252px);
height: min(40vw, 25.2rem);
background-image: url(../images/corporate/triangle.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-business__triangle::before {
top: 53%;
width: 48.4rem;
height: 35.2rem;
}
}
.p-business__triangleCircle {
cursor: pointer;
position: absolute;
z-index: 1;
width: min(36.8vw, 220px);
width: min(36.8vw, 22rem);
height: min(36.8vw, 220px);
height: min(36.8vw, 22rem);
border: 1px solid #3E40A4;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #3E40A4;
background-color: #FFF;
border-radius: 50%;
-webkit-transition: background-color 0.3s ease-out, color 0.3s ease-out, border 0.3s ease-out;
transition: background-color 0.3s ease-out, color 0.3s ease-out, border 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-business__triangleCircle {
width: 32rem;
height: 32rem;
border-width: 2px;
}
}
.p-business__triangleItem:first-of-type .p-business__triangleCircle {
top: 0;
left: 0;
}
.p-business__triangleItem:nth-of-type(2) .p-business__triangleCircle {
top: 0;
right: 0;
}
.p-business__triangleItem:nth-of-type(3) .p-business__triangleCircle {
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.p-business__triangleTitle {
font-weight: 500;
font-size: min(4.2666666667vw, 26px);
font-size: min(4.2666666667vw, 2.6rem);
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-business__triangleTitle {
font-size: 3.2rem;
}
}
.p-business__triangleEntitle {
margin-top: 4px;
margin-top: 0.4rem;
font-weight: 500;
line-height: 1.25;
font-size: min(2.6666666667vw, 16px);
font-size: min(2.6666666667vw, 1.6rem);
letter-spacing: 0.1em;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-business__triangleEntitle {
font-size: 1.6rem;
}
}
.p-business__headingWrap {
margin-top: 24px;
margin-top: 2.4rem;
width: 100%;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-business__headingWrap {
margin-top: 4.8rem;
max-width: 144rem;
}
}
.p-business__headingInner {
width: 100%;
padding-right: 16px;
padding-left: 16px;
margin-right: auto;
margin-left: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.p-business__headingInner {
max-width: calc(136rem + 25px);
padding-right: 25px;
padding-left: 0;
margin-left: 0;
}
}
@media screen and (min-width: 768px) {
.p-business__headingWrap--strength .p-business__headingInner {
margin-left: auto;
margin-right: 0;
padding-right: 0;
padding-left: 25px;
}
}
.p-business__headingBlock {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-business__headingBlock {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-business__headingWrap--strength .p-business__headingBlock {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
}
@media screen and (min-width: 768px) {
.p-business__headingBlockImg {
max-width: 68rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-business__headingBlockImg::before {
padding-top: 74.9271137026%;
}
@media screen and (min-width: 768px) {
.p-business__headingBlockImg::before {
padding-top: 66.6176470588%;
}
}
.p-business__headingTheme {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-business__headingTheme {
font-size: 2.4rem;
}
}
.p-business__headingText {
margin-top: 8px;
margin-top: 0.8rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-business__headingText {
margin-top: 1.6rem;
}
}
.p-business__strength {
background-color: #EFEFEF;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-business__strength {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-business__local {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-business__local {
margin-top: 4.8rem;
width: 100%;
max-width: 103.2rem;
margin-inline: auto;
}
}
.p-business__localItems {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 16px;
gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-business__localItems {
gap: 2.4rem;
}
}
.p-business__localItem {
width: 100%;
max-width: calc(50% - 1.2rem);
position: relative;
background-color: #FFF;
border: 2px solid #3E40A4;
border-radius: 50%;
}
@media screen and (min-width: 768px) {
.p-business__localItem {
max-width: 24rem;
}
}
.p-business__localItem::before {
content: "";
display: block;
width: 100%;
padding-top: 100%;
}
.p-business__localItem p {
width: 100%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
text-align: center;
color: #3E40A4;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
font-size: 14px;
font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
.p-business__localItem p {
font-size: 2rem;
}
}
.p-business__localBottom {
margin-top: 24px;
margin-top: 2.4rem;
background-color: #3E40A4;
color: #FFF;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
padding: 14px 10px;
padding: 1.4rem 1rem;
font-size: 16px;
font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-business__localBottom {
padding: 2rem 1rem;
margin-top: 4.8rem;
font-size: 2.4rem;
}
}
.p-business__localBottom span {
display: block;
font-size: 32px;
font-size: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-business__localBottom span {
font-size: 4rem;
}
}
.p-business__results {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-business__results {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-business__resultsTheme {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-business__resultsTheme {
margin-top: 4.8rem;
font-size: 2.4rem;
}
}
.p-business__resultsItems {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-business__resultsItems {
margin-top: 4.8rem;
grid-template-columns: repeat(2, 1fr);
gap: 2.4rem 3.2rem;
}
}
.p-business__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-business__link {
margin-top: 4.8rem;
}
}
.p-business__link a {
margin-inline: auto;
}
.p-business__development {
background-color: #EFEFEF;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-business__development {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-business__developmentItems {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 8px;
row-gap: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-business__developmentItems {
margin-top: 4.8rem;
grid-template-columns: repeat(4, 1fr);
gap: 1.6rem;
}
}
.p-business__related {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-business__related {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-business__related--bg,
.p-business__related--other {
background-color: #EFEFEF;
}
.p-business__relatedItems {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-business__relatedItems {
margin-top: 4.8rem;
grid-template-columns: repeat(3, 1fr);
-webkit-column-gap: 4rem;
-moz-column-gap: 4rem;
column-gap: 4rem;
}
}
.p-career__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-career__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-career__headingBlock {
margin-top: 24.5px;
margin-top: 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-career__headingBlock {
margin-top: 4.75rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-career__headingImg {
max-width: 48rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-career__headingImg::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-career__headingImg::before {
padding-top: 66.6666666667%;
}
}
.p-career__headingImg img {
border-radius: 1.6rem;
}
.p-career__headingText {
white-space: pre-wrap;
}
.p-career__headingItems {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-career__headingItems {
margin-top: 4.8rem;
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
}
.p-career__headingItem {
border-radius: 1.6rem;
border: 2px solid #4880E0;
overflow: hidden;
}
.p-career__headingTitle {
min-height: 46px;
min-height: 4.6rem;
padding-bottom: 2px;
padding-bottom: 0.2rem;
background-color: #4880E0;
color: #FFF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
font-weight: 500;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-career__headingTitle {
font-size: 1.6rem;
}
}
.p-career__headingBody {
padding: 16px 14px 14px;
padding: 1.6rem 1.4rem 1.4rem;
}
@media screen and (min-width: 768px) {
.p-career__headingBody {
padding: 1.6rem 1.3rem 1.4rem;
}
}
.p-career__headingTheme {
text-align: center;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-career__headingTheme {
font-size: 2rem;
}
}
.p-career__headingItemText {
margin-top: 8px;
margin-top: 0.8rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-career__headingItemText {
margin-top: 1.6rem;
}
}
.p-career__training {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60.5px;
padding-bottom: 6.05rem;
}
@media screen and (min-width: 768px) {
.p-career__training {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-career__trainingContainer {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-career__trainingContainer {
margin-top: 4.75rem;
}
}
.p-career__trainingWrap {
overflow-x: scroll;
width: 100%;
padding-bottom: 12px;
padding-bottom: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-career__trainingWrap {
padding-bottom: 0;
overflow: visible;
}
}
.p-career__trainingImg {
width: 560px;
width: 56rem;
}
@media screen and (min-width: 768px) {
.p-career__trainingImg {
width: 100%;
}
}
.p-career__trainingImg img {
height: auto;
}
.p-career__trainingInfo {
margin-top: 26.5px;
margin-top: 2.65rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-career__trainingInfo {
margin-top: 4.8rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
width: 100%;
max-width: 124rem;
}
}
.p-career__trainingBlock {
width: 100%;
}
.p-career__trainingBlockHeading {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
}
.p-career__trainingTheme {
border-radius: 0.8rem;
background-color: #FFE94D;
width: 100%;
max-width: 122px;
max-width: 12.2rem;
-ms-flex-negative: 0;
flex-shrink: 0;
text-align: center;
padding: 8px 0;
padding: 0.8rem 0;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-career__trainingTheme {
max-width: 16rem;
font-size: 2rem;
padding: 1.5rem 0;
}
}
.p-career__trainingBlock:nth-of-type(2) .p-career__trainingTheme {
background-color: #4880E0;
color: #FFF;
}
.p-career__trainingTitle {
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-career__trainingTitle {
font-size: 2.4rem;
}
}
.p-career__trainingBottom {
margin-top: 12px;
margin-top: 1.2rem;
padding: 16px;
padding: 1.6rem;
border-radius: 0.8rem;
background-color: #FFF;
}
@media screen and (min-width: 768px) {
.p-career__trainingBottom {
margin-top: 2.4rem;
padding: 1.6rem 2.4rem;
}
}
.p-career__trainingBottom p {
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-career__trainingBottom p {
font-size: 2rem;
}
}
.p-career__trainingBottom p:nth-of-type(n+2) {
margin-top: 16px;
margin-top: 1.6rem;
}
.p-career__trainingBottom span {
display: block;
font-weight: 400;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
margin-top: 0.5px;
margin-top: 0.05rem;
}
@media screen and (min-width: 768px) {
.p-career__trainingBottom span {
font-size: 1.6rem;
margin-top: 0.4rem;
}
}
.p-career__system {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-career__system {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-career__systemContents {
margin-top: 24.5px;
margin-top: 2.45rem;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 15px;
gap: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-career__systemContents {
margin-top: 4.75rem;
grid-template-columns: repeat(4, 1fr);
gap: 1.6rem;
}
}
.p-career__systemItem {
width: min(50vw - 16px - 7.5px, 272.5px);
width: min(50vw - 1.6rem - 0.75rem, 27.25rem);
min-height: min(50vw - 16px - 7.5px, 272.5px);
min-height: min(50vw - 1.6rem - 0.75rem, 27.25rem);
padding: 10px;
padding: 1rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 1.6rem;
position: relative;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-career__systemItem {
width: auto;
min-height: auto;
height: 16rem;
padding: 0;
}
}
.p-career__systemItem::after {
content: "";
display: block;
width: 100%;
height: 100%;
border: 2px solid #4880E0;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border-radius: 1.6rem;
}
.p-career__systemItem:hover {
background-color: #4880E0;
}
.p-career__systemItemLocation {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
color: #4880E0;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-career__systemItemLocation {
font-size: 2rem;
}
}
.p-career__systemItemBlock {
color: #FFF;
opacity: 0;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-career__systemItemBlock {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: calc(100% - 2.6rem);
}
}
.p-career__systemItem:hover .p-career__systemItemBlock {
opacity: 1;
z-index: 1;
}
.p-career__systemItemTheme {
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
font-weight: 500;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-career__systemItemTheme {
font-size: 1.6rem;
}
}
.p-career__systemItemText {
margin-top: 8px;
margin-top: 0.8rem;
border-top: 2px solid #FFF;
padding-top: 8px;
padding-top: 0.8rem;
font-size: 13px;
font-size: 1.3rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-career__systemItemText {
font-size: 1.4rem;
}
}
@media screen and (min-width: 768px) {
.p-career__theme {
margin-top: 4.8rem;
}
}
.p-career__text {
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-career__text {
margin-top: 2.4rem;
}
}
.p-child__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-child__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-child__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__container {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-child__side {
width: 100%;
max-width: 36rem;
-ms-flex-negative: 0;
flex-shrink: 0;
position: sticky;
top: 16rem;
}
}
.p-child__sideItems {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 6px;
row-gap: 0.6rem;
}
@media screen and (min-width: 768px) {
.p-child__sideItems {
row-gap: 0.8rem;
}
}
.p-child__sideItem {
background-color: #EFEFEF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.6rem;
-moz-column-gap: 0.6rem;
column-gap: 0.6rem;
padding: 7.5px 16px;
padding: 0.75rem 1.6rem;
letter-spacing: 0.1em;
font-size: 16px;
font-size: 1.6rem;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-child__sideItem {
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-size: 2rem;
}
}
.p-child__sideItem:hover {
opacity: 0.8;
}
.p-child__sideItem::before {
content: "";
display: block;
width: 12px;
width: 1.2rem;
height: 16px;
height: 1.6rem;
margin: 5px 0 0 2px;
margin: 0.5rem 0 0 0.2rem;
background-image: url(../images/icon/achievement-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-child__sideItem::before {
width: 1.6rem;
height: 2.1rem;
}
}
.p-child__sideItem:hover::before {
-webkit-transform: translateX(0.3rem);
transform: translateX(0.3rem);
}
@media screen and (min-width: 768px) {
.p-child__contents {
width: 100%;
max-width: 88rem;
}
}
.p-child__profileContainer {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__profileContainer {
margin-top: 3.2rem;
}
}
.p-child__chart {
margin-top: 80px;
margin-top: 8rem;
}
@media screen and (min-width: 768px) {
.p-child__chart {
margin-top: 10.6rem;
}
}
.p-child__chartImg {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__chartImg {
margin-top: 4.8rem;
max-width: 62rem;
margin-inline: auto;
}
}
.p-child__chartImg img {
height: auto;
}
.p-child__history {
margin-top: 72px;
margin-top: 7.2rem;
}
@media screen and (min-width: 768px) {
.p-child__history {
margin-top: 12rem;
}
}
.p-child__historyContainer {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__historyContainer {
margin-top: 3.2rem;
}
}
.p-child__base {
margin-top: 80px;
margin-top: 8rem;
}
@media screen and (min-width: 768px) {
.p-child__base {
margin-top: 12rem;
}
}
.p-child__baseContainer {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__baseContainer {
margin-top: 4.8rem;
}
}
.p-child__baseCategories {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 16px;
gap: 1.6rem;
display: grid;
grid-template-columns: repeat(3, 1fr);
}
@media screen and (min-width: 768px) {
.p-child__baseCategories {
width: 100%;
max-width: 76.8rem;
margin-inline: auto;
gap: 1.8rem 2.4rem;
}
}
.p-child__baseCategory {
position: relative;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
border: 2px solid #3E40A4;
background-color: #3E40A4;
padding: 17.5px 0;
padding: 1.75rem 0;
text-align: center;
color: #FFF;
font-size: 18px;
font-size: 1.8rem;
line-height: 1.25;
font-weight: 500;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-child__baseCategory {
font-size: 2.4rem;
padding: 2.3rem 0;
}
}
.p-child__baseCategory:hover {
background-color: #222470;
}
.p-child__baseCategory::after {
content: "";
display: block;
position: absolute;
bottom: 0;
right: 0;
width: 12px;
width: 1.2rem;
height: 12px;
height: 1.2rem;
background-color: #FFF;
-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
@media screen and (min-width: 768px) {
.p-child__baseCategory::after {
width: 1.6rem;
height: 1.6rem;
}
}
.p-child__baseContents {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__baseContents {
margin-top: 5.4rem;
}
}
.p-child__baseBlock:nth-of-type(n+2) {
margin-top: 28px;
margin-top: 2.8rem;
}
@media screen and (min-width: 768px) {
.p-child__baseBlock:nth-of-type(n+2) {
margin-top: 4.6rem;
}
}
.p-child__address {
margin-top: 12px;
margin-top: 1.2rem;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__address {
margin-top: 2.4rem;
font-size: 2rem;
}
}
.p-child__address--second {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__address--second {
margin-top: 4.8rem;
}
}
.p-child__map {
display: block;
margin-top: 16px;
margin-top: 1.6rem;
position: relative;
width: 100%;
height: 300px;
height: 30rem;
}
@media screen and (min-width: 768px) {
.p-child__map {
margin-top: 2.4rem;
height: 49.5rem;
}
}
.p-child__baseList {
margin-top: 4px;
margin-top: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-child__baseList {
margin-top: 0.8rem;
}
}
.p-child__map iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.p-child__philosophyContainer {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__philosophyContainer {
margin-top: 4.8rem;
}
}
.p-child__philosophyBlocks {
display: grid;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__philosophyBlocks {
grid-template-columns: repeat(3, 1fr);
gap: 2rem;
}
}
.p-child__philosophyBlock {
border: 2px solid #3E40A4;
padding: 14px;
padding: 1.4rem;
}
@media screen and (min-width: 768px) {
.p-child__philosophyBlock {
min-height: 20rem;
}
}
.p-child__philosophyTheme {
color: #3E40A4;
font-weight: 500;
font-size: 18px;
font-size: 1.8rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__philosophyTheme {
font-size: 2rem;
}
}
.p-child__philosophyText {
margin-top: 8px;
margin-top: 0.8rem;
font-weight: 300;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__philosophyText {
font-size: 1.6rem;
}
}
.p-child__charter {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__charter {
margin-top: 4.8rem;
}
}
.p-child__charterText {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__charterText {
margin-top: 2.4rem;
}
}
.p-child__charterContents {
margin-top: 16px;
margin-top: 1.6rem;
border: 2px solid #3E40A4;
padding: 14px 13.5px;
padding: 1.4rem 1.35rem;
}
@media screen and (min-width: 768px) {
.p-child__charterContents {
margin-top: 2.4rem;
}
}
.p-child__charterItem:not(:first-of-type) {
padding-top: 16px;
padding-top: 1.6rem;
}
.p-child__charterItem:not(:last-of-type) {
padding-bottom: 16px;
padding-bottom: 1.6rem;
border-bottom: 2px solid #F2F2F2;
}
.p-child__greetings {
margin-top: 80px;
margin-top: 8rem;
}
@media screen and (min-width: 768px) {
.p-child__greetings {
margin-top: 12rem;
}
}
.p-child__greetingsContainer {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__greetingsContainer {
margin-top: 2.7rem;
}
}
.p-child__greetingsImg {
width: 100%;
max-width: 82%;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-child__greetingsImg {
max-width: 32rem;
}
}
.p-child__greetingsText {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__greetingsText {
margin-top: 2.2rem;
}
}
.p-child__greetingsBottom {
margin-top: 24px;
margin-top: 2.4rem;
text-align: right;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__greetingsBottom {
margin-top: 4rem;
font-size: 2rem;
}
}
.p-child__greetingsPresident {
text-align: right;
margin-top: 4px;
margin-top: 0.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__greetingsPresident {
-webkit-column-gap: 1.4rem;
-moz-column-gap: 1.4rem;
column-gap: 1.4rem;
font-size: 2rem;
}
}
.p-child__greetingsPresident span {
font-weight: 500;
font-size: 24px;
font-size: 2.4rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__greetingsPresident span {
font-size: 3.2rem;
}
}
.p-child__policyContainer {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__policyContainer {
margin-top: 4.8rem;
}
}
.p-child__policyContents {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__policyContents {
margin-top: 4.8rem;
}
}
.p-child__policyBlock:nth-of-type(n+2) {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-child__policyBlock:nth-of-type(n+2) {
margin-top: 4.8rem;
}
}
.p-child__policyContents .p-child__policyText,
.p-child__policyContentsWrap .p-child__policyText {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__policyContents .p-child__policyText,
.p-child__policyContentsWrap .p-child__policyText {
margin-top: 2.4rem;
}
}
.p-child__policyText--next {
margin-top: 20px;
margin-top: 2rem;
}
@media screen and (min-width: 768px) {
.p-child__policyText--next {
margin-top: 2.4rem;
}
}
.p-child__policyContents ul {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__policyContents ul {
margin-top: 2.4rem;
}
}
.p-child__policyContents li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.p-child__policyContents li::before {
content: "・";
-ms-flex-negative: 0;
flex-shrink: 0;
}
.p-child__policyBottom {
font-family: "Noto Sans JP", sans-serif;
font-weight: 300;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
margin-top: 16px;
margin-top: 1.6rem;
text-align: right;
}
@media screen and (min-width: 768px) {
.p-child__policyBottom {
margin-top: 2.4rem;
font-size: 1.6rem;
}
}
.p-child__use {
margin-top: 80px;
margin-top: 8rem;
}
@media screen and (min-width: 768px) {
.p-child__use {
margin-top: 12rem;
}
}
.p-child__policyDate {
text-align: right;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__policyDate {
font-size: 1.6rem;
}
}
.p-child__policyHeadingText {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__policyHeadingText {
margin-top: 2.4rem;
}
}
.p-child__pdf {
margin-top: 16px;
margin-top: 1.6rem;
display: block;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #3E40A4;
letter-spacing: 0.1em;
font-size: 14px;
font-size: 1.4rem;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
}
@media screen and (min-width: 768px) {
.p-child__pdf {
margin-top: 2.2rem;
font-size: 1.6rem;
}
}
.p-child__pdf:hover {
opacity: 0.7;
}
.p-child__pdf span {
position: relative;
}
.p-child__pdf span::after {
content: "";
display: block;
width: 14px;
width: 1.4rem;
height: 14px;
height: 1.4rem;
background-image: url(../images/icon/pdf.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: absolute;
bottom: 2.5px;
bottom: 0.25rem;
left: 3px;
left: 0.3rem;
}
@media screen and (min-width: 768px) {
.p-child__pdf span::after {
width: 1.6rem;
height: 1.6rem;
left: 0.7rem;
bottom: 0.3rem;
}
}
.p-child__downloadContents {
margin-top: 16px;
margin-top: 1.6rem;
display: grid;
row-gap: 30px;
row-gap: 3rem;
}
@media screen and (min-width: 768px) {
.p-child__downloadContents {
margin-top: 2.6rem;
grid-template-columns: repeat(3, 1fr);
-webkit-column-gap: 2rem;
-moz-column-gap: 2rem;
column-gap: 2rem;
}
}
.p-child__downloadBlock {
padding: 0 8px;
padding: 0 0.8rem;
}
.p-child__download {
margin-top: 8px;
margin-top: 0.8rem;
display: block;
width: 100%;
padding: 10px 5px;
padding: 1rem 0.5rem;
color: #FFF;
text-align: center;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
font-weight: 400;
background-color: #3E40A4;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-child__download {
font-size: 1.6rem;
padding: 1.2rem 0.5rem;
}
}
.p-child__download:hover {
background-color: #222470;
}
.p-child__downloadText {
margin-top: 16px;
margin-top: 1.6rem;
white-space: pre-wrap;
}
.p-child__documentTitle {
margin-top: 13px;
margin-top: 1.3rem;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
text-align: center;
letter-spacing: 0.1em;
}
.p-child__documentText {
margin-top: 8px;
margin-top: 0.8rem;
white-space: pre-wrap;
}
.p-child__downloadXls {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__downloadXls {
margin-top: 2.2rem;
}
}
.p-child__xls {
display: block;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #3E40A4;
letter-spacing: 0.1em;
font-size: 14px;
font-size: 1.4rem;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
}
@media screen and (min-width: 768px) {
.p-child__xls {
font-size: 1.6rem;
}
}
.p-child__xls:hover {
opacity: 0.7;
}
.p-child__xls span {
position: relative;
}
.p-child__xls span::after {
content: "";
display: block;
width: 14px;
width: 1.4rem;
height: 14px;
height: 1.4rem;
background-image: url(../images/icon/xls.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: absolute;
bottom: 2.5px;
bottom: 0.25rem;
left: 3px;
left: 0.3rem;
}
@media screen and (min-width: 768px) {
.p-child__xls span::after {
width: 1.6rem;
height: 1.6rem;
left: 0.7rem;
bottom: 0.3rem;
}
}
.p-child__xls:nth-of-type(n+2) {
margin-top: 12px;
margin-top: 1.2rem;
}
.p-child__list {
margin-top: 20px;
margin-top: 2rem;
}
@media screen and (min-width: 768px) {
.p-child__list {
margin-top: 4rem;
}
}
.p-child__accordion:first-of-type {
border-top: 1px solid #ccc;
}
.p-child__accordion {
border-bottom: 1px solid #ccc;
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
line-height: 2;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__accordion {
font-size: 1.6rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
}
.p-child__term {
padding: 12px;
padding: 1.2rem;
background-color: rgba(171, 225, 250, .25);
}
@media screen and (min-width: 768px) {
.p-child__term {
width: 26.4rem;
-ms-flex-negative: 0;
flex-shrink: 0;
padding: 2.4rem 1.5rem;
}
}
.p-child__description {
width: 100%;
white-space: pre-wrap;
padding: 12px;
padding: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-child__description {
padding: 2.4rem 1.5rem;
}
}
.p-child__bottom {
margin-top: 20px;
margin-top: 2rem;
font-family: "Noto Sans JP", sans-serif;
background-color: rgba(171, 225, 250, .4);
padding: 15px;
padding: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-child__bottom {
margin-top: 4rem;
padding: 2.4rem;
}
}
.p-child__bottomTitle {
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
}
@media screen and (min-width: 768px) {
.p-child__bottomTitle {
font-size: 1.8rem;
}
}
.p-child__bottomText, .p-child__bottomLastText {
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
line-height: 2;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__bottomText, .p-child__bottomLastText {
font-size: 1.6rem;
}
}
.p-child__bottomText {
margin-top: 12px;
margin-top: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-child__bottomText {
margin-top: 1.4rem;
}
}
.p-child__bottomText a {
color: #3E40A4;
}
.p-child__bottomLastText {
margin-top: 10px;
margin-top: 1rem;
}
.p-child__method {
display: none;
}
.p-child__methodLabel {
margin-top: 20px;
margin-top: 2rem;
padding: 10px;
padding: 1rem;
display: block;
color: #fff;
background-color: #3E40A4;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-child__methodLabel {
margin-top: 2.4rem;
font-size: 1.6rem;
}
}
.p-child__methodLabel--bottom {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-child__methodLabel--bottom {
margin-top: 4.8rem;
}
}
.p-child__methodLabel:hover {
background-color: #222470;
}
.p-child__methodLabel::before {
content: "";
width: 8px;
width: 0.8rem;
height: 8px;
height: 0.8rem;
border-top: 2px solid #FFF;
border-right: 2px solid #FFF;
-webkit-transform: rotate(45deg);
position: absolute;
top: calc(50% - 0.4rem);
right: 20px;
right: 2rem;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-child__methodLabel,
.p-child__methodContent {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.p-child__methodContent {
height: 0;
padding: 0 20px;
padding: 0 2rem;
overflow: hidden;
}
.p-child__method:checked + .p-child__methodLabel + .p-child__methodContent {
height: auto;
padding: 14px 14px 0;
padding: 1.4rem 1.4rem 0;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
@media screen and (min-width: 768px) {
.p-child__method:checked + .p-child__methodLabel + .p-child__methodContent {
padding: 2rem 2rem 0;
}
}
.p-child__method:checked + .p-child__methodLabel::before {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.p-child__methodBlock:nth-of-type(n+2) {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-child__methodBlock:nth-of-type(n+2) {
margin-top: 4rem;
}
}
.p-child__browser {
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 2;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-child__browser {
font-size: 1.8rem;
}
}
.p-child__methodWrap {
margin-top: 12px;
margin-top: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-child__methodWrap {
margin-top: 1.6rem;
}
}
.p-child__methodWrap:nth-of-type(n+2) {
margin-top: 20px;
margin-top: 2rem;
}
@media screen and (min-width: 768px) {
.p-child__methodWrap:nth-of-type(n+2) {
margin-top: 2.4rem;
}
}
.p-child__methodWrap p {
white-space: pre-wrap;
}
.p-child__methodImg {
margin-top: 14px;
margin-top: 1.4rem;
max-width: 450px;
max-width: 45rem;
}
@media screen and (min-width: 768px) {
.p-child__methodImg {
margin-top: 1.6rem;
}
}
.p-company__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-company__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-company__headingBlocks {
display: grid;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-company__headingBlocks {
grid-template-columns: repeat(2, 1fr);
gap: 2.4rem 3.2rem;
}
}
.p-company__youtube {
margin-top: 40px;
margin-top: 4rem;
display: grid;
row-gap: 19px;
row-gap: 1.9rem;
}
@media screen and (min-width: 768px) {
.p-company__youtube {
margin-top: 8rem;
grid-template-columns: repeat(3, 1fr);
-webkit-column-gap: 4rem;
-moz-column-gap: 4rem;
column-gap: 4rem;
}
}
.p-company__youtubeScene iframe {
width: 100%;
aspect-ratio: 16/9;
height: auto;
}
.p-company__headingBlock {
padding: 16px;
padding: 1.6rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 16px;
row-gap: 1.6rem;
border: 2px solid #3E40A4;
}
@media screen and (min-width: 768px) {
.p-company__headingBlock {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0 4rem;
min-height: 20rem;
padding: 2.4rem 4rem;
}
}
.p-company__headingBlockImg {
width: 100px;
width: 10rem;
height: 100px;
height: 10rem;
margin-inline: auto;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.p-company__headingBlockImg img {
height: 100%;
}
@media screen and (min-width: 768px) {
.p-company__headingBlockWrap {
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.p-company__headingBlockTitle {
color: #3E40A4;
line-height: 1.25;
font-size: 24px;
font-size: 2.4rem;
font-weight: 500;
}
.p-company__headingBlockText {
margin-top: 8px;
margin-top: 0.8rem;
white-space: pre-wrap;
}
.p-company__headingBlockLink {
display: block;
background-color: #3E40A4;
color: #FFF;
margin-top: 8px;
margin-top: 0.8rem;
width: 160px;
width: 16rem;
padding: 4.5px;
padding: 0.45rem;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
text-align: center;
margin-left: auto;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-company__headingBlockLink {
margin-top: auto;
}
}
.p-company__headingBlockLink:hover {
background-color: #222470;
}
.p-company__information {
position: relative;
background-image: url(../images/corporate/bg-information.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-company__information {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-company__information::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
background: rgba(255, 255, 255, .9);
width: 100%;
height: 100%;
}
.p-company__informationWrap {
position: relative;
z-index: 1;
}
.p-company__contents {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 19px;
row-gap: 1.9rem;
}
@media screen and (min-width: 768px) {
.p-company__contents {
margin-top: 4.8rem;
grid-template-columns: repeat(3, 1fr);
-webkit-column-gap: 4rem;
-moz-column-gap: 4rem;
column-gap: 4rem;
}
}
.p-company__blockImg {
overflow: hidden;
}
.p-company__blockImg::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-company__blockImg::before {
padding-top: 66.75%;
}
}
.p-company__blockImg img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-company__block:hover .p-company__blockImg img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-company__blockTitle {
margin-top: 8px;
margin-top: 0.8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-weight: 500;
line-height: 1.25;
font-size: 24px;
font-size: 2.4rem;
letter-spacing: 0.1em;
}
.p-company__blockTitle::before {
content: "";
display: block;
width: 6px;
width: 0.6rem;
background-color: #3E40A4;
-ms-flex-negative: 0;
flex-shrink: 0;
}
@media screen and (min-width: 768px) {
.p-company__blockTitle::before {
width: 0.8rem;
}
}
.p-company__blockText {
margin-top: 12px;
margin-top: 1.2rem;
white-space: pre-wrap;
}
.p-company__items {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-company__items {
margin-top: 3.2rem;
}
}
.p-construction {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-construction {
margin-top: 6.4rem;
}
}
.p-construction__section {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-construction__section {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-construction__section--bg {
background-color: #EFEFEF;
}
.p-construction__wrap {
width: 100%;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-construction__wrap {
max-width: 144rem;
}
}
.p-construction__headingInner {
width: 100%;
padding-right: 16px;
padding-left: 16px;
margin-right: auto;
margin-left: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.p-construction__headingInner {
max-width: calc(136rem + 25px);
padding-right: 25px;
padding-left: 0;
margin-left: 0;
}
}
@media screen and (min-width: 768px) {
.p-construction__headingInner--reverse {
margin-left: auto;
margin-right: 0;
padding-right: 0;
padding-left: 25px;
}
}
.p-construction__headingBlock {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-construction__headingBlock {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-construction__headingInner--reverse .p-construction__headingBlock {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
}
@media screen and (min-width: 768px) {
.p-construction__headingBlockImg {
max-width: 68rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-construction__headingBlockImg::before {
padding-top: 74.9271137026%;
}
@media screen and (min-width: 768px) {
.p-construction__headingBlockImg::before {
padding-top: 75%;
}
}
.p-construction__headingTheme {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-construction__headingTheme {
margin-top: 4.8rem;
font-size: 2.4rem;
}
}
.p-construction__headingText {
margin-top: 8px;
margin-top: 0.8rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-construction__headingText {
margin-top: 1.6rem;
}
}
.p-construction__headingText--youtube {
margin-top: 18px;
margin-top: 1.8rem;
}
@media screen and (min-width: 768px) {
.p-construction__headingText--youtube {
margin-top: 3.2rem;
}
}
.p-construction__link {
margin-top: 23.5px;
margin-top: 2.35rem;
}
@media screen and (min-width: 768px) {
.p-construction__link {
margin-top: 4.75rem;
}
}
.p-construction__bottom {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-construction__bottom {
margin-top: 4.8rem;
}
}
.p-construction__bottomBlock:nth-of-type(n+2) {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-construction__bottomBlock:nth-of-type(n+2) {
margin-top: 4rem;
}
}
.p-construction__categories {
margin-top: 16px;
margin-top: 1.6rem;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px 23px;
gap: 2rem 2.3rem;
}
@media screen and (min-width: 768px) {
.p-construction__categories {
margin-top: 2.4rem;
grid-template-columns: repeat(5, 1fr);
gap: 1.6rem 2rem;
}
}
.p-construction__category {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 5px;
padding: 0.5rem;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
text-align: center;
line-height: 1.25;
letter-spacing: 0.1em;
background-color: #EFEFEF;
border: 2px solid #3E40A4;
color: #3E40A4;
min-height: 48px;
min-height: 4.8rem;
-webkit-transition: color 0.3s ease-out, background-color 0.3s ease-out;
transition: color 0.3s ease-out, background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-construction__category {
font-size: 2rem;
min-height: 7.2rem;
}
}
.p-construction__section--bg .p-construction__category {
background-color: #FFF;
}
.p-construction__categories .p-construction__category:hover {
background-color: #3E40A4;
color: #FFF;
}
.p-contact__heading {
padding-top: 25px;
padding-top: 2.5rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-contact__heading {
padding-top: 6.6rem;
padding-bottom: 12rem;
}
}
.p-contact__thanks {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-contact__thanks {
padding-top: 8.6rem;
padding-bottom: 12rem;
}
}
.p-contact__words {
text-align: center;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-contact__words {
font-size: 2.4rem;
}
}
.p-contact__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-contact__link {
margin-top: 4.8rem;
}
}
.p-contact__link a {
margin-inline: auto;
}
.p-curriculum__list {
display: grid;
row-gap: 5px;
row-gap: 0.5rem;
}
@media screen and (min-width: 768px) {
.p-curriculum__list {
grid-template-columns: 16rem 24rem 84.8rem;
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
}
}
.p-curriculum__list:nth-of-type(n+2) {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-curriculum__list:nth-of-type(n+2) {
margin-top: 0.8rem;
}
}
.p-curriculum__list p {
border-radius: 0.8rem;
border: 2px solid #4880E0;
background-color: #FFF;
padding: 6px 14px;
padding: 0.6rem 1.4rem;
font-weight: 500;
}
@media screen and (min-width: 768px) {
.p-curriculum__list p {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 1rem 1.4rem;
min-height: 6.4rem;
}
}
.p-curriculum__list--holiday p {
background-color: #D9D9D9;
text-align: center;
}
@media screen and (max-width: 767px) {
.p-curriculum__list--heading {
display: none;
}
}
.p-curriculum__list--heading p {
background-color: #4880E0;
color: #FFF;
}
@media screen and (min-width: 768px) {
.p-curriculum__list--heading p {
font-size: 2rem;
padding: 0.95rem;
min-height: auto;
}
}
.p-curriculum__date {
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-curriculum__date {
font-size: 2rem;
}
}
.p-curriculum__time {
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-curriculum__time {
font-size: 1.6rem;
}
}
p.p-curriculum__content {
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
p.p-curriculum__content {
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
font-size: 1.6rem;
}
}
.p-develop {
position: relative;
height: 120px;
height: 12rem;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
border: 2px solid #3E40A4;
background-color: #FFF;
}
@media screen and (min-width: 768px) {
.p-develop {
height: 16rem;
}
}
.p-develop:hover {
background-color: #3E40A4;
}
.p-develop__title {
text-align: center;
color: #3E40A4;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
font-size: 20px;
font-size: 2rem;
font-weight: 500;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-develop__title {
font-size: 2.4rem;
}
}
.p-develop__title span {
display: block;
margin-bottom: 8px;
margin-bottom: 0.8rem;
font-size: 32px;
font-size: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-develop__title span {
font-size: 4rem;
margin-bottom: 1.2rem;
}
}
.p-develop__hover {
width: calc(100% - 3.2rem);
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
color: #FFF;
opacity: 0;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.p-develop:hover .p-develop__hover {
opacity: 1;
z-index: 1;
}
.p-develop__hoverTitle {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-develop__hoverTitle {
font-size: 2rem;
}
}
.p-develop__hoverTitle br {
display: none;
}
.p-develop__hoverText {
margin-top: 4px;
margin-top: 0.4rem;
font-weight: 300;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-develop__hoverText {
margin-top: 0.8rem;
font-size: 1.6rem;
}
}
.p-faq__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-faq__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-faq__links {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-faq__links {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 0 4rem;
}
}
.p-faq__entitle {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-faq__entitle {
margin-top: 4.8rem;
}
}
.p-faq__contents {
margin-top: 24.5px;
margin-top: 2.45rem;
}
@media screen and (min-width: 768px) {
.p-faq__contents {
margin-top: 4.7rem;
}
}
.p-faq__bottom {
margin-top: 40px;
margin-top: 4rem;
border-radius: 1.6rem;
border: 2px solid #4880E0;
overflow: hidden;
width: 100%;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-faq__bottom {
margin-top: 6rem;
max-width: 85rem;
}
}
.p-faq__bottomTitle {
min-height: 46px;
min-height: 4.6rem;
padding-bottom: 2px;
padding-bottom: 0.2rem;
background-color: #4880E0;
color: #FFF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-faq__bottomTitle {
font-size: 2rem;
}
}
.p-faq__bottomText {
padding: 16px 14px 14px;
padding: 1.6rem 1.4rem 1.4rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-faq__bottomText {
padding: 1.6rem 4rem 1.4rem;
}
}
.p-faq__bottomText a {
color: #4880E0;
text-decoration: underline;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.p-faq__bottomText a:hover {
opacity: 0.8;
}
@media screen and (max-width: 767px) {
.p-footer__inner.l-inner {
padding-left: 1.2rem;
padding-right: 1.2rem;
}
}
@media screen and (min-width: 768px) {
.p-footer__entries {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-footer__entry {
height: 80px;
height: 8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
color: #FFF;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
background-color: #4880E0;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-footer__entry {
width: 50%;
height: 12rem;
font-size: 3.2rem;
}
}
.p-footer__entry--career {
background-color: #3149A1;
}
.p-footer__entry:hover {
background-color: #4572C0;
}
.p-footer__entry--career:hover {
background-color: #273770;
}
.p-footer__container {
background-color: #333;
color: #FFF;
padding-top: 40px;
padding-top: 4rem;
padding-bottom: 37.5px;
padding-bottom: 3.75rem;
}
@media screen and (min-width: 768px) {
.p-footer__container {
padding-top: 8rem;
padding-bottom: 7.85rem;
}
}
.p-footer--corporate .p-footer__container {
background-color: #F5F5F5;
color: #333;
}
.p-footer__contents {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 20.5px;
row-gap: 2.05rem;
}
@media screen and (min-width: 768px) {
.p-footer__contents {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
.p-footer__logo {
width: 100%;
max-width: 320px;
max-width: 32rem;
display: block;
margin-inline: auto;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
}
@media screen and (min-width: 768px) {
.p-footer__logo {
max-width: 48rem;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: 0;
margin-inline-end: 0;
}
}
.p-footer__address {
margin-top: 16.5px;
margin-top: 1.65rem;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
margin-inline: auto;
font-size: 12px;
font-size: 1.2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-footer__address {
margin-top: 2.45rem;
width: auto;
font-size: 1.4rem;
}
}
.p-footer__contact {
margin-top: 6.5px;
margin-top: 0.65rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 1.55rem;
-moz-column-gap: 1.55rem;
column-gap: 1.55rem;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-footer__contact {
font-size: 1.4rem;
-webkit-column-gap: 2.3rem;
-moz-column-gap: 2.3rem;
column-gap: 2.3rem;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
}
.p-footer__contact a {
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.p-footer__contact a:hover {
opacity: 0.6;
}
.p-footer__linksWrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 12px;
row-gap: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-footer__linksWrap {
margin: -0.15rem 0 0 auto;
width: 100%;
max-width: 60.3rem;
-ms-flex-negative: 0;
flex-shrink: 0;
row-gap: 0.4rem;
}
}
.p-footer__links {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 12px 15.5px;
gap: 1.2rem 1.55rem;
padding: 0 20px;
padding: 0 2rem;
}
@media screen and (min-width: 768px) {
.p-footer__links {
width: 100%;
display: grid;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
grid-template-columns: 12.3rem 16.9rem 15.4rem;
-webkit-column-gap: 7.9rem;
-moz-column-gap: 7.9rem;
column-gap: 7.9rem;
padding: 0;
}
}
@media screen and (max-width: 767px) {
.p-footer--corporate .p-footer__links {
padding: 0 1.5rem;
}
}
@media screen and (min-width: 768px) {
.p-footer--corporate .p-footer__links {
max-width: 58.7rem;
grid-template-columns: 9.3rem 9.3rem 24.7rem;
-webkit-column-gap: 7.8rem;
-moz-column-gap: 7.8rem;
column-gap: 7.8rem;
}
}
@media screen and (min-width: 768px) {
.p-footer--employment .p-footer__links {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
margin-left: auto;
}
}
.p-footer__linksBlock {
display: contents;
}
@media screen and (min-width: 768px) {
.p-footer__linksBlock {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 0.4rem;
}
}
.p-footer__link {
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
border-bottom: 1px solid transparent;
-webkit-transition: border 0.3s ease-out;
transition: border 0.3s ease-out;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
}
@media screen and (max-width: 767px) {
.p-footer__link--association {
margin-inline: auto;
}
}
.p-footer__link:hover {
border-color: #FFF;
}
.p-footer--corporate .p-footer__link:hover {
border-color: #3E40A4;
}
.p-footer__copyright {
padding: 11px 15px 75px;
padding: 1.1rem 1.5rem 7.5rem;
}
@media screen and (min-width: 768px) {
.p-footer__copyright {
padding: 2.2rem 2rem;
}
}
.p-footer--corporate .p-footer__copyright {
background-color: #333;
color: #FFF;
}
.p-footer__copyright small {
display: block;
font-family: "Noto Sans JP", sans-serif;
font-weight: 300;
font-size: 12px;
font-size: 1.2rem;
text-align: center;
line-height: 1.45;
}
@media screen and (min-width: 768px) {
.p-footer__copyright small {
font-size: 1.4rem;
letter-spacing: 0.017em;
}
}
.p-form__block {
width: 100%;
}
@media screen and (min-width: 768px) {
.p-form__block {
margin-inline: auto;
}
}
.p-form__wrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
margin-inline: auto;
row-gap: 8px;
row-gap: 0.8rem;
padding: 7px 0;
padding: 0.7rem 0;
}
@media screen and (min-width: 768px) {
.p-form__wrap {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 2rem 0;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--radio {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
.p-form--confirm .p-form__wrap {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.p-form--confirm .p-form__wrap:nth-child(n+2) {
margin-top: 58px;
margin-top: 5.8rem;
}
@media screen and (min-width: 768px) {
.p-form--confirm .p-form__wrap:nth-child(n+2) {
margin-top: 1.5rem;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap.p-form__wrap--textarea {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
row-gap: 2rem;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap.p-form__wrap--details {
row-gap: 0.7rem;
}
}
.p-form__wrap label {
max-width: 326px;
max-width: 32.6rem;
width: 100%;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
font-weight: 500;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-form__wrap label {
margin-top: -0.5rem;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--textarea label {
margin-top: 0.7rem;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--radio label {
margin-top: -0.2rem;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--category label {
margin: 0;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--capabilities label {
margin: 0;
}
}
.p-form--confirm .p-form__wrap label {
margin-top: 0;
}
.p-form__label {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.p-form__label .required {
color: #FFF;
background-color: #F91700;
width: 64px;
width: 6.4rem;
height: 24px;
height: 2.4rem;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 5px;
margin-top: 0.5rem;
}
.p-form__label span {
font-size: 15px;
font-size: 1.5rem;
margin-left: 4px;
margin-left: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-form__label span {
margin-left: 0.6rem;
font-size: 1.8rem;
display: block;
}
}
.p-form__selectwrap,
.p-form__text,
.p-form__textarea {
width: 100%;
padding: 11.5px;
padding: 1.15rem;
background-color: #EFEFEF;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-form__selectwrap,
.p-form__text,
.p-form__textarea {
max-width: 71.4rem;
}
}
/* セレクトボックス ここから */
.p-form__selectwrap {
position: relative;
}
.p-form__selectwrap:after {
content: "";
position: absolute;
right: 29px;
top: 18px;
width: 9px;
height: 9px;
border-top: 2px solid #C9C9C9;
border-left: 2px solid #C9C9C9;
-webkit-transform: translateY(-50%) rotate(-135deg);
transform: translateY(-50%) rotate(-135deg);
font-size: 20px;
pointer-events: none;
}
.p-form__select {
width: 100%;
}
.p-form__select:invalid {
color: #C9C9C9;
}
.p-form__select option {
color: #333;
}
.p-form__select option:first-child {
color: #C9C9C9;
}
/* セレクトボックス ここまで */
.p-form__text::-webkit-input-placeholder,
.p-form__textarea::-webkit-input-placeholder {
color: #AAAAAA;
}
.p-form__text::-moz-placeholder,
.p-form__textarea::-moz-placeholder {
color: #AAAAAA;
}
.p-form__text::-ms-input-placeholder,
.p-form__textarea::-ms-input-placeholder {
color: #AAAAAA;
}
.p-form__text::placeholder,
.p-form__textarea::placeholder {
color: #AAAAAA;
}
.p-form__textarea {
height: 240px;
height: 24rem;
}
/* ラジオボタン ここから */
.p-form__radiobutton {
width: 100%;
margin-top: -2px;
margin-top: -0.2rem;
}
@media screen and (min-width: 768px) {
.p-form__radiobutton {
margin: 0;
}
}
.p-form__wrap .p-form__radio span {
width: auto;
}
.p-form__radio label {
-webkit-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
padding: 5px 12px 5px 16px;
padding: 0.5rem 1.2rem 0.5rem 1.6rem;
}
@media screen and (min-width: 768px) {
.p-form__radio label {
line-height: 1.4;
padding: 0.1rem 1.2rem 0.1rem 2.1rem;
}
}
.p-form__radio input {
display: inline-block;
position: relative;
}
.p-form__radio input:before {
content: "";
background: #FFF;
border: 1px solid #505050;
border-radius: 50%;
display: block;
position: absolute;
top: -17px;
top: -1.7rem;
left: -21px;
left: -2.1rem;
width: 20px;
width: 2rem;
height: 20px;
height: 2rem;
}
@media screen and (min-width: 768px) {
.p-form__radio input:before {
width: 2.3rem;
height: 2.3rem;
top: -1.9rem;
left: -2.4rem;
}
}
.ios .p-form__radio input:before {
top: 5px;
top: 0.5rem;
left: 0px;
left: 0rem;
}
.p-form__radio input:after {
content: "";
background: #505050;
border-radius: 50%;
display: block;
opacity: 0;
position: absolute;
top: -7px;
top: -0.7rem;
left: -18px;
left: -1.8rem;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 14px;
width: 1.4rem;
height: 14px;
height: 1.4rem;
-webkit-transition: 0.3s ease;
transition: 0.3s ease;
}
@media screen and (min-width: 768px) {
.p-form__radio input:after {
width: 1.7rem;
height: 1.7rem;
top: -0.75rem;
left: -2.1rem;
}
}
.ios .p-form__radio input:after {
top: 13px;
top: 1.3rem;
left: 4px;
left: 0.4rem;
}
input[type=radio]:checked::after {
opacity: 1;
}
/* ラジオボタン ここまで */
.p-form__box {
padding: 24px 18px;
padding: 2.4rem 1.8rem;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-form__box {
margin-top: 1.8rem;
}
}
.p-form__box p {
font-size: 14px;
font-size: 1.4rem;
line-height: 2.5714285714;
}
@media screen and (min-width: 768px) {
.p-form__box p {
font-size: 1.6rem;
line-height: 2.25;
margin-right: -0.1rem;
}
}
.p-form__box p:nth-of-type(n+2) {
margin-top: 9px;
margin-top: 0.9rem;
}
@media screen and (min-width: 768px) {
.p-form__box p:nth-of-type(n+2) {
margin-top: 1.6rem;
}
}
.p-form__box a {
text-decoration: underline;
color: #AAAAAA;
}
/* チェックボックス ここから */
.p-form__check {
width: 100%;
}
@media screen and (min-width: 768px) {
.p-form__check {
max-width: 71.4rem;
margin-left: auto;
}
}
.p-form__check--list {
margin: 2px 0 0;
margin: 0.2rem 0 0;
padding-bottom: 7px;
padding-bottom: 0.7rem;
width: 100%;
}
@media screen and (min-width: 768px) {
.p-form__check--list {
margin: 0 0 0 auto;
max-width: 64rem;
}
}
.p-form__checkbox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.p-form__submit {
position: relative;
margin-top: 14px;
margin-top: 1.4rem;
margin-inline: auto;
width: 100%;
max-width: 160px;
max-width: 16rem;
}
@media screen and (min-width: 768px) {
.p-form__submit {
margin-top: 2.4rem;
max-width: 24rem;
}
}
.p-form__submit--back::after {
content: none;
}
.p-form__submit--return::after {
-webkit-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
right: auto;
left: 70px;
left: 7rem;
}
.p-form__submit:hover::after {
-webkit-transform: translate(0.5rem, -50%);
transform: translate(0.5rem, -50%);
}
.p-form__submit--return:hover::after {
-webkit-transform: translateX(-0.3rem) translateY(-50%) rotate(180deg);
transform: translateX(-0.3rem) translateY(-50%) rotate(180deg);
}
.p-form__button {
width: 100%;
background-color: #3E40A4;
min-height: 32px;
min-height: 3.2rem;
color: #FFF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-form__button {
font-size: 1.6rem;
min-height: 4.8rem;
}
}
.p-form__submit--back .p-form__button {
background-color: #333;
}
.p-form__submit:hover .p-form__button {
background-color: #222470;
}
.p-form__secure {
width: 160px;
width: 16rem;
height: 81px;
height: 8.1rem;
-o-object-fit: cover;
object-fit: cover;
margin: 40px auto 0;
margin: 4rem auto 0;
}
@media screen and (min-width: 768px) {
.p-form__secure {
margin-top: 2.4rem;
}
}
@media screen and (min-width: 768px) {
.p-form__answerWrap {
margin-top: -0.4rem;
}
}
.p-form__answer {
font-size: 17px;
font-size: 1.7rem;
line-height: 1.7647058824;
}
@media screen and (min-width: 768px) {
.p-form__answer {
margin-left: 2rem;
font-size: 2rem;
line-height: 1.75;
}
}
.p-form__buttonWrap {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-top: 24px;
margin-top: 2.4rem;
row-gap: 22px;
row-gap: 2.2rem;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (min-width: 768px) {
.p-form__buttonWrap {
margin-top: 4.7rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-column-gap: 8rem;
-moz-column-gap: 8rem;
column-gap: 8rem;
}
}
.p-form__buttonWrap .p-form__submit {
margin-inline: auto;
margin-top: 0;
}
@media screen and (min-width: 768px) {
.p-form__buttonWrap .p-form__submit {
margin: 0;
}
}
.p-form__banner {
margin-top: 40px;
margin-top: 4rem;
width: 170px;
width: 17rem;
height: 66px;
height: 6.6rem;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-form__banner {
margin-top: 2.4rem;
}
}
.p-form__birth {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
font-size: 17px;
font-size: 1.7rem;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 1rem;
-moz-column-gap: 1rem;
column-gap: 1rem;
}
@media screen and (min-width: 768px) {
.p-form__birth {
font-size: 2rem;
margin-left: 2rem;
}
}
.p-form__birth .p-form__text {
max-width: 55px;
max-width: 5.5rem;
}
@media screen and (min-width: 768px) {
.p-form__birth .p-form__text {
max-width: 11rem;
}
}
@media screen and (max-width: 767px) {
.p-form__birth .p-form__text--year {
max-width: 9rem;
}
}
.p-form__wrap--address {
row-gap: 20px;
row-gap: 2rem;
}
@media screen and (min-width: 768px) {
.p-form__wrap--address {
-webkit-column-gap: 4rem;
-moz-column-gap: 4rem;
column-gap: 4rem;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--several {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
.p-form__addressWrap {
width: 100%;
}
.p-form__addressDetail {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 8px;
row-gap: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-form__addressDetail {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
}
.p-form__addressDetail:nth-of-type(n+2) {
margin-top: 18px;
margin-top: 1.8rem;
}
@media screen and (min-width: 768px) {
.p-form__addressDetail:nth-of-type(n+2) {
margin-top: 3rem;
}
}
@media screen and (min-width: 768px) {
.p-form__wrap--address label {
max-width: 19.5rem;
}
}
.p-form__address {
font-size: 17px;
font-size: 1.7rem;
}
@media screen and (min-width: 768px) {
.p-form__address {
margin-top: 1.3rem;
font-size: 2rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
@media screen and (min-width: 768px) {
.p-form__block--confirm .p-form__address {
margin: 0;
}
}
.p-form__block--confirm .p-form__wrap {
border: none;
}
.p-fv {
margin-top: 80px;
margin-top: 8rem;
position: relative;
height: calc(100vh - 8rem);
}
@media screen and (min-width: 768px) {
.p-fv {
margin-top: 13rem;
height: auto;
}
}
@media screen and (min-width: 768px) {
.corporate .p-fv {
height: calc(100vh - 13rem);
}
}
.p-fv__mainSwiper {
position: relative;
}
.p-fv__main::before {
padding-top: calc(62.5vh - 5rem);
}
@media screen and (min-width: 768px) {
.p-fv__main::before {
padding-top: calc(66.66667vh - 8.66667rem);
}
}
.p-fv__main img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: scale 8s 0.5s ease-out;
transition: scale 8s 0.5s ease-out;
}
@-webkit-keyframes zoomUp {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.15);
transform: scale(1.15);
}
}
@keyframes zoomUp {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
100% {
-webkit-transform: scale(1.15);
transform: scale(1.15);
}
}
.p-fv__mainSwiper .swiper-slide-active .p-fv__main,
.p-fv__mainSwiper .swiper-slide-duplicate-active .p-fv__main,
.p-fv__mainSwiper .swiper-slide-prev .p-fv__main {
-webkit-animation: zoomUp 7s linear 1s normal both;
animation: zoomUp 7s linear 1s normal both;
}
@media screen and (min-width: 768px) {
.p-fv__imgs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-fv__sub {
position: relative;
}
.p-fv__sub::before {
padding-top: calc(12.5vh - 1rem);
}
@media screen and (min-width: 768px) {
.p-fv__sub::before {
padding-top: calc(33.33333vh - 4.33333rem);
}
}
.swiper.p-fv__swiper {
padding-bottom: 20px;
padding-bottom: 2rem;
}
@media screen and (min-width: 768px) {
.swiper.p-fv__swiper {
padding-bottom: 3.1rem;
}
}
.p-fv__title {
position: absolute;
top: 48.5%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 100%;
background-color: rgba(62, 64, 164, .8);
color: #FFF;
font-weight: 500;
font-size: min(5.3333333333vw, 30px);
font-size: min(5.3333333333vw, 3rem);
z-index: 2;
text-align: center;
letter-spacing: 0.1em;
padding: 5px 0;
padding: 0.5rem 0;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-fv__title {
top: 48%;
font-size: 4.8rem;
padding: 0.4rem 0;
}
}
.p-fv__mainTitle {
padding: 0 16px;
padding: 0 1.6rem;
color: #FFF;
font-size: min(8.5333333333vw, 42px);
font-size: min(8.5333333333vw, 4.2rem);
font-weight: 400;
letter-spacing: 0.1em;
z-index: 10;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background-color: rgba(62, 64, 164, .8);
}
@media screen and (min-width: 768px) {
.p-fv__mainTitle {
padding: 0.4rem 5.5555555556vw;
font-size: 4.8rem;
}
}
.p-fv__subtitle {
width: 200px;
width: 20rem;
position: absolute;
bottom: 8px;
bottom: 0.8rem;
left: 16px;
left: 1.6rem;
color: #FFF;
font-size: 16px;
font-size: 1.6rem;
border-bottom: 1px solid #FFF;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-fv__subtitle {
bottom: 1.7rem;
font-size: 2.4rem;
}
}
.p-fv__img::before {
padding-top: calc(100vh - 8rem);
}
@media screen and (min-width: 768px) {
.p-fv__img::before {
padding-top: 50.5555555556%;
}
}
.p-graduate__heading {
padding-top: 48px;
padding-top: 4.8rem;
padding-bottom: 76px;
padding-bottom: 7.6rem;
}
@media screen and (min-width: 768px) {
.p-graduate__heading {
padding-top: 11.6rem;
padding-bottom: 15.2rem;
}
}
.p-graduate__entries {
display: grid;
row-gap: 30px;
row-gap: 3rem;
}
@media screen and (min-width: 768px) {
.p-graduate__entries {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-column-gap: 2rem;
-moz-column-gap: 2rem;
column-gap: 2rem;
}
}
.p-graduate__entry {
height: 48px;
height: 4.8rem;
border-radius: 99.9rem;
width: 100%;
max-width: 240px;
max-width: 24rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
text-align: center;
background-color: #4880E0;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-graduate__entry {
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: 0;
margin-inline-end: 0;
height: 6rem;
max-width: 34rem;
font-size: 1.8rem;
}
}
.p-graduate__entry:hover {
background-color: #4572C0;
}
.p-hamburger::after {
content: "";
display: block;
position: absolute;
bottom: -17px;
bottom: -1.7rem;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 35px;
width: 3.5rem;
height: 9.5px;
height: 0.95rem;
background-image: url(../images/common/menu.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
-webkit-transition: background-image 0.3s ease-out;
transition: background-image 0.3s ease-out;
}
.p-header--corporate .p-hamburger.open::after {
background-image: url(../images/common/menu-white.png);
}
.p-hamburger span {
display: block;
position: absolute;
width: 100%;
height: 2px;
background-color: #333;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-header--corporate .p-hamburger span {
-webkit-transition: background-color 0.3s ease-out, -webkit-transform 0.3s ease-out;
transition: background-color 0.3s ease-out, -webkit-transform 0.3s ease-out;
transition: background-color 0.3s ease-out, transform 0.3s ease-out;
transition: background-color 0.3s ease-out, transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-header--corporate .p-hamburger.open span {
background-color: #FFF;
}
.p-hamburger span:first-child {
top: 0;
}
.p-hamburger span:nth-child(2) {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.p-hamburger span:last-child {
bottom: 0;
}
.p-hamburger.open span {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.p-hamburger.open span:first-child {
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
}
.p-hamburger.open span:nth-child(2) {
display: none;
}
.p-hamburger.open span:last-child {
-webkit-transform: rotate(-30deg);
transform: rotate(-30deg);
}
.p-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 100;
background-color: #FFF;
height: 80px;
height: 8rem;
}
@media screen and (min-width: 768px) {
.p-header {
height: 13rem;
}
}
@media screen and (max-width: 767px) {
.p-header__inner.l-inner {
max-width: none;
}
}
.p-header__contents {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.p-header__logo {
width: 100%;
max-width: 270px;
max-width: 27rem;
display: block;
position: relative;
margin-top: 14px;
margin-top: 1.4rem;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-header__logo {
margin-top: 2.4rem;
max-width: 48rem;
}
}
.p-header--corporate .p-header__logo {
height: 27px;
height: 2.7rem;
}
@media screen and (min-width: 768px) {
.p-header--corporate .p-header__logo {
height: 4.8rem;
}
}
.p-header--corporate .p-header__logo img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.p-header--corporate .p-header__logo img {
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.p-header--corporate .p-header__logo .open {
opacity: 0;
}
.p-header--corporate .p-header__logo.open .open {
opacity: 1;
}
.p-header--corporate .p-header__logo.open .close {
opacity: 0;
}
.p-header__logo:hover {
opacity: 0.6;
}
.p-header__logo::after {
content: "採用サイト";
position: absolute;
bottom: -26px;
bottom: -2.6rem;
left: 0;
font-size: 10px;
font-size: 1rem;
letter-spacing: 0.1em;
display: block;
text-align: center;
color: #4880E0;
border: 1px solid #4880E0;
padding: 4px;
padding: 0.4rem;
line-height: 1;
width: 120px;
width: 12rem;
}
@media screen and (min-width: 768px) {
.p-header__logo::after {
left: auto;
right: -12.1rem;
bottom: auto;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
font-size: 1.2rem;
width: 11.3rem;
padding: 0.5rem;
}
}
.p-header--corporate .p-header__logo::after {
content: "企業サイト";
color: #3E40A4;
border-color: #3E40A4;
-webkit-transition: color 0.3s ease-out, border-color 0.3s ease-out;
transition: color 0.3s ease-out, border-color 0.3s ease-out;
}
.p-header--corporate .p-header__logo.open::after {
color: #FFF;
border-color: #FFF;
}
.p-header__hamburger {
position: relative;
margin: 16px 2px 0 auto;
margin: 1.6rem 0.2rem 0 auto;
width: 32px;
width: 3.2rem;
height: 18px;
height: 1.8rem;
}
@media screen and (min-width: 768px) {
.p-header__hamburger {
display: none;
}
}
.p-internship__heading {
padding-top: 34px;
padding-top: 3.4rem;
}
@media screen and (min-width: 768px) {
.p-internship__heading {
padding-top: 8.55rem;
}
}
@media screen and (max-width: 767px) {
.p-internship__heading--post {
padding-bottom: 2.2rem;
}
}
.swiper.p-internship__swiper {
margin-top: 54.5px;
margin-top: 5.45rem;
padding-bottom: 19.5px;
padding-bottom: 1.95rem;
}
@media screen and (min-width: 768px) {
.swiper.p-internship__swiper {
margin-top: 4.75rem;
padding-bottom: 3.15rem;
}
}
.p-internship__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-internship__img::before {
padding-top: 66.75%;
}
}
.p-internship__img img {
border-radius: 1.6rem;
}
.p-internship__description {
margin-top: 20.5px;
margin-top: 2.05rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-internship__description {
margin-top: 4.45rem;
}
}
.p-internship__program {
margin-top: 60px;
margin-top: 6rem;
margin-bottom: 10px;
margin-bottom: 1rem;
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__program {
margin-top: 12rem;
margin-bottom: 3rem;
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-internship__course {
margin-top: 24.5px;
margin-top: 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-internship__course {
margin-top: 4.75rem;
}
}
.p-internship__recruiting {
padding-top: 48px;
padding-top: 4.8rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__recruiting {
padding-top: 7.6rem;
padding-bottom: 12rem;
}
}
.p-internship__recruitingContents {
margin-top: 16.5px;
margin-top: 1.65rem;
}
@media screen and (min-width: 768px) {
.p-internship__recruitingContents {
margin-top: 3.4rem;
}
}
.p-internship__recruitingList {
padding: 7.5px 0 8px;
padding: 0.75rem 0 0.8rem;
border-bottom: 2px solid #F2F2F2;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 7.5px;
row-gap: 0.75rem;
}
@media screen and (min-width: 768px) {
.p-internship__recruitingList {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
padding: 1.55rem 0 1.6rem 0;
}
}
.p-internship__recruitingTitle {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-internship__recruitingTitle {
width: 27.6rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-internship__recruitingText {
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
margin-right: -2px;
margin-right: -0.2rem;
white-space: pre-wrap;
word-wrap: anywhere;
}
@media screen and (min-width: 768px) {
.p-internship__recruitingText {
margin-top: 0.05rem;
}
}
.p-internship__contact {
margin-top: 24px;
margin-top: 2.4rem;
display: block;
width: 100%;
max-width: 320px;
max-width: 32rem;
background-color: #4880E0;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
border-radius: 99.9rem;
font-weight: 500;
padding: 9.5px;
padding: 0.95rem;
letter-spacing: 0.1em;
text-align: center;
margin-inline: auto;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-internship__contact {
margin-top: 4.8rem;
}
}
.p-internship__contact:hover {
background-color: #4572C0;
}
.p-internship__headingBlock {
margin-top: 24.5px;
margin-top: 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-internship__headingBlock {
margin-top: 4.75rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-internship__headingImg {
max-width: 48rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-internship__headingImg::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-internship__headingImg::before {
padding-top: 66.6666666667%;
}
}
.p-internship__headingImg img {
border-radius: 1.6rem;
}
.p-internship__headingText {
white-space: pre-wrap;
}
.p-internship__outline {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__outline {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-internship__outlineContents {
margin-top: 24.5px;
margin-top: 2.45rem;
}
@media screen and (min-width: 768px) {
.p-internship__outlineContents {
margin-top: 4.75rem;
}
}
.p-internship__outlineList {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 8px;
row-gap: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-internship__outlineList {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 1.6rem;
}
}
.p-internship__outlineList:nth-of-type(n+2) {
margin-top: 16px;
margin-top: 1.6rem;
}
.p-internship__outlineTheme {
border-radius: 0.8rem;
background-color: #4880E0;
color: #FFF;
text-align: center;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: 0.1em;
padding: 8px;
padding: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-internship__outlineTheme {
width: 16rem;
-ms-flex-negative: 0;
flex-shrink: 0;
font-size: 2rem;
padding: 0.9rem;
}
}
.p-internship__outlineText {
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
font-weight: 500;
}
@media screen and (min-width: 768px) {
.p-internship__outlineText {
font-size: 2.4rem;
margin-top: 0.85rem;
}
}
.p-internship__curriculum {
margin-top: 60px;
margin-top: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__curriculum {
margin-top: 11.95rem;
}
}
.p-internship__curriculumContents {
margin-top: 24.5px;
margin-top: 2.45rem;
}
@media screen and (min-width: 768px) {
.p-internship__curriculumContents {
margin-top: 4.75rem;
}
}
.p-internship__curriculumBottomText {
margin-top: 24px;
margin-top: 2.4rem;
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-internship__curriculumBottomText {
margin-top: 1.6rem;
font-size: 2rem;
}
}
.p-internship__album {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__album {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-internship__albumContents {
margin-top: 23.5px;
margin-top: 2.35rem;
display: grid;
row-gap: 28px;
row-gap: 2.8rem;
}
@media screen and (min-width: 768px) {
.p-internship__albumContents {
margin-top: 4.75rem;
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
}
.p-internship__albumImg::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-internship__albumImg::before {
padding-top: 66.75%;
}
}
.p-internship__albumImg img {
border-radius: 1.6rem;
}
.p-internship__albumText {
margin-top: 16px;
margin-top: 1.6rem;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
}
.p-internshipItem {
display: block;
border-radius: 1.6rem;
-webkit-box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
overflow: hidden;
}
@media screen and (min-width: 768px) {
.p-internshipItem {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-internshipItem__img {
overflow: hidden;
}
@media screen and (min-width: 768px) {
.p-internshipItem__img {
max-width: 40rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-internshipItem__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-internshipItem__img::before {
padding-top: 66.75%;
}
}
.p-internshipItem__img img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-internshipItem:hover .p-internshipItem__img img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-internshipItem__body {
background-color: #FFF;
width: 100%;
padding: 42px 16px 41px;
padding: 4.2rem 1.6rem 4.1rem;
}
@media screen and (min-width: 768px) {
.p-internshipItem__body {
padding: 1.5rem 4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.p-internshipItem__course {
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-internshipItem__course {
font-size: 2rem;
}
}
.p-internshipItem__theme {
font-weight: 500;
line-height: 1.25;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
padding-bottom: 4px;
padding-bottom: 0.4rem;
border-bottom: 2px solid #4880E0;
}
@media screen and (min-width: 768px) {
.p-internshipItem__theme {
margin-top: 0.35rem;
font-size: 2.4rem;
padding-bottom: 0.85rem;
border-width: 4px;
}
}
.p-internshipItem__lists {
position: relative;
margin-top: 8.5px;
margin-top: 0.85rem;
}
@media screen and (min-width: 768px) {
.p-internshipItem__lists {
margin-top: 1.6rem;
}
}
.p-internshipItem__list {
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-internshipItem__list {
font-size: 1.6rem;
}
}
.p-internshipItem__list:nth-of-type(n+2) {
margin-top: 8.5px;
margin-top: 0.85rem;
}
@media screen and (min-width: 768px) {
.p-internshipItem__list:nth-of-type(n+2) {
margin-top: 1.6rem;
}
}
.p-internshipItem__list p:nth-of-type(2) {
margin-top: 2px;
margin-top: 0.2rem;
}
@media screen and (min-width: 768px) {
.p-internshipItem__list p:nth-of-type(2) {
margin-top: 0.4rem;
}
}
.p-internshipItem__arrow {
width: 32px;
width: 3.2rem;
height: 32px;
height: 3.2rem;
position: absolute;
bottom: 3px;
bottom: 0.3rem;
right: -1px;
right: -0.1rem;
border: 1px solid #D3D3D3;
border-radius: 50%;
-webkit-transition: border 0.3s ease-out;
transition: border 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-internshipItem__arrow {
bottom: 0.6rem;
right: 0;
}
}
.p-internshipItem:hover .p-internshipItem__arrow {
border-color: #4880E0;
}
.p-internshipItem__arrow::after {
content: "";
display: block;
width: 10px;
width: 1rem;
height: 10px;
height: 1rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-image: url(../images/icon/button-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.p-interview__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-interview__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-interview__headingBlock {
margin-top: 24.5px;
margin-top: 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-interview__headingBlock {
margin-top: 4.75rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-interview__img {
max-width: 64rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-interview__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-interview__img::before {
padding-top: 66.71875%;
}
}
.p-interview__img img {
border-radius: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-interview__wrap {
margin-top: -0.4rem;
}
}
@media screen and (min-width: 768px) {
.p-interview__wrap--single {
margin: 0;
}
}
.p-interview__theme {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interview__theme {
font-size: 3.2rem;
line-height: 1.5;
}
}
.p-interview__crossText {
margin-top: 12px;
margin-top: 1.2rem;
white-space: pre-wrap;
}
.p-interview__info {
margin-top: 12px;
margin-top: 1.2rem;
border-top: 2px solid #4880E0;
padding-top: 4px;
padding-top: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-interview__info {
margin-top: 4rem;
border-width: 4px;
padding-top: 1.6rem;
}
}
.p-interview__crossWrap {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 16px 26px;
gap: 1.6rem 2.6rem;
position: relative;
}
@media screen and (min-width: 768px) {
.p-interview__crossWrap {
gap: 1.8rem 6.5rem;
}
}
.p-interview__infoBlock:nth-of-type(2) {
position: relative;
}
.p-interview__crossWrap::before {
content: "";
display: block;
width: 24px;
width: 2.4rem;
height: 24px;
height: 2.4rem;
background-image: url(../images/icon/cross.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: absolute;
top: 50%;
left: calc(50% - 0.4rem);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
@media screen and (min-width: 768px) {
.p-interview__crossWrap::before {
width: 4rem;
height: 4rem;
left: calc(50% - 1.4rem);
}
}
.p-interview__position {
color: #888;
font-weight: 500;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: 0.1em;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-interview__position {
font-size: 1.6rem;
}
}
.p-interview__wrap--single .p-interview__position {
font-size: 16px;
font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-interview__wrap--single .p-interview__position {
font-size: 2.4rem;
}
}
.p-interview__name {
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-interview__name {
font-size: 2.6rem;
}
}
.p-interview__wrap--single .p-interview__name {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.5rem;
-moz-column-gap: 0.5rem;
column-gap: 0.5rem;
font-size: 20px;
font-size: 2rem;
}
@media screen and (min-width: 768px) {
.p-interview__wrap--single .p-interview__name {
font-size: 3.2rem;
}
}
.p-interview__posts {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-interview__posts {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-interview__items {
margin-top: 24.5px;
margin-top: 2.45rem;
display: grid;
gap: 24px;
gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-interview__items {
margin-top: 4.75rem;
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
}
.p-interview__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-interview__link {
margin-top: 4rem;
}
}
.p-interview__contents {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-interview__contents {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-interview__block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-interview__block {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-interview__block:nth-child(even) {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
}
.p-interview__block:nth-of-type(n+2) {
margin-top: 40px;
margin-top: 4rem;
}
@media screen and (min-width: 768px) {
.p-interview__block:nth-of-type(n+2) {
margin-top: 8rem;
}
}
@media screen and (min-width: 768px) {
.p-interview__blockImg {
max-width: 48rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-interview__blockImg::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-interview__blockImg::before {
padding-top: 66.6666666667%;
}
}
.p-interview__blockImg img {
border-radius: 1.6rem;
}
.p-interview__blockTheme {
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
font-weight: 500;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interview__blockTheme {
font-size: 3.2rem;
line-height: 1.5;
}
}
.p-interview__blockText {
margin-top: 12px;
margin-top: 1.2rem;
margin-right: -1px;
margin-right: -0.1rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-interview__blockText {
margin-top: 2.4rem;
margin-right: -0.2rem;
}
}
.p-interview__weeks {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-interview__weeks {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-interview__container {
margin-top: 24.5px;
margin-top: 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24.5px;
row-gap: 2.45rem;
}
@media screen and (min-width: 768px) {
.p-interview__container {
margin-top: 4.75rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
@media screen and (min-width: 768px) {
.p-interview__schedule {
width: 100%;
max-width: 64rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-interview__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 4px;
row-gap: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-interview__list {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
gap: 0 0.8rem;
}
}
.p-interview__list:nth-of-type(n+2) {
margin-top: 8px;
margin-top: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-interview__list:nth-of-type(n+2) {
margin-top: 1.6rem;
}
}
.p-interview__day {
border-radius: 0.8rem;
background-color: #4880E0;
color: #FFF;
padding: 7px 5px;
padding: 0.7rem 0.5rem;
border: 1px solid #4880E0;
font-size: 16px;
font-size: 1.6rem;
text-align: center;
font-weight: 500;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interview__day {
width: 100%;
max-width: 16rem;
-ms-flex-negative: 0;
flex-shrink: 0;
font-size: 2rem;
padding: 1.6rem 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.p-interview__action {
border-radius: 0.8rem;
background-color: #FFF;
border: 1px solid #4880E0;
padding: 8.5px 15px;
padding: 0.85rem 1.5rem;
font-weight: 500;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interview__action {
width: 100%;
font-size: 1.6rem;
padding: 1.9rem 1.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.p-interview__scheduleTheme {
font-size: 20px;
font-size: 2rem;
font-weight: 500;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interview__scheduleTheme {
font-size: 3.2rem;
}
}
.p-interviewItem {
display: block;
border-radius: 1.6rem;
}
.p-interviewItem__img::before {
padding-top: 133.2361516035%;
}
@media screen and (min-width: 768px) {
.p-interviewItem__img::before {
padding-top: 133.4415584416%;
}
}
@media screen and (min-width: 768px) {
.p-interviewItem__img::after {
content: "";
display: block;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(51, 51, 51, 0)), to(#333));
background: linear-gradient(rgba(51, 51, 51, 0) 0%, #333 100%);
width: 100%;
height: 16rem;
border-radius: 0 0 1.6rem 1.6rem;
}
}
.p-interviewItem__img img {
border-radius: 1.6rem;
}
.p-interviewItem__filter {
width: 100%;
position: absolute;
z-index: 2;
left: 0;
bottom: 0;
background-color: rgba(72, 128, 224, .8);
border-radius: 0 0 1.6rem 1.6rem;
padding: 24px 16px 24.5px;
padding: 2.4rem 1.6rem 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
color: #FFF;
}
@media screen and (min-width: 768px) {
.p-interviewItem__filter {
opacity: 0;
background-color: rgba(72, 128, 224, .5);
border-radius: 1.6rem;
height: 100%;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
}
@media screen and (min-width: 768px) {
.p-interviewItem:hover .p-interviewItem__filter {
opacity: 1;
}
}
.p-interviewItem__words {
font-weight: 500;
font-family: "Noto Sans JP", sans-serif;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
border-bottom: 2px solid #FFF;
padding-bottom: 4px;
padding-bottom: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-interviewItem__words {
font-size: 2rem;
padding-bottom: 0.8rem;
}
}
.p-interviewItem__position {
margin-top: 16.5px;
margin-top: 1.65rem;
font-size: 14px;
font-size: 1.4rem;
font-family: "Noto Sans JP", sans-serif;
font-weight: 500;
letter-spacing: 0.1em;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-interviewItem__position {
margin-top: 2.4rem;
font-size: 1.6rem;
}
}
.p-interviewItem__name {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.7rem;
-moz-column-gap: 0.7rem;
column-gap: 0.7rem;
}
@media screen and (min-width: 768px) {
.p-interviewItem__name {
margin-top: 0.35rem;
font-size: 2.4rem;
}
}
.p-interviewPost {
display: block;
}
@media screen and (min-width: 768px) {
.p-interviewPost {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.p-interviewPost__img {
overflow: hidden;
border-radius: 1.6rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.p-interviewPost__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-interviewPost__img::before {
padding-top: 66.75%;
}
}
.p-interviewPost__img img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-interviewPost:hover .p-interviewPost__img img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-interviewPost__body {
padding-top: 8px;
padding-top: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-interviewPost__body {
height: 100%;
padding-top: 1.6rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
}
.p-interviewPost__title {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interviewPost__title {
font-size: 2rem;
margin-bottom: auto;
}
}
.p-interviewPost__bottom {
margin-top: 8px;
margin-top: 0.8rem;
border-left: 8px solid #4880E0;
border-bottom: 2px solid #4880E0;
padding: 1.5px 0 4px 6px;
padding: 0.15rem 0 0.4rem 0.6rem;
position: relative;
}
@media screen and (min-width: 768px) {
.p-interviewPost__bottom {
margin-top: 1.2rem;
border-left-width: 12px;
padding: 0.05rem 0 0.8rem 0.8rem;
}
}
.p-interviewPost__position {
color: #888;
font-size: 12px;
font-size: 1.2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-interviewPost__position {
font-size: 1.4rem;
}
}
.p-interviewPost__name {
margin-top: 4px;
margin-top: 0.4rem;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.7rem;
-moz-column-gap: 0.7rem;
column-gap: 0.7rem;
}
@media screen and (min-width: 768px) {
.p-interviewPost__name {
font-size: 1.6rem;
}
}
.p-interviewPost__arrow {
width: 32px;
width: 3.2rem;
height: 32px;
height: 3.2rem;
position: absolute;
top: 1.5px;
top: 0.15rem;
right: 8px;
right: 0.8rem;
border: 1px solid #D3D3D3;
border-radius: 50%;
-webkit-transition: border 0.3s ease-out;
transition: border 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-interviewPost__arrow {
top: 0.3rem;
}
}
.p-interviewPost:hover .p-interviewPost__arrow {
border-color: #4880E0;
}
.p-interviewPost__arrow::after {
content: "";
display: block;
width: 10px;
width: 1rem;
height: 10px;
height: 1rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
background-image: url(../images/icon/button-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.p-item {
border-radius: 1.6rem;
-webkit-box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
}
.p-item__img {
display: block;
overflow: hidden;
border-radius: 1.6rem 1.6rem 0 0;
}
.p-item__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-item__img::before {
padding-top: 66.75%;
}
}
.p-item__img img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-item__img:hover img,
.p-item--related:hover .p-item__img img,
.p-item--interview:hover .p-item__img img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-item__body {
padding: 14.5px 16px 15.5px;
padding: 1.45rem 1.6rem 1.55rem;
background-color: #FFF;
border-radius: 0 0 1.6rem 1.6rem;
}
.p-item--related .p-item__body {
padding-top: 16px;
padding-top: 1.6rem;
padding-bottom: 34px;
padding-bottom: 3.4rem;
}
.p-item--interview .p-item__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding-top: 16px;
padding-top: 1.6rem;
padding-bottom: 16px;
padding-bottom: 1.6rem;
min-height: 160px;
min-height: 16rem;
}
@media screen and (min-width: 768px) {
.p-item--interview .p-item__body {
padding-top: 2.4rem;
padding-bottom: 2.4rem;
min-height: 17.2rem;
}
}
.p-item__info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
}
.p-item__time {
display: block;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
color: #888;
}
@media screen and (min-width: 768px) {
.p-blog__single .p-item__time {
font-size: 1.6rem;
}
}
.p-item__category {
background-color: #4880E0;
color: #FFF;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: 0.1em;
padding: 0 7.5px;
padding: 0 0.75rem;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-blog__single .p-item__category {
font-size: 1.4rem;
}
}
.p-item__category:hover {
background-color: #4572C0;
}
.p-item__title {
margin-top: 6.5px;
margin-top: 0.65rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
letter-spacing: 0.1em;
}
.p-item--related .p-item__title {
margin-top: 0;
}
.p-item--interview .p-item__title {
margin-top: 0;
-webkit-line-clamp: 3;
}
.p-item__text {
margin-top: 8.5px;
margin-top: 0.85rem;
font-size: 14px;
font-size: 1.4rem;
font-family: "Noto Sans JP", sans-serif;
font-weight: 300;
letter-spacing: 0.1em;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 4;
}
.p-item__position {
margin-top: auto;
font-size: 12px;
font-size: 1.2rem;
line-height: 1.25;
letter-spacing: 0.1em;
color: #888;
}
.p-item__name {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.7rem;
-moz-column-gap: 0.7rem;
column-gap: 0.7rem;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-item--content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
@media screen and (min-width: 768px) {
.p-item--content .p-item__img {
max-width: 32rem;
-ms-flex-negative: 0;
flex-shrink: 0;
border-radius: 1.6rem 0 0 1.6rem;
}
}
@media screen and (min-width: 768px) {
.p-item--content .p-item__img::before {
padding-top: 75%;
}
}
@media screen and (min-width: 768px) {
.p-item--content .p-item__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
border-radius: 0 1.6rem 1.6rem 0;
}
}
@media screen and (min-width: 768px) {
.p-item--content .p-item__title {
margin-top: 0.2rem;
line-height: 1.5;
}
}
@media screen and (min-width: 768px) {
.p-item--content .p-item__text {
margin-top: 0.4rem;
margin-bottom: 0;
line-height: 2;
}
}
.p-jobs__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-jobs__heading {
padding-top: 8.6rem;
padding-bottom: 12rem;
}
}
.p-jobs__categories {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 8px;
row-gap: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-jobs__categories {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 0 3.2rem;
}
}
.p-jobs__category {
border: 2px solid #4880E0;
color: #4880E0;
text-align: center;
width: 100%;
padding: 11.5px;
padding: 1.15rem;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
letter-spacing: 0.1em;
border-radius: 2rem;
-webkit-transition: color 0.3s ease-out, background-color 0.3s ease-out;
transition: color 0.3s ease-out, background-color 0.3s ease-out;
}
.p-jobs__category:hover {
color: #FFF;
background-color: #4880E0;
}
.p-jobs__container {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-jobs__container {
margin-top: 4.8rem;
}
}
.p-jobs__pager {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 25px;
row-gap: 2.5rem;
}
@media screen and (min-width: 768px) {
.p-jobs__pager {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
}
.p-jobs__items {
margin-top: 24px;
margin-top: 2.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobs__items {
margin-top: 4.8rem;
row-gap: 2.4rem;
}
}
.p-jobs__postContents {
margin-top: 60px;
margin-top: 6rem;
}
@media screen and (min-width: 768px) {
.p-jobs__postContents {
margin-top: 12rem;
}
}
.p-jobs__details {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobs__details {
margin-top: 3.2rem;
}
}
.p-jobs__entry {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-jobs__entry {
margin-top: 4.8rem;
}
}
.p-jobsPost {
display: block;
background-color: #EFF5FB;
padding: 24px 16px;
padding: 2.4rem 1.6rem;
border-radius: 1.6rem;
-webkit-box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
}
@media screen and (min-width: 768px) {
.p-jobsPost {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 3.9rem 4rem 4rem;
}
}
.p-jobsPost__title {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-jobsPost__title {
font-size: 2.4rem;
}
}
.p-jobsPost__tags {
margin-top: 7px;
margin-top: 0.7rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 16px;
gap: 1.6rem;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
.p-jobsPost__tags {
margin-left: 1.6rem;
}
}
.p-jobsPost__tag {
color: #4880E0;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: 0.1em;
}
.p-jobsPost__img {
overflow: hidden;
border-radius: 1.6rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
@media screen and (min-width: 768px) {
.p-jobsPost__img {
max-width: 48rem;
}
}
.p-jobsPost__img::before {
padding-top: 66.5594855305%;
}
@media screen and (min-width: 768px) {
.p-jobsPost__img::before {
padding-top: 66.6666666667%;
}
}
.p-jobsPost__body {
margin-top: 14px;
margin-top: 1.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__body {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
gap: 0 2rem;
}
}
.p-jobsPost__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.p-jobsPost__heading {
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-jobsPost__heading {
font-size: 2rem;
}
}
.p-jobsPost__text {
margin-top: 8px;
margin-top: 0.8rem;
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-jobsPost__text {
font-size: 1.6rem;
}
}
.p-jobsPost__list {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__list {
padding-bottom: 1.6rem;
}
}
.p-jobsPost__block {
border: 1px solid #4880E0;
overflow: hidden;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
letter-spacing: 0.1em;
line-height: 1.25;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
border-radius: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__block {
font-size: 1.6rem;
}
}
.p-jobsPost__term {
color: #FFF;
background-color: #4880E0;
width: 80px;
width: 8rem;
text-align: center;
padding: 6.25px 0;
padding: 0.625rem 0;
-ms-flex-negative: 0;
flex-shrink: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (min-width: 768px) {
.p-jobsPost__term {
padding: 0.5rem 0;
width: 10rem;
}
}
.p-jobsPost__desc {
background-color: #FFF;
padding: 6.25px 7px;
padding: 0.625rem 0.7rem;
width: 100%;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-jobsPost__desc {
padding: 0.5rem 1.5rem;
}
}
.p-jobsPost__blocks {
margin-top: 4px;
margin-top: 0.4rem;
display: grid;
gap: 4px;
gap: 0.4rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__blocks {
grid-template-columns: repeat(2, 1fr);
}
}
.p-jobsPost__bottom {
margin-top: 8px;
margin-top: 0.8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__bottom {
margin-top: auto;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
.p-jobsPost__time {
font-size: 12px;
font-size: 1.2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-jobsPost__time {
font-size: 1.4rem;
}
}
.p-jobsPost__links {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 8px;
row-gap: 0.8rem;
width: 100%;
}
@media screen and (min-width: 768px) {
.p-jobsPost__links {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 1.6rem;
margin-left: auto;
max-width: 41.6rem;
}
}
.p-jobsPost__links--single {
margin-top: 24px;
margin-top: 2.4rem;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__links--single {
margin-top: 4.8rem;
gap: 0 4rem;
margin-left: 0;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
max-width: none;
}
}
.p-jobsPost__link {
display: block;
width: 100%;
background-color: #4880E0;
color: #FFF;
text-align: center;
border-radius: 99.9rem;
padding: 9.5px;
padding: 0.95rem;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-jobsPost__link {
max-width: 20rem;
}
}
.p-jobsPost__links--single .p-jobsPost__link {
font-size: 20px;
font-size: 2rem;
padding: 17px 9.5px;
padding: 1.7rem 0.95rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__links--single .p-jobsPost__link {
max-width: 31.1rem;
}
}
.p-jobsPost__link:hover {
background-color: #4572C0;
}
.p-jobsPost__link--detail {
background-color: #333;
}
.p-jobsPost__link--detail:hover {
background-color: #141414;
}
.p-jobsPost__body--single .p-jobsPost__container {
width: 100%;
}
.p-jobsPost__body--single .p-jobsPost__list {
margin-top: 0;
padding-bottom: 0;
display: grid;
gap: 4px;
gap: 0.4rem;
}
.p-jobsPost__body--single .p-jobsPost__term {
width: 104px;
width: 10.4rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__body--single .p-jobsPost__term {
padding: 0.9rem 0;
width: 16rem;
}
}
@media screen and (min-width: 768px) {
.p-jobsPost__body--single .p-jobsPost__desc {
padding: 0.9rem 1.5rem;
}
}
.p-jobsPost__body--single .p-jobsPost__time {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-jobsPost__body--single .p-jobsPost__time {
margin-top: 2.4rem;
}
}
.p-list__item {
padding: 12px 0;
padding: 1.2rem 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 6px;
row-gap: 0.6rem;
}
@media screen and (min-width: 768px) {
.p-list__item {
padding: 1.5rem 2.4rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0;
}
}
.p-list__item:not(:last-of-type) {
border-bottom: 2px solid #F2F2F2;
}
.p-list--jobs .p-list__item {
row-gap: 7.5px;
row-gap: 0.75rem;
padding: 8px 0;
padding: 0.8rem 0;
}
@media screen and (min-width: 768px) {
.p-list--jobs .p-list__item {
padding: 1.5rem 0;
}
}
.p-list--jobs .p-list__item:last-of-type {
border-bottom: 2px solid #F2F2F2;
}
.p-list__theme {
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-list__theme {
width: 17.6rem;
-ms-flex-negative: 0;
flex-shrink: 0;
font-size: 2rem;
}
}
@media screen and (min-width: 768px) {
.p-list--history .p-list__theme {
width: 27.6rem;
}
}
.p-list--jobs .p-list__theme {
font-size: 20px;
font-size: 2rem;
}
@media screen and (min-width: 768px) {
.p-list--jobs .p-list__theme {
width: 24rem;
}
}
.p-list--base .p-list__item {
border-bottom: 2px solid #F2F2F2;
}
@media screen and (min-width: 768px) {
.p-list--base .p-list__theme {
width: auto;
}
}
@media screen and (min-width: 768px) {
.p-list--office .p-list__theme {
width: 19.6rem;
}
}
.p-list__description {
font-weight: 300;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-list__description {
margin-top: 0.3rem;
font-size: 1.6rem;
}
}
.p-list--jobs .p-list__description {
font-size: 16px;
font-size: 1.6rem;
font-weight: 400;
}
.p-list--jobs .p-list__description p {
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-list--base .p-list__description {
margin-left: auto;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-list__description--num {
counter-reset: num 0;
}
.p-list__description--num p {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.p-list__description--num p::before {
counter-increment: num 1;
content: counter(num) ".";
}
.p-list__flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
}
.p-list__flex p:first-of-type {
-ms-flex-negative: 0;
flex-shrink: 0;
}
.p-list__flex:nth-of-type(n+2) {
margin-top: 16px;
margin-top: 1.6rem;
}
.p-list__map {
margin-top: 8px;
margin-top: 0.8rem;
width: 100%;
height: 42.6666666667vw;
}
@media screen and (min-width: 768px) {
.p-list__map {
margin-top: 1.6rem;
height: 48rem;
}
}
.p-list__map iframe {
width: 100%;
height: 100%;
}
.p-modal {
opacity: 0;
visibility: hidden;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(51, 51, 51, .6);
-webkit-transition: opacity 0.3s ease-out, visibility 0s 0.5s;
transition: opacity 0.3s ease-out, visibility 0s 0.5s;
z-index: 1000;
}
.p-modal.open {
opacity: 1;
visibility: visible;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.p-modal__inner {
height: inherit;
}
.p-modal__container {
height: inherit;
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media screen and (min-width: 768px) {
.p-modal__container {
max-width: 80rem;
margin-inline: auto;
}
}
.p-modal__contents {
position: relative;
width: 100%;
background-color: #FFF;
padding: 32px 21px;
padding: 3.2rem 2.1rem;
border: 2px solid #4880E0;
border-radius: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-modal__contents {
padding: 4rem 4rem 3.3rem;
}
}
.p-modal__contents--corporate {
border-color: #3E40A4;
}
.p-modal__close {
cursor: pointer;
position: absolute;
top: 12px;
top: 1.2rem;
right: 12px;
right: 1.2rem;
background-image: url(../images/icon/close.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
width: 20px;
width: 2rem;
height: 20px;
height: 2rem;
}
@media screen and (min-width: 768px) {
.p-modal__close {
top: 1.6rem;
right: 1.6rem;
width: 3.2rem;
height: 3.2rem;
}
}
.p-modal__title {
text-align: center;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-modal__title {
font-size: 2rem;
}
}
.p-modal__body {
margin-top: 24px;
margin-top: 2.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-modal__body {
margin-top: 3.2rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0 2.4rem;
}
}
.p-modal__body--second {
row-gap: 10px;
row-gap: 1rem;
}
@media screen and (min-width: 768px) {
.p-modal__body--second {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
row-gap: 5rem;
}
}
@media screen and (min-width: 768px) {
.p-modal__img {
width: 100%;
max-width: 32rem;
}
}
.p-modal__secondImg {
width: 100%;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-modal__secondImg {
max-width: 70rem;
}
}
.p-modal__secondImg img {
height: auto;
}
.p-modal__img::before {
padding-top: 100%;
}
.p-modal__num {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 8px;
row-gap: 0.8rem;
}
.p-modal__num p {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
color: #4880E0;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-modal__num p {
font-size: 1.6rem;
}
}
.p-modal__num p::before {
content: "";
display: block;
width: 14px;
width: 1.4rem;
height: 14px;
height: 1.4rem;
border-radius: 50%;
-ms-flex-negative: 0;
flex-shrink: 0;
margin-top: 2px;
margin-top: 0.2rem;
}
@media screen and (min-width: 768px) {
.p-modal__num p::before {
margin-top: 0.3rem;
width: 1.6rem;
height: 1.6rem;
}
}
.p-modal__num p:first-of-type::before {
background-color: #3149A1;
}
.p-modal__num p:nth-of-type(2)::before {
background-color: #4880E0;
}
.p-modal__num p:nth-of-type(3)::before {
background-color: #F6727D;
}
.p-modal__num p:nth-of-type(4)::before {
background-color: #B3B1B2;
}
.p-modal__secondText {
font-size: 10px;
font-size: 1rem;
font-weight: 500;
text-align: right;
margin-left: auto;
}
@media screen and (min-width: 768px) {
.p-modal__secondText {
font-size: 1.6rem;
}
}
.p-modal__text {
margin-top: 10px;
margin-top: 1rem;
border-top: 2px solid #3E40A4;
padding-top: 16px;
padding-top: 1.6rem;
}
.p-nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
z-index: -1;
-webkit-transform: translateX(100%);
transform: translateX(100%);
-webkit-transition: opacity 0.6s ease-out, visibility 0s 1s, -webkit-transform 0.4s ease-out;
transition: opacity 0.6s ease-out, visibility 0s 1s, -webkit-transform 0.4s ease-out;
transition: transform 0.4s ease-out, opacity 0.6s ease-out, visibility 0s 1s;
transition: transform 0.4s ease-out, opacity 0.6s ease-out, visibility 0s 1s, -webkit-transform 0.4s ease-out;
overflow-y: scroll;
opacity: 0;
visibility: hidden;
background-color: #FFF;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
@media screen and (min-width: 768px) {
.p-nav {
display: block;
position: static;
height: inherit;
opacity: 1;
visibility: visible;
overflow: visible;
-webkit-transform: none;
transform: none;
margin-left: auto;
background-color: transparent;
z-index: auto;
}
}
.p-nav.open {
opacity: 1;
visibility: visible;
-webkit-transform: translateX(0);
transform: translateX(0);
-webkit-transition: opacity 0.6s ease-out, -webkit-transform 0.4s ease-out;
transition: opacity 0.6s ease-out, -webkit-transform 0.4s ease-out;
transition: transform 0.4s ease-out, opacity 0.6s ease-out;
transition: transform 0.4s ease-out, opacity 0.6s ease-out, -webkit-transform 0.4s ease-out;
}
.p-nav__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: inherit;
}
@media screen and (min-width: 768px) {
.p-nav__container {
display: block;
}
}
@media screen and (max-width: 767px) {
.p-header--corporate .p-nav__container {
background-color: #3E40A4;
}
}
.p-nav__items {
margin-top: 16.6666666667vh;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 3.5416666667vh;
}
@media screen and (min-width: 768px) {
.p-nav__items {
margin: 2.25rem 0 0 2.4rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 3.1rem;
}
}
@media screen and (min-width: 768px) {
.p-nav__items--sp {
display: none;
}
}
@media screen and (max-width: 767px) {
.p-nav__items--pc {
display: none;
}
}
.p-nav__link {
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
display: block;
padding-bottom: 2px;
padding-bottom: 0.2rem;
border-bottom: 1px solid transparent;
-webkit-transition: border 0.3s ease-out;
transition: border 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-nav__link {
font-size: 1.4rem;
}
}
@media screen and (max-width: 767px) {
.p-header--corporate .p-nav__link {
color: #FFF;
}
}
.p-nav__link:hover {
border-color: #4880E0;
}
.p-header--corporate .p-nav__link:hover {
border-color: #FFF;
}
@media screen and (min-width: 768px) {
.p-header--corporate .p-nav__link:hover {
border-color: #3E40A4;
}
}
.p-nav__entries {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-top: auto;
}
@media screen and (min-width: 768px) {
.p-nav__entries {
margin-top: 2.8rem;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-column-gap: 1.6rem;
-moz-column-gap: 1.6rem;
column-gap: 1.6rem;
}
}
@media screen and (min-width: 768px) {
.p-header--corporate .p-nav__entries {
margin-top: 2.4rem;
}
}
.p-nav .p-nav__entries {
display: none;
}
@media screen and (min-width: 768px) {
.p-nav .p-nav__entries {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-nav__entries--following {
margin: 0;
position: fixed;
bottom: 0;
left: 0;
z-index: 150;
}
@media screen and (min-width: 768px) {
.p-nav__entries--following {
display: none;
}
}
.p-nav__entry {
width: 50%;
height: 64px;
height: 6.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
text-align: center;
background-color: #4880E0;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-nav__entry {
height: 4rem;
border-radius: 99.9rem;
width: 100%;
max-width: 24rem;
}
}
.p-nav__entry--career {
background-color: #3149A1;
}
.p-nav__entry:hover {
background-color: #4572C0;
}
.p-nav__entry--career:hover {
background-color: #273770;
}
.p-nav__contact {
width: 100%;
height: 64px;
height: 6.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
color: #FFF;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
text-align: center;
background-color: #333;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-nav__contact {
height: 4.8rem;
background-color: #3E40A4;
width: 100%;
max-width: 20rem;
font-size: 1.4rem;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
}
.p-nav__contact:hover {
background-color: #222470;
}
.p-nav__contact::before {
content: "";
display: block;
width: 24px;
width: 2.4rem;
height: 24px;
height: 2.4rem;
background-image: url(../images/icon/mail.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-nav__contact::before {
width: 2rem;
height: 2rem;
}
}
.p-news {
padding: 8px 0;
padding: 0.8rem 0;
border-bottom: 2px solid #D9D9D9;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 7px;
row-gap: 0.7rem;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-news {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0 1.6rem;
padding: 1.55rem 0;
}
}
.p-news:hover {
opacity: 0.7;
}
.p-news__info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media screen and (min-width: 768px) {
.p-news__info {
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-news__time {
display: block;
width: 101px;
width: 10.1rem;
font-size: 16px;
font-size: 1.6rem;
font-weight: 300;
}
@media screen and (min-width: 768px) {
.p-news__time {
font-size: 2rem;
width: 12.3rem;
}
}
.p-news__category {
color: #FFF;
background-color: #3E40A4;
font-size: 12px;
font-size: 1.2rem;
min-width: 76px;
min-width: 7.6rem;
padding: 1.5px 7px;
padding: 0.15rem 0.7rem;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-news__category {
font-size: 1.4rem;
min-width: 10.2rem;
padding: 0.35rem 0.7rem;
}
}
.p-news__title {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
font-weight: 300;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.44;
}
@media screen and (min-width: 768px) {
.p-news__title {
-webkit-line-clamp: 1;
font-size: 2rem;
}
}
.p-news__thumbnail img {
height: auto;
}
.p-newsItem {
overflow: hidden;
}
@media screen and (min-width: 768px) {
.p-newsItem--archive {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-newsItem__img {
display: block;
overflow: hidden;
pointer-events: auto;
}
@media screen and (min-width: 768px) {
.p-newsItem--archive .p-newsItem__img {
max-width: 30rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-newsItem__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-newsItem__img::before {
padding-top: 66.5562913907%;
}
}
@media screen and (min-width: 768px) {
.p-newsItem--archive .p-newsItem__img::before {
padding-top: 71%;
}
}
.p-newsItem__img img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-newsItem__img:hover img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-newsItem__body {
background-color: #EFEFEF;
padding: 16px;
padding: 1.6rem;
}
.p-newsItem--related .p-newsItem__body {
background-color: #FFF;
}
@media screen and (min-width: 768px) {
.p-newsItem--archive .p-newsItem__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.p-newsItem__info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.p-newsItem__time {
display: block;
min-width: 77px;
min-width: 7.7rem;
-ms-flex-negative: 0;
flex-shrink: 0;
font-weight: 300;
font-size: 12px;
font-size: 1.2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
.p-newsItem__category {
background-color: #3E40A4;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
color: #FFF;
font-size: 10px;
font-size: 1rem;
line-height: 1.25;
letter-spacing: 0.1em;
padding: 2px 4px;
padding: 0.2rem 0.4rem;
}
.p-newsItem__category:hover {
background-color: #222470;
}
.p-newsItem__title {
margin-top: 4px;
margin-top: 0.4rem;
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.p-newsItem__text {
margin-top: 8px;
margin-top: 0.8rem;
font-weight: 300;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
background-color: #DEDEDE;
}
.p-newsItem--related .p-newsItem__text {
background-color: #EFEFEF;
}
@media screen and (min-width: 768px) {
.p-newsItem--archive .p-newsItem__text {
-webkit-line-clamp: 4;
}
}
.p-newsItem__link {
margin-top: 10px;
margin-top: 1rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
-webkit-column-gap: 0.4rem;
-moz-column-gap: 0.4rem;
column-gap: 0.4rem;
color: #3E40A4;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
margin-left: auto;
}
@media screen and (min-width: 768px) {
.p-newsItem--archive .p-newsItem__link {
margin-top: 1.4rem;
}
}
.p-newsItem__link::after {
content: "";
display: block;
margin-top: 1px;
margin-top: 0.1rem;
width: 12px;
width: 1.2rem;
height: 12px;
height: 1.2rem;
background-image: url(../images/icon/arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-newsItem__link:hover::after {
-webkit-transform: translateX(0.3rem);
transform: translateX(0.3rem);
}
.p-person__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-person__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-person__items {
margin-top: 24.5px;
margin-top: 2.45rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 15px;
gap: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-person__items {
margin-top: 4.75rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
gap: 0 2rem;
}
}
.p-person__text {
margin-top: 24px;
margin-top: 2.4rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-person__text {
margin-top: 4.8rem;
}
}
.p-person__contents {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-person__contents {
padding-top: 11.95rem;
padding-bottom: 12rem;
}
}
.p-person__blocks {
margin-top: 24.5px;
margin-top: 2.45rem;
}
@media screen and (min-width: 768px) {
.p-person__blocks {
margin-top: 4.75rem;
}
}
.p-person__block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-person__block {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 4rem;
}
}
.p-person__block:nth-of-type(n+2) {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-person__block:nth-of-type(n+2) {
margin-top: 8rem;
}
}
@media screen and (min-width: 768px) {
.p-person__block:nth-child(even) {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
}
@media screen and (min-width: 768px) {
.p-person__img {
max-width: 64rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-person__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-person__img::before {
padding-top: 66.71875%;
}
}
.p-person__img img {
border-radius: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-person__wrap {
margin-top: -0.05rem;
}
}
.p-person__theme {
color: #4880E0;
font-weight: 500;
padding: 0 0 4px 8px;
padding: 0 0 0.4rem 0.8rem;
border-bottom: 2px solid #4880E0;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-person__theme {
font-size: 2.4rem;
padding-bottom: 0.45rem;
width: 93.4%;
}
}
.p-person__subject {
margin-top: 12px;
margin-top: 1.2rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-person__subject {
margin-top: 2.4rem;
font-size: 3.2rem;
}
}
.p-person__blockText {
margin-top: 12px;
margin-top: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-person__blockText {
margin-top: 2.4rem;
}
}
.p-personItem {
width: 100%;
max-width: calc(50% - 0.75rem);
position: relative;
border: 2px solid #4880E0;
background-color: #FFF;
border-radius: 50%;
}
@media screen and (min-width: 768px) {
.p-personItem {
max-width: none;
}
}
.p-personItem::before {
content: "";
display: block;
padding-top: 100%;
}
.p-personItem p {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
font-weight: 500;
color: #4880E0;
font-size: min(4.2666666667vw, 20px);
font-size: min(4.2666666667vw, 2rem);
letter-spacing: 0.1em;
width: 100%;
text-align: center;
}
@media screen and (min-width: 768px) {
.p-personItem p {
font-size: 2rem;
}
}
.p-products__heading {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-products__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
.p-products__categories {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 16px;
gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-products__categories {
max-width: 100rem;
-webkit-column-gap: 4rem;
-moz-column-gap: 4rem;
column-gap: 4rem;
margin-inline: auto;
}
}
.p-products__categories--construction {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
.p-products__categories--construction {
max-width: 108rem;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
}
.p-products__category {
position: relative;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
border: 2px solid #3E40A4;
background-color: #3E40A4;
padding: 17.5px 0;
padding: 1.75rem 0;
text-align: center;
color: #FFF;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
font-weight: 500;
letter-spacing: 0.1em;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-products__category {
font-size: 2.4rem;
padding: 2.3rem 0;
}
}
.p-products__category:hover {
background-color: #222470;
}
.p-products__category::after {
content: "";
display: block;
position: absolute;
bottom: 0;
right: 0;
width: 12px;
width: 1.2rem;
height: 12px;
height: 1.2rem;
background-color: #FFF;
-webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%);
clip-path: polygon(100% 0, 0% 100%, 100% 100%);
}
@media screen and (min-width: 768px) {
.p-products__category::after {
width: 1.6rem;
height: 1.6rem;
}
}
.p-products__category span {
display: block;
font-size: 14px;
font-size: 1.4rem;
}
@media screen and (min-width: 768px) {
.p-products__category span {
font-size: 1.6rem;
}
}
.p-products__categories--construction .p-products__category {
padding: 0;
min-height: 64px;
min-height: 6.4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
@media screen and (max-width: 767px) {
.p-products__categories--construction .p-products__category {
width: calc(33.33333% - 0.8rem);
}
}
@media screen and (min-width: 768px) {
.p-products__categories--construction .p-products__category {
min-height: 8rem;
width: 100%;
}
}
.p-products__bridge {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-products__bridge {
margin-top: 6.4rem;
}
}
.p-products__coastal {
background-color: #EFEFEF;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-products__coastal {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-products__childBlock {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-products__childBlock {
margin-top: 6.4rem;
}
}
.p-products__childBlock:nth-of-type(n+2) {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-products__childBlock:nth-of-type(n+2) {
margin-top: 4.8rem;
}
}
.p-products__items {
margin-top: 24px;
margin-top: 2.4rem;
display: grid;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-products__items {
margin-top: 4.8rem;
grid-template-columns: repeat(2, 1fr);
gap: 2.4rem 3.2rem;
}
}
.p-products__coastal .p-record {
background-color: #FFF;
}
.p-products__theme {
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-products__theme {
font-size: 3.2rem;
text-align: center;
}
}
.p-products__description {
margin-top: 8px;
margin-top: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-products__description {
margin-top: 1.6rem;
text-align: center;
}
}
.p-post__container {
padding-top: 34px;
padding-top: 3.4rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-post__container {
padding-top: 7.75rem;
padding-bottom: 12rem;
}
}
.p-post__block:nth-of-type(n+2) {
margin-top: 32px;
margin-top: 3.2rem;
}
@media screen and (min-width: 768px) {
.p-post__block:nth-of-type(n+2) {
margin-top: 6.4rem;
}
}
.p-post__theme {
margin-top: 8px;
margin-top: 0.8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-weight: 500;
line-height: 1.25;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-post__theme {
font-size: 2.4rem;
}
}
.p-post__theme::before {
content: "";
display: block;
width: 6px;
width: 0.6rem;
background-color: #3E40A4;
}
@media screen and (min-width: 768px) {
.p-post__theme::before {
width: 0.8rem;
}
}
.p-post__title {
margin-top: 4px;
margin-top: 0.4rem;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-post__title {
margin-top: 0.8rem;
font-size: 3.6rem;
}
}
.p-post__imgs,
.p-post__img {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-post__imgs,
.p-post__img {
margin-top: 4.8rem;
}
}
.p-post__imgs {
display: grid;
gap: 16px;
gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-post__imgs {
grid-template-columns: repeat(2, 1fr);
}
}
.p-post__caption {
text-align: center;
font-size: 14px;
font-size: 1.4rem;
margin-top: 3px;
margin-top: 0.3rem;
}
.p-post__smallImg {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.p-post__smallImg img {
width: auto;
max-height: 220px;
max-height: 22rem;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-post__smallImg img {
max-height: 36rem;
}
}
.p-post__text {
margin-top: 24px;
margin-top: 2.4rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-post__text {
margin-top: 4.8rem;
}
}
.p-post__list {
margin-top: 23.5px;
margin-top: 2.35rem;
}
@media screen and (min-width: 768px) {
.p-post__list {
margin-top: 2.4rem;
}
}
.p-post__item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
@media screen and (min-width: 768px) {
.p-post__item {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
gap: 0 0.2rem;
}
}
.p-post__item:nth-of-type(n+2) {
margin-top: -1px;
}
@media screen and (min-width: 768px) {
.p-post__item:nth-of-type(n+2) {
margin-top: 0.2rem;
}
}
.p-post__itemTheme {
padding: 9px 8px;
padding: 0.9rem 0.8rem;
line-height: 1.25;
background-color: #3E40A4;
color: #FFF;
font-weight: 500;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-post__itemTheme {
width: 20rem;
-ms-flex-negative: 0;
flex-shrink: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 1rem 2.4rem;
font-size: 1.6rem;
}
}
.p-post__itemText {
padding: 8px;
padding: 0.8rem;
border: 1px solid #3E40A4;
margin-top: -1px;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-post__itemText {
margin: 0;
width: 100%;
padding: 0.9rem 2.4rem;
font-size: 1.6rem;
}
}
.p-post__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-post__link {
margin-top: 4.8rem;
}
}
.p-post__link a {
margin-inline: auto;
}
.p-post__other {
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-post__other {
padding-top: 12rem;
padding-bottom: 12rem;
}
}
.p-post__other--bg {
background-color: #EFEFEF;
}
.p-post__achievements {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-post__achievements {
margin-top: 4.8rem;
}
}
.p-post__achievement:nth-of-type(n+2) {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-post__achievement:nth-of-type(n+2) {
margin-top: 4rem;
}
}
.p-post__achievementList {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-post__achievementList {
margin-top: 2.4rem;
display: grid;
grid-template-columns: repeat(2, 1fr);
}
}
.p-post__achievementlink {
display: block;
color: #3E40A4;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 1.2rem;
-moz-column-gap: 1.2rem;
column-gap: 1.2rem;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
font-weight: 300;
}
@media screen and (min-width: 768px) {
.p-post__achievementlink {
font-size: 2rem;
text-underline-offset: 3.5px;
}
}
.p-post__achievementlink::before {
content: "";
display: block;
width: 12px;
width: 1.2rem;
height: 16px;
height: 1.6rem;
margin: 2.5px 0 0 2px;
margin: 0.25rem 0 0 0.2rem;
background-image: url(../images/icon/achievement-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-post__achievementlink::before {
width: 1.6rem;
height: 2.1rem;
margin-top: 0.35rem;
}
}
.p-post__achievementlink:nth-of-type(n+2) {
margin-top: 8px;
margin-top: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-post__achievementlink:nth-of-type(n+2) {
margin-top: 0;
}
}
@media screen and (min-width: 768px) {
.p-post__achievementlink:nth-of-type(n+3) {
margin-top: 0.8rem;
}
}
.p-record {
padding: 24px 16px;
padding: 2.4rem 1.6rem;
background-color: #EFEFEF;
}
@media screen and (min-width: 768px) {
.p-record {
padding-bottom: 6.7rem;
}
}
.p-record__theme {
background-color: #3E40A4;
padding: 4px 8px;
padding: 0.4rem 0.8rem;
color: #FFF;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
.p-record__body {
margin-top: 16px;
margin-top: 1.6rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 16px;
row-gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-record__body {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 1.6rem;
}
}
@media screen and (min-width: 768px) {
.p-record__img {
max-width: 24rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-record__img::before {
padding-top: 65.7142857143%;
}
@media screen and (min-width: 768px) {
.p-record__img::before {
padding-top: 75%;
}
}
@media screen and (min-width: 768px) {
.p-record__wrap {
margin-right: auto;
}
}
.p-record__title {
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
.p-record__text {
margin-top: 4px;
margin-top: 0.4rem;
font-size: 14px;
font-size: 1.4rem;
font-weight: 300;
line-height: 2;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
.p-record__link {
margin-top: 8px;
margin-top: 0.8rem;
display: block;
width: 160px;
width: 16rem;
background-color: #3E40A4;
color: #FFF;
font-size: 16px;
font-size: 1.6rem;
text-align: center;
padding: 4px;
padding: 0.4rem;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
.p-record__link:hover {
background-color: #222470;
}
.p-record__posts {
margin-top: 8px;
margin-top: 0.8rem;
}
.p-record__post {
display: block;
color: #3E40A4;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.2rem;
-moz-column-gap: 0.2rem;
column-gap: 0.2rem;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
font-weight: 300;
}
.p-record__post::before {
content: "";
display: block;
width: 11px;
width: 1.1rem;
height: 14px;
height: 1.4rem;
margin: 2px 0 0 2px;
margin: 0.2rem 0 0 0.2rem;
background-image: url(../images/icon/achievement-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
-ms-flex-negative: 0;
flex-shrink: 0;
}
.p-record__post:nth-of-type(n+2) {
margin-top: 8px;
margin-top: 0.8rem;
}
.p-related--bg {
background-color: #EFF5FB;
}
.p-related--reset .p-related--bg {
background-color: transparent;
}
.p-related__items {
margin-top: 24.5px;
margin-top: 2.45rem;
display: grid;
gap: 16px;
gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-related__items {
margin-top: 4.75rem;
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
}
.p-related__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-related__link {
margin-top: 4.8rem;
}
}
.p-relatedItem {
display: block;
}
.p-relatedItem__img {
overflow: hidden;
}
.p-relatedItem__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-relatedItem__img::before {
padding-top: 66.75%;
}
}
.p-relatedItem__img img {
top: 0;
left: 0;
-webkit-transform: none;
transform: none;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-relatedItem:hover .p-relatedItem__img img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-relatedItem__title {
margin-top: 8px;
margin-top: 0.8rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 0.8rem;
-moz-column-gap: 0.8rem;
column-gap: 0.8rem;
font-weight: 500;
line-height: 1.25;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-relatedItem__title {
font-size: 2.4rem;
}
}
.p-relatedItem__title::before {
content: "";
display: block;
width: 6px;
width: 0.6rem;
background-color: #3E40A4;
}
@media screen and (min-width: 768px) {
.p-relatedItem__title::before {
width: 0.8rem;
}
}
.p-side {
width: 100%;
}
@media screen and (min-width: 768px) {
.p-side {
max-width: 36rem;
}
}
.p-side__search {
background-color: #FFF;
padding: 8px 19px;
padding: 0.8rem 1.9rem;
font-weight: 500;
max-width: 560px;
max-width: 56rem;
margin-inline: auto;
font-size: 14px;
font-size: 1.4rem;
border-radius: 0.8rem;
}
.p-side__search--single {
background-color: #EFF5FB;
}
.p-side__search form {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.p-side__search input#s {
width: 100%;
}
.p-side__search input[type=submit] {
color: transparent;
width: 29px;
width: 2.9rem;
height: 24px;
height: 2.4rem;
background-image: url(../images/icon/search.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.p-side__block:nth-of-type(n+2) {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-side__block:nth-of-type(n+2) {
margin-top: 4rem;
}
}
.p-side__title {
border-radius: 0.8rem;
background-color: #4880E0;
padding: 9px 16px;
padding: 0.9rem 1.6rem;
color: #FFF;
font-weight: 500;
font-size: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
}
.p-side__categories {
margin: 24px 0 0 16px;
margin: 2.4rem 0 0 1.6rem;
}
.p-side__category {
display: block;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
letter-spacing: 0.1em;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
.p-side__category:hover {
opacity: 0.8;
}
.p-side__category:nth-of-type(n+2) {
margin-top: 8px;
margin-top: 0.8rem;
}
.p-side__ranking {
margin: 24px 16px 0;
margin: 2.4rem 1.6rem 0;
}
.p-side__item {
display: block;
}
.p-side__item:nth-of-type(n+2) {
margin-top: 15px;
margin-top: 1.5rem;
}
.p-side__time {
color: #aaa;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
}
.p-side__itemTitle {
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin-top: 2px;
margin-top: 0.2rem;
font-weight: 500;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.25;
letter-spacing: 0.1em;
}
.p-slide {
-webkit-box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
box-shadow: 0 0.4rem 0.4rem 0 rgba(0, 0, 0, .25);
display: block;
background-color: #FFF;
}
@media screen and (min-width: 768px) {
.p-slide {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-slide__img {
overflow: hidden;
}
@media screen and (min-width: 768px) {
.p-slide__img {
width: 50%;
}
}
.p-slide__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-slide__img::before {
padding-top: 74.0740740741%;
}
}
.p-slide__img img {
-webkit-transform: none;
transform: none;
top: 0;
left: 0;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
.p-slide:hover img {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.p-slide__body {
padding: 16px 8px 15.5px;
padding: 1.6rem 0.8rem 1.55rem;
}
@media screen and (min-width: 768px) {
.p-slide__body {
width: 50%;
padding: 4rem 4.3rem 4rem 3.7rem;
}
}
.p-slide__theme {
font-weight: 500;
line-height: 1.25;
font-size: 16px;
font-size: 1.6rem;
padding-bottom: 8px;
padding-bottom: 0.8rem;
border-bottom: 2px solid #3E40A4;
letter-spacing: 0.1em;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
@media screen and (min-width: 768px) {
.p-slide__theme {
font-size: 2rem;
}
}
.p-slide__title {
margin-top: 16px;
margin-top: 1.6rem;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
color: #3E40A4;
font-size: 20px;
font-size: 2rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-slide__title {
margin-top: 4.75rem;
font-size: 2.4rem;
}
}
.p-slide__text {
margin-top: 8.5px;
margin-top: 0.85rem;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 6;
font-weight: 300;
font-size: 14px;
font-size: 1.4rem;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-slide__text {
margin-top: 1.65rem;
font-size: 1.6rem;
}
}
.p-topAbout__news {
color: #3E40A4;
text-align: center;
font-weight: 500;
font-size: 19px;
font-size: 1.9rem;
line-height: 1.35;
background: #F5F5F5;
padding-block: 36px;
padding-block: 3.6rem;
}
@media screen and (min-width: 768px) {
.p-topAbout__news {
padding-block: 4rem;
font-size: 4rem;
}
}
.p-topAbout__news.u-fadein {
-webkit-transform: translateY(1.3rem);
transform: translateY(1.3rem);
}
@media screen and (min-width: 768px) {
.p-topAbout__news.u-fadein {
-webkit-transform: translateY(-1rem);
transform: translateY(-1rem);
}
}
.p-topAbout__news.u-fadein.active {
-webkit-transform: translateY(-2.3rem);
transform: translateY(-2.3rem);
}
@media screen and (min-width: 768px) {
.p-topAbout__news.u-fadein.active {
-webkit-transform: translateY(-4rem);
transform: translateY(-4rem);
}
}
.p-topAbout__contents {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topAbout__contents {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 8.9rem;
}
}
.p-topAbout__heading {
-ms-flex-negative: 0;
flex-shrink: 0;
}
@media screen and (min-width: 768px) {
.p-topAbout__wrap {
margin-top: -0.1rem;
}
}
.p-topAbout__theme {
font-size: 20px;
font-size: 2rem;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topAbout__theme {
font-size: 2.4rem;
}
}
.p-topAbout__text {
margin-top: 8px;
margin-top: 0.8rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topAbout__text {
margin-top: 1.65rem;
}
}
.p-topAbout__link {
margin-top: 8px;
margin-top: 0.8rem;
}
@media screen and (min-width: 768px) {
.p-topAbout__link {
margin-top: 0.5rem;
}
}
.p-topAbout__bg {
position: relative;
margin-top: 24px;
margin-top: 2.4rem;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-topAbout__bg {
margin-top: 4.8rem;
}
}
.p-topAbout__bg::before,
.p-topAbout__bg::after {
content: "";
display: block;
height: 71.7333333333vw;
}
@media screen and (min-width: 768px) {
.p-topAbout__bg::before,
.p-topAbout__bg::after {
height: 64rem;
}
}
.p-topAbout__bg::before {
width: calc(100% - 1.6rem);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-topAbout__bg::before {
width: 88.8888888889vw;
}
}
.p-topAbout__bg::after {
position: absolute;
right: 0;
bottom: -16px;
bottom: -1.6rem;
z-index: -1;
background-color: #EFEFEF;
width: 100%;
}
@media screen and (min-width: 768px) {
.p-topAbout__bg::after {
bottom: -4rem;
}
}
.p-topBlog__items {
margin-top: 21.5px;
margin-top: 2.15rem;
display: grid;
gap: 16px;
gap: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-topBlog__items {
margin-top: 4.15rem;
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
}
.p-topBlog__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topBlog__link {
margin-top: 4.8rem;
}
}
.p-topHowto {
background-image: url(../images/common/bg-howto.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: relative;
}
.p-topHowto::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
background: rgba(255, 255, 255, .9);
width: 100%;
height: 100%;
}
.p-topHowto__container {
position: relative;
z-index: 1;
}
.swiper.p-topHowto__swiper {
margin-top: 24px;
margin-top: 2.4rem;
padding: 0 16px 47.5px;
padding: 0 1.6rem 4.75rem;
margin-inline: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.swiper.p-topHowto__swiper {
margin-top: 4.7rem;
padding: 0 0 5.9rem;
max-width: none;
}
}
.swiper.p-post__swiper {
margin-top: 24px;
margin-top: 2.4rem;
padding: 0 16px 27.5px;
padding: 0 1.6rem 2.75rem;
margin-inline: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.swiper.p-post__swiper {
margin-top: 4.7rem;
padding: 0 0 3.9rem;
max-width: none;
}
}
.p-topHowto__link {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-topHowto__link {
margin-top: 3rem;
}
}
.p-topHowto__link a {
margin-inline: auto;
}
.p-topInformation {
background-image: url(../images/common/bg-information.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
position: relative;
}
.p-topInformation::before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
background: rgba(255, 255, 255, .9);
width: 100%;
height: 100%;
}
.p-topInformation__container {
position: relative;
z-index: 1;
}
.p-topInformation__items {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-topInformation__items {
margin-top: 3.2rem;
}
}
.p-topInformation__link {
margin-top: 23px;
margin-top: 2.3rem;
}
@media screen and (min-width: 768px) {
.p-topInformation__link {
margin-top: 4rem;
}
}
.swiper.p-topInterview__swiper {
margin-top: 21.5px;
margin-top: 2.15rem;
overflow: hidden;
padding-bottom: 23px;
padding-bottom: 2.3rem;
}
@media screen and (min-width: 768px) {
.swiper.p-topInterview__swiper {
margin-top: 4.15rem;
}
}
.p-topInterview__theme {
margin-top: 21px;
margin-top: 2.1rem;
padding-right: 2px;
padding-right: 0.2rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topInterview__theme {
margin-top: 2.5rem;
}
}
.p-topInterview__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topInterview__link {
margin-top: 4.75rem;
}
}
.p-topPerson {
background-color: #EFF5FB;
}
.p-topPerson__items {
margin-top: 21.5px;
margin-top: 2.15rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 15px;
gap: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-topPerson__items {
margin-top: 4.15rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
gap: 0 2rem;
}
}
.p-topPerson__theme {
margin-top: 24px;
margin-top: 2.4rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topPerson__theme {
margin-top: 4.8rem;
}
}
.p-topPerson__wrap {
margin-top: 12px;
margin-top: 1.2rem;
display: grid;
row-gap: 30px;
row-gap: 3rem;
}
@media screen and (min-width: 768px) {
.p-topPerson__wrap {
margin-top: 2.4rem;
grid-template-columns: repeat(2, 1fr);
-webkit-column-gap: 4rem;
-moz-column-gap: 4rem;
column-gap: 4rem;
}
}
.p-topPerson__text {
white-space: pre-wrap;
}
.p-topPerson__video {
position: relative;
padding-bottom: 56.25%;
overflow: hidden;
max-width: 100%;
height: auto;
}
.p-topPerson__video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.p-topPerson__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topPerson__link {
margin-top: 4.8rem;
}
}
.p-topResearch {
background-color: #EFF5FB;
}
.p-topResearch__items {
margin-top: 21.5px;
margin-top: 2.15rem;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 15px;
gap: 1.5rem;
}
@media screen and (min-width: 768px) {
.p-topResearch__items {
margin-top: 4.15rem;
grid-template-columns: repeat(4, 1fr);
gap: 1.6rem;
}
}
.p-topResearch__item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
border: 2px solid #4880E0;
background-color: #FFF;
border-radius: 1.6rem;
cursor: pointer;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
position: relative;
}
@media screen and (min-width: 768px) {
.p-topResearch__item {
font-size: 2rem;
}
}
.p-topResearch__item::before {
content: "";
display: block;
padding-top: 100%;
}
@media screen and (min-width: 768px) {
.p-topResearch__item::before {
padding-top: 51.2987012987%;
}
}
.p-topResearch__item::after {
content: "";
display: block;
position: absolute;
width: 24px;
width: 2.4rem;
height: 24px;
height: 2.4rem;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 16px;
bottom: 1.6rem;
background-image: url(../images/icon/circle-arrow.svg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
-webkit-transition: -webkit-transform 0.3s ease-out;
transition: -webkit-transform 0.3s ease-out;
transition: transform 0.3s ease-out;
transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-topResearch__item::after {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
bottom: auto;
left: auto;
right: 1.6rem;
}
}
.p-topResearch__item:hover::after {
-webkit-transform: translateX(calc(-50% + 0.3rem));
transform: translateX(calc(-50% + 0.3rem));
}
@media screen and (min-width: 768px) {
.p-topResearch__item:hover::after {
-webkit-transform: translate(0.3rem, -50%);
transform: translate(0.3rem, -50%);
}
}
.p-topResearch__itemText {
color: #4880E0;
font-weight: 500;
font-size: min(4.2666666667vw, 22px);
font-size: min(4.2666666667vw, 2.2rem);
line-height: 1.25;
letter-spacing: 0.1em;
width: 100%;
text-align: center;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topResearch__itemText {
font-size: 2rem;
}
}
.p-topResearch__itemTheme {
font-size: 14px;
font-size: 1.4rem;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
font-weight: 500;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topResearch__itemTheme {
font-size: 1.6rem;
}
}
.p-topResearch__itemDescription {
font-size: min(3.2vw, 16px);
font-size: min(3.2vw, 1.6rem);
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.1em;
white-space: pre-wrap;
text-align: left;
}
@media screen and (min-width: 768px) {
.p-topResearch__itemDescription {
font-size: 1.4rem;
}
}
.p-topResearch__theme {
margin-top: 24px;
margin-top: 2.4rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topResearch__theme {
margin-top: 4.8rem;
}
}
.p-topResearch__text {
margin-top: 12px;
margin-top: 1.2rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topResearch__text {
margin-top: 2.4rem;
}
}
.p-topResearch__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topResearch__link {
margin-top: 4.8rem;
}
}
.p-topTalk__container {
margin-top: 21.5px;
margin-top: 2.15rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 24px;
row-gap: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topTalk__container {
margin-top: 4.15rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
@media screen and (min-width: 768px) {
.p-topTalk__img {
max-width: 64rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-topTalk__img::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-topTalk__img::before {
padding-top: 66.71875%;
}
}
.p-topTalk__img img {
border-radius: 1.6rem;
}
.p-topTalk__speechBubbles {
display: grid;
row-gap: 8px;
row-gap: 0.8rem;
width: 100%;
}
@media screen and (min-width: 768px) {
.p-topTalk__speechBubbles {
margin-top: 0.6rem;
}
}
.p-topTalk__word {
position: relative;
width: 100%;
max-width: 85.3333333333vw;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topTalk__word {
max-width: 48rem;
}
}
.p-topTalk__word::before {
content: "";
display: block;
padding-top: 20.415625%;
}
@media screen and (min-width: 768px) {
.p-topTalk__word::before {
padding-top: 20.4166666667%;
}
}
.p-topTalk__word:nth-child(odd) {
background-image: url(../images/common/speech-bubble-left.svg);
}
.p-topTalk__word:nth-child(even) {
background-image: url(../images/common/speech-bubble-right.svg);
margin-left: auto;
}
.p-topTalk__word p {
position: absolute;
width: 100%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
top: 25%;
text-align: center;
color: #4880E0;
font-size: min(3.7333333333vw, 23px);
font-size: min(3.7333333333vw, 2.3rem);
font-weight: 500;
letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
.p-topTalk__word p {
font-size: 2rem;
}
}
.p-topTalk__wrap {
margin-top: 15.5px;
margin-top: 1.55rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
row-gap: 12px;
row-gap: 1.2rem;
}
@media screen and (min-width: 768px) {
.p-topTalk__wrap {
margin-top: 4.5rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
gap: 0 2.05rem;
}
}
.p-topTalk__theme {
text-align: center;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topTalk__theme {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
-ms-flex-negative: 0;
flex-shrink: 0;
text-align: left;
}
}
.p-topTalk__text {
white-space: pre-wrap;
}
.p-topTalk__link {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-topTalk__link {
margin-top: 4.8rem;
}
}
.p-wrapper__container {
width: 100%;
max-width: 100vw;
margin-inline: auto;
}
@media screen and (min-width: 768px) {
.p-wrapper__container {
max-width: 144rem;
}
}
.p-wrapper__section {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
row-gap: 24px;
row-gap: 2.4rem;
width: 100%;
padding: 0 16px;
margin-inline: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.p-wrapper__section {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0 8rem;
padding-left: 0;
padding-right: 25px;
max-width: none;
}
}
.p-wrapper__section:nth-of-type(2) {
margin-top: 60px;
margin-top: 6rem;
}
@media screen and (min-width: 768px) {
.p-wrapper__section:nth-of-type(2) {
margin-top: 12rem;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
padding-right: 0;
padding-left: 25px;
}
}
@media screen and (min-width: 768px) {
.p-wrapper__contents {
width: 100%;
max-width: 48rem;
}
}
.p-wrapper__items {
margin-top: 22px;
margin-top: 2.2rem;
counter-reset: number 0;
}
@media screen and (min-width: 768px) {
.p-wrapper__items {
margin-top: 4.5rem;
}
}
.p-wrapper__section:nth-of-type(2) .p-wrapper__items {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-wrapper__section:nth-of-type(2) .p-wrapper__items {
margin-top: 4.8rem;
}
}
.p-wrapper__item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-column-gap: 0.85rem;
-moz-column-gap: 0.85rem;
column-gap: 0.85rem;
font-size: 16px;
font-size: 1.6rem;
padding: 0 0 0.5px 12.5px;
padding: 0 0 0.05rem 1.25rem;
border-bottom: 1px solid #3E40A4;
position: relative;
line-height: 1.25;
letter-spacing: 0.1em;
-webkit-transition: opacity 0.3s ease-out;
transition: opacity 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-wrapper__item {
font-size: 2rem;
padding: 0 0 0.55rem 2.4rem;
}
}
.p-wrapper__item:hover {
opacity: 0.7;
}
.p-wrapper__section:nth-of-type(2) .p-wrapper__item {
padding-bottom: 3.5px;
padding-bottom: 0.35rem;
}
@media screen and (min-width: 768px) {
.p-wrapper__section:nth-of-type(2) .p-wrapper__item {
padding-bottom: 0.75rem;
}
}
.p-wrapper__item:nth-of-type(n+2) {
margin-top: 5.5px;
margin-top: 0.55rem;
}
@media screen and (min-width: 768px) {
.p-wrapper__item:nth-of-type(n+2) {
margin-top: 1.25rem;
}
}
.p-wrapper__section:nth-of-type(2) .p-wrapper__item:nth-of-type(n+2) {
margin-top: 7.5px;
margin-top: 0.75rem;
}
@media screen and (min-width: 768px) {
.p-wrapper__section:nth-of-type(2) .p-wrapper__item:nth-of-type(n+2) {
margin-top: 1.55rem;
}
}
.p-wrapper__item span::before {
display: block;
counter-increment: number 1;
content: "0" counter(number);
font-size: 20px;
font-size: 2rem;
color: #3E40A4;
letter-spacing: 0;
}
@media screen and (min-width: 768px) {
.p-wrapper__item span::before {
font-size: 2.4rem;
}
}
.p-wrapper__item::before {
content: "";
display: block;
width: 1px;
height: 16px;
height: 1.6rem;
position: absolute;
left: 0;
bottom: 0;
background-color: #3E40A4;
}
@media screen and (min-width: 768px) {
.p-wrapper__item::before {
height: 2.4rem;
}
}
.p-wrapper__item::after {
content: "";
display: block;
width: 1px;
height: 7px;
height: 0.7rem;
position: absolute;
right: 0;
bottom: 0;
background-color: #3E40A4;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: bottom right;
transform-origin: bottom right;
}
@media screen and (min-width: 768px) {
.p-wrapper__item::after {
height: 1rem;
}
}
.p-wrapper__link {
margin-top: 23.5px;
margin-top: 2.35rem;
}
@media screen and (min-width: 768px) {
.p-wrapper__link {
margin-top: 4.75rem;
}
}
.p-wrapper__imgs {
margin: 0 calc(50% - 50vw);
width: 100vw;
}
@media screen and (min-width: 768px) {
.p-wrapper__imgs {
margin: 0;
width: 100%;
max-width: 72rem;
-ms-flex-negative: 0;
flex-shrink: 0;
}
}
.p-wrapper__img {
max-width: 85.3333333333vw;
}
@media screen and (min-width: 768px) {
.p-wrapper__img {
max-width: 64rem;
}
}
.p-wrapper__section:nth-of-type(2) .p-wrapper__img {
margin-left: auto;
}
.p-wrapper__img::before {
padding-top: 75%;
}
@media screen and (min-width: 768px) {
.p-wrapper__img::before {
padding-top: 75%;
}
}
.p-wrapper__smallImg {
z-index: 1;
max-width: 42.6666666667vw;
margin-left: auto;
margin-top: -25.6vw;
}
@media screen and (min-width: 768px) {
.p-wrapper__smallImg {
max-width: 32rem;
margin-top: -16rem;
}
}
.p-wrapper__section:nth-of-type(2) .p-wrapper__smallImg {
margin-left: 0;
}
.p-wrapper__smallImg::before {
padding-top: 75%;
}
@media screen and (min-width: 768px) {
.p-wrapper__smallImg::before {
padding-top: 75%;
}
}
.u-desktop {
display: none;
}
@media screen and (min-width: 768px) {
.u-desktop {
display: block;
}
}
.u-fadein {
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(3rem);
transform: translateY(3rem);
-webkit-transition: opacity 1s, -webkit-transform 1s;
transition: opacity 1s, -webkit-transform 1s;
transition: opacity 1s, transform 1s;
transition: opacity 1s, transform 1s, -webkit-transform 1s;
}
.u-fadein.active {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
transform: translateY(0);
}
@media screen and (min-width: 768px) {
.u-mobile {
display: none;
}
}
.u-nowrap {
white-space: nowrap;
}
/*# sourceMappingURL=styles.css.map */