@charset "UTF-8";
/*utf-8を指定------------------------------------------*/
/*============================
mixin
============================*/
/*============================
easing
============================*/
/*color*/
/*breakpoint*/
/*base_width*/
/*size*/
@media screen and (min-width: 768px) {
  body #wrapper {
    overflow: hidden;
  }
  body #wrapper img {
    width: 100%;
  }
  body #wrapper #main {
    width: 390px;
    margin: auto;
    position: relative;
    overflow: hidden;
    background-color: #D7FD52;
  }
  body #wrapper #main #top {
    padding-top: 38px;
    margin-bottom: 80px;
  }
  body #wrapper #main #top .subtitle {
    width: 349px;
    margin: auto;
    margin-top: 46px;
    position: relative;
    z-index: 30;
  }
  body #wrapper #main #top .subtitle .txt_balloon {
    margin-top: 8px;
  }
  body #wrapper #main #top .kv {
    width: 310px;
    margin: auto;
    margin-top: 12px;
    display: block;
  }
  body #wrapper #main #top .component_7 {
    margin-top: 24px;
  }
  body #wrapper #main #top .component_7 .inner {
    margin-top: 0;
  }
  body #wrapper #main #lineup {
    margin-bottom: 60px;
  }
  body #wrapper #main #lineup h2 {
    text-align: center;
    margin-bottom: 20px;
  }
  body #wrapper #main #lineup h2 img {
    height: 52px;
  }
  body #wrapper #main #lineup h2 span {
    margin-top: 27px;
    display: inline-block;
    font-size: 20px;
    font-weight: 700;
    line-height: calc(30 / 20);
  }
  body #wrapper #main #lineup .swiper-border {
    width: 310px;
    height: 310px;
    border: #000 1px solid;
    margin: auto;
    margin-bottom: 46px;
    box-sizing: content-box;
    position: relative;
  }
  body #wrapper #main #lineup .swiper-border .swiper-button-next,
  body #wrapper #main #lineup .swiper-border .swiper-button-prev {
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  body #wrapper #main #lineup .swiper-border .swiper-button-next:after,
  body #wrapper #main #lineup .swiper-border .swiper-button-prev:after {
    content: "";
    background: none;
    width: 0;
    height: 0;
    display: none;
  }
  body #wrapper #main #lineup .swiper-border .swiper-button-next img,
  body #wrapper #main #lineup .swiper-border .swiper-button-prev img {
    width: 100%;
    height: 100%;
  }
  body #wrapper #main #lineup .swiper-border .swiper-button-prev {
    left: -20px;
  }
  body #wrapper #main #lineup .swiper-border .swiper-button-next {
    right: -20px;
    transform: scaleX(-1);
  }
  body #wrapper #main #lineup .swiper {
    width: 310px;
    height: 356px;
    overflow: hidden;
  }
  body #wrapper #main #lineup .swiper-wrapper .swiper-slide img {
    width: 310px;
    height: 310px;
  }
  body #wrapper #main #lineup .swiper-pagination {
    bottom: 24px;
  }
  body #wrapper #main #lineup .swiper-pagination-bullet {
    width: 30px;
    height: 6px;
    border-radius: 0%;
    margin: 0;
    background: #fff;
    border: #000 1px solid;
    border-right: none;
    opacity: 1;
  }
  body #wrapper #main #lineup .swiper-pagination-bullet:last-of-type {
    border-right: #000 1px solid;
  }
  body #wrapper #main #lineup .swiper-pagination-bullet-active {
    background: #000;
  }
  body #wrapper #main #lineup .component_7 {
    margin-bottom: 60px;
  }
  body #wrapper #main #attention h2 {
    background: url(../img_nocomp/attention_title.svg) no-repeat;
    background-size: contain;
    width: 270px;
    height: 57px;
    margin: auto;
    margin-bottom: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
  }
  body #wrapper #main #attention .component_8 {
    padding-top: 40px;
    margin-bottom: 6px;
  }
  body #wrapper #main .component_7 .txt.no-margin {
    padding-top: 0;
  }
  body #wrapper .footer {
    padding-top: 0;
  }
}
/*color*/
/*breakpoint*/
/*base_width*/
/*size*/
@media screen and (max-width: 767px) {
  body #main {
    background-color: #D7FD52;
  }
  body #main #top {
    padding-top: 9.74359vw;
    margin-bottom: 20.51282vw;
  }
  body #main #top .subtitle {
    width: 89.48718vw;
    margin: auto;
    margin-top: 11.79487vw;
    position: relative;
    z-index: 30;
  }
  body #main #top .subtitle .txt_balloon {
    margin-top: 2.05128vw;
  }
  body #main #top .kv {
    width: 79.48718vw;
    margin: auto;
    margin-top: 3.07692vw;
    display: block;
  }
  body #main #top .component_7 {
    margin-top: 6.15385vw;
  }
  body #main #top .component_7 .inner {
    margin-top: 0;
  }
  body #main #lineup {
    margin-bottom: 15.38462vw;
  }
  body #main #lineup h2 {
    text-align: center;
    margin-bottom: 5.12821vw;
  }
  body #main #lineup h2 img {
    height: 13.33333vw;
  }
  body #main #lineup h2 span {
    margin-top: 6.92308vw;
    display: inline-block;
    font-size: 5.12821vw;
    font-weight: 700;
    line-height: calc(30 / 20);
  }
  body #main #lineup .swiper-border {
    width: 79.48718vw;
    height: 79.48718vw;
    border: #000 1px solid;
    margin: auto;
    margin-bottom: 11.79487vw;
    box-sizing: content-box;
    position: relative;
  }
  body #main #lineup .swiper-border .swiper-button-next,
  body #main #lineup .swiper-border .swiper-button-prev {
    width: 3.58974vw;
    height: 3.58974vw;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
  }
  body #main #lineup .swiper-border .swiper-button-next:after,
  body #main #lineup .swiper-border .swiper-button-prev:after {
    content: "";
    background: none;
    width: 0;
    height: 0;
    display: none;
  }
  body #main #lineup .swiper-border .swiper-button-next img,
  body #main #lineup .swiper-border .swiper-button-prev img {
    width: 100%;
    height: 100%;
  }
  body #main #lineup .swiper-border .swiper-button-prev {
    left: -5.12821vw;
  }
  body #main #lineup .swiper-border .swiper-button-next {
    right: -5.12821vw;
    transform: scaleX(-1);
  }
  body #main #lineup .swiper {
    width: 79.48718vw;
    height: 91.28205vw;
    overflow: hidden;
  }
  body #main #lineup .swiper-wrapper .swiper-slide img {
    width: 79.48718vw;
    height: 79.48718vw;
  }
  body #main #lineup .swiper-pagination {
    bottom: 6.15385vw;
  }
  body #main #lineup .swiper-pagination-bullet {
    width: 7.69231vw;
    height: 1.53846vw;
    border-radius: 0%;
    margin: 0;
    background: #fff;
    border: #000 1px solid;
    border-right: none;
    opacity: 1;
  }
  body #main #lineup .swiper-pagination-bullet:last-of-type {
    border-right: #000 1px solid;
  }
  body #main #lineup .swiper-pagination-bullet-active {
    background: #000;
  }
  body #main #lineup .component_7 {
    margin-bottom: 15.38462vw;
  }
  body #main #attention h2 {
    background: url(../img_nocomp/attention_title.svg) no-repeat;
    background-size: contain;
    width: 69.23077vw;
    height: 14.61538vw;
    margin: auto;
    margin-bottom: 8.20513vw;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4.10256vw;
    font-weight: 700;
  }
  body #main #attention .component_8 {
    padding-top: 10.25641vw;
  }
  body #main .component_7 .txt.no-margin {
    padding-top: 0;
  }
  body .footer {
    padding-top: 0;
  }
}

/*# sourceMappingURL=screen.css.map */
