@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;900&family=Zen+Kaku+Gothic+New:wght@500;700;900&display=swap');

/*!
Theme Name: HER THEME
Template: xeory_extension
Version: 0.1.0
*/


/* common-css */
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, dialog, figure, footer, header,
hgroup, menu, nav, section,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
}

input::placeholder{
	color: #ccc;
}
input::-ms-input-placeholder{
	color: #ccc;
}
input:-ms-input-placeholder{
	color: #ccc;
}

html.lenis {
    height: auto;
}

.lenis.lenis-smooth {
    scroll-behavior: auto;
}

.lenis.lenis-smooth [data-lenis-prevent] {
    overscroll-behavior: contain;
}

.lenis.lenis-stopped {
    overflow: hidden;
}

.lenis.lenis-scrolling iframe {
    pointer-events: none;
}

:root{
    --base-color: #000;
    --gray: #A1A1A1;
    --light-gray: #EFEFEF;
    --blue: #0249D8;
    --roboto: 'Roboto', 'Zen Kaku Gothic New', "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Verdana, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    --cubic-bezier: cubic-bezier(0.77, 0, 0.175, 1);
    --drawergap:80px;
}

body{
    min-width: 1260px;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    line-height: 1.8;
    color: #000;
    letter-spacing: .1em;
    padding-right: 80px;
    font-family: 'Zen Kaku Gothic New', "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Verdana, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    position: relative;
    z-index: 0;
}
#bg-stripe,
#loading{
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 80px);
    height: 100%;
    display: grid;
    grid-template-columns: repeat(6,1fr);
    pointer-events: none;
}
#bg-stripe{
    z-index: -1;
}
#bg-stripe span{
    border-left: 1px solid #E5E5E5;
    opacity: 0.4;
    display: block;
}
#loading{
    z-index: 999999;
}
#loading span.r{
    position: relative;
}
#loading span.t{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    background-color: var(--base-color);
    transition: .5s var(--cubic-bezier);
}
#page-decoration-item{
    position: absolute;
    top: 100vh;
    left: 0;
    width: 100%;
    height: calc(100% - 100vh);
    z-index: -2;
    background: url(img/common/body-decorate-item.svg) repeat-y center top;
    background-size: 100%;
    pointer-events: none;
}

body.home .wrap,
.wrap{
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

a{
    transition: .2s;
    text-decoration: none;
}
a:hover{
    opacity: .6;
    text-decoration: none;
}
img{
    max-width: 100%;
    vertical-align: bottom;
}
.flex{
    display: flex;
    flex-wrap: wrap;
}
.ps-re{
    position: relative;
    z-index: 0;
}
.ps-ab{
    position: absolute;
}
.padding-top{
    padding-top: 120px;
}
.padding-bottom{
    padding-bottom: 120px;
}
.padding-tb{
    padding: 120px 0;
}
/* .animation-rotate{
    animation: rotate 20s linear infinite;
    will-change: transform;
}
.animation-rotate-x50-y50{
    animation: rotate-x50-y50 20s linear infinite;
    will-change: transform;
}
.animation-rotate-x50{
    animation: rotate-x50 20s linear infinite;
    will-change: transform;
}
.animation-rotate-y50{
    animation: rotate-y50 20s linear infinite;
    will-change: transform;
} */
@keyframes rotate{
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}
@keyframes rotate-x50-y50{
    0%{
        transform: translate(-50%,-50%) rotate(0deg);
    }
    100%{
        transform: translate(-50%,-50%) rotate(360deg);
    }
}
@keyframes rotate-x50{
    0%{
        transform: translateX(-50%) rotate(0deg);
    }
    100%{
        transform: translateX(-50%) rotate(360deg);
    }
}
@keyframes rotate-y50{
    0%{
        transform: translateY(-50%) rotate(0deg);
    }
    100%{
        transform: translateY(-50%) rotate(360deg);
    }
}
.cm-title__text{
    font-size: 20px;
    font-weight: bold;
    color: var(--blue);
    padding-left: 26px;
    position: relative;
}
.cm-title__text::before{
    content: "";
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: 0;
    width: 10px;
    height: 10px;
    background-color: var(--blue);
    border-radius: 50%;
}
.cm-title__en{
    font-size: 50px;
    font-weight: 900;
    font-family: var(--roboto);
    letter-spacing: 0.1em;
    line-height: 1.4;
}
.cm-title__en span{
    transform: scale(0);
    transition: .3s;
    display: inline-block;
}
.cm-title.scrollin .cm-title__en span{
    transform: scale(1);
}
.view-more a{
    font-family: var(--roboto);
    font-size: 14px;
    color: var(--base-color);
    letter-spacing: 0.1em;
    position: relative;
    width: 300px;
    display: block;
    padding-bottom: 16px;
}
.view-more a::before{
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    height: 1px;
    width: 100%;
    background-color: var(--base-color);
    transition: .3s;
}
.view-more a::after{
    content: "";
    width: 34px;
    height: 12px;
    background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
    position: absolute;
    top: 8px;
    right: 10px;
    transition: .3s;
}
.view-more a:hover{
    opacity: 1;
}
.view-more a:hover::before{
    width: 0;
}
.view-more a:hover::after{
    right: 0;
}

.img-animation.slide-box {
    max-width: 610px;
}

.img-animation img{
    width: 100%;
    transition: 1s var(--cubic-bezier);
    clip-path: inset(0 100% 0 0);
}
.img-animation.scrollin img{
    clip-path: inset(0 0 0 0);
}



/* FADE */
.fadein {
    opacity : 0;
    transform : translate(0, 50px);
    transition : all 600ms;
}
.fadeinr {
    opacity : 0;
    transform : translate(50px, 0);
    transition : all 600ms;
}
.fadeinb {
    opacity : 0;
    transform : translate(0, -50px);
    transition : all 600ms;
    }

.fadeinl {
    opacity : 0;
    transform : translate(-50px, 0);
    transition : all 600ms;
    }

.fadeino {
    opacity : 0;
    transition : all 600ms;
    }

.ts1 {
    transition-delay: 300ms;
}

.ts2 {
    transition-delay: 600ms;
}

.ts3 {
    transition-delay: 900ms;
}

.ts4 {
    transition-delay: 1200ms;
}

.fadein.scrollin, .fadeinr.scrollin, .fadeinb.scrollin, .fadeinl.scrollin {
    opacity : 1;
    transform : translate(0, 0);
    }

.fadeino.scrollin {
   opacity : 1;
}
.text-left{
    text-align: left;
}
.text-center{
    text-align: center;
}
.text-right{
    text-align: right;
}


/* HEADER */
#header{
    position: fixed;
    top: 0;
    right: 0;
    height: 100%;
    width: 80px;
    background-color: #fff;
    z-index: 999;
    border-left: 1px solid #ccc;
    padding: 25px;
    text-align: center;
}
#header .header-logo a{
    color: #3e3e3e;
    font-weight: bold;
}
#header .header-logo a span{
    white-space: nowrap;
    display: block;
    transform: rotate(90deg);
    margin-top: 25px;
    letter-spacing: 0.1em;
}
.nav-toggle{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    width: 19px;
    height: 60px;
    cursor: pointer;
}
.nav-toggle span{
    position: absolute;
    height: 100%;
    width: 1px;
    background-color: var(--base-color);
    transition: .3s;
    top: 0;
}
.nav-toggle span:nth-of-type(1){
    left: 0;
}
.nav-toggle span:nth-of-type(2){
    left: 9px;
}
.nav-toggle span:nth-of-type(3){
    left: 18px;
    height: 50%;
}
.open .nav-toggle span:nth-of-type(1){
    transform: translateX(9px) rotate(20deg);
}
.open .nav-toggle span:nth-of-type(2){
    opacity: 0;
}
.open .nav-toggle span:nth-of-type(3){
    transform: translateX(-9px) rotate(-20deg);
    height: 100%;
}

.nav-toggle .menu-text {
    position: absolute;
    bottom: -35px;
    left: 50%;
    transform: translate(-50%, 0px);
    font-size: 14px;
}


/* DRAWER */
#drawer{
    position: fixed;
    top: 0;
    right: 80px;
    width: calc(100% - 80px);
    height: 100%;
    background-color: var(--base-color);
    text-align: left;
    padding: 0 40px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    overflow-y: scroll;
    transform: translateX(100%);
    transition: .6s var(--cubic-bezier);
    z-index: 998;
}
#drawer a{
    color: #fff;
}
#drawer.open{
    transform: translateX(0);
}
#drawer nav{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
#drawer .sin-ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#drawer .sin-ul:not(:last-child){
    margin-bottom: 50px;
}
#drawer .sin-ul > li > span{
    display: block;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
}
/* #drawer .sin-ul > li > span::before{
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff;
    margin-right: 6px;
    position: relative;
    top: -1px;
} */
#drawer .sin-ul > li,
#footer .sin-ul > li{
    min-width: 140px;
}
#drawer .sin-ul > li > a,
#footer .sin-ul > li > a{
    font-size: 22px;
    font-weight: 900;
    font-family: var(--roboto);
}
#drawer .sec-ul.grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 15px 30px;
}
.drawer-service-grid__n0{
  grid-row-start:1;
  grid-row-end:4;
  grid-column-start:1;
}
.drawer-service-grid__n1{
  grid-row-start:1;
  grid-row-end:2;
  grid-column-start:2;
}
.drawer-service-grid__n2{
  grid-row-start:2;
  grid-row-end:3;
  grid-column-start:2;
}
.drawer-service-grid__n3{
  grid-row-start:3;
  grid-row-end:4;
  grid-column-start:2;
}
/* #drawer .sec-ul{
    padding-left: 1em;
} */
#drawer .sec-ul:not(.grid) > li:not(:last-child),
#footer .sec-ul:not(.grid) > li:not(:last-child){
    margin-bottom: 15px;
}
#drawer .sec-ul > li > a,
#footer .sec-ul > li > a{
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.025em;
}
#drawer a:hover{
    opacity: 1;
}
/* #drawer a[href]::after{
    content: "";
    width: 34px;
    height: 12px;
    background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
    transition: .3s;
    margin-left: 15px;
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
    display: inline-block;
    position: relative;
    top: -1px;
}
#drawer a[href]:hover::after{
    transform: translateX(10px);
} */

#drawer .sin-ul>li>a[href]::after {
    top: -3px;
}

#drawer .sin-ul>li>.sec-ul > li >a[href]::after {
    top: 0px;
}
#drawer .thi-ul,
#footer .thi-ul{
    margin-top: 5px;
}
#footer .thi-ul > li::before,
#drawer .thi-ul > li::before{
    content: "";
    width: 10px;
    height: 1px;
    background-color: #fff;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    top: -2px;
}
#footer .thi-ul > li a{
    font-size: 11px;
}
#drawer .thi-ul > li a{
    font-size: 12px;
}
#drawer .sec-ul > li,
#drawer .thi-ul > li,
#footer .sec-ul > li,
#footer .thi-ul > li{
    line-height: 1.3;
}
/* #footer .sec-ul.pl,
#drawer .sec-ul.pl{
    padding-left: 0;
}
#footer .sec-ul.pl > li,
#drawer .sec-ul.pl > li{
    position: relative;
    padding-left: 30px;
}
#footer .sec-ul .toggle{
    width: 24px;
    height: 24px;
    position: absolute;
    top: 4px;
    left: 0;
    cursor: pointer;
}
#drawer .sec-ul .toggle{
    width: 28px;
    height: 28px;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
}
#footer .sec-ul .toggle::before,
#drawer .sec-ul .toggle::before,
#footer .sec-ul .toggle::after,
#drawer .sec-ul .toggle::after{
    content: "";
    width: 50%;
    height: 2px;
    background-color: #fff;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    transition: .3s;
}
#footer .sec-ul .toggle::after,
#drawer .sec-ul .toggle::after{
    transform: translate(-50%,-50%) rotate(-90deg);
}
#footer .sec-ul .toggle.active::after,
#drawer .sec-ul .toggle.active::after{
    transform: translate(-50%,-50%) rotate(0deg);
}
#footer .sec-ul .toggle + .thi-ul,
#drawer .sec-ul .toggle + .thi-ul{
    display: none;
} */



/* FOOTER */
#footer{
    border: none;
    margin-top: 200px;
}
#footer .wrap{
    padding: 0;
}
.footer-contact{
    display: flex;
    flex-wrap: wrap;
}
.footer-contact__cont {
    background-color: var(--base-color);
    position: relative;
    overflow: hidden;
    width: calc(100% - 340px);
    padding-left: calc((100% - 1240px)/2);
    padding-right: calc((100% - 1240px)/2);
    padding-top: 60px;
    padding-bottom: 120px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
}

.footer-contact__cont nav {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column: 2 / 4;
    margin-top: 50px;
}

.footer-contact__cont nav .sin-ul > li > span {
    display: block;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
}

.footer-contact__cont .sin-ul > li:not(:last-child){
    margin-bottom: 36px;
}

.footer-contact__cont .sin-ul > li > a {
    font-size: 20px;
    font-weight: 900;
    font-family: var(--roboto);
}
.footer-contact__cont a[href]::after {
    content: "";
    width: 34px;
    height: 12px;
    background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
    transition: .3s;
    margin-left: 15px;
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
    display: inline-block;
    position: relative;
    top: -1px;
    display: none;
}
/* .footer-contact__cont .sin-ul > li > span::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #fff;
    margin-right: 6px;
    position: relative;
    top: -1px;
} */
.footer-contact__cont__box__right {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
    z-index: 5;
    max-width: 380px;
}
.footer-contact__cont__box__right__nav li:not(:last-of-type) {
    margin-bottom: 10px;
}
.footer-contact__cont-circle{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: 0;
    display: none;
}
.footer-contact__cont .cm-title{
    margin-bottom: 93px;
}

#footer .footer-contact__cont nav>.sin-ul>li>.sec-ul>li>a{
    font-size: 14px;
}
.footer-contact__cont nav .sin-ul a[href]::after {
    width: 20px;
}

#footer .footer-contact__cont .cm-title__en{
    font-weight: 900;
}
.footer-contact__cont .cm-title__text{
    color: #fff;
}
.footer-contact__cont .cm-title__text::before{
    background-color: #fff;
}
.footer-contact__view-more:not(:last-child){
    margin-bottom: 60px;
}
.footer-contact__view-more a::before{
    background-color: #fff;
}
.footer-contact__view-more a::after{
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
}
.footer-pagetop{
    width: 340px;
    border-left: 1px solid #ccc;
    display: none;
}
.footer-contact__cont nav {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
#footer .footer-pagetop a{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    flex-direction: column;
    color: var(--base-color);
    font-size: 14px;
    position: relative;
}
#footer .footer-pagetop a::before{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0;
    background-color: var(--base-color);
    transition: .3s;
    z-index: -1;
}
#footer .footer-pagetop a::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    background-color: #fff;
}
#footer .footer-pagetop a:hover{
    opacity: 1;
    color: #fff;
}
#footer .footer-pagetop a:hover::before{
    height: 100%;
}
#footer .footer-pagetop a:hover img{
    transform: translateY(-30px);
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
}
#footer .footer-pagetop a img{
    margin-bottom: 60px;
    display: block;
    transition: .3s;
}
.footer-bottom__flex{
    align-items: center;
}
.footer-bottom__text{
    font-size: 12px;
    padding: 60px 0;
    width: calc(100% - 390px);
    border-right: 1px solid #ccc;
}
.footer-bottom__copy{
    font-size: 12px;
    width: 390px;
    text-align: right;
}
.footer-bottom{
    background-color: var(--base-color);
    border-top: 1px solid #ccc;
}

.footer-banners{
    background-color: var(--base-color);
    display:flex;
    flex-wrap:wrap;
    align-items;center;
    justify-content:center;
    gap:20px;
    padding-bottom: 30px;
}
.footer-banner img{
    max-height:19px;
    width:auto;
    height:30px;
}

@media only screen and (min-width:768px){
    .footer-banner img{
        width:auto;
        max-height:30px;
    }
}
@media only screen and (max-width:767px){
    .footer-banners{
        gap:10px;
    }
    .footer-banner{
        width:100%;
        padding:0 20px;
    }
}


