/*
Theme Name: orbital Lasers
Description:サイトリニューアル　公開日2024年10月15日
Version: 1.0

*/
@charset "UTF-8";

.pc,
.pc2 {
    display: block;
}

.pcf {
    display: flex !important;
}

.sp {
    display: none;
}

.spf {
    display: none !important;
}

.tablet {
    display: none;
}

.f_u {
    font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}

@media only screen and (max-width:820px) {
    .tablet {
        display: block;
    }

    .pc {
        display: none;
    }
}

@media only screen and (max-width:768px) {
    .pc {
        display: none;
    }

    .pcf {
        display: none !important;
    }

    .sp {
        display: block;
    }

    .spf {
        display: flex !important;
    }

    .pc2 {
        display: none;
    }
}

body {
    background-color: #000;
}

.wrapper {
    width: 98%;
    box-sizing: border-box;
    max-width: 1200px;
    padding: 0;
    margin: 0 auto;
    position: relative;
}

/*header*/
.topBox header {
    background: #333;
    /*height: 1080px;
    background: url(./images/top/main_visual.png) no-repeat;
    background-size: cover;
    background-position: center center;*/
    display: flex;
    align-items: end;
    position: revert;
    overflow: hidden;
    max-height: 1080px;
}

header .txtBox {
    margin: 0 0 50px 0;
    position: absolute;
    width: 92%;
    left: 50%;
    transform: translate(-50%, 0%);
}

header .txtBox h1 {
    color: #fff;
    font-size: 74px;
}

header .txtBox p {
    color: #fff;
    font-size: 24px;
    line-height: 1.8;
    margin-top: 36px;
}

header video {
    /*position: absolute;
    top: 50%;
    height: 1140px;
    transform: translate(-50%, -50%);
    left: 50%;
    z-index: 0;*/
    height: auto;
    width: 100%;
}

/*footer*/
footer {
    background: #fff;
    padding: 70px 0 35px;
}

footer .footerInner {
    width: 96%;
    max-width: 1140px;
    margin: 0 auto 10px;
    display: flex;
    justify-content: space-between;
}

footer .lBox {
    display: flex;
    flex-flow: column;
    justify-content: space-between;
}

footer .lBox .logo {
    width: 155px;
}

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

footer .lBox .company {
    color: #005AB0 !important;
    line-height: 1.3;
    font-weight: bold;
}

footer .footerMenu li {
    text-align: right;
    margin-top: 20px;
}

footer .footerMenu li:first-child {
    margin-top: 0px;
}

footer .footerMenu li.m_contact {
    border: 1px solid #005AB0;
    width: 140px;
    text-align: center;
    height: 50px;
}

footer .footerMenu li a {
    color: #005AB0;
    font-size: 16px;
    font-weight: bold;
    text-align: right;
    font-family: "Open Sans", sans-serif;
}

/*アニメーション*/
footer .footerMenu li.m_contact a {
    position: relative;
    text-decoration: none;
    text-align: center;
    z-index: 2;
    overflow: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

footer .footerMenu li.m_contact a:hover {
    color: #fff;
}

footer .footerMenu li.m_contact a::after,
footer .footerMenu li.m_contact a::before {
    position: absolute;
    z-index: -1;
    display: block;
    content: "";
    box-sizing: border-box;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

footer .footerMenu li.m_contact a:hover::after {
    top: 0;
    left: 0;
    background-color: #005AB0;
}

footer .footerMenu li.m_contact a::after {
    top: 0;
    left: -200px;
    width: 100%;
    height: 100%;
}

footer .copyright {
    font-size: 12px;
    margin-top: 5px;
    color: #005AB0 !important;
    font-family: "Open Sans", sans-serif;
}

/*language*/
.en {
    display: none;
}

.languageBox {
    width: 96%;
    max-width: 1140px;
    margin: 0 auto;
}

.languageBox ul {
    display: flex;
    justify-content: end;
}

#jp_btn {
    cursor: pointer;
    color: #fff;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 600;
    margin-right: 20px;
    border: 1px solid #fff;
    border-radius: 50%;
    padding: 5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

#jp_btn.on {
    background: #fff;
    color: #005AB0;
}

#en_btn {
    cursor: pointer;
    color: #fff;
    font-family: "Open Sans", sans-serif;
    font-size: 12px;
    font-weight: 600;
    margin-right: 20px;
    border: 1px solid #fff;
    border-radius: 50%;
    padding: 5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

#en_btn.on {
    background: #fff;
    color: #005AB0;
}

#jp_btn,
#en_btn {
    width: 24px;
    height: 24px;
}

#newsDetailBox #jp_btn,
#newsDetailBox #en_btn,
#interviewBox #jp_btn,
#interviewBox #en_btn {
    color: #1A1A1A;
    border: 1px solid #1A1A1A;
}

#newsDetailBox #jp_btn.on,
#newsDetailBox #en_btn.on,
#interviewBox #jp_btn.on,
#interviewBox #en_btn.on {
    color: #fff;
    background: #1A1A1A;
}

/*menu*/
menu {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 9999;
    background: rgb(0 0 0 / 50%);
}

menu.UpMove {
    animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-100px);
    }
}

menu.DownMove {
    animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime {
    from {
        opacity: 0;
        transform: translateY(-100px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

menu div {
    height: 75px;
    display: flex;
    align-items: center;
    justify-content: space-between;

}

menu div .logo {
    max-width: 200px;
    min-width: 200px;
    width: 13%;
    margin-left: 50px;
    margin-left: 2.7%;
    position: relative;
    z-index: 1;
}

menu div .logo img {
    width: 100%;
}

menu div ul {
    display: flex;
    align-items: center;
    width: 750px;
    width: 100%;
    justify-content: end;
}

menu div ul.sp_language {
    display: none;
}

menu div ul li {
    margin-right: 44px;
    margin-right: 2%;
}

menu div ul li:last-child {
    margin-right: 20px;
    width: 160px;
    height: 60px;
    text-align: center;
    background: rgb(0 90 174 / 100%);

}

menu div ul li a {
    color: #fff;
    font-weight: bold;
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
}

menu div ul li:last-child a {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.menuSP,
#menuBtn {
    display: none;
}

/*アニメーション*/
menu div ul li a.ani_1 {
    text-decoration: none;
    position: relative;
}

menu div ul li a.ani_1::before {
    background: #fff;
    content: '';
    width: 100%;
    height: 2px;
    position: absolute;
    left: 0;
    bottom: -3px;
    margin: auto;
    transform-origin: center;
    transform: scale(0, 1);
    transition: transform .3s;
}

menu div ul li a.ani_1:hover::before {
    transform-origin: center;
    transform: scale(1, 1);
}

/*横からスライドするボタン*/
menu div ul li:last-child a {
    position: relative;
    text-decoration: none;
    background-color: #005AB0;
    color: #fff;
    text-align: center;
    z-index: 2;
    overflow: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

menu div ul li:last-child a:hover {
    color: #005AB0;
}

menu div ul li:last-child a::after,
menu div ul li:last-child a::before {
    position: absolute;
    z-index: -1;
    display: block;
    content: "";
    box-sizing: border-box;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

menu div ul li:last-child a:hover::after {
    top: 0;
    left: 0;
    background-color: #fff;
}

menu div ul li:last-child a::after {
    top: 0;
    left: -200px;
    width: 100%;
    height: 100%;
}

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


    menu div ul li {
        margin-right: 3%;
    }

    menu div ul {
        width: 570px;
    }

    header .txtBox {
        margin: 0 auto 40px;
    }

    footer .footerInner {
        width: 92%;
    }

    footer .lBox .logo {
        width: 45%;
    }
}

@media only screen and (max-width:768px) {
    #historyBox menu {
        background: #000;
    }

    .sp1 {
        display: none;
    }

    .topBox header {
        display: flex;
        align-items: end;
        position: relative;
        overflow: hidden;
        height: 840px;
    }

    header video {
        width: 100%;
    }

    menu div .logo {
        max-width: 165px;
        min-width: 165px;
    }

    header .txtBox h1 {
        font-size: 30px;
    }

    header .txtBox p {
        font-size: 14px;
        margin-top: 20px;
    }

    menu div ul {
        display: none;
    }

    menu div ul.sp_language {
        display: flex;
        margin-right: 55px;
    }

    menu div ul.sp_language li:last-child {
        background: none;
    }

    .menuSP {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        background: #000;
        z-index: 9999;
        display: none;
    }

    .menuSP::after {
        content: "";
        /*clip-path: polygon(100% 45%, 13% 100%, 100% 100%);*/
        clip-path: polygon(100% 53%, 21% 100%, 100% 100%);
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #005AB0;
        top: 0px;
    }

    .menuSP div {
        width: 100%;
        margin: 0 auto;
    }

    .menuSP div .logo {
        max-width: 165px;
        min-width: 165px;
        width: 8%;
        margin-left: 50px;
        margin-left: 2.7%;
        margin-top: 29px;
    }

    .menuSP ul {
        /*position: absolute;
        top: 45%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 91%;*/
        margin-left: 40px;
        position: relative;
        z-index: 10;
    }

    .menuSP ul li {
        margin-top: 35px;
    }

    .menuSP ul li a {
        color: #fff;
        font-size: 25px;
        font-family: "Open Sans", sans-serif;
    }

    #menuBtn {
        position: absolute;
        right: 4%;
        width: 2em;
        height: 0.2em;
        top: 26px;
        display: block
    }

    .menuSP #closeBtn {
        position: absolute;
        right: 4%;
        z-index: 10;
    }

    .menuSP .dli-close {
        display: inline-block;
        vertical-align: middle;
        color: #fff;
        line-height: 1;
        width: 2em;
        height: 0.2em;
        background: currentColor;
        border-radius: 0.1em;
        position: relative;
        transform: rotate(45deg);
    }

    .menuSP .dli-close::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: inherit;
        border-radius: inherit;
        transform: rotate(90deg);
    }

    #newsDetailBox #jp_btn,
    #newsDetailBox #en_btn,
    #interviewBox #jp_btn,
    #interviewBox #en_btn {
        color: #fff;
        border: 1px solid #fff;
    }

    #newsDetailBox #jp_btn.on,
    #newsDetailBox #en_btn.on,
    #interviewBox #jp_btn.on,
    #interviewBox #en_btn.on {
        background: #fff;
        color: #005AB0;
    }
}

@media only screen and (max-width:430px) {
    .topBox header {
        height: 665px;
    }

    header video {
        aspect-ratio: 9 / 16;
        width: 100%;
        height: auto;
    }
}

/*productBox*/
.topBox main {
    overflow-x: clip;
}

.productBox {
    background: url(./images/top_bg_star_1.png);
    background-size: 102% 110%;
    padding-bottom: 1020px;
    background-repeat: no-repeat;
    background-position: 0% 0px;
}

.product_inner {
    width: 96%;
    max-width: 1140px;
    margin: 0 auto;
    padding-top: 165px;
    display: flex;
    justify-content: space-between;
}

.inner2 {
    padding-top: 80px;
    align-items: center;
}

.product_txt p {
    color: #fff;
    font-size: 20px;
    line-height: 1.5;
    margin-top: 45px;
}

.product_img img {
    width: 285px;
}

.product_txt h3 {
    color: #fff;
    font-size: 36px;
}

.product_inner a {
    color: #fff;
    border: 1px solid #fff;
    display: inline-block;
    font-size: 16px;
    padding: 15px 35px;
    margin-top: 50px;
}

