@charset "UTF-8";

/*--------------------------------------------------------------*/
/* CSS and Graphics are released under Creative Commons Licence */
/* https://www.webplus.jp/                                      */
/* Copyright (C) Kiyonobu Horita @ WEBPLUS Inc.                 */
/*--------------------------------------------------------------*/


/* ========================================================

　ブランドヒストリー / 企業情報

=========================================================== */

#history {
    margin-left: -1.5rem;
    margin-right: -1.5rem;
}

#history .heading {
    margin-left: 1.5rem;
    margin-right: 1.5rem;
}

#history .col-12 {
    padding-left: 0;
    padding-right: 0;
}


/* ========================================================

　会社案内 / 企業情報

=========================================================== */

/*　会社概要
----------------------------------------------------------- */
/* 項目 */
#company dt {
    width: 100%;
    padding: 0.5rem 0 0.25rem;
    border-bottom: 0.1rem dotted rgba(210, 210, 210, 1.00);
    font-weight: 500;
}

/* 内容 */
#company dd {
    margin-bottom: 1.0rem;
    padding: 0.5rem;
    border-bottom: 0.2rem solid rgba(210, 210, 210, 1.00);
}

/* ブランド画像 */
#company dd img {
    display: block;
    margin-bottom: 1.0rem;
}

#company dd ul {
    padding-left: 2.0rem;
}

/* 電話番号・メールアドレス */
#company dd:last-child {
    text-align: left;
}

#company dd:last-child span,
#company dd:last-child a {
    color: rgba(68, 68, 68, 1.00);
}

#company dd:last-child a {
    display: inline-block;
    position: relative;
}

#company dd:last-child a:hover {
    color: rgba(250, 126, 36, 1.00);
}

@media only screen and (min-width: 768px) {

    /* 表組み */
    #company dl {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    #company dt,
    #company dd {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    #company dt {
        width: 30%;
        border-bottom: 0.2rem solid rgba(210, 210, 210, 1.00);
        text-align: center;
    }

    #company dd {
        width: calc(70% - 1.0rem);
        margin-left: 1.0rem;
        margin-bottom: 0;
        border-bottom: 0.1rem solid rgba(200, 200, 200, 1.00);
    }

    /* 指定しないとブロック化される */
    #company dd:nth-of-type(3) a,
    #company dd:last-child span,
    #company dd:last-child a {
        display: contents;
    }

    #company dd img {
        width: 20.0rem;
    }

}


/* ========================================================

　採用情報 / 企業情報

=========================================================== */

/*　.blk01
----------------------------------------------------------- */
#recruit .blk01 .mid-heading {
    margin-top: 3.0rem;
}

/* 電話番号・メールアドレス */
#recruit .blk01 span,
#recruit .blk01 a {
    color: rgba(0, 0, 0, 1.00);
}

#recruit .blk01 a:hover {
    color: rgba(250, 126, 36, 1.00);
}

/* 画像部分 */
#recruit .blk01 > div[class^="col-"] div[class^="col-"]:nth-of-type(1) {
    text-align: center;
}

#recruit .blk01 img {
    margin: 0 auto;
}

/*　.blk02
----------------------------------------------------------- */
/* 丸数字をブロック外に出す関係で、上余白を調整 */
#recruit .flow {
    margin-top: 4.0rem
}

#recruit .flow > div {
    position: relative;
    margin-bottom: 4.0rem;
    padding: 1.5rem 0;
    border: 0.1rem solid rgba(210, 210, 210, 1.00);
    border-radius: 0 2.0rem 0 2.0rem;
}

/* 丸数字 */
#recruit .flow aside {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: -1.5rem;
    left: -1.5rem;
    width: 4.0rem;
    height: 4.0rem;
    border-radius: 2.0rem;
    background-color: rgba(250, 126, 36, 1.00);
    color: rgba(255, 255, 255, 1.00);
    font-family: "Lato";
    font-size: 2.4rem;
}

/* 丸数字①の位置調整 */
#recruit .flow > div:first-child aside {
    padding-right: 0.15rem;
}

/* 人の画像部分 */
#recruit .flow figure {
    width: 100%;
    text-align: center;
}

#recruit .flow figure img {
    margin: 0 auto;
}

/* タイトル部分 */
#recruit .flow h5 {
    display: block;
    margin-top: 2.0rem;
    padding: 0.75rem 0 0.5rem;
    background-color: rgba(250, 126, 36, 0.10);
    font-size: 2.4rem;
    text-align: center;
}

#recruit .flow > div:last-child h5 {
    background: none;
    color: rgba(250, 126, 36, 1.00);
    text-align: center;
}

