@charset "UTF-8";
@font-face {
  font-family: "NotoSansCJKjp";
  src: url("../font/NotoSansCJKjp.otf") format('opentype'),
  url("../font/NotoSansCJKjp.woff") format('woff'),
  url("../font/NotoSansCJKjp.woff2") format('woff2');
}
body {
  font-weight: 400;
  font-family: "NotoSansCJKjp";
  line-height: 1.4;
  position: relative;
}
ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,p {padding: 0;margin: 0;}
img {width: 100%; vertical-align: middle;border: none;}
li {list-style-type: none;}
a {display: block;}

#loading {
  width: 100%;
  height: 100%;
  background-color: #fff;
  position: fixed;
  left: 0;
  top: 0;
  z-index: 20;
}
#loading img {
  width: 48px;
  height: 48px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -24px;
  margin-top: -24px;
}
#news .news__list li .news__date {text-decoration: underline;}
#news .news__list li .news__txt {text-decoration: underline;}
#topic .topic__box h3 {
  font-family: 'Kosugi Maru', sans-serif;
  color: #ff889f;
}
.totop {
  opacity: 0;
  visibility: hidden;
  position: sticky;
  position: -webkit-sticky; /* Safari */
  bottom: 0;
  z-index: 2;
  transition: all 0.5s;
}
.totop.active{
  opacity: 1;
  visibility: visible;
  bottom: 50px;
}
footer .copyright {
  display: flex;
  justify-content: center;
}