/*アニメーション*/
.product_inner a {
    position: relative;
    text-decoration: none;
    text-align: center;
    z-index: 2;
    overflow: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.product_inner a:hover {
    color: #1A1A1A;
}

.product_inner a::after,
.product_inner a::before {
    position: absolute;
    z-index: -1;
    display: block;
    content: "";
    box-sizing: border-box;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.product_inner a:hover::after {
    top: 0;
    left: 0;
    background-color: #fff;
}

.product_inner a::after {
    top: 0;
    left: -200px;
    width: 100%;
    height: 100%;
}


.inner2 .product_txt {
    width: 68%;
    position: relative;
    z-index: 1;
}

.inner2 .product_txt p {
    font-size: 16px;
}

.inner2 .product_img {
    height: 780px;
    position: relative;
    width: 32%;
    margin-top: -195px;
}

.inner2 .product_img .debri {
    position: absolute;
    left: -1096px;
    top: -218px;
    width: 1920px;
}

.inner2 .product_img .star {
    position: absolute;
    left: -585px;
    top: -503px;
    width: 1400px;
    scale: 0.5;
    opacity: 0;
}

.inner2 .product_img .line {
    position: absolute;
    left: -115px;
    top: 193px;
    height: 530px;
    width: 270px;
    opacity: 0;
}

.inner2 .product_img .satellite {
    position: absolute;
    left: -610px;
    top: 512px;
    width: 1090px;
    opacity: 1;
}

.inner2 .product_img img.base {
    width: 1090px;
    position: absolute;
    top: -155px;
    /* height: 100%; */
    right: -125px;
    opacity: 0;
}

.inner3 {
    margin-top: 60px;
}

.inner3 .product_txt {
    width: 50%;
}

.inner3 .product_txt p {
    font-size: 16px;
}

.inner3 .product_img {
    position: relative;
    width: 32%;
}

.inner3 .product_img img {
    width: auto;
    position: absolute;
    top: 0px;
    height: 100%;
    left: 0;
}

@media only screen and (max-width:820px) {
    .product_inner {
        width: 92%;
        display: block;
    }

    .productBox .inner1 .product_img {
        display: none;
    }

    .inner2 .product_txt {
        width: 100%;
    }

    .inner2 .product_txt p {
        font-size: 18px;
        line-height: 1.9;
    }

    .inner2 .product_img .debri {
        width: 145%;
        left: -252px;
        top: 30px;
    }

    .inner2 .product_img .star {
        width: 72%;
        left: 197px;
        top: -2px;
    }

    .inner2 .product_img .line {
        left: 332px;
        height: 344px;
        top: 281px;
        width: 180px;
    }

    .inner2 .product_img .satellite {
        width: 100%;
        left: 0;
        top: 378px;
    }

    .inner2 .product_img {
        width: 100%;
        width: 810px;
        margin-top: -160px;
        height: auto;
    }

    .inner2 .product_img img.base {
        position: relative;
        width: 100%;
        top: 0px;
        right: 0px;
        margin-top: 60px;
    }

    .product_inner a {
        display: table;
        margin: 50px 0 0 auto;
    }

    .productBox .inner2 {
        margin-top: 100px;
    }

    .productBox .inner3 {
        padding-top: 0px;
        margin-top: 100px;
    }

    .productBox .inner3 .product_txt {
        width: 100%;
    }

    .productBox .inner3 .product_txt p {
        font-size: 18px;
        line-height: 1.9;
    }
}

@media only screen and (max-width:768px) {
    .productBox {
        background: url(./images/sp_top_bg_star_1.png);
        background-size: 100% 180%;
        background-repeat: no-repeat;
        background-position: 100% 90%;
    }

    .product_inner.inner1 {
        padding-top: 90px;
    }

    .productBox .inner2 {
        padding-top: 0px;
    }

    .product_txt p {
        font-size: 14px;
        line-height: 2;
        margin-top: 18px;
    }

    .product_txt h3 {
        font-size: 24px;
    }

    .inner2 .product_txt p {
        font-size: 12px;
    }

    .productBox .inner3 .product_txt p {
        font-size: 12px;
    }
}

@media only screen and (max-width:650px) {
    .inner2 .product_img {
        width: 640px;
        margin-left: -27%;
    }

    .inner2 .product_img .debri {
        width: 910px;
        left: -189px;
        top: 46px;
    }

    .inner2 .product_img .star {
        width: 375px;
        left: 199px;
        top: 60px;
    }

    .inner2 .product_img .line {
        left: 245px;
        height: 305px;
        top: 238px;
        width: 160px;
    }

    .inner2 .product_img .satellite {
        width: 588px;
    }

}

@media only screen and (max-width:500px) {
    .inner2 .product_img {
        margin-top: -100px;
    }

}

/*映像*/
.movBox {
    height: 400px;
    position: relative;
    display: flex;
    align-items: end;
    overflow-x: clip;
}

.movBox video {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translate(-50%, 0%);
}

.movBox video.rider_video2 {
    display: none;
}

.movBox .img_satellite {
    position: absolute;
    z-index: 999;
    width: 1080px;
}

.movBox .scanimg {
    display: none;
}

.movBox .img_satellite .satellitelSet {
    position: absolute;
    top: -1260px;
    overflow-x: hidden;
    overflow-y: hidden;
    height: 1188px;
}

.movBox .img_satellite .satellitelSet .satellite {
    position: relative;
    z-index: 10;
    width: 1075px;
}

.movBox .img_satellite .satellitelSet .laser {
    position: relative;
    z-index: 9;
    top: -1303px;
    left: -87px;
    display: block;
    transform: scale(0.5);
    opacity: 0;
}

@media only screen and (min-width:1921px) {
    .movBox video.rider_video1 {
        display: none;
    }

    .movBox video.rider_video2 {
        display: block;
    }
}

@media only screen and (max-width:820px) {
    .movBox .img_satellite {
        left: 61% !important;
        width: 135%;
        bottom: 96px;
        transform: translate(-50%, 0%);
    }

    .movBox .scanimg {
        position: absolute;
        top: 0px;
        left: 50% !important;
        transform: translate(-50%, 0%);
        display: block;
        height: 300px;
        width: auto;
    }

    .movBox video {
        display: none;
    }

    .movBox .img_satellite .satellitelSet {
        height: 1257px;
    }

    .movBox .img_satellite .satellitelSet .satellite {
        width: 900px;
    }

    .movBox .img_satellite .satellitelSet .laser {
        left: -75px;
        top: -992px;
    }

}

@media only screen and (max-width:768px) {
    .productBox {
        padding-bottom: 850px;
    }

    .movBox {
        margin-top: -220px;
    }

    .movBox .img_satellite {
        left: 58.5% !important;
        width: 102%;
    }
}

@media (max-width: 768px) {
    .productBox {
        padding-bottom: 850px;
    }

    .movBox .img_satellite {
        left: calc(58.5% + (2 * ((768px - 100vw) / 200))) !important;
        width: calc(102% + (26 * ((768px - 100vw) / 200)));
    }

    .movBox .img_satellite .satellitelSet {
        top: -775px;
        height: 770px;
    }

    .movBox .img_satellite .satellitelSet .satellite {
        width: 760px;
    }

    .movBox .img_satellite .satellitelSet .laser {
        left: -66px;
        top: -870px;
    }

}

/* ブラウザー幅が568pxから467px未満の場合のスタイル */
@media (max-width: 568px) and (min-width: 468px) {
    .productBox {
        padding-bottom: 700px;
    }

    .movBox .img_satellite {
        left: calc(60.5% + (3 * ((568px - 100vw) / 100))) !important;
        width: calc(128% + (35 * ((568px - 100vw) / 100)));
    }
}

/* ブラウザー幅が467px以下の場合のスタイル */
@media (max-width: 467px) {
    .movBox {
        margin-top: -270px;
    }

    .movBox .img_satellite {
        left: 63.5% !important;
        width: 163%;
    }
}



/*Nrws*/
.newsBox {
    background: #005AB0;
    padding-bottom: 195px;
}

.newsBox h3 {
    font-size: 36px;
    color: #fff;
    padding-top: 125px;
    margin-bottom: 55px;
    font-weight: 600;
}

.newsInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

.newsBox .newsParent {
    display: flex;
    justify-content: left;
}

.newsBox .newsParent li {
    width: 30%;
    margin-right: 3.4%;
}

.newsBox .newsParent li img {
    width: 100%;
    height: auto;
}

.newsBox .newsParent li .imgBox {
    display: inline-block;
    overflow: hidden;
}

.newsBox .newsParent li a img {
    transition-duration: .5s;
}

.newsBox .newsParent li a:hover img {
    transform: scale(1.2);
}


.newsBox .newsCategory {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.newsBox .newsCategory .day {
    font-size: 12px;
    font-weight: bold;
    color: #fff;
}

.newsBox .newsCategory .cat {
    font-size: 10px;
    font-weight: 600;
    color: #fff;
    width: 100px;
    text-align: center;
    border: 1px solid #fff;
    height: 18px;
    line-height: 18px;
}

.newsBox .txt {
    font-size: 16px;
    color: #fff;
    margin-top: 10px;
    line-height: 1.5;
}

@media only screen and (max-width:768px) {
    .newsBox {
        padding-bottom: 50px;
    }

    .newsBox h3 {
        padding-top: 50px;
        font-size: 20px;
        margin-bottom: 50px;
    }

    .newsBox .newsParent li {
        width: 100%;
        padding: 0 10px;
    }

    .newsBox .txt {
        font-size: 12px;
    }
}

/*historyBox*/
.historyBox {
    background: #000;
    padding: 200px 0 224px;
}

.historyInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

.historyBox .historyInner img {
    width: 100%;
}

.historyBox .txtElm {
    position: relative;
    width: 100%;
    display: flex;
    border: 1px solid #fff;
}

.historyBox .cat {
    color: #fff;
    font-weight: 400;
    max-width: 200px;
    font-size: 24px;
    text-align: center;
    padding: 6px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #005AB0;
}

.historyBox .content {
    border-left: 1px solid #fff;
    padding: 0px 3%;
    max-height: 80px;
    height: auto;
    min-height: 70px;
    display: flex;
    align-items: center;
    width: 100%;
}

.historyBox .content a {
    font-size: 26px;
    color: #fff;
}

.historyBox .content span {
    font-size: 26px;
    color: #fff;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.historyBox .content span::after {
    content: "";
    display: inline-block;
    background-image: url("./images/top/icon_arrow@2x.png");
    background-size: contain;
    background-repeat: no-repeat;
    width: 16px;
    height: 32px;
}

@media only screen and (max-width:820px) {
    .historyBox .historyInner {
        width: 92%;
    }

    .historyBox .txtElm {
        width: 100%;
    }

    .historyBox .cat {
        font-size: 19px;
    }

    .historyBox .content a {
        font-size: 12px;
    }
}

@media only screen and (max-width:768px) {
    .historyBox {
        padding: 100px 0;
    }

    .historyBox .content {
        min-height: 40px;
    }

    .historyBox .content span {
        font-size: 15px;
    }

    .historyBox .content a::after {
        width: 9px;
        height: 17px;
    }

    .historyBox .txtElm {
        display: block;
    }

    .historyBox .cat {
        max-width: 100%;
        justify-content: flex-start;
        padding-left: 3%;
        font-size: 12px;
    }

    .historyBox .content {
        border: none;
    }
}


/*recruitBox*/
.recruitBox {

    background-image: url("./images/top_career_image.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    height: 740px;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    margin-bottom: 100px;
}

.recruitBox .recruitInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;

}

.recruitBox h3 {
    color: #005AB0;
    font-size: 36px;
}

.recruitBox p {
    color: #005AB0;
    font-size: 14px;
    line-height: 1.5;
    margin-top: 25px;
}

.recruitBox .en p {
    width: 590px;
}

.recruitBox a {
    color: #005AB0;
    border: 1px solid #005AB0;
    display: inline-block;
    font-size: 16px;
    padding: 15px 35px;
    margin-top: 25px;
}

/*アニメーション*/
.recruitBox a {
    position: relative;
    text-decoration: none;
    text-align: center;
    z-index: 2;
    overflow: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 13%;
}

.recruitBox a:hover {
    color: #fff;
}

.recruitBox a::after,
.recruitBox a::before {
    position: absolute;
    z-index: -1;
    display: block;
    content: "";
    box-sizing: border-box;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.recruitBox a:hover::after {
    top: 0;
    left: 0;
    background-color: #005AB0;
}

.recruitBox a::after {
    top: 0;
    left: -200px;
    width: 100%;
    height: 100%;
}


.recruitBox .recruitTtl img {
    display: none;
}

.recruitMiniBox {
    display: none;
}

@media only screen and (min-width:1921px) {
    .recruitBox {
        background-size: cover;
    }
}

@media (max-width: 1920px) and (min-width: 786px) {

    /* .recruitBox p {
        width: calc(380px + (550 - 380) * ((100vw - 821px) / (1170 - 821)));
    }*/
    .recruitBox .en p {
        width: calc(380px + (590 - 380) * ((100vw - 786px) / (1920 - 786)));
    }
}

@media only screen and (max-width:820px) {
    .recruitBox {
        background: none;
        max-height: 380px;
        background-image: url("./images/top_career_image.png");
        background-size: cover;
        background-position: top center;
        margin-bottom: 0px;
    }

    .recruitBox .recruitInner {
        width: 92%;
    }

    .recruitBox .recruitInner p,
    .recruitBox .recruitInner a {
        display: none !important;
    }

    .recruitBox::before {
        display: none;
    }

    .recruitBox h3 {
        padding-left: 10%;
    }

    .recruitMiniBox {
        margin-top: 20px;
        margin-bottom: 80px;
    }

    .recruitMiniBox .recruitMiniInner {
        width: 92%;
        margin: 0 auto;
    }

    .recruitMiniBox p {
        color: #fff;
        font-size: 16px;
        line-height: 1.5;
    }

    .recruitMiniBox p {
        color: #fff;
        font-size: 16px;
        line-height: 1.5;
    }

    .recruitMiniBox a {
        color: #fff;
        border: 1px solid #fff;
        display: inline-block;
        font-size: 16px;
        padding: 15px 35px;
        margin-top: 25px;
        display: table;
        margin: 50px 0 0 auto;
    }

    /*横からスライドするボタン*/
    .recruitMiniBox a {
        position: relative;
        text-decoration: none;
        /*background-color:#005AB0;*/
        color: #fff;
        text-align: center;
        z-index: 2;
        overflow: hidden;
        -webkit-transition: all 0.4s;
        transition: all 0.4s;
    }

    .recruitMiniBox a:hover {
        color: #005AB0;
    }

    .recruitMiniBox a::after,
    .recruitMiniBox a::before {
        position: absolute;
        z-index: -1;
        display: block;
        content: "";
        box-sizing: border-box;
        -webkit-transition: all 0.4s;
        transition: all 0.4s;
    }

    .recruitMiniBox a:hover::after {
        top: 0;
        left: 0;
        background-color: #fff;
    }

    .recruitMiniBox a::after {
        top: 0;
        left: -200px;
        width: 100%;
        height: 100%;
    }

    .recruitMiniBox {
        display: block;
    }
}

@media only screen and (max-width:768px) {
    .recruitBox {
        max-height: 170px;
    }

    .recruitBox h3 {
        font-size: 20px;
    }

    .recruitMiniBox p {
        font-size: 12px;
    }

    .recruitMiniBox a {
        font-size: 12px;
    }
}

/*history*/
#historyBox {
    background: #F1F1F1;
}

#historyBox .topBox {
    height: 480px;
    background-image: url("./images/history_top_image.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#historyBox .topBoxInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    align-items: end;
    height: 100%;
}

#historyBox .topBoxInner img {
    display: none;
}

#historyBox h2 {
    font-size: 48px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 65px;
}

#historyBox .explanationBox {
    margin-top: 200px;
}

#historyBox .explanationInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

#historyBox .explanationBox h3 {
    width: 41%;
    font-size: 30px;
    line-height: 60px;
    font-weight: 600;
}

#historyBox .explanationBox .subTxt {
    width: 50%;
}

#historyBox .explanationBox .subTxt p {
    font-size: 18px;
    line-height: 1.5;
}

#historyBox .explanationBox .border {
    width: 8px;
    background: #005AB0;
}

#historyBox .explanationBox .imgBox {
    max-width: 1140px;
    width: 96%;
    margin: 65px auto 0;
}

#historyBox .explanationBox .imgBox img {
    width: 100%;
}

/*contentsBox*/
#historyBox .contentsBox {
    margin-top: 102px;
}

#historyBox .contentsInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto 0;
}

#historyBox .indexBox .ttl {
    color: #005AAE;
    font-size: 24px;
    font-weight: bold;
}

#historyBox .indexBox {
    max-width: 900px;
    width: 98%;
    background: #E5E5E5;
    margin: 0 auto;
    padding: 45px;
}

#historyBox .indexBox ul {
    margin-top: 40px;
}

#historyBox .indexBox ul li {
    font-size: 16px;
    font-weight: 600;
    margin-top: 20px;
    line-height: 1;
    text-indent: -1.5em;
    padding-left: 1em;
}

#historyBox .indexBox ul.en li {
    text-indent: -1.2em;
}

#historyBox .indexBox ul li a {
    color: #000;
}

#historyBox .indexBox ul span {
    font-size: 16px;
    color: #005AAE;
    margin-right: 5px;
}

/*timelineBox*/
#historyBox .timelineBox {
    margin-top: 90px;

}

#historyBox .lineElm {
    display: flex;
    margin-bottom: 160px;
}

#historyBox #year2024.lineElm {
    margin-bottom: 0px;
    padding-bottom: 160px;
    overflow-y: clip;
}

#historyBox .timelineBox .yearBox {
    color: #005AAE;
    font-size: 50px;
    width: 10%;
    font-weight: bold;
}

#historyBox .timelineBox .imgBox {
    width: 10%;
    text-align: center;
    position: relative;
    z-index: 1;
}

#historyBox .timelineBox .imgBox::after {
    content: "";
    display: inline-block;
    width: 3px;
    background: #005AAE;
    position: absolute;
    height: 210%;
    left: 50%;
    top: 16px;
    transform: translate(-50%, 0%);
    z-index: -1;
}

#historyBox .timelineBox .imgBox img {
    width: 30px;
    margin-top: 10px;
}

#historyBox .timelineBox .txtBox {
    width: 80%;
}

#historyBox .timelineBox .txtBox h4 {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.5;
    margin-top: 3px;
}

#historyBox .timelineBox .txtBox p {
    font-size: 18px;
    line-height: 1.5;
    margin-top: 1em;
}

#historyBox .timelineBox .txtBox p img {
    margin-top: 10px;
}

#historyBox .yearSp {
    display: none;
}

#historyBox .br2 {
    display: none;
}

@media only screen and (max-width:1170px) {
    #historyBox .explanationBox .subTxt p br {
        display: none;
    }

    #historyBox .br2 {
        display: block;
    }
}

@media only screen and (max-width:820px) {
    #historyBox .contentsInner {
        width: 92%;
    }

    #historyBox .timelineBox .yearBox {
        width: 17%;
    }

    #historyBox .timelineBox .txtBox {
        width: 73%;
    }
}

@media only screen and (max-width:768px) {
    #historyBox .topBoxInner {
        position: relative;
        width: 100%;
        height: auto;
        display: block;
    }

    #historyBox .topBoxInner img {
        display: block;
    }

    #historyBox .topBox {
        height: auto;
        background: none;
        margin-top: 72px;
    }

    #historyBox h2 {
        font-size: 20px;
        position: relative;
        bottom: 30px;
        width: 92%;
        margin: 0 auto;
    }

    #historyBox .explanationBox {
        margin-top: 25px;
    }

    #historyBox .explanationInner {
        display: block;
    }

    #historyBox .explanationBox h3 {
        width: 100%;
        font-size: 24px;
        line-height: 1.5;
    }

    #historyBox .explanationBox h3 .br2 {
        display: none;
    }

    #historyBox .explanationBox .subTxt p {
        font-size: 13px;
    }

    #historyBox .explanationBox .border {
        width: 100%;
        background: #005AB0;
        height: 4px;
        margin: 20px 0;
    }

    #historyBox .explanationBox .subTxt {
        width: 100%;
    }

    #historyBox .contentsBox {
        margin-top: 50px;
    }

    #historyBox .indexBox .ttl {
        font-size: 12px;
    }

    #historyBox .timelineBox {
        margin-top: 50px;
    }

    #historyBox .timelineBox .imgBox img {
        width: 25px;
        margin-top: 5px;
    }

    #historyBox .timelineBox .yearBox {
        display: none;
    }

    #historyBox .timelineBox .txtBox {
        width: 90%;
    }

    #historyBox .timelineBox .txtBox p.yearSp {
        color: #005AAE;
        font-size: 20px;
        font-weight: bold;
        margin-top: 3px;
        display: block;
    }

    #historyBox .timelineBox .txtBox h4 {
        font-size: 20px;
        margin-top: 0px;
    }

    #historyBox .timelineBox .txtBox p {
        font-size: 12px;
    }

    #historyBox .timelineBox .imgBox::after {
        height: 175%;
    }

    #historyBox .lineElm {
        margin-bottom: 60px;
    }

    #historyBox .indexBox {
        padding: 25px;
    }

    #historyBox .indexBox ul {
        margin-top: 30px;
    }

    #historyBox .indexBox ul li {
        font-size: 12px;
        margin-top: 14px;
        line-height: 1.3;
        font-weight: 700;
    }

    #historyBox .indexBox ul span {
        font-size: 12px;
    }

}

/*About*/
#aboutBox {
    background: #000000
}

#aboutBox .topBox {
    height: 480px;
    background-image: url("./images/about_top_image.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#aboutBox .topBoxInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    align-items: end;
    height: 100%;
}

#aboutBox .topBoxInner img {
    display: none;
}

#aboutBox h2 {
    font-size: 48px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 65px;
}

#aboutBox .missionBox {
    margin-top: 250px;
}

#aboutBox .missionInner,
#aboutBox .imgScrollInner,
#aboutBox .teamBoxInner,
#aboutBox .companyInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

