@charset "utf-8";

body {
    -webkit-text-size-adjust: none;
}
*:first-child + html body {
    /* for IF7 */
    font-family: 'メイリオ', 'Meiryo';
}
@font-face {
    font-family: 'ZenMaruGothic';
    font-weight: 500;
    src: url(../fonts/ZenMaruGothic-Medium.woff) format('woff');
}
@font-face {
    font-family: 'ZenMaruGothic';
    font-weight: 700;
    src: url(../fonts/ZenMaruGothic-Bold.woff) format('woff');
}
@font-face {
    font-family: 'Noto Sans JP';
    font-weight: 400;
    src: url(../fonts/NotoSansJP-VariableFont_wght.woff) format('woff');
}
@font-face {
    font-family: 'Noto Serif JP';
    font-weight: 400;
    src: url(../fonts/NotoSerifJP-Regular.woff) format('woff');
}
@font-face {
    font-family: 'Noto Serif JP';
    font-weight: 500;
    src: url(../fonts/NotoSerifJP-Medium.woff) format('woff');
}
@font-face {
    font-family: 'Noto Serif JP';
    font-weight: 700;
    src: url(../fonts/NotoSerifJP-Bold.woff) format('woff');
}
@font-face {
    font-family: 'Oswald';
    font-weight: 500;
    src: url(../fonts/Oswald-VariableFont_wght.woff) format('woff');
}
@font-face {
    font-family: 'KiwiMaru';
    font-weight: 300;
    src: url(../fonts/KiwiMaru-Light.woff) format('woff');
}
@font-face {
    font-family: 'KiwiMaru';
    font-weight: 400;
    src: url(../fonts/KiwiMaru-Regular.woff) format('woff');
}
@font-face {
    font-family: 'KiwiMaru';
    font-weight: bold;
    src: url(../fonts/KiwiMaru-Medium.woff) format('woff');
}
@font-face {
    font-family: 'KleeOne';
    font-weight: 400;
    src: url(../fonts/KleeOne-Regular.woff) format('woff');
}
@font-face {
    font-family: 'KleeOne';
    font-weight: bold;
    src: url(../fonts/KleeOne-SemiBold.woff) format('woff');
}
@font-face {
    font-family: 'Meiryo';
    font-weight: 400;
    src: url(../fonts/MEIRYO.woff) format('woff');
}
@font-face {
    font-family: 'Meiryo';
    font-weight: bold;
    src: url(../fonts/MEIRYOB.woff) format('woff');
}
body {
    color: #000000;
    background: #f6f6f6;
    line-height: 2;
    font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, 'Times New Roman', 'YuMincho', 'Hiragino Mincho ProN', 'Yu Mincho', 'MS PMincho', serif;
    letter-spacing: 0.05rem;
    font-size: 2rem;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0; /*font-size:100%;*/
}
ol,
ul,
dl,
li {
    margin: 0;
    padding: 0;
    list-style: none;
}
ul {
    display: inline-block;
}
*/
/* for macIE \*/
* html ul {
    height: 1%;
}
ul {
    display: block;
}
dt,
dd {
    margin: 0;
    padding: 0;
}
img {
    border: none;
}
th {
    text-align: left;
    font-weight: normal;
}
input,
button,
textarea,
select {
    border-radius: 0;
}
header,
footer,
nav,
article,
section {
    display: block;
}
html {
    font-size: 62.5%;
}

img {
    vertical-align: top;
}

.sm_only {
    display: none !important;
}

.pc_flex {
    /*display: flex;*/
    justify-content: space-around;
    align-items: center;
}

@media screen and (max-width: 480px) {
    .pc_only {
        display: none !important;
    }

    .sm_only {
        display: unset !important;
    }

    .pc_flex {
        display: block;
    }
}

body {
    color: rgb(0, 0, 0);
    background: #fcfcfc;
    line-height: 2;
    font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic Pro', Meiryo, メイリオ, 'Times New Roman', 'YuMincho', 'Hiragino Mincho ProN', 'Yu Mincho', 'MS PMincho', serif;
    font-size: 2rem;
    font-weight: 400;
    letter-spacing: 0.07em;
}
@media screen and (max-width: 480px) {
    body {
        line-height: 1.8;
        font-size: 1.8rem;
        font-weight: 400;
    }
}
.pagetop {
    cursor: pointer;
    position: fixed;
    right: 15px;
    bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    transition: 0.3s;
    color: #00a6c4;
    border: solid 2px #00a6c4;
    background: #fff;
    z-index: 1000;

    /*   デフォルトは非表示 */
    opacity: 0;
}
.pagetop:hover {
    box-shadow: 0 0 10px #00a6c4;
}

.flex {
    display: flex;
    flex-wrap: wrap;
}

.flex-column {
    display: flex;
    flex-flow: column;
}
.content {
    width: 1000px;
    margin: auto;
    padding: 60px 0;
}

.content.company {
    width: 1000px;
    margin: auto;
    padding: 60px 0 200px;
}
.content-02 {
    width: 1000px;
    margin: auto;
    padding: 60px 0;
}

@media screen and (max-width: 480px) {
    .content {
        width: 100%;
        margin: 0px auto 0px;
        padding: 30px 8px 40px;
    }
    .content-02 {
        width: 100%;
        margin: auto;
        padding: 10px 0 30px;
    }
}

.blue_back .content-02 {
    padding-top: 30px;
    padding-bottom: 0px;
}

header {
    width: 970px;
    margin: 0 auto;
}

header img {
    width: 250px;
    padding: 17px 0;
}

/* ヘッダ＆ファーストビュー */
.header_logo {
    width: 1160px;
    margin: auto;
    padding: 10px 10px 0;
    text-align: left;
}

.header_back {
    background: url(../images/main_back.png) center top / cover no-repeat transparent;
}

.header_inner {
    width: 900px;
    margin: 0px auto 0;
    padding: 0px 0 0;
}

.header_inner img {
    width: 100%;
}
@media screen and (max-width: 480px) {
    .bg-traiangle::after,
    .bg-traiangle02::after {
        border-width: 54px 49vw 0 49vw;
    }
    header {
        width: 100%;
        margin: 0 auto;
        background: #ffffff;
    }

    header img {
        width: 50%;
        padding: 10px;
        display: block;
        margin: 0 auto;
    }
    .header_inner {
        width: 100%;
        padding: 0;
    }
}

.page_btn img {
    width: 550px;
    transition: all 0.3s ease;
    display: block;
    margin: auto;
}

.page_btn img:hover {
    -webkit-transform: translate3d(0, 6px, 0);
    transform: translate3d(0, 6px, 0);
    box-shadow: none;
    position: relative;
}

.page_btn {
    justify-content: space-between;
}
.link_area {
    background-image: url(../images/white_back.png);
    background-size: cover;
}

@media screen and (max-width: 480px) {
    .page_btn img {
        width: 100%;
        margin: 0 auto;
        transition: all 0.3s ease;
        padding: 0px 0 0px;
        display: block;
    }

    .link_area {
        margin: 0;
        padding: 0;
    }
}
@media screen and (min-width: 480px) {
    .link_area .content {
        padding: 20px 0 30px;
    }
}

.contents_title {
    color: white;
    background-color: #ff7e7e;
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 3.2rem;
    line-height: 1.4;
    padding: 18px;
    position: relative;
    font-family: 'ZenMaruGothic';
}
/*.contents_title::before {
    position: absolute;
    bottom: -10px;
    left: calc(50% - 30px);
    width: 60px;
    height: 5px;
    content: '';
    border-radius: 3px;
    background: #e3cece;
}*/

.contents_subtitle {
    position: relative;
    display: block;
    text-align: center;
    margin: 55px 0 28px;
}

.contents_subtitle::before {
    position: absolute;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: '\f10d';
    font-size: 30px;
    color: #aeaeae;
    margin: -40px -50px;
}
@media screen and (max-width: 480px) {
    .contents_title {
        width: 100%;
        font-size: 2rem;
        line-height: 1.4;
        padding: 13px 4px 13px;
        font-weight: bold;
        margin-bottom: 0px;
        letter-spacing: 1.2px;
        margin: 20px 0 40px;
    }

    .contents_subtitle {
        font-size: 1.6rem;
        position: relative;
        display: block;
        /* text-align: left; */
        margin: 50px 0px 20px;
        font-weight: bold;
    }

    .contents_subtitle::before {
        font-size: 22px;
        margin: -42px -9px;
    }
}

/*office*/

.office_subtable .flex-wrap {
    display: flex;
    flex-wrap: wrap;
}
.office_subtabletitle {
    border-bottom: 1px solid #dadada;
    background: #e8ecef;
    text-align: left;
    font-weight: bold;
    padding: 12px;
}

@media screen and (min-width: 480px) {
    .office_subtable {
        width: 900px;
        font-size: 1.7rem;
        margin: auto;
    }
    .office_subtable table {
        width: 98%;
        margin: 20px auto 0;
    }
    .office_subtable table tr {
        vertical-align: top;
    }
}

@media screen and (max-width: 480px) {
    .office_box img {
        vertical-align: bottom;
        width: 100%;
        margin: 10px 0px 7px;
    }

    .office_subtabletitle {
        border-bottom: 1px solid #dadada;
        background: #e8ecef;
        text-align: left;
        font-weight: bold;
        padding: 12px;
    }

    .office_subtable {
        padding: 8px;
        margin-top: 14px;
        font-size: 1.2rem;
    }

    .office_subtable table {
        border: none;
        margin-top: 0px;
    }
    .office_subtable table,
    .office_subtable table tr,
    .office_subtable table th,
    .office_subtable table td {
        display: flex;
    }
    .office_subtable table th {
        border-bottom: 1px solid #ffffff;
        background: #fff;
        text-align: left;
        font-weight: normal;
        width: 77px;
        white-space: nowrap;
    }
    .office_subtable table tr td {
        border-bottom: 1px solid #ffffff;
        display: grid;
        width: 253px;
    }

    .office_subtable table tr td.smalla {
        width: 16px;
    }

    .office_subtable table th,
    .office_subtable table td {
        padding: 4px;
    }

    .office_subtable p span {
        font-size: 1.3rem;
    }
    .office_subtable p {
        margin-bottom: 12px;
        margin: 0px;
    }
    .office_subtable table td li {
        text-indent: -12px;
        margin-left: 12px;
    }

    /*office*/
    .office_subtable .flex-wrap {
        display: flex;
        flex-wrap: wrap;
        justify-content: unset;
    }
}
/* フッター */
footer {
    background-color: white;
    padding: 30px 24px 50px;
    text-align: center;
    font-size: 1.6rem;
}
.privacy {
    text-decoration: underline;
}

