@charset "UTF-8";
.page * {
  color: #333;
}
.page a {
  display: block;
  -webkit-transition: all 0.3s ease-in 0s;
  transition: all 0.3s ease-in 0s;
}
.page a:hover {
  opacity: 0.6;
}
.page img {
  max-width: 100%;
  height: auto;
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.page div, .page span, .page applet, .page object, .page iframe,
.page h1, .page h2, .page h3, .page h4, .page h5, .page h6, .page p,
.page blockquote, .page pre, .page a, .page abbr, .page acronym, .page address,
.page big, .page cite, .page code, .page del, .page dfn, .page em, .page img, .page ins, .page kbd, .page q, .page s, .page samp, .page small, .page strike, .page strong, .page sub, .page sup, .page tt, .page var, .page b, .page u, .page i, .page center,
.page dl, .page dt, .page dd, .page ol, .page ul, .page li,
.page fieldset, .page form, .page label, .page legend,
.page table, .page caption, .page tbody, .page tfoot, .page thead, .page tr, .page th, .page td,
.page article, .page aside, .page canvas, .page details, .page embed, .page figure, .page figcaption, .page footer, .page header, .page hgroup,
.page menu, .page nav, .page output, .page ruby, .page section, .page summary, .page time, .page mark, .page audio, .page video, .page picture {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.page article, .page aside, .page details, .page figcaption, .page figure, .page footer, .page header, .page hgroup, .page menu, .page nav, .page section, .page summary, .page picture {
  display: block;
}
.page *, .page *:before, .page *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
.page button {
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.l-wrap {
  overflow: initial;
}

@media screen and (min-width: 769px) {
  .view--pc {
    display: block;
  }

  .view--sp {
    display: none;
  }
}
@media screen and (max-width: 768px) {
  .view--pc {
    display: none;
  }

  .view--sp {
    display: block;
  }
}
.page .item__list__text {
  text-align: center;
}
.page .item__list__text * {
  color: #333;
}
.page .item__list__text .item--name {
  font-size: 16px;
  letter-spacing: 0;
  line-height: 1.3;
}
@media screen and (max-width: 768px) {
  .page .item__list__text .item--name {
    font-size: 3.6vw;
  }
}
.page .ajax_area {
  width: 100%;
  margin: auto;
}
.page .ajax_area a.cartinbtn {
  width: 100%;
  background-color: #65798A;
  margin: 16px auto 0;
  font-size: 13px;
}
@media screen and (max-width: 768px) {
  .page .ajax_area a.cartinbtn {
    margin: 2.3vw auto 0;
    font-size: 3.4vw;
    width: 100%;
    line-height: 11.2vw;
    padding: 0;
  }
}
.page .ajax_area .stock_exist {
  width: 100%;
  margin: 13px auto 0;
  font-size: 13px;
}
@media screen and (max-width: 768px) {
  .page .ajax_area .stock_exist {
    margin: 3.9vw auto 0;
    font-size: 3.4vw;
  }
}
.page .ajax_area .preset_price_area {
  font-size: 16px;
  margin: 5px 0 0;
}
@media screen and (max-width: 768px) {
  .page .ajax_area .preset_price_area {
    font-size: 3.6vw;
    line-height: 1;
    margin: 0.7vw 0 0;
  }
}
.page .ajax_area span.preset_price_mini {
  color: #666;
}
@media screen and (max-width: 768px) {
  .page .ajax_area span.preset_price_mini {
    display: block;
    margin: 0 0 0.7vw;
  }
}
.page .reservation__btn {
  margin: 14px 0 0;
}
@media screen and (max-width: 768px) {
  .page .reservation__btn {
    margin: 3.6vw 0 0;
  }
}
.page .reservation__btn a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-size: 13px;
  font-weight: 300;
  color: #65798A;
}
@media screen and (max-width: 768px) {
  .page .reservation__btn a {
    font-size: 3.5vw;
  }
}
.page .reservation__btn a:before {
  content: "";
  display: block;
  width: 24px;
  height: 14px;
  background-image: url("/ec/img/usr/pg/campaign/tiotio_premium/hanger_icon.svg?0928");
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 4px;
}
@media screen and (max-width: 768px) {
  .page .reservation__btn a:before {
    width: 5.7vw;
    height: 3.4vw;
    margin-right: 2vw;
  }
}

.page {
  /*
    共通設定
  ---------------------------------*/
  overflow: hidden;
  background: #fff;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Noto Sans JP", sans-serif;
  /*
    共通パーツ
  ---------------------------------*/
  /*
    kv
  ---------------------------------*/
  /*
    navi
  ---------------------------------*/
  /*
    about
  ---------------------------------*/
  /*
    insta
  ---------------------------------*/
  /*
    unit
  ---------------------------------*/
  /*=============================
   item　scroll ver
  =============================*/
  /*
    mask
  ---------------------------------*/
}
.page p {
  font-size: 24px;
  line-height: 1.5;
  letter-spacing: 0.06rem;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page p {
    letter-spacing: 0;
  }
}
@media screen and (max-width: 768px) {
  .page p {
    font-size: 5.2vw;
    letter-spacing: 0.05rem;
  }
}
.page .ancor {
  margin-top: -60px;
  padding-top: 60px;
}
@media screen and (max-width: 768px) {
  .page .ancor {
    margin-top: -55px;
    padding-top: 55px;
  }
}
.page-inner {
  width: 100%;
  max-width: 980px;
  margin: auto;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page-inner {
    padding: 0 20px;
  }
}
@media screen and (max-width: 768px) {
  .page-inner {
    width: 89.6vw;
    margin: auto;
  }
}
.page-btn {
  width: 100%;
  max-width: 540px;
  height: 118px;
  border: 2px solid #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}
@media screen and (max-width: 768px) {
  .page-btn {
    height: 19.5vw;
    max-width: 89.6vw;
    border-width: 0.3vw;
  }
}
.page-btn:after, .page-btn:before {
  content: "";
}
.page-btn * {
  font-weight: 500;
}
.page-btn a {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.page-btn p {
  font-size: 24px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .page-btn p {
    font-size: 5.1vw;
  }
}
.page-btn span {
  display: block;
  font-size: 18px;
}
@media screen and (max-width: 768px) {
  .page-btn span {
    font-size: 3.6vw;
  }
}
.page-btn img {
  position: absolute;
  top: 0;
  left: 20px;
}
@media screen and (max-width: 768px) {
  .page-btn img {
    width: 14.3vw;
  }
}
@media screen and (min-width: 769px) {
  .page .on.unit__more:before, .page .on.page-btn:before, .page .on.unit__more:after, .page .on.page-btn:after {
    right: 18px;
  }
}
.page .unit__more:before, .page .page-btn:before, .page .unit__more:after, .page .page-btn:after {
  content: "";
  display: inline-block;
  position: absolute;
  right: 24px;
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}
@media screen and (max-width: 768px) {
  .page .unit__more:before, .page .page-btn:before, .page .unit__more:after, .page .page-btn:after {
    right: 3.1vw;
  }
}
.page .unit__more:before, .page .page-btn:before {
  width: 28px;
  height: 1px;
  top: 50%;
  background: #65798A;
}
@media screen and (max-width: 768px) {
  .page .unit__more:before, .page .page-btn:before {
    width: 5.2vw;
    height: 0.3vw;
  }
}
.page .unit__more:after, .page .page-btn:after {
  width: 6px;
  height: 1px;
  background: #65798A;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  top: 50%;
  margin-top: -0.5%;
}
@media screen and (max-width: 768px) {
  .page .unit__more:after, .page .page-btn:after {
    width: 1.3vw;
    margin-top: -0.5vw;
    height: 0.3vw;
  }
}
.page .insta__btn .btn-txt__btn a:after, .page .about__more li a:after, .page .navi__list li a:after {
  display: inline-block;
  width: 10px;
  height: 10px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  border-style: solid;
  border-width: 1px;
  border-color: transparent #65798A #65798A transparent;
  position: absolute;
  right: 24px;
  top: -7px;
  bottom: 0;
  margin: auto;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page .insta__btn .btn-txt__btn a:after, .page .about__more li a:after, .page .navi__list li a:after {
    right: 8%;
  }
}
@media screen and (max-width: 768px) {
  .page .insta__btn .btn-txt__btn a:after, .page .about__more li a:after, .page .navi__list li a:after {
    width: 2vw;
    height: 2vw;
    right: 4.6vw;
    top: -0.9vw;
  }
}
.page .kv {
  background: #B0BFC8;
}
.page .kv h1 {
  min-width: 1980px;
  position: relative;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  .page .kv h1 {
    min-width: 100%;
  }
}
.page .kv h1 img {
  margin: auto;
}
.page .navi__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 80px auto 0;
}
@media screen and (max-width: 768px) {
  .page .navi__list {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin: 12.5vw auto 0;
  }
}
.page .navi__list li {
  width: 19.2%;
  height: 64px;
  position: relative;
}
@media screen and (min-width: 769px) {
  .page .navi__list li {
    margin-right: 8px;
  }
  .page .navi__list li:last-child {
    margin-right: 0;
  }
}
@media screen and (max-width: 768px) {
  .page .navi__list li {
    width: 43.2vw;
    height: 11.7vw;
    margin: 3.1vw 0 0;
  }
  .page .navi__list li:nth-child(-n+2) {
    margin-top: 0;
  }
}
.page .navi__list li a {
  width: 100%;
  height: 100%;
  border: 1px solid #65798A;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #65798A;
  font-size: 16px;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .page .navi__list li a {
    font-size: 3.4vw;
  }
}
.page .navi__list li a:after {
  content: "";
}
.page .navi__title {
  text-align: center;
}
.page .navi__title p {
  margin: 73px auto 0;
  font-size: 40px;
  letter-spacing: 0;
  font-weight: 600;
}
@media screen and (max-width: 768px) {
  .page .navi__title p {
    margin: 11.2vw auto 0;
    font-size: 6.3vw;
  }
}
.page .navi__title h2 {
  width: 100%;
  max-width: 260px;
  margin: 34px auto 0;
}
@media screen and (max-width: 768px) {
  .page .navi__title h2 {
    max-width: 41.7vw;
    margin: 6.5vw auto 0;
  }
}
.page .about {
  padding: 74px 0 80px;
  margin: 80px auto 0;
  background: #FFF0D6;
}
@media screen and (max-width: 768px) {
  .page .about {
    margin: 12.5vw auto 0;
    padding: 13vw 0 12.5vw;
  }
}
.page .about__title {
  text-align: center;
}
.page .about__title h2 {
  font-size: 32px;
  font-weight: 600;
  color: #F27500;
}
@media screen and (max-width: 768px) {
  .page .about__title h2 {
    font-size: 5.7vw;
  }
}
.page .about__title p {
  font-size: 16px;
  font-weight: 300;
  letter-spacing: 0;
  margin: 20px 0 0;
}
@media screen and (max-width: 768px) {
  .page .about__title p {
    font-size: 3.6vw;
    margin: 5.2vw 0 0;
    text-align: left;
  }
}
.page .about__main {
  margin: 70px auto 0;
}
@media screen and (max-width: 768px) {
  .page .about__main {
    margin: 10.3vw auto 0;
  }
}
.page .about__main p {
  display: block;
  text-align: center;
  margin: 22px auto 0;
  font-weight: 600;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page .about__main p {
    font-size: 22px;
  }
}
@media screen and (max-width: 768px) {
  .page .about__main p {
    text-align: left;
    margin: 9.1vw auto 0;
  }
}
.page .about__main p span {
  font-size: 13px;
  font-weight: 300;
}
@media screen and (max-width: 768px) {
  .page .about__main p span {
    font-size: 3.4vw;
  }
}
.page .about__main p img {
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .page .about__main p img {
    margin-top: -3vw;
  }
}
@media screen and (max-width: 768px) {
  .page .about__main p br {
    display: none;
  }
}
.page .about__main p:first-child {
  margin-top: 0;
}
.page .about__more {
  max-width: 640px;
  margin: 80px auto 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .page .about__more {
    display: block;
    max-width: 100%;
    margin: 7.3vw auto 0;
  }
}
.page .about__more li {
  width: 46.8%;
  position: relative;
  background: #fff;
}
@media screen and (max-width: 768px) {
  .page .about__more li {
    width: 100%;
    margin: 5.2vw 0 0;
  }
  .page .about__more li:first-child {
    margin-top: 0;
  }
}
.page .about__more li a {
  width: 100%;
  height: 88px;
  color: #F27500;
  font-size: 16px;
  font-weight: 600;
  border: 1px solid #F27500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  .page .about__more li a {
    font-size: 3.4vw;
    height: 11.7vw;
    padding-left: 0;
  }
}
.page .about__more li a:after {
  content: "";
  border-color: #F27500 #F27500 transparent transparent;
}
@media screen and (min-width: 769px) {
  .page .about__more li a:after {
    width: 11px;
    height: 11px;
    border-width: 2px;
  }
}
@media screen and (max-width: 768px) {
  .page .about__more li a br {
    display: none;
  }
}
.page .insta {
  max-width: 980px;
  margin: 80px auto 0;
  text-align: center;
  border-top: 1px solid #000;
}
@media screen and (max-width: 768px) {
  .page .insta {
    max-width: 100%;
    width: 90%;
    margin: 10.4vw auto 0;
  }
}
.page .insta__tit {
  display: inline-block;
  margin: 80px auto 60px;
}
@media screen and (max-width: 768px) {
  .page .insta__tit {
    width: 80%;
    margin: 10.4vw auto 7.8vw;
  }
}
.page .insta__main {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 768px) {
  .page .insta__main {
    display: block;
  }
}
.page .insta__main-img {
  width: 100%;
}
@media screen and (max-width: 768px) {
  .page .insta__main-img {
    width: 100%;
    margin: 0 auto 7.8vw;
  }
}
.page .insta__main-txt {
  width: 49%;
}
@media screen and (max-width: 768px) {
  .page .insta__main-txt {
    width: 100%;
    margin: 0 auto 7.8vw;
  }
}
.page .insta__btn {
  max-width: 500px;
  margin: 60px auto 0;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .page .insta__btn {
    max-width: 100%;
    width: 90%;
    margin: 0 auto 7.8vw;
  }
}
.page .insta__btn .btn-txt__follow {
  font-weight: bold;
  font-size: 16px;
  margin: 0 auto 30px;
}
@media screen and (max-width: 768px) {
  .page .insta__btn .btn-txt__follow {
    font-size: 4.2vw;
    margin: 0 auto 3.9vw;
  }
}
.page .insta__btn .btn-txt__btn {
  position: relative;
  background-color: #fff;
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width: 768px) {
  .page .insta__btn .btn-txt__btn {
    width: 100%;
  }
}
.page .insta__btn .btn-txt__btn a {
  width: 100%;
  height: 88px;
  color: #F27500;
  font-size: 16px;
  font-weight: 600;
  border: 1px solid #F27500;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  .page .insta__btn .btn-txt__btn a {
    font-size: 3.4vw;
    height: 11.7vw;
  }
}
.page .insta__btn .btn-txt__btn a:after {
  content: "";
  border-color: #F27500 #F27500 transparent transparent;
  top: 0;
  bottom: 0;
}
@media screen and (min-width: 769px) {
  .page .insta__btn .btn-txt__btn a:after {
    width: 11px;
    height: 11px;
    top: 0;
    bottom: 0;
    border-width: 2px;
  }
}
@media screen and (max-width: 768px) {
  .page .insta__btn .btn-txt__btn a br {
    display: none;
  }
}
.page .unit {
  margin: 212px auto 0;
}
@media screen and (max-width: 768px) {
  .page .unit {
    margin: 42.6vw auto 0;
  }
}
.page .unit > div {
  margin: 80px auto 0;
}
@media screen and (max-width: 768px) {
  .page .unit > div {
    margin: 14.7vw auto 0;
  }
}
.page .unit > div:first-child {
  margin-top: 0;
}
.page .unit__title {
  position: relative;
}
.page .unit__title__inner {
  max-width: 980px;
  height: 189px;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
@media screen and (max-width: 768px) {
  .page .unit__title__inner {
    height: 33.1vw;
  }
}
.page .unit__title__inner h2, .page .unit__title__inner p {
  position: relative;
  z-index: 2;
  color: #fff;
}
.page .unit__title__inner h2 {
  text-align: center;
  max-width: 270px;
  height: 100%;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.page .unit__title__inner h2 span {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  margin: 16px auto 0;
  display: inline-block;
}
@media screen and (max-width: 768px) {
  .page .unit__title__inner h2 span {
    margin: 1.3vw auto 0;
    font-size: 3.4vw;
  }
}
@media screen and (max-width: 768px) {
  .page .unit__title__inner h2 {
    max-width: 46.9vw;
  }
}
.page .unit__title__inner p {
  font-size: 32px;
  font-weight: 600;
  margin: 38px 0 0;
  letter-spacing: 0;
}
@media screen and (max-width: 768px) {
  .page .unit__title__inner p {
    font-size: 5.2vw;
    margin: 6.8vw 0 0;
  }
}
.page .unit__title:after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 189px;
  background: rgba(101, 121, 138, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .page .unit__title:after {
    height: 33.1vw;
  }
}
.page .unit__main {
  max-width: 725px;
  margin: 75px auto 0;
}
@media screen and (max-width: 768px) {
  .page .unit__main {
    max-width: 100%;
    margin: 11.5vw auto 0;
  }
}
.page .unit__list {
  text-align: center;
  margin: 74px auto 0;
}
@media screen and (max-width: 768px) {
  .page .unit__list {
    margin: 10.9vw auto 0;
  }
}
.page .unit__list:first-child {
  margin-top: 0;
}
.page .unit__list__title h3 {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.3;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page .unit__list__title h3 {
    font-size: 22px;
  }
}
@media screen and (max-width: 768px) {
  .page .unit__list__title h3 {
    font-size: 5.2vw;
  }
}
.page .unit__more {
  margin: 86px auto 0;
  max-width: 540px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .page .unit__more {
    margin: 14.1vw auto 0;
    max-width: 89.6vw;
  }
}
.page .unit__more:before, .page .unit__more:after {
  content: "";
}
.page .unit__more a {
  width: 100%;
  height: 120px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
  border: 2px solid #65798A;
}
@media screen and (max-width: 768px) {
  .page .unit__more a {
    height: 19.8vw;
  }
}
.page .unit__more a * {
  color: #65798A;
}
.page .unit__more a p {
  font-weight: 600;
  display: block;
  padding-left: 15px;
}
@media screen and (max-width: 768px) {
  .page .unit__more a p {
    padding-left: 2vw;
    font-size: 3.9vw;
  }
}
.page .unit__more a p span {
  display: block;
  font-weight: 600;
  font-size: 18px;
  letter-spacing: 0;
}
@media screen and (max-width: 768px) {
  .page .unit__more a p span {
    font-size: 2.9vw;
  }
}
.page .unit__more a img {
  position: absolute;
  left: 16px;
  top: 0;
  bottom: 0;
  margin: auto;
  max-width: 90px;
}
@media screen and (max-width: 768px) {
  .page .unit__more a img {
    left: 2.1vw;
    max-width: 16.1vw;
  }
}
.page .unit--suit .ancor {
  margin-top: -220px;
  padding-top: 220px;
}
.page .unit--suit .unit__title__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  height: 329px;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page .unit--suit .unit__title__inner {
    padding: 0 0 0 20px;
  }
}
@media screen and (max-width: 768px) {
  .page .unit--suit .unit__title__inner {
    height: 149.2vw;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
    padding: 0 0 5.9vw;
  }
}
@media screen and (max-width: 768px) {
  .page .unit--suit .unit__title__inner h2 {
    display: block;
    height: auto;
  }
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page .unit--suit .unit__title__inner p {
    font-size: 24px;
  }
}
.page .unit--suit .unit__title:after {
  height: 329px;
  background: #65798A;
}
@media screen and (max-width: 768px) {
  .page .unit--suit .unit__title:after {
    height: 149.2vw;
  }
}
.page .unit--suit .unit__title-text {
  width: 55%;
}
@media screen and (max-width: 768px) {
  .page .unit--suit .unit__title-text {
    width: 89.6vw;
    margin: 7.2vw auto 0;
    text-align: center;
  }
}
.page .unit--suit .unit__title-img {
  width: 40.8%;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .page .unit--suit .unit__title-img {
    width: 89.6vw;
  }
}
@media screen and (min-width: 769px) {
  .page .unit--suit .unit__main-wrap {
    margin: 190px auto 0;
  }
}
.page .unit--suit .item__scroll {
  margin: 20px auto 0;
}
@media screen and (max-width: 768px) {
  .page .unit--suit .item__scroll {
    margin: 6.6vw auto 0;
  }
}
@media screen and (min-width: 769px) {
  .page .unit--jacket .unit__list__title h3 {
    white-space: nowrap;
  }
}
.page .item__scroll {
  width: 100%;
  max-width: 980px;
  text-align: center;
  margin: 37px auto 0;
}
@media screen and (min-width: 769px) and (max-width: 980px) {
  .page .item__scroll {
    padding: 0 20px;
  }
}
@media screen and (max-width: 768px) {
  .page .item__scroll {
    width: 100%;
    max-width: 100%;
    margin: 5.6vw auto 0;
  }
}
.page .item__scroll .item__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__list {
    padding: 0 5.2vw;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    overflow-y: hidden;
    display: -webkit-box;
    -ms-overflow-style: none;
    /* Internet Explorer 10+ */
    scrollbar-width: none;
    /* Firefox */
  }
  .page .item__scroll .item__list::-webkit-scrollbar {
    display: none;
    /* Safari and Chrome */
  }
}
.page .item__scroll .item__list li {
  width: 23.4%;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__list li {
    width: 100%;
    max-width: 36.5vw;
    margin: 0 3vw;
    position: relative;
    overflow: visible;
  }
  .page .item__scroll .item__list li:last-child::after {
    position: absolute;
    content: "";
    top: 0;
    left: 100%;
    height: 1px;
    width: 3vw;
    background-color: transparent;
  }
  .page .item__scroll .item__list li:first-child {
    margin-left: 0;
  }
}
.page .item__scroll .item__list li .item__list__img {
  display: block;
  margin: 0 auto;
}
.page .item__scroll .item__list li .item__list__text {
  display: block;
  margin: 16px auto 0;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__list li .item__list__text {
    margin: 2.9vw auto 0;
  }
}
.page .item__scroll .item__list li .item__list__text .item--name {
  font-size: 13px;
  line-height: 1.5;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__list li .item__list__text .item--name {
    font-size: 3.6vw;
  }
}
@media screen and (min-width: 769px) {
  .page .item__scroll .item__list.item__list--2 {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .page .item__scroll .item__list.item__list--2 li {
    margin-right: 17px;
  }
  .page .item__scroll .item__list.item__list--2 li:last-child {
    margin-right: 0;
  }
}
.page .item__scroll .item__anchor {
  max-width: 980px;
  width: 100%;
  display: block;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 36px auto 0;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__anchor {
    margin: 5.2vw auto 0;
    width: 90%;
  }
}
.page .item__scroll .item__anchor .btn {
  position: relative;
  width: 47.5%;
  margin: 0 auto 20px;
  font-size: 14px;
  text-align: center;
  display: block;
  border-radius: 5px;
  border: solid 1px #333;
  color: #333;
  background-color: #ffffff;
  line-height: 50px;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__anchor .btn {
    width: 100%;
    font-size: 2.6vw;
    line-height: 6.5vw;
    margin: 0 auto 2vw;
  }
}
.page .item__scroll .item__anchor .btn .arrow_right {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  right: 3%;
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__anchor .btn .arrow_right {
    right: 5%;
  }
}
.page .item__scroll .item__anchor .btn .arrow_right:after {
  content: "";
  display: block;
  width: 5px;
  height: 5px;
  border: 1px solid;
  border-color: #333 #333 transparent transparent;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__anchor .btn .arrow_right:after {
    width: 1.3vw;
    height: 1.3vw;
  }
}
@media screen and (min-width: 769px) {
  .page .item__scroll .item__anchor__flex,
.page .item__scroll .item__anchor__flex3,
.page .item__scroll .item__anchor__flex4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
  }
  .page .item__scroll .item__anchor__flex .btn,
.page .item__scroll .item__anchor__flex3 .btn,
.page .item__scroll .item__anchor__flex4 .btn {
    margin: 0;
  }
}
@media screen and (min-width: 769px) {
  .page .item__scroll .item__anchor__flex3 .btn {
    width: 30%;
  }
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__anchor__flex4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}
@media screen and (min-width: 769px) {
  .page .item__scroll .item__anchor__flex4 .btn {
    width: 24%;
  }
}
@media screen and (max-width: 768px) {
  .page .item__scroll .item__anchor__flex4 .btn {
    width: 48%;
  }
}
.page .mask {
  margin: 80px auto 0;
  padding: 80px 0;
  background: #FFF0D6;
}
@media screen and (max-width: 768px) {
  .page .mask {
    margin: 14.7vw auto 0;
    padding: 11.5vw 0 12.5vw;
  }
}
.page .mask__title {
  text-align: center;
}
.page .mask__title h2 {
  font-size: 24px;
  font-weight: 600;
  color: #F27500;
}
@media screen and (max-width: 768px) {
  .page .mask__title h2 {
    font-size: 5.2vw;
  }
}
.page .mask__bnr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin: 40px auto 0;
}
.page .mask__bnr a {
  max-width: 652px;
}