@charset "UTF-8";
/* ----
responsive
---- */
/* ----
変数
---- */
/* ----
base
---- */
html {
  font-size: 62.5%;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  font-size: 1.6rem;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #3B4043;
  line-height: 1.8;
  letter-spacing: 0.05em;
  background-color: #fcfcfc;
  height: 100dvh;
}
@media (min-width: 1024px) {
  body {
    font-size: 1.8rem;
  }
}

main {
  width: 100%;
  overflow-x: hidden;
}

img,
svg {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
  -o-object-fit: contain;
     object-fit: contain;
}

li {
  list-style: none;
}

small {
  font-size: 1.2rem;
}

a {
  cursor: pointer;
}
a:hover {
  opacity: 0.6;
  transition: 0.3s;
}

.sp-br {
  display: block;
}
@media (min-width: 768px) {
  .sp-br {
    display: none;
  }
}

/* ----
loader
---- */
/* ----
header
---- */
header {
  position: fixed;
  width: 100%;
  z-index: 10;
}
header .header {
  display: flex;
  background-color: #F0F3F5;
  padding: 10px 20px 10px;
  justify-content: space-between;
  letter-spacing: 0.02em;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1607843137);
}
@media (min-width: 1024px) {
  header .header {
    padding: 20px 40px;
  }
}
header .header h1 {
  font-family: "Noto Serif JP", serif;
  font-size: 2rem;
  line-height: 1.2;
}
header .header h1 span {
  font-size: 1.4rem;
  font-weight: 500;
}
@media (min-width: 1024px) {
  header .header h1 {
    font-size: 3.7rem;
    line-height: 0.8;
  }
  header .header h1 span {
    font-size: 2rem;
  }
}
header .header .time {
  display: block;
  font-size: 1.2rem;
  line-height: 1.2;
}
header .header .time__reception {
  font-weight: 500;
  margin-bottom: 1px;
}
@media (min-width: 1024px) {
  header .header .time {
    display: none;
  }
}
header .header .cta {
  display: none;
}
header .header .cta .tel {
  color: #1E2F7D;
  font-size: 3.8rem;
  font-weight: 700;
  line-height: 1.2;
  position: relative;
}
header .header .cta .tel span {
  font-size: 1.6rem;
  font-weight: 400;
  letter-spacing: 0.06em;
}
header .header .cta .tel::before {
  content: "";
  display: block;
  background: url(../img/phone-pc.png) no-repeat;
  width: 60px;
  height: 60px;
  background-size: contain;
  position: absolute;
  left: -65px;
  top: -2px;
}
@media (min-width: 1024px) {
  header .header .cta {
    display: flex;
    gap: 40px;
  }
  header .header .cta .tel {
    line-height: 0.7;
    padding-top: 2px;
  }
}
header .header .cta .buttons__mail {
  display: block;
  border-radius: 5px;
  height: 60px;
  width: 190px;
  color: #ffffff;
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.3;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5019607843);
  background-image: linear-gradient(90deg, rgb(255, 193, 77), rgb(224, 157, 31));
  display: flex;
  justify-content: center;
  align-items: center;
}
header .header .cta .buttons__mail:before {
  content: "";
  display: block;
  background-image: url(../img/icon_mail.png);
  width: 37px;
  height: 29px;
  background-size: contain;
  margin-right: 10px;
}

/* ----
h3
---- */
.heading {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 70px;
}

.heading::before,
.heading::after {
  content: "";
  width: 22px;
  height: 22px;
}

.heading::before {
  margin: -50px 0 0 0;
  border-top: 8px solid #B9995B;
  border-left: 8px solid #FFCE72;
}

.heading::after {
  margin: 0 0 -50px 0;
  border-right: 8px solid #FFCE72;
  border-bottom: 8px solid #B9995B;
}

/* ----
buttons
---- */
.buttons {
  display: flex;
  gap: 20px;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  background-color: #F0F3F5;
  width: 100%;
  padding: 12px 20px;
  justify-content: center;
  box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.1607843137);
  position: fixed;
  top: auto;
  bottom: 0;
  left: 0;
  z-index: 10;
}
@media screen and (max-width: 768px) {
  .buttons {
    gap: 15px;
  }
}
.buttons span {
  display: block;
  margin-bottom: 2px;
}
@media (min-width: 1024px) {
  .buttons {
    display: none;
  }
}
.buttons a {
  display: block;
  border-radius: 5px;
  height: 55px;
  width: 160px;
  color: #ffffff;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5019607843);
  padding-top: 8px;
  padding-left: 37px;
  font-size: 1.4rem;
}
@media screen and (max-width: 375px) {
  .buttons a {
    letter-spacing: 0;
  }
}
.buttons .buttons__tel {
  background-image: linear-gradient(-90deg, rgb(30, 47, 125), rgb(65, 83, 165));
  position: relative;
}
.buttons .buttons__tel:before {
  content: "";
  display: block;
  background-image: url(../img/icon_phone.png);
  background-repeat: no-repeat;
  width: 24px;
  height: 37px;
  background-size: contain;
  margin-right: 10px;
  position: absolute;
  top: 8px;
  left: 7px;
}
.buttons .buttons__mail {
  background-image: linear-gradient(90deg, rgb(255, 193, 77), rgb(224, 157, 31));
  position: relative;
}
.buttons .buttons__mail:before {
  content: "";
  display: block;
  background-image: url(../img/icon_mail.png);
  background-repeat: no-repeat;
  width: 28px;
  height: 22px;
  background-size: contain;
  margin-right: 10px;
  position: absolute;
  top: 18px;
  left: 5px;
}

