.fadein {
    opacity : 0;
    transform: translateY(20px);
    transition: all 1s;
}

html {
    font-size: 100%;
    /* overflow-x: hidden; */
}

body {
    width: 100%;
    /* overflow-x: hidden; */
    min-height: 100vh;
    position: relative;
    font-family: 'Noto Sans', sans-serif;
}




a {
    text-decoration: none;
}

img {
    max-width: 100%;
    vertical-align: bottom;
}

li {
    list-style: none;
}

.container {
    margin-left: 300px;
    padding: 0 16px;
}

.wrapper {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}


.section_title {
    position: relative;
    margin-bottom: 80px;
    text-align: center;
    display: block;
    padding: 0 40px;
}

h3.section_title .en {
    display: block;
    font-size: 18px;
    letter-spacing: 1px;
    color: #3399ff;
    padding-bottom: 10px;
}

.section_title .ja {
    display: block;
    font-size: 48px;
    letter-spacing: 6px;
    color: #000;
} 


/* header */


#header {
    position: fixed;
    top: 0;
    z-index: 1000;
    width: 100%;
    height: 100px;
    background-color: #fff;
    padding: 0 30px;
    display: flex;
    align-items: center;
    box-shadow: 0 0 8px 4px #ccc;
}

#header .site_title {
    width: 300px;
}

#header .site_title a {
    display: block;
}

.header_inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}


.contact_form_button {
    display: flex;
    gap: 20px;
    margin-right: 30px;
    border-radius: 20px;
}

.contact_form {
    background-color: #3399ff;
    border: 1px solid #3399ff;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 8px 4px #ccc;
    padding: 0 3rem 0 5rem;
    background-image: url(../img/メールの無料アイコンその8.png);
    background-repeat: no-repeat;
    background-size: 25px;
    height: 50px;
    line-height: 50px;
    background-position: 2.2rem center;
}

.contact_form:hover {
    border: 1px solid #3399ff;
    background-color: #fff;
    color: #3399ff;
    background-image: url(../img/メールの無料アイコンその8のコピー.png);
    transition: all 0.8s;
}


.line_contact_form {
    background-color: #06C755;
    border: 1px solid #06C755;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    padding: 0 3rem;
    border-radius: 10px;
    box-shadow: 0 0 8px 4px #ccc;
    height: 50px;
    line-height: 50px;
}

.line_contact_form:hover {
    border: 1px solid #06C755;
    background-color: #fff;
    color: #06C755;
    transition: all 0.8s;
}

/* toggle_btn */


.toggle_btn_box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 70px;
    height: 70px;
    flex-shrink: 0;
    margin-left: auto;
}

button.toggle_btn_box::before {
    content: "";
    background: #3399ff;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.toggle_btn_box:hover::before {
    transform: scale(1.1);
    transition: 0.5s;
}

/* active クラスが付いた時の背景色 */
.toggle_btn_box.active::before {
    background: #616161;
}

.toggle_btn {
    width: 30px;
    height: 30px;
    transition: all 0.5s;
    cursor: pointer;
    position: relative;
}

.toggle_btn span {
    display: block;
    background-color: #fff;
    border-radius: 3px;
    position: absolute;
    width: 100%;
    height: 3px;
    left: 0;
    transition: all 0.5s;
}



.toggle_btn span:nth-child(1) {
    top: 8px;
}

.toggle_btn span:nth-child(2) {
    top: 18px;
}


.toggle_btn.active span:nth-child(1) {
    transform: rotate(35deg);
    top: 13px;
}

.toggle_btn.active span:nth-child(2) {
    transform: rotate(-35deg);
    top: 13px;
}

.toggle_btn_box span {
    font-size: 10px;
    color: #fff;
}

.toggle_btn_box .menu,
.toggle_btn_box .close {
    position: relative;
    font-weight: 700;
    line-height: 1;
}

.toggle_btn_box .close {
    display: none;
}

/* .active が付いたら .menu を非表示、.close を表示 */
.toggle_btn_box.active .menu {
    display: none;
}
.toggle_btn_box.active .close {
    display: inline;
}


/* #navi */


#navi {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    /* background-color: rgba(131, 175, 218); */
    background-color: #3399ff;
    margin-top: 100px;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

#navi.active {
    opacity: 1;
    visibility: visible;
    position: fixed;
    top: 0;
    left: 0;
}

#navi .menu_list {
    margin: 80px 0 40px 0;
}

#navi .menu_list li {
    margin-bottom: 32px;
    font-size: 24px;
}

#navi .menu_list li a {
    color: #fff;
    transition: all 0.5s;
    filter: drop-shadow(1px 1px 10px #c0c0c0);
}

#navi .menu_list li:hover a {
    opacity: 0.8;
}

#navi .btn {
    width: 300px;
    border: solid 2px #fff;
    color: #fff;
    display: block;
    font-size: 20px;
    font-weight: bold;
    padding: 20px 0;
    margin: 0 auto;
    position: relative;
    transition: 0.5s ease-in-out;
}

  /* ボタンの右と下の線は疑似要素で設定 */
#navi .btn::after {
    content: "";
    width: 300px;
    border-right: solid 2px #fff;
    border-bottom: solid 2px #fff;
    padding: 15px 0;
    position: absolute;
    right: -10px;
    bottom: -10px;
}
#navi .btn:hover {
    background-color: #fff;
    color: #3399ff !important;
}

#navi .btn:active {
    position: relative;
    top: 10px;
    left: 10px;
}

#navi .btn:active:after {
    position: relative;
    top: -10px;
    left: -10px;
}



/* mainvisual */


.mainvisual {
    margin-bottom: 200px;
    padding-top: 100px;
    position: relative;
}


.mainvisual .text {
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%,-55%);
    text-align: center;
    color: white;
    z-index: 10;
}

.mainvisual .text .main_title {
    display: flex;
    justify-content: center; /* 中央寄せ */
    font-size: 70px;
    font-weight: bold;
    filter: drop-shadow(1px 1px 10px #c0c0c0);
    white-space: nowrap;
}

.mainvisual .text .main_title span {
    display: inline-block;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    padding-right: 10px;
}

.mainvisual .text .main_title span:last-child {
    padding-right: 0;
}

.mainvisual .text .main_title span:nth-child(3) {
    color: #3399ff;
}

.mainvisual .text .main_title span:nth-child(4) {
    color: #ff9933;
}

.mainvisual .text .main_title span:nth-child(5) {
    color: #3399ff;
}

.mainvisual .text .main_title span:nth-child(6) {
    color: #ff9933;
}



.main-visual-slider {
    height: 87.5vh;
    margin-inline: auto;
    overflow: hidden;
    /* width: 100vw; */
    width: 100%;
}

.slick-img img {
    width: 100%;
    height: 100vh;
    object-fit: cover; 
}

@keyframes zoomUp {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.15);
    }
}

.add-animation {
    animation: zoomUp 10s linear 0s normal both;
}


/* about */



#about .section_title {
    margin-bottom: 100px;
}


.about_wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    max-width: 1300px;
    margin: 0 auto;
    flex-wrap: nowrap;
}

.about_wrapper .bear_left {
    width: 145px;
    height: auto;
}


.about_wrapper .bear_right {
    width: 130px;
    height: auto;
}


.about_text_one {
    flex: 1;
    text-align: center;
    padding-top: 70px;
    font-size: 26px;
    font-weight: bold;
}




.about_text_item {
    padding-bottom: 40px;
}

.about_text_two {
    /* margin-top: 100px;
    margin-bottom: 60px; */
    /* text-align: center; */
    font-size: 24px;
    line-height: 2;
    max-width: 1000px;
    margin: 100px auto 60px;
}


.about_text_two .about_text_item {
    letter-spacing: 0.1em;

}





#about .about_img_text {
    display: flex;
    margin-bottom: 80px;
}

#about .about_img_text .img_left {
    width: 55%;
}

#about .about_img_text .img_left img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border-radius: 10px;
}

#about .about_img_text .text_right {
    width: 45%;
    padding: 0 5%;
    font-size: 18px;
    color: #333;
}

.about_text_title {
    font-size: 24px;
    padding-bottom: 20px;
}

#about .about_img_text .text_right p {
    padding-bottom: 20px;
    font-size: 16px;
}



.fadein_content_left {
    opacity: 0;
    transform: translate3d( -10px, -10px, 0) rotate( 0.5deg) skew( 0deg, 1.8deg);
    transition: 0.8s;
}

.fadein_content_right {
    opacity: 0;
    transform: translate3d( 10px, 10px, 0) rotate( -0.5deg) skew( 0deg, -1.8deg);
    transition: 0.8s;
}


.fadein_content {
    opacity: 1;
    transform: translate(0px) rotate( 0deg) skew( 0deg, 0deg);
    visibility: visible;
}



/* ease_of_work_btn */

.ease_of_work_button {
    margin-bottom: 60px;
}


.ease_of_work_btn {
    color: #000;
    font-size: 30px;
    position: relative;
}

.ease_of_work_btn:hover {
    color: #3399ff;
    transition: all 0.5s;
}

/* .ease_of_work_btn::after {
    content: "";
    width: 50%;
    height: 1.2px;
    background: #E0E0E0;
    position: absolute;
    top: 23px;
    left: 490px;
} */


/* about_links */

#about .about_links {
    background-color: rgba(51, 153, 255, 0.5);
    padding-top: 80px;
    padding-bottom: 10px;
}

#about .about_links .about_links_list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px 80px;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 60px;
}

#about .about_links .about_links_list a.about_link_item {
    position: relative;
    border-bottom: 2px solid #3399ff;
    color: #fff;
    padding: 15px;
    transition: color 0.5s ease;
}

#about .about_links .about_links_list a.about_link_item:hover {
    /* background-color: rgba(131, 175, 218, 0.8); */
    background-color: #fff;
    border-radius: 8px;
}

#about .about_links .about_links_list .about_link_item:hover {
    border-bottom: none;
    transition: all 0.5s;
}

#about .about_links .about_links_list a.about_link_item:hover{
    color: #3399ff;
    transition: all 0.5s;
}


#about .about_links .about_links_list .about_link_item a {
    z-index: 10;
}

.about_link_item {
    z-index: 1;
    color: #000;
}


.about_link_item:hover {
    color: #fff;
}

.about_link_item:hover::before {
    color: #fff;
}


.arrow {
    align-items: center;
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 35px;
    height: 35px;
    line-height: 1;
    /* background-color: #3399ff; */
    border-radius: 50%;
    overflow: hidden;
}

span.arrow {
    background-color: #fff;
}

#about .about_links .about_links_list a.about_link_item:hover span.arrow {
    background-color: #3399ff;
}

#about .about_links .about_links_list a.about_link_item:hover span.arrow:before {
    animation-name: transformRightLeft;
    color: #fff;
}

#about .about_links .about_links_list a.about_link_item:hover span.arrow:after {
    animation-name: transformLeftRight;
    animation-delay: 0.2s;
    color: #fff;
}


span.arrow:before,
span.arrow:after {
    width: 100%;
    content: "→";
    position: absolute;
    top: 5px;
    left: 4px;
    animation-fill-mode: forwards;
    animation-duration: 0.6s;
    color: #3399ff;
}

.arrow:after {
    transform: translateX(-100%);
}


@keyframes transformLeftRight {
    0% {
    transform: translateX(-100%);
    }
    100% {
    transform: translateX(0);
    }
}
@keyframes transformRightLeft {
    0% {
    transform: translateX(0);
    }
    100% {
    transform: translateX(100%);
    }
}



.about_btn {
    display: inline-block;
    width: fit-content;
    margin: 0 auto;
    padding: 24px 160px;
    border-radius: 30px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    z-index: 1;
    position: relative;
    transition: all 0.5s;
}

.about_btn::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 30px;
    box-sizing: border-box;
    z-index: -1;
    transform: scale(0.8);
    opacity: 0;
    transition: transform ease 0.3s, opacity 0.3s;
}

a.about_btn {
    background-color: #ff9933;
}

a.about_btn::before {
    border: 2.4px solid #ff9933;
}

.about_btn .arrow_w {
    align-items: center;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    line-height: 1;
    overflow: hidden;
}

a.about_btn:hover {
    color: #ff9933;
    background: #fff;
}

.about_btn:hover::before {
    transform: scale(1);
    opacity: 1;
}

a.about_btn:hover .arrow_w:before {
    animation-name: transformRightLeft;
    color: #ff9933;
}

a.about_btn:hover .arrow_w:after {
    animation-name: transformLeftRight;
    animation-delay: 0.2s;
    color: #ff9933;
}

.arrow_w:before,
.arrow_w:after {
    width: 100%;
    content: "→";
    position: absolute;
    top: 5px;
    left: 4px;
    animation-fill-mode: forwards;
    animation-duration: 0.6s;
    color: #fff;
}

.arrow_w:after {
    transform: translateX(-100%);
}



/* job_vacancies */

#job_vacancies {
    position: relative;
    padding: 60px 0;
    /* background-image: url(../img/4f8fbdbf4bed7c502d74aa05378aab95.png); */
    background-size: cover;
    background-position: center;
    z-index: 0;
    overflow: hidden;   
}

#job_vacancies::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 1;
}

