@charset "utf-8";

@media (max-width: 1480px) {
    :root {
        --wrap: 1200px;
    }

    /* INDEX */
    .mv-img img{
        width: 1000px;
    }
    .top-culture__content-box__img img{
        width: 380px;
    }
    .top-contact__content-ttl img{
        width: 1100px;
    }
    .top-contact__lead{
        left: 20px;
    }
    .top-contact__lead img{
        width: 400px;
    }
    .top-contact__content-text, .top-contact__content-btn{
        margin-right: 35px;
    }
}

@media (max-width: 1240px) {
    :root {
        --wrap: 1200px;
        --space: 20px;
    }
    .wrap{
        padding: 0 20px;
    }

    /* HEADER */
    .header-menu{
        display: none;
    }
}

@media (max-width: 991px) {
    #body-wrap{
        min-width: 320px;
    }


    /* HEADER */
    .nav-toggle{
        width: 38px;
        height: 21px;
    }
    .nav-toggle span{
        height: 1px;
    }
    .nav-toggle span:nth-of-type(2){
        top: 10px;
    }
    .nav-toggle span:nth-of-type(3){
        top: 20px;
    }


    /* FOOTER */
    .top-contact__content-img{
        pointer-events: none;
    }
    .top-contact__content-img img{
        width: 300px;
    }
    .top-contact__lead img{
        width: 300px;
    }
    .top-contact__content-text, .top-contact__content-btn{
        margin-right: 0;
    }
    .top-contact__content-ttl img{
        width: 700px;
    }


    /* INDEX */
    .mv-img img{
        width: 600px;
    }
    .top-message__ttl img{
        height: 35px;
    }
    .top-message__ttl{
        margin-bottom: 30px;
    }
    .top-message__lead{
        font-size: 18px;
        margin-bottom: 15px;
    }
    .top-message__text{
        font-size: 16px;
    }
    .top-message__text b{
        font-size: 18px;
    }
    .top-message__img img{
        width: 200px;
    }
    .top-vision {
        padding-top: 100px;
    }
    .top-vision__content-body{
        padding: 0 50px;
    }
    .top-vision__message{
        margin-top: 20px;
    }
    .top-vision__message-img img{
        width: 300px;
    }
    .top-vision__message-img{
        bottom: -100px;
    }
    .top-workstyle{
        margin-top: 0;
    }
    .title{
        margin-bottom: 40px;
    }
    .title-text img{
        height: 40px;
    }
    .title-ja{
        font-size: 16px;
    }
    .top-workstyle__hv.n1{
        left: 20px;
    }
    .top-workstyle__hv.n1 img{
        width: 150px;
    }
    .top-workstyle__hv.n2{
        right: 20px;
    }
    .top-workstyle__hv.n2 img{
        width: 120px;
    }
    .top-workstyle__text{
        font-size: 16px;
        margin-bottom: 30px;
    }
    .top-workstyle__content-nav{
        position: initial;
        margin-bottom: 30px;
        padding: 0 20px;
        display: grid;
        grid-template-columns: repeat(3,1fr);
    }
    .top-workstyle__content-nav li{
        justify-content: center;
    }
    .top-workstyle__content-img {
        max-width: 1520px;
        width: 1520px;
    }
    .top-workstyle__content-body__item-ttl{
        margin-bottom: 30px;
    }
    .top-workstyle__content-body__item-ttl__text{
        font-size: 14px;
    }
    .top-workstyle__content-body__item-ttl__en{
        font-size: 40px;
        line-height: 1.3;
    }
    .top-workstyle__content-body__item-ttl__att{
        font-size: 13px;
    }
    .top-workstyle__content-body__item-lead{
        font-size: 24px;
    }
    .top-workstyle__content-body__nav-arrow img{
        width: 50px;
    }
    .top-workstyle__content-body__item-text{
        font-size: 14px;
    }
    .top-workstyle__content-body__item-att__text{
        font-size: 13px;
    }
    .top-workstyle__content-body__nav{
        max-width: 540px;
    }
    .top-culture__content-number{
        max-width: 100%;
        margin-bottom: 15px;
    }
    .top-culture__content-box, .top-benefit__flex-box__item-text{
        padding-left: 30px;
        max-width: 100%;
        justify-content: space-between;
    }
    .top-culture__content-box__item{
        max-width: 340px;
    }
    .top-culture__content-box__img{
        max-width: calc(100% - 380px);
    }
    .top-culture__content-box__item-text{
        font-size: 14px;
    }
    .top-culture__content-box__item-lead{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .top-benefit__flex-img{
        max-width: 100%;
        text-align: center;
    }
    .top-benefit__flex-img img{
        width: 240px;
    }
    .top-benefit__flex-box{
        max-width: 100%;
        padding-left: 0;
        margin-top: 40px;
    }
    .top-infographic{
        margin-top: 0;
        background-size: 100%;
        background-position-y: 80px;
    }
    .top-infographic__grid{
        grid-template-columns: repeat(2,1fr);
    }
    .top-recruit{
        margin-top: 0;
    }
    .top-recruit__content-bg{
        display: none;
    }
    .top-recruit__content-body{
        max-width: 100%;
        padding: 50px 20px;
        background-color: #000;
        border-radius: 20px;
        position: initial;
        transform: initial;
    }
    .top-contact{
        margin-top: 20px;
    }
    .recruit-tab ul li{
        font-size: 14px;
    }
    .recruit-content{
        padding: 20px;
    }
    .recruit-content__job-box__item-lead{
        font-size: 16px;
    }
}