@media (min-width: 750px) {
  body {font-size: 14px;}
  a {transition: all 0.5s;}
  a:hover {opacity: 0.6;}
  .disp-sp {display: none !important;}
  .disp-pc {display: block !important;}

  header {
    width: 100%;
    z-index: 2;
    position: fixed;
    background-color: #fff;
  }

  nav .logo {
    float: left;
    width: 116px;
    margin-top: -10px;
  }
  nav {
    height: 45px;
    padding: 15px 0 0;
  }
  nav .nav__globalnav {float: right;}

  nav ul li {
    float: left;
    text-align: center;
    max-width: 105px;
  }

  nav .nav__list {
    line-height: 1.8;
    float: left;
    padding: 5px 0 0 30px;
  }
  nav .nav__list li {padding-left: 20px;}
  nav .nav__list__item a {opacity: 1;}
  nav .nav__list__item a:hover {
    background: url(../img/menu_line.png) center bottom no-repeat;
    background-size: contain;
  }
  nav .nav__list__item img {vertical-align: top;}
  nav .sns__list {padding-left: 80px; float: right;}
  nav .sns__list li{width: 28px; padding-left: 15px;}

  main {
    padding-top: 70px;
    z-index: 1;
    position: relative;
    background: url(../img/bg_dot.png) center top repeat, url(../img/bg_star.png) center top repeat;
    background-size: 31px, 557px;
    background-color: #ff889f;
  }
  nav.inner {max-width: 1000px;}
  section .inner {max-width: 1000px;}

  .inner {margin: 0 auto; overflow: hidden;}
  .inner__ttl {
    max-width: 395px;
    margin: 0 auto;
    padding: 130px 0 40px;
  }
  #top .contents {
    max-width: 1000px;
    margin: 0 auto;
  }

  .mainarea {padding: 0 15px;}
  .mainarea .top__left {
    float: left;
    padding-right: 1%;
    width: 53%;
  }
  .mainarea .top__left .top__catch {
    max-width: 514px;
    padding: 20px 0 5px;
  }
  .mainarea .top__left h1 {
    max-width: 488px;
    padding: 0 0 0 8px;
  }
  .mainarea .top__left .top__date {
    max-width: 495px;
    padding: 26px 0 23px 8px;
  }
  .mainarea .top__left .top__btn {max-width: 514px;}
  .mainarea .top__right {
    float: right;
    max-width: 424px;
    width: 46%;
  }

  #banners{
    margin-top: 20px;
  }
  #banners .inner{
    width: 100%;
  }
  #banners .inner img{
    width: 100%;
    height: auto;
  }

  #news .news__list {
    background: #fff;
    height: 118px;
    overflow-y: scroll;
    padding: 5px 25px;
  }
  #news .news__list li {
    display: flex;
    border-bottom: 1px solid #000;
    line-height: 2;
    padding: 10px 0;
  }
  #news .news__list li:last-child {border: 0;}
  #news .news__list li .news__date {
    width: 140px;
    color: #ff889f;
    float: left;
  }
  #news .news__list li .news__txt {
    color: #000;
    max-width: 785px;
    float: right;
  }
  #news .news__img__list {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    padding-top: 50px;
    color: #fff;
  }
  #news .news__img__list li {padding: 9px 15px;}
  #news .news__img__list p {
    font-size: 14px;
    padding: 5px;
  }
  #news .news__img__list .slick-list {
    width: 86%;
    margin: 0 auto;
  }
  #news .slick-prev, #news .slick-next {width: 47px;}
  #news .news__movie {
    width: 80%;
    margin: 0 auto;
    padding: 40px 0;
  }
  #news .news__movie .slick-list {
    width: 79%;
    margin: 0 auto;
  }
  #news .news__movie li {padding: 0 15px;}
  #news .news__movie .slick-dots {bottom: 10px;}

  #about .inner__contents p:first-child {
    color: #fff;
    font-size: 21px;
    text-align: center;
    padding-bottom: 35px;
  }
  #about .about__caption {
    background:
            url(../img/about_bg_top.png) top left no-repeat,
            url(../img/about_bg_btm.png) bottom left no-repeat,
            url(../img/caption_bg.png) top left repeat;
    background-size: contain, contain, 295px;
    padding: 20px 28px;
    font-size: 18px;
  }
  #about .about__subttl {
    width: 481px;
    margin: 0 auto;
  }
  #about .about__caption p {padding-top: 20px;}

  #title .title__ttl {
    max-width: 271px;
    padding: 0 0 10px 49px;
  }
  #title .title__subttl {
    max-width: 620px;
    margin: 30px auto;
  }
  #title .title__inner__l {
    float: left;
    max-width: 366px;
    padding: 10px 0 35px 20px;
  }
  #title .title__inner__l .title__img__list .slick-list {
    max-width: 73%;
    margin: 0 auto;
  }
  #title .slick-prev, #title .slick-next {
    max-width: 39px;
    height: 63px;
  }
  #title .title__inner__r {float: right; padding-bottom: 60px;}
  #title .title__inner__r dt {max-width: 583px;}
  #title .title__inner__r dd {
    max-width: 595px;
    padding: 8px 0 0;
    color: #fff;
    font-size: 18px;
  }
  #title .title__inner__r dd .title__btn1 li {float:left; max-width: 288px; padding-top: 15px;}
  #title .title__inner__r dd .title__btn1 li:first-child {padding-right: 15px;}
  #title .title__inner__r dd .title__btn2 {max-width: 570px; padding-top: 15px;}
  #title .title__border{padding-bottom: 35px;}

  #product dl {
    max-width: 780px;
    margin: 0 auto;
    font-size: 22px;
    line-height: 2;
    padding: 40px 50px;
    background: url(../img/product_bg_top.png) center top no-repeat, url(../img/product_bg_btm.png) center bottom no-repeat, url(../img/caption_bg.png) center top repeat;
    background-size: contain, contain, 295px;
  }
  #product dl dt {
    float: left;
    width: 35%;
    border-bottom: 1px solid #a03264;
  }
  #product dl dd {
    width: 100%;
    border-bottom: 1px solid #a03264;
  }
  #product .border__none {border: none;}

  #buy .buy__subttl {
    max-width: 334px;
    margin: 0 auto;
    padding-bottom: 45px;
  }
  #buy .buy__dl__btn {
    display: flex;
    padding: 0 19px 75px;
  }
  #buy .buy__dl__btn li {padding: 15px;}
  #buy .buy__pkg__box, #buy .buy__pkg__store {
    background: url("../img/buy_pkg_bg02_pc.png") center bottom no-repeat, url("../img/buy_pkg_bg01_pc.png") center top repeat;
    background-size: contain, contain;
    padding: 0 48px;
    overflow: hidden;
  }
  #buy .buy__pkg__box .buy__pkg__img {
    width: 50%;
    float: left;
  }
  #buy .buy__pkg__box .buy__pkg__img > img {
    margin-bottom: 10px;
  }
  #buy .buy__pkg__box .buy__pkg__img > img:last-child {
    margin-bottom: 0;
  }
  #buy .buy__pkg__box dl {
    width: 48%;
    float: right;
    display: block;
    padding: 0 0 0 2%;
  }
  #buy .buy__pkg__box dl dt {
    width: 99px;
    padding-bottom: 15px;
  }
  #buy .buy__pkg__box dl dd {
    font-size: 18px;
    line-height: 1.5;
  }
  #buy .buy__pkg__store {
    padding: 0 48px;
    overflow: hidden;
  }
  #buy .buy__pkg__store li {
    max-width: 430px;
    width: calc(50% - 24px);
    padding: 0 22px 44px 0;
    display: inline-block;
    font-size: 18px;
    line-height: 1.5;
  }
  #buy .buy__pkg__store li:nth-child(even) {padding: 0 0 44px 22px;}
  #buy .buy__pkg__store .buy__pkg__sore__img {padding: 15px 0;}
  #buy .buy__pkg__store li p {padding-bottom: 25px;}
  #buy .buy__pkg__box__btm {padding: 0 0 90px;}

  #topic .topic__box__area {padding-top: 90px;}
  #topic .inner__contents div:first-child {margin-top: -90px;}
  #topic .inner__contents > div:last-child {padding-bottom: 90px;}
  #topic .topic__box {
    background:
            url("../img/buy_pkg_bg02_pc.png") center bottom no-repeat,
            url("../img/topic_box_bg01_pc.png") center top no-repeat,
            url("../img/buy_pkg_bg01_pc.png") center top repeat;
    background-size: contain, contain, contain;
    padding: 0 48px;
    overflow: hidden;
  }
  #topic .topic__box h3 {font-size: 25px; padding-bottom: 20px;}
  #topic .topic__box h4 {font-size: 21.5px; padding-bottom: 15px;}
  #topic .topic__box h5 {font-size: 18px; padding-bottom: 15px; margin: 0;}
  #topic .topic__box h6 {font-size: 18px; padding-bottom: 15px; margin: 0;}
  #topic .topic__box p,
  #topic .topic__box a {font-size: 18px;}
  #topic .topic__box .small {font-size: 16px;}
  #topic .topic__box li {font-size: 18px;}
  #topic .topic__box__img {
    padding-top: 30px;
    width: 50%;
    margin: 0 auto;
  }
  #topic .topic__box .image {
    width: 100%;
    text-align: center;
  }
  #topic .topic__box .image img{
    width: 100%;
    height: auto;
  }

  .totop a {
    position: absolute;
    bottom: 10px;
    right: 10px;
    width: 51px;
  }

  footer {
    background-color: #a03264;
    font-size: 12px;
    color: #FFF;
  }
  footer .footer__twbtn {
    margin: 0 auto;
    width: 165px;
  }
  footer .footer__link {background-color: #fff;}
  footer .footer__link .inner {
    max-width: 950px;
    padding: 20px 0;
  }
  footer .footer__link .inner ol {
    display: flex;
    justify-content: center;
  }
  footer .footer__link .inner li {
    float: left;
    padding: 0 20px;
  }
  footer .footer__link li:nth-child(1) {max-width: 155px;padding-top: 15px;}
  footer .footer__link li:nth-child(2) {max-width: 120px;padding-top: 5px;}
  footer .copyright .inner {
    max-width: 950px;
    padding: 15px 0;
  }
}

