@charset "UTF-8";

#contentsend{ margin-top: 0; }

@media screen and (min-width: 768px),print {
#mainttl .page-title,#mainttl .page-caption,.seo_bread_list,.seo_bread_list a{ color: #fff; }
.seo_bread_list a::after{ background: #fff;}

#mainttl{position:relative;overflow:hidden;padding: 12rem 0rem 0rem;background: url(../images/recruit/ttl-slide01.jpg)no-repeat top right;background-size: cover;}
#mainttl .inner-Box{padding: 9.8rem 5vw 5.9rem 23rem;}
#mainttl .page-caption{margin-bottom: 13.8rem;}


#contents01 {margin: 0 auto;position: relative;background: url(../images/common/back.png),url(../images/common/back.svg)no-repeat top right;background-size: auto auto,cover;color: #fff;padding: 0 0 14.6rem 5rem;}
#contents01 .back-Box{padding: 12.2rem 5vw 0rem;}

#contents01 .tll-Box {margin: 0 auto 4rem;position: relative;max-width: 1200px;}
#contents01 .tll-Box h2{position: relative;margin-bottom: 2.3rem;}
#contents01 .tll-Box h2 .f-en::before{ background: #fff;}
#contents01 .tll-Box h2 .f-en{ color: #fff;}
#contents01 .tll-Box h2 .ttl-ja{ color: #fff;}
#contents01 .tll-Box .text{font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents01 .roll {position: absolute;width: 62rem;height: 62rem;bottom: 0;right: 0;overflow: hidden;}
#contents01 .roll span.en{ display: block; position:relative; width:100%; height:100%; }
#contents01 .roll span.en img{position:absolute;left: 0;top: 0;width: 153.4rem; /* 少し大きめに */transform:rotate(-30deg);transform-origin: center center;animation: rollRotate 120s linear infinite;}
@keyframes rollRotate{ 0%{transform:rotate(-30deg);} 100%{transform:rotate(330deg);} }


#contents01 .inner-Box {margin: 0 auto;position: relative;max-width: 1200px;}
#contents01 .inner-Box ul{display:flex;flex-wrap:wrap;gap:2%;position: relative;z-index: 3;}
#contents01 .inner-Box ul li{position: relative; top: 0rem; left: 0rem; width:49%;box-shadow:0.8rem 0.8rem 0px #0D186E;border-radius:0px 1.6rem 0px 0px;background:#fff;margin-bottom: 2.4rem;transition: all 0.3s ease-in-out;}
#contents01 .inner-Box ul li:hover{box-shadow:0rem 0rem 0px #0D186E; top: 0.8rem; left: 0.8rem;}
#contents01 .inner-Box ul li a:hover {  }

#contents01 .inner-Box ul li a{padding: 2.9rem 2.9rem 2.9rem 3.5rem;}
#contents01 .inner-Box ul li a{display:flex;gap: 2.4rem;align-items:center;flex-wrap:nowrap;position: relative;}
#contents01 .img-Box{position:relative;width:10rem;height:10rem;}
#contents01 .text-Box{position:relative;padding-right: 4rem;}

#contents01 .inner-Box ul li a span.arr{position: absolute;top: 3.4rem;right: 1.5rem;width: 4rem;border-left: 1px solid var(--main-blue);padding: 2.7rem 0 4.6rem 2.3rem;}
#contents01 .inner-Box ul li a span.arr img{transform: rotate(0deg);transform-origin: center;transition: all 0.3s ease-in-out;width: 1rem;}
#contents01 .inner-Box ul li a:hover span.arr img{ transform: rotate(360deg);}

#contents01 .img-Box figure.img {position: relative;top: 0;left: 0;}
#contents01 .img-Box figure.img img{  }
#contents01 .text-Box h4 {margin-bottom: 0px;position: relative;font-size: 1.8rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;margin-bottom: 0.7rem;text-align: left;}
#contents01 .text-Box p.ltext {color: #333;position: relative;font-size: 1.4rem;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents02 {margin: 0 auto 0 5rem;position: relative;padding: 12rem 5vw 16rem;}
#contents02 .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contents02 .inner-Box h2 {margin-bottom: 2.4rem;position: relative;}
#contents02 .inner-Box p.subttl {margin-bottom: 4.8rem;position: relative;font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents02 .inner-Box ul{display:grid;grid-template-columns:repeat(3,1fr);gap: 3.2rem 2.67%;max-width:120rem;margin:0 auto;}
#contents02 .inner-Box ul li{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;height: 23rem;background: #fff;border: 3px solid var(--main-blue);border-radius: 1.2rem;overflow: hidden;box-sizing: border-box;}
#contents02 .inner-Box h3 {margin-bottom: 1.6rem;position: relative;width: 100%;font-size: calc(1.8rem + 5pt);line-height: 1.4;letter-spacing: 0.05em;font-weight: 700;text-align: center;color: #333;}
#contents02 .inner-Box p.ltext {color: var(--main-blue);position: relative;width: 100%;font-size: 1.6rem;line-height: 1.2;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents02 .inner-Box p.ltext span.f-en {font-size: 5.6rem;line-height: 1;letter-spacing: 0em;font-weight: 700;text-align: center;position: relative;top: 0.2rem;left: -0.4rem;}

#contents03 {margin: 0 auto;position: relative;background: #fff;padding: 12.3rem 5vw 25.7rem calc(5rem + 5vw);}
#contents03 h2{ }
#contents03 .subttl{font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 5.4rem;}

#contents03 .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contents03 .inner-Box ul{display:grid;grid-template-columns:repeat(2,1fr);gap: 4.93% 3.33%;max-width:120rem;margin:0 auto;}
#contents03 .inner-Box ul li{position:relative;/* margin-bottom:2.4rem; *//* padding:2.4rem; */display:flex;gap:2rem;}
#contents03 .photo{margin:0 auto;position:relative;width:10rem;flex-shrink:0;}
#contents03 .text-box{margin:0 auto;position:relative;flex:1;}


#contents03 .photo figure.photo {position: relative;top: 0;left: 0;}
#contents03 .photo figure.photo img{width: 100%;height: auto;}
#contents03 .text-box h3 {margin-bottom: 0.8rem;position: relative;font-size: 1.6rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents03 .text-box p.text {position: relative;font-size: 1.4rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents03 .text-box ul li { position: relative; }
#contents03 .text-box ul li:nth-child(3n) { margin-right: 0px; }

#contents04 {}
#contents04 h2{ }
#contents04 .subttl{font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 5.6rem;}

#contents04 .inner-Box .flip-item { opacity: 1; transition: opacity 0.25s ease; }
#contents04 .inner-Box .flip-item.is-hidden { opacity: 0; pointer-events: none; }
#contents04 .inner-Box .flip-item.is-none { display: none; }
#contents04 .inner-Box .flip-list { position: relative; transition: min-height 0.2s ease; }
#contents04 .inner-Box .flip-list {list-style: none;padding: 0;max-width: 120rem;display: flex;justify-content: flex-start;gap: 1.3%;flex-wrap: wrap;}
#contents04 .inner-Box .flip-item {width: calc(21.5% - 2.6%);min-height: 21.5rem;cursor: pointer;margin-bottom: 20px;overflow: hidden;border-radius: 1.2rem;}
#contents04 .inner-Box .flip-card-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d;border-radius: 1.2rem; }
#contents04 .inner-Box .flip-item.is-flipped .flip-card-inner { transform: rotateY(180deg); }
#contents04 .inner-Box .face {position: absolute;width: 100%;height: 22rem;top: 0;left: 0;backface-visibility: hidden;display: flex;flex-direction: column;align-items: center;padding: 2.4rem 2.4rem 11.7rem;border-radius: 1.2rem;overflow: hidden;/* position: relative; */}
#contents04 .inner-Box .face.front {background: url(../images/recruit/contents04-icon02.svg)no-repeat bottom right #fff;color: var(--main-blue);}
#contents04 .inner-Box .face .no {margin-bottom: 1.2rem;font-size: 3.0rem;line-height: 1.0;letter-spacing: 0.03em;font-weight: 700;text-align: center;}
#contents04 .inner-Box .face.front h3 {font-size: 1.6rem;line-height: 1.35;letter-spacing: 0.05em;font-weight: 700;text-align: center;margin-bottom: 1.2rem;max-width: 100%;padding: 0 0.4rem;box-sizing: border-box;}
#contents04 .inner-Box .face.front h3 span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
#contents04 .inner-Box .face.front .photo{position: absolute;bottom: 2.4rem;left: 50%;transform: translateX(-50%);width: 2.6rem;line-height: 0;}
#contents04 .inner-Box .face.front .photo img{width: 100%;height: auto;display: block;}

/* --- 裏面のデザイン --- */
#contents04 .inner-Box .face.back { background: url(../images/recruit/contents04-icon02.svg)no-repeat bottom right #fff;color: var(--main-blue); transform: rotateY(180deg); padding: 2.4rem; box-sizing: border-box; }
#contents04 .inner-Box .face.back .ftext{font-size: 1.4rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;}

#contentsstaff {margin: 0 auto;position: relative;background: url(../images/common/back.png),url(../images/common/back.svg) no-repeat top right;background-size: auto auto,cover;color: #fff;padding: 0 0 14.6rem 5rem;}
#contentsstaff .back-Box {padding: 12.2rem 5vw 0rem;}

#contentsstaff .inner-Box {margin: 0 auto;position: relative;max-width: 1200px;}

#contentsstaff .inner-Box h2 {position: relative;margin-bottom: 1.6rem;}
#contentsstaff .inner-Box h2 .f-en::before {background: #fff;}
#contentsstaff .inner-Box h2 .f-en {color: #fff;}
#contentsstaff .inner-Box h2 .ttl-ja {color: #fff;}

#contentsstaff .inner-Box .subttl {font-size: 1.4rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 350;text-align: left;}

#contentsstaff .inner-Box .listbtn {text-align: left;padding-left: 0.3rem;position: absolute;top: 8.7rem;right: 0;z-index: 5;}

#contentsstaff .inner-Box .listbtn a {color: #fff;}
#contentsstaff .inner-Box .listbtn a .arr {border-color: #fff;}
#contentsstaff .inner-Box .listbtn a .arr img {filter: brightness(0) invert(1);}

#contentsstaff .pickup-slide {overflow: visible;}
#contentsstaff .pickup-slide .swiper-slide {width: 32rem !important;height: auto;}
#contentsstaff .pickup-slide .swiper-slide .photo {width: 100%;aspect-ratio: 32 / 22;overflow: hidden;text-align: center;position: relative;margin-bottom: 0.8rem;}
#contentsstaff .pickup-slide .swiper-slide .photo img {width: 100%;height: 100%;object-fit: cover;display: block;}
#contentsstaff .pickup-slide .swiper-slide p {font-size: 1.2rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contentsstaff .pickup-slide .swiper-slide h3 {font-size: 1.6rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contentsstaff .pickup-slide .swiper-slide a {color: #fff;}
#contentsstaff .slider-controls {display: flex;align-items: center;justify-content: center;gap: 1.5rem;margin-top: 3.0rem;}
#contentsstaff .slider-controls .swiper-pagination {position: static !important;width: auto !important;display: flex !important;gap: 1rem;}
#contentsstaff .slider-controls .swiper-pagination-bullet {width: 0.8rem;height: 0.8rem;background: #fff;opacity: 0.3;margin: 0 !important;}
#contentsstaff .slider-controls .swiper-pagination-bullet-active {opacity: 1;}
#contentsstaff .prev-arrow,
#contentsstaff .next-arrow {cursor: pointer;line-height: 0;filter: brightness(0) invert(1);transform: scale(-1,1);}
#contentsstaff .next-arrow {transform: scale(1,1);}
#contentsstaff .pickup-no-slide .swiper-wrapper {flex-wrap: wrap;}
#contentsstaff .pickup-no-slide .swiper-slide {width: 32% !important;}
#contentsstaff .is-hidden {display: none;}
#contentsstaff .is-hidden-dot {display: none;}

#contentsstaff .pickup-slider-container {margin-top: 6.1rem;position: relative;}
#contentsstaff .pickup-slide {width: calc(100vw - (((100vw - 1200px) / 2) + 5vw));overflow: visible;}
#contentsstaff .pickup-slider-container {
margin-top: 6.1rem;
position: relative;
overflow: visible;
}

#contentsstaff .pickup-slide {
width: calc(100vw - (((100vw - 1200px) / 2) + 5vw));
overflow: visible;
clip-path: inset(0 -100vw 0 0);
-webkit-clip-path: inset(0 -100vw 0 0);
}
#news{margin-left: 5rem;padding: 14rem 5vw 5.3rem;}
#news .inner-Box{margin:0 auto;max-width:1200px;display:flex;gap:6.666%;}
#news .inner-Box .ttl-Box{width:20%;}
#news .inner-Box .ttl-Box .listbtn{text-align: left;padding-left: 0.3rem;}
#news .inner-Box .ttl-Box h2{margin-bottom: 3.5rem;}
#news .inner-Box .system-Box{width:73.333%;}
#news .inner-Box .system-Box{padding: 1px;margin-bottom: 50px;}
#news .inner-Box .system-Box li{border-bottom: #CCC 1px solid;margin-bottom: 3.5rem;}
#news .inner-Box .system-Box li a{position:relative;padding: 0 1.2rem;display: block;padding-bottom: 1.6rem;}

