@charset "UTF-8";

/******************************************************************************
*
* [TOP]FV
*
******************************************************************************/

/*---------------------
* ドット調整
---------------------*/

#fv {
    margin-bottom: 25px;
}

/*---------------------
* ドット調整
---------------------*/

.slick-dots {
    bottom: -25px;
}

.slick-dots li {
    margin: 0 5px;
    height: 3px;
}

.slick-dots li.slick-active button::before {
    background: #0201ff;
}

.slick-dots li button {
    height: 3px;
    padding: 0;
}

.slick-dots li button:before {
    content: "";
    width: 100%;
    height: 3px;
    background: #000;
}


/******************************************************************************
*
* [TOP]挨拶
*
******************************************************************************/

#greeting p.tc {
    text-align: center;
}

#greeting .g_btn {
    width: 220px;
    margin: 40px auto 0;
    filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
    transform: translateZ(0);
}


/******************************************************************************
*
* [TOP]お知らせ
*
******************************************************************************/

#news {
    background: #efefef;
}

/*---------------------
* リスト
---------------------*/

#news .news_list ul li {
    display: flex;
    align-items: center;
    font-size: 14px;
    padding: 15px 0;
    border-top: solid 1px #ccc;
}

#news .news_list ul li:last-child {
    border-bottom: solid 1px #ccc;
}

#news .news_list ul li time.data {
    width: 110px;
    box-sizing: border-box;
}

#news .news_list ul li .cat {
    width: 90px;
    box-sizing: border-box;
}

#news .news_list ul li .cat span {
    display: inline-block;
    background: #cc0033;
    color: #fff;
    padding: 2px 7px 1px;
}

#news .news_list ul li h3 {
    width: 60%;
    width: -webkit-calc(100% - 200px);
    width: calc(100% - 200px);
    box-sizing: border-box;
    line-height: 1;
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

#news .news_list ul li h3 a {
    color: #1a1a1a;
}

#news .news_list ul li h3 a:hover {
    text-decoration: underline;
}

/******************************************************************************
*
* [TOP]事業内容
*
******************************************************************************/

#business .b_list {
    display: flex;
    justify-content: space-between;
}

#business .b_list.bl3 dl {
    width: 32%;
    box-sizing: border-box;
}

#business .b_list dl dt {
    overflow: hidden;
}

#business .b_list dl dd a {
    display: block;
    text-align: center;
    font-size: 18px;
    padding: 7px 10px;
    color: #fff;
    background: rgb(153, 153, 153);
}

/*差分*/

#business .b_list.bl4 {
    margin-top: 18px;
}

#business .b_list.bl4 dl {
    width: 24%;
    box-sizing: border-box;
}

#business .b_list dl dt img {
    transition: all 0.5s;
}

#business .b_list dl.b2 dd a {
    background: rgb(208, 45, 38);
}

#business .b_list dl.b3 dd a {
    background: rgb(27, 43, 131);
}

#business .b_list dl.b4 dd a {
    background: rgb(46, 102, 59);
}

#business .b_list dl.b5 dd a {
    background: rgb(215, 95, 46);
}

/*ホバー*/

#business .b_list dl:hover dt img {
    transform: scale(1.1);
}

/******************************************************************************
*
* [TOP]ワンストップサービス
*
******************************************************************************/

#os_support h2.lead1 {
    font-size: 32px;
    color: #e60012;
}

#os_support h2 {
    max-width: 400px;
    margin: 0 auto 30px;
}

#os_support h3 {
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    color: #e60012;
    margin-bottom: 40px;
}

#os_support h3 span {
    display: inline-block;
    border: solid 3px #e60012;
    padding: 7px 25px;
    border-radius: 14px;
}

#os_support p {
    max-width: 590px;
    margin: 0 auto 40px;
}

/******************************************************************************
*
* [TOP]マップ
*
******************************************************************************/

article.content_article#top_map {
    padding: 0;
}

#top_map .wrap {
    padding: 60px 0;
    border-top: solid 1px #ccc;
    border-bottom: solid 1px #ccc;
}


/******************************************************************************
*
* [TOP]採用
*
******************************************************************************/

#recruit .txt {
    width: 73%;
}

#recruit .txt.t2 {
    margin-left: auto;
}

#recruit .r_main {
    width: 75%;
    margin: auto;
    position: relative;
}

#recruit .r_main .copy {
    position: absolute;
    width: 30%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, 0.85);
    box-sizing: border-box;
    padding: 0 30px;
    display: flex;
    align-items: center;
}