@media only screen and (min-width: 750px) and (max-width: 1100px) {
  nav .logo {padding-left: 3vw; margin-top: -3px;}
  nav {padding: 1vw;}
  nav .nav__globalnav {padding-top: 8px; width: 80%;}
  nav .nav__list {padding: 0.5vw 0;}
  nav .nav__list li {padding-left: 1vw; width: 11vw;}
  nav .sns__list {padding-left: 0;}
  nav .sns__list li {padding-left: 1vw;}

  #top .contents {
    background-position: left 5px top, right 5px bottom;
    background-size: 1vw, 1vw;
  }
  section .inner {padding: 10px 2vw;}
  section.mainarea .inner {padding: 0;}

  #title .title__inner__l {
    width: 43%;
    padding: 0 1% 3vw 0;
  }
  #title .title__inner__r {width: 56%;}

  #product dl {
    padding: 2vw 4vw;
    font-size: 2vw;
  }
  #product dl dt {width: 34%;}
  #title .title__ttl {padding: 0 0 10px 2vw;}
  #buy .buy__pkg__box, #buy .buy__pkg__store {
    padding: 0 3vw;
  }
  #buy .buy__pkg__box dl dt {
    width: 9vw;
    padding-bottom: 1vw;
  }

  footer .footer__link {background-size: 19vw;}
  footer .footer__link .inner {
    background-size: 77vw;
    padding: 3vw 0;
  }
  footer .footer__link li:nth-child(1) {padding-top: 2.3vw;}
}

