@charset "utf-8";

/* ────────────────────── *
 *                                              *
 * ページ共通                                   *
 *                                              *
 * ────────────────────── */

/* 見出し */
#title {
    color: #fff;
    width: 100%;
    height: 55.0rem;
    padding-bottom: 2.0rem;
    margin-bottom: 7.0rem;
    box-sizing: border-box;
}
.company-outline #title {
    background: url("/saiyou/image/company/outline/mainvisual.jpg") no-repeat center center / cover;
}
.company-message #title {
    background: url("/saiyou/image/company/message/mainvisual.jpg") no-repeat center center / cover;
    height: 67.5rem;
    margin-bottom: 12.0rem;
}
.company-office #title {
    background: url("/saiyou/image/company/office/mainvisual.jpg") no-repeat center center / cover;
}
.company-onsite #title {
    background: url("/saiyou/image/company/onsite/mainvisual.jpg") no-repeat center center / cover;
}
#title .inner {
    text-align: center;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
#title .inner h1 {
    font-size: 4.5rem;
    font-weight: 300;
    letter-spacing: 0.1em;
    margin-bottom: 2.0rem;
}
#title .inner p.en {
    font-family: "Manrope", sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.15em;
}

/* トップメッセージ */
.company-message #title .inner {
    text-align: left;
    padding: 0 10.0rem;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}
.company-message #title .inner h1 {
    font-size: 4.4rem;
    line-height: 1.431818181818182;
    margin-bottom: 3.0rem;
}
.company-message #title .inner p.en {
    margin-bottom: 3.0rem;
}
.company-message #title .inner p.name {
    font-size: 1.5rem;
    line-height: 1.6;
    font-weight: 500;
}

/* コンテンツ枠 */
.contents {
    width: 100%;
}
.contents .inner {
    width: 108.0rem;
    margin: 0 auto;
}

/* ────────────────────── *
 *                                              *
 * 次のコンテンツ                               *
 *                                              *
 * ────────────────────── */

.contents #next-contents {
    background: rgb(91,52,66);
    background: -moz-linear-gradient(-225deg, rgba(91,52,66,1) 0%, rgba(43,66,101,1) 100%);
    background: -webkit-linear-gradient(-225deg, rgba(91,52,66,1) 0%, rgba(43,66,101,1) 100%);
    background: linear-gradient(-225deg, rgba(91,52,66,1) 0%, rgba(43,66,101,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#5b3442",endColorstr="#2b4265",GradientType=1);
    padding: 11.0rem 0;
}
.contents #next-contents .inner {
    width: 95.96412556053812%;
    max-width: 107.0rem;
    margin: 0 auto;
}
.contents #next-contents.three .inner {
    width: 96.8609865470852%;
    max-width: 108.0rem;
}
.contents #next-contents .inner h2 {
    font-family: "Manrope", sans-serif;
    font-size: 5.6rem;
    font-weight: 200;
    color: rgba(255, 255, 255, 0.1);
    letter-spacing: 0.05em;
    text-align: center;
    margin: 0 auto 5.0rem;
}
.contents #next-contents .inner #next-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.contents #next-contents .inner #next-list .list {
    background: #fff;
    width: 48.5981308411215%;
}
.contents #next-contents.three .inner #next-list .list {
    width: 31.77570093457944%;
}
.contents #next-contents .inner #next-list .list a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.contents #next-contents .inner #next-list .list p.image {
    width: 50%;
    overflow: hidden;
}
.contents #next-contents.three .inner #next-list .list p.image {
    width: 44.11764705882353%;
}
.contents #next-contents .inner #next-list .list p.image img {
    transform: scale(1);
    opacity: 1;
    transition: opacity .5s, transform .5s;
}
.contents #next-contents .inner #next-list .list a:hover p.image img {
    transform: scale(1.1);
    opacity: 0.8;
}
.contents #next-contents .inner #next-list .list p.cname {
    font-size: 2.0rem;
    line-height: 1.272727272727273;
    width: 50%;
    padding-right: 2.0rem;
    box-sizing: border-box;
    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;
    transition: opacity .5s;
}
.contents #next-contents.three .inner #next-list .list p.cname {
    width: 55.88235294117647%;
}
.contents #next-contents .inner #next-list .list p.cname span.small {
    font-size: 1.6rem;
}
.contents #next-contents .inner #next-list .list a:hover p.cname {
    opacity: 0.8;
}
.contents #next-contents .inner #next-list .list p.cname::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 10px;
    border-color: transparent transparent transparent #006de1;
    position: absolute;
    right: 2.0rem;
    top: 50%;
    transform: translateY(-50%);
}