.privacy {
    padding: 10px;
}

/* /privacy/ */
.word_header {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px dotted #ccc;
    font-size: 1.6rem;
}

.word_header_title {
    font-size: 26px;
    font-weight: bold;
    line-height: 1.5;
}

.word_header_title {
    font-size: 26px;
    font-weight: bold;
    line-height: 1.5;
}

.word_header_titleh2 {
    font-size: 1.7rem;
    font-weight: bold;
    line-height: 1.5;
    margin-top: 30px;
}
.word_header span {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
    width: 26px;
    height: 26px;
    margin-right: 10px;
    border-radius: 3px;
    background: #ff7e7e;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
}

.word p {
    font-size: 1.4rem;
    line-height: 1.5;
    text-align: left;
}
.word ul {
    font-size: 1.4rem;
    line-height: 1.5;
    text-align: left;
}

.word a {
    display: inline;
    color: #49bbfd;
}

.word {
    padding: 20px;
}

.title {
    color: #484848;

    line-height: 1.5;
}

ol {
    position: relative;
    margin-top: 10px;
    padding: 0;
}
ol li {
    list-style: none;
    list-style-position: outside;
    margin: 0;
    padding-left: 1.25em;
    font-size: 1.4rem;
    text-align: left;
}
ol li span {
    position: absolute;
    left: 0;
    margin: 0;
}

/* 質上げ施策 */
.info {
    background: #ffffff;
    margin: 10px auto 15px;
    padding: 15px 10%;
    text-align: left;
    font-size: 1.7rem;
    width: 92%;
    border: 2px solid #b41500;
}
.info h3 {
    text-align: center;
    color: #b41500;
    font-size: 25px;
    font-size: 2rem;
    line-height: 1.3;
    padding-top: 10px;
    font-weight: bold;
}

.info p.titlein {
    color: #c00;
    text-align: center;
    font-weight: bold;
}
.action_mark {
    display: block;
    width: 100%;
    margin-bottom: 10px;
}

ul.asterisk {
    margin-left: 100px;
    /* width: 900px; */
    /* margin: auto; */
    flex-wrap: wrap;
    justify-content: space-evenly;
}

ul.asterisk li {
    list-style-type: none;
    margin-bottom: 5px;
}

ul.asterisk li:before {
    position: absolute;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: '\f00d';
    font-size: 20px;
    color: #d37666;
    margin: -2px -38px;
}

.info span {
    background: linear-gradient(transparent 48%, #fff15a 30%);
    color: #b41500;
}

.titleinsub {
    text-align: center;
    background: white;
    color: #cc0200;
    margin-top: 10px;
    line-height: 1.3;
    padding: 5px;
}
@media screen and (min-width: 480px) {
    .info {
        background: #ffffff;
        margin: 0px auto 15px;
        padding: 15px 10%;
        text-align: left;
        font-size: 1.7rem;
        width: 92%;
        border: 3px solid #b41500;
    }
    .flow_box .info {
        background: #ffffff;
        margin: 10px auto 15px;
        padding: 15px 10%;
        text-align: left;
        font-size: 1.7rem;
        width: 92%;
        border: 3px solid #b41500;
    }
}
@media screen and (max-width: 480px) {
    .info {
        padding: 15px 10px;
        font-size: 1.5rem !important;
    }

    .info h3 {
        font-size: 1.5rem;
    }

    ul.asterisk {
        margin-left: 35px;
    }

    ul.asterisk li {
        margin: 0;
        line-height: 1.8;
    }

    ul.asterisk li:before {
        margin: -5px -25px;
    }
}

.blue_back {
    background-color: #f6ffeb;

    padding: 1px;
    margin-left: calc(((100vw - 100%) / 2) * -1);
    margin-right: calc(((100vw - 100%) / 2) * -1);
}
.pink_back {
    background-image: url(../images/pink_back.png);
    background-size: cover;
}
.agent-content {
    padding: 40px 40px 60px;
    background: #ffffff;
    margin-top: 50px;
    border-radius: 30px;
    box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.22);
}
.agent-content p {
}

.fv_img {
    width: 100%;
    margin-left: 0px;
    margin-right: 20px;
}

.agent-content ul {
    margin: 20px 0;
}
#point .content {
    padding-top: 60px;
    padding-bottom: 50px;
}
.point_num {
    width: 24%;
    margin: 0 auto;
    display: block;
    margin-bottom: -63px;
}

.merit_num {
    text-align: center;
    color: #4e8cad;
    font-size: 4.5rem;
    font-weight: bold;
}
.agent-content_title {
    color: #3083ff;
    /*text-decoration: underline;*/
    font-weight: bold;
    /* background: linear-gradient(transparent 65%, #ccd7b6 65%); */
    text-shadow: 3px 3px 0 #fff, -3px -3px 0 #fff, -3px 3px 0 #fff, 3px -3px 0 #fff, 0px 3px 0 #fff, 0 -3px 0 #fff, -3px 0 0 #fff, 3px 0 0 #fff;
    font-feature-settings: 'palt';
    text-align: center;
    font-size: 3rem;
    margin-bottom: 20px;
    position: relative;
    line-height: 1.4;
}
.agent-content .flex {
    justify-content: center;
    margin-bottom: 5px;
    flex-wrap: nowrap;
}
.agent-content .flex .agent-num {
    background-color: #ff7e7e;
    color: white;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 15px;
    margin-right: 8px;
}
.agent-point-title {
    border-radius: 50px;
    font-size: 1.7rem;
    font-weight: bold;
    text-align: center;
    background-color: #ff7e7e;
    width: 43%;
    margin: 0 auto;
    position: relative;
    padding: 5px 0;
    line-height: 1.4;
}

.agent-point-title {
    margin-top: 10px;
    background-color: #ff7e7e;
    padding: 10px;
    color: white;
}

.agent-content .agent-point-title h1 {
    font-size: 1.9rem;
}

.agent-point-title:before {
    content: '';
    position: absolute;
    top: 79%;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-top: 15px solid #ff7e7e;
}
.agent-point {
    background-color: #fff3f3;
    padding: 10px 5px;
    border-radius: 15px;
    margin-top: 10px;
}
.agent-point ul {
    margin: 0;
}
.agent-point ul.point-list li {
    position: relative;
    font-size: 1.2rem;
    padding: 2px 0px 2px 27px;
}
.agent-point ul li span {
    font-weight: bold;
    color: #ff7e7e;
}
.agent-point ul.point-list li:before {
    background: url(../images/check.png);
    background-size: contain;
    /* background-color: blue; */
    content: '';
    position: absolute;
    left: 8px;
    top: 6px;
    width: 15px;
    height: 15px;
    display: block;
    z-index: 1000;
}
.agent-point ul.point-asterisk {
    font-size: 12px;
    margin: 0 0 8px 10px;
}
.agent-table {
    font-size: 1.4rem;
    margin: 20px 0px 0;
}
.agent-table table {
    border-collapse: collapse;
    width: 100%;
    height: 100%;
}

.agent-table {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 0 1px #ffacb1;
    margin: 10px 5px 0px;
    border: none;
}

.agent-table td:first-child {
    border-radius: 0 0 0 10px;
}

.agent-table td:last-child {
    border-radius: 0 0 10px 0;
}

.agent-table td {
    padding: 2px 8px;
    border: 1px solid #ffacb1;
    width: 20%;
}
.agent-table td small {
    font-size: 0.9rem;
    line-height: 1rem;
    color: gray;
    margin-bottom: 5px;
    letter-spacing: 0;
}

.agent-table td:first-child {
    border-left: none;
}

.agent-table td:last-child {
    border-right: none;
}

.agent-table tr:last-child td {
    border-bottom: none;
    height: 100%;
}

.agent-table th {
    border: none;
}

.agent-table th:first-child {
    border-top-left-radius: 10px;
}