@media (max-width: 749px) {
  body {
    min-width: 320px;
    font-size: 3.4375vw;
  }
  .disp-pc {display: none !important;}
  .disp-sp {display: block !important;}

  header {
    width: 100%;
    background-color: #fff;
    position: fixed;
    z-index: 2;
  }
  header .inner {
    padding: 3vw 0;
    height: 7vw;
  }
  header .nav__globalnav {
    position: fixed;
    top: -300vw;
    width: 100%;
    padding: 15vw 0 5vw;
    transition: all .6s;
    z-index: 20;
    overflow-y: auto;
    background-color: #fff;
  }
  header .nav__globalnav li a {
    line-height: 3;
    padding: 2vw 0;
  }
  header .spnav__btn img {
    position: absolute;
    top: 3vw;
    right: 3vw;
    width: 8vw;
    cursor: pointer;
    z-index: 30;
  }
  header .spmenu__close {display: none;}
  nav .nav__list {
    text-align: center;
    padding: 5vw 0;
  }
  nav .nav__list li {width: 100%; border-top: 1px solid #ff889f;}
  nav .nav__list li:last-child {border-bottom: 1px solid #ff889f;}
  nav .nav__list li img {width:30vw;}
  nav .sns__list {
    display: flex;
    justify-content: center;
  }
  nav .sns__list li {
    width: 12vw;
    padding: 0 5vw;
  }
  nav .logo {
    float: left;
    width: 23vw;
    padding-left: 3vw;
    position: absolute;
    top: 1.5vw;
  }
  .nav__open .nav__globalnav {top: 0;}
  .mainslider .slick-prev:before, .mainslider .slick-next:before {background-size: 15px;}
  .mainslider .slick-prev, .mainslider .slick-next {
    width: 15px;
    height: 15px;
  }
  .slick-dotted.slick-slider {margin-bottom: 20px;}
  #sb-overlay {position: fixed;top: 0;left: 0;}

  main {
    background: url(../img/bg_dot.png) center top repeat, url(../img/bg_star.png) center top repeat;
    background-size: 15px, 280px;
    background-color: #ff889f;
    overflow: hidden;
    padding: 4vw 3vw 0;
  }
  .inner__ttl {padding: 2vw 16vw 10vw;}
  .mainarea .top__catch {margin-top: -103vw;}
  .mainarea .top__logo {padding: 7vw 7vw 5vw;}
  .mainarea .top__date {padding: 0 7vw;}
  .mainarea .top__btn {padding: 4vw 6vw 0 7vw;}
  .mainarea .top__right {padding: 0 8.2vw;}
  .contents .inner {padding: 13vw 0 0;}
  .slick-prev, .slick-next {width: 9vw; height: 14vw; z-index: 1;}
  .title__border {padding-bottom: 8vw;}

  #news .news__list {
    background: #fff;
    height: 32vw;
    overflow-y: scroll;
    padding: 1.2vw 3vw;
  }
  #news .news__list li {
    border-bottom: 1px solid #fff;
    line-height: 1.5;
    padding: 2vw 0;
  }
  #news .news__list li .news__date {
    color: #ff889f;
    display: block;
  }
  #news .news__list li .news__txt {color: #000;}
  #news .news__list li:last-child {border: 0;}
  #news .news__img__list {
    padding-top: 6vw;
    color: #fff;
  }
  #news .news__img__list .slick-prev, #news .news__img__list .slick-next {top: 45%;}
  #news .news__movie .slick-prev, #news .news__movie .slick-next {top: 55%;}
  #news .news__img__list .slick-list p {padding: 2vw 0;}
  #news .news__movie {
    margin: 0 auto;
    padding: 11vw 0 7vw;
  }
  #news .news__movie .slick-dots {bottom: 3vw;}
  #news .news__img__list .slick-list, #news .news__movie .slick-list {
    width: 85%;
    margin: 0 auto;
  }
  #news .news__img__list li, #news .news__movie li {padding: 0 3vw;}

  #about .inner__contents p:first-child {
    color: #fff;
    font-size: 3.2vw;
    text-align: center;
    padding-bottom: 5vw;
  }
  #about .about__caption {
    background: url(../img/about_bg_top.png) top left no-repeat, url(../img/about_bg_btm.png) bottom left no-repeat, url(../img/caption_bg.png) top left repeat;
    background-size: contain, contain, 295px;
    padding: 3vw;
    font-size: 3.75vw;
    text-align: center;
  }
  #about .about__subttl {padding: 0 7vw 2vw;}

  #title .title__ttl {padding: 0 13vw;}
  #title .slick-list li {padding: 3.2vw 10vw;}
  #title .slick-dots {bottom: -3vw;}
  #title .title__inner__r {padding-bottom: 7vw;}
  #title .title__inner__r dd {color: #fff;}
  #title .title__inner__r dt {padding: 3vw 0 2vw;}
  #title .title__inner__r dd .title__btn1 {display: flex;}
  #title .title__inner__r dd .title__btn1 li {
    width: 50%;
    padding: 1vw;
    margin: 0 auto;
  }
  #title .title__inner__r dd .title__btn2 {padding-top: 4vw;}
  #title .title__subttl {padding: 0 2vw 3vw;}

  #product dl {
    font-size: 3.5vw;
    line-height: 2;
    padding: 3vw 4vw;
    background: url(../img/product_bg_top.png) center top no-repeat, url(../img/product_bg_btm.png) center bottom no-repeat, url(../img/caption_bg.png) center top repeat;
    background-size: contain, contain, 150px;
  }
  #product dl dt {
    float: left;
    width: 47%;
    border-bottom: 1px solid #a03264;
  }
  #product dl dd {
    width: 100%;
    border-bottom: 1px solid #a03264;
  }
  #product .border__none {border: none;}
  .table__center {line-height: 4;}

  #buy .buy__subttl {padding: 0 20vw 6vw; margin-top: -3vw;}
  #buy .buy__pkg__box, #buy .buy__pkg__store {
    background: url(../img/buy_pkg_bg02_sp.png) center bottom no-repeat, url(../img/buy_pkg_bg01_sp.png) center top repeat;
    background-size: contain, contain;
    overflow: hidden;
    padding: 0 7vw;
  }
  #buy .buy__pkg__box dl dt {
    width: 16vw;
    padding: 2vw 0;
  }
  #buy .buy__pkg__box dl dd {line-height: 1.5;}
  #buy .buy__pkg__box__btm {padding: 0 0 20vw;}
  #buy .buy__pkg__store .buy__pkg__sore__img {padding: 3vw 0;}
  #buy .buy__pkg__store li p {padding-bottom: 3vw;}
  #buy .buy__pkg__store li {padding-bottom: 10vw;}

  #topic {padding-top: 9vw;}
  #topic .topic__box__area {padding-top: 20vw;}
  #topic .inner__contents div:first-child {margin-top: -20vw;}
  #topic .inner__contents > div:last-child {padding-bottom: 20vw;}
  #topic .topic__box {
    background:
            url(../img/topic_box_bg03_sp.png) center bottom no-repeat,
            url(../img/topic_box_bg01_sp.png) center top no-repeat,
            url(../img/topic_box_bg02_sp.png) center top repeat;
    background-size: contain, contain, contain;
    overflow: hidden;
    padding: 0 5.5vw;
  }
  #topic .topic__box h3 {font-size: 5vw;}
  #topic .topic__box p {
    font-size: 4.375vw;
    line-height: 1.5;
    padding: 2vw 0 0;
  }
  #topic .topic__box__img {width: 90%; margin: 0 auto; padding-top: 3vw;}

  .totop a {
    width: 10vw;
    position: absolute;
    right: 2vw;
    bottom: 1vw;
  }
  .totop.active {bottom: 2vw;}

  footer {
    background-color: #a03264;
    font-size: 12px;
    color: #FFF;
    clear: both;
  }
  footer .footer__link {background-color: #fff;}
  footer .footer__link .inner {padding: 6vw 0;}
  footer .footer__link ol {
    display: flex;
    justify-content: center;
  }
  footer .footer__link ol li {padding: 0 2vw;}
  footer .footer__link li:nth-child(1) {/*width: 43.8vw;*/padding-top: 1vw;}
  footer .footer__link li:nth-child(2) {width: 19vw;}
  footer p {
    padding: 4vw 0;
    font-size: 2.5vw;
  }
}

#product dl dd .package_visual,
#product dl dd .buttons{
  width: 100%;
  font-size: 0;
  text-align: center;
}
#product dl dd .package_visual{
  margin-bottom: 10px;
}
#product dl dd .package_visual img{
  width: 100%;
  height: auto;
}
#product dl dd .buttons{
  margin-bottom: 10px;
}
#product dl dd .buttons div{
  display: inline-block;
  max-width: 288px;
  width: calc(50% - 20px);
  margin: 0 10px;
}
@media (max-width: 749px) {
  #product dl dd .buttons div{
    max-width: 352px;
  }
}
#product dl dd .buttons div img{
  width: 100%;
  height: auto;
  margin: auto;
}