#aboutBox .missionBox h3 {
    color: #fff;
    font-size: 35px;
    font-weight: 600;
}

#aboutBox .missionBox h4,
#aboutBox .contentsBox_1 h4 {
    color: #fff;
    font-size: 50px;
    line-height: 78px;
    margin-top: 50px;
}

#aboutBox .missionBox p,
#aboutBox .contentsBox_1 p {
    color: #fff;
    font-size: 24px;
    line-height: 1.5;
    margin-top: 30px;
    position: relative;
    z-index: 1;
}

#aboutBox .hikaru {
    margin-top: -550px;
    margin-top: calc(-170px - (100vw - 820px) * (380 / 1080));
}

#aboutBox .hikaru_txt {
    color: #fff;
    text-align: center;
    font-size: 36px;
    font-weight: 600;
    margin-top: -400px;
    margin-top: calc(-100px - (100vw - 820px) * (300 / 1080));
}

#aboutBox .contentsInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    overflow: hidden;
}

#aboutBox .contentsBox_1 {
    margin-top: 45px;
}

#aboutBox .contentsBox_1 .imgElm {
    margin-top: 80px;
}

#aboutBox .featuresBox .featureBox2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 140px;
}

#aboutBox .featuresBox .infoElm {
    display: flex;
    justify-content: space-between;
    margin-top: 240px;
}

#aboutBox .featuresBox .infoElm li.txtElm {
    width: 68%;
}

#aboutBox .featuresBox .infoElm li.imgElm2 {
    width: 32%;
    position: relative;
}

#aboutBox .featuresBox .infoElm li.imgElm2 img {
    position: absolute;
    width: 163%;
    top: 70%;
    left: 14%;
    transform: translate(-50%, -50%);
}

#aboutBox .featuresBox .infoElm h4 {
    font-size: 50px;
}

#aboutBox .featuresBox .infoElm h4 span {
    color: #fff;
    font-size: 24px;
    margin-left: 15px;
}

#aboutBox .featuresBox .featureElm {
    display: flex;
    justify-content: left;
    gap: 20px;
    width: 96%;
}

#aboutBox .featuresBox .featureElm li {
    width: 50%;
    max-width: 320px;
}

#aboutBox .featuresBox .featureElm .ttl2 {
    font-family: "Inter", sans-serif;
    font-size: 30px;
    display: flex;
    align-items: center;
}

#aboutBox .featuresBox .featureElm .img {
    margin-top: 15px;

}

#aboutBox .featuresBox .featureElm .img img {}

#aboutBox .featuresBox .featureElm .total::after {
    content: "";
    display: inline-block;
    background-image: url("./images/about__icon_weight.png");
    width: 30px;
    height: 30px;
    background-size: contain;
    margin-left: 20px;
}

#aboutBox .featuresBox .featureElm .cost::after {
    content: "";
    display: inline-block;
    background-image: url("./images/about__icon_cost.png");
    width: 30px;
    height: 30px;
    background-size: contain;
    margin-left: 20px;
}

#aboutBox .featuresBox .featureBox2 .animation p.explanation {
    color: #fff;
    font-size: 16px;
    line-height: 1.5;
    margin-top: 5px;
    text-align: right;
    margin-right: 5%;
}

#aboutBox .featuresBox .featureBox2 .animation p.explanation span {
    font-size: 12px;
    vertical-align: top;
    color: #fff;
}

#aboutBox .featuresBox .txt {
    width: 50%;
    margin-top: 47px;
}

#aboutBox .featuresBox .txt p {
    color: #fff;
    font-size: 16px;
    line-height: 1.5;
    margin-top: 10px;
}

#aboutBox .featuresBox .txt p span {
    font-size: 12px;
    vertical-align: top;
    color: #fff;
}

#aboutBox .featuresBox .txt p.mini {
    font-size: 13px;
}

#aboutBox .imgScroll {
    margin-top: 200px;
}

#aboutBox .slick-dots li button:before {
    color: #fff;
    opacity: 1;
}

#aboutBox .slick-dots li.slick-active button:before {
    color: #E27D36;
    opacity: 1;
}

#aboutBox .slick-dots {
    bottom: -37px !important;
}

#aboutBox .slick-dots li button {
    width: 10px !important;

}

.slick-dots li button:before {
    font-size: 8px !important;
    width: 10px !important;
}

.slick-dots li {
    width: 10px !important;
    margin: 0 7px !important;
}

#aboutBox .teamBox {
    margin-top: 224px;
}

#aboutBox .teamBox h4 {
    color: #fff;
    font-size: 36px;
    font-weight: 600;
    text-align: center;
}

#aboutBox .teamBox ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 40px;
}

#aboutBox .teamBox ul li {
    width: 25%;
    max-width: 270px;
    margin-bottom: 49px;
    cursor: pointer;
}

#aboutBox .teamBox ul li:hover {
    opacity: 0.8;
}

#aboutBox .teamBox ul li .img {
    max-width: 270px;
    width: 100%;
}

#aboutBox .teamBox ul li .post {
    color: #fff;
    text-align: center;
    font-size: 12px;
    margin-top: 20px;
    line-height: 1.3;
}

#aboutBox .teamBox ul li .name {
    color: #fff;
    text-align: center;
    font-size: 24px;
    margin-top: 15px;
    line-height: 1.3;
}

#aboutBox .teamBox ul li .profile {
    display: none !important;
}

#aboutBox #bg {
    width: 100%;
    height: 100%;
    background: hsl(0deg 0% 0% / 80%);
    position: fixed;
    top: 0;
    display: none;
    z-index: 10000;
}

#aboutBox #popUp {
    max-width: 1140px;
    width: 96%;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: none;
    z-index: 10001;
}

#aboutBox #popUp .btnList {
    display: flex;
    justify-content: space-between;
}

#aboutBox #popUp .btnList #AClose {
    width: 42px;
    height: 42px;
    cursor: pointer;
}

#aboutBox #popUp .btnList #Aleft {
    width: 20px;
    height: 42px;
    margin-right: 50px;
    cursor: pointer;
}

#aboutBox #popUp .btnList #Aright {
    width: 20px;
    height: 42px;
    cursor: pointer;
}

#aboutBox #popUp .btnList #AClose:hover,
#aboutBox #popUp .btnList #Aleft:hover,
#aboutBox #popUp .btnList #Aright:hover {
    opacity: 0.8;
}

#aboutBox #popUp .dataBox {
    display: flex;
    margin-top: 35px;
}

#aboutBox #popUp .dataBox .lBox {
    width: 45%;
    max-width: 460px;
}

#aboutBox #popUp .dataBox .rBox {
    width: 52%;
    margin-left: 3%;
}

#aboutBox #popUp .dataBox .post {
    color: #fff;
    font-size: 24px;
    line-height: 1.5;
}

#aboutBox #popUp .dataBox .name {
    color: #fff;
    font-size: 36px;
    line-height: 1.5;
}

#aboutBox #popUp .dataBox .profile {
    color: #fff;
    font-size: 15px;
    margin-top: 50px;
    line-height: 1.5;
}

#aboutBox .companyBox {
    margin-top: 250px;
}

#aboutBox .companyBox h4 {
    color: #fff;
    font-size: 36px;
}

#aboutBox .companyBox ul {
    margin-top: 104px;
    margin-bottom: 170px;
}

#aboutBox .companyBox ul li {
    display: flex;
    margin-top: 20px;
}

#aboutBox .companyBox ul span {
    color: #fff;
    font-size: 24px;
    width: 145px;
    min-width: 145px;
    position: relative;
    line-height: 1.5;
}

#aboutBox .companyBox ul.en span {
    line-height: 1.3;
}

#aboutBox .companyBox ul span::after {
    content: "";
    display: inline-block;
    width: 1px;
    background: #fff;
    position: absolute;
    height: 156%;
    right: 0;
    top: -40px;
}

#aboutBox .companyBox ul li:last-child span::after {
    padding-bottom: 40px;
}

#aboutBox .companyBox ul p {
    color: #fff;
    line-height: 1.5;
    font-size: 24px;
    padding-left: 50px;
}

#aboutBox .companyBox ul div .txt2 {
    margin-top: 15px;
    /*margin-left: 50px;*/
}

#aboutBox .companyBox ul div p {
    /*text-indent: -5em;
    padding-left: 5em;*/
}

#aboutBox .imgScrollInner .slick-prev {
    left: 5px;
    z-index: 1;
}

#aboutBox .imgScrollInner .slick-prev:before {
    content: '';
    background-image: url("./images/icon_arrow_l.png");
    background-repeat: no-repeat;
    background-size: cover;
    width: 20px;
    height: 35px;
    display: block;
}

#aboutBox .imgScrollInner .slick-next {
    right: 5px;
}

#aboutBox .imgScrollInner .slick-next:before {
    content: '';
    background-image: url("./images/icon_arrow_r.png");
    background-repeat: no-repeat;
    background-size: cover;
    width: 20px;
    height: 35px;
    display: block;
}

@media screen and (min-width: 1900px) {
    #aboutBox .hikaru {
        margin-top: -550px;
    }

    #aboutBox .hikaru_txt {
        margin-top: -400px;
    }

}

@media screen and (max-width: 820px) {
    #aboutBox .missionBox {
        margin-top: 100px;
    }

    #aboutBox .hikaru {
        margin-top: -170px;
    }

    #aboutBox .hikaru_txt {
        margin-top: -100px;
    }

    #aboutBox .missionBox h4,
    #aboutBox .contentsBox_1 h4 {
        font-size: 40px;
    }

    #aboutBox .teamBox ul li {
        width: 32%;
        margin-top: 25px;
    }

    #aboutBox .companyBox {
        margin-top: 150px;
    }

    #aboutBox .featuresBox {
        overflow: hidden;
    }

    #aboutBox .featuresBox .infoElm h4 {
        font-size: 35px;
    }

    #aboutBox .featuresBox .infoElm li.imgElm2 img {
        width: 290%;
        top: 70%;
        left: 29%;
    }

    #aboutBox .featuresBox .featureElm .ttl2 {
        font-size: 25px;
    }
}

@media only screen and (max-width:768px) {
    #aboutBox .topBox {
        height: auto;
        margin-top: 70px;
        background: none;
    }

    #aboutBox h2 {
        font-size: 20px;
    }

    #aboutBox h2 {
        font-size: 20px;
        position: relative;
        bottom: 30px;
        width: 92%;
        margin: 0 auto;
    }

    #aboutBox .topBoxInner,
    #aboutBox .missionInner,
    #aboutBox .imgScrollInner,
    #aboutBox .teamBoxInner,
    #aboutBox .companyInner,
    #aboutBox .contentsInner {
        width: 92%;
    }

    #aboutBox .topBoxInner {
        position: relative;
        width: 100%;
        height: auto;
        display: block;
    }

    #aboutBox .topBoxInner img {
        display: block;
    }

    #aboutBox .missionBox {
        margin-top: 65px;
    }

    #aboutBox .missionBox h3 {
        font-size: 20px;
        margin-bottom: 20px;
    }

    #aboutBox .missionBox h4,
    #aboutBox .contentsBox_1 h4 {
        font-size: 24px;
        line-height: 1.5;
        margin-top: 30px;
    }

    #aboutBox .contentsBox_1 h4 {
        margin-top: 0px;
    }

    #aboutBox .missionBox p,
    #aboutBox .contentsBox_1 p {
        font-size: 12px;
        margin-top: 20px;
    }

    #aboutBox .hikaru {
        margin-top: -55px;
    }

    #aboutBox .hikaru_txt {
        margin-top: -40px;
        font-size: 20px;
    }

    #aboutBox .contentsBox_1,
    #aboutBox .contentsBox_1 .imgElm {
        margin-top: 50px;
    }

    #aboutBox .featuresBox {
        margin-top: 100px;
    }

    #aboutBox .featuresBox .infoElm {
        margin-top: 75px;
    }

    #aboutBox .featuresBox .infoElm li.txtElm {
        width: 145%;
    }

    #aboutBox .featuresBox .infoElm li.imgElm2 {
        width: 26%;
    }

    #aboutBox .featuresBox .infoElm h4 {
        font-size: 24px;
    }

    #aboutBox .featuresBox .infoElm h4 span {
        font-size: 12px;
        margin-left: 5px;
    }

    #aboutBox .featuresBox .infoElm h4.en span {
        display: block;
        margin-top: -20px;

    }

    #aboutBox .featuresBox .infoElm li.imgElm2 img {
        width: 811%;
        width: 730%;
        top: 155%;
        left: 53%;
    }

    #aboutBox .featuresBox .featureElm li {
        width: 50%;
    }

    #aboutBox .featuresBox .featureElm .ttl2 {
        font-size: 14px;
        padding-left: 2px;
    }

    #aboutBox .featuresBox .featureElm .total::after {
        width: 18px;
        height: 18px;
        margin-left: 15px;
    }

    #aboutBox .featuresBox .featureElm .cost::after {
        width: 18px;
        height: 18px;
        margin-left: 15px;
    }

    #aboutBox .featuresBox .txt p {
        font-size: 12px;
    }


    #aboutBox .imgScroll {
        margin-top: 95px;
    }

    #aboutBox .teamBox {
        margin-top: 85px;
    }

    #aboutBox .teamBox h4 {
        font-size: 20px;
    }

    #aboutBox .teamBox ul {
        gap: 5px;
        margin-top: 40px;
    }

    #aboutBox .teamBox ul li {
        margin-top: 5px;
        margin-bottom: 30px;
    }

    #aboutBox .teamBox ul li .post {
        font-size: 7px;
    }

    #aboutBox .teamBox ul li .name {
        font-size: 11px;
        margin-top: 8px;
    }

    #aboutBox .teamBox ul li .palt {
        font-feature-settings: "palt";
    }

    #aboutBox .companyBox {
        margin-top: 75px;
    }

    #aboutBox .companyBox h4 {
        font-size: 20px;
    }

    #aboutBox .companyBox ul span {
        font-size: 12px;
        width: 70px;
        min-width: 70px;
    }

    #aboutBox .companyBox ul p {
        font-size: 12px;
        padding-left: 30px;
    }

    #aboutBox .companyBox ul div {
        /*margin-left: 30px;*/
    }

    #aboutBox .companyBox ul span::after {
        height: 220%;
        top: -20px;
    }

    #aboutBox .companyBox ul li:last-child span::after {
        padding-bottom: 20px;
        height: 55px;
    }

    #aboutBox .companyBox ul {
        margin-bottom: 140px;
        margin-top: 60px;
    }

    #aboutBox .featuresBox .featureBox2 {
        display: block;
        margin-top: 90px;
    }

    #aboutBox .featuresBox .featureElm {
        width: 100%;
        justify-content: space-between;
    }

    #aboutBox .featuresBox .txt {
        width: 100%;
        margin-top: 20px;
    }

    #aboutBox .featuresBox .featureBox2 .animation p.explanation {
        margin-right: 0%;
        font-size: 8px;
        padding-right: 4px;
    }

    #aboutBox .featuresBox .featureBox2 .animation p.explanation span {
        font-size: 8px;
    }

    /*ポップアップ*/
    #aboutBox #popUp {
        top: 5%;
        transform: translate(-50%, -0%);
        overflow-y: scroll;
        height: 95%;
    }

    #aboutBox #popUp .btnList #AClose {
        width: 21px;
        height: 21px;
    }

    #aboutBox #popUp .btnList #Aleft {
        width: auto;
        height: 20px;
        margin-right: 25px;
    }

    #aboutBox #popUp .btnList #Aright {
        width: auto;
        height: 20px;
    }

    #aboutBox #popUp .dataBox {
        display: block;
        margin-top: 17px;
    }

    #aboutBox #popUp .dataBox .lBox {
        width: 100%;
        margin: 0 auto;
    }

    #aboutBox #popUp .dataBox .rBox {
        width: 96%;
        margin-left: 0%;
        margin-top: 38px;
    }

    #aboutBox #popUp .dataBox .post {
        font-size: 11px;
    }

    #aboutBox #popUp .dataBox .name {
        font-size: 17px;
    }

    #aboutBox #popUp .dataBox .profile {
        font-size: 11px;
        margin-top: 28px;
    }
}

/*recruitBox*/
#recruitBox .topBox {
    height: 680px;
    background-image: url("./images/recruit_top_bg.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#recruitBox .topBoxInner,
#recruitBox .messageInner,
#recruitBox .interviewInner,
#recruitBox .cultureInner,
#recruitBox .recruitListInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

#recruitBox .topBoxInner {
    display: flex;
    height: 100%;
    padding-top: 250px;
}

#recruitBox .topBox .topElm {
    width: 63%;
    position: relative;
    z-index: 1;
}

#recruitBox .topBox .topElm .bg {
    display: none;
}

#recruitBox .topBox h2 {
    font-size: 48px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 65px;
}

