@charset "utf-8";

/*
 * style.css
 *
 *  version --- 1.0
 *  updated --- 2017/11/30
 */

/* !Root
---------------------------------------------------------- */
:root {
    --black: #000;
    --blue: #3459D5;
    --white: #fff;
    --green: #06C755;
    --gray: #D7D8D9;
}

/* !HTML5 elements
---------------------------------------------------------- */
header, 
footer, 
nav, 
section, 
aside, 
article {
    display: block;
}

/* !Reseting
---------------------------------------------------------- */
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;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

fieldset {
  border: none;
}

ul,
ol,
li {
	list-style: none;
}

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

table {
	border-collapse: collapse;
}

button {
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

select::-ms-expand {
	display: none;
}

input[type=radio]::-ms-check,
input[type=checkbox]::-ms-check{
	display: none;
}


/*input[type=radio],
input[type=checkbox],*/
select,
input[type=text],
input[type=password],
input[type=email],
input[type=date],
input[type=number],
input[type=reset],
input[type=button],
input[type=submit],
textarea {
	appearance: none;
	border-radius: 0;
	font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    color: var(--black);
}

input[type=text]::-ms-clear,
input[type=tel]::-ms-clear,
input[type=number]::-ms-clear{
	display: none;
}

input[type=reset],
input[type=button],
input[type=submit]  {
	font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
	cursor: pointer;
}

*,
*:before,
*::after {
	box-sizing: border-box;
}
/* !Clearfix
---------------------------------------------------------- */
.clearfix {
    display: block;
    min-height: 1%;
}

.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
}

* html .clearfix {
    height: 1%;
}

/* !Layout
---------------------------------------------------------- */
html {
    overflow-y: scroll;
    font-size: 62.5%;
}

html.no-move {
    overflow: hidden;
}

/*** タブレット 768x ~ 1200px***/
@media screen and (min-width: 768px) and (max-width: 1240px) {
    html {
        font-size: calc(100vw / 124);
    }
}

/*** スマホ 320px ~ 767px***/
@media screen and (max-width: 767px) {
    html {
        font-size: 62.5%;
    }
}

body {
    font-family: YakuHanJP, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    font-size: 1.6rem;
    -webkit-text-size-adjust: none;
    line-height: 1.5;
    font-weight: normal;
    color: var(--black);
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* !Base Fonts -------------------------------------------------------------- */
a {
    color: var(--black);
    text-decoration: none;
}

/*** hover ***/
@media screen and (min-width: 960px) {
    a {
        transition: all 0.5s;
    }

    a:hover {
        text-decoration: underline;
    }

    .op {
        transition: opacity 0.5s ease-out;
    }

    .op:hover {
        opacity: .7;
        text-decoration: none;
    }

    a[href^="tel:"] {
        cursor: default;
        pointer-events:none;
    }
}

/*** 非スマホ 768px ~ ***/
@media screen and (min-width: 768px) {
    .is-sp {
        display: none;
    }
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .is-pc {
        display: none;
    }
}

.is-hide {
    display: none;
}

.wow {
    opacity: 0;
}

/* !wrapper
---------------------------------------------------------- */
#wrapper {
    width: 100%;
    background: var(--gray);
    padding-top: 12.6rem;
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    #wrapper {
        padding-top: 8.6rem;
    }
}

/* !header
---------------------------------------------------------- */
#header {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    width: 100%;
    padding: 4rem 0;
}

.header-inner {
    width: 100%;
    position: relative;
}

.header-logo {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    z-index: 2;
    width: 38.4rem;
    font-size: 1px;
    line-height: 1;
}

.header-logo  img {
    width: 100%;
}

.btn-menu {
    display: none;
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    #header {
        padding: 0;
        text-align: center;
    }

    #header .inner {
        padding: 0;
    }

    .header-inner {
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 2.7rem 0;
    }

    .header-logo {
        position: relative;
        left: 0;
        top: 0;
        transform: translateX(0);
        width: 27rem;
    }

    .btn-menu {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        gap: .9rem;
        width: 6rem;
        height: 4.6rem;
        position: fixed;
        right: 0;
        top: 2rem;
        z-index: 3;
    }

    .btn-menu:before,
    .btn-menu:after {
        content: '';
        width: 3.6rem;
        height: .3rem;
        background: var(--blue);
        transition: all .5s;
    }

    .btn-menu.is-active:before {
        transform: translateY(.6rem) rotate(45deg);
        background: var(--white);
    }
    .btn-menu.is-active:after {
        transform: translateY(-.6rem) rotate(-45deg);
        background: var(--white);
    }
}

/* !global navigation
---------------------------------------------------------- */
#g-navi {
    width: 100%;
}

#g-navi .g-navi__menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#g-navi .g-navi__menu ul {
    display: flex;
    align-items: center;
    gap: 5rem;
}

#g-navi .g-navi__menu li a {
    font-size: 1.8rem;
    letter-spacing: .1em;
    line-height: 1.5;
    font-weight: bold;
    color: var(--blue);
}

/*** hover ***/
@media screen and (min-width: 960px) {}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    #g-navi {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: 8rem 0 0;
        position: fixed;
        left: 0;
        top: 0;
        z-index: 2;
        width: 100%;
        height: 100dvh;
        background: var(--blue);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        transition: opacity .5s ease, visibility .5s ease;
    }

    #g-navi.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    #g-navi .g-navi__logo {
        text-align: center;
        font-size: 1px;
        line-height: 1;
        margin-bottom: 2.8rem;
    }

    #g-navi .g-navi__logo a {
        display: inline-block;
        width: 30.4rem;
    }

    #g-navi .g-navi__menu {
        flex-direction: column;
        justify-content: flex-start;
        flex-grow: 1;
        position: relative;
        padding-bottom: 20rem;
        width: 100%;
    }

    #g-navi .g-navi__menu:after {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        z-index: 2;
        height: 13.5rem;
        display: block;
        background: url(../img/common/img_copy_white.svg) center center no-repeat;
        background-size: auto 100%;
        content: '';
    }

    #g-navi .g-navi__menu ul {
        display: block;
    }

    #g-navi .g-navi__menu ul li {
        margin-top: 2rem;
        text-align: center;
        font-size: 1px;
        line-height: 1;
    }

    #g-navi .g-navi__menu li a {
        color: var(--white);
        display: inline-block;
        position: relative;
    }

    #g-navi .g-navi__menu li a span {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 17.8rem;
        height: 5.3rem;
    }

    #g-navi .g-navi__menu li a:before,
    #g-navi .g-navi__menu li a:after,
    #g-navi .g-navi__menu li a span:before,
    #g-navi .g-navi__menu li a span:after {
        width: 1.3rem;
        height: 1.3rem;
        border-left: .5rem solid var(--white);
        border-top: .5rem solid var(--white);
        position: absolute;
        content: '';
        z-index: 2;
        opacity: 0;
    }

    #g-navi .g-navi__menu li a:before {
        left: 0;
        top: 0;
    }

    #g-navi .g-navi__menu li a:after {
        right: 0;
        top: 0;
        transform: scaleX(-1);
    }

    #g-navi .g-navi__menu li a span:before {
        left: 0;
        bottom: 0;
        transform: scaleY(-1);
    }

    #g-navi .g-navi__menu li a span:after {
        right: 0;
        bottom: 0;
        transform: scale(-1,-1);
    }

    #about #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(1) a:before,
    #about #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(1) a:after,
    #about #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(1) a span:before,
    #about #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(1) a span:after,
    #works #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(2) a:before,
    #works #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(2) a:after,
    #works #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(2) a span:before,
    #works #g-navi .g-navi__menu ul:nth-child(1) li:nth-child(2) a span:after,
    #recruit #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(1) a:before,
    #recruit #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(1) a:after,
    #recruit #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(1) a span:before,
    #recruit #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(1) a span:after,
    #contact #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(2) a:before,
    #contact #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(2) a:after,
    #contact #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(2) a span:before,
    #contact #g-navi .g-navi__menu ul:nth-child(2) li:nth-child(2) a span:after {
        opacity: 1;
    }
}

/* !breadcrumb
---------------------------------------------------------- */
#breadcrumb {}

/*** hover ***/
@media screen and (min-width: 960px) {}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){}

/* !main Visual
---------------------------------------------------------- */
#main-visual {
    width: 100%;
    height: 100vh;
    min-height: 76.8rem;
    padding: 6.4rem;
}

#main-visual .mv-inner {
    width: 100%;
    height: 100%;
    position: relative;
}

#main-visual .mv-image,
#main-visual .mv-image .swiper {
    width: 100%;
    height: 100%;
}

#main-visual .mv-inner:before,
#main-visual .mv-inner:after,
#main-visual .mv-inner .mv-image:before,
#main-visual .mv-inner .mv-image:after {
    width: 17rem;
    height: 12.5rem;
    border-left: 4rem solid var(--blue);
    border-top: 4rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
    transition: opacity 1s;
}

#main-visual .mv-inner:before {
    left: -2rem;
    top: -2rem;
}

#main-visual .mv-inner:after {
    right: -2rem;
    top: -2rem;
    transform: scaleX(-1);
}

#main-visual .mv-inner .mv-image:before {
    left: -2rem;
    bottom: -2rem;
    transform: scaleY(-1);
}

#main-visual .mv-inner .mv-image:after {
    right: -2rem;
    bottom: -2rem;
    transform: scale(-1,-1);
}

#main-visual.is-start .mv-inner:before,
#main-visual.is-start .mv-inner:after,
#main-visual.is-start .mv-inner .mv-image:before,
#main-visual.is-start .mv-inner .mv-image:after {
    opacity: 0;
}

#main-visual .mv-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#main-visual .mv-copy {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 5.1rem;
    line-height: 1.45;
    color: var(--white);
    letter-spacing: .05em;
    text-align: center;
    font-weight: bold;
    text-shadow: 0 0 2rem rgba(0, 0, 0, .82);
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    #main-visual {
        height: calc(100vh - 8.6rem);
        min-height: calc(64rem - 8.6rem);
        padding: 2.8rem 2rem;
    }

    #main-visual .mv-inner:before,
    #main-visual .mv-inner:after,
    #main-visual .mv-inner .mv-image:before,
    #main-visual .mv-inner .mv-image:after {
        width: 6.6rem;
        height: 6.5rem;
        border-left: 2rem solid var(--blue);
        border-top: 2rem solid var(--blue);
    }

    #main-visual .mv-inner:before {
        left: -1rem;
        top: -1rem;
    }

    #main-visual .mv-inner:after {
        right: -1rem;
        top: -1rem;
    }

    #main-visual .mv-inner .mv-image:before {
        left: -1rem;
        bottom: -1rem;
    }

    #main-visual .mv-inner .mv-image:after {
        right: -1rem;
        bottom: -1rem;
    }

    #main-visual .mv-copy {
        font-size: 2.7rem;
    }
}

/* !teaser
---------------------------------------------------------- */
#teaser {
    width: 100%;
}

#teaser .teaser-heading {
    padding: 12rem 0 10rem;
    text-align: center;
}

#teaser .page-title {
    display: inline-block;
    position: relative;
}

#teaser .page-title .page-title__inner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 54.5rem;
    height: 20.6rem;
}

#teaser .page-title:before,
#teaser .page-title:after,
#teaser .page-title .page-title__inner:before,
#teaser .page-title .page-title__inner:after {
    width: 4.5rem;
    height: 3.5rem;
    border-left: 1.5rem solid var(--blue);
    border-top: 1.5rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

#teaser .page-title:before {
    left: 0;
    top: 0;
}

#teaser .page-title:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

#teaser .page-title .page-title__inner:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

#teaser .page-title .page-title__inner:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

#teaser .page-title .page-title__jap {
    font-size: 1.8rem;
    letter-spacing: .1em;
    line-height: 1.5;
    font-weight: bold;
}
.page-title__jap_sub {
	color: var(--blue);
}
.page-about #teaser .page-title .page-title__eng img {
    width: 29.532rem;
}

.page-contact #teaser .page-title .page-title__eng img {
    width: 41.311rem;
}

.page-works #teaser .page-title .page-title__eng img {
    width: 32.077rem;
}

#teaser .teaser-image {
    width: 100%;
    height: 52.8rem;
    overflow: hidden;
}

#teaser .teaser-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.page-recruit #teaser .page-title .page-title__inner {
    width: auto;
    height: 18.8rem;
    padding: 0 8rem;
}

.page-recruit #teaser .page-title .page-title__jap {
    font-size: 3.1rem;
    color: var(--blue);
}

.page-recruit #teaser .teaser-image {
    height: auto;
}

/*** hover ***/
@media screen and (min-width: 960px) {}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){

    #teaser .teaser-heading {
        padding: 6rem 2rem 5rem;
    }

    #teaser .page-title {
        display: block;
    }

    #teaser .page-title .page-title__inner {
        width: 100%;
        height: 15rem;
    }

    #teaser .page-title:before,
    #teaser .page-title:after,
    #teaser .page-title .page-title__inner:before,
    #teaser .page-title .page-title__inner:after {
        width: 4rem;
        height: 3.2rem;
        border-left-width: 1.5rem;
        border-top-width: 1.5rem;
    }

    #teaser .page-title .page-title__jap {
        font-size: 2rem;
    }

    .page-about #teaser .page-title .page-title__eng img {
        width: 23.6256rem;
    }

    .page-contact #teaser .page-title .page-title__eng img {
        width: 27.26526rem;
    }

    .page-works #teaser .page-title .page-title__eng img {
        width: 25.6616rem;
    }

    #teaser .teaser-image {
        height: 19.2rem;
    }

    .page-recruit #teaser .page-title .page-title__inner {
        width: auto;
        height: 25.4rem;
        padding: 0 2rem;
    }

    .page-recruit #teaser .page-title .page-title__jap {
        font-size: 2.5rem;
        line-height: 1.68;
    }

    .page-recruit #teaser .teaser-image {
        height: auto;
    }
}

