
section.int_visual {
    position: relative;
    margin: 0 0 10rem
}

@media only screen and (max-width: 768px) {
    section.int_visual {
        margin:3rem 0 5rem
    }
}

section.int_visual .image {
    position: relative;
    z-index: 2
}

section.int_visual .image:after {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    content: "";
    z-index: 10;
    background: rgba(0,0,0,.24)
}

section.int_visual .titles {
    position: absolute;
    top: 20%;
    left: 8%;
    color: #fff;
    z-index: 1000
}

@media only screen and (max-width: 768px) {
    section.int_visual .titles {
        z-index:300;
        top: 55%;
        left: 5%
    }
}

section.int_visual .titles h1.en {
    font-size: 4rem;
    font-weight: 200
}

@media only screen and (max-width: 768px) {
    section.int_visual .titles h1.en {
        font-size:2rem
    }
}

section.int_visual .titles h2 {
    font-weight: 400;
    font-size: 1.6rem;
    letter-spacing: 2px
}

@media only screen and (max-width: 768px) {
    section.int_visual .titles h2 {
        font-size:1rem
    }
}

section.int_visual .bgs01 {
    content: "";
    height: 12%;
    left: -10%;
    background: url(/recruit/career/img/common/noise.png),linear-gradient(91deg,#0068B5 22.41%,#0C336F 83.22%);
    transform: rotate(-5deg);
    z-index: 3;
    position: absolute;
    width: 120%
}

@media only screen and (max-width: 768px) {
    section.int_visual .bgs01 {
        top:-5%;
        transform: rotate(-6deg)
    }
}

section.int_visual .bgs02 {
    content: "";
    height: 22%;
    left: -10%;
    bottom: -10%;
    background: url(/recruit/career/img/common/noise.png),linear-gradient(91deg,#9CF0EB 22.41%,#1B84A5 83.22%);
    transform: rotate(3deg);
    z-index: 1;
    position: absolute;
    width: 120%
}

section.int_visual .bgs03 {
    content: "";
    height: 22%;
    left: -10%;
    bottom: -10%;
    background: url(/recruit/career/img/common/noise.png),linear-gradient(91deg,#0068B5 22.41%,#0C336F 83.22%);
    transform: rotate(-5deg);
    z-index: 1;
    position: absolute;
    width: 120%
}

section.profile {
    padding: 0 0 10rem
}

@media only screen and (max-width: 768px) {
    section.profile {
        padding:0
    }
}

section.profile .inner {
    max-width: 1400px;
    margin: auto;
    padding: 0 8vw
}

section.profile .prof_flex {
    display: flex;
    align-items: center
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex {
        display:block
    }
}

section.profile .prof_flex p.en {
    color: #004098;
    font-size: 1.2rem;
    font-weight: 500;
    flex: 1
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex p.en {
        text-align:center;
        margin: 0 0 1rem
    }
}

section.profile .prof_flex .image {
    width: 35%
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex .image {
        width:50%;
        margin: auto
    }
}

section.profile .prof_flex .txt {
    width: 40%;
    padding: 0 0 0 5rem
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex .txt {
        width:80%;
        margin: 0 auto 2rem;
        padding: 0
    }
}

section.profile .prof_flex .txt .name {
    display: flex;
    align-items: baseline;
    position: relative
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex .txt .name {
        justify-content:center;
        text-align: center;
        display: block
    }
}

section.profile .prof_flex .txt .name p.jp {
    margin: 0 1em 0 0;
    font-weight: 500
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex .txt .name p.jp {
        margin:0
    }
}

section.profile .prof_flex .txt .name p.en {
    color: #004098;
    font-size: .7rem
}

section.profile .prof_flex .txt .profile {
    position: relative;
    margin: 0 0 .5em
}

section.profile .prof_flex .txt .profile p {
    font-size: .8rem
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex .txt .profile p {
        text-align:center
    }
}

section.profile .prof_flex .txt .profile:before {
    content: "";
    width: 3rem;
    height: 1px;
    display: block;
    background: #004098;
    margin: 1em 0
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex .txt .profile:before {
        margin:1em auto
    }
}

section.profile .prof_flex p.details {
    font-size: .7rem
}

@media only screen and (max-width: 768px) {
    section.profile .prof_flex p.details {
        text-align:center
    }
}

#before,#after {
    background: #fff;
    padding: 5vw;
    max-width: 1200px;
    margin: 8rem auto 0
}

@media only screen and (max-width: 768px) {
    #before,#after {
        margin:5rem auto 0
    }
}

#before .bftitle,#after .bftitle {
    margin: 0 0 1em;
    display: flex;
    align-items: baseline
}

@media only screen and (max-width: 768px) {
    #before .bftitle,#after .bftitle {
        display:block;
        text-align: center;
        margin: 0 0 1em
    }
}

#before .bftitle p.en,#after .bftitle p.en {
    color: #004098;
    margin: 0 1em 0 0;
    font-size: 2rem
}

@media only screen and (max-width: 768px) {
    #before .bftitle p.en,#after .bftitle p.en {
        margin:0;
        font-size: 1.6rem
    }
}

#before dl,#after dl {
    display: flex;
    padding: 0 0 .5em;
    margin: 0 0 .5em;
    border-bottom: 1px dotted #ccc
}

@media only screen and (max-width: 768px) {
    #before dl,#after dl {
        display:block
    }
}

#before dl:last-child,#after dl:last-child {
    border-bottom: none
}

#before dl dt,#after dl dt {
    width: 12em;
    font-weight: 700
}

