@charset "utf-8";

@media screen and (max-width: 1540px){
    :root{
        --wrap: 1200px;
    }


    /* HEADER */
    #header .header-logo img,
    #header.over .header-logo img{
        width: 240px;
    }
    #header .header-menu ul li a{
        font-size: 15px;
    }


    /* TOP */
    .top-concept__flex-box__text{
        font-size: var(--font-md-text);
    }
    .top-concept__flex-box{
        padding-left: 100px;
    }
    .top-business__reason-grid__item-lead{
        font-size: 20px;
    }
    .top-business__reason-grid{
        gap: 50px;
    }
    .top-case__slider-item__ttl{
        font-size: var(--font-md-text);
    }
    .footer-recruit__flex-cont__lead{
        font-size: 48px;
    }


    /* ABOUT */
    .about-sec01__text{
        font-size: var(--font-md-text);
    }
    .about-sec01__lead{
        font-size: 36px;
    }
}


@media screen and (max-width: 1199px){
    body.home .wrap, .wrap{
        padding: 0 20px;
    }
}

@media screen and (max-width: 991px){
    :root{
        --padding: 60px;
        --font-md-text: 16px;
        --space: 20px;
    }
    body{
        min-width: 320px;
    }
    .wave.bottom{
        background: url(img/common/wave-bottom.webp) no-repeat center bottom / 100%;
    }
    .wave.top{
        background: url(img/common/wave-top.webp) no-repeat center top / 100%;
    }
    .wave-svg{
        display: none;
    }
    .wave-section{
        padding: 25vw 0 50vw;
    }


    /* HEADER */
    body.home #header:not(.over):not(.open) .nav-toggle span{
        background-color: #fff;
    }
    .nav-toggle{
        display: block;
    }
    #header .header-menu{
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: rgba(255 255 255 / 0.9);
        padding: 140px 20px 40px;
        overflow-y: scroll;
        overscroll-behavior: none;
        opacity: 0;
        pointer-events: none;
        visibility: hidden;
        transition: .4s;
    }
    #header.open .header-menu{
        opacity: 1;
        pointer-events: auto;
        visibility: visible;
    }
    #header .header-logo{
        position: relative;
        z-index: 1;
    }
    #header .header-menu nav{
        display: block;
    }
    #header .header-menu ul{
        display: block;
        text-align: center;
    }
    #header .header-menu li{
        margin-bottom: 30px;
    }
    #header .header-menu.has-icon li:last-child{
        margin-bottom: 0;
    }
    #header .header-menu ul.has-icon li a{
        max-width: 380px;
        margin: 0 auto;
    }
    #header .header-logo img{
        width: 220px;
    }


    /* FOOTER */
    .footer-recruit__flex{
        display: block;
    }
    .footer-recruit__flex-title{
        padding-top: 0;
    }
    .footer-recruit__flex-title .title-en{
        font-size: 60px;
    }
    .footer-recruit__flex-cont{
        max-width: 100%;
    }
    .footer-content{
        padding: 0 0 20px;
    }
    .footer-content__flex{
        display: block;
    }
    .footer-content__flex-info{
        text-align: center;
        margin-bottom: 30px;
    }
    .footer-content__flex-info__address{
        margin-top: 10px;
    }
    .footer-content__flex-contact{
        max-width: 100%;
    }
    .footer-content__flex-info__logo img{
        width: 300px;
    }



    /* TOP */
    .top-concept__flex{
        display: block;
    }
    .top-concept__flex-img{
        max-width: 100%;
        text-align: center;
        margin-bottom: 60px;
    }
    .top-concept__flex-box{
        padding-left: 0;
        max-width: 100%;
    }
    .top-concept__flex-box__lead{
        margin-bottom: 30px;
    }
    .top-concept__flex-box__lead img{
        width: 320px;
    }
    .top-business__flex-box{
        max-width: 100%;
        margin-bottom: 40px;
    }
    .top-business__flex-img{
        max-width: 100%;
        text-align: center;
        padding-right: 0;
    }
    .top-business__flex-img img{
        width: 500px;
    }
    .top-business__flex-box__lead{
        font-size: 32px;
    }
    .top-business__list-box__item{
        max-width: 100%;
        padding-right: 0;
        margin-bottom: 40px;
    }
    .top-business__list-box__img{
        max-width: 100%;
        text-align: center;
    }
    .top-business__list-box__item-detail__elm-ttl{
        font-size: 22px;
    }
    .top-business__list-box__item-detail__elm-toggle{
        top: 22px;
    }
    .top-business__list-box{
        margin-bottom: 100px;
    }
    .top-business__list-box__item-ttl{
        font-size: 30px;
    }
    .top-business__list-box__item-ttl span{
        bottom: 15px;
    }
    .top-business__list-box__item-ttl span img{
        width: 110px;
    }
    .top-business__reason{
        margin-top: 100px;
    }
    .top-business__reason-ttl img{
        width: 300px;
    }
    .top-business__reason-ttl{
        margin: -40px 0 40px;
    }
    .top-business__reason-ttl span{
        padding: 0 40px;
    }
    .top-business__reason-grid{
        grid-template-columns: repeat(1,1fr);
    }
    .top-business__reason-grid__item-ttl img{
        height: 45px;
    }
    .top-business__reason{
        padding: 0 30px 30px;
    }
    .top-business{
        padding-bottom: 0;
    }
    .top-case__slider-nav{
        margin-top: 30px;
    }
    .top-about__flex{
        display: block;
    }
    .top-about__flex-cont{
        max-width: 100%;
    }
    .top-about__flex-cont__box-ttl span{
        font-size: 42px;
    }
    .top-about__flex-cont__box a::before{
        top: 35px;
    }


    /* ABOUT */
    .about-sec02__flex-img{
        max-width: 100%;
        margin-bottom: 40px;
        text-align: center;
    }
    .about-sec02__flex-box{
        padding-left: 0;
        max-width: 100%;
    }
    .about-sec03__flex-img{
        max-width: 100%;
        text-align: center;
        margin-bottom: 40px;
    }
    .about-sec03__flex-box{
        max-width: 100%;
        padding-left: 0;
    }
}

