@charset "utf-8";
/* =====================================================================
   職員募集 独立ページ 専用スタイル

   ・ヘッダー／KV／見出し・ナビの体裁は本体サイト（sub.php）と共通。
     ベースは common.css → subpage.css が担当し、
     このファイルは「body#recruit のときの差分」だけを持つ。
   ・KV背景は sub_bg_recruit.jpg（sub_bg_1b.jpg の丸バッジ文字を
     「職員募集 / Recruit」に差し替えたもの・2500x1500）。
     画像下端は #FBF5F5 にフェードしてあるので、
     背景色 #FBF5F5 とつなげば境目が出ない。
   ・パンフレットの内容（看板画像／理念・方針／施設概要／園長あいさつ／
     年間行事／1日の流れ／先輩職員の声／SMILEの働きやすさ／
     園舎のご紹介／よくあるご質問）は、見出しリボンのみ画像で
     本文はすべてテキスト。
   ・ブレークポイントは本体サイトに合わせて 960px。
   ===================================================================== */


/* ---- KV背景（PC）------------------------------------------------- */

body#recruit #wrapper {
    width: 100%;
    color: #322825;
    background: url(/common/img/sub_bg_recruit.jpg) top center no-repeat #FBF5F5;
}
@media screen and (max-width: 960px) {
    /* SP は sub.php と同じく背景画像を使わない（ヘッダーの smp_kanban_sub.jpg のみ） */
    body#recruit #wrapper {
        background: none;
    }
}


/* ---- セクション（配色は intro と同じピンク）---------------------- */

#wrapper .unit.recruit {
    padding: 100px 0 0 0;
}
#wrapper .unit.recruit .navi a        { background:#eedde8; }
#wrapper .unit.recruit .navi a.active { background:#e2c4da; }
#wrapper .unit.recruit h2,
#wrapper .unit.recruit h2.no-border   { border-color: #e2c4da; }

@media screen and (max-width: 960px) {
    #wrapper .unit.recruit {
        margin: 0;
        padding: 4vw 0 0 0;
        background: #FBF5F5;
    }
}


/* ---- 制作コンテンツ共通 ------------------------------------------ */

/* 読み幅は sub.php の .in と同じインセット（1160 - 200*2 = 760px） */
#wrapper .unit.recruit .rc-sec {
    margin: 0 0 100px;
    padding: 0 200px;
    font-family: "Zen Maru Gothic", "M PLUS Rounded 1c", "Kosugi Maru",
                 "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    line-height: 1.9;
    letter-spacing: 0.02em;
}
#wrapper .unit.recruit .rc-sec:last-child { margin-bottom: 20px; }

/* フレックスアイテムの自動最小サイズ（min-width:auto）を無効化。
   これを入れないと、中の写真の実寸にアイテムが押し広げられ、
   狭い画面で横にはみ出す。 */
#wrapper .unit.recruit .rc-bubble,
#wrapper .unit.recruit .rc-months .m,
#wrapper .unit.recruit .rc-day ul,
#wrapper .unit.recruit .rc-voice,
#wrapper .unit.recruit .rc-enchou-photos,
#wrapper .unit.recruit .rc-enchou-text,
#wrapper .unit.recruit .rc-ict-logos,
#wrapper .unit.recruit .rc-ict-text,
#wrapper .unit.recruit .rc-voice-photos img,
#wrapper .unit.recruit .v-photo,
#wrapper .unit.recruit .v-name {
    min-width: 0;
}
#wrapper .unit.recruit .rc-sec img { max-width: 100%; }


/* ---- 看板画像（表面パンフレットのキャッチコピー）------------------
   .rc-sec の外側に置いているので、コンテンツ列いっぱい（1160px）に出る。
   ※ kanban.jpg の原寸は 1160x1000。原寸を超えて引き伸ばすとぼやけるので
     max-width で上限を切る（PC＝最大1160px／SP＝画面幅100%）*/