#news .inner-Box .system-Box li .databox{font-size:1.2rem;line-height:1.083;letter-spacing:0.1em;font-weight:400;text-align:left;color:var(--main-blue);margin-bottom:1.2rem;flex:1;padding-top: 1.4rem;}
#news .inner-Box .system-Box li .databox .data-ininbox {display: flex;align-items: center;gap: 0.5rem;}
#news .inner-Box .system-Box li .databox .timebox{font-weight: 500;padding-left: 0.3rem;}
#news .inner-Box .system-Box li .databox .categ{color: var(--main-blue);display: inline-block;background: #fff;border: 1px solid var(--main-blue);padding: 0.8rem;line-height: 1;letter-spacing: 0;}

#news .inner-Box .system-Box li .arr{position: absolute;right: -0.9rem;width: 3.2rem;height: 3rem;padding: 0.7rem 0 0 1.1rem;top: 33%;transform: translateY(-50%);border-left: var(--main-blue) solid 1px;}
#news .inner-Box .system-Box li .systtl{color: #333333;font-size: 1.6rem;line-height: 1.6;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#news .inner-Box .system-Box li .systtl span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}

#contents04 {margin: 0 auto;position: relative;padding: 12.3rem 5vw 14.6rem calc(5rem + 5vw);}
#contents04 .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contents04 .inner-Box h2 {position: relative;}
#contents04 .inner-Box ul{display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#contents04 .inner-Box ul li { position: relative; }
#contents04 .inner-Box span.f-en{  }
#contents04 .inner-Box h3 { margin-bottom: 0px; position: relative; }
#contents04 .inner-Box p.text { margin-bottom: 30px; position: relative; }