/* ----
MV
---- */
.mv {
  min-height: 462px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: url(../img/mv_ph-sp.png) no-repeat;
  background-size: cover;
  background-position: 40% 20px;
  padding: 50px 10px 10px 10px;
  margin-top: 30px;
}
@media (min-width: 768px) {
  .mv {
    background-image: url(../img/mv_ph-pc.png);
    background-position: 60% 0;
  }
}
@media (min-width: 1024px) {
  .mv {
    height: 840px;
    background-size: cover;
    padding: 168px 40px 40px 40px;
    background-position: right 47% bottom 15%;
  }
}
.mv .wrap h2 {
  max-width: 1350px;
  width: 100%;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .mv .wrap h2 {
    margin: 0 auto 2em;
  }
}
.mv .wrap h2 img {
  display: block;
  margin: 0 auto;
}
.mv .wrap h2 .main-copy {
  display: block;
  width: 870px;
  height: auto;
  margin-top: 0;
  max-width: 100%;
}
@media (min-width: 768px) {
  .mv .wrap h2 .main-copy {
    display: none;
  }
}
.mv .wrap h2 .main-copyPC {
  display: none;
  width: 950px;
  height: auto;
  margin-top: 0;
  max-width: 90%;
}
@media (min-width: 768px) {
  .mv .wrap h2 .main-copyPC {
    display: block;
  }
}
.mv .wrap h2 span {
  font-size: 1.8rem;
  font-weight: 700;
  color: #000;
}
.mv .wrap h2 span::after {
  content: "";
  display: block;
  width: 265px;
  height: 4px;
  border-bottom: 4px solid #FFCE72;
  margin-top: -9px;
}
@media (min-width: 768px) {
  .mv .wrap h2 span {
    font-size: 2.4rem;
  }
  .mv .wrap h2 span::after {
    width: 350px;
    height: 6px;
    border-bottom: 6px solid #FFCE72;
  }
}
@media (min-width: 1024px) {
  .mv .wrap h2 span {
    font-size: 3rem;
  }
  .mv .wrap h2 span::after {
    width: 435px;
    height: 9px;
    border-bottom: 9px solid #FFCE72;
    margin-top: -15px;
  }
}
.mv .wrap h2 img {
  width: 300px;
  margin-top: 1em;
}
@media (min-width: 1024px) {
  .mv .wrap h2 img {
    width: 590px;
    height: 182px;
    margin-top: 25px;
  }
}
.mv .wrap .treatment {
  display: flex;
  justify-content: center;
  gap: 3px;
}
@media (min-width: 768px) {
  .mv .wrap .treatment {
    gap: 20px;
  }
}
.mv .wrap .treatment .modal-pc {
  display: none;
}
.mv .wrap .treatment .modal-sp {
  display: block;
}
@media (min-width: 768px) {
  .mv .wrap .treatment {
    gap: 25px;
  }
  .mv .wrap .treatment .modal-pc {
    display: block;
  }
  .mv .wrap .treatment .modal-sp {
    display: none;
  }
}
.mv .wrap .treatment li {
  width: 160px;
  margin-top: 15px;
}
@media (min-width: 768px) {
  .mv .wrap .treatment li {
    margin-top: 0;
  }
}
.mv .wrap .treatment li a.modal-pc:hover {
  opacity: 1;
}
.mv .wrap .treatment li .modal-pc {
  position: relative;
}
.mv .wrap .treatment li .modal-pc:hover .circleImg:nth-child(2) {
  opacity: 0;
}
.mv .wrap .treatment li .modal-pc:hover .circleImg.-b {
  opacity: 1;
}
.mv .wrap .treatment li .modal-pc .circleImg {
  transition: 0.4s ease-in-out;
}
.mv .wrap .treatment li .modal-pc .circleImg.-b {
  opacity: 0;
}
.mv .wrap .treatment li .modal-pc .circleImg:nth-child(2) {
  position: absolute;
  width: 160px;
  top: 0;
  left: 0;
}
.mv .wrap {
  max-width: 1350px;
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
.mv .wrap img {
  width: 100%;
  max-width: 90%;
}
.mv .wrap img.img-pc {
  width: 60%;
  margin: 2em auto 1em;
}
@media (min-width: 768px) {
  .mv .wrap img.img-pc {
    max-width: 40%;
    width: 280px;
  }
}
@media (min-width: 768px) {
  .mv .wrap img {
    max-width: 600px;
  }
}
.mv .wrap .circleImg {
  margin: -20px auto 150px;
  max-width: 100%;
  width: 100%;
}
@media (min-width: 768px) {
  .mv .wrap .circleImg {
    margin: 0 auto;
  }
}
.mv .wrap .medical {
  font-size: 9.5vw;
  font-weight: 700;
  color: #D87C00;
  line-height: 1;
  text-align: center;
  position: relative;
  z-index: 0;
}
.mv .wrap .medical::before {
  content: "変形性膝関節症治療";
  display: inline;
  -webkit-text-stroke: 4px #ffffff;
  position: absolute;
  z-index: -1;
}
@media (min-width: 1024px) {
  .mv .wrap .medical::before {
    -webkit-text-stroke: 6px #ffffff;
  }
}
@media (min-width: 768px) {
  .mv .wrap .medical {
    font-size: 4.5rem;
    text-align: left;
    margin-top: 0.5em;
    margin-bottom: 0.3em;
  }
}
@media (min-width: 1024px) {
  .mv .wrap .medical {
    font-size: 6.5rem;
  }
}
.mv .wrap .merit {
  display: inline-block;
  background-color: #1E2F7D;
  color: #ffffff;
  font-weight: 500;
  font-size: 1.4rem;
  padding: 2px 10px;
  margin-left: -5px;
  margin-bottom: 5px;
  border-radius: 3px;
  position: relative;
  transform: rotate(-10deg);
}
.mv .wrap .merit::after {
  content: "";
  display: block;
  width: 9px;
  height: 13px;
  background-color: #1E2F7D;
  -webkit-clip-path: polygon(100% 0, 0 0, 100% 100%);
          clip-path: polygon(100% 0, 0 0, 100% 100%);
  position: absolute;
  bottom: -12px;
  left: 35px;
}
@media (min-width: 1024px) {
  .mv .wrap .merit {
    font-size: 2.4rem;
    padding: 0px 10px;
    margin-left: -20px;
    margin-bottom: 0px;
  }
  .mv .wrap .merit::after {
    left: 46px;
  }
}
.mv .wrap .feature {
  width: 98%;
  margin: 0 auto;
}
.mv .wrap .feature.first .img-pc {
  display: none;
  max-width: 100%;
}
@media (min-width: 768px) {
  .mv .wrap .feature.first .img-pc {
    display: block;
  }
}
.mv .wrap .feature.first .img-sp {
  display: block;
  width: 70%;
  margin: 5px auto;
}
@media (min-width: 768px) {
  .mv .wrap .feature.first .img-sp {
    display: none;
  }
}
@media (min-width: 768px) {
  .mv .wrap .feature {
    width: 100%;
  }
}
.mv .wrap .mv__btn {
  display: block;
  width: 500px;
  height: 100px;
  border-radius: 10px;
  color: #ffffff;
  font-size: 3.6rem;
  font-weight: 600;
  background: linear-gradient(#F5C72C 0%, #E57C01 100%);
  margin: 0 auto;
  position: relative;
  padding: 15px 0;
  box-shadow: 0px 9px 0px 0px #C14A00;
}
@media screen and (max-width: 768px) {
  .mv .wrap .mv__btn {
    width: 80%;
    height: auto;
    font-size: 2rem;
    padding: 10px 0 8px;
    box-shadow: 0px 5px 0px 0px #C14A00;
  }
}
@media screen and (max-width: 375px) {
  .mv .wrap .mv__btn {
    font-size: 1.8rem;
    letter-spacing: 0;
  }
}
.mv .wrap .mv__btn span {
  display: inline-block;
  border: 1px solid #ffffff;
  border-radius: 30px;
  padding: 3px 15px 5px;
  font-size: 2rem;
  margin-right: 13px;
  transform: translateY(-6px);
}
@media screen and (max-width: 768px) {
  .mv .wrap .mv__btn span {
    font-size: 1.6rem;
    padding: 1px 7px;
    transform: translateY(-3px);
    margin-right: 5px;
  }
}
.mv .wrap .mv__btn::after {
  content: "";
  display: inline-block;
  width: 35px;
  height: 35px;
  background: url(../img/arrowalt.png);
  position: absolute;
  background-size: contain;
  top: 30px;
  right: 35px;
}
@media screen and (max-width: 768px) {
  .mv .wrap .mv__btn::after {
    width: 20px;
    height: 20px;
    top: 24px;
    right: 20px;
  }
}
@media screen and (max-width: 414px) {
  .mv .wrap .mv__btn::after {
    width: 15px;
    height: 15px;
    top: 26px;
  }
}
@media screen and (max-width: 375px) {
  .mv .wrap .mv__btn::after {
    width: 15px;
    height: 15px;
    top: 24px;
    right: 12px;
  }
}
.mv .wrap .mv__btn:hover {
  opacity: 1;
  box-shadow: 0px 2px 0px 0px #C14A00;
  transform: translateY(8px);
}
@media screen and (max-width: 768px) {
  .mv .wrap .mv__btn:hover {
    box-shadow: 0px 2px 0px 0px #C14A00;
    transform: translateY(3px);
  }
}
.mv .wrap .mv__notes {
  font-size: 1.4rem;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .mv .wrap .mv__notes {
    margin-top: 30px;
  }
}
.mv .wrap .mv__notes br {
  display: block;
}
@media (min-width: 768px) {
  .mv .wrap .mv__notes br {
    display: none;
  }
}

.lity .lity-container .lity-content img {
  width: 77.3%;
  min-width: 320px;
  max-width: 645px;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .lity .lity-container .lity-content img {
    width: 700px;
  }
}

/* ----
worries(悩み)
---- */
.worries {
  background: url(../img/worries_ph.jpg) no-repeat;
  background-size: cover;
  background-position: 90% 0;
  text-align: center;
  padding-left: 20px;
  padding-right: 20px;
  color: #ffffff;
  font-weight: 700;
  -webkit-clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0);
          clip-path: polygon(100% 0, 100% 90%, 50% 100%, 0 90%, 0 0);
}
@media (min-width: 1024px) {
  .worries {
    background-position: right top;
  }
}
.worries h3 {
  font-size: 1.8rem;
  padding-top: 1.5em;
  padding-bottom: 1.5em;
}
.worries h3 span {
  font-size: 2.2rem;
}
@media (min-width: 768px) {
  .worries h3 {
    font-size: 2.2rem;
  }
  .worries h3 span {
    font-size: 3.5rem;
  }
}
@media (min-width: 1024px) {
  .worries h3 {
    font-size: 3.5rem;
  }
  .worries h3 span {
    font-size: 5rem;
  }
}
.worries .worries_box {
  margin: auto;
  max-width: 800px;
  padding-bottom: 60px;
}
.worries h4 {
  color: #FFCE72;
  font-weight: bold;
  position: relative;
  text-align: left;
  padding-left: 2em;
  font-size: 2.2rem;
}
.worries h4::before {
  content: "";
  width: 1.5em;
  height: 1.5em;
  background: url(../img/icon_worries.svg) no-repeat;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0;
}
.worries .trouble {
  width: -moz-fit-content;
  width: fit-content;
  text-align: left;
  margin-left: 2em;
  padding-bottom: 1em;
  font-weight: 700;
}
.worries .trouble li {
  margin-top: 10px;
  text-shadow: #1E2F7D 1px 0 5px;
  text-indent: -1em;
  padding-left: 1em;
}
.worries .trouble li::before {
  content: "・";
  display: inline;
}
.worries .trouble .trouble__txt {
  padding-left: 1em;
  display: none;
}
.worries .trouble .trouble__txt.-sp {
  display: block;
  max-width: 500px;
  min-width: 280px;
  width: 80%;
  padding-top: 5px;
}
@media (min-width: 768px) {
  .worries .trouble .trouble__txt {
    display: inherit;
  }
  .worries .trouble .trouble__txt.-sp {
    display: none;
  }
}
@media (min-width: 1024px) {
  .worries .trouble {
    margin-left: 2em;
  }
  .worries .trouble li {
    font-size: 2rem;
    margin-top: 3px;
    letter-spacing: 0.07em;
  }
}
@media (min-width: 1024px) {
  .worries {
    background-position: right top;
  }
  .worries h4 {
    font-size: 3rem;
  }
}

/* ----
solution(解決)
---- */
.solution {
  background-image: url(../img/solution_ph.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center bottom;
  margin-top: -70px;
  padding-top: 90px;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  position: relative;
  z-index: -2;
}
.solution::after {
  content: "";
  display: block;
  width: 100%;
  height: 100px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.solution h3 {
  text-align: center;
}
.solution h3 img {
  width: 100%;
}
.solution h3 img.img-sp {
  max-width: 400px;
}
.solution h3 img.img-pc {
  display: none;
}
@media (min-width: 1024px) {
  .solution h3 img.img-sp {
    display: none;
  }
  .solution h3 img.img-pc {
    display: block;
    max-width: 958px;
    margin: 0 auto;
  }
}
.solution .wrap {
  position: relative;
  z-index: 1;
  margin-top: 2em;
  padding-bottom: 300px;
}
.solution .wrap .img-sp {
  display: block;
  width: 90%;
  max-width: 500px;
  margin: 0 auto;
}
@media (min-width: 1024px) {
  .solution .wrap .img-sp {
    display: none;
  }
}
.solution .wrap .img-pc {
  display: none;
}
@media (min-width: 1024px) {
  .solution .wrap .img-pc {
    display: block;
    width: 511px;
    margin: 0 0 0 auto;
  }
}
@media (min-width: 1024px) {
  .solution .wrap {
    margin: 3em auto;
    max-width: 1350px;
    padding-bottom: 0;
  }
}
@media screen and (min-width: 545px) {
  .solution {
    background-size: 100%;
    background-position: center bottom;
  }
}
@media (min-width: 1024px) {
  .solution {
    background-image: url(../img/solution_ph-pc.jpg);
    background-position: center bottom 35%;
  }
}
@media screen and (min-width: 1400px) {
  .solution {
    background-position: center bottom 35%;
  }
}
@media screen and (min-width: 2400px) {
  .solution {
    background-position: center bottom 40%;
  }
}

/* ----
thoughts(感想)
---- */
.thoughts {
  padding-left: 20px;
  padding-right: 20px;
}
.thoughts h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
}
.thoughts h3 span {
  font-size: 3.2rem;
  color: #D87C00;
  padding-bottom: 5px;
}
.thoughts h3 span.small-title {
  font-size: 1.6rem;
  color: #1E2F7D;
  padding-top: 9px;
}
.thoughts .thoughts_ttl {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  text-align: center;
  margin-bottom: 1em;
  margin-top: 2em;
  position: relative;
  padding-left: 1.5em;
}
.thoughts .thoughts_ttl::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(50% - 8em);
  display: block;
  width: 1.5em;
  height: 1.5em;
  background: url(../img/icon_thoughts.png) no-repeat;
  background-size: contain;
}
.thoughts .wrap article {
  margin: 30px auto 0;
  max-width: 500px;
}
.thoughts .wrap article h4 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #BE7F09;
  padding-bottom: 3px;
}
.thoughts .wrap article .coment {
  margin-top: 10px;
  line-height: 1.5;
}
.thoughts .wrap article .name {
  font-weight: 500;
  margin-top: 8px;
}
.thoughts .disclaimer {
  margin-top: 20px;
  line-height: 1.5;
  text-indent: -1em;
  padding-left: 1em;
}
@media screen and (min-width: 545px) {
  .thoughts .disclaimer {
    max-width: 510px;
    margin: 20px auto 0;
    font-size: 1.4rem;
  }
}
@media screen and (min-width: 545px) and (min-width: 1024px) {
  .thoughts .disclaimer {
    margin: 40px auto 0 0;
    width: -moz-fit-content;
    width: fit-content;
  }
}
@media (min-width: 1024px) {
  .thoughts {
    padding-left: 40px;
    padding-right: 40px;
    max-width: 1140px;
    margin: 0 auto;
  }
  .thoughts h3 {
    font-size: 4.4rem;
  }
  .thoughts h3 span {
    font-size: 6.5rem;
  }
  .thoughts h3 span.small-title {
    font-size: 3.2rem;
  }
  .thoughts .thoughts_ttl {
    font-size: 3.2rem;
    margin-top: 3em;
    position: relative;
  }
  .thoughts .thoughts_ttl::before {
    content: "";
    position: absolute;
    top: 0;
    left: 24%;
    display: block;
    width: 2em;
    height: 2em;
    background: url(../img/icon_thoughts.png) no-repeat;
    background-size: contain;
  }
  .thoughts .wrap {
    display: flex;
    max-width: 1140px;
    margin: 0 auto;
    gap: 40px;
  }
  .thoughts .wrap article {
    width: 33%;
  }
  .thoughts .wrap article h4 {
    display: flex;
    align-items: center;
    font-size: 2.2rem;
    height: 80px;
    line-height: 1.5;
  }
  .thoughts .wrap article img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 353px;
    height: 265px;
  }
}

