:root {
    --theme-color-main: #0A5A96;
    --theme-color-sub:#F5CF37;
    --bgcolor:#FCFCFC;
    --enviroment-padding-left: 17%;
}

.section-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 5em;
}
@media screen and (max-width: 768px) {
    .section-inner {
        padding: 2em;
    }
}

.sp{display:none;}
.pc{display:block;}
@media screen and (max-width: 768px) {
    .sp{display:block;}
    .pc{display:none;}
}


/* googleフォント */
body {
    font-family:"Noto Sans JP";
    font-optical-sizing: auto;
    font-style: normal;
    overflow-x: hidden; /* 20250314 */
}

.inter {
    font-family:"Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}
.oswald {
    font-family: "Oswald", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
}
.oswald.italic {
    font-style:italic;
}
.roboto {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
    font-variation-settings:
    "wdth" 100;
}

/* ラベル */
section.concept .label {
    margin-bottom: 2em;
    text-align: center;
    line-height: 1;
    font-weight: bold;
}

/* section.concept .label h3 {
    font-size: 88px;
    margin-top: -0.875em;
} */
section.concept .label h3 {
    font-size: 88px;
    margin-top: -1.275em;
}

section.concept .label p {
    font-size: 210px;
    color: var(--theme-color-main);
    opacity: 0.12;
    font-weight: 900;
}
@media screen and (max-width: 1200px) {
    section.concept .label {
        margin-left:-80px;
        margin-right:-80px;
    }
    section.concept .label h3 {
        font-size: 6.5vw;
    }
    section.concept .label p {
        font-size: 16vw;
    }
}
@media screen and (max-width: 768px) {
    section.concept .label {
        margin-left:unset;
        margin-right:unset;
    }
}

section:not(.concept) .label {
    margin-bottom: 2em;
}

section:not(.concept) .label h3 {
    font-size: 5em;
    font-weight: 900;
    color: #0A5A96;
    margin-bottom: 8px;
}

section:not(.concept) .label p {
    font-size: 18px;
    font-weight: bold;
}
@media screen and (max-width: 768px) {
    section:not(.concept) .label {
        font-size: 0.75rem;
    }
    section:not(.concept) .label h3 {
        font-size: 11vw;
    }
}

/* サブラベル */
.label-sub{
    border-left: 0.25em solid #000;
    padding-left: 1em;
    margin-bottom:2em;
}
.label-sub span{
    color:#222;
}
.label-sub h4,
.label-sub div{
    font-size:2.5em;
    font-weight:bold;
    line-height:1.25;
}
@media screen and (max-width: 768px) {
    .label-sub h4,
    .label-sub div{
        font-size:1.5em;
        font-weight:bold;
        line-height:1.25;
    }
}


/* ボタン */
.button {
    display: inline-block;
    padding: 1em 3em;
    border-radius: 100px;
    position: relative;
    text-align:center;
}
section .button{
    background-color: var(--theme-color-sub);
    color:#000;
    font-weight: 600;
    box-shadow: 0 2px 4px #00000044;
}
section .button-arrow{width:280px;}
.button-arrow::after {
    content: "→";
    position: absolute;
    transform: translate(0, -50%);
    top: 50%;
    right: 16px;
}

@media screen and (max-width: 768px) {
    .button {
        padding: 1em 2em;
    }
    section .button-arrow {
        width: 100%;
    }
}

/* ヒーローセクション */
.hero {
    margin-top:80px;
    height: calc(100svh - 80px);
    width: 100%;
    background-size: cover;
    background-position: center;
    position: relative;
}
.hero .career{
    position: relative;
    max-width:1280px;
    height: 100%;
    padding:0 5em;
    margin:0 auto;
}
.hero .career > div{
    position: absolute;
    bottom: 8em;
}
.hero .career > div p{
    display: inline-block;
    padding:1rem 2rem;
    background-color:#ffffffee;
    font-weight: 800;
}
.hero .career > div div:nth-child(1) p{
    font-size: 1.5em;
    margin-bottom:1rem;
}
.hero .career > div div:nth-child(2) p{
    font-size: 5em;
}
.hero .rise{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(22%, -45%);
    text-align: right;
    font-style: italic;
}
.hero .rise div:nth-child(1){
    font-size: 1.5vw;
}
.hero .rise div:nth-child(2){
    font-size: 6.5vw;
    font-weight: bold;
    color:var(--theme-color-main);
}
.hero .rise div:nth-child(2) span{
    color:var(--theme-color-sub);
}

@media screen and (max-width: 768px) {
    .hero {
        height: 320px;
        width: 100%;
        background-size: cover;
        background-position: center;
        position: relative;
        margin-top:70px;
    }
    .hero .career > div {
        bottom: 2em;
    }
    .hero .career > div div:nth-child(1) p{
        font-size: 3vw;
    }
    .hero .career > div div:nth-child(2) p{
        font-size: 6vw;
    }
    .hero .career{
        padding:0 2em;
    }
    .hero .career > div p{
        padding:0.5em 1em;
    }
    .hero .rise div:nth-child(1) {
        font-size: 3vw;
    }
    .hero .rise div:nth-child(2) {
        font-size: 8vw;
    }
}
/* レスポンシブ：横幅360px以下 */
@media screen and (max-width: 360px) {
    .hero {
        margin-top:60px;
    }
}

/* contents */
.contents p {
    line-height: 1.75;
    margin-bottom: 36px;
}