/* ────────────────────── *
 *                                              *
 * 企業概要                                     *
 *                                              *
 * ────────────────────── */

.company-outline .contents .inner h2 {
    font-size: 3.2rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 1.5rem;
}
.company-outline .contents .inner p.en {
    font-family: "Manrope", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: #006ee1;
    letter-spacing: 0.05em;
    text-align: center;
    margin-bottom: 6.0rem;
}
.company-outline .contents .inner dl.outline {
    font-size: 1.6rem;
    line-height: 1.875;
    width: 84.0rem;
    margin: 0 auto 13.0rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.company-outline .contents .inner dl.outline dt {
    font-weight: 700;
    text-align: center;
    width: 11.0rem;
    padding: 2.0rem 1.0rem;
    box-sizing: border-box;
    border-bottom: 2px solid #006ee1;
}
.company-outline .contents .inner dl.outline dd {
    width: calc(100% - 11.0rem - 2.0rem);
    padding: 2.0rem 1.0rem;
    box-sizing: border-box;
    border-bottom: 1px solid #afafb5;
}

.company-outline .contents .inner p.txt-intro {
    font-size: 1.6rem;
    line-height: 2.5;
    font-weight: 500;
    text-align: center;
    margin: 0 auto 10.0rem;
}
.company-outline .contents .inner dl.body {
    margin-bottom: 11.0rem;
}
.company-outline .contents .inner dl.body:last-of-type {
    margin-bottom: 20.0rem;
}
.company-outline .contents .inner dl.body dt {
    font-size: 2.2rem;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding-left: 2.0rem;
    margin-bottom: 3.0rem;
    position: relative;
}
.company-outline .contents .inner dl.body dt::before {
    content: "";
    background : -moz-linear-gradient(50% 100% 90deg,rgba(240, 40, 50, 1) 0%,rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-gradient(linear,50% 100% ,50% 0% ,color-stop(0,rgba(240, 40, 50, 1) ),color-stop(0.9996,rgba(0, 110, 225, 1) ));
    background : -o-linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -ms-linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F02832', endColorstr='#006EE1' ,GradientType=0)";
    background : linear-gradient(0deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006EE1',endColorstr='#F02832' , GradientType=0);
    width: 0.4rem;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.company-outline .contents .inner dl.body dd {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.company-outline .contents .inner dl.body dd p.txt {
    font-size: 1.6rem;
    line-height: 1.875;
    text-align: justify;
    width: 78.0rem;
}
.company-outline .contents .inner dl.body dd p.image {
    width: 26.0rem;
    margin-top: 1.0rem;
}

/* 主要拠点 */
.company-outline .contents #base {
    background: #ebedf0;
    padding: 10.0rem 0 16.0rem;
    margin: 0 auto 10.0rem;
}
.company-outline .contents #base .inner p#map {
    width: 87.0rem;
    margin: 0 auto 6.0rem;
}
.company-outline .contents #base .inner ul.pagination {
    font-size: 1.4rem;
    font-weight: 700;
    text-align: center;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.company-outline .contents #base .inner ul.pagination li {
    width: 21.0rem;
}
.company-outline .contents #base .inner ul.pagination li a {
    display: block;
    transition: opacity .5s;
}
.company-outline .contents #base .inner ul.pagination li a:hover {
    opacity: 0.8;
}
.company-outline .contents #base .inner ul.pagination li span {
    color: #fff;
    background: #868790;
    display: block;
    padding: 1.3rem 1.5rem;
    position: relative;
}
.company-outline .contents #base .inner ul.pagination li a.active span {
    background: #006ee1;
}
.company-outline .contents #base .inner ul.pagination li a.active span::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.8rem 0.6rem 0 0.6rem;
    border-color: #006de1 transparent transparent transparent;
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
}
.company-outline .contents #base .inner .slick-slide {
    background: #fff;
    padding: 7.0rem 11.9rem;
    border: 1px solid #d7d7da;
}
.company-outline .contents #base .inner .slick-slide h3 {
    font-size: 2.3rem;
    font-weight: 500;
    color: #fff;
    background: #006ee1;
    display: inline-block;
    padding: 0.8rem 1.0rem;
    margin-bottom: 1.5rem;
}
.company-outline .contents #base .inner .slick-slide p.property {
    font-size: 1.4rem;
    font-weight: 500;
    color: #868790;
    margin-bottom: 3.0rem;
}
.company-outline .contents #base .inner .slick-slide .flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.company-outline .contents #base .inner .slick-slide .flex p.txt {
    font-size: 1.4rem;
    line-height: 2.142857142857143;
    text-align: justify;
    width: 48.0rem;
}
.company-outline .contents #base .inner .slick-slide .flex p.image {
    width: 32.0rem;
    margin-top: 1.0rem;
}

