@charset "UTF-8";
body {
  background-image: none
}

img {
  width: 100%
}

html, body {}

.l-wrapper-main {
  padding-top: 0;
  padding-bottom: 0;
  background-color: #f7f4ec;
}

.l-wrapper-sub {
  position: fixed;
  top: 55px;
  left: -10px;
  width: 350px;
  height: 100%;
  transform: translateX(-100%);
  transition: ease .5s;
}

.column1 .l-wrapper-sub {
  display: block;
}

.l-wrapper-sub.open {
  left: 0;
  width: 350px;
  height: 100%;
  transition: ease .5s;
  z-index: 3;
  transform: translateX(0);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background-color: #f7f4ec;
}

@media only screen and (max-width:768px) {
  .l-wrapper-sub {
    width: 315px;
  }
  .l-wrapper-sub.open {
    width: 315px;
  }
}

.section {
  position: relative;
  width: 100vw;
  height: 100vh!important;
  /*フルページ指定*/
  margin-bottom: 0;
  display: table;
}

.section .contents {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
}

#stage02 .contents .wrap, #stage03 .contents .wrap, #stage04 .contents .wrap {
  background-color: #FFFFFF!important;
  padding: 80px!important;
  border-radius: 16px;
}

@media only screen and (max-width:768px) {
  .section {
    width: 100%;
    height: auto!important;
    margin-bottom: 80px;
    display: block;
    table-layout: inherit;
  }
  .section .contents {
    display: block;
    height: inherit;
    vertical-align: inherit
  }
  .section .wrap {
    display: block;
    height: auto;
    vertical-align: inherit;
  }
  #stage02 .contents .wrap, #stage03 .contents .wrap, #stage04 .contents .wrap {
    background-color: #FFFFFF!important;
    padding: 16px!important;
    border-radius: 16px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
  }
}

.pager {
  position: fixed;
  top: 50%;
  right: 9px;
  transform: translateY(-50%);
  padding: 0;
  z-index: 1;
}

.pager li {
  display: block;
  margin-top: 12px;
  margin-right: 12px;
  margin-left: 12px;
  margin-bottom: 12px;
}

.pager li a {
  display: block;
  width: 10px;
  height: 10px;
  position: relative;
  border: 1px solid #c8161d;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 8px;
}

.pager li.is-current a {
  background-image: url(../img/icon_kira02.svg);
  background-color: #c8161d;
}

#actions a {
  position: fixed;
  z-index: 1
}

#actions a {
  display: block;
  width: 30px;
  height: 154px
}

#actions a img {
  width: 30px;
  height: 154px
}

#actions a:hover {
  opacity: .5
}

#moveSectionUp {
  top: 62px;
  right: 0
}

#moveSectionDown {
  right: 0;
  bottom: 0
}

#copyright {
  font-size: .625rem;
  position: fixed;
  z-index: 3;
  top: 47.916666666667%;
  left: -72px;
  width: 22em;
  height: 1rem;
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
  text-align: center;
  color: #c8161d
}

@media only screen and (min-width:1367px) {
  #copyright {
    left: -72px
  }
}

@media only screen and (max-width:768px) {
  .pager, #actions, #copyright, #fp-nav {
    display: none
  }
}


/*header*/

.sp-scrollmenu.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
}

.l-header {
  margin-bottom: 0;
  align-items: center
}

.l-header .header-logo {
  display: flex;
  justify-content: flex-start;
  height: 55px
}

.l-header a.menuBtn {
  display: block!important;
}

.l-header a.menuBtn {
  position: relative;
  z-index: 3;
  display: block;
  width: 57px;
  cursor: pointer;
  background: url(../img/icon_drawer.svg) no-repeat 0 0;
  background-size: cover;
}

.l-header .menuBtn.openMenu {
  background: url(../img/icon_draweron.svg) no-repeat 0 0
}

.l-nav {
  align-items: center
}

.l-nav li:nth-of-type(1) {
  width: 23%;
}


.l-nav li:nth-of-type(2) {
  margin-right: 2px;
  width: 200px;
}

.l-nav li:nth-of-type(3) {
  width: 160px;
  margin-left: 0;
}