#wrapper .unit.recruit .rc-kanban {
    max-width: 1160px;   /* = 画像の原寸幅 */
    margin: 0 auto 80px;
}
#wrapper .unit.recruit .rc-kanban img {
    display: block;
    width: 100%;
    max-width: 1160px;   /* 原寸以上には拡大しない */
    height: auto;
    margin: 0 auto;
    border-radius: 14px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.10);
}


/* ---- 見出しリボン ------------------------------------------------ */

#wrapper .unit.recruit .rc-ttl {
    margin: 0 0 46px;
    text-align: center;
    line-height: 1;
}
#wrapper .unit.recruit .rc-ttl img {
    width: 440px;
    max-width: 88%;
    height: auto;
}
#wrapper .unit.recruit .rc-ttl-l img { width: 330px; }
#wrapper .unit.recruit .rc-ttl-smile img { width: 100%; }

#wrapper .unit.recruit .rc-subttl {
    margin: 0 0 12px;
    padding: 4px 0 4px 14px;
    font-size: 0.9em;
    font-weight: 700;
    color: #3f8f6f;
    border-left: solid 8px #bfe0cf;
}


/* ---- 理念・方針 --------------------------------------------------- */

#wrapper .unit.recruit .rc-bubbles {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
/* 背景はチラシから抜いた水彩ブロブ（ギザギザの輪郭・にじみの質感つき）。
   形が画像なので border-radius は使わず、背景を枠いっぱいに伸ばす。 */
#wrapper .unit.recruit .rc-bubble {
    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;
    width: 32.4%;
    padding: 52px 14px 48px;
    text-align: center;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100% 100%;
}
#wrapper .unit.recruit .rc-bubble h4 {
    margin: 0 0 8px;
    font-size: 1.0em;
    font-weight: 700;
    text-shadow: 0 0 5px #fff, 0 0 5px #fff;
}
#wrapper .unit.recruit .rc-bubble p {
    margin: 0;
    font-size: 0.63em;
    line-height: 1.75;
}
#wrapper .unit.recruit .b-pink   { background-image: url(/recruit/img/blob_pink.png?v=202607); }
#wrapper .unit.recruit .b-blue   { background-image: url(/recruit/img/blob_blue.png?v=202607); }
#wrapper .unit.recruit .b-orange { background-image: url(/recruit/img/blob_orange.png?v=202607); }
#wrapper .unit.recruit .b-pink   h4 { color: #E4566B; }
#wrapper .unit.recruit .b-blue   h4 { color: #1B93D4; }
#wrapper .unit.recruit .b-orange h4 { color: #E08A17; }


/* ---- 施設概要（表）------------------------------------------------ */

#wrapper .unit.recruit .rc-tbl-wrap {
    margin: 0 0 46px;
    overflow-x: auto;
}
#wrapper .unit.recruit .rc-tbl {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85em;
    background: #fff;
}
#wrapper .unit.recruit .rc-tbl th,
#wrapper .unit.recruit .rc-tbl td {
    padding: 0.7em 0.6em;
    border: solid 1px #e6d6cf;
    text-align: center;
    vertical-align: middle;
}
#wrapper .unit.recruit .rc-tbl th { background: #FCE6DE; font-weight: 700; }
#wrapper .unit.recruit .rc-tbl th.h2 { background: #FBEFE9; }
#wrapper .unit.recruit .rc-tbl-time th { text-align: left; white-space: nowrap; }


/* ---- 園舎のご紹介 -------------------------------------------------- */

/* 見取り図は番号が小さいので、読みやすいよう本文幅（760px）より広く出す。
   幅 928px（本文幅の約1.22倍） */
#wrapper .unit.recruit .rc-plan-wrap {
    margin: 0 -84px 46px;
    overflow-x: auto;
}
#wrapper .unit.recruit .rc-plan { margin: 0; }
#wrapper .unit.recruit .rc-plan img {
    display: block;
    width: 100%;
    height: auto;
}