.agent-table th:last-child {
    border-top-right-radius: 10px;
}
.agent-table th {
    text-align: center;
    background: linear-gradient(135deg, #ff989f, #ff7d7d);
    color: white;
    line-height: 1.3rem;
    padding: 2px 0;
    font-size: 1.2rem;
}
.agent-table td {
    text-align: center;
    background: #fff1f1;
    line-height: 1.4rem;
    padding: 2px 3px 2px;
    font-size: 1.2rem;
}
.agent-table td img {
    width: 50px;
    padding: 4px 10px;
}

.table-tag {
    background: linear-gradient(135deg, #ffffff, #e9ecef);
    border: 1px solid #dee2e6;
    margin: 2px 0;
    display: inline-block;
    padding: 3px 6px;
    border-radius: 8px;
    font-size: 1.1rem;
}
.table-tag.tel {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border: 1px solid #2196f3;
    color: #1976d2;
    padding-bottom: 5px;
}

.table-tag.mail {
    background: linear-gradient(135deg, #fff3e0, #ffcc80);
    border: 1px solid #ff9800;
    color: #f57c00;
}

.table-tag.line {
    background: linear-gradient(135deg, #e8f5e8, #c8e6c9);
    border: 1px solid #4caf50;
    color: #388e3c;
}

.agent-facility-types {
    background: linear-gradient(135deg, #ffffff, #ffffff);
    border: 1px solid #ff931a;
    color: #ff931a;
}
.agent-job-type {
    background: linear-gradient(135deg, #ffffff, #ffffff);
    border: 1px solid #e75762;
    color: #ea5b65;
}

th.agent-job-type {
    width: 39%;
}
th.contact {
    width: 20%;
}
td.agent-job-type {
    text-align: left;
    padding: 0 5px;
}
.agent-table .support {
    width: 35%;
}
.agent-table .work-type-item {
    display: inline-block;
    padding: 3px;
}
.agent-content .agent-table th,
.agent-content .agent-table td.kyujinsuu {
    font-size: 1.4rem;
}
@media screen and (max-width: 481px) {
    .agent-table .support-label {
        font-size: 11px;
    }
}
@media screen and (min-width: 481px) {
    .agent-table .support-label {
        padding: 6px;
        font-size: 1.3rem;
    }
    .agent-table .work-type-item {
        display: inline-block;
    }
}

.table-tag.agent-work-type:first-child {
    background: linear-gradient(135deg, #ffe6e6, #ffcccc) !important;
    border-color: #ff9999 !important;
    color: #ff4d4d;
}

.table-tag.agent-work-type:nth-of-type(2) {
    background: linear-gradient(135deg, #fff8e1, #ffecb3) !important;
    border-color: #ffcc02 !important;
    color: #ff9800;
}

.table-tag.yakinnashi {
    background: linear-gradient(135deg, #fff8e1, #ffecb3) !important;
    border-color: #ffcc02 !important;
    color: #ff9800;
}

.table-tag.parttime {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb) !important;
    border-color: #90caf9 !important;
    color: #008dff;
}
.table-tag.haken {
    background: linear-gradient(135deg, #f5fff9, #eaf6ee);
    border-color: #80cb9d;
    color: #00ab41;
}

.kuchikomi_text {
    position: relative;
    background: #f8f9fa;
    border-radius: 15px;
    padding: 15px 20px;
    margin-left: 20px;
    font-size: 13px;
    line-height: 1.6;
    color: #555;
}

/*.kuchikomi_text::before {
    content: '';
    position: absolute;
    left: -13px;
    top: 103px;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 15px solid #eeffff;
}*/

.kuchikomi_text span {
    background: linear-gradient(135deg, #fff3cd, #ffeaa7);
    padding: 2px 4px;
    border-radius: 3px;
    font-weight: bold;
}

th.agent-work-type {
}
th.agent-facility-types {
}
.agent-table.table-facility {
    width: 100%;
}

.kuchikomi-title {
    font-size: 1.3rem;
    width: 95%;
    margin: 28px auto 3px;
    background-color: #7dc724;
    text-align: center;
    color: white;
    border-radius: 20px;
}
.kuchikomi-content {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.kuchikomi_img {
    width: 17%;
}
.kuchikomi_img img {
    width: 65px;
}
.kuchikomi_text {
    width: 80%;
    font-size: 1.1rem;
    line-height: 1.5rem;
    padding: 7px 10px;
    background-color: #f6ffeb;
    box-shadow: 0 3px 4px 3px rgb(119 119 119 / 15%);
    border-radius: 15px;
    margin-top: 7px;
}
.kuchikomi_text span {
    font-weight: bold;
    background: linear-gradient(transparent 50%, #ff6 50%);
}
.kuchikomi small {
    font-size: 1.1rem;
    color: gray;
    margin: 0 20px;
}
.kuchikomi .kuchikomi-content.flex {
    width: 94%;
    margin: auto;
}
.microcopy img {
    display: block;
    margin: 10px auto 5px;
}
.btn-img img {
    display: block;
    margin: auto;
    width: 100%;
}
.pr {
    color: rgb(168, 168, 168);
    font-size: 13px;
    text-align: center;
    margin-top: 10px;
}

@media screen and (max-width: 768px) {
    .kuchikomi-asterisk {
        line-height: 2rem;
        text-indent: -31px;
        padding-left: 20px;
        margin-top: 10px;
    }
}
/* PC版でのレバウェル部分の文字サイズ調整 */
@media screen and (min-width: 768px) {
    .agent-content .agent-table th,
    .agent-content .agent-table td {
        font-size: 1.6rem;
        line-height: 1.6;
    }

    .agent-content .agent-table .table-tag {
        font-size: 1.4rem;
        line-height: 1.4;
    }

    .kuchikomi_text {
        font-size: 1.4rem;
        line-height: 1.6;
    }

    .kuchikomi-title {
        font-size: 1.6rem;
        line-height: 1.6;
    }
    .agent-point ul.point-list li {
        font-size: 1.4rem;
    }

    /* PC版専用の横レイアウト */

    .agent-content .agent-table-pc {
        display: flex;
        gap: 20px;
        margin: 20px 0;
        align-items: stretch;
    }

    .agent-table-pc-left,
    .agent-table-pc-right {
        flex: 1;
        background: #fff1f1;
        border-radius: 10px;
        padding: 0;
        border: 1px solid #ffacb1;
        overflow: hidden;
        position: relative;
    }
    .agent-table-pc-right {
        height: 117px;
    }

    .agent-table-pc-left::after {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: 1px;
        background: #ffacb1;
    }

    .agent-table-pc-row {
        display: flex;
        border-bottom: 1px solid #ffacb1;
        align-items: center;
        padding: 7px 15px;
    }

    .agent-table-pc-row:last-child {
        border-bottom: none;
    }

    .agent-table-pc-label {
        width: 110px;
        font-weight: bold;
        color: white;
        font-size: 1.4rem;
        border-right: 1px solid #ffacb1;
        background: linear-gradient(135deg, #ff7f88, #e5545e);
        padding: 10px 16px;
        margin: -7px 15px -7px -15px;
        display: flex;
        align-items: center;
        min-height: calc(100% + 14px);
    }

    /* 左の表の項目名の角丸 */
    .agent-table-pc-left .agent-table-pc-row:first-child .agent-table-pc-label {
        border-top-left-radius: 10px;
    }

    .agent-table-pc-left .agent-table-pc-row:last-child .agent-table-pc-label {
        border-bottom-left-radius: 10px;
    }

    /* 右の表の項目名の角丸 */
    .agent-table-pc-right .agent-table-pc-row:first-child .agent-table-pc-label {
        border-top-left-radius: 10px;
    }

    .agent-table-pc-right .agent-table-pc-row:last-child .agent-table-pc-label {
        border-bottom-left-radius: 10px;
    }

    .agent-table-pc-content {
        flex: 1;
        font-size: 1.4rem;
        background: #fff1f1;
    }

    .agent-table-pc .table-tag {
        font-size: 1.2rem;
        margin: 3px 4px 0 0;
        display: inline-block;
        line-height: 1.2;
        vertical-align: top;
    }
    .agent-table-pc-label.agent-facility-types-pc {
        height: 82px;
    }
    .agent-table-pc-single {
        display: flex;
        flex-direction: column;
        background: #fff1f1;
        border: 1px solid #ffacb1;
        border-radius: 10px;
        overflow: hidden;
        margin-top: 10px;
    }
    .kuchikomi-content {
        padding: 0 10px;
    }
    .kuchikomi_img {
        width: 14%;
    }
    .kuchikomi.rebawell_kuchikomi .kuchikomi-content {
        width: 100%;
        margin: auto;
    }
    .kuchikomi.rebawell_kuchikomi .kuchikomi_img {
        width: 7%;
    }
    .kuchikomi_text {
        margin: 10px;
    }
    .rebawell_kuchikomi .kuchikomi_text {
        margin-left: 40px;
    }
    .rebawell_kuchikomi img {
        width: 65px;
    }
    .kuchikomi_img img {
        width: 74px;
    }

    .agent-content {
        padding: 40px 90px 60px;
        background: #ffffff;
        margin-top: 50px;
        border-radius: 30px;
        box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.22);
        width: 794px;
        margin: 50px auto 0;
    }
    .fv_img {
        width: 100%;
        margin: auto;
        display: block;
    }
}
.tensyoku-point img {
    width: 100%;
    margin: auto;
    display: block;
}

.triangle-text {
    position: relative;
    display: block;
    padding: 20px 0.5em 10px;
    font-weight: bold;
    color: #000;
    background-color: #fff;
    margin: auto;
    text-align: center;
}
.triangle-text span {
    font-weight: bold;
    color: #ff7e7e;
}

.triangle-text::before,
.triangle-text::after {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: solid transparent;
    border-width: 0.6em;
}

.triangle-text::before {
    right: -1.2em;
    content: '　';
    background-image: url(../images/triangle-left.png);
    background-repeat: no-repeat;
    top: 50%;
    left: -1%;
    height: 96px;
    width: 74px;
    background-size: contain;
    transform: rotate(deg);
}

.triangle-text::after {
    right: -1.2em;
    content: '　';
    background-image: url(../images/triangle-right.png);
    background-repeat: no-repeat;
    top: 50%;
    left: 85%;
    height: 96px;
    width: 74px;
    background-size: contain;
}
.btn-img {
    text-align: center;
}
@media screen and (min-width: 480px) {
    .fv_img {
        width: 418px;
    }
    .agent-point-area {
        width: 600px;
        margin: auto;
        display: block;
    }
    .agent-point ul li {
        position: relative;
        font-size: 1.2rem;
        padding: 0px 0px 0px 6px;
    }
    .agent-point ul li:before {
        left: 15px;
        top: 14px;
    }
    .agent-table {
        font-size: 1.7rem;
        margin: 20px 8px 0;
    }
    .agent-table th,
    .agent-table td {
        padding: 2px 10px;
        text-align: center;
    }
    .agent-content .flex .agent-num {
        width: 40px;
        height: 40px;
        border-radius: 25px;
        top: 3px;
        position: relative;
    }
    .microcopy img {
        width: 70%;
    }

    .btn-img img {
        display: block;
        margin: 5px auto 15px;
        width: 85%;
    }
    .tensyoku-point img {
        width: 90%;
        margin: 35px auto 25px;
        display: block;
    }
    .triangle-text::before {
        right: -1.2em;
        content: '　';
        background-image: url(../images/triangle-left.png);
        background-repeat: no-repeat;
        top: 54%;
        left: -1%;
        height: 86px;
        /* width: 74px; */
        background-size: contain;
        transform: rotate(deg);
    }

    .triangle-text::after {
        right: -1.2em;
        content: '　';
        background-image: url(../images/triangle-right.png);
        background-repeat: no-repeat;
        top: 54%;
        left: 92%;
        height: 86px;
        /* width: 44px; */
        background-size: contain;
    }
}
@media screen and (max-width: 480px) {
    .agent-point-title {
        border-radius: 50px;
        font-weight: bold;
        text-align: center;
        background-color: #ff7e7e;
        width: 95%;
        margin: 3px auto 0;
        position: relative;
        padding: 5px 0;
        line-height: 1.4;
        color: white;
    }

    .agent-point-title p {
        font-size: 1.4rem;
    }
    .agent-content {
        padding: 20px 10px;
        margin-bottom: 50px;
        border-radius: 20px;
    }

    .agent-content h1 {
        font-size: 1.3rem;
    }

    .fv_img {
        width: 100%;
        margin: 0px auto 14px;
        display: block;
    }

    .fv_img_sm2 {
        height: 200px !important;
    }
    .point_num {
        width: 35%;
        margin: 0 auto;
        display: block;
        /* margin-top: -50px; */
        margin-bottom: -30px;
    }

    .merit_num {
        text-align: center;
        font-size: 2.5rem;

        color: #2a6681;
        font-weight: bold;
    }
    .agent-content_title {
        font-size: 2.2rem;
        text-align: center;
        margin-bottom: 10px;
    }
}

.onayami-area {
    background-image: url(../images/gray_back.png);
    background-size: 17px 13px;
    background-size: contain;
}
#onayami.content {
    padding: 20px 0 20px;
}
.onayami02-area .content {
    padding: 0px 0 15px;
}
@media screen and (max-width: 480px) {
    #onayami.content {
        width: 100%;
        margin: 0px auto 0px;
        padding: 00px;
    }
}

@media screen and (min-width: 480px) {
    .onayami02-area {
        background-image: url(../images/onayami02_back.png);
        background-size: cover;
        background-position: center;
    }
    .onayami02-area img {
        width: 100%;
    }
}

.tel {
    padding-bottom: 7px;
}
.tel_area {
    position: fixed;
    right: 0;
    z-index: 504;
    top: 15%;
}

.tel_banner {
    background-color: #5e8cac;
    padding: 30px 15px 50px;
    border-radius: 10px;
    color: white;
    font-size: 12px;
    text-align: center;
    line-height: 1.3;
}

.tel_ban_num {
    font-weight: bolder;
    font-size: 40px;
    margin: 0 auto;
    writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    -webkit-writing-mode: vertical-rl;
    max-height: 300px;
    line-height: 1.2;
    margin-top: 6px;
    margin-bottom: 15px;
    text-wrap: nowrap;
}

.saitama {
    writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    text-align: initial;
    -webkit-writing-mode: vertical-rl;
    font-size: 18px;
}

.saitama span {
    color: #f8ff09;
    font-weight: bold;
    padding: 6px 0;
}

.tel_ban_text {
    font-size: 14px;
    line-height: 1.2;
}

.tel_gif {
    width: 39px;
    display: block;
    margin: 0 auto;
    margin-bottom: 25px;
}

#footer_CTA {
    position: fixed;
    background-color: #7d7d7dc9;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 300;
    /*はじめは非表示*/
    opacity: 0;
    transition: opacity 0.3s ease;
    padding-bottom: 6px;
}

#footer_CTA img {
    width: 23px;
}

#footer_CTA .footer_CTA_call_img {
    width: 72%;
    margin: 7px 0;
    margin-left: 3px;
}

#footer_CTA .footer_CTA_mail_img {
    width: 80%;
    margin: 7px 0;
    margin-left: 3px;
}

.footer_CTA_call {
    display: flex;
    align-items: center;
    width: 32%;
    background-color: #c85500;
    color: white;
    font-size: 80%;
    padding: 8px 13px;
    font-weight: 500;
    border-radius: 41px;
    justify-content: center;
}

.footer_CTA_mail {
    display: flex;
    align-items: center;
    width: 66%;
    background-color: #006600;
    color: white;
    font-size: 80%;
    padding: 8px 13px;
    font-weight: 500;
    border-radius: 41px;

    justify-content: center;
}

.footer_CTA_mail_night {
    width: 100%;
    font-size: 100%;
    font-weight: bold;
    border-radius: 69px;
    padding: 10px 0 12px;
    background-color: #006600;
    text-decoration: underline;
}

#footer_CTA .attention {
    text-align: center;
    padding: 5px 0;
}

#footer_CTA .attention img {
    width: 75%;
    display: block;
    margin: 0 auto;
}

.onayami-area img {
    width: 100%;
    margin: 0 auto;
    display: block;
}

@media screen and (min-width: 480px) {
    .onayami-area img {
        width: 90%;
    }
}

/* 
/* ポップアップ */
.popup-area {
    display: none;
    width: 100%;
    padding: 20px;
    position: fixed;
    z-index: 9999;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    text-align: center;
}

.popup-area_inner {
    width: 100%;

    border-radius: 12px;
    box-shadow: 1px 4px 7px #0000008a;
    background: #fffcf9;
    background-image: linear-gradient(90deg, #fff0e5 1px, transparent 0), linear-gradient(#fff7e5 1px, transparent 0);
    background-size: 10px 10px;
    padding-bottom: 15px;
}

.popup-area img {
    height: unset;
}

.backguide_pop {
    margin-top: -91px;
    width: 87%;
    margin-bottom: 15px;
}

.btn_area {
    top: -65vw;
}

.popup-area .btn_area img {
    width: 95%;
    margin-bottom: 10px;
    height: unset;
}

.popup-area .close-btn {
    position: absolute;
    top: 5px;
    right: 29px;
    cursor: pointer;
    font-size: 43px;
    color: #fff;
    text-shadow: 1px 1px 8px black;
}
.popup-area .icon {
    font-size: 3em;
    color: red;
}
/* 背景色 */
.cover-eml {
    background: #5a5a5ab3;
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 999;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

/**/

@keyframes btn_animation {
    0% {
        transform: translate(4px, 0px);
    }
    5% {
        transform: translate(-4px, 0px);
    }
    10% {
        transform: translate(4px, 0px);
    }
    15% {
        transform: translate(-4px, 0px);
    }
    20% {
        transform: translate(4px, 0px);
    }
    25% {
        transform: translate(-4px, 0px);
    }
    30% {
        transform: translate(0px, 0px);
    }
}

.anim-box {
    animation: poyopoyo 2s ease-out infinite;
    opacity: 1;
}
@keyframes poyopoyo {
    0%,
    40%,
    60%,
    80% {
        transform: scale(1);
    }
    50%,
    70% {
        transform: scale(0.95);
    }
}
.balloon1 {
    position: relative;
    padding: 12px 30px;
    min-width: 79px;
    border-radius: 50px;
    max-width: 100%;
    color: #fff;
    width: fit-content;
    font-size: 17px;
    background: #e94852;
    margin: 10px auto 30px;
    text-align: center;
    font-weight: bold;
}
.balloon1:before {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -15px;
    border: 15px solid transparent;
    border-top: 15px solid #e94852;
}

@media screen and (min-width: 480px) {
    .balloon1 {
        margin: 40px auto 30px;
        font-size: 2rem;
    }
}

/*会社案内*/
.et_title {
    margin: auto;
    font-size: 22px;
    font-weight: bold;
    margin-top: 40px;
    margin-bottom: 40px;
}
table.type05 {
    border-collapse: separate;
    border-spacing: 1px;
    text-align: left;
    line-height: 1.5;
    width: 80%;
    display: block;
    margin: 0 auto 40px;
    border: none;
}
table.type05 th {
    width: 32%;
    padding: 10px 15px 25px 0px;
    font-weight: bold;
    font-size: 16px;
    vertical-align: top;
}
table.type05 td {
    padding: 10px;
    vertical-align: top;
    font-size: 16px;
}
@media screen and (max-width: 480px) {
    .word {
        padding: 13px;
    }
    .al_left {
        padding: 0 8px 0;
    }
    .et_title {
        font-size: 2rem;
        margin-top: 24px;
        margin-bottom: 18px;
        padding: 0 6px;
        text-align: center;
        font-family: 'Noto Serif JP';
    }
    table.type05 {
        width: 100%;
        font-size: 1.1rem;
        margin: 0 auto 20px;
        border-spacing: 0;
        word-break: break-all;
        display: block;
    }
    table.type05 tr {
        display: flex;
        flex-direction: column;
        width: 100%;
        margin-bottom: 12px;
    }
    table.type05 th,
    table.type05 td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    table.type05 th {
        width: 100%;
        padding: 17px 4px 4px 0px;
        font-size: 1.05rem;
        word-break: break-word;
        border-top: 1px solid rgb(226, 226, 226);
        border-bottom: none;
        font-size: 1.7rem;
        font-weight: bold;
    }
    table.type05 td {
        padding: 4px 4px 7px 0px;
        font-size: 1.05rem;
        word-break: break-word;
        font-size: 1.4rem;
    }
}
/*footer*/
.foot {
    display: flex;
    padding-top: 40px;
    width: 970px;
    margin: auto;
}
.foot div {
    width: 410px;
}
.foot div p {
    padding-top: 20px;
    white-space: nowrap;
}
footer img {
    width: 260px;
    float: left;
    padding-right: 16px;
}
footer ul {
    display: flex;
    margin-left: auto;
    white-space: nowrap;
    font-size: 1.4rem;
    align-items: center;
}
footer ul li {
    padding: 0 15px;
    margin-top: 10px;
    border-left: 1px solid #666;
}
footer ul li:first-child {
    border-left: none;
}

@media screen and (max-width: 480px) {
    footer ul {
        display: flex;
        justify-content: space-between;
        margin: 0 16px;
    }
    footer div {
        width: 270px;
        margin: 25px auto 0;
    }
    footer div img {
        float: left;
        padding-right: 5px;
        width: 150px;
    }
    footer div p {
        font-size: 10px;
        padding-top: 2px;
    }
}

/* 保育士転職サイト比較表 */
.comparison-section {
    background-color: #fff6ea;
    padding: 40px 0;
}
@media screen and (min-width: 480px) {
    .comparison-section {
        background-color: #fff5f5;
    }
}

/* 比較表セクション（定番転職サイト一覧前）の背景色を水色に上書き */
.comparison-section.blue_back {
    background-color: #eeffff !important;
}

.comparison-section .content {
    padding-top: 0;
}

.comparison-title {
    text-align: center;
    margin-bottom: 8px;
}

@media screen and (min-width: 480px) {
    .comparison-title {
        text-align: center;
        margin-bottom: 28px;
    }
}

.comparison-title img {
    max-width: 100%;
    height: auto;
}

.comparison-table-container {
    background-color: #ffffff;

    padding: 20px;
    margin: -15px 0 20px;
    position: relative;
}

.scroll-indicator {
    display: block;
    text-align: right;
    margin-bottom: 10px;
    font-size: 1.4rem;
    color: #666;
}

.scroll-text {
    margin-right: 5px;
}

.scroll-arrow {
    display: inline-block;
    animation: scroll-bounce 1.5s ease-in-out infinite;
    color: #ff7e7e;
    font-weight: bold;
}

@keyframes scroll-bounce {
    0%,
    50%,
    100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(5px);
    }
    75% {
        transform: translateX(-2px);
    }
}

.comparison-table-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 1.4rem;

    table-layout: fixed;
}

/* CTAバナー */
.cta-banner-pc {
    background-color: #fff3f3;
    padding: 30px 0;
    text-align: center;
}

.cta-banner-pc .cta-content a {
    display: inline-block;
    transition: transform 0.3s ease;
}

.cta-banner-pc .cta-content a:hover {
    transform: translateY(-3px);
}

.cta-banner-pc img {
    max-width: 100%;
    height: auto;
}

.cta-banner-mobile {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(128, 128, 128, 0.9);
    padding: 15px 0;
    text-align: center;
    z-index: 1000;
    transform: translateY(100%);
    transition: transform 0.3s ease;
}

.cta-banner-mobile.show {
    transform: translateY(0);
}

.cta-banner-mobile .cta-banner-content a {
    display: inline-block;
}

.cta-banner-mobile img {
    max-width: 90%;
    height: auto;
}

.comparison-table th {
    background-color: #e8ecef;
    color: #333;
    font-weight: bold;
    padding: 15px 12px;
    text-align: center;
    border: 1px solid #ccc;
    white-space: nowrap;
}

.comparison-table td {
    padding: 15px 12px;
    border: 1px solid #e6e6e6;
    text-align: center;
    vertical-align: middle;
    line-height: 1.6;
}

.comparison-table tbody tr:nth-child(odd) {
    background-color: #f9f9f9;
}

.comparison-table tbody tr:nth-child(even) {
    background-color: #ffffff;
}

.comparison-table .site-name {
    text-align: center;
    vertical-align: middle;
}

.comparison-table .site-logo {
    margin-bottom: 8px;
}

.comparison-table .site-logo a {
    display: inline-block;
    text-decoration: none;
}

.comparison-table .site-logo img {
    width: 100%;
    object-fit: contain;
    object-position: center;
    transition: transform 0.2s ease;
}

.comparison-table .site-logo a:hover img {
    transform: scale(1.05);
}

.comparison-table .site-title a {
    font-weight: bold;
    color: #0066cc;
    text-decoration: underline;
    font-size: 1.2rem;
    line-height: 1.3;
    display: block;
    transition: all 0.2s ease;
    text-underline-offset: 2px;
}

.comparison-table .site-title a:hover {
    color: #004499;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.comparison-table .job-count {
    font-weight: bold;
    color: #333;
}

/* 検索条件タブの各項目の色設定 */
#search-criteria .general-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

#search-criteria .general-item {
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 4px 4px;
    margin: 1px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

#search-criteria .general-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
}

#search-criteria .general-label {
    font-weight: 500;
    font-size: 0.9rem;
    color: #495057;
    display: block;
    text-align: center;
    line-height: 1.2;
}

/* 各項目の種類別色設定 */
#search-criteria .general-area {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border-color: #2196f3;
    font-weight:bold;
}

#search-criteria .general-area .general-label {
    color: #1976d2;
}