/* NEWS */
.top-topics .topics-tab{
    margin-bottom: 60px;
}
.top-topics .topics-tab ul{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px;
}
.topics-tab ul li a{
    display: block;
    padding-bottom: 17px;
    color: var(--gray);
    border-bottom: 1px solid var(--gray);
    font-weight: bold;
    cursor: pointer;
    letter-spacing: 0;
}
.topics-tab ul li a:hover,
.topics-tab ul li a.current,
.topics-tab ul li a[aria-current]{
    opacity: 1;
    color: var(--base-color);
    border-bottom-color: var(--base-color);
}
.topics-tab ul li a.current,
.topics-tab ul li a[aria-current]{
    pointer-events: none;
}
.topics-cont__box{
    border-bottom: 1px solid var(--gray);
}
.topics-cont__box a{
    color: var(--base-color);
    display: flex;
    flex-wrap: wrap;
    padding: 16px;
    align-items: center;
}
.topics-cont__box a:hover{
    opacity: 1;
    background-color: var(--light-gray);
}
.topics-cont__box a:hover .topics-cat::before{
    width: 0;
}
.topics-date{
    text-align: center;
    width: 55px;
    margin-right: 40px;
}
.topics-date span{
    display: block;
}
.topics-date__yymm{
    font-size: 14px;
    font-weight: 900;
    font-family: var(--roboto);
    letter-spacing: 0;
    line-height: 1.5;
}
.topics-date__dd{
    font-size: 46px;
    line-height: 1;
    font-weight: 900;
    font-family: var(--roboto);
    letter-spacing: 0;
}
.topics-cat{
    font-size: 14px;
    letter-spacing: 0;
    width: 160px;
    position: relative;
    margin-right: 40px;
}
.topics-cat::before{
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background-color: var(--base-color);
    transition: .3s;
}
.topics-text{
    letter-spacing: 0;
    width: calc(100% - 295px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}




/* TOP */
.mv{
    height: 100vh;
    position: relative;
    overflow: hidden;
    z-index: 0;
    background: url(img/frontpage/mv.webp) no-repeat center center / cover;
}
.mv .mv-circle{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: calc((100% - 1200px)/2 - 280px);
    height: calc(100% - 30px);
    z-index: -1;
    display: none;
}
.mv .mv-circle img{
    height: 100%;
}
.mv .wrap{
    height: 100%;
}
.mv-item{
    position: absolute;
    transform: translateY(-50%);
    top: 55%;
    width: 88.9%;
    height: 87.9%;
    right: calc(80px + 4vw);
    z-index: 1;
    pointer-events: none;
    display: none;
}
.mv-item img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.mv-box{
    position: relative;
    padding-top: 140px;
    height: 100%;
}
.mv-box::before{
    content: "";
    position: absolute;
    top: 0;
    left: -156px;
    width: 540px;
    height: 100%;
    background-color: #fff;
    z-index: -1;
}
.mv-box__logo{
    margin-bottom: 40px;
}
.mv-box__cont{
    padding: 77px 60px 82px 65px;
    background-color: #fff;
    display: inline-block;
    border-left: 1px solid var(--gray);
    position: relative;
}
.mv-box__cont-ttl{
    font-family: var(--roboto);
    font-weight: 900;
    letter-spacing: 0.1em;
    font-size: 60px;
    /* text-transform: uppercase; */
    margin-bottom: 40px;
    line-height: 1;
}
.mv-box__cont-ttl span{
    display: inline-block;
}
.mv-box__cont-ttl span.tt{
    overflow: hidden;
}
.mv-box__cont-ttl span.nn{
    transform: translateY(100%);
    transition: .5s;
}
.loaded .mv-box__cont-ttl span.nn{
    transform: translateY(0);
    line-height: 1.1;
}
.mv-box__cont-ttl span.nn.delay1{
    transition-delay: .1s;
}
.mv-box__cont-ttl span.nn.delay2{
    transition-delay: .2s;
}
.mv-box__cont-text{
    color: var(--gray);
    font-size: 28px;
    letter-spacing: 0.1em;
    font-weight: bold;
    line-height: 1.39;
    position: relative;
    /* padding-left: 26px; */
}
/* .mv-box__cont-text::before{
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--gray);
    position: absolute;
    top: 14px;
    left: 0;
} */
.mv-box__cont-copy{
    position: absolute;
    font-size: 12px;
    letter-spacing: 0.1em;
    font-family: var(--roboto);
    color: var(--gray);
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    white-space: nowrap;
    bottom: 0;
    left: -20px;
    transform: translateX(-100%);
}
.mv-box__en{
    font-size: 14px;
    letter-spacing: 0.1em;
    margin-top: 60px;
}
.mv-scroll__down{
    position: absolute;
    right: 0;
    bottom: 13vh;
    display: none;
}
.mv-scroll__down-arrow{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
}
.mv-box__leaf{
    position: absolute;
    bottom: 0;
    left: -156px;
    z-index: -1;
}
.home-title{
    padding: 60px 100px 60px 0;
    background-color: #fff;
    border-right: 1px solid var(--blue);
    display: inline-block;
    position: relative;
}
.home-title.right{
    padding: 60px 0 60px 40px;
    border-left: 1px solid var(--blue);
    border-right: none;
    text-align: left;
}
.home-title::before{
    content: "";
    top: 0;
    left: 0;
    transform: translateX(-100%);
    background-color: #fff;
    width: calc((100vw - 1240px)/2);
    height: 100%;
    position: absolute;
}
.home-title.right::before{
    transform: translateX(100%);
    left: auto;
    right: 0;
}

.top-mvs{
  position:relative;
}
.top-mvs__slide{
  height:100vh;
  height:100svh;
  min-height:800px;
}
.top-mvsec__bottom{
  position:relative;
  margin-top:-300px;
}

.top-mvsec__bubble--bg{
  position:relative;
  z-index:1;
  aspect-ratio:5392/1092;
  width:100%;
  z-index:1;
}
.top-mvsec__bubble--bg img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1;
  animation:bubblebg 3s infinite alternate ease-in-out;
}
.top-mvsec__bubble--move,
.top-mvsec__bubble--move02,
.top-mvsec__bubble--move03{
  position:absolute;
  top:0;
  left:0;
  z-index:2;
}
.top-mvsec__bubble--move img{
  position:relative;
  animation:bubblemove 4s infinite linear;
  z-index:2;
}
.top-mvsec__bubble--move02 img{
  position:relative;
  animation:bubblemove 7s infinite linear;
  z-index:2;
}
.top-mvsec__bubble--move03 img{
  position:relative;
  animation:bubblemove 10s infinite linear;
  z-index:2;
}
@keyframes bubblebg{
  0%{
    transform:translateY(10%);
  }
  50%{
    transform:translateY(0);
  }
  100%{
    transform:translateY(-10%);
  }
}
@keyframes bubblemove{
  0%{
    transform:translateY(30%);
    opacity:0;
  }
  50%{
    transform:translateY(0);
    opacity:1;
  }
  100%{
    transform:translateY(-30%);
    opacity:0;
  }
}

.top-mvsec{
  position: relative;
  background: url(img/frontpage/bg-mv01.webp) no-repeat top center / 100%;
  display:flex;
  align-items:center;
  justify-content:center;
  height:100%;
}
.top-mvsec__flex{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:50px;
}
.top-mvsec__maintext{
  margin-top:1em;
  font-size:25px;
  font-weight:bold;
}
.top-mvsec__iso--img img{
  margin:0 auto;
}
.top-mvsec__iso--img figcaption{
  margin-top:2em;
  font-weight:bold;
  line-height:1.6;
  text-align:left;
}
.top-mvsec__logo img{
  mix-blend-mode:darken;
  width:100%;
  max-width:670px;
}

.top-mvs__slide02{
  background-image:url('img/frontpage/slide-mvbg02.webp');
  background-size:cover;
  background-position:bottom center;
  color:#FFF;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.top-mvs__slide02--content--title{
  font-size:57px;
  font-weight:bold;
  line-height:1.6;
  padding-bottom:0.5em;
  margin-bottom:0.5em;
  border-bottom:1px solid #FFF;
}
.top-mvs__slide02--content--text{
  line-height:2;
}

.top-mvs__slide03{
  background-image:url('img/frontpage/slide-mvbg03.webp');
  background-size:cover;
  background-position:bottom center;
  height:100%;
  position:relative;
}
.top-mvs__slide03--content{
  position:absolute;
  left:50%;
  top:50%;
  transform:translateY(-50%);
}
.top-mvs__slide03--content--title{
  margin-bottom:50px;
}
.top-mvs__slide03--content--text{
  line-height:2;
}

.top-concept{
    overflow: hidden;
    background: url(img/frontpage/concept-bg.webp) no-repeat center 50px / contain;
}
.top-concept__bg{
    position: absolute;
    transform: translateX(-50%);
    top: 0;
    left: 50%;
    z-index: -1;
}
.top-concept__cont{
    margin-top: -30px;
}
.top-concept__box{
    margin-left: auto;
    backdrop-filter: blur(20px) brightness(1.05);
    padding: 52px 0 52px 60px;
    margin-bottom: 40px;
    position: relative;
}
.top-concept__box::before{
    content: "";
    width: 100%;
    height: 100%;
    transform: translateX(100%);
    top: 0;
    right: 0;
    position: absolute;
    background-color: #fff;
}
.top-concept__box:last-child{
    margin-bottom: 0;
}
.top-concept__box.n1{
    width: 38.7%;
}
.top-concept__box.n2{
    width: 54.8%;
}
.top-concept__box.n3{
    width: 71%;
}
.top-concept__box-ttl{
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 8px;
}
.top-concept__box-ttl::before{
    content: "";
    display: inline-block;
    margin-right: 15px;
    width: 10px;
    height: 10px;
    background-color: var(--base-color);
    border-radius: 50%;
    vertical-align: middle;
    position: relative;
    top: -5px;
}
.top-concept__box-text{
    font-size: 20px;
    color: var(--gray);
    font-weight: bold;
}
.top-concept__view-more{
    position: absolute;
    top: 300px;
    left: 0;
}

.top-concept__flex{
  display:flex;
  gap:60px;
  align-items:center;
}
.top-concept__flex__cont{
  width:calc(60% - 60px);
}
.top-concept__flex__img{
  width:40%;
}
/* .top-company{
    margin-top: 120px;
} */
.home-concept-sec01__logo {
    position: absolute;
    top: 20px;
    left: 2%;
    z-index:3;
}
.home-concept-sec01__logo img {
    max-width: 150px;
    width: 100%;
}
.top-company,
.top-sdgs,
.top-service,
.top-recruit{
    padding-bottom: 220px;
}
.top-service {
    overflow: hidden;
}
.top-company__bg,
.top-sdgs__bg{
    position: relative;
}
.top-company__circle{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
}
.top-company__circle{
    left: 0;
}
.top-company__bg-img,
.top-sdgs__bg-img{
    width: 100vw;
    max-width: 100vw;
    position: relative;
    transform: translateX(-50%);
    left: 50%;
    object-fit: cover;
}
.top-company__bg-img{
    height: 600px;
    filter: brightness(.8);
}
.top-company__bg-text,
.top-sdgs__bg-text{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: 0;
    font-size: 50px;
    font-weight: 900;
    color: #fff;
    width: 100%;
    text-align: center;
}
.top-company .cm-title,
.top-sdgs .cm-title,
.top-service .cm-title,
.top-recruit .cm-title{
    position: relative;
    z-index: 1;
    margin-top: -160px;
}
.top-company__view-more{
    margin: 80px 0;
}
.top-company__view-more:last-child{
    margin-bottom: 0;
}
.top-company__leaf,
.top-recruit__leaf{
    top: 600px;
    position: absolute;
    z-index: -1;
}
.top-company__leaf{
    transform: translateX(440px);
    right: 0;
}
.top-recruit__leaf{
    transform: translateX(-440px);
    left: 0;
}
.top-sdgs__bg-img{
    height: 980px;
}
.top-sdgs__circle{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
}
.top-sdgs__cont{
    margin-top: -66px;
    position: relative;
}
.top-sdgs__cont-img{
    max-width: 1140px;
}
.top-sdgs__cont-img img{
    transform: translateX(-480px);
}
.top-sdgs__view-more{
    position: absolute;
    top: 100px;
    right: 0;
}
.top-service__slider-wrap{
    margin-top: 80px;
    padding-left: calc((100vw - 1320px)/2);
}
.top-service__slider-item{
    width: 400px;
    margin-right: 16px;
}
.top-service__slider-item__thumb{
    position: relative;
}
.top-service__slider-item a:hover{
    opacity: 1;
}
.top-service__slider-item a:hover .top-service__slider-item__thumb::before{
    opacity: 1;
}
.top-service__slider-item__thumb::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.6);
    opacity: 0;
    transition: .3s;
    z-index: 1;
}
.top-service__slider-item__thum-circle{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    width: calc(100% - 60px);
    z-index: 2;
    opacity: 0;
}
.top-service__slider-item__text{
    font-size: 20px;
    font-weight: bold;
    position: relative;
    padding-left: 26px;
    margin-top: 25px;
    color: var(--base-color);
}
.top-service__slider-item__text::before{
    content: "";
    width: 10px;
    height: 10px;
    background-color: var(--base-color);
    border-radius: 50%;
    position: absolute;
    top: 13px;
    left: 0;
}
.top-service__view-more,
.top-recruit__view-more{
    margin-top: 80px;
}
.top-service__slider-item__thum-img{
    clip-path: inset(0 100% 0 0);
    transition: .6s var(--cubic-bezier);
}
.top-service__slider-wrap.scrollin .top-service__slider-item__thum-img{
    clip-path: inset(0 0 0 0);
}
.top-service__slider-nav{
    margin-bottom: 40px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 20px;
}
.top-service__slider-nav__item{
    cursor: pointer;
}
.service-sec01.top-servicesec{
  margin-bottom:0;
}
.service-sec01__bottom{
  position:relative;
  z-index:-1;
}

.top-concept-title__en{
  font-size:125px;
  -webkit-text-stroke: 2px var(--blue);
  letter-spacing:0;
  color:transparent;
}
.top-concept--text{
  margin:20px 0 80px;
  line-height:2;
  font-size:18px;
  font-weight:bold;
}

.top-erbannersec{
  margin-top:-80px;
  padding-bottom:200px;
}
.top-erbanner a{
  position:relative;
  display:block;
  color:#FFF;
}
.top-erbanner a:hover{
  opacity:1;
}
.top-erbanner-bg{
  position:absolute;
  z-index:1;
  width:100%;
  height:100%;
  overflow:hidden;
}
.top-erbanner-bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:0.4s ease;
}
.top-erbanner a:hover .top-erbanner-bg img{
  transform:scale(1.1);
}
.top-erbanner-content{
  position:relative;
  z-index:2;
  padding:90px;
}
.top-erbanner-title{
  font-size: 125px;
  line-height: 0.7;
  white-space: nowrap;
  font-family: var(--roboto);
  font-weight: 900;
  -webkit-text-stroke: 1px #fff;
  color: transparent;
}
.top-erbanner-title__colored{
  -webkit-text-stroke-width:2px;
  -webkit-text-stroke-color:#C50018;
}
.top-erbanner-text{
  font-size:24px;
  font-weight:900;
  margin:1.2em 0 3em;
}
.top-erbanner__view-more{
  font-family: var(--roboto);
  font-size: 14px;
  letter-spacing: 0.1em;
  position: relative;
  width: 300px;
  display: block;
  padding-bottom: 16px;
}
.top-erbanner__view-more p::before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  height: 1px;
  width: 100%;
  background-color: #FFF;
  transition: .3s;
}
.top-erbanner__view-more p::after {
  content: "";
  width: 34px;
  height: 12px;
  background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
  position: absolute;
  top: 8px;
  right: 10px;
  transition: .3s;
  -webkit-filter: brightness(0) grayscale(100%) invert(1);
  -moz-filter: brightness(0) grayscale(100%) invert(1);
  -o-filter: brightness(0) grayscale(100%) invert(1);
  -ms-filter: brightness(0) grayscale(100%) invert(1);
  filter: brightness(0) grayscale(100%) invert(1);
}

.top-recruit__view-more a{
    margin-left: auto;
}
.top-topics__box{
    position: relative;
    margin-bottom: 80px;
    background-color: var(--light-gray);
}
.top-topics__box::before{
    content: "";
    width: calc(100vw - 1240px);
    height: 100%;
    background-color: var(--light-gray);
    position: absolute;
    top: 0;
    right: 0;
    transform: translateX(100%);
}
.top-topics__box-flex{
    padding: 60px 0 60px 60px;
    overflow: hidden;
    align-items: center;
    position: relative;
    justify-content: space-between;
    z-index: 0;
}
.top-topics__box-circle{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: 0;
    z-index: -1;
}
.top-topics__cont .topics-cont:not(.show){
    display: none;
}
.top-topics__cont .topics-cont{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    column-gap: 40px;
}

.top-column__grid .top-column__grid__box {
    overflow: hidden;
}

.top-column__grid .top-column__grid__box img {
    filter: brightness(.5);
    aspect-ratio: 4 / 3;
    object-fit: cover;
    transition: .3s;
    width: 100%;
    height: 100%;
}

