#camp_27_12{
  background-color: #f2f4f4;
}

#camp_27_12 .sp{
  display: block;
}
#camp_27_12 .pc{
  display: none;
}

#camp_27_12 p,
#camp_27_12 li,
#camp_27_12 a,
#camp_27_12 button{
  font-size: clamp(13px,88vw,14px);
  line-height: 1.5;
  font-weight: 700;
}

#camp_27_12 .link{
  color: #0f9ca7;
  text-decoration: underline;
  &:hover{
    color: #fa621b;
  }
}

#camp_27_12 .flex{
  display: flex;
}

#camp_27_12 .red{
  color: #e84a57;
}

#camp_27_12 .blue{
  color: #0f9ca7;
}

#camp_27_12 .radius_hd_red,#camp_27_12 .radius_hd_blue{
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  width: 200px;
  height: 25px;
  border-radius: 13px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 16px;
  padding-top: 2px;
}

#camp_27_12 .point_list li{
  padding-left: 16px;
  margin-bottom: 8px;
  position: relative;
  text-align: left;
  &::before{
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #25bd8a;
    position: absolute;
    left: 0;
    top: 8px;
    z-index: 1;
  }
}

.green{
  color: #25bd8a;
}

.text_green{
  color: #22a877;
}

#camp_27_12 .common_hd{
  font-size: 24px;
  line-height: 1.3;
  text-align: center;
  padding-bottom: 24px;
}

#camp_27_12 .text_margin{
  padding-bottom: 16px;
}

#camp_27_12 .white_block{
  background-color: #fff;
  padding: 24px 16px;
  border-radius: 4px;
}

#camp_27_12 .gray_block{
  background-color: #f2f4f3;
  border-radius: 4px;
  padding: 16px;
}

#camp_27_12 .caution{
  font-size: 12px;
  font-weight: normal;
  line-height: 1.3;
}

#camp_27_12 .scroll_area{
  width: 100%;
  height: 80px;
  background-color: #fff;
  box-shadow: 0px -2px 4px 0 rgba(0,0,0,0.2);
  position: fixed;
  bottom: 0;
  z-index: 1000;
  transition: .2s cubic-bezier(0.76, 0, 0.24, 1);
  .flex{
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
  }
}

#camp_27_12 .common_btn{
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 14px;
  text-align: center;
  width: 250px;
  height: 40px;
  border-radius: 4px;
}

#camp_27_12 .blue_btn{
  background-color: #0f9ca7;
  box-shadow: 3px 3px 0px 0px rgba(12,99,99,1);
  transition:  .6s cubic-bezier(0.76, 0, 0.24, 1);
  &:hover{
    transform: translate(3px,3px);
    box-shadow: none;
  }
}

#camp_27_12 .orange_btn{
  background-color: #fa621b;
  box-shadow: 3px 3px 0px 0px rgba(175,58,18,0.75);
  transition:  .6s cubic-bezier(0.76, 0, 0.24, 1);
  &:hover{
    transform: translate(3px,3px);
    box-shadow: none;
  }
}

#camp_27_12 .mv_wrapper{
  background-color: #25bd8a;
  margin-bottom: 24px;
  position: relative;
  .mv_area{
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0 auto;
    h1{
      .sp{
        height: 100%;
      }
    }
  }
}

#camp_27_12 .about_wrapper{
  padding-bottom: 40px;
  .about_area{
    padding: 0 16px;
    .first_text{
      text-align: center;
      padding: 0 32px 32px;
    }
    .about_inner{
      .white_block{
        .doc_explain{
          background-color: #e4f9ee;
          padding: 16px 8px;
          margin-bottom: 16px;
          h3{
            text-align: center;
            padding-bottom: 24px;
          }
          .flex{
            .img{
              margin-top: 48px;
              margin-right: 8px;
              max-width: 110px;
            }
            .text_block{
              .end_text{
                text-align: right;
              }
            }
          }
        }
        .during{
          .sp_during_block{
            margin-top: 16px;
            .gray_block{
              padding: 8px 0;
              margin-top: 16px;
              p{
                text-align: center;
              }
            }
            .tag{
              margin-top: 40px;
              position: relative;
              &::before{
                content: '';
                display: block;
                width: 130px;
                height: 40px;
                background-image: url('/special/2025/camp_27_12/images/during_tag.svg');
                background-repeat: no-repeat;
                background-size: contain;
                position: absolute;
                top: -24px;
                left: -10px;
                z-index: 1;
                transform: rotate(-6deg);
              }
            }
        }
        }
      }
    }
  }
}