@media only screen and (max-width:1149px) {
  .l-header .header-logo {
    display: flex;
    justify-content: flex-start;
    height: 55px
  }
  .l-header a.menuBtn {
    width: 57px;
    height: 54px;
  }
  .l-nav {
    display: flex!important;
  }
  .l-nav li .for-pc {
    display: none;
  }
  .l-nav li .for-sp {
    display: block;
  }
  .l-nav li:nth-of-type(1) {
    display: none;
  }
  .l-nav li:nth-of-type(2) {
    margin-right: 2px;
    width: 55px;
  }
  .l-nav li:nth-of-type(3) {
    width: 55px;
  }
}


/*button*/

.button-group.button-nav {
  position: fixed;
  z-index: 10;
  bottom: 0;
  left: 10px;
  display: flex;
  flex-direction: column;
  width: 11.713030746706%;
  max-width: 160px;
  margin-bottom: .733%
}

.button-group.button-nav .btn {
  font-weight: 700;
  box-sizing: border-box;
  padding: 4.375% 0 4.375% 34.375%;
  text-align: left;
  color: #333;
  border: 1px #333 solid;
  border-radius: 20px;
  background-size: contain
}

.button-group.button-nav .btn:hover {
  opacity: .7
}

.button-group.button-nav .btn--coupon {
  margin-bottom: 5%;
  background: url(../img/icon_coupon.svg) #fff no-repeat left 21px center;
  background-size: auto 100%
}

.button-group.button-nav .btn--store {
  background: url(../img/icon_place_pin.svg)#fff no-repeat left 21px center;
  background-size: auto 52%
}

.button-group.col1 {
  flex-direction: column
}

.button-group.col1 .btn:first-of-type {
  margin-bottom: 4.4444444444444%
}

.button-group.col2 {
  max-width: 760px
}

@media only screen and (max-width:768px) {
  .l-wrapper-main {
    padding-top: 0;
    padding-bottom: 0;
    width: 100%;
    overflow-x: hidden;
    background-color: #f7f4ec;
  }
  .l-wrapper {
    padding-top: 0
  }
  .button-group.col1, .button-group.col2 {
    flex-direction: column;
    max-width: inherit
  }
  .button-group.col1 .btn, .button-group.col2 .btn {
    font-size: 2.25rem;
    max-width: inherit
  }
  .button-group.col1 .btn {
    padding: 4.4% 0
  }
  .button-group.col2 .btn {
    padding: 5.0724637681159% 0
  }
  .button-group.col2 .btn:nth-of-type(2) {
    margin-left: 0
  }
  .button-group.col1 .btn:first-of-type {
    margin-bottom: 0
  }
  .button-group {
    margin-left: auto!important;
    margin-right: auto!important;
  }
}

#stage01 {
  position: relative;
  overflow-x: hidden;
  width: 100%;
  background-color: #f7f4ec;
  background-image: none;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}

#stage01 .wrap {
  width: 55.636896046852%;
  max-width: 760px;
  margin: auto;
  text-align: center
}

#stage01 .wrap img {
  width: 880px;
  -webkit-box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.30);
  box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.30);
  border-radius: 16px;
}

#stage01 h1 {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.5;
  margin: 3.5526315789474% 0 1.8421052631579%;
  color: #c8161d;
}

#stage01 p {
  font-size: 15px;
  line-height: 1.5;
  margin-top: calc((1 - 1.5) * .5em);
  margin-bottom: 0;
  color: #c8161d;
}

.l-notice li {
  display: none;
}

.l-notice li:first-child {
  display: block;
}

#stage01 .button-group.col2 {
  margin: 27px auto 40px;
}

@media only screen and (max-width:768px) {
  #stage01 {
    background-image: none;
    background-size: 100% auto;
  }
  #stage01 .wrap {
    width: 84%;
    max-width: inherit;
    text-align: left
  }
  #stage01 .wrap img {
    display: block;
    width: 90%;
    max-width: inherit;
    margin: 88px auto 88px;
  }
  .notice .notice-content {
    text-align: left;
  }
  #stage01 h1 {
    font-size: 2rem;
    line-height: 1.75;
    margin-top: calc((1 - 1.75) * .5em);
    margin-bottom: calc(6.507936507936508% - (((1em * 1.75) - 1em) / 2))
  }
  #stage01 p {
    font-size: 1.75rem;
    line-height: 2;
    margin-top: calc((1 - 2) * .5em);
    margin-bottom: calc(11.9047619047619% - (((1em * 2) - 1em) / 2));
    text-align: center;
  }
  .button-group.col2 {
    width: 92%;
    margin-bottom: 8%
  }
  .button-group.col2 .btn:first-of-type {
    margin-bottom: 2.9%
  }
}

