@charset "utf-8";

/* ------------------------------
 メインビジュアル（PC）
------------------------------ */
.mainimgBlock {
    position: relative;
    width: 100%;
    padding: 40px 0 58px;
    background: var(--base-color) url(/recruit/img/main_bg.png) no-repeat center center;
    min-height: 664px;
    margin-bottom: 50px;
}
.mainimgBlock .swiper,
.mainimgBlock .swiper-slide,
.mainimgBlock .swiper-img {
    width: 1920px;
	height: 100%;
}
.mainimgBlock .swiper-img img {
	height: auto;
}
/* -- スライド -- */
.mainSlide .swiper-wrapper {
  transition-timing-function: linear !important;
}
/* メインテキスト */
.mainText {
    margin-bottom: 10px;
}
.mainText h1 {
    font-size: 5.6rem;
    font-weight: 700;
    letter-spacing: 0.12em;
}

@media print, screen and (min-width: 768px) {
    /* メインテキスト */
    .mainText {
       padding: 0 5.5%;
    }
}
/* ------------------------------
 メインビジュアル（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    .mainimgBlock {
        z-index: 2;
        width: 100%;
        min-height: auto;
        padding: 120px 0 20px;
        overflow: visible;
        background-image: url(/recruit/img/main_bg_sp.png);
    }
    .mainimgBlock .swiper,
    .mainimgBlock .swiper-slide,
    .mainimgBlock .swiper-img {
        width: 1120px;
    }
    /* メインテキスト */
    .mainText {
        height: 130px;
        display: flex;
        align-items: center;
        position: absolute;
        top: 0;
        left: 5%;
        right: 5%;
        z-index: 100;
    }
    .mainText h1 {
        font-size: 3.2rem;
        letter-spacing: 0.05em;
    }
    
}
/* ------------------------------
 見出し・テキスト（PC）
------------------------------ */
/* -- h2 -- */
.contentsHome h2 {
    font-size: 1.8rem;
    text-align: left;
    letter-spacing: 0;
    margin-bottom: 30px;
    position: relative;
}
.contentsHome h2 span {
    font-family: "Barlow", sans-serif;
    font-size: 6rem;
    font-weight: 600;
    line-height: 1.2;
    position: relative;
    display: block;
    letter-spacing: 0.030em;   
}

/* ------------------------------
 見出し・テキスト（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    /* -- h2 -- */
    .contentsHome h2 {
        font-size: 1.4rem;
        margin-bottom: 20px;
    }
    .contentsHome h2 span {
        font-size: 4.6rem;
    }
    
}