#recruitBox .topBox .subTxt {
    font-size: 50px;
    color: #fff;
    line-height: 1.5;
}

#recruitBox .topBox .imgElm {
    position: relative;
    width: 37%;
}

#recruitBox .topBox .imgElm img {
    position: absolute;
    width: 143%;
    max-width: 580px;
    right: 0px;
    z-index: 0;
}

#recruitBox .txtBox {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    height: 100%;
    margin-top: 60px;
}

#recruitBox .txtBox p {
    color: #fff;
    font-size: 20px;
    line-height: 1.5;
}

#recruitBox .txtBox p.en {
    max-width: 530px;
}

#recruitBox .galleryBox {
    margin-top: 240px;
}

#recruitBox .galleryBox ul {
    display: flex;
    height: 580px;
}

/*横スライド*/
#recruitBox .swiper-wrapper {
    transition-timing-function: linear;
    height: 400px;
}

#recruitBox .swiper .swiper-slide {
    height: auto;
}

#recruitBox .swiper .swiper-slide {
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: relative;
}

#recruitBox .swiper .swiper-slide img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    height: 185%;
    transform: translate(-50%, -50%);
}

#recruitBox .swiper .swiper-slide-item img {
    width: 100%;
}

/*代表メッセージ*/
#recruitBox .messageBox {
    margin-top: 300px;
}

#recruitBox .messageInner {
    display: flex;
    justify-content: space-between;
}

#recruitBox .messageBox .txtElm {
    width: 36%;
}

#recruitBox .messageBox .imgElm {
    width: 64%;
    max-width: 660px;
}

#recruitBox .messageBox h3 {
    color: #fff;
    font-size: 36px;
}

#recruitBox .messageBox .subTxt {
    color: #fff;
    font-size: 24px;
    line-height: 1.5;
    margin-top: 45px;
}

#recruitBox .messageBox .txtElm a {
    width: 200px;
    border: 1px solid #fff;
    padding: 12px 0;
    font-size: 16px;
    line-height: 1.5;
    color: #fff;
    display: block;
    text-align: center;
    margin: 50px 0 0 auto;
}

/*アニメーション*/
#recruitBox .messageBox .txtElm a {
    position: relative;
    text-decoration: none;
    text-align: center;
    z-index: 2;
    overflow: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

#recruitBox .messageBox .txtElm a:hover {
    color: #1A1A1A;
}

#recruitBox .messageBox .txtElm a::after,
#recruitBox .messageBox .txtElm a::before {
    position: absolute;
    z-index: -1;
    display: block;
    content: "";
    box-sizing: border-box;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

#recruitBox .messageBox .txtElm a:hover::after {
    top: 0;
    left: 0;
    background-color: #fff;
}

#recruitBox .messageBox .txtElm a::after {
    top: 0;
    left: -200px;
    width: 100%;
    height: 100%;
}

/*インタビュー*/
#recruitBox .interviewBox {
    margin-top: 250px;
}

#recruitBox .interviewBox h3 {
    color: #fff;
    font-size: 36px;
}

#recruitBox .interviewBox ul {
    display: flex;
    flex-wrap: wrap;
    /*gap: 15px;*/
    justify-content: space-between;
    margin-top: 62px;
}

#recruitBox .interviewBox ul li {
    width: 32%;
    max-width: 350px;
    margin-bottom: 100px;
}

#recruitBox .interviewBox ul li a:hover {
    opacity: 0.8;
}

#recruitBox .interviewBox ul li .profileElm {
    background: #005AAE;
    padding: 20px;
    width: 100%;
    position: relative;
}

#recruitBox .interviewBox ul li .profileElm::after {
    content: "";
    display: inline-block;
    background-image: url("./images/recruit_icon_arrow.png");
    background-repeat: no-repeat;
    width: 15px;
    height: 30px;
    background-size: contain;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translate(-50%, -50%);
}

#recruitBox .interviewBox ul li .name {
    font-size: 24px;
    color: #fff;
}

#recruitBox .interviewBox ul li .company {
    color: #fff;
    font-size: 16px;
    margin-top: 10px;
    line-height: 1.4;
}

#recruitBox .interviewBox ul li .job {
    color: #fff;
    font-size: 16px;
    margin-top: 8px;
}

/*culture*/
#recruitBox .cultureBox {
    margin-top: 200px;
    background-image: url("./images/recruit_BG02.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#recruitBox .cultureInner {
    padding: 150px 0;
}

#recruitBox .cultureBox h3 {
    font-size: 50px;
    font-weight: 600;
    line-height: 1.5;
}

#recruitBox .cultureBox p {
    font-size: 24px;
    line-height: 1.5;
    margin-top: 60px;
}

/*募集職種*/
#recruitBox .recruitListBox {
    margin-top: 150px;
    margin-bottom: 210px;
}

#recruitBox .recruitListBox h3 {
    font-size: 36px;
    color: #fff;
}

#recruitBox .recruitListBox .workcat {
    display: flex;
    justify-content: flex-start;
    margin-top: 30px;
}

#recruitBox .recruitListBox .workcat li:before {
    content: "/";
    color: #fff;
    font-size: 24px;
    padding: 0 10px;
}

#recruitBox .recruitListBox .workcat li:first-child::before {
    content: none;
}

#recruitBox .recruitListBox .workcat a:hover {
    opacity: 0.8;
}

#recruitBox .recruitListBox .workcat a span {
    color: #fff;
    font-size: 24px;
}

#recruitBox .recruitListBox .recruitElm {
    margin-top: 80px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

#recruitBox .recruitListBox .recruitElm li {
    margin-top: 30px;
}

#recruitBox .recruitListBox .recruitElm li a {
    padding: 30px;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    box-sizing: border-box;
}

#recruitBox .recruitListBox .recruitElm li a::after {
    content: "";
    display: inline-block;
    background-image: url("./images/recruit_icon_arrow.png");
    background-repeat: no-repeat;
    width: 30px;
    height: 30px;
    background-size: contain;
    position: absolute;
    right: 5%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#recruitBox .recruitListBox .recruitElm li a:hover {
    opacity: 0.8;
}

#recruitBox .recruitListBox .recruitElm .halfElm {
    width: 49%;
    border: 1px solid #fff;
    height: 180px;
    max-width: 550px;
}

#recruitBox .recruitListBox .recruitElm .fullElm {
    width: 100%;
    border: 1px solid #fff;
    height: 180px;
}

#recruitBox .recruitListBox .recruitElm .fullElm a {
    display: flex;
    align-items: center;
}

#recruitBox .recruitListBox .recruitElm .titleTxt {
    font-size: 24px;
    color: #fff;
}

#recruitBox .recruitListBox .recruitElm .accessTxt span {
    font-size: 16px;
    color: #fff;
    margin-top: 10px;
    position: relative;
    display: block;
    line-height: 1.5;
    padding-left: 25px;
}

#recruitBox .recruitListBox .recruitElm .accessTxt span::before {
    content: "";
    display: inline-block;
    background-image: url("./images/recruit_icon_pin_white.png");
    background-repeat: no-repeat;
    width: 17px;
    height: 26px;
    background-size: contain;
    position: absolute;
    left: 0px;
}

/*採用詳細*/
#recruitDetailBox {
    background: #fff;
}

#recruitDetailBox main {
    border-bottom: 1px solid #005AB0;
}

#recruitDetailBox .topBox {
    height: 480px;
    background-image: url("./images/recruitdetail_top_image.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    align-items: end;
    display: grid;
}

#recruitDetailBox .topBoxInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    padding-bottom: 50px;
}

#recruitDetailBox h2 {
    font-size: 48px;
    font-weight: 600;
    color: #fff;
}

#recruitDetailBox .accessTxt {
    margin-top: 25px;
}

#recruitDetailBox .accessTxt span {
    font-size: 24px;
    color: #fff;
    padding-left: 25px;
    position: relative;
}

#recruitDetailBox .accessTxt span::before {
    content: "";
    display: inline-block;
    background-image: url("./images/recruit_icon_pin_white.png");
    background-repeat: no-repeat;
    width: 17px;
    height: 26px;
    background-size: contain;
    position: absolute;
    left: 0px;
}

#recruitDetailBox .topBox .jobTxt {
    border: 1px solid #fff;
    color: #fff;
    width: 100px;
    text-align: center;
    padding: 7px 0;
    margin-top: 20px;
}

#recruitDetailBox .mainInner {
    max-width: 1140px;
    width: 96%;
    margin: 110px auto 140px;
    display: flex;
    justify-content: space-between;

}

#recruitDetailBox .mainInner .lBox {
    max-width: 780px;
    width: 80%;
}

#recruitDetailBox .mainInner .lBox h3 {
    font-size: 30px;
    font-weight: bold;
    color: #1A1A1A;
    border-left: 6px solid #005AB0;
    margin-top: 80px;
    padding-left: 10px;
}

#recruitDetailBox .mainInner .lBox h3.top {
    margin-top: 0px;
}

#recruitDetailBox .mainInner .lBox p {
    color: #1A1A1A;
    font-size: 22px;
    line-height: 1.5;
    font-weight: Medium;
    margin-top: 10px;
}

#recruitDetailBox .mainInner .lBox a {
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    width: 300px;
    background: #005AB0;
    display: block;
    text-align: center;
    margin: 115px auto 0;
    padding: 28px;
    border-radius: 15px;
}

#recruitDetailBox .mainInner .lBox a:hover {
    opacity: 0.8;
}

#recruitDetailBox .mainInner .RBox {
    max-width: 300px;
    min-width: 300px;
    width: 20%;
}

#recruitDetailBox .mainInner .RBox .btnjob {
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    max-width: 300px;
    width: 100%;
    background: #005AB0;
    display: block;
    text-align: center;
    padding: 28px 0;
    border-radius: 15px;
}

#recruitDetailBox .mainInner .RBox .btnjob:hover {
    opacity: 0.8;
}

#recruitDetailBox .mainInner .RBox .box ul {
    max-width: 300px;
    width: 100%;
    background: #E5E5E5;
    border-radius: 15px;
    margin-top: 50px;
    padding: 30px 20px;
}

#recruitDetailBox .mainInner .RBox .box1 li {
    margin-top: 10px;
    font-size: 16px;
    line-height: 1.5;
}

#recruitDetailBox .mainInner .RBox .box1 img {
    max-width: 130px;
    width: 100%;
}

#recruitDetailBox .mainInner .RBox .box1 .company {
    font-size: 16px;
}

#recruitDetailBox .mainInner .RBox .box1 li.ttl {
    margin-top: 30px;
    font-weight: bold;
    color: #005AB0;
}

#recruitDetailBox .mainInner .RBox .box2 li {
    padding-bottom: 20px;
    border-bottom: 1px solid #fff;
    margin-top: 20px;
}

#recruitDetailBox .mainInner .RBox .box2 li a:hover {
    opacity: 0.8;
}

#recruitDetailBox .mainInner .RBox .box2 li.linkBox {
    border: none;
}

#recruitDetailBox .mainInner .RBox .box2 li.linkBox a {
    border: none;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    max-width: 200px;
    width: 100%;
    background: #005AB0;
    display: block;
    text-align: center;
    padding: 17px 0;
    border-radius: 10px;
    margin: 28px auto -20px;
}

#recruitDetailBox .mainInner .RBox .box2 .jobinfoBox {
    width: 93%;
    position: relative;
}

#recruitDetailBox .mainInner .RBox .box2 .jobinfoBox .jobNmae {
    color: #1A1A1A;
    font-size: 15px;
    font-weight: bold;
}

#recruitDetailBox .mainInner .RBox .box2 .jobinfoBox .point {
    color: #1A1A1A;
    font-size: 14px;
    padding-left: 20px;
    margin-top: 8px;
    line-height: 1.3;
}

#recruitDetailBox .mainInner .RBox .box2 .jobTxt {
    color: #1A1A1A;
    font-size: 12px;
    margin-top: 20px;
}

#recruitDetailBox .mainInner .RBox .box2 .jobinfoBox .point::before {
    content: "";
    display: inline-block;
    background-image: url("./images/recruitdetail_icon_black.png");
    background-repeat: no-repeat;
    width: 13px;
    height: 20px;
    background-size: contain;
    position: absolute;
    left: 0px;
}

#recruitDetailBox .mainInner .RBox .box2 .jobinfoBox::after {
    content: "";
    display: inline-block;
    background-image: url("./images/recruitdetail_icon_arrow.png");
    background-repeat: no-repeat;
    width: 10px;
    height: 20px;
    background-size: contain;
    position: absolute;
    right: -7%;
    top: 50%;
    transform: translate(-50%, -50%);
}

@media (min-width: 821px) and (max-width: 1174px) {
    #recruitBox .topBox .imgElm img {
        width: calc(300px + (280 * ((100vw - 821px) / 354)));
        height: auto;
    }

    #recruitBox .topBox .subTxt {
        font-size: calc(34px + (16 * ((100vw - 821px) / 354)));
    }
}

@media only screen and (max-width:820px) {
    #recruitBox .topBox {
        background-size: auto 680px;
        background-position: top center;
        height: auto;
    }

    #recruitBox .topBoxInner,
    #recruitBox .messageInner,
    #recruitBox .interviewInner,
    #recruitBox .cultureInner,
    #recruitBox .recruitListInner,
    #recruitBox .txtBox {
        width: 92%;
    }

    #recruitBox .topBox .topElm {
        width: 100%;
    }

    #recruitBox .topBox .subTxt {
        font-size: 40px;
        margin-top: 60px;
    }

    #recruitBox .cultureInner {
        padding: 100px 0;
    }

    #recruitBox .cultureBox h3 {
        font-size: 35px;
    }

    #recruitBox .cultureBox p {
        font-size: 17px;
        margin-top: 30px;
    }

    #recruitBox .messageBox {
        margin-top: 180px;
    }

    #recruitBox .interviewBox {
        margin-top: 180px;
    }

    #recruitBox .interviewBox ul li .name {
        font-size: 20px;
    }

    #recruitBox .recruitListBox {
        margin-top: 100px;
        margin-bottom: 130px;
    }

    #recruitBox .recruitListBox .recruitElm .titleTxt {
        font-size: 18px;
    }

    #recruitBox .interviewBox ul li {
        margin-top: 30px;
    }

    #recruitBox .interviewBox ul li .company {
        font-size: 14px;
    }

    #recruitBox .interviewBox ul li .job {
        font-size: 14px;
        margin-top: 10px;
    }

    #recruitBox .interviewBox ul li .profileElm::after {
        width: 23px;
        height: 23px;
        right: -4%;
    }

    #recruitBox .cultureBox {
        margin-top: 190px;
    }

    #recruitBox .recruitListBox .recruitElm li a::after {
        right: -2%;
    }

    #recruitBox .recruitListBox .recruitElm {
        margin-top: 40px;
    }
}