#contentsflow {margin: 0 auto;position: relative;padding: 12.3rem 5vw 16rem calc(5rem + 5vw);background: #fff;}
#contentsflow .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contentsflow .inner-Box h2 {position: relative;margin-bottom: 6rem;}
#contentsflow .inner-Box ul{position: relative;}
#contentsflow .inner-Box ul::before{content: "";width: 1px;height: 90%;position: absolute;top: 0rem;left: 1.6rem;background: var(--main-blue);}
#contentsflow .inner-Box ul li {position: relative;padding: 0rem 0 0 5rem;margin-bottom: 3.2rem;}
#contentsflow .inner-Box ul li span.f-en{color: #fff;position: absolute;top: 0;left: 0;background: var(--main-blue);border-radius: 50%;font-size: 1.6rem;line-height: 1.0;letter-spacing: 0.03em;font-weight: 700;text-align: center;width: 3.5rem;height: 3.5rem;padding: 1rem 0 0;}
#contentsflow .inner-Box ul li:last-child { margin-bottom: 0px; }

#contentsflow .inner-Box h3 {color: var(--main-blue);margin-bottom: 0.8rem;position: relative;font-size: 2.0rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contentsflow .inner-Box p.text {position: relative;font-size: 1.6rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contentsflow {margin: 0 auto;position: relative;padding: 12.3rem 5vw 16rem calc(5rem + 5vw);background: #fff;}
#contentsflow .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}


