@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300;400;500;600;700&display=swap');

.min {
   font-family: 'Noto Serif JP', serif;
}

:before,
:after {
  content: "";
  position: absolute;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.abox {
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 10;
}
.spc-link {
   height: 200px;
   background: #FFF;
   position: relative;
}
.spc-link .btn2 {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   width: 80%;
   max-width: 380px;
}

@media screen and (max-width: 1023px) {
.spc-link {
   height: 150px;
   background: #FFF;
   position: relative;
}
}
.recruitlink {
   z-index: 1;
}

.special02 {
   background: #FFFCEA;
   width: 100%;
   overflow: hidden;
}
.ttl-area {
   position: relative;
   margin-bottom: 200px;
}
.ttl-area h1 {
   width: 177px;
   position: absolute;
   left: 15%;
   top: 150px;
   z-index: 2;
}
.ttl-area .title-bg {
   width: 45%;
   max-width: 730px;
   height: 670px;
   top: -50px;
   left: 50%;
   position: absolute;
   z-index: 1;
}
.ttl-area .title-bg2 {
   width: 80%;
   max-width: 1200px;
   top: 200px;
   left: -50px;
   position: relative;
}

.intro {
   padding: 80px 0 120px;
   width: 90%;
   margin: 0 auto;
   max-width: 980px;
   position: relative;
}
.intro .content-box {
   width: 80%;
   max-width: 780px;
   margin: 0 auto;
   position: relative;
}
.intro:after {
   width: 70%;
   height: 4px;
   background-repeat: repeat-x;
   background-image: url("../img/spc_img/spc02_dotline.svg");
   bottom: 0;
   left: 0;
}
.intro h2 {
   color: #B60355;
   font-size: 32px;
   font-weight: 600;
   text-align: center;
   margin-bottom: 30px;
}
.intro .mp01 {
   font-size: 20px;
   width: 80%;
   max-width: 580px;
   margin: 0 auto;
}
.special02 h3 {
   color: #B60355;
   font-size: 26px;
   font-weight: 600;
   line-height: 1.6em;
   margin-bottom: 20px;
}
.sp-p01 {
   font-size: 16px;
   font-weight: 400;
   line-height: 2em;
}
.block01 {
   padding: 150px 0 80px;
}
.block01 .content-box {
   width: 90%;
   margin: 0 auto;
   max-width: 980px;
   position: relative;
}
.block01 .ttl-box {
   width: 106px;
   right: 5%;
   top: -250px;
   position: absolute;
   z-index: 2;
}
.special02 .content-box .split-box {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   margin-bottom: 130px;
}
.special02 .content-box .split-box .txt-box {
   width: 58%;
}
.special02 .content-box .split-box .img-box {
   width: 38%;
   position: relative;
}
.special02 .content-box .split-box.flip .txt-box {
   order: 2;
}
.special02 .content-box .split-box.flip .img-box {
   order: 1;
}
.insert01 {
   width: 450px;
   top: -100px;
   left: 0;
   position: absolute;
}
.insert02 {
   top: -60px;
   right: 0;
   position: absolute;
   width: 470px;
}
.insert03 {
   width: 410px;
   top: -50px;
   left: 0;
   position: absolute;
}
.insert04 {
   top: -60px;
   right: 0;
   position: absolute;
   width: 420px;
}
.data-box {
   width: 100%;
   box-sizing: border-box;
   padding: 50px 0 20px;
   border: solid 1px #B60355;
   background: #FFF;
   position: relative;
   margin: 0 0 150px;
}
.data-box:before {
   width: 12px;
   height: 33px;
   background-image: 
   url("../img/spc_img/spc02_data.svg");
   right: -18px;
   top: 2px;
}
.data-box ul {
   width: 90%;
   margin: 0 auto;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
.data-box ul li {
   width: 30.33%;
   text-align: center;
}
.data-box ul li .p01 {
   font-size: 18px;
   font-weight: 600;
   margin-bottom: 5px;
}
.data-box ul li .p02 {
   font-size: 30px;
   font-weight: 600;
   color: #B60355;
   margin-bottom: 5px;
   white-space: nowrap;
}
.data-box ul li .p02 span {
   font-family: 'Barlow', sans-serif;
   font-size: 50px;
}
.data-box ul li .p03 {
   font-size: 12px;
   line-height: 1.4em;
}
.block02 {
   padding: 0 0 60px;
   background: url("../img/spc_img/spc02_deco01.svg");
   background-size: 1700px auto;
   background-repeat: no-repeat;
   background-position: center -150px;
   box-sizing: border-box;
   min-height: 900px;
}
.block02 .content-box {
   width: 90%;
   max-width: 980px;
   margin: 0 auto;
   position: relative;
}
.block02 .ttl-box {
   width: 111px;
   left: 5%;
   top: 0px;
   position: absolute;
   z-index: 2;
}
.block02 .sp-p01:first-of-type {
   padding-bottom: 80px;
}
.insert05 {
   top: 220px;
   right: 0;
   position: absolute;
   width: 400px;
}
@media screen and (max-width: 1023px) {
.ttl-area {
   position: relative;
   margin-bottom: 120px;
}
.ttl-area h1 {
   width: calc(177px * .6);
   position: absolute;
   left: 10%;
   top: 80px;
   z-index: 2;
}
.ttl-area .title-bg {
   width: 60%;
   height: 670px;
   top: 50px;
   left: 50%;
   position: absolute;
   z-index: 1;
}
.ttl-area .title-bg2 {
   width: 100%;
   top: 180px;
   left: -10px;
   position: relative;
}

.intro {
   padding: 80px 0 120px;
   width: 90%;
   margin: 0 auto;
   position: relative;
}
.intro .content-box {
   width: 100%;
   max-width: 780px;
   margin: 0 auto;
   position: relative;
}
.intro:after {
   width: 100%;
   height: 4px;
   background-repeat: repeat-x;
   background-image: url("../img/spc_img/spc02_dotline.svg");
   bottom: 0;
   left: 0;
}
.intro h2 {
   color: #B60355;
   font-size: 22px;
   font-weight: 600;
   text-align: center;
   margin-bottom: 20px;
}
.intro .mp01 {
   font-size: 15px;
   width: 90%;
   margin: 0 auto;
}
.special02 h3 {
   color: #B60355;
   font-size: 18px;
   font-weight: 600;
   line-height: 1.6em;
   margin-bottom: 20px;
}
.sp-p01 {
   font-size: 13px;
   font-weight: 400;
   line-height: 2em;
}
.block01 {
   padding: 70px 0 70px;
}
.block01 .content-box {
   width: 90%;
   margin: 0 auto;
   max-width: 980px;
   position: relative;
}
.block01 .ttl-box {
   width: calc(106px * .6);
   right: 5%;
   top: -190px;
   position: absolute;
   z-index: 2;
}
.special02 .content-box .split-box {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   margin-bottom: 50px;
}
.special02 .content-box .split-box .txt-box {
   width: 100%;
}
.special02 .content-box .split-box .img-box {
   width: 100%;
   position: relative;
}
.special02 .content-box .split-box.flip .txt-box {
   order: 1;
}
.special02 .content-box .split-box.flip .img-box {
   order: 2;
}
.insert01 {
   width: 80%;
   top: auto;
   left: auto;
   position: relative;
   margin: 20px auto 0;
   max-width: 300px;
}
.insert02 {
   width: 80%;
   top: auto;
   right: auto;
   position: relative;
   margin: 20px auto 0;
   max-width: 300px;
}
.insert03 {
   width: 80%;
   top: auto;
   left: auto;
   position: relative;
   margin: 20px auto 0;
   max-width: 300px;
}
.insert04 {
   width: 80%;
   top: auto;
   right: auto;
   position: relative;
   margin: 20px auto 0;
   max-width: 300px;
}
.data-box {
   width: 90%;
   margin: 0 auto 80px;
   box-sizing: border-box;
   padding: 40px 0 20px;
   border: solid 1px #B60355;
   background: #FFF;
   position: relative;
}
.data-box:before {
   width: 12px;
   height: 33px;
   background-image: 
   url("../img/spc_img/spc02_data.svg");
   right: -18px;
   top: 2px;
}
.data-box ul {
   width: 90%;
   margin: 0 auto;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
.data-box ul li {
   width: 100%;
   text-align: center;
   padding-bottom: 40px;
}
.data-box ul li .p01 {
   font-size: 16px;
   font-weight: 600;
   margin-bottom: 5px;
}
.data-box ul li .p02 {
   font-size: 22px;
   font-weight: 600;
   color: #B60355;
   margin-bottom: 5px;
   white-space: nowrap;
}
.data-box ul li .p02 span {
   font-family: 'Barlow', sans-serif;
   font-size: 40px;
}
.data-box ul li .p03 {
   font-size: 11px;
   line-height: 1.4em;
}
.block02 {
   padding: 50px 0 60px;
   background: none;
   background-size: auto 90%;
   background-repeat: no-repeat;
   background-position: center -150px;
   box-sizing: border-box;
   min-height: 900px;
}
.block02 .content-box .split-box.flip .txt-box {
   order: 2;
}
.block02 .content-box .split-box.flip .img-box {
   order: 1;
   padding-bottom: 20px;
}
.block02 .content-box {
   width: 90%;
   max-width: 980px;
   margin: 0 auto;
   position: relative;
}
.block02 .ttl-box {
   width: calc(111px * .6);
   left: auto;
   right: 5%;
   top: -100px;
   position: absolute;
   z-index: 2;
}
.block02 .sp-p01:first-of-type {
   padding-bottom: 40px;
}
.insert05 {
   top: auto;
   right: auto;
   position: relative;
   width: 80%;
}
}