@charset "UTF-8";

/* --------------------------------------
	global
-------------------------------------- */

/* hacks */

@media only screen and (min-width: 768px) {
  .sp {
    display: none !important;
  }
}

@media only screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

#kids_m img {
  width: 100%;
  display: block;
  vertical-align: bottom;
  height: auto;
}

#kids_m a img {
  transition: opacity ease 0.3s;
}

#kids_m .ma {
  margin-left: auto;
  margin-right: auto;
}

#kids_m .pr {
  position: relative;
}

#kids_m .pa {
  position: absolute;
}

#kids_m .pf {
  position: fixed;
}

#kids_m .db {
  display: block;
}

#kids_m .di {
  display: inline;
}

#kids_m .dib {
  display: inline-block;
}

#kids_m .dn {
  display: none;
}

#kids_m .df {
  display: flex;
}

#kids_m .fww {
  flex-wrap: wrap;
}

#kids_m .fwnw {
  flex-wrap: nowrap;
}

#kids_m .jcc {
  justify-content: center;
}

#kids_m .jcsb {
  justify-content: space-between;
}

#kids_m .jcfs {
  justify-content: flex-start;
}

#kids_m .jcfe {
  justify-content: flex-end;
}

#kids_m .aic {
  align-items: center;
}

#kids_m .aifs {
  align-items: flex-start;
}

#kids_m .aife {
  align-items: flex-end;
}

#kids_m .oxh {
  overflow-x: hidden;
}

#kids_m .tl {
  text-align: left;
}

#kids_m .tc {
  text-align: center;
}

#kids_m .tr {
  text-align: right;
}

#kids_m .tj {
  text-align: justify;
}

#kids_m .hac {
  left: 50%;
  transform: translateX(-50%);
}

#kids_m .vam {
  top: 50%;
  transform: translateY(-50%);
}

.marugo {
  font-family: dnp-shuei-mgothic-std, "Shuei MaruGo", sans-serif !important;
  font-weight: 400;
}

.bold,
.bold * {
  font-weight: 600 !important;
}

/* layout */

body {
  scrollbar-width: none;
  /*Firefox対応のスクロールバー非表示コード*/
  -ms-overflow-style: none;
  /*Internet Explore対応のスクロールバー非表示コード*/
}

body::-webkit-scrollbar {
  display: none;
  /*Google Chrome、Safari、Microsoft Edge対応のスクロールバー非表示コード*/
}

body {
  background: #f9f5ed;
}

header {
  height: 7rem;
  width: 100%;
  max-width: 750px;
  position: fixed;
  z-index: 999;
  left: calc(50% - 375px);
  top: 0;
  padding: 2.5rem;
  background: rgba(255, 255, 255, 0.75);
}

header h1 {
  margin: 0 auto 0 0;
}

header nav .menu {
  background: #fffdeb;
}

header nav .menu .closeBtn span {
  color: #333;
}

#kids_m {
  max-width: 750px;
  background: #fff;
  box-shadow: 0px 0px 54px 0px rgb(0 0 0 / 30%);
  overflow-x: hidden;
  margin: auto;
}

footer {
  height: unset;
  margin: 0 0 90px;
}

@media screen and (max-width: 767px) {
  header {
    padding: 5vw 0 0 4vw;
  }

  header {
    height: 3.5rem;
    width: 100%;
    left: 0;
    top: 0;
    padding: 1rem;
  }

  header h1 {
    width: 11rem;
    display: block;
  }

  #kids_m {
    box-shadow: none;
    max-width: 100%;
    position: relative;
    overflow: hidden;
  }

  footer {
    height: unset;
    padding-bottom: 0;
    margin: 0 0 12vw;
  }
}

/* ----------------------------------
	decorations
---------------------------------- */

#kids_m .anchor {
  -webkit-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
  -moz-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
  -ms-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
  filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
}

@media screen and (max-width: 767px) {
  #kids_m .anchor {
    -webkit-filter: drop-shadow(10.133vw 0.4vw 0.667vw rgba(0, 0, 0, 0.2));
    -moz-filter: drop-shadow(10.133vw 0.4vw 0.667vw rgba(0, 0, 0, 0.2));
    -ms-filter: drop-shadow(10.133vw 0.4vw 0.667vw rgba(0, 0, 0, 0.2));
    filter: drop-shadow(10.133vw 0.4vw 0.667vw rgba(0, 0, 0, 0.2));
  }
}