.top-column__grid .top-column__grid__box:hover img {
    transform: scale(1.1);
}

.top-column__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

.top-column__grid .top-column__grid__box {
    display: block;
    position: relative;
}

.top-column__grid .top-column__grid__box span {
    position: absolute;
    top: 48%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-weight: bold;
    font-size: clamp(18px, 3vw, 40px);
}

.top-column__grid .top-column__grid__box .view-more {
    transform: translateX(-50%);
    font-size: 18px;
    top: inherit;
    font-weight: 500;
    bottom: 20%;
    left: 50%;
    width: 170px;
}

.top-column__grid .top-column__grid__box .view-more::before {
    content: "";
    width: 100%;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 1px;
    background-color: #fff;
    position: absolute;
    transition: .3s;
}

.top-column__grid .top-column__grid__box .view-more::after {
    content: "";
    width: 34px;
    height: 12px;
    background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
    position: absolute;
    top: 55%;
    right: 10px;
    transition: .3s;
    filter: brightness(0) grayscale(100%) invert(1);
    transform: translateY(-50%);
    transition: .3s;
}

.top-column__grid .top-column__grid__box:hover .view-more::before {
    width: 0;
}

.top-column__grid .top-column__grid__box:hover .view-more::after {
    transform: translateY(-50%) translateX(20%);
}

.concept-sec01__cont__four-content {
    display: grid;
    grid-template-columns: 22% 73%;
    gap: 20px;
    /* backdrop-filter: blur(30px); */
    background-color: #ffffff50;
    max-width: 650px;
    margin: 0 auto;
    padding: 10px 20px;
    align-items: center;
}

/* PAGE */
.page-mv{
    position: relative;
    z-index: 0;
    overflow: hidden;
}
.page-mv__bg{
    height: 260px;
    overflow: hidden;
}
.page-mv__bg-img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page-mv__circle{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: calc((100% - 1240px)/2);
    mix-blend-mode: overlay;
}
.page-mv .cm-title{
    width: 100%;
    background-color: #fff;
    padding-top: 60px;
    position: relative;
}
.page-mv .cm-title::before{
    content: "";
    width: calc((100vw - 1240px)/2);
    background-color: #fff;
    height: 100%;
    position: absolute;
    transform: translateX(-100%);
    left: 0;
    top: 0;
}
.page-mv__cm-title__item{
    position: absolute;
    top: -40px;
    right: 60px;
    clip-path: inset(0 100% 0 0);
    transition: .6s var(--cubic-bezier);
    display: none;
}
.loaded .page-mv__cm-title__item{
    clip-path: inset(0 0 0 0);
}
.page-title .cm-title__en span{
    transform: scaleX(-1);
}
.subtitle{
    margin-bottom: 80px;
}
.subtitle-text{
    color: var(--blue);
    font-size: 28px;
    font-weight: bold;
    position: relative;
    padding: 20px 0 20px 60px;
}
.subtitle-text span{
    clip-path: inset(0 100% 0 0);
    transition: .3s;
    transition-delay: .2s;
}
.subtitle-text::before{
    content: "";
    position: absolute;
    width: 20px;
    height: 0;
    transition: .3s;
    background-color: var(--blue);
    top: 0;
    left: 0;
}
.subtitle-text span::before{
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--blue);
    margin-right: 15px;
    position: relative;
    top: -5px;
}
.subtitle-text.scrollin::before{
    height: 100%;
}
.subtitle-text.scrollin span{
    clip-path: inset(0 0 0 0);
}
.subtitle-text.scrollin span small{
  color:var(--base-color);
  font-size:0.7em;
}
.page-link-tab{
    margin-bottom: 200px;
}
.page-link-tab ul{
    display: grid;
    grid-template-columns: repeat(5,1fr);
    gap: 12px;
}
.page-link-tab ul li a{
    color: var(--base-color);
    font-size: 14px;
    padding: 25px 32px;
    border: 1px solid var(--base-color);
    border-bottom: none;
    display: block;
    position: relative;
    z-index: 0;
}
.page-link-tab ul li a::after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: var(--base-color);
    transition: .3s;
    opacity: 0;
    z-index: -1;
}
.page-link-tab ul li a::before{
    content: "";
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: 40px;
    width: 20px;
    height: 12px;
    background: url(img/page/page-tab-arrow.svg) no-repeat center center / contain;
    transition: .3s;
}
.page-link-tab ul li a.current,
.page-link-tab ul li a:hover{
    opacity: 1;
    color: #fff;
}
.page-link-tab ul li a.current::before,
.page-link-tab ul li a:hover::before{
    right: 30px;
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
}
.page-link-tab ul li a.current::after,
.page-link-tab ul li a:hover::after{
    opacity: 1;
    width: 100%;
}
.page-link-tab ul li a.current{
    pointer-events: none;
}
.edge-text{
    font-size: 180px;
    line-height: 0.8;
    font-family: var(--roboto);
    font-weight: 900;
    -webkit-text-stroke: 1px var(--blue);
    color: #fff;
}
.edge-text.sm{
    font-size: 120px;
}
.edge-text.sc span{
    transform: scaleX(-1);
    transition: .3s;
    display: inline-block;
}
.edge-text.scrollin span{
    transform: scaleX(1);
}
.line-title{
    margin-bottom: 40px;
    padding-bottom: 20px;
    position: relative;
}
.line-title::before{
    content: "";
    width: 0;
    height: 1px;
    background-color: var(--gray);
    position: absolute;
    bottom: 0;
    left: 0;
    transition: .3s;
    transition-delay: .3s;
}
.line-title.scrollin::before{
    width: 100%;
}
.line-title span{
    font-size: 24px;
    padding-left: 26px;
    font-weight: bold;
    position: relative;
    display: block;
    line-height: 1.6;
}
.line-title span::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: var(--blue);
    transition: .3s;
}
.line-title.scrollin span::before{
    width: 6px;
}
.common-dl{
    display: flex;
    flex-wrap: wrap;
}
.common-dl dt,
.common-dl dd{
    padding: 20px 0;
}
.common-dl dt{
    font-size: 18px;
    font-weight: bold;
    border-bottom: 2px solid var(--gray);
    width: 400px;
}
.common-dl dd{
    border-bottom: 1px solid var(--gray);
    width: calc(100% - 400px);
}
.common-dl dd ul li{
    padding-left: 1em;
}
.common-dl dd ul li::before{
    content: "・";
    margin-left: -1em;
}




/* BREADCRUMBS */
.breadcrumbs{
    margin: 10px 0 140px;
}
.breadcrumbs span,
.breadcrumbs span a{
    font-size: 14px;
    color: var(--gray);
}
.breadcrumbs span.divide{
    padding: 0 5px;
}
.breadcrumbs span a{
    text-decoration: underline;
}

.concept-sec03-4 {
    position: relative;
    z-index: 10;
}

.concept-sec03-4__grid__box {}

/* CONCEPT */
.concept-sec01{
    min-height: 1280px;
    padding-top: 94px;
    position: relative;
    background: url(img/concept/concept-bg01.webp) no-repeat center center / cover;
    margin-top: 30px;
}
.concept-sec01__text{
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    margin-bottom: 55px;
}
.concept-sec01__ttl{
    font-size: 48px;
    font-weight: 900;
    line-height: 1.6;
    font-family: var(--roboto);
    letter-spacing:0.1em;
    text-align: center;
}
.concept-sec01__circle{
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    position: absolute;
}
.concept-sec01__cont{
    margin-top: 120px;
}
.concept-sec01__cont-box{
    padding: 35px 0;
    background:#FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 800px;
    margin: 0 auto 15px;
}
.home .concept-sec01 {
    min-height: 1180px;
    margin-top: 20px;
}
.home .concept-sec01__text {
    margin-bottom: 35px;
}
.home .concept-sec01__cont-box{
    width: 100%;
    margin: 0 auto;
    display: block;
    padding: inherit;
}
.home .concept-sec01__cont__sub-title {
    line-height: 1.5;
    font-size: 28px;
}

.home .concept-sec01__cont-box {
    backdrop-filter: inherit;
}
.home .concept-sec01__cont-box__ttl {
    font-size: 14px;
    margin-right: inherit;
}

.home .concept-sec01__cont-box__ttl::before {
    width: 5px;
    height: 5px;
}

.home .concept-sec01__cont {
    margin-top: 225px;
}
.home .concept-sec01__circle {
    display: none;
}

.concept-sec01__cont-box__group {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.concept-sec01__cont__four-content .concept-sec01__cont__sub-title {
    font-size: 16px;
    margin-bottom: 0;
    position: relative;
}
.concept-sec01__cont__four-content .concept-sec01__cont__sub-title::after {
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    top: 0;
    right: -3px;
    background-color: #aaa;
}
.concept-sec01__cont-box:last-child{
    margin-bottom: 0;
}
.concept-sec01__cont__sub-title {
    font-size: 35px;
    margin-bottom: 30px;
    text-align: center;
    font-weight: 700;
}
.concept-sec01__cont-box__ttl{
    font-size: 24px;
    font-weight: bold;
    margin-right: 40px;
}
.concept-sec01__cont-box__ttl::before{
    content: "";
    width: 10px;
    height: 10px;
    background-color: var(--base-color);
    margin-right: 8px;
    vertical-align: middle;
    display: inline-block;
    border-radius: 50%;
    position: relative;
    top: -2px;
}
.concept-sec01__cont-box__text{
    width: 100%;
    max-width: 375px;
    color: var(--gray);
    font-size: 18px;
    font-weight: bold;
    line-height: 1.6;
}
.concept-sec01__bottom-text{
    text-align: center;
    font-size: 14px;
    font-family: var(--roboto);
    margin-top: 20px;
}

.concept-sec02{
    margin-top: 110px;
    position: relative;
}
.concept-sec02__bg{
    height: 360px;
    width: 100%;
    object-fit: cover;
}
.concept-sec02__bg-item{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    animation: concept-sec02__bg-item-fuwafuwa ease-in-out 2.5s infinite;
}

.concept-sec02__cont-box {
    max-width: 800px;
    margin: 0 auto 50px;
    text-align: center;
    font-weight: 700;
}
.circle-text {
    top: 20%;
    max-width: 20vw;
}
.circle-text .circle-text__text {
    /* animation: rotate 20s linear infinite; */
}
.circle-text.left {
    left: calc(100% - 1200px / 2);
}
.circle-text.right {
    right: calc(100% - 1200px / 2);
}

.circle-text__left__item {
    position: absolute;
    top: 20%;
    left: 25%;
    animation: concept-sec02__bg-item-fuwafuwa ease-in-out 2.5s infinite;
    display: none;
}
.circle-text__right__item {
    position: absolute;
    bottom: -40%;
    right: 5%;
    animation: concept-sec02__bg-item-fuwafuwa ease-in-out 2.5s infinite;
    display: none;
}

.concept-sec02__cont-box:last-child {
    margin-bottom: 0;
}

.concept-sec02__cont-box__title,
.concept-sec03-2__cont-box__title,
.concept-sec03__title,
.concept-sec03-3__cont-box__title,
.concept-sec03-4__cont-box__title {
    font-size: clamp(25px, 3vw, 34px);
    margin-bottom: 15px;
    color: #0249D8;
    font-weight: 700;
}

.concept-sec03__title,
.concept-sec03-3__cont-box__title {
    text-align: center;
    margin-bottom: 50px;
}

.concept-sec02__cont-box__big-text {
    font-size: clamp(18px, 2vw, 30px);
}

.concept-sec02__cont-box__text,
.concept-sec02__cont-box__list li {
    font-size: clamp(16px, 2vw, 24px);
}

.concept-sec03__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px;
    margin-bottom: 100px;
}


.concept-sec03__grid__box__list {
    counter-reset: count;
    backdrop-filter: blur(1);
}

.concept-sec03__grid__box__list li {
    display: flex;
    padding-left: 20px;
}

.concept-sec03__grid__box__list li::before{
    content: counter(count)')';
    counter-increment: count;
    margin-right: 5px;
}

.concept-sec03__grid__box__title {
    margin-bottom: 30px;
    font-size: clamp(18px, 2vw, 23px);
    font-weight: 700;
    text-align: center;
    color: #0249D8;
    border-bottom: 1px solid #0249D8;
    padding-bottom: 15px;
}

.concept-sec02__cont-box__list {
    margin-top: 30px;
}

.concept-sec03__word-box__title {
    font-size: clamp(27px, 3vw, 45px);
    color: #0249D8;
    text-align: center;
    margin-bottom: 50px;
    font-weight: 700;
}

.concept-sec03__grid__box__icon {
    text-align: center;
    margin-bottom: 20px;
}

.concept-sec03__grid__box__icon svg {
    fill: #0249D8;
    width: 50px;
    height: 50px;
}

.concept-sec03__word-box__cont__spirit {
    width: fit-content;
    margin: 0 auto 50px;
    text-align: center;
    font-weight: 700;
}

.concept-sec03__word-box__cont__spirit li {
    font-size: 26px;
}

.concept-sec03__word-box__cont__kowlege {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 20px;
}

.concept-sec03__word-box__cont__kowlege__box {
    position: relative;
    padding: 66px 10px;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.concept-sec03__word-box__cont__kowlege img {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    z-index: -1;
    filter: blur(4px);
}

.concept-sec03__word-box__cont__kowlege__box:nth-child(1),
.concept-sec03__word-box__cont__kowlege__box:nth-child(6) {
    transform: translateY(-50px);
}
.concept-sec03__word-box__cont__kowlege__box:nth-child(3),
.concept-sec03__word-box__cont__kowlege__box:nth-child(4) {
    transform: translateY(50px);
}

.concept-sec03-3__cont-box__title {
    font-size: clamp(16, 2vw, 25px);
}


.concept-sec03-2__cont-box__title__subtitle {
    font-size: 25px;
    font-weight: bold;
    margin-bottom: 15px;
}

.concept-sec03-2__cont-box {
    margin-bottom: 50px;
    text-align: center;
}

.concept-sec03-2__grid {
    display: grid;
    grid-template-columns: 42% 55%;
    align-items: center;
    gap: 50px;
}

.concept-sec03-2__grid__text-box {
    font-size: 1.2em;
    counter-reset: k-item;
}

.concept-sec03-2__grid__text-box li {
    display: flex;
    gap: 10px;
}

.concept-sec03-2__grid__text-box li::before {
    content: counter(k-item)')';
    counter-increment: k-item;
}

.concept-sec03-3__flex {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.concept-sec03-3__flex__box {
    padding: 30px 20px 20px;
    width: 31.33%;
}

.concept-sec03-3__flex__box__title {
    font-size: 20px;
    margin-bottom: 30px;
    text-align: center;
    color: #0249D8;
    padding-bottom: 15px;
    border-bottom: 1px solid #0249D8;
    font-weight: 700;
}
.concept-sec03-3__flex__box__icon {
    margin-bottom: 10px;
    text-align: center;
}
.concept-sec03-3__flex__box__icon svg {
    width: 50px;
    height: 50px;
    text-align: center;
}

.concept-sec03-3__flex__box__icon svg path {
    fill: #0249D8;
}

.concept-sec03-3__big-text {
    font-size: 20px;
    margin-bottom: 30px;
}

.concept-sec03-3__detail-text {
    text-align: right;
    font-size: 18px;
    margin-bottom: 50px;
}

.concept-sec03-3__environment-list,
.concept-sec03-3__flex__box__text {
    counter-reset: count;
}

.concept-sec03-3__environment-list li,
.concept-sec03-3__flex__box__text li {
    display: flex;
    gap: 5px;
}
.concept-sec03-3__environment-list li::before,
.concept-sec03-3__flex__box__text li::before {
    content: counter(count)')';
    counter-increment: count;
}

.concept-sec03-3__environment-list li {
    margin-bottom: 5px;
}

.concept-sec03-4__cont-box {
    text-align: center;
    margin-bottom: 50px;
}
.concept-sec03-4__cont-box__subtext {
    font-weight: 700;
}
.concept-sec03-4__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
    margin-bottom: 100px;
}

.concept-sec03-4__grid__box {
    position: relative;
    border: 1px solid #0249D8;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.concept-sec03-4__grid__box__number {
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-50%, -50%);
    background-color: #0249D8;
    color: #fff;
    padding: 10px;
    font-size: 25px;
    line-height: 1;
}

.concept-sec03-4__grid__box__text {
    font-size: clamp(16px, 2vw, 25px);
}

.concept-sec03-4__grid__box__text em {
    font-size: 1.3em;
    font-weight: bold;
    display: inline-block;
    padding: 5px;
    color: #0249D8;
}

.concept-sec03-5__grid {
    display: grid;
    grid-template-columns: 35% 60%;
    gap: 50px;
}