#contents05 {margin: 0 auto;position: relative;padding: 12.3rem 5vw 14.6rem calc(5rem + 5vw);}
#contents05 .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contents05 .inner-Box h2 {position: relative;}
#contents05 .inner-Box ul{display:grid;grid-template-columns:repeat(2,1fr);gap: 2.4rem 2%;max-width:120rem;margin:0 auto;}
#contents05 .inner-Box ul li{position:relative;}
#contents05 .inner-Box ul li a{ }

#contents05 .inner-Box ul li .photo { width: 100%; aspect-ratio: 588 / 180; overflow: hidden; text-align: center; position: relative;}
#contents05 .inner-Box ul li .photo img { width: 100%; height: 100%; object-fit: cover; display: block; }


}
@media screen and (min-width:768px) and ( max-width:1023px) {
#contentsmain,#contents02,#news{margin-left: 0rem!important;}
#contents01{ padding-left: 0;}
#contents03,#contents04,#contentsflow,#contents05{ padding-left: 5vw;}

	
}

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

#mainttl .page-title,#mainttl .page-caption{color: #fff;}
.seo_bread_list{color: #999;}
.seo_bread_list a{color: #333;}
.seo_bread_list a::after{background: #333;}

#mainttl{position:relative;overflow:hidden;padding: 6vw 0vw 0vw;background: url(../images/recruit/sp-ttl-slide01.jpg)no-repeat top right;background-size: 100%;}
#mainttl .inner-Box{padding: 26.13vw 0vw 0vw 0vw;}
#mainttl .page-caption{margin-bottom: 25.5vw;}


#contents01 {position: relative;background: url(../images/common/back.png),url(../images/common/back.svg)no-repeat top right;background-size: auto auto,cover;color: #fff;padding: 0 0 10.23vw 0;}
#contents01 .back-Box{padding: 11.13vw 4.3vw 0vw;}

#contents01 .tll-Box {margin: 0 auto 5.97vw;position: relative;}
#contents01 .tll-Box h2{position: relative;margin-bottom: 4.13vw;}
#contents01 .tll-Box h2 .f-en::before{ background: #fff;}
#contents01 .tll-Box h2 .f-en{ color: #fff;}
#contents01 .tll-Box h2 .ttl-ja{ color: #fff;}
#contents01 .tll-Box .text{font-size: 3.73vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 350;text-align: left;}

#contents01 .roll {position: absolute;width: 64.33vw;height: 65.33vw;bottom: 0;right: 0;overflow: hidden;}
#contents01 .roll span.en{ display: block; position:relative; width:100%; height:100%; }
#contents01 .roll span.en img{position:absolute;left: 0;top: 0;width: 159.07vw; /* 少し大きめに */transform:rotate(-30deg);transform-origin: center center;animation: rollRotate 120s linear infinite;}
@keyframes rollRotate{ 0%{transform:rotate(-30deg);} 100%{transform:rotate(330deg);} }


#contents01 .inner-Box {position: relative;}
#contents01 .inner-Box ul{ display:flex; flex-wrap:wrap; gap:2%; }
#contents01 .inner-Box ul li{position: relative;top: 0vw;left: 0vw;width:49%;box-shadow:2.13vw 2.13vw 0.0vw #0D186E;border-radius:0.0vw 4.27vw 0.0vw 0.0vw;background:#fff;margin-bottom: 4.8vw;transition: all 0.3s ease-in-out;}

#contents01 .inner-Box ul li a{padding: 2.63vw 3.03vw 9.73vw;display: block;}
#contents01 .inner-Box ul li a{position: relative;}
#contents01 .img-Box{position:relative;text-align: center;margin-bottom: 1.8vw;}
#contents01 .text-Box{position:relative;}

#contents01 .inner-Box ul li a span.arr::before{content: "MORE";position: absolute;top: 0vw;right: 12.6vw;font-family: "Montserrat", sans-serif;font-size: 3.2vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;}
#contents01 .inner-Box ul li a span.arr{position: absolute;bottom: 4vw;right: -2.9vw;width: 10.67vw;border-left: 0.27vw solid var(--main-blue);padding: 0vw 0 0vw 2.13vw;display: block;height: 3vw;line-height: 0;}
#contents01 .inner-Box ul li a span.arr img{transform: rotate(0deg);transform-origin: center;transition: all 0.3s ease-in-out;width: 1.97vw;}

#contents01 .img-Box figure.img {position: relative;top: 0;left: 0;}
#contents01 .img-Box figure.img img{width: 13.3vw;}
#contents01 .text-Box h4 {position: relative;font-weight: 700;margin-bottom: 1.87vw;font-size: 3.73vw;line-height: 1.6;letter-spacing: 0.05em;text-align: center;}
#contents01 .text-Box p.ltext {color: #333;position: relative;font-size: 3.2vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents02 {margin: 0 auto 0;position: relative;padding: 11vw 4.2vw 14.87vw;}
#contents02 .inner-Box {position: relative;}
#contents02 .inner-Box h2 {margin-bottom: 4.3vw;position: relative;}
#contents02 .inner-Box p.subttl {margin-bottom: 5.9vw;position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 350;text-align: left;}
#contents02 .inner-Box ul{display:grid;grid-template-columns: repeat(2,1fr);gap: 2.63vw 2.67%;margin:0 auto;}
#contents02 .inner-Box ul li{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background: #fff;padding: 6vw 0vw 7.6vw 0vw;border: 3px solid var(--main-blue);border-radius: 2.67vw;overflow: hidden;box-sizing: border-box;}
#contents02 .inner-Box h3 {margin-bottom: 2.4vw;position: relative;width: 100%;font-size: 4.2vw;line-height: 1.4;letter-spacing: 0.05em;font-weight: 700;text-align: center;color: #333;}
#contents02 .inner-Box p.ltext {color: var(--main-blue);position: relative;width: 100%;font-size: 3.5vw;line-height: 1.2;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents02 .inner-Box p.ltext span.f-en {position: relative;top: 0.5vw;left: 0.4vw;font-size: 7.5vw;line-height: 1.0;letter-spacing: 0em;font-weight: 700;text-align: center;margin-right: 0.8vw;}

#contents03 {position: relative;background: #fff;padding: 11.2vw 4.3vw 13.8vw;}
#contents03 h2{ }
#contents03 .subttl {margin-bottom: 5.8vw;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 350;text-align: left;}

#contents03 .inner-Box {position: relative;}
#contents03 .inner-Box ul{display:grid;grid-template-columns: repeat(1,1fr);margin:0 auto;}
#contents03 .inner-Box ul li{position:relative;margin-bottom: 4.3vw;padding: 0 0 4.3vw 0;display:flex;gap: 3.93vw;border-bottom: 1px solid #ccc;}
#contents03 .inner-Box ul li:last-child{margin-bottom: 0px; border: none;}
#contents03 .photo{margin:0 auto;position:relative;width: 21.47vw;flex-shrink:0;}
#contents03 .text-box{margin:0 auto;position:relative;flex:1;}


#contents03 .photo figure.photo {position: relative;top: 0;left: 0;}
#contents03 .photo figure.photo img{width: 100%;height: auto;}
#contents03 .text-box h3 {margin-bottom: 1.83vw;position: relative;font-size: 4.0vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents03 .text-box p.text {position: relative;font-size: 3.47vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents03 .text-box ul li { position: relative; }
#contents03 .text-box ul li:nth-child(3n) { margin-right: 0.0vw; }

#contents04 {}
#contents04 h2{ }
#contents04 .subttl {margin-bottom: 5.73vw;font-size: 3.7vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents04 .inner-Box .flip-item { opacity: 1; transition: opacity 0.25s ease; }
#contents04 .inner-Box .flip-item.is-hidden { opacity: 0; pointer-events: none; }
#contents04 .inner-Box .flip-item.is-none { display: none; }
#contents04 .inner-Box .flip-list { position: relative; transition: min-height 0.2s ease; }
#contents04 .inner-Box .flip-list {display:flex;flex-wrap:wrap;gap:2%;}

#contents04 .inner-Box .flip-item {width:49%;min-height: 47.33vw;cursor:pointer;margin-bottom: 2.73vw;overflow: hidden;border-radius: 2.67vw;}
#contents04 .inner-Box .flip-card-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d;border-radius: 2.67vw; }
#contents04 .inner-Box .flip-item.is-flipped .flip-card-inner { transform: rotateY(180deg); }
#contents04 .inner-Box .face {position: absolute;width: 100%;height: 47.37vw;top: 0;left: 0;backface-visibility: hidden;display: flex;flex-direction: column;align-items: center;padding: 5.1vw 6.40vw 28.2vw;border-radius: 2.67vw;overflow: hidden;/* position: relative; */}
#contents04 .inner-Box .face.front {background: url(../images/recruit/contents04-icon02.svg)no-repeat bottom right #fff;color: var(--main-blue);background-size: 4vw auto;}
#contents04 .inner-Box .face .no {margin-bottom: 2.1vw;font-size: 5vw;line-height: 1.0;letter-spacing: 0.03em;font-weight: 700;text-align: center;}
#contents04 .inner-Box .face.front h3 {font-size: 3.7vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents04 .inner-Box .face.front h3 span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
#contents04 .inner-Box .face.front .photo{position: absolute;bottom: 5vw;width: 6.5vw;left: 50%;transform: translateX(-50%);}
#contents04 .inner-Box .face.front .photo img{width: 100%;height: auto;}

/* --- 裏面のデザイン --- */
#contents04 .inner-Box .face.back {background: url(../images/recruit/contents04-icon02.svg)no-repeat bottom right #fff;color: var(--main-blue);transform: rotateY(180deg);padding: 5.3vw 4.5vw 6.40vw;box-sizing: border-box;background-size: 4vw auto;}
#contents04 .inner-Box .face.back .ftext{font-size: 3.73vw;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;}

#contentsstaff {position: relative;background: url(../images/common/back.png),url(../images/common/back.svg)no-repeat top right;background-size: auto auto,cover;color: #fff;padding: 0 0 14.73vw 4.6vw;margin-bottom: 11vw;}
#contentsstaff .back-Box{padding: 11.43vw 4vw 0vw 0vw;}

#contentsstaff .inner-Box {margin: 0 auto 14.87vw;position: relative;}
#contentsstaff .inner-Box h2{position: relative;margin-bottom: 4.27vw;}
#contentsstaff .inner-Box h2 .f-en::before{ background: #fff;}
#contentsstaff .inner-Box h2 .f-en{ color: #fff;}
#contentsstaff .inner-Box h2 .ttl-ja{ color: #fff;}
#contentsstaff .inner-Box .subttl{font-size: 3.73vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 350;text-align: left;}
#contentsstaff .inner-Box .listbtn{text-align: left;padding-left: 0.80vw;position: absolute;top: 35vw;right: 0;}
#contentsstaff .inner-Box .listbtn a{ color: #fff;}
#contentsstaff .inner-Box .listbtn a .arr{ border-color: #fff;}
#contentsstaff .inner-Box .listbtn a .arr img{ filter: brightness(0) invert(1);}

#contentsstaff .pickup-slide .swiper-slide {width: 69.33vw !important;height: auto;}
#contentsstaff .pickup-slide .swiper-slide .photo {width: 100%;aspect-ratio: 32 / 22;overflow: hidden;text-align: center;position: relative;margin-bottom: 2.13vw;}
#contentsstaff .pickup-slide .swiper-slide .photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
#contentsstaff .pickup-slide .swiper-slide p{font-size: 3.2vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 2vw;}
#contentsstaff .pickup-slide .swiper-slide h3{font-size: 3.38vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contentsstaff .pickup-slide .swiper-slide a{ color: #fff;}

#contentsstaff .pickup-slider-container.slidenone{ padding: 0 5vw 0; }
#contentsstaff .pickup-slider-container.slidenone .pickup-slide{width: 120rem;}
#contentsstaff .pickup-slider-container.slidenone .pickup-slide .swiper-slide{margin: 0;}
#contentsstaff .slider-controls {display: flex;align-items: center;justify-content: center;gap: 4.00vw;margin-top: 3.3vw;}
#contentsstaff .slider-controls .swiper-pagination { position: static !important; width: auto !important; display: flex !important; gap: 2.67vw; }
#contentsstaff .slider-controls .swiper-pagination-bullet {width: 1.60vw;height: 1.60vw;background: #fff;opacity: 0.3;margin: 0 !important;}
#contentsstaff .slider-controls .swiper-pagination-bullet-active { opacity: 1; }
#contentsstaff .prev-arrow, .next-arrow {cursor: pointer;line-height: 0;filter: brightness(0) invert(1);transform: scale(-1, 1);width: 2.2vw;}
#contentsstaff .next-arrow { transform: scale(1, 1); }

#contentsstaff .pickup-no-slide .swiper-wrapper { flex-wrap: wrap; }
#contentsstaff .pickup-no-slide .swiper-slide { width: 32% !important; }
#contentsstaff .is-hidden{ display: none;}
#contentsstaff .is-hidden-dot{display:none;}


#contents04 {position: relative;padding: 11vw 4.6vw 12.6vw;}
#contents04 .inner-Box {position: relative;}
#contents04 .inner-Box h2 {position: relative;margin-bottom: 4.4vw;}
#contents04 .inner-Box ul{display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#contents04 .inner-Box ul li { position: relative; }
#contents04 .inner-Box span.f-en{  }
#contents04 .inner-Box h3 { margin-bottom: 0.0vw; position: relative; }
#contents04 .inner-Box p.text { margin-bottom: 8.0vw; position: relative; }


#contentsflow {}
#contentsflow .inner-Box {}
#contentsflow .inner-Box h2 {position: relative;margin-bottom: 7.2vw;}
#contentsflow .inner-Box ul{position: relative;}
#contentsflow .inner-Box ul::before{content: "";width: 0.27vw;height: 90%;position: absolute;top: 0vw;left: 3.57vw;background: var(--main-blue);}
#contentsflow .inner-Box ul li {position: relative;padding: 0vw 1vw 0 12.33vw;margin-bottom: 5.13vw;}
#contentsflow .inner-Box ul li span.f-en{color: #fff;position: absolute;top: -0.9vw;left: 0;background: var(--main-blue);border-radius: 50%;font-size: 3.73vw;line-height: 1.0;letter-spacing: 0.03em;font-weight: 700;text-align: center;width: 7.93vw;height: 7.93vw;padding: 2.37vw 0 0;}
#contentsflow .inner-Box ul li:last-child { margin-bottom: 0.0vw; }

#contentsflow .inner-Box h3 {color: var(--main-blue);margin-bottom: 2.13vw;position: relative;font-size: 4.27vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contentsflow .inner-Box p.text {position: relative;font-size: 3.73vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contentsflow {position: relative;padding: 11.2vw 4.4vw 14.4vw 4.4vw;background: #fff;margin: 0;}
#contentsflow .inner-Box {position: relative;}


#contents05 {position: relative;padding: 11.2vw 4.2vw;}
#contents05 .inner-Box {position: relative;}
#contents05 .inner-Box h2 {position: relative;margin-bottom: 6.5vw;}
#contents05 .inner-Box ul{margin:0 auto;}
#contents05 .inner-Box ul li{position:relative;margin-bottom: 4vw;}
#contents05 .inner-Box ul li a{ }

#contents05 .inner-Box ul li .photo { width: 100%; aspect-ratio: 588 / 180; overflow: hidden; text-align: center; position: relative;}
#contents05 .inner-Box ul li .photo img { width: 100%; height: 100%; object-fit: cover; display: block; }


#news{margin: 0 4.4vw 15.1vw;}
#news .inner-Box{margin:0 auto;}
#news .inner-Box .ttl-Box{ position: relative; }
#news .inner-Box .ttl-Box .listbtn{text-align: left;padding-left: 0.8vw;position: absolute;top: 10.8vw;right: 0vw;}
#news .inner-Box .ttl-Box h2{margin-bottom: 4.233vw;}
#news .inner-Box .system-Box{}
#news .inner-Box .system-Box{}
#news .inner-Box .system-Box li{border-bottom: #CCC 0.27vw solid;margin-bottom: 4.333vw;}
#news .inner-Box .system-Box li a{position:relative;padding: 0 2vw;display: block;padding-bottom: 0.767vw;}

#news .inner-Box .system-Box li .databox{font-size: 2.93vw;line-height:1.083;letter-spacing:0.1em;font-weight:400;text-align:left;color:var(--main-blue);flex:1;}
#news .inner-Box .system-Box li .data-inbox {display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-start;gap: 1.33vw;}
#news .inner-Box .system-Box li .databox .timebox {font-weight: 500;}
#news .inner-Box .system-Box li .databox .categ {color: var(--main-blue);display: block;background: #fff;border: 0.27vw solid var(--main-blue);padding: 1.60vw;line-height: 1;letter-spacing: 0;}

#news .inner-Box .system-Box li .arr{position: absolute;right: -2.4vw;width: 8.533vw;height: 8vw;padding: 1.867vw 0 0 2.933vw;top: 33%;transform: translateY(-50%);border-left: var(--main-blue) solid 0.27vw;display: none;}
#news .inner-Box .system-Box li .systtl{color: #333333;font-size: 3.7vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#news .inner-Box .system-Box li .systtl span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}

}

/* =========================================================
   藤井ビルのいいところ：裏面（画像＋本文＋詳しく見る）＋モーダル
   （早水組「網走のいいところ100選」カードの挙動に合わせて追加）
   ========================================================= */
/* --- PC --- */
#contents04 .inner-Box .face.back {
  justify-content: flex-start;
  padding: 1.6rem;
  overflow-y: auto;
}
#contents04 .inner-Box .face.back .merit-image {
  width: 100%;
  height: 8.4rem;
  margin: 0 0 1rem;
  overflow: hidden;
  border-radius: 0.8rem;
}
#contents04 .inner-Box .face.back .merit-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
#contents04 .inner-Box .face.back .ftext {
  width: 100%;
  font-size: 1.3rem;
  line-height: 1.7;
  text-align: left;
  color: #333;
  margin-bottom: 1.2rem;
}
#contents04 .inner-Box .face.back .ftext span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
#contents04 .inner-Box .face.back .detail-btn {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #fff;
  background: var(--main-blue);
  border-radius: 9999px;
  padding: 0.7rem 1.8rem;
  cursor: pointer;
  transition: opacity 0.2s ease;
}
#contents04 .inner-Box .face.back .detail-btn:hover { opacity: 0.85; }