#wrapper .unit.recruit .rc-fcards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#wrapper .unit.recruit .rc-fcards .fc {
    position: relative;
    width: 32%;
    margin: 0 2% 26px 0;
    list-style: none;
    min-width: 0;
}
#wrapper .unit.recruit .rc-fcards .fc:nth-child(3n) { margin-right: 0; }
#wrapper .unit.recruit .rc-fcards .fc img {
    display: block;
    width: 100%;
    height: auto;
    padding: 6px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14);
}
#wrapper .unit.recruit .fc-no {
    position: absolute;
    top: -12px;
    left: -8px;
    z-index: 2;
    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;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #0FA098;
    color: #fff;
    font-size: 0.7em;
    font-weight: 700;
    line-height: 1;
}
#wrapper .unit.recruit .fc-tag {
    position: absolute;
    right: 10px;
    bottom: 14px;
    padding: 0.3em 1em;
    border-radius: 999px;
    color: #fff;
    font-size: 0.6em;
    font-weight: 700;
    line-height: 1.5;
    white-space: nowrap;
}
#wrapper .unit.recruit .t-teal   { background: #0FA098; }
#wrapper .unit.recruit .t-blue   { background: #48C0F0; }
#wrapper .unit.recruit .t-orange { background: #F08000; }


/* ---- よくあるご質問 ------------------------------------------------ */

#wrapper .unit.recruit .rc-qa { margin: 0; }
#wrapper .unit.recruit .rc-qa dt {
    position: relative;
    margin: 0 0 10px;
    padding: 0 0 8px 2.1em;
    border-bottom: dotted 2px #bfe0cf;
    color: #1E8F86;
    font-size: 0.86em;
    font-weight: 700;
    line-height: 1.6;
}
#wrapper .unit.recruit .rc-qa dt:before {
    content: "Q";
    position: absolute;
    left: 0;
    top: 0.05em;
    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;
    width: 1.6em;
    height: 1.6em;
    border-radius: 50%;
    background: #0FA098;
    color: #fff;
    font-size: 0.85em;
    font-weight: 700;
}
#wrapper .unit.recruit .rc-qa dd {
    position: relative;
    margin: 0 0 34px;
    padding: 0 0 0 2.4em;
    font-size: 0.76em;
    line-height: 1.95;
}
#wrapper .unit.recruit .rc-qa dd:before {
    content: "A";
    position: absolute;
    left: 0;
    top: 0.15em;
    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;
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    background: #F0808A;
    color: #fff;
    font-size: 0.95em;
    font-weight: 700;
}
#wrapper .unit.recruit .rc-qa dd:last-child { margin-bottom: 0; }


/* ---- 園長あいさつ ------------------------------------------------- */

#wrapper .unit.recruit .rc-enchou-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
#wrapper .unit.recruit .rc-enchou-photos { width: 27%; }
#wrapper .unit.recruit .rc-enchou-photos img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 18px;
    padding: 7px;
    background: #fff;
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.12);
}
#wrapper .unit.recruit .rc-enchou-photos img:nth-child(1) { -ms-transform: rotate(-2deg);  transform: rotate(-2deg); }
#wrapper .unit.recruit .rc-enchou-photos img:nth-child(2) { -ms-transform: rotate(1.5deg); transform: rotate(1.5deg); }
#wrapper .unit.recruit .rc-enchou-photos img:nth-child(3) { -ms-transform: rotate(-1deg);  transform: rotate(-1deg); }