.caseArea .case_ttl {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  text-align: center;
  margin-bottom: 1em;
  margin-top: 2em;
  padding-left: 1.8em;
  position: relative;
}
.caseArea .case_ttl::before {
  content: "";
  position: absolute;
  top: 5px;
  left: calc(50% - 7em);
  display: block;
  width: 1.5em;
  height: 1.5em;
  background: url(../img/icon_case.png) no-repeat;
  background-size: contain;
}
.caseArea .wrap article h4 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #BE7F09;
  padding-top: 0.5em;
  padding-bottom: 3px;
  line-height: 1.6;
}
.caseArea .wrap article .name {
  margin-top: 0;
}
@media (min-width: 1024px) {
  .caseArea .case_ttl {
    font-size: 3.2rem;
    font-weight: 700;
    color: #1E2F7D;
    text-align: center;
    margin-bottom: 1em;
    margin-top: 3em;
    position: relative;
  }
  .caseArea .case_ttl::before {
    content: "";
    position: absolute;
    top: 0;
    left: 26%;
    display: block;
    width: 2em;
    height: 2em;
    background: url(../img/icon_case.png) no-repeat;
    background-size: contain;
  }
  .caseArea .wrap {
    display: flex;
    max-width: 1140px;
    margin: 0 auto;
    gap: 40px;
  }
  .caseArea .wrap article {
    width: 33%;
  }
  .caseArea .wrap article h4 {
    display: flex;
    align-items: center;
    font-size: 2rem;
    height: auto;
    line-height: 1.5;
    padding-left: 0;
  }
  .caseArea .wrap article img {
    -o-object-fit: cover;
       object-fit: cover;
    width: 353px;
    height: 265px;
  }
}