#search-criteria .general-type {
    background: linear-gradient(135deg, #f3e5f5, #e1bee7);
    border-color: #9c27b0;
}

#search-criteria .general-type .general-label {
    color: #7b1fa2;
}

#search-criteria .general-job {
    background: linear-gradient(135deg, #f1f8e9, #e8f5e8);
    border-color: #4caf50;
}

#search-criteria .general-job .general-label {
    color: #388e3c;
}

#search-criteria .general-assignment {
    background: linear-gradient(135deg, #fce4ec, #f8bbd9);
    border-color: #e91e63;
}

#search-criteria .general-assignment .general-label {
    color: #c2185b;
}

#search-criteria .general-facility {
    background: linear-gradient(135deg, #fff8e1, #fff3e0);
    border-color: #ff9800;
}

#search-criteria .general-facility .general-label {
    color: #f57c00;
}

/* 検索条件タブの給与項目の色設定 */
#search-criteria .salary-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

#search-criteria .salary-item {
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 4px 2px;
    margin: 2px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    font-weight:bold;
}

#search-criteria .salary-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
}

#search-criteria .salary-label {
    font-weight: 500;
    font-size: 0.9rem;
    color: #495057;
    display: block;
    text-align: center;
    line-height: 1.2;
}

/* 給与項目の種類別色設定 */
#search-criteria .salary-amount {
    background: linear-gradient(135deg, #fff8e1, #ffecb3);
    border-color: #ffc107;
}

