@charset "UTF-8";
main {
  font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  overflow: hidden;
}
main .pc {
  display: block;
}
main .sp {
  display: none;
}
@media (max-width: 767px) {
  main .pc {
    display: none;
  }
  main .sp {
    display: block;
  }
}
main * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-height: 0%;
}
main img {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
}

.bg_box img {
  width: 100%;
  height: auto;
  display: block;
}

.bg_box.sp img {
  width: 100%;
}

.cont_area {
  position: relative;
  min-width: 1200px;
  overflow: hidden;
}
@media (max-width: 767px) {
  .cont_area {
    min-width: 1px;
  }
}

.dummy {
  position: fixed;
  z-index: 10;
  width: 100vw;
  height: 100vh;
  left: 0;
  top: 0;
}

main h1 {
  position: absolute;
  width: 430px;
  left: 480px;
  top: 410px;
}
@media (min-width: 1401px) {
  main h1 {
    width: 30.7142857143vw;
    left: 34.2857142857vw;
    top: 29.2857142857vw;
  }
}
@media (max-width: 767px) {
  main h1 {
    width: 76.6666666667vw;
    left: 12.1333333333vw;
    top: 1.0666666667vw;
  }
}

.pin {
  position: absolute;
  width: 40px;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  z-index: 50;
  margin-left: -20px;
  margin-top: -60px;
}
@media (min-width: 1401px) {
  .pin {
    width: 2.8571428571vw;
    margin-left: -1.4285714286vw;
    margin-top: -4.2857142857vw;
  }
}
@media (max-width: 767px) {
  .pin {
    width: 8vw;
    margin-left: -2.1428571429vw;
    margin-top: -6.4285714286vw;
  }
}

#pin-1, #pop-1 {
  left: 670px;
  top: 152px;
}
@media (min-width: 1401px) {
  #pin-1, #pop-1 {
    left: 47.8571428571vw;
    top: 10.8571428571vw;
  }
}
@media (max-width: 767px) {
  #pin-1, #pop-1 {
    left: 10vw;
    top: 42.6666666667vw;
  }
}

#pin-2, #pop-2 {
  left: 410px;
  top: 257px;
}
@media (min-width: 1401px) {
  #pin-2, #pop-2 {
    left: 29.2857142857vw;
    top: 18.3571428571vw;
  }
}
@media (max-width: 767px) {
  #pin-2, #pop-2 {
    left: 83.2vw;
    top: 87.7333333333vw;
  }
}

#pin-3, #pop-3 {
  left: 198px;
  top: 122px;
}
@media (min-width: 1401px) {
  #pin-3, #pop-3 {
    left: 14.1428571429vw;
    top: 8.7142857143vw;
  }
}
@media (max-width: 767px) {
  #pin-3, #pop-3 {
    left: 29.3333333333vw;
    top: 77.3333333333vw;
  }
}

#pin-4, #pop-4 {
  left: 253px;
  top: 497px;
}
@media (min-width: 1401px) {
  #pin-4, #pop-4 {
    left: 18.0714285714vw;
    top: 35.5vw;
  }
}
@media (max-width: 767px) {
  #pin-4, #pop-4 {
    left: 50vw;
    top: 110vw;
  }
}

#pin-5, #pop-5 {
  left: 1133px;
  top: 478px;
}
@media (min-width: 1401px) {
  #pin-5, #pop-5 {
    left: 80.9285714286vw;
    top: 34.1428571429vw;
  }
}
@media (max-width: 767px) {
  #pin-5, #pop-5 {
    left: 73.3333333333vw;
    top: 138.6666666667vw;
  }
}

.pop {
  position: absolute;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  z-index: 100;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  width: 110px;
  margin-left: -55px;
  margin-top: -83px;
}
@media (min-width: 1401px) {
  .pop {
    width: 7.8571428571vw;
    margin-left: -3.9285714286vw;
    margin-top: -5.9285714286vw;
  }
}
@media (max-width: 767px) {
  .pop {
    width: 28vw;
    margin-left: -11.3333333333vw;
    margin-top: -14.6666666667vw;
  }
}
.pop p {
  position: relative;
}
.pop a {
  position: absolute;
  left: 50%;
  bottom: 25px;
  width: 70px;
  margin-left: -35px;
}
@media (min-width: 1401px) {
  .pop a {
    width: 5vw;
    margin-left: -2.5vw;
    bottom: 1.7857142857vw;
  }
}
@media (max-width: 767px) {
  .pop a {
    width: 18.6666666667vw;
    margin-left: -9.3333333333vw;
    bottom: 5.4666666667vw;
  }
}
.pop span {
  position: absolute;
  left: 50%;
  bottom: 25px;
  width: 90px;
  margin-left: -45px;
}
@media (min-width: 1401px) {
  .pop span {
    width: 6.4285714286vw;
    margin-left: -3.2142857143vw;
    bottom: 1.7857142857vw;
  }
}
@media (max-width: 767px) {
  .pop span {
    width: 24vw;
    margin-left: -12vw;
    bottom: 5.4666666667vw;
  }
}

@media (max-width: 767px) {
  #pop-1 {
    width: 28vw;
    margin-left: -6vw;
    margin-top: -14.6666666667vw;
  }
}

#pop-2 {
  width: 224px;
  margin-left: -112px;
  margin-top: -82px;
}
@media (min-width: 1401px) {
  #pop-2 {
    width: 16vw;
    margin-left: -8vw;
    margin-top: -5.8571428571vw;
  }
}
@media (max-width: 767px) {
  #pop-2 {
    width: 28vw;
    margin-left: -14.6666666667vw;
    margin-top: -34vw;
  }
}
#pop-2 .a_01 {
  left: 25%;
}
@media (max-width: 767px) {
  #pop-2 .a_01 {
    left: 50%;
    bottom: 23.3333333333vw;
  }
}
#pop-2 .a_02 {
  left: 75%;
}
@media (max-width: 767px) {
  #pop-2 .a_02 {
    left: 50%;
  }
}