/* ----
reason(理由)
---- */
.reason {
  padding-left: 20px;
  padding-right: 20px;
}
@media (min-width: 1024px) {
  .reason {
    padding-left: 40px;
    padding-right: 40px;
    max-width: 1140px;
    margin: 0 auto;
  }
}
.reason h3 {
  font-size: 2.2rem;
  font-weight: 700;
  margin-top: 80px;
  color: #1E2F7D;
  vertical-align: baseline;
}
.reason h3 span {
  font-size: 3.2rem;
  color: #D87C00;
  padding-bottom: 5px;
}
.reason h3 span.large-title {
  color: #1E2F7D;
}
.reason h3 span.small-title {
  font-size: 1.6rem;
  color: #1E2F7D;
  padding-top: 9px;
}
.reason .case {
  margin-top: 20px;
}
.reason .case .case--sp {
  display: block;
  max-width: 340px;
  margin: 0 auto;
}
.reason .case .case--pc {
  display: none;
}
@media screen and (min-width: 545px) {
  .reason .case {
    margin: 20px auto;
  }
}
@media (min-width: 1024px) {
  .reason .case {
    background-color: #ffffff;
    width: 800px;
    margin: 40px auto;
  }
  .reason .case .case--sp {
    display: none;
  }
  .reason .case .case--pc {
    display: block;
    width: 800px;
  }
}
@media (min-width: 1024px) {
  .reason {
    padding-left: 40px;
    padding-right: 40px;
  }
  .reason h3 {
    font-size: 4.4rem;
  }
  .reason h3 span {
    font-size: 6.5rem;
  }
  .reason h3 span.small-title {
    font-size: 3.2rem;
  }
}

.lity-close {
  z-index: 9994;
  position: absolute;
  right: 0;
  top: -40px;
}

/* ----
治療実績データachievement
---- */
.achievement {
  padding: 0 20px 80px 20px;
  text-align: center;
}
.achievement h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 100px;
  vertical-align: baseline;
  white-space: nowrap;
}
.achievement h3 span {
  font-size: 3.2rem;
  color: #D87C00;
  padding-bottom: 5px;
}
@media screen and (max-width: 375px) {
  .achievement h3 {
    font-size: 2rem;
  }
}
.achievement p {
  margin-top: 30px;
  color: #1E2F7D;
  font-size: 2rem;
  font-weight: 600;
}
.achievement img {
  max-width: 340px;
  margin: 0 auto;
}
@media screen and (max-width: 375px) {
  .achievement img {
    width: 100%;
  }
}
.achievement .achievement__img-pc {
  display: block;
}
@media screen and (max-width: 1024px) {
  .achievement .achievement__img-pc {
    display: none;
  }
}
.achievement .achievement__img-sp {
  display: none;
}
@media screen and (max-width: 1024px) {
  .achievement .achievement__img-sp {
    display: block;
  }
}
@media (min-width: 1024px) {
  .achievement {
    padding-left: 40px;
    padding-right: 40px;
  }
  .achievement h3 {
    font-size: 4.4rem;
  }
  .achievement h3 span {
    font-size: 6.5rem;
  }
  .achievement h3 span.small-title {
    font-size: 3.2rem;
  }
  .achievement p {
    margin-top: 60px;
    color: #1E2F7D;
    font-size: 3.2rem;
    font-weight: 600;
  }
  .achievement img {
    max-width: 800px;
    margin-top: 1em;
  }
}