#job_vacancies > * {
    position: relative;
    z-index: 2;
}

#job_vacancies .about_links_list {
    max-width: 1300px;
    margin: 0 auto;
    padding: 0 40px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 50px 40px;
    font-size: 26px;
    font-weight: bold;
    margin-bottom: 80px;
}

#job_vacancies .about_links_list a.about_link_item {
    position: relative;
    /* border-bottom: 2px solid #fff; */
    padding: 30px;
    transition: color 0.5s ease;
    background-color: #3399ff;
    border-radius: 8px;
}

#job_vacancies .about_links_list a {
    /* color: #8c8c8c; */
    color: #fff;
} 

#job_vacancies .about_links_list a.about_link_item:hover {
    background-color: rgba(51, 153, 255, 0.2);
    border-radius: 8px;
}

#job_vacancies .about_links_list .about_link_item:hover {
    border-bottom: none;
    transition: all 0.5s;
}

#job_vacancies .about_links_list .about_link_item:hover {
    color: #3399ff;
    transition: all 0.5s;
}


#job_vacancies .about_links_list .about_link_item a {
    z-index: 10;
}

.about_link_item {
    z-index: 1;
    color: #000;
}


.about_link_item:hover {
    color: #fff;
}

.about_link_item:hover::before {
    color: #fff;
}


#job_vacancies .about_links_list .arrow {
    align-items: center;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    line-height: 1;
    /* background-color: #83AFDA; */
    border-radius: 50%;
    overflow: hidden;
}

#job_vacancies .about_links_list span.arrow {
    background-color: #fff;
}

#job_vacancies .about_links_list .about_link_item:hover span.arrow {
    background-color: #3399ff;
}

#job_vacancies .about_links_list a.about_link_item:hover span.arrow:before {
    animation-name: transformRightLeft;
    color: #fff;
}

#job_vacancies .about_links_list a.about_link_item:hover span.arrow:after {
    animation-name: transformLeftRight;
    animation-delay: 0.2s;
    color: #fff;
}


#job_vacancies span.arrow:before,
#job_vacancies span.arrow:after {
    width: 100%;
    content: "→";
    position: absolute;
    top: 10px;
    left: 9px;
    animation-fill-mode: forwards;
    animation-duration: 0.6s;
    color: #3399ff;
}

.arrow:after {
    transform: translateX(-100%);
}


@keyframes transformLeftRight {
    0% {
    transform: translateX(-100%);
    }
    100% {
    transform: translateX(0);
    }
}
@keyframes transformRightLeft {
    0% {
    transform: translateX(0);
    }
    100% {
    transform: translateX(100%);
    }
}



.about_btn {
    background-color: #83AFDA;
    display: block;
    width: fit-content;
    margin: 0 auto;
    padding: 24px 160px;
    border-radius: 30px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    z-index: 1;
    position: relative;
    transition: all 0.5s;
}

.about_btn::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 2.4px solid #83AFDA;
    border-radius: 30px;
    box-sizing: border-box;
    z-index: -1;
    transform: scale(0.8);
    opacity: 0;
    transition: transform ease 0.3s, opacity 0.3s;
}

.about_btn .arrow_w {
    align-items: center;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    line-height: 1;
    overflow: hidden;
}

.about_btn:hover {
    color: #83AFDA;
    background: #fff;
}

.about_btn:hover::before {
    transform: scale(1);
    opacity: 1;
}

.about_btn:hover .arrow_w:before {
    animation-name: transformRightLeft;
    color: #83AFDA;
}

.about_btn:hover .arrow_w:after {
    animation-name: transformLeftRight;
    animation-delay: 0.2s;
    color: #83AFDA;
}

.arrow_w:before,
.arrow_w:after {
    width: 100%;
    content: "→";
    position: absolute;
    top: 5px;
    left: 4px;
    animation-fill-mode: forwards;
    animation-duration: 0.6s;
    color: #fff;
}

.arrow_w:after {
    transform: translateX(-100%);
}



/* employee_benefits */

section#employee_benefits {
    background-color: rgba(51, 153, 255, 0.5);
    padding: 60px 0;
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-bottom: 160px;
}


.slider_wrapper {
    /* overflow: hidden; */
    width: 100%;
    position: relative;
}



#employee_benefits .employee_benefits_text {
    text-align: center;
    font-size: 26px;
    color: #fff;
    padding: 0 20px 100px 20px;
}

.illust_slider.infinite-scroll {
    display: flex;
    justify-content: center;
    gap: 20px;
    animation: scroll-left 40s linear infinite;
    /* この中の .card が並ぶ */
}

@keyframes scroll-left {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-70%);
    }
}




#employee_benefits .illust_slider {
    display: flex;
    gap: 20px;
    white-space: norwrap;
    width: max-content;
    margin-bottom: 80px;
}


#employee_benefits .illust_slider .card {
    background-color: #fff;
    width: 250px;
    width: 250px;
    height: 250px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    border-radius: 10px;
    /* box-shadow: 0 0 9px 3px #ccc; */
    margin: 0 20px;
    position: relative;
    z-index: 1;
    align-items: center;
}

#employee_benefits .illust_slider .card:hover {
    transform: scale(1.1);
    transition: transform 0.3s ease;
    z-index: 10; /* スライド内で前面に */

}


#employee_benefits .illust_slider a {
    color: #3399ff;
    font-weight: bold;
    font-size: 18px;
}


.card img {
    padding-bottom: 20px;
    width: 40%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.card p {
    position: absolute;
    bottom: 25px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;

}





/* blog */

#blog {
    margin-bottom: 100px;
}

#blog .blogs {
    /* display: flex;
    justify-content: space-between;
    gap: 25px; */
    margin-bottom: 80px;
}

#blog .blogs .blog_item {
    box-shadow: 0 0 8px 4px #ccc;
    transition: all 0.5s;
    border-radius: 8px;
    background: #f5f5f5;
    overflow: hidden;
    width: 100%; /* グリッドの幅いっぱい使う */
    box-sizing: border-box;
}

#blog .blogs .blog_item:hover {
    transform: scale(1.05);
}

#blog .blogs .blog_item a {
    width: 100%;
    color: #333;
}

#blog .blogs .blog_item img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

#blog .blogs .blog_item .blog_text {
    padding: 30px;
    font-size: 16px;
}

#blog .blogs .blog_item .blog_text h4 {
    padding-bottom: 20px;
    font-size: 18px;
}


.about_btn {
    margin-bottom: 80px;
}



div.button_container {
    background-color: #3399ff;
    padding: 100px 0;
}

.button_jobopenings img {
    width: 60px;
    height: auto;
    
}

.button_jobopenings {
    background-color: #fff;
    display: block;
    width: fit-content;
    margin: 0 auto;
    padding: 30px 100px;
    border-radius: 10px;
    color: #333;
    font-weight: bold;
    z-index: 1;
    position: relative;
    transition: all 0.5s;
    display: flex;
    align-items: center;
    /* justify-content: center; */
    font-size: 32px;
    justify-content: space-between;
}

.button_jobopenings:hover {
    color: #3399ff;
    transform: scale(1.1);
}

.jobopenings_text {
    padding-left: 30px;
}





/* about.html */

/* .main_about {
    margin-bottom: 80px;
} */

.about_visual {
    margin-top: 100px;
    position: relative;
}

.about_visual .about_image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    object-position: top;
    display: block;
}

.about_visual .aboutus_title {
    display: block;
    text-align: center;
    position: relative;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    filter: drop-shadow(1px 1px 10px #c0c0c0);
}

.about_visual .aboutus_title .en {
    display: block;
    font-size: 24px;
}

.about_visual .aboutus_title .ja {
    display: block;
    font-size: 44px;
}









/* section_wrapper */

.section_wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    scroll-padding: 120px;
}



/* 働く環境 */

/* left_container */



.left_container {
    position: absolute;
    /* top: 120px;
    left: max(50vw - 620px, 8vw); */   
    width: 350px;
    height: calc(100%);
    /* background-image: url(../img/4f8fbdbf4bed7c502d74aa05378aab95.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center; */
    /* z-index: 0;
    overflow: hidden; */
    padding: 115px 70px 100px 90px;
}


.left_container::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 1;
    background-image: repeating-linear-gradient(
    45deg,/* 斜めの角度 */
    #83AFDA 0px,/* 青線の開始 */
    #83AFDA 10px,/* 青線の終了 → 太さ10px */
    transparent 10px,/* 白線の開始（青の終わりと同じ位置） */
    transparent 20px/* 白線の終了 → 太さ10px */
    );
    opacity: 0.2;
}

.left_container > * {
    position: relative;
    z-index: 2;
}


.left_container .left_container_list {
    position: sticky;
    top: 120px;
    width: 100%;
    max-width: 350px;
}

.left_container .left_container_list li {
    padding-bottom: 20px;
    font-size: 18px;
}

.left_container .left_container_list li a {
    color: #000;
}

.left_container .left_container_list .list_text {
    position: relative;
    transition: color 0.3s;
}

.left_container .left_container_list .list_text::before {
    content: "";
    position: absolute;
    left: -16px;
    top: 30%;
    transform: translateY(-50%);
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #3399ff !important;
    opacity: 0;
    transition: opacity 0.3s, background-color 0.3s;
}

.left_container .left_container_list .list_text.active::before {
    opacity: 1;
    background-color: #3399ff !important;
}

.left_container .left_container_list .list_text.active a {
    color: #3399ff;
    font-weight: bold;
}


.left_container .left_container_list .list_title {
    font-size: 22px;
    padding-bottom: 40px;
    position: relative;
    font-weight: bold;
}

.left_container .left_container_list .list_title::after {
    content: "";
    width: 125px;
    height: 1px;
    position: absolute;
    background: #000;
    top: 16px;
    right: -47px;
}




.left_container .left_container_list .list_title_of_work {
    font-size: 22px;
    padding-bottom: 40px;
    position: relative;
    font-weight: bold;
}

.left_container .left_container_list .list_title_of_work::after {
    content: "";
    width: 50px;
    height: 1px;
    position: absolute;
    background: #000;
    top: 16px;
    right: -50px;
}

.left_container .left_container_list .list_title_about_us {
    font-size: 22px;
    padding-bottom: 40px;
    position: relative;
    font-weight: bold;
}

.left_container .left_container_list .list_title_about_us::after {
    content: "";
    width: 80px;
    height: 1px;
    position: absolute;
    background: #000;
    top: 16px;
    right: -55px;
}



/* .section_wrapper_about */



.section_wrapper_about {
    display: flex;
    flex-direction: column;
    /* gap: 120px; */
    padding: 0 max(50vw - 620px, 8vw) 120px calc(max(50vw - 620px, 8vw) + 220px + 80px);
    background-color: #fff;
    container-type: inline-size;
}

.section_blue {
    background-color: #83AFDA4D;
}


/* about_title */

.page_title {
    display: block;
    margin-bottom: 40px;
    margin-top: 120px;
}

.page_title .en {
    display: block;
    font-size: 18px;
    padding-bottom: 10px;
    color: #3399ff;
}

.page_title .ja {
    display: block;
    font-size: 42px;
}


#about_title .about_image {
    width: 100%;
    height: 60vh;
    object-fit: cover;
}

#about_title .about_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



.section_about_title {
    padding: 0 0 40px 20px;
    position: relative;
}

.section_about_title::after {
    content: "";
    width: 4px;
    height: 35px;
    background: #3399ff !important;
    position: absolute;
    top: 9px;
    left: 0;
    z-index: 10;
}


.section_about_title .ja {
    font-size: 40px;
    padding-right: 20px;
}

.section_about_title .en {
    color: #3399ff !important;
}


.text_title {
    font-size: 30px;
    font-weight: bold;
    /* padding-bottom: 15px; */
    margin-bottom: 32px;
}



/* .text {
    padding-bottom: 60px;
} */

.about_list_img {
    margin-top: 40px;
    width: 100%;
    /* height: 630px; */
    height: 30vw;
    object-fit: contain;
}

.about_list_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* #concept */

#concept {
    padding-top: 110px;
}


#mission {
    padding-top: 110px;
}

#vision {
    padding-top: 110px;
}

#core_values {
    padding-top: 110px;
}

#principles_of_conduct {
    padding-top: 110px;
}

#promise_of_specialized_support {
    padding-top: 110px;
}


#concept .text {
    margin-bottom: 0;
}

#mission .text {
    margin-bottom: 0;
}

#vision .text {
    margin-bottom: 0;
}

#core_values .text {
    margin-bottom: 0;
}

#principles_of_conduct .text {
    margin-bottom: 0;
}

#promise_of_specialized_support .text {
    margin-bottom: 0;
}





/* core values */

/* #core_values {
    background-color: #83AFDA4D;
} */




/* #core_values .text_title {
    border-bottom: 3px solid #fff;
    padding-bottom: 10px;
} */

#core_values .text {
    padding-bottom: 60px;
}

#core_values .last {
    padding: 0;
}

#principles_of_conduct .text {
    padding-bottom: 60px;
}

#principles_of_conduct .last {
    padding-bottom: 0;
}

#promise_of_specialized_support .text_title {
    border-bottom: 3px solid #fff;
    padding-bottom: 10px;
}