#wrapper .unit.recruit .rc-enchou-text {
    width: 69%;
    padding: 30px 30px;
    background: #FFFBF0;
    border: solid 3px #F5D9A8;
    border-radius: 40px;
    font-size: 0.85em;
}
#wrapper .unit.recruit .rc-enchou-text p { margin: 0 0 1.2em; }
#wrapper .unit.recruit .rc-sign {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 26px;
}
#wrapper .unit.recruit .rc-sign img {
    width: 165px;      /* 110px の 150% */
    height: 165px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 22px;
}
#wrapper .unit.recruit .rc-sign p { margin: 0; text-align: left; }
#wrapper .unit.recruit .rc-sign span { display: block; font-size: 0.8em; color: #7a8f6a; }
#wrapper .unit.recruit .rc-sign em { font-style: normal; font-size: 1.35em; font-weight: 700; }


/* ---- 年間行事 ----------------------------------------------------- */

#wrapper .unit.recruit .rc-months {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#wrapper .unit.recruit .rc-months .m {
    width: 32%;
    margin: 0 2% 22px 0;
    padding: 14px 14px 16px;
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07);
    list-style: none;
}
#wrapper .unit.recruit .rc-months .m:nth-child(3n) { margin-right: 0; }

#wrapper .unit.recruit .m-badge {
    display: -webkit-box;
    display: -ms-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin: 0 8px 8px 0;
    border-radius: 50%;
    color: #fff;
    font-size: 0.66em;
    font-weight: 700;
    line-height: 1;
    vertical-align: middle;
}
#wrapper .unit.recruit .m-badge b { font-size: 1.9em; font-weight: 700; margin-right: 2px; }

#wrapper .unit.recruit .m-ev {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 62px);
    margin: 0 0 8px;
}
#wrapper .unit.recruit .m-ev li {
    position: relative;
    padding-left: 1.1em;
    font-size: 0.66em;
    line-height: 1.6;
    list-style: none;
}
#wrapper .unit.recruit .m-ev li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.62em;
    width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
}
#wrapper .unit.recruit .m-photo { margin: 0; }
#wrapper .unit.recruit .m-photo img {
    display: block;
    width: 100%;
    height: auto;
    padding: 6px;
    background: #fff;
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.13);
}

#wrapper .unit.recruit .m04 .m-badge { background: #EE9BA9; }
#wrapper .unit.recruit .m05 .m-badge { background: #93C023; }
#wrapper .unit.recruit .m06 .m-badge { background: #23A83B; }
#wrapper .unit.recruit .m07 .m-badge { background: #E8B018; }
#wrapper .unit.recruit .m08 .m-badge { background: #E86800; }
#wrapper .unit.recruit .m09 .m-badge { background: #C87800; }
#wrapper .unit.recruit .m10 .m-badge { background: #786850; }
#wrapper .unit.recruit .m11 .m-badge { background: #E85860; }
#wrapper .unit.recruit .m12 .m-badge { background: #C05860; }
#wrapper .unit.recruit .m01 .m-badge { background: #00A0E8; }
#wrapper .unit.recruit .m02 .m-badge { background: #0868B8; }
#wrapper .unit.recruit .m03 .m-badge { background: #9088C0; }
#wrapper .unit.recruit .m04 .m-ev li:before { background: #EE9BA9; }
#wrapper .unit.recruit .m05 .m-ev li:before { background: #93C023; }
#wrapper .unit.recruit .m06 .m-ev li:before { background: #23A83B; }
#wrapper .unit.recruit .m07 .m-ev li:before { background: #E8B018; }
#wrapper .unit.recruit .m08 .m-ev li:before { background: #E86800; }
#wrapper .unit.recruit .m09 .m-ev li:before { background: #C87800; }
#wrapper .unit.recruit .m10 .m-ev li:before { background: #786850; }
#wrapper .unit.recruit .m11 .m-ev li:before { background: #E85860; }
#wrapper .unit.recruit .m12 .m-ev li:before { background: #C05860; }
#wrapper .unit.recruit .m01 .m-ev li:before { background: #00A0E8; }
#wrapper .unit.recruit .m02 .m-ev li:before { background: #0868B8; }
#wrapper .unit.recruit .m03 .m-ev li:before { background: #9088C0; }