.concept-sec03-5__grid__text-box__text {
    margin-bottom: 30px;
    font-size: 20px;
}

@keyframes concept-sec02__bg-item-fuwafuwa{
    0% {
        transform: translate(-50%,-50%);
    }
    50% {
        transform: translate(-50%,calc(-50% - 20px));
    }
    100% {
        transform: translate(-50%,-50%);
    }
}
.concept-sec03,
.concept-sec03-2,
.concept-sec03-3,
.concept-sec03-4,
.concept-sec03-5,
.concept-sec04{
    padding-top: 200px;
}
.concept-sec04__flex{
    justify-content: space-between;
}
.concept-sec04__flex-img{
    width: 320px;
}
.concept-sec04__flex-box{
    width: calc(100% - 400px);
}
.concept-sec04__flex-box__ttl{
    margin-left: -110px;
    margin-top: -80px;
}
.concept-sec04__flex-box__label{
    font-weight: bold;
    font-size: 26px;
    line-height: 1.6;
    margin: 10px 0 40px;
}
.concept-sec04__flex-box__name{
    text-align: right;
    margin-top: 45px;
}

/* ABOUT */
.about-sec00__ovvflex{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:30px;
}
.about-sec01__grid {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 50px;
}

.about-detail__box {
    display: flex;
    gap: 30px;
    padding: 15px;
    border-bottom: 1px solid #ccc;
}

.about-detail__box dt {
    min-width: 250px;
    font-weight: bold;
}

.about-detail__box__detail__box {
    padding: 5px;
}

.about-detail__box__detail__box:first-child {
    padding-top: 0;
}

.about-yakuin__grid{
  display:flex;
  flex-wrap:wrap;
  gap:20px 200px;
}

.about-linkbanner{
  width:100%;
  max-width:548px;
  margin:0 auto;
}
.about-linkbanner a{
  color:#FFF;
  display:block;
  overflow:hidden;
  position:relative;
  padding:40px;
}
.about-linkbanner__bg{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:-1;
}
.about-linkbanner__bg img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:0.6s ease;
}
.about-linkbanner a:hover .about-linkbanner__bg img{
  transform:scale(1.1);
}
.about-linkbanner--title{
  font-size:22px;
  font-weight:900;
  margin-bottom:10px;
}
.about-linkbanner__flex{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.about-linkbanner__flex__btn{
  width: 100px;
  height: 100px;
  position: relative;
}
.about-linkbanner__flex__btn::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 4%;
  left: 4%;
  width: 92%;
  height: 92%;
  background: url(img/about/careercourse-ring.svg) no-repeat center center / cover;
  animation: service-sec01__cont-pin 20s linear infinite;
  transition: all .3s ease;
}
.about-linkbanner__flex__btn::after {
  content: '→';
  font-size: 24px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


/* ACCESS */

.access-sec01__cont{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 120px 80px;
}
.access-sec01__cont-box.wide{
    grid-column: 1/3;
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.access-sec01__ttl{
    position: absolute;
    bottom: -60px;
    left: 0;
    width: 100%;
    z-index: -1;
}
.access-sec01__cont-box.wide .access-sec01__cont-box__map{
    width: 780px;
}
.access-sec01__cont-box__wide-box{
    width: calc(100% - 780px);
    padding-right: 40px;
}
.access-sec01__cont-box.wide .access-sec01__cont-box__map{
    margin-top: 0;
}
.access-sec01__cont-box.wide .access-sec01__cont-box__map iframe{
    height: 500px;
}
.access-sec01__cont-box__map{
    margin-top: 23px;
}
.access-sec01__cont-box__map iframe{
    width: 100%;
    height: 330px;
}


/* QUALIFICATION */
.qual-sec01__ttl,
.register-sec01__ttl,
.about-sec01__ttl {
    margin-bottom: 60px;
}
.qual-sec01__cont:not(:last-child),
.register-sec01__cont:not(:last-child){
    margin-bottom: 120px;
}
.qual-sec01__dl-dd,
.register-sec01__dl-dd,
.env-sec03__cont-box__dl-dd,
.comprehensive-sec02__cont-dd{
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.register-sec01__cont:first-of-type{
    padding-top: 100px;
}
.register-sec01__dl dd .new{
  color:var(--blue);
}

.register-certimg{
    margin:40px 0;
    text-align:center;
}
.register-certimg img{
    width:100%;
    max-width:800px;
}

.qual-qualifications{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0 20px;
  padding-bottom:50px;
  border-bottom:1px solid var(--gray);
}
.qual-qualification li{
  padding-left:1em;
}
.qual-qualification li::before{
  content:'・';
  margin-left:-1em;
}



/* ORGANIZATION */
.organize-sec01__graph{
    text-align: center;
}


/* HHSTORY */
.history-sec01__cont{
    position: relative;
    z-index: 0;
}
.history-sec01__cont-bg-text{
    position: absolute;
    z-index: -1;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: 200px;
    color: #EFF3F8;
    line-height: 0.8;
    font-weight: 900;
    font-family: var(--roboto);
    position: absolute;
    letter-spacing: 0;
}
.history-sec01__cont-bg-text.right{
    top: 260px;
    right: 0;
}
.history-sec01__cont-bg-text.left{
    bottom: 50px;
    left: 0;
    transform: scale(-1,-1);
}
.history-sec01__cont-line{
    z-index: -1;
    border-left: 3px dashed var(--blue);
    position: absolute;
    top: 0;
    left: 50%;
    height: 100%;
    clip-path: inset(0 0 100% 0);
    transform: translateX(-50%);
}
.history-sec01__cont-line.end{
    clip-path: inset(0 0 0 0) !important;
}
.history-sec01__cont-dl{
    display: flex;
    flex-wrap: wrap;
}
.history-sec01__cont-dl:last-child dd{
    padding-bottom: 0;
}
.history-sec01__cont-dl.items-end{
    align-items: flex-end;
}
.history-sec01__cont-dl.reverse{
    flex-direction: row-reverse;
}
.history-sec01__cont-dl:not(.reverse) dd{
    padding-left: 120px;
}
.history-sec01__cont-dl.reverse dd{
    text-align: right;
    padding-right: 120px;
}
.history-sec01__cont-dl:not(.reverse) dt{
    padding-right: 120px;
}
.history-sec01__cont-dl.reverse dt{
    padding-left: 120px;
}
.history-sec01__cont-dl dt{
    opacity: 0;
    transform: translateY(50px);
    transition: .6s;
}
.history-sec01__cont-dl dt.active{
    opacity: 1;
    transform: translateY(0);
}
.history-sec01__cont-dl dt,
.history-sec01__cont-dl dd{
    width: 50%;
    padding-bottom: 94px;
}
.history-sec01__cont-dl__box-ttl{
    font-size: 26px;
    font-weight: bold;
    color: var(--blue);
    margin-bottom: 5px;
}
.history-sec01__cont-dl__box-ttl,
.history-sec01__cont-dl__box-text{
    opacity: 0;
    transition: .3s;
    transition-delay: .3s;
}
.history-sec01__cont-dl__box.active .history-sec01__cont-dl__box-ttl,
.history-sec01__cont-dl__box.active .history-sec01__cont-dl__box-text{
    opacity: 1;
}
.history-sec01__cont-dl__box{
    position: relative;
}
.history-sec01__cont-dl__box::before{
    content: "";
    transform: translateY(-50%);
    width: 0;
    height: 1px;
    background-color: var(--base-color);
    position: absolute;
    top: 50%;
    transition: .3s;
}
.history-sec01__cont-dl__box.active::before{
    width: 105px;
}
.history-sec01__cont-dl__box::after{
    content: "";
    transform: translateY(-50%);
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background-color: var(--base-color);
    top: 50%;
    position: absolute;
    opacity: 0;
    transition: .3s;
}
.history-sec01__cont-dl__box.active::after{
    opacity: 1;
}
.history-sec01__cont-dl__box:not(:last-child){
    margin-bottom: 40px;
}
.history-sec01__cont-dl.reverse .history-sec01__cont-dl__box::before{
    right: -120px;
}
.history-sec01__cont-dl:not(.reverse) .history-sec01__cont-dl__box::before{
    left: -120px;
}
.history-sec01__cont-dl.reverse .history-sec01__cont-dl__box::after{
    right: -124px;
}
.history-sec01__cont-dl:not(.reverse) .history-sec01__cont-dl__box::after{
    left: -124px;
}

.history-year{
  position:relative;
  background: var(--gray);
  aspect-ratio:50/26;
  width:100%;
}
.history-year img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.history-year--text{
  position:absolute;
  color:var(--blue);
  opacity:0.63;
  font-family:var(--roboto);
  font-size:160px;
  line-height:0.8;
  font-weight:bold;
  bottom:0;
  right:0;
}
.history-sec01__cont-dl.reverse .history-year--text{
  right:unset;
  left:0;
}


/* SUSTAINABILITY */
.sdgs-sec01__logo-box{
    position: relative;
    text-align: center;
}
.sdgs-sec01__logo-img{
    max-width: 480px;
    margin: 0 auto;
}
.sdgs-sec01__logo-bg{
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    animation: sdgs-sec01__logo-bg-fuwafuwa ease-in-out 2.5s infinite;
    display: none;
}
@keyframes sdgs-sec01__logo-bg-fuwafuwa{
    0% {
        transform: translateY(-50%);
    }
    50% {
        transform: translateY(calc(-50% - 20px));
    }
    100% {
        transform: translateY(-50%);
    }
}
.sdgs-sec01__logo-bg.left{
    left: 0;
}
.sdgs-sec01__logo-bg.right{
    right: 0;
    animation-delay: .6s;
}
.sdgs-sec01__text{
    text-align: center;
    margin-top: 40px;
}
.sdgs-sec01__cont{
    margin-top: 120px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 80px;
}
.sdgs-sec01__cont-box__icon{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 7px;
}
.sdgs-sec01__cont-box__text{
    margin-top: 10px;
}
.sdgs-sec01__cont-box__icon-item img{
    height: 138px;
}
.sdgs-sec01__view-more-wrap{
    text-align: center;
    margin-top: 100px;
}
.sdgs-sec01__view-more{
    display: inline-block;
    padding: 40px 50px;
    background-color: var(--base-color);
}
.sdgs-sec01__view-more a{
    color: #fff;
    text-align: left;
}
.sdgs-sec01__view-more a::before{
    background-color: #fff;
}
.sdgs-sec01__view-more a::after{
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
}
.sdgs-sec02__cont{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 160px 80px;
}
.sdgs-sec02__cont-box__text{
    margin-top: 15px;
}
.sdgs-sec02__cont-box.jcc{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.sdgs-sec03__cont:not(:last-of-type){
  margin-bottom:100px;
}
.sdgs-sec03__cont__box:not(:last-of-type){
  margin-bottom:60px;
}
.sdgs-sec03__cont__box{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:20px;
}
.sdgs-sec03__cont__box__texts.long{
  width:100%;
}
.sdgs-sec03__cont__box__isobox{
  display:flex;
  gap:20px;
  justify-content:flex-end;
}
.sdgs-sec03__cont__box__isobox--text{
  color:var(--blue);
  font-size:14px;
  line-height:2.2;
  white-space:nowrap;
}
.sdgs-sec03__cont__box__signature{
  margin-left:70%;
}
ul ol.sdgs-sec03__ol,
ol.sdgs-sec03__ol{
  list-style:decimal;
  padding-left:20px;
}
ul ol.sdgs-sec03__ol li,
ol.sdgs-sec03__ol li{
  padding-left:0;
  font-weight: normal;
}
ul ol.sdgs-sec03__ol li::before,
ol.sdgs-sec03__ol li::before{
  content:none;
}


/* SERVICE */
.service-sec01{
    margin-top: 200px;
    margin-bottom: 300px;
}
.service-sec01__cont-circle{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    z-index: -1;
    width:60%;
}
.service-sec01__cont{
    position: relative;
}
.service-sec01__cont-map img{
  width:100%;
}

.service-map__pin{
  position:absolute;
  width:1.7%;
}
.service-map__pin img{
  width:100%;
  position:relative;
  z-index:1;
  animation:infinite pinfloating 2s alternate linear;
}
@keyframes pinfloating{
  0%{
    transform:translateY(-10%);
  }
  50%{
    transform:translateY(0);
  }
  100%{
    transform:translateY(10%);
  }
}
.service-map__pin--float{
  pointer-events:none;
  position:absolute;
  z-index:2;
  left:calc(50% - 60px);
  bottom:calc(100% + 10px);
  width:120px;
  background-image:url('img/service/bg-pin-float-middle.webp');
  background-repeat:repeat-y;
  background-size:contain;
  background-position:center;
  padding:0 15px;
  margin:16px 0 32px;
  transition:.6s ease;
  opacity:0;
}
.service-map__pin a:hover{
  opacity:1;
}
.service-map__pin a:hover .service-map__pin--float{
  opacity:1;
}
.service-map__pin--float::before{
  content:'';
  position:absolute;
  left:0;
  bottom:100%;
  height:16px;
  width:100%;
  background-image:url('img/service/bg-pin-float-top.webp');
  background-size:contain;
  background-repeat:no-repeat;
  background-position:bottom center;
}
.service-map__pin--float::after{
  content:'';
  position:absolute;
  left:0;
  top:100%;
  height:32px;
  width:100%;
  background-image:url('img/service/bg-pin-float-bottom.webp');
  background-size:contain;
  background-repeat:no-repeat;
  background-position:top center;
}
.service-map__pin--float--text{
  font-size:13px;
  font-weight:900;
  color:#FFF;
  text-align:center;
}

.s-modal-open{
  cursor:pointer;
}

.service-map__pin.n1{
  top:63%;
  left:24%;
}
.service-map__pin.n2{
  top:53%;
  left:26%;
}
.service-map__pin.n3{
  top:35%;
  left:31.5%;
}
.service-map__pin.n4{
  top:46%;
  left:42%;
}
.service-map__pin.n5{
  top:27%;
  left:42.5%;
}
.service-map__pin.n6{
  top:33%;
  left:52%;
}
.service-map__pin.n7{
  top:20%;
  left:60%;
}
.service-map__pin.n8{
  top:31%;
  left:63.5%;
}
.service-map__pin.n9{
  top:37%;
  left:73.5%;
}
.service-map__pin.n10{
  top:70%;
  left:40%;
}
.service-map__pin.n11{
  top:72%;
  left:7%;
}
.service-map__pin.n12{
  top:73%;
  left:13%;
}
.service-map__pin.n13{
  top:53%;
  left:32%;
}
.service-map__pin.n14{
  top:10%;
  left:38%;
}
.service-map__pin.n15{
  top:30%;
  left:80%;
}
.service-map__pin.n16{
  top:28%;
  left:57%;
}

.top-servicesec__bottomlinks{
  margin-top:120px;
  display:flex;
  justify-content:center;
  gap:20px;
}
.top-servicesec__bottomlink{
  width:calc(100% / 4 - (40px / 4));
}
.top-servicesec__bottomlink a{
  display:block;
  background:var(--blue);
  color:#FFF;
  padding:12px 20px;
}
.top-servicesec__bottomlink a:hover{
  opacity:1;
}
.top-servicesec__bottomlink__flex{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.top-servicesec__bottomlink__flex__texts{
  width:calc(100% - 80px);
}
.top-servicesec__bottomlink--title{
  font-size:16px;
  font-weight:bold;
}
.top-servicesec__bottomlink--entitle{
  font-size:8px;
  font-weight:bold;
}
.top-servicesec__bottomlink__flex__btn{
  width:60px;
  height:60px;
  position:relative;
}
.top-servicesec__bottomlink__flex__btn::after{
  content:'→';
  font-size:22px;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}
.top-servicesec__bottomlink__flex__btn.up::after{
  content:'↑';
}
.top-servicesec__bottomlink__flex__btn::before{
  content: "";
  position: absolute;
  z-index: 1;
  top:4%;
  left:4%;
  width: 92%;
  height: 92%;
  background: url(img/service/servce-circle.svg) no-repeat center center / cover;
  animation: service-sec01__cont-pin 20s linear infinite;
  transition:all .3s ease;
}
.top-servicesec__bottomlink a:hover .top-servicesec__bottomlink__flex__btn::before{
  top:-5%;
  left:-5%;
  width:110%;
  height:110%;
}

.service-sec01__cont-pin{
    position: absolute;
    transform: translate(-50%,calc(-100% - 200px));
}
.service-sec01__cont-pin.bottom{
    transform: translate(-50%,calc(100% + 200px));
}
.service-sec01__cont-pin:hover::after{
    transform: translate(-50%,100%) scale(2);
    background-color: var(--blue);
}
.service-sec01__cont-pin:hover::before{
    border-color: var(--blue);
}
.service-sec01__cont-pin::before{
    content: "";
    position: absolute;
    transform: translate(-50%,100%);
    left: 50%;
    bottom: 0;
    height: 200px;
    border-left: 4px dotted var(--gray);
    transition: .3s;
    pointer-events: none;
}
.service-sec01__cont-pin.bottom::before{
    transform: translate(-50%,-100%);
    bottom: auto;
    top: 0;
}
.service-sec01__cont-pin::after{
    content: "";
    transform: translate(-50%,100%);
    left: 50%;
    bottom: -200px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: var(--gray);
    position: absolute;
    transition: .3s;
    pointer-events: none;
}
.service-sec01__cont-pin.bottom::after{
    transform: translate(-50%,-100%);
    bottom: auto;
    top: -200px;
}
.service-sec01__cont-pin__item{
    pointer-events: none;
}
.service-sec01__cont-pin{
    width: 200px;
    height: 200px;
    border-radius: 50%;
}
.service-sec01__cont-pin a{
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    height: 100%;
    width: 100%;
    color: var(--base-color);
    background-color: #fff;
    position: relative;
    z-index: 0;
    text-align: center;
    border-radius: 50%;
    transition: .6s;
}
.service-sec01__cont-pin a:hover{
    opacity: 1;
    background-color: var(--blue);
}
.service-sec01__cont-pin a::before{
    content: "";
    position: absolute;
    z-index: -1;
    width: 92%;
    height: 92%;
    background: url(img/service/servce-circle.svg) no-repeat center center / cover;
    animation: service-sec01__cont-pin 20s linear infinite;
}
@keyframes service-sec01__cont-pin{
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}
.service-sec01__cont-pin__item-text{
    font-size: 20px;
    font-weight: bold;
}
.service-sec01__cont-pin__item-en{
    font-size: 44px;
    line-height: 1;
    font-weight: 900;
    font-family: var(--roboto);
    margin: 10px 0;
}
.service-sec01__cont-pin__item-arrow img{
    display: block;
    margin: 0 auto;
}
.service-sec01__cont-pin.n1{
    top: 8%;
    left: 28%;
}
.service-sec01__cont-pin.n2{
    top: 34%;
    left: 50%;
}
.service-sec01__cont-pin.n3{
    top: 8.5%;
    left: 73.5%;
}
.service-sec01__cont-pin.n4{
    bottom: 28%;
    left: 28.5%;
}
.service-sec01__cont-pin.n5{
    bottom: 2%;
    left: 50.5%;
}
.service-sec01__cont-pin.n6{
    bottom: 28%;
    left: 73.6%;
}



/* SERVICE COMMON */
.service-page .breadcrumbs{
  margin-bottom:0;
}
.service-page__images{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
}
.service-page__images img{
  width:calc(50% - 20px);
}

.service-page__content:not(:last-of-type){
  margin-bottom:80px;
}

.service-mv{
    padding-top: 40px;
    margin-bottom: 80px;
    height: 100vh;
    text-align: center;
    position: relative;
}
.service-mv__svg{
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 1;
    transform: translateX(-50%);
    max-width: 100%;
    max-height: 75%;
    display: none;
}
.service-mv__svg-rect{
    position: relative;
    animation: service-mv__svg-rect ease-in-out 5s infinite;
}
@keyframes service-mv__svg-rect{
    0% {
        transform: translate(0,0);
    }
    50% {
        transform: translate(0,-40px);
    }
    100% {
        transform: translate(0,0);
    }
}
.service-mv__cont{
    display: inline-block;
    position: relative;
    height: 100%;
}
.service-mv__img{
    max-height: 100%;
}
.service-mv .wrap{
    height: 100%;
}
.service-mv__img-circle-blue{
    position: absolute;
    z-index: 2;
    width: 16%;
    transform: scale(0);
    transition: .6s var(--cubic-bezier);
}
@keyframes service-mv__img-circle-blue{
    0%{
        transform: scale(0);
    }
    40%{
        transform: scale(2);
    }
    100%{
        transform: scale(1);
    }
}
.loaded .service-mv__img-circle-blue:not(.animation-rotate){
    animation: service-mv__img-circle-blue .8s forwards;
}
.service-mv__img-circle{
    position: absolute;
    top: 63%;
    left: 26%;
    z-index: -1;
    width: 30%;
}
.service-mv__title{
    position: absolute;
    z-index: 2;
    left: 62%;
    bottom: 19%;
    text-align: left;
}
.service-mv__title-text{
    font-size: 20px;
    font-weight: bold;
    color: var(--blue);
    letter-spacing: 0.1em;
}
.service-mv__title-en{
    font-size: 44px;
    font-weight: 900;
    font-family: var(--roboto);
    color: var(--blue);
    line-height: 1.2;
    letter-spacing: 0.1em;
    white-space: nowrap;
}
.service-mv__title-en span{
    transform: scaleX(-1);
    display: inline-block;
    transition: .3s;
}
.loaded .service-mv__title-en span{
    transform: scaleX(1);
}
.anchor-link-tab ul{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 12px;
}
.anchor-link-tab ul li a{
    display: block;
    color: var(--base-color);
    font-size: 14px;
    position: relative;
    padding: 25px 30px;
    border-bottom: 1px solid #707070;
    z-index: 0;
}
.anchor-link-tab ul li a::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    transition: .3s;
    background-color: var(--base-color);
    opacity: 0;
    z-index: -1;
}
.anchor-link-tab ul li a::after{
    content: "";
    transform: translateY(-50%);
    top: 50%;
    right: 30px;
    width: 12px;
    height: 34px;
    background: url(img/page/anchor-link-arrow.svg) no-repeat center center / contain;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    transition: .3s;
}
.anchor-link-tab ul li a:hover,
.anchor-link-tab ul li a:hover::before{
    opacity: 1;
}
@media screen and (min-width: 992px){
    .anchor-link-tab ul li a:hover{
        color: #fff;
    }
    .anchor-link-tab ul li a:hover::before{
        width: 100%;
    }
    .anchor-link-tab ul li a:hover::after{
        top: 60%;
        -webkit-filter: brightness(0) grayscale(100%) invert(1);
        -moz-filter: brightness(0) grayscale(100%) invert(1);
        -o-filter: brightness(0) grayscale(100%) invert(1);
        -ms-filter: brightness(0) grayscale(100%) invert(1);
        filter: brightness(0) grayscale(100%) invert(1);
    }
}
.cm-service-header{
    margin-bottom: 60px;
    position: relative;
}
.left-pos .cm-service-header__img{
    left: calc((100vw - 1240px)/-2);
}
.left-pos .cm-service-header__item{
    right: 160px;
    text-align: right;
}
.right-pos .cm-service-header__item{
    left: 160px;
}
.cm-service-header__img{
    width: calc(100vw - (100vw - 1240px)/2);
    position: relative;
}
.cm-service-header__img img{
    height: 460px;
    object-fit: cover;
}
.cm-service-header__item{
    position: absolute;
    bottom: 80px;
}
.cm-service-header__item-ttl{
    color: #fff;
    font-size: 50px;
    font-weight: 900;
    letter-spacing: 0.1em;
    margin-bottom: 40px;
    line-height: 1.5;
}
.cm-service-header__item-text{
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 0.1em;
    color: #fff;
}
/* 追加 */
.cm-service-news {
    border: 2px solid #ff0000;
    padding: 10px;
    margin-bottom: 60px;
}
.cm-service-news h3 {
    font-size: 1.5rem;
    font-weight: bold;
}
.cm-service-news h3 span {
    color: #ff0000;
}
.cm-service-news p {
    font-size: 1.25rem;
}
.cm-service-news p span {
    color: #ff0000;
    font-weight: bold;
}


.s-modal{
  display:none;
  position:fixed;
  z-index:9999;
  top:0;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height:100%;
}
.s-modal-close{
  cursor:pointer;
}
.s-modal-bg{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.5);
  z-index:1;
}
.s-modal-window{
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  height:auto;
  max-width:600px;
  transform:translate(-50%,-50%);
  z-index:2;
  background:#FFF;
  padding:50px;
}
.s-modal-btn{
  position:absolute;
  top:15px;
  right:15px;
  width:35px;
  height:35px;
}
.s-modal-btn::before{
  content:'';
  position:absolute;
  width:100%;
  height:1px;
  top:50%;
  left:50%;
  background:var(--base-color);
  transform:translate(-50%, -50%) rotate(45deg);
}
.s-modal-btn::after{
  content:'';
  position:absolute;
  width:100%;
  height:1px;
  top:50%;
  left:50%;
  background:var(--base-color);
  transform:translate(-50%, -50%) rotate(-45deg);
}
.s-modal-content__title{
  color:var(--blue);
  font-size:28px;
  font-weight:900;
  margin-bottom:40px;
}
.s-modal-content__title small{
  display:block;
  color:var(--base-color);
  font-size:12px;
  font-weight:bold;
  font-family:var(--roboto);
}
.s-modal-content__text{
  margin-bottom:50px;
}
.s-modal-content__imgs{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:32px 16px;
}
.s-modal-content__img img{
  aspect-ratio:240/166;
  width:100%;
  object-fit:cover;
  object-position:center;
}
.s-modal-content__img figcaption{
  margin-top:0.2em;
}


/* SERVICE ENVIRONMENT */
.env-mv .service-mv__img-circle-blue{
    top: 12.3%;
    left: 41.7%;
}
.env-sec01__cont-grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 80px 40px;
}
.env-sec01__cont-grid__item.wide{
    grid-column: 1/3;
}
ul.dots-list li{
    position: relative;
    font-size: 18px;
    padding-left: 16px;
    font-weight: bold;
}
ul.dots-list li span{
    display: block;
    margin-bottom: 4px;
}
ul.dots-list li span.fw-normal{
    display: inline;
    margin-bottom: 0;
    font-weight: normal;
}
ul.dots-list li::before{
    content: "";
    width: 6px;
    height: 6px;
    background-color: var(--blue);
    position: absolute;
    top: 15px;
    left: 0;
}
.env-sec01__cont-grid__item-box:first-of-type{
    padding-top: 0;
}
.env-sec01__cont-grid__item-box__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 5px 40px;
}

.env-sec01__cont-grid__item-box__grid .text-media-box {
    display: grid;
    grid-template-columns: 65% 30%;
}

.env-sec01__cont-grid__item-box__grid .text-media-box .img {
    max-width: 200px;
}

.env-sec01__cont-grid__item-img,
.facility-sec01__grid-item__img {
    max-width: calc(1240px / 2);
}

.env-sec01__cont-grid__item-img img {
    width: 100%;
}

.env-sec01__cont-grid__item-box{
    padding: 20px 0;
    border-bottom: 1px solid var(--gray);
}
.env-sec01__cont-grid__item-box:last-child{
    border-bottom: none;
    padding-bottom: 0;
}
.env-sec02__cont-box:not(:last-child){
    margin-bottom: 85px;
}

.env-sec01__cont-grid__item-box__grid .text-media-box {
    display: grid;
    grid-template-columns: 65% 30%;
    gap: 30px;
}

.env-sec03__cont-box__dl-dd__img{
    margin-top: 30px;
    text-align: center;
}

.pop-up {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    z-index: 10;
}
.pop-up .slick-dotted.slick-slider{
    margin-bottom: 0;
}
.pop-up .slick-dots{
    position: initial;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
}

.pop-up__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #00000054;
}