#promise_of_specialized_support .text {
    padding-bottom: 60px;
}

#promise_of_specialized_support .last {
    padding-bottom: 0;
}


/* section_image */


.section_image {
    /* display: flex;
    align-items: stretch; */
    display: grid;
    grid-template-columns: 1fr 1fr;
}


.section_image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}



/* job_vacancies_title */


#job_vacancies_title .job_vacancies_title_img {
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: nowrap;
    width: 100%;
    max-width: 400px;   /* 適度に横幅制限するとバランス◎ */
    margin: 0 auto;
}

#job_vacancies_title .job_vacancies_title_img img {
    /* flex: 1 1 0; */
    width: 100%;
    height: 200px;
    object-fit: contain;
}


/* application_conditions */


.application_conditions {
    margin-bottom: 40px;
}



/* working_hours */


.working_hours {
    margin-bottom: 40px;
}



/* essential_criteria */


.essential_criteria {
    margin-bottom: 40px;
}




/* employee_benefits */



.page_title_welfare {
    margin-bottom: 0;
}

#ease_of_work {
    padding-top: 110px;
}

#communication {
    padding-top: 110px;
}

#improving_skills {
    padding-top: 110px;
}

#holiday_vacation {
    padding-top: 110px;
}

#evaluation {
    padding-top: 110px;
}

#support {
    padding-top: 110px;
}


.employee_benefits {
    margin-bottom: 40px;
}


/* .employee_benefits_items {
    padding-left: 40px;
} */

.employee_benefits_items_list {
    display: flex;
    background-color: #f5f5f5;
    justify-content: space-between;
    border-radius: 10px;

    /* align-items: center; */
}

.employee_benefits_items .item_list {
    padding: 60px 30px;
}

.employee_benefits_text {
    padding-bottom: 40px;
    font-size: 22px;
}

.item_list_text {
    padding-bottom: 20px;
    font-size: 22px;
}

.item_list_text_last {
    font-size: 22px;
}

.ease_of_work {
    position: relative;
}

.communication {
    position: relative;
}

.improving_skills {
    position: relative;
}

.holiday_vacation {
    position: relative;
}

.evaluation {
    position: relative;
}

.support {
    position: relative;
}

/* .employee_benefits_img {
    padding: 100px 60px 0 0;
} */

.employee_benefits_img img {
    width: 100px;
}

.two_lines {
    padding: 60px 80px 0 0;
}

/* .three_lines {
    padding: 170px 80px 0 0;
} */

.four_lines {
    padding: 170px 80px 0 0;
}

/* .employee_benefits_img {
    position: absolute;
    right: 100px;
    bottom: 0;
}

.employee_benefits_img img {
    width: 100px;
}

.communication .employee_benefits_img {
    bottom: -30px;
}

.improving_skills .employee_benefits_img {
    bottom: -30px;
} */


/* porson_in_charge */


.porson_in_charge {
    margin-bottom: 40px;
}


/* nurse */


#nurse {
    padding-top: 110px;
}

#nurse p {
    padding-bottom: 20px;
}

/* #nurse .text_title {
    font-size: 30px;
} */

#nurse .application_conditions .condition_item {
    padding-left: 40px;
    font-size: 20px;
}



#nurse .application_conditions .condition_value {
    padding-bottom: 20px;
    padding-left: 40px;
    font-size: 20px;
}


#nurse .hours_note {
    padding-bottom: 40px;
    font-size: 20px;
}


#nurse .working_hours .hours_example {
    font-size: 20px;
}

.left_wrapper {
    padding-left: 40px;
}


#nurse .working_hours .hours_schedule {
    padding-left: 20px;
    font-size: 20px;
}


.hours_schedule table {
    width: 100%;
    border-collapse: collapse;
}

.hours_schedule td {
    padding: 8px 8px 8px 0;
    vertical-align: top;
    white-space: nowrap; /* 時間の部分を折り返さない */
}

.hours_schedule td:nth-child(2) {
    white-space: normal; /* 説明文は折り返してOK */
}



#nurse .working_hours .hours_schedule .hours_schedule_left {
    width: 50%;
    box-sizing: border-box;
    padding: 4px 0;
}

#nurse .working_hours .hours_schedule .hours_schedule_right {
    width: 20%;
}


#nurse .essential_criteria .full_time {
    font-size: 20px;
    padding-left: 40px;
}

#nurse .essential_criteria .salary {
    font-size: 20px;
    padding-left: 40px;
}


.employee_benefits .ot-benefit {
    font-size: 20px;
    padding-left: 40px;
}

.porson_in_charge .client_count {
    font-size: 20px;
    padding-left: 40px;
}

.porson_in_charge .client_note {
    font-size: 20px;
    padding-left: 40px;
}

.workprice .north_area {
    /* padding-left: 40px; */
    margin-bottom: 40px;
}

.workprice .north_area .work_area {
    font-size: 20px;
}

.work_address,
.work_station {
    padding-left: 40px;
    font-size: 20px;
}



.workprice .arakawa_area .work_area {
    font-size: 20px;
}

.work_note {
    padding-top: 40px;
    font-size: 20px;
}

/* occupational_therapist */

#occupational_therapist {
    padding-top: 110px;
}


/* physiotherapist */

#physiotherapist {
    padding-top: 110px;
}


/* speech_language_hearing_therapist */

#speech_language_hearing_therapist {
    padding-top: 110px;
}



#nursery_teacher {
    padding-top: 110px;
}




#nursery_teacher .ot-hours {
    padding-bottom: 20px;
}


#nursery_teacher .ot-note {
    padding-bottom: 20px;
}

#nursery_teacher .ot-note:last-child {
    padding-bottom: 0;
}

#nursery_teacher .ot-salary {
    padding-bottom: 20px;
}

#nursery_teacher .ot-salary:last-child {
    padding-bottom: 0;
}


#nursery_teacher .ot-benefit {
    padding-bottom: 20px;
}

#nursery_teacher .ot-benefit:last-child {
    padding-bottom: 0;
}

.work_area {
    font-size: 20px;
}

.work_area p {
    padding-bottom: 20px;
}

.work_area p:last-child {
    padding-bottom: 0;
}


#home_care_worker {
    padding-top: 110px;
}


#home_care_worker .ot-hours {
    padding-bottom: 20px;
}

#home_care_worker .ot-hours:last-child {
    padding-bottom: 0;
}


#home_care_worker .ot-note {
    padding-bottom: 20px;
}

#home_care_worker .ot-note:last-child {
    padding-bottom: 0;
}

#home_care_worker .ot-salary {
    padding-bottom: 20px;
    font-size: 20px;
}

#home_care_worker .ot-salary:last-child {
    padding-bottom: 0;
}

#home_care_worker .ot-benefit {
    padding-bottom: 20px;
}

#home_care_worker .ot-benefit:last-child {
    padding-bottom: 0;
}

#home_care_worker .visit_area p {
    padding-bottom: 20px;
    font-size: 20px;
}

#home_care_worker .visit_area p:last-child {
    padding-bottom: 0;
    font-weight: bold;
}





/* employee_benefits */

.flow_of_the_day_wrapper {
    max-width: 900px;
    margin: 0 auto;
    padding: 120px 16px 80px 16px;
}

.flow_of_the_day_wrapper h2 {
    margin-bottom: 40px;
}


.timeline {
    position: relative;
    padding-left: 80px;
    border-left: 2px solid #e0e0e0;
    max-width: 800px;
    margin: 0 auto;
    margin-left: 80px;
}

.timeline-event {
    margin-bottom: 40px;
    position: relative;
}

.timeline-event::before {
    content: "";
    position: absolute;
    left: -22px;
    top: 10px;
    width: 16px;
    height: 16px;
    background-color: #fff;
    border: 3px solid #d0d0d0;
    border-radius: 50%;
}

.time {
    font-weight: bold;
    font-size: 24px;
    color: #555;
}

.title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #333;
}

.description {
    font-size: 20px;
    color: #666;
    padding-top: 4px;
}




/* 働きやすさ */


/* ease_of_work */

#life_style {
    margin-bottom: 20px;
}

.text {
    font-size: 22px;
    margin-bottom: 40px;
}

.ease_of_work_one {
    font-size: 20px;
    margin-bottom: 40px;
}

.ease_of_work_list_title {
    font-size: 26px;
}


.ease_of_work_two {
    font-size: 20px;
    margin-bottom: 40px;
}

.ease_of_work_three {
    font-size: 20px;
    margin-bottom: 40px;
}

.ease_of_work_four {
    font-size: 20px;
    margin-bottom: 40px;
}

.ease_of_work_text {
    font-size: 20px;
    margin-bottom: 40px;
}

.ease_of_work_item_one {
    padding-bottom: 20px;
}

.cricle_title {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 60px;
}

.support_system_item {
    margin-bottom: 60px;
}

.support_system_text {
    padding-bottom: 32px;
    font-size: 22px;
}

.suport_title {
    padding-bottom: 20px;
    font-size: 22px;
}

.suport_text {
    padding-bottom: 40px;
    font-size: 20px;
    /* padding-left: 20px; */
}

.suport_text:last-child {
    padding-bottom: 0;
}


.mentor_system {
    margin-bottom: 60px;
    font-size: 20px;
}

/* .mentor_system_text_one {
    padding-bottom: 20px;
    font-size: 22px;
} */

.mentor_system_text {
    padding-bottom: 20px;
}

.mentor_system_text:last-child {
    padding-bottom: 0;
}


.easy_to_work_with {
    margin-bottom: 60px;
}


.question_list .question_list_title {
    padding-bottom: 32px;
    font-size: 22px;
}


.question {
    margin-bottom: 20px;
    padding-bottom: 5px;
    padding-left: 10px;
    font-size: 22px;
    border-bottom: 1px solid #3399ff !important;
}

.question span {
    color: #3399ff;

}

.question_text {
    padding: 0 0 60px 12px;
    font-size: 20px;
}

.question_text span {
    color: #3399ff;
}

.question_text:last-child {
    padding-bottom: 0;
}

.working_hours_text {
    padding-bottom: 40px;
    font-size: 20px;
}

.working_hours_text:last-child {
    padding-bottom: 0;
}


/* occupational_therapist */


#occupational_therapist p {
    padding-bottom: 20px;
}

#occupational_therapist .application_conditions .ot-condition {
    font-size: 20px;
}

#occupational_therapist .application_conditions .ot-condition-note {
    font-size: 20px;
    line-height: 2;
}


.working_hours .ot-hours,
.working_hours .ot-note {
    /* padding-left: 40px; */
    font-size: 20px;
}

.essential_criteria .essential_criteria_wrapper{
    /* padding-left: 40px; */
    font-size: 20px;
}

.essential_criteria .essential_criteria_wrapper .ot-salary-note {
    margin-bottom: 40px;
}

/* physiotherapist */

#physiotherapist p {
    padding-bottom: 20px;
}

.pt-condition,
.pt-condition-note {
    /* padding-left: 40px; */
    font-size: 20px;
}


/* speech_language_hearing_therapist */


#speech_language_hearing_therapist p {
    padding-bottom: 20px;
}

#speech_language_hearing_therapist p:last-child {
    padding-bottom: 0;
}

.st-condition {
    margin-bottom: 40px;
}

.st-condition,
.st-important,
.st-condition-note {
    font-size: 20px;
}


/* adress_page */

.adress_page {
    display: flex;
    justify-content: center;
    margin-bottom: 60px;
    align-items: center;
}

.adress_page .adress_page_title {
    width: 350px;
}

.adress_page .address_right {
    margin-left: 80px;
}

/* .adress_page .adrres_list {
    font-size: 18px;
} */

.adress_page .address_item {
    text-align: left;
}

.adress_page .address_item dt {
    padding-bottom: 0;
    font-size: 20px;
}

.adress_page .address_item dd {
    padding-bottom: 0;
    font-size: 18px;
}

.adress_page .address_list {
    border-bottom: 2px dotted #c0c0c0;
    margin-bottom: 20px;
    padding-bottom: 20px;
    font-size: 20px;
}





/*  */

.about_visual {
    margin-top: 100px;
    position: relative;
}

.about_visual .about_image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    display: block;
}

.about_visual .aboutus_title {
    display: block;
    text-align: center;
    position: relative;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    color: #fff;
    filter: drop-shadow(1px 1px 10px #c0c0c0);
}

.about_visual .aboutus_title .en {
    display: block;
    font-size: 24px;
}

.about_visual .aboutus_title .ja {
    display: block;
    font-size: 44px;
}


/*  */



/* contact_wrapper*/





.contact_top_visual {
    margin-top: 100px;
    margin-bottom: 40px;
}


.contact_image{
    width: 100%;
    overflow: hidden;

}

.contact_image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    display: inline-block;
}


.line_contact_title_item {
    background-color: #CDF4DD;
    width: 100%;
    text-align: center;
    padding: 80px 20px;
    margin-bottom: 40px;
}

.line_contact_title {
    font-size: 30px;
    margin-bottom: 30px;
}

.line_contact_title span {
    color: #06C755;
}

.line_contact_text {
    margin-bottom: 30px;
    font-size: 18px;
}


.line_contact_button {
    display: inline-block;
    background-color: #06C755;
    border: 1.5px solid #06C755;
    padding: 20px 80px;
    border-radius: 30px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
}