/* ---- 1日の流れ ---------------------------------------------------- */

#wrapper .unit.recruit .rc-day {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
#wrapper .unit.recruit .rc-day ul { width: 48%; }
#wrapper .unit.recruit .rc-day li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 8px;
    padding: 0.6em 1em;
    background: #FCE9E4;
    border-radius: 8px;
    font-size: 0.85em;
    list-style: none;
}
#wrapper .unit.recruit .rc-day li:nth-child(even) { background: #FDF2EF; }
#wrapper .unit.recruit .rc-day .t {
    position: relative;
    width: 5.6em;
    padding-left: 1.1em;
    color: #E07A63;
    font-weight: 700;
}
#wrapper .unit.recruit .rc-day .t:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.62em;
    width: 0.5em;
    height: 0.5em;
    border-radius: 50%;
    background: #E89A88;
}
#wrapper .unit.recruit .rc-note {
    margin: 18px 0 0;
    font-size: 0.72em;
    line-height: 1.9;
    color: #6b625e;
}


/* ---- 先輩職員の声 ------------------------------------------------- */

#wrapper .unit.recruit .rc-voices {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
#wrapper .unit.recruit .rc-voice { width: 48%; }
#wrapper .unit.recruit .v-head {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 22px;
}
#wrapper .unit.recruit .v-photo { margin: 0 16px 0 0; }
#wrapper .unit.recruit .v-photo img {
    display: block;
    width: 108px;
    height: 108px;
    border-radius: 50%;
    object-fit: cover;
    background: #fff;
}
#wrapper .unit.recruit .v-name {
    margin: 0;
    padding: 0.7em 1.2em;
    background: #FBF0DC;
    border-radius: 10px;
    font-size: 0.78em;
    line-height: 1.6;
}
#wrapper .unit.recruit .v-name em { font-style: normal; font-size: 1.3em; font-weight: 700; }

#wrapper .unit.recruit .v-qa { margin: 0; }
#wrapper .unit.recruit .v-qa dt {
    margin: 0 0 12px;
    padding: 0.7em 1em;
    text-align: center;
    border-radius: 999px;
    font-size: 0.76em;
    font-weight: 700;
    line-height: 1.6;
}
#wrapper .unit.recruit .v-qa dd {
    margin: 0 0 26px;
    padding: 1.5em 1.7em;
    border-radius: 46px;           /* PC は円に近い大きめの丸み */
    font-size: 0.72em;
    line-height: 1.85;
}
#wrapper .unit.recruit .v-n .v-qa dt { background: #DCEEF8; color: #1B7FB8; }
#wrapper .unit.recruit .v-n .v-qa dd { background: #E8F4FB; }
#wrapper .unit.recruit .v-t .v-qa dt { background: #FCE3D2; color: #D96A46; }
#wrapper .unit.recruit .v-t .v-qa dd { background: #FDF0E6; }

#wrapper .unit.recruit .rc-voice-photos {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 40px 0 0;
}
#wrapper .unit.recruit .rc-voice-photos img {
    width: 32%;
    height: auto;
    margin: 0 1.5%;
    padding: 7px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.13);
}
#wrapper .unit.recruit .rc-voice-photos img:nth-child(1) { -ms-transform: rotate(-2deg); transform: rotate(-2deg); }
#wrapper .unit.recruit .rc-voice-photos img:nth-child(2) { -ms-transform: rotate(2deg);  transform: rotate(2deg); }


/* ---- SMILEの働きやすさ -------------------------------------------- */

/* このセクションは .rc-sec と同じ要素なので、左右の 200px インセットは
   margin で確保し、padding は黄色パネルの内側余白として使う */