@media only screen and (max-width:768px) {
    #recruitBox .topBox {
        background-size: 100% 230px;
    }

    #recruitBox .topBoxInner {
        padding-top: 0px;
        width: 100%;
    }

    #recruitBox .topBox h2 {
        font-size: 20px;
        position: relative;
        bottom: 75px;
        width: 92%;
        margin: 0 auto;
    }

    #recruitBox .topBox {
        position: relative;
        width: 100%;
        height: auto;
        display: block;
        margin-top: 70px;
        background: none;
    }

    #recruitBox .topBox .topElm .bg {
        display: block;
        width: 100%;
    }

    #recruitBox .topBox .topElm img.tablet {
        margin-top: -50px;
    }

    #recruitBox .topBox .subTxt {
        font-size: 24px;
        width: 92%;
        margin: 60px auto 0;
    }

    #recruitBox .topBox img {
        width: 86%;
        margin: 0 auto;
    }

    #recruitBox .txtBox {
        margin-top: 30px;
    }

    #recruitBox .txtBox p {
        font-size: 12px;
        line-height: 2;
    }

    #recruitBox .messageInner {
        display: block;
    }

    #recruitBox .galleryBox {
        margin-top: 90px;
    }

    #recruitBox .galleryBox ul {
        height: 560px;
    }

    #recruitBox .messageBox {
        margin-top: 100px;
    }

    #recruitBox .messageBox .txtElm {
        width: 100%;
    }

    #recruitBox .messageBox .txtElm img {
        margin-top: 40px;
    }

    #recruitBox .messageBox h3 {
        font-size: 24px;
    }

    #recruitBox .messageBox .subTxt {
        font-size: 13px;
        margin-top: 28px;
    }

    #recruitBox .messageBox .subTxt br {
        display: none;
    }

    #recruitBox .messageBox .imgElm {
        display: none;
    }

    #recruitBox .messageBox a {
        width: 140px;
        font-size: 12px;
        margin: 35px 0 0 auto;
    }

    #recruitBox .interviewBox {
        margin-top: 100px;
    }

    #recruitBox .interviewBox h3 {
        font-size: 24px;
    }

    #recruitBox .interviewBox ul {
        margin-top: 30px;
    }

    #recruitBox .interviewBox ul li {
        width: 48.5%;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    #recruitBox .interviewBox ul li .name {
        font-size: 12px;
    }

    #recruitBox .interviewBox ul li .company {
        font-size: 8px;
    }

    #recruitBox .interviewBox ul li .job {
        font-size: 8px;
        margin-top: 4px;
    }

    #recruitBox .interviewBox ul li .profileElm {
        padding: 10px;

    }

    #recruitBox .interviewBox ul li .profileElm::after {
        width: 13px;
        height: 16px;
        right: -2%;
    }

    #recruitBox .cultureBox {
        margin-top: 60px;
    }

    #recruitBox .cultureInner {
        padding: 65px 0;
    }

    #recruitBox .cultureBox h3 {
        font-size: 20px;
        font-weight: 700;
    }

    #recruitBox .cultureBox p {
        font-size: 12px;
        line-height: 2;
    }

    #recruitBox .recruitListBox {
        margin-top: 55px;
        margin-bottom: 100px;
    }

    #recruitBox .recruitListBox h3 {
        font-size: 20px;
    }

    #recruitBox .recruitListBox .workcat {
        margin-top: 20px;
    }

    #recruitBox .recruitListBox .workcat a {
        font-size: 12px;
    }

    #recruitBox .recruitListBox .workcat li:before {
        font-size: 12px;
    }

    #recruitBox .recruitListBox .recruitElm {
        margin-top: 0px;
    }

    #recruitBox .recruitListBox .recruitElm .halfElm {
        height: auto;
    }

    #recruitBox .recruitListBox .recruitElm .titleTxt {
        font-size: 12px;
    }

    #recruitBox .recruitListBox .recruitElm li {
        margin-top: 15px;
    }

    #recruitBox .recruitListBox .recruitElm li a {
        padding: 28px 10px;
    }

    #recruitBox .recruitListBox .recruitElm li a::after {
        right: 1%;
        width: 7px;
        height: 14px;
    }

    #recruitBox .recruitListBox .recruitElm .accessTxt span {
        font-size: 9px;
        padding-left: 17px;
    }

    #recruitBox .recruitListBox .recruitElm .accessTxt span::before {
        width: 9px;
        height: 14px;
    }

    #recruitBox .recruitListBox .recruitElm .fullElm {
        height: auto;
    }

    /*詳細*/
    #recruitDetailBox .mainInner {
        display: block;
        width: 92%;
        margin: 20px auto 70px;
    }

    #recruitDetailBox .topBoxInner {
        width: 92%;
        padding-bottom: 20px;
    }

    #recruitDetailBox .topBox {
        height: 230px;
    }

    #recruitDetailBox h2 {
        font-size: 20px;
    }

    #recruitDetailBox .accessTxt {
        margin-top: 10px;
    }

    #recruitDetailBox .accessTxt span {
        font-size: 8px;
    }

    #recruitDetailBox .accessTxt span::before {
        width: 17px;
        height: 18px;
    }

    #recruitDetailBox .topBox .jobTxt {
        padding: 7px 0;
        margin-top: 13px;
        font-size: 10px;
    }

    #recruitDetailBox .mainInner .RBox .btnjob {
        display: none;
    }

    #recruitDetailBox .workBox {
        margin: 0 auto;
    }

    #recruitDetailBox .btnjob {
        color: #fff;
        font-size: 17px;
        font-weight: bold;
        width: 100%;
        background: #005AB0;
        display: block;
        text-align: center;
        padding: 25px 0;
        border-radius: 15px;
    }

    #recruitDetailBox .joblist {
        width: 100%;
        background: #E5E5E5;
        border-radius: 15px;
        margin-top: 25px;
        padding: 15px 20px;
    }

    #recruitDetailBox .mainInner .lBox {
        width: 100%;
        margin-top: 40px;
    }

    #recruitDetailBox .joblist .com {
        display: flex;
        align-items: center;
    }

    #recruitDetailBox .joblist .com .company {
        width: 70%;
    }

    #recruitDetailBox .joblist .com .img {
        width: 30%;
        text-align: right;
    }

    #recruitDetailBox .joblist .com .img img {
        max-width: 80px;
    }

    #recruitDetailBox .joblist .elm {
        display: flex;
        margin-top: 15px;
    }

    #recruitDetailBox .joblist .elm .g1 {
        font-weight: bold;
        color: #005AB0;
        width: 150px;
    }

    #recruitDetailBox .joblist .elm .g2 {
        line-height: 1.5;
    }

    #recruitDetailBox .mainInner .lBox h3 {
        font-size: 20px;
        margin-top: 40px;
    }

    #recruitDetailBox .mainInner .lBox p {
        font-size: 13px;
    }

    #recruitDetailBox .mainInner .lBox a {
        width: 100%;
        padding: 24px 0;
        margin-top: 40px;
    }

    #recruitDetailBox .mainInner .RBox {
        max-width: 100%;
        min-width: 100%;
        width: 100%;
    }

    #recruitDetailBox .mainInner .RBox .box ul.box2 {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        max-width: 100%;
        background: none;
        border-radius: initial;
        padding: 0px;
        margin-top: 25px;
    }

    #recruitDetailBox .mainInner .RBox .box2 li {
        width: 48%;
        background: #E5E5E5;
        border-radius: 15px;
        padding: 13px;
    }

    #recruitDetailBox .mainInner .RBox .box2 .jobinfoBox::after {
        width: 7px;
        height: 10px;
        right: -12%;
    }

    #recruitDetailBox .mainInner .RBox .box2 .jobTxt {
        display: none;
    }

    #recruitDetailBox .mainInner .RBox .box2 li.linkBox {
        display: none;
    }

    #recruitDetailBox .mainInner .RBox .box2 .jobinfoBox .point {
        font-size: 10px;
        padding-left: 15px;
    }

    #recruitDetailBox .mainInner .RBox .box2 .jobinfoBox .point::before {
        width: 13px;
        height: 14px;
    }

    #recruitDetailBox .mainInner .RBox .box2 .jobinfoBox .jobNmae {
        font-size: 12px;
    }
}

/*news*/
#newsDetailBox {
    background: #fff;
}

.newsDetail {
    padding-top: 80px;
    padding-bottom: 70px;
    border-bottom: 2px solid #005ba8;
}

#newsDetailBox menu {
    height: auto;
    background: rgb(256 256 256 / 50%);
    background: #F1F1F1;
}

#newsDetailBox menu div ul li a {
    color: #1A1A1A;
}

#newsDetailBox menu div ul li a.ani_1::before {
    background: #1A1A1A;
}

#newsDetailBox menu div ul li:last-child a {
    color: #fff;
}

#newsDetailBox menu div ul li:last-child a:hover {
    color: #007aff;
}

#newsDetailBox .newsDetailInner,
#newsDetailBox .contentsInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

#newsDetailBox .newsDetail .titleBox .cat {
    font-size: 12px;
    color: #fff;
    background: #005AAE;
    width: 120px;
    text-align: center;
    padding: 5px 0;
}

#newsDetailBox .newsDetail .titleBox .day {
    font-size: 16px;
    color: #1A1A1A;
    font-weight: 600;
    margin-top: 5px;
}

#newsDetailBox .newsDetail .titleBox h3 {
    font-size: 36px;
    font-weight: 600;
    margin-top: 30px;
    line-height: 1.5;
}

#newsDetailBox .newsDetail .titleBox .subTxt {
    font-size: 16px;
    margin-top: 15px;
}

#newsDetailBox .newsDetail .titleBox a {
    font-size: 16px;
    color: #1A1A1A;
    margin-top: 15px;
    display: inline-block;
}

#newsDetailBox .newsDetail .titleBox a:hover {
    opacity: 0.8;
}

#newsDetailBox .contentsElm p {
    margin-top: 15px;
    line-height: 1.5;
}

#newsDetailBox .contentsElm h3 {
    margin-top: 15px;
    line-height: 1.5;
    font-size: 18px;
    font-weight: 600;
}

#newsDetailBox .contentsElm p.txt,
#newsDetailBox .contentsElm p.imgElm {
    margin-top: 25px;
    line-height: 1.5;
}

#newsDetailBox .contentsElm h4 {
    margin-top: 25px;
    line-height: 1.5;
    font-weight: 600;
}

#newsDetailBox .contentsElm p.Rtxt {
    margin-top: 5px;
    text-align: right;
}

#newsDetailBox .contentsElm ul {
    margin-top: 15px;
}

#newsDetailBox .contentsElm ul li {
    display: flex;
}

#newsDetailBox .contentsElm ul li .ttl {
    width: 75px;
    border-right: 1px solid #333;
    text-align: right;
    padding-right: 15px;
}

#newsDetailBox .contentsElm ul li .ctxt {
    padding-left: 15px;
}

#newsDetailBox .contentsElm ul li p {
    margin-top: 0px;
}

#newsDetailBox .contentsElm a {
    color: #333;
    padding-left: 8px;
}

#newsDetailBox .block {
    display: flex;
    justify-content: space-between;
}

#newsDetailBox .block .imgBox {
    width: 50%;
}

#newsDetailBox .block .imgBox p {
    text-align: center;
}

#newsDetailBox .block .txeBox {
    width: 50%;
}

#newsDetailBox .block .txeBox .t_ttl {
    width: 10%;
    border: dotted 1px #333;
    padding: 5px;
    line-height: 1.4;
}

#newsDetailBox .block .txeBox .t_txt {
    border: dotted 1px #333;
    padding: 5px;
    line-height: 1.4;
}

#newsDetailBox .frame {
    border: 1px solid #333;
    padding: 3px;
}

#newsDetailBox .wpcf7 {
    width: 500px;
    margin: 20px auto 0;
}

#newsDetailBox .wpcf7 h2 {
    text-align: center;
    font-size: 18px;
}

#newsDetailBox .wpcf7 .txt {
    text-align: center;
    font-size: 13px;
    margin-top: 20px;
    line-height: 1.5;
}

#newsDetailBox .wpcf7 label {
    margin-top: 10px;
    display: inline-block;
    width: 100%;
}

#newsDetailBox .wpcf7 span {
    margin-top: 5px;
    display: block;
}

#newsDetailBox .wpcf7 input {
    height: 23px;
    width: 100%;
}

#newsDetailBox .wpcf7 textarea {
    width: 100%;
}

#newsDetailBox .wpcf7 .wpcf7-submit {
    max-width: 240px;
    margin: 10px auto;
    display: block;
    padding: 10px;
    border-radius: 24px;
    background: #0071BC;
    border: none;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    height: auto;
    cursor: pointer;
}

#newsDetailBox .wpcf7 .wpcf7-submit:hover {
    opacity: 0.8;
}

#newsDetailBox .wpcf7 form .wpcf7-response-output {
    margin: auto;
}

@media screen and (max-width: 820px) {
    #newsDetailBox menu {
        transform: translate(0%, -0%);
    }
}

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

    #newsDetailBox .newsDetailInner,
    #newsDetailBox .contentsInner {
        width: 92%;
    }

    #newsDetailBox .newsDetail .titleBox h3 {
        font-size: 26px;
    }
}

/*interviewBox*/
#interviewBox {
    background: #F1F1F1;
}

#interviewBox menu {
    background: rgb(241 241 241 / 50%);
    background: #F1F1F1;
}

#interviewBox menu div ul li a {
    color: #1A1A1A;
}

#interviewBox menu div ul li a.ani_1::before {
    background: #1A1A1A;
}

#interviewBox menu div ul li:last-child a {
    color: #fff;
}

#interviewBox menu div ul li:last-child a:hover {
    color: #007aff;
}

.interviewTop {
    padding-top: 260px;
}

#interviewBox .interviewTopInner,
#interviewBox .moveBoxInner,
#interviewBox .contentsBoxInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

.interviewTop .in {
    font-size: 36px;
    color: #005AAE;
    font-weight: 600;
}

.interviewTop .titleBox {
    display: flex;

}

.interviewTop .titleBox .txtBox {
    width: 50%;
    position: relative;
}

.interviewTop .titleBox .txtBox h2 {
    font-size: 40px;
    font-weight: 600;
    width: 120%;
    margin-top: 50px;
    line-height: 1.3;
}

#kato .interviewTop .titleBox .txtBox h2 {
    width: 100%;
}

.interviewTop .titleBox .txtBox h2.ttl2 {
    font-size: 36px;
    text-shadow: 0px 0px 10px #fff;
}

.interviewTop .titleBox .txtBox .name {
    font-size: 30px;
    margin-top: 20px;
}

.interviewTop .titleBox .txtBox .post {
    font-size: 16px;
    margin-top: 16px;
    line-height: 1.5;
}

.interviewTop .titleBox .imgBox {
    width: 65%;
}

.interviewTop .titleBox .imgBox img {
    width: 700px;
}

#kato .interviewTop .titleBox .imgBox img {
    width: 100%;
}

#interviewBox .moveBox {
    margin-top: 95px;
}

#interviewBox .moveBoxInner {
    padding: 40px;
    height: 480px;
    display: flex;
    justify-content: space-between;
    background: #fff;
}

#interviewBox .moveBoxInner .moveElm {
    width: 70%;
    position: relative;
}

#interviewBox .moveBoxInner .moveElm video {
    width: 100%;
}

#interviewBox .moveBoxInner .moveElm #playBtn {
    position: absolute;
    top: 50%;
    left: 75%;
    transform: translate(-50%, -50%);
    width: 80px;
}

#interviewBox .moveBoxInner .txtElm {
    width: 30%;
    padding-left: 3%;
}

#interviewBox .moveBoxInner .txtElm h3 {
    font-size: 60px;
    line-height: 1.2;
    font-weight: normal;
    color: #005AAE;
    overflow-wrap: break-word;
}

#interviewBox .moveBoxInner .txtElm p {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.2;
    color: #1A1A1A;
    margin-top: 20px;
}

#interviewBox .contentsBox {
    margin-top: 100px;
}

#interviewBox .contentsBox p {
    font-size: 18px;
    line-height: 1.5;
}

#interviewBox .contentsBox .half {
    display: flex;
    justify-content: space-between;
}

#interviewBox .contentsBox .half .l_Box1,
#interviewBox .contentsBox .half .r_Box1 {
    max-width: 550px;
    width: 49%;
}

#interviewBox .contentsBox .half .l_Box2 {
    width: 42%;
}

#interviewBox .contentsBox .half .r_Box2 {
    width: 53%;
}

#interviewBox .contentsBox .half {}

#interviewBox .contentsBox .q1 {
    margin-top: 60px;
}

#interviewBox .contentsBox .q2,
#interviewBox .contentsBox .q3,
#interviewBox .contentsBox .q4,
#interviewBox .contentsBox .q5 {
    margin-top: 100px;
}

#interviewBox .contentsBox .mt30 {
    margin-top: 30px;
}

#interviewBox .contentsBox .mt50 {
    margin-top: 50px;
}

#interviewBox .contentsBox h3 {
    font-size: 27px;
    font-weight: 600;
    line-height: 1.4;
    color: #1A1A1A;
}

#interviewBox .contentsBox h4 {
    font-size: 24px;
    color: #005AAE;
    border-bottom: 2px solid #005AAE;
    padding-bottom: 7px;
}

#interviewBox .contentsBox .txt {
    font-size: 18px;
}

#interviewBox .contentsBox .txt_r {
    text-align: right;
}

#interviewBox .memberBoxInner {
    max-width: 1200px;
    width: 96%;
    margin: 0 auto;
}

#interviewBox .memberBox {
    margin-top: 250px;
    margin-bottom: 130px;
}

#interviewBox .memberBoxInner ul li {
    width: 32%;
    max-width: 350px;
}

#interviewBox .memberBoxInner ul li .profileElm {
    background: #005AAE;
    padding: 20px;
    width: 100%;
    position: relative;
}

#interviewBox .memberBoxInner ul li .name {
    font-size: 24px;
    color: #fff;
}

#interviewBox .memberBoxInner ul li .company {
    color: #fff;
    font-size: 16px;
    margin-top: 10px;
    width: 95%;
    line-height: 1.4;
}

#interviewBox .memberBoxInner ul li .job {
    color: #fff;
    font-size: 16px;
    margin-top: 8px;
}

#interviewBox .memberBoxInner ul li .profileElm::after {
    content: "";
    display: inline-block;
    background-image: url(./images/recruit_icon_arrow.png);
    background-repeat: no-repeat;
    width: 15px;
    height: 30px;
    background-size: contain;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translate(-50%, -50%);
}

#interviewBox .memberBoxInner .swiper-button-next,
#interviewBox .memberBoxInner .swiper-button-prev {
    width: 60px;
    height: 60px;
}