.line_contact_button:hover {
    background-color: #fff;
    border: 1.5px solid #06C755;
    color: #06C755;
    transition: all 0.8s;
}



.contac_flow_text {
    text-align: center;
    margin-bottom: 10px;
}

.add_friend_title {
    margin: 40px 0 30px 0;
    text-align: center;
    font-size: 28px;
}

.add_friend_title span {
    color: #06C755;
}

.add_friend_text{
    text-align: center;
    margin-bottom: 40px;
}

.line_contact_flow {
    max-width: 800px;
    padding: 0 20px;
    margin: 0 auto;
}


.add_friend_flex {
    display: flex;
    justify-content: center;
    text-align: center;
    margin-bottom: 40px;
}

.add_friend_flex .add_friend_flex_item {
    width: 50%;
    border: 5px solid #ccc;
    margin-right: 20px;
    padding: 25px;
}

.add_friend_flex .add_friend_flex_item:last-child {
    margin-right: 0;
}


.add_friend_flex_img {
    width: 120px;
}

.add_friend_flex_item_title {
    font-size: 20px;
    margin: 20px 0;
}

.add_friend_flex_item_text {
    font-size: 14px;
    margin-bottom: 20px;
    padding-left: 15px;
    text-align: left;
}


.first {
    padding-left: 0;
}

.add_friend_last {
    margin-bottom: 0;
}



.add_friend_btn {
    display: inline-block;
    background-color: #06C755;
    padding: 10px 80px;
    border: 1px solid #06C755;
    border-radius: 50px;
    color: #fff;
    font-size: 22px;
    font-weight: bold;
}

.add_friend_btn:hover {
    background-color: #fff;
    color: #06C755;
    border: 1px solid #06C755;
    transition: all 0.5s;
}

.qrcord_flex {
    display: flex;
    align-items: center;
}

.qrcord_flex img {
    width: 100px;
}

.add_friend_text_last {
    font-size: 20px;
    text-align: center;
}


.contact_button_wrapper {
    background-color: #3399ff;
    padding: 60px 20px;
}


.contact_flex_title {
    font-size: 28px;
    color: #fff;
    text-align: center;
    margin-bottom: 5px;
}

.contact_flex_text {
    font-size: 18px;
    color: #fff;
    text-align: center;
    margin-bottom: 20px;
}

.contact_button_flex {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
}


.contact_form_button_flex_item {
    display: inline-block;
    width: 50%;
    text-align: center;
    border: 1.5px solid #fff;
    margin-right: 20px;
    border-radius: 20px;
    color: #fff;
}

.contact_form_flex_btn {
    width: 100%;
    border-radius: 20px;
    display: inline-block;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    height: 80px;
    line-height: 80px;
    /* padding: 0 3rem 0 5rem; */
    /* background-image: url(../img/メールの無料アイコンその8.png); */
    /* background-repeat: no-repeat;
    background-size: 35px;
    height: 80px;
    line-height: 80px;
    background-position: 2.2rem center; */
}

.contact_form_flex_btn::before {
    position: relative;
    top: 7px;
    width: 30px;
    height: 30px;
    content: "";
    background-image: url(../img/メールの無料アイコンその8.png);
    background-size: cover;
    background-repeat: no-repeat;
    display: inline-block;
    margin-right: 1.5rem;
}


.contact_form_button_flex_item:hover {
    border: 1.5px solid #fff;
    transition: all 0.8s;
    background-color: #fff;
    color: #3399ff;
}

.contact_form_flex_btn:hover {
    color: #3399ff;
    transition: all 0.8s;
    background-color: #fff;
}

.contact_form_flex_btn:hover::before {
    background-image: url(../img/メールの無料アイコンその8のコピー.png);
    transition: all 0.8s;
}


.line_button_flex_item {
    display: inline-block;
    width: 50%;
    text-align: center;
    background-color: #06C755;
    border: 1.5px solid #06C755;
    border-radius: 20px;
    color: #fff;
}


.line_contact_flex_btn {
    width: 100%;
    display: inline-block;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    border-radius: 20px;
    padding: 0 3rem;
    height: 80px;
    line-height: 80px;
}

.line_button_flex_item:hover {
    border: 1.5px solid #06C755;
    transition: all 0.8s;
    background-color: #fff;
    color: #06C755;
}


.line_contact_flex_btn:hover {
    color: #06C755;
    transition: all 0.8s;
}




/* .addres_wrapper */

.address_wraper {
    text-align: center;
    /* margin-bottom: 80px; */
}


.address_list iframe {
    width: 70%;
}

.address_list {
    border-bottom: 2px dotted #c0c0c0;
    margin-bottom: 80px;
    text-align: center;
    padding-bottom: 40px;
}

.address_list:last-child {
    margin-bottom: 0;
}

.address_item dt {
    font-weight: bold;
    padding-bottom: 20px;
    font-size: 22px;
    margin-top: 20px;
}

.address_item dd {
    line-height: 2;
    font-size: 20px;
}

.page-map {
    display: none;
}


/* contact_form */

.top_contact_area {
    padding-top: 100px;
}

.top_contact_area .wrapper {
    max-width: 800px;
    padding: 0 20px;
    margin: 0 auto;
}

.maili_contact_title {
    margin-bottom: 60px;
    text-align: center;
}

.maili_contact_title .en {
    display: block;
    font-size: 16px;
    color: #ff9933;
    margin-bottom: 10px;
}

.maili_contact_title .ja {
    display: block;
    font-size: 40px;
    color: #000;

}



.wpcf7-form p {
    margin-bottom: 25px;
}

.wpcf7-form .required {
    background: #f06b00;
    color: #fff;
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 3px;
    margin-left: 8px;
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
    width: 100%;
    max-width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 16px;
}

.wpcf7-form textarea {
    height: 150px;
}

.wpcf7 input[type="submit"],
.wpcf7-submit {
    background-color: #f06b00; /* ボタンの背景色 */
    color: #fff;               /* 文字色 */
    padding: 12px 40px;
    font-size: 16px;
    font-weight: bold;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s;
    display: block;
    margin: 40px auto 0;
}

/* ホバー時のスタイル */
.wpcf7 input[type="submit"]:hover,
.wpcf7-submit:hover {
    background-color: #cc5600;
}



/* footer */

.button_container {
    margin-bottom: 80px;
}

#footer {
    position: absolute;
    left: 0;
    right: 0;
}

.footer_title {
    width: 100%;
    margin: 0 auto;
    text-align: center;
    padding: 0 20px;
}

.footer_title img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    width: 350px;
    height: auto;
}

a#to_top {
    width: 50px;
    height: 50px;
    background-color: #3399ff;
    border: 1px solid #fff;
    border-radius: 50%;
    position: fixed;
    right: 30px;
    bottom: 12px;
    z-index: 9999;
    box-shadow: 0 0 8px 4px #ccc;
}

#to_top::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 18px;
    width: 12px;
    height: 12px;
    margin: auto;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: translateY(2px) rotate(315deg);
    box-sizing: border-box;
}







/*  */


.footer_right {
    display: flex;
    justify-content: center;
    margin-bottom: 60px;
    padding-top: 60px;
}

#footer .footer_right .footer_list {
    display: flex;
    justify-content: center;
    font-size: 18px;
    padding-right: 60px;
}

#footer .footer_right .footer_list:last-child {
    padding-right: 0;
}

.footer_list li {
    padding-right: 60px;
    position: relative;
}

.footer_list li:last-child {
    padding-right: 0;
}

#footer .footer_right .footer_list li a::after {
    content: "";
    display: inline-block;
    border-style: solid;
    border-width: 6px 0 6px 8px;
    border-color: transparent transparent transparent #3399ff;
    display: inline-block;
    width: 0;
    height: 0;
    /* 矢印アイコンの位置を設定 */
    position: absolute;
    top: 50%;
    left: -20px;
    transform: translateY(-50%); /* translateYのみ */
}

#footer .footer_right .footer_list li:last-child {
    padding-right: 0;
}

#footer .footer_right .footer_list li a {
    color: #333;
    transition: all 0.5s;
}

#footer .footer_right .footer_list li:hover a {
    color: #3399ff;
}


#footer p.copy_right {
    text-align: center;
    font-size: 12px;
    color: #fff;
    padding: 30px 0;
    /* background-color: #83AFDA; */
    background-color: rgba(51, 153, 255);
}



/* page-various_service.php */

.various_service_container {
    background-color: #FDFCF9;
}

.various_service_container .page_title {
    margin-bottom: 40px;
}

.introduction_text_item {
    border: 1px solid #83AFDA;
    border-radius: 20px;
    padding: 30px;
    background-color: #fff;
}

.section_wrapper_various_service {
    max-width: 900px;
    margin: 0 auto;
    container-type: inline-size;
    padding: 0 20px 60px 20px;
}

.introduction_text_item {
    margin-bottom: 20px;
}

.introduction_title {
    margin-bottom: 32px;
    color: #3399ff;
}


.information {
    border: 1px solid #83AFDA;
    border-radius: 20px;
    padding: 30px;
    background-color: #fff;
    margin-bottom: 40px;
}

.recruitment_details_title {
    border-bottom: 1px solid #83AFDA;
    padding-bottom: 20px;
}

.grid_item {
    display: flex;
}

.grid_title {
    width: 25%;
    border-bottom: 1px solid #83AFDA;
    padding: 20px 0;
}

.grid_title_last {
    width: 25%;
    padding-top: 20px;
}

.grid_text {
    width: 75%;
    border-bottom: 1px solid #83AFDA;
    padding: 20px 0;
}

.recruitment_text {
    padding-bottom: 10px;
}

.recruitment_text:last-child {
    padding-bottom: 0;
}

.recruitment_text_important {
    padding-top: 20px;
}

.last {
    border-bottom: none;
    padding-bottom: 0;
}


.recruitment_details_map {
    padding: 15px 0;
    width: 100%;
}

.google_access_btn {
    background-color: #fff;
    border: 1px solid #3399ff;
    border-radius: 10px;
    padding: 10px;
    display: inline-block;
    margin-top: 10px;
    color: #3399ff;
    font-size: 12px;
    font-weight: bold;
}

.google_access_btn:hover {
    background-color: #3399ff;
    color: #fff;
    transition: all 0.5s;
}



.button_wrapper {
    border: 1px solid #83AFDA;
    border-radius: 20px;
    padding: 40px;
    background-color: #fff;
    text-align: center;
}

.appry_btn {
    background-color: #ff9933;
    border-radius: 15px;
    display: inline-block;
    padding: 20px 100px;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 0.1rem;
    border: 2px solid #ff9933;
}

.appry_btn:hover {
    color: #ff9933;
    background: #fff;
    border: 2px solid #ff9933;
    transition: all 0.5s;
}




.scroll_button {
    position: fixed;
    z-index: 999;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #FDFCF9;
    border-radius: 5px;
    border: 1px solid #c0c0c0;
    padding: 30px 0 20px 0;
    width: 900px;
    text-align: center;
}

.scroll_button .scroll_btn {
    color: #fff;
    background-color: #ff9933;
    border-radius: 10px;
    border: 2px solid #ff9933;
    display: inline-block;
    padding: 15px 100px;
    font-size: 18px;
    font-weight: bold;
}

.scroll_button .scroll_btn:hover {
    color: #ff9933;
    background: #fff;
    border: 2px solid #ff9933;
    transition: all 0.5s;
}

.scroll_button {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}


.scroll_button.active {
    opacity: 1;
    pointer-events: auto;
    }


/* responsive */

@media (max-width: 1220px) {
    .mainvisual .text .main_title {
        font-size: 60px;
    }

}



@media (max-width: 1100px) {
    .mainvisual .text .main_title {
        display: flex;
        flex-wrap: wrap;
        font-size: 60px;
        letter-spacing: 5px;
    }
    

    .mainvisual .text .main_title span:nth-child(7),
    .mainvisual .text .main_title span:nth-child(12) {
        width: 100%;
        text-align: center;
    }


}


@media (max-width: 1024px) {
    .left_container {
        display: none;
    }
    
    
    .section_wrapper_about {
        padding: 80px;
    }

    /* #about_title img {
        width: 100%;
        height: 450px;
        object-fit: cover;
    } */

    /* .ease_of_work_btn::after {
        content: "";
        width: 40%;
        height: 1.2px;
        background: #E0E0E0;
        position: absolute;
        top: 22px;
        left: 450px;
    } */

    /* .section_image {
        flex-direction: column;
        padding: 0 80px;
        background-color: #83AFDA4D;
    } */
    
    .section_image .section_left_img {
        display: none;
    }
    
    .section_image .section_right_img {
        width: 100%;
        height: 100%;
        margin-bottom: 40px;
    }
    
    .section_image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .about_list_img {
        margin-top: 60px;
        width: 100%;
        /* height: 630px; */
        height: 100%;
        object-fit: contain;
    }


    /* #footer .footer_right .footer_list {
        flex-direction: column;
        
    }
    
    #footer .footer_right .footer_list li {
        padding-right: 0;
        padding-bottom: 20px;
    } */
    



    .footer_right {
        /* display: block; */
        margin-bottom: 60px;
        flex-direction: column;
    }
    
    #footer .footer_right .footer_list {
        padding-right: 0;
        padding-bottom: 40px;
    }

    #footer .footer_right .footer_list:last-child {
        padding-bottom: 0;
    }
    
    
    
    .footer_list li {
        padding-right: 60px;
        position: relative;
    }
    
    
    
}


