@charset "UTF-8";
.is_sp {
  display: none;
}

@media screen and (max-width: 768px) {
  .is_pc {
    display: none;
  }
  .is_sp {
    display: block;
  }
}
#oshigoto {
  position: relative;
  background-color: #fff;
  background-image: radial-gradient(#d1de35 10%, transparent 20%), radial-gradient(#d1de35 10%, transparent 20%);
  background-size: 20px 20px;
  background-position: 10px 0px, 20px 30px;
  padding-top: clamp(35px, 5vw, 70px);
  padding-bottom: clamp(71px, 7.2857142857vw, 102px);
}

.oshigoto-btn {
  width: clamp(330px, 34.2142857143vw, 479px);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 22vw;
  left: 50%; /*親のleftから50%*/
  transform: translateY(-50%) translateX(-50%); /*子要素自体の大きさを考慮*/
  margin: 0; /*margin:0を入れる*/
}

@media screen and (max-width: 768px) {
  #oshigoto {
    margin-bottom: 30px;
  }
  .oshigoto-btn {
    top: 59vw;
    height: clamp(50px, 13vw, 80px);
    width: clamp(330px, 72vw, 550px);
    font-size: clamp(16px, 4vw, 24px);
  }
}
.line-btn {
  bottom: 31%;
  top: unset;
  transform: unset;
  left: 20.5%;
  width: 273px;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media (min-width: 1600px) and (max-width: 1800px) {
  .line-btn {
    left: 21.5%;
  }
}
@media (min-width: 1800px) {
  .line-btn {
    left: 22.5%;
  }
}
@media (min-width: 769px) and (max-width: 1399px) {
  .line-btn {
    width: clamp(200px, 26vw, 273px);
    height: clamp(30px, 4vw, 50px);
    display: flex;
    justify-content: center;
    align-items: center;
    bottom: clamp(1117px, 145vw, 2014px);
    left: clamp(130px, 17vw, 280px);
  }
}
@media (min-width: 850px) and (max-width: 1100px) {
  .line-btn {
    bottom: clamp(1117px, 144vw, 2014px);
  }
}
@media (min-width: 1100px) and (max-width: 1200px) {
  .line-btn {
    left: 18vw;
    bottom: clamp(1580px, 144vw, 1720px);
  }
}
@media (min-width: 1200px) and (max-width: 1300px) {
  .line-btn {
    left: 19vw;
    bottom: clamp(1725px, 144vw, 1868px);
  }
}
@media (min-width: 1300px) and (max-width: 1400px) {
  .line-btn {
    left: 20vw;
    bottom: clamp(1868px, 144vw, 2014px);
  }
}
@media screen and (max-width: 768px) {
  .line-btn {
    bottom: 29%;
    width: clamp(273px, 72vw, 550px);
    left: 12vw;
    height: clamp(50px, 13vw, 80px);
  }
}
@media screen and (max-width: 400px) {
  #oshigoto {
    padding-top: 80px;
  }
  .dl-btn {
    top: 70vw;
  }
}/*# sourceMappingURL=book.css.map */