.c-bk {
  position: absolute;
}
.c-triangle {
  position: absolute;
}
.c-title {
  /* font-size: 35px; */
  font-weight: bold;
  font-size: 1.8vw;
}
.c-text {
  /* font-size: 45px; */
  font-size: 2.3vw;
}
.c-text__first {
  /* font-size: 30px; */
  font-size: 1.6vw;
}
.c-text__second {
  /* font-size: 33px; */
  font-size: 1.7vw;
}
.c-text__third {
  /* font-size: 35px; */
  font-size: 1.8vw;
}
/* ------ c-ck ------- */
.c-ck__itemCK {
  width: 18.4%;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(20px);
}
.c-ck__itemBox {
  width: 56%;
  position: relative;
  margin: 0 auto;
  margin-top: 36px;
  opacity: 0;
  transform: translateY(20px);
}
.c-ck__itemCK__text {
  font-weight: bold;
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translateX(-50%);
  font-family: "NotoBoldFont";
}
/* ------ c-foot ------- */
.c-foot {
  background-color: #000;
  position: relative;
  /* padding: 224px 74px; */
  padding: 11.7% 0 3.9%;
  z-index: 2;
}
.c-foot__CK__Box {
  position: absolute;
  top: -20%;
  left: 50%;
  width: 100%;
  transform: translate(-50%,-50%);
}
.c-foot__headCK {
  width: 61.8%;
  position: relative;
  position: absolute;
  top: -20%;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
}
.c-foot__CK {
  position: relative;
  width: 61.8%;
  margin: 0 auto;
  margin-top: 36px;
  opacity: 0;
  transform: translateY(20px);
}
.c-foot__headText {
  font-family: "NotoBoldFont";
  z-index: 2;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  font-size: 1.7vw;
  white-space: nowrap;
}
.c-foot__box {
  position: relative;
}
.c-foot__boxText {
  font-size: 1.7vw;
  color: #fff;
  text-align: center;
  opacity: 0;
  transform: translateY(20px);
}
.c-foot__box:nth-child(2) .c-foot__text{
  font-family: "NotoFont";
  color: #00DCEF;
}
.c-foot__text {
  color: #FC4D90;
  position: absolute;
  top: -30%;
  left: 12.5%;
  font-size: 2.1vw;
  transform: rotate(-13deg);
    -moz-transform: rotate(-13deg);
    -webkit-transform: rotate(-13deg);
}
.c-foot__listBox {
  font-weight: bold;
  display: flex;
  justify-content: center;
  margin-top: 3%;
}
.c-foot__listItem {
  width: 19%;
  text-align: center;
  margin-left: 2.6%;
  position: relative;
  opacity: 0;
  transform: translateY(20px);
}
.c-foot__itemText {
  padding: 4.4% 2%;
  position: absolute;
  position: relative;
  z-index: 2;
  top: 50%;
  left: 50%;
  white-space: nowrap;
  transform: translate(-50%,-50%);
  background-image: linear-gradient(90deg, rgba(243, 196, 170, 1), rgba(228, 81, 154, 1) 50%, rgba(77, 84, 224, 1));
  overflow: hidden;
}
.c-foot__itemText::after {
  transform: scale(1, 1);
  transform-origin: right top;
  transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background-color: #fff;
  z-index: -1;
}
.c-foot__listItem::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  border: solid 1px #fff;
  top: 12px;
  left: 10px;
}
.c-foot__listItem:hover {
  color: #fff;
  transition-delay: .1s;
}
.c-foot__itemText:hover::after {
  transform: scale(0, 1);
}
.c-foot__listItem:hover::before {
  animation: hover 0.2s ease-in-out forwards;
}

@keyframes hover {
  0%{
    transform: rotate(3deg);
  }
  100%{
    transform: rotate(0deg);
  }
}
.c-foot__listItem:first-child {
  margin-left: 0;
}