#wrapper .unit.recruit .rc-smile {
    margin: 0 200px 20px;
    padding: 34px 30px 40px;
    background: #FFFEF1;
    border-radius: 24px;
}
#wrapper .unit.recruit .rc-merit {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0 0 40px;
}
#wrapper .unit.recruit .rc-merit li {
    position: relative;
    margin: 0 1.4em 0.5em 0;
    padding-left: 1.2em;
    font-size: 0.88em;
    font-weight: 700;
    list-style: none;
}
#wrapper .unit.recruit .rc-merit li:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.66em;
    width: 0.55em;
    height: 0.55em;
    border-radius: 50%;
    background: #F07AA8;
}

#wrapper .unit.recruit .rc-ict {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
#wrapper .unit.recruit .rc-ict-logos {
    width: 25%;
    margin: 0;
    text-align: center;
}
#wrapper .unit.recruit .rc-ict-logos img {
    display: block;
    width: 66%;
    height: auto;
    margin: 0 auto 14px;
}
#wrapper .unit.recruit .rc-ict-logos img:nth-child(2) { width: 92%; }
#wrapper .unit.recruit .rc-ict-text { width: 71%; font-size: 0.72em; }
#wrapper .unit.recruit .rc-ict-text p { margin: 0 0 1em; }
#wrapper .unit.recruit .rc-ict-text em { font-style: normal; font-weight: 700; color: #E07A2E; }

#wrapper .unit.recruit .rc-cta { margin: 40px 0 0; text-align: center; }
#wrapper .unit.recruit .rc-cta a {
    display: inline-block;
    padding: 0.9em 3em;
    color: #fff;
    background: #F08AB0;
    border-radius: 999px;
    font-size: 0.95em;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 3px 0 #D9739A;
}


/* ---- 見学・エントリーのお申し込み（フォーム）---------------------- */

/* フォーム部の読み幅は .in 側（subpage.css: padding 20px 200px）に任せるので、
   rc-sec の左右インセットはここだけ殺す（＝他セクションと同じ 760px になる） */
#wrapper .unit.recruit .rc-entry { padding: 0; }

#wrapper .unit.recruit .rc-ttl-txt {
    margin: 0 0 6px;
    color: #D9739A;
    font-size: 1.5em;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-align: center;
}
#wrapper .unit.recruit .rc-entry .formHeaderMsg { text-align: center; }
#wrapper .unit.recruit .rc-entry .formHeaderMsg p { margin-bottom: 0.4em; }
#wrapper .unit.recruit .rc-entry .rc-form-note { font-size: 0.8em; color: #777; }
#wrapper .unit.recruit .rc-entry .formHeaderError li { list-style: none; }

/* ラベル列：「内容・見学候補日 *」が2行に折り返さないよう余白を詰める
   （ラベル文字は 179.8px ／ 既定だと dt の中身幅 197.6px に対し
     必須マーク span の padding:0.5em ぶんで 199.8px になり溢れていた）*/
#wrapper .unit.recruit .rc-entry .form-wrapper dt { padding: 0.9em; }
#wrapper .unit.recruit .rc-entry .form-wrapper dt span { padding: 0 0.2em; }

/* ボタン行は見出し列（dt）を消して中央に置く */
#wrapper .unit.recruit .rc-entry dt#btnConfirm-label,
#wrapper .unit.recruit .rc-entry dt#btnSubmit-label { display: none; }
#wrapper .unit.recruit .rc-entry dt#btnConfirm-label + dd,
#wrapper .unit.recruit .rc-entry dt#btnSubmit-label + dd {
    width: 100%;
    text-align: center;
}