#camp_27_12 .entry_wrapper{
  background-color: #25bd8a;
  background-image: repeating-linear-gradient(-45deg, #2cce90 0 3px,#25bd8a 3px 7px);
  padding: 40px 16px;
  .entry_area{
      .common_hd{
        color: #fff;
        padding-bottom: 24px;
      }
      .white_block{
        position: relative;
        padding: 40px 16px 24px;
        .text{
          padding-bottom: 16px;
        }
        .common_btn{
          margin: 0 auto;
        }
        .anchor_btn{
          margin-top: 16px;
          position: relative;
          &::before{
            content: '';
            display: block;
            width: 20px;
            height: 20px;
            position: absolute;
            bottom: 10px;
            right: 8px;
            background-image: url('/special/2025/camp_27_12/images/anchor_mark.svg');
            background-size: contain;
            background-repeat: no-repeat;
          }
        }
      }
      .white_block:nth-of-type(1){
        margin-bottom: 72px;
        .text{
          text-align: center;
        }
        &::after{
          content: '';
          display: block;
          width: 46px;
          height: 40px;
          border-top: solid 20px #fff;
          border-right: solid 22.5px transparent;
          border-left: solid 22.5px transparent;
          border-bottom: solid 20px transparent;
          position: absolute;
          bottom: -68px;
          left: 0;
          right: 0;
          margin: 0 auto;
        }
      }
      .step_1,.step_2{
        &::before{
          content: '';
          display: block;
          width: 100px;
          height: 24px;
          background-size: contain;
          background-repeat: no-repeat;
          position: absolute;
          left: 0;
          top: 0;
          z-index: 1;
        }
      }
      .step_1{
        &::before{
          background-image: url('/special/2025/camp_27_12/images/step_1.svg');
        }
      }
      .step_2{
        margin-top: 72px;
        &::before{
          background-image: url('/special/2025/camp_27_12/images/step_2.svg');
        }
      }
    }
}

#camp_27_12 .get_wrapper{
  padding: 40px 16px;
  .get_area{
    .common_hd{
      text-align: center;
      padding-bottom: 64px;
      position: relative;
      &::after{
        content: '';
        display: block;
        width: 45px;
        height: 40px;
        border-top: solid 20px #25bd8a;
        border-right: solid 22.5px transparent;
        border-left: solid 22.5px transparent;
        border-bottom: solid 20px transparent;
        position: absolute;
        right: 0;
        left: 0;
        bottom: 2px;
        margin: 0 auto;
      }
    }
    .white_block{
      h3{
        font-size: 18px;
        font-weight: 700;
        line-height: 1.5;
        text-align: center;
        padding-bottom: 8px;
        color: #22a877;
      }
      .text{
        text-align: center;
        padding-bottom: 16px;
      }
      .search_area{
        margin-bottom: 24px;
        h3{
          font-size: 16px;
          text-align: left;
          padding-bottom: 12px;
        }
        .btn_block{
          .flex{
            flex-wrap: wrap;
            gap: 10px 7px;
            a{
              display: inline-block;
              padding: 2px 8px;
              border-radius: 13px;
              color: #fff;
              background-color: #0f9ca7;
              border: 1px solid #0f9ca7;
              text-align: center;
              font-weight: normal;
              font-size: 12px;
            }
          }
        }
      }
      .search_area:nth-last-of-type(1){
        margin-bottom: 0;
      }
    }
    .white_block:nth-of-type(1){
      margin-bottom: 24px;
    }
  }
}