/* ────────────────────── *
 *                                              *
 * トップメッセージ                             *
 *                                              *
 * ────────────────────── */

.company-message .contents .inner .flex {
    margin-bottom: 16.0rem;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.company-message .contents .inner .flex.reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}
.company-message .contents .inner .flex.full {
    background: #fff;
    display: block;
    padding: 8.0rem 12.0rem;
    margin-top: -10.0rem;
    margin-bottom: 6.0rem;
}
.company-message .contents .inner .flex p.image {
    width: 45.0rem;
}
.company-message .contents .inner .flex dl {
    width: 54.0rem;
}
.company-message .contents .inner .flex.full dl {
    width: 100%;
}
.company-message .contents .inner .flex dl dt {
    font-size: 3.2rem;
    line-height: 1.65625;
    font-weight: 500;
    font-feature-settings: "palt" 1;
    padding-bottom: 3.0rem;
    margin-bottom: 3.0rem;
    position: relative;
}
.company-message .contents .inner .flex dl dt::after {
    content: "";
    background : -moz-linear-gradient(0% 50% 0deg,rgba(240, 40, 50, 1) 0%,rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-linear-gradient(0deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-gradient(linear,0% 50% ,100% 50% ,color-stop(0,rgba(240, 40, 50, 1) ),color-stop(0.9996,rgba(0, 110, 225, 1) ));
    background : -o-linear-gradient(0deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -ms-linear-gradient(0deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F02832', endColorstr='#006EE1' ,GradientType=0)";
    background : linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F02832',endColorstr='#006EE1' , GradientType=1);
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
}
.company-message .contents .inner .flex dl dd {
    font-size: 1.6rem;
    line-height: 1.875;
    text-align: justify;
}
.company-message .contents p.image-full img {
    width: 100%;
}

/* ────────────────────── *
 *                                              *
 * 写真で見るオフィス                           *
 *                                              *
 * ────────────────────── */

.company-office .contents #gallery {
    background: url("/saiyou/image/company/office/bg-office.png") no-repeat top center / cover;
    width: 100%;
    max-width: 141.5rem;
    height: calc(100vw * 5115 / 1600);
    max-height: 511.5rem;
    margin: 0 0 19.0rem;
}
.company-office .contents #gallery #office-title {
    height: calc(100vw * 470 / 1600);
    max-height: 47.0rem;
    padding: 0 7.067137809187279%;
    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;
}
.company-office .contents #gallery #office-title h1 {
    font-size: 4.5rem;
    font-weight: 300;
    margin-bottom: 1.413427561837456%;
}
.company-office .contents #gallery #office-title p.en {
    font-family: "Manrope", sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: #006ee1;
    letter-spacing: 0.15em;
    margin-bottom: 5.0rem;
}
.company-office .contents #gallery #office-title p.txt-intro {
    font-size: 1.4rem;
    line-height: 2.5;
    font-weight: 500;
    font-feature-settings: "palt" 1;
}