/* !contents
---------------------------------------------------------- */
#contents {}

.inner {
    width: 100%;
    max-width: 124rem;
    padding: 0 2rem;
    margin: 0 auto;
}

/*** hover ***/
@media screen and (min-width: 960px) {}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){}

/* !page Top
---------------------------------------------------------- */
.page-top {}

/*** hover ***/
@media screen and (min-width: 960px) {}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){}

/* !footer
---------------------------------------------------------- */
#footer {
    background: url(../img/common/bg_footer.jpg) center center no-repeat;
    background-size: cover;
}

.footer-inner {
    padding: 20.4rem 0 23.1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 2rem;
    line-height: 1.45;
    font-weight: 500;
    letter-spacing: .1em;
    color: var(--white);
}

.footer-logo {
    width: 38.4rem;
    line-height: 1px;
    font-size: 1px;
    margin-bottom: 8rem;
}

.footer-logo img {
    width: 100%;
}

.footer-address {
    margin-block: 2.5rem;
}

.footer-tel a {
    color: var(--white);
}

.footer-links {
    margin-top: 9rem;
}

#copyright {
    padding: 4.2rem 0;
    font-size: 1.4rem;
    color: var(--white);
    line-height: 1.5;
    text-align: center;
}

/*** hover ***/
@media screen and (min-width: 960px) {}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){

    .footer-inner {
        padding: 11rem 0 6.2rem;
    }

    .footer-logo {
        width: 31.581rem;
    }

    #copyright {
        padding: 3rem 0;
    }
}

/* !link
---------------------------------------------------------- */
.btn-links {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 1.2rem;
    padding: 2.1rem 4.2rem 2.4rem;
    border-radius: 2.2rem;
    background: var(--blue);
    color: var(--white);
    font-size: 2.5rem;
    font-weight: 500;
    line-height: 1.44;
    border: .2rem solid var(--blue);
}

.btn-links:after {
    width: 2.4rem;
    height: 2.2rem;
    content: '';
    background: url(../img/common/arrow_right_white.svg) center center no-repeat;
    background-size: 100% 100%;
    transition: background-image .5s ease;
}

/*** hover ***/
@media screen and (min-width: 960px) {
    .btn-links:hover {
        text-decoration: none;
        background: var(--white);
        color: var(--blue);
    }
    .btn-links:hover:after {
        background-image: url(../img/common/arrow_right_blue.svg);
    }
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .btn-links {
        padding: 2.5rem 3rem;
        font-size: 2rem;
        line-height: 1.45;
        border-width: .1rem;
    }
}

/* !heading
---------------------------------------------------------- */
.heading-large {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 5rem;
}

.heading-large .heading-large__eng {
    display: block;
    font-size: 1px;
    line-height: 1px;
}

.heading-large .heading-large__eng img {
    width: 100%;
}

.heading-large .heading-large__jap {
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: bold;
    letter-spacing: .1em;
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .heading-large {
        margin-bottom: 5rem;
    }

    .heading-large .heading-large__jap {
        font-size: 2rem;
        line-height: 1.45;
    }
}

/* !js
---------------------------------------------------------- */
.js-image-scroll {
    overflow: hidden;
    display: flex;
}
.js-image-scroll ul {
    display: flex;
    align-items: center;
}
.js-image-scroll ul:nth-child(odd) {
    animation-name: image-loop-left1;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
.js-image-scroll ul:nth-child(even) {
    animation-name: image-loop-left2;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
@keyframes image-loop-left1 {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}
@keyframes image-loop-left2 {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-200%);
    }
}

/* !柳昌建設を知る
---------------------------------------------------------- */
.heading-large .heading-large__eng.is-company {
    width: 100%;
    max-width: 43.327rem;
}

.heading-large .heading-large__eng.is-history {
    width: 100%;
    max-width: 38.745rem;
}

.heading-large .heading-large__eng.is-access {
    width: 100%;
    max-width: 33.311rem;
}

.about-wrap {
    padding: 16.8rem 0 0;
}

.company-wrap {
    padding: 0 0 21rem;
}

.history-wrap {
    padding: 0 0 27.8rem;
}

.table-list .table-list__item {
    display: flex;
    gap: 3.5rem;
}

.table-list .table-list__item dt {
    width: 25.1rem;
    min-width: 25.1rem;
    text-align: center;
    font-size: 2rem;
    line-height: 2;
    font-weight: bold;
    letter-spacing: .1em;
    color: var(--blue);
    position: relative;
    padding: 4rem 0;
}

.table-list .table-list__item dt:before {
    width: 100%;
    height: .3rem;
    background: var(--blue);
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
    transform: translateY(.1rem);
}

.table-list .table-list__item dd {
    padding: 4rem 4.8rem;
    flex-grow: 1;
    font-size: 2rem;
    line-height: 2;
    font-weight: 500;
    letter-spacing: .1em;
    position: relative;
}

.table-list .table-list__item dd:before {
    width: 100%;
    height: .1rem;
    background: var(--white);
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
}

.access-wrap {
    padding: 0 0 23rem;
}

.access-wrap .access-item + .access-item {
    margin-top: 6rem;
}

.access-wrap .access-map {
    width: 100%;
    aspect-ratio: 2 / 1;
    overflow: hidden;
}

.access-wrap .access-map iframe {
    width: 100%;
    height: 100%;
    object-fit: center;
}

.access-wrap .access-links {
    text-align: center;
    margin-top: 6rem;
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .heading-large .heading-large__eng.is-company {
        max-width: 28.59582rem;
    }

    .heading-large .heading-large__eng.is-history {
        max-width: 25.5717rem;
    }

    .heading-large .heading-large__eng.is-access {
        max-width: 21.98526rem;
    }

    .about-wrap {
        padding: 10rem 0 0;
    }

    .company-wrap {
        padding: 0 0 10rem;
    }

    .history-wrap {
        padding: 0 0 10rem;
    }

    .table-list .table-list__item {
        gap: 1.6rem;
    }

    .table-list .table-list__item dt {
        width: 8.05rem;
        min-width: 8.05rem;
        font-size: 1.4rem;
        line-height: 1.714;
        padding: 2.7rem 0;
    }

    .table-list .table-list__item dd {
        padding: 2.7rem 1rem;
        font-size: 1.6rem;
        line-height: 1.5;
    }

    .access-wrap {
        padding: 0 0 10rem;
    }

    .access-wrap .access-item + .access-item {
        margin-top: 4rem;
    }

    .access-wrap .access-map {
        aspect-ratio: 1 / 1;
    }

    .access-wrap .access-links {
        margin-top: 4rem;
    }
}

/* !お問い合わせ
---------------------------------------------------------- */
.contact-wrap {
    padding: 15rem 0;
}

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 5rem;
}

.contact-form .contact-item {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 4rem;
}

.contact-form .contact-item dt {
    width: 21rem;
    min-width: 21rem;
    text-align: right;
    font-size: 2rem;
    letter-spacing: .1em;
    font-weight: bold;
    color: var(--blue);
    line-height: 2;
    padding: 1.6rem 0;
}

.contact-form .contact-item dd {
    flex-grow: 1;
}

.contact-form input[type=text],
.contact-form input[type=email],
.contact-form input[type=tel],
.contact-form input[type=date],
.contact-form textarea {
    width: 100%;
    height: 7.2rem;
    border: 0;
    border-radius: 0;
    background: var(--white);
    padding: 0 4rem;
    font-size: 2rem;
    letter-spacing: .1em;
    line-height: 2;
    font-weight: 500;
    outline: none;
}

.contact-form textarea {
    height: 36rem;
    padding: 1.6rem 4rem;
    resize: vertical;
}

.contact-privacy {
    margin-top: 12rem;
}

.contact-privacy h2 {
    text-align: center;
    font-size: 2rem;
    line-height: 1.45;
    letter-spacing: .1em;
    font-weight: bold;
    color: var(--blue);
    margin-bottom: 3.5rem;
}

.contact-privacy .contact-privacy__overscroll {
    width: 100%;
    height: 21.6rem;
    border: .1rem solid #707070;
    background: #fff;
    padding: 4rem;
    font-size: 2rem;
    line-height: 1.45;
    letter-spacing: .1em;
    font-weight: 500;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.contact-agree {
    text-align: center;
    margin-top: 5rem;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: .1em;
}

.contact-agree label {
    cursor: pointer;
}

.contact-submit {
    margin-top: 16rem;
    text-align: center;
}

.contact-submit input[type=submit] {
    width: 30rem;
    height: 8rem;
    border-radius: 2.2rem;
    font-size: 2.5rem;
    font-weight: 500;
    letter-spacing: .05em;
    border: .1rem solid var(--blue);
    background: url(../img/common/arrow_right_white.svg) right 4.2rem center no-repeat var(--blue);
    background-size: 2.4rem auto;
    color: var(--white);
    cursor: pointer;
    transition: all .5s;
}



.page-contact .recruit-message .recruit-message__inner {
    padding-top: 15rem;
}

/*** hover ***/
@media screen and (min-width: 960px) {
    .contact-submit input[type=submit]:hover {
        background-image: url(../img/common/arrow_right_blue.svg);
        background-color: var(--white);
        color: var(--blue);
    }
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .contact-wrap {
        padding: 5rem 0 10rem;
    }

    .contact-form {
        gap: 3rem;
    }

    .contact-form .contact-item {
        flex-direction: column;
        gap: 1rem;
    }

    .contact-form .contact-item dt {
        width: 100%;
        min-width: unset;
        text-align: left;
        font-size: 1.8rem;
        line-height: 1.5;
        padding: 0;
    }

    .contact-form .contact-item dd {
        width: 100%;
    }

    .contact-form input[type=text],
    .contact-form input[type=email],
    .contact-form input[type=tel],
    .contact-form input[type=date],
    .contact-form textarea {
        height: 6.4rem;
        padding: 0 2rem;
        font-size: 1.8rem;
        line-height: 1.5;
    }

    .contact-form textarea {
        height: 24rem;
        padding: 1rem 2rem;
    }

    .contact-privacy {
        margin-top: 6rem;
    }

    .contact-privacy .contact-privacy__overscroll {
        height: 21.6rem;
        padding: 2rem;
        font-size: 1.6rem;
    }

    .contact-submit {
        margin-top: 8rem;
    }

    .contact-submit input[type=submit] {
        width: 30rem;
        height: 8rem;
        border-radius: 2.2rem;
        font-size: 2.5rem;
        font-weight: 500;
        letter-spacing: .05em;
        border: .1rem solid var(--blue);
        background: url(../img/common/arrow_right_white.svg) right 4.2rem center no-repeat var(--blue);
        background-size: 2.4rem auto;
        color: var(--white);
        cursor: pointer;
        transition: all .5s;
    }

    .page-contact .recruit-message .recruit-message__inner {
        padding-top: 15rem;
    }
}

/* !仕事を見てみる
---------------------------------------------------------- */
.works-message {
    padding: 28rem 0 33rem;
    font-size: 3rem;
    line-height: 4;
    text-align: center;
    font-weight: bold;
}

.works-message h2 {
    font-size: 4rem;
    line-height: 3;
    color: var(--blue);
}

.works-case .works-case__item {
    margin-bottom: 35rem;
}

.works-case .works-case__block {
    display: flex;
    align-items: flex-start;
}

.works-case .works-case-image {
    width: 74.3rem;
}

.works-case .works-case-image img {
    width: 100%;
}

.works-case .works-case-box {
    width: calc(100% - 74.3rem);
    font-size: 2.5rem;
    line-height: 2;
    font-weight: 500;
    letter-spacing: .1em;
    position: relative;
    z-index: 2;
}

.works-case .works-case-title {
    position: relative;
    margin-bottom: 11rem;
    width: 55rem;
    margin-top: -10.4rem;
}

.works-case .works-case-title span {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: 4rem;
    line-height: 1.45;
    font-weight: bold;
    letter-spacing: .1em;
    color: var(--blue);
    width: 100%;
    height: 24.5rem;
}

.works-case .works-case-title:before,
.works-case .works-case-title:after,
.works-case .works-case-title span:before,
.works-case .works-case-title span:after {
    width: 4.5rem;
    height: 3.5rem;
    border-left: 1.5rem solid var(--blue);
    border-top: 1.5rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.works-case .works-case-title:before {
    left: 0;
    top: 0;
}

.works-case .works-case-title:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.works-case .works-case-title span:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.works-case .works-case-title span:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.works-case .works-case__map {
    margin-top: 10.65rem;
    width: 100%;
    aspect-ratio: 640 / 180;
}

.works-case .works-case__map img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.works-case .works-case__map iframe {
    width: 100%;
    height: 100%;
}

.works-mainimg {
    margin-bottom: 15.2rem;
    width: 100%;
    position: relative;
}

.works-mainimg .works-mainimg__image {
    width: 100%;
    position: relative;
    z-index: 1;
}

.works-mainimg .works-mainimg__image:before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    content: '';
    background: #838383;
    mix-blend-mode: multiply;
    isolation: isolate
}

.works-mainimg .works-mainimg__image img {
    width: 100%;
}

.works-mainimg .works-mainimg__caption {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    font-size: 4rem;
    font-weight: bold;
    color: var(--white);
    line-height: 1.45;
    letter-spacing: .1em;
}

.works-technology {
    padding-bottom: 25.6rem;
}

.works-technology .works-technology__head {
    margin-bottom: 17.5rem;
    text-align: center;
    font-size: 3rem;
    line-height: 2.33;
    font-weight: bold;
    letter-spacing: .1em;
}

.works-technology .works-technology-cate {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7.5rem;
    margin-bottom: 7.5rem;
}

.works-technology .works-technology-cate li {
    border: .5rem solid #3459D5;
    font-size: 4rem;
    line-height: 1.45;
    font-weight: bold;
    color: var(--blue);
    letter-spacing: .1em;
    padding: 0 2.4rem;
}

.works-technology .works-technology__list {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 3.7rem;
}

.works-technology .works-technology__list li {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 2.8rem;
    font-size: 2rem;
    line-height: 2.5;
    font-weight: 500;
    letter-spacing: .1em;
    width: 100%;
}

.works-technology .works-technology__list li:nth-child(2) {
    margin-top: 18.7rem;
}

.works-technology .works-technology__list li:nth-child(3) {
    margin-top: 31.3rem;
}

.works-technology .works-technology__list h2 {
    font-size: 3rem;
    line-height: 1.667;
    font-weight: bold;
    color: var(--white);
    background: var(--blue);
    padding: 0 2rem;
}

.works-technology .works-technology__list figure {
    display: block;
    font-size: 1px;
    line-height: 1;
}

.works-technology .works-technology__list figure,
.works-technology .works-technology__list figure img {
    width: 100%;
}

.works-recruit {
    padding-bottom: 24rem;
}

.works-recruit .works-recruit__inner {
    position: relative;
    width: 100%;
}

.works-recruit .works-recruit__inner:before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    content: '';
    border: 1rem solid var(--blue);
}