/* モーダル（magnific-popup inline）。bodyへ移動されるため非スコープ */
.merit-modal {
  width: 70rem;
  max-width: 92%;
  margin: 0 auto;
  background: #fff;
  padding: 4rem;
  border-radius: 2rem;
  position: relative;
}
.merit-modal .modal-title {
  font-size: 2.2rem;
  font-weight: 700;
  color: var(--main-blue);
  margin-bottom: 2rem;
}
.merit-modal .modal-image {
  overflow: hidden;
  border-radius: 1.2rem;
  margin-bottom: 2rem;
}
.merit-modal .modal-image img { width: 100%; height: auto; display: block; }
.merit-modal .modal-body {
  font-size: 1.5rem;
  line-height: 1.9;
  text-align: left;
  color: #333;
}

/* --- SP --- */
@media (max-width: 767px) {
  #contents04 .inner-Box .face.back {
    justify-content: flex-start;
    padding: 4vw;
    overflow-y: auto;
  }
  #contents04 .inner-Box .face.back .merit-image {
    width: 100%;
    height: 22vw;
    margin: 0 0 2.5vw;
    overflow: hidden;
    border-radius: 2vw;
  }
  #contents04 .inner-Box .face.back .merit-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  #contents04 .inner-Box .face.back .ftext {
    width: 100%;
    font-size: 3.2vw;
    line-height: 1.7;
    text-align: left;
    color: #333;
    margin-bottom: 3vw;
  }
  #contents04 .inner-Box .face.back .ftext span {
    -webkit-line-clamp: 3;
  }
  #contents04 .inner-Box .face.back .detail-btn {
    margin-top: auto;
    gap: 1vw;
    font-size: 3vw;
    padding: 1.8vw 4.5vw;
  }
  .merit-modal {
    margin: 0 4vw;
    padding: 9vw 5vw;
    border-radius: 4vw;
  }
  .merit-modal .modal-title { font-size: 4.5vw; margin-bottom: 4vw; }
  .merit-modal .modal-image { border-radius: 2.5vw; margin-bottom: 4vw; }
  .merit-modal .modal-body { font-size: 3.6vw; line-height: 1.9; }
}