/* ----
flow(流れ)
---- */
.flow {
  padding-left: 20px;
  padding-right: 20px;
}
.flow h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 80px;
  vertical-align: baseline;
}
.flow h3 span {
  font-size: 3.2rem;
  color: #D87C00;
  padding-bottom: 5px;
}
.flow h3 span.large-title {
  color: #1E2F7D;
}
.flow h3 span.small-title {
  font-size: 1.6rem;
  color: #1E2F7D;
  padding-top: 9px;
}
.flow .outer {
  margin: 20px auto 0;
  max-width: 300px;
}
.flow .outer:first-of-type {
  margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
  .flow .outer:first-of-type {
    margin-bottom: 20px;
    margin-top: 40px;
  }
}
.flow .outer:first-of-type::after {
  display: none;
}
.flow .outer:last-of-type::after {
  display: none;
}
.flow .outer img {
  width: 335px;
}
.flow .outer img.fllow-txt-sp {
  display: none;
}
@media screen and (max-width: 1024px) {
  .flow .outer img.fllow-txt-sp {
    display: block;
  }
}
.flow .outer img.fllow-txt-pc {
  display: block;
}
@media screen and (max-width: 1024px) {
  .flow .outer img.fllow-txt-pc {
    display: none;
  }
}
.flow .outer .flow--pc {
  display: none;
}
.flow .outer::after {
  content: "";
  display: block;
  width: 150px;
  height: 30px;
  background-color: #EDEDED;
  -webkit-clip-path: polygon(50% 100%, 0 0, 100% 0);
          clip-path: polygon(50% 100%, 0 0, 100% 0);
  margin: 15px auto;
}
@media (min-width: 1024px) {
  .flow {
    padding-left: 40px;
    padding-right: 40px;
  }
  .flow h3 {
    font-size: 4.4rem;
  }
  .flow h3 span {
    font-size: 6.5rem;
  }
  .flow h3 span.small-title {
    font-size: 3.2rem;
  }
  .flow .outer {
    max-width: 800px;
    margin-top: 20px;
  }
  .flow .outer:first-of-type {
    margin-top: 20px;
  }
  .flow .outer img {
    width: 800px;
  }
  .flow .outer .flow--pc {
    display: block;
  }
  .flow .outer .flow--sp {
    display: none;
  }
}

/* ----
cvArea
---- */
.cvArea {
  padding: 80px 20px;
  background-color: #F9F4EB;
}
.cvArea h3 {
  text-align: center;
  font-size: 3.2rem;
  font-weight: 700;
  color: #1E2F7D;
  vertical-align: baseline;
  line-height: 1.4;
  position: relative;
}
.cvArea h3 .small-title {
  font-size: 2.2rem;
}
.cvArea h3 .small-title__mt {
  position: relative;
  top: -0.2em;
}
.cvArea dl {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  width: 80%;
  margin: auto;
}
.cvArea dl dd {
  margin-top: 2em;
}
@media screen and (max-width: 768px) {
  .cvArea dl dd {
    margin-top: 1em;
  }
}
.cvArea dl dd:first-child {
  margin-top: 1em;
}
@media screen and (max-width: 768px) {
  .cvArea dl dd:first-child {
    margin-top: 2em;
  }
}
.cvArea dl dd .buttons__mailCV {
  display: block;
  width: 400px;
  height: 100px;
  border-radius: 10px;
  color: #ffffff;
  font-size: 3rem;
  font-weight: 600;
  background: linear-gradient(#F5C72C 0%, #E57C01 100%);
  margin: 0 auto;
  position: relative;
  padding: 26px 15px;
  box-shadow: 0px 5px 0px 0px #c14a00;
}
@media screen and (max-width: 768px) {
  .cvArea dl dd .buttons__mailCV {
    width: 210px;
    height: auto;
    font-size: 2rem;
    padding: 8px 15px;
  }
}
.cvArea dl dd .buttons__mailCV span {
  display: inline-block;
  border: 1px solid #ffffff;
  border-radius: 30px;
  padding: 3px 15px 5px;
  font-size: 2rem;
  transform: translateY(-6px);
}
@media screen and (max-width: 768px) {
  .cvArea dl dd .buttons__mailCV span {
    display: block;
    font-size: 1.6rem;
    padding: 1px 7px;
    transform: translateY(-3px);
    margin-right: 5px;
    width: -moz-fit-content;
    width: fit-content;
  }
}
.cvArea dl dd .buttons__mailCV::after {
  content: "";
  display: inline-block;
  width: 11px;
  height: 14px;
  background-color: #fff;
  -webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);
          clip-path: polygon(0 0, 0% 100%, 100% 50%);
  position: absolute;
  background-size: contain;
  top: 46px;
  right: 17px;
}
@media screen and (max-width: 768px) {
  .cvArea dl dd .buttons__mailCV::after {
    top: 37px;
  }
}
.cvArea dl dd .buttons__mailCV::before {
  content: "";
  display: inline-block;
  background-color: #fff;
  width: 1px;
  height: 72px;
  position: absolute;
  top: 15px;
  right: 39px;
}
@media screen and (max-width: 768px) {
  .cvArea dl dd .buttons__mailCV::before {
    height: 63px;
    top: 10px;
  }
}
.cvArea dl dd .buttons__mailCV:hover {
  opacity: 1;
  box-shadow: 0px 2px 0px 0px #C14A00;
  transform: translateY(3px);
}
@media (min-width: 1024px) {
  .cvArea h3 {
    margin-bottom: 0.5em;
    font-size: 4.4rem;
  }
  .cvArea h3 .small-title {
    font-size: 3.6rem;
  }
  .cvArea h3 .small-title__mt {
    position: relative;
    top: -0.2em;
  }
  .cvArea dl {
    display: flex;
    flex-direction: row;
    align-items: center;
    max-width: 800px;
    margin: auto;
  }
  .cvArea dl dd {
    margin-top: 0;
  }
  .cvArea dl dd:first-child {
    margin-top: 0;
    margin-right: 3rem;
  }
  .cvArea a[href^="tel:"] {
    pointer-events: none;
  }
}
.cvArea img {
  width: 100%;
}
.cvArea img.cvArea--sp {
  max-width: 400px;
}
.cvArea img.cvArea--pc {
  display: none;
}
@media (min-width: 1024px) {
  .cvArea img.cvArea--sp {
    display: none;
  }
  .cvArea img.cvArea--pc {
    display: block;
    max-width: 958px;
    margin: 0 auto;
  }
}