/* 送信・確認ボタンは募集ページの CTA と同じピンクに */
#wrapper .unit.recruit .rc-entry input#btnConfirm,
#wrapper .unit.recruit .rc-entry input#btnSubmit {
    border: none;
    background: #F08AB0;
    box-shadow: 0 3px 0 #D9739A;
    border-radius: 999px;
    transition: opacity 0.2s ease-out, transform 0.1s ease-out, box-shadow 0.1s ease-out;
}
/* マウスON：サイト共通の .ov と同じ opacity .7 ＋ 影のぶん少し沈む */
#wrapper .unit.recruit .rc-entry input#btnConfirm:hover,
#wrapper .unit.recruit .rc-entry input#btnSubmit:hover {
    opacity: .7;
    transform: translateY(2px);
    box-shadow: 0 1px 0 #D9739A;
}
/* クリック中：完全に沈ませる */
#wrapper .unit.recruit .rc-entry input#btnConfirm:active,
#wrapper .unit.recruit .rc-entry input#btnSubmit:active {
    transform: translateY(3px);
    box-shadow: 0 0 0 #D9739A;
}
#wrapper .unit.recruit .rc-entry input#btnReturn {
    display: block;
    margin: 20px auto 0;
    padding: 0.7em 2.4em;
    border: solid 2px #ccc;
    background: #fff;
    border-radius: 999px;
    color: #666;
    font-weight: 700;
    cursor: pointer;
}