#camp_27_12 .reason_wrapper{
  .reason_area{
    margin: 0;
    padding: 0 32px;
    .flex{
      flex-direction: column;
      gap: 24px;
    }
  }
}

#camp_27_12 .detail_wrapper{
  padding: 40px 16px 80px;
  .detail_area{
    .white_block{
      .detail_block{
        padding-bottom: 32px;
        h3{
          font-size: 16px;
          font-weight: 700;
          padding-bottom: 16px;
          color: #22a877;
          text-align: center;
        }
        p{
          font-weight: normal;
        }
        .contents{
          padding: 24px 0 0;
          h4{
            font-size: 14px;
            text-align: center;
            padding-bottom: 8px;
            span{
              position: relative;
              &::before,&::after{
                content: '';
                display: block;
                width: 40px;
                height: 1px;
                background-color: #2d3636;
                position: absolute;
                bottom: 9px;
              }
              &::before{
                left: -50px;
              }
              &::after{
                right: -50px;
              }
            }
          }
        }
        .point_list{
          li{
            font-weight: normal;
          }
        }
      }
      .detail_block:nth-last-of-type(1){
        padding-bottom: 0;
      }
    }
  }
}

@media screen and (max-width: 768px) {
    .l_siteWrap.bg-trp .l_siteContents {
        padding-top: 0;
    }
}

@media screen and (min-width:769px){

#camp_27_12 .sp{
  display: none;
}
#camp_27_12 .pc{
  display: block;
}

#camp_27_12 p,
#camp_27_12 li,
#camp_27_12 a,
#camp_27_12 button{
  font-size: 16px;
  line-height: 1.5;
}

#camp_27_12 .common_hd{
  font-size: 32px;
}

#camp_27_12 .common_btn{
  width: 250px;
  height: 40px;
}

#camp_27_12 .white_block{
  padding: 32px 24px;
}

#camp_27_12 .contents .contents_inner{
  height: auto;
  overflow: visible;
}

#camp_27_12 .table_block{
  table{
    text-align: center;
    border-collapse: collapse;
    margin: 0 auto;
    tr:nth-of-type(even){
      background-color: #e4f9ee;
    }
    td,th{
      font-weight: bold;
      font-size: 14px;
      width: 205px;
      padding: 14px 0 10px;
    }
    thead{
      tr{
        .during_hd{
          display: flex;
          justify-content: center;
          align-items: center;
          width: 150px;
          height: 36px;
          border-radius: 18px;
          color: #fff;
          background-color: #25bd8a;
          border-radius: 18px;
          margin: 0 auto;
        }
        .industry_hd{
          display: flex;
          justify-content: center;
          align-items: center;
          width: 600px;
          height: 36px;
          border-radius: 18px;
          color: #fff;
          background-color: #00736c;
          border-radius: 18px;
          margin: 0 auto;
        }
      }
    }
    tbody{
      tr{
        td{
          border-right: 1px solid #25bd8a;
        }
        td:first-child{
          text-align: left;
          padding-left: 40px;
        }
        td:last-child{
          border-right: none;
        }
        .tag{
          position: relative;
          &::before{
            content: '';
            display: block;
            width: 112px;
            height: 55px;
            background-image: url('/special/2025/camp_27_12/images/during_tag_pc.svg');
            background-repeat: no-repeat;
            background-size: contain;
            position: absolute;
            top: -10px;
            left: -95px;
            z-index: 1;
          }
        }
      }
    }
  }
}

#camp_27_12 .mv_wrapper{
  background-color: #25bd8a;
  margin-bottom: 24px;
  height: 400px;
  position: relative;
  .mv_area{
    width: 100%;
    height: 100%;
    max-width: 1120px;
    margin: 0 auto;
    background-image: url('/special/2025/camp_27_12/images/mv_radius.svg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    h1{
      img{
        height: 100%;
        padding-top: 24px;
        margin: 0 auto;
        max-width: 670px;
      }
    }
  }
}