/* ----
clinic(クリニック紹介)
---- */
.clinic {
  padding-left: 20px;
  padding-right: 20px;
}
.clinic h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 80px;
  vertical-align: baseline;
}
.clinic .outer iframe {
  width: 100%;
  height: auto;
  min-height: 250px;
  margin-top: 20px;
}
@media screen and (min-width: 545px) {
  .clinic .outer iframe {
    display: block;
    min-height: 350px;
    max-width: 500px;
    margin: 20px auto;
  }
}
@media (min-width: 1024px) {
  .clinic .outer iframe {
    min-height: 260px;
    max-width: 550px;
  }
}
.clinic .outer iframe.youtube {
  margin-top: 40px;
}
.clinic .outer .wrap {
  margin-top: 40px;
}
@media screen and (min-width: 545px) {
  .clinic .outer .wrap {
    display: block;
    max-width: 500px;
    margin: 40px auto 0;
  }
}
@media (min-width: 1024px) {
  .clinic .outer .wrap {
    max-width: 550px;
  }
}
.clinic .outer .wrap .name {
  font-size: 2rem;
  font-weight: 700;
}
.clinic .outer .wrap .access {
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.clinic .outer .wrap .access span {
  color: #ffffff;
  font-weight: 500;
  background-color: #B9995B;
  padding: 2px 10px;
  white-space: nowrap;
}
.clinic .outer .wrap .access p {
  margin-top: 10px;
}
@media (min-width: 1024px) {
  .clinic .outer .wrap .access {
    display: flex;
  }
  .clinic .outer .wrap .access p {
    margin-top: 0;
    padding-left: 5px;
  }
}
.clinic .outer .wrap a {
  color: #009FFF;
  border-bottom: 1px solid #009FFF;
  display: none;
}
@media (min-width: 1024px) {
  .clinic .outer {
    display: flex;
    max-width: 1140px;
    margin: 0 auto;
    gap: 40px;
    margin-top: 10px;
  }
}
.clinic .doctor .heading4 {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  font-weight: 500;
  white-space: nowrap;
}
.clinic .doctor .heading4::before {
  margin-right: 10px;
}
.clinic .doctor .heading4::after {
  margin-left: 10px;
}
@media (min-width: 1024px) {
  .clinic .doctor .heading4 {
    font-size: 2.4rem;
  }
}
.clinic .doctor .heading4::before,
.clinic .doctor .heading4::after {
  content: "";
  width: 50%;
  height: 2px;
  background-color: #FFCE72;
}
.clinic .doctor .wrap .profile {
  margin: 20px auto 0;
  text-align: center;
}
.clinic .doctor .wrap .profile img {
  width: 200px;
}
.clinic .doctor .wrap .profile .outer {
  text-align: left;
}
.clinic .doctor .wrap .profile .outer .name {
  width: 200px;
  margin: 0 auto;
}
.clinic .doctor .wrap .profile .outer .name span {
  font-weight: 500;
}
.clinic .doctor .wrap .profile .outer .movie {
  display: block;
  width: 200px;
  margin: 0 auto;
}
.clinic .doctor .wrap .profile .outer .movie span {
  color: #009FFF;
  border-bottom: 1px solid #009FFF;
}
.clinic .doctor .wrap .profile .outer .career {
  margin-top: 20px;
}
@media screen and (min-width: 545px) {
  .clinic .doctor .wrap .profile .outer .career {
    max-width: 500px;
    margin: 20px auto 0;
  }
}
.clinic .doctor .wrap .profile .outer .career p {
  margin-top: 5px;
}
.clinic .doctor .wrap .profile .outer .career span {
  color: #ffffff;
  font-weight: 500;
  background-color: #B9995B;
  padding: 2px 10px;
}
@media (min-width: 1024px) {
  .clinic .doctor .wrap .profile {
    display: flex;
    justify-content: center;
    gap: 40px;
    align-items: flex-start;
  }
  .clinic .doctor .wrap .profile img {
    width: auto;
    height: 410px;
    text-align: right;
    margin-left: 140px;
  }
  .clinic .doctor .wrap .profile .outer {
    display: block;
    width: 400px;
    margin: 0;
  }
  .clinic .doctor .wrap .profile .outer .name {
    width: 100%;
  }
}
@media (min-width: 1024px) {
  .clinic .doctor .wrap {
    margin-top: 40px;
  }
}
@media (min-width: 1024px) {
  .clinic {
    padding-left: 40px;
    padding-right: 40px;
  }
  .clinic h3 {
    font-size: 4.4rem;
  }
  .clinic h3 span {
    font-size: 6.5rem;
  }
  .clinic h3 span.small-title {
    font-size: 3.2rem;
  }
}

/* ----
price(料金一覧)
---- */
.price {
  padding-left: 20px;
  padding-right: 20px;
}
.price h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 80px;
  vertical-align: baseline;
}
.price .outer .wrap {
  margin-top: 40px;
}
@media screen and (min-width: 545px) {
  .price .outer .wrap {
    max-width: 500px;
    margin: 40px auto 0;
  }
}
.price .outer .wrap table {
  margin-top: 5px;
  border-collapse: collapse;
  width: 100%;
  letter-spacing: 0.02em;
  align-items: center;
}
.price .outer .wrap table tr td,
.price .outer .wrap table tr th {
  border: 1px solid #bababa;
  text-align: center;
  vertical-align: middle;
}
.price .outer .wrap table tr th {
  font-weight: 500;
  width: 117px;
  line-height: 1.5;
  padding-top: 5px;
  padding-bottom: 5px;
  background-color: #F0F3F5;
}
.price .outer .wrap table tr th.menu {
  background-color: #DFEAFC;
}
.price .outer .wrap table tr th span {
  font-weight: 400;
  font-size: 1.5rem;
}
.price .outer .wrap table tr th .annotation {
  font-size: 0.8rem;
  vertical-align: top;
}
.price .outer .wrap table tr td {
  padding-top: 5px;
  padding-bottom: 5px;
  width: 110px;
}
.price .outer .wrap .text {
  margin-top: 10px;
}
.price .outer .wrap .text p {
  margin-top: 5px;
  text-indent: -1.5em;
  padding-left: 1.5em;
}
.price .outer .wrap .monitor--sp {
  display: block;
}
@media (min-width: 1024px) {
  .price .outer .wrap .monitor--sp {
    display: none;
  }
}
.price .outer .wrap .monitor--pc {
  display: none;
}
@media (min-width: 1024px) {
  .price .outer .wrap .monitor--pc {
    display: block;
  }
}
.price .outer section .heading4 {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  font-weight: 500;
  white-space: nowrap;
}
.price .outer section .heading4::before {
  margin-right: 10px;
}
.price .outer section .heading4::after {
  margin-left: 10px;
}
.price .outer section .heading4::before,
.price .outer section .heading4::after {
  content: "";
  width: 50%;
  height: 2px;
  background-color: #FFCE72;
}
.price .outer section ul {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.price .outer section ul li {
  font-weight: 500;
  margin-top: 10px;
  text-indent: -1em;
  padding-left: 1em;
}
.price .outer section ul li::before {
  content: "・";
  display: inline;
}
.price .outer section ul li span {
  font-weight: 400;
  font-size: 1.4rem;
}
.price .outer section ul li img {
  display: block;
}
@media screen and (min-width: 545px) {
  .price .outer section ul li img {
    max-width: 500px;
  }
}
.price .outer section p {
  width: -moz-fit-content;
  width: fit-content;
  margin: 15px auto;
}
.price .outer section .monitor {
  margin: 4em auto 0;
  text-align: center;
}
@media (min-width: 1024px) {
  .price .outer section .monitor {
    width: 505px;
    margin-top: 0;
  }
}
.price .outer section .monitor img {
  width: 100%;
}
.price .outer section .monitor img.monitor--sp {
  max-width: 400px;
}
.price .outer section .monitor img.monitor--pc {
  display: none;
}
@media (min-width: 1024px) {
  .price .outer section .monitor img.monitor--sp {
    display: none;
  }
  .price .outer section .monitor img.monitor--pc {
    display: block;
    max-width: 958px;
    margin: 0 auto;
  }
}
@media (min-width: 1024px) {
  .price {
    padding-left: 40px;
    padding-right: 40px;
  }
  .price h3 {
    font-size: 4.4rem;
  }
  .price h3 span {
    font-size: 6.5rem;
  }
  .price h3 span.small-title {
    font-size: 3.2rem;
  }
  .price .outer {
    display: flex;
    justify-content: center;
    align-self: flex-start;
    gap: 40px;
    margin-top: 40px;
  }
  .price .outer .wrap {
    margin: 0;
    width: 500px;
  }
  .price .outer section {
    width: 500px;
    letter-spacing: 0.02em;
  }
  .price .outer section .heading4 {
    margin-top: 0;
    font-size: 2.4rem;
  }
}

/* ----
qa(質問)
---- */
.qa h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 80px;
  vertical-align: baseline;
}
.qa ul li {
  margin: 0 auto 2em;
  width: 90%;
  text-align: center;
}
.qa ul li:first-of-type {
  margin-top: 30px;
}
.qa ul li img {
  width: 100%;
}
.qa ul li img.qa--sp {
  max-width: 400px;
}
.qa ul li img.qa--pc {
  display: none;
}
@media (min-width: 1024px) {
  .qa ul li img.qa--sp {
    display: none;
  }
  .qa ul li img.qa--pc {
    display: block;
    max-width: 958px;
    margin: 0 auto;
  }
}
@media (min-width: 1024px) {
  .qa {
    padding-left: 40px;
    padding-right: 40px;
  }
  .qa h3 {
    font-size: 4.4rem;
  }
  .qa h3 span {
    font-size: 6.5rem;
  }
  .qa h3 span.small-title {
    font-size: 3.2rem;
  }
}