/* 詳細のないカードはフリップ不可（カーソルも通常に） */
#contents04 .inner-Box .flip-item.no-flip { cursor: default; }

/* =========================================================
   カードのホバー演出（枠線カラー＋クリックアイコンの動き）
   ※ フリップ可能なカード（.no-flip 以外）のみ
   ========================================================= */
#contents04 .inner-Box .flip-item { transition: box-shadow 0.25s ease; }
#contents04 .inner-Box .flip-item:not(.no-flip) { cursor: pointer; }
#contents04 .inner-Box .flip-item:not(.no-flip):hover {
  box-shadow: 0 0 0 2px var(--main-blue);
}

/* クリックアイコンをホバーで上下に少し動かす（translateX(-50%)は維持） */
@keyframes merit-finger-bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%      { transform: translateX(-50%) translateY(-0.5rem); }
}
#contents04 .inner-Box .flip-item:not(.no-flip):hover .face.front .photo {
  animation: merit-finger-bounce 0.7s ease-in-out infinite;
}

/* 募集要項・エントリー：公開記事が無い場合の案内 */
#contents05 .recruit-end-text{text-align:center;font-size:1.8rem;line-height:1.8;letter-spacing:0.05em;font-weight:500;color:var(--main-blue);padding:4rem 0;}
@media screen and (max-width:767px){
#contents05 .recruit-end-text{font-size:4.2vw;padding:8vw 0;}
}