#recruit .r_main .copy h2 {
    font-size: 28px;
    font-weight: bold;
    line-height: 1.5;
    color: #003399;
    margin-bottom: 10px;
}

#recruit .r_main .copy .btn {
    margin-top: 15px;
}

#recruit .r_main .copy .btn a {
    display: inline-block;
    background: #00cccc;
    font-size: 15px;
    padding: 10px 40px 10px 20px;
    border-radius: 50px;
    color: #fff;
    position: relative;
    transition: background 0.5s;
}

#recruit .r_main .copy .btn a:hover {
    background: #01afaf;
}

#recruit .r_main .copy .btn a:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 10px;
    border-right: 1px solid #fff;
    border-top: 1px solid #fff;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    -webkit- transform: translateY(-50%) rotate(45deg);
}

/******************************************************************************
*
* [TOP]コンタクト
*
******************************************************************************/

#contact {
    background: #efefef;
}

#contact .c_box {
    display: flex;
    justify-content: space-between;
}

#contact .c_box .box {
    width: 48.5%;
    background: #fff;
    box-sizing: border-box;
    padding: 30px;
}

#contact .c_box .box h3 {
    text-align: center;
    font-size: 18px;
    margin-bottom: 30px;
}

#contact .c_box .box.tel .tel_num {
    width: 75%;
    margin: auto;
}

#contact .c_box .box.tel aside {
    text-align: center;
    font-size: 13px;
    line-height: 1.5;
    color: #555;
    margin-top: 15px;
}

#contact .c_box .box.mail .btn {
    width: 75%;
    margin: auto;
    position: relative;
    top: 13px;
    filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
    transform: translateZ(0);
}


/******************************************************************************
*
* [TOP]健康経営優良法人
*
******************************************************************************/

#hap2022 {}

#hap2022 .wrap {
    display: flex;
    justify-content: center;
    align-items: center;
}

/*テキスト*/

#hap2022 .txt {
    width: 310px;
}

#hap2022 .txt h2 {
    font-size: 20px;
    /*margin-bottom: 15px;*/
}

#hap2022 .txt a {
    color: #c03;
    font-size: 15px;
    position: relative;
}

#hap2022 .txt a:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 10px;
    border-right: 1px solid #c03;
    border-top: 1px solid #c03;
    position: absolute;
    right: -15px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    -webkit- transform: translateY(-50%) rotate(45deg);
}

#hap2022 .txt a:hover {
    text-decoration: underline;
}

/*ロゴ*/

#hap2022 .hap_logo {
    width: 50%;
}


/******************************************************************************
*
* [TOP]レスポンシブ対応
*
******************************************************************************/

/*1350px以下*/

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

    #recruit .r_main {
        width: 85%;
    }

    #recruit .r_main .copy {
        width: 35%;
        padding: 0 24px;
    }

    #recruit .r_main .copy h2 {
        font-size: 26px;
    }

    #recruit .r_main .copy .btn a {
        font-size: 15px;
        padding: 10px 40px 10px 20px;
    }

}

/*960px以下*/

@media only screen and (max-width: 960px) {
    /*---------------------
    * [TOP]採用
    ---------------------*/

    #recruit ._pc {
        display: none !important;
    }

    #recruit ._sp {
        display: block !important;
    }

    #recruit .middle_wrap {
        width: 100%;
    }

    #recruit .txt {
        width: 100%;
    }

    #recruit .r_main {
        width: 100%;
    }

    #recruit .r_main .copy {
        position: static;
        width: 92%;
        height: auto;
        margin: 15px auto 0;
        background: none;
        padding: 0;
        display: block;
    }

    #recruit .r_main .copy h2 {
        font-size: 24px;
        text-align: center;
        margin-bottom: 12px;
    }

    #recruit .r_main .copy .btn {
        margin-top: 15px;
        text-align: center;
    }
}