#stage02, #stage04, #stage06 {}

@media only screen and (max-width:768px) {
  #stage02, #stage04, #stage06 {
    background-color: #f7f4ec;
  }
}

#stage03, #stage05 {}

#stage02 .wrap, #stage03 .wrap, #stage04 .wrap, #stage05 .wrap, #stage06 .wrap {
  width: 73.206442166911%;
  max-width: 1000px;
  margin: 0 auto;
  padding-top: 1.2%
}

.section h2 {
  font-size: 3rem;
  font-weight: 600;
  line-height: 1.1875;
  position: relative;
  z-index: 2;
  margin-bottom: 3%;
  padding-bottom: 0;
  padding-left: 0;
  border-bottom: none;
  color: #333;
}

.section h2::before {
  content: none
}

#stage02 p, #stage03 p, #stage04 p {
  font-weight: 700;
  max-width: 500px;
  margin-top: 0;
  margin-bottom: 160px;
  color: #333;
}

#stage06 p {
  color: #c8161d;
}

#stage02 .button-group.col1, #stage03 .button-group.col1, #stage04 .button-group.col1 {
  width: 100%;
  margin: 0
}

#stage02 .button-group.col1 .btn, #stage03 .button-group.col1 .btn, #stage04 .button-group.col1 .btn {
  width: 100%;
}

#stage02 img.for-pc, #stage03 img.for-pc, #stage04 img.for-pc {
  position: absolute;
  z-index: 1
}

#stage02 img {
  right: 4.3191800878477%;
  bottom: 9.375%;
  width: 34.699853587116%;
  max-width: 474px;
  display: none;
}

@media only screen and (max-width:768px) {
  #stage02 .wrap, #stage03 .wrap, #stage04 .wrap, #stage05 .wrap {
    width: 90%;
    max-width: inherit;
    margin: 0 auto;
    padding-top: 0
  }
  #stage02.section h2 {
    font-size: 3.875rem;
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: calc(6.349206349206349% - (((1em * 1.2) - 1em) / 2));
    padding-top: calc(20.31746031746032% - (((1em * 1.2) - 1em) / 2))
  }
  #stage02 p, #stage03 p, #stage04 p {
    margin-bottom: 240px!important;
  }
  #stage02 img.for-sp, #stage03 img.for-sp, #stage04 img.for-sp {
    position: relative;
    display: none;
    max-width: inherit
  }
  .section img.for-pc {
    display: none
  }
  #stage02 img {
    right: 0;
    width: 103.65079365079%;
    margin-right: 0;
    margin-left: -3.6507936507937%
  }
  #stage02 p, #stage03 p, #stage04 p, #stage05 p {
    font-size: 1.875rem;
    max-width: inherit;
    margin-bottom: 160px;
  }
  #stage02 .button-group.col1, #stage03 .button-group.col1, #stage04 .button-group.col1 {
    width: auto;
    margin: 0 -9.5238095238095%
  }
  #stage02 .btn--white, #stage03 .btn--white, #stage04 .btn--white {
    border-right: 0;
    border-bottom: 2px #eee solid;
    border-left: 0
  }
  #stage02 .btn, #stage03 .btn, #stage04 .btn, #stage05 .btn {
    margin-bottom: 16px;
  }
}

#stage03.section {
  background-repeat: no-repeat;
  background-position: right 6.8081991215227% bottom 5.3385416666667%;
  background-image: none;
  background-size: 12.371888726208% auto
}

#stage03.section h2, #stage03.section p, #stage03.section .button-group {
  padding-left: 50%
}

#stage03 img {
  bottom: 4.1666666666667%;
  left: -3.1478770131772%;
  width: 40.556368960469%;
  max-width: 554px;
  display: none;
}