/* テキスト部分 */
#recruit .flow p {
    margin: 2.0rem 1.5rem 0;
    font-size: 1.5rem;
    line-height: 2.4rem;
}

/* 注意書き */
#recruit .flow p span {
    display: block;
    margin-top: 1.0rem;
    font-size: 1.2rem;
    color: rgba(255, 0, 0, 1.00);
    line-height: 1.87rem;
}

/*　.blk03 / .blk04
----------------------------------------------------------- */
/* 項目 */
#recruit dt {
    width: 100%;
    padding: 0.5rem 0 0.25rem;
    border-bottom: 0.1rem dotted rgba(210, 210, 210, 1.00);
    font-weight: 500;
}

#recruit dd {
    margin-bottom: 1.0rem;
    padding: 0.5rem;
    border-bottom: 0.2rem solid rgba(210, 210, 210, 1.00);
}

#recruit dd ul {
    padding-left: 2.0rem;
}

@media only screen and (min-width: 576px) {

    #recruit .blk01 .notes {
        font-size: 1.8rem;
    }

}

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

    /* ボックス下の三角生成 */
    #recruit .flow > div::before {
        position: absolute;
        top: 100%;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        margin-top: 0.5rem;
        border-top: 1.5rem solid rgba(250, 126, 36, 1.00);
        border-right: 1.5rem solid transparent;
        border-left: 1.5rem solid transparent;
        content: '';
    }

    /* 最後のボックス下の三角をカット */
    #recruit .flow > div:last-child::before {
        content: none;
    }

}

@media only screen and (min-width: 768px) {

    #recruit .blk01 .mid-heading {
        margin-top: 0; /* 上余白をカット */
    }

    #recruit .flow > div {
        float: left; /* 各ボックスを横並びに */
        width: 20.0rem;
        height: 38.5rem;
        margin-right: 3.0rem;
        padding: 2.0rem 0;
    }

    #recruit .flow > div:last-child {
        margin-right: 0;
    }

    #recruit .flow aside {
        top: -2.0rem;
        left: -2.0rem;
        width: 5.0rem;
        height: 5.0rem;
        border-radius: 2.5rem;
        font-size: 3.0rem;
    }

    #recruit .flow > div:first-child aside {
        padding-right: 0.25rem; /* 数字の１は左右の位置バランスがズレるので調整 */
    }

    #recruit .flow > div:last-child figure {
        padding-top: 3.0rem;
        padding-bottom: 3.0rem;
    }

    #recruit .flow > div:nth-last-of-type(n+2) figure img {
        height: 12.0rem;
    }

    #recruit .flow > div:last-child h5 {
        font-size: 4.0rem;
    }

    #recruit .flow p {
        margin: 2.0rem 2.0rem 0;
    }

    /* ボックス右の三角生成 */
    #recruit .flow div::after {
        position: absolute;
        top: 50%;
        right: -4.5rem;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        margin-top: -1.2rem; /* 位置調整 */
        border: 2.0rem solid transparent; /* border高さ */
        border-left: 2.0rem solid rgba(250, 126, 36, 1.00); /* border幅 */
        content: "";
    }

    #recruit .flow div:last-child::after {
        content: none;
    }

    /* 表組み */
    #recruit dl {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    #recruit dt,
    #recruit dd {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    #recruit dt {
        width: 30%;
        border-bottom: 0.2rem solid rgba(210, 210, 210, 1.00);
        text-align: center;
    }

    #recruit dd {
        width: calc(70% - 1.0rem);
        margin-left: 1.0rem;
        margin-bottom: 0;
        border-bottom: 0.1rem solid rgba(200, 200, 200, 1.00);
    }

}

@media only screen and (min-width: 992px) {

    #recruit .flow > div {
        width: 19.0rem;
        height: 40.5rem;
    }

    #recruit .flow div::after {
        margin-top: -2.1rem;
    }

}

@media only screen and (min-width: 1200px) {

    #recruit .blk01 .notes {
        font-size: 2.0rem;
    }

    #recruit .flow > div {
        padding: 3.0rem 0;
        height: 42.0rem;
    }

    #recruit .flow div::after {
        margin-top: -1.8rem;
    }

}

@media only screen and (min-width: 1440px) {

    #recruit .flow > div {
        width: 16.75%;
        margin-right: 4.5rem;
    }

    #recruit .flow div::after {
        right: -5.5rem;
    }

}

