@charset "UTF-8";

/* ************************************** _
タイトル：common.css
概要：中日本モビリティ 採用 共通css
作成：2026.03.18
更新：2026.03.18
_ ************************************** */


/* ========================================
   法人サイト common 打消し
======================================== */
body.recruit,
body.recruit h1,
body.recruit h2,
body.recruit h3,
body.recruit h4 {
    line-height: 2;
}


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

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


/* ========================================
   移植スタイル　layout ＋調整
======================================== */

/* レイアウト
-------------------------------*/

/*section*/
.recruit .section-wrap{
    width: 100%;
    /*overflow: hidden;*/
    margin: 40px 0 40px 0;
    padding: 40px 0 40px 0;
}
.recruit .section{
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
}
.recruit.under .section{
    max-width: 1200px;
    width: 85%;
    margin: 0 auto;
}
@media screen and (max-width: 1230px) {/*1020px*/
    .recruit .section-wrap{
        margin-bottom: 30px;
        padding: 10px 10px 20px 10px;
    }
    .recruit .section {
        width: 100%;
        margin: 0 auto;
    }
    .recruit.under .section{
        width: 100%;
        margin: 0 auto;
    }
}

.recruit .page-section {
    padding: 100px 0 0 0;
}
@media screen and (max-width: 768px) {
    .recruit .page-section {
        padding: 70px 0 0 0;
    }
}



/* 文章
-------------------------------*/
.parag{ margin: 0 0 30px 0; }
.lead{
    font-size: 1.4em;
    font-weight: bold;
    line-height: 1.5;
    margin: 0 0 40px 0;
}
@media screen and (max-width: 900px) {
    .lead{
        font-size: 1.2em;
        margin: 0 0 20px 0;
    }
}
.underline{
    border-bottom: 1px solid #333333;
    padding-bottom:5px;
    display:inline;
}



/* 見出し
-------------------------------*/
.title-wrap{
    margin: 0 0 40px 0;
    text-align: left;
}
h2.index-title {
    padding: 0 0 0 0;
    font-size: 1.8em;
    font-weight: bold;
    position: relative;
}
.title-white h2.index-title{
    color: #FFFFFF !important;
}
.index-sub-title{
    color: #b3080c;
    letter-spacing: 0.1em;
    font-weight: bold;
    line-height: 1;
}
.index-sub-title::before{
    content: "ー";
}
.title-white .index-sub-title{
    color: #FFFFFF !important;
}