.works-recruit .works-recruit__inner .works-recruit__links {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
    opacity: 0;
}

.works-recruit .works-recruit__inner .works-recruit__box {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 45rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2.4rem;
}

.works-recruit .works-recruit__inner .works-recruit__box h2 {
    font-size: 8.6rem;
    line-height: 1.45;
    letter-spacing: .1em;
    font-weight: bold;
    color: var(--white);
}

.works-recruit .works-recruit__inner .works-recruit__box .btn-links {
    transition: all .5s;
}

.works-recruit .works-recruit__inner .works-recruit__image {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.works-recruit .works-recruit__inner .works-recruit__image:before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    content: '';
    background: #ADADAD;
    mix-blend-mode: multiply;
    isolation: isolate
}

.works-recruit .works-recruit__inner .works-recruit__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.works-recruit .works-recruit__inner .works-recruit__copy {
    position: absolute;
    right: 8.53rem;
    top: 8.38rem;
    z-index: 2;
    width: 22.432rem;
    font-size: 1px;
    line-height: 1;
}

.works-recruit .works-recruit__inner .works-recruit__copy img {
    width: 100%;
}

/*** hover ***/
@media screen and (min-width: 960px) {
    .works-recruit .works-recruit__inner .works-recruit__links:hover + .works-recruit__box .btn-links {
        text-decoration: none;
        background: var(--white);
        color: var(--blue);
    }

    .works-recruit .works-recruit__inner .works-recruit__links:hover + .works-recruit__box .btn-links:after {
        background-image: url(../img/common/arrow_right_blue.svg);
    }
}

.map_attention {
	margin: 2px auto 0px auto;
	font-size: 16px;
	text-align: center;
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .works-message {
        padding: 14rem 0 16rem;
        font-size: 1.8rem;
        line-height: 2;
    }

    .works-message h2 {
        font-size: 1.8rem;
        line-height: 1.5;
        color: var(--blue);
        margin-bottom: 1.5em;
    }

    .works-case .works-case__item {
        margin-bottom: 10rem;
    }

    .works-case .works-case__block {
        display: block;
    }

    .works-case .works-case-image {
        width: 100%;
        margin-top: 5rem;
    }

    .works-case .works-case-box {
        width: 100%;
        font-size: 1.8rem;
    }

    .works-case .works-case-title {
        margin-bottom: 5rem;
        width: 100%;
        margin-top: 0;
    }

    .works-case .works-case-title span {
        font-size: 2.4rem;
        height: 14.7rem;
    }

    .works-case .works-case-title:before,
    .works-case .works-case-title:after,
    .works-case .works-case-title span:before,
    .works-case .works-case-title span:after {
        width: 2.46rem;
        height: 1.9rem;
        border-left-width: .8rem;
        border-top-width: .8rem;
    }

    .works-case .works-case__map {
        margin-top: 5rem;
        aspect-ratio: 640 / 480;
    }

    .works-mainimg {
        margin-bottom: 10rem;
    }

    .works-mainimg .works-mainimg__image {
        width: 100%;
        aspect-ratio: 3 / 2;
    }

    .works-mainimg .works-mainimg__image img {
        height: 100%;
        object-fit: cover;
    }

    .works-mainimg .works-mainimg__caption {
        font-size: 2rem;
    }

    .works-technology {
        /*padding-bottom: 10rem;*/
        padding-bottom: 5rem;
    }

    .works-technology .works-technology__head {
        margin-bottom: 10rem;
        font-size: 2rem;
        line-height: 2;
    }

    .works-technology .works-technology-cate {
        gap: 2.5rem;
        margin-bottom: 2.5rem;
    }

    .works-technology .works-technology-cate li {
        border: .3rem solid #3459D5;
        font-size: 2rem;
        padding: 0 1.2rem;
    }

    .works-technology .works-technology__list {
        flex-direction: column;
        gap: 5rem;
    }

    .works-technology .works-technology__list li {
        gap: 2rem;
        font-size: 1.8rem;
        line-height: 2;
    }

    .works-technology .works-technology__list li:nth-child(2),
    .works-technology .works-technology__list li:nth-child(3) {
        margin-top: 0;
    }

    .works-technology .works-technology__list h2 {
        font-size: 2.4rem;
    }

    .works-recruit {
        padding-bottom: 12rem;
    }

    /*.works-recruit .works-recruit__inner:before {
        border: .5rem solid var(--blue);
    }

    .works-recruit .works-recruit__inner .works-recruit__box {
        height: 22.5rem;
        gap: 1rem;
    }

    .works-recruit .works-recruit__inner .works-recruit__box .btn-links {
        padding: 1.25rem 2rem;
        font-size: 1.6rem;
        border-radius: 1.1rem;
    }

    .works-recruit .works-recruit__inner .works-recruit__box .btn-links:after {
        width: 1.6rem;
    }

    .works-recruit .works-recruit__inner .works-recruit__box h2 {
        font-size: 4.3rem;
    }

    .works-recruit .works-recruit__inner .works-recruit__copy {
        position: absolute;
        right: 50%;
        transform: translate(50%, -50%);
        top: 0;
        z-index: 2;
        width: 11rem;
    }*/



    .works-recruit .works-recruit__inner:before {
        border-width: calc(1 * 100vw / 150);
    }

    .works-recruit .works-recruit__inner .works-recruit__box {
        height: calc(45 * 100vw / 150);
        gap: calc(2.4 * 100vw / 150);
    }

    .works-recruit .works-recruit__inner .works-recruit__box .btn-links {
        padding: calc(2.5 * 100vw / 100) calc(3 * 100vw / 100);
        font-size: calc(2 * 100vw / 100);
        border-width: calc(.1 * 100vw / 100);
    }

    .works-recruit .works-recruit__inner .works-recruit__box .btn-links:after {
        width: calc(2.4 * 100vw / 100);
        height: calc(2.2 * 100vw / 100);
    }

    .works-recruit .works-recruit__inner .works-recruit__box h2 {
        font-size: calc(8.6 * 100vw / 150);
    }

    .works-recruit .works-recruit__inner .works-recruit__copy {
        right: calc(8.53 * 100vw / 150);
        top: calc(8.38 * 100vw / 150);
        width: calc(22.432 * 100vw / 150);
    }
}

/* !採用情報はこちら
---------------------------------------------------------- */
#recruit #wrapper {
    background: var(--white);
}

.recruit-selection {
    padding: 24.5rem 0;
    background: var(--gray);
}

.selection-wrap {
    width: 100%;
    max-width: 89rem;
    margin: 0 auto;
    position: relative;
}

.selection-wrap .selection-inner {
    width: 100%;
    padding: 9rem 6.7rem 9.5rem;
}