/* ------------------------------
募集職種（PC）
------------------------------ */
.jobList {
	display: flex;
    flex-flow: row wrap;
    gap: 18px 20px;
    margin-bottom: 25px;
}
.jobList li:nth-child(-n+2) {
    width: calc((100% - 30px) / 2);
}
.jobList li {
    width: calc((100% - 42px) / 3);
}
.jobList li a {
	display: block;
}
.jobList .imgBox {
    border-radius: 15px;
    overflow: hidden;
}
.jobList .title {
    font-size: 1.8rem;
    font-weight: 600;
    margin-top: 10px;
}
.jobList .title::after {
    content: "";
    display: inline-block;
    width: 28px;
    height: 28px;
    border-radius: 100%;
    vertical-align: middle;
    margin-left: 8px;
    background: var(--green-color) url(../img/arrow_right_w_s.svg) no-repeat center / 5px auto;
}
/* ------------------------------
 募集職種（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    .jobList {
        gap: 14px 11px;
        margin-bottom: 20px;
    }
    .jobList li:nth-child(-n+2) {
        width: calc((100% - 11px) / 2);
    }
    .jobList li {
        width: calc((100% - 22px) / 3);
    }
    .jobList .title {
        font-size: 1.4rem;
        margin-top: 5px;
    }
    .jobList li:first-child .title,
    .jobList li:nth-child(2) .title {
        font-size: 1.5rem;
    }
    .jobList .title::after {
        width: 18px;
        height: 18px;
        margin-left: 2px;
        background-size: 4px;
    }
    /* .contentsHome .postSwiper {
		position: relative;
		padding-top: 55px;
	}
	.contentsHome .postSwiper {
		padding-left: 15%;
        padding-right: 15%;
        margin-left: -5.5%;
        margin-right: -5.5%;
	}
    .contentsHome .jobList {
        justify-content: space-between;
    }
    .contentsHome .postSwiper .swiper-pagination-bullets.swiper-pagination-horizontal {
        width: 90%;
        top: 20px;
        text-align: right;
    }
	.contentsHome .postSwiper .swiper-buttons {
        top: 0;
        left: 5%;
        right: auto;
	} */
}
/* ------------------------------
 お知らせ（PC）
------------------------------ */
.newsList li {
    border-radius: 10px;
    padding: 20px 25px;
    background-color: var(--base-color);
}
.newsList li:has(a) {
    padding: 0;
}
.newsList li:not(:last-child) {
    margin-bottom: 10px;
}
.newsList li a {
    display: block;
    padding: 20px 60px 20px 25px;
    position: relative;
}
.newsList li a::after {
    content: "";
    width: 36px;
    height: 36px;
    border-radius: 100%;
    background-image: url(../img/arrow_right_gr.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 6px 9px;
    background-color: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 20px;
    left: auto;
    margin: auto;
    transition: .3s ease-in-out;
}
.newsList li a[target="_blank"]::after {
    background-image: url(../img/icon_blank.svg);
    background-size: 14px 14px;
}
/* ------------------------------
 お知らせ（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    .newsList li {
        padding: 15px;
    }
    .newsList li a {
        padding: 15px 55px 15px 15px;
    }
    .newsList li a::after {
        width: 28px;
        height: 28px;
        right: 15px;
    }
    .newsList li a[target="_blank"]::after {
        background-size: 10px 10px;
    }
}

/* ------------------------------
幅広リンク（PC）
------------------------------ */
.linkBlock {
    margin-bottom: 75px;
}
.linkBlock h2 {
    font-size: 3.5rem;
    line-height: 1.75;
    margin-bottom: 20px;
}
.linkBlock h2 span {
    font-size: 2.2rem;
}
.link-whide {
    display: flex;
}
.link-whide li {
    text-align: left;
    display: flex;
    flex-wrap: wrap;
}
.link-whide li .imgBox {
    border-radius: 30px;
    overflow: hidden;
    margin-bottom: 45px;
}
@media print, screen and (min-width: 768px) {
    .link-whide li {
        width: calc(100% / 3);
        padding: 0 15px;
    }
    .link-whide li .textBox {
        padding: 0 50px;
        position: relative;
    }
    .link-whide li:nth-child(3n+2) .textBox::before,
    .link-whide li:nth-child(3n+2) .textBox::after {
        content: "";
        display: block;
        width: 1px;
        position: absolute;
        top: 0;
        bottom: 0;
        border-left: dotted 1px #ADADAD;
    }
    .link-whide li:nth-child(3n+2) .textBox::before {
        left: -15px;
    }
    .link-whide li:nth-child(3n+2) .textBox::after {
        right: -15px;
    }
}
/* ------------------------------
 幅広リンク（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    .linkBlock {
        padding-left: 5%;
        padding-right: 5%;
        margin-bottom: 65px;
    }
    .link-whide {
        flex-wrap: wrap;
        gap: 50px 0;
    }
    .link-whide li {
        width: 100%;
    }
    .link-whide li .imgBox {
        border-radius: 15px;
        margin-bottom: 20px;
    }
    .linkBlock h2 {
        font-size: 2.8rem;
        line-height: 1.35;
        margin-bottom: 15px;
    }
    .linkBlock h2 span {
        font-size: 1.6rem;
        margin-bottom: 5px;
    }
}
/* ------------------------------
 その他リンク（PC）
------------------------------ */
.other-linkBlock {
    padding: 80px 0;
    background-color: var(--base-color);
}
.otherLink li a {
    font-size: 2.5rem;
    font-weight: 600;
    text-align: center;
    min-height: 254px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-flow: column;
    background-color: #fff;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}
.otherLink li.contact a::before {
	content: "";
	position: absolute;
	left: 2px;
	top: 2px;
	right: 2px;
	bottom: 2px;
	mix-blend-mode: overlay;
	background : url(../img/noise_bg.jpg) repeat center center;
}
.otherLink li.contact a {
	background: linear-gradient(45deg, rgba(255, 206, 59, 1) 0%, rgba(255, 238, 128, 1) 100%);
}
.otherLink li .imgBox {
    height: 130px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 5px;
    position: relative;
}
@media print, screen and (min-width: 768px) {
    .otherLink {
        display: grid;
        gap: 20px 5.5%;
        grid-template-columns: 1fr 1fr 1fr;
    }
}
/* ------------------------------
 その他リンク（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    .other-linkBlock {
        padding: 60px 0;
    }
    .otherLink li:not(:last-child) {
        margin-bottom: 10px;
    }
    .otherLink li a {
        flex-flow: nowrap;
        justify-content: space-between;
        min-height: 120px;
        border-radius: 10px;
    }
    .otherLink li .imgBox {
        width: 120px;
        height: 120px;
    }
    .otherLink li.benefits .imgBox img {
        width: 75px;
    }
    .otherLink li.faq .imgBox img {
        width: 85px;
    }
    .otherLink li.contact .imgBox img {
        width: 86px;
    }
    .otherLink li .text {
        text-align: left;
        width: calc(100% - 120px);
    }
}
/* ------------------------------
 装飾
------------------------------ */
.deco-yellow,
.deco-green,
.deco-blue {
    position: relative;
}
.deco-yellow::after,
.deco-green::after,
.deco-blue::after {
    content: "";
    position: absolute;
    display: block;
    background-position: 0 0;
    background-repeat: no-repeat;
    background-size: cover;
}
.deco-yellow::after {
    width: 244px;
    height: 194px;
    right: -100px;
    top: 10px;
    z-index: -1;
    background-image: url(/recruit/img/deco_yellow.png);
}
.deco-green::after {
    width: 268px;
    height: 222px;
    left: -90px;
    top: -140px;
    z-index: -1;
    background-image: url(/recruit/img/deco_green.png);
}
.deco-blue::after {
    width: 262px;
    height: 209px;
    left: calc(50% + 735px);
    top: -140px;
    background-image: url(/recruit/img/deco_blue.png);
}
/* ------------------------------
 装飾（SP）
------------------------------ */
@media screen and (max-width: 767px) {
    .deco-yellow::after {
        width: 154px;
        height: 123px;
        right: calc(-5% + -35px);
        top: 10px;
    }
    .deco-green::after {
        width: 157px;
        height: 130px;
        left: -50px;
        top: -70px;
    }
    .deco-blue::after {
        width: 145px;
        height: 116px;
        left: calc(100% - 98px);
        top: -90px;
    }
}
/* ------------------------------
 footer 上書き
------------------------------ */
footer::before {
    content: none !important;
}