@media (max-width: 767px) {
    :root{
        --padding: 80px;
        --anchor-padding: 80px;
    }
    p{
        font-size: 14px;
    }
    #body-line{
        width: 101%;
        opacity: 0.5;
    }

    /* HEADER */
    .header-logo img{
        width: 60px;
    }
    .drawer-inner{
        display: block;
        overflow-y: scroll;
        padding: 80px 20px 60px;
    }
    .drawer-menu a{
        font-size: 18px;
    }
    .drawer-foot{
        font-size: 10px;
        width: 100%;
        text-align: center;
        position: initial;
        margin-top: 20px;
        transform: initial;
        display: none;
    }


    /* INDEX */
    .mv-img{
        left: calc(50% + 60px);
    }
    .mv-img img{
        width: 260px;
    }
    .top-message{
        margin-top: 0;
    }
    .top-message__ttl img{
        height: 25px;
    }
    .top-message__lead{
        font-size: 14px;
    }
    .top-message__text{
        font-size: 13px;
    }
    .top-message__text b{
        font-size: 14px;
    }
    .top-message__img img{
        width: 120px;
    }
    .top-message__img{
        right: -10px;
    }
    .top-vision{
        padding-top: 40px;
    }
    .top-vision__content-bg{
        display: none;
    }
    .top-vision__content{
        background-color: #000;
        margin: 0 -20px;
        border-radius: 10px;
    }
    .top-vision__content-body{
        position: initial;
        transform: scale(0.8);
        padding: 20px;
    }
    .top-vision__content-body.scrollin{
        transform: scale(1);
    }
    .top-vision__message-img{
        bottom: -20px;
    }
    .top-vision__message-img img{
        width: 120px;
    }
    .title-text img{
        height: 26px;
    }
    .top-workstyle__hv{
        display: none;
    }
    .title-ja{
        font-size: 13px;
    }
    .title.block{
        gap: 5px;
    }
    .title{
        flex-direction: column;
        margin-bottom: 20px;
        gap: 5px;
    }
    .top-workstyle__text{
        font-size: 14px;
        text-align: left;
    }
    .top-workstyle__content-nav{
        grid-template-columns: repeat(1,1fr);
    }
    .top-workstyle__content-bg,
    .top-workstyle__content-img{
        display: none;
    }
    .top-workstyle__content-body{
        position: initial;
        max-width: 100%;
        padding: 30px 0;
        border-radius: 10px;
        transform: scale(0.8);
        background: linear-gradient(135deg, #1a1a1a 0%, #262626 55%, #000 100%);
   
    }
    .top-workstyle__content-body.scrollin{
        transform: scale(1);
    }
    .top-workstyle__content-body__item-ttl__text{
        font-size: 12px;
    }
    .top-workstyle__content-body__item-ttl__en{
        font-size: 30px;
    }
    .top-workstyle__content-body__item-ttl__att{
        font-size: 11px;
    }
    .top-workstyle__content-body__item-text{
        font-size: 13px;
        margin-bottom: 20px;
    }
    .top-workstyle__content-body__item-ttl{
        margin-bottom: 20px;
    }
    .top-workstyle__content-body__nav{
        max-width: 320px;
        top: 52px;
    }
    .top-workstyle__content-body__nav-arrow img{
        width: 25px;
    }
    .top-workstyle__content-body__item-lead{
        font-size: 20px;
    }
    .top-workstyle__content-body__item-att{
        max-width: 330px;
        height: 122px;
    }
    .top-workstyle__content-body__item-att__text{
        font-size: 12px;
        top: 6px;
    }
    .top-culture{
        background: url(img/culture-bgText.svg) no-repeat center 25px / 100%, url(img/culture-bg.svg) no-repeat right 45px / 19.5vw;
        margin-top: 50px;
    }
    .top-culture__content-box__item-lead{
        font-size: 18px;
    }
    .top-culture__content-box, .top-benefit__flex-box__item-text{
        padding-left: 20px;
    }
    .top-culture__content{
        margin-bottom: 50px;
    }
    .top-culture__content-box__item{
        max-width: 100%;
        margin-bottom: 20px;
    }
    .top-culture__content-box__img{
        max-width: 100%;
        text-align: center;
    }
    .top-benefit{
        margin-top: 0;
        background: url(img/benefit-bgText.svg) no-repeat center 50px / calc(100% - 110px), url(img/benefit-bg.svg) no-repeat left top / 19.5vw;
    }
    .top-benefit__flex-img img{
        width: 140px;
    }
    .top-infographic{
        background-position-y: 50px;
    }
    .top-infographic__grid{
        grid-template-columns: repeat(1,1fr);
        gap: 10px;
    }
    .recruit-tab ul{
        grid-template-columns: repeat(2,1fr);
    }
    .recruit-content{
        padding: 20px 10px 10px;
    }
    .recruit-content__ttl{
        font-size: 18px;
        margin-bottom: 10px;
    }
    .recruit-content__job{
        grid-template-columns: repeat(1,1fr);
        gap: 10px;
    }
    .recruit-content__job-box__icon{
        max-width: 100%;
        margin-bottom: 15px;
        text-align: center;
    }
    .recruit-content__job-box__icon img{
        width: 40px;
    }
    .recruit-content__job-box__item{
        max-width: 100%;
        padding-left: 0;
    }
    .recruit-content__job-box__item-lead{
        font-size: 15px;
        margin-bottom: 0;
    }
    .recruit-content__requirement dl dt,
    .recruit-content__requirement dl dd{
        max-width: 100%;
        font-size: 14px;
    }
    .recruit-content__requirement dl dd{
        padding-left: 0;
        margin-top: 5px;
    }
    .top-contact__lead img{
        width: 200px;
    }
    .top-contact__content-ttl img{
        width: 375px;
    }
    .top-contact__content-text, .top-contact__content-btn{
        text-align: center;
        margin: 0 auto;
    }
    .top-contact__content-text{
        text-align: center;
        font-size: 14px;
    }
    .top-contact__content-btn a{
        font-size: 14px;
        line-height: 50px;
    }
    .top-contact__content-btn{
        max-width: 220px;
    }
    .top-contact__lead{
        position: initial;
        transform: initial;
        margin-bottom: 30px;
    }
    .top-contact__lead img{
        transform: translateX(-30px);
    }
    .top-contact{
        height: auto;
        padding: 50px 0;
    }
    .top-contact__content-ttl{
        margin: 20px 0;
    }
    .top-contact__content-img img{
        max-width: 160px;
    }
    .top-contact__content-img{
        transform: initial;
        top: -160px;
        right: 0;
    }
    .top-workstyle__content-textSlider-wrap{
        position: initial;
        transform: initial;
        margin-top: 10px;
    }
    .top-workstyle__content-textSlider-item{
        width: 700px;
    }
    .recruit-content__list span{
        font-size: 12px;
    }
}