#interviewBox .memberBoxInner .swiper-button-next:after {
    content: "";
    display: inline-block;
    background-image: url(./images/int_right.png);
    width: 60px;
    height: 60px;
    background-size: cover;
    position: absolute;
    right: 10%;
    top: 50%;
    transform: translate(0%, -50%);
}

#interviewBox .memberBoxInner .swiper-button-next:hover:after {
    opacity: 0.8;
}

#interviewBox .memberBoxInner .swiper-button-prev:after {
    content: "";
    display: inline-block;
    background-image: url(./images/int_left.png);
    width: 60px;
    height: 60px;
    background-size: cover;
    position: absolute;
    left: 10%;
    top: 50%;
    transform: translate(0%, -50%);
}

#interviewBox .memberBoxInner .swiper-button-prev:hover:after {
    opacity: 0.8;
}

@media screen and (max-width: 820px) {
    #newsDetailBox menu {
        transform: translate(0%, -0%);
    }

    .interviewTop .titleBox {
        margin-top: 20px;
        flex-wrap: wrap;
    }

    .interviewTop .titleBox .txtBox {
        width: 100%;
        order: 2;
    }

    .interviewTop .titleBox .imgBox {
        width: 100%;
        order: 1;
    }

    .interviewTop .titleBox .imgBox img {
        width: 100%;
    }

    .interviewTop .titleBox .txtBox h2 {
        margin-top: 25px;
        width: 100%;
        font-size: 20px;
    }

    .interviewTop .titleBox .txtBox h2.ttl2 {
        font-size: 20px;
    }

    #interviewBox .moveBoxInner {
        display: block;
        height: auto;
    }

    #interviewBox .moveBoxInner .moveElm {
        width: 100%;
    }

    #interviewBox .moveBoxInner .txtElm {
        width: 100%;
        padding-left: 0%;
    }

    #interviewBox .moveBoxInner .txtElm {
        display: flex;
        justify-content: space-between;
    }

    #interviewBox .moveBoxInner .txtElm p {}

    #interviewBox .contentsBox .q1 {}

    #interviewBox .contentsBox .q2,
    #interviewBox .contentsBox .q3,
    #interviewBox .contentsBox .q4,
    #interviewBox .contentsBox .q5 {
        margin-top: 50px;
    }

    #interviewBox .contentsBox .q1 h3,
    #interviewBox .contentsBox .q4 h3 {
        margin-top: 30px;
    }

    #interviewBox .contentsBox .q2 img {
        margin-top: 30px;
    }

    #interviewBox .contentsBox .half {
        display: block;
    }

    #interviewBox .contentsBox .half .l_Box2,
    #interviewBox .contentsBox .half .r_Box2,
    #interviewBox .contentsBox .half .l_Box1,
    #interviewBox .contentsBox .half .r_Box1 {
        width: 100%;
    }

    #interviewBox .contentsBox .txt_r {
        text-align: left;
    }
}

@media screen and (max-width: 768px) {
    .interviewTop {
        padding-top: 75px;
    }

    #interviewBox .interviewTopInner,
    #interviewBox .moveBoxInner,
    #interviewBox .contentsBoxInner {
        width: 92%;
    }

    #interviewBox .contentsBoxInner>.mt30 {
        margin-top: 50px;
    }

    #interviewBox .moveBoxInner {
        padding: 15px;
    }

    .interviewTop .titleBox {
        margin-top: 0px;
    }

    .interviewTop .in {
        font-size: 20px;
        margin-top: 40px;
    }

    .interviewTop .titleBox .txtBox h2 {
        font-size: 20px;
    }

    .interviewTop .titleBox .txtBox .name {
        font-size: 12px;
    }

    .interviewTop .titleBox .txtBox .post {
        font-size: 9px;
    }

    #interviewBox .moveBox {
        margin-top: 45px;
    }

    #interviewBox .moveBoxInner .moveElm #playBtn {
        width: 40px;
    }

    #interviewBox .moveBoxInner .txtElm h3 {
        font-size: 30px;
        margin-top: 20px;
        margin-right: 10px;
    }

    #interviewBox .moveBoxInner .txtElm p {
        font-size: 20px;
    }

    #interviewBox .contentsBox {
        margin-top: 50px;
    }

    #interviewBox .contentsBox p {
        font-size: 12px;
    }

    #interviewBox .contentsBox h4 {
        font-size: 12px;
    }

    #interviewBox .contentsBox .q1 h3 {
        margin-top: 20px;
    }

    #interviewBox .contentsBox h3 {
        font-size: 16px;
        margin-top: 20px;
    }

    #interviewBox .contentsBox .txt {
        font-size: 12px;
    }

    #interviewBox .memberBoxInner ul li {
        width: 70%;
    }

    #interviewBox .memberBox {
        margin-top: 100px;
        margin-bottom: 70px;
    }


}

/*About*/
#businessBox {
    background: #000000
}

#businessBox .topBox {
    height: 480px;
    background-image: url("./images/business_top_img.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#businessBox .topBoxInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    align-items: end;
    height: 100%;
}

#businessBox .topBoxInner img {
    display: none;
}

#businessBox video {
    width: 100%;
}

#businessBox h2 {
    font-weight: 100;
    color: #fff;
}

#businessBox .topBox h2 {
    font-size: 48px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 65px;
}

#businessBox p {
    color: #fff;
}

#businessBox .contentsInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto 200px;
}

#businessBox .move1 {
    width: 100%;
    margin-top: 100px;
}

#businessBox .move3 {
    width: 100%;
    margin-top: 100px;
}

#businessBox .top_move {
    position: relative;
}

#businessBox #play1 {
    position: absolute;
    width: 184px;
    bottom: 50px;
    right: 50px;
    cursor: pointer
}

#businessBox #play1:hover {
    opacity: 0.8;
}

#businessBox #play3 {
    position: absolute;
    width: 184px;
    bottom: 50px;
    right: 50px;
    cursor: pointer
}

#businessBox #play3:hover {
    opacity: 0.8;
}

.DebrisBox1 .rBox {
    background-image: url("./images/bg_grid.png");
    background-size: contain;
    background-size: 705px 596px;
    background-position: left top;
    border-left: 1px solid #fff;
}

#businessBox .SpacegomiBox {
    background-image: url("./images/bg_grid.png");
    background-size: contain;
    background-size: 705px 596px;
    background-position: left top;
}

#businessBox .businessList {
    display: flex;
    justify-content: center;
    gap: 100px;
}

#businessBox .businessList li {
    max-width: 350px;
    border: 1px solid #fff;
    width: 50%;
    margin-top: 130px;
}

#businessBox .businessList li a {
    text-align: center;
}

#businessBox .businessList li i {
    position: absolute;
    top: -4px;
    left: -4px;
    width: 10px;
}

.business-card {
    width: 300px;
    height: 165px;
    background-color: #000;
    color: #fff;
    position: relative;
    padding: 30px 0 20px;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}

.business-card::after {
    bottom: -16px;
    right: -16px;
    transform: rotate(45deg);
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: #000;
    border-left: 1px solid #fff;
}

.business-card::before {
    top: -16px;
    left: -16px;
    transform: rotate(45deg);
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: #000000;
    border-right: 1px solid;
}

#businessBox .business-card .ttl {
    font-size: 24px;
    margin-top: 26px;
}

#businessBox .business-card .subTtl {
    margin-top: 12px;

}

#businessBox .business-card .suTxt span,
#businessBox .business-card .suTxt2 span {
    color: #fff;
    position: relative;
    padding-right: 25px;
}

#businessBox .business-card .suTxt span::after,
#businessBox .business-card .suTxt2 span::after {
    content: '01';
    background: #005AAE;
    width: 20px;
    height: 20px;
    display: block;
    margin: 0 auto;
    position: absolute;
    right: 0px;
    top: -2px;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    font-weight: 200;
    font-family: "Open Sans", sans-serif;
}

#businessBox .business-card .suTxt2 span::after {
    content: '02';
}

#businessBox .business-card a img {
    width: 18px;
    margin: 7px auto;
    display: block;
}

#businessBox .business-number {
    font-size: 14px;
    font-weight: bold;
    color: #00a0e9;
    margin-bottom: 5px;
}

#businessBox .business-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 5px;
}

#businessBox .business-subtitle {
    font-size: 14px;
}

#businessBox .arrow-down {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
}

#SpaceDebris1 {
    margin-top: 155px;
    border: 1px solid #fff;
    position: relative;
}

#businessBox p,
#businessBox h2,
#businessBox h3 {
    font-weight: 100;
}

#SpaceDebris1::before {
    top: -16px;
    left: -16px;
    transform: rotate(45deg);
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: #000000;
    border-right: 1px solid #fff;
}

#SpaceDebris1 i {
    position: absolute;
    top: -4px;
    left: -4px;
    width: 10px;
}

#SpaceDebris1 .ttlBox {
    display: flex;
    justify-content: center;
    position: relative;
    align-items: center;
    padding: 50px 0;
    border-bottom: 1px solid #fff;
}

#SpaceDebris1 .tB1 {
    text-align: center;
    margin-right: 90px;
}

#SpaceDebris1 .tB1 .number_ttl {
    font-size: 14px;
}

#SpaceDebris1 .tB1 .number {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background: #005AB0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    font-size: 24px;
    font-weight: 200;
}

#SpaceDebris1 .tB2 {}

#SpaceDebris1 .tB2 h2 {
    font-size: 33px;
}

#SpaceDebris1 .tB2 p {
    text-align: center;
    margin-top: 5px;
    font-size: 14px;
}

#SpaceDebris1 .ttlBox .logo {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 45px;
    height: 45px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

#SpaceDebris1 .ttlBox .logo img {
    max-width: 30px;
}

#SpaceDebris1 .DebrisBox1 {
    display: flex;
}

#SpaceDebris1 .DebrisBox1 .lBox {
    width: 38%;
    padding: 40px 31px;
}

#SpaceDebris1 .DebrisBox1 .lBox p {
    font-size: 16px;
    line-height: 2;
}

#SpaceDebris1 .DebrisBox1 .rBox {
    width: 62.5%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 100px 60px 55px;
}

#SpaceDebris1 .DebrisBox2 {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    padding: 15px 0;
    text-align: center;
}

#SpaceDebris1 .DebrisBox2 h3 {
    font-size: 22px;
    color: #fff;
    font-weight: 100;
}

#SpaceDebris1 .DebrisBox3 {
    display: flex;
}

#SpaceDebris1 .DebrisBox3 div {
    padding: 92px 12.3%;
}

#SpaceDebris1 .DebrisBox3 div p {
    font-size: 16px;
    line-height: 2;
}

#SpaceDebris1 .DebrisBox4 {
    border-top: 1px solid #fff;
}

#SpaceDebris1 .DebrisBox4 .ttlBox {
    padding: 15px 0;
    text-align: center;
}

#SpaceDebris1 .DebrisBox4 .ttlBox h3 {
    color: #fff;
    font-size: 22px;
}

#SpaceDebris1 .DebrisBox4 ul {
    display: flex;
    align-items: center;
    text-align: center;
}

#SpaceDebris1 .DebrisBox4 ul li {
    width: 33.33%;
    padding: 61.5px 0;
    border-right: 1px solid #fff;
}

#SpaceDebris1 .DebrisBox4 ul li:last-child {
    border: none;
}

#SpaceDebris1 .DebrisBox4 ul li .pointNumber {
    font-size: 13px;
    color: #005AB0;
}

#SpaceDebris1 .DebrisBox4 ul li .pointTitle {
    font-size: 23px;
    margin-top: 10px;
}

#SpaceDebris1 .DebrisBox4 ul li .pointTitle::after {
    content: '';
    border-bottom: 1px solid #fff;
    width: 75%;
    display: block;
    margin: 0 auto;
    margin-top: 10px;
}

#SpaceDebris1 .DebrisBox4 ul li .pointDescription {
    line-height: 1.5;
    font-size: 16px;
    margin-top: 30px;
}

#SpaceDebris2 {
    border: 1px solid #fff;
    margin-top: 30px;
}

#SpaceDebris2 .Spacegomi1 {
    display: flex;
    position: relative;
}

#SpaceDebris2 .Spacegomi1 p {
    width: 10%;
    text-align: center;
    padding: 15px 0;
    border-right: 1px solid #fff;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#SpaceDebris2 .Spacegomi1 h3 {
    width: 80%;
    color: #fff;
    padding: 15px 0;
    text-align: center;
    font-size: 22px;
}

#SpaceDebris2 .Spacegomi1 #kaihei {
    position: absolute;
    cursor: pointer;
    width: 21px;
    height: 21px;
    right: 3%;
    top: 50%;
    transform: translate(0%, -50%);
}

#SpaceDebris2 .Spacegomi1 #kaihei img {
    transition: transform 0.3s ease;
}

#SpaceDebris2 .Spacegomi1 #kaihei img.rotate {
    transform: rotate(180deg);
}

#SpaceDebris2 .SpacegomiElm1 {
    border-top: 1px solid #fff;
    padding: 75px 2% 0;
}

#SpaceDebris2 .SpacegomiElm1 .ttlBox .spaceDebrisTitle {
    text-align: center;
    font-size: 22px;
    color: #fff;
}

#SpaceDebris2 .SpacegomiElm1 .ttlBox .spaceDebrisTitle::after {
    content: '';
    border-bottom: 1px solid #fff;
    width: 260px;
    display: block;
    margin: 0 auto;
    margin-top: 15px;
}

#SpaceDebris2 .SpacegomiElm1 .ttlBox .dataYear {
    text-align: center;
    font-size: 12px;
    margin-top: 15px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList {
    display: flex;
    max-width: 800px;
    margin: 20px auto 80px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li {
    width: 33.33%;
    margin-top: 25px;
    display: inline-flex;
    flex-wrap: wrap;
    align-items: end;
    margin-right: 50px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li:last-child {
    margin-right: 0px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .imageWrapper {
    width: 100%;
    text-align: center;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li.item1 img {
    max-width: 160px;
    width: 100%;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li.item2 img {
    width: 115px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li.item3 img {
    width: 95px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount {
    margin-top: 30px;
    text-align: center;
    width: 100%;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t1 {
    font-size: 65px;
    color: #fff;
    margin: 0 5px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t3 {
    margin-right: -8px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t2 {
    font-size: 40px;
    color: #fff;
    margin-right: 5px;
}

#SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount.en .t2 {
    font-size: 30px;
}


#SpaceDebris2 .SpacegomiElm2 ul {
    display: flex;
    margin: 20px auto 0px;
    border-top: 1px solid #fff;
}

#SpaceDebris2 .SpacegomiElm2 ul li {
    width: 33.33%;
    display: inline-flex;
    flex-wrap: wrap;
    /* align-items: end; */
    border-right: 1px solid #fff;
    padding: 40px 0 70px;
}

#SpaceDebris2 .SpacegomiElm2 ul li:last-child {
    margin-right: 0px;
    border-right: none;
}

#SpaceDebris2 .SpacegomiElm2 p {
    width: 100%;
    text-align: center;
}

#SpaceDebris2 .SpacegomiElm2 ul li .objectDescription {
    font-size: 22px;
    text-align: center;
    line-height: 1.3;
    width: 100%;
    min-height: 100px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

#SpaceDebris2 .SpacegomiElm2 ul li .objectDescription::after {
    content: '';
    border-bottom: 1px solid #fff;
    width: 75%;
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    position: absolute;
    bottom: 0px;
}

#SpaceDebris2 .SpacegomiElm2 ul li.item1 img {
    max-width: 228px;
    width: 90%;
    padding: 40px 0;
}

#SpaceDebris2 .SpacegomiElm2 ul li.item2 img {
    max-width: 257px;
    width: 90%;
    padding: 40px 0;
}

#SpaceDebris2 .SpacegomiElm2 ul li.item3 img {
    max-width: 175px;
    width: 90%;
    padding: 40px 0;
}

#SpaceDebris2 .SpacegomiElm2 ul li .objCount .t1 {
    font-size: 65px;
    color: #fff;
    margin: 0 5px;
}

#SpaceDebris2 .SpacegomiElm2 ul li .objCount .t3 {
    margin-right: -8px;
}

#SpaceDebris2 .SpacegomiElm2 .dataYear {
    margin-top: 15px;
}

#SpaceDebris2 .SpacegomiElm2 .itmeBox {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}

#SpaceDebris2 .SpacegomiElm3 {
    border-top: 1px solid #fff;
    padding-top: 60px;
    padding-bottom: 30px;
}

#SpaceDebris2 .SpacegomiElm3 ul {
    display: flex;
    justify-content: center;
}

#SpaceDebris2 .SpacegomiElm3 ul li.item1 {
    width: 50%;
    max-width: 326px;
    margin-right: 140px;
    position: relative;
}