.pop-up__content {
    background-color: #fff;
    padding: 20px;
    position: relative;
    width: 500px;
    max-width: calc(100vw - 40px);
}

.pop-up__content__cross {
    border-radius: 50%;
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(10px, -10px);
    background-color: #fff;
    line-height: 0;
    padding: 5px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* SERVICE PLANT */
.service-page__content.haslink{
  position:relative;
  padding-bottom:12px;
}
.service-page__haslink{
  position:absolute;
  width:300px;
  height:35px;
  bottom:0;
  right:0;
}
.service-page__haslink a{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding-bottom:8px;
  color:var(--base-color);
  border-bottom:1px solid var(--base-color);
}
.service-page__haslink a::after{
  content:'';
  width:34px;
  height:12px;
  background-image:url('img/service/haslink-arrow.svg');
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  transition:0.6s;
}
.service-page__haslink a:hover::after{
  padding-right:20px;
}

.plant-sec--subtext:not(:last-child){
  margin-bottom:30px;
}
.plant-outsource__images{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:40px 0;
}
.plant-outsource__images--mainimg{
  width:40%;
}
.plant-outsource__images--mainimg.n2{
  width:49%;
}
.plant-outsource__images--devider{
  width:4%;
}

.plant-ulflex{
  display:flex;
  flex-wrap:wrap;
  gap:0 40px;
}
.plant-ul li{
  position:relative;
  padding-left:2em;
  line-height:1.4;
}
.plant-ul li::before{
  content:'';
  position:absolute;
  width:6px;
  height:6px;
  top:8px;
  left:14px;
  background:var(--blue);
}
.plant-outsource__bigimg{
  text-align:center;
}
.plant-outsource__bigimg img{
  width:100%;
  max-width:820px;
}

.plant-flow:not(:last-of-type){
  margin-bottom:40px;
}
.plant-flow{
  display:flex;
  gap:40px;
  align-items:center;
}
.plant-flow__head{
  width:280px;
}
.service-flowbox{
  position: relative;
    background-color: #EFEFEF;
    border-radius: 10px;
    border: 2px dotted var(--blue);
    padding: 30px 0;
    text-align: center;
}
.service-flowbox.next_bottom::after {
  content: "";
    width: 46px;
    height: 17px;
    position: absolute;
    background: url(img/comprehensive/flow-arrow.svg) no-repeat center center / contain;
  transform: translate(-50%, 100%) rotate(90deg);
  left: 50%;
  bottom: -3px;
  top: auto;
  right: auto;
  transform-origin: bottom;
}
.service-flowbox--num {
  position: absolute;
  top: -18px;
  left: 10px;
  font-family: var(--roboto);
  font-size: 30px;
  font-weight: 900;
  line-height: 1;
  color: var(--blue);
}
.service-flowbox--num::after {
  content: "";
  width: 26px;
  height: 2px;
  background-color: var(--blue);
  transform: rotate(-45deg);
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
  margin-left: 3px;
}
.service-flowbox--text {
  color: blue;
  font-weight: bold;
  font-size: 20px;
}



/* SERVICE SALE */
.sale-banner-rakuten{
  position:fixed;
  bottom:50px;
  right:var(--drawergap);
  z-index:9;
}
.sale-banner-rakuten__close{
  position:absolute;
  top:-25px;
  left:-25px;
  width:50px;
  height:50px;
  border-radius:50%;
  z-index:1;
  cursor:pointer;
  background:rgba(255,255,255,0.6);
}
.sale-banner-rakuten__close span{
  position:absolute;
  width:34px;
  height:2px;
  background:#000;
  top:calc(50% - 1px);
  left:8px;
}
.sale-banner-rakuten__close span:nth-of-type(1){
  transform:rotate(45deg);
}
.sale-banner-rakuten__close span:nth-of-type(2){
  transform:rotate(-45deg);
}
.sale-itemul li:not(:last-of-type){
  margin-bottom:32px;
}
.sale-li--innertext{
  display:block;
  margin-top:12px;
  line-height:2;
  font-size:15px;
}
.sale__itemflex{
  display:flex;
  justify-content:space-between;
}
.sale__itemflex__img,
.sale__itemflex__content{
  width:48%;
}
.sale__itemflex__content{
  padding-top:20px;
}

.sale-rejionera{
  top:0;
  right:20px;
}
.sale-rejionera figcaption{
  margin-top:14px;
  text-align:center;
}

.plant-flow__content.haslink{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
}
.sale-flow__innerlink{
  position:relative;
}

.sale-itemul__aftertext{
  margin-top:40px;
}

.sale-herbest__points{
  margin-top:50px;
  display:flex;
  flex-wrap:wrap;
}
.sale-herbest__point{
  width:calc(100% / 3);
  border-bottom:2px solid #EFEFEF;
  padding:24px 0;
}
.sale-herbest__point.long{
  width:100%;
}
.sale-herbest__point__flex{
  display:flex;
  flex-wrap:wrap;
  gap:10px 40px;
}
.sale-herbest__point__flex__title{
  display:flex;
  align-items:center;
  gap:14px;
}
.sale-herbest__point--num{
  display:block;
  padding:4px 18px;
  font-size:15px;
  border-radius:6px;
  color:#FFF;
  background:var(--blue);
}
.sale-herbest__point--title{
  font-size:20px;
  font-weight:bold;
}
.sale-herbest__point.long .sale-herbest__point__flex__title{
  width:430px;
}
.sale-herbest__point:not(.long) .sale-herbest__point__flex__text{
  width:100%;
  text-align:center;
}

.sale-herbest__dl dd.haspoint{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
}
.sale-herbest__ddpoint{
  display:block;
  padding:4px 24px;
  font-size:13px;
  border-radius:6px;
  color:#FFF;
  background:var(--blue);
}

.sale-herbest__freepoints{
  margin-top:50px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.sale-herbest__freepoint--num{
  margin-bottom:12px;
}
.sale-herbest__freepoint--num span{
  display:inline-block;
  white-space:nowrap;
  padding:4px 18px;
  font-size:15px;
  border-radius:6px;
  color:#FFF;
  background:var(--blue);
}
.sale-herbest__freepoint--title{
  font-size:20px;
  font-weight:bold;
  margin-bottom:4px;
}

.sale-herbest__bigimg{
  text-align:center;
}
.sale-herbest__bigimg img{
  width:100%;
  max-width:1088px;
}

.sale-kinkonkan__point{
  padding-bottom:20px;
  margin-top:20px;
  border-bottom:1px solid #EFEFEF;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
}
.sale-kinkonkan__point--num{
  display:block;
  width:120px;
  white-space:nowrap;
  padding:4px 18px;
  font-size:15px;
  border-radius:6px;
  color:#FFF;
  background:var(--blue);
  text-align:center;
}
.sale-kinkonkan__point--text{
  font-size:18px;
  font-weight:bold;
  width:calc(100% - 140px);
}

.sale-kinconcan__flows{
  padding-bottom:260px;
}
.sale-kinconcan__flows.bacteria-sec__flow-box__list li.n5{
  background:#EFEFEF;
}
.sale-kinconcan__flows.bacteria-sec__flow-box__list li.n5,
.sale-kinconcan__flows.bacteria-sec__flow-box__list li.n6{
  top:180px;
}

.sale-kinconcan-table thead{
  color:#FFF;
  background:var(--gray);
}
.sale-kinconcan-table thead tr th{
  font-size:12px;
  letter-spacing:0;
  padding:0 12px;
  text-align:center;
}
.sale-kinconcan-table thead tr th,
.sale-kinconcan-table tbody tr th,
.sale-kinconcan-table tbody tr td{
  vertical-align:middle;
}
.sale-kinconcan-table tbody tr td.td-center{
  text-align:center;
  width:110px;
}
.sale-kinconcan-table tbody th{
  width:200px;
  border-bottom:2px solid var(--gray);
}
.sale-kinconcan-table tbody tr.bv4row{
  color:var(--blue);
}
.sale-kinconcan-table tbody td{
  border-bottom:1px solid #A1A1A1;
}



.plant-ul.sale-bv4list li{
  display:flex;
  align-items:center;
  gap:40px;
  margin-bottom:18px;
  font-weight:bold;
}
.sale-bv4list__title{
  width:110px;
}
.sale-bv4list__text{
  font-size:15px;
  font-weight:normal;
}


/* SERVICE COMPREHENSIVE */
.comprehensive-mv .service-mv__img-circle-blue {
    top: 1.5%;
    left: 23.4%;
}
.comprehensive-sec01__grid,
.comprehensive-sec02__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.comprehensive-sec01 .subtitle,
.comprehensive-sec03 .subtitle {
    margin-bottom: 20px;
}
.comprehensive-sec01__subtext,
.comprehensive-sec03__subtext {
    margin-bottom: 60px;
}
.comprehensive-sec02__cont:not(:last-child){
    margin-bottom: 40px;
}
.comprehensive-sec03__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 80px;
}
.comprehensive-sec03__grid-item .line-title{
    margin-bottom: 20px;
}
.comprehensive-sec03__chart-box__dl{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
.comprehensive-sec03__chart-box__dl dt span,
.comprehensive-sec03__chart-box__dl-box__inner,
.comprehensive-sec03__chart-box__dl-box span{
    opacity: 0;
    transition: .6s;
}
.comprehensive-sec03__chart-box__dl dt.active span,
.comprehensive-sec03__chart-box__dl dt.active .comprehensive-sec03__chart-box__dl-box__inner,
.comprehensive-sec03__chart-box__dl-box.active .comprehensive-sec03__chart-box__dl-box__inner,
.comprehensive-sec03__chart-box__dl-box.active span{
    opacity: 1;
    transition-delay: .3s;
}
.comprehensive-sec03__chart-box__dl dt,
.comprehensive-sec03__chart-box__dl dd{
    margin-bottom: 20px;
    position: relative;
}
.comprehensive-sec03__chart-box__dl-box{
    position: relative;
}
.comprehensive-sec03__chart-box__dl dt::before,
.comprehensive-sec03__chart-box__dl-box::before{
    content: "";
    width: 0;
    height: 1px;
    position: absolute;
    background-color: var(--base-color);
    transition: .3s;
}
.comprehensive-sec03__chart-box__dl dt.active::before,
.comprehensive-sec03__chart-box__dl-box.active::before{
    width: 60px;
}
.comprehensive-sec03__chart-box__dl dt::before{
    right: 0;
    top: 30px;
}
.comprehensive-sec03__chart-box__dl-box::before{
    left: -60px;
    top: 30px;
}
.comprehensive-sec03__chart-box__dl-box::after,
.comprehensive-sec03__chart-box__dl dt::after{
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: var(--base-color);
    opacity: 0;
    transition: .3s;
}
.comprehensive-sec03__chart-box__dl-box.active::after,
.comprehensive-sec03__chart-box__dl dt.active::after{
    opacity: 1;
}
.comprehensive-sec03__chart-box__dl-box::after{
    top: 27px;
    left: -63px;
}
.comprehensive-sec03__chart-box__dl dt::after{
    right: -4px;
    top: 27px;
}
.comprehensive-sec03__chart-box__dl dt{
    width: 490px;
    padding-left: 170px;
    padding-right: 60px;
}
.comprehensive-sec03__chart-box__dl dt span{
    background-color: var(--base-color);
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    display: block;
    padding: 14px 20px;
}
.comprehensive-sec03__chart-box__dl dd{
    width: calc(100% - 490px);
    padding-right: 170px;
    padding-left: 60px;
}
.comprehensive-sec03__chart-box__dl dd span{
    display: block;
    background-color: var(--blue);
    color: #fff;
    padding: 15px 25px;
    font-size: 18px;
    font-weight: bold;
}
.comprehensive-sec03__chart-box__dl-box__inner{
    padding: 15px 20px 0;
}
.comprehensive-sec03__chart-box__dl ul li{
    padding-left: 1.5em;
}
.comprehensive-sec03__chart-box__dl ul li::before{
    content: "■ ";
    margin-left: -1.5em;
    color: var(--gray);
}
.comprehensive-sec03__chart-box__dl-box__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.comprehensive-sec03__chart-box__dl-box:not(:last-child){
    margin-bottom: 20px;
}
.comprehensive-sec03__chart-ttl{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 60px;
}
.comprehensive-sec03__chart-ttl::before{
    content: "";
    display: inline-block;
    margin-right: 10px;
    width: 6px;
    height: 6px;
    background-color: var(--blue);
    position: relative;
    top: -4px;
}
.comprehensive-sec03__chart{
    margin-top: 80px;
}
.comprehensive-sec03__chart-box{
    position: relative;
    z-index: 0;
}
.comprehensive-sec03__chart-box__line{
    position: absolute;
    top: 30px;
    width: 20px;
    height: calc(100% - 30px);
    left: 490px;
    clip-path: inset(0 0 100% 0);
}
.comprehensive-sec03__chart-box__line.end{
    clip-path: inset(0 0 0 0) !important;
}
.comprehensive-sec03__chart-box__line::before{
    content: "";
    position: absolute;
    height: 100%;
    width: 1px;
    background-color: var(--base-color);
    top: 0;
    left: 0;
}
.comprehensive-sec03__chart-box__line::after{
    content: "";
    width: 1px;
    height: 30px;
    bottom: 0;
    transform-origin: bottom left;
    transform: rotate(45deg);
    position: absolute;
    background-color: var(--base-color);
}
.comprehensive-sec03__chart-box__dl dd.adjust1{
    padding-top: 157px;
}
.comprehensive-sec03__chart-box__dl dd.adjust2{
    padding-top: 75px;
}
.comprehensive-sec03__chart-box__dl dd.adjust3{
    padding-top: 185px;
}
.comprehensive-sec04__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 85px 80px;
}
.comprehensive-sec04__grid-item .line-title{
    margin-bottom: 20px;
}
.comprehensive-sec04__grid-item__flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.comprehensive-sec04__grid-item__flex-img{
    width: 220px;
}
.comprehensive-sec04__grid-item__flex-img{
    width: 220px;
}
.comprehensive-sec04__grid-item__flex-text{
    padding-left: 40px;
    width: calc(100% - 220px);
}
.comprehensive-sec03__chart-box__dl-illust{
    position: absolute;
    top: 0;
}
.comprehensive-sec03__chart-box__dl-illust.left{
    left: 0;
}
.comprehensive-sec03__chart-box__dl-illust.right{
    right: -30px;
    transform: translateX(100%);
}
.comprehensive-sec04__logo-image {
    margin-top: 50px;
}
.comprehensive-sec04__logo-image img {
    margin: 0 auto;
    display: block;
    max-width: 450px;
}
.bacteria-sec__box{
    justify-content: space-between;
    margin-bottom: 80px;
}
.bacteria-sec__box-flex{
    justify-content: space-between;
}
.bacteria-sec__box-flex.reverse{
    flex-direction: row-reverse;
}
.bacteria-sec__box-flex__img{
    width: 50%;
}
.bacteria-sec__box-flex__item{
    width: 45%;
}
.bacteria-sec__box-flex__item-dl:not(:last-child){
    margin-bottom: 30px;
}
.bacteria-sec__box-flex__item-dl dl{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    border-bottom: 2px solid #EFEFEF;
    padding-bottom: 10px;
}
.bacteria-sec__box-flex__item-dl dl dt{
    background-color: var(--blue);
    color: #fff;
    border-radius: 6px;
    font-size: 18px;
    font-weight: bold;
    width: 168px;
    text-align: center;
}
.bacteria-sec__box-flex__item-dl dl dd{
    width: calc(100% - 168px);
    padding-left: 20px;
    font-size: 20px;
    font-weight: bold;
}
.bacteria-sec__box-flex__item-dl dl dd small{
    font-size: 16px;
    font-weight: 500;
    margin-top: 15px;
    display: block;
}
.bacteria-sec__box-flex__item-dl__text{
    margin-top: 15px;
}
.bacteria-sec__flow-box__list{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 40px;
    position: relative;
}
.bacteria-sec__flow-box__list li{
    position: relative;
    background-color: #EFEFEF;
    border-radius: 10px;
    border: 2px dotted var(--blue);
    padding: 30px 0;
    text-align: center;
}
.bacteria-sec__flow-box__list-num{
    position: absolute;
    top: -18px;
    left: 10px;
    font-family: var(--roboto);
    font-size: 30px;
    font-weight: 900;
    line-height: 1;
    color: var(--blue);
}
.bacteria-sec__flow-box__list-num::after{
    content: "";
    width: 26px;
    height: 2px;
    background-color: var(--blue);
    transform: rotate(-45deg);
    display: inline-block;
    position: relative;
    top: -2px;
    vertical-align: middle;
    margin-left: 3px;
}
.bacteria-sec__flow-box__list-text{
    color: blue;
    font-weight: bold;
    font-size: 20px;
}
.bacteria-sec__flow-box__list-text small{
    font-size: 16px;
    font-weight: 500;
    display: block;
    color: var(--base-color);
}
.bacteria-sec__flow-box__list li::after{
    content: "";
    width: 46px;
    height: 17px;
    position: absolute;
    background: url(img/comprehensive/flow-arrow.svg) no-repeat center center / contain;
    transform: translate(100%,-50%);
    top: 50%;
    right: 3px;
}
.bacteria-sec__flow-box__list li.n5,
.bacteria-sec__flow-box__list li.n6{
    position: absolute;
    width: 100%;
    max-width: 280px;
}
.bacteria-sec__flow-box__list li.n5{
    right: 0;
    top: 140px;
    background-color: #fff;
}
.bacteria-sec__flow-box__list li.n6{
    top: 140px;
    right: 320px;
}
.bacteria-sec__flow-box__att{
    margin-top: 40px;
    max-width: 600px;
}
.bacteria-sec__flow-box__att li:not(:last-child){
    margin-bottom: 15px;
}
.bacteria-sec__flow-box__list li.n4::after{
    transform: translate(-50%,100%) rotate(90deg);
    left: 50%;
    bottom: -3px;
    top: auto;
    right: auto;
    transform-origin: bottom;
}
.bacteria-sec__flow-box__list li.n5::after{
    transform: translate(-100%,50%) rotate(180deg);
    right: auto;
    left: 0;
    transform-origin: top;
}
.bacteria-sec__flow-box__list li.n6::after{
    transform: translate(-50%,-100%) rotate(270deg);
    left: 50%;
    right: auto;
    top: -3px;
    transform-origin: top;
}
.bacteria-sec__flow-flex{
    margin-top: 80px;
    justify-content: space-between;
    align-items: flex-start;
}
.bacteria-sec__flow-flex__item{
    width: 50%;
    position: relative;
    padding: 0 50px 50px;
    border-radius: 10px;
    border: 2px solid var(--blue);
}
.bacteria-sec__flow-flex__box{
    width: 45%;
}
.bacteria-sec__flow-flex__item-ttl{
    background-color: var(--blue);
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 5px 0;
    text-align: center;
    margin-bottom: 50px;
}
.bacteria-sec__flow-flex__item-grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
}
.bacteria-sec__flow-flex__item-grid__item{
    position: relative;
}
.bacteria-sec__flow-flex__item-grid__item:not(:last-child)::before{
    content: "";
    width: 46px;
    height: 17px;
    position: absolute;
    background: url(img/comprehensive/flow-arrow.svg) no-repeat center center / contain;
    transform: translate(100%,-50%);
    top: 50%;
    right: 3px;
}
.bacteria-sec__flow-flex__item-grid__item-text{
    text-align: center;
    margin-top: 10px;
}
.bacteria-sec__works{
    margin-top: 80px;
}
.bacteria-sec__works-ttl{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 35px;
}
.bacteria-sec__works-ttl::before{
    content: "";
    display: inline-block;
    margin-right: 10px;
    width: 6px;
    height: 6px;
    background-color: var(--blue);
    position: relative;
    top: -4px;
}
.bacteria-sec__works-grid{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 45px 20px;
}
.bacteria-sec__works-grid__item-text{
    margin-top: 5px;
}



