@charset "UTF-8";

/*****************************
  pagecommon
*****************************/
.cmpsec{
  background: #fff;
  position: relative;
}
.campaignEnd .cmparea::before,
.campaignEnd .cmpsec-fv::after{
  content: "";
  position: absolute;
  z-index: 10;
}
.campaignEnd .cmparea::before{
  background: rgba(150, 150, 150, .8);
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.campaignEnd .cmpsec-fv::after{
  content: "";
  aspect-ratio: 15/2;
  background: url(../images/campaign/after.svg) no-repeat center / contain;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 81.51%;
}
.campaignEnd .bgsec::before {
  background: rgb(172 172 172);
}

/*****************************
cmpsec-fv
*****************************/
.cmpsec-fv {
  padding: 6vw 0 3.5vw;
}
.cmpsec-fv::before{
  content: "";
  background: linear-gradient(#ffff8c,#fff);
  aspect-ratio: 64/15;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.cmpsec-fv .poke{
  position: absolute;
}
.cmpsec-fv .poke1{
  top: -10.4%;
  left: -21%;
  width: 64.48%;
}
.cmpsec-fv .poke2{
  bottom: 34%;
  right: 9.22%;
  width: 20.46%;
}
.cmpsec-fv .poke3{
  bottom: 9%;
  left: 6.22%;
  width: 25.57%;
}
.cmpsec-fv .ttl{
  margin-left: auto;
  width: 83.29%;
}
.cmpsec-fv .date{
  margin: -5vw auto 0;
  width: 90.58%;
}
.cmpsec-fv .date p{
  margin: 2vw auto 0;
  width: 77.01%;
}

/*****************************
cmpsec-overview
*****************************/
.cmpsec-overview{
  background: #ef8337;
  padding: 6vw 0;
}
.cmpsec-overview h2{
  margin-bottom: 2vw;
  width: 34.53%;
}

/*****************************
cmpsec-prize
*****************************/
.cmpsec-prize {
  padding: 6vw 0 8vw;
}
.cmpsec-prize h2{
  width: 18.76%;
}
.cmpsec-prize .ttl-box {
  display: flex;
  align-items: flex-end;
}
.cmpsec-prize .ttl-box span {
  margin-left: 2vw;
  font-size: min(1.6vw,2.6rem);
}
.cmpsec-prize .prizegr .prize{
  border: 3px solid #ef8337;
  border-radius: 30px;
  margin-top: 3vw;
  overflow: hidden;
}
.cmpsec-prize .prizegr .prize3{
  border-color: #00afff;
}
.cmpsec-prize .prizegr .prize .course{
  margin: 0 auto ;
  width: 89.21%;
}
.cmpsec-prize .prizegr .prize1 .course{
  /* padding: 1vw 0 3.5vw; */
  padding: 1vw 0 1.5vw;
}
.cmpsec-prize .prizegr .prize2 .course{
  margin-bottom: -.5vw ;
}
.cmpsec-prize .prizegr .prize3 .course{
  padding: 1vw 0 2.5vw;
}

.cmpsec-prize .prizegr .prize .fbox{
  margin-top: 3vw;
  width: 36.05%;
}
.cmpsec-prize .prizegr .prize .fimgbox{
  width: 60.16%;
}
.cmpsec-prize .prizegr .prize .fbox dt{
  margin-bottom: 1vw;
}
.cmpsec-prize .prizegr .prize1 .fimgbox{
  margin-top: 2vw;
}

.cmpsec-prize .prizegr .prize1 .fbox dt{
  width: 75.96%;
}
.cmpsec-prize .prizegr .prize1 .fbox dd{
  width: 80.42%;
}
.cmpsec-prize .prizegr .prize2 .fbox dt{
  width: 65.11%;
}
.cmpsec-prize .prizegr .prize2 .fbox dd{
  width: 87.59%;
}
.cmpsec-prize .prizegr .prize3 .fbox dt{
  width: 53.1%;
}

.cmpsec-prize .prizegr .prize1 .fimgbox img.txt{
  width: 72.59%;
}
.cmpsec-prize .prizegr .prize2 .fimgbox img{
  width: 79.21%;
}
.cmpsec-prize .prizegr .prize2 .fimgbox img.txt{
  position: absolute;
  bottom: 1.5vw;
  left: 50%;
  transform: translateX(-50%);
  width: 84.2%;
}
.cmpsec-prize .prizegr .prize3 .fimgbox img{
  width: 83.85%;
}
.cmpsec-prize .prizegr .prize3 .fimgbox img.txt{
  position: absolute;
  bottom: -1vw;
  left: 50%;
  transform: translateX(-50%);
  width: 92.56%;
}

.cmpsec-prize .prizegr .prize .bar{
  background: #ef8337;
  padding: 2rem 0 1.5rem;
  text-align: center;
}
.cmpsec-prize .prizegr .prize3 .bar{
  background: #00afff;
}
.cmpsec-prize .prizegr .prize .bar .num{
  width: 10.66%;
}
.cmpsec-prize .prizegr .prize3 .bar .num{
  position: relative;
  width: 13.96%;
  z-index: 1;
}
.cmpsec-prize .prizegr .prize3 .bar .attention{
  position: absolute;
  right: 1.5%;
  bottom: 12%;
  width: 13.46%;
}

.cmpsec-prize .prizegr .prize .poke{
  position: absolute;
  bottom: 0;
}
.cmpsec-prize .prizegr .prize1 .poke{
  left: 4.5%;
  width: 24%;
}
.cmpsec-prize .prizegr .prize2 .poke{
  left: 3%;
  width: 33.41%;
}
.cmpsec-prize .prizegr .prize3 .poke{
  left: 7%;
  width: 22.44%;
}

.cmpsec-prize h3{
  margin-top: 4vw;
}

@media only screen and (min-width: 1921px) {
  .cmpsec-prize .prizegr .prize1 .course {
    /* padding: 2vw 0 4.5vw; */
    padding: 1vw 0 2.5vw;
  }
  .cmpsec-prize .prizegr .prize1 .fimgbox img:first-of-type{
    width: 100%;
  }
  .cmpsec-prize .prizegr .prize2 .fimgbox img:first-of-type{
    width: 80%;
  }
  .cmpsec-prize .prizegr .prize3 .fimgbox img:first-of-type{
    width: 90%;
  }
}
@media only screen and (max-width: 1180px) {
  .cmpsec-prize .prizegr .prize1 .course{
    padding: 1vw 0 1.5vw;
  }
}
@media only screen and (max-width: 1024px) {
  
}
@media only screen and (max-width: 820px) {
  
}
@media only screen and (max-width: 768px) {
  
}
@media only screen and (max-width: 767px) {
  
}

/*****************************
cmpsec-method
*****************************/
.cmpsec-method{
  background: #e8ffcc;
  padding: 5vw 0;
}
.cmpsec-method .content h2{
  margin-bottom: 3vw;
  width: 18.82%;
}
.cmpsec-method .step{
  background: #fff;
  border: 3px solid #2850b4;
  margin-top: 5vw;
  padding: 2.5vw 0 1.5vw;
}
.cmpsec-method .step p{
  margin: 0 auto 3vw;
  width: 82.98%;
}
.cmpsec-method .flowgr{
  margin: 0 auto;
  width: 82.98%;
}
.cmpsec-method .flowgr .flow .imgbox{
  margin: 0 auto;
}
.cmpsec-method .flowgr .flow .txt{
  margin-top: 1vw;
  height: 8vw;
}
.cmpsec-method .flowgr .flow1{
  width: 24.11%;
}
.cmpsec-method .flowgr .flow2{
  width: 27.27%;
}
.cmpsec-method .flowgr .flow2 .imgbox{
  margin-left: 2vw;
  width: 89.8%;
}
.cmpsec-method .flowgr .flow3{
  width: 18.03%;
}
.cmpsec-method .flowgr .flow3 .imgbox{
  width: 77.91%;
}

.cmpsec-method .btn{
  margin: 3vw auto;
  width: 74.81%;
}

.cmpsec-method .target{
  background: #fff;
  border: 3px solid #ed8137;
  padding: 3.07vw 0 3vw;
}
.cmpsec-method .target .ttl{
  margin: 0 auto 3vw;
  width: 78.18%;
}
.cmpsec-method .target ul{
  margin: 0 auto;
  width: 90.27%;
}
.cmpsec-method .target ul li .txt{
  margin-bottom: 1.5vw;
}
.cmpsec-method .target ul li:nth-of-type(1){
  width: 51.10%;
}
.cmpsec-method .target ul li:nth-of-type(1) .txt{
  width: 93.51%;
}
.cmpsec-method .target ul li:nth-of-type(2){
  width: 42.74%;
}
.cmpsec-method .target ul li:nth-of-type(2) .item{
  width: 89.01%;
}
.cmpsec-method .target ul li:nth-of-type(3){
  margin-top: 2vw;
  width: 99.86%;
}
.cmpsec-method .target ul li:nth-of-type(3) .txt{
  width: 54.93%;
}
.cmpsec-method .attention{
  margin-top: 3vw;
  width: 88.34%;
}

/*****************************
cmpsec-precautions
*****************************/
.cmpsec-precautions{
  padding: 3vw 0 5vw;
}
.cmpsec-precautions .precautions h2{
  width: 18.82%;
}
.cmpsec-precautions .precautions p{
  margin: 3vw 0;
}

/*****************************
bgsec
*****************************/
.bgsec::before{
  content: "";
  aspect-ratio: 128/41;
  background: #fff;
  position: absolute;
  clip-path: polygon(0 0, 0% 100%, 100% 0);
  right: 0;
  top: 0;
  width: 100%;
}
.bgsec img{
  width: 100%;
}