@media only screen and (min-width: 1920px) {

    #recruit .flow > div {
        width: 17.7%;
        height: 36.0rem;
        padding: 3.5rem 0;
    }

    #recruit .flow aside {
        top: -2.5rem;
        left: -2.5rem;
        width: 6.0rem;
        height: 6.0rem;
        border-radius: 3.0rem;
        font-size: 4.5rem;
    }

    #recruit .flow > div:first-child aside {
        padding-right: 0.5rem;
    }

    #recruit .flow > div:last-child figure {
        padding-top: 1.0rem;
        padding-bottom: 2.0rem;
    }

    #recruit .flow div::after {
        margin-top: 1.75rem;
    }

}


/* ========================================================

　ＣＳＲ / 企業情報

=========================================================== */

/* タイトル部分 */
#csr h4 {
    margin-top: 1.0rem;
    margin-bottom: 1.0rem;
    font-size: 1.6rem;
    font-weight: 500;
}

#csr .blk03 h4:nth-of-type(n+2) {
    margin-top: 2.0rem;
}

#csr .blk03 ul:nth-of-type(2) li,
#csr .blk03 ul:nth-of-type(3) li {
    margin-bottom: 1.0rem;
}

#csr .blk03 ul:nth-of-type(2) li:last-of-type,
#csr .blk03 ul:nth-of-type(3) li:last-of-type {
    margin-bottom: 0;
}

/* ボタン */
#csr .button {
    margin-top: 1.0rem;
}

#csr .btn {
    display: block;
    width: 100%;
    padding: 1.0rem 0.5rem;
}

@media only screen and (min-width: 768px) {

    #csr .btn {
        max-width: 50.0rem;
    }

}


/* ========================================================

　医療機関等、医療関係者等に対する支払い / 企業情報

=========================================================== */

/* 表組み */
#payment table {
    width: 93.0rem; /* モバイル用の横幅 */
    margin-top: 2.0rem;
}

#payment th,
#payment td {
    padding: 0.5rem 2.0rem;
    font-weight: 400;
}

#payment th {
    background-color: rgba(240, 240, 225, 0.70); /* ヘッダー背景色 */
}

#payment td {
    text-align: right; /* 基本は右寄せ */
}

/* 最上部のヘッダー中央寄せ */
#payment table tr:nth-of-type(1) th {
    background-color: rgba(0, 0, 0, 0.70);
    color: rgba(255, 255, 255, 1.00);
    text-align: center;
}

/* 備考左寄せ */
#payment .blk02 table tr td:last-child,
#payment .blk06 table tr td:last-child {
    text-align: left;
}

/* 合計右寄せ */
#payment .blk02 table tr:last-of-type td,
#payment .blk06 table tr:last-of-type td {
    text-align: right;
}

/* 項目の横幅 */
#payment table tr th:nth-of-type(1) {
    width: 34.0%;
}

/* 件数の横幅 */
#payment table tr th:nth-of-type(2) {
    width: 14.0%;
}

/* 総額の横幅 */
#payment table tr th:nth-of-type(3) {
    width: 22.0%;
}

#payment .blk02 table tr:nth-of-type(1) th:nth-of-type(2),
#payment .blk06 table tr:nth-of-type(1) th:nth-of-type(2) {
    width: 22.0%;
}

/* 備考の横幅 */
#payment table tr th:nth-of-type(4) {
    width: 30.0%;
}

#payment .blk02 table tr:nth-of-type(1) th:nth-of-type(3),
#payment .blk06 table tr:nth-of-type(1) th:nth-of-type(3) {
    width: 64.0%;
}

/* キャプション（※スワイプしてご覧ください　部分） */
#payment .table-responsive caption {
    color: rgba(255, 0, 0, 1.00);
    font-size: 1.2rem;
}

@media only screen and (min-width: 990px) {

    /* キャプション非表示 */
    #payment .table-responsive caption {
        display: none;
    }

}

@media only screen and (min-width: 992px) {

    #payment table {
        width: 100%; /* パソコンでは100％に */
    }

    #payment th,
    #payment td {
        padding: 1.0rem 2.0rem;
    }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

    #payment table tr th:nth-of-type(1) {
        width: 44.0%;
    }

    #payment table tr th:nth-of-type(2) {
        width: 16.0%;
    }

    #payment table tr th:nth-of-type(3) {
        width: 27.0%;
    }

    #payment table tr th:nth-of-type(4) {
        width: 13.0%;
    }

    #payment .blk02 table tr:nth-of-type(1) th:nth-of-type(2),
    #payment .blk06 table tr:nth-of-type(1) th:nth-of-type(2) {
        width: 27.0%;
    }

    #payment .blk02 table tr:nth-of-type(1) th:nth-of-type(3),
    #payment .blk06 table tr:nth-of-type(1) th:nth-of-type(3) {
        width: 29.0%;
    }

}



/* ---- End of file --------------------------------------- */