html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: rgba(0, 0, 0, 0)
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 1.5
}

@media screen and (min-width: 750px) {
    html {
        font-size: 10px
    }
}

@media screen and (max-width: 749px) {
    html {
        font-size: clamp(1px, 2.5641025641vw, 12px)
    }
}

body {
    width: 100%;
    overflow-x: hidden;
    background: #fff;
    font-family: "Noto Sans JP", YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", sans-serif;
    color: #000;
    letter-spacing: .02em
}

@media screen and (min-width: 750px) {
    body {
        font-size: 1.6rem
    }
}

@media screen and (max-width: 749px) {
    body {
        font-size: 1.4rem
    }
}

main {
    display: block
}

li {
    list-style-type: none
}

a {
    text-decoration: none;
    color: inherit
}

@media screen and (min-width: 750px) {
    a {
        -webkit-transition: all .3s;
        transition: all .3s
    }

    a::before,
    a::after {
        -webkit-transition: all .3s;
        transition: all .3s
    }
}

img {
    vertical-align: bottom;
    max-width: 100%;
    height: auto
}

svg {
    width: 100%;
    height: auto
}

sup {
    font-size: .5em;
    vertical-align: super
}

input,
button,
textarea,
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%
}

address {
    font-style: normal
}

@media screen and (min-width: 1024px) {

    .visible-md,
    .visible-sm {
        display: none
    }

    .visible-lg {
        display: inherit
    }
}

@media screen and (min-width: 750px)and (max-width: 1023px) {

    .visible-lg,
    .visible-sm {
        display: none
    }

    .visible-md {
        display: inherit
    }
}

@media screen and (max-width: 749px) {

    .visible-lg,
    .visible-md {
        display: none
    }

    .visible-sm {
        display: inherit
    }
}

@media screen and (min-width: 750px) {
    .zoom:hover .zoomContent {
        -webkit-transform: scale(1.1);
        transform: scale(1.1)
    }
}

.zoomRel {
    position: relative;
    overflow: hidden
}

.zoomContent {
    -webkit-transition: all .3s;
    transition: all .3s
}

.bg-gray {
    background: #f7f7f7
}

body.is-active {
    overflow: hidden
}