.company-office .contents #gallery h3 {
    font-size: 2.8rem;
    font-weight: 500;
    color: #fff;
    text-align: center;
    width: 18.0rem;
    height: 6.5rem;
    position: absolute;
    z-index: 5;
    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;
}
.company-office .contents #gallery h3::before {
    content: "";
    background: rgba(240, 40, 50, 0.9);
    width: 6.5rem;
    height: 18.0rem;
    position: absolute;
    bottom: 0;
    z-index: -2;
}
.company-office .contents #gallery h3::after {
    content: "";
    background: rgba(0, 110, 225, 0.9);
    width: 18.0rem;
    height: 6.5rem;
    z-index: -1;
    position: absolute;
    bottom: 0;
}
.company-office .contents #gallery p.description {
    font-size: 1.5rem;
    line-height: 1.666666666666667;
    color: #fff;
    font-feature-settings: "palt" 1;
    text-align: center;
    width: 23.0rem;
    height: 22.0rem;
    position: absolute;
    box-sizing: border-box;
    z-index: 5;
    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;
}
.company-office .contents #gallery p.path {
    position: absolute;
}
.company-office .contents #gallery p.path img {
    width: 100%;
}

/* メインオフィス 1250×520 */
.company-office .contents #gallery #main-office {
    height: calc(100vw * 520 / 1600);
    max-height: 52.0rem;
    margin-left: 11.66077738515901%; /* 165px */
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery #main-office h2 {
    font-size: 2.1rem;
    font-weight: 500;
    font-feature-settings: "palt" 1;
    color: #fff;
    background: rgba(0, 110, 225, 0.9);
    letter-spacing: 0.05em;
    display: inline-block;
    padding: 1.2%;
    position: absolute;
    left: 0;
    top: 3.846153846153846%;
    z-index: 2;
}
.company-office .contents #gallery #main-office h2 em {
    font-size: 2.8rem;
}
.company-office .contents #gallery #main-office p#image-main-office {
    /* 幅495 上-382 左495 */
    width: 37.2%;
    position: absolute;
    left: 39.6%;
    top: -54.23076923076923%;
    z-index: 1;
}
.company-office .contents #gallery #main-office p#image-entrance {
    /* 幅425 上130 左0 */
    width: 34%;
    position: absolute;
    left: 0;
    top: 25%;
    z-index: 1;
}
.company-office .contents #gallery #main-office p.description {
    background: url("/saiyou/image/company/office/balloon-main-office.png") no-repeat center center / cover;
    padding-left: 1.0rem;
    /* 上175 左856 */
    left: 68.48%;
    top: 33.65384615384615%;
}
.company-office .contents #gallery #main-office p.path {
    /* 幅682 上450 右0 */
    width: 54.56%;
    right: 0;
    top: 86.53846153846154%;
}