/* ----------------------------------
	links
---------------------------------- */

#kids_m .links {
  margin-top: 3em;
}

#kids_m .links div {
  background: url("../img/links/bg.png") center top / 100% repeat-y;
}

#kids_m .links div.branches {
  padding: 0 0 75px;
}

#kids_m .links div.branches ul {
  /* width: 56.533%; */
  margin: 30px auto 0;
}

#kids_m .links div.branches ul li {
  margin: 0 auto 30px;
}

#kids_m .links div.branches ul li:nth-child(1) {
  width: 61.200%;
}

#kids_m .links div.branches ul li:nth-child(2) {
  width: 18.801%;
}

#kids_m .links div.branches ul li:nth-child(3) {
  width: 14.134%;
}

#kids_m .links div.branches ul li:nth-child(4) {
  width: 50.134%;
  margin-bottom: 0;
}

#kids_m .links div.branches ul li a {
  font-size: 32px;
  color: #649ed5;
  text-decoration: underline;
  margin: 0 0 30px;
}

#kids_m .links div.tel {
  padding: 0 0 75px;
}

#kids_m .links div.tel .number {
  width: 65.334%;
  margin: 40px auto 30px;
}

#kids_m .links div.tel .txt {
  font-size: 24px;
}

#kids_m .links div.sns ul:nth-of-type(1) {
  width: 69.6%;
  padding: 40px 0;
  margin: 0 auto;
}

#kids_m .links div.sns ul:nth-of-type(2) {
  width: 50%;
  margin: 0 auto;
}

#kids_m .links div.sns ul:nth-of-type(1) li {
  width: 47.893%;
}

#kids_m .links div.sns ul:nth-of-type(2) li {
  width: 24.268%;
}

#kids_m footer .logo {
  width: 46.668%;
  padding: 50px 0;
  margin: 0 26.5%;
}

#kids_m footer small {
  font-size: 20px;
}

@media screen and (max-width: 750px) {
  #kids_m .links div.branches {
    padding: 0 0 10vw;
  }

  #kids_m .links div.branches ul {
    margin: 4vw auto 0;
  }

  #kids_m .links div.branches ul li {
    margin: 0 auto 4vw;
  }

  #kids_m .links div.branches ul li a {
    font-size: 4.267vw;
    margin: 0 0 4vw;
  }

  #kids_m .links div.tel {
    padding: 0 0 10vw;
  }

  #kids_m .links div.tel .number {
    margin: 5.333vw auto 4vw;
  }

  #kids_m .links div.tel .txt {
    font-size: 3.2vw;
  }

  #kids_m .links div.sns ul:nth-of-type(1) {
    padding: 5.333vw 0;
  }

  #kids_m footer .logo {
    padding: 6.667vw 0;
  }

  #kids_m footer small {
    font-size: 2.667vw;
  }
}

#kids_m .qa .qa_bg {
  background-image: url(../img/qa/bg_qa.png);
  padding: 64px 5%;
}

#kids_m .qa .acc_wrap {
  border: 2px solid #44ace0;
  border-radius: 12px;
  overflow: hidden;
  margin-top: 50px;
}

@media screen and (max-width: 750px) {
  #kids_m .qa .acc_wrap {
    margin-top: 24px;
  }
}

#kids_m .qa .acc::before,
#kids_m .qa .acc::after {
  content: "";
  width: 2%;
  height: 2%;
  background: #ffffff;
  position: absolute;
  right: 5.6%;
  top: 50%;
}

#kids_m .qa .acc::after {
  transition: transform 0.4s 0.1s ease-in-out;
  transform: rotate(90deg);
}

#kids_m .qa .acc.active::after {
  transition: transform 0.4s 0.1s ease-in-out;
  transform: rotate(0deg);
}