@media (max-width: 970px) {


.contact_form_button {
    display: none;
}

/* .contact_form {
    background-color: #3399ff;
    border: 1px solid #3399ff;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    padding: 0 3rem 0 5rem;
    border-radius: 10px;
    box-shadow: 0 0 8px 4px #ccc;
    background-image: url(../img/メールの無料アイコンその8.png);
    background-repeat: no-repeat;
    background-size: 25px;
    height: 50px;
    line-height: 50px;
    background-position: 2.2rem center;
}

.contact_form:hover {
    border: 1px solid #3399ff;
    background-color: #fff;
    color: #3399ff;
    background-image: url(../img/メールの無料アイコンその8のコピー.png);
    transition: all 0.8s;
}


.line_contact_form {
    background-color: #06C755;
    border: 1px solid #06C755;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    padding: 0 3rem;
    border-radius: 10px;
    box-shadow: 0 0 8px 4px #ccc;
    height: 50px;
    line-height: 50px;
}

.line_contact_form:hover {
    border: 1px solid #06C755;
    background-color: #fff;
    color: #06C755;
    transition: all 0.8s;
} */

}

@media (max-width: 880px) {
    .mainvisual .text .main_title {
        font-size: 55px;
        letter-spacing: 0;
    }
}



@media (max-width: 768px) {

    
    
    h3.section_title {
        margin-bottom: 40px;
    }

    h3.section_title .en {
        display: block;
        font-size: 12px;
        letter-spacing: 0;
        padding-bottom: 5px;
    }
    
    h3.section_title .ja {
        display: block;
        font-size: 30px;
        letter-spacing: 6px;
        color: #000;
    } 

    #about .section_title {
        margin-bottom: 40px;
    }

    .maili_contact_title {
        margin-bottom: 40px;
    }
    
    .maili_contact_title .en {
        font-size: 12px;
        margin-bottom: 5px;
    }
    
    .maili_contact_title .ja {
        font-size: 30px;
    }
    
    
    /* header */
    
    
    #header {
        height: 75px;   
        padding: 0 15px;
    }

    #header .site_title {
        width: 200px;
        position: relative;
    }
    
    #header .site_title a {
        display: block;
    }
    
    
    /* toggle_btn */
    
    
    .toggle_btn_box {
        width: 60px;
        height: 60px;
        position: fixed;
        right: 20px;
    }
    
    .toggle_btn_box::before {
        content: "";
        background: #83AFDA;
        border-radius: 50%;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }
    
    .toggle_btn_box:hover::before {
        transform: scale(1.1);
        transition: 0.5s;
    }
    
    /* active クラスが付いた時の背景色 */
    .toggle_btn_box.active::before {
        background: #616161;
    }
    
    .toggle_btn {
        width: 25px;
        height: 25px;
        transition: all 0.5s;
        cursor: pointer;
        position: relative;
    }
    
    .toggle_btn span {
        display: block;
        background-color: #fff;
        border-radius: 3px;
        position: absolute;
        width: 100%;
        height: 2px;
        left: 0;
        transition: all 0.5s;
    }
    
    
    
    .toggle_btn span:nth-child(1) {
        top: 6px;
    }
    
    .toggle_btn span:nth-child(2) {
        top: 16px;
    }
    
    
    .toggle_btn.active span:nth-child(1) {
        transform: rotate(35deg);
        top: 11px;
    }
    
    .toggle_btn.active span:nth-child(2) {
        transform: rotate(-35deg);
        top: 11px;
    }
    
    .toggle_btn_box span {
        font-size: 8px;
        color: #fff;
    }
    
    
    /* #navi */
    
    
    #navi {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        margin-top: 75px;
        text-align: center;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }
    
    #navi.active {
        opacity: 1;
        visibility: visible;
        position: fixed;
        top: 0;
        left: 0;
    }
    
    #navi .menu_list {
        margin: 80px 0 40px 0;
    }
    
    #navi .menu_list li {
        margin-bottom: 20px;
        font-size: 18px;
    }
    
    #navi .btn {
        width: 250px;
        display: block;
        font-size: 18px;
        padding: 10px 0;
    }
    
      /* ボタンの右と下の線は疑似要素で設定 */
    #navi .btn::after {
        content: "";
        width: 250px;
        padding: 15px 0;
        position: absolute;
        right: -8px;
        bottom: -8px;
    }
    #navi .btn:hover {
        background-color: #fff;
        color: #83AFDA;
    }
    
    #navi .btn:active {
        position: relative;
        top: 8px;
        left: 8px;
    }
    
    #navi .btn:active:after {
        position: relative;
        top: -8px;
        left: -8px;
    }
    
    
    
    /* mainvisual */
    
    
    .mainvisual {
        margin-bottom: 60px;
        padding-top: 75px;
        position: relative;
    }
    
    
    .mainvisual .text {
        /* text-align: left; */
        width: 80%;
        max-width: 600px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        width: fit-content;
        text-align: left;

    }
    
    .mainvisual .text .main_title {
        display: block; /*flexを解除してブロック要素にする*/
        line-height: 1.4;
        letter-spacing: -5px;
        font-size: 55px;
    }
    
    .mainvisual .text .main_title span {
        display: inline; /* インライン要素にして改行を管理 */
        padding-right: 0;
    }
    
    .mainvisual .text .main_title span:nth-child(7),
    .mainvisual .text .main_title span:nth-child(12) {
        display: block; /* 9文字目と14文字目の後に改行を入れる */
    }
    
    
    .main-visual-slider {
        height: 100vh;
        margin-inline: auto;
        overflow: hidden;
        width: 100vw;
    }
    
    .slick-img img {
        width: 100%;
        height: 100vh;
        object-fit: cover; 
        object-position: center;
    }
    
    @keyframes zoomUp {
        0% {
            transform: scale(1);
        }
    
        100% {
            transform: scale(1.15);
        }
    }
    
    .add-animation {
        animation: zoomUp 10s linear 0s normal both;
    }
    
    
    /* about */
    
    
    #about .section_title {
        margin-bottom: 40px;
    }


.about_wrapper {
    gap: 15px;
    max-width: 700px;
    
}

.about_wrapper .bear_left {
    width: 70px;
}

.about_wrapper .bear_right {
    width: 60px;
}


.about_text_one {
    padding-top: 50px;
    font-size: 12px;
}


.about_text_item {
    padding-bottom: 10px;
}

.about_text_two {
    margin-top: 20px;
    margin-bottom: 40px;
    font-size: 12px;
}


/* .ease_of_work {
    margin-bottom: 40px;
} */

.ease_of_work_btn {
    font-size: 20px;
}

