@charset "UTF-8";
/*!===========================
style.cssはSassから生成されていますので、
直接編集しないようご注意ください。
===========================*/
@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500&family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@500&display=swap");
@import url("https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css");
@import url("https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick-theme.css");
@import url("https://unpkg.com/aos@2.3.1/dist/aos.css");
html, body, p, ol, ul, li, dl, dt, dd, blockquote, figure, fieldset, legend, textarea, pre, iframe, hr, h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0; }

html {
  -webkit-text-size-adjust: 100%; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

ul, ol {
  list-style: none; }

button, input, select, textarea {
  margin: 0; }

html, * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

*,
::before,
::after {
  background-repeat: no-repeat;
  box-sizing: inherit; }

img, embed, iframe, object, audio, video {
  height: auto;
  max-width: 100%; }

img {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  vertical-align: bottom; }

iframe {
  border: 0; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0;
  text-align: left; }

article,
aside,
figcaption,
figure,
footer,
header,
main,
nav,
section {
  display: block; }

a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }

a:active,
a:hover {
  outline-width: 0; }

b,
strong {
  font-weight: bold; }

.clear {
  clear: both; }

.cf:before, .cf:after {
  content: "";
  display: block; }

.cf:after {
  clear: both; }

.cf {
  zoom: 1;
  overflow: hidden; }

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

.table_w {
  width: 100%;
  display: table;
  table-layout: fixed; }

.table_c {
  display: table-cell;
  vertical-align: top; }

