File "styles-copy.css"
Full path: /home/xs854402/smcse.co.jp/public_html/test.smcse.co.jp/wp-content/themes/Sumitomo-Mitsui/css/styles-copy.css
File
size: 181.21 B (181.21 KB bytes)
MIME-type: text/plain
Charset: utf-8
Download Open Edit Advanced Editor Back
@charset "UTF-8";
/* リキッドレイアウト対応 */
body {
font-family: "noto-sans-cjk-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;
}
}
.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;
}
}
.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;
}
.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-topHowto .swiper-horizontal > .swiper-pagination-bullets,
.p-topHowto .swiper-pagination-bullets.swiper-pagination-horizontal,
.p-topHowto .swiper-pagination-custom,
.p-topHowto .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;
}
@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-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-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;
}
@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 {
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 {
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;
}
.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__headingImg {
margin-top: 24px;
margin-top: 2.4rem;
}
@media screen and (min-width: 768px) {
.p-business__headingImg {
margin-top: 4.8rem;
max-width: 80rem;
margin-inline: auto;
}
}
.p-business__headingImg::before {
padding-top: 83.0903790087%;
}
@media screen and (min-width: 768px) {
.p-business__headingImg::before {
padding-top: 83%;
}
}
.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 {
background-color: #EFEFEF;
}
.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::before {
padding-top: 42.1428571429%;
}
@media screen and (min-width: 768px) {
.p-career__trainingImg::before {
padding-top: 42.03125%;
}
}
.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 {
border-radius: 1.6rem;
position: relative;
padding-top: 100%;
-webkit-transition: background-color 0.3s ease-out;
transition: background-color 0.3s ease-out;
}
@media screen and (min-width: 768px) {
.p-career__systemItem {
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 {
width: calc(100% - 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;
}
@media screen and (min-width: 768px) {
.p-career__systemItemBlock {
width: calc(100% - 3.2rem);
}
}
.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;
}
}
.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: 240px;
max-width: 24rem;
margin-inline: auto;
}
.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 {
margin-top: 16px;
margin-top: 1.6rem;
}
@media screen and (min-width: 768px) {
.p-child__policyContents .p-child__policyText {
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-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__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::before {
padding-top: 66.7638483965%;
}
@media screen and (min-width: 768px) {
.p-company__blockImg::before {
padding-top: 66.75%;
}
}
.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__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__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-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 (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__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 {
margin: -0.15rem 0 0 auto;
width: 100%;
max-width: 60.3rem;
-ms-flex-negative: 0;
flex-shrink: 0;
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;
}
}
.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;
}
.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-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__main {
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);
}
}
@media screen and (min-width: 768px) {
.p-fv__imgs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.p-fv__sub {
position: relative;
}
@media screen and (min-width: 768px) {
.p-fv__sub {
width: 0.3333333333;
}
}
.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;
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-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;
}
@media screen and (min-width: 768px) {
.p-header--corporate .p-header__logo::after {
width: 16.6rem;
right: -17.4rem;
}
}
.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;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__heading {
padding-top: 8.55rem;
padding-bottom: 12rem;
}
}
@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 {
background-color: #EFF5FB;
padding-top: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__program {
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: 60px;
padding-top: 6rem;
padding-bottom: 60px;
padding-bottom: 6rem;
}
@media screen and (min-width: 768px) {
.p-internship__recruiting {
padding-top: 11.95rem;
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;
}
@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__info--cross {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-column-gap: 3.9rem;
-moz-column-gap: 3.9rem;
column-gap: 3.9rem;
}
@media screen and (min-width: 768px) {
.p-interview__info--cross {
-webkit-column-gap: 7rem;
-moz-column-gap: 7rem;
column-gap: 7rem;
}
}
.p-interview__infoBlock:nth-of-type(2) {
position: relative;
}
.p-interview__infoBlock:nth-of-type(2)::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%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: -32px;
left: -3.2rem;
}
@media screen and (min-width: 768px) {
.p-interview__infoBlock:nth-of-type(2)::before {
width: 4rem;
height: 4rem;
left: -5.6rem;
}
}
.p-interview__position {
color: #888;
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__position {
font-size: 2rem;
}
}
@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: 20px;
font-size: 2rem;
letter-spacing: 0.1em;
line-height: 1.25;
}
@media screen and (min-width: 768px) {
.p-interview__name {
font-size: 3.2rem;
}
}
.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;
}
.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-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__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--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;
}
}
@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-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-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 {
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__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: -webkit-box;
display: -ms-flexbox;
display: flex;
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__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-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;
}
@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;
}
@media screen and (min-width: 768px) {
.p-slide__text {
margin-top: 1.65rem;
font-size: 1.6rem;
}
}
.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;
}
@media screen and (min-width: 768px) {
.p-topAbout__theme {
font-size: 2.4rem;
}
}
.p-topAbout__text {
margin-top: 8px;
margin-top: 0.8rem;
}
@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-image: url(../images/common/);
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-image: url(../images/common/bg-about-sp.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
@media screen and (min-width: 768px) {
.p-topAbout__bg::before {
width: 88.8888888889vw;
background-image: url(../images/common/bg-about.jpg);
}
}
.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 {
background-color: #EFF5FB;
}
.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 27.5px;
padding: 0 1.6rem 2.75rem;
margin-inline: auto;
max-width: 592px;
}
@media screen and (min-width: 768px) {
.swiper.p-topHowto__swiper {
margin-top: 4.7rem;
padding: 0 0 3.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: 20.5px;
margin-top: 2.05rem;
}
@media screen and (min-width: 768px) {
.p-topHowto__link {
margin-top: 4.45rem;
}
}
.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__text {
margin-top: 12px;
margin-top: 1.2rem;
white-space: pre-wrap;
}
@media screen and (min-width: 768px) {
.p-topPerson__text {
margin-top: 2.4rem;
}
}
.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__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 {
position: relative;
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;
}
@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__itemText {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
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__item:hover {
background-color: #4880E0;
}
.p-topResearch__item:hover .p-topResearch__itemBlock {
opacity: 1;
z-index: 1;
}
.p-topResearch__itemBlock {
width: calc(100% - 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;
}
@media screen and (min-width: 768px) {
.p-topResearch__itemBlock {
width: calc(100% - 3.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;
}
@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 {
font-size: 20px;
font-size: 2rem;
color: #3E40A4;
letter-spacing: 0;
}
@media screen and (min-width: 768px) {
.p-wrapper__item span {
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: translateX(0);
transform: translateX(0);
}
@media screen and (min-width: 768px) {
.u-mobile {
display: none;
}
}
.u-nowrap {
white-space: nowrap;
}
/*# sourceMappingURL=styles.css.map */