/* オフィス 1250×820 */
.company-office .contents #gallery #office {
    height: calc(100vw * 820 / 1600);
    max-height: 82.0rem;
    margin-left: 11.66077738515901%; /* 165px */
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery p#image-office {
    /* 幅620 上165 左460 */
    width: 49.6%;
    position: absolute;
    left: 36.8%;
    top: 20.1219512195122%;
    z-index: 1;
}
.company-office .contents #gallery #office p.description {
    background: url("/saiyou/image/company/office/balloon-office.png") no-repeat center center / cover;
    padding-right: 1.5rem;
    /* 上140 左200 */
    left: 16%;
    top: 11.2%;
}
.company-office .contents #gallery #office p.path {
    /* 幅372 上420 左100 */
    width: 29.76%;
    left: 8%;
    top: 51.21951219512195%;
    z-index: 2;
}
.company-office .contents #gallery #office h3 {
    /* 左970 上220 */
    left: 77.6%;
    top: 26.82926829268293%;
}
.company-office .contents #gallery #office h3::before {
    left: 0;
}
.company-office .contents #gallery #office h3::after {
    left: 0;
}

/* 会議室 1415×660 */
.company-office .contents #gallery #conference-room {
    height: calc(100vw * 660 / 1600);
    max-height: 66.0rem;
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery p#image-conference-room {
    /* 幅1000 上165 左165 */
    width: 70.67137809187279%;
    position: absolute;
    left: 11.66077738515901%;
    top: -13.63636363636364%;
    z-index: 10;
}
.company-office .contents #gallery #conference-room p.description {
    background: url("/saiyou/image/company/office/balloon-conference-room.png") no-repeat center center / cover;
    padding-left: 1.0rem;
    /* 上-120 左975 */
    left: 68.90459363957597%;
    top: -18.18181818181818%;
    z-index: 11;
}
.company-office .contents #gallery #conference-room p.path {
    /* 幅1110 上350 左0 */
    width: 78.4452296819788%;
    left: 0;
    top: 53.03030303030303%;
    z-index: 2;
}
.company-office .contents #gallery #conference-room h3 {
    width: 42.0rem;
    /* 上-62 左100 */
    left: 7.067137809187279%;
    top: -4.848484848484848%;
    z-index: 11;
}
.company-office .contents #gallery #conference-room h3::before {
    height: 42.0rem;
    left: 0;
}
.company-office .contents #gallery #conference-room h3::after {
    width: 42.0rem;
    right: 0;
}

/* 研究室 1130×675 */
.company-office .contents #gallery #jdxc {
    height: calc(100vw * 675 / 1600);
    max-height: 67.5rem;
    margin-left: 7.067137809%;
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery p#image-jdxc {
    /* 幅980 上-80 左0 */
    width: 74.52471482889734%;
    position: absolute;
    left: 0;
    top: -11.85185185185185%;
    z-index: 1;
}
.company-office .contents #gallery #jdxc p.description {
    background: url("/saiyou/image/company/office/balloon-jdxc.png") no-repeat center center / cover;
    padding-left: 2.0rem;
    /* 上65 左946 */
    left: 71.93916349809886%;
    top: 9.62962962962963%;
}
.company-office .contents #gallery #jdxc p.path {
    /* 幅284 上370 左885 */
    width: 21.59695817490494%;
    left: 67.30038022813688%;
    top: 54.81481481481481%;
    z-index: 2;
}
.company-office .contents #gallery #jdxc h3 {
    /* 上-22 左645 */
    width: 49.0rem;
    left: 40.68441064638783%;
    top: -3.259259259259259%;
}
.company-office .contents #gallery #jdxc h3::before {
    height: 49.0rem;
    right: 0;
}
.company-office .contents #gallery #jdxc h3::after {
    width: 49.0rem;
    left: 0;
}