/* SERVICE FACILITY */
.facility-mv .service-mv__img-circle-blue{
    top: 1.6%;
    left: 59%;
}
.facility-sec01__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 80px;
}
.facility-sec02__cont .line-title{
    margin-bottom: 20px;
}
.facility-sec01__grid-item .dots-list {
    padding: 20px 0;
}
.facility-sec01__img-grid{
    margin-top: 80px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}
.facility-sec01__grid-item__img {
    margin-bottom: 20px;
}
.facility-sec02__cont:not(:last-child){
    margin-bottom: 85px;
}
.facility-sec02__cont-tel-box{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 28px;
}
.facility-sec02__cont-tel-box__text img{
    display: inline-block;
    margin-right: 20px;
}
.facility-sec02__cont-tel-box__text a{
    color: var(--blue);
    display: inline-block;
    font-size: 50px;
    font-family: var(--roboto);
    font-weight: 900;
    line-height: 0.8;
    letter-spacing: 0;
    text-decoration: underline;
}
.facility-sec02__cont-tel-box__att{
    font-size: 22px;
    font-weight: bold;
    border: 1px solid var(--base-color);
    padding: 0 20px;
}

.facility-sec02__cont-tel-box__att__small {
    font-size: 14px;
}

.facility-sec02__cont__grid {
    display: grid;
    grid-template-columns: 57% 40.5%;
    gap: 30px;
}



/* SERVICE MATERIAL */
.material-mv .service-mv__img-circle-blue{
    top: 25.1%;
    left: 60.4%;
}
.material-mv .service-mv__img-item{
    position: absolute;
    width: 40%;
    top: 7%;
    left: 0;
}
.material-sec01__dl dd{
    display: grid;
    grid-template-columns: repeat(3,1fr);
}
.material-sec01__grid{
    margin: 20px 0 60px;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 10px;
}