.ease_of_work_btn::after {
    display: none;
}

    
    #about .about_img_text {
        flex-direction: column;
        margin-bottom: 40px;
    }
    
    #about .about_img_text .img_left {
        width: 100%;
        padding: 0 20px;
    }
    
    #about .about_img_text .img_left img {
        width: 100%;
        height: 500px;
        object-fit: cover;
    }
    
    #about .about_img_text .text_right {
        width: 100%;
        padding: 60px 5% 0 5%;
        font-size: 18px;
        color: #333;
    }
    
    .about_text_title {
        font-size: 24px;
        padding-bottom: 20px;
    }
    
    #about .about_img_text .text_right p {
        padding-bottom: 20px;
        font-size: 16px;
    }

    
    
    /* about_links */
    
    #about .about_links {
        padding-top: 20px;
    }
    
    #about .about_links .about_links_list {
        display: grid;
        grid-template-columns: 1fr 1fr;
        padding: 34px 20px;
        gap: 20px;
        font-size: 14px;
        font-weight: bold;
        margin-bottom: 0;
    }


    
    #about .about_links .about_links_list .about_link_item {
        position: relative;
        border-bottom: 1px solid #fff;
        padding: 10px;
    }
    
    #about .about_links .about_links_list .about_link_item:hover {
        background-color: rgba(131, 175, 218, 0.8);
        border-radius: 8px;
    }
    
    #about .about_links .about_links_list .about_link_item:hover {
        border-bottom: none;
        transition: all 0.5s;
    }
    
    #about .about_links .about_links_list .about_link_item:hover a {
        color: #fff;
        transition: all 0.5s;
    }
    
    
    #about .about_links .about_links_list .about_link_item a {
        z-index: 10;
    }
    
    .about_link_item {
        z-index: 1;
        color: #000;
    }
    
    
    .about_link_item:hover {
        color: #fff;
    }
    
    .about_link_item:hover::before {
        color: #fff;
    }
    
    
    .arrow {
        align-items: center;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        width: 25px;
        height: 25px;
        line-height: 1;
        background-color: #83AFDA;
        border-radius: 50%;
        overflow: hidden;
    }
    
    #about .about_links .about_links_list .about_link_item:hover .arrow {
        background-color: #fff;
    }
    
    #about .about_links .about_links_list .about_link_item:hover .arrow:before {
        animation-name: transformRightLeft;
        color: #83AFDA;
    }
    
    #about .about_links .about_links_list .about_link_item:hover .arrow:after {
        animation-name: transformLeftRight;
        animation-delay: 0.2s;
        color: #83AFDA;
    }
    
    
    .arrow:before,
    .arrow:after {
        width: 100%;
        content: "→";
        position: absolute;
        top: 6px;
        left: 5px;
        animation-fill-mode: forwards;
        animation-duration: 0.6s;
        color: #fff;
    }
    
    .arrow:after {
        transform: translateX(-100%);
    }
    
    
    @keyframes transformLeftRight {
        0% {
        transform: translateX(-100%);
        }
        100% {
        transform: translateX(0);
        }
    }
    @keyframes transformRightLeft {
        0% {
        transform: translateX(0);
        }
        100% {
        transform: translateX(100%);
        }
    }
    
    
    
    .about_btn {
        padding: 18px 80px !important;
        font-size: 16px !important;
    }
    
    .arrow_w:before,
    .arrow_w:after {
        top: 7px !important;
        left: 4px;
    }
    
    
    
    /* job_vacancies */

    
    
    #job_vacancies .about_links_list {
        font-size: 18px;
        margin-bottom: 40px;
        grid-template-columns: 1fr 1fr;
        padding: 34px 20px;
        gap: 16px;
    }
    
    #job_vacancies .about_links_list .about_link_item {
        position: relative;
        padding: 20px;
        transition: color 0.5s ease;
        background-color: aliceblue;
        border-radius: 8px;
    }
    
    
    #job_vacancies .about_links_list .about_link_item:hover {
        background-color: rgba(131, 175, 218, 0.8);
        border-radius: 8px;
    }
    
    #job_vacancies .about_links_list .about_link_item:hover {
        border-bottom: none;
        transition: all 0.5s;
    }
    
    #job_vacancies .about_links_list .about_link_item:hover a {
        color: #fff;
        transition: all 0.5s;
    }
    
    
    #job_vacancies .about_links_list .about_link_item a {
        z-index: 10;
    }
    
    .about_link_item {
        z-index: 1;
        color: #000;
    }
    
    
    .about_link_item:hover {
        color: #fff;
    }
    
    .about_link_item:hover::before {
        color: #fff;
    }
    
    #job_vacancies {
        padding: 40px 0 0 0;
    }
    
    
    #job_vacancies .about_links_list span.arrow {
        align-items: center;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        width: 25px;
        height: 25px;
        line-height: 1;
        border-radius: 50%;
        overflow: hidden;
    }
    
    #job_vacancies .about_links_list .about_link_item:hover .arrow {
        background-color: #fff;
    }
    
    #job_vacancies .about_links_list .about_link_item:hover .arrow:before {
        animation-name: transformRightLeft;
        color: #83AFDA;
    }
    
    #job_vacancies .about_links_list .about_link_item:hover .arrow:after {
        animation-name: transformLeftRight;
        animation-delay: 0.2s;
        color: #83AFDA;
    }
    
    
    #job_vacancies span.arrow:before,
    #job_vacancies span.arrow:after {
        width: 100%;
        content: "→";
        position: absolute;
        top: 4px;
        left: 3px;
        animation-fill-mode: forwards;
        animation-duration: 0.6s;
        color: #3399ff;
    }
    
    .arrow:after {
        transform: translateX(-100%);
    }
    
    
    @keyframes transformLeftRight {
        0% {
        transform: translateX(-100%);
        }
        100% {
        transform: translateX(0);
        }
    }
    @keyframes transformRightLeft {
        0% {
        transform: translateX(0);
        }
        100% {
        transform: translateX(100%);
        }
    }
    
    
    
    .about_btn {
        background-color: #83AFDA;
        display: block;
        width: fit-content;
        margin: 0 auto;
        padding: 24px 160px;
        border-radius: 30px;
        color: #fff;
        font-size: 20px;
        font-weight: bold;
        z-index: 1;
        position: relative;
        transition: all 0.5s;
    }
    
    .about_btn::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        border: 2.4px solid #83AFDA;
        border-radius: 30px;
        box-sizing: border-box;
        z-index: -1;
        transform: scale(0.8);
        opacity: 0;
        transition: transform ease 0.3s, opacity 0.3s;
    }
    
    .about_btn .arrow_w {
        align-items: center;
        position: absolute;
        top: 50%;
        right: 20px;
        transform: translateY(-50%);
        width: 30px;
        height: 30px;
        line-height: 1;
        overflow: hidden;
    }
    
    .about_btn:hover {
        color: #83AFDA;
        background: #fff;
    }
    
    .about_btn:hover::before {
        transform: scale(1);
        opacity: 1;
    }
    
    .about_btn:hover .arrow_w:before {
        animation-name: transformRightLeft;
        color: #83AFDA;
    }
    
    .about_btn:hover .arrow_w:after {
        animation-name: transformLeftRight;
        animation-delay: 0.2s;
        color: #83AFDA;
    }
    
    .arrow_w:before,
    .arrow_w:after {
        width: 100%;
        content: "→";
        position: absolute;
        top: 5px;
        left: 4px;
        animation-fill-mode: forwards;
        animation-duration: 0.6s;
        color: #fff;
    }
    
    .arrow_w:after {
        transform: translateX(-100%);
    }
    
    
    
    /* employee_benefits */
    
    #employee_benefits {
        background-color: #83AFDA4D;
        padding: 40px 0;
        width: 100%;
        overflow: hidden;
        position: relative;
        margin-bottom: 40px;
    }

    /* .employee_benefits_wrapper {
        max-width: 600px;
        margin: 0 auto;
        padding: 0 20px;
    } */
    
    #employee_benefits .employee_benefits_text {
        padding-bottom: 0;
        text-align: center;
        font-size: 18px;
    }
    
    

    #employee_benefits .illust_slider {
        padding: 50px;
    }
    

    #employee_benefits .illust_slider.infinite-scroll {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
        gap: 60px;
        animation: none !important;
        width: 100% !important;
        white-space: normal !important;
    }

    
      /* 複製した要素を非表示に */
    .illust_slider.infinite-scroll .duplicate {
        display: none !important;
    }

    #employee_benefits .illust_slider .card {
        margin: 0;
        width: 100%;
        aspect-ratio: 1 / 1;
        height: 100%;
    }

    .illust_slider.infinite-scroll .card img {
        margin: 0 auto;
    }
    
    .illust_slider.infinite-scroll .card p {
        position: static;
        transform: none;
        margin-top: 10px;
        white-space: normal;
    }

    
    
    /* blog */
    
    #blog {
        margin-bottom: 60px;
    }
    
    #blog .blogs {
        flex-direction: column;
        gap: 25px;
        margin-bottom: 40px;
    }
    
    #blog .blogs .blog_item {
        width: 100%;
        box-shadow: 0 0 8px 4px #ccc;
        border-radius: 10px;
        transition: all 0.5s;
    }
    
    #blog .blogs .blog_item:hover {
        transform: scale(1.05);
    }
    
    #blog .blogs .blog_item a {
        color: #333;
    }
    
    #blog .blogs .blog_item img {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }
    
    #blog .blogs .blog_item .blog_text {
        padding: 40px;
    }
    
    #blog .blogs .blog_item .blog_text h4 {
        padding-bottom: 20px;
    }
    
    
    .about_btn {
        margin-bottom: 40px;
    }
    
    
    
    .button_container {
        background-color: #83AFDA;
        padding: 80px 0;
    }
    
    .button_jobopenings img {
        width: 40px;
        height: auto;
        
    }
    
    .button_jobopenings {
        background-color: #fff;
        display: block;
        width: fit-content;
        margin: 0 auto;
        padding: 20px 80px;
        border-radius: 30px;
        color: #333;
        font-weight: bold;
        z-index: 1;
        position: relative;
        transition: all 0.5s;
        display: flex;
        align-items: center;
        /* justify-content: center; */
        font-size: 24px;
        justify-content: space-between;
    }
    
    .button_jobopenings:hover {
        color: #83AFDA;
        transform: scale(1.1);
    }
    
    .jobopenings_text {
        padding-left: 30px;
    }
    

    .section_wrapper_about {
        padding: 0 20px;
    }


    .about_visual .aboutus_title {
        left: 25px; /* 画面の左から20pxに配置 */
        top: 50%;
        transform: translateY(-50%); /* 上下中央揃え（横の中央揃えは解除） */
        text-align: left;
    }

    .about_visual .aboutus_title .en {
        font-size: 18px;
    }

    .about_visual .aboutus_title .ja {
        font-size: 28px;
    }

    

    /* わたしたちについて */


    .about_visual {
        margin-top: 75px;
        position: relative;
    }
    
    .about_visual .about_image img {
        height: 250px;
    }

    .about_visual .aboutus_title {
        
        text-align: left;
    }

    .about_visual .aboutus_title .en {
        font-size: 16px;
    }

    .about_visual .aboutus_title .ja {
        font-size: 32px;
    }



    .page_title {
        margin-bottom: 30px;
    }

    .page_title .en {
        font-size: 14px;
    }


    .page_title .ja {
        font-size: 32px;
    }



    .section_about_title {
        padding: 0 0 40px 15px;
    }

    .section_about_title .ja {
        font-size: 24px;
        padding-right: 20px;
    }

    .section_about_title .en {
        color: #83AFDA;
        font-size: 12px;
    }

    .section_about_title::after {
        content: "";
        width: 3px;
        height: 20px;
        background: #83AFDA;
        position: absolute;
        top: 4px;
        left: 0;
        z-index: 10;
    }

    .text_title {
        font-size: 18px;
        font-weight: bold;
        padding-bottom: 0;
        margin-bottom: 40px;
    }

    .text {
        font-size: 14px;
    }

    #about_title .about_image {
        width: 100%;
        height: 50vw;
        object-fit: cover;
    }
    
    #about_title .about_image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }



    #concept {
        padding-top: 115px;
    }

    #mission {
        padding-top: 115px;
    }

    #vision {
        padding: 115px 0 60px 0;
    }

    #core_values {
        padding: 115px 0 60px 0;
    } 

    #core_values .text {
        padding-bottom: 40px;
    }

    #core_values .last {
        padding-bottom: 0;
    }

    #principles_of_conduct {
        padding: 115px 0 40px 0;
    }

    #principles_of_conduct .text {
        padding-bottom: 40px;
    }

    #principles_of_conduct .last {
        padding-bottom: 0;
    }

    .about_list_img {
        margin-top: 20px;
    }

    #promise_of_specialized_support {
        padding-top: 115px;
    }

    #promise_of_specialized_support .text {
        padding-bottom: 40px;
    }

    #promise_of_specialized_support .last {
        padding-bottom: 0;
    }

    #promise_of_specialized_support .about_list_img {
        margin-bottom: 40px;
    }

    .section_image {
        grid-template-columns: 1fr;
        padding: 0 20px;
        background-color: #83AFDA4D;
    }

    .section_image img {
        padding-bottom: 40px;
    }


    /* 働く環境 */

    .page_title_welfare {
        margin-bottom: 0;
    }

    #ease_of_work {
        padding-top: 90px;
    }
    
    #communication {
        padding-top: 90px;
    }
    
    #improving_skills {
        padding-top: 90px;
    }
    
    #holiday_vacation {
        padding-top: 90px;
    }
    
    #evaluation {
        padding-top: 90px;
        margin-bottom: 60px;
    }
    
    #support {
        padding-top: 90px;
    }
    
    
    .employee_benefits {
        margin-bottom: 40px;
    }


    
    .employee_benefits_text {
        padding-bottom: 20px;
        font-size: 18px;
    }

    .employee_benefits_items .item_list {
        padding: 30px 15px;
    }

    .item_list_text {
        padding-bottom: 20px;
        font-size: 18px;
    }

    .item_list_text_last {
        font-size: 18px;
    }
    

    .employee_benefits_img img {
        width: 70px;
    }
    
    .two_lines {
        padding: 35px 40px 0 0;
    }
    
    .three_lines {
        padding: 80px 40px 0 0;
    }
    
    .four_lines {
        padding: 100px 40px 0 0;
    }

    



    /* 求人募集 */


    .application_conditions {
        margin-bottom: 20px;
    }

    #nurse .application_conditions .condition_item {
        font-size: 16px;
        padding-bottom: 5px;
    }

    #nurse .application_conditions .condition_value {
        font-size: 16px;
        padding-bottom: 5px;
    }


    .working_hours {
        margin-bottom: 40px;
    }

    #nurse {
        padding: 90px 0 45px 0;
    }

    #nurse p {
        padding-bottom: 0;
    }

    #nurse .application_conditions .condition_item  {
        padding-left: 20px;
    }

    #nurse .application_conditions .condition_value  {
        padding-left: 20px;
    }


    #nurse .hours_note {
        padding-bottom: 20px;
        font-size: 16px;
    }

    #nurse .working_hours .hours_example {
        font-size: 16px;
    }

    #nurse .working_hours .hours_schedule {
        font-size: 16px;
    }

    .essential_criteria {
        margin-bottom: 40px;
    }


    #nurse .essential_criteria .full_time {
        font-size: 16px;
        padding-left: 20px;
    }

    #nurse .essential_criteria .salary {
        font-size: 16px;
        padding-left: 20px;
    }

    .left_wrapper {
        padding-left: 20px;
    }


    .employee_benefits {
        margin-bottom: 40px;
    }

    .employee_benefits .ot-benefit {
        font-size: 16px;
        padding-left: 20px;
    }

    .porson_in_charge {
        margin-bottom: 40px;
    }

    .porson_in_charge .client_count {
        font-size: 16px;
        padding-left: 20px;
    }

    .porson_in_charge .client_note {
        font-size: 16px;
        padding-left: 20px;
    }


    .workprice .north_area {
        margin-bottom: 20px;
    }

    .workprice .north_area .work_area {
        font-size: 16px;
    }

    .work_address,
    .work_station {
        font-size: 14px;
        padding-left: 10px;
    }

    .workprice .arakawa_area .work_area {
        font-size: 16px;
    }

    .work_note {
        padding-top: 20px;
        font-size: 16px;
    }


    #occupational_therapist {
        padding: 90px 0 45px 0;
    }

    #occupational_therapist p {
        padding-bottom: 0;
    }

    #occupational_therapist .application_conditions .ot-condition {
        font-size: 16px;
        padding-bottom: 10px;
    }

    #occupational_therapist .application_conditions .ot-condition-note {
        font-size: 16px;
        line-height: 1.5;
    }

    .working_hours .ot-hours {
        font-size: 16px;
    }

    .working_hours .ot-note {
        font-size: 16px;
    }

    .essential_criteria .essential_criteria_wrapper {
        font-size: 16px;
    }


    #physiotherapist {
        padding: 90px 0 45px 0;
    }

    #physiotherapist p {
        padding-bottom: 0;
    }

    .pt-condition, .pt-condition-note {
        font-size: 16px;
    }

    #speech_language_hearing_therapist {
        padding-top: 90px;
        padding-bottom: 40px;
    }

    #speech_language_hearing_therapist p {
        padding-bottom: 0;
    }

    .st-condition, .st-important, .st-condition-note {
        font-size: 16px;
    }


    #nursery_teacher {
        padding-bottom: 45px;
    }

    #nursery_teacher .text {
        font-size: 16px;
    }

    #nursery_teacher .ot-hours {
        padding-bottom: 10px;
        font-size: 16px;
    }

    #nursery_teacher .ot-note {
        padding-bottom: 10px;
        font-size: 16px;
    }

    #nursery_teacher .ot-salary {
        padding-bottom: 10px;
    }

    #nursery_teacher .ot-benefit {
        padding-bottom: 10px;
    }

    .work_area p {
        font-size: 16px;
        padding-bottom: 10px;
    }


    #home_care_worker {
        padding-bottom: 45px;
    }

    #home_care_worker .text {
        font-size: 16px;
    }

    #home_care_worker .ot-hours {
        padding-bottom: 10px;
        font-size: 16px;
    }

    #home_care_worker .ot-note {
        padding-bottom: 10px;
        font-size: 16px;
    }



    #home_care_worker  .ot-salary {
        font-size: 16px;
        padding-bottom: 10px;
    }

    #home_care_worker .ot-benefit {
        padding-bottom: 10px;
    }

    #home_care_worker .visit_area p {
        font-size: 16px;
        padding-bottom: 10px;
    }



    .flow_of_the_day_wrapper {
        max-width: 900px;
        margin: 0 auto;
        padding: 50px 16px 80px 16px;
    }
    
    .flow_of_the_day_wrapper h2 {
        margin-bottom: 40px;
    }
    
    
    .timeline {
        position: relative;
        padding-left: 40px;
        border-left: 2px solid #e0e0e0;
        max-width: 800px;
        margin: 0 auto;
        margin-left: 0;
    }


    .timeline-event::before {
        content: "";
        position: absolute;
        left: -22px;
        top: 6px;
        width: 16px;
        height: 16px;
        background-color: #fff;
        border: 3px solid #d0d0d0;
        border-radius: 50%;
    }


    .time {
        font-weight: bold;
        font-size: 20px;
        color: #555;
    }
    
    .title {
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 5px;
        color: #333;
    }
    
    .description {
        font-size: 16px;
        color: #666;
        padding-top: 4px;
    }

    /* 
    


.timeline-event {
    margin-bottom: 40px;
    position: relative;
}

.timeline-event::before {
    content: "";
    position: absolute;
    left: -22px;
    top: 10px;
    width: 16px;
    height: 16px;
    background-color: #fff;
    border: 3px solid #d0d0d0;
    border-radius: 50%;
}

} */





    /* 働く環境 */

    .text {
        font-size: 14px;
        margin-bottom: 0;
    }

    .ease_of_work_one {
        font-size: 16px;
        padding-top: 20px;
        margin-bottom: 40px;
    }

    .ease_of_work_list_title {
        padding-bottom: 20px;
        font-size: 16px;
    }

    .ease_of_work_two {
        font-size: 16px;
        margin-bottom: 40px;
    }

    .ease_of_work_three {
        font-size: 16px;
        margin-bottom: 40px;
    }

    .ease_of_work_four {
        font-size: 16px;
        margin-bottom: 40px;
    }

    .ease_of_work_text {
        font-size: 16px;
        margin-bottom: 40px;
    }

    .support_system_item {
        margin-bottom: 40px;
        font-size: 16px;
    }

    .cricle_title {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 40px;
    }

    .support_system_text {
        font-size: 18px;
    }

    .suport_title {
        padding-bottom: 20px;
        font-size: 16px;
    }

    .suport_text {
        
        font-size: 16px;
    }


    .mentor_system_text {
        padding-bottom: 20px;
        font-size: 16px;
    }

    .mentor_system {
        margin-bottom: 40px;
    }


    .easy_to_work_with {
        margin-bottom: 40px;
    }

    .question_list .question_list_title {
        font-size: 18px;
    }

    .question_list_title {
        font-size: 16px;
        padding-bottom: 40px;
    }

    .question {
        margin-bottom: 10px;
        font-size: 16px;
    }

    .question_text {
        font-size: 14px;
    }

    .working_hours_text {
        font-size: 16px;
    }

    .actual_working_hours {
        padding-bottom: 40px;
    }

    /* .employee_benefits_img {
        position: absolute;
        right: 20px;
        bottom: 0;
    }
    
    .employee_benefits_img img {
        width: 100%;
    } */


    /* adress_page */