#pop-3 {
  width: 110px;
  margin-left: -55px;
  margin-top: -106px;
}
@media (min-width: 1401px) {
  #pop-3 {
    width: 7.8571428571vw;
    margin-left: -3.9285714286vw;
    margin-top: -7.5714285714vw;
  }
}
@media (max-width: 767px) {
  #pop-3 {
    width: 28vw;
    margin-left: -11.3333333333vw;
    margin-top: -20vw;
  }
}

#pop-4 {
  width: 110px;
  margin-left: -55px;
  margin-top: -106px;
}
@media (min-width: 1401px) {
  #pop-4 {
    width: 7.8571428571vw;
    margin-left: -3.9285714286vw;
    margin-top: -7.5714285714vw;
  }
}
@media (max-width: 767px) {
  #pop-4 {
    width: 28vw;
    margin-left: -11.3333333333vw;
    margin-top: -20vw;
  }
}

.pin img {
  -webkit-animation-name: bounce;
          animation-name: bounce;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-transform-origin: center bottom;
          transform-origin: center bottom;
}

@-webkit-keyframes bounce {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  7.5% {
    -webkit-transform: scale(0.9, 0.9) translate(0%, 5%);
            transform: scale(0.9, 0.9) translate(0%, 5%);
  }
  15% {
    -webkit-transform: scale(1.3, 0.8) translate(0%, 10%);
            transform: scale(1.3, 0.8) translate(0%, 10%);
  }
  25% {
    -webkit-transform: scale(0.8, 1.3) translate(0%, -10%);
            transform: scale(0.8, 1.3) translate(0%, -10%);
  }
  35% {
    -webkit-transform: scale(1.1, 0.9) translate(0%, 5%);
            transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  50% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  100% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}

@keyframes bounce {
  0% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  7.5% {
    -webkit-transform: scale(0.9, 0.9) translate(0%, 5%);
            transform: scale(0.9, 0.9) translate(0%, 5%);
  }
  15% {
    -webkit-transform: scale(1.3, 0.8) translate(0%, 10%);
            transform: scale(1.3, 0.8) translate(0%, 10%);
  }
  25% {
    -webkit-transform: scale(0.8, 1.3) translate(0%, -10%);
            transform: scale(0.8, 1.3) translate(0%, -10%);
  }
  35% {
    -webkit-transform: scale(1.1, 0.9) translate(0%, 5%);
            transform: scale(1.1, 0.9) translate(0%, 5%);
  }
  50% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
  100% {
    -webkit-transform: scale(1, 1) translate(0%, 0%);
            transform: scale(1, 1) translate(0%, 0%);
  }
}
.txt_area {
  margin: 0 auto;
  width: 1200px;
  color: #fff;
}
@media (max-width: 767px) {
  .txt_area {
    width: 100vw;
  }
}
.txt_area h2 {
  width: 100%;
}

.bubble_area {
  background: url(../img/bubble.png) #fff3c3 no-repeat top 30px center;
  background-size: 2032px 1594px;
  padding-bottom: 160px;
}
@media (max-width: 767px) {
  .bubble_area {
    padding-bottom: 20vw;
    background: #fff3c3;
  }
}
.bubble_area .wave {
  background-image: url(../img/wave-1.png);
  background-repeat: repeat-x;
  background-size: contain;
  height: 43px;
}
@media (max-width: 767px) {
  .bubble_area .wave {
    display: none;
  }
}
.bubble_area .kokuban {
  margin: 0 auto;
  width: 1200px;
  position: relative;
}
@media (max-width: 767px) {
  .bubble_area .kokuban {
    width: 100%;
  }
}
.bubble_area .links {
  position: absolute;
  width: 200px;
  left: 920px;
  top: 357px;
}
@media (max-width: 767px) {
  .bubble_area .links {
    width: 18.6666666667vw;
    left: 69.3333333333vw;
    top: 48.6666666667vw;
  }
}
@media (max-width: 767px) {
  .bubble_area .links li {
    margin-bottom: 10.1333333333vw;
  }
}
.bubble_area .bnrs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 1280px;
  margin: 0 auto;
}
@media (max-width: 767px) {
  .bubble_area .bnrs {
    width: 85.3333333333vw;
    display: block;
  }
}
.bubble_area .bnrs a {
  position: relative;
}
.bubble_area .bnrs li {
  margin-bottom: 30px;
}
@media (max-width: 767px) {
  .bubble_area .bnrs li {
    margin-bottom: 6.6666666667vw;
  }
}

.bottom_area {
  background-image: url(../img/common/bottom_pc.png);
  background-repeat: repeat-x;
  background-size: 1920px 322px;
  background-color: none;
  padding: 190px 0 0;
  height: 322px;
  margin-top: -160px;
}
@media (max-width: 767px) {
  .bottom_area {
    background: url(../img/common/bottom_sp.png) no-repeat left top;
    background-size: 100vw 35.8666666667vw;
    height: 35.8666666667vw;
    margin-top: -20vw;
    padding: 22.6666666667vw 0 0;
  }
}
.bottom_area .sns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.bottom_area .sns li {
  margin: 0 15px;
}
@media (max-width: 767px) {
  .bottom_area .sns li {
    margin: 0 2vw;
  }
}/*# sourceMappingURL=an_layout.css.map */