/* ----
contact
---- */
.contact {
  padding-left: 20px;
  padding-right: 20px;
}
.contact h3 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 80px;
  vertical-align: baseline;
}
.contact .heading4 {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.6rem;
  font-weight: 500;
  white-space: nowrap;
}
.contact .heading4::before {
  margin-right: 10px;
}
.contact .heading4::after {
  margin-left: 10px;
}
.contact .heading4::before,
.contact .heading4::after {
  content: "";
  width: 50%;
  height: 2px;
  background-color: #FFCE72;
}
.contact .tel a {
  display: block;
  color: #1E2F7D;
  font-size: 3.2rem;
  font-weight: 700;
  text-align: center;
}
.contact .tel .reception {
  display: flex;
  justify-content: center;
  gap: 10px;
}
.contact .tel p {
  display: inline-block;
}
.contact .tel p:first-of-type {
  font-weight: 500;
}
.contact .tel p.holiday {
  display: block;
  width: 237px;
  font-weight: 500;
  color: #ffffff;
  background-color: #1E2F7D;
  padding: 3px 0;
  text-align: center;
  margin: 5px auto;
}
@media screen and (max-width: 425px) {
  .contact .mail .outer .container {
    width: 335px;
    margin: 0 auto;
  }
  .contact .mail .outer .container form .form-group input,
  .contact .mail .outer .container form .form-group select {
    width: 335px;
    max-width: 335px !important;
  }
  .contact .mail .outer .container form .form-group textarea {
    max-width: 335px !important;
  }
  .contact .mail .outer .container form .form-group input[type=date]::-webkit-calendar-picker-indicator {
    padding-left: 288px;
  }
  .contact .mail .outer .container .privacy {
    width: 335px;
  }
}
.contact .mail .outer form {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.contact .mail .outer form label {
  display: block;
  max-width: 400px;
  margin-top: 30px;
  font-weight: 500;
}
.contact .mail .outer form label[for=name]::after, .contact .mail .outer form label[for=kana]::after, .contact .mail .outer form label[for=age]::after, .contact .mail .outer form label[for=email]::after, .contact .mail .outer form label[for=tel]::after, .contact .mail .outer form label[for=radio]::after {
  content: "必須";
  display: inline-block;
  color: #ffffff;
  background-color: #C74D4D;
  border-radius: 3px;
  text-align: center;
  line-height: 25px;
  width: 50px;
  height: 25px;
  font-size: 1.4rem;
  margin-left: 5px;
}
.contact .mail .outer form label[for=select]::after, .contact .mail .outer form label[for=body]::after {
  content: "任意";
  display: inline-block;
  color: #ffffff;
  background-color: #bababa;
  border-radius: 3px;
  text-align: center;
  line-height: 25px;
  width: 50px;
  height: 25px;
  font-size: 1.4rem;
  margin-left: 5px;
}
.contact .mail .outer form label[for=body] {
  margin-top: 20px;
}
.contact .mail .outer form p.annotation {
  color: #bababa;
  font-size: 1.4rem;
}
.contact .mail .outer form .form-group .form-check {
  margin-top: 10px;
  display: flex;
}
.contact .mail .outer form .form-group .form-check .form-check-input {
  width: 20px;
  height: 20px;
}
.contact .mail .outer form .form-group .form-check label {
  margin-top: 0;
  padding-left: 5px;
}
.contact .mail .outer form .form-group textarea {
  border: 1px solid #3B4043;
  border-radius: 5px;
  padding: 12px 15px;
  width: 400px;
  margin-top: 10px;
}
.contact .mail .outer form .form-group textarea::-moz-placeholder {
  color: #bababa;
  font-size: 1.6rem;
}
.contact .mail .outer form .form-group textarea::placeholder {
  color: #bababa;
  font-size: 1.6rem;
}
.contact .mail .outer form .form-group .countSpanWrapper {
  display: none;
}
.contact .mail .outer form select[name=select1-2] {
  cursor: pointer;
}
.contact .mail .outer form input,
.contact .mail .outer form select {
  display: block;
  font-size: 1.6rem;
  border: 1px solid #3B4043;
  border-radius: 5px;
  padding: 12px 15px;
  margin-top: 3px;
  width: 100%;
}
.contact .mail .outer form input::-moz-placeholder, .contact .mail .outer form select::-moz-placeholder {
  font-size: 1.6rem;
  color: #bababa;
}
.contact .mail .outer form input::placeholder,
.contact .mail .outer form select::placeholder {
  font-size: 1.6rem;
  color: #bababa;
}
.contact .mail .outer form input[type=date],
.contact .mail .outer form select {
  color: #3B4043;
  margin-top: 10px;
  height: 51px;
  background-color: transparent;
}
.contact .mail .outer form input[type=date]::-moz-placeholder {
  color: #bababa;
}
.contact .mail .outer form input[type=date]::placeholder {
  color: #bababa;
}
.contact .mail .outer form .calendar_box p {
  color: #C74D4D;
  font-size: 1.4rem;
  line-height: 1.5;
  margin-bottom: 10px;
}
@media (min-width: 1024px) {
  .contact .mail .outer form .calendar_box p {
    font-size: 1.5rem;
  }
}
.contact .mail .outer form .select02 {
  max-width: 400px;
  position: relative;
}
.contact .mail .outer form .select02::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-right: 2px solid #3B4043;
  border-bottom: 2px solid #3B4043;
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: 1;
  transform: rotate(45deg);
}
.contact .mail .outer form .select_age {
  max-width: 400px;
  position: relative;
}
.contact .mail .outer form .select_age::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-right: 2px solid #3B4043;
  border-bottom: 2px solid #3B4043;
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: 1;
  transform: rotate(45deg);
}
@media (min-width: 1024px) {
  .contact .mail .outer form .select_age::before {
    top: 29px;
  }
}
.contact .mail .outer form .send {
  display: block;
  border-radius: 5px;
  width: 210px;
  height: 55px;
  color: #ffffff;
  background-image: linear-gradient(90deg, rgb(255, 193, 77), rgb(224, 157, 31));
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5019607843);
  margin: 40px auto 5px;
}
.contact .mail .outer form .send:disabled {
  background: #bababa;
}
.contact .mail .outer form .checkbox-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 30px;
}
.contact .mail .outer form .checkbox-wrap input {
  width: 20px;
  height: 20px;
}
.contact .mail .outer form .checkbox-wrap label {
  margin: 0;
  padding-left: 5px;
}
.contact .mail .outer form input[type=date]::-webkit-calendar-picker-indicator {
  width: 400px;
  cursor: pointer;
  position: absolute;
  padding-left: 352px;
  padding-right: 0;
  width: 20px;
}
@media (min-width: 1024px) {
  .contact .mail .outer form input[type=date]::-webkit-calendar-picker-indicator {
    width: 540px;
    padding-left: 492px;
  }
}
.contact .mail .outer form .privacy {
  padding: 5px 10px 10px 10px;
  margin: 30px 0 0 0;
  font-size: 1.4rem;
  max-width: 400px;
  height: 150px;
  border: 1px solid #3B4043;
  overflow-y: scroll;
  background-color: #F0F3F5;
}
.contact .mail .outer form .privacy p {
  font-weight: 500;
  margin-top: 10px;
  margin-bottom: 5px;
  border-bottom: 1px solid #bababa;
  width: -moz-fit-content;
  width: fit-content;
}
.contact .mail .outer form .privacy::-webkit-scrollbar {
  width: 10px;
}
.contact .mail .outer form .privacy::-webkit-scrollbar-track {
  border-radius: 5px;
  background: #dfdfdf;
}
.contact .mail .outer form .privacy::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background: #bababa;
}
@media (min-width: 1024px) {
  .contact {
    padding-left: 40px;
    padding-right: 40px;
  }
  .contact h3 {
    font-size: 4.4rem;
  }
  .contact h3 span {
    font-size: 6.5rem;
  }
  .contact h3 span.small-title {
    font-size: 3.2rem;
  }
  .contact .heading4 {
    font-size: 2.4rem;
  }
  .contact .tel a {
    font-size: 4.6rem;
    margin-top: 10px;
  }
  .contact .tel .reception {
    font-size: 2.2rem;
  }
  .contact .tel p.holiday {
    font-size: 2.2rem;
    width: 325px;
    margin-top: 10px;
  }
  .contact .outer .container form label {
    max-width: 260px;
    width: 260px;
    margin-top: 10px;
  }
  .contact .outer .container form .form-group {
    display: flex;
    position: relative;
    margin-top: 40px;
  }
  .contact .outer .container form .form-group input[type=text],
  .contact .outer .container form .form-group input[type=email],
  .contact .outer .container form .form-group input[type=tel],
  .contact .outer .container form .form-group input[type=date],
  .contact .outer .container form .form-group .select02,
  .contact .outer .container form .form-group .select_age,
  .contact .outer .container form .form-group textarea {
    max-width: 540px !important;
    width: 540px;
  }
  .contact .outer .container form .form-group .select02 {
    margin-top: 10px;
  }
  .contact .outer .container form .form-group .select02 select {
    max-width: 540px;
  }
  .contact .outer .container form .form-group .select_age select {
    max-width: 540px;
  }
  .contact .outer .container form .form-group .annotation {
    position: absolute;
    top: 42px;
  }
  .contact .outer .container form .form-group .form-check .form-check-input {
    margin-top: 8px;
  }
  .contact .outer .container form .form-group span.required,
  .contact .outer .container form .form-group span.pattern {
    position: absolute;
    top: 55px;
    left: 260px;
    font-size: 1.6rem;
  }
  .contact .outer .container form .privacy {
    max-width: 540px;
    height: 250px;
    margin: 20px 0 0 260px;
  }
  .contact .outer .container form .checkbox-wrap {
    margin-left: 260px;
    justify-content: unset;
  }
  .contact .outer .container form .checkbox-wrap label {
    width: -moz-fit-content;
    width: fit-content;
    max-width: 300px;
    margin-top: -2px;
  }
}