.adress_page {
    flex-direction: column;
    justify-content: center;
    margin-bottom: 0;
}

.adress_page .adress_page_title {
    width: 350px;
    margin-bottom: 40px;
}

.adress_page .address_right {
    margin-left: 0;
}

.adress_page .address_item {
    text-align: center;
}

.adress_page .address_item dt {
    padding-bottom: 0;
    font-size: 20px;
}

.adress_page .address_item dd {
    padding-bottom: 0;
    font-size: 18px;
}

.adress_page .address_list {
    border-bottom: 2px dotted #c0c0c0;
    margin-bottom: 40px;
    padding-bottom: 20px;
}

.adress_page .address_list:last-child {
    margin-bottom: 0;
}






/* line_contact_page */



.contact_top_visual {
    margin-top: 75px;
    margin-bottom: 40px;
}



.line_contact_title_item {
    padding: 60px 20px;
    margin-bottom: 20px;
}

.line_contact_title {
    font-size: 24px;
    margin-bottom: 20px;
}


.line_contact_text {
    margin-bottom: 20px;
    font-size: 14px;
}


.line_contact_button {
    border: 1px solid #06C755;
    padding: 20px 80px;
    border-radius: 30px;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
}



.contac_flow_text {
    font-size: 14px;
    margin-bottom: 0;
}

.add_friend_title {
    margin: 20px 0 20px 0;
    font-size: 20px;
}

.add_friend_text{
    font-size: 14px;
    margin-bottom: 20px;
}

.line_contact_flow {
    max-width: 800px;
    padding: 0 20px;
    margin: 0 auto;
}


.add_friend_flex {
    flex-direction: column;
    margin-bottom: 20px;
    text-align: left;
}

.add_friend_flex .add_friend_flex_item {
    width: 100%;
    border: 5px solid #ccc;
    margin-right: 0;
    padding: 20px;
    position: relative;
    margin-bottom: 20px;
}



.add_friend_flex_img {
    position: absolute;
    right: 1.5rem;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 22%;
    max-width: 100px;
}

.add_img_two {
    display: none;
}

.add_friend_flex_item_title {
    font-size: 20px;
    margin: 0 0 10px 0;
}

.add_friend_flex_item_text {
    font-size: 14px;
    margin-bottom: 20px;
    padding-left: 15px;
    text-align: left;
    width: 70%;
}

.first {
    padding-left: 0;
}

.add_friend_last {
    width: 100%;
}


.add_friend_btn {
    padding: 10px 80px;
    font-size: 16px;
    width: 60%;
    text-align: center;
}



.add_friend_text_last {
    font-size: 16px;
    text-align: center;
}


.contact_button_wrapper {
    padding: 20px 20px;
}


.contact_flex_title {
    font-size: 20px;
}

.contact_flex_text {
    font-size: 14px;
    margin-bottom: 20px;
}

.contact_button_flex {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
    flex-direction: column;
}


.contact_form_button_flex_item {
    width: 100%;
    margin-right: 0;
    margin-bottom: 20px;
    border-radius: 10px;
}

.contact_form_flex_btn {
    width: 100%;
    padding: 20px;
    border-radius: 10px;
    font-size: 18px;
    margin-bottom: 0;
    padding: 0;
}



.line_button_flex_item {
    width: 100%;
    border-radius: 10px;
}


.line_contact_flex_btn {
    font-size: 18px;
    padding: 20px;
    color: #fff;
    border-radius: 10px;
    padding: 0;
}




/*  */
/* .contact_form_flex_btn {
    width: 100%;
    border-radius: 20px;
    display: inline-block;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    padding: 0 3rem 0 5rem;
    background-image: url(../img/メールの無料アイコンその8.png);
    background-repeat: no-repeat;
    background-size: 35px;
    height: 80px;
    line-height: 80px;
    background-position: 2.2rem center;
}

.contact_form_button_flex_item:hover {
    border: 1.5px solid #fff;
    transition: all 0.8s;
    background-color: #fff;
    color: #3399ff;
}

.contact_form_flex_btn:hover {
    color: #3399ff;
    transition: all 0.8s;
    background-color: #fff;
    background-image: url(../img/メールの無料アイコンその8のコピー.png);
}



.line_button_flex_item {
    display: inline-block;
    width: 50%;
    text-align: center;
    background-color: #06C755;
    border: 1.5px solid #06C755;
    border-radius: 20px;
    color: #fff;
}


.line_contact_flex_btn {
    width: 100%;
    display: inline-block;
    font-size: 22px;
    font-weight: bold;
    color: #fff;
    border-radius: 20px;
    padding: 0 3rem;
    height: 80px;
    line-height: 80px;
}

.line_button_flex_item:hover {
    border: 1.5px solid #06C755;
    transition: all 0.8s;
    background-color: #fff;
    color: #06C755;
}


.line_contact_flex_btn:hover {
    color: #06C755;
    transition: all 0.8s;
} */

/*  */















.address_right {
    width: 100%;
}



.page-map {
    display: inline-block;
    width: 100%;
    height: 350px;
}



    
    /* footer */

    .address_list iframe {
        margin-bottom: 40px;
        width: 100%;
        height: 350px;
    }

    .address_list {
        border-bottom: 2px dotted #c0c0c0;
        margin-bottom: 60px;
        text-align: center;
        padding-bottom: 40px;
        font-size: 18px;
    }
    
    .address_item dt {
        font-weight: bold;
        padding-bottom: 20px;
        font-size: 20px;
        /* margin-top: 15px; */
    }
    
    .address_item dd {
        line-height: 2;
        font-size: 18px;
    }

    .button_container {
        margin-bottom: 60px;
    }
    
    #footer .footer_title {
        width: 300px;
        margin-bottom: 80px;
        margin: 0 auto 80px;
        text-align: center;
    }
    
    #to_top {
        width: 50px;
        height: 50px;
        background-color: #83AFDA;
        border: 1px solid #fff;
        border-radius: 50%;
        position: fixed;
        right: 30px;
        bottom: 12px;
    }
    
    #to_top::after {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        right: 18px;
        width: 12px;
        height: 12px;
        margin: auto;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        transform: translateY(2px) rotate(315deg);
        box-sizing: border-box;
    }

    #footer .footer_left {
        margin-bottom: 40px;
    }
    
    #footer .address_left {
        /* display: flex; */
        flex-direction: column;
        /* align-items: center; */
        text-align: center;
    }
    
    #footer .address_left .address_item {
        border-right: 0;
        padding: 0;
        margin-bottom: 24px;
    }
    
    #footer .address_left .address_item:last-child {
        border-right: none;
    }
    
    #footer .address_right .address_item {
        flex-direction: column;
        text-align: center;
        margin-bottom: 24px;
    }

    
    
    

    
    
    #footer .copy_right {
        text-align: center;
        font-size: 12px;
        color: #fff;
        padding: 30px 0;
        background-color: #83AFDA;
    }
    



}


@media (max-width: 600px) {

    .mainvisual .text .main_title {
        display: block;
        line-height: 1.4;
        letter-spacing: -5px;
        font-size: 48px;
    }


    .ease_of_work_button {
        margin-bottom: 40px;
    }
    
    


    #about .about_links .about_links_list {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
        font-size: 16px;
        margin-bottom: 40px;
        align-items: center;
    }
    
    #about .about_links .about_links_list .about_link_item {
        padding: 15px;
        /* text-align: center; */
    }

    .card img {
        padding-bottom: 30px;
        margin: 0 auto;
        align-items: center;
        width: 60px;
    }
    
    .card p {
        position: absolute;
        bottom: 40px;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
        font-size: 12px;
        position: static;
        transform: none;
        margin-top: 10px;
    }

    #job_vacancies .about_links_list {
        padding: 0 40px;
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
        font-size: 18px;
        margin-bottom: 40px;
    }
    
    #job_vacancies .about_links_list .about_link_item {
        padding: 15px;
    }

    #employee_benefits .illust_slider {
        margin-bottom: 0;
    }




    #employee_benefits .illust_slider.infinite-scroll {       
        gap: 20px;
    }
    
    
    

    #job_vacancies_title .job_vacancies_title_img {
        max-width: 300px;   /* 適度に横幅制限するとバランス◎ */
    }
    
    #job_vacancies_title .job_vacancies_title_img img {
        /* flex: 1 1 0; */
        width: 100%;
        object-fit: contain;
    }

    .card p {
        font-size: 18px;
        margin-top: 0;
    }

    #employee_benefits .illust_slider .card img {
        width: 40%;
        padding-bottom: 10px;
    }




    .about_btn {
        margin-bottom: 40px;
    }


    /* 働く環境 */

    .employee_benefits_text {
        padding-bottom: 20px;
        font-size: 16px;
    }

    .employee_benefits_items .item_list {
        padding: 20px 10px;
    }

    .item_list_text {
        padding-bottom: 20px;
        font-size: 14px;
    }

    .item_list_text_last {
        font-size: 14px;
    }
    

    .employee_benefits_img img {
        width: 40px;
    }
    
    .two_lines {
        padding: 35px 40px 0 0;
    }
    
    .three_lines {
        padding: 80px 40px 0 0;
    }
    
    .four_lines {
        padding: 100px 40px 0 0;
    }

    
    /* button_container */
    
    .button_container {
        padding: 60px 20px;
    }
    
    .button_jobopenings img {
        width: 40px;
    }
    
    .button_jobopenings {
        margin: 0 auto;
        padding: 15px 30px;
        border-radius: 10px;
        color: #333;
        font-weight: bold;
        z-index: 1;
        position: relative;
        transition: all 0.5s;
        display: flex;
        align-items: center;
        /* justify-content: center; */
        font-size: 24px;
        justify-content: space-between;
    }
    
    .button_jobopenings:hover {
        color: #83AFDA;
        transform: scale(1.1);
    }
    
    .jobopenings_text {
        padding-left: 30px;
    }



    /* .employee_benefits_img {
        position: absolute;
        right: 0;
        bottom: 0;
    }
    
    .employee_benefits_img img {
        width: 100%;
    } */




    .footer_title {
        width: 250px;
        text-align: center;
        margin: 0 auto;
    }
    
    .footer_title img {
        width: 250px;
    }



    .address_list iframe {
        width: 100%;
        height: 250px;
    }

    .address_list {
        border-bottom: 2px dotted #c0c0c0;
        margin-bottom: 40px;
        text-align: center;
        padding-bottom: 20px;
    }
    
    .address_item dt {
        font-weight: bold;
        padding-bottom: 10px;
        font-size: 16px;
        /* margin-top: 15px; */
    }
    
    .address_item dd {
        line-height: 2;
        font-size: 16px;
    }


    .footer_right {
        flex-direction: column;
        margin-bottom: 40px;
        padding-left: 20px;
        padding-top: 20px;
    }
    
    #footer .footer_right .footer_list {
        flex-direction: column;
        padding-bottom: 0;
    }
    
    
    .footer_list li {
        padding-bottom: 5px;
    }


    .adress_page .address_item dt {
        padding-bottom: 0;
        font-size: 18px;
    }
    
    .adress_page .address_item dd {
        padding-bottom: 0;
        font-size: 16px;
    }
    
    .adress_page .address_list {
        border-bottom: 2px dotted #c0c0c0;
        margin-bottom: 40px;
        padding-bottom: 20px;
    }
    

    .page-map {
        width: 100%;
        height: 250px;
    }

    


    /* various_service */

    
    .various_service_container .page_title {
        margin-bottom: 20px;
    }
    
    .introduction_text_item {
        padding: 20px;
    }
    
    .section_wrapper_various_service {
        max-width: 900px;
        margin: 0 auto;
        container-type: inline-size;
        padding: 0 20px 40px 20px;
    }
    
    .introduction_text_item {
        margin-bottom: 20px;
    }
    
    .introduction_title {
        font-size: 20px;
        margin-bottom: 20px;
        color: #3399ff;
    }

    .introduction_text {
        font-size: 14px;
    }
    
    
    .information {
        padding: 20px;
        margin-bottom: 20px;
    }
    
    .recruitment_details_title {
        padding-bottom: 15px;
    }
    
    .grid_item {
        flex-direction: column;
    }
    
    .grid_title {
        width: 100%;
        padding: 15px 0;
        font-size: 16px;
    }

    .grid_title_last {
        width: 100%;
        border-bottom: 1px solid #83AFDA;
        padding: 15px 0;
        font-size: 16px;
    }
    
    .grid_text {
        width: 100%;
        padding: 15px 0;
        font-size: 14px;
    }
    
    .recruitment_text {
        padding-bottom: 10px;
    }
    
    .recruitment_text_important {
        padding-top: 15px;
    }

    .recruitment_details_map {
        padding: 10px 0;
        width: 100%;
    }
    
    
    
    .button_wrapper {
        padding: 20px;
    }
    
    .appry_btn {
        padding: 16px 80px;
        color: #fff;
        font-size: 14px;
        border: 1px solid #ff9933;
    }
    
    .appry_btn:hover {
        border: 1px solid #ff9933;
    }


    .scroll_button {
        padding: 30px;
    }

    .scroll_button .scroll_btn {
        padding: 16px 80px;
        font-size: 14px;
    }

    .scroll_button .scroll_btn:hover {
        border: 1px solid #ff9933;
    }

    
    

}