/* SERVICE CONSTRUCTION */
.construction-mv .service-mv__img-circle-blue{
    top: 22.7%;
    left: 19.6%;
}
.const-sec01__cont:not(:last-child),
.const-sec03__cont:not(:last-child){
    margin-bottom: 80px;
}
.const-sec01__cont-grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 85px 40px;
}
.const-sec01__cont-grid__item-ttl{
    margin: 10px 0;
    font-size: 18px;
    font-weight: bold;
}
.const-sec01__cont-grid__item-ttl::before{
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: var(--blue);
    margin-right: 10px;
}
.const-sec01__cont-grid__item-ul{
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.const-sec01__cont-grid__item-ul li{
    padding-left: 1em;
}
.const-sec01__cont-grid__item-ul li::before{
    content: "・";
    margin-left: -1em;
}
.const-sec02__logo{
    text-align: center;
}
.const-sec02__list{
    margin: 60px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
}
.const-sec02__list-item{
    color: #fff;
    background-color: var(--blue);
    padding: 8px 52px;
    font-size: 18px;
    font-weight: bold;
    border-radius: 24px;
}
.dot-text::before{
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    background-color: var(--blue);
    margin-right: 10px;
}
.const-sec03__cont-flex__box-ttl:first-child{
    margin-top: 0;
}
.const-sec03__cont-flex__box-ttl{
    font-size: 18px;
    font-weight: bold;
    margin: 25px 0 5px;
}
.const-sec03__cont-flex__box-ttl::before,
.const-sec03__plan-box__ttl::before{
    position: relative;
    top: -4px;
}
.const-sec03__cont-flex__box{
    width: 49%;
}
.const-sec03__cont-flex__img{
    max-width: 560px;
}
.const-sec03__cont-flex{
    justify-content: space-between;
    align-items: center;
}
.const-sec03__plan-box{
    margin-top: 85px;
}
.const-sec03__plan-box__ttl{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}
.const-sec03__plan-box__grid{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 45px 50px;
}
.const-sec03__plan-box__grid-item.wide{
    grid-column: 1/4;
}
.const-sec03__plan-box__grid-item.wide .const-sec03__plan-box__grid-item__text{
    font-size: 18px;
}
.const-sec03__plan-box__grid-item__text{
    margin-top: 15px;
}



/* SERVICE PLANNING */
.planning-mv .service-mv__img-circle-blue{
    top: 35.8%;
    left: 39.8%;
}
.plan-intro-sec__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 40px;
}
.plan-intro-sec__grid-item a{
    display: block;
}
.plan-intro-sec__grid-item__link{
    background-color: var(--base-color);
    color: #fff;
    font-size: 14px;
    padding: 18px 40px;
    text-align: right;
    border: 1px solid var(--base-color);
    transition: .3s;
}
.plan-intro-sec__grid-item__link span::after{
    content: "";
    width: 34px;
    height: 12px;
    background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
    transition: .3s;
    display: inline-block;
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
    margin-left: 20px;
    transition: .3s;
}
.plan-intro-sec__grid-item a:hover{
    opacity: 1;
}
.plan-intro-sec__grid-item a:hover .plan-intro-sec__grid-item__link{
    color: var(--base-color);
    background-color: #fff;
}
.plan-intro-sec__grid-item a:hover .plan-intro-sec__grid-item__link span::after{
    transform: translateX(10px);
    -webkit-filter: brightness(0) grayscale(100%) invert(0);
    -moz-filter: brightness(0) grayscale(100%) invert(0);
    -o-filter: brightness(0) grayscale(100%) invert(0);
    -ms-filter: brightness(0) grayscale(100%) invert(0);
    filter: brightness(0) grayscale(100%) invert(0);
}
.plan-sec02__cont:not(:last-child),
.plan-sec03__cont:not(:last-child){
    margin-bottom: 85px;
}
.plan-sec02__cont-text,
.plan-sec03__cont-text{
    font-size: 18px;
}
.plan-sec02__cont-rescue{
    position: relative;
    margin-top: 65px;
    z-index: 0;
}
.plan-sec02__cont-rescue::before{
    content: "";
    background-color: var(--light-gray);
    position: absolute;
    top: -40px;
    left: 0;
    z-index: -1;
    width: 100%;
    max-width: 1120px;
    height: 220px;
}
.plan-sec02__cont-rescue__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.plan-sec02__cont-rescue__grid-item:nth-of-type(2){
    padding-left: 50px;
}
.plan-sec02__cont-rescue__grid-item__ttl{
    font-size: 34px;
    color: var(--blue);
    font-weight: bold;
    line-height: 1.5;
    letter-spacing: 0.1em;
    border-bottom: 1px solid var(--blue);
    padding-bottom: 15px;
    margin-bottom: 15px;
    display: inline-block;
}
.plan-sec02__cont-rescue__grid-item__ttl span{
    font-size: 18px;
    display: block;
}
.plan-sec02__cont-rescue__grid-item__text{
    font-size: 14px;
    font-weight: 900;
    font-family: var(--roboto);
    margin-bottom: 83px;
}
.plan-sec02__cont-rescue__grid-item__ul li:not(:last-child){
    margin-bottom: 40px;
}
.plan-sec02__cont-rescue__img{
    position: absolute;
    top: 130px;
    right: 0;
}
.plan-sec03__cont-grid{
    display: grid;
    grid-template-columns: repeat(6,1fr);
    gap: 20px;
    max-width: 1000px;
    margin: 45px auto 0;
}
.plan-sec03__cont-grid__item-text{
    margin-top: 10px;
    font-size: 18px;
    text-align: center;
}
.plan-sec03__cont-grid__item-img{
    border-radius: 50%;
    padding-top: 100%;
    position: relative;
    overflow: hidden;
    border: 1px solid var(--blue);
    border-radius: 50%;
}
.plan-sec03__cont-grid__item-img svg{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    max-width: 60px;
    max-height: 60px;
}
.plan-sec03__cont-grid__item-img svg path{
    fill: var(--blue);
}
.plan-sec03__cont-img{
    margin-top: 30px;
}
.plan-sec03__cont-server{
    margin-top: 40px;
}
.plan-sec03__cont-server__ttl{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
}
.plan-sec03__cont-server__ttl::before{
    position: relative;
    top: -4px;
}
.plan-sec03__cont-server__flex{
    justify-content: space-between;
}
.plan-sec03__cont-server__flex-img{
    max-width: 200px;
    width: 100%;
}
.plan-sec03__cont-server__flex-dl{
    width: calc(100% - 280px);
}
.plan-sec03__cont-server__flex-dl dt,
.plan-sec03__cont-server__flex-dl dd{
    padding: 9px 0;
}
.plan-sec03__cont-server__flex-dl dt{
    width: 200px;
}
.plan-sec03__cont-server__flex-dl dd{
    width: calc(100% - 200px);
}