/* 食堂 1130×650 */
.company-office .contents #gallery #dining {
    height: calc(100vw * 650 / 1600);
    max-height: 65.0rem;
    margin-left: 20.14134275618375%;
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery p#image-dining {
    /* 幅885 上-90 左0 */
    width: 78.31858407079646%;
    position: absolute;
    left: 0;
    top: -13.84615384615385%;
    z-index: 1;
}
.company-office .contents #gallery #dining p.description {
    background: url("/saiyou/image/company/office/balloon-dining.png") no-repeat center center / cover;
    padding-right: 0.4rem;
    /* 上170 左-185 */
    left: -16.3716814159292%;
    top: 26.15384615384615%;
}
.company-office .contents #gallery #dining p.path {
    /* 幅376 上265 左516 */
    width: 33.27433628318584%;
    left: 45.39823008849558%;
    top: 40.76923076923077%;
    z-index: 2;
}
.company-office .contents #gallery #dining h3 {
    /* 上-32 左-50 */
    left: -4.424778761061947%;
    top: -4.923076923076923%;
}
.company-office .contents #gallery #dining h3::before {
    right: 0;
}
.company-office .contents #gallery #dining h3::after {
    right: 0;
}

/* 図書室 1250×800 */
.company-office .contents #gallery #multi {
    height: calc(100vw * 800 / 1600);
    max-height: 80.0rem;
    margin-left: 11.66077738515901%;
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery p#image-multi {
    /* 幅700 上90 左380 */
    width: 56%;
    position: absolute;
    left: 30.4%;
    top: 11.25%;
    z-index: 1;
}
.company-office .contents #gallery #multi p.description {
    background: url("/saiyou/image/company/office/balloon-multi.png") no-repeat center center / cover;
    /* 上100 左120 */
    left: 9.6%;
    top: 12.5%;
}
.company-office .contents #gallery #multi p.path {
    /* 幅516 上376 左30 */
    width: 41.28%;
    left: 2.4%;
    top: 47%;
    z-index: 2;
}
.company-office .contents #gallery #multi h3 {
    /* 上145 左864 */
    width: 26.5rem;
    left: 69.12%;
    top: 18.125%;
}
.company-office .contents #gallery #multi h3::before {
    height: 26.5rem;
    left: 0;
}
.company-office .contents #gallery #multi h3::after {
    width: 26.5rem;
    left: 0;
}

/* 眺望 1315×520 */
.company-office .contents #gallery #view {
    height: calc(100vw * 520 / 1600);
    max-height: 52.0rem;
    margin-left: 7.067137809187279%;
    position: relative;
    box-sizing: border-box;
}
.company-office .contents #gallery p#image-view {
    /* 幅694 上-90 左0 */
    width: 52.77566539923954%;
    position: absolute;
    left: 0;
    top: -17.30769230769231%;
    z-index: 1;
}
.company-office .contents #gallery #view p.description {
    background: url("/saiyou/image/company/office/balloon-view.png") no-repeat center center / cover;
    padding-left: 2.0rem;
    /* 上55 左740 */
    left: 57.03422053231939%;
    top: 10.57692307692308%;
}
.company-office .contents #gallery #view p.path {
    /* 幅628 上230 左615 */
    width: 47.75665399239544%;
    left: 46.7680608365019%;
    top: 44.23076923076923%;
    z-index: 2;
}
.company-office .contents #gallery #view h3 {
    /* 上-32 左580 */
    width: 33.0rem;
    left: 44.106463878327%;
    top: -6.153846153846154%;
}
.company-office .contents #gallery #view h3::before {
    height: 33.0rem;
    right: 0;
}
.company-office .contents #gallery #view h3::after {
    width: 33.0rem;
    right: 0;
}

/* ────────────────────── *
 *                                              *
 * 鉄が生まれる現場                             *
 *                                              *
 * ────────────────────── */