#search-criteria .salary-amount .salary-label {
    color: #f57f17;
}

#search-criteria .reword-amount {
    background: linear-gradient(135deg, #e8f5e8, #c8e6c9);
    border-color: #4caf50;
}

#search-criteria .reword-amount .salary-label {
    color: #388e3c;
}

/* 検索条件タブの働き方項目の色設定（シンプルな白系で統一） */
#search-criteria .work-style-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

#search-criteria .work-style-item {
    background: linear-gradient(135deg, #ffffff, #ffffff);
    border: 1px solid #009dd2;
    border-radius: 8px;
    padding: 4px 2px;
    margin: 1px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
    text-align: center;
}

#search-criteria .work-style-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
}

#search-criteria .work-style-label {
    font-weight: 500;
    font-size: 1.1rem;
    color: #009dd2;
    display: block;
    text-align: center;
    line-height: 1.2;
}

/* PC用の項目サイズ調整 */
@media screen and (min-width: 481px) {
    #search-criteria .general-item,
    #search-criteria .salary-item,
    #search-criteria .work-style-item {
        padding: 8px 16px;
        margin: 4px;
        border-radius: 10px;
    }

    #search-criteria .general-label,
    #search-criteria .salary-label,
    #search-criteria .work-style-label {
        font-size: 1.4rem;
        font-weight: 600;
    }

    #search-criteria .general-container,
    #search-criteria .salary-container,
    #search-criteria .work-style-container {
        gap: 6px;
    }
}

.comparison-table .coverage-area {
    width: 130px;
}

.comparison-table .features {
    width: 250px;
}

.comparison-table .features ul {
    margin: 0;
    padding-left: 0;
    list-style: none;
}

.comparison-table .features li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 8px;
    line-height: 1.5;
}

.comparison-table .features li::before {
    content: '・';
    position: absolute;
    left: 0;
    color: #333;
    font-weight: bold;
}

.comparison-table .features li:last-child {
    margin-bottom: 0;
}

.comparison-table .official-site {
    width: 220px;
    vertical-align: middle;
    position: relative;
}

.register-btn {
    display: inline-block;
    background: linear-gradient(145deg, #ff7e7e, #d14450);
    color: white;
    padding: 10px 15px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.2rem;
    transition: all 0.3s ease;
    white-space: nowrap;
    box-shadow: 0 4px 15px rgba(229, 84, 93, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: visible;
}

@keyframes wave-pulse {
    0% {
        width: 0;
        height: 0;
        opacity: 1;
        transform: translate(-50%, -50%) scale(0);
        border-width: 3px;
    }
    20% {
        width: 40px;
        height: 40px;
        opacity: 1;
        transform: translate(-50%, -50%) scale(0.6);
        border-width: 2px;
    }
    50% {
        width: 80px;
        height: 80px;
        opacity: 0.8;
        transform: translate(-50%, -50%) scale(1);
        border-width: 2px;
    }
    80% {
        width: 120px;
        height: 120px;
        opacity: 0.4;
        transform: translate(-50%, -50%) scale(1.2);
        border-width: 1px;
    }
    100% {
        width: 140px;
        height: 140px;
        opacity: 0;
        transform: translate(-50%, -50%) scale(1.3);
        border-width: 0px;
    }
}

.register-btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: transparent;
    border: 3px solid rgba(229, 84, 93, 0.3);
    box-shadow: 0 0 0 2px rgba(229, 84, 93, 0.2), 0 0 0 5px rgba(229, 84, 93, 0.15), 0 0 0 8px rgba(229, 84, 93, 0.1), 0 0 0 12px rgba(229, 84, 93, 0.05);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: wave-pulse 2.2s ease-out infinite;
    pointer-events: none;
    z-index: -1;
}

/* 第2の波動エフェクト */
.register-btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    background: transparent;
    border: 2px solid rgba(229, 84, 93, 0.2);
    box-shadow: 0 0 0 1px rgba(229, 84, 93, 0.15), 0 0 0 3px rgba(229, 84, 93, 0.1);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    animation: wave-pulse 2.2s ease-out infinite 0.6s;
    pointer-events: none;
    z-index: -2;
}

.register-btn:hover {
    background: linear-gradient(145deg, #d14450, #c13d4a);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(229, 84, 93, 0.6);
}

/* 比較表のマイクロコピー */
.comparison-microcopy {
    font-size: 1.1rem;
    color: #ff7e7e;
    font-weight: bold;
    text-align: center;
    margin-bottom: 8px;
    line-height: 1.2;
    letter-spacing: 0.5px;
}
.comparison-table .site-text {
    margin: 7px auto 10px;
    text-decoration: underline;
    color: #3083ff;
    cursor: pointer;
    font-size: 1.5rem;
    font-weight: bold;
}

/* スマホ版のスタイル */
@media screen and (max-width: 480px) {
    .comparison-section {
        padding: 10px 0;
    }

    .comparison-table-container {
        padding: 8px;
        margin: -15px 7px 15px;
        overflow: hidden;
        position: relative;
    }

    .comparison-table-wrapper {
        overflow-x: auto;
        overflow-y: hidden;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
    }

    .scroll-indicator {
        display: block;
        font-size: 1.4rem;
    }

    .comparison-title img {
        max-width: 349px;
        margin: auto;
    }

    .comparison-table {
        font-size: 1.4rem;
        table-layout: fixed;
    }

    .comparison-table th {
        padding: 10px 8px;
        font-size: 1.4rem;
    }

    .comparison-table td {
        padding: 10px 8px;
        font-size: 1.4rem;
    }

    .comparison-table .site-name {
        width: 30%;
    }

    .comparison-table .site-text {
        margin: 3px auto 5px;
        text-decoration: underline;
        color: #3083ff;
        cursor: pointer;
        font-size: 1.1rem;
        font-weight: bold;
    }
    .comparison-table .site-logo {
        margin-bottom: 5px;
    }

    .comparison-table .site-logo img {
        width: 100%;
        object-fit: contain;
        object-position: center;
        height: 35px;
    }

    .comparison-table .site-title a {
        font-size: 1.3rem;
        color: #0066cc;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .comparison-table .site-title a:hover {
        color: #004499;
        text-underline-offset: 3px;
    }

    .comparison-table .job-count {
        width: 130px;
    }

    .comparison-table .coverage-area {
        min-width: 40px;
    }

    .comparison-table .features {
        min-width: 400px;
        font-size: 1.4rem;
    }

    .comparison-table .features ul {
        padding-left: 0;
    }

    .comparison-table .features li {
        padding-left: 18px;
    }

    .comparison-table .features li {
        margin-bottom: 6px;
    }

    .comparison-table .official-site {
        min-width: 280px;
        vertical-align: middle;
        position: relative;
    }

    .register-btn {
        padding: 8px 12px;
        font-size: 1.4rem;
    }

    /* スマホ版のマイクロコピー */
    .comparison-microcopy {
        font-size: 1.4rem;
        margin-bottom: 6px;
    }
    #search-criteria .work-style-label {
        font-size: 0.9rem;
        font-weight: bold;
    }
}