@media screen and (min-width: 1441px) {
    .l-main {
        padding-top: 16.2rem
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .l-main {
        padding-top: 12rem
    }
}

@media screen and (max-width: 749px) {
    .l-main {
        padding-top: 9rem
    }
}

@media screen and (min-width: 1441px) {
    .l-inner {
        max-width: 1400px
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .l-inner {
        max-width: 1126px
    }
}

@media screen and (min-width: 750px) {
    .l-inner {
        width: 85%;
        margin: 0 auto
    }
}

@media screen and (max-width: 749px) {
    .l-inner {
        padding: 0 2rem
    }
}

@media screen and (min-width: 750px) {
    .l-inner .-maxNone {
        max-width: none
    }
}

@media screen and (min-width: 1441px) {
    .l-inner-sm {
        max-width: 1400px
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .l-inner-sm {
        max-width: 958px
    }
}

@media screen and (min-width: 750px) {
    .l-inner-sm {
        width: 85%;
        margin: 0 auto
    }
}

@media screen and (max-width: 749px) {
    .l-inner-sm {
        padding: 0 2rem
    }
}

@media screen and (min-width: 1441px) {
    .l-inner-xs {
        max-width: 1400px
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .l-inner-xs {
        max-width: 888px
    }
}

@media screen and (min-width: 750px) {
    .l-inner-xs {
        width: 85%;
        margin: 0 auto
    }
}

@media screen and (max-width: 749px) {
    .l-inner-xs {
        padding: 0 2rem
    }
}

@media screen and (min-width: 1441px) {
    .l-inner-xxs {
        max-width: 1400px
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .l-inner-xxs {
        max-width: 790px
    }
}

@media screen and (min-width: 750px) {
    .l-inner-xxs {
        width: 85%;
        margin: 0 auto
    }
}

@media screen and (max-width: 749px) {
    .l-inner-xxs {
        padding: 0 2rem
    }
}

@media screen and (min-width: 1441px) {
    .l-column {
        max-width: 1400px
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .l-column {
        max-width: 1100px
    }
}

@media screen and (min-width: 1024px) {
    .l-column {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media screen and (min-width: 750px) {
    .l-column {
        width: 90%;
        margin: 0 auto;
        padding: 4rem 0 8rem
    }
}

@media screen and (max-width: 749px) {
    .l-column {
        padding: 1rem 2rem 4rem
    }
}

@media screen and (min-width: 1024px) {
    .l-content {
        width: 70.9090909091%
    }
}

@media screen and (min-width: 1024px) {
    .l-side {
        width: 24.5454545455%
    }
}

@media screen and (max-width: 1023px) {
    .l-side {
        margin-top: 4rem;
        padding-top: 4rem;
        border-top: 1px solid #707070
    }
}

@media screen and (max-width: 749px) {
    .l-single {
        padding-top: 0
    }
}

.btn {
    position: relative;
    width: 100%;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 1em 3em;
    text-align: center;
    text-transform: uppercase;
    font-family: "Open Sans", sans-serif
}

@media screen and (min-width: 750px) {
    .btn {
        width: 20.5rem;
        min-width: 20.5rem;
        min-height: 6.4rem;
        font-size: clamp(1.2rem, 1.0248901903vw, 1.6rem)
    }
}

@media screen and (max-width: 749px) {
    .btn {
        height: 6.5rem;
        margin: 0 auto
    }
}

.btn::after {
    position: absolute;
    top: 50%;
    font-family: "3scapital" !important;
    font-weight: normal;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: all 0s;
    transition: all 0s
}

.btn.-arrow::after {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    content: "";
    right: 1em;
    width: 2.3333333333em;
    height: 2.3333333333em;
    border: 1px solid;
    border-radius: 50%;
    font-size: .6666666667em
}

.btn.-blank::after {
    content: "";
    right: .6em;
    font-size: 1.3em
}

.btn.-pdf::after {
    content: "";
    right: .8em;
    font-size: 1.3em
}

.btn.-white {
    color: #000;
    border: 2px solid #fff;
    background: #fff
}

@media screen and (min-width: 750px) {
    .btn.-white:hover {
        color: #000
    }
}

.btn.-black {
    color: #fff;
    border: 2px solid #000;
    background: #000
}

@media screen and (min-width: 750px) {
    .btn.-black:hover {
        background: #fff;
        color: #000
    }
}

.btn.-line {
    color: #fff;
    border: 1px solid #fff
}

@media screen and (min-width: 750px) {
    .btn.-line:hover {
        color: #000;
        background: #fff
    }
}

.btn.-lineBlack {
    color: #000;
    border: 1px solid #000;
    background: #fff
}

@media screen and (min-width: 750px) {
    .btn.-lineBlack:hover {
        color: #fff;
        background: #000
    }
}

@media screen and (max-width: 1199px) {
    .ham {
        position: relative;
        z-index: 10;
        cursor: pointer;
        -webkit-transition: all .3s;
        transition: all .3s
    }
}

@media screen and (min-width: 750px)and (max-width: 1199px) {
    .ham {
        width: 8rem;
        height: 8rem;
        left: 0
    }
}

@media screen and (max-width: 749px) {
    .ham {
        width: 5rem;
        height: 5rem;
        right: 0
    }
}

@media screen and (max-width: 1199px) {
    .ham__item {
        position: absolute;
        height: 2px;
        background: #000;
        -webkit-transition: all .35s ease;
        transition: all .35s ease
    }
}

@media screen and (min-width: 750px)and (max-width: 1199px) {
    .ham__item {
        left: 2.5rem;
        width: 3rem
    }

    .ham__item:nth-child(1) {
        top: 3rem
    }

    .ham__item:nth-child(2) {
        top: 3.9rem
    }

    .ham__item:nth-child(3) {
        top: 5rem
    }
}

@media screen and (max-width: 749px) {
    .ham__item {
        left: 1.5rem;
        width: 2rem
    }

    .ham__item:nth-child(1) {
        top: 1.8rem
    }

    .ham__item:nth-child(2) {
        top: 2.5rem
    }

    .ham__item:nth-child(3) {
        top: 3.2rem
    }
}

@media screen and (min-width: 750px)and (max-width: 1199px) {
    .is-active .ham__item {
        top: 4rem
    }
}

@media screen and (max-width: 749px) {
    .is-active .ham__item {
        top: 2.5rem
    }
}

.is-active .ham__item:nth-child(1) {
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg)
}

.is-active .ham__item:nth-child(2) {
    opacity: 0
}

.is-active .ham__item:nth-child(3) {
    -webkit-transform: rotate(-225deg);
    transform: rotate(-225deg)
}

.hd {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    -webkit-transition: all .3s;
    transition: all .3s;
    background: #fff
}

@media screen and (min-width: 1200px) {
    .hd {
        height: 16.2rem;
        -webkit-transition: all .3s;
        transition: all .3s
    }

    .is-view .hd {
        height: 8rem
    }
}

.hd__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%
}

@media screen and (max-width: 749px) {
    .is-active .hd__inner {
        background: #fff
    }
}

@media screen and (min-width: 1200px) {
    .hd__head {
        width: 16.2rem
    }
}

@media screen and (max-width: 1199px) {
    .hd__head {
        position: relative;
        z-index: 10;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
        height: 90px
    }
}

.is-hover .hd__head::before {
    opacity: .3
}

@media screen and (min-width: 1200px) {
    .hd__head::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: #000;
        opacity: 0;
        -webkit-transition: all .3s;
        transition: all .3s;
        pointer-events: none
    }
}

@media screen and (min-width: 1200px) {
    .hd__body {
        position: relative;
        z-index: 100;
        width: calc(100% - 20rem);
        margin-left: 6rem
    }
}

@media screen and (max-width: 1199px) {
    .hd__body {
        position: absolute;
        top: 90px;
        right: -100%;
        z-index: 10;
        width: 100%;
        height: calc(100vh - 90px);
        background: #fff;
        padding: 0 2rem 8rem;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all .3s;
        transition: all .3s;
        overflow-y: scroll
    }

    .is-active .hd__body {
        visibility: visible;
        opacity: 1;
        right: 0
    }
}

@media screen and (min-width: 750px)and (max-width: 1199px) {
    .hd__body {
        width: 40rem;
        right: -40rem
    }
}

@media screen and (min-width: 1024px) {
    .hdLogo {
        width: 16.2rem
    }
}

@media screen and (max-width: 749px) {
    .hdLogo {
        width: 10rem
    }
}

.hdLogo__item {
    -webkit-transition: all .3s;
    transition: all .3s
}

@media screen and (min-width: 1200px) {
    .hdLogo__item:hover {
        opacity: .7
    }
}

.hdLogo__anc .off {
    display: block
}

.is-hover .hdLogo__anc .off,
.is-view .hdLogo__anc .off {
    display: none
}

.hdLogo__anc .on {
    display: none
}

.is-hover .hdLogo__anc .on,
.is-view .hdLogo__anc .on {
    display: block
}

@media screen and (min-width: 1200px) {
    .gnav {
        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
    }
}

@media screen and (min-width: 1200px) {
    .gnav__head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: calc(100% - 25rem);
        margin-right: 4rem
    }
}

@media screen and (min-width: 1200px) {
    .gnav__foot {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        position: absolute;
        width: 100%;
        top: 0;
        left: 0;
        background: #989898
    }
}

@media screen and (max-width: 1199px) {
    .gnav__foot {
        background: #f7f7f7;
        padding: 4rem 1.5rem
    }
}

@media screen and (min-width: 1200px) {
    .gnav__list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        width: 100%;
        max-width: 75rem;
        margin-left: auto
    }
}

@media screen and (max-width: 1199px) {
    .gnav__list {
        border-bottom: 1px solid #707070
    }
}

@media screen and (min-width: 1200px) {
    .gnav__item {
        position: relative;
        cursor: pointer
    }

    .gnav__item::after {
        content: "";
        display: block;
        position: absolute;
        bottom: -6.3rem;
        left: -10rem;
        width: 100rem;
        height: 6.5rem;
        visibility: hidden
    }

    .gnav__item:hover::after {
        visibility: visible
    }

    .gnav__item.is-show::after {
        visibility: visible
    }
}

@media screen and (max-width: 1199px) {
    .gnav__item {
        border-top: 1px solid #707070
    }
}

.gnav__anc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: normal
}

@media screen and (min-width: 1200px) {
    .gnav__anc {
        position: relative;
        z-index: 10;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        min-height: 2.4em;
        font-size: 1.5rem;
        text-align: center
    }

    .gnav__anc::before {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 100%;
        height: 2px;
        background: #000;
        opacity: 0
    }
}

@media screen and (min-width: 1200px)and (min-width: 1200px) {
    .gnav__anc.-tab {
        pointer-events: none
    }
}

@media screen and (min-width: 1200px) {
    .is-view .gnav__anc::before {
        bottom: -0.5em
    }

    .is-current .gnav__anc::before {
        opacity: 1
    }

    .is-show .gnav__anc {
        color: #fff
    }

    .is-hover .gnav__anc:hover {
        color: #fff
    }

    body:not(.is-hover) .gnav__anc:hover {
        color: #989898
    }
}

@media screen and (max-width: 1199px) {
    .gnav__anc {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        position: relative;
        padding: 3rem 4rem 3rem 1rem
    }

    .gnav__anc::after {
        font-family: "3scapital" !important
    }

    .gnav__anc.-tab::after {
        content: ""
    }

    .gnav__anc.-tab.is-show::after {
        content: none
    }

    .gnav__anc:not(.-tab)::after {
        content: ""
    }
}

@media screen and (min-width: 1200px) {
    .gnavChild {
        position: fixed;
        visibility: hidden;
        opacity: 0;
        top: 12.4rem;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        -webkit-transition: all .3s;
        transition: all .3s;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding: 3rem 24rem 3rem 6rem;
        width: 70rem;
        min-height: 210px;
        background: #fff;
        -webkit-box-shadow: 0 .5rem .5rem rgba(0, 0, 0, .1);
        box-shadow: 0 .5rem .5rem rgba(0, 0, 0, .1)
    }

    .is-show .gnavChild {
        visibility: visible;
        opacity: 1
    }

    .is-view .gnavChild {
        top: 8rem
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild {
        display: none
    }
}

@media screen and (min-width: 1200px) {
    .gnavChild.-special {
        padding-right: 6rem;
        padding-bottom: 6rem
    }
}

@media screen and (min-width: 1200px) {
    .gnavChild__box {
        display: block;
        width: 16rem
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__box {
        display: none
    }
}

.gnavChild__title {
    font-family: "Open Sans", sans-serif;
    font-weight: bold
}

@media screen and (min-width: 1200px) {
    .gnavChild__title {
        font-size: 3rem;
        white-space: nowrap
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__title {
        font-size: 1.6rem
    }
}

.gnavChild__subtitle {
    font-size: 1.2rem;
    font-weight: bold
}

@media screen and (min-width: 1200px) {
    .gnavChild__list__box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-left: 8rem;
        width: calc(100% - 16rem - 8rem)
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__list__box {
        padding-bottom: 1.5rem
    }
}

@media screen and (min-width: 1200px) {
    .gnavChild__list {
        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: 1200px) {
    .gnavChild__list:not(:first-of-type) {
        margin-left: 4.5rem
    }
}

.gnavChild__list.-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

@media screen and (min-width: 1200px) {
    .-special .gnavChild__list {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

@media screen and (min-width: 1200px) {
    .gnavChild__item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center
    }

    .gnavChild__item.-top {
        display: none
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__item + .gnavChild__item {
        border-top: 1px dashed #fff
    }
}

@media screen and (min-width: 1200px) {
    .gnavChild__item:not(:first-of-type) {
        margin-top: 2.2rem
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__item:not(:first-of-type) {
        margin-top: 1rem
    }
}

@media screen and (min-width: 1200px) {
    .-center .gnavChild__item:not(:first-of-type) {
        margin-top: 3rem
    }
}

.gnavChild__anc {
    font-weight: normal
}

@media screen and (min-width: 1200px) {
    .gnavChild__anc {
        font-size: 1.4rem;
        white-space: nowrap
    }

    .gnavChild__anc:hover {
        color: #989898
    }

    .gnavChild__anc.-top {
        display: none
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__anc {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100%;
        min-height: 4rem;
        line-height: 1.3;
        font-size: 1.4rem;
        font-weight: bold
    }
}

@media screen and (max-width: 1199px)and (min-width: 1200px) {
    .gnavChild__anc {
        padding: .5em 3rem
    }
}

@media screen and (max-width: 1199px)and (max-width: 1199px) {
    .gnavChild__anc {
        padding: .5em 6rem .5rem 3rem
    }
}

@media screen and (max-width: 1199px) {
    .gnavChild__anc::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 4rem;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        font-family: "3scapital" !important
    }
}

@media screen and (min-width: 750px) {
    .gnavChild__anc.-border {
        border-bottom: 1px solid #707070;
        padding-bottom: .5em
    }
}

@media screen and (min-width: 1200px) {
    body.is-heroMain .hd {
        height: 8rem
    }
}

@media screen and (min-width: 1200px) {
    body:not(.is-heroMain):not(.is-hero) .hd::before {
        opacity: 1
    }
}

@media screen and (min-width: 1200px) {
    body:not(.is-heroMain):not(.is-hero) .gnav__anc {
        color: #fff
    }

    body:not(.is-heroMain):not(.is-hero) .gnav__anc::before {
        background: #fff
    }
}

@media screen and (min-width: 1200px) {
    body:not(.is-heroMain):not(.is-hero):not(.is-hover) .gnav__anc:hover {
        color: #989898
    }
}

@media screen and (min-width: 1200px) {
    body:not(.is-heroMain):not(.is-hero) .hd {
        pointer-events: none
    }

    body:not(.is-heroMain):not(.is-hero) .hd .gnav__item::after {
        pointer-events: all
    }

    body:not(.is-heroMain):not(.is-hero) .hd .gnav__anc,
    body:not(.is-heroMain):not(.is-hero) .hd .gnavChild,
    body:not(.is-heroMain):not(.is-hero) .hd .hdLogo__item {
        pointer-events: all
    }
}

body:not(.is-heroMain):not(.is-hero):not(.is-active) .hd {
    background: rgba(0, 0, 0, 0)
}

body:not(.is-heroMain):not(.is-hero):not(.is-active) .hdLogo__item {
    -webkit-filter: invert(100%);
    filter: invert(100%)
}

body:not(.is-heroMain):not(.is-hero):not(.is-active) .ham__item {
    background: #fff
}

@media screen and (min-width: 1200px) {
    body .hd::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 20rem;
        background: #000;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0)));
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
        opacity: 0;
        -webkit-transition: all .3s;
        transition: all .3s;
        pointer-events: none
    }
}

.ft {
    position: relative;
    color: #fff;
    font-weight: normal;
    background: #000
}

@media screen and (max-width: 749px) {
    .ft {
        padding: 2.5rem 0 3rem
    }
}

@media screen and (min-width: 750px) {
    .ft__head {
        padding: 3.5rem 0 2.6rem
    }
}

@media screen and (min-width: 1024px) {
    .ft__content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media screen and (min-width: 750px) {
    .ft__content:not(:first-of-type) {
        margin-top: 3rem
    }
}

@media screen and (min-width: 1024px) {
    .ft__item {
        width: 47.513321492%
    }
}

@media screen and (min-width: 750px)and (max-width: 1023px) {
    .ft__item {
        width: 100%
    }
}

@media screen and (min-width: 750px)and (max-width: 1023px) {
    .ft__item:not(:first-of-type) {
        margin-top: 3rem
    }
}

@media screen and (min-width: 750px) {
    .ftSitemap {
        width: 100%
    }
}

@media screen and (min-width: 750px) {
    .ftSitemap.-this {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media screen and (min-width: 750px) {
    .-this .ftSitemap__list {
        width: 45.7943925234%
    }
}

@media screen and (min-width: 750px) {
    .ftSitemap__item {
        font-size: 1.5rem
    }
}

@media screen and (min-width: 750px) {
    .ftSitemap__item + .ftSitemap__item {
        margin-top: 4rem
    }
}

@media screen and (min-width: 750px) {
    .ftSitemap__anc {
        position: relative;
        display: block;
        padding-bottom: 1rem
    }

    .ftSitemap__anc:hover::after {
        width: 100%
    }

    .ftSitemap__anc::before,
    .ftSitemap__anc::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        display: block;
        height: 1px
    }

    .ftSitemap__anc::before {
        background: #707070;
        width: 100%
    }

    .ftSitemap__anc::after {
        background: #fff;
        width: 0
    }
}

@media screen and (max-width: 749px) {
    .ftSitemap__anc {
        display: block;
        padding: 1em
    }
}

@media screen and (min-width: 750px) {
    .-this .ftSitemapSub__list {
        margin-top: 1rem
    }
}

@media screen and (min-width: 750px) {
    .-other .ftSitemapSub__list {
        margin-top: 1.5rem;
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2
    }
}

@media screen and (min-width: 750px) {
    .-this .ftSitemapSub__item:not(:first-of-type) {
        margin-top: .5rem
    }
}

@media screen and (min-width: 1441px) {
    .-other .ftSitemapSub__item {
        max-width: 82.2429906542%
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .-other .ftSitemapSub__item {
        max-width: 220px
    }
}

@media screen and (min-width: 750px) {
    .-other .ftSitemapSub__item:not(:first-of-type) {
        margin-top: 1rem
    }
}

.ftSitemapSub__anc {
    font-size: .8666666667em
}

@media screen and (min-width: 750px) {
    .ftSitemapSub__anc:hover {
        text-decoration: underline
    }

    .-this .ftSitemapSub__anc {
        color: #989898
    }

    .ftSitemapSub__anc.-blank {
        position: relative;
        display: block;
        padding-right: 1.2em
    }

    .ftSitemapSub__anc.-blank::after {
        content: "";
        position: absolute;
        top: 50%;
        right: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        color: #b7b7b7;
        font-family: "3scapital" !important;
        font-size: .9em
    }
}

@media screen and (max-width: 749px) {
    .ftSitemapSub__anc {
        display: block;
        padding: 1em
    }

    .ftSitemapSub__anc::before {
        content: "-";
        margin-right: .5em
    }
}

@media screen and (max-width: 749px) {
    .ft__body {
        margin-top: 4rem
    }
}

@media screen and (min-width: 750px) {
    .ft__body__inner {
        border-color: #707070;
        border-style: solid;
        border-width: 1px 0;
        padding: 1.1rem 0 1.4rem
    }
}

.ft__body__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: -0.5rem
}

@media screen and (max-width: 749px) {
    .ft__body__list {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.ft__body__item {
    margin-top: .5rem
}

.ft__body__item:not(:first-of-type) {
    position: relative
}

.ft__body__item:not(:first-of-type)::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-45%);
    transform: translateY(-45%);
    display: block;
    width: 1px;
    height: 80%;
    background: #fff
}

@media screen and (min-width: 750px) {
    .ft__body__item:not(:first-of-type) {
        margin-left: 3.5rem;
        padding-left: 3.5rem
    }
}

@media screen and (max-width: 749px) {
    .ft__body__item:not(:first-of-type) {
        margin-left: 2.2rem;
        padding-left: 2.2rem
    }
}

.ft__body__link {
    font-family: "Open Sans", sans-serif
}

@media screen and (min-width: 750px) {
    .ft__body__link {
        line-height: 1.4;
        font-size: 1.4rem
    }

    .ft__body__link:hover {
        text-decoration: underline
    }
}

@media screen and (max-width: 749px) {
    .ft__body__link {
        font-size: 1.6rem
    }
}

.ft__body__link.-gray {
    color: #989898
}

@media screen and (min-width: 750px) {
    .ft__foot {
        padding: 2.2rem 0 6rem
    }
}

@media screen and (max-width: 749px) {
    .ft__foot {
        margin-top: 5rem
    }
}

.ft__foot__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media screen and (min-width: 750px) {
    .ft__foot__inner {
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

@media screen and (max-width: 749px) {
    .ft__foot__inner {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.ft__copy {
    font-family: "Open Sans", sans-serif
}

@media screen and (min-width: 750px) {
    .ft__copy {
        font-size: 1.2rem
    }
}

@media screen and (max-width: 749px) {
    .ft__copy {
        font-size: 1.1rem
    }
}

.ftLogo__item {
    display: block
}

@media screen and (min-width: 750px) {
    .ftLogo__item {
        width: 14.3rem
    }

    .ftLogo__item:hover {
        opacity: .7
    }
}

@media screen and (max-width: 749px) {
    .ftLogo__item {
        margin: 0 auto;
        width: 16.2rem
    }
}

.ftLogo__item img {
    width: 100%
}

@media screen and (min-width: 750px) {
    .ft__name {
        margin-top: 1.5rem;
        line-height: 1.8;
        font-size: 1.3rem
    }
}

@media screen and (min-width: 750px) {
    .ft__access {
        margin-top: 1.2rem;
        color: #989898;
        font-size: 1.2rem
    }
}

@media screen and (min-width: 750px) {
    .sec {
        padding: 5rem 0
    }
}

@media screen and (max-width: 749px) {
    .sec:first-of-type {
        padding-top: 5rem
    }
}

@media screen and (max-width: 749px) {
    .sec:not(:first-of-type) {
        padding-top: 10rem
    }
}

@media screen and (max-width: 749px) {
    .sec:last-of-type {
        padding-bottom: 12rem
    }
}

.sec.-pt0 {
    padding-top: 0
}

.sec.-pb0 {
    padding-bottom: 0
}

@media screen and (min-width: 750px) {
    .sec.-lg {
        padding: 10rem 0
    }
}

@media screen and (min-width: 750px) {
    .sec.-md {
        padding: 8rem 0
    }
}

@media screen and (min-width: 750px) {
    .sec.-sm {
        padding: 3rem 0
    }
}

.sec {
    background: #fff
}

.category {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: -0.5em;
    margin-left: -0.5em
}

@media screen and (min-width: 750px) {
    .category {
        font-size: 1.2rem
    }
}

@media screen and (max-width: 749px) {
    .category {
        font-size: 1rem
    }
}

.category__item {
    margin-top: .5em;
    margin-left: .5em;
    font-family: "Open Sans", sans-serif
}

.category__item .nolink,
.category__item .link {
    display: block;
    border-radius: .4em;
    padding: .5em 1.2em;
    background: #e0e0e0
}

@media screen and (min-width: 750px) {
    .category__item .link:hover {
        color: #000
    }
}

.scrollTop {
    position: fixed;
    z-index: 100;
    bottom: 2rem;
    border-radius: 50%;
    border: 1px solid #989898;
    width: 7.7rem;
    height: 7.7rem;
    background: #989898
}

@media screen and (min-width: 750px) {
    .scrollTop {
        right: 8.78477306vw
    }

    .scrollTop:hover {
        background: #fff
    }

    .scrollTop:hover::before {
        border-color: #989898 #989898 rgba(0, 0, 0, 0) rgba(0, 0, 0, 0)
    }
}

@media screen and (max-width: 749px) {
    .scrollTop {
        right: 2rem
    }
}

.scrollTop::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -30%) rotate(-45deg);
    transform: translate(-50%, -30%) rotate(-45deg);
    border-color: #fff #fff rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 2px;
    width: 1.5rem;
    height: 1.5rem
}

.articleList {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

@media screen and (max-width: 749px) {
    .articleList {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media screen and (min-width: 750px) {
    .-col4 .articleList__item {
        width: 23.0905861456%
    }

    .-col4 .articleList__item:not(:nth-child(4n)) {
        margin-right: 2.5458851391%
    }

    .-col4 .articleList__item:nth-child(n+5) {
        margin-top: 6.5rem
    }
}

@media screen and (min-width: 750px) {
    .-col3 .articleList__item {
        width: 30.7692307692%
    }

    .-col3 .articleList__item:not(:nth-child(3n)) {
        margin-right: 3.8461538462%
    }

    .-col3 .articleList__item:nth-child(n+4) {
        margin-top: 6.5rem
    }
}

@media screen and (max-width: 749px) {
    .articleList__item {
        width: 48.5%;
        font-size: 14px
    }

    .articleList__item:nth-child(n+3) {
        margin-top: 3.5rem
    }
}

.articleList__anc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    border-bottom: 1px solid #000
}

.articleList__head {
    position: relative;
    padding-top: 67.3076923077%;
    height: 0
}

.articleList__img {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -50%
}

@media screen and (min-width: 1441px) {
    .articleList__img {
        width: 100%
    }
}

.articleList__body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%
}

@media screen and (min-width: 750px) {
    .articleList__body {
        padding: 1.8rem 0 1rem
    }
}

@media screen and (max-width: 749px) {
    .articleList__body {
        padding: .8rem 0 1rem
    }
}

.articleList__category {
    margin-top: auto
}

.articleList__date {
    margin-top: 1.4rem
}

@media screen and (min-width: 750px) {
    .articleList__date {
        font-size: 1.6rem
    }
}

@media screen and (max-width: 749px) {
    .articleList__date {
        font-size: 1.5rem
    }
}

.articleList__title {
    display: none;
    line-height: 1.8;
    font-weight: normal
}

@media screen and (min-width: 750px) {
    .articleList__title {
        margin-bottom: 2.4rem;
        font-size: 1.6rem
    }
}

@media screen and (max-width: 749px) {
    .articleList__title {
        margin-bottom: 1rem;
        font-size: 1.4rem
    }
}

.articleFlat__item {
    padding: 2rem 0;
    border-bottom: 1px solid #707070
}

.articleFlat__item:first-child {
    padding-top: 0
}

@media screen and (min-width: 750px) {
    .-flat .articleFlat__anc {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media screen and (min-width: 750px) {
    .articleFlat__anc:hover .articleFlat__title {
        text-decoration: underline
    }
}

.articleFlat__head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: .5rem
}

@media screen and (min-width: 750px) {
    .-flat .articleFlat__head {
        margin-bottom: 0
    }
}

.articleFlat__date {
    margin-right: 1em;
    font-size: .875em
}

.articleFlat__category {
    white-space: nowrap
}

.articleFlat__title {
    margin-top: 1rem;
    font-size: 1em
}

@media screen and (min-width: 750px) {
    .-flat .articleFlat__title {
        margin: 0 0 0 1em
    }
}

@media screen and (min-width: 750px) {
    .sec__head {
        margin-bottom: 6rem
    }
}

@media screen and (max-width: 749px) {
    .sec__head {
        margin-bottom: 4.5rem
    }
}

.sec__head__title {
    font-family: "Open Sans", sans-serif;
    font-size: 3rem
}

.sec__head__subtitle {
    margin-top: .2rem;
    font-size: 1.8rem;
    font-weight: bold
}

.box__num {
    position: relative;
    font-weight: bold;
    padding-left: 3.25em;
    font-size: 2rem
}

@media screen and (min-width: 750px) {
    .box__num {
        margin-bottom: 2rem
    }
}

@media screen and (max-width: 749px) {
    .box__num {
        margin-bottom: 1.2rem
    }
}

.box__num::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 2.9em;
    height: 1px;
    background: #707070
}

.box__title {
    font-family: "Open Sans", sans-serif
}

@media screen and (min-width: 750px) {
    .box__title {
        letter-spacing: .02em;
        line-height: 1.2;
        font-size: clamp(3rem, 4.39238653vw, 6rem)
    }
}

@media screen and (max-width: 749px) {
    .box__title {
        font-size: 3rem
    }
}

.box__subtitle {
    font-size: 2rem;
    font-weight: bold
}

@media screen and (min-width: 750px) {
    .box__subtitle {
        margin-top: .2rem;
        letter-spacing: .02em
    }
}

@media screen and (max-width: 749px) {
    .box__subtitle {
        margin-top: .5rem
    }
}

section:not(.hero) {
    position: relative;
    z-index: 10
}

.hero {
    position: relative;
    width: 100vw;
    overflow: hidden
}

.hero::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 0;
    -webkit-transition: all .3s;
    transition: all .3s;
    pointer-events: none
}

.hero.is-heroSub::before {
    opacity: .6
}

.hero__area {
    position: relative;
    width: 100%;
    height: 100vh
}

#heroMain {
    opacity: 1;
    -webkit-transition: all .5s;
    transition: all .5s
}

#heroMain.passed {
    opacity: 0;
    -webkit-transition: all .5s;
    transition: all .5s;
    -webkit-transform: translateY(-150vh);
    transform: translateY(-150vh)
}

#heroSub {
    margin-top: 0;
    padding-bottom: 200vh;
    -webkit-transform: translateY(100vh);
    transform: translateY(100vh);
    opacity: 0;
    -webkit-transition: all .5s;
    transition: all .5s
}

#heroSub.active {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1
}

@media screen and (min-width: 750px) {
    .hero__cursor {
        display: none
    }
}

@media screen and (max-width: 749px) {
    .hero__cursor {
        position: absolute;
        bottom: 0;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        border-radius: 50%;
        border: 1px solid #fff;
        width: 50px;
        height: 50px
    }

    .hero__cursor::before {
        content: "";
        color: #fff;
        font-family: "3scapital" !important;
        font-size: 2rem
    }
}

.hero__video {
    position: fixed;
    z-index: -1;
    min-width: 100%;
    height: 100vh;
    -o-object-fit: cover;
    object-fit: cover;
    overflow: hidden
}

.hero__video iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 177.77777778vh;
    min-width: 100%;
    height: 56.25vw;
    min-height: 100%
}

.hero__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100vh
}

.hero__title {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    font-family: "Open Sans", sans-serif
}

@media screen and (min-width: 750px) {
    .hero__title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        font-size: clamp(3rem, 3.6603221083vw, 6.5rem)
    }
}

@media screen and (max-width: 749px) {
    .hero__title {
        font-size: 3.6rem
    }
}

.hero__title__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, .3)
}

.hero__subtitle {
    text-align: center;
    color: #fff
}

@media screen and (min-width: 750px) {
    .hero__subtitle {
        font-size: clamp(1.8rem, 2.196193265vw, 3.2rem)
    }
}

@media screen and (max-width: 749px) {
    .hero__subtitle {
        font-size: 2.5rem
    }
}

.hero__lead {
    text-align: center;
    color: #fff
}

@media screen and (min-width: 750px) {
    .hero__lead {
        margin-top: 3.5rem;
        line-height: 2;
        font-size: clamp(1.6rem, 1.317715959vw, 2rem)
    }
}

@media screen and (max-width: 749px) {
    .hero__lead {
        margin-top: 3rem;
        line-height: 1.8;
        font-size: 1.6rem
    }
}

@media screen and (min-width: 750px) {
    .hero__btnarea {
        margin-top: 9.5rem
    }
}

@media screen and (max-width: 749px) {
    .hero__btnarea {
        margin-top: 5rem;
        width: 100%
    }
}

.scrollmagic-pin-spacer:first-of-type {
    z-index: 10
}

@media screen and (min-width: 750px) {
    .pro__item:first-of-type {
        padding-bottom: 5rem
    }
}

@media screen and (min-width: 750px) {
    .pro__item:not(:first-of-type):not(:last-of-type) {
        padding: 5rem 0
    }
}

@media screen and (max-width: 749px) {
    .pro__item:not(:first-of-type) {
        padding-top: 10rem
    }
}

@media screen and (min-width: 750px) {
    .pro__item:last-of-type {
        padding-top: 5rem
    }
}

.pro__item:nth-of-type(even) {
    position: relative
}

.pro__item:nth-of-type(even)::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: calc(50% - 50vw);
    width: 100vw;
    background: #f7f7f7
}

@media screen and (min-width: 750px) {
    .pro__item:nth-of-type(even)::before {
        top: 0;
        height: 100%
    }
}

@media screen and (max-width: 749px) {
    .pro__item:nth-of-type(even)::before {
        top: 10rem;
        height: calc(100% - 5rem)
    }
}

@media screen and (min-width: 750px) {
    .pro__content {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding-top: 17.5rem
    }
}

@media screen and (min-width: 750px) {
    .pro__content .box__head {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%
    }
}

@media screen and (min-width: 750px) {
    .pro__box {
        width: 32.8596802842%
    }
}

@media screen and (max-width: 749px) {
    .pro__box {
        margin-top: 2rem
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .pro__img {
        margin-right: calc(50% - 50vw)
    }
}

@media screen and (min-width: 750px) {
    .pro__img {
        margin-left: 3.0014641288%;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

@media screen and (max-width: 749px) {
    .pro__img {
        margin-left: -2rem;
        width: 100vw
    }
}

.pro__img img {
    width: 100%
}

@media screen and (min-width: 750px) {
    .pro__text {
        line-height: 1.8;
        font-size: clamp(1.4rem, 1.1713030747vw, 1.6rem)
    }
}

@media screen and (max-width: 749px) {
    .pro__text {
        margin-top: 1.5rem
    }
}

@media screen and (min-width: 750px) {
    .pro__btnarea {
        margin-top: 4.5rem
    }
}

@media screen and (max-width: 749px) {
    .pro__btnarea {
        margin-top: 2.5rem
    }
}

@media screen and (min-width: 750px) {
    .career {
        padding: 10rem 0;
        background: #f7f7f7
    }
}

@media screen and (min-width: 1441px) {
    .career__body__wrap {
        position: relative
    }
}

@media screen and (min-width: 750px) {
    .career__body {
        margin-right: calc(50% - 50vw);
        background: url(../img/top/career_img01.webp) no-repeat bottom center/cover
    }
}

@media screen and (max-width: 749px) {
    .career__img {
        margin-left: -2rem;
        width: 100vw
    }
}

@media screen and (min-width: 1441px) {
    .career__content {
        padding: 9.1145833333vw 10.9375vw 11.4583333333vw 9.5rem;
        min-height: 516px
    }
}

@media screen and (min-width: 750px)and (max-width: 1440px) {
    .career__content {
        padding: 10.2489019034vw 2.5622254758vw 10.2489019034vw 8.5rem
    }
}

@media screen and (min-width: 750px) {
    .career__content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
}

@media screen and (max-width: 749px) {
    .career__content {
        margin-left: -2rem;
        padding: 2.5rem 2rem 4rem;
        width: 100vw;
        background: #000
    }
}

@media screen and (min-width: 750px) {
    .career__box {
        display: none
    }
}

@media screen and (min-width: 750px) {
    .career__titlearea {
        width: 38.0673499268vw
    }
}

.career__title {
    font-family: "Open Sans", sans-serif
}

@media screen and (min-width: 750px) {
    .career__title {
        color: #fff;
        font-size: clamp(5rem, 4.39238653vw, 6rem)
    }
}

.career__lead {
    color: #fff;
    font-weight: bold;
    text-shadow: 2px 3px 3px rgba(0, 0, 0, .3)
}

@media screen and (min-width: 750px) {
    .career__lead {
        margin-top: .5rem;
        font-size: clamp(1.8rem, 1.4641288433vw, 2rem)
    }
}

@media screen and (max-width: 749px) {
    .career__lead {
        font-size: 1.8rem
    }
}

@media screen and (max-width: 749px) {
    .career__lead .anim-text {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .career__lead .anim-text .anim-text-item {
        line-height: 1.6
    }
}

.career__text {
    text-align: center;
    color: #fff
}

@media screen and (min-width: 750px) {
    .career__text {
        font-size: clamp(1.4rem, 1.1713030747vw, 1.6rem)
    }
}

@media screen and (max-width: 749px) {
    .career__text {
        margin-top: 1.5rem
    }
}

@media screen and (min-width: 750px) {
    .career__btnarea {
        margin-top: 2rem
    }
}

@media screen and (max-width: 749px) {
    .career__btnarea {
        margin-top: 4rem;
        text-align: center
    }
}

@media screen and (min-width: 750px) {
    .career__btnarea .btn {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        border: 2px solid #fff;
        width: 33rem;
        height: 10rem
    }

    .career__btnarea .btn::before {
        content: "";
        position: absolute;
        right: 4.5rem;
        font-size: 1.5em;
        font-family: "3scapital" !important;
        -webkit-transition: all 0s;
        transition: all 0s
    }

    .career__btnarea .btn:hover {
        border-color: #000
    }

    .career__btnarea .btn:hover::before {
        color: #000
    }
}

@media screen and (min-width: 750px) {
    .news.sec {
        padding: 10rem 0 19.5rem
    }
}

@media screen and (min-width: 750px) {
    .news__btnarea {
        margin-top: 5.5rem;
        text-align: right
    }
}

@media screen and (max-width: 749px) {
    .news__btnarea {
        margin-top: 6.5rem
    }
}

.anim-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 1.2;
    overflow: hidden
}

.anim-text.-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.anim-text-item {
    display: inline-block;
    -webkit-transition: all .3s;
    transition: all .3s;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    line-height: 1.4
}

.anim-text-item.anim {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

#hero .anim-text-item {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.anim-fadein {
    opacity: 0;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem);
    -webkit-transition: .9s cubic-bezier(0.215, 0.61, 0.355, 1) .6s;
    transition: .9s cubic-bezier(0.215, 0.61, 0.355, 1) .6s
}

.anim-fadein.anim {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

#hero .anim-fadein {
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.anim-img-left {
    position: relative
}

.anim-img-left::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #989898;
    z-index: 1100;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: right top;
    transform-origin: right top
}

.anim-img-left.anim::before {
    -webkit-animation: imgleft 1s cubic-bezier(0.165, 0.84, 0.44, 1) .2s forwards;
    animation: imgleft 1s cubic-bezier(0.165, 0.84, 0.44, 1) .2s forwards
}

.anim-img-left-inner {
    position: relative;
    left: -3rem;
    opacity: 0
}

.anim .anim-img-left-inner {
    -webkit-animation: imgleftinner 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s forwards;
    animation: imgleftinner 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s forwards
}

@-webkit-keyframes imgleft {
    0% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left top;
        transform-origin: left top
    }

    50% {
        -webkit-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    51% {
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    100% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: right top;
        transform-origin: right top
    }
}

@keyframes imgleft {
    0% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left top;
        transform-origin: left top
    }

    50% {
        -webkit-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    51% {
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    100% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: right top;
        transform-origin: right top
    }
}

@-webkit-keyframes imgleftinner {
    0% {
        left: -3rem;
        opacity: 0
    }

    100% {
        left: 0;
        opacity: 1
    }
}

@keyframes imgleftinner {
    0% {
        left: -3rem;
        opacity: 0
    }

    100% {
        left: 0;
        opacity: 1
    }
}

.anim-img-right {
    position: relative
}

.anim-img-right::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #989898;
    z-index: 1100;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: left top;
    transform-origin: left top
}

.anim-img-right.anim::before {
    -webkit-animation: imgright 1s cubic-bezier(0.165, 0.84, 0.44, 1) .2s forwards;
    animation: imgright 1s cubic-bezier(0.165, 0.84, 0.44, 1) .2s forwards
}

.anim-img-right-inner {
    position: relative;
    right: -3rem;
    opacity: 0
}

.anim .anim-img-right-inner {
    -webkit-animation: imgrightinner 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s forwards;
    animation: imgrightinner 1s cubic-bezier(0.165, 0.84, 0.44, 1) .5s forwards
}

@-webkit-keyframes imgright {
    0% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: right top;
        transform-origin: right top
    }

    50% {
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    51% {
        -webkit-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    100% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left top;
        transform-origin: left top
    }
}

@keyframes imgright {
    0% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: right top;
        transform-origin: right top
    }

    50% {
        -webkit-transform-origin: right top;
        transform-origin: right top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    51% {
        -webkit-transform-origin: left top;
        transform-origin: left top;
        -webkit-transform: scaleX(1);
        transform: scaleX(1)
    }

    100% {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left top;
        transform-origin: left top
    }
}

@-webkit-keyframes imgrightinner {
    0% {
        right: -3rem;
        opacity: 0
    }

    100% {
        right: 0;
        opacity: 1
    }
}

@keyframes imgrightinner {
    0% {
        right: -3rem;
        opacity: 0
    }

    100% {
        right: 0;
        opacity: 1
    }
}

.hero__title,
.sec__head__title,
.box__title,
.career__title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.hero__title .anim-text + .anim-text,
.sec__head__title .anim-text + .anim-text,
.box__title .anim-text + .anim-text,
.career__title .anim-text + .anim-text {
    margin-left: .3em
}