@charset "UTF-8";

: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;
}
}


.special01 {
   background: linear-gradient(#942959 0%, #a82455 100%);
   width: 100%;
   overflow: hidden;
}
.ttl-area {
   position: relative;
   min-height: 400px;
}
.ttl-area:before {
   width: 490px;
   height: 480px;
   bottom: 0;
   right: -50px;
   background-image: url("../img/spc_img/spc01_deco01.svg");
   z-index: 1;
}
.ttl-area h1 {
   width: 308px;
   position: absolute;
   left: 60%;
   top: 50%;
   z-index: 2;
}
.title-bg {
   width: 80%;
   max-width: 1200px;
   position: relative;
   top: -50px;
}
.intro {
   position: relative;
}
.intro .content-box {
   padding: 80px 0;
   width: 80%;
   margin: 0 auto;
   max-width: 580px;
   position: relative;
}
.intro .content-box:after {
   width: 100%;
   height: 4px;
   background-repeat: repeat-x;
   background-image: url("../img/spc_img/spc01_dotline.svg");
   bottom: 0;
   left: 0;
}
.intro h2 {
   text-align: center;
   color: #FFF;
   font-size: 32px;
   font-weight: 600;
   margin-bottom: 40px;
}
.intro .mp01 {
   color: #FFF;
   font-size: 20px;
   font-weight: 500;
}
.profile {
   width: 90%;
   margin: 50px auto 0;
   max-width: 500px;
}
.profile .img-box {
   width: 230px;
   margin: 0 auto 20px;
}
.profile .name {
   color: #FFF;
   font-size: 26px;
   font-weight: 500;
   text-align: center;
}
.profile .year {
   text-align: center;
   color: #FFF;
   font-size: 16px;
   font-weight: 500;
   padding-bottom: 20px;
}
.profile .p01 {
   font-size: 14px;
   color: #FFF;
   line-height: 1.6em;
}
.block01,
.block02 {
   padding: 80px 0;
   position: relative;
}
.block03 {
   padding: 80px 0 0;
   position: relative;
}
.block01 .content-box,
.block02 .content-box,
.block03 .content-box {
   width: 90%;
   margin: 0 auto;
   max-width: 980px;
}
.block01:before {
   width: 400px;
   height: 360px;
   background-image: url("../img/spc_img/spc01_deco02.svg");
   left: calc(50% - 750px);
   top: -80px;
}
.block02:before {
   width: 520px;
   height: 460px;
   background-image: url("../img/spc_img/spc01_deco03.svg");
   right: calc(50% - 900px);
   top: -50px;
}
.block03:before {
   width: 370px;
   height: 460px;
   background-image: url("../img/spc_img/spc01_deco04.svg");
   left: calc(50% - 750px);
   top: -80px;
}
.number {
   font-family: 'Barlow', sans-serif;
   color: #B60355;
   font-size: 60px;
   font-weight: 700;
   position: relative;
   text-align: center;
   z-index: 1;
   margin-bottom: 10px;
}
.number:before {
   width: 90px;
   height: 90px;
   background: #FEDC5E;
   border-radius: 50%;
   top: calc(50% - 45px);
   left: calc(50% - 45px);
   z-index: -1;
}
.special01 h3 {
   color: #B60355;
   font-size: 26px;
   font-weight: 600;
   background: #FFF;
   display: inline-block;
   position: relative;
   left: 50%;
   padding: 0 15px 0;
   transform: translateX(-50%);
   margin-bottom: 30px;
}
.special01 h4 {
   text-align: center;
   font-size: 26px;
   font-weight: 500;
   color: #FEDC5E;
   margin-bottom: 60px;
}
.block01 .split-box {
   position: relative;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
.block01 .split-box .img-box {
  width: 47%; 
}
.block01 .split-box .txt-box {
  width: 47%; 
}
.sp-p01 {
   color: #FFF;
   font-size: 16px;
   font-weight: 400;
}
.block02 .txt-box {
   padding-bottom: 50px;
}
.block03 .txt-box {
   padding-bottom: 100px;
}



@media screen and (max-width: 1023px) {
.ttl-area {
   position: relative;
}
.ttl-area:before {
   width: calc(490px * .6);
   height: calc(480px * .6);
   bottom: 0;
   right: -100px;
   background-image: url("../img/spc_img/spc01_deco01.svg");
   z-index: 1;
}
.ttl-area h1 {
   width: 220px;
   position: absolute;
   left: 5%;
   top: 50%;
   z-index: 2;
}
.title-bg {
   width: 90%;
   max-width: 600px;
   position: relative;
   top: -20px;
}
.intro {
   position: relative;
}
.intro .content-box {
   padding: 60px 0;
   width: 80%;
   margin: 0 auto;
   max-width: 580px;
   position: relative;
}
.intro .content-box:after {
   width: 100%;
   height: 4px;
   background-repeat: repeat-x;
   background-image: url("../img/spc_img/spc01_dotline.svg");
   bottom: 0;
   left: 0;
}
.intro h2 {
   text-align: center;
   color: #FFF;
   font-size:min(8vw,24px);
   font-weight: 600;
   margin-bottom: 30px;
}
.intro .mp01 {
   color: #FFF;
   font-size:min(4vw,16px);
   font-weight: 500;
}
.profile {
   width: 100%;
   margin: 50px auto 0;
   max-width: 500px;
}
.profile .img-box {
   width: 180px;
   margin: 0 auto 20px;
}
.profile .name {
   color: #FFF;
   font-size: 20px;
   font-weight: 500;
   text-align: center;
}
.profile .year {
   text-align: center;
   color: #FFF;
   font-size: 14px;
   font-weight: 500;
   padding-bottom: 20px;
}
.profile .p01 {
   font-size: 13px;
   color: #FFF;
   line-height: 1.6em;
}
.block01,
.block02 {
   padding: 40px 0;
   position: relative;
}
.block03 {
   padding: 40px 0 0;
   position: relative;
}
.block01 .content-box,
.block02 .content-box,
.block03 .content-box {
   width: 90%;
   margin: 0 auto;
   max-width: 600px;
}
.block01:before {
   width: calc(400px * .5);
   height: calc(360px * .5);
   background-image: url("../img/spc_img/spc01_deco02.svg");
   left: calc(50% - 280px);
   top: -50px;
}
.block02:before {
   width: calc(520px * .5);
   height: calc(460px * .5);
   background-image: url("../img/spc_img/spc01_deco03.svg");
   right: calc(50% - 350px);
   top: -30px;
}
.block03:before {
   width: calc(370px * .5);
   height: calc(460px * .5);
   background-image: url("../img/spc_img/spc01_deco04.svg");
   left: calc(50% - 280px);
   top: -80px;
}
.number {
   font-family: 'Barlow', sans-serif;
   color: #B60355;
   font-size: 30px;
   font-weight: 700;
   position: relative;
   text-align: center;
   z-index: 1;
   margin-bottom: 10px;
}
.number:before {
   width: 50px;
   height: 50px;
   background: #FEDC5E;
   border-radius: 50%;
   top: calc(50% - 25px);
   left: calc(50% - 25px);
   z-index: -1;
}
.special01 h3 {
   color: #B60355;
   font-size:min(4vw,18px);
   letter-spacing: 0;
   font-weight: 600;
   background: #FFF;
   display: inline-block;
   position: relative;
   left: 50%;
   padding: 0 5px 0;
   transform: translateX(-50%);
   margin-bottom: 30px;
}
.special01 h4 {
   text-align: center;
   font-size:min(5vw,20px);
   font-weight: 500;
   color: #FEDC5E;
   margin-bottom: 30px;
}
.block01 .split-box {
   position: relative;
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
.block01 .split-box .img-box {
  width: 100%;
  max-width: 200px;
  margin: 0 auto 30px;
}
.block01 .split-box .txt-box {
  width: 100%; 
}
.sp-p01 {
   color: #FFF;
   font-size: 13px;
   font-weight: 400;
}
.block02 .txt-box {
   padding-bottom: 40px;
}
.block03 .txt-box {
   padding-bottom: 60px;
}
.last-img-box img {
   object-fit: cover;
   min-height: 250px;
}
}