@media screen and (max-width: 900px) {
    .title-wrap{
        margin: 0 0 20px 0;
    }
    h2.index-title{
        font-size: 1.4em;
    }
    .index-sub-title{
        font-size: 0.8em;
    }
}
h3.headline{
    line-height: 2;
    font-size: 1.2em;
    margin: 0 0 50px 0;
    font-weight: bold;
}
.center{
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.left{
    text-align: left;
}


@media screen and (max-width: 900px) {
    h2.title{
        font-size: 1.4em;
        margin: 0 0 20px 0;
    }
    h2.title br{ display: none; }
    h3.headline{
        line-height: 2;
        font-size: 1.2em;
        margin: 0 0 20px 0;
        font-weight: bold;
    }
}


/* アニメーション：fadeInUp
-------------------------------*/

.css-fadeInUp{
    animation-name: fadeInUpAnime;
    animation-duration: 1.2s;
    animation-delay: 0.2s;
}
@keyframes fadeInUpAnime{
    0%{
        opacity: 0;
        transform: translateY(50px);
    }
    100%{
        opacity: 1;
        transform: translateY(0);
    }
}
.css-reveal{
    animation-name: revealAnime;
    animation-duration: 1.0s;
}
@keyframes revealAnime{
    0%{
        opacity: 0;
        transform: translateY(100px);
    }
    100%{
        opacity: 1;
        transform: translateY(0);
    }
}

/* 下層 見出し
-------------------------------*/

h2.under-title {
    font-size: 2em;
    font-weight: bold;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}
.under-title:after {
    display: none;
}

.under-sub-title{
    color: #b3080c;
    letter-spacing: 0.1em;
    font-weight: bold;
    line-height: 1;
}
.under-sub-title::before{
    content: "ー";
}

@media screen and (max-width: 900px) {
    h2.under-title{
        font-size: 1.4em;
    }
}
h3.under-title{
    font-size: 1.6em;
    font-weight: bold;
    margin: 0 0 20px 0;
    position: relative;
}
h3.under-title::after{
    content: "";
    display: block;
    width: 30px;
    height: 2px;
    background: #b3080c;
    margin: 0 0 0 0;
}

@media screen and (max-width: 900px) {
    h3.under-title{
        font-size: 1.2em;
    }
}
h4.under-title{
    font-size: 1.2em;
    line-height: 1.5;
    font-weight: bold;
    margin: 0 0 30px 0;
    padding: 0 0 0 10px;
    border-left: 4px solid #c30307;
}



/* ボタンデザイン：角丸タイプ
---------------------------------------------------------------------------- */
.btn-radius-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.btn-radius {
    margin: 0 0 10px 0;
    max-width: 320px;
    border-radius: 40px;
    width: 100%;
    position: relative;
}
.btn-radius.center {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.btn-radius a{
    display: block;
    padding: 12px 0 12px 20px;
    color: #333333;
    border-radius: 40px;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid #cccccc;
    transition: all 0.3s;
}
.btn-radius a:hover{
    background: #cb0101;
    border: 1px solid #cb0101;
    color: #FFFFFF;

}
.btn-radius::before,
.btn-radius::after {
    content: "";
    position: absolute;
    top: 48%;
    transform: translateY(-50%);
    transition: all 0.3s;
}
.btn-radius::before {
    width: 20px;
    height: 20px;
    background: #cb0101;
    border-radius: 50%;
    right: 16px;
    transform: translateY(-50%);
}
.btn-radius::after {
    width: 6px;
    height: 6px;
    right: 23px;
    transform: translateY(-50%) rotate(45deg);
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}
.btn-radius:hover::before {
    right: 8px;
}
.btn-radius:hover::after {
    right: 15px;
}



/* ボタンデザイン：アンダーラインタイプ
-------------------------------*/
.btn-underline-list{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.btn-underline{
    margin: 0 0 10px 0;
    max-width: 350px;
    position: relative;
}
.btn-underline a{
    position: relative;
    border-bottom: 1px solid #cccccc;
}
.btn-underline a::after{
    content: "";
    width: 100%;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: 0;
    transform: scale(0,1);
    transform-origin: left top;
    transition: all 0.3s;
    background: #cb0101;
    z-index: 1;
}
.btn-underline a:hover::after{
    transform: scale(1,1);
}
.btn-underline a{
    display: block;
    padding: 15px 0 15px 0;
    color: #333333;
    font-weight: bold;
    text-decoration: none;
    z-index: 1;
}
.btn-underline::before,
.btn-underline::after {
    content: "";
    position: absolute;
    top: 48%;
    transform: translateY(-50%);
    transition: all 0.3s;
}
.btn-underline::before {
    width: 20px;
    height: 20px;
    background: #cb0101;
    border-radius: 50%;
    right: 16px;
    transform: translateY(-50%);
}
.btn-underline::after {
    width: 6px;
    height: 6px;
    right: 23px;
    transform: translateY(-50%) rotate(45deg);
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}
.btn-underline:hover::before {
    right: 8px;
}
.btn-underline:hover::after {
    right: 15px;
}



/* 汎用
-------------------------------*/

.only-pc {
    display: block;
}
.only-sp {
    display: none;
}

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

    .only-pc {
        display: none;
    }

    .only-sp {
        display: block;
    }
}



/* ========================================
   採用共通フッター
======================================== */

/*採用共通フッター*/
.recruit-contact-wrap{
    background: url(../../assets/images/recruit/common/bg_recruit_contact.gif) no-repeat top center;
    background-size: cover;
    position: relative;
}
/*.recruit-contact-wrap::after{*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: -50px;*/
/*    left: calc( 50% - 45px );*/
/*    background: url(../../assets/images/recruit/common/nisshi_recruit.png) no-repeat top center;*/
/*    width: 94px;*/
/*    height: 94px;*/
/*}*/
.recruit-contact-wrap__inner{
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 80px 0 80px 0;
}
.recruit-contact__txt{
    text-align: center;
    font-size: 1.6em;
    font-weight: bold;
    color: #FFFFFF;
    line-height: 1.5;
    margin: 0 0 40px 0;
}
.recruit-contact__btnwrap{
    max-width: 740px;
    width: 100%;
    margin: 0 auto 40px auto;
}
.recruit-contact__btnwrap .btn-underline{
    max-width: 350px;
    width: 100%;
}
@media screen and (max-width: 900px) {
    .recruit-contact-wrap{
        padding: 0 20px 0 20px;
    }
    .recruit-contact__txt{
        font-size: 1.2em;
    }
    .recruit-contact__btnwrap{
        max-width: 320px;
        margin: 0 auto 40px auto;
    }
    .recruit-contact__btnwrap .btn-underline{
        flex-direction: column;
    }
}

/*ボタンスタイル上書き（白背景以外）*/
.recruit-contact__btnwrap .btn-underline a{
	color: #FFFFFF;
	border-bottom: 1px solid #8f0404;
}
.recruit-contact__btnwrap .btn-underline::before {
    width: 20px;
    height: 20px;
    background: #FFFFFF;
    border-radius: 50%;
    right: 16px;
    transform: translateY(-50%);
}
.recruit-contact__btnwrap .btn-underline::after {
    width: 6px;
    height: 6px;
    right: 23px;
    transform: translateY(-50%) rotate(45deg);
    border-top: 2px solid #cb0101;
    border-right: 2px solid #cb0101;
}
.recruit-contact__btnwrap .btn-underline a::after{
	background: #FFFFFF;
}
.recruit-contact__btnwrap .btn-underline:hover::before {
    right: 8px;
}
.recruit-contact__btnwrap .btn-underline:hover::after {
    right: 15px;
}
/*ボタンスタイル上書き ここまで*/


/*エントリーボタン*/
.recruit-contact__entrybtn{
    max-width: 800px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    box-shadow: 10px 10px 0 #990000;
    position: relative;
}
.recruit-contact__entrybtn a{
    display: block;
    background: #FFFFFF;
    text-decoration: none;
    line-height: normal;
    padding: 20px 10px 20px 10px;
}
.recruit-contact__entrybtn a::after{
	content: "";
	width: 100%;
	height: 1px;
	position: absolute;
	left: 0;
	bottom: 0;
	transform: scale(0,1);
	transform-origin: left top;
	transition: all 0.3s;
	background: #cb0101;
	z-index: 1;
}
.recruit-contact__entrybtn--title{
    color: #cb0101;
    font-size: 2.2em;
    font-weight: bold;
    line-height: 1;
    letter-spacing: 0.1em;
    margin: 0 0 5px 0;
}
.recruit-contact__entrybtn--subtitle{
    color: #333333;
    font-size: 0.8em;
    line-height: 1;
    font-weight: bold;
}
.recruit-contact__entrybtn::before,
.recruit-contact__entrybtn::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s;
}
.recruit-contact__entrybtn::before {
    width: 20px;
    height: 20px;
    background: #cb0101;
    border-radius: 50%;
    right: 16px;
    transform: translateY(-50%);
}
.recruit-contact__entrybtn::after {
    width: 6px;
    height: 6px;
    right: 23px;
    transform: translateY(-50%) rotate(45deg);
    border-top: 2px solid #FFFFFF;
    border-right: 2px solid #FFFFFF;
}
.recruit-contact__entrybtn:hover::before {
    right: 8px;
}
.recruit-contact__entrybtn:hover::after {
    right: 15px;
}
@media screen and (max-width: 900px) {
    .recruit-contact__entrybtn{
        max-width: 600px;
        margin: 0 auto;
    }
    .recruit-contact__entrybtn a{
        padding: 10px 5px 10px 5px;
    }
    .recruit-contact__entrybtn--title{
        font-size: 1.6em;
    }
}