#SpaceDebris2 .SpacegomiElm3 ul li.item1::after {
    content: "";
    display: inline-block;
    background-image: url(./images/business_arrow.png);
    background-repeat: no-repeat;
    width: 54px;
    height: 42px;
    background-size: contain;
    position: absolute;
    left: 115%;
    top: 50%;
    transform: translate(0%, -50%);
}

#SpaceDebris2 .SpacegomiElm3 ul li.item1 .img2 {
    max-width: 80px;
    width: 100%;
    margin-top: 40px;
}

#SpaceDebris2 .SpacegomiElm3 ul li.item2 {
    width: 50%;
    max-width: 425px;
}

#SpaceDebris2 .SpacegomiElm3 ul li.item2 .img1 {
    width: 326px;
    margin: 0 auto;
    text-align: center;
}

#SpaceDebris2 .SpacegomiElm3 ul li.item2 .img2 {
    margin-top: 40px;
}

#SpaceDebris2 .SpacegomiElm3 ul li .launchDescription {
    font-size: 22px;
    text-align: center;
    line-height: 1.3;
    width: 100%;
    min-height: 100px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

#SpaceDebris2 .SpacegomiElm3 ul li .launchDescription::after {
    content: '';
    border-bottom: 1px solid #fff;
    width: 75%;
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    position: absolute;
    bottom: 0px;
}

#SpaceDebris2 .SpacegomiElm3 ul li .imageWrapper {
    margin-top: 20px;
    text-align: center;
}

#SpaceDebris2 .SpacegomiElm3 ul li .launchPeriod {
    font-size: 18px;
    text-align: center;
    margin-top: 30px;
    margin-left: -15px;
}

#SpaceDebris2 .SpacegomiElm3 ul li .launchCount,
#SpaceDebris2 .SpacegomiElm3 ul li .plannedCount {
    font-size: 65px;
    text-align: center;
    margin-top: 10px;
    display: flex;
    align-items: end;
    justify-content: center;
}

#SpaceDebris2 .SpacegomiElm3 ul li:first-child .launchCount {
    font-size: 50px;
}

#SpaceDebris2 .SpacegomiElm3 ul li .launchCount span,
#SpaceDebris2 .SpacegomiElm3 ul li .plannedCount span {
    font-size: 17px;
    color: #fff;
}

#SpaceDebris2 .SpacegomiElm3 ul li .dataYear {
    font-size: 12px;
    margin-top: 20px;
    text-align: center;
}

#SpaceDebris2 .SpacegomiElm4 {
    padding: 20px 0 70px;
}

#SpaceDebris2 .SpacegomiElm4 p {
    text-align: center;
    font-size: 22px;
    line-height: 1.5;
}

#SpaceDebris3 {
    margin-top: 30px;
    border: 1px solid #fff;
}

#SpaceDebris3 .Spacegomi1 {
    display: flex;
}

#SpaceDebris3 .Spacegomi1 p {
    width: 10%;
    text-align: center;
    padding: 15px 0;
    border-right: 1px solid #fff;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#SpaceDebris3 .Spacegomi1 h3 {
    width: 80%;
    color: #fff;
    padding: 15px 0;
    text-align: center;
    font-size: 22px;
}

#SpaceDebris3 .SpacegomiElm1 {
    border-top: 1px solid #fff;
    position: relative;
}

#SpaceDebris3 .SpacegomiElm1 p.text {
    font-size: 16px;
    max-width: 570px;
    width: 100%;
    margin-left: 40px;
    line-height: 2;
    position: absolute;
    top: 40px;
}

#SpaceDebris3 .SpacegomiElm1 p.imgBox {
    margin: 33.5px auto;
    max-width: 850px;
    width: 96%;

}

#SpaceDebris3 .SpacegomiElm2 {
    padding: 40px 40px 61px;
    border-top: 1px solid #fff;
}

#SpaceDebris3 .SpacegomiElm2 .ttl {
    font-size: 22px;
}

#SpaceDebris3 .SpacegomiElm2 ul {
    display: flex;
    align-items: center;
    margin-top: 20px;
}

#SpaceDebris3 .SpacegomiElm2 ul .ingBox {
    width: 40%;
    margin-left: 10px;
}

#SpaceDebris3 .SpacegomiElm2 ul .moveBox {
    position: relative;
    width: 57%;
    margin-left: 3%;
}

#SpaceDebris3 .SpacegomiElm2 ul #play2 {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 180px;
    width: 100%;
    transform: translate(-50%, -50%)
}

#SpaceDebris4 {
    margin-top: 155px;
    border: 1px solid #fff;
    position: relative;
}

#SpaceDebris4::before {
    top: -16px;
    left: -16px;
    transform: rotate(45deg);
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: #000000;
    border-right: 1px solid #fff;
}

#SpaceDebris4 i {
    position: absolute;
    top: -4px;
    left: -4px;
    width: 10px;
}

#SpaceDebris4 .ttlBox {
    display: flex;
    justify-content: center;
    position: relative;
    align-items: center;
    padding: 50px 0;
}

#SpaceDebris4 .tB1 {
    text-align: center;
    margin-right: 90px;
}

#SpaceDebris4 .tB1 .number_ttl {
    font-size: 14px;
}

#SpaceDebris4 .tB1 .number {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background: #005AB0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    font-size: 24px;
}

#SpaceDebris4 .tB2 h2 {
    font-size: 33px;
}

#SpaceDebris4 .tB2 p {
    text-align: center;
    margin-top: 5px;
    font-size: 14px;
}

#SpaceDebris4 .ttlBox .logo {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 45px;
    height: 45px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

#SpaceDebris4 .ttlBox .logo img {
    width: 30px;
}

#SpaceDebris4 .DebrisBox1 {
    display: flex;
    border-top: 1px solid #fff;
}

#SpaceDebris4 .DebrisBox1 .lBox {
    width: 38%;
    padding: 40px 31px;
    margin: 0px 0 102px;
}

#SpaceDebris4 .DebrisBox1 .lBox p {
    font-size: 16px;
    line-height: 2;
    margin-top: 20px;
}

#SpaceDebris4 .DebrisBox1 .lBox p:first-child {
    margin-top: 0px;
}

#SpaceDebris4 .DebrisBox1 .rBox {
    width: 62.5%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 10px 8px 0px;
}

#SpaceDebris4 .DebrisBox2 {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    padding: 15px 0;
    text-align: center;
}

#SpaceDebris4 .DebrisBox2 h3 {
    font-size: 22px;
    color: #fff;
}

#SpaceDebris4 .DebrisBox3 {
    display: flex;
    justify-content: space-between;
    background-image: url(./images/bg_grid.png);
    background-size: contain;
    background-size: 705px 596px;
    background-position: left top;
}

#SpaceDebris4 .DebrisBox3 .lBox {
    width: 41%;
    padding: 40px 0 40px 3%;
}

#SpaceDebris4 .DebrisBox3 .lBox p {
    font-size: 16px;
    line-height: 2;
}

#SpaceDebris4 .DebrisBox3 .lBox ul {
    display: flex;
    margin-top: 20px;
}

#SpaceDebris4 .DebrisBox3 .lBox ul li {
    position: relative;
    color: #fff;
    margin-right: 30px;
    padding-left: 60px;
    height: 27px;
    display: inline-flex;
    align-items: center;
}

#SpaceDebris4 .DebrisBox3 .lBox ul .cat1::before {
    content: "";
    display: inline-block;
    background-image: url("./images/business_cat1.png");
    background-repeat: no-repeat;
    width: 54px;
    height: 27px;
    background-size: contain;
    position: absolute;
    left: 0px;
}

#SpaceDebris4 .DebrisBox3 .lBox ul .cat2::before {
    content: "";
    display: inline-block;
    background-image: url("./images/business_cat2.png");
    background-repeat: no-repeat;
    width: 54px;
    height: 27px;
    background-size: contain;
    position: absolute;
    left: 0px;
}

#SpaceDebris4 .DebrisBox3 .lBox ul .cat3::before {
    content: "";
    display: inline-block;
    background-image: url("./images/business_cat3.png");
    background-repeat: no-repeat;
    width: 54px;
    height: 27px;
    background-size: contain;
    position: absolute;
    left: 0px;
}

#SpaceDebris4 .DebrisBox3 .lBox .imgBox {
    margin-top: 80px;
}

#SpaceDebris4 .DebrisBox3 .rBox {
    width: 58%;
    text-align: center;
    padding: 65px 0;
}

#SpaceDebris4 .DebrisBox3 .rBox img {
    width: 90%;
}


#SpaceDebris4 .DebrisBox4 .ttlBox {
    padding: 20px 0;
    border-top: 1px solid #fff;
}

#SpaceDebris4 .DebrisBox4 h3 {
    color: #fff;
    font-size: 22px;
    font-weight: normal;
}

#SpaceDebris4 .DebrisBox4 ul {
    display: flex;
    margin: 0px auto 0px;
    border-top: 1px solid #fff;
    flex-wrap: wrap;
}

#SpaceDebris4 .DebrisBox4 ul li {
    width: 33.33%;
    display: inline-flex;
    flex-wrap: wrap;
    /*align-items: end;*/
    border-right: 1px solid #fff;
    padding: 40px 0;
    padding: 3%;
    border-bottom: 1px solid #fff;
    justify-content: center;
}

#SpaceDebris4 .DebrisBox4 ul li:nth-of-type(3n) {
    border-right: none;
}

#SpaceDebris4 .DebrisBox4 ul li:nth-of-type(4),
#SpaceDebris4 .DebrisBox4 ul li:nth-of-type(5),
#SpaceDebris4 .DebrisBox4 ul li:nth-of-type(6) {
    border-bottom: none;
}

#SpaceDebris4 .DebrisBox4 ul li .ttl {
    text-align: center;
    font-size: 24px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    line-height: 1.3;
}

#SpaceDebris4 .DebrisBox4 ul li .txt {
    font-size: 14px;
    line-height: 2;
    margin-top: 20px;
}

#SpaceDebris4 .DebrisBox4 ul li img {
    margin-top: 10px;
}

/*コンタクトフォーム*/
#contactBox {
    width: 94%;
    max-width: 500px;
    margin: 20px auto 0;
}

#contactBox h2 {
    text-align: center;
    font-size: 18px;
}

#contactBox .txt {
    text-align: center;
    font-size: 13px;
    margin-top: 20px;
    line-height: 1.5;
}

#contactBox label {
    display: block;
    margin-bottom: 15px;
}

#contactBox input[type="text"],
#contactBox input[type="email"],
#contactBox textarea {
    width: 98%;
    padding: 8px 1%;
    margin-top: 5px;
}

#contactBox select {
    width: 100%;
    padding: 8px 0;
    margin-top: 5px;
}

#contactBox .consent_txt {
    line-height: 1.5;
}

#contactBox .check {
    display: flex;
    align-items: center;
    margin: 10px 0;
}

#consent {
    margin-right: 5px;
}

#contactBox .check label {
    margin-bottom: 0px;
}

#contactBox input[type="submit"] {
    max-width: 240px;
    margin: 10px auto;
    display: block;
    padding: 10px;
    border-radius: 24px;
    background: #0071BC;
    border: none;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    height: auto;
    cursor: pointer;
    width: 100%;
}

#contactBox input[type="submit"]:hover {
    opacity: 0.8;
}

#contactBox .success,
#contactBox .error {
    padding: 10px;
    margin-bottom: 15px;
}

#contactBox .success {
    background: #d4edda;
    color: #155724;
}

#contactBox .error {
    background: #f8d7da;
    color: #721c24;
    padding: 5px;
    margin-bottom: 10px;
}

#contactBox .error-email {
    background: #f8d7da;
    color: #721c24;
    padding: 5px;
    margin-bottom: 10px;
}

#contactBox .error-char {
    background: #f8d7da;
    color: #721c24;
    padding: 5px;
    margin-bottom: 10px;
}

#contactBox .error-check {
    background: #f8d7da;
    color: #721c24;
    padding: 5px;
    margin-bottom: 10px;
}

#contactBox textarea {
    height: 100px;
}

@media (max-width: 915px) and (min-width: 769px) {
    #SpaceDebris3 .SpacegomiElm1 p.text {
        max-width: calc(470px - ((915px - 100%) * 0.8548));
    }
}