/* accordion */
#kids_m .acc-wrap .acc::before,
#kids_m .acc-wrap .acc::after {
  transition: transform 0.5s;
  content: "";
  display: block;
  background: #756c67;
  width: 3%;
  height: 4%;
  position: absolute;
  right: 10%;
  top: 50%;
}

#kids_m .acc-wrap .acc::after {
  transition: transform 0.5s;
  transform: rotate(90deg);
}

#kids_m .acc-wrap .acc.active::after {
  transition: transform 0.5s;
  transform: rotate(0deg);
}

#kids_m .gif {
  position: absolute;
  bottom: -3%;
  left: 24%;
  width: 100%;
}

#kids_m .cv_btn {
  position: absolute;
  bottom: 24%;
  left: 50%;
  transform: translateX(-50%);
  width: 86%;
}

#kids_m .cv_btn01 {
  position: absolute;
  bottom: 6%;
  left: 50%;
  transform: translateX(-50%);
  width: 86%;
}

#kids_m .cv_btn011 {
  position: absolute;
  bottom: 0%;
  left: 50%;
  transform: translateX(-50%);
  width: 86%;
}

#kids_m .video01 {
  position: absolute;
  top: -2%;
  left: 50%;
  transform: translateX(-50%);
  width: 79%;
  height: 102%;
}

#kids_m .video02 {
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
  height: 31.45%;
}

#kids_m .cv_btn02 {
  position: absolute;
  bottom: 24%;
  left: 50%;
  transform: translateX(-50%);
  width: 86%;
}

#kids_m .bnr01 {
  position: fixed;
  z-index: 99;
  bottom: 0;
  left: 0;
  right: 0;
  width: 93.33%;
  max-width: 700px;
  text-align: center;
  margin: 0 auto;
  cursor: pointer;
}

@media screen and (min-width: 751px) {
  #kids_m .bnr01 {
    /* display: none; */
    position: fixed;
    z-index: 99;
    bottom: 0;
    left: 0;
    right: 0;
    width: 450px;
    text-align: center;
    margin: 0 2% 0 auto;
    cursor: pointer;
  }
}

@media screen and (min-width: 1700px) {
  #kids_m .bnr01 {
    margin: 0 auto;
  }

  #kids_m .bnr01 img {
    position: absolute;
    right: -137%;
    bottom: 0;
  }
}

/* ----------------------------------
    slide, slick
---------------------------------- */

div#voice {
  background: #bfeef5;
}

/* #kids_m ul li:first-child{
    margin-bottom: 8%;
} */

#kids_m ul li .insta_wrap {
  width: 630px;
  margin: 0 auto;
  overflow: hidden;
}

#kids_m ul li .insta_wrap .img_wrap {
  margin: 0;
}

.slick-track {
  background: #bfeef5;
}

.vc .slide .slick-prev {
  z-index: 10;
  border-radius: 50%;
  font-size: 0;
  opacity: 0.8;
  width: 66px;
  height: 66px;
  background: url(../img/left_gray.png) center no-repeat;
  background-size: contain;
  left: 0;
  top: 50%;
}

.vc .slide .slick-next {
  z-index: 10;
  border-radius: 50%;
  font-size: 0;
  opacity: 0.8;
  width: 66px;
  height: 66px;
  background: url(../img/right_gray.png) center no-repeat;
  background-size: contain;
  right: 0;
  top: 50%;
}

.blue .slide .slick-prev {
  z-index: 10;
  border-radius: 50%;
  font-size: 0;
  opacity: 0.8;
  width: 66px;
  height: 66px;
  background: url(../img/left_gray.png) center no-repeat;
  background-size: contain;
  left: 10px;
  top: 50%;
}

.blue .slide .slick-next {
  z-index: 10;
  border-radius: 50%;
  font-size: 0;
  opacity: 0.8;
  width: 66px;
  height: 66px;
  background: url(../img/right_gray.png) center no-repeat;
  background-size: contain;
  right: 10px;
  top: 50%;
}

.slide .slick-dots li {
  width: 10px;
  height: 10px;
  margin: 0 10px;
}

.slick-dots li button:before {
  font-size: 20px !important;
}

.slide .slick-prev::before {
  content: "";
  border: 0px;
  transform: rotate(45deg);
  position: absolute;
}