.selection-wrap:before,
.selection-wrap:after,
.selection-wrap .selection-inner:before,
.selection-wrap .selection-inner:after {
    width: 6rem;
    height: 6.2rem;
    border-left: 1.9rem solid var(--blue);
    border-top: 1.9rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.selection-wrap:before {
    left: 0;
    top: 0;
}

.selection-wrap:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.selection-wrap .selection-inner:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.selection-wrap .selection-inner:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.selection-wrap .selection-inner h2 {
    text-align: center;
    font-size: 4rem;
    line-height: 1.45;
    font-weight: bold;
    letter-spacing: .1em;
    color: var(--blue);
    margin-bottom: 6rem;
}

.selection-list {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 4rem 3rem;
    justify-content: space-between;
}

.selection-list .selection-list__item {
    width: calc(50% - 1.5rem);
}

.selection-list .selection-list__item.is-full {
    width: 100%;
}

.selection-list .selection-list__item dt {
    width: 100%;
     border: .1rem solid var(--blue);
     text-align: center;
     padding: .9rem;
     font-size: 1.8rem;
     line-height: 1.5;
     letter-spacing: .1em;
     font-weight: bold;
     color: var(--blue);
     margin-bottom: 1.2rem;
}

.selection-list .selection-list__item dd {
    text-align: center;
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: 500;
     letter-spacing: .1em;
}

.recruit-data {
    padding: 20rem 0 20.8rem;
}

.recruit-data .heading-large .heading-large__eng.is-data {
    width: 100%;
    max-width: 22.406rem;
}

.recruit-data .heading-large .heading-large__jap {
    color: #3459D5;
    margin-top: 2rem;
}

.data-top .data-top__heading {
    border: .2rem solid var(--blue);
    padding: 1.5rem;
    text-align: center;
    font-size: 2rem;
    letter-spacing: .1em;
    font-weight: bold;
    line-height: 1.45;
    color: var(--blue);
    margin-bottom: 2.6rem;
}

.data-top .data-top__inner {
    display: flex;
    align-items: flex-start;
    gap: 11.2rem;
    position: relative;
}

.data-top .data-top__inner:before {
    width: .1rem;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    z-index: 2;
    content: '';
    background: #D7D8D9;
}

.data-top .data-top__item {
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.7;
    letter-spacing: .1em;
    padding: 1.5rem 0;
}

.data-top .data-top__title {
    font-size: 2rem;
    line-height: 1.45;
    font-weight: bold;
    color: var(--blue);
    margin-bottom: 1rem;
}

.data-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.data-list li {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding-left: 2.1rem;
    position: relative;
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 500;
}

.data-list li:before {
    position: absolute;
    left: 0;
    top: 0;
    content: '◆';
    z-index: 2;
    font-size: 1.1rem;
    line-height: 2.18;
    color: var(--blue);
    font-weight: 500;
}

.data-list li span {
    min-width: 13.5rem;
}

.data-middle {
    margin-top: 7.2rem;
}

.data-middle .data-list {
    gap: 1.3rem;
}

.data-middle .data-list li {
    font-size: 2rem;
    line-height: 1.7;
    padding-left: 2.4rem;
}

.data-middle .data-list li:before {
    font-size: 1.5rem;
    line-height: 2.2667;
}

.data-middle .data-list + p {
    margin-top: 1.3rem;
}

.data-bottom {
    margin-top: 13rem;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6.5rem 8.8rem;
}

.data-bottom .data-bottom__item {
    font-size: 1.8rem;
    font-weight: 500;
    letter-spacing: .1em;
    line-height: 1.556;
}

.data-bottom .data-bottom__title {
    display: flex;
    align-items: center;
    gap: 1.45rem;
    font-weight: bold;
    font-size: 2rem;
    line-height: 1.45;
    color: var(--blue);
    word-break: keep-all;
    white-space: nowrap;
    margin-bottom: 3rem;
}

.data-bottom .data-bottom__title:after {
    width: 100%;
    height: .1rem;
    content: '';
    background: var(--blue);
}

.data-bottom .data-bottom__item p + ul {
    margin-top: 3.3rem;
}

.recruit-interview {
    position: relative;
    padding: 29.6rem 0 25.5rem;
    background: var(--gray);
}

.recruit-interview .heading-large {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 2;
    margin-top: -3rem;
}

.recruit-interview .heading-large .heading-large__eng.is-interview {
    width: 100%;
    max-width: 47.697rem;
}

.recruit-interview .heading-large .heading-large__jap {
    color: var(--blue);
}

.interview-staff {
    display: flex;
    flex-direction: column;
    gap: 31rem;
}

.interview-staff .staff-head {
    margin-bottom: 5rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.interview-staff .staff-head .staff-head__image {
    width: 60rem;
    margin-bottom: 7.5rem;
}

.interview-staff .staff-head .staff-head__box {
    width: 32rem;
    position: relative;
}

.interview-staff .staff-head .staff-head__box--inner {
    width: 100%;
    height: 20.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.interview-staff .staff-head .staff-head__box:before,
.interview-staff .staff-head .staff-head__box:after,
.interview-staff .staff-head .staff-head__box .staff-head__box--inner:before,
.interview-staff .staff-head .staff-head__box .staff-head__box--inner:after {
    width: 4.5rem;
    height: 3.5rem;
    border-left: 1.5rem solid var(--blue);
    border-top: 1.5rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.interview-staff .staff-head .staff-head__box:before {
    left: 0;
    top: 0;
}

.interview-staff .staff-head .staff-head__box:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.interview-staff .staff-head .staff-head__box .staff-head__box--inner:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.interview-staff .staff-head .staff-head__box .staff-head__box--inner:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}
 
.interview-staff .staff-head__name {
    font-size: 3rem;
    line-height: 2;
    font-weight: bold;
    letter-spacing: .1em;
}

.interview-staff .staff-head__name span {
    display: block;
    font-size: 2rem;
    line-height: 3;
}

.interview-staff .staff-body {
    font-size: 2rem;
    line-height: 2.5;
    font-weight: bold;
    letter-spacing: .1em;
}

.interview-staff .staff-body p + p {
    margin-top: 2.5em;
}

.interview-line {
    margin-top: 27rem;
    text-align: center;
}

.interview-line .interview-line__links .btn-links {
    border-color: var(--green);
    background: var(--green);
    padding: 1.65rem 3.6rem 1.65rem 2.5rem;
}

.interview-line .interview-line__links .btn-links:before {
    width: 9.2rem;
    height: 9.2rem;
    content: '';
    background: url(../img/common/icon_line.svg) center center no-repeat;
    background-size: 100% 100%;
}


.interview-line .interview-line__tel {
    margin-top: 2.68rem;
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: bold;
    letter-spacing: .1em;
    color: var(--blue);
}

.interview-line .interview-line__tel a {
    color: var(--blue);
}

.recruit-style {
    width: 100%;
    padding-bottom: 35rem;
}

.recruit-style .recruit-style__top {
    width: 100%;
    position: relative;
}

.recruit-style .recruit-style__mainimg {
    position: relative;
    z-index: 1;
    width: 100%;
    aspect-ratio: 32 / 15;
    overflow: hidden;
}

.recruit-style .recruit-style__mainimg img {
    width: 100%;
    max-width: unset;
    height: 150%;
    object-fit: cover;
}

.recruit-style .recruit-style__heading {
    width: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 2;
    transform: translate(0,-50%);
}

.recruit-style .recruit-style__heading .heading-large {
    margin-bottom: 0;
}

.recruit-style .recruit-style__heading .heading-large .heading-large__eng.is-style {
    width: 100%;
    max-width: 27.973rem;
    margin-bottom: 1.5rem;
}

.recruit-style .recruit-style__heading .heading-large .heading-large__jap {
    color: var(--white);
}

.recruit-style .recruit-style__icon {
    width: 12.988rem;
    position: absolute;
    left: 50%;
    top: 100%;
    z-index: 2;
    transform: translate(-50%,-50%);

}

.recruit-style .recruit-style__icon img,
.recruit-style .recruit-style__icon video {
    width: 100%;
}

.recruit-style__middle {
    width: 100%;
    max-width: 89rem;
    margin: 27.2rem auto 0;
    position: relative;
}

.recruit-style__middle .recruit-style__inner {
    width: 100%;
    height: 66rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4.2rem;
}

.recruit-style__middle:before,
.recruit-style__middle:after,
.recruit-style__middle .recruit-style__inner:before,
.recruit-style__middle .recruit-style__inner:after {
    width: 6.1rem;
    height: 6.3rem;
    border-left: 2rem solid var(--blue);
    border-top: 2rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.recruit-style__middle:before {
    left: 0;
    top: 0;
}

.recruit-style__middle:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.recruit-style__middle .recruit-style__inner:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.recruit-style__middle .recruit-style__inner:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.recruit-style__middle .recruit-style__title {
    font-size: 4rem;
    line-height: 1.45;
    color: var(--blue);
    font-weight: bold;
    letter-spacing: .1em;
}

.recruit-style__middle .recruit-style__title span {
    display: inline-block;
    margin-left: 2.3rem;
    position: relative;
    padding: 0 2.5rem;
}

.recruit-style__middle .recruit-style__title span:before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    pointer-events: none;
    border: .5rem solid var(--blue);
    content: '';
}

.recruit-style__middle .recruit-style__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1rem;
}

.recruit-style__middle .recruit-style__list li {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    font-size: 2.5rem;
    letter-spacing: .1em;
    line-height: 2.8;
    font-weight: bold;
}

.recruit-style__middle .recruit-style__list li span {
    word-break: keep-all;
    white-space: nowrap;
    font-size: 4rem;
    line-height: 1.45;
    color: var(--blue);
}

.recruit-style__bottom {
    margin-top: 25rem;
}

.recruit-style__case {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 5rem 11.8rem;
    padding-top: 25.6rem;
}

.recruit-style__case .recruit-style__item {
    width: calc(50% - 5.9rem);
    font-size: 2rem;
    letter-spacing: .1rem;
    font-weight: 500;
    line-height: 1.75;
}

.recruit-style__case .recruit-style__item:nth-child(odd) .recruit-style__box {
    transform: translateY(-25.6rem);
}

.recruit-style__case .recruit-style__item figure {
    margin-bottom: 2.7rem;
}

.recruit-style__case .recruit-style__item figure,
.recruit-style__case .recruit-style__item figure img {
    width: 100%;
}

.recruit-style__case .recruit-style__item h4 {
    margin-bottom: 3.8rem;
    font-size: 3rem;
    line-height: 1.5;
    font-weight: bold;
    color: var(--blue);
    letter-spacing: .1rem;
}

.recruit-works {
    padding-bottom: 28.3rem;
    width: 100%;
    overflow: hidden;
    background: var(--gray);
}

.recruit-works .recruit-works__links {
    margin-top: 13rem;
    text-align: center;
}

.works-wrap .works-wrap__head {
    display: flex;
    justify-content: flex-end;
}

.works-wrap .works-wrap__head .heading-large {
    margin-bottom: 7rem;
}

.works-wrap .works-wrap__head .heading-large .heading-large__eng.is-works {
    width: 32.077rem;
}

.works-wrap .works-swiper .swiper {
    width: 100%;
    max-width: 80rem;
    margin: 0 auto;
    overflow: visible;
}

.works-swiper .works-item {
    width: 100;
    position: relative;
}

.works-swiper .works-item .works-item__image {
    width: 100%;
    aspect-ratio: 281 / 200;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.works-swiper .works-item .works-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.works-swiper .works-item .works-item__box {
    position: absolute;
    z-index: 2;
    left: -5.2rem;
    top: -8rem;
    width: 46rem;
    background: var(--white);
    padding: 3.6rem 3.8rem;
    font-size: 1.2rem;
    line-height: 1.5;
    font-weight: 500;
    letter-spacing: .1em;
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
}

.works-swiper .swiper-slide-active .works-item .works-item__box {
    opacity: 1;
    visibility: visible;
}

.works-swiper .works-item .works-item__box .works-title {
    width: 100%;
    position: relative;
}

.works-swiper .works-item .works-item__box .works-title .works-title__inner {
    width: 100%;
    height: 14rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.works-swiper .works-item .works-item__box .works-title:before,
.works-swiper .works-item .works-item__box .works-title:after,
.works-swiper .works-item .works-item__box .works-title .works-title__inner:before,
.works-swiper .works-item .works-item__box .works-title .works-title__inner:after {
    width: 2.4rem;
    height: 1.8rem;
    border-left: .75rem solid var(--blue);
    border-top: .75rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.works-swiper .works-item .works-item__box .works-title:before {
    left: 0;
    top: 0;
}

.works-swiper .works-item .works-item__box .works-title:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.works-swiper .works-item .works-item__box .works-title .works-title__inner:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.works-swiper .works-item .works-item__box .works-title .works-title__inner:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.works-swiper .works-item .works-item__box .works-title-name {
    font-size: 1.8rem;
    line-height: 1.6667;
    font-weight: 500;
}

.works-swiper .works-item .works-item__box .works-text {
    margin-top: 2.3rem;
}

.works-swiper .works-item .works-item__box .works-date {
    margin-top: 1.4rem;
    color: #939393;
}

.works-swiper .swiper-button-prev,
.works-swiper .swiper-button-next {
    width: 8rem;
    height: 8rem;
    border-radius: 100%;
    z-index: 2;
}

.works-swiper .swiper-button-prev {
    left: -10.3rem;
}

.works-swiper .swiper-button-next {
    right: -10.3rem;
}

.works-swiper .swiper-button-prev:before,
.works-swiper .swiper-button-next:before {
    width: 100%;
    height: 100%;
    content: '';
    border-radius: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
}

.works-swiper .swiper-button-prev:before {
    background: url(../img/common/icon_prev.svg) center center no-repeat;
    background-size: 100% 100%;
}

.works-swiper .swiper-button-next:before {
    background: url(../img/common/icon_next.svg) center center no-repeat;
    background-size: 100% 100%;
}


.works-swiper .swiper-button-prev:after,
.works-swiper .swiper-button-next:after {
    background: #3459d5;
    width: 100%;
    height: 100%;
    content: '';
    border-radius: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    transition: transform .5s;
}

.works-thumbs {
    width: 100%;
    max-width: 132.6rem;
    margin: 0 auto;
    margin-top: 5.6rem;
}

.works-thumbs .works-thumb {
    width: 100%;
    position: relative;
    cursor: pointer;
}

.works-thumbs .works-thumb span {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 1.6rem;
    line-height: 1.25;
    font-weight: 500;
    letter-spacing: .1em;
    height: 6rem;
    padding: 0 1.5rem;
    position: relative;
}

.works-thumbs .works-thumb:before,
.works-thumbs .works-thumb:after,
.works-thumbs .works-thumb span:before,
.works-thumbs .works-thumb span:after {
    width: 2.2rem;
    height: 1.6rem;
    border-left: .5rem solid var(--white);
    border-top: .5rem solid var(--white);
    position: absolute;
    content: '';
    z-index: 2;
    opacity: 0;
    transition: opacity .5s;
}

.works-thumbs .swiper-slide-thumb-active .works-thumb:before,
.works-thumbs .swiper-slide-thumb-active .works-thumb:after,
.works-thumbs .swiper-slide-thumb-active .works-thumb span:before,
.works-thumbs .swiper-slide-thumb-active .works-thumb span:after {
    opacity: 1;
}

.works-thumbs .works-thumb:before {
    left: 0;
    top: 0;
}

.works-thumbs .works-thumb:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.works-thumbs .works-thumb span:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.works-thumbs .works-thumb span:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.works-thumbs .swiper-controller {
    display: none;
}

@media screen and (min-width:768px) {
    .works-thumbs .swiper-wrapper {
        justify-content: center;
    }
}

.recruit-message {
    width: 100%;
    background: var(--gray);
}

.recruit-message .recruit-message__inner {
    position: relative;
    font-size: 1.8rem;
    letter-spacing: .1em;
    font-weight: 500;
    line-height: 2.778;
    padding: 34rem 0 25rem;
    text-align: center;
}

.recruit-message .recruit-message__inner p + p {
    margin-top: 2.778em;
}

.recruit-message .recruit-message__image {
    position: absolute;
    right: -2rem;
    top: -19.1rem;
    z-index: 2;
    width: 62.2rem;
}

.recruit-message .recruit-message__image img {
    width: 100%;
}

.recruit-message .recruit-message__heading {
    width: 54.6rem;
    position: relative;
    margin: 0 auto;
}

.recruit-message .recruit-message__heading span {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 100%;
    height: 20.6rem;
    margin-bottom: 17.7rem;
    font-size: 4rem;
    font-weight: bold;
    line-height: 1.45;
}

.recruit-message .recruit-message__heading:before,
.recruit-message .recruit-message__heading:after,
.recruit-message .recruit-message__heading span:before,
.recruit-message .recruit-message__heading span:after {
    width: 4.7rem;
    height: 3.5rem;
    border-left: 1.5rem solid var(--blue);
    border-top: 1.5rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.recruit-message .recruit-message__heading:before {
    left: 0;
    top: 0;
}

.recruit-message .recruit-message__heading:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.recruit-message .recruit-message__heading span:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.recruit-message .recruit-message__heading span:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.recruit-message .recruit-message__title {
    font-size: 3.1rem;
    line-height: 1.5;
    color: var(--blue);
    font-weight: bold;
    margin-bottom: 7rem;
}


.recruit-message .recruit-message__sign {
    font-size: 2.5rem;
    line-height: 1.44;
    font-weight: bold;
    margin-top: 8rem;
}

.recruit-line {
    padding: 18rem 0 42rem;
    position: relative;
}

.recruit-line .recruit-line__heading {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    text-align: center;
}

.recruit-line .recruit-line__heading img {
    width: 100%;
    max-width: 28.832rem;
}

.recruit-line .recruit-line__image {
    width: 100%;
    height: 90rem;
    overflow: hidden;
}

.recruit-line .recruit-line__image img {
    width: 100%;
    max-width: unset;
    height: 150%;
    object-fit: cover;
}

.recruit-line .interview-line {
    margin-top: 11.4rem;
}

.recruit-top {
    width: 100%;
    overflow: hidden;
    padding: 18.2rem 0 67rem;
    font-size: 3rem;
    line-height: 4;
    font-weight: bold;
    letter-spacing: .1em;
}

.recruit-top .recruit-top__area01 {
    position: relative;
    z-index: 2;
    width: 100%;
    padding-bottom: 28.8rem;
    margin-bottom: 23.7rem;
}

.recruit-top .recruit-top__area01 figure {
    position: absolute;
    left: 57rem;
    bottom: 0;
    z-index: -1;
    width: 99.1rem;
    display: block;
}

.recruit-top figure img {
    width: 100%
}

.recruit-top .recruit-top__area02 {
    position: relative;
    z-index: 2;
    width: 100%;
    padding-top: 41.5rem;
    text-align: right;
    margin-bottom: 22.4rem;
}

.recruit-top .recruit-top__area02 figure {
    position: absolute;
    left: -12.2rem;
    top: 0;
    z-index: -1;
    width: 56.8rem;
    display: block;
}

.recruit-top .recruit-top__area03 {
    position: relative;
    z-index: 2;
    width: 100%;
    padding-top: 77.2rem;
    text-align: center;
}

.recruit-top .recruit-top__area03 figure {
    position: absolute;
    right: -13.8rem;
    top: 0;
    z-index: -1;
    width: 58.6rem;
    display: block;
}


@media screen and (min-width: 1480px) {
    .recruit-message .recruit-message__image {
        right: -13.8rem;
    }
}


/*** hover ***/
@media screen and (min-width: 960px) {
    .interview-line .interview-line__links .btn-links:hover {
        background: var(--white);
        color: var(--green);
    }

    .interview-line .interview-line__links .btn-links:hover:after {
        background-image: url(../img/common/arrow_right_green.svg);
    }

    .works-swiper .swiper-button-prev:hover:after,
    .works-swiper .swiper-button-next:hover:after {
        transform: scale(1.1);
    }

}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){

    .recruit-selection {
        padding: 10.5rem 0;
    }

    .selection-wrap .selection-inner {
        padding: 6.2rem 2rem 8rem;
    }

    .selection-wrap:before,
    .selection-wrap:after,
    .selection-wrap .selection-inner:before,
    .selection-wrap .selection-inner:after {
        width: 4.2rem;
        height: 4.3rem;
        border-left: 1rem solid var(--blue);
        border-top: 1rem solid var(--blue);
    }

    .selection-wrap .selection-inner h2 {
        font-size: 2.4rem;
        margin-bottom: 5rem;
    }

    .selection-list {
        gap: 1.5rem .9rem;
    }

    .selection-list .selection-list__item {
        width: calc(50% - .45rem);
    }

    .selection-list .selection-list__item.is-full_sp {
        width: 100%;
    }

    .selection-list .selection-list__item dt {
         padding: .6rem;
         font-size: 1.4rem;
         margin-bottom: .4rem;
    }

    .selection-list .selection-list__item dd {
        font-size: 1.6rem;
    }

    .recruit-data {
        padding: 15rem 0 11rem;
    }

    .recruit-data .heading-large .heading-large__eng.is-data {
        max-width: 17.345rem;
    }

    .recruit-data .heading-large .heading-large__jap {
        margin-top: .68rem;
    }

    .data-top .data-top__heading {
        padding: 1rem;
        font-size: 1.8rem;
        margin-bottom: 3rem;
    }

    .data-top .data-top__inner {
        display: block;
    }

    .data-top .data-top__inner:before {
        display: none;
    }

    .data-top .data-top__item {
        font-size: 1.4rem;
        line-height: 1.857;
        padding: 0;
    }

    .data-top .data-top__item + .data-top__item {
        margin-top: 3.2rem;
        padding-top: 3.78rem;
        border-top: .1rem solid #D7D8D9;
    }

    .data-top .data-top__title {
        font-size: 1.8rem;
        margin-bottom: .85rem;
    }

    .data-list {
        gap: 1rem;
    }

    .data-list li {
        padding-left: 1.6rem;
        font-size: 1.4rem;
    }

    .data-list li:before {
        font-size: 1.1rem;
        line-height: 1.9;
    }

    .data-list li span {
        min-width: 13rem;
    }

    .data-middle {
        margin-top: 5.7rem;
    }

    .data-middle .data-list {
        gap: 1rem;
    }

    .data-middle .data-list li {
        font-size: 1.4rem;
        line-height: 1.5;
        padding-left: 1.8rem;
        flex-direction: column;
        gap: .1rem;
    }

    .data-middle .data-list li span {
        font-size: 1.6rem;
    }

    .data-middle .data-list li:before {
        font-size: 1.2rem;
        line-height: 2;
    }

    .data-middle .data-list + p {
        margin-top: 1rem;
        font-size: 1.4rem;
        line-height: 1.5;
    }

    .data-bottom {
        margin-top: 7rem;
        grid-template-columns: repeat(1, 1fr);
        gap: 4.2rem;
    }

    .data-bottom .data-bottom__item {
        font-size: 1.4rem;
        line-height: 1.5;
    }

    .data-bottom .data-bottom__title {
        font-size: 1.4rem;
        margin-bottom: 1.55rem;
    }

    .data-bottom .data-bottom__item p + ul {
        margin-top: 1.23rem;
    }

    .recruit-interview {
        padding: 15.6rem 0 15rem;
    }

    .recruit-interview .heading-large {
        margin-top: -2.26rem;
    }

    .recruit-interview .heading-large .heading-large__eng.is-interview {
        max-width: 35rem;
    }

    .interview-staff {
        gap: 10rem;
    }

    .interview-staff .staff-head {
        margin-bottom: 3.4rem;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
    }

    .interview-staff .staff-head .staff-head__image {
        width: 100%;
        margin-bottom: 4rem;
    }

    .interview-staff .staff-head .staff-head__box {
        width: 24rem;
    }

    .interview-staff .staff-head .staff-head__box--inner {
        height: 13.4rem;
    }

    .interview-staff .staff-head .staff-head__box:before,
    .interview-staff .staff-head .staff-head__box:after,
    .interview-staff .staff-head .staff-head__box .staff-head__box--inner:before,
    .interview-staff .staff-head .staff-head__box .staff-head__box--inner:after {
        width: 3.4rem;
        height: 2.5rem;
        border-left: 1rem solid var(--blue);
        border-top: 1rem solid var(--blue);
    }
     
    .interview-staff .staff-head__name {
        font-size: 2rem;
        line-height: 1.45;
    }

    .interview-staff .staff-head__name span {
        font-size: 1.4rem;
        line-height: 1.5;
        margin-bottom: .5rem;
    }

    .interview-staff .staff-body {
        font-size: 1.4rem;
        line-height: 2.42857;
    }

    .interview-staff .staff-body p + p {
        margin-top: 2.42857em;
    }

    .interview-line {
        margin-top: 10rem;
    }

    .interview-line .interview-line__links .btn-links {
        padding: 1.1rem 2rem 1.1rem 1rem;
        font-size: 1.6rem;
        gap: 0;
    }

    .interview-line .interview-line__links .btn-links:after {
        width: 1.594rem;
        height: 1.461rem;
        margin-left: 1rem;
    }

    .interview-line .interview-line__links .btn-links:before {
        width: 6rem;
        height: 6rem;
    }


    .interview-line .interview-line__tel {
        margin-top: 1.5rem;
        font-size: 1.4rem;
    }

    .recruit-style {
        padding-bottom: 17.3rem;
    }

    .recruit-style .recruit-style__heading .heading-large .heading-large__eng.is-style {
        max-width: 22.2rem;
        margin-bottom: .3rem;
    }

    .recruit-style .recruit-style__icon {
        width: 9.9rem;

    }

    .recruit-style .recruit-style__mainimg {
        /*height: 45rem;*/
        aspect-ratio: 5 / 6;
    }

    .recruit-style__middle {
        margin: 17rem auto 0;
    }

    .recruit-style__middle .recruit-style__inner {
        height: auto;
        padding: 5rem;
        gap: 3rem;
    }

    .recruit-style__middle:before,
    .recruit-style__middle:after,
    .recruit-style__middle .recruit-style__inner:before,
    .recruit-style__middle .recruit-style__inner:after {
        width: 4.4rem;
        height: 4.4rem;
        border-left: 1rem solid var(--blue);
        border-top: 1rem solid var(--blue);
    }

    .recruit-style__middle .recruit-style__title {
        font-size: 2.4rem;
        line-height: 1.5;
    }

    .recruit-style__middle .recruit-style__title span {
        margin-left: 2.5rem;
        padding: 0 1.1rem;
    }

    .recruit-style__middle .recruit-style__title span:before {
        border: .3rem solid var(--blue);
    }

    .recruit-style__middle .recruit-style__list {
        gap: 1.4rem;
    }

    .recruit-style__middle .recruit-style__list li {
        gap: .5rem;
        font-size: 1.5rem;
        line-height: 1.533;
        padding-top: 1.2rem;
    }

    .recruit-style__middle .recruit-style__list li span {
        font-size: 2.5rem;
        line-height: 1.44;
        margin-top: -1.2rem;
    }

    .recruit-style__bottom {
        margin-top: 11.5rem;
    }

    .recruit-style__case {
        gap: 7rem;
        padding-top: 0;
    }

    .recruit-style__case .recruit-style__item {
        width: 100%;
        font-size: 1.4rem;
        line-height: 1.857;
    }

    .recruit-style__case .recruit-style__item:nth-child(odd) .recruit-style__box {
        transform: translateY(0);
    }

    .recruit-style__case .recruit-style__item figure {
        margin-bottom: 2rem;
    }

    .recruit-style__case .recruit-style__item h4 {
        margin-bottom: 2rem;
        font-size: 2.4rem;
    }

    .recruit-works {
        padding-bottom: 15rem;
    }

    .recruit-works .recruit-works__links {
        display: none;
    }

    .works-wrap .works-wrap__head {
        display: block;
    }

    .works-wrap .works-wrap__head .heading-large {
        margin-bottom: 5.6rem;
    }

    .works-wrap .works-wrap__head .heading-large .heading-large__eng.is-works {
        width: 24.925rem;
    }

    .works-swiper .works-item {
        padding: 0 2rem;
    }

    .works-swiper .works-item .works-item__image {
        aspect-ratio: 388 / 355;
        width: calc(100% + 4rem);
        margin: 0 -2rem;
        margin-top: -2.7rem;
    }

    .works-swiper .works-item .works-item__box {
        position: relative;
        left: 0;
        top: 0;
        width: 100%;
        padding: 2rem 2.5rem 3.6rem;
        opacity: 1;
        visibility: visible;
    }

    .works-swiper .works-item .works-item__box .works-title .works-title__inner {
        height: 15.5rem;
    }

    .works-swiper .works-item .works-item__box .works-title:before,
    .works-swiper .works-item .works-item__box .works-title:after,
    .works-swiper .works-item .works-item__box .works-title .works-title__inner:before,
    .works-swiper .works-item .works-item__box .works-title .works-title__inner:after {
        width: 4.2rem;
        height: 3.1rem;
        border-left: 1rem solid var(--blue);
        border-top: 1rem solid var(--blue);
    }

    .works-swiper .works-item .works-item__box .works-title:before {
        left: -.5rem;
    }

    .works-swiper .works-item .works-item__box .works-title:after {
        right: -.5rem;
    }

    .works-swiper .works-item .works-item__box .works-title .works-title__inner:before {
        left: -.5rem;
    }

    .works-swiper .works-item .works-item__box .works-title .works-title__inner:after {
        right: -.5rem;
    }

    .works-swiper .works-item .works-item__box .works-title-name {
        font-size: 2rem;
        line-height: 2;
        text-align: center;
    }

    .works-swiper .works-item .works-item__box .works-text {
        margin-top: 2rem;
    }

    .works-swiper .works-item .works-item__box .works-date {
        margin-top: 1.1rem;
    }

    .works-swiper .swiper-button-prev,
    .works-swiper .swiper-button-next {
        width: 4.4rem;
        height: 4.4rem;
        top: 7.47rem;
        margin-top: 0;
    }

    .works-swiper .swiper-button-prev {
        left: .6rem;
    }

    .works-swiper .swiper-button-next {
        right: .6rem;
    }

    .works-thumbs {
        max-width: 17rem;
        margin-top: 4rem;
    }

    .works-thumbs .swiper {
        overflow: visible;
    }

    .works-thumbs .works-thumb span {
        font-size: 1.4rem;
        line-height: 1.5;
        height: 6.2rem;
        padding: 0;
    }

    .works-thumbs .swiper-controller {
        display: block;
    }

    .works-thumbs .swiper-button-prev,
    .works-thumbs .swiper-button-next {
        width: 2rem;
        height: 2rem;
        margin-top: -1rem;
    }

    .works-thumbs .swiper-button-prev {
        background: url(../img/common/icon_prev_s.svg) center center no-repeat;
        background-size: 1rem auto;
        left: -2.6rem;
    }

    .works-thumbs .swiper-button-next {
        background: url(../img/common/icon_next_s.svg) center center no-repeat;
        background-size: 1rem auto;
        right: -2.6rem;
    }

    .works-thumbs .swiper-button-prev:after,
    .works-thumbs .swiper-button-next:after {
        display: none;
    }

    .recruit-message .recruit-message__inner {
        font-size: 1.4rem;
        line-height: 2.42857;
        padding: 20rem 0 17rem;
        text-align: left;
    }

    .recruit-message .recruit-message__inner p + p {
        margin-top: 2.42857em;
    }

    .recruit-message .recruit-message__heading {
        width: 100%;
    }

    .recruit-message .recruit-message__heading span {
        height: 12rem;
        margin-bottom: 7.5rem;
        font-size: 2.4rem;
    }

    .recruit-message .recruit-message__heading:before,
    .recruit-message .recruit-message__heading:after,
    .recruit-message .recruit-message__heading span:before,
    .recruit-message .recruit-message__heading span:after {
        width: 4.4rem;
        height: 3.2rem;
        border-left: 1rem solid var(--blue);
        border-top: 1rem solid var(--blue);
    }

    .recruit-message .recruit-message__title {
        font-size: 2rem;
        line-height: 1.45;
        margin-bottom: 2.8rem;
    }


    .recruit-message .recruit-message__sign {
        font-size: 1.8rem;
        line-height: 1.5;
        margin-top: 3.7rem;
    }

    .recruit-line {
        padding: 11.1rem 0 15rem;
    }

    .recruit-line .recruit-line__heading img {
        max-width: 17.726rem;
    }

    .recruit-line .recruit-line__image {
        width: 100%;
        height: 46.2rem;
    }

    .recruit-line .interview-line {
        margin-top: 6rem;
    }

    .recruit-top {
        padding: 15.4rem 0 15rem;
        font-size: 1.9rem;
        line-height: 4.21;
    }

    .recruit-top .recruit-top__area01 {
        padding-bottom: 0;
        margin-bottom: 13.3rem;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    .recruit-top .recruit-top__area01 figure {
        position: relative;
        left: 0;
        width: 22.7rem;
        margin-right: -2rem;
        margin-bottom: 12.7rem;
    }

    .recruit-top .recruit-top__area01 p {
        width: 100%;
    }

    .recruit-top .recruit-top__area02 {
        padding-top: 0;
        margin-bottom: 14rem;
        display: flex;
        flex-direction: column;
    }

    .recruit-top .recruit-top__area02 figure {
        position: relative;
        left: 0;
        width: 19rem;
        margin-bottom: 12.6rem;
    }

    .recruit-top .recruit-top__area02 p {
        width: 100%;
    }

    .recruit-top .recruit-top__area03 {
        padding-top: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

    .recruit-top .recruit-top__area03 figure {
        position: relative;
        right: 0;
        width: 24.7rem;
        margin-right: -2rem;
        margin-bottom: 13rem;
    }

    .recruit-top .recruit-top__area03 p {
        width: 100%;
    }
}

/* !home
---------------------------------------------------------- */

.top-links {
    padding: 12.4rem 0 14.2rem;
    background: var(--white);
}

.top-links .heading-large .heading-large__eng.is-links {
    width: 100%;
    max-width: 26.391rem;
}

.links-list {
    display: flex;
    justify-content: center;
    gap: 4rem 1.5rem;
}
.links-list li {
	margin: 0 auto;
	text-align: center;
}
.links-list li a {
	display: block;
}
.links-list li a img {
	width: 75%;
	height: auto;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}
.top-gallery {
    width: 100%;
    padding-top: 21.6rem;
    overflow: hidden;
    position: relative;
}

.top-gallery .gallery-heading {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    width: 100%;
    text-align: center;
}

.top-gallery .gallery-heading img {
    width: 34.469rem;
}

.gallery-scroll li {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1.4rem;
    padding-right: 1.5rem;
    width: auto;
    height: 56.2rem;
}

.gallery-scroll li img {
    max-width: unset;
    width: auto;
    height: 100%;
}

.gallery-scroll li.is-double img {
    height: calc(50% - .7rem);
}

.gallery-scroll .gallery-scroll__middle {
    margin-top: 2rem;
    transform: scaleX(-1);
}

.gallery-scroll .gallery-scroll__middle li img {
    transform: scaleX(-1);
}

.gallery-scroll .gallery-scroll__bottom {
    margin-top: 2rem;
}

.top-works {
    padding-bottom: 29rem;
    width: 100%;
    overflow: hidden;
}

.top-recruit {
    padding: 0 0 29.8rem;
}

.top-recruit .top-recruit__icon {
    width: 12.4rem;
    margin: 0 auto;
    margin-bottom: 7.8rem;
}

.top-recruit .top-recruit__icon video {
    width: 100%;
}

.top-recruit__head {
    width: 100%;
    max-width: 76.2rem;
    position: relative;
    margin: 0 auto 6rem;
}

.top-recruit__head--inner {
    width: 100%;
    height: 33.2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4.3rem;
    font-size: 4rem;
    line-height: 1.5;
    font-weight: bold;
    letter-spacing: .1em;
}

.top-recruit__head:before,
.top-recruit__head:after,
.top-recruit__head .top-recruit__head--inner:before,
.top-recruit__head .top-recruit__head--inner:after {
    width: 6.2rem;
    height: 6.2rem;
    border-left: 2rem solid var(--blue);
    border-top: 2rem solid var(--blue);
    position: absolute;
    content: '';
    z-index: 2;
}

.top-recruit__head:before {
    left: 0;
    top: 0;
}

.top-recruit__head:after {
    right: 0;
    top: 0;
    transform: scaleX(-1);
}

.top-recruit__head .top-recruit__head--inner:before {
    left: 0;
    bottom: 0;
    transform: scaleY(-1);
}

.top-recruit__head .top-recruit__head--inner:after {
    right: 0;
    bottom: 0;
    transform: scale(-1,-1);
}

.top-recruit__head--inner span {
    display: inline-block;
    margin-right: 1.4rem;
    position: relative;
    padding: 0 2.2rem;
    color: var(--blue);
    vertical-align: middle;
}

.top-recruit__head--inner span:before {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    content: '';
    border: .5rem solid var(--blue);
    pointer-events: none;
}

.top-recruit__body {
    text-align: center;
    font-size: 3rem;
    line-height: 4;
    letter-spacing: .1em;
    font-weight: bold;
}

.top-recruit__links {
    text-align: center;
    margin-top: 7.3rem;
}

.top-message {
    width: 100%;
    position: relative;
}

.top-message__copy {
    position: absolute;
    left: 0;
    top: -12.7rem;
    z-index: 2;
    width: 100%;
    z-index: 2;
}

.top-message__copy img {
    width: 100%;
}

.top-message__top {
    padding: 10.6rem 0 29.4rem;
    font-size: 3rem;
    line-height: 4;
    letter-spacing: .1em;
    font-weight: bold;
    text-align: center;
    width: 100%;
    position: relative;
    z-index: 2;
}

.top-message-mainimg {
    width: 100%;
    max-width: 77.8rem;
    margin: 0 auto;
    margin-bottom: 7.7rem;
}

.top-message__middle {
    width: 100%;
    position: relative;
    z-index: 3;
}

.top-message__image {
    width: 100%;
    height: 91.1rem;
    overflow: hidden;
}
.top-message__image img {
    width: 100%;
    max-width: unset;
    height: 150%;
    object-fit: cover;
}

.top-message__middle .person01 {
    width: 9.279rem;
    position: absolute;
    left: 49.12rem;
    top: -12.9rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__middle .person02 {
    width: 16.14rem;
    position: absolute;
    right: 43.61rem;
    bottom: -17.1rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bottom {
    padding: 13.3rem 0 48.4rem;
    font-size: 3rem;
    line-height: 4;
    letter-spacing: .1;
    font-weight: bold;
    text-align: center;
    position: relative;
    z-index: 2;
}

.top-message__links {
    margin-top: 4.7rem;
    text-align: center;
}

.top-message__bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}

.top-message__bg img {
    width: 100%;
}

.top-message__top .right-road {
    position: absolute;
    width: 46.797rem;
    right: -13.9rem;
    top: 4.9rem;
    z-index: 1;
    line-height: 1;
    font-size: 1px;
}

.top-message__top .left-road {
    position: absolute;
    width: 95.283rem;
    left: -12.36rem;
    bottom: -6rem;
    z-index: 1;
    line-height: 1;
    font-size: 1px;
}

.top-message__bottom .right-road {
    position: absolute;
    width: 82.603rem;
    right: -6.53rem;
    top: -9.9rem;
    z-index: 1;
    line-height: 1;
    font-size: 1px;
}

.top-message__bottom .left-road {
    position: absolute;
    width: 48.74rem;
    left: -19.46rem;
    top: 19.78rem;
    z-index: 1;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building01 {
    width: 24.707rem;
    position: absolute;
    right: 24.56rem;
    top: 56rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building02 {
    width: 7.823rem;
    position: absolute;
    right: 11.2rem;
    top: 78.74rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building03 {
    width: 13.845rem;
    position: absolute;
    left: 8.94rem;
    bottom: 98.2rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building04 {
    width: 22.851rem;
    position: absolute;
    left: 13.15rem;
    bottom: 14.33rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .person01 {
    width: 22.831rem;
    position: absolute;
    left: 27.74rem;
    bottom: 56rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .person02 {
    width: 13.211rem;
    position: absolute;
    right: 30.4rem;
    bottom: 44.3rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .icon {
    width: 12.4rem;
    position: absolute;
    right: 36rem;
    bottom: 8rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .icon video {
    width: 100%;
}

.top-message__bg .building05 {
    width: 9.718rem;
    position: absolute;
    left: 8.6rem;
    top: 18.26rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building06 {
    width: 16.7rem;
    position: absolute;
    right: 2.1rem;
    top: 24.93rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building07 {
    width: 9.41rem;
    position: absolute;
    right: 18.59rem;
    top: 36.98rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .building08 {
    width: 32.7rem;
    position: absolute;
    left: 23.5rem;
    top: 38.2rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

.top-message__bg .person03 {
    width: 13.315rem;
    position: absolute;
    right: 45.09rem;
    bottom: 29.55rem;
    z-index: 2;
    line-height: 1;
    font-size: 1px;
}

@media only screen and (min-width : 768px){
    .home #wrapper {
        padding-top: 0;
    }

    .home #header:not(.is-scroll) {
        top: 6.9rem;
        position: absolute;
    }

    .home .header-logo a {
        display: block;
        position: relative;
    }

    .home #header:not(.is-scroll) .header-logo a:before {
        width: 100%;
        height: 100%;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 2;
        background: url(../img/common/logo_white.png) center center no-repeat;
        background-size: 100% 100%;
        content: '';
    }

    .home #header:not(.is-scroll) .header-logo  img {
        opacity: 0;
    }

    .home #header:not(.is-scroll) #g-navi .g-navi__menu li a {
        color: var(--white);
        text-shadow: 0 0 .6rem rgba(0, 0, 0, .82);
    }

    .gallery-scroll .gallery-scroll__bottom {
        display: none !important;
    }
}

/*** スマホ 375px ~ 767px ***/
@media only screen and (max-width : 767px){
    .top-links {
        padding: 10rem 0 13.4rem;
    }

    .top-links .heading-large .heading-large__eng.is-links {
        max-width: 20.588rem;
    }

    .links-list {
        flex-direction: column;
        align-items: center;
        gap: 2rem;
    }
    .links-list li {
    	width: 100%;
    }
	.links-list li a img {
		width: 100%;
		height: auto;
		object-fit: contain;
		display: block;
		margin: 0 auto;
	}
    .top-gallery {
        padding-top: 15.8rem;
    }

    .top-gallery .gallery-heading img {
        width: 22.339rem;
    }

    .gallery-scroll li {
        gap: .4rem;
        padding-right: .4rem;
        height: 15rem;
    }

    .gallery-scroll li.is-double img {
        height: calc(50% - .2rem);
    }

    .gallery-scroll .gallery-scroll__middle,
    .gallery-scroll .gallery-scroll__bottom {
        margin-top: .4rem;
    }

    .top-works {
        padding-bottom: 16rem;
    }

    .top-recruit {
        padding: 0 0 17.5rem;
    }

    .top-recruit .top-recruit__icon {
        width: 9.9rem;
        margin-bottom: 6.8rem;
    }

    .top-recruit__head {
        margin-bottom: 6.8rem;
    }

    .top-recruit__head--inner {
        height: 20.6rem;
        gap: 2.3rem;
        font-size: 2.4rem;
        letter-spacing: .05em;
    }

    .top-recruit__head:before,
    .top-recruit__head:after,
    .top-recruit__head .top-recruit__head--inner:before,
    .top-recruit__head .top-recruit__head--inner:after {
        width: 3.8rem;
        height: 3.6rem;
        border-left: 1rem solid var(--blue);
        border-top: 1rem solid var(--blue);
    }

    .top-recruit__head--inner span {
        margin-right: 1rem;
        padding: 0 1.4rem;
    }

    .top-recruit__head--inner span:before {
        border: .3rem solid var(--blue);
    }

    .top-recruit__body {
        font-size: 1.9rem;
        line-height: 4.21;
        width: calc(100% + 4rem);
        margin: 0 -2rem;
    }

    .top-recruit__links {
        margin-top: 5.4rem;
    }

    .top-message {
        padding-top: 5.6rem;
    }

    .top-message__copy {
        position: relative;
        left: 0;
        top: 0;
    }

    .top-message__top {
        padding: 0 0 45.2rem;
        font-size: 1.9rem;
        line-height: 4.21;
    }

    .top-message-mainimg {
        margin-top: 2.3rem;
        margin-bottom: 29.6rem;
        max-width: 35rem;
    }

    .top-message-mainimg img {
        width: 100%;
    }

    .top-message__image {
        height: 55.4rem;
    }

    .top-message__middle .person01 {
        width: 7.031rem;
        left: 50%;
        top: -7.7rem;
        transform: translateX(-50%);
    }

    .top-message__middle .person02 {
        width: 10rem;
        right: 7.43rem;
        bottom: -7.9rem;
    }

    .top-message__bottom {
        padding: 23.3rem 0 67.9rem;
        font-size: 1.9rem;
        line-height: 4.21;
    }

    .top-message__links {
        margin-top: 3rem;
    }

    .top-message__top .right-road {
        width: 26.392rem;
        right: -6.89rem;
        top: 21rem;
    }

    .top-message__top .left-road {
        width: 50.49rem;
        left: 50%;
        transform: translateX(-50%);
        bottom: 9.3rem;
        margin-left: -1.8rem;
    }

    .top-message__bottom .right-road {
        width: 52.886rem;
        right: -18.2rem;
        top: -11rem;
    }

    .top-message__bottom .left-road {
        width: 31.205rem;
        left: -8.26rem;
        top: unset;
        bottom: 12rem;
    }

    .top-message__bg .building01 {
        width: 13.586rem;
        right: 2rem;
        top: 32.11rem;
    }

    .top-message__bg .building02 {
        width: 4.301rem;
        right: 5.65rem;
        top: 45.57rem;
    }

    .top-message__bg .building03 {
        width: 7.613rem;
        left: 6.95rem;
        bottom: unset;
        top: 25.27rem;
    }

    .top-message__bg .building04 {
        width: 14.767rem;
        left: 2.19rem;
        bottom: 17.65rem;
    }

    .top-message__bg .person01 {
        width: 12.554rem;
        left: 2.74rem;
        top: 42.27rem;
        bottom: unset;
    }

    .top-message__bg .person02 {
        width: 10rem;
        right: 5.64rem;
        bottom: 32.3rem;
    }

    .top-message__bg .icon {
        width: 6.6rem;
        right: 2rem;
        bottom: 2.77rem;
    }

    .top-message__bg .building05 {
        width: 6.024rem;
        left: 2.19rem;
        top: 7.9rem;
    }

    .top-message__bg .building06 {
        width: 10.146rem;
        right: 2rem;
        top: 11.78rem;
    }

    .top-message__bg .building07 {
        width: 5.948rem;
        right: 3.32rem;
        top: 37.73rem;
    }

    .top-message__bg .building08 {
        width: 20.897rem;
        left: 5.21rem;
        bottom: 16rem;
        top: unset;
    }

    .top-message__bg .person03 {
        width: 8.067rem;
        right: 4.82rem;
        bottom: 49.81rem;
    }
}

.fixed-button {
    position: fixed;
    right: 5.7rem;
    top: 4.1rem;
    z-index: 1000;
}

.fixed-button a {
    width: 8.75rem;
    height: 8.75rem;
    border-radius: .5rem;
    background: var(--green);
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    font-size: 1.25rem;
    line-height: 1.44;
    font-weight: bold;
    text-align: center;
    color: var(--white);
    border: .1rem solid var(--green);
}

.fixed-button a:before {
    width: 4.6rem;
    height: 4.6rem;
    content: '';
    background: url(../img/common/icon_line.svg) center center no-repeat;
    background-size: 100% 100%;
    margin-bottom: -.5rem;
}

/*** hover ***/
@media screen and (min-width: 960px) {
    .fixed-button a:hover {
        opacity: .7;
        text-decoration: none;
    }
}

/*** スマホ 375px ~ 767px ***/
@media screen and (max-width: 767px) {
    .fixed-button {
        top: unset;
        bottom: 2rem;
        right: 2rem;
    }
}

.word-animate {
    height: 1.5em;
    overflow: hidden;
}

.word-animate-item {
    width: 1em;
    height: auto;
    display: inline-block;
}

.play-up {
    animation: play-up 10s infinite;
}

@keyframes play-up {
    0% {
        transform: translateY(0);
    }
    33% {
        transform: translateY(0);
    }
    34% {
        transform: translateY(-25%);
    }
    66% {
        transform: translateY(-25%);
    }
    67% {
        transform: translateY(-50%);
    }
    99% {
        transform: translateY(-50%);
    }
    100% {
        transform: translateY(-75%);
    }
}

.play-down {
    animation: play-down 10s infinite;
}

@keyframes play-down {
    0% {
        transform: translateY(-75%);
    }
    33% {
        transform: translateY(-75%);
    }
    34% {
        transform: translateY(-50%);
    }
    66% {
        transform: translateY(-50%);
    }
    67% {
        transform: translateY(-25%);
    }
    99% {
        transform: translateY(-25%);
    }
    100% {
        transform: translateY(0);
    }
}

/* story */
.story-top {
	position: relative;
	letter-spacing: .1em;
}
.story-top:before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	background: #838383;
	mix-blend-mode: multiply;
}
.story-top__bg {
	position: relative;
	z-index: 1;
	overflow: hidden;
	width: 100%;
	height: 90.8rem;
}
.story-top__bg img {
    width: 100%;
    max-width: unset;
    height: 150%;
    object-fit: cover;
}
.story-top__info {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	padding: 16.8rem 0;
	width: 100%;
	text-align: center;
	color: #fff;
}
.story-top .head-eng {
	margin-bottom: 2rem;
	font-size: 2rem;
	font-weight: 700;
}
.story-top .head-eng:after {
	content: "";
	display: block;
	margin: 5.5rem auto 0;
	width: 4.2rem;
	border-top: 2px solid #fff;
}
.story-top .head-jap {
	line-height: 4;
	font-size: 3rem;
	font-weight: 500;
}
.story-top .story-top__box {
	position: absolute;
	top: calc(100% - 11rem);
	left: calc(50% + 7.6rem);
	z-index: 3;
	padding: 3.4rem 3.8rem;
	max-width: 52.5rem;
	background: #D7D8D9;
}
.story-top .iframe-title {
	margin-bottom: 2.8rem;
}
.story-top .story-top__box .txt {
	line-height: 1.43;
	font-size: 1.4rem;
	font-weight: 700;
}

.iframe-title {
	position: relative;
	padding: 5rem;
	text-align: center;
	line-height: 1.6667;
	letter-spacing: .1em;
	font-size: 3rem;
	font-weight: 500;
}
.iframe-title:before,
.iframe-title:after,
.iframe-title__inner:before,
.iframe-title__inner:after {
	content: '';
	position: absolute;
	z-index: 2;
	width: 4.5rem;
	height: 3.4rem;
	border-left: 1.5rem solid var(--blue);
	border-top: 1.5rem solid var(--blue);
}
.iframe-title:before {
	left: 0;
	top: 0;
}
.iframe-title:after {
	right: 0;
	top: 0;
	transform: scaleX(-1);
}
.iframe-title__inner:before {
	left: 0;
	bottom: 0;
	transform: scaleY(-1);
}
.iframe-title__inner:after {
	right: 0;
	bottom: 0;
	transform: scale(-1);
}

.story-project {
	position: relative;
	z-index: 2;
	padding: 40rem 0 30rem;
	background: #fff;
	letter-spacing: .1em;
}
.story-project__title {
	margin-bottom: 20rem;
	text-align: center;
}
.story-project .heading-large .heading-large__jap {
    color: var(--blue);
	font-size: 2rem;
}
.story-project .heading-large .heading-large__jap:AFTER {
	content: "";
	display: block;
	width: 4.2rem;
	margin: 5.5rem auto 0;
	border-top: 2px solid;
}
.story-project__title p + p {
	margin-top: 4rem;
}
.story-project__title .sub {
	line-height: 3.2;
	font-size: 2.5rem;
	font-weight: 700;
}
.story-project__title .sub2 {
	line-height: 2;
    color: var(--blue);
	font-size: 4rem;
	font-weight: 700;
}
.story-project__flow {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	gap: 3.6rem;
}
.story-project__flow li {
	width: calc(100%/3 - 2.4rem);
}
.story-project__flow li:nth-of-type(2) {
	margin-top: 10.8rem;
}
.story-project__flow li:nth-of-type(3) {
	margin-top: 21.6rem;
}
.story-project__flow .step {
	padding: 1rem;
	margin-bottom: 3.6rem;
	background: var(--blue);
	line-height: 1;
	text-align: center;
	letter-spacing: .1em;
	color: #fff;
	font-size: 3rem;
	font-weight: 700;
}
.story-project__flow .tit {
	margin-bottom: 4rem;
	letter-spacing: .1em;
	text-align: center;
	color: var(--blue);
	font-size: 3.1rem;
	font-weight: 700;
}
.story-project__flow .txt {
	line-height: 2.5;
	letter-spacing: 0.05em;
	font-size: 2rem;
	font-weight: 500;
}
.story-project__bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}
.story-project__bg .icon {
	position: absolute;
}
.story-project__bg img {
	width: 100%;
}
.story-project__bg .icon-build1 {
	right: calc(50% + 41.8rem);
	top: 67.8rem;
	width: 22.8rem;
}
.story-project__bg .icon-build2 {
	right: calc(50% + 67.6rem);
	top: 114.5rem;
	width: 13.8rem;
}
.story-project__bg .icon-build3 {
	right: calc(50% + 51.6rem);
	top: 162.9rem;
	width: 16.7rem;
}
.story-project__bg .icon-build4 {
	left: calc(50% + 45.4rem);
	top: 94.3rem;
	width: 24.7rem;
}
.story-project__bg .icon-build5 {
	left: calc(50% + 70rem);
	top: 150.3rem;
	width: 9.7rem;
}
.story-project__bg .icon-build6 {
	left: calc(50% + 48.4rem);
	top: 190.4rem;
	width: 9.4rem;
}

.story-bulid {
	position: relative;
	z-index: 2;
	padding: 0 0 30.8rem;
	letter-spacing: .1em;
}
.story-bulid .heading-large {
	margin-top: -3rem;
}
.story-bulid__title {
	margin-bottom: 10rem;
	text-align: center;
}
.story-bulid__title .iframe-title {
	margin: 0 auto 10rem;
	max-width: 74rem;
	line-height: 2;
	color: var(--blue);
	font-weight: 700;
	font-size: 4rem;
}
.story-bulid__title .sub {
	line-height: 4;
	font-size: 2rem;
	font-weight: 700;
}
.story-bulid__flow li + li {
	margin-top: 10rem;
}
.story-bulid__flow .img {
	max-width: 101.1rem;
}
.story-bulid__flow .info {
	display: flex;
	position: relative;
	margin-top: -9.2rem;
}
.story-bulid__flow .step {
	position: relative;
	width: 30%;
	text-align: center;
	color: var(--blue);
	font-size: 10.4rem;
	font-weight: 700;
}
.story-bulid__flow .step:after {
	content: "";
	display: block;
	margin: 0 auto;
	height: calc(100% - 6.5rem);
	width: 1rem;
	background: url(../img/story/icon_col_dot.png) center top;
	background-size: 100%;
}
.story-bulid__flow li:last-child .step:after {
	content: none;
}
.story-bulid__flow .box {
	margin: 0 0 0 auto;
	padding: 3.2rem 3.8rem 4rem;
	max-width: 70%;
	background: #fff;
}
.story-bulid__flow .iframe-title {
	margin-bottom: 2rem;
}
.story-bulid__flow .txt {
	line-height: 1.43;
	font-size: 1.4rem;
	font-weight: 700;
}
.story-bulid__flow .features {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
	margin-top: 1.6rem;
}
.story-bulid__flow .features .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	align-items: center;
	height: 4.6rem;
	background: #EFEFEF;
	border-radius: 5rem;
	color: var(--blue);
	font-weight: 700;
}

.story-judgment {
	position: relative;
	z-index: 2;
	padding: 21rem 0 23rem;
	background: #fff;
}
.story-judgment .heading-large {
	position: absolute;
	left: 0;
	top: -3.8rem;
	padding: 0 2rem;
	width: 100%;
}
.story-judgment .heading-large img {
	max-width: 81.5rem;
}
.story-judgment__title {
	margin-bottom: 15rem;
}
.story-judgment__title .content {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.story-judgment__title .sub {
	width: 35%;
	line-height: 1.775;
	letter-spacing: .1em;
	color: var(--blue);
	font-size: 4rem;
	font-weight: 700;
}
.story-judgment__title .sub2 {
	width: 60.25%;
	line-height: 1.75;
	letter-spacing: .05em;
	font-size: 2rem;
	font-weight: 700;
}
.story-judgment__list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 4.8rem 5.6rem;
}
.story-judgment__list li {
	position: relative;
	padding: 5.6rem 4.6rem 4.5rem;
	background: #D7D8D9;
	letter-spacing: .05em;
}
.story-judgment__list li .point {
	position: absolute;
	left: 0;
	top: 0;
	transform: translateY(-50%);
	padding: 0.8rem 3.5rem;
	border-radius: 5rem;
	background: var(--blue);
	letter-spacing: .1em;
	color: var(--gray);
	font-size: 2rem;
	font-weight: 700;
}
.story-judgment__list li .iframe-title {
	margin-bottom: 2.2rem;
	padding: 5rem 2.4rem;
	color: var(--blue);
	font-weight: 700;
}
.story-judgment__list li .txt {
	line-height: 1.75;
	letter-spacing: 0.1em;
	font-size: 2rem;
	font-weight: 700;
}
.story-judgment__list li .flow {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 2rem;
	padding: 0.5rem;
	border: 1px solid;
	color: var(--blue);
	font-weight: 700;
	font-size: 2rem;
}
.story-judgment__list li .flow span + span {
	padding-left: 4.8rem;
	background: url(../img/common/arrow_right_blue.svg)no-repeat left 1.6rem center;
	background-size: 1.6rem;
}

.story-team {
	padding: 22.2rem 0 33rem;
	letter-spacing: .05em;
}
.story-team .top.iframe-title {
	padding: 10rem 4rem;
	margin: 0 auto 13rem;
	max-width: 85rem;
	color: var(--blue);
	font-size: 4rem;
	font-weight: 700;
}
.story-team .top.iframe-title:before, 
.story-team .top.iframe-title:after, 
.story-team .top.iframe-title .iframe-title__inner:before, 
.story-team .top.iframe-title .iframe-title__inner:after {
    width: 5.9rem;
    height: 6rem;
}
.story-oneteam {
	position: relative;
	z-index: 2;
}
.story-oneteam__bg {
	position: absolute;
	left: 0;
	top: 3.4rem;
	z-index: -1;
	overflow: hidden;
	width: 100%;
	height: 83.2rem;
}
.story-oneteam__bg img {
	width: 100%;
	max-width: unset;
	height: 150%;
	object-fit: cover;
}
.story-oneteam .heading-large img {
	max-width: 40.5rem;
}
.story-oneteam .sub {
	line-height: 5;
	text-align: center;
	color: #fff;
	font-size: 2rem;
	font-weight: 500;
}
.story-oneteam .category {
	display: flex;
	justify-content: center;
	gap: 3rem;
	margin-top: 8rem;
}
.story-oneteam .category li {
	padding: 3.2rem 3.8rem;
	width: calc(100%/3 - 2rem);
	max-width: 32.2rem;
	background: #fff;
	letter-spacing: .05em;
	color: var(--blue);
}
.story-oneteam .category li .iframe-title {
	margin-bottom: 2rem;
	padding: 3.5rem 3rem;
	letter-spacing: .05em;
	font-weight: 700;
}
.story-oneteam .category li .iframe-title:before, 
.story-oneteam .category li .iframe-title:after, 
.story-oneteam .category li .iframe-title .iframe-title__inner:before, 
.story-oneteam .category li .iframe-title .iframe-title__inner:after {
    width: 4.4rem;
    height: 3.2rem;
	border-width: 1.3rem 0 0 1.3rem;
}
.story-oneteam .category li .tit {
	text-align: center;
	color: var(--blue);
	font-weight: 700;
	font-size: 2rem;
}

.story-generation {
	position: relative;
	z-index: 2;
	padding: 28rem 0;
	background: #fff;
	letter-spacing: .1em;
}
.story-generation .heading-large {
	position: absolute;
	left: 0;
	top: -3rem;
	padding: 0 2rem;
	width: 100%;
}
.story-generation .heading-large img {
    max-width: 111.4rem;
}
.story-generation .display {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.story-generation .display.reverse {
	flex-direction: row-reverse;
}
.story-generation .display + .display {
	margin-top: 24rem;
}
.story-generation .display.st1 .img {
	margin: 14rem calc(-50vw + 60rem) 0 0;
	width: calc(70% - 0.5rem);
}
.story-generation .display.st1 .info {
	margin-right: 5rem;
	width: calc(50% + 1.6rem);
	max-width: 61.6rem;
}
.story-generation .display .iframe-title {
	margin: 0 -14rem 18rem 0;
	color: var(--blue);
	font-size: 4rem;
	font-weight: 700;
}
.story-generation .display .tit {
	margin-bottom: 4rem;
	line-height: 2;
	color: var(--blue);
	font-size: 4rem;
	font-weight: 700;
}
.story-generation .display .txt {
	line-height: 2.5;
	font-size: 2rem;
	font-weight: 700;
}
.story-generation .display.st2 {
	align-items: center;
}
.story-generation .display.st2 .img {
	margin-left: calc(-50vw + 71.5rem);
	width: calc(50% - 1.4rem);
	max-width: 58.6rem;
}
.story-generation .display.st2 .info {
	margin-left: 5rem;
	width: 60%;
	max-width: 71.5rem;
}
.story-generation .points li {
	padding-left: 6.5rem;
	text-indent: -6.5rem;
	font-size: 2.5rem;
	font-weight: 700;
}
.story-generation .points li + li {
	margin-top: 1.6rem;
}
.story-generation .points li .step {
	color: var(--blue);
	font-size: 4rem;
	font-weight: 700;
}

.story-completion {
	position: relative;
	z-index: 2;
	padding: 24.8rem 0 23rem;
	letter-spacing: .1em;
}
.story-completion .heading-large {
	position: absolute;
	left: 0;
	top: -2.7rem;
	padding: 0 2rem;
	width: 100%;
}
.story-completion .heading-large img {
    max-width: 71.5rem;
}
.story-completion .iframe-title {
    padding: 7.5rem 4rem;
    margin: 0 auto 13rem;
    max-width: 75rem;
    color: var(--blue);
    font-size: 4rem;
    font-weight: 700;
}
.story-completion .works-wrap__head {
	margin-bottom: 12rem;
}
.story-completion .sub {
	max-width: 50rem;
	line-height: 2.5;
	font-size: 2rem;
	font-weight: 700;
}
.story-completion .works-wrap {
	overflow: hidden;
}

.story-finished {
	position: relative;
	z-index: 2;
	padding: 17.5rem 0 15.8rem;
	letter-spacing: .05em;
	color: #fff;
}
.story-finished__bg {
	overflow: hidden;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
}
.story-finished__bg img {
    width: 100%;
    max-width: unset;
    height: 150%;
    object-fit: cover;
}
.story-finished__title .jap {
	margin-bottom: 2.5rem;
	line-height: 1.45;
	text-align: center;
	font-size: 5.1rem;
	font-weight: 700;
}
.story-finished__title .jap2 {
	line-height: 4;
	text-align: center;
	font-size: 2rem;
	font-weight: 700;
}
.story-finished__forlinks {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 4.4rem;
	margin-top: 7rem;
}
.story-finished__forlinks a {
	display: block;
	padding: 3.5rem 5rem 5rem;
	background: url(../img/common/arrow_right_white.svg)no-repeat right 3rem bottom 2.2rem rgba(52,89,213,0.75);
	background-size: 2.2rem;
	border-radius: 2.2rem;
	line-height: 1.444;
	color: inherit;
	font-size: 1.8rem;
	font-weight: 700;
}
.story-finished__forlinks .head {
	margin-bottom: 1.2rem;
	text-align: center;
}
.story-finished__forlinks .head .eng {
	display: block;
	margin-bottom: 1rem;
}
.story-finished__forlinks .head .jap {
	display: block;
	font-size: 3rem;
	font-weight: 700;
}

/* hover */
@media screen and (min-width: 960px) {
	.story-finished__forlinks a:hover {
		text-decoration: none;
        background-image: url(../img/common/arrow_right_blue.svg);
        background-color: rgba(255,255,255,0.75);
        color: var(--blue);
	}
}
/*** スマホ 375px ~ 767px ***/
@media screen and (max-width: 767px) {
	.story-top__bg {
		height: 62rem;
	}
	.story-top__info {
	    padding: 8rem 2rem;
	}
	.story-top .head-eng {
	    margin-bottom: 2rem;
	    font-size: 1.6rem;
	}
	.story-top .head-eng:after {
	    margin: 2rem auto 0;
	}
	.story-top .head-jap {
	    line-height: 2.5;
	    font-size: 2rem;
	}
	.story-top .story-top__box {
	    top: calc(100% - 6rem);
	    left: 2rem;
		right: 2rem;
	    padding: 2rem;
	}
	.story-top .iframe-title {
	    margin-bottom: 2rem;
	}
	
	.iframe-title {
		padding: 4rem 2rem;
		font-size: 2rem;
	}
	.iframe-title:before, 
	.iframe-title:after, 
	.iframe-title__inner:before, 
	.iframe-title__inner:after {
	    width: 4rem;
	    height: 3rem;
	    border-left: 1rem solid var(--blue);
	    border-top: 1rem solid var(--blue);
	}
	
	.story-project {
	    padding: 32rem 0 16rem;
	}
	.story-project .heading-large .heading-large__jap {
		font-size: 1.6rem;
	}
	.story-project__title {
	    margin-bottom: 6rem;
	}
	.story-project__title p + p {
	    margin-top: 2.4rem;
	}
	.story-project__title .sub {
	    line-height: 2;
	    font-size: 2rem;
	}
	.story-project__title .sub2 {
		font-size: 2.4rem;
	}
	.story-project__flow {
		flex-direction: column;
		gap: 4rem;
	}
	.story-project__flow li {
		width: auto;
	}
	.story-project__flow li:nth-of-type(2),
	.story-project__flow li:nth-of-type(3) {
	    margin-top: 0;
	}
	.story-project__flow .step {
	    padding: 1rem;
	    margin-bottom: 2rem;
	    font-size: 2rem;
	}
	.story-project__flow .tit {
	    margin-bottom: 2rem;
	    font-size: 2.2rem;
	}
	.story-project__flow .txt {
	    line-height: 2;
	    font-size: 1.6rem;
	}
	
	.story-bulid {
		padding: 0 0 8rem;
	}
	.story-bulid .heading-large {
	    margin-top: -1.5rem;
	}
	.story-bulid__title {
	    margin-bottom: 5rem;
	}
	.story-bulid__title .iframe-title {
	    margin-bottom: 5rem;
	    font-size: 2.4rem;
	}
	.story-bulid__title .sub {
	    line-height: 2.5;
	    font-size: 1.6rem;
	}
	.story-bulid__flow li + li {
	    margin-top: 5rem;
	}
	.story-bulid__flow .info {
	    margin-top: -3.6rem;
	}
	.story-bulid__flow .step {
	    width: 20%;
	    font-size: 4rem;
	}
	.story-bulid__flow .step:after {
	    height: calc(100% - 6.5rem);
	    width: 0.6rem;
	}
	.story-bulid__flow .box {
	    padding: 1.6rem;
	    max-width: 80%;
	}
	.story-bulid__flow .features {
	    grid-template-columns: repeat(1, 1fr);
	    gap: 1.6rem;
	}
	.story-bulid__flow .features .btn {
	    height: 4rem;
		font-size: 1.4rem;
	}
	
	.story-judgment {
	    padding: 10rem 0;
	}
	.story-judgment .heading-large {
	    top: -1.6rem;
	}
	.story-judgment__title {
	    margin-bottom: 8rem;
	}
	.story-judgment__title .content {
	    display: block;
	}
	.story-judgment__title .sub {
		margin-bottom: 3rem;
		width: auto;
		text-align: center;
		font-size: 2.4rem;
	}
	.story-judgment__title .sub2 {
		width: auto;
	    font-size: 1.6rem;
	}
	.story-judgment__list {
	    grid-template-columns: repeat(1, 1fr);
	}
	.story-judgment__list li {
	    padding: 3.2rem 2rem;
	}
	.story-judgment__list li .point {
	    padding: 0.4rem 2rem;
	    font-size: 1.6rem;
	}
	.story-judgment__list li .iframe-title {
	    margin-bottom: 2rem;
	    padding: 4rem 2rem;
		font-size: 1.8rem;
	}
	.story-judgment__list li .txt {
	    font-size: 1.6rem;
	}
	.story-judgment__list li .flow {
	    margin-top: 2rem;
	    font-size: 1.4rem;
	}
	.story-judgment__list li .flow span + span {
	    padding-left: 3rem;
	    background-position: left 1rem center;
	    background-size: 1rem;
	}
	
	.story-team {
	    padding: 10rem 0;
	}
	.story-team .top.iframe-title {
	    padding: 5rem 2rem;
	    margin: 0 auto 6rem;
	    font-size: 2.4rem;
	}
	.story-team .top.iframe-title:before, 
	.story-team .top.iframe-title:after, 
	.story-team .top.iframe-title 
	.iframe-title__inner:before, 
	.story-team .top.iframe-title 
	.iframe-title__inner:after {
	    width: 4rem;
	    height: 4rem;
	}
	.story-oneteam__info {
		padding: 0 2rem;
	}
	.story-oneteam__info .heading-large {
		padding: 0 2rem;
	}
	.story-oneteam__bg {
	    top: 2rem;
		height: 68rem;
	}
	.story-oneteam .sub {
	    line-height: 2.5;
	    font-size: 1.6rem;
	}
	.story-oneteam .category {
	    flex-direction: column;
	    margin-top: 6rem;
	}
	.story-oneteam .category li {
	    padding: 2rem;
	    width: 100%;
	    max-width: inherit;
	}
	.story-oneteam .category li .tit {
		font-size: 1.6rem;
	}
	
	.story-generation {
		padding: 10rem 0;
	}
	.story-generation .heading-large {
		top: -1.6rem;
	}
	.story-generation .display {
		display: block;
	}
	.story-generation .display + .display {
	    margin-top: 6rem;
	}
	.story-generation .display.st1 .img {
	    margin: 0 0 3rem;
	    width: auto;
	}
	.story-generation .display.st1 .info {
	    margin-right: 0;
	    width: auto;
	}
	.story-generation .display.st2 .img {
	    margin: 0 0 3rem;
	    width: auto;
	}
	.story-generation .display.st2 .info {
	    margin: 0;
	    width: auto;
	}
	.story-generation .display .iframe-title {
	    margin: 0 0 2rem;
	    font-size: 2.4rem;
	}
	.story-generation .display .txt {
	    line-height: 2;
	    font-size: 1.6rem;
	}
	.story-generation .display .tit {
	    margin-bottom: 2.4rem;
	    font-size: 2.4rem;
	}
	.story-generation .points li {
	    padding-left: 4.6rem;
	    text-indent: -4.6rem;
	    font-size: 2rem;
	}
	.story-generation .points li .step {
		font-size: 2.8rem;
	}
	
	.story-completion {
	    padding: 10rem 0;
	}
	.story-completion .works-wrap__head {
	    margin-bottom: 6rem;
	}
	.story-completion .heading-large {
	    margin-bottom: 8rem;
	}
	.story-completion .iframe-title {
	    padding: 5rem 2rem;
	    margin: 0 auto 5rem;
	    font-size: 2.4rem;
	}
	.story-completion .sub {
	    font-size: 1.6rem;
	}
	
	.story-finished {
	    padding: 10rem 0;
	}
	.story-finished__title .jap {
	    margin-bottom: 2.5rem;
	    font-size: 3rem;
	}
	.story-finished__title .jap2 {
	    line-height: 2;
	    font-size: 1.6rem;
	}
	.story-finished__forlinks {
	    grid-template-columns: repeat(1, 1fr);
	    gap: 3rem;
	    margin-top: 4rem;
	}
	.story-finished__forlinks a {
	    padding: 3rem 2rem 4rem;
	    background-position: right 1.6rem bottom 1.6rem;
	    background-size: 1.4rem;
	    font-size: 1.2rem;
	}
	.story-finished__forlinks .head .jap {
		font-size: 2rem;
	}
	
	
	
}