@charset "UTF-8";
/*============== ブレイクポイント ==============*/
/*============== 画像ディレクトリパス ==============*/
/* =============================================
Fonts
============================================= */
/* =============================================
カラー
============================================= */
/* =============================================
表示切り替え
============================================= */
@media screen and (max-width: 560px) {
  .sp_none {
    display: none;
  }
}

.pc_none {
  display: none;
}
@media screen and (max-width: 960px) {
  .pc_none {
    display: block;
  }
}
.hp_inlineblock {
  display: block;
}

/* =============================================
レイアウト
============================================= */
.ly_vaccineCont {
  padding: 50px 0;
  font-size: 20px;
  line-height: 1.5;
}
@media screen and (max-width: 960px) {
  .ly_vaccineCont {
    padding: 50px 15px;
    font-size: 18px;
  }
}
@media screen and (max-width: 560px) {
  .ly_vaccineCont {
    font-size: 15px;
  }
}
.ly_vaccineCont a {
  color: #000;
}

.ly_vaccineInner {
  width: 86%;
  max-width: 1162px;
  margin: 0 auto;
}
@media screen and (max-width: 960px) {
  .ly_vaccineInner {
    width: 100%;
  }
}
.ly_vaccineInner.big {
  max-width: 1240px;
}

.ly_center {
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* =============================================
見出し
============================================= */
.el_vaccineTtl {
  height: 85px;
  margin-bottom: 30px;
}
@media screen and (max-width: 560px) {
  .el_vaccineTtl {
    height: auto;
    width: 90%;
  }
}
.el_vaccineTtl img {
  width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.el_vaccineLineTtl {
  margin-bottom: 50px;
  font-size: 30px;
  font-weight: 600;
  letter-spacing: 0.3em;
  padding-bottom: 8px;
  text-align: center;
  border-bottom: 1px solid;
}
@media screen and (max-width: 960px) {
  .el_vaccineLineTtl {
    font-size: 23px;
  }
}
@media screen and (max-width: 560px) {
  .el_vaccineLineTtl {
    font-size: 18px;
    margin-bottom: 30px;
  }
}
.el_vaccineLineTtl.small {
  font-size: 30px;
  display: inline-block;
}
@media screen and (max-width: 960px) {
  .el_vaccineLineTtl.small {
    font-size: 25px;
  }
}
@media screen and (max-width: 560px) {
  .el_vaccineLineTtl.small {
    font-size: 20px;
  }
}
.el_vaccineLineTtl.pink {
  color: #ff7777;
  border-color: #ff7777;
}
.el_vaccineLineTtl.blue {
  color: #45aacc;
  border-color: #45aacc;
}

/* =============================================
個別スタイル
============================================= */
.first-vaccine {
  background-color: #fff;
}

.fv img {
  width: 100%;
}

.schedule {
  background: url("/wp/wp-content/themes/hirose/img/first-vaccine/schedule_back.png") center bottom no-repeat;
  background-size: cover;
}
@media screen and (max-width: 960px) {
  .schedule {
    background-color: #eefbff;
    background-size: contain;
    margin-bottom: 50px;
  }
}
.schedule_figure {
  width: 83%;
  margin-bottom: 50px;
}
@media screen and (max-width: 960px) {
  .schedule_figure {
    width: 100%;
    overflow-x: scroll;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 960px) {
  .schedule_figure img {
    width: 1200px;
    max-width: inherit;
  }
}
.schedule .pc_none {
  width: 100%;
  margin-bottom: 15px;
  text-align: left;
  font-size: 13px;
  color: #8b8b8b;
}
@media screen and (max-width: 960px) {
  .schedule .el_vaccineTtl {
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 560px) {
  .schedule .el_vaccineTtl {
    max-width: 300px;
  }
}
@media screen and (max-width: 960px) {
  .schedule .ly_vaccineCont {
    padding-top: 30px;
  }
}
.items .ly_vaccineInner {
  padding: 50px;
  background: #ffebeb;
  border-radius: 50px;
}
@media screen and (max-width: 960px) {
  .items .ly_vaccineInner {
    border-radius: 30px;
  }
}
@media screen and (max-width: 560px) {
  .items .ly_vaccineInner {
    padding: 50px 15px;
    border-radius: 0;
  }
}
@media screen and (max-width: 560px) {
  .items .ly_vaccineCont {
    padding: 0;
  }
}
.items_cont {
  position: relative;
  border-radius: 50px;
}
@media screen and (max-width: 960px) {
  .items_cont {
    border-radius: 30px;
  }
}
.items_img {
  max-width: 270px;
  position: absolute;
  top: -20px;
  right: -40px;
  z-index: 10;
}
@media screen and (max-width: 960px) {
  .items_img {
    position: relative;
    top: auto;
    right: auto;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 960px) {
  .items_img.pc {
    display: none;
  }
}
.items_img.sp {
  display: none;
}
@media screen and (max-width: 960px) {
  .items_img.sp {
    display: block;
  }
}
.items_list {
  margin-bottom: 5px;
  padding: 30px 20px;
  background-color: #fff;
  border-radius: 50px;
}
@media screen and (max-width: 960px) {
  .items_list {
    border-radius: 30px;
  }
}
.items_list li {
  padding: 10px 0 10px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  position: relative;
  font-size: 25px;
  font-weight: 500;
}
@media screen and (max-width: 960px) {
  .items_list li {
    padding: 5px 0 5px 20px;
    font-size: 18px;
  }
}
@media screen and (max-width: 560px) {
  .items_list li {
    font-size: 16px;
  }
}
.items_list li::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.items_list li a {
  font-size: 20px;
  line-height: 200%;
}
@media screen and (max-width: 960px) {
  .items_list li a {
    font-size: 14px;
  }
}
@media screen and (max-width: 560px) {
  .items_list li a {
    line-height: 1;
  }
}
.items_attention {
  padding: 50px;
  border: 5px solid #ff7777;
  margin-top: 50px;
  background-color: #fff;
}
@media screen and (max-width: 960px) {
  .items_attention {
    padding: 30px;
    margin-top: 0px;
  }
}
@media screen and (max-width: 560px) {
  .items_attention {
    padding: 30px 15px;
    border-width: 3px;
  }
}
.items_attentionCont {
  display: flex;
  flex-direction: column;
  gap: 50px;
}
@media screen and (max-width: 560px) {
  .items_attentionCont {
    gap: 30px;
  }
}
.items_textCont h4 {
  font-weight: 600;
  color: #ff7777;
  font-size: 22px;
  margin-bottom: 15px;
}
@media screen and (max-width: 960px) {
  .items_textCont h4 {
    font-size: 18px;
  }
}
@media screen and (max-width: 560px) {
  .items_textCont h4 {
    font-size: 16px;
  }
}

.flow {
  background: url("/wp/wp-content/themes/hirose/img/first-vaccine/flow_back.png") repeat;
}
.flow .el_vaccineTtl {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 560px) {
  .flow .el_vaccineTtl {
    margin-bottom: 0;
  }
}
.flow_main {
  margin: 0 auto;
  width: 100%;
  max-width: 580px;
  position: relative;
}
@media screen and (max-width: 960px) {
  .flow_main {
    width: 80%;
  }
}
@media screen and (max-width: 560px) {
  .flow_main {
    width: 90%;
  }
}
.flow_img {
  position: absolute;
}
@media screen and (max-width: 960px) {
  .flow_img {
    display: none;
  }
}
.flow_img.img1 {
  width: 191px;
  left: -238px;
  top: -72px;
}
.flow_img.img2 {
  width: 267px;
  left: -336px;
  bottom: -16px;
}
.flow_img.img3 {
  width: 288px;
  right: -312px;
  top: 147px;
}
.flow_bottom {
  background: url("/wp/wp-content/themes/hirose/img/first-vaccine/flow_bottomimg.png") bottom center no-repeat;
  background-size: cover;
  aspect-ratio: 1/0.31;
}

.attention .ly_vaccineCont {
  padding-top: 20px;
}
.attention .ly_vaccineInner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 50px;
}
@media screen and (max-width: 560px) {
  .attention .ly_vaccineInner {
    gap: 0px;
  }
}
.attention_cont {
  display: flex;
  gap: 50px;
}
@media screen and (max-width: 560px) {
  .attention_cont {
    flex-direction: column;
    gap: 15px;
  }
}
.attention_item {
  width: 50%;
  padding: 20px 30px;
  background-color: #ffebeb;
  border-radius: 50px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 960px) {
  .attention_item {
    border-radius: 30px;
  }
}
@media screen and (max-width: 560px) {
  .attention_item {
    width: 100%;
  }
}
.attention_item .grow {
  flex-grow: 1;
  display: flex;
  align-items: center;
}
.attention_icon {
  width: 50px;
  height: 50px;
  margin-bottom: 20px;
  background: url("/wp/wp-content/themes/hirose/img/first-vaccine/icon_attention.png") center center no-repeat;
  background-size: contain;
}
@media screen and (max-width: 560px) {
  .attention_icon {
    width: 40px;
    height: 40px;
  }
}
.attention_txt .marker {
  background: linear-gradient(transparent 40%, #ffc8c8 40%);
}

.qa {
  display: flex;
  flex-direction: column;
  gap: 50px;
  background-image: url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back1.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back2.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back3.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back1.png");
  background-repeat: no-repeat;
  background-position: 2% 1%, 98% 2%, 85% 45%, 10% 90%;
  background-color: #fffeed;
}
@media screen and (max-width: 960px) {
  .qa {
    background-size: 40%, 40%, 40%, 40%;
  }
}
.qa .ly_vaccineCont {
  padding-bottom: 100px;
}
@media screen and (max-width: 960px) {
  .qa .ly_vaccineCont {
    padding-bottom: 50px;
  }
}
.qa .ly_vaccineInner {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.qa_ttl {
  max-width: 390px;
  position: relative;
  margin-bottom: 50px;
}
@media screen and (max-width: 960px) {
  .qa_ttl {
    max-width: 590px;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 560px) {
  .qa_ttl {
    max-width: inherit;
  }
}
.qa_ttl_img {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 960px) {
  .qa_ttl_img {
    display: none;
  }
}
.qa_ttl_img.img1 {
  left: -245px;
  max-width: 240px;
}
.qa_ttl_img.img2 {
  right: -373px;
  max-width: 353px;
}
@media screen and (max-width: 560px) {
  .qa_ttlImg {
    width: 100vw;
  }
}
.qa_listCont {
  margin-bottom: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 960px) {
  .qa_listCont {
    max-width: 600px;
  }
}
@media screen and (max-width: 560px) {
  .qa_listCont {
    width: 100%;
    margin-bottom: 60px;
  }
}
.qa_list {
  display: flex;
  flex-wrap: wrap;
  gap: 50px 30px;
}
@media screen and (max-width: 960px) {
  .qa_list {
    flex-direction: column;
    gap: 30px;
  }
}
@media screen and (max-width: 560px) {
  .qa_list {
    width: 100%;
  }
}
.qa_list li {
  width: calc((100% - 30px) / 2);
}
@media screen and (max-width: 960px) {
  .qa_list li {
    width: 100%;
  }
}
.qa_q {
  padding: 11px 15px 11px 95px;
  min-height: 90px;
  margin-bottom: 26px;
  position: relative;
  background-color: #fff;
  border-radius: 20px;
  border: 3px solid #eb9155;
  font-family: "M PLUS Rounded 1c", sans-serif;
  color: #eb9155;
  font-size: 23px;
  display: flex;
  align-items: center;
  font-weight: 700;
}
@media screen and (max-width: 960px) {
  .qa_q {
    font-size: 20px;
  }
}
@media screen and (max-width: 560px) {
  .qa_q {
    min-height: 63px;
    padding: 11px 8px 11px 60px;
    font-size: 17px;
  }
}
.qa_q::before {
  content: "Q";
  line-height: 60px;
  color: #eb9155;
  font-weight: 600;
  font-size: 35px;
  text-align: center;
  width: 60px;
  height: 60px;
  display: block;
  position: absolute;
  top: 50%;
  left: 15px;
  transform: translateY(-50%);
  background-color: #fff984;
  border-radius: 50%;
}
@media screen and (max-width: 560px) {
  .qa_q::before {
    width: 40px;
    height: 40px;
    font-size: 23px;
    line-height: 40px;
  }
}
.qa_q::after {
  content: "";
  width: 19px;
  height: 20px;
  background: url("/wp/wp-content/themes/hirose/img/first-vaccine/fukidashi.png") center center no-repeat;
  background-size: contain;
  position: absolute;
  bottom: -17px;
  left: 50%;
  transform: translateX(-50%);
}
.qa_end {
  font-size: 23px;
  color: #eb9155;
  text-align: center;
}
@media screen and (max-width: 560px) {
  .qa_end {
    font-size: 18px;
  }
}

.vaccineList {
  background-color: #eefbff;
  display: flex;
  flex-direction: column;
  gap: 30px;
  text-align: center;
}
.vaccineList .ly_vaccineInner {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
@media screen and (max-width: 960px) {
  .vaccineList .ly_vaccineInner {
    gap: 15px;
  }
}
.vaccineList .el_vaccineTtl {
  margin-bottom: 0;
}
.vaccineList_now {
  color: #45aacc;
  font-size: 30px;
  font-weight: 500;
  text-align: center;
}
@media screen and (max-width: 960px) {
  .vaccineList_now {
    font-size: 23px;
  }
}
.vaccineList_item {
  padding: 30px 70px;
  background-color: #fffeed;
  border-radius: 30px;
}
@media screen and (max-width: 560px) {
  .vaccineList_item {
    padding: 30px 15px;
  }
}
.vaccineList_list {
  display: flex;
  flex-wrap: wrap;
  gap: 20px 15px;
  text-align: left;
}
@media screen and (max-width: 560px) {
  .vaccineList_list {
    gap: 9px;
  }
}
.vaccineList_list li {
  padding: 6px 10px;
  background-color: #fff;
  border: 1px solid #ff7777;
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 500;
  border-radius: 10px;
}
@media screen and (max-width: 960px) {
  .vaccineList_list li {
    flex-direction: column;
    align-items: start;
    gap: 0;
    justify-content: center;
  }
}
.vaccineList_list.blue li {
  border-color: #45aacc;
}
.vaccineList_list .small {
  font-size: 16px;
  font-weight: 400;
}
@media screen and (max-width: 560px) {
  .vaccineList_list .small {
    font-size: 12px;
  }
}

.vaccineCare {
  text-align: center;
  background-color: #fffeed;
  background-image: url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back1.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/care_back1.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/care_back2.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back1.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/qa_back1.png");
  background-repeat: no-repeat;
  background-position: -1% 3%, 98% 2%, 5% 75%, 110% 85%, 5% 120%;
}
@media screen and (max-width: 960px) {
  .vaccineCare {
    background-size: 30%, 40%, 20%, 30%, 40%;
  }
}
.vaccineCare .ly_vaccineInner {
  display: flex;
  flex-direction: column;
  gap: 80px;
}
@media screen and (max-width: 560px) {
  .vaccineCare .ly_vaccineInner {
    gap: 50px;
  }
}
.vaccineCare .el_vaccineTtl {
  height: 204px;
  margin-bottom: 0;
}
@media screen and (max-width: 560px) {
  .vaccineCare .el_vaccineTtl {
    height: auto;
  }
}
.vaccineCare .el_vaccineLineTtl {
  letter-spacing: 0.1em;
}
.vaccineCare_link {
  margin-top: 20px;
}

.whyVaccine {
  background-color: #ffebeb;
}
.whyVaccine_ttl {
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 960px) {
  .whyVaccine_ttl {
    flex-direction: column;
    align-items: start;
  }
}
.whyVaccine_ttl h2 {
  max-width: 522px;
}
@media screen and (max-width: 960px) {
  .whyVaccine_ttl h2 {
    max-width: 490px;
  }
}
.whyVaccine_ttlImg {
  width: calc(100% - 522px);
  max-height: 271px;
  aspect-ratio: 2/1;
  background: url("/wp/wp-content/themes/hirose/img/first-vaccine/why_img.png") center center no-repeat;
  background-size: contain;
}
@media screen and (max-width: 960px) {
  .whyVaccine_ttlImg {
    width: 100%;
  }
}
.whyVaccine .el_vaccineTtl {
  height: 195px;
}
@media screen and (max-width: 960px) {
  .whyVaccine .el_vaccineTtl {
    height: auto;
  }
}
@media screen and (max-width: 560px) {
  .whyVaccine .el_vaccineTtl {
    height: auto;
    margin-bottom: 0;
  }
}
.whyVaccine_flow {
  margin-top: 50px;
}
@media screen and (max-width: 560px) {
  .whyVaccine_flow {
    margin-top: 30px;
    width: 64%;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
}

.vaccineFukuhannou {
  padding-top: 50px;
}
@media screen and (max-width: 560px) {
  .vaccineFukuhannou {
    padding-top: 15px;
  }
}
.vaccineFukuhannou .ly_vaccineCont {
  max-width: 1240px;
  border-radius: 50px;
  background-color: #eefbff;
  background-image: url("/wp/wp-content/themes/hirose/img/first-vaccine/fukuhannou_back1.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/fukuhannou_back2.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/fukuhannou_back2.png"), url("/wp/wp-content/themes/hirose/img/first-vaccine/fukuhannou_back3.png");
  background-repeat: no-repeat;
  background-position: 105% -3%, -5% 40%, 110% 75%, -3% 115%;
}
@media screen and (max-width: 960px) {
  .vaccineFukuhannou .ly_vaccineCont {
    border-radius: 0;
    background-size: 30%, 40%, 20%, 30%;
  }
}
.vaccineFukuhannou .ly_vaccineInner {
  display: flex;
  flex-direction: column;
  gap: 50px;
  max-width: inherit;
}
@media screen and (max-width: 560px) {
  .vaccineFukuhannou .ly_vaccineInner {
    gap: 30px;
  }
}
.vaccineFukuhannou_ttl img {
  width: 100%;
  max-width: 765px;
}
.vaccineFukuhannou_list {
  display: flex;
  gap: 20px;
}
@media screen and (max-width: 960px) {
  .vaccineFukuhannou_list {
    width: 80%;
    flex-direction: column;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media screen and (max-width: 560px) {
  .vaccineFukuhannou_list {
    width: 100%;
  }
}
.vaccineFukuhannou_list li {
  width: 29%;
  padding: 30px 15px;
  background-color: #fff;
  border-radius: 30px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media screen and (max-width: 960px) {
  .vaccineFukuhannou_list li {
    width: 100%;
  }
}
.vaccineFukuhannou_list li img {
  width: 200px;
}
@media screen and (max-width: 560px) {
  .vaccineFukuhannou_list li img {
    width: 150px;
  }
}
.vaccineFukuhannou_list li h3 {
  width: 100%;
  padding: 5px 15px;
  font-size: 23px;
}
@media screen and (max-width: 560px) {
  .vaccineFukuhannou_list li h3 {
    font-size: 20px;
  }
}
.vaccineFukuhannou_list_3 {
  min-width: 396px;
  flex-grow: 1.2;
}
@media screen and (max-width: 560px) {
  .vaccineFukuhannou_list_3 {
    min-width: auto;
  }
}
.vaccineFukuhannou_list_ttl {
  text-align: center;
  color: #fff;
  background-color: #4b6daa;
  border-radius: 100px;
}

.vaccineEnd {
  padding: 55px 10px;
  text-align: center;
}
.vaccineEnd p {
  padding-bottom: 10px;
  color: #45aacc;
  border-bottom: 1px solid #45aacc;
  font-size: 27px;
  display: inline-block;
  line-height: 1.5;
}
@media screen and (max-width: 960px) {
  .vaccineEnd p {
    font-size: 23px;
  }
}
@media screen and (max-width: 560px) {
  .vaccineEnd p {
    font-size: 18px;
  }
}/*# sourceMappingURL=first-vaccine.css.map */