@media (max-width: 768px) {
    .header-main .main-menu {
        position: fixed;
        width: 295px;
        flex-direction: column;
        top: 0px;
        padding: 0;
        margin-top: 0px;
        padding-top: 70px;
        color: #000;
        background-color: #0061fc;
        right: -150vw;
        transition: right 0.5s;
        justify-content: start;
        display: block;
        height: 100vh;
        z-index: 2;
        overflow: hidden;
        border-radius: 0;
    }
    .header-main .main-menu::after {
        content: "";
        width: 100%;
        height: calc(100% - 55px);
        top: 55px;
        background-image: url(../images/index/bg-header.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        z-index: -1;
        left: 0;
    }
    header .main-menu {
        overflow-y: hidden;
    }
    body.menu-open header:before {
        display: none;
    }
    .box-slide-banner {
        margin-top: 140px;
    }
    .menu-open .header-main .main-menu {
        right: 0;
        z-index: 10;
        overflow: hidden;
        margin-right: 0;
    }
    nav.navbar.nav-main {
        overflow-y: scroll;
        height: 100%;
        max-height: calc(100vh - 80px);
        position: relative;
        margin-top: 0;
        padding-bottom: 145px;
        width: 100%;
        padding-left: 40px;
        padding-right: 15px;
    }
    .logo-left .logo {
        width: 240px;
    }
    a.menu-btn::after {
        content: 'MENU';
        left: calc(50%);
        transform: translateX(-50%);
        top: 38px;
        position: absolute;
        color: #756522;
        width: max-content;
        font-size: 1.6rem;
        text-align: center;
        font-family: acumin-pro-extra-condensed, sans-serif;
        font-weight: bold;
        padding-left: 2px;
        color: #0061fc;
    }
    a.menu-btn.open:after {
        content: "CLOSE";
    }
    .main-menu li.nav-item {
        width: 100%;
        padding-bottom: 0;
    }
    .main-menu li.nav-item a {
        color: #fff;
        font-size: 1.6rem;
    }
    .main-menu .nav-main>.nav {
        gap: 25px;
    }
    .box-banner-home {
        min-height: 460px;
        padding-top: 240px;
    }
    .box-link-banner {
        position: static;
        margin: 15px 25px 0;
        border-radius: 8px;
        padding: 17px 23px;
    }
    .banner-home::after {
        width: calc(100% - 25px);
        height: 127px;
        top: 100px;
    }
    .banner-home::before {
        width: calc(100% - 25px);
        height: 127px;
        top: 335px;
    }
    .banner-home-cont {
        max-width: 300px;
    }
    a.btn.btn-banner span {
        width: 100%;
        min-height: 55px;
        font-size: 1.8rem;
        padding-left: 72px;
        margin-bottom: 8px;
    }
    a.btn.btn-banner span::before {
        width: 35px;
        height: 35px;
        left: 17px;
    }
    a.btn.btn-banner span::after {
        width: 17px;
        height: 17px;
        right: 18px;
    }
    .list-social {
        display: none;
    }
    #banner-home::after {
        height: 734px;
        background-image: url(../images/recruit/bg-banner-sm.png);
    }
    #banner-home {
        padding-bottom: 50px;
    }
    ul.tabs-nav {
        flex-wrap: wrap;
        gap: 10px;
    }
    ul.tabs-nav li {
        width: calc(33.33% - 7px);
        font-size: 1.3rem;
        padding-bottom: 8px;
    }
    .news-item.item-list {
        padding: 10px 16px;
        flex-wrap: wrap;
    }
    .news-item.item-list .title {
        width: 100%;
        flex: unset;
        margin-left: 0;
        margin-top: 8px;
    }
    .date {
        font-size: 1.5rem;
        margin-right: 10px;
    }
    a.cat {
        MIN-width: 97px;
        height: 20px;
        font-size: 1.2rem;
    }
    a.btn.btn-main {
        max-width: 225px;
        min-height: 50px;
        font-size: 1.5rem;
        padding-left: 30px;
    }
    a.btn.btn-main::after {
        width: 22px;
        height: 22px;
        right: 15px;
    }
    .main-title-en img {
        height: 62px;
    }
    .main-title-jp {
        font-size: 1.8rem;
        margin-top: 15px;
    }
    .main-title.has-line {
        padding-bottom: 15px;
    }
    .main-title.has-line::after {
        width: 40px;
        height: 2px;
    }
    .img-home-message {
        padding: 0;
        margin: 0 -25px;
    }
    .img-home-message img {
        max-width: 100%;
    }
    .container {
        padding-left: 25px;
        padding-right: 25px;
    }
    .home-message::after {
        background-image: url(../images/recruit/bg-message-sm.png);
    }
    .slide-initiative .slick-slide {
        transform: scale(1);
        padding: 0 15px;
        margin: 0;
    }
    .slide-initiative .slick-list {
        margin: 0 -15px;
        overflow: hidden;
    }
    .slide-initiative .slick-slide .slide-item-ini-inner {
        top: 0;
    }
    .img-slide-ini {
        max-width: 242px;
        margin: 0 auto;
    }
    .num-slide {
        font-size: 6.5rem;
        left: 30px;
    }
    .title-slide-ini {
        font-size: 1.8rem;
        padding: 20px 0;
    }
    .slide-item-ini-inner p {
        line-height: 1.73;
        letter-spacing: 0;
    }
    .home-initiative ul.slick-dots {
        gap: 15px;
        bottom: -45px;
    }
    .home-initiative ul.slick-dots li {
        width: 10px;
        height: 10px;
    }
    .home-initiative::before {
        height: 223px;
        bottom: 125px;
    }
    .home-initiative::after {
        height: 170px;
    }
    button.slide-arrow {
        left: -15px;
        width: 35px;
        height: 35px;
        top: 80px;
    }
    button.slide-arrow.next-arrow {
        right: -15px;
    }
    .column-sm-reverse {
        flex-direction: column-reverse;
    }
    .main-title.center-sm {
        text-align: center;
    }
    .main-title.center-sm::after {
        left: 50%;
        transform: translateX(-50%);
    }
    .img-home-job {
        padding-right: 15px;
    }
    .img-home-job::after {
        left: 15px;
        top: 15px;
        width: calc(100% - 15px);
    }
    .title-border {
        font-size: 1.7rem;
    }
    .title-border::after {
        width: 226px;
        height: 2px;
    }
    .box-slide-voice {
        margin-left: -30px;
        margin-right: -30px;
    }
    .slide-voice .slick-dots {
        bottom: -35px;
    }
    .slide-voice .slick-dots li {
        width: 10px;
        height: 10px;
        margin: 0 5px;
    }
    .slide-voice button.slide-arrow {
        top: unset;
        transform: translateX(-50%);
        left: 30%;
        bottom: -48px;
    }
    .slide-voice button.slide-arrow.next-arrow {
        transform: translateX(-50%);
        left: 70%;
    }
    .slide-voice .slick-list {
        margin: 0 -20px;
    }
    .slide-voice .slick-slide {
        padding: 0 20px;
    }
    .home-voice-video::after {
        width: 480px;
        height: 400px;
    }
    .home-voice-video {
        padding-bottom: 100px;
    }
    .img-slide-voice img {
        height: 203px;
        width: 100%;
        object-fit: cover;
    }
    .home-voice-video::before {
        width: 214px;
        height: 170px;
        right: -50px;
        bottom: -120px;
    }
    .scroll-slide {
        width: 360vw;
    }
    .scroll-slide .scroll-item {
        width: 33%;
        margin: 0 5px;
    }
    .slide-company-item:nth-child(2n) {
        margin-top: 18px;
    }
    .slide-company-item img {
        border-radius: 8px;
    }
    .scroll-swraper {
        padding-top: 60px;
    }
    .scroll-swraper::after {
        height: 95px;
        top: 10px;
    }
    .box-link-entry {
        flex-direction: column;
    }
    .box-link-entry a.btn-banner {
        margin: 0;
        border-radius: 8px 8px 0 0;
        width: 100%;
    }
    .box-link-entry a.btn-banner p {
        min-height: 85px;
        padding-left: 100px;
    }
    .box-link-entry a.btn-banner:nth-child(2) {
        border-radius: 0 0 8px 8px;
    }
    .box-link-entry a.btn-banner p {
        font-size: 2.3rem;
        padding-bottom: 20px;
    }
    .box-link-entry a.btn-banner p span {
        font-size: 1.3rem;
    }
    .box-link-entry a.btn-banner p span span {
        font-size: 1.6rem;
        top: 0;
    }
    .box-link-entry a.btn-banner p::before {
        width: 50px;
        height: 50px;
        left: 27px;
    }
    .box-link-entry a.btn-banner p::after {
        width: 24px;
        height: 24px;
        right: 30px;
    }
    .home-entry::after {
        height: 575px;
        top: auto;
        bottom: -23px;
    }
    .box-footer-cont::after {
        width: calc(100% - 26px);
        height: calc(100% - 15px);
        left: 13px;
        border-radius: 10px;
    }
    .box-footer-cont {
        padding-top: 25px;
        padding-bottom: 35px;
    }
    .footer-wrap {
        padding: 0 5px;
    }
    .footer-copyright {
        padding: 40px 0 0;
        text-align: center;
        font-family: acumin-pro-extra-condensed, sans-serif;
    }
    .footer-2 {
        display: none;
    }
    .footer-link-img a {
        width: 100%;
        background-color: #fff;
        border-radius: 5px;
        text-align: center;
    }
    a.btn.btn-link {
        min-height: 50px;
        font-size: 1.5rem;
    }
    a.btn.btn-link::before {
        width: 25px;
        height: 25px;
    }
    a.btn.btn-link::after {
        width: 22px;
        height: 22px;
    }
    .link-tel-fax>* {
        font-size: 2.7rem;
        text-align: left;
    }
    .link-tel-fax {
        text-align: left;
    }
    .ft-sns {
        justify-content: flex-start !important;
        gap: 13px;
    }
    .ft-sns a {
        margin: 0;
    }
    .footer-content {
        gap: 30px;
    }
    .footer-link-img a img {
        height: 50px;
    }
    .page-header-cont {
        min-height: 156px;
        padding-top: 85px;
    }
    .title-jp {
        font-size: 1.9rem;
    }
    .title-en {
        font-size: 5.4rem;
        opacity: .7;
        bottom: -55px;
    }
    section.page-header {
        padding-bottom: 65px;
    }
    .page-header::before {
        height: 156px;
        width: calc(50% + 26px);
        border-bottom-left-radius: 55px;
        background-position: center left;
    }
    .page-header::after {
        height: 470px;
        background-image: url(../images/rec/bg-page-sm.png);
        width: 100%;
    }
    .title-entry {
        height: 120px;
    }
    .img-title-entry {
        height: 128px;
    }
    .img-title-entry img {
        width: auto;
        height: 100%;
    }
    .title-entry-jp {
        font-size: 2.3rem;
    }
    .box-chu-02-left {
        padding: 0 0 20px;
    }
    .box-img-chu h3 {
        font-size: 1.4rem;
    }
    .box-img-chu p {
        font-size: 1.3rem;
        text-align: left;
        line-height: 1.34;
    }
    .box-img-chu {
        padding: 15px 15px;
    }
    .box-img-chu p br {
        display: none;
    }
    .box-img-chu::after {
        height: 150px;
    }
    .icon-img-chu img {
        width: 73px;
    }
    .voice-item {
        padding: 0;
    }
    .img-voice {
        padding: 0 33px 0;
        margin-top: 15px;
    }
    #senpai-voice .cat {
        width: 65px;
        height: 65px;
        font-size: 1.5rem;
        top: 12px;
        left: 10px;
        margin: 0;
    }
    .cat-voice-2 {
        font-size: 1.4rem;
        min-width: 120px;
        min-height: 26px;
    }
    #senpai-voice .title {
        font-size: 1.8rem;
        line-height: 1.37;
        padding-bottom: 35px;
    }
    .voice-item .detail {
        margin: 0;
        bottom: -45px;
        width: fit-content;
        padding: 20px 10px;
    }
    div#slide-voice-sm {
        width: 100%;
        margin: 0;
    }
    div#slide-voice-sm>* {
        width: auto;
        padding: 0;
    }
    div#slide-voice-sm button.slide-arrow {
        position: absolute;
        width: 40px;
        height: 40px;
        top: 300px;
    }
    #senpai-voice .voice-item {
        padding-bottom: 45px;
    }
    div#slide-voice-sm .slick-dots {
        width: 100%;
    }
    div#slide-voice-sm .slick-dots li button {
        background-color: #d1d1d1;
    }
    div#slide-voice-sm .slick-dots li.slick-active button {
        background: #0061fc;
    }
    .box-profile-cross {
        padding: 40px 23px;
    }
    .list-profile {
        flex-direction: column;
        gap: 45px;
    }
    .profile-top {
        gap: 15px;
    }
    .img-profile {
        width: 90px;
    }
    .position {
        min-width: 80px;
        min-height: 21px;
        font-size: 1.2rem;
        padding-bottom: 0px;
        line-height: 1;
    }
    .deparment {
        font-size: 1.3rem;
        margin-top: 4px;
    }
    .name {
        font-size: 1.6rem;
        line-height: 1;
    }
    .year-join {
        font-size: 1rem;
        margin-top: 5px;
    }
    .profile-info p {
        font-size: 1.3rem;
        line-height: 1.53;
    }
    .box-profile-cross::after {
        border-width: 2px;
        left: 7px;
        top: 7px;
    }
    .title-cross {
        font-size: 1.6rem;
        padding-left: 40px;
        margin-bottom: 10px;
        font-family: 'Noto Sans JP', sans-serif;
        line-height: 1.18;
    }
    .title-cross::after {
        width: 32px;
        height: 3px;
        top: 8px;
    }
    .box-flex-cross {
        gap: 15px;
        margin-bottom: 20px;
    }
    .title-flex-left {
        font-size: 1.4rem;
    }
    .box-flex-right p {
        font-size: 1.3rem;
        line-height: 1.73;
    }
    .box-text-cross-left {
        padding: 0;
    }
    .cross-01-2 {
        padding: 30px 0 35px;
    }
    .row-reverse .box-text-cross-left {
        padding: 0;
    }
    .row-reverse .box-text-cross-left .title-cross {
        margin-right: 0;
    }
    .cross-01-2::after {
        display: none;
    }
    .title-profile {
        font-size: 4.5rem;
        top: -20px;
    }
    .list-select {
        flex-wrap: wrap;
        gap: 17px 5px;
    }
    .select-item {
        gap: 10px;
        width: calc(50% - 3px);
    }
    .select-item:first-child {
        width: 50%;
        gap: 10px;
    }
    .list-select select {
        width: 120px;
    }
    .box-text-policy p {
        font-size: 12px;
    }
    .box-text-policy {
        padding: 10px;
        max-height: 82px;
    }
    #senpai-voice .title::after {
        width: 100%;
        height: 18px;
        background-image: url(../images/recruit/bg-cs-sm.png);
        bottom: 0;
    }
    .img-voice-inner img {
        height: auto;
    }
    .img-voice-inner {
        max-width: 190px;
        margin: 0 auto;
    }
    .img-voice-inner::after {
        left: 12px;
        top: 12px;
    }
    #senpai-infor .infor-inner {
        flex-direction: column-reverse;
    }
    .right-inner-1 {
        padding: 0;
    }
    .senpai-phrase p {
        font-size: 1.8rem;
    }
    .senpai-phrase {
        padding-bottom: 35px;
        margin-bottom: 20px;
    }
    .senpai-phrase::after {
        width: 100%;
        height: 18px;
    }
    .left-inner a.cat {
        width: 60px;
        height: 60px;
        font-size: 1.3rem;
        top: 18px;
        left: -20px;
    }
    #senpai-infor .infor-inner>.left {
        width: 100%;
        /* margin: 0 20px; */
    }
    #senpai-infor .left-inner {
        margin: 0 20px;
    }
    .right-inner-2 {
        padding: 20px 0 0;
    }
    a.btn.btn-cs {
        min-height: 50px;
        font-size: 1.4rem;
        padding-left: 18px;
    }
    a.btn.btn-cs::after {
        width: 24px;
        height: 6px;
        right: 16px;
    }
    .post-content h2 {
        font-size: 1.5rem;
        margin: 25px 0 20px;
    }
    .title-flow-en {
        font-size: 5.5rem;
    }
    .title-flow-jp {
        font-size: 1.5rem;
    }
    .box-step-flow {
        border-width: 7px;
        padding: 20px 24px;
        flex-wrap: wrap;
        margin-bottom: 30px;
        gap: 10px;
        align-items: center;
        flex-wrap: wrap;
    }
    .step-flow-num {
        font-size: 3.4rem;
        width: auto;
    }
    .name-flow {
        font-size: 1.5rem;
        margin-bottom: 0;
    }
    .content-flow {
        width: 100%;
        flex: unset;
    }
    .step-flow-right {
        width: 100%;
        flex: unset;
    }
    .list-flow-step::after {
        left: 70px;
        bottom: -70px;
        width: 22px;
    }
    .footer-logo {
        max-width: 255px;
    }
    .environment-item .text {
        font-size: 1.3rem;
        margin-top: 5px;
    }
    .environment-item .title {
        font-size: 1.8rem;
    }
    .js-scrollable img {
        width: 740px;
        max-width: 740px;
    }
    section#rec-03 h3,
    section#rec-03 p {
        font-family: yu-gothic-pr6n, sans-serif;
    }
    body.page-chu .anchor-list {
        margin: 0 -10px;
    }
    .list-profile::after {
        top: 50%;
        transform: translate(-50%, -50%);
        width: 35px;
        height: 22px;
    }
    #banner-home::before {
        content: "";
        width: 100%;
        height: 65px;
        background-image: url(../images/recruit/after-banner.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        bottom: 250px;
        left: 0;
    }
    section#home-voice-video .main-title-en img {
        height: 43px;
    }
    #home-voice-video .main-title-jp {
        margin-top: 10px;
    }
    .main-title.flex {
        flex-direction: column;
        gap: 0;
    }
    .footer-3 {
        margin-top: 0;
    }
    .slide-voice-info-nav {
        position: static;
    }
    .box-slide-voice-info {
        padding: 0;
    }
    .box-slide-voice-info .title {
        font-size: 1.8rem;
        padding-bottom: 30px;
    }
    .box-slide-voice-info .title br {
        display: none;
    }
    .voice-init-2 {
        padding: 0 35px;
    }
    .voice-init-2 .img-voice {
        padding-left: 22px;
        padding-bottom: 48px;
    }
    .voice-init-2 .cat {
        width: 65px;
        height: 65px;
        font-size: 1.5rem;
        top: 10px;
    }
    .voice-init-2 .voice-item .detail {
        bottom: 0;
    }
    .voice-init-2 button.slide-arrow {
        left: -28px;
        top: 50%;
        transform: translateY(-50%);
    }
    .voice-init-2 button.slide-arrow.next-arrow {
        left: unset;
        right: -28px;
    }
    .voice-init-2 .img-voice-inner {
        max-width: unset;
    }
    .box-slide-voice-info .title::after {
        width: 100%;
        height: 17px;
        background-image: url(../images/recruit/bg-cs-sm.png);
        bottom: 0;
    }
    .voice-init-2 .slick-dots {
        bottom: 0;
    }
    .voice-init-2 .slick-dots li button {
        background-color: #d1d1d1;
    }
    .voice-init-2 .slick-dots li.slick-active button {
        background-color: #0061fc;
    }
    .voice-init-2 .slick-dots li {
        margin: 0 4px;
    }
    .home-voice::after {
        width: 360px;
        height: 338px;
        left: -140px;
        top: -20px;
    }
    .img-slide-voice iframe {
        width: 100%;
        height: 200px;
    }
    .main-menu-text {
        font-size: 180px;
        line-height: 1;
        font-family: acumin-pro-extra-condensed, sans-serif;
        font-weight: 700;
        font-style: normal;
        position: absolute;
        left: 0;
        color: #B7B7B7;
        opacity: 0.2;
        top: -40px;
    }
    .nav.nav-2.nav-btn.show-for-small {
        gap: 35px;
        height: auto;
        margin: 0;
    }
    .nav-btn .btn-item {
        margin-bottom: 0;
    }
    .nav.nav-2.nav-btn.show-for-small {
        gap: 25px;
        height: auto;
        margin: 0;
    }
    .nav-btn .btn-item {
        margin-bottom: 0;
    }
    a.menu-btn.open {
        background-color: transparent;
    }
    a.menu-btn.open span {
        background-color: #fff;
        top: 34px;
    }
    a.menu-btn.open:after {
        content: "";
    }
    .right-inner-1 .senpai-cat a.cat {
        min-width: 120px;
        min-height: 26px;
        font-size: 1.4rem;
    }
    .page-senpai #senpai-voice .title {
        padding-bottom: 35px;
    }
    .home-message::before {
        width: 100%;
        height: 500px;
        bottom: auto;
        top: 120px;
    }
    section#rec-03 .title-style-1 {
        font-size: 2.2rem;
    }
    .environment-item.v2.row-reverse .col-12.large-6.text-box {
        padding-left: 15px;
        padding-right: 15px;
    }
    .title-bottom {
        font-size: 1.8rem;
        line-height: 1.2;
    }
    .toggle-rec .toggle-hd {
        min-height: 50px;
        font-size: 1.4rem;
        padding-left: 20px;
    }
    .toggle-rec .toggle-hd::after {
        width: 25px;
        height: 25px;
        right: 20px;
    }
    .manage-cont h2 {
        font-size: 1.4rem;
        margin: 10px 0;
    }
    .box-border {
        padding: 30px 20px;
    }
    ul.list-dot li {
        font-size: 1.4rem;
    }
    .step-rec-left {
        width: 100px;
    }
    .step-rec-right {
        padding: 15px;
        position: static;
    }
    .step-rec-right h3 {
        font-size: 1.5rem;
        line-height: 1.2;
    }
    .step-rec-right ul.list-dot li {
        font-size: 1.3rem;
    }
    .step-rec-right::after {
        width: 28px;
        height: 33px;
        bottom: -45px;
    }

    /* ===== Sonota SP ===== */
    .container-sonota {
        margin-top: 40px;
        padding-top: 30px;
        margin-bottom: 0;
    }
    .sonota-item .text{
        font-size: 13px;
    }
    .sonota-item .text .small{
        font-size: 12px;
    }

}