@media screen and (max-width: 767px){
    :root{
        --font-md-text: 14px;
    }

    p{
        font-size: 14px;
    }

    .wave-svg svg{
        height: 100px;
    }
    .wave-svg{
        left: 0;
    }
    .wave-svg::before{
        height: 25px;
    }
    .empty-section{
        height: 80px;
        margin: -10px 0;
    }
    .wave-svg svg{
        height: 130px;
    }
    .title-en,
    .footer-recruit__flex-title .title-en{
        font-size: 38px;
    }
    .title-text{
        font-size: 14px;
    }
    .title-text span::before{
        top: 7px;
    }
    .title{
        margin-bottom: 30px;
    }
    #fixed-menu{
        display: none !important;
    }

    /* HEADER */
    #header .header-logo img,
    #header.over .header-logo img{
        width: 160px;
    }
    #header{
        padding: 10px 20px;
    }
    #header .header-menu ul.has-icon li:not(:last-child){
        margin-bottom: 15px;
    }
    #header .header-menu li{
        margin-bottom: 20px;
    }


    /* FOOTER */
    .footer-content{
        margin-top: -80px;
        position: relative;
        z-index: 1;
    }
    .footer-recruit__flex-cont__lead{
        font-size: 28px;
        margin-bottom: 15px;
    }
    .footer-recruit__flex-cont__more a{
        font-size: 16px;
    }
    .footer-recruit__flex-cont__text{
        margin-bottom: 30px;
    }
    .footer-recruit__flex-cont__more a img{
        margin-left: 15px;
        top: -2px;
        width: 30px;
    }
    .footer-content__flex-info__address{
        font-size: 11px;
    }
    .footer-content__flex-info__address a{
        font-size: 10px;
    }
    .footer-content__flex-info__logo img{
        width: 220px;
    }
    .footer-content__flex-info__logo{
        margin-bottom: 20px;
    }
    .footer-content__flex-contact__grid{
        grid-template-columns: repeat(1,1fr);
    }
    .footer-content__flex-contact__grid-item__text img{
        width: 22px;
        margin-right: 15px;
    }
    .footer-content__flex-contact__grid-item__text{
        font-size: 20px;
    }
    .footer-content__bottom{
        margin-top: 25px;
        padding-top: 15px;
    }
    .footer-content__bottom-menu{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 0;
        text-align: center;
    }
    .footer-content__bottom{
        display: block;
    }
    .footer-content__bottom-menu li a{
        font-size: 13px;
    }
    .footer-content__bottom-copy{
        margin-top: 30px;
        text-align: center;
    }



    /* TOP */
    .top-fixed__text img, .mv-text img{
        width: 80vw;
    }
    .top-concept__flex-box__lead img{
        width: 260px;
    }
    .top-business__flex-box__lead{
        font-size: 24px;
    }
    .top-business__list{
        margin-top: 40px;
    }
    .top-business__list-box__item-ttl{
        font-size: 22px;
        margin-bottom: 10px;
    }
    .top-business__list-box__item-ttl span img{
        width: 60px;
    }
    .top-business__list-box__item-text{
        margin-bottom: 30px;
    }
    .top-business__list-box__item-detail__elm-ttl{
        font-size: 16px;
    }
    .top-business__list-box__item-detail__elm-text{
        padding-top: 10px;
    }
    .top-business__list-box__item-detail__elm-toggle{
        width: 40px;
        height: 40px;
        top: 11px;
    }
    .top-business__list-box__item-detail__elm{
        padding: 15px 0;
    }
    .top-business__reason-ttl{
        margin: -30px 0 40px;
    }
    .top-business__reason-ttl span{
        padding: 0 20px;
    }
    .top-business__reason-ttl span img{
        width: 160px;
    }
    .top-business__reason{
        padding: 0 20px 30px;
        border-radius: 10px;
        border-width: 2px;
        position: relative;
        z-index: 1;
    }
    .top-business__reason-text{
        text-align: left;
    }
    .top-business__reason-grid__item-illust,
    .top-business__reason-grid__item-illust img{
        height: 80px;
    }
    .top-business__reason-grid__item-ttl img{
        height: 34px;
    }
    .top-business__reason-grid__item-lead{
        font-size: 18px;
    }
    .top-business__reason-grid__item-ttl{
        margin-bottom: 15px;
    }
    .top-case__slider-item{
        width: 280px;
        margin-right: 25px;
    }
    .top-case__slider-item__ttl{
        margin-bottom: 10px;
    }
    .top-case__slider-nav__arrow{
        max-width: 70px;
    }
    .top-case__slider-nav__bar{
        max-width: calc(100% - 90px);
    }
    .top-about__flex-cont__box a{
        padding: 20px 0;
    }
    .top-about__flex-cont__box-ttl span{
        font-size: 32px;
    }
    .top-about__flex-cont__box-ttl{
        font-size: 13px;
        margin-bottom: 10px;
    }
    .top-about__flex-cont__box a::before{
        width: 30px;
        height: 30px;
        top: 20px;
    }



    /* PAGE */
    .first-section{
        padding-top: 100px;
    }


    /* ABOUT */
    .about-sec01__lead{
        font-size: 20px;
        margin-bottom: 20px;
    }
    .about-sec02__flex{
        display: block;
    }
    .about-sec02__flex-box__text{
        margin-bottom: 15px;
    }
    .about-sec02__flex-box__name{
        text-align: right;
    }
    .about-sec02__flex-box__name small{
        font-size: 12px;
    }
    .about-sec02__flex-box__name img{
        width: 120px;
    }
    .about-sec03__flex-img{
        padding-top: 0;
    }
    .about-sec03__flex-box__table th,
    .about-sec03__flex-box__table td{
        display: block;
        width: 100%;
        padding: 12px 0;
    }
    .about-sec03__flex-box__table th{
        padding-bottom: 5px;
        border-bottom: none;
    }
    .about-sec03__flex-box__table td{
        padding-top: 0;
    }
    .about-sec03__flex-box__table td ul li{
        padding-left: 15px;
    }
    .about-sec03__flex-box__table td ul li::before{
        width: 6px;
        height: 6px;
        top: 9px;
    }
    .about-sec04__map iframe{
        height: 250px;
    }



    /* PRIVACY POLICY */
    .privacy-sec{
        font-size: 14px;
    }
    .privacy-sec .sin-ul>li{
        margin-bottom: 50px;
    }

    
    /* FORM */
    .contact-sec__text{
        text-align: left;
    }
    .form-wrap table,
    .form-wrap table tr,
    .form-wrap table tbody{
        display: block;
    }
    .wpcf7 table{
        border-collapse: collapse;
        border-spacing: 0;
    }
    .wpcf7 table th,
    .wpcf7 table td{
        width: 100%;
        display: block;
        white-space: normal;
        font-size: 14px;
    }
    form input[type="text"], form input[type="email"], form input[type="tel"], form input[type="number"], form textarea{
        width: 100%;
    }
}