.fa {
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.align_center {
  text-align: center !important; }

.align_left {
  text-align: left !important; }

.align_right {
  text-align: right !important; }

.flex {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start; }

/* ===================================================================
	utility
=================================================================== */
.mt05 {
  margin-top: 5px; }

.mt10 {
  margin-top: 10px; }

.mt20 {
  margin-top: 20px; }

.mt30 {
  margin-top: 30px; }

.mt40 {
  margin-top: 40px; }

.mt50 {
  margin-top: 50px; }

.mt60 {
  margin-top: 60px; }

.txt_c {
  text-align: center; }

/* ===================================================================
	form
=================================================================== */
button,
input,
optgroup,
select,
textarea {
  margin: 0;
  font: inherit;
  color: inherit; }

button {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled],
html input[disabled] {
  cursor: default; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0; }

input {
  line-height: normal; }

input[type="checkbox"],
input[type="radio"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

input[type="search"] {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-appearance: textfield; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

fieldset {
  padding: .35em .625em .75em;
  margin: 0 2px;
  border: 1px solid #c0c0c0; }

legend {
  padding: 0;
  border: 0; }

textarea {
  overflow: auto; }

optgroup {
  font-weight: bold; }

@media only screen and (min-width: 769px) {
  .sp {
    display: none !important; } }
@media only screen and (max-width: 768px) {
  .pc {
    display: none !important; }

  .sp {
    display: block !important; } }
.serif {
  font-family: 'Noto Serif JP', serif; }

.en {
  font-family: 'Cinzel', serif; }

html {
  font-size: 62.5%; }
  @media only screen and (max-width: 768px) {
    html {
      font-size: 50%; } }

body {
  background: #550b14;
  font-size: 1.6em;
  color: #525252;
  font-family: "Noto Sans JP", sans-serif;
  -webkit-font-smoothing: antialiased;
  line-height: 1.6; }
  @media only screen and (max-width: 768px) {
    body {
      overflow-x: hidden; } }

a {
  color: #525252; }

@media only screen and (min-width: 769px) {
  a:hover {
    color: #525252;
    text-decoration: none; }

  a, a img {
    -moz-transition: 0.3s;
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
    transition: 0.3s; }

  a img:hover {
    filter: alpha(opacity=75);
    -moz-opacity: 0.75;
    opacity: 0.75; } }
.header .logo, .header .header_btn {
  position: fixed;
  top: 0;
  z-index: 50; }
.header .logo {
  left: 0;
  width: 100px; }
  @media only screen and (max-width: 768px) {
    .header .logo {
      width: 80px; } }
.header .header_btn {
  right: 0;
  background: rgba(142, 130, 99, 0.9);
  background: rgba(126, 105, 97, 0.9);
  padding: 10px 15px 15px;
  -webkit-display: flex;
  -moz-display: flex;
  -ms-display: flex;
  -o-display: flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -o-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -o-justify-content: center;
  justify-content: center;
  color: #fff; }
  .header .header_btn .heading {
    text-align: center;
    font-size: 13px;
    font-size: 1.3rem;
    margin-bottom: 5px; }
  .header .header_btn .reserve ul {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center; }
    .header .header_btn .reserve ul li {
      margin-left: 8px; }
      .header .header_btn .reserve ul li:first-child {
        margin-left: 0; }
  .header .header_btn .contact {
    margin-left: 20px; }
  .header .header_btn .official {
    margin-left: 20px; }
  .header .header_btn a {
    display: block;
    font-size: 14px;
    font-size: 1.4rem;
    color: #fff;
    text-align: center;
    overflow: hidden;
    text-decoration: none;
    padding: 2px 10px;
    border: 1px solid rgba(255, 255, 255, 0.7);
    position: relative;
    -webkit-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    -o-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
    .header .header_btn a:before {
      content: " ";
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      width: 0;
      left: auto;
      right: 0;
      z-index: -1;
      background-color: #fff;
      transition-duration: 0.5s;
      transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
      -ms-transition-duration: 0.5s;
      -ms-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
      -webkit-transition-duration: 0.5s;
      -webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
      -moz-transition-duration: 0.5s;
      -moz-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1); }
    @media only screen and (min-width: 769px) {
      .header .header_btn a:hover {
        color: #8e8263; }
        .header .header_btn a:hover::before {
          width: 100%;
          right: auto;
          left: 0; } }

.slick-dots {
  bottom: -50px; }
  .slick-dots li {
    margin: 0 2px; }
    .slick-dots li button::before {
      opacity: 1;
      content: "";
      width: 10px;
      height: 10px;
      background: #ddd;
      border-radius: 100%;
      -moz-border-radius: 100%;
      -webkit-border-radius: 100%;
      -o-border-radius: 100%;
      -ms-border-radius: 100%; }
    .slick-dots li.slick-active button:before {
      background: #968c70; }

@media only screen and (max-width: 768px) {
  .index {
    overflow-x: hidden; } }
@media only screen and (min-width: 769px) {
  .index {
    min-width: 1000px;
    margin: auto; } }
.index .anchor {
  margin-top: -80px;
  padding-top: 80px; }
  @media only screen and (max-width: 768px) {
    .index .anchor {
      margin-top: -120px;
      padding-top: 120px; }
      .index .anchor#collection {
        margin-top: 0;
        padding-top: 0; } }
.index .main_ttl {
  color: #fff;
  font-size: 20px;
  font-size: 2rem;
  letter-spacing: 0.06em; }
  @media only screen and (max-width: 768px) {
    .index .main_ttl {
      font-size: 4.5vw; } }
  .index .main_ttl span {
    display: block;
    font-size: 60px;
    font-size: 6rem; }
    @media only screen and (max-width: 768px) {
      .index .main_ttl span {
        font-size: 10vw;
        line-height: 1.2; } }
.index .fixed_btn_sp {
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  background: rgba(126, 105, 97, 0.9);
  padding: 10px 15px 15px;
  color: #fff;
  z-index: 30;
  display: none; }
  @media only screen and (min-width: 769px) {
    .index .fixed_btn_sp {
      display: none; } }
  .index .fixed_btn_sp .wrap {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center; }
  .index .fixed_btn_sp .official {
    width: 100px;
    margin-left: 15px; }
    .index .fixed_btn_sp .official a {
      display: block;
      font-size: 18px;
      font-size: 1.8rem;
      color: #fff;
      text-align: center;
      overflow: hidden;
      text-decoration: none;
      padding: 2px 10px;
      border: 1px solid rgba(255, 255, 255, 0.7);
      position: relative;
      -webkit-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      -o-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
      .index .fixed_btn_sp .official a:before {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        width: 0;
        left: auto;
        right: 0;
        z-index: -1;
        background-color: #fff;
        transition-duration: 0.5s;
        transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
        -ms-transition-duration: 0.5s;
        -ms-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
        -webkit-transition-duration: 0.5s;
        -webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
        -moz-transition-duration: 0.5s;
        -moz-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1); }
  .index .fixed_btn_sp .heading {
    text-align: center;
    font-size: 16px;
    font-size: 1.6rem;
    margin-bottom: 5px; }
  .index .fixed_btn_sp .reserve {
    width: calc(100% - 54px);
    padding-right: 25px; }
    .index .fixed_btn_sp .reserve a {
      display: block;
      font-size: 18px;
      font-size: 1.8rem;
      color: #fff;
      font-weight: 700;
      background: #550b14;
      text-align: center;
      overflow: hidden;
      text-decoration: none;
      padding: 2px 20px;
      border: 1px solid rgba(255, 255, 255, 0.7);
      position: relative;
      -webkit-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      -o-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
      .index .fixed_btn_sp .reserve a:before {
        content: " ";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        width: 0;
        left: auto;
        right: 0;
        z-index: -1;
        background-color: #fff;
        transition-duration: 0.5s;
        transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
        -ms-transition-duration: 0.5s;
        -ms-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
        -webkit-transition-duration: 0.5s;
        -webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
        -moz-transition-duration: 0.5s;
        -moz-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1); }
  .index .fixed_btn_sp .reserve ul {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center; }
    .index .fixed_btn_sp .reserve ul li {
      margin-left: 12px; }
      .index .fixed_btn_sp .reserve ul li:first-child {
        margin-left: 0; }
      .index .fixed_btn_sp .reserve ul li a {
        display: block;
        font-size: 18px;
        font-size: 1.8rem;
        color: #fff;
        text-align: center;
        overflow: hidden;
        text-decoration: none;
        padding: 2px 20px;
        border: 1px solid rgba(255, 255, 255, 0.7);
        position: relative;
        -webkit-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
        -o-transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
        transition: 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
        .index .fixed_btn_sp .reserve ul li a:before {
          content: " ";
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          width: 0;
          left: auto;
          right: 0;
          z-index: -1;
          background-color: #fff;
          transition-duration: 0.5s;
          transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
          -ms-transition-duration: 0.5s;
          -ms-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
          -webkit-transition-duration: 0.5s;
          -webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
          -moz-transition-duration: 0.5s;
          -moz-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1); }
  .index .fixed_btn_sp .contact {
    width: 54px; }
    .index .fixed_btn_sp .contact .ico {
      width: 54px; }
    .index .fixed_btn_sp .contact .txt {
      padding-right: 10px;
      font-size: 17px;
      font-size: 1.7rem; }
.index .fixed_ig {
  position: fixed;
  z-index: 10;
  right: 15px;
  top: 15px;
  width: 40px; }
.index .slider {
  opacity: 0;
  transition: opacity .3s linear; }
  .index .slider.slick-initialized {
    opacity: 1; }
.index .fv {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  overflow: hidden; }
  @media only screen and (min-width: 769px) {
    .index .fv {
      background-image: url("img/fv_bg_m.jpg");
      padding-top: calc(694 / 1366 * 100%);
      min-height: 700px; } }
  @media screen and (min-width: 1600px) {
    .index .fv {
      background-image: url("img/fv_bg_l.jpg");
      padding-top: calc(1078 / 1920 * 100%); } }
  @media only screen and (max-width: 768px) {
    .index .fv {
      background-image: url("img/fv_bg_sp.jpg");
      padding-top: calc(1210 / 750 * 100%); } }
  .index .fv .wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 100px);
    height: calc(100% - 100px);
    z-index: 1; }
    @media only screen and (max-width: 768px) {
      .index .fv .wrap {
        width: calc(100% - 40px);
        height: calc(100% - 40px); } }
    .index .fv .wrap span {
      display: block;
      width: 100%;
      height: 100%;
      opacity: 0.7;
      /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1b78b3+0,ffe4b1+100 */
      background: linear-gradient(135deg, #1b78b3 0%, #ffe4b1 100%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#4b6ba9+0,ddd698+100 */
      background: linear-gradient(135deg, #7d6960 0%, #ccc0b2 100%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ }
  .index .fv .fv_txt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;
    text-align: center;
    color: #fff;
    width: 100%;
    line-height: 1.3;
    margin-top: 30px; }
    .index .fv .fv_txt .txt1 {
      font-size: 55px;
      font-size: 5.5rem;
      letter-spacing: 0.08em; }
      @media only screen and (max-width: 768px) {
        .index .fv .fv_txt .txt1 {
          font-size: 6.5vw; } }
      .index .fv .fv_txt .txt1 span {
        display: block;
        font-size: 80px;
        font-size: 8rem;
        letter-spacing: 0.1em; }
        @media only screen and (max-width: 768px) {
          .index .fv .fv_txt .txt1 span {
            font-size: 13vw;
            margin-bottom: 10px; } }
    .index .fv .fv_txt .txt2 {
      margin-top: 40px;
      font-size: 23px;
      font-size: 2.3rem; }
      @media only screen and (max-width: 768px) {
        .index .fv .fv_txt .txt2 {
          font-size: 3vw; } }
    .index .fv .fv_txt .txt3 {
      margin-top: 10px;
      font-size: 23px;
      font-size: 2.3rem; }
      @media only screen and (max-width: 768px) {
        .index .fv .fv_txt .txt3 {
          font-size: 3vw; } }
    .index .fv .fv_txt .txt4 {
      margin-top: 10px; }
      @media only screen and (max-width: 768px) {
        .index .fv .fv_txt .txt4 {
          font-size: 3vw; } }
  .index .fv .fv_ico {
    position: absolute;
    z-index: 6;
    width: 159px;
    top: 57.13%;
    left: 68.08%; }
    @media only screen and (max-width: 768px) {
      .index .fv .fv_ico {
        width: 33.2%;
        top: auto;
        bottom: 13px;
        left: 63.72%; } }
.index .anchor_link {
  padding: 40px 0;
  background: #000; }
  @media only screen and (max-width: 768px) {
    .index .anchor_link {
      padding: 0; } }
  .index .anchor_link ul {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center; }
    @media only screen and (min-width: 769px) {
      .index .anchor_link ul li {
        margin-left: 15px;
        padding-left: 15px;
        position: relative;
        line-height: 1; }
        .index .anchor_link ul li::before {
          content: "";
          position: absolute;
          left: 0;
          top: 0;
          width: 1px;
          height: 100%;
          background: #fff; }
        .index .anchor_link ul li:first-child {
          margin-left: 0;
          padding-left: 0; }
          .index .anchor_link ul li:first-child::before {
            display: none; } }
    @media only screen and (max-width: 768px) {
      .index .anchor_link ul li {
        width: 50%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.7); }
        .index .anchor_link ul li:nth-child(even) {
          border-right: 1px solid rgba(255, 255, 255, 0.7); } }
  .index .anchor_link a {
    color: #fff;
    display: block;
    text-decoration: none; }
    @media only screen and (min-width: 769px) {
      .index .anchor_link a:hover {
        color: #e46c01; } }
    @media screen and (min-width: 769px) and (max-width: 1100px) {
      .index .anchor_link a {
        font-size: 14px;
        font-size: 1.4rem; } }
    @media only screen and (max-width: 768px) {
      .index .anchor_link a {
        text-align: center;
        padding: 15px 0;
        font-size: 3.8vw; } }
.index .message {
  background: #f8f8f6;
  position: relative; }
  .index .message .txt {
    padding-top: 13.18%;
    padding-bottom: 14.65%;
    padding-left: 4.4%; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .message .txt {
        padding-top: 90px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .message .txt {
        padding-left: 30px; } }
    @media only screen and (max-width: 768px) {
      .index .message .txt {
        padding-bottom: 18.67%; } }
    .index .message .txt .ico {
      width: 382px; }
      @media only screen and (max-width: 768px) {
        .index .message .txt .ico {
          width: 72%; } }
    .index .message .txt h2 {
      color: #000;
      font-size: 45px;
      font-size: 4.5rem;
      font-size: 3.5vw;
      letter-spacing: 0.06em; }
      @media only screen and (max-width: 768px) {
        .index .message .txt h2 {
          font-size: 9.5vw;
          line-height: 1.4;
          letter-spacing: 0.1em;
          padding-left: 2.67%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .message .txt h2 {
      padding-left: 5px; } }

    .index .message .txt .lead {
      margin-top: 30px;
      font-size: 15px;
      font-size: 1.5rem; }
      @media only screen and (max-width: 768px) {
        .index .message .txt .lead {
          padding-left: 2.67%;
          font-size: 20px;
          font-size: 2rem; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .message .txt .lead {
      padding-left: 5px; } }

  .index .message .message_slide {
    width: 43.92%;
    max-width: 700px;
    position: absolute;
    top: 0;
    right: 0; }
  @media screen and (min-width: 769px) and (max-width: 1200px) {
    .index .message .txt {
      padding-top: 10.25%;
      padding-bottom: 11.72%; } }
  @media screen and (min-width: 769px) and (max-width: 1200px) and (min-width: 568px) and (max-width: 750px) {
    .index .message .txt {
      padding-top: 70px; } }
  @media screen and (min-width: 769px) and (max-width: 1200px) {
      .index .message .txt h2 {
        font-size: 38px;
        font-size: 3.8rem; } }
.index .voice {
  padding-top: 11vw;
  padding-bottom: 11.72%; }
  @media only screen and (max-width: 768px) {
    .index .voice {
      padding-top: 18.67%;
      padding-bottom: 18.67%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .voice {
      padding-top: 35px; } }

  .index .voice .main_ttl {
    text-align: center; }
  .index .voice .voice_slide {
    margin-top: 80px; }
    @media only screen and (max-width: 768px) {
      .index .voice .voice_slide {
        margin-top: 40px; } }
    .index .voice .voice_slide div {
      padding: 0 10px; }
      .index .voice .voice_slide div img {
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        -o-border-radius: 5px;
        -ms-border-radius: 5px; }
  .index .voice .slick-dots {
    bottom: -50px; }
    @media only screen and (max-width: 768px) {
      .index .voice .slick-dots {
        bottom: -70px;
        padding: 0 20px; } }
    .index .voice .slick-dots li {
      margin: 0 2px;
      width: 10px;
      height: 10px; }
      @media only screen and (max-width: 768px) {
        .index .voice .slick-dots li {
          width: 4px;
          height: 4px; } }
      .index .voice .slick-dots li button {
        width: 10px;
        height: 10px; }
        @media only screen and (max-width: 768px) {
          .index .voice .slick-dots li button {
            width: 4px;
            height: 4px; } }
      .index .voice .slick-dots li button::before {
        opacity: 1;
        content: "";
        width: 5px;
        height: 5px;
        background: #ddd;
        border-radius: 100%;
        -moz-border-radius: 100%;
        -webkit-border-radius: 100%;
        -o-border-radius: 100%;
        -ms-border-radius: 100%; }
        @media only screen and (max-width: 768px) {
          .index .voice .slick-dots li button::before {
            width: 4px;
            height: 4px; } }
      .index .voice .slick-dots li.slick-active button:before {
        background: #968c70; }
.index .collection {
  background: #222;
  background: #ccc0b2;
  background: rgba(204, 192, 178, 0.9);
  background: #7e6961;
  position: relative; }
  .index .collection::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 29.72%;
    background: #395a9a;
    background: #7e6961;
    z-index: 1; }
    @media only screen and (max-width: 768px) {
      .index .collection::before {
        width: 76.8%;
        background: #222;
        background: #7e6961;
        left: auto;
        right: 0; } }
  .index .collection .container {
    position: relative;
    z-index: 5; }
  .index .collection .main_ttl {
    position: absolute;
    right: 7.33%;
    top: -45px;
    text-align: right; }
    @media only screen and (max-width: 768px) {
      .index .collection .main_ttl {
        position: relative;
        padding-top: 24%;
        text-align: center;
        z-index: 10;
        top: 0;
        right: auto;
        width: 100%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .collection .main_ttl {
      padding-top: 45px; } }

  .index .collection .inner {
    max-width: 1300px;
    margin: auto;
    padding-top: 8.79%;
    padding-bottom: 10.25%;
    padding-left: 7.33%;
    padding-right: 7.33%; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .collection .inner {
        padding-top: 60px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .collection .inner {
        padding-left: 50px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .collection .inner {
        padding-right: 50px; } }
    @media only screen and (max-width: 768px) {
      .index .collection .inner {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: 18.67%; } }
  .index .collection ul {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -ms-justify-content: flex-start;
    -o-justify-content: flex-start;
    justify-content: flex-start; }
    .index .collection ul li {
      width: calc((100% - 4%) / 3);
      margin-left: 2%;
      margin-top: 20px; }
      @media only screen and (max-width: 768px) {
        .index .collection ul li {
          width: calc((100% - 3%) / 3);
          margin-left: 1.5%;
          margin-top: 5px; } }
      .index .collection ul li:nth-child(3n+1) {
        margin-left: 0; }
      .index .collection ul li:nth-child(1), .index .collection ul li:nth-child(2), .index .collection ul li:nth-child(3) {
        margin-top: 0; }
  .index .collection .price_section {
    margin-top: 40px;
    color: #fff; }
    @media only screen and (max-width: 768px) {
      .index .collection .price_section {
        padding-left: 7.33%;
        padding-right: 7.33%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .collection .price_section {
      padding-left: 50px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .collection .price_section {
      padding-right: 50px; } }

    .index .collection .price_section .heading {
      text-align: center;
      font-size: 20px;
      font-size: 2rem; }
    .index .collection .price_section table {
      width: 700px;
      margin: 20px auto 0;
      border: 1px solid #fff; }
      @media only screen and (max-width: 768px) {
        .index .collection .price_section table {
          width: 100%; } }
      .index .collection .price_section table th, .index .collection .price_section table td {
        border: 1px solid #fff;
        padding: 1em;
        width: 50%; }
      .index .collection .price_section table th {
        background: #333;
        background: #395a9a;
        background: #7e6961; }
      .index .collection .price_section table td {
        font-weight: 700;
        font-size: 19px;
        font-size: 1.9rem;
        background: #ccc0b2;
        color: #7e6961;
        color: #000; }
    .index .collection .price_section .remarks {
      width: 700px;
      margin: 15px auto 0; }
.index .value {
  background: #222;
  background: #7e6961;
  background: #550b14;
  position: relative; }
  .index .value::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 29.72%;
    background: #550b14;
    z-index: 1; }
    @media only screen and (max-width: 768px) {
      .index .value::before {
        width: 35.46%;
        background: #395a9a;
        background: #550b14;
        left: auto;
        right: 0; } }
  .index .value .main_ttl span {
    display: inline-block;
    margin-right: 30px; }
    @media only screen and (max-width: 768px) {
      .index .value .main_ttl span {
        display: block; } }
  .index .value .top_heading {
    width: 790px;
    margin: 40px auto 60px; }
    @media only screen and (max-width: 768px) {
      .index .value .top_heading {
        width: 90%;
        margin-bottom: 40px; } }
  .index .value .container {
    position: relative;
    z-index: 5; }
  .index .value .inner {
    max-width: 1300px;
    margin: auto;
    padding-top: 8.79%;
    padding-bottom: 14.65%;
    padding-left: 7.33%;
    padding-right: 7.33%; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .value .inner {
        padding-top: 60px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .value .inner {
        padding-left: 50px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .value .inner {
        padding-right: 50px; } }
    @media only screen and (max-width: 768px) {
      .index .value .inner {
        padding-top: 21.34%;
        padding-bottom: 32%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .value .inner {
      padding-top: 40px; } }

  .index .value ul {
    margin-top: 40px; }
    .index .value ul li {
      margin-top: 80px; }
      @media only screen and (max-width: 768px) {
        .index .value ul li {
          margin-top: 50px; } }
      .index .value ul li:first-child {
        margin-top: 0; }
  .index .value .wrap {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    -o-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -o-align-items: center;
    align-items: center; }
    @media only screen and (max-width: 768px) {
      .index .value .wrap {
        display: block; } }
    .index .value .wrap .image {
      width: 36.56%; }
      @media only screen and (max-width: 768px) {
        .index .value .wrap .image {
          width: 100%; } }
    .index .value .wrap .txt {
      width: 63.43%;
      padding-left: 30px;
      color: #fff; }
      @media only screen and (max-width: 768px) {
        .index .value .wrap .txt {
          width: 100%;
          padding: 15px 0 0; } }
      .index .value .wrap .txt .number {
        font-size: 20px;
        font-size: 2rem;
        letter-spacing: 0.08em; }
        @media only screen and (max-width: 768px) {
          .index .value .wrap .txt .number {
            font-size: 24px;
            font-size: 2.4rem; } }
      .index .value .wrap .txt .heading {
        font-size: 28px;
        font-size: 2.8rem; }
        @media only screen and (max-width: 768px) {
          .index .value .wrap .txt .heading {
            font-size: 5.8vw; } }
      .index .value .wrap .txt .lead {
        margin-top: 10px;
        font-size: 15px;
        font-size: 1.5rem; }
        @media only screen and (max-width: 768px) {
          .index .value .wrap .txt .lead {
            font-size: 19px;
            font-size: 1.9rem;
            line-height: 1.8; } }
.index .campaign {
  background: #ccc0b2;
  padding-left: 7.33%;
  padding-right: 7.33%; }
  @media print, screen and (min-width: 568px) and (max-width: 750px) {
    .index .campaign {
      padding-left: 50px; } }
  @media print, screen and (min-width: 568px) and (max-width: 750px) {
    .index .campaign {
      padding-right: 50px; } }
  @media only screen and (max-width: 768px) {
    .index .campaign {
      padding-left: 4%;
      padding-right: 4%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .campaign {
      padding-left: 7.5px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .campaign {
      padding-right: 7.5px; } }

  .index .campaign .main_ttl {
    text-align: center;
    color: #000; }
  .index .campaign .inner {
    max-width: 780px;
    padding-top: 8.79%;
    padding-bottom: 8.79%;
    margin: auto; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .campaign .inner {
        padding-top: 60px; } }
    @media only screen and (max-width: 768px) {
      .index .campaign .inner {
        padding-top: 21.34%;
        padding-bottom: 26.67%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .campaign .inner {
      padding-top: 40px; } }

  .index .campaign ul {
    margin-top: 60px; }
    @media only screen and (max-width: 768px) {
      .index .campaign ul {
        margin-top: 30px; } }
    .index .campaign ul li {
      margin-top: 50px; }
      @media only screen and (max-width: 768px) {
        .index .campaign ul li {
          margin-top: 25px; } }
      .index .campaign ul li:first-child {
        margin-top: 0; }
.index .gallery {
  background: #d7d3c9;
  padding-top: 21.34%;
  padding-bottom: 16%; }
  @media print, screen and (min-width: 568px) and (max-width: 750px) {
    .index .gallery {
      padding-top: 40px; } }
  .index .gallery .main_ttl {
    text-align: center;
    color: #525252; }
  .index .gallery .gallery_slide {
    margin-top: 40px; }
  .index .gallery .slick-dots {
    bottom: -40px; }
    .index .gallery .slick-dots li {
      margin: 0; }
      .index .gallery .slick-dots li button::before {
        opacity: 1;
        content: "";
        width: 8px;
        height: 8px;
        background: #fff;
        border-radius: 100%;
        -moz-border-radius: 100%;
        -webkit-border-radius: 100%;
        -o-border-radius: 100%;
        -ms-border-radius: 100%; }
      .index .gallery .slick-dots li.slick-active button:before {
        background: #212836; }
.index .flow {
  background: #7e6961;
  position: relative; }
  .index .flow::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 42.89%;
    background: #7e6961;
    z-index: 1; }
    @media only screen and (max-width: 768px) {
      .index .flow::before {
        width: 36%; } }
  .index .flow .container {
    position: relative;
    z-index: 5; }
  @media only screen and (max-width: 768px) {
    .index .flow .main_ttl {
      padding-left: 2.67%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .flow .main_ttl {
      padding-left: 5px; } }

  .index .flow .inner {
    max-width: 1300px;
    margin: auto;
    padding-top: 8.79%;
    padding-bottom: 14.65%;
    padding-left: 7.33%;
    padding-right: 7.33%; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .flow .inner {
        padding-top: 60px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .flow .inner {
        padding-left: 50px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .flow .inner {
        padding-right: 50px; } }
    @media only screen and (max-width: 768px) {
      .index .flow .inner {
        padding-top: 26.67%;
        padding-bottom: 34.67%;
        padding-left: 2.67%;
        padding-right: 5.34%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .flow .inner {
      padding-top: 50px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .flow .inner {
      padding-left: 5px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .flow .inner {
      padding-right: 10px; } }

  .index .flow ul {
    margin-top: 80px;
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -ms-justify-content: flex-start;
    -o-justify-content: flex-start;
    justify-content: flex-start; }
    @media only screen and (max-width: 768px) {
      .index .flow ul {
        margin-top: 50px; } }
    .index .flow ul li {
      width: calc((100% - 6%) / 3);
      margin-left: 3%;
      margin-top: 60px;
      text-align: center;
      color: #fff; }
      @media only screen and (max-width: 768px) {
        .index .flow ul li {
          text-align: left;
          margin-top: 40px; } }
      .index .flow ul li:nth-child(3n+1) {
        margin-left: 0; }
      .index .flow ul li:nth-child(1), .index .flow ul li:nth-child(2), .index .flow ul li:nth-child(3) {
        margin-top: 0; }
      .index .flow ul li .image {
        position: relative; }
        .index .flow ul li .image::before {
          content: "";
          position: absolute;
          left: 0;
          top: -25px;
          font-size: 30px;
          font-size: 3rem;
          letter-spacing: 0.08em;
          color: #fff;
          z-index: 1;
          font-family: 'Cinzel', serif; }
          @media only screen and (max-width: 768px) {
            .index .flow ul li .image::before {
              font-size: 24px;
              font-size: 2.4rem;
              top: -20px; } }
      .index .flow ul li:nth-child(1) .image::before {
        content: "01"; }
      .index .flow ul li:nth-child(2) .image::before {
        content: "02"; }
      .index .flow ul li:nth-child(3) .image::before {
        content: "03"; }
      .index .flow ul li:nth-child(4) .image::before {
        content: "04"; }
      .index .flow ul li:nth-child(5) .image::before {
        content: "05"; }
      .index .flow ul li:nth-child(6) .image::before {
        content: "06"; }
  .index .flow .heading {
    margin-top: 20px;
    font-size: 24px;
    font-size: 2.4rem; }
    @media only screen and (max-width: 768px) {
      .index .flow .heading {
        font-size: 3.5vw;
        margin-top: 15px;
        text-align: center; } }
  .index .flow .txt {
    margin-top: 15px;
    font-size: 14px;
    font-size: 1.4rem; }
    @media only screen and (max-width: 768px) {
      .index .flow .txt {
        margin-top: 10px;
        font-size: 11px;
        font-size: 1.1rem; } }
  .index .flow .remarks {
    margin-top: 15px;
    font-size: 12px;
    font-size: 1.2rem; }
    @media only screen and (max-width: 768px) {
      .index .flow .remarks {
        font-size: 10px;
        font-size: 1rem;
        margin-top: 8px; } }
.index .faq {
  background: #fffffc;
  position: relative; }
  .index .faq .inner {
    max-width: 1300px;
    margin: auto;
    padding-top: 8.79%;
    padding-bottom: 8.79%;
    padding-left: 7.33%;
    padding-right: 7.33%; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .faq .inner {
        padding-top: 60px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .faq .inner {
        padding-left: 50px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .faq .inner {
        padding-right: 50px; } }
    @media only screen and (max-width: 768px) {
      .index .faq .inner {
        padding-top: 16%;
        padding-bottom: 21.34%;
        padding-left: 5.34%;
        padding-right: 5.34%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .faq .inner {
      padding-top: 30px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .faq .inner {
      padding-left: 10px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .faq .inner {
      padding-right: 10px; } }

  .index .faq .ttl_wrap {
    background: #000;
    position: absolute;
    z-index: 1;
    padding-left: 7.33%;
    padding-top: 15px;
    padding-bottom: 15px;
    width: 63.17%;
    left: 0;
    top: -60px; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .faq .ttl_wrap {
        padding-left: 50px; } }
    @media only screen and (max-width: 768px) {
      .index .faq .ttl_wrap {
        width: 76.8%;
        padding-left: 5.34%;
        top: -40px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .faq .ttl_wrap {
      padding-left: 10px; } }

    .index .faq .ttl_wrap .main_ttl span {
      display: inline-block;
      vertical-align: middle; }
      @media only screen and (min-width: 769px) {
        .index .faq .ttl_wrap .main_ttl span {
          margin-right: 60px;
          font-size: 56px;
          font-size: 5.6rem; } }
      @media only screen and (max-width: 768px) {
        .index .faq .ttl_wrap .main_ttl span {
          margin-right: 20px; } }
  .index .faq ul li {
    border-bottom: 1px solid #B5B4AC;
    padding-top: 30px;
    padding-bottom: 30px;
    font-size: 15px;
    font-size: 1.5rem; }
    .index .faq ul li .question, .index .faq ul li .answer {
      position: relative;
      padding-left: 80px; }
      @media only screen and (max-width: 768px) {
        .index .faq ul li .question, .index .faq ul li .answer {
          padding-top: 2em;
          padding-left: 0;
          font-size: 18px;
          font-size: 1.8rem; } }
      .index .faq ul li .question::before, .index .faq ul li .answer::before {
        content: "";
        position: absolute;
        left: 0;
        top: -6px;
        font-size: 40px;
        font-size: 4rem;
        font-family: 'Cinzel', serif;
        z-index: 1;
        line-height: 1;
        font-weight: 500; }
    .index .faq ul li .question {
      cursor: pointer; }
      @media only screen and (max-width: 768px) {
        .index .faq ul li .question {
          padding-top: 2.5em; } }
      .index .faq ul li .question::before {
        content: "Q"; }
      .index .faq ul li .question::after {
        content: "";
        right: 10px;
        width: 14px;
        height: 14px;
        border: 0px;
        border-top: solid 2px #5F5E5C;
        border-right: solid 2px #5F5E5C;
        -ms-transform: rotate(135deg);
        -webkit-transform: rotate(135deg);
        transform: rotate(135deg);
        position: absolute;
        top: 50%;
        margin-top: -10px;
        -moz-transition: 0.3s;
        -webkit-transition: 0.3s;
        -o-transition: 0.3s;
        -ms-transition: 0.3s;
        transition: 0.3s; }
        @media only screen and (max-width: 768px) {
          .index .faq ul li .question::after {
            top: 0;
            margin-top: 0; } }
      .index .faq ul li .question.active::after {
        -ms-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg); }
    .index .faq ul li .answer {
      margin-top: 40px; }
      @media only screen and (max-width: 768px) {
        .index .faq ul li .answer {
          margin-top: 30px; } }
      .index .faq ul li .answer::before {
        content: "A";
        color: #95814c; }
  .index .faq .lower_txt {
    margin-top: 50px;
    text-align: center; }
.index .access {
  background: #191f2c;
  background: #550b14;
  position: relative; }
  .index .access .inner {
    padding-top: 8.79%;
    padding-bottom: 8.79%;
    padding-left: 7.33%;
    padding-right: 7.33%; }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .access .inner {
        padding-top: 60px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .access .inner {
        padding-left: 50px; } }
    @media print, screen and (min-width: 568px) and (max-width: 750px) {
      .index .access .inner {
        padding-right: 50px; } }
    @media only screen and (max-width: 768px) {
      .index .access .inner {
        padding-top: 26.67%;
        padding-bottom: 34.67%;
        padding-left: 8%;
        padding-right: 8%; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .access .inner {
      padding-top: 50px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .access .inner {
      padding-left: 15px; } }
  @media only screen and (max-width: 768px) and (min-width: 568px) and (max-width: 750px) {
    .index .access .inner {
      padding-right: 15px; } }

  .index .access .wrap {
    -webkit-display: flex;
    -moz-display: flex;
    -ms-display: flex;
    -o-display: flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -moz-justify-content: flex-start;
    -ms-justify-content: flex-start;
    -o-justify-content: flex-start;
    justify-content: flex-start; }
    @media only screen and (max-width: 768px) {
      .index .access .wrap {
        position: relative;
        display: block;
        padding-bottom: 32%; } }
    .index .access .wrap .left {
      width: 30.14%; }
      @media only screen and (max-width: 768px) {
        .index .access .wrap .left {
          width: 100%; } }
      .index .access .wrap .left .sns {
        margin-top: 50px; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .left .sns {
            margin-top: 0;
            position: absolute;
            width: 100%;
            left: 0;
            bottom: 0; } }
        .index .access .wrap .left .sns ul {
          -webkit-display: flex;
          -moz-display: flex;
          -ms-display: flex;
          -o-display: flex;
          display: flex;
          -webkit-flex-wrap: wrap;
          -moz-flex-wrap: wrap;
          -ms-flex-wrap: wrap;
          -o-flex-wrap: wrap;
          flex-wrap: wrap;
          -webkit-justify-content: flex-start;
          -moz-justify-content: flex-start;
          -ms-justify-content: flex-start;
          -o-justify-content: flex-start;
          justify-content: flex-start; }
          @media only screen and (max-width: 768px) {
            .index .access .wrap .left .sns ul {
              -webkit-justify-content: center;
              -moz-justify-content: center;
              -ms-justify-content: center;
              -o-justify-content: center;
              justify-content: center; } }
          .index .access .wrap .left .sns ul li {
            margin-left: 22px; }
            .index .access .wrap .left .sns ul li:first-child {
              margin-left: 0; }
            .index .access .wrap .left .sns ul li img {
              height: 21px; }
    .index .access .wrap .right {
      width: 69.85%;
      color: #fff; }
      @media only screen and (max-width: 768px) {
        .index .access .wrap .right {
          width: 100%;
          margin-top: 40px; } }
      .index .access .wrap .right a {
        color: #fff;
        text-decoration: none; }
        @media only screen and (min-width: 769px) {
          .index .access .wrap .right a:hover {
            text-decoration: underline; } }
      .index .access .wrap .right ul li {
        padding: 50px 0;
        border-bottom: 1px solid #fff;
        position: relative; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right ul li {
            padding: 40px 0 20px; } }
        .index .access .wrap .right ul li:first-child {
          padding-top: 20px; }
      .index .access .wrap .right .wrap2 {
        -webkit-display: flex;
        -moz-display: flex;
        -ms-display: flex;
        -o-display: flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -moz-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        -o-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        -o-justify-content: center;
        justify-content: center; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right .wrap2 {
            display: block; } }
        .index .access .wrap .right .wrap2 .image {
          width: 40%; }
          @media only screen and (max-width: 768px) {
            .index .access .wrap .right .wrap2 .image {
              width: 100%; } }
        .index .access .wrap .right .wrap2 .txt {
          width: 60%;
          padding-left: 30px; }
          @media only screen and (max-width: 768px) {
            .index .access .wrap .right .wrap2 .txt {
              width: 100%;
              padding: 20px 0 0; } }
      .index .access .wrap .right .txt1 {
        font-size: 20px;
        font-size: 2rem;
        font-weight: 700; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right .txt1 {
            font-size: 25px;
            font-size: 2.5rem; } }
      .index .access .wrap .right .txt2 {
        font-size: 15px;
        font-size: 1.5rem;
        font-weight: 700;
        margin-top: 10px; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right .txt2 {
            font-size: 19px;
            font-size: 1.9rem; } }
        .index .access .wrap .right .txt2 span {
          display: block;
          font-size: 12px;
          font-size: 1.2rem;
          font-weight: 400; }
          @media only screen and (max-width: 768px) {
            .index .access .wrap .right .txt2 span {
              font-size: 13px;
              font-size: 1.3rem;
              margin-top: 5px; } }
      .index .access .wrap .right .txt3 {
        font-size: 15px;
        font-size: 1.5rem;
        margin-top: 20px; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right .txt3 {
            font-size: 19px;
            font-size: 1.9rem; } }
      .index .access .wrap .right .txt4 {
        font-size: 15px;
        font-size: 1.5rem;
        margin-top: 20px; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right .txt4 {
            font-size: 19px;
            font-size: 1.9rem; } }
      .index .access .wrap .right .map {
        position: absolute;
        z-index: 1;
        right: 0;
        bottom: 50px; }
        @media only screen and (max-width: 768px) {
          .index .access .wrap .right .map {
            position: static;
            margin-top: 15px; } }
        .index .access .wrap .right .map a {
          display: block;
          width: 60px;
          height: 60px;
          border: 1px solid rgba(255, 255, 255, 0.7);
          border-radius: 100%;
          -moz-border-radius: 100%;
          -webkit-border-radius: 100%;
          -o-border-radius: 100%;
          -ms-border-radius: 100%;
          position: relative; }
          .index .access .wrap .right .map a::before {
            content: "";
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 16px;
            height: 100%;
            background-image: url("img/ico_map.png");
            background-repeat: no-repeat;
            background-position: center center;
            background-size: 100% auto;
            pointer-events: none;
            -moz-transition: 0.3s;
            -webkit-transition: 0.3s;
            -o-transition: 0.3s;
            -ms-transition: 0.3s;
            transition: 0.3s; }
          @media only screen and (min-width: 769px) {
            .index .access .wrap .right .map a:hover {
              background: #fff;
              border-color: #fff; }
              .index .access .wrap .right .map a:hover::before {
                background-image: url("img/ico_map_active.png"); } }
  .index .access .bottom_txt {
    margin-top: 120px;
    text-align: center; }
    @media only screen and (max-width: 768px) {
      .index .access .bottom_txt {
        margin-top: 80px; } }
    .index .access .bottom_txt a {
      text-decoration: none;
      font-size: 14px;
      font-size: 1.4rem;
      color: rgba(255, 255, 255, 0.5); }

.copyright {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  position: fixed;
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  color: #fff;
  font-size: 9px;
  font-size: 0.9rem; }
  @media only screen and (max-width: 768px) {
    .copyright {
      right: 3px;
      margin-top: -20px; } }