/* PC版のスタイル */
@media screen and (min-width: 481px) {
    .comparison-section {
        padding: 15px 0;
    }

    .comparison-table-container {
        padding: 18px;
    }

    .comparison-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
    }

    .comparison-table {
        font-size: 1.6rem;
        table-layout: fixed;
    }

    .comparison-title img {
        max-width: 1000px;
    }

    .scroll-indicator {
        font-size: 1.6rem;
        margin-bottom: 15px;
        text-align: center;
    }

    .comparison-table th {
        padding: 20px 15px;
    }

    .comparison-table td {
        padding: 20px 15px;
    }

    #jobs .comparison-table th.site-name,
    #jobs .comparison-table td.site-name {
        width: 90px !important;
    }

    .comparison-table .site-logo img {
        width: 120px;
        object-fit: contain;
        object-position: center;
    }

    .comparison-table .site-title a {
        font-size: 1.4rem;
        color: #0066cc;
        text-decoration: underline;
        text-underline-offset: 2px;
    }

    .comparison-table .site-title a:hover {
        color: #004499;
        text-underline-offset: 3px;
    }

    .comparison-table .job-count {
        width: 130px !important;
    }

    .comparison-table .coverage-area {
        width: 50px;
    }

    .comparison-table .features {
        width: 320px !important;
        font-size: 1.5rem;
    }

    .comparison-table .features ul {
        padding-left: 0;
    }

    .comparison-table .features li {
        padding-left: 25px;
    }

    .comparison-table .features li {
        margin-bottom: 10px;
    }

    .comparison-table .official-site {
        width: 250px !important;
        vertical-align: middle;
        position: relative;
    }

    .register-btn {
        padding: 12px 20px;
        font-size: 1.4rem;
    }

    /* PC版のマイクロコピー */
    .comparison-microcopy {
        font-size: 1.4rem;
        margin-bottom: 10px;
    }
}
/*求人例*/
.square {
    background-image: linear-gradient(0deg, transparent 19px, #ccc 20px), linear-gradient(90deg, transparent 19px, #ccc 20px);
    background-size: 20px 20px;
}

.example_back {
    background-image: url(../images/example_back.png);
    background-size: cover;
}
.example_title {
    margin-bottom: 20px;
}
.example_title img {
    width: 90%;
    margin: auto;
    display: block;
}
.cushion img {
    width: 100%;
    margin-top: -50px;
}
.example_box {
    margin-bottom: 25px;
}
.example_occupation {
    background-color: #ff7e7e;
    padding: 10px 15px;
    text-align: center;
    color: white;
    font-size: 1.8rem;
    border-radius: 20px 20px 0 0;
}
.example_occupation small {
    background-color: white;
    padding: 1px 3px;
    color: #ff7e7e;
    font-size: 1.2rem;
    margin-left: 4px;
}
.example_explanation {
    background-color: white;
    padding: 10px 15px 15px;
    border-radius: 0 0 20px 20px;
    box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.22);
}
.example_image img {
    width: 116px;
}
.example_point {
    padding-left: 10px;
}

.example_point ul.point-list li {
    position: relative;
    font-size: 1.4rem;
    padding: 8px 0px 0px 28px;
}
.example_point ul li span {
    font-weight: bold;
    color: #ff7e7e;
}
.example_point ul.point-list li:before {
    background: url(../images/check.png);
    background-size: contain;
    /* background-color: blue; */
    content: '';
    position: absolute;
    left: 4px;
    top: 10px;
    width: 20px;
    height: 20px;
    display: block;
    z-index: 1000;
}
.example_point ul.point-asterisk {
    font-size: 12px;
    margin: 0 0 8px 10px;
}
.example_box .btn-img img {
    margin: 10px 0 10px;
    width: 100%;
}

@media screen and (min-width: 480px) {
    .example_flex {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }
    .example_box {
        width: 31%;
    }
    .example_point ul.point-list li {
        position: relative;
        font-size: 1.4rem;
        padding: 5px 0px 0px 28px;
    }

    .example_occupation {
        font-size: 1.6rem;
    }
    .example_image img {
        width: 100px;
    }
    .example_point ul.point-list li:before {
        background: url(../images/check.png);
        background-size: contain;
        /* background-color: blue; */
        content: '';
        position: absolute;
        left: 0px;
        top: 7px;
        width: 17px;
        height: 17px;
        display: block;
        z-index: 1000;
        flex-shrink: 0;
    }
}
.example_asterisk {
    width: 95%;
    margin: auto;
    display: block;
}
.example_asterisk small {
    font-size: 1.2rem;
    color: gray;
}

/* スライダー関連のスタイル */
.example_slider {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0;
}

.slider-container {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    margin: 0 -30px;
    padding: 0 30px;
}

.slider-wrapper {
    display: flex;
    transition: transform 0.5s ease-in-out;
    width: 900%; /* 9つのスライド分 */
}

.example_box {
    width: 11.11%; /* 100% / 9 */
    flex-shrink: 0;
    opacity: 0.3;
    transition: opacity 0.3s ease-in-out;
    transform: scale(0.9);
    transition: all 0.3s ease-in-out;
}

.example_box.active {
    opacity: 1;
    transform: scale(1);
}

.example_box.prev,
.example_box.next {
    opacity: 0.6;
    transform: scale(0.95);
}

.slider-btn {
    background: #ff7e7e;
    color: white;
    border: none;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    font-size: 24px;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
    z-index: 20;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.slider-btn:hover {
    background: #d43d47;
}

.prev-btn {
    left: 10px;
    margin-right: 0;
    top: 130px;
}

.next-btn {
    right: 10px;
    margin-left: 0;
    top: 130px;
}

@media screen and (max-width: 768px) {
    .slider-container {
        margin: 0 -20px;
        padding: 0 20px;
    }

    .slider-btn {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }

    .prev-btn {
        left: 5px;
        margin-right: 0;
    }

    .next-btn {
        right: 5px;
        margin-left: 0;
    }

    /* スクロールインジケーター */
    .slider-container::after {
        content: '';
        position: absolute;
        bottom: -20px;
        left: 50%;
        transform: translateX(-50%);
        width: 60px;
        height: 4px;
        background: linear-gradient(90deg, transparent 0%, #ff7e7e 50%, transparent 100%);
        border-radius: 2px;
        opacity: 0.6;
        animation: scrollIndicator 2s ease-in-out infinite;
    }

    @keyframes scrollIndicator {
        0%,
        100% {
            opacity: 0.3;
            transform: translateX(-50%) scaleX(0.8);
        }
        50% {
            opacity: 0.8;
            transform: translateX(-50%) scaleX(1.2);
        }
    }
}
.example_logo img {
    margin: auto;
    display: block;
    width: 50%;
}

/* PC表示用のレイアウト変更 */

@media screen and (min-width: 768px) {
    .example_back {
        background-size: cover;
    }
    .example_title {
        width: 60%;
        margin: auto;
        margin-bottom: 30px;
    }
    .example_slider {
        max-width: 1200px;
        margin: 0 auto;
    }
    .slider-container {
        max-width: 100%;
        margin: 0 -50px;
        padding: 0 50px;
    }
    .slider-wrapper {
        width: 100%;
        display: flex;
        transition: transform 0.5s ease-in-out;
    }
    .example_box {
        width: 33.33%; /* 3つ並べる */
        flex-shrink: 0;
        opacity: 0.3;
        transition: all 0.3s ease-in-out;
        transform: scale(0.9);
    }
    .example_box.active {
        opacity: 1;
        transform: scale(1);
    }
    .example_box.prev,
    .example_box.next {
        opacity: 0.6;
        transform: scale(0.95);
    }

    .example_box {
        display: flex;
        flex-direction: column;
        padding: 8px;
        margin: 0 5px;
    }

    .example_occupation {
        font-size: 1.5rem;
        padding: 10px 12px;
    }

    .example_explanation {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .example_explanation .flex {
        flex-direction: column;
        align-items: center;
        flex: 1;
    }

    .example_image {
        width: 100%;
        margin-bottom: 10px;
    }

    .example_image img {
        width: 100%;
        height: 120px;
        object-fit: cover;
        object-position: center top; /* 顔の位置を調整 */
        border-radius: 6px;
    }

    /* 個別の画像の顔位置調整 */
    .example_image img[src*='example_01'] {
        object-position: center 20%; /* 療養病棟の顔位置 */
    }
    .example_image img[src*='example_02'] {
        object-position: center 30%; /* 訪問看護の顔位置 */
    }
    .example_image img[src*='example_03'] {
        object-position: center 25%; /* 有料老人ホームの顔位置 */
    }
    .example_image img[src*='example_04'] {
        object-position: center 20%; /* 美容クリニックの顔位置 */
    }
    .example_image img[src*='example_05'] {
        object-position: center 20%; /* 整形外科クリニックの顔位置 */
    }
    .example_image img[src*='example_06'] {
        object-position: center 30%; /* 透析クリニックの顔位置 */
    }
    .example_image img[src*='example_07'] {
        object-position: center 25%; /* 回復期リハビリ病棟の顔位置 */
    }
    .example_image img[src*='example_08'] {
        object-position: center 35%; /* 病院の顔位置 */
    }
    .example_image img[src*='example_09'] {
        object-position: center 55%; /* クリニックの顔位置 */
    }

    .example_point {
        width: 100%;
        padding-left: 0;
        flex: 1;
    }

    .btn-area {
        margin-top: auto;
        padding-top: 0px;
    }

    .example_point ul.point-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 4px 12px;
    }

    .example_point ul.point-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 2px 8px;
    }

    .example_point ul.point-list li {
        font-size: 1.4rem;
        padding: 7px 0px 0px 20px;
        line-height: 1.2;
        white-space: normal;
        display: flex;
        align-items: flex-start;
    }
    .example_asterisk {
        width: 95%;
        margin: auto;
        display: block;
    }
    .example_asterisk small {
        font-size: 1.2rem;
        color: gray;
    }
    .example_asterisk_group {
        margin-top: 40px;
    }
    .example_title img {
        width: 80%;
        margin: auto;
        display: block;
    }
}

/* ========================================
   タブ形式比較表のスタイル
   ======================================== */

/* タブナビゲーション */
.tab-navigation {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    border-radius: 15px 15px 0 0;
    padding: 0;
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 600px;
}

.tab-btn {
    padding: 16px 30px;
    border-bottom: none;
    border-radius: 15px 15px 0 0;
    background: #dfdfdf;
    color: #555555;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    transition: all 0.3s ease;
    flex: 1;
    text-align: center;
    position: relative;
    z-index: 1;
}

.tab-btn:hover {
    background: rgba(78, 205, 196, 0.1);
    color: #333;
}

.tab-btn.active {
    background: linear-gradient(135deg, #ff8484, #ff7d7d);
    color: white;
    border-bottom: none;
    z-index: 2;
}

.tab-content {
    display: none;
}

/* スマホ用のタブスタイル */
@media screen and (max-width: 480px) {
    .tab-btn {
        padding: 12px 8px;
        font-size: 14px;
        flex: none;
        min-width: 0;
    }

    .tab-btn:nth-child(1),
    .tab-btn:nth-child(2) {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .tab-btn:nth-child(3) {
        flex: 0 0 50%;
        max-width: 30%;
    }

    .work-style {
        width: 33%;
    }
    #search-criteria .comparison-table .general {
        width: 28%;
    }

    #search-criteria .general-item:nth-child(2) {
        padding: 4px 2px;
        font-size: 1rem !important;
    }

    #search-criteria .comparison-table .general {
        width: 22% !important;
    }
}