/* ----- c-right c-list ----- */
.c-right {
  text-align: right;
  padding: 0 100px;
}
.c-right__title {
  font-size: 7.7vw;
  color: #00DCEF;
  font-family: "Hiragino Sans","ヒラギノ角ゴシック";
  font-weight: 800;
}
.c-right__text {
  font-size: 1.8vw;
  font-weight: bold;
}
.c-left {
  text-align: left;
  padding: 0 100px;
}
.c-left__title {
  font-size: 7.7vw;
  color: #FC4D90;
  font-family: "Hiragino Sans","ヒラギノ角ゴシック";
  font-weight: 800;
}
.c-left__text {
  font-size: 1.8vw;
  font-weight: bold;
}
.p-member .c-left__text {
  color: #fff;
}
.p-member .c-left {
  padding-top: 10%;
}
.p-member .c-left__title {
  color: #00DCEF;
}
.p-flow .c-right__title {
  color: #FC4D90;
}
.p-question .c-left__title {
  color: #00DCEF;
}
@media screen and (max-width:1280px) {
  .c-left__title , .c-right__title {
    font-size: 8.5vw;
  }
}
@media screen and (max-width:990px) {
  .c-left__title , .c-right__title {
    font-size: 10vw;
  }
}
@media screen and (min-width:796px){
  .c-sp,.c-sp {
    display: none;
  }
}
@media screen and (max-width:795px) {
  .c-pc {
    display: none;
  }
  .c-title {
    font-size: 3.5vw;
    line-height: 6vw;
  }
  .c-text {
    font-size: 4vw;
  }
  .c-text__second {
    font-size: 3vw;
  }
  .c-box:first-child {
    width: 38.4%;
  }
  .c-text__third {
    font-size: 4.5vw;
  }
  .c-box:last-child {
    width: 87.5%;
  }
  .c-text__first {
    font-size: 3.5vw;
  }
  .c-right__text,.c-left__text {
    text-align: center;
    font-size: 3.4vw;
  }
  .p-member .c-left__text {
    color: #000;
  }
  .c-left__title , .c-right__title {
    text-align: center;
  }
  .c-left ,.c-right {
    padding: 0 20px;
  }
  .c-ck__box {
    padding: 0 20px;
    text-align: center;
  }
  .c-ck__itemCK {
    width: 40%;
    opacity: 0;
    transform: translateY(20px);
  }
  .c-ck__itemBox {
    width: 100%;
    opacity: 0;
    transform: translateY(20px);
  }
  .c-foot {
    padding: 21.5% 0 12%;
    margin-right: 20px;
    margin-left: 20px;
  }
  .c-foot__headText {
    font-size: 3vw;
    text-align: center;
  }
  .c-foot__CK {
    width: 80%;
  }
  .c-foot__CK__Box {
    top: -12%;
  }
  .c-foot__headCK {
    top: -12%;
    width: 80%;
  }
  .c-foot__CK img{
    height: 20vw;
  }
  .c-foot__headCK img{
    height: 20vw;
  }
  .c-foot__boxText {
    font-size: 3.5vw;
    opacity: 0;
    transform: translateY(20px);
  }
  .c-foot__text {
    margin-top: 2%;
    position: static;
    text-align: center;
    font-size: 7vw;
    transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -webkit-transform: rotate(0deg);
    opacity: 0;
  }
  .c-foot__listItem {
    opacity: 1;
  }
  .c-sp_block {
    display: block;
  }
  .c-foot__listItem {
    padding: 0;
    background-color: transparent;
  }
  .c-foot__listItem::before {
    border: none;
  }
  .c-foot__itemText {
    margin: 0 auto;
    width: 70%;
    padding: 3% 8%;
    background-color: #fff;
    position: relative;
    font-size: 3vw;
    top: auto;
    left: auto;
    transform: none;
    white-space: nowrap;
  }
  .c-border {
    position: relative;
    margin-top: 6%;
  }

  .c-border::before {
    position: absolute;
    content: "";
    border: solid 1px #fff;
    width: 70%;
    height: 100%;
    top: 8px;
    left: 16%;
    z-index: -3;
  }
  .c-border::after {
    position: absolute;
    content: "";
    width: 72%;
    height: 120%;
    background-image: linear-gradient(90deg, rgba(243, 196, 170, 1), rgba(228, 81, 154, 1) 50%, rgba(77, 84, 224, 1));
    transform: translateY(-50%);
    top: 57%;
    right: 13.5%;
    z-index: 3;
  }
  .p-strongFuture__sp .c-text__second {
    font-size: 5vw;
  }
  .p-simlation .c-foot {
    margin-top: 35%;
  }
}
@media screen and (max-width:450px) {
  .c-text {
    font-size: 4.3vw;
    letter-spacing: 1px;
    line-height: 7vw;
  }
  .c-text__second {
    font-size: 4.5vw;
  }
  .c-ck__itemBox img{
    height: 23.4vw;
  }
  .p-simlation__topic .c-text__first {
    font-size: 5vw;
  }
  .p-simlation .c-foot {
    margin-top: 25%;
  }
  .p-messageMain .c-text__first {
    font-size: 4.1vw;
    line-height: 8vw;
    white-space: nowrap;
  }
  .p-message .c-foot {
    margin-top: 20%;
  }
  .c-border::after {
    width: 79%;
    left: 11%;
    height: 117%;
    top: 57%;
  }
  .c-border::before {
    width: 73.5%;
    right: 8%;
    height: 102%;
  }
  .c-foot__headText {
    font-size: 3.9vw;
  }
  .c-foot__headCK {
    display: flex;
    justify-content: center;
    font-size: 15px;
    top: -12.5%;
  }
  .c-foot__headCK img {
    width: 283px;
    height: 101px;
  }
  .c-foot__headText
  .c-foot__headCK img{
    width: 284px;
    height: 101px;
  }
  .c-foot__itemText {
    width: 73.9%;
    padding: 5.2% 0;
    font-size: 4.3vw;
  }
  .c-foot__CK {
    display: flex;
    justify-content: center;
    font-size: 15px;
    margin-top: 20px;
  }
  .c-foot__CK img{
    width: 284px;
    height: 101px;
  }
}
@media screen and (max-width:410px) {
  .p-messageMain .c-text__first {
    font-size: 4vw;
  }
}
#loading {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
  z-index: 100;
}
.loaded {
  opacity: 0;
  visibility: hidden;
}
.loader,
.loader:before,
.loader:after {
  border-radius: 50%;
}
.loader {
  color: #00DCEF;
  font-size: 5px;
  text-indent: -99999em;
  margin: 55px auto;
  position: relative;
  width: 10em;
  height: 10em;
  box-shadow: inset 0 0 0 1em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  top: 30%;
}
.loader:before,
.loader:after {
  position: absolute;
  content: '';
}
.loader:before {
  width: 5.9em;
  height: 10.9em;
  background: #fff;
  border-radius: 10.2em 0 0 10.2em;
  top: -0.4em;
  left: -0.3em;
  -webkit-transform-origin: 5.1em 5.1em;
  transform-origin: 5.1em 5.1em;
  -webkit-animation: load2 2s infinite ease 1.5s;
  animation: load2 2s infinite ease 1.5s;
}
.loader:after {
  width: 5.9em;
  height: 10.9em;
  background: #fff;
  border-radius: 0 10.2em 10.2em 0;
  top: -0.1em;
  left: 4.9em;
  -webkit-transform-origin: 0.1em 5.1em;
  transform-origin: 0.1em 5.1em;
  -webkit-animation: load2 2s infinite ease;
  animation: load2 2s infinite ease;
}
@-webkit-keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