.slide .slick-next::before {
  content: "";
  border: 0px;
  transform: rotate(45deg);
  position: absolute;
}

.slide .slick-slide img {
  display: block;
  margin: auto;
}
.slide .slick-slide video {
  display: block;
  font-size: 0;
  margin: auto;
  aspect-ratio: 1 / 1.25;
  width: 100%;
}

.slick-list {
  overflow: visible;
}

@media screen and (max-width: 767px) {
  #kids_m ul li .insta_wrap {
    width: 84%;
  }

  .voice .slide {
    margin: 0 auto;
  }

  .slide .slick-prev {
    width: 10vw;
    height: 10vw;
    left: -2vw;
    top: calc(50% - 2vw);
  }

  .slide .slick-next {
    width: 10vw;
    height: 10vw;
    right: -2vw;
    top: calc(50% - 2vw);
  }

  .blue .slide .slick-prev {
    width: 10vw;
    height: 10vw;
    left: 0.5vw;
    top: calc(50% - 2vw);
  }

  .blue .slide .slick-next {
    width: 10vw;
    height: 10vw;
    right: 0.5vw;
    top: calc(50% - 2vw);
  }

  .slide .slick-prev::before {
    width: 2.4vw;
    height: 2.4vw;
  }

  .slide .slick-next::before {
    width: 2.4vw;
    height: 2.4vw;
  }

  .slick-slide {
    width: 100vw;
    height: auto;
  }

  .slide .slick-prev::before {
    width: 2.667vw;
    height: 2.667vw;
  }

  .slide .slick-next::before {
    width: 2.667vw;
    height: 2.667vw;
  }
  .instagram-media {
    min-width: auto !important;
    /* position: static !important; */
    width: 70vw !important;
  }
}

.slide-dots {
  margin: 0 auto 0;
  padding: 0;
  text-align: center;
}

.slide-dots li {
  display: inline-block;
  margin: 0 7px;
}

.slide-dots li button {
  position: relative;
  text-indent: -9999px;
}

button {
  background: none;
  border: none;
  outline: none;
  padding: 0 7px;
}

#kids_m .slick-dots {
  bottom: 10px;
}

#kids_m .slide .slick-dots li {
  font-family: "slick";
  font-size: 6px;
  line-height: 10px;
  list-style: none;
  width: 10px;
  height: 10px;
  content: "•";
  text-align: center;
  color: #d3cfc7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0 10px;
}

#kids_m .slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 10px;
  height: 10px;
  padding: 5px;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}
#kids_m .slick-dots li button:before {
  font-family: "slick";
  font-size: 6px;
  line-height: 10px;
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  content: "•";
  text-align: center;
  opacity: 0.4;
  color: #fff;
  font-size: 10px !important;
}

#kids_m .slick-dots li.slick-active button:before {
  opacity: 1;
}

@media screen and (max-width: 767px) {
  .slide-dots {
    margin: 0 auto;
    padding: 0;
    text-align: center;
  }

  .slide-dots li {
    display: inline-block;
    margin: 0 0.4vw;
  }
}

#kids_m .ylw_bg {
  background-color: #fff9d9;
  padding-bottom: 6vw;
}
#kids_m .four {
  width: 97.6%;
}
.coupon,
.trg {
  cursor: pointer;
}
#kids_m .five{
  width: 86.667%;
}
#kids_m .trg::before,
#kids_m .trg::after {
  content: "";
  width: 20px;
  height: 2px;
  display: block;
  border-top: solid 2px #616060;
  position: absolute;
  right: 6%;
  top: 50%;
}
#kids_m .trg::after {
  transition: transform 0.4s;
  transform: rotate(-90deg);
}
#kids_m .trg.active::after {
  transition: transform 0.4s;
  transform: rotate(0deg);
}
#kids_m .six {
  width: 86.667%;
  border-radius: 4vw;
  padding: 12vw 0 8vw;
  margin: 4vw auto 2vw;
}
#kids_m .cv_top {
  margin-top: 4vw;
}
#kids_m .cv_btn {
  bottom: 14.4%;
  width: 80%;
  left: 20%;
  transform: translate(-12.6%, 0);
}