@media screen and (max-width: 361px) {
    #search-criteria .salary-label {
        font-size: 1rem;
    }
}

/* 各エージェント名の改行制御 */
/* 保育士人材バンクとほいく畑: 357px以下で改行 */
@media screen and (min-width: 358px) {
    .comparison-table .site-text br.sm_357 {
        display: none;
    }
}

/* レバウェル保育士: 369px以下で改行 */
@media screen and (min-width: 370px) {
    .comparison-table .site-text br.sm_369 {
        display: none;
    }
}

/* マイナビ保育士: 401px以下で改行 */
@media screen and (min-width: 402px) {
    .comparison-table .site-text br.sm_401 {
        display: none;
    }
}

/* スマホサイズ373px以下でexample_pointのfont-sizeを調整 */
@media screen and (max-width: 373px) {
    .example_point ul.point-list li {
        font-size: 1.2rem;
    }
}

.tab-content.active {
    display: block;
}

/* 表形式の比較表（総合タブ） */
.comparison-table-container {
    margin: -0.1px 0 0;
    overflow-x: auto;
    background: #ffffff;
    border-top: solid 3px #ff7e7e;
    padding: 0;
}

.comparison-table-wrapper {
    background: #f8f9fa;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    margin-top: -1px;
}

.comparison-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 12px;
    table-layout: fixed;
    border: none;
}

.comparison-table th {
    background: #ffffff;
    color: #000000;
    padding: 15px 8px;
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    border-bottom: 2px solid #e0e0e0;
    border-right: 1px solid #e0e0e0;
    border-left: none;
    border-top: none;
}

.comparison-table th:last-child {
    border-right: none;
}

.comparison-table td {
    padding: 15px 8px;
    border-right: 1px solid #e6e6e6;
    vertical-align: middle;
    border-left: none;
    border-top: none;
}

.comparison-table td:last-child {
    border-right: none;
}

/* 各列の幅を28%に固定 */
.comparison-table th.site-name,
.comparison-table td.site-name {
    width: 24%;
    vertical-align: middle;
    height: auto;
}
.comparison-table th.site-name {
    height: 50px;
    padding-top: 10px;
}
.comparison-table td.site-name {
    height: 124px;
}

.comparison-table th.coverage-area,
.comparison-table td.coverage-area {
    width: 18%;
}

.comparison-table th.job-count,
.comparison-table td.job-count {
    width: 18%;
}

.comparison-table th.features,
.comparison-table td.features {
    width: 30%;
}

.comparison-table th.job-types,
.comparison-table td.job-types {
    width: 25%;
}

.comparison-table th.facility-types,
.comparison-table td.facility-types {
    width: 25%;
}
.work-style {
    width: 35%;
}
.general {
    width: 24%;
}

/* スマホでも4列表示を維持 */
@media (max-width: 767px) {
    .comparison-table {
        font-size: 10px;
        width: 100%;
    }

    .comparison-table th {
        padding: 8px 4px;
        font-size: 13px;
    }

    .comparison-table td {
        padding: 8px 4px;
    }
}

.site-row {
    transition: all 0.3s ease;
    position: relative;
}

.site-row:hover:not(.featured-1):not(.featured-2):not(.featured-3) {
    background: linear-gradient(135deg, #f8f9fa, #ffffff);
    transform: scale(1.02);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

/* 各サイトの特徴的な色分け */
.comparison-table .site-row.featured-1 {
    background: linear-gradient(135deg, #fff5f5, #ffffff) !important;
}

.comparison-table .site-row.featured-1 .site-name {
    border-left: 5px solid #ff7f7f !important;
}
.comparison-table .site-row.featured-1 .site-btn {
    border-left: 5px solid #ff7f7f !important;
}

.comparison-table .site-row.featured-1:hover {
    background: linear-gradient(135deg, #fff8f0, #ffffff) !important;
}

.comparison-table .site-row.featured-1:hover .site-name {
    border-left: 5px solid #ff7f7f !important;
}

.comparison-table .site-row.featured-2 {
    background: linear-gradient(135deg, #f0fffe, #ffffff) !important;
}

.comparison-table .site-row.featured-2 .site-name {
    border-left: 5px solid #4ecdc4 !important;
}
.comparison-table .site-row.featured-2 .site-btn {
    border-left: 5px solid #4ecdc4 !important;
}

.comparison-table .site-row.featured-2:hover {
    background: linear-gradient(135deg, #f0fffe, #ffffff) !important;
}

.comparison-table .site-row.featured-2:hover .site-name {
    border-left: 5px solid #4ecdc4 !important;
}

.comparison-table .site-row.featured-3 {
    background: linear-gradient(135deg, #fff8f0, #ffffff) !important;
}

.comparison-table .site-row.featured-4 {
    background: linear-gradient(135deg, #f9f9f9, #ffffff) !important;
}
.comparison-table .site-row.featured-3 .site-name {
    border-left: 5px solid #ffa726 !important;
}
.comparison-table .site-row.featured-3 .site-btn {
    border-left: 5px solid #ffa726 !important;
}

.comparison-table .site-row.featured-3:hover {
    background: linear-gradient(135deg, #fff8f0, #ffffff) !important;
}

.comparison-table .site-row.featured-3:hover .site-name {
    border-left: 5px solid #ffa726 !important;
}

.comparison-table .site-row.featured-4 .site-name {
    border-left: 5px solid #939393 !important;
}
.comparison-table .site-row.featured-4 .site-btn {
    border-left: 5px solid #939393 !important;
}

.site-name {
    text-align: center;
    vertical-align: middle;
}

.site-logo {
    margin-bottom: 8px;
}

.site-logo img {
    width: 40px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
}

.site-title {
    margin-bottom: 8px;
}

.site-title a {
    font-weight: bold;
    font-size: 13px;
    color: #333;
    text-decoration: none;
    line-height: 1.2;
}

.site-title a:hover {
    color: #4ecdc4;
}

.site-button {
    margin-top: 5px;
    width: 100%;
}

.site-button .btn-primary {
    padding: 8px 11px;
    font-size: 11px;
    border-radius: 15px;
    width: 100%;
    font-weight: bold;
}

/* スマホでの調整 */
@media (max-width: 767px) {
    .site-logo img {
        width: 30px;
    }

    .site-button .btn-primary {
        font-size: 9px;
        width: 100%;
        padding: 7px 6px;
        font-size: 11px;
        width: 100%;
        font-weight: bold;
    }
    .sm_only {
        display: block !important;
    }
    .site-btn .btn-primary {
        font-size: 1.3rem;
        padding: 10px 10px;
        width: 95%;
    }
}

/* 対応エリアのスタイル */
.coverage-area-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.coverage-icon {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.coverage-area-content span {
    font-size: 14px;
    font-weight: bold;
    color: #333;
}

/* 求人数のスタイル */
.job-count-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
}

.job-count-mark {
    display: flex;
    justify-content: center;
    align-items: center;
}

.mark-icon {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.job-count-text {
    font-size: 12px;
    font-weight: bold;
    color: #333;
    text-align: center;
}

.features-text {
    color: #666;
    font-size: 11px;
    line-height: 1.4;
    text-align: left;
    padding: 5px 0;
}

/* スマホでの調整 */
@media (max-width: 767px) {
    .coverage-icon {
        width: 31px;
        height: 31px;
    }

    .coverage-area-content span {
        font-size: 12px;
    }

    .mark-icon {
        width: 30px;
        height: 30px;
    }

    .job-count-text {
        font-size: 10px;
    }

    .features-text {
        font-size: 11px;
        line-height: 1.5;
        padding: 3px 0;
    }
    .features-text small {
        font-size: 7px;
        line-height: 1.3;
        color: gray;
    }
}
.features-text span {
    font-weight: bold;
    background: linear-gradient(transparent 50%, #ff6 50%);
}
.comparison-asterisk {
    margin: 10px 20px 10px;
    font-size: 11px;
    line-height: 1.3;
    color: gray;
}

.btn-primary {
    display: inline-block;
    position: relative;
    background: linear-gradient(135deg, #ff9e50, #ff933c);
    color: white;
    padding: 15px 30px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: bold;
    font-size: 16px;
    text-align: center;
    overflow: hidden;
    animation: btn_animation 2s infinite;
    box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
    border: none;
    cursor: pointer;
}

.btn-primary:hover {
    text-decoration: none;
    color: white;
}

@keyframes btn_animation {
    0% {
        box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
        top: 0px;
    }
    10% {
        box-shadow: 0 0 0 rgba(0, 0, 0, 0.3);
        top: 3px;
    }
    20% {
        box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
        top: 0px;
    }
    30% {
        box-shadow: 0 0 0 rgba(0, 0, 0, 0.3);
        top: 3px;
    }
    40% {
        box-shadow: 0 3px 0 rgba(0, 0, 0, 0.3);
        top: 0px;
    }
}

/* 職種・施設対応度のバッジ */
.job-types,
.facility-types {
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.job-item,
.facility-item {
    display: flex;
    align-items: center;
    margin: 2px 0;
    font-size: 11px;
    padding: 6px 12px;
    border-radius: 15px;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border: 1px solid #dee2e6;
}

.job-label,
.facility-label {
    font-weight: normal;
    width: 100%;
    text-align: left;
}

.job-colon,
.facility-colon {
    color: #333;
    font-weight: normal;
    width: 10%;
    text-align: center;
}

.job-mark,
.facility-mark {
    width: 30%;
    text-align: center;
    font-weight: bold;
}

.job-mark.excellent,
.facility-mark.excellent {
    background: linear-gradient(135deg, #ff69b4, #ff1493);
    color: white;
}

.job-mark.good,
.facility-mark.good {
    background: linear-gradient(135deg, #ffd700, #ffb347);
    color: #333;
}

/* 職種・施設表示（PC・スマホ共通） */
.job-item,
.facility-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2px 0;
    padding: 0 6px;
    border-radius: 8px;
    background: white;
    border: 1px solid #ff7d7d;
    display: inline-block;
    color: #ff7e7e;
    font-weight: bold;
}

.job-label,
.facility-label {
    font-size: 11px;
    flex: 1;
    text-align: left;
    font-weight: bold;
}
@media (max-width: 360px) {
    .job-label,
    .facility-label {
        font-size: 10px;
        flex: 1;
        text-align: left;
    }
}
@media (min-width: 768px) {
    .facility-item {
        padding: 8px 16px;
        margin: 4px;
        border-radius: 10px;
        font-size: 1.4rem;
    }
    .facility-label {
        font-size: 1.4rem;
    }
}

.job-colon,
.facility-colon {
    display: none;
}

.job-mark,
.facility-mark {
    font-size: 16px;
    font-weight: bold;
    padding: 0px 0px;
    border-radius: 0 8px 8px 0;
    background: white !important;
    min-width: 28px;
    text-align: center;
}

.job-mark.excellent,
.facility-mark.excellent {
    color: #f54852;
}

.job-mark.good,
.facility-mark.good {
    color: #484848;
}

/* 勤務形態のスタイル */
.work-type-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 2px 0;
    padding: 0 0px 0 0px;
    border-radius: 8px;
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border: 1px solid #dee2e6;
}

.work-type-label {
    font-size: 10px;
    flex: 1;
    text-align: center;
    font-weight: bold;
}

.work-type-label small {
    font-size: 8px;
}

.work-type-item:nth-child(1) {
    background: linear-gradient(135deg, #ffe6e6, #ffcccc);
    border-color: #ff9999;
    color: #ff4d4d;
}

.work-type-item:nth-child(2) {
    background: linear-gradient(135deg, #fff8e1, #ffecb3);
    border-color: #ffcc02;
    color: #ff9800;
}

.work-type-item:nth-child(3) {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border-color: #90caf9;
    color: #008dff;
}
.work-type-item:nth-child(4) {
    background: linear-gradient(135deg, #f5fff9, #eaf6ee);
    border-color: #80cb9d;
    color: #00ab41;
}

/* スマホ版でのみ改行を表示 */
@media (max-width: 767px) {
    .sm_only {
        display: block !important;
    }
}

@media (min-width: 768px) {
    .sm_only {
        display: none;
    }
    .site-row-additional {
        display: none !important;
    }

    /* PC版の勤務形態レイアウト */
    .work-type-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 4px;
    }

    .work-type-item {
        width: fit-content;
        min-width: 80px;
        padding: 4px 8px;
        margin: 0;
    }

    .work-type-label {
        font-size: 14px;
        white-space: nowrap;
    }

    .work-type-label small {
        font-size: 11px;
    }
    #overall .comparison-table th.site-name,
    #overall .comparison-table td.site-name {
        width: 28%;
    }
}

/* 総合タブ専用のスタイル */
#overall .comparison-table th.site-name,
#overall .comparison-table td.site-name {
    width: 30%;
}
#overall .comparison-table th.site-name {
    height: 65px;
    padding-top: 10px;
}
#overall .comparison-table td.site-name {
    height: 124px;
}

#overall .comparison-table th.coverage-area,
#overall .comparison-table td.coverage-area {
    width: 18%;
}

#overall .comparison-table th.job-count,
#overall .comparison-table td.job-count {
    width: 18%;
}

#overall .comparison-table th.features,
#overall .comparison-table td.features {
    width: 34%;
}

/* 取扱求人タブ専用のスタイル */

#jobs .comparison-table th.work-type,
#jobs .comparison-table td.work-type {
    width: 17%;
}
th.work-type,
td.work-type {
    width: 17%;
}

#jobs .comparison-table th.job-count {
    width: 54%;
}
#jobs-agent .comparison-table th.job-count {
    width: 54%;
}

#jobs .comparison-table th.job-types,
#jobs .comparison-table td.job-types {
    width: 15%;
}

#jobs .comparison-table th.facility-types,
#jobs .comparison-table td.facility-types {
    width: 30%;
}

@media (min-width: 767px) {
    .features-text {
        color: #666;
        font-size: 16px;
        line-height: 1.8;
        text-align: left;
        padding: 5px 0;
    }
    .coverage-icon {
        width: 40px;
        height: 40px;
        object-fit: contain;
    }
    .mark-icon {
        width: 40px;
        height: 40px;
        object-fit: contain;
    }
    .site-button .btn-primary {
        font-size: 14px;
        font-weight: bold;
    }
}
.hikaku-microcopy {
    font-size: 1.1rem;
    margin-bottom: 3px;
    color: #666;
    margin-top: -5px;
    letter-spacing: 0.1;
}

@media (min-width: 767px) {
    .hikaku-microcopy {
        font-size: 1.5rem;
    }
}
.hikaku-microcopy span {
    color: #1db700;
    font-weight: bold;
}

/* 下の表の利用可能な検索条件タブ専用スタイル */
#search-criteria-agent-table .general-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

#search-criteria-agent-table .general-item {
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 4px 4px;
    margin: 1px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

#search-criteria-agent-table .general-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
}

#search-criteria-agent-table .general-label {
    font-weight: 500;
    font-size: 0.9rem;
    color: #495057;
    display: block;
    text-align: center;
    line-height: 1.2;
}

/* 下の表の一般項目の色分け */
#search-criteria-agent-table .general-area {
    background: linear-gradient(135deg, #e3f2fd, #bbdefb);
    border-color: #2196f3;
}

#search-criteria-agent-table .general-area .general-label {
    color: #1976d2;
}