@media only screen and (max-width:768px) {
  #stage03.section {
    padding-left: inherit;
  }
  #stage03.section h2, #stage03.section p, #stage03.section {
    padding-left: inherit;
  }
  .button-group {
    padding-left: 0px!important;
    padding-right: 0px!important;
  }
  #stage03.section h2 {
    font-size: 3.875rem;
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: calc(6.349206349206349% - (((1em * 1.2) - 1em) / 2));
    padding-top: calc(15.87301587301587% - (((1em * 1.2) - 1em) / 2))
  }
  #stage03 img.for-sp {
    right: 0;
    bottom: inherit;
    left: -6.984126984127%;
    display: none;
    width: 121.11111111111%;
    max-width: inherit;
    margin-right: -15.079365079365%
  }
  #stage02 .btn--white, #stage03 .btn--white, #stage04 .btn--white {
    border: 1px #999 solid;
  }
}

#stage04.section {
  background-repeat: no-repeat;
  background-position: left -5.4172767203514% bottom 5.46875%;
  background-image: none;
  background-size: 17.496339677892% auto
}

#stage04 img {
  right: 1.3177159590044%;
  bottom: 11.979166666667%;
  width: 39.897510980966%;
  max-width: 554px;
  display: none;
}

@media only screen and (max-width:768px) {
  #stage04.section {}
  #stage04.section h2 {
    font-size: 3.875rem;
    line-height: 1.2;
    margin-top: 0;
    margin-bottom: calc(6.349206349206349% - (((1em * 1.2) - 1em) / 2));
    padding-top: calc(15.87301587301587% - (((1em * 1.2) - 1em) / 2))
  }
  #stage04 img {
    right: -11.904761904762%;
    left: -4.1269841269841%;
    width: 117.61904761905%
  }
}

#stage05 {}

@media only screen and (min-width:1367px) {
  #stage05 .wrap:first-of-type {
    padding: 60px 0 80px
  }
}

#stage05 .wrap:first-of-type {
  padding: 4.3923865300146% 0 5.8565153733529%
}

#stage05 .wrap:nth-of-type(2) {
  width: 73.206442166911%;
  max-width: 1000px;
  margin: 0 auto
}

#stage05 h3 {
  position: relative;
  z-index: 2;
  width: 44.9%;
  max-width: 449px;
  margin: 0 auto;
  display: none;
}

#stage05 .l-bnr.col3 {
  position: relative;
  z-index: 3;
  max-width: 1000px;
  margin: -14.4% auto 0;
  flex-wrap: wrap;
  justify-content: space-between
}

@media only screen and (min-width:1367px) {
  #stage05 .l-bnr.col3 {
    margin-top: -144px
  }
}

#stage05 .l-bnr.col3 li {
  box-sizing: border-box;
  width: 31.2%;
  max-width: 312px;
  margin-bottom: 3.2%
}

#stage05 .l-bnr.col3 li a {
  box-sizing: border-box;
  border-radius: 8px
}

@media only screen and (max-width:768px) {
  #stage05 .wrap:first-of-type {
    padding: 6.6666666666667% 0 13.333333333333%
  }
  #stage05 h3 {
    width: 96.986%;
    max-width: inherit;
    margin: 0 auto
  }
  #stage05 .l-bnr.col3 {
    display: flex;
    max-width: inherit;
    margin: 0 auto 0;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: stretch
  }
  #stage05 .l-bnr.col3 li {
    box-sizing: border-box;
    width: 49.208%;
    max-width: inherit;
    margin-bottom: 1.5873015873016%
  }
}

#stage06 .fp-tableCell>.wrap {
  width: 73.206442166911%;
  max-width: 1000px;
  margin: 0 auto;
  padding-top: 1.2%
}

#stage06 h3 {
  font-size: 1.75rem;
  line-height: 1.1428571428571;
  margin-bottom: 2%
}

@media only screen and (max-width:1250px) {
  #stage06 h3 {
    font-size: 1.5rem
  }
}