/* RECRUIT */
.recruit-mv{
    height: auto;
    position: relative;
    z-index: 1;
}
.recruit-mv .wrap{
    height: auto;
    display: block;
}
.recruit-catch-mv .mv-scroll__down{
    transform: translateY(-50%);
    top: 50%;
    bottom: auto;
    right: calc((100% - 1240px)/2);
    opacity: 0;
    transition: .6s;
    transition-delay: 2.3s;
}
.recruit-catch-mv .mv-scroll__down-circle{
    width: 18.5vh;
}
.recruit-catch-mv .mv-scroll__down-arrow{
    height: 50%;
}
.recruit-catch-mv__slide-text{
    font-size: 16.6vh;
    line-height: 0.7;
    white-space: nowrap;
    position: absolute;
    z-index: 1;
    transform: translateX(-50%);
    left: 50%;
    font-family: var(--roboto);
    font-weight: 900;
    -webkit-text-stroke: 1px #fff;
    color: transparent;
    transition-property: left, opacity;
    transition-duration: 6s, .3s;
    transition-delay: 0s, 1.8s;
}
.recruit-catch-mv__slide-text.top{
    top: 0;
}
.recruit-catch-mv__slide-text.bottom{
    bottom: 0;
}
.loaded .recruit-catch-mv__slide-text.top{
    left: 90%;
    opacity: 0;
}
.loaded .recruit-catch-mv__slide-text.bottom{
    left: 10%;
    opacity: 0;
}
.loaded .recruit-catch-mv__ttl span{
    transform: translateY(0);
    opacity: 1;
}
.loaded .recruit-catch-mv__sub-ttl{
    transform: translateY(0);
    opacity: 1;
    transition-delay: 1.3s;
}
.loaded .recruit-catch-mv__img-after{
    clip-path: inset(0 0 0 0);
    transition: .6s var(--cubic-bezier);
    transition-delay: 1.7s;
}
.loaded .recruit-catch-mv__img::before{
    width: 100%;
    transition: .6s var(--cubic-bezier);
    transition-delay: 1.7s;
}
.loaded .recruit-catch-mv__before-box__circle{
    opacity: 0;
}
.loaded .recruit-catch-mv__before-box.before{
    top: 45%;
    opacity: 0;
}
.loaded .recruit-catch-mv__before-box.after{
    top: 40%;
    opacity: 1;
}
.loaded .recruit-catch-mv .mv-scroll__down{
    opacity: 1;
}
.recruit-catch-mv__ttl{
    color: #fff;
    line-height: 1.2;
    text-shadow: 0 0 30px rgba(0,0,0,.2);
    font-weight: 900;
    font-size: 7.4vh;
    font-family: var(--roboto);
    text-transform: uppercase;
    margin-bottom: 20px;
}
.after .recruit-catch-mv__ttl{
    margin-bottom: 10px;
}
.recruit-catch-mv__ttl span{
    transform: translateY(-20px);
    display: inline-block;
    transition: .3s;
    opacity: 0;
}
.recruit-catch-mv__sub-ttl{
    color: #fff;
    font-size: 3.3vh;
    font-weight: bold;
    letter-spacing: 0.1em;
    opacity: 0;
    transition: .3s;
    transform: translateY(20px);
}
.recruit-catch-mv__text{
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    margin-top: 50px;
}
.recruit-catch-mv{
    height: 100svh;
    position: relative;
    overflow: hidden;
}
.recruit-catch-mv__img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.recruit-catch-mv__img::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background-color: rgba(0,0,0,.5);
    z-index: 2;
}
.recruit-catch-mv__img img:not(.recruit-catch-mv__img-item){
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.recruit-catch-mv__img-after{
    clip-path: inset(0 100% 0 0);
    z-index: 1;
}
.recruit-catch-mv__before-box.before,
.recruit-catch-mv__before-box.after{
    position: absolute;
    transform: translateY(-50%);
    width: 100%;
}
.recruit-catch-mv__before-box.before{
    text-align: center;
    left: 0;
    top: 50%;
    transition: .6s;
    transition-delay: 2.2s;
}
.recruit-catch-mv__before-box.after{
    left: calc((100% - 1240px)/2);
    top: 55%;
    transition: .6s;
    transition-delay: 2.3s;
    opacity: 0;
}
.recruit-catch-mv__before-box__circle{
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    z-index: -1;
    opacity: 0.2;
    max-height: 87vh;
    transition: .6s;
    transition-delay: 1.8s;
}
.recruit-catch-mv__img-item{
    z-index: 1;
    position: absolute;
    transform: translate(-50%,-50%);
    max-height: 68.6vh;
    top: 50%;
    left: 50%;
    animation: concept-sec02__bg-item-fuwafuwa ease-in-out 2.5s infinite;
    display: none;
}
.recruit-sec01__slider-wrap{
    padding-left: calc((100% - 1240px)/2);
}
.recruit-sec01__slider-item{
    margin-right: 10px;
}
.recruit-sec01__slider-nav{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 45px;
}
.recruit-sec01__slider-nav__item{
    cursor: pointer;
}
.recruit-sec01__slider-nav__item img{
    display: block;
}
.recruit-sec01__slider-nav__item.prev{
    margin-right: 20px;
}
.recruit-sec01__edge-text{
    text-align: right;
    margin-top: -30px;
    color: transparent;
    position: relative;
    z-index: 1;
}
.recruit-sec02__edge-text{
    text-align: center;
    font-size: 160px;
    margin-bottom: -30px;
    position: relative;
    z-index: 1;
    color: transparent;
}
.recruit-sec02__cont:not(:last-child){
    margin-bottom: 20px;
}
.recruit-sec02__cont-box{
    border: 14px solid var(--light-gray);
    padding: 34px;
    text-align: center;
    background-color: #fff;
}
.recruit-sec02__cont-box__ttl{
    font-size: 22px;
    font-weight: bold;
    padding: 3px 30px;
    background-color: var(--light-gray);
    margin: 0 auto 45px;
    line-height: 1.5;
}
.recruit-sec02__cont-box__ttl:not(:first-of-type){
  margin-top:30px;
}
.recruit-sec02__cont-box__ttl small{
    display: block;
    font-size: 18px;
}
.recruit-sec02__cont-grid{
    display: grid;
    gap: 20px;
}
.recruit-sec02__cont-grid.col-3{
    grid-template-columns: repeat(3,1fr);
}
.recruit-sec02__cont-grid.col-2{
    grid-template-columns: repeat(3,1fr);
}
.recruit-sec02__cont-grid.col-2 > div:nth-of-type(1){
    grid-column: 1/2;
}
.recruit-sec02__cont-grid.col-2 > div:nth-of-type(2){
    grid-column: 2/4;
}
.recruit-sec02__cont-box__grid.col-2{
    grid-template-columns: repeat(3,1fr);
    margin-top: 30px;
}
.recruit-sec02__cont-box__grid.col-2 > div:nth-of-type(1){
    grid-column: 1/3;
}
.recruit-sec02__cont-box__grid.col-2 > div:nth-of-type(2){
    grid-column: 3/4;
}
.recruit-sec02__cont-box__grid{
    display: grid;
    gap: 30px 10px;
}
.recruit-sec02__cont-box__grid.col-3{
    grid-template-columns: repeat(3,1fr);
}
.recruit-sec02__cont-box__grid.col-2 > div:nth-of-type(1) .recruit-sec02__cont-box__ttl{
    margin-bottom: 15px;
}
.recruit-sec02__cont-box__grid.col-4{
    display: grid;
    grid-template-columns: repeat(4,1fr);
}
.recruit-sec02__cont-box__grid.col-4 .recruit-sec02__cont-box__ttl{
    margin-bottom: 10px;
}
.recruit-sec02__cont-bignum{
    font-family: var(--roboto);
    font-size: 76px;
    font-weight: 600;
    color: var(--blue);
}
.recruit-sec02__cont-bignum small{
  font-size:0.75em;
}
.recruit-sec02__cont-text{
    font-family: var(--roboto);
    font-size: 24px;
    font-weight: bold;
    color: var(--blue);
}
.recruit-sec02__cont-text small{
    font-size: 16px;
}
.recruit-sec02__cont-box__subttl{
    font-size: 14px;
    margin-top: -30px;
}
.recruit-sec02__cont-box__flex{
    justify-content: space-between;
}
.recruit-sec02__cont-box__flex-item{
    text-align: left;
}
.recruit-sec02__cont-box__flex-item__text{
    color: var(--blue);
    margin-bottom: 10px;
    font-weight: bold;
}
.recruit-sec02__cont-box__flex-item ul li{
    padding-left: 1em;
    font-weight: bold;
}
.recruit-sec02__cont-box__flex-item ul li::before{
    content: "・";
    margin-left: -1em;
    color: var(--blue);
}
.recruit-sec02__cont-box.n4 .recruit-sec02__cont-box__illust,
.recruit-sec02__cont-box.n6 .recruit-sec02__cont-box__illust{
    position: absolute;
    bottom: 30px;
    right: 30px;
}
.recruit-sec02__cont-box__dl dl{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.recruit-sec02__cont-box__dl dl dt{
    color: var(--blue);
    font-weight: bold;
    width: 78px;
    text-align: left;
}
.recruit-sec02__cont-box__dl dl dd{
    padding-left: 20px;
    width: calc(100% - 78px);
    border-left: 1px solid var(--base-color);
    font-weight: bold;
    text-align: left;
}
.recruit-sec02__cont-box.n5 .recruit-sec02__cont-box__illust{
    position: absolute;
    bottom: 50px;
    right: 30px;
}

.recruit-sec02__cont-box__grid.col-3 .recruit-sec02__cont-box__grid-item .recruit-sec02__cont-box__ttl {
    margin-bottom: 50px;
}

.recruit-sec02__cont-box__grid.col-3 .recruit-sec02__cont-box__grid-item .recruit-sec02__cont-box__illust {
    padding: 15px 0 0;
}

.recruit-sec02__cont-box__grid.col-3 .recruit-sec02__cont-box__grid-item .recruit-sec02__cont-box__illust img {
    max-height: 58px;
}
.recruit-sec02__cont-box__attention {
    margin-top: 20px;
    font-size: 14px;
}
.recruit-sec03__tab{
    margin-top: 80px;
}
.recruit-sec03__tab ul{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 40px 12px;
}
.recruit-sec03__tab ul li{
    border: 1px solid #707070;
    border-bottom: none;
    line-height: 1;
    padding: 32px 30px;
    cursor: pointer;
    transition: .3s;
    font-size: 14px;
    position: relative;
}
.recruit-sec03__tab ul li::before{
    content: "";
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    transition: .4s var(--cubic-bezier);
    background-color: var(--base-color);
}
.recruit-sec03__tab ul li::after{
    content: "";
    width: 34px;
    height: 12px;
    background: url(img/common/view-more-arrow.svg) no-repeat center center / contain;
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    right: 40px;
    transition: .3s;
}
.recruit-sec03__tab ul li.current,
.recruit-sec03__tab ul li:hover{
    color: #fff;
}
.recruit-sec03__tab ul li.current::before,
.recruit-sec03__tab ul li:hover::before{
    width: 100%;
}
.recruit-sec03__tab ul li.current::after,
.recruit-sec03__tab ul li:hover::after{
    -webkit-filter: brightness(0) grayscale(100%) invert(1);
    -moz-filter: brightness(0) grayscale(100%) invert(1);
    -o-filter: brightness(0) grayscale(100%) invert(1);
    -ms-filter: brightness(0) grayscale(100%) invert(1);
    filter: brightness(0) grayscale(100%) invert(1);
    right: 30px;
}
.recruit-sec03__tab-cont-wrap{
    margin-top: 80px;
}
.recruit-sec03__tab-cont:not(.show){
    display: none;
}
.recruit-sec03__tab-cont__box{
    background-color: var(--light-gray);
    margin-bottom: 60px;
    padding: 30px 130px 30px 50px;
    position: relative;
}
.recruit-sec03__tab-cont__box:last-child{
    margin-bottom: 0;
}
.recruit-sec03__tab-cont__box-ttl{
    font-weight: bold;
    font-size: 22px;
    padding-bottom: 8px;
    margin-bottom: 25px;
    border-bottom: 2px solid var(--base-color);
}
.recruit-sec03__tab-cont__box-dl > dl{
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    margin-bottom: 15px;
}
.recruit-sec03__tab-cont__box-dl > dl:last-of-type{
    margin-bottom: 0;
}
.recruit-sec03__tab-cont__box-dl dl dt{
    color: var(--blue);
    font-weight: bold;
}
.recruit-sec03__tab-cont__box-dl dl dd a{
    text-decoration: underline;
}
.recruit-sec03__tab-cont__box-dl > dl dt{
    width: 110px;
}
.recruit-sec03__tab-cont__box-dl > dl dd{
    width: calc(100% - 110px);
    font-weight: bold;
}
.recruit-sec03__tab-cont__box-dl > dl dd.lineclamp_01{
  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}
.recruit-sec03__tab-cont__box-dl__inner{
    margin: 32px -130px 0 -50px;
    border: 14px solid var(--light-gray);
    background-color: #fff;
    padding: 35px;
    position: relative;
    display: none;
}
.recruit-sec03__tab-cont__box-dl__inner::before{
    content: "";
    width: calc(100% + 28px);
    height: 3px;
    background-color: #fff;
    position: absolute;
    top: -14px;
    left: -14px;
}
.recruit-sec03__tab-cont__box-dl__grid{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}
.recruit-sec03__tab-cont__box-dl__grid-item dl{
    margin-bottom: 40px;
}
.recruit-sec03__tab-cont__box-dl__grid-item dl:last-child{
    margin-bottom: 0;
}
.recruit-sec03__tab-cont__box-dl__box{
    padding: 30px 0;
    border-bottom: 1px solid var(--gray);
}
.recruit-sec03__tab-cont__box-dl__box:first-child{
    padding-top: 0;
}
.recruit-sec03__tab-cont__box-dl__box:last-child{
    padding-bottom: 0;
    border-bottom: none;
}
.recruit-sec03__tab-cont__box-dl__toggle{
    position: absolute;
    right: 50px;
    top: 130px;
    width: 40px;
    height: 40px;
    cursor: pointer;
    background-color: var(--base-color);
    border-radius: 50%;
}
.recruit-sec03__tab-cont__box-dl__toggle::before,
.recruit-sec03__tab-cont__box-dl__toggle::after{
    content: "";
    width: 40%;
    height: 4px;
    background-color: #fff;
    transform: translate(-50%,-50%);
    transition: .3s;
    position: absolute;
    top: 50%;
    left: 50%;
}
.recruit-sec03__tab-cont__box-dl__toggle::after{
    transform: translate(-50%,-50%) rotate(-90deg);
}
.recruit-sec03__tab-cont__box-dl__toggle.active::after{
    transform: translate(-50%,-50%) rotate(0deg);
}
.recruit-sec03__tab-cont__box-dl__toggle.active + .recruit-sec03__tab-cont__box-dl__inner{
    display: block;
}
.recruit-sec02__topics-cont{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    column-gap: 40px;
}
.recruit-sec02__view-more{
    margin-top: 80px;
}
.recruit-entry__text{
    text-align: center;
    margin: 60px 0 40px;
    font-size: 18px;
}
.recruit-entry__text a{
    color: var(--blue);
    text-decoration: underline;
}


/* ER */
main.er-page{
  background:#E4E4E4;
  margin-bottom:-200px;
}
.er-page .recruit-catch-mv{
  z-index:1;
}
.recruit-catch-mv__slide-text.middle{
  top:calc(50% - 5vh);
  left:75%;
}
.loaded .recruit-catch-mv__slide-text.middle{
  left: 0%;
  opacity: 0;
}
.er-catch-colored{
  -webkit-text-stroke: 1px #C50018;
}

.er-catch-mv .recruit-catch-mv__before-box.after{
  top:50%;
  max-width:1240px;
}
.er-catch-mv__flex{
  color:#FFF;
  display:flex;
  justify-content:space-between;
  gap:20px;
  width:100%;
}
.er-catch-mv__flex__title{
  width:150px;
}
.er-catch-mv__flex__title--text{
  font-size: 130px;
  line-height: 0.7;
  white-space: nowrap;
  left: 50%;
  font-family: var(--roboto);
  font-weight: 900;
  -webkit-text-stroke: 1px #fff;
  color: transparent;
  -ms-writing-mode:tb-rl;
  writing-mode:vertical-rl;
}
.er-catch-mv__flex__cont{
  width:calc(100% - 700px);
}
.cm-title__text.er-catch-mv__cont--maintitle{
  color:#FFF;
}
.cm-title__text.er-catch-mv__cont--maintitle::before{
  background-color:#FFF;
}
.er-catch-mv__cont--title{
  margin:50px 0;
  font-size:30px;
  font-weight:bold;
}
.er-catch-mv__cont--text{
  font-size:19px;
  font-weight:bold;
}
.er-catch-mv__flex__data{
  align-self: flex-end;
  width:420px;
}
.er-catch-mv__data{
  width:420px;
  height:437px;
  padding:0 14%;
  background-image:url('img/er/bg-rounddata.webp');
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:18px;
  font-weight:900;
}
.er-catch-mv__data--text{
  line-height:1.4;
  font-size:18px;
  letter-spacing:0em;
}
.er-catch-mv__data--text span{
  display:inline-block;
  white-space:nowrap;
}
.er-catch-mv__data--maintext{
  font-size:20px;
}
.er-catch-mv__data--maintext small{
  display:block;
  font-size:14px;
}

.er-sec01{
  background-image:url('img/er/bg-s1.webp');
  background-position:top right;
  background-size:cover;
}
.er-sec02{
  background-image:url('img/er/bg-s2.webp');
  background-position:top left;
  background-size:cover;
}

.er-sec__title{
  font-size: 130px;
  line-height: 0.7;
  white-space: nowrap;
  font-family: var(--roboto);
  font-weight: 900;
  -webkit-text-stroke: 1px #fff;
  color: transparent;
}
.er-sec__title small{
  font-family:"Zen Kaku Gothic New", sans-serif;
  color:#C50018;
  display:block;
  font-size:20px;
  font-weight:900;
  -webkit-text-stroke:0;
  white-space:wrap;
  line-height:2;
  margin-top:1em;
}
.er-sec__title small:before{
  content:'・';
}
.er-sec__subtitle{
  font-size:32px;
  font-weight:bold;
  margin:50px 0 100px;
}

.er-content--title{
  color:#C50018;
  font-size:30px;
  font-weight:bold;
  min-height:100px;
  display:flex;
  align-items:center;
  padding-left:24px;
  border-left:30px solid #C50018;
  margin-bottom:30px;
}
.er-content--text{
  font-size:19px;
  font-weight:bold;
}
.er-content--text:not(:last-child){
  margin-bottom:30px;
}
.er-content--icon{
  text-align:center;
}

.er-sec01__contentflex,
.er-sec02__contentflex{
  display:flex;
  justify-content: space-between;
}
.er-sec01__content{
  width:40%;
}

.er-sec02__content{
  width:60%
}
.er-sec02__contentflex__img{
  width:30%;
}
.er-sec02__contentflex__img img{
  max-width:unset;
  width:calc(100% + (100vw - 80px - 1240px) / 2);
}
.er-sec02__content__flex{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.er-sec02__content__flex .er-content--text{
  width:calc(100% - 300px);
}
.er-sec02__content__flex .er-content--icon{
  width:240px;
}

.er-sec02{
  padding-bottom:300px;
}
.er-sec02__flows{
  margin-top:50px;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:40px;
}
.er-sec02__flow{
  position:relative;
  background:#FFF;
  display:flex;
  justify-content:center;
  align-items:center;
  height:125px;
  color:#C50018;
  border:2px dashed #C50018;
  border-radius:1rem;
  padding:1em;
  text-align:center;
}
.er-sec02__flow:not(:last-of-type)::before{
  content:'';
  position:absolute;
  top:calc(50% - 8.6px);
  right:-31px;
  width:17px;
  height:20px;
  background-image:url('img/er/icon-arrow-right.svg');
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
}
.er-pagebottom{
  padding:200px 0;
  background-image:url('img/er/bg-pagebottom.webp');
  background-size:cover;
  background-position:top center;
  color:#FFF;
}
.er-pagebottom--title{
  font-weight:bold;
  font-family:var(--roboto);
  position:absolute;
  top:0;
  right:0;
  font-size:12.6vw;
  color:transparent;
  -webkit-text-stroke: 2px #FFF;
  transform:translateY(-50%);
}
.er-pagebottom--title em{
  -webkit-text-stroke-color: #C50018;
}
.er-pagebottom--text{
  font-size:30px;
  font-weight:bold;
  margin-left:auto;
  max-width:400px;
}




/* TOPICS ARCHIVE */
.archive-sec__flex{
    justify-content: space-between;
}
.archive-sec__flex-side{
    width: 250px;
}
.archive-sec__flex-main{
    width: calc(100% - 250px);
    padding-left: 50px;
}
.archive-sec .topics-tab ul li:not(:last-child){
    margin-bottom: 30px;
}

.wp-pagenavi{
    margin-top:30px;
}
.wp-pagenavi a,
.wp-pagenavi span:not(.pages){
    text-decoration: none;
    color:var(--base-color);
    border: 1px solid #808080;
    width:28px;
    height:28px;
    text-align:center;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin: 4px;
}
.wp-pagenavi span.pages{
    border:0;
}
.wp-pagenavi a:hover{
    color:#FFF;
    background:var(--blue);
    opacity:1;
}
.wp-pagenavi span.current{
    color:#FFF;
    background:var(--blue);
    border-color:var(--blue);
}
.wp-pagenavi a.first,
.wp-pagenavi a.last,
.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink{
    border:0;
    color:var(--blue);
}
.wp-pagenavi a.first:hover,
.wp-pagenavi a.last:hover,
.wp-pagenavi a.previouspostslink:hover,
.wp-pagenavi a.nextpostslink:hover{
    color:#FFF;
}
.wp-pagenavi span.extend{
    border:0;
}


/* TOPICS SINGLE */
.single-sec__header-meta__date{
    font-weight: 900;
    font-family: var(--roboto);
    letter-spacing: 0;
    margin-right: 30px;
    position: relative;
    bottom: -2px;
}
.single-sec__header-meta__cat{
    font-weight: bold;
}
.single-sec__header-meta{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    line-height: 1;
}
.single-sec__header-title{
    font-weight: bold;
    font-size: 26px;
    margin-top: 10px;
}
.single-sec__view-more{
    margin-top: 80px;
}
.single-sec__view-more a{
    margin: 0 auto;
}
.single-sec__body .post-content{
    padding: 60px 0 0;
}
.single-sec__body .post-content h2{
    margin-left: 0;
    font-size: 20px;
    font-weight: bold;
    padding-left: 30px;
    line-height: 1.8;
    color: var(--base-color);
    background-color: var(--light-gray);
    border-left: none;
}
.single-sec__body .post-content h3,
.single-sec__body .post-content h4,
.single-sec__body .post-content h5,
.single-sec__body .post-content h6{
    font-size: 18px;
    line-height: 1.8;
    font-weight: bold;
}
.single-sec__body .post-content h3{
    padding-bottom: 5px;
}
.single-sec__body .post-content h4{
    border-left-width: 4px;
    padding-left: 15px;
}



/* PRIVACY POLICY */
.privacy-sec01 .text.top{
    margin-bottom: 30px;
}
.privacy-sec01 .sin-ul>li{
    margin-bottom: 30px;
}
.privacy-sec01 .sin-ul>li span{
    font-weight: bold;
    color: var(--blue);
}
.privacy-sec01 .sec-ul{
    margin-top: 10px;
}
.privacy-sec01 .sec-ul>li{
    font-size: 14px;
    padding-left: 1em;
}
.privacy-sec01 .sec-ul>li::before{
    content: "・";
    margin-left: -1em;
}



/* FORM */
.contact-sec__text{
    margin-bottom: 40px;
    text-align: center;
}
.contact-sec__text a{
    color: var(--base-color);
    text-decoration: underline;
}
.wpcf7 table th,
.wpcf7 table td{
    padding: 15px;
    border: 1px solid var(--light-gray);
}
.wpcf7 table th{
    font-weight: bold;
    background-color: var(--light-gray);
    border-bottom: 1px solid #fff;
}
.wpcf7 table td{
    background-color: #fff;
}
.wpcf7 table tr:last-child th{
    border-bottom: 1px solid var(--light-gray);
}
.wpcf7 table th p,
.wpcf7 table td p{
    margin: 0;
}
.wpcf7 table th .form-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
span.must{
    font-size: 13px;
    color: #fff;
    background-color: var(--base-color);
    display: inline-block;
    padding: 0 5px;
}
form input[type="text"], form input[type="email"], form input[type="tel"], form input[type="number"], form textarea{
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid #aaa;
    border-radius: 3px;
    width:100%;
    padding:12px;
    box-shadow: none;
}
form textarea{
    width: 100%;
    resize: none;
}
.submit_btn{
    margin-top: 50px;
    justify-content: center;
    display: flex;
    position: relative;
}
form .submit_btn input{
    font-weight: bold;
    width: 285px;
    padding: 19px;
    text-align: center;
    transition: .3s;
    appearance: none;
    -webkit-appearance: none;
}
form .submit_btn input:disabled{
    background: gray !important;
    pointer-events: none;
    border: 1px solid gray !important;
}
form .submit_btn input[type="submit"]{
    color: #fff;
    background-color: var(--base-color);
    border: 1px solid var(--base-color);
}
form .submit_btn input[type="submit"]:hover{
    opacity: 1;
    background-color: #fff;
    color: var(--base-color);
}
form .submit_btn input[type="button"]{
    background-color: gray;
    border: none;
    box-shadow: none;
    appearance: none;
    -webkit-appearance: none;
}
div.wpcf7 .ajax-loader{
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
    bottom: -30px;
}
div.wpcf7-response-output {
    margin: 3em 0.5em 1em;
}
.wpcf7-spinner{
	display:none;
}
input.itemamount{
  width:3.8em !important;
}
input.inputprice{
  width:8em !important;
}
td p:not(:last-of-type){
  margin-bottom:5px !important;
}
td.noedit input{
  pointer-events:none;
}
.other-link {
    color: #000;
    text-decoration: underline;
}
@media screen and (max-width: 767px){
    .wpcf7 table{
        border-collapse: collapse;
        border-spacing: 0;
    }
    .wpcf7 table th,
    .wpcf7 table td{
        width: 100%;
        display: block;
        white-space: normal;
        font-size: 14px;
    }
    form input[type="text"], form input[type="email"], form input[type="tel"], form input[type="number"], form textarea{
        width: 100%;
    }
}