#search-criteria-agent-table .general-type {
    background: linear-gradient(135deg, #f3e5f5, #e1bee7);
    border-color: #9c27b0;
}

#search-criteria-agent-table .general-type .general-label {
    color: #7b1fa2;
}

#search-criteria-agent-table .general-job {
    background: linear-gradient(135deg, #f1f8e9, #e8f5e8);
    border-color: #4caf50;
}

#search-criteria-agent-table .general-job .general-label {
    color: #388e3c;
}

#search-criteria-agent-table .general-facility {
    background: linear-gradient(135deg, #fff8e1, #fff3e0);
    border-color: #ff9800;
}

#search-criteria-agent-table .general-facility .general-label {
    color: #f57c00;
}

#search-criteria-agent-table .general-assignment {
    background: linear-gradient(135deg, #fce4ec, #f8bbd9);
    border-color: #e91e63;
}

#search-criteria-agent-table .general-assignment .general-label {
    color: #c2185b;
}

/* 下の表の給与項目 */
#search-criteria-agent-table .salary-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

#search-criteria-agent-table .salary-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
}

#search-criteria-agent-table .salary-label {
    font-weight: 500;
    font-size: 1.1rem;
    color: #495057;
    display: block;
    text-align: center;
    line-height: 1.2;
}

#search-criteria-agent-table .salary-amount {
    background: linear-gradient(135deg, #fff8e1, #ffecb3);
    border-color: #ffc107;
}

#search-criteria-agent-table .salary-amount .salary-label {
    color: #f57f17;
}

#search-criteria-agent-table .reword-amount {
    background: linear-gradient(135deg, #e8f5e8, #c8e6c9);
    border-color: #4caf50;
}

#search-criteria-agent-table .reword-amount .salary-label {
    color: #388e3c;
}

/* 下の表の働き方項目 */
#search-criteria-agent-table .work-style-container {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

#search-criteria-agent-table .work-style-item {
    background: linear-gradient(135deg, #ffffff, #ffffff);
    border: 1px solid #009dd2;
    border-radius: 8px;
    padding: 4px 4px;
    margin: 1px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

#search-criteria-agent-table .work-style-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    background: linear-gradient(135deg, #f8f9fa, #e9ecef);
}

#search-criteria-agent-table .work-style-label {
    font-weight: 500;
    font-size: 1.1rem;
    color: #009dd2;
    display: block;
    text-align: center;
    line-height: 1.2;
}

/* 下の表のPC用項目サイズ調整 */
@media screen and (min-width: 481px) {
    #search-criteria-agent-table .general-item,
    #search-criteria-agent-table .salary-item,
    #search-criteria-agent-table .work-style-item {
        padding: 8px 16px;
        margin: 4px;
        border-radius: 10px;
    }

    #search-criteria-agent-table .general-label,
    #search-criteria-agent-table .salary-label,
    #search-criteria-agent-table .work-style-label {
        font-size: 1.4rem;
        font-weight: 600;
    }

    #search-criteria-agent-table .general-container,
    #search-criteria-agent-table .salary-container,
    #search-criteria-agent-table .work-style-container {
        gap: 6px;
    }
}

/* スマホで給与◯円以上のpadding調整 */
@media screen and (max-width: 480px) {
    #search-criteria-agent-table .reword-amount {
        padding: 4px 2px;
    }
}

/* 367px以下で給与◯円以上のフォントサイズ調整 */
@media screen and (max-width: 367px) {
    #search-criteria-agent-table .reword-amount .salary-label {
        font-size: 0.9rem;
    }
}

/*ーーーー保育士転職独自ーーーー*/
/*表*/
.support span {
}
.support-item {
}
.support-label {
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 2px 3px;
    margin: 1px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    display: inline-block;
    font-size: 9px;
    letter-spacing: 0.03em;
    background-color: white;
    font-weight:bold;
}
.support-label.tensaku {
    border-color: #2196f3;
    color: #2196f3;
}
.support-label.taisaku {
    border-color: #4caf50;
    color: #4caf50;
}

.support-label.doukou {
    border-color: #9c27b0;
    color: #9c27b0;
}
.support-label.afterfollow {
    border-color: #e91e63;
    color: #e91e63;
}
.support-label.kousyo {
    border-color: #ff9800;
    color: #ff9800;
}
@media screen and (min-width: 481px) {
    .support-label {
        padding: 8px 10px;
        margin: 4px;
        border-radius: 10px;
        font-size: 1.4rem;
    }
}

/*コンテンツ*/
.connect img {
    width: 100%;
    display: block;
}

.syosai-btn-area {
    text-align: center;
    background-color: #f6ffeb;
}
.syosai-btn-area .content {
    padding: 20px 0 40px;
}
@media screen and (max-width: 481px) {
    .syosai-btn-area img {
        width: 100%;
    }
    .syosai-btn-area .content {
        padding: 20px 10px 40px;
    }
}

.asterisk small {
    font-size: 0.9rem;
    line-height: 1.3;
    color: gray;
    margin-bottom: 0px;
    letter-spacing: 0;
    margin-top: 15px;
    display: block;
}
@media screen and (max-width: 481px) {
    .coverage-area small {
        font-size: 0.9rem;
        line-height: 1.3;
        color: gray;
        margin-bottom: 0px;
        letter-spacing: 0;
        margin-top: 0px;
        display: block;
    }
}