#camp_27_12 .about_wrapper{
  .about_area{
    padding: 0;
    max-width: 960px;
    margin: 0 auto;
    .about_inner{
      .white_block{
        text-align: center;
        padding: 32px 32px;
        margin-bottom: 32px;
        .doc_explain{
          padding: 24px 0;
          .flex{
            align-items: center;
            justify-content: center;
            .img{
              margin-top: 0;
              margin-right: 16px;
              width: 100%;
              max-width: 240px;
            }
            .text_block{
              h3{
                text-align: left;
                font-size: 24px;
                padding-bottom: 24px;
              }
               .point_list{
                  li{
                    margin-bottom: 2px;
                  }
               }
            }
          }
        }
      }
    }
  }
}

#camp_27_12 .entry_wrapper{
  padding: 40px 0;
  .entry_area{
    max-width: 960px;
    margin: 0 auto;
      .white_block{
        padding: 40px 0 32px;
        .text{
          text-align: center;
          padding-bottom: 16px;
        }
      }
      .white_block:nth-child(1){
        margin-bottom: 72px;
        .text{
          text-align: center;
        }
        &::after{
          content: '';
          display: block;
          width: 46px;
          height: 40px;
          border-top: solid 20px #fff;
          border-right: solid 22.5px transparent;
          border-left: solid 22.5px transparent;
          border-bottom: solid 20px transparent;
          position: absolute;
          bottom: -68px;
          left: 0;
          right: 0;
          margin: 0 auto;
        }
      }
      .step_1,.step_2{
        &::before{
          content: '';
          display: block;
          width: 100px;
          height: 24px;
          background-size: contain;
          background-repeat: no-repeat;
          position: absolute;
          left: 0;
          top: 0;
          z-index: 1;
        }
      }
      .step_1{
        &::before{
          background-image: url('/special/2025/camp_27_12/images/step_1.svg');
        }
      }
      .step_2{
        margin-top: 72px;
        &::before{
          background-image: url('/special/2025/camp_27_12/images/step_2.svg');
        }
        p{
          text-align: center;
        }
      }
    }
}

#camp_27_12 .get_wrapper{
  padding: 40px 0 80px;
  .get_area{
    max-width: 960px;
    margin: 0 auto;
    .white_block{
      h3{
        font-size: 24px;
      }
      .search_area{
        margin-bottom: 32px;
        h3{
          font-size: 18px;
        }
        .btn_block{
          .flex{
            a{
              font-size: 14px;
              &:hover{
                background-color: #fff;
                color: #0f9ca7;
              }
            }
          }
        }
      }
    }
    .white_block:nth-of-type(1){
      margin-bottom: 24px;
    }
  }
}

#camp_27_12 .reason_wrapper{
  .reason_area{
    max-width: 960px;
    margin: 0 auto;
    .flex{
      flex-direction: unset;
      justify-content: center;
      gap: 0 24px;
      p{
        max-width: 314px;
      }
    }
  }
}

#camp_27_12 .detail_wrapper{
  padding: 80px 0 80px;
  .detail_area{
    max-width: 960px;
    margin: 0 auto;
    .white_block{
      .detail_block{
        padding: 0 180px 32px;
        h3{
          text-align: center;
          font-weight: 700;
          font-size: 18px;
        }
        .link{
          font-size: 14px;
        }
        p{
        text-align: left;
        font-size: 14px;
        }
        .caution{
          font-size: 12px;
        }
        .contents{
          width: 530px;
          padding: 24px 0 0;
          h4{
            text-align: center;
            font-size: 16px;
            padding-bottom: 8px;
            padding-left: 51px;
            span{
              position: relative;
              &::before,&::after{
                content: '';
                display: block;
                width: 40px;
                height: 1px;
                background-color: #2d3636;
                position: absolute;
                bottom: 9px;
              }
              &::before{
                left: -50px;
              }
              &::after{
                right: -50px;
              }
            }
          }
          p{
            text-align: left;
          }
        }
        .point_list{
          li{
            font-size: 14px;
          }
        }
      }
      .detail_block:nth-last-of-type(1){
        padding-bottom: 0;
      }
    }
  }
}

}