/* ----
footer
---- */
footer {
  background-color: #1E2F7D;
  color: #ffffff;
  text-align: center;
  margin-top: 60px;
  padding-bottom: 70px;
}
footer small {
  display: block;
  font-size: 1.2rem;
  padding: 15px 0;
}
@media (min-width: 1024px) {
  footer {
    padding-bottom: 0;
  }
}
footer.contact_footer {
  margin-top: 280px;
  padding-bottom: 0;
}

/* ----
フォーム確認画面
---- */
.confirmation,
.complete {
  background-color: #fcfcfc;
  padding-left: 40px;
  padding-right: 40px;
  text-align: center;
}
.confirmation h2,
.complete h2 {
  font-size: 2.2rem;
  font-weight: 700;
  color: #1E2F7D;
  margin-top: 40px;
  margin-bottom: 20px;
  vertical-align: baseline;
}
.confirmation table,
.complete table {
  text-align: left;
}
.confirmation table tr,
.complete table tr {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
.confirmation table tr:first-of-type,
.complete table tr:first-of-type {
  margin-top: 0;
}
.confirmation table tr th,
.complete table tr th {
  background-color: #DFEAFC;
}
.confirmation table tr td,
.complete table tr td {
  min-height: 45px;
}
.confirmation form.confirm,
.complete form.confirm {
  width: 100%;
  margin: 0 auto;
}
.confirmation .send,
.confirmation .return,
.complete .send,
.complete .return {
  display: block;
  border-radius: 5px;
  width: 210px;
  height: 55px;
  font-size: 1.6rem;
  color: #ffffff;
  background: linear-gradient(90deg, rgb(255, 193, 77), rgb(224, 157, 31));
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5019607843);
  margin: 20px auto;
  border: none;
}
.confirmation .return,
.complete .return {
  background: #bababa;
  margin-bottom: 0;
}

.complete {
  height: calc(100vh - 90px);
}
.complete a.return {
  margin-top: 80px;
  margin-bottom: 80px;
}
.complete + .contact_footer {
  margin-top: 0px;
}/*# sourceMappingURL=style.css.map */