/*
 * [recruit_works] ショートコード専用CSS
 * 適用範囲: .recruit-works-shortcode 配下のみ
 *
 * 出典（既存SCSSの値をそのまま数値化して移植。デザイン変更なし）:
 *  - data/_src-scss/project/_p-custom-post-works.scss … .custom-post-article-lists の Flexレイアウト
 *  - data/_src-scss/project/_p-archive-works.scss     … カード幅・カード間余白・PC/TB/SP切り替え・サムネイル最小表示
 *
 * 変数の解決値（data/_src-scss/project/setting/_s-size.scss, _s-size-bp.scss, mixin/_m-utility.scss より）:
 *  $ele-space-vertical-40 = 40 / $ele-space-vertical-60 = 60
 *  $content-width-tb(TB用ブレイクポイント換算値) = 1139 / $bp-sp(SPブレイクポイント) = 767px
 *  $viewport(SP用vw換算基準) = 750 / $space_rate(SP縮小率) = 0.75
 *  $col-font-body = #454c50
 */

/* 一覧コンテナ（出典: _p-custom-post-works.scss .custom-post-article-lists） */
.recruit-works-shortcode .custom-post-article-lists {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 40px;
}
@media only screen and (max-width: 1139px) {
    .recruit-works-shortcode .custom-post-article-lists {
        margin-top: calc(40 / 1139 * 100vw);
    }
}
@media only screen and (max-width: 767px) {
    .recruit-works-shortcode .custom-post-article-lists {
        margin-top: calc( calc(100 / 750 * 40 * 1vw) / 0.75 );
    }
}

/* カード幅・行間余白（出典: _p-archive-works.scss .loop-works-item / .c-media-text-content-mg--vertical） */
.recruit-works-shortcode .loop-works-item {
    width: 33%; /* PC: 4カラム */
    padding-top: 0;
    margin-top: 0;
    margin-bottom: 0; /* コンポーネント標準の margin-bottom を打ち消し、行間はnth-childのmargin-topのみで制御 */
}
.recruit-works-shortcode .loop-works-item:nth-child(n+5) {
    margin-top: 60px;
}
@media only screen and (max-width: 1139px) {
    .recruit-works-shortcode .loop-works-item:nth-child(n+5) {
        margin-top: calc(60 / 1139 * 100vw);
    }
}
@media only screen and (max-width: 1000px) {
    .recruit-works-shortcode .loop-works-item {
        width: 50%; /* TB: 2カラム */
    }
    .recruit-works-shortcode .loop-works-item:nth-child(n+3) {
        margin-top: calc(60 / 1139 * 100vw);
    }
}
@media only screen and (max-width: 767px) {
    .recruit-works-shortcode .loop-works-item {
        width: 100%; /* SP: 1カラム */
    }
    .recruit-works-shortcode .loop-works-item:nth-child(n+2) {
        margin-top: calc( calc(100 / 750 * 60 * 1vw) / 0.75 );
    }
    .recruit-works-shortcode .loop-works-item:nth-child(n+5) {
        margin-top: calc( calc(100 / 750 * 60 * 1vw) / 0.75 );
    }
}

/* カード内部の最小限の表示指定（出典: _p-archive-works.scss .c-media-text-content-mg--vertical 内） */
.recruit-works-shortcode .c-media-text-content__title {
    padding-top: 0;
    display: inline-block;
}
.recruit-works-shortcode .c-media-text-content__body {
    margin-top: 2em;
    display: block;
    position: relative;
    padding-right: 2em;
    flex: 1;
}
.recruit-works-shortcode .c-horizontal_content-meta--base {
    bottom: 0;
}
.recruit-works-shortcode .c-media-text-content__img {
    margin-bottom: 0;
}

/* サムネイル背景・「もっと見る」アイコンの位置指定（出典: _p-archive-works.scss .c-media-text-content__link .c-media-text-content__img） */
.recruit-works-shortcode .c-media-text-content__link .c-media-text-content__img {
    background-color: #454c50;
    overflow: hidden;
}
.recruit-works-shortcode .c-icon-more {
    position: absolute;
    overflow: hidden;
    width: 100%;
    height: 100%;
    z-index: 99999;
}
.recruit-works-shortcode .c-icon-more .c-icon-more__item {
    pointer-events: none;
    position: absolute;
    top: calc(100% + 30px);
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    transition: 0.8s cubic-bezier(.175, .885, .32, 1.275);
}
.recruit-works-shortcode .c-media-text-content__link .c-media-text-content__img:hover .c-icon-more .c-icon-more__item {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


body#mypj.recruitment-page-structure-diagnosis-and-organization main ul li:nth-child(n+2) {
    margin-top: 0;
}

body#mypj.recruitment-page-structure-diagnosis-and-organization .c-horizontal_content-meta__round-btn{

}

body#mypj.recruitment-page-structure-diagnosis-and-organization .c-media-text-content-mg--vertical .c-media-text-content__title{
    font-size:.75em;
}

body#mypj.recruitment-page-structure-diagnosis-and-organization .c-horizontal-diagonal-separator__item {
    height: 1.5em!important;
    position: relative!important;
    overflow-y: hidden!important;
    line-height: 1!important;
    padding-right: 3em!important;
    padding-top: .2em!important;
    padding-bottom: .2em!important;
}

body#mypj.recruitment-page-structure-diagnosis-and-organization .c-media-text-content__body{
    margin-top: 0;
}