@media only screen and (max-width:800px) {
  #stage06 h3 {
    font-size: 1.25rem
  }
  #stage06 .btn.btn--black {
    background-image: url("../img/icon_arrow_bold_wht.svg")
  }
  #stage06 .btn.btn--black:hover {
    background-image: url(../img/icon_arrow_bold_wht.svg)
  }
}

#stage06 dl {
  display: flex
}

#stage06 dt {
  width: 27.5%;
  margin-top: -2.7%;
  padding-left: 6%;
  display: none;
}

#stage06 dt img {
  max-width: 215px;
  display: none;
}

#stage06 dd {
  padding-right: 0;
  padding-bottom: 32px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  color: #c8161d;
}

#stage06 .tel.for-pc {
  font-size: 3.5rem;
  font-weight: 700;
  margin-bottom: 12px
}

#stage06 dd span {
  font-size: 1.125rem;
  font-weight: bold;
}

#stage06 .button-group.col2 {
  margin-top: 2%
}

@media only screen and (max-width:768px) {
  #stage06 .wrap {
    width: 92%;
    max-width: inherit;
    padding-top: 1.2%
  }
  #stage06 dl {
    display: block
  }
  #stage06 dt {
    width: 100%;
    margin-top: -8%;
    margin-bottom: 5.334%;
    padding-left: 0;
    vertical-align: bottom
  }
  #stage06 dt img {
    float: left;
    width: 32%;
    max-width: inherit;
    margin-right: 3.2%;
    margin-left: -1.3333333333333%
  }
  #stage06 h3 {
    font-size: 2.5rem;
    line-height: 1.5;
    margin-top: 0;
    margin-bottom: 0
  }
  #stage06 dd {
    position: relative;
    width: 100%;
    padding: 0
  }
  #stage06 .tel.for-sp {
    font-size: 4.3125rem;
    font-weight: 700;
    margin: 0 8% 3.7333333333333%
  }
  #stage06 .tel.for-sp a {
    text-decoration: none;
    color: #c8161d
  }
  #stage06 .tel.for-sp a:hover {
    opacity: .7
  }
  #stage06 dd span {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1;
    display: block;
    margin: 0 8%
  }
  #stage06 .button-group.col2 {
    margin: 8% auto 10%
  }
}

@media only screen and (min-width:1367px) {
  #stage02 img, #stage03 img, #stage04 img, #stage05 img, #stage06 img, #stage06 dt img {
    max-width: inherit
  }
}

@media only screen and (max-width:768px) {
  .button-group.button-nav {
    display: none
  }
  #stage06 h3 {
    font-size: 2rem;
    color: #c8161d;
    display: block;
  }
}

@media only screen and (max-width:700px) {
  #stage06 .tel.for-sp {
    font-size: 4rem;
  }
  #stage06 h3 {
    font-size: 2rem
  }
}

@media only screen and (max-width:640px) {
  #stage01 h1 {
    font-size: 1rem
  }
  #stage01 p {
    font-size: .875rem
  }
  #stage06 dd span {
    font-size: 1rem
  }
  .button-group.col1 .btn, .button-group.col2 .btn {
    font-size: 1.2rem
  }
  #stage02.section h2, #stage03.section h2, #stage04.section h2 {
    font-size: 1.9375rem
  }
  #stage02 p, #stage03 p, #stage04 p, #stage05 p, #stage06 p {
    font-size: .9375rem
  }
  #stage06 h3 {
    font-size: 1.5rem
  }
  #stage06 .tel.for-sp {
    font-size: 3rem
  }
}

@media only screen and (max-width:480px) {
  #stage06 h3 {
    font-size: 1.25rem
  }
  #stage06 .tel.for-sp {
    font-size: 2.15625rem
  }
}

.pagetop {
  display: none
}


/*20200106 追加*/

#stage06 .button-group.col2 {
  margin-bottom: 9.6%;
}

#stage06 .wrap dl dd p {
  font-weight: normal;
  line-height: 1.5;
  margin-top: 1rem
}

@media only screen and (max-width:768px) {
  #stage06 .button-group.col2 {
    margin-bottom: 20.8695652173913%;
    font-size: 0.75rem
  }
  #stage06 .wrap dl dd p {
    margin-right: 8%;
    margin-left: 8%;
  }
}