@media (max-width: 560px) {

    #job_vacancies_title .job_vacancies_title_img {
        max-width: 250px;
    }

    #job_vacancies_title .job_vacancies_title_img img {
        /* flex: 1 1 0; */
        width: 100%;
        height: 100px;
        object-fit: contain;
    }
}


@media (max-width: 500px) {

    .line_contact_button {
        padding: 20px 40px;
    }

    .add_friend_btn {
        padding: 10px;
        font-size: 16px;
        padding: 0;
        height: 60px;
        line-height: 60px;
    }



    .contact_form_flex_btn {
        font-size: 16px;
        height: 60px;
        line-height: 60px;
    }
    
    
    
    .line_contact_flex_btn {
        font-size: 16px;
        height: 60px;
        line-height: 60px;
    }

}







@media (max-width: 420px) {


    h3.section_title {
        margin-bottom: 20px;
    }

    h3.section_title .en {
        font-size: 10px;
        padding-bottom: 0;
    }
    
    h3.section_title .ja {
        display: block;
        font-size: 20px;
        letter-spacing: 2px;
    } 

    #about .section_title {
        margin-bottom: 20px;
    }

    .maili_contact_title {
        margin-bottom: 20px;
    }
    
    .maili_contact_title .en {
        font-size: 10px;
        margin-bottom: 0;
    }
    
    .maili_contact_title .ja {
        font-size: 24px;
    }


    #header {
        line-height: 1;
    }

    #header .site_title {
        width: 150px;
        position: relative;
    }

    .toggle_btn_box {
        width: 50px;
        height: 50px;
        position: fixed;
        right: 14px;
    }


    .toggle_btn {
        width: 25px;
        height: 25px;
        transition: all 0.5s;
        cursor: pointer;
        position: relative;
    }
    
    
    
    .toggle_btn span:nth-child(1) {
        top: 7px;
    }
    
    .toggle_btn span:nth-child(2) {
        top: 15px;
    }
    
    
    .toggle_btn.active span:nth-child(1) {
        transform: rotate(35deg);
        top: 10px;
    }
    
    .toggle_btn.active span:nth-child(2) {
        transform: rotate(-35deg);
        top: 10px;
    }
    
    .toggle_btn_box span {
        font-size: 8px;
    }

    .mainvisual .text .main_title {
        display: block;
        line-height: 1.4;
        letter-spacing: -5px;
        font-size: 36px;
    }

    #about .section_title {
        margin-bottom: 60px;
    }

    .section_title .ja {
        font-size: 18px;
    }


    .about_wrapper {
        gap: 0;
        flex-direction: column;
        align-items: center;
        display: flex;
        position: relative;
    }

    .about_text_one {    
        flex: 1;
        text-align: center;
        padding-top: 48px;
        padding-bottom: 56px;
        font-size: 14px;
        font-weight: bold;
    }


    .about_text_two {
        margin-top: 36px;
    }



    
    .about_wrapper .bear_left {
        position: absolute;
        top: -35px;
        left: 60px;
        width: 40px;
        display: inline-block;
    }
    
    
    .about_wrapper .bear_right {
        position: absolute;
        right: 60px;
        bottom: -12px;
        width: 32px;
        display: inline-block;
    }
    
    




    .ease_of_work_button {
        margin-bottom: 40px;
    }
    
    
    .ease_of_work_btn {
        color: #000;
        font-size: 16px;
        position: relative;
    }


    .about_btn {
        font-size: 12px !important;
    }

    .about_btn .arrow_w {
        align-items: center;
        position: absolute;
        top: 53%;
        right: 20px;
        transform: translateY(-50%);
        width: 30px;
        height: 30px;
        line-height: 1;
        overflow: hidden;
    }



    .about_links {
        padding-top: 0;
    }


    #job_vacancies_title .job_vacancies_title_img {
        max-width: 200px;   /* 適度に横幅制限するとバランス◎ */
    }

    #job_vacancies_title .job_vacancies_title_img img {
        /* flex: 1 1 0; */
        width: 100%;
        height: 100px;
        object-fit: contain;
    }

    
    #employee_benefits .illust_slider {
        margin-bottom: 0;
    }
    

    .card p {
        font-size: 12px;
        margin-top: 0;
    }

    #employee_benefits .illust_slider .card img {
        width: 40%;
        padding-bottom: 0;
    }


    .employee_benefits_img img {
        width: 50px;
    }

    .section_about_title .ja {
        display: block;
    }
    
    .section_about_title .en {
        display: block;
    }


    /* 働く環境 */

    .employee_benefits_text {
        padding-bottom: 20px;
        font-size: 14px;
    }

    .employee_benefits_items .item_list {
        padding: 20px 10px;
    }

    .item_list_text {
        padding-bottom: 10px;
        font-size: 14px;
    }

    .item_list_text_last {
        font-size: 14px;
    }
    

    .employee_benefits_img img {
        width: 40px;
    }
    
    .two_lines {
        padding: 30px 20px 0 0;
    }
    
    .three_lines {
        padding: 60px 20px 0 0;
    }
    
    .four_lines {
        padding: 105px 20px 0 0;
    }


/* button_container */

    .button_container {
        margin-bottom: 40px;
    }


    /* adress_page */

.adress_page {
    margin-bottom: 40px;
}

.adress_page .adress_page_title {
    width: 200px;
    margin-bottom: 40px;
}

.adress_page .address_item dt {
    font-size: 16px;
}

.adress_page .address_item dd {
    padding-bottom: 0;
    font-size: 14px;
}

.adress_page .address_list {
    border-bottom: 2px dotted #c0c0c0;
    margin-bottom: 15px;
    padding-bottom: 15px;
}



/* contact_form */

.wpcf7 input[type="submit"],
.wpcf7-submit {
    padding: 10px 32px;
    font-size: 12px;
    margin: 20px auto 0;
}






    /* #footer .address_item {
        font-size: 12px;
    } */

    .footer_list li {
        font-size: 10px;
    }

    a#to_top {
        width: 35px;
        height: 35px;
        right: 12px;
        bottom: 10px;
    }
    
    a#to_top::after {
        top: 3px;
        right: 10px;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
    }

    .address_list iframe {
        width: 100%;
        height: 200px;
    }

    .address_list {
        border-bottom: 2px dotted #c0c0c0;
        margin-bottom: 30px;
        text-align: center;
        padding-bottom: 15px;
    }
    
    .address_item dt {
        font-weight: bold;
        padding-bottom: 10px;
        font-size: 14px;
        /* margin-top: 15px; */
    }
    
    .address_item dd {
        line-height: 2;
        font-size: 14px;
    }

    #footer .copy_right {
        text-align: center;
        font-size: 8px;
        color: #fff;
        padding: 20px 0;
        line-height: 1px;
    }


    .page-map {
        height: 200px;
    }

    .adress_page .address_item dt {
        padding-bottom: 0;
        font-size: 14px;
    }
    
    .adress_page .address_item dd {
        padding-bottom: 0;
        font-size: 14px;
    }
    
    .adress_page .address_list {
        border-bottom: 2px dotted #c0c0c0;
        margin-bottom: 40px;
        padding-bottom: 20px;
    }
    



}

/* ワードプレス */

/* 各種サービス */

.blogs {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3列固定 */
    gap: 30px; /* カードの間のスペース */
}


@media (max-width: 768px) {

    .blogs {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: 20px;
    }

    #blog .blogs .blog_item .blog_text {
        padding: 20px;
        font-size: 12px;
    }


    .about_visual .aboutus_title .ja {
        font-size: 24px;
    }

    .about_visual .aboutus_title .en {
        font-size: 12px;
        padding-bottom: 0;
    }

    /* .page_title {
        margin-bottom: 32px;
    } */

    .page_title .ja {
        font-size: 24px;
    }

    .page_title .en {
        font-size: 12px;
        padding-bottom: 0;
    }

    .section_about_title {
        padding-bottom: 10px;
    }

    .section_about_title .ja {
        font-size: 20px;
    }

    /* ease of work */

    .text {
        font-size: 16px;
        margin-bottom: 0;
    }

    .ease_of_work_list_title {
        padding-bottom: 10px;
    }

    .ease_of_work_one {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .ease_of_work_two {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .ease_of_work_three {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .ease_of_work_four {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .ease_of_work_text {
        font-size: 14px;
        margin-bottom: 20px;
    }

    .ease_of_work_text .ease_of_work_item_one {
        padding-bottom: 10px;
    }

    /* suppotr_system */

    .support_system_text {
        font-size: 16px;
        padding-bottom: 20px;
    }

    .suport_title {
        padding-bottom: 10px;
        font-size: 16px;
    }

    .suport_text {
        padding-bottom: 20px;
        font-size: 14px;
    }

    /* mentor */

    .mentor_system_text {
        padding-bottom: 10px;
        font-size: 14px;
    }

    /* easy */

    .question_list .question_list_title {
        padding-bottom: 20px;
        font-size: 16px;
    }

    .question_text {
        padding: 0 0 20px 12px;
        font-size: 14px;
    }

    .working_hours_text {
        font-size: 14px;
        padding-bottom: 20px;
    }

    /* about us */

    #concept {
        padding-top: 90px;
    }

    #mission {
        padding-top: 90px;
    }

    #vision {
        padding-top: 90px;
    }

    #core_values {
        padding-top: 90px;
    }

    #principles_of_conduct {
        padding: 90px 0 40px 0;
    }

    #promise_of_specialized_support {
        padding-top: 90px;
    }

    .text_title {
        font-size: 16px;
        margin-bottom: 20px;
    }

    .text {
        font-size: 14px;
    }

    /* core values */

    #core_values .text {
        padding-bottom: 20px;
    }

    #core_values .last {
        padding-bottom: 0;
    }

    /* princlples of conduct */

    #principles_of_conduct .text {
        padding-bottom: 20px;
    }

    #principles_of_conduct .last {
        padding-bottom: 0;
    }

    /* promise_of_specialized_support */

    #promise_of_specialized_support .text {
        padding-bottom: 20px;
    }

    #promise_of_specialized_support .last {
        padding-bottom: 0;
    }

    /* job vacansies */



}



@media (max-width: 400px) {

#blog .blogs .blog_item img {
    width: 100%;
    height: 160px;
    object-fit: cover;
}

#blog .blogs .blog_item .blog_text {
    padding: 20px;
    font-size: 12px;
}

#blog .blogs .blog_item .blog_text h4 {
    padding-bottom: 15px;
    font-size: 16px;
}

}


.introduction_text_item p {
    line-height: 1.6;
}

.grid_text p {
    line-height: 2;
    margin-bottom: 10px;
}

.grid_text p:last-child {
    margin-bottom: 0;
}


.recruitment_details_map {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* アスペクト比16:9 */
    height: 0;
    overflow: hidden;
    margin-bottom: 20px;
}

.recruitment_details_map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}