/* =========================== スマホ =========================== */

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

    #wrapper .unit.recruit .rc-sec { margin-bottom: 14vw; padding: 0 4vw; }
    #wrapper .unit.recruit .rc-ttl { margin-bottom: 7vw; }
    #wrapper .unit.recruit .rc-ttl img,
    #wrapper .unit.recruit .rc-ttl-l img,
    #wrapper .unit.recruit .rc-ttl-smile img { width: 78%; max-width: 100%; }

    /* 理念・方針：縦積み（ブロブは枠に合わせて伸縮） */
    #wrapper .unit.recruit .rc-bubble {
        width: 100%;
        margin-bottom: 5vw;
        padding: 11vw 12vw 10vw;
    }
    /* SPは本文 12.6px で小さく読みづらいため +50%（見出しも同率で拡大し比率を維持）。
       文字が増えたぶんブロブが縦に伸びないよう、上下パディングを詰めて相殺する。 */
    #wrapper .unit.recruit .rc-bubble    { padding: 7vw 11vw 6vw; }
    #wrapper .unit.recruit .rc-bubble h4 { font-size: 1.5em; }
    #wrapper .unit.recruit .rc-bubble p  { font-size: 0.945em; }

    /* 看板画像 */
    /* SP は画面幅いっぱい（100%）で表示する */
    #wrapper .unit.recruit .rc-kanban { max-width: none; margin: 0 0 10vw; }
    #wrapper .unit.recruit .rc-kanban img { max-width: 100%; border-radius: 8px; }

    /* 園舎のご紹介：見取り図は横スクロール、写真カードは2列 */
    #wrapper .unit.recruit .rc-plan-wrap { margin: 0 0 6vw; }
    #wrapper .unit.recruit .rc-plan img { min-width: 700px; }
    #wrapper .unit.recruit .rc-fcards .fc {
        width: 49%;
        margin: 0 2% 6vw 0;
    }
    #wrapper .unit.recruit .rc-fcards .fc:nth-child(3n) { margin-right: 2%; }
    #wrapper .unit.recruit .rc-fcards .fc:nth-child(2n) { margin-right: 0; }
    #wrapper .unit.recruit .fc-no {
        top: -8px;
        left: -5px;
        width: 8vw;
        height: 8vw;
        font-size: 3.4vw;
    }
    #wrapper .unit.recruit .fc-tag {
        right: 6px;
        bottom: 10px;
        padding: 0.25em 0.8em;
        font-size: 2.9vw;
    }

    /* よくあるご質問 */
    #wrapper .unit.recruit .rc-qa dt { font-size: 4vw; }
    #wrapper .unit.recruit .rc-qa dd { font-size: 3.5vw; margin-bottom: 8vw; }

    /* 施設概要：横スクロール可 */
    #wrapper .unit.recruit .rc-tbl { font-size: 3.4vw; }
    #wrapper .unit.recruit .rc-tbl-class { min-width: 500px; }

    /* 園長あいさつ：写真を横並び→本文 */
    #wrapper .unit.recruit .rc-enchou-photos {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        margin-bottom: 5vw;
    }
    #wrapper .unit.recruit .rc-enchou-photos img { width: 32%; margin: 0 0.6%; }
    #wrapper .unit.recruit .rc-enchou-text {
        width: 100%;
        padding: 6vw 5vw;
        border-radius: 24px;
    }
    #wrapper .unit.recruit .rc-sign { justify-content: center; }
    #wrapper .unit.recruit .rc-sign img { width: 120px; height: 120px; }

    /* 年間行事：2列 */
    #wrapper .unit.recruit .rc-months .m {
        width: 49%;
        margin: 0 2% 4vw 0;
        padding: 3.5vw;
        border-radius: 12px;
    }
    #wrapper .unit.recruit .rc-months .m:nth-child(3n) { margin-right: 2%; }
    #wrapper .unit.recruit .rc-months .m:nth-child(2n) { margin-right: 0; }
    #wrapper .unit.recruit .m-badge {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 12vw;
        height: 12vw;
        margin: 0 0 2vw;
        font-size: 2.8vw;
    }
    #wrapper .unit.recruit .m-ev {
        display: block;
        width: 100%;
        margin-bottom: 2.5vw;
    }
    #wrapper .unit.recruit .m-ev li { font-size: 3.1vw; line-height: 1.6; }

    /* 1日の流れ：1列 */
    #wrapper .unit.recruit .rc-day ul { width: 100%; }
    #wrapper .unit.recruit .rc-day li { font-size: 3.6vw; }
    #wrapper .unit.recruit .rc-note { font-size: 3vw; }

    /* 先輩の声：1列・角丸 */
    #wrapper .unit.recruit .rc-voice { width: 100%; margin-bottom: 10vw; }
    #wrapper .unit.recruit .v-photo img { width: 22vw; height: 22vw; }
    #wrapper .unit.recruit .v-qa dt { font-size: 3.6vw; border-radius: 16px; }
    #wrapper .unit.recruit .v-qa dd {
        padding: 5vw;
        border-radius: 16px;          /* SP は角丸 */
        font-size: 3.4vw;
    }
    #wrapper .unit.recruit .rc-voice-photos img { width: 47%; }

    /* SMILE */
    #wrapper .unit.recruit .rc-smile { margin: 0 4vw 14vw; padding: 7vw 5vw 8vw; }
    #wrapper .unit.recruit .rc-merit { justify-content: flex-start; }
    #wrapper .unit.recruit .rc-merit li { font-size: 3.5vw; }
    #wrapper .unit.recruit .rc-ict-logos {
        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;
        width: 100%;
        margin-bottom: 4vw;
    }
    #wrapper .unit.recruit .rc-ict-logos img { width: 22vw; margin: 0 3vw; }
    #wrapper .unit.recruit .rc-ict-logos img:nth-child(2) { width: 38vw; }
    #wrapper .unit.recruit .rc-ict-text { width: 100%; font-size: 3.4vw; }
    #wrapper .unit.recruit .rc-cta a { padding: 1em 1.6em; font-size: 4vw; }

    /* 見学・エントリーのお申し込み（フォーム） */
    #wrapper .unit.recruit .rc-entry { padding: 0; }
    /* SPは縦積みで折り返しが起きないので、subpage.css の SP 値（1vw）に戻す */
    #wrapper .unit.recruit .rc-entry .form-wrapper dt { padding: 1vw; }
    #wrapper .unit.recruit .rc-ttl-txt { margin-bottom: 2vw; font-size: 4.6vw; }
    #wrapper .unit.recruit .rc-entry .rc-form-note { font-size: 3.2vw; }
    #wrapper .unit.recruit .rc-entry input#btnReturn { margin-top: 5vw; font-size: 3.6vw; }
}