@media screen and (max-width: 768px) {
    #businessBox .contentsInner {
        margin-bottom: 100px;
    }

    #businessBox .topBox {
        height: auto;
        background: none;
        margin-top: 72px;
    }

    #businessBox .topBoxInner {
        position: relative;
        width: 100%;
        height: auto;
        display: block;
    }

    #businessBox .topBoxInner img {
        display: block;
    }

    #businessBox .topBox h2 {
        font-size: 20px;
        position: relative;
        bottom: 30px;
        width: 92%;
        margin: 0 auto;
    }

    #businessBox .move1 {
        margin-top: 0px;
    }

    #businessBox #play1 {
        right: auto;
        left: 50%;
        top: 50%;
        bottom: auto;
        transform: translate(-50%, -50%);
    }

    #businessBox .move3 {
        margin-top: 0px;
    }

    #businessBox #play3 {
        right: auto;
        left: 50%;
        top: 50%;
        bottom: auto;
        transform: translate(-50%, -50%);
    }

    #businessBox .businessList {
        gap: 2%;
        width: 96%;
        margin: 0 auto;
    }

    #businessBox .businessList li {
        margin-top: 60px;
        padding: 15px 0 15px;
        height: auto;
    }

    #businessBox .business-card::before {
        top: -6px;
        left: -6.5px;
        width: 11px;
        height: 11px;
    }

    #businessBox .business-card::after {
        width: 11px;
        height: 11px;
        bottom: -6px;
        right: -6px;
    }

    #businessBox .businessList li i {
        position: absolute;
        top: -3px;
        left: -3px;
        width: 5px;
    }

    #businessBox .business-card .suTxt span,
    #businessBox .business-card .suTxt2 span {
        padding-right: 20px;
        font-size: 10px;
    }

    #businessBox .business-card .suTxt span::after,
    #businessBox .business-card .suTxt2 span::after {
        width: 14px;
        height: 14px;
        line-height: 14px;
        font-size: 7px;
        font-weight: 100;
    }

    #businessBox .business-card .ttl {
        font-size: 13px;
        margin-top: 11px;
    }

    #businessBox .business-card .subTtl {
        font-size: 7px;
        margin-top: 7px;
    }

    #businessBox .business-card a img {
        width: 9px;
        margin: 7px auto 0px;
    }

    #SpaceDebris1 {
        width: 96%;
        margin: 125px auto 0;
    }

    #SpaceDebris1::before {
        top: -6px;
        left: -6.5px;
        width: 11px;
        height: 11px;
    }

    #SpaceDebris1 i {
        top: -3px;
        left: -3px;
        width: 5px;
    }

    #SpaceDebris1 .ttlBox {
        display: block;
        padding: 30px 0;
    }

    #SpaceDebris1 .tB1 {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-right: 0px;
    }

    #SpaceDebris1 .tB1 .number_ttl {
        font-size: 10px;
    }

    #SpaceDebris1 .tB1 .number {
        width: 15px;
        height: 15px;
        font-size: 8px;
        margin-top: 0px;
        margin-left: 8px;
        font-weight: 100;
    }

    #SpaceDebris1 .tB2 h2 {
        font-size: 20px;
        text-align: center;
        margin-top: 10px;
    }

    #SpaceDebris1 .tB2 p {
        font-size: 9px;
    }

    #SpaceDebris1 .ttlBox .logo {
        width: 25px;
        height: 25px;
    }

    #SpaceDebris1 .ttlBox .logo img {
        width: 14px;
    }

    #SpaceDebris1 .DebrisBox1 {
        display: block;
    }

    #SpaceDebris1 .DebrisBox1 .lBox {
        width: 100%;
        padding: 20px;
    }

    #SpaceDebris1 .DebrisBox1 .rBox {
        width: 100%;
        padding: 20px;
        border-left: none;
        border-top: 1px solid #fff;
    }

    #SpaceDebris1 .DebrisBox1 .lBox p {
        font-size: 13px;
    }

    #SpaceDebris1 .DebrisBox2 {
        padding: 20px 0;
    }

    #SpaceDebris1 .DebrisBox2 h3 {
        font-size: 14px;
        line-height: 1.5;
    }

    #SpaceDebris1 .DebrisBox3 {
        display: block;
    }

    #SpaceDebris1 .DebrisBox3 .lBox {
        width: 100%;
        padding: 15px 0;
    }

    #SpaceDebris1 .DebrisBox3 .lBox h4 {
        font-size: 16px;
    }

    #SpaceDebris1 .DebrisBox3 .rBox {
        width: 100%;
        font-size: 13px;
        padding: 20px 20px 20px;
    }

    #SpaceDebris1 .DebrisBox3 div p {
        font-size: 14px;
        line-height: 1.5;
    }

    #SpaceDebris1 .DebrisBox3 div {
        padding-top: 20px;
        padding-bottom: 20px;
        padding-right: 20px;
        padding-left: 20px;
    }

    #SpaceDebris1 .DebrisBox4 .ttlBox h3 {
        font-size: 16px;
    }

    #SpaceDebris1 .DebrisBox4 .ttlBox {
        padding: 33.5px 0;
    }

    #SpaceDebris1 .DebrisBox4 ul {
        display: block;
        padding: 30px 0;
    }

    #SpaceDebris1 .DebrisBox4 ul li {
        width: 100%;
        padding: 20px 0;
        border-right: none;
        /*border-top: 1px solid #fff;*/
    }

    #SpaceDebris1 .DebrisBox4 ul li:last-child {
        /* border-top: 1px solid #fff;*/
    }

    #SpaceDebris1 .DebrisBox4 ul li:first-child {
        border-top: none;
    }

    #SpaceDebris1 .DebrisBox4 ul li .pointNumber {
        font-size: 10px;
    }

    #SpaceDebris1 .DebrisBox4 ul li .pointTitle {
        font-size: 14px;
        margin-top: 5px;
    }

    #SpaceDebris1 .DebrisBox4 ul li .pointTitle::after {
        margin-top: 7px;
    }

    #SpaceDebris1 .DebrisBox4 ul li .pointDescription {
        line-height: 1.5;
        font-size: 13px;
        margin-top: 7px;
    }

    #SpaceDebris2 {
        width: 96%;
        margin: 20px auto 0;
    }

    #SpaceDebris2 .Spacegomi1 p {
        position: absolute;
        padding: 5px 0;
        font-size: 8px;
        border-bottom: 1px solid #fff;
    }

    #SpaceDebris2 .Spacegomi1 h3 {
        font-size: 16px;
        width: 100%;
        line-height: 1.5;
        padding: 25px 0;
    }

    #SpaceDebris2 .Spacegomi1 #kaihei {
        width: 15px;
        height: 15px;
    }

    #SpaceDebris2 .SpacegomiElm1 .ttlBox .spaceDebrisTitle {
        font-size: 14px;
        font-weight: 100;
    }

    #SpaceDebris2 .SpacegomiElm1 .ttlBox .dataYear {
        font-size: 10px;
    }

    #SpaceDebris2 .SpacegomiElm1 {
        padding: 20px 2% 0;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList {
        margin: 5px auto 50px;
        justify-content: center;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li {
        width: 28%;
        margin-top: 15px;
        margin-right: 3%;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount {
        font-size: 10px;
        margin-top: 10px;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t0 {
        color: #fff;
        font-size: 10px;
        display: block;
        text-align: left;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t1 {
        font-size: 29px;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t2 {
        font-size: 18px;
        margin-right: 0px;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount.en .t2 {
        font-size: 14px;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li .debrisCount .t3 {
        margin-right: -3px;
    }

    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li.item2 img,
    #SpaceDebris2 .SpacegomiElm1 .spaceDebrisList li.item3 img {
        width: 100%;
    }

    #SpaceDebris2 .SpacegomiElm2 ul {
        display: block;
        border-top: none;
    }

    #SpaceDebris2 .SpacegomiElm2 ul li {
        width: 100%;
        padding: 15px 0;
        border-right: none;
    }

    #SpaceDebris2 .SpacegomiElm2 ul li {
        border-top: 1px solid #fff;
        padding: 50px 0;
    }

    #SpaceDebris2 .SpacegomiElm2 ul li .objectDescription {
        font-size: 14px;
        padding-bottom: 5px;
        min-height: auto;
    }

    #SpaceDebris2 .SpacegomiElm2 ul li .objectDescription::after {
        width: 35%;
        bottom: -5px;
    }

    #SpaceDebris2 .SpacegomiElm2 .itmeBox {
        display: block;
        flex-wrap: nowrap;
        margin: 0 auto;
        align-items: center;
        width: 96%;
    }

    #SpaceDebris2 .SpacegomiElm2 .imageWrapper {
        width: 100%;
    }

    #SpaceDebris2 .SpacegomiElm2 .txt {
        width: 100%;
    }

    #SpaceDebris2 .SpacegomiElm2 ul li .objCount .t1 {
        font-size: 50px;
    }

    #SpaceDebris2 .SpacegomiElm2 .dataYear {
        font-size: 10px;
    }

    #SpaceDebris2 .SpacegomiElm3 {
        padding-top: 50px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul {
        display: block;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li.item1 {
        width: 100%;
        margin-right: 0px;
        max-width: 100%;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li.item1 .img2 {
        max-width: 44px;
        display: block;
        margin: 17px auto 0;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li.item1::after {
        left: 50%;
        top: 104%;
        background-image: url(./images/business_arrow_b.png);
        transform: translate(-50%, 0%);
    }

    #SpaceDebris2 .SpacegomiElm3 ul li.item2 {
        width: 100%;
        margin-top: 70px;
        max-width: 100%;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li.item2 .img1 {
        width: 100%;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .txtBox {
        display: block;
        width: 96%;
        margin: 0 auto;
        align-items: center;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .imageWrapper {
        width: 100%;
        margin-right: 2%;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .imageWrapper .img1 {
        max-width: 180px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li.item2 .img2 {
        margin-top: 17px;
        height: 29px;
        width: auto;
        display: block;
        margin: 17px auto;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .launchDescription {
        font-size: 14px;
        min-height: auto;
        padding-bottom: 5px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .launchDescription::after {
        width: 42%;
        bottom: -5px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .txtElm {
        width: 100%;
        min-height: auto;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .launchCount,
    #SpaceDebris2 .SpacegomiElm3 ul li .plannedCount {
        font-size: 34px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .plannedCount {
        font-size: 50px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .launchCount span,
    #SpaceDebris2 .SpacegomiElm3 ul li .plannedCount span {
        font-size: 12px;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .launchPeriod {
        font-size: 12px;
        margin: 13px 0 0;
    }

    #SpaceDebris2 .SpacegomiElm3 ul li .dataYear {
        font-size: 10px;
        margin-top: 14px;
        line-height: 1.5;
    }

    #SpaceDebris2 .SpacegomiElm4 p {
        width: 90%;
        margin: 0 auto;
        font-size: 14px;
    }

    #SpaceDebris2 .SpacegomiElm4 {
        padding: 20px 0;
    }

    #SpaceDebris3 {
        width: 96%;
        margin: 20px auto 0;
    }

    #SpaceDebris3 .Spacegomi1 p {
        position: absolute;
        padding: 7px 5px;
        font-size: 10px;
        border-bottom: 1px solid #fff;
        width: auto;
    }

    #SpaceDebris3 .Spacegomi1 h3 {
        font-size: 16px;
        width: 100%;
        line-height: 1.5;
        padding: 25px 0;
    }

    #SpaceDebris3 .SpacegomiElm1 p.text {
        width: 90%;
        max-width: 100%;
        margin: 0 auto;
        position: initial;
        font-size: 14px;
        order: 1;
        padding-top: 20px;
        line-height: 1.5;
    }

    #SpaceDebris3 .SpacegomiElm1 {
        flex-wrap: wrap;
        display: flex;
        border: none;
        border-top: 1px solid #fff;
    }

    #SpaceDebris3 .SpacegomiElm1 p.imgBox {
        order: 2;
        margin: 20px auto 20px;
    }

    #SpaceDebris3 .SpacegomiElm2 {
        padding: 20px 0px 20px;
        border-top: none;
    }

    #SpaceDebris3 .SpacegomiElm2 .ttl {
        font-size: 17px;
        text-align: center;
    }

    #SpaceDebris3 .SpacegomiElm2 ul .ingBox {
        width: 96%;
        margin: 0 auto;
    }

    #SpaceDebris3 .SpacegomiElm2 ul {
        flex-wrap: wrap;
    }

    #SpaceDebris3 .SpacegomiElm2 ul .ingBox {
        width: 90%;
        margin: 20px auto;
        order: 2;
    }

    #SpaceDebris3 .SpacegomiElm2 ul .moveBox {
        width: 96%;
        order: 1;
        margin: 0 auto;
    }

    #SpaceDebris4 {
        width: 96%;
        margin: 0 auto;
        margin-top: 50px;
    }

    #SpaceDebris4::before {
        top: -6px;
        left: -6.5px;
        width: 11px;
        height: 11px;
    }

    #SpaceDebris4 i {
        top: -3px;
        left: -3px;
        width: 5px;
    }

    #SpaceDebris4 .ttlBox {
        display: block;
        padding: 30px 0;
    }

    #SpaceDebris4 .tB1 {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-right: 0px;
    }

    #SpaceDebris4 .tB1 .number_ttl {
        font-size: 10px;
    }

    #SpaceDebris4 .tB1 .number {
        width: 15px;
        height: 15px;
        font-size: 10px;
        margin-top: 0px;
        margin-left: 8px;
    }

    #SpaceDebris4 .tB2 h2 {
        font-size: 20px;
        text-align: center;
        margin-top: 10px;
    }

    #SpaceDebris4 .tB2 p {
        font-size: 9px;
    }

    #SpaceDebris4 .ttlBox .logo {
        width: 25px;
        height: 25px;
    }

    #SpaceDebris4 .ttlBox .logo img {
        width: 14px;
    }

    #SpaceDebris4 .DebrisBox1 {
        display: block;
    }

    #SpaceDebris4 .DebrisBox1 .lBox {
        width: 100%;
        padding: 20px;
    }

    #SpaceDebris4 .DebrisBox1 .lBox p {
        font-size: 13px;
    }

    #SpaceDebris4 .DebrisBox1 .rBox {
        width: 100%;
        border-left: none;
        padding-bottom: 10px;
    }

    #SpaceDebris4 .DebrisBox2 {
        padding: 20px 0;
    }

    #SpaceDebris4 .DebrisBox2 h3 {
        font-size: 16px;
        line-height: 1.5;
    }

    #SpaceDebris4 .DebrisBox3 {
        display: block;
    }

    #SpaceDebris4 .DebrisBox3 .lBox p {
        font-size: 14px;
        line-height: 1.5;
    }

    #SpaceDebris4 .DebrisBox3 .lBox {
        width: 90%;
        margin: 0 auto;
        padding: 20px 0;
    }

    #SpaceDebris4 .DebrisBox3 .lBox ul li {
        width: 24%;
        margin-right: 2%;
        padding-left: 9%;
        height: auto;
        align-items: center;
        font-size: 12px;
    }

    #SpaceDebris4 .DebrisBox3 .lBox ul .cat1::before,
    #SpaceDebris4 .DebrisBox3 .lBox ul .cat2::before,
    #SpaceDebris4 .DebrisBox3 .lBox ul .cat3::before {
        width: 28%;
        height: 100%;
        background-size: contain;
    }

    #SpaceDebris4 .DebrisBox3 .rBox {
        width: 100%;
        padding: 5px 0 30px;
    }

    #SpaceDebris4 .DebrisBox3 .rBox .imgBox {
        margin-top: 20px;
    }

    #SpaceDebris4 .DebrisBox4 .ttlBox {
        text-align: center;
    }

    #SpaceDebris4 .DebrisBox4 ul li {
        width: 50%;
        border: none;
        border-bottom: 1px solid #fff !important;
        align-items: start;
    }

    #SpaceDebris4 .DebrisBox4 ul li:nth-child(odd) {
        border-right: 1px solid #fff;
    }

    #SpaceDebris4 .DebrisBox4 ul li:nth-of-type(5),
    #SpaceDebris4 .DebrisBox4 ul li:nth-of-type(6) {
        border-bottom: none !important;
    }

    #SpaceDebris4 .DebrisBox4 ul li .ttl {
        font-size: 12px;
        height: auto;
        margin-top: 5px;
    }

    #SpaceDebris4 .DebrisBox4 ul li .txt {
        font-size: 12px;
        line-height: 1.5;
        margin-top: 10px;
    }
}


#newsBox .topBox {
    height: 480px;
    background-image: url(./images/news_top_image.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#newsBox .topBoxInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    align-items: end;
    height: 100%;
}

#newsBox .topBoxInner img {
    display: none;
}

#newsBox h2 {
    font-size: 48px;
    font-weight: 600;
    color: #fff;
    margin-bottom: 65px;
}

#newsBox .newsCatBox {
    margin: 80px auto 0;
}

#newsBox .newsCatInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

#newsBox .newsCatBox ul {
    display: flex;
}

#newsBox .newsCatBox ul li {
    border: 1px solid #fff;
    max-width: 200px;
    width: 25%;
    text-align: center;
    margin-right: 0.9%;
    width: 100%;
    height: 52px;

}

#newsBox .newsCatBox ul li.select {
    border: none;
    background: #005AAE;
}

#newsBox .newsCatBox ul li a {
    color: #fff;
    font-size: 16px;
    font-family: "Open Sans", sans-serif;
    width: 100%;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#newsBox .newsListBox {
    margin-top: 120px;
    /*margin-bottom: 30px;*/
    margin-bottom: 100px;
}

#newsBox .newsListInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
}

#newsBox .newsListBox ul li a {
    display: flex;
    justify-content: space-between;
    margin-top: 100px;
}

#newsBox .newsListBox ul li a .imBox {
    width: 45%;
    margin-right: 5%;
}

#newsBox .newsListBox ul li a .txtBox {
    width: 50%;
}

#newsBox .newsListBox ul li a .txtBox p {
    color: #fff;
}

#newsBox .newsListBox ul li a .txtBox .cat {
    max-width: 150px;
    width: 100%;
    background: #005AB0;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 0;
}

#newsBox .newsListBox ul li a .txtBox .day {
    font-size: 16px;
    font-weight: 700;
    margin-top: 20px;
}

#newsBox .newsListBox ul li a .txtBox .ttl {
    font-size: 24px;
    margin-top: 20px;
    line-height: 1.5;
}

#newsBox .paginationBox {
    margin-bottom: 100px;
}

#newsBox .paginationInner {
    max-width: 1140px;
    width: 96%;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

#newsBox .paginationBox .all_back {
    width: 17px;
    display: inline-block;
    margin-right: 5px;
}

#newsBox .paginationBox .back {
    height: 17px;
    display: inline-block;
    margin-right: 5px;
}

#newsBox .paginationBox .next {
    height: 17px;
    display: inline-block;
    margin-right: 5px;
}

#newsBox .paginationBox .all_next {
    width: 17px;
    display: inline-block;
}

#newsBox .paginationBox .back img,
#newsBox .paginationBox .next img {
    height: 100%;
}

#newsBox .paginationBox p,
#newsBox .paginationBox p span,
#newsBox .paginationBox .totatotal {
    font-family: "Open Sans", sans-serif;
    color: #fff;
    margin-right: 5px;
}

#newsBox .paginationBox .totatotal {
    margin-left: 5px;
}

@media screen and (max-width: 768px) {
    #newsBox .topBox {
        height: auto;
        background: none;
        margin-top: 72px;
    }

    #newsBox .topBoxInner {
        position: relative;
        width: 100%;
        height: auto;
        display: block;
    }

    #newsBox .topBoxInner img {
        display: block;
    }

    #newsBox h2 {
        font-size: 20px;
        position: relative;
        bottom: 30px;
        width: 92%;
        margin: 0 auto;
    }

    #newsBox .newsCatBox {
        margin-top: 30px;
    }

    #newsBox .newsCatBox ul {
        margin-top: 10px;
    }

    #newsBox .newsCatBox ul li {
        padding: 5px 0;
        width: 25%;
    }

    #newsBox .newsCatBox ul li a {
        font-size: 8px;
    }

    #newsBox .newsListBox {
        margin-top: 45px;
    }

    #newsBox .newsListBox ul li a {
        display: block;
        margin-top: 30px;
    }

    #newsBox .newsListBox ul li a .imBox {
        width: 100%;
        margin-right: 0;
    }

    #newsBox .newsListBox ul li a .txtBox .cat {
        max-width: 80px;
        font-size: 8px;
        height: 20px;
    }

    #newsBox .newsListBox ul li a .txtBox {
        width: 100%;
        margin-top: 10px;
    }

    #newsBox .newsListBox ul li a .txtBox .day {
        font-size: 12px;
        margin-top: 10px;
    }

    #newsBox .newsListBox ul li a .txtBox .ttl {
        font-size: 16px;
        margin-top: 17px;
    }
}

.fadeIn {
    animation-name: fadeInAnime;
    animation-duration: 1.0s;
    animation-fill-mode: forwards;
    opacity: 0;
}

.t4 {
    animation-duration: 6.0s;
}

@keyframes fadeInAnime {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fadeUp {
    animation-name: fadeUpAnime;
    animation-duration: 1.0s;
    animation-fill-mode: forwards;
    opacity: 0;
}

@keyframes fadeUpAnime {
    0% {
        opacity: 0;
        transform: translateY(50px);
    }

    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}