.company-onsite .contents .inner {
    width: 84.0rem;
    margin: 0 auto;
}
.company-onsite .contents .inner h2 {
    font-size: 3.2rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 1.5rem;
}
.company-onsite .contents .inner h3 {
    font-size: 2.4rem;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding-left: 2.0rem;
    margin-bottom: 4.0rem;
    position: relative;
}
.company-onsite .contents .inner h3::before {
    content: "";
    background : -moz-linear-gradient(50% 100% 90deg,rgba(240, 40, 50, 1) 0%,rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-gradient(linear,50% 100% ,50% 0% ,color-stop(0,rgba(240, 40, 50, 1) ),color-stop(0.9996,rgba(0, 110, 225, 1) ));
    background : -o-linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -ms-linear-gradient(90deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F02832', endColorstr='#006EE1' ,GradientType=0)";
    background : linear-gradient(0deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006EE1',endColorstr='#F02832' , GradientType=0);
    width: 0.4rem;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}
.company-onsite .contents .inner p.en {
    font-family: "Manrope", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    color: #006ee1;
    letter-spacing: 0.05em;
    text-align: center;
    margin-bottom: 6.0rem;
}
.company-onsite .contents .inner p.txt {
    font-size: 1.6rem;
    line-height: 1.875;
    text-align: justify;
}
.company-onsite .contents .inner p#btn-virtual {
    font-size: 2.0rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: 0.3em;
    width: 51.0rem;
    height: 9.0rem;
    margin: 10.0rem auto 0;
    position: relative;
}
.company-onsite .contents .inner p#btn-virtual a {
    background : -moz-linear-gradient(20.59% -116.67% -45deg,rgba(240, 40, 50, 1) 0%,rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-linear-gradient(-45deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    background : -webkit-gradient(linear,20.59% -116.67% ,79.41% 216.67% ,color-stop(0,rgba(240, 40, 50, 1) ),color-stop(0.9996,rgba(0, 110, 225, 1) ));
    background : linear-gradient(135deg, rgba(240, 40, 50, 1) 0%, rgba(0, 110, 225, 1) 99.96%);
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    transition: opacity .5s;
}
.company-onsite .contents .inner p#btn-virtual a:hover {
    opacity: 0.6;
}
.company-onsite .contents .inner p#btn-virtual a::after {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0.5rem 0 0.5rem 1.0rem;
    border-color: transparent transparent transparent #ffffff;
    position: absolute;
    right: 5.0rem;
    top: 50%;
    transform: translateY(-50%);
}
.company-onsite .contents #process .section-title {
    color: #fff;
    background: url("/saiyou/image/company/onsite/bg-section-process.jpg") no-repeat center center / cover;
    width: 100%;
    height: 44.0rem;
    margin-top: 13.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;
}
.company-onsite .contents #process .section-title h2 {
    font-size: 3.2rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 1.5rem;
}
.company-onsite .contents #process .section-title p.en {
    font-family: "Manrope", sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-align: center;
}
.company-onsite .contents #process .block {
    position: relative;
}
.company-onsite .contents #process .block.odd {
}
.company-onsite .contents #process .block.even {
    background: #ebedf0;
}
.company-onsite .contents #process .block .inner {
    width: 124.0rem;
    height: 78.0rem;
    padding: 0 7.0rem;
    margin: 0 auto;
    position: relative;
}
.company-onsite .contents #process .block#process-01 .inner {
    background: #fff;
    margin-top: -13.0rem;
}
.company-onsite .contents #process .block#process-03 .inner {
    height: 90.0rem;
}
.company-onsite .contents #process .block#process-08 .inner {
    height: 56.0rem;
}
.company-onsite .contents #process .block#process-01 .inner p#process-base {
    width: 61.4rem;
    position: absolute;
    left: 8.0rem;
    top: 0;
    z-index: 5;
}
.company-onsite .contents #process .block#process-01 .inner p#process-line {
    width: 61.4rem;
    position: absolute;
    left: 8.0rem;
    top: 0;
    z-index: 3;
}
.company-onsite .contents #process .block .inner p.process-line-active {
    width: 61.4rem;
    height: 0;
    position: absolute;
    left: 8.0rem;
    top: 0;
    z-index: 4;
    overflow: hidden;
}
.company-onsite .contents #process .block .inner p.process-line-active img {
    width: 61.4rem;
    height: 78.0rem;
    position: absolute;
    left: 0;
    top: 0;
}
.company-onsite .contents #process .block#process-03 .inner p.process-line-active img {
    height: 90.0rem;
}
.company-onsite .contents #process .block#process-08 .inner p.process-line-active img {
    height: 56.0rem;
}
.company-onsite .contents #process .block .inner .right {
    width: 42.0rem;
    height: 100%;
    margin-left: auto;
    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;
}
.company-onsite .contents #process .block .inner .right h3 {
    font-size: 2.4rem;
}
.company-onsite .contents #process .block .inner .right p.txt {
    font-feature-settings: "palt" 1;
    letter-spacing: 0.05em;
}
.company-onsite .contents #process .block .inner .right p.illust {
    display: none;
}
.company-onsite .contents #process .block .inner .right dl.photo {
    width: 40.0rem;
    margin: 4.0rem auto 0;
    position: relative;
}
.company-onsite .contents #process .block .inner .right dl.photo dd {
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    width: 24.0rem;
    margin: -5.0rem auto 0;
    position: relative;
}
.company-onsite .contents #process .block .inner .right dl.photo dd a {
    background: #fff;
    vertical-align: middle;
    display: table-cell;
    width: 24.0rem;
    height: 7.0rem;
    padding-right: 2.0rem;
    border: 0.2rem solid #363746;
    border-radius: 1.0rem;
    box-shadow: 0 0.4rem 0 rgba(0,0,0,0.1);
    box-sizing: border-box;
}
.company-onsite .contents #process .block .inner .right dl.photo dd a::after {
    content: "";
    background: url("/saiyou/image/company/onsite/icon-zoom.png") no-repeat center center / cover;
    width: 3.6rem;
    height: 3.6rem;
    position: absolute;
    right: 3.6rem;
    top: 50%;
    transform: translateY(-50%);
}
.company-onsite .contents .modal {
    display: none;
}
.process-modal .modaal-container {
    background: #fff;
    width: 100.4rem;
    max-width: 1004px;
    border: 0.2rem solid #363746;
}
.process-modal .modaal-container button {
    background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
}
.process-modal .modaal-container button.slick-arrow {
    width: 4.0rem;
    position: absolute;
    top: 20.0rem;
}
.process-modal .modaal-container button.slick-arrow.slick-prev {
    left: -10.0rem;
}
.process-modal .modaal-container button.slick-arrow.slick-next {
    right: -10.0rem;
}
.process-modal .modaal-container ul.slick-dots {
    font-size: 0;
    line-height: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.process-modal .modaal-container ul.slick-dots li {
    margin: 0 0.6rem;
}
.process-modal .modaal-container ul.slick-dots li button {
    font-size: 0;
    background: #fff;
    text-indent: -9999px;
    width: 0.8rem;
    height: 0.8rem;
    border: 1px solid rgba(54, 55, 70, 0.75);
    border-radius: 100%;
    box-sizing: border-box;
}
.process-modal .modaal-container ul.slick-dots li.slick-active button {
    background: #006ee1;
}
.process-modal .modaal-container .modaal-close {
    background: url("/saiyou/image/company/onsite/btn-close.png") no-repeat center center / cover;
    width: 6.4rem;
    height: 1.3rem;
    position: absolute;
    right: 3.0rem;
    top: 2.5rem;
    border-radius: 0;
}
.process-modal .modaal-container .modaal-close::before,
.process-modal .modaal-container .modaal-close::after {
    content: none;
}
.process-modal .modaal-container .modaal-close span {
    font-size: 0;
    clip: auto;
    padding: 0;
    margin: 0;
}
.process-modal .modaal-container .modaal-content-container {
    padding: 7.5rem 15.5rem;
}
.process-modal .modaal-container .modaal-content-container dl {
    margin-bottom: 2.0rem;
}
.process-modal .modaal-container .modaal-content-container dl dd {
    font-size: 1.5rem;
    margin-top: 1.0rem;
}