@media only screen and (max-width: 768px) {
    #before dl dt,#after dl dt {
        width:100%;
        background: #fff;
        text-align: center;
        margin: 0 0 1em;
        color: #000
    }
}

#before dl dd,#after dl dd {
    flex: 1
}

#after {
    background: url(/recruit/career/img/common/noise.png),linear-gradient(91deg,#0068B5 22.41%,#0C336F 83.22%);
    color: #fff;
    margin: 0 auto
}

#after .bftitle p.en {
    color: #fff
}

section.int_main.work {
    background: url(/recruit/career/img/common/noise.png),linear-gradient(150deg,#190977 12.11%,#573C79 81.61%)
}

section.int_main.work.nobg {
    background: none;
    padding: 0 5vw
}

section.int_main.work.nobg .inner {
    padding: 0
}

section.int_main.work.nobg .int_title {
    padding: 3rem 0
}

section.int_main.work.nobg .int_flex {
    align-items: flex-start
}

section.int_main.work .int_title {
    padding: 3rem 8vw
}

section.int_main.work .int_title p.en {
    background: var(--Rectangle-11, linear-gradient(91deg, #fff 22.41%, #fff 83.22%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

section.int_main.work .int_title p.en:after {
    background: var(--Rectangle-11, linear-gradient(91deg, #fff 22.41%, #fff 83.22%))
}

section.int_main.work .int_title p.jp {
    color: #fff
}

section.int_main.work .int_flex .txt {
    color: #fff
}

section.int_main.work .int_flex .txt h4:before {
    background: #fff
}

section.int_main .int_title {
    padding: 3rem 8vw;
    display: flex;
    align-items: baseline
}

@media only screen and (max-width: 768px) {
    section.int_main .int_title {
        display:block;
        padding: 2rem 8vw;
        text-align: center
    }
}

section.int_main .int_title p.en {
    position: relative;
    font-size: 3rem;
    background: var(--Rectangle-11, linear-gradient(91deg, #0068B5 22.41%, #0C336F 83.22%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0 1em 0 0
}

@media only screen and (max-width: 768px) {
    section.int_main .int_title p.en {
        margin:0;
        line-height: 1.4;
        font-size: 1.6rem
    }
}

section.int_main .int_title p.en:after {
    content: "";
    width: 100%;
    height: 3px;
    display: block;
    background: var(--Rectangle-11, linear-gradient(91deg, #0068B5 22.41%, #0C336F 83.22%))
}

@media only screen and (max-width: 768px) {
    section.int_main .int_title p.en:after {
        display:none;
        margin: 0;
        font-size: 2.4rem
    }
}

section.int_main .int_title p.jp {
    font-weight: 500;
    font-size: 1.2rem;
    z-index: 1000
}

@media only screen and (max-width: 768px) {
    section.int_main .int_title p.jp {
        font-size:16px
    }
}

section.int_main .int_flex {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
    position: relative;
    padding: 0 0 10vw
}

@media only screen and (max-width: 768px) {
    section.int_main .int_flex {
        display:block;
        padding: 0
    }
}

section.int_main .int_flex.rv {
    flex-direction: row
}

section.int_main .int_flex.rv.message .txt {
    padding: 0 5vw 0 0
}

@media only screen and (max-width: 768px) {
    section.int_main .int_flex.rv.message .txt {
        padding:0;
        margin: 0 0 2rem
    }
}

section.int_main .int_flex .image {
    width: 44%
}

@media only screen and (max-width: 768px) {
    section.int_main .int_flex .image {
        width:100%
    }
}

section.int_main .int_flex .txt {
    flex: 1;
    padding: 0 8vw
}

@media only screen and (max-width: 768px) {
    section.int_main .int_flex .txt {
        margin:0 0 2rem
    }
}

section.int_main .int_flex .txt h4 {
    position: relative;
    display: flex;
    align-items: center;
    font-weight: 700;
    margin: 0 0 .3em;
    font-size: 1.1rem
}

@media only screen and (max-width: 768px) {
    section.int_main .int_flex .txt h4 {
        font-size:16px
    }
}

section.int_main .int_flex .txt h4:before {
    content: "";
    width: 3rem;
    height: 1px;
    display: block;
    background: #004098;
    margin: 0 1em 0 0
}

section.int_main .int_flex .txt p {
    margin: 0 0 2em
}

section.int_main .wp_flex {
    display: flex;
    justify-content: space-between;
    max-width: 1400px;
    margin: 0 auto 10rem;
    padding: 0 8vw
}

@media only screen and (max-width: 768px) {
    section.int_main .wp_flex {
        display:block;
        margin: 0 0 3rem
    }
}

section.int_main .wp_flex .box {
    width: 48%
}

@media only screen and (max-width: 768px) {
    section.int_main .wp_flex .box {
        width:100%;
        margin: 0 0 2rem
    }
}

section.int_main .wp_flex .box h4.en {
    font-size: 1.5rem;
    font-weight: 500;
    margin: 0 0 1em;
    background: var(--Rectangle-11, linear-gradient(91deg, #0068B5 22.41%, #0C336F 83.22%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

@media only screen and (max-width: 768px) {
    section.int_main .wp_flex .box h4.en {
        font-size:1.4rem;
        margin: 0
    }
}

section.int_main .wp_flex .box .image {
    margin: 0 0 1em
}

.message_prof {
    position: relative
}

.message_prof:before {
    content: "";
    width: 3rem;
    height: 1px;
    display: block;
    background: #fff;
    margin: 0 0 2rem
}