/*644px以下*/

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

    .slick-dots {
        bottom: -20px;
    }

    .slick-dots li,
    .slick-dots li button {
        width: 15px;
    }

    /*---------------------
    * [TOP]挨拶
    ---------------------*/

    #greeting .lead1 {
        font-size: 20px;
    }

    #greeting p.tc {
        text-align: left;
        font-size: 14px;
    }

    #greeting .g_btn {
        width: 200px;
        margin: 40px auto 0;
    }

    /*---------------------
    * [TOP]お知らせ
    ---------------------*/

    #news .news_list ul li {
        flex-wrap: wrap;
        font-size: 13px;
        padding: 18px 0;
    }


    #news .news_list ul li time.data {
        width: 85px;
        font-size: 11px;
    }

    #news .news_list ul li .cat {
        width: 90px;
        font-size: 10px;
    }

    #news .news_list ul li .cat span {
        padding: 2px 7px 1px;
    }

    #news .news_list ul li h3 {
        width: 100%;
        width: -webkit-calc(100%);
        width: calc(100%);
        margin-top: 10px;
    }

    /*---------------------
    * [TOP]事業内容
    ---------------------*/

    #business .b_list {
        flex-wrap: wrap;
    }

    #business .b_list dl dd a {
        font-size: 16px;
        padding: 7px 10px;
    }

    /*3*/

    #business .b_list.bl3 {
        display: block;
    }

    #business .b_list.bl3 dl {
        width: 100%;
        display: flex;
        align-items: center;
        background: rgb(153, 153, 153);
        margin-bottom: 10px;
    }

    #business .b_list.bl3 dl:last-child {
        margin-bottom: 0;
    }

    #business .b_list.bl3 dl dt {
        width: 120px;
        box-sizing: border-box;
    }

    #business .b_list.bl3 dl dd {
        width: 60%;
        width: -webkit-calc(100% - 120px);
        width: calc(100% - 120px);
        box-sizing: border-box;
    }

    #business .b_list.bl3 dl dd a {
        text-align: left;
    }

    /*4*/

    #business .b_list.bl4 {
        margin-top: 10px;
    }

    #business .b_list.bl4 dl {
        width: 48%;
        width: -webkit-calc(50% - 5px);
        width: calc(50% - 5px);
    }

    #business .b_list.bl4 dl:nth-child(n+3) {
        margin-top: 10px;
    }

    #business .b_list.bl4 dl dt {
        width: 100%;
        height: auto;
        position: relative;
    }

    #business .b_list.bl4 dl dt::before {
        content: "";
        display: block;
        padding-top: 55%;
    }

    #business .b_list.bl4 dl dt img {
        position: absolute;
        top: 0;
        left: 0;
        object-fit: cover;
        width: 100%;
        height: 100%;
    }

    #business .b_list.bl4 dl a {
        font-size: 14px;
        padding: 5px;
    }

    /*---------------------
    * [TOP]ワンストップサービス
    ---------------------*/

    #os_support .lead1 {
        margin-bottom: 20px;
    }

    #os_support h2.lead1 {
        font-size: 24px;
    }

    #os_support h2 {
        width: 90%;
        margin: 0 auto 15px;
    }

    #os_support h3 {
        font-size: 18px;
        margin-bottom: 30px;
    }

    #os_support h3 span {
        border-width: 2px;
        padding: 7px 20px;
        border-radius: 14px;
    }

    #os_support p {
        margin: 0 auto 30px;
    }

    /*---------------------
    * [TOP]マップ
    ---------------------*/

    #top_map .wrap {
        padding: 30px 0;
    }

    /*---------------------
    * [TOP]お問い合わせ
    ---------------------*/

    #contact .c_box {
        display: block;
    }

    #contact .c_box .box {
        width: 100%;
        padding: 20px;
    }

    #contact .c_box .box h3 {
        font-size: 16px;
        margin-bottom: 20px;
    }

    #contact .c_box .box.tel .tel_num {
        width: 90%;
    }

    #contact .c_box .box.tel aside {
        font-size: 12px;
        margin-top: 20px;
    }

    #contact .c_box .box.mail {
        margin-top: 20px;
    }

    #contact .c_box .box.mail .btn {
        width: 85%;
        top: 0;
    }

    /*---------------------
    * [TOP]健康経営優良法人
    ---------------------*/

    #hap2022 {
        padding-bottom: 80px;
    }

    #hap2022 .wrap {
        display: block;
    }

    /*テキスト*/

    #hap2022 .txt {
        width: 100%;
    }

    #hap2022 .txt h2 {
        font-size: 18px;
        margin-bottom: 15px;
    }

    #hap2022 .txt a {
        font-size: 16px;
    }

    /*ロゴ*/

    #hap2022 .hap_logo {
        width: 70%;
        margin: 20px auto 0;
    }


}

/*375px以下*/

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

/*360px以下*/

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

/*330px以下*/

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