@charset 'utf-8';

/* reset
------------------------------------------------ */
body,div,pre,p,a,img,form,fieldset,input,textarea,select,option,
dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,table,th,td,embed,object,
figure,figcaption {
  margin: 0;
  padding: 0;
}
html { height: 100vh; font-size: 62.5%; }
body {
  width: 100%;
  height: 100%;
  background: #fff;
  -webkit-text-size-adjust: 100%;
  font-family: '游ゴシック体', YuGothic, '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック', 'Yu Gothic', 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo', 'メイリオ', 'ＭＳ Ｐゴシック', 'MS P Gothic', Osaka, Arial, Helvetica, Verdana, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  color: #534741;
}

.f-Overpass { font-family: 'Overpass', sans-serif; }

*,
*:before,
*:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; letter-spacing: 0.08em; }

ul,ol { list-style: none; }
img { width: auto; height: auto; max-width: 100%; border: none; vertical-align: top; }
picture { display: block; position: relative; width: 100%; }
.object-fit-img { width: 100%; height: 100%; max-width: inherit; object-fit: cover; font-family: 'object-fit: cover;'; }
a { text-decoration: none; color: #534741; }
.device-click a { transition: ease 0.4s; }
.device-click a:hover { opacity: 0.8; }

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

@media screen and (min-width: 769px) {
  *,
  *:before,
  *:after { letter-spacing: 0.08em; }
  .visible-sp { display: none !important; }
  .visible-pc { display: inherit !important; }
}

/* clearfix
------------------------------------------------ */
.clearfix { clear: both; *zoom: 1; }
.clearfix:before,.clearfix:after { content: ' '; display: table; }
.clearfix:after { clear: both; }

/* icon
------------------------------------------------ */
.i { display: block; position: relative; text-indent: -9999px; white-space: nowrap; overflow: hidden; }
.i-arrow { width: 26px; height: 6px; }
.i-arrow::before,
.i-arrow::after { content: ''; position: absolute; right: 0; height: 1px; background-color: #736357; }
.i-arrow::before { top: 1px; transform: rotate(45deg); width: 10px; }
.i-arrow::after { bottom: 0; width: 100%; }
.i-blank { width: 16px; height: 12px; }
.i-blank::before,
.i-blank::after { content: ''; position: absolute; width: 11px; height: 8px; border: 1px solid #534741; border-radius: 1px; }
.i-blank::before { top: 0; left: 0; }
.i-blank::after { bottom: 0; right: 0; }

.i-c-white.i-arrow::before,
.i-c-white.i-arrow::after { background-color: #fff; }
.i-c-white.i-blank::before,
.i-c-white.i-blank::after { border-color: #fff; }

@media screen and (min-width: 769px) {
  .i-arrow { width: 52px; height: 6px; }
  .i-arrow::before { top: 2px; width: 10px; }
  .i-blank { width: 18px; height: 12px; }
  .i-blank::before,
  .i-blank::after { width: 12px; height: 8px; }
}

/* container
------------------------------------------------ */
#container { position: relative; }
.wrap { position: relative; }

@media screen and (min-width: 769px) {
  .wrap { margin: 0 auto; padding: 0 20px; max-width: 1206px; }
}

/* header
------------------------------------------------ */
#header { position: absolute; top: 0; left: 0; width: 100%; z-index: 10; }
.hd-top { position: relative; width: 100%; height: 58px; }
.hd-logo { position: absolute; top: 12px; left: 20px; width: 143px; height: 34px; font-size: 1rem; line-height: 1.2; }
.hd-logo > a { display: block; position: relative; width: 100%; height: 100%; }
.hd-top-info { display: flex; align-items: center; position: absolute; top: 10px; right: 16px; }
.hd-links { display: flex; }
.hd-links-item { margin-left: 2em; font-size: 1.3rem; font-weight: 700; line-height: 1.2; }
.hd-links-item:first-child { margin-left: 0; }
.hd-links-item > a { display: inline-block; position: relative; padding: 4px 0; vertical-align: top; }
.hd-btns { display: flex; }
.hd-btns-item { margin-left: 8px; }
.hd-btns-item:first-child { margin-left: 0; }
.hd-btns-item > a { display: flex; border: 1px solid #736357; border-radius: 50%; }
.hd-btns-item span { font-size: 1.4rem; font-weight: 700; line-height: 1.2; }
.hd-btns-item i { display: block; position: relative; }
.hd-btns-cart i { width: 15px; height: 19px; }
.hd-btns-contact i { width: 18px; height: 14px; }
.device-click .hd-btns-item i img { transition: ease 0.4s; }
.device-click .hd-btns-item i::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: 100% 100%; }
.device-click .hd-btns-item > a:hover { background-color: #534741; border-color: #534741; color: #fff; opacity: 1; }
.device-click .hd-btns-item > a:hover i img { opacity: 0; }
.device-click .hd-btns-cart > a:hover i::after { background-image: url(../img/icon/cart2.svg); }
.device-click .hd-btns-contact > a:hover i::after { background-image: url(../img/icon/email2.svg); }
.hd-sns { display: flex; position: relative; margin-left: 10px; z-index: 6; }
.hd-sns-item { margin-left: 8px; width: 30px; height: 30px; }
.hd-sns-item:first-child { margin-left: 0; }
.hd-sns-item > a { display: block; position: relative; width: 100%; height: 100%; }
.hd-menu { position: relative; margin-left: 10px; width: 35px; height: 35px; z-index: 6; }
.hd-menu > a,
.hd-menu span { display: block; position: relative; width: 100%; height: 100%; }
.hd-menu span { text-indent: -9999px; white-space: nowrap; overflow: hidden; }
.hd-menu span::before,
.hd-menu span::after { content: ''; position: absolute; left: 0; transition: ease 0.4s; width: 100%; height: 1px; background-color: #534741; }
.hd-menu span::before { top: 12px; }
.hd-menu span::after { top: 20px; }
.hd-menu > a.active span::before,
.hd-menu > a.active span::after { top: 18px; }
.hd-menu > a.active span::before { transform: rotate(25deg); }
.hd-menu > a.active span::after { transform: rotate(-25deg); }
#gnav { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100vh; background-color: #f0ece7; z-index: 5; }
#gnav > .frame { position: relative; width: 100%; height: 100%; overflow-y: auto; }
.gnav-links { display: flex; flex-wrap: wrap; }
.gnav-links-item { position: relative; overflow: hidden; }
.gnav-links-item > a { display: inline-block; transition: 0.4s ease 0.4s; transform: translateY(60px); vertical-align: top; }
.gnav-links-en { font-family: 'Overpass', sans-serif; font-size: 1.2rem; font-weight: 600; line-height: 1.2; color: #736357; }
.gnav-links-ja { font-size: 1.6rem; font-weight: 700; line-height: 1.2; }
.gnav-links-name { padding-top: 10px; font-size: 1.2rem; font-weight: 700; line-height: 1.2; }
.gnav-btns { margin-top: 40px; }
.gnav-btns-item { transition: 0.4s ease 0.8s; margin-top: 16px; opacity: 0; }
.gnav-btns-item:first-child { margin-top: 0; }
.gnav-btns-item > a { display: block; position: relative; padding: 22px 0; border-radius: 6px; text-align: center; color: #fff; }
.gnav-btns-en { font-family: 'Overpass', sans-serif; font-size: 2.7rem; font-weight: 600; line-height: 1.2; }
.gnav-btns-ja { display: flex; justify-content: center; align-items: center; font-size: 1.4rem; font-weight: 700; line-height: 1.2; }
.gnav-btns-ja .i-blank { margin-left: 4px; }
.gnav-btns-item .i-arrow { position: absolute; top: 50%; right: 12px; margin-top: -3px; }
.gnav-btns-contact > a { background-color: #534741; }
.gnav-btns-onlineshop > a { background-color: #aea49d; }
.device-click .gnav-btns-item > a:hover { opacity: 1; }
.device-click .gnav-btns-contact > a:hover { background-color: #736357; }
.device-click .gnav-btns-onlineshop > a:hover { background-color: #736357; }

.hd-c-white .hd-logo > a img { opacity: 0; }
.hd-c-white .hd-logo > a::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../img/share/logo_white.svg) no-repeat center center; background-size: 100% 100%; }
.hd-c-white .hd-links-item > a { color: #fff; }
.hd-c-white .hd-btns-item > a { border-color: #fff; color: #fff; }
.hd-c-white .hd-btns-item i::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; }
.hd-c-white .hd-btns-item i img { opacity: 0; }
.hd-c-white .hd-btns-cart i::after { background-image: url(../img/icon/cart2.svg); } 
.hd-c-white .hd-btns-contact i::after { background-image: url(../img/icon/email2.svg); } 
.hd-c-white .hd-sns-item > a img { opacity: 0; }
.hd-c-white .hd-sns-item > a::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; }
.hd-c-white .hd-sns-instagram > a::after { background-image: url(../img/icon/sns_instagram2.svg); }
.hd-c-white .hd-menu span::before,
.hd-c-white .hd-menu span::after { background-color: #fff; }

.body-gnav-open { position: fixed; top: 0; }
.body-gnav-open #header,
.body-hd-fixed #header { position: fixed; top: 0; left: 0; background-color: #fff; z-index: 20; }

.gnav-open .gnav-links-item > a { transform: translateY(0); }
.gnav-open .gnav-btns-item { opacity: 1; }

.device-click .hd-links-item > a::after { content: ''; position: absolute; bottom: 0; left: 0; transition: width ease 0.4s; width: 0; height: 1px; background-color: #534741; }
.device-click .hd-c-white .hd-links-item > a::after { background-color: #fff; }
.device-click .hd-links-item > a:hover { opacity: 1; }
.device-click .hd-links-item > a:hover::after { width: 100%; }

@media screen and (max-width: 768px) {
  .hd-logo { z-index: 6; }
  .hd-links { display: none; }
  .hd-btns-item { width: 37px; height: 37px; }
  .hd-btns-item > a { justify-content: center; align-items: center; width: 100%; height: 100%; }
  .hd-btns-item span { display: none; }
  .gnav-content { padding: 110px 0 40px; }
  .gnav-links { padding: 0 40px; }
  .gnav-links-item { margin-top: 26px; }
  .gnav-links-item[data-order-sp="1"] { order: 1; margin-top: 0; width: 60%; }
  .gnav-links-item[data-order-sp="2"] { order: 2; margin-top: 0; width: 40%; }
  .gnav-links-item[data-order-sp="3"] { order: 3; width: 60%; }
  .gnav-links-item[data-order-sp="4"] { order: 4; width: 40%; }
  .gnav-links-item[data-order-sp="5"] { order: 5; width: 60%; }
  .gnav-links-item[data-order-sp="6"] { order: 6; width: 40%; }
  .gnav-links-item[data-order-sp="7"] { order: 7; width: 60%; }
  .gnav-links-item[data-order-sp="8"] { order: 8; width: 40%; }
  .gnav-links-item[data-order-sp="9"] { order: 9; width: 60%; }
  .gnav-links-item[data-order-sp="10"] { order: 10; width: 40%; }
  .gnav-btns { padding: 0 35px; }
  .gnav-btns-onlineshop .i-arrow { display: none; }
}

@media screen and (min-width: 769px) {
  .hd-top { height: 93px; }
  .hd-logo { top: 25px; left: 60px; width: 174px; height: 41px; }
  .hd-top-info { top: 25px; right: 52px; }
  .hd-btns { margin-left: 32px; }
  .hd-btns-item > a { display: flex; align-items: center; padding: 10px 15px; border-radius: 20px; }
  .hd-btns-item i { margin-right: 10px; }
  .hd-sns { margin-left: 12px; }
  .hd-sns-item { margin-left: 10px; }
  .hd-menu { margin-left: 20px; }
  #gnav > .frame:before,
  #gnav > .frame::after { content: ''; position: absolute; background-repeat: no-repeat; background-position: center center; }
  #gnav > .frame:before { top: 175px; left: 75px; transition: ease 0.4s; width: 302px; height: 70px; background-image: url(../img/share/logo_white.svg); background-size: 100% 100%; z-index: 1; opacity: 0; }
  #gnav > .frame::after { top: 0; left: 0; width: 50%; height: 100%; background-image: url(../img/share/gnav_bg.jpg); background-size: cover; z-index: -1; }
  .gnav-content { margin-left: auto; padding: 130px 95px 65px; width: 50%; }
  .gnav-links-item { margin-top: 26px; }
  .gnav-links-item:nth-of-type(-n+3) { margin-top: 0; }
  .gnav-links-item:nth-of-type(3),
  .gnav-links-item:nth-of-type(6) { width: 25%; }
  .gnav-links-item:nth-of-type(9),
  .gnav-links-item:nth-of-type(3n+1) { width: 35%; }
  .gnav-links-item:nth-of-type(10),
  .gnav-links-item:nth-of-type(3n+2) { width: 40%; }
  .gnav-links-en { font-size: 1.2rem; }
  .gnav-links-ja { margin-top: 4px; font-size: 1.6rem; }
  .gnav-btns { margin-top: 55px; }
  .gnav-btns-en { font-size: 2.6rem; }
  .gnav-btns-ja { font-size: 1.3rem; }
  .gnav-btns-item { margin-top: 24px; }
  .gnav-btns-item > a { padding: 32px 0; }
  .gnav-btns-item .i-arrow { right: 22px; width: 25px; }

  #gnav.gnav-open > .frame:before { opacity: 1; }
}

@media screen and (min-width: 769px) and (max-width: 1200px) {
  .hd-top { height: 7.75vw; }
  .hd-logo { top: 2.08333333333vw; left: 1.66666666667vw; width: 14.5vw; height: 3.41666666667vw; }
  .hd-top-info { top: 2.08333333333vw; right: 1.66666666667vw; }
  .hd-btns { margin-left: 2.66666666667vw; }
  .hd-links-item { font-size: 1.08333333333vw; }
  .hd-btns-item > a { padding: 0.83333333333vw 1.25vw; border-radius: 1.66666666667vw; }
  .hd-btns-item i { margin-right: 0.83333333333vw; }
  .hd-btns-item span { font-size: 1.16666666667vw; }
  .hd-btns-cart i { width: 1.25vw; height: 1.58333333333vw; }
  .hd-btns-contact i { width: 1.5vw; height: 1.16666666667vw; }

  .hd-sns { margin-left: 1vw; }
  .hd-sns-item { margin-left: 0.83333333333vw; width: 2.5vw; height: 2.5vw; }
  .hd-menu { margin-left: 1.66666666667vw; width: 2.91666666667vw; height: 2.91666666667vw; }
  .hd-menu span::before { top: 1vw; }
  .hd-menu span::after { top: 1.66666666667vw; }
  .hd-menu > a.active span::before,
  .hd-menu > a.active span::after { top: 1.5vw; }

  #gnav > .frame:before { top: 14.5833333333vw; left: 6.25vw; width: 25.1666666667vw; height: 5.83333333333vw; }
  .gnav-content { padding: 130px 7.91666666667vw 65px; }
  .gnav-links-item { margin-top: 2.16666666667vw; }
  .gnav-links-en { font-size: 1vw; }
  .gnav-links-ja { font-size: 1.33333333333vw; }
  .gnav-btns { margin-top: 4.58333333333vw; }
  .gnav-btns-item { margin-top: 2vw; }
  .gnav-btns-item > a { padding: 2.66666666667vw 0; }
  .gnav-btns-en { font-size: 2.16666666667vw; }
  .gnav-btns-ja { font-size: 1.08333333333vw; }
}

/* main
------------------------------------------------ */
#main { display: block; position: relative; padding-top: 58px; width: 100%; }

@media screen and (min-width: 769px) {
  #main { padding-top: 93px; }
}

@media screen and (min-width: 769px) and (max-width: 1200px) {
  #main { padding-top: 7.75vw; }
}

/* page */
.page-hd { position: relative; width: 100%; padding-bottom: 52.9333333333%; height: 0; background-position: center center; background-repeat: no-repeat; background-size: cover; overflow: hidden; }
.page-hd::after { content: ''; position: absolute; top: 0; left: 0; mix-blend-mode: multiply; width: 100%; height: 100%; background-color: rgba(132,128,117,0.5); z-index: 1; }
.page-hd-title { position: relative; padding-top: 23vw; text-align: center; z-index: 2; }
.page-hd-title--en,
.page-hd-title--ja { line-height: 1.2; color: #fff; }
.page-hd-title--en { font-family: 'Overpass', sans-serif; font-size: 3.5rem; font-weight: 600; }
.page-hd-title--ja { margin-top: 2px; font-size: 1.2rem; font-weight: 700; }

@media screen and (min-width: 769px) {
  .page-hd { padding-bottom: 24.1581259151%; }
  .page-hd-title { padding-top: 10vw; }
  .page-hd-title--en { font-size: 5.2rem; }
  .page-hd-title--ja { font-size: 1.8rem; }
}

/* topicpath */
.topicpath { position: relative; }
.topicpath-item { display: inline; font-size: 1.2rem; font-weight: 700; line-height: 1.85416666667; }
.topicpath-item > a { display: inline-block; vertical-align: top; }
.topicpath-item:not(:last-child)::after { content: '\FF1E'; padding: 0 2em; }

@media screen and (max-width: 768px) {
  .topicpath { padding: 20px 30px 0; }
}

@media screen and (min-width: 769px) {
  .topicpath { padding-top: 55px; }
  .topicpath-item { font-size: 1.7rem; }
}

/* navigation */
.nav-category { position: relative; margin-top: 15px; }
.nav-category-links { display: flex; }
.nav-category-links--item { position: relative; text-align: center; font-size: 1.35rem; font-weight: 700; line-height: 1.2; }
.nav-category-links--item > a { display: block; position: relative; padding: 0 1.5em; }
.nav-category-links--item > a > span { display: inline-block; position: relative; padding: 8px 0; vertical-align: top; }
.nav-category-links--item > a.active > span::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1.5px; background-color: #534741; }

@media screen and (max-width: 768px) {
  .nav-category { overflow-x: auto; }
  .nav-category-links { padding: 10px 0; }
  .nav-category-links--item { border-bottom: 1px solid #534741; }
  .nav-category-links--item > a { white-space: nowrap; }
}

@media screen and (min-width: 769px) {
  .nav-category { margin-top: 90px; }
  .nav-category-links { justify-content: center; border-bottom: 1px solid #534741; }
  .nav-category-links--item { font-size: 1.8rem; }
  .nav-category-links--item > a { padding: 0 2em; }
  .nav-category-links--item > a > span { padding: 10px 0; }
  .nav-category-links--item > a.active > span::after { height: 3px; }
}

/* title */
.title-group { position: relative; }
.title-group-sub,
.title-group-en,
.title-group-en,
.title-group-ja { line-height: 1.2; }
.title-group-sub { display: flex; align-items: flex-start; margin-bottom: 18px; font-family: 'Overpass', sans-serif; font-size: 1.4rem; font-weight: 600; color: #736357; }
.title-group-sub > span { display: inline-block; vertical-align: top; }
.title-group-sub::before,
.title-group-sub::after { content: ''; display: inline-block; margin-top: 1px; width: 1px; height: 10px; background-color: #736357; vertical-align: top; }
.title-group-sub::before { transform: rotate(-40deg); margin-right: 18px; }
.title-group-sub::after { transform: rotate(40deg); margin-left: 18px; }
.title-group-en { font-family: 'Overpass', sans-serif; font-size: 4.1rem; font-weight: 600; letter-spacing: 0.12em; }
.title-group-ja { font-size: 1.5rem; font-weight: 700; color: #736357; }
.title-secgroup { position: relative; margin-bottom: 24px; text-align: center; }
.title-secgroup-en,
.title-secgroup-ja { line-height: 1.2; }
.title-secgroup-en { font-family: 'Overpass', sans-serif; font-size: 4.1rem; font-weight: 700; letter-spacing: 0.12em; }
.title-secgroup-ja { font-size: 1.5rem; font-weight: 700; }
.title-subgroup { position: relative; color: #736357; }
.title-subgroup-en,
.title-subgroup-ja { line-height: 1.2; }
.title-subgroup-en { font-family: 'Overpass', sans-serif; font-size: 3.9rem; font-weight: 700; letter-spacing: 0.12em; }
.title-subgroup-ja { font-size: 1.5rem; font-weight: 700; }
.title-subgroup::after { content: ''; display: block; width: 36px; height: 1px; background-color: #534741; }

@media screen and (max-width: 768px) {
  .title-subgroup::after { margin-top: 15px; }
}

@media screen and (min-width: 769px) {
  .title-group-sub { font-size: 2.2rem; }
  .title-group-sub::before,
  .title-group-sub::after { margin-top: 1px; height: 20px; }
  .title-group-sub::before { margin-right: 28px; }
  .title-group-sub::after { margin-left: 28px; }

  .title-group-en { font-size: 5.6rem; }
  .title-group-ja { font-size: 1.6rem; }
  .title-secgroup { margin-bottom: 50px; }
  .title-secgroup-en { font-size: 3.3rem; }
  .title-secgroup-ja { font-size: 1.6rem; }
  .title-subgroup { display: flex; align-items: baseline; padding-bottom: 28px; }
  .title-subgroup-en { font-size: 3rem; }
  .title-subgroup-ja { margin-left: 24px; font-size: 1.6rem; }
  .title-subgroup::after { position: absolute; bottom: 0; left: 0; width: 64px; }
}

/* button */
.btn-1 { margin: 40px auto 0; max-width: 268px; }
.btn-1 > a { display: block; position: relative; padding: 14px 0; border: 1px solid #aea49d; text-align: center; font-size: 1.4rem; font-weight: 700; line-height: 1.2; }
.btn-1 .i-arrow { position: absolute; top: 50%; right: 18px; transform: translateY(-50%); }
.btn-c-white.btn-1 > a { border-color: #fff; color: #fff; }
.btn-1 span { letter-spacing: 0.06em; }

.device-click .btn-1 .i-arrow::before,
.device-click .btn-1 .i-arrow::after { transition: ease 0.4s; }
.device-click .btn-1 > a:hover { background-color: #534741; color: #fff; opacity: 1; }
.device-click .btn-1 > a:hover .i-arrow::before,
.device-click .btn-1 > a:hover .i-arrow::after { background-color: #fff; }
.device-click .btn-1 > a:hover .i-arrow::after { width: 50%; }

.device-click .btn-c-white.btn-1 > a:hover { background-color: #fff; color: #534741; }
.device-click .btn-c-white.btn-1 > a:hover .i-arrow::before,
.device-click .btn-c-white.btn-1 > a:hover .i-arrow::after { background-color: #534741; }

@media screen and (min-width: 769px) {
  .btn-1 { margin-top: 50px; max-width: 360px; }
  .btn-1 > a { padding: 20px 0; font-size: 1.6rem; }
  .btn-1 .i-arrow { right: 24px; width: 34px; }
}

/* banner */
.bnr-lists-item { position: relative; z-index: 1; }
.bnr-lists-item > a { display: block; position: relative; padding-bottom: 31.746031746%; width: 100%; height: 0; overflow: hidden; }
.bnr-lists-item > a::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(128,128,117,0.8); mix-blend-mode: multiply; z-index: -1; }
.bnr-lists-item.w-single > a { padding-bottom: 45.5060952381%; }
.bnr-lists-info,
.bnr-lists-photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.bnr-lists-info { display: flex; flex-flow: column; justify-content: center; align-items: center; z-index: 1; }
.bnr-lists-en,
.bnr-lists-ja { line-height: 1.2; color: #fff; }
.bnr-lists-en { font-family: 'Overpass', sans-serif; font-size: 2.6rem; font-weight: 600; letter-spacing: 0.12em; }
.bnr-lists-ja { font-size: 1.3rem; font-weight: 700; }
.bnr-lists-photo { z-index: -2; }
.bnr-lists-item .i-arrow { position: absolute; top: 50%; right: 18px; transform: translateY(-50%); }

.device-click .bnr-lists-item .i-arrow::after { transition: width ease 0.4s; }
.device-click .bnr-lists-photo picture { transition: ease 0.4s; }
.device-click .bnr-lists-item > a:hover { opacity: 1; }
.device-click .bnr-lists-item > a:hover .bnr-lists-photo picture { transform: scale(1.1); }
.device-click .bnr-lists-item > a:hover .i-arrow::after { width: 50%; }

@media screen and (max-width: 768px) {
  .bnr-lists { margin: 70px 30px 0; }
  .bnr-lists-item { margin-top: 18px; }
  .bnr-lists-item:first-child { margin-top: 0; }
}

@media screen and (min-width: 769px) {
  .bnr-lists { display: flex; flex-wrap: wrap; margin-top: 135px; }
  .bnr-lists-item > a { padding-bottom: 17.1526586621%; }
  .bnr-lists-en { font-size: 3.6rem; }
  .bnr-lists-ja { font-size: 1.6rem; }
  .bnr-lists-item.w-single { width: 100%; }
  .bnr-lists-item.w-single > a { padding-bottom: 24.5873413379%; }
  .bnr-lists-item.w-single .bnr-lists-en { font-size: 5.6rem; }
  .bnr-lists-item.w-single .bnr-lists-ja { margin-top: 10px; }
  .bnr-lists-item.w-single .i-arrow { right: 80px; }
  .bnr-lists-item.w-tripple { width: 30.1886792453%; }
  .bnr-lists-item.w-tripple > a { padding-bottom: 56.8181818182%; }
  .bnr-lists-item.w-tripple { margin: 4.28816466552% 0 0 4.71698113205%; }
  .bnr-lists-item.w-single + .bnr-lists-item.w-tripple { margin-left: 0; }
  .bnr-lists-item.w-tripple .bnr-lists-ja { padding-bottom: 5%; }
  .bnr-lists-item.w-tripple .i-arrow { top: auto; right: auto; bottom: 25%; left: 50%; transform: translateX(-50%); width: 34px; }
}

/* slide */
.slide-1 { position: relative; opacity: 0; }
.slide-1-frame { position: relative; width: 100%; overflow: hidden; }
.slide-1-move { display: flex; position: relative; }
.slide-1-direct { position: absolute; text-indent: -9999px; white-space: nowrap; overflow: hidden; }
.slide-1-direct--prev { transform: scale(-1,1); }
.slide-1-bullets { display: flex; justify-content: center; width: 100%; height: 5px; }
.slide-1-bullets > a { display: block; margin: 0 8px; width: 5px; height: 100%; background-color: #ebe7e2; border-radius: 50%; text-indent: -9999px; white-space: nowrap; overflow: hidden; }
.slide-1-bullets > a:first-child { margin-left: 0; }
.slide-1-bullets > a:last-child { margin-right: 0; }
.slide-1-bullets > a.active { background-color: #534741; }

.device-click .slide-1-direct .i-arrow::after { transition: width ease 0.4s; }
.device-click .slide-1-direct:hover { opacity: 1; }
.device-click .slide-1-direct:hover .i-arrow::after { width: 50%; }

@media screen and (min-width: 769px) {
  .slide-1-bullets { height: 10px; }
  .slide-1-bullets > a { width: 10px; }
}

/* fixed */
.fixed-onlineshop { position: fixed; right: 18px; bottom: 25px; width: 86px; height: 86px; z-index: 12; }
.fixed-onlineshop > a { display: block; padding-top: 12px; width: 100%; height: 100%; background-color: #534741; border-radius: 50%; color: #fff; }
.fixed-onlineshop i { display: block; margin: 0 auto; width: 13px; height: 17px; }
.fixed-onlineshop span { display: block; margin-top: 6px; text-align: center; font-size: 1.3rem; font-weight: 700; letter-spacing: 0.06em; line-height: 1.19230769231; }

.device-click .fixed-onlineshop > a:hover { background-color: #a79d96; opacity: 1; }

.body-stop-onlineshop .fixed-onlineshop { position: absolute; top: -104px; bottom: auto; }

@media screen and (min-width: 769px) {
  .fixed-onlineshop { right: 50px; bottom: 80px; width: 110px; height: 110px; }
  .fixed-onlineshop > a { padding-top: 17px; }
  .fixed-onlineshop i { width: 14px; height: 19px; }
  .fixed-onlineshop span { margin-top: 8px; font-size: 1.5rem; }

  .body-stop-onlineshop .fixed-onlineshop { top: calc(-9.22401171303vw - 130px); }
}

@media screen and (min-width: 769px) and (max-width: 1366px) {
  .body-stop-onlineshop .fixed-onlineshop { top: -256px; }
}

/* pagination */
.pagination { display: flex; justify-content: center; margin-top: 45px; }
.pagination-item { position: relative; padding: 0 calc(1em - 4px); font-family: 'Overpass', sans-serif; font-size: 1.7rem; font-weight: 600; line-height: 1.2; }
.pagination-item:first-child { padding-left: 0; }
.pagination-item:last-child { padding-right: 0; }
.pagination-item > a,
.pagination-item > span { display: inline-block; position: relative; padding: 4px; vertical-align: top; }
.pagination-item > span::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 2.5px; background-color: #554640; }

@media screen and (min-width: 769px) {
  .pagination { margin-top: 80px; }
  .pagination-item { padding: 0 calc(1.5em - 10px); font-size: 2.4rem; }
  .pagination-item > a,
  .pagination-item > span { padding: 6px 10px; }
}

/* pager */
.pager { position: relative; margin-top: 35px; text-align: center; }
.pager > a { font-size: 1.2rem; font-weight: 700; line-height: 1.2; }
.pager-prev,
.pager-next { position: absolute; }
.pager-prev::before,
.pager-next::after { position: absolute; top: 0; }
.pager-prev { left: 0; padding-left: 3em; }
.pager-prev::before { content: '\FF1C'; left: 0; }
.pager-next { right: 0; padding-right: 3em; }
.pager-next::after { content: '\FF1E'; right: 0; }
.pager-back::before { content: ''; display: inline-block; margin-right: 8px; width: 15px; height: 15px; background: url(../img/icon/sort1.svg) no-repeat center center; background-size: 100% 100%; vertical-align: top; }

@media screen and (max-width: 768px) {
}

@media screen and (min-width: 769px) {
  .pager { margin: 100px auto 0; max-width: 450px; }
  .pager > a { font-size: 1.6rem; }
  .pager-back::before { margin: -3px 20px 0 0; width: 25px; height: 25px; }
}

/* lazy */
.lazy { transition: ease-out 0.6s; transform: translateY(40px); opacity: 0; }
.lazy-to-right { transform: translateX(-40px); }
.lazy-to-left { transform: translateX(40px); }
.lazy-done { transform: translate(0); opacity: 1; }

/* sorry */
.sorry { position: relative; }
.sorry-title { position: relative; padding-top: 85px; text-align: center; }
.sorry-title::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 48px; height: 66px; background: url(../img/icon/sorry1.svg) no-repeat center center; background-size: 100% 100%; }
.sorry-title-en,
.sorry-title-ja { line-height: 1.2; }
.sorry-title-en { font-family: 'Overpass', sans-serif; font-size: 3.9rem; font-weight: 600; }
.sorry-title-ja { margin-top: 10px; font-size: 1.5rem; font-weight: 700; }
.sorry-text { margin-top: 30px; text-align: center; font-size: 1.2rem; line-height: 2.16666666667; }
.sorry-btns-item { position: relative; }
.sorry-btns-item > a { display: block; position: relative; padding: 15px 10px; width: 100%; border: 1px solid #b0a69f; text-align: center; font-size: 1.2rem; font-weight: 700; line-height: 1.2; color: #534741; cursor: pointer; }
.sorry-btns-item .i-arrow { position: absolute; top: 50%; right: 12px; margin-top: -3px; }

@media screen and (max-width: 768px) {
  .sorry { padding: 65px 30px 0; }
  .sorry-btns { margin: 45px 23px 0; }
}

@media screen and (min-width: 769px) {
  .sorry { padding-top: 120px; }
  .sorry-title { padding-top: 120px; }
  .sorry-title::before { width: 64px; height: 90px; }
  .sorry-title-en { font-size: 6rem; }
  .sorry-title-ja { margin-top: 18px; font-size: 2rem; }
  .sorry-text { margin-top: 45px; font-size: 1.4rem; line-height: 2.14285714286; }
  .sorry-btns { display: flex; justify-content: center; margin-top: 68px; }
  .sorry-btns-item { width: 360px; }
  .sorry-btns-item:not(:first-child) { margin-left: 20px; }
  .sorry-btns-item > a { padding: 20px 10px; font-size: 1.6rem; }
  .sorry-btns-item .i-arrow { right: 22px; width: 33px; }
}

/* footer
------------------------------------------------ */
#footer { position: relative; margin-top: 70px; }
.ft-contact { position: relative; padding-right: 30px; z-index: 1; }
.ft-contact > a { display: block; position: relative; padding-bottom: 43.4782608696%; width: 100%; color: #fff; overflow: hidden; }
.ft-contact > a::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(128,128,117,0.7); mix-blend-mode: multiply; border-radius: 0 11px 0 0; z-index: -1; }
.ft-contact-info,
.ft-contact-photo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.ft-contact-info { padding: 9.86666666667vw 0 0 30px; z-index: 1; }
.ft-contact-en { font-family: 'Overpass', sans-serif; font-size: 2.5rem;font-weight: 600; letter-spacing: 0.12em; line-height: 1.2; }
.ft-contact-ja { margin-top: 4px; font-size: 1.2rem; font-weight: 700; line-height: 1.2; }
.ft-contact-text { margin-top: 18px; font-size: 1.1rem; line-height: 1.2; }
.ft-contact-photo { border-radius: 0 11px 0 0; z-index: -2; overflow: hidden; }
.ft-contact-photo picture { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.ft-contact .i-arrow { position: absolute; top: 50%; right: 20px; transform: translateY(-50%); }
.ft-main { background-color: #534741; color: #fff; }
.ft-main a { color: #fff; }
.ft-main-top { position: relative; }
.ft-main-mid { position: relative; }
.ft-main-btm { position: relative; }
.ft-logo { width: 237px; height: 56px; }
.ft-logo > a { display: block; width: 100%; height: 100%; }
.ft-address { font-style: normal; }
.ft-address p { font-size: 1.1rem; letter-spacing: 0; line-height: 2; }
.ft-address dl dt { margin-bottom: 4px; font-size: 1rem; letter-spacing: 0; line-height: 1.2; }
.ft-address dl dt::before { content: '-'; }
.ft-address dl dd { font-size: 1.1rem; letter-spacing: 0; line-height: 1.6; }
.ft-sns { display: flex; position: absolute; }
.ft-sns-item { width: 30px; height: 30px; }
.ft-sns-item:first-child { margin-left: 0; }
.ft-sns-item > a { display: block; width: 100%; height: 100%; }
.ft-links { display: flex; }
.ft-links-lists--item { font-size: 1.3rem; font-weight: 400; line-height: 1.2; }
.ft-links-lists--item > a { display: inline-block; vertical-align: top; }
.ft-onlineshop > a { display: block; position: relative; padding: 20px 0; background-color: #fff; border-radius: 6px; color: #534741; }
.ft-onlineshop span { display: block; text-align: center; }
.ft-onlineshop .en { font-family: 'Overpass', sans-serif; font-size: 2.2rem; font-weight: 600; line-height: 1.2; }
.ft-onlineshop .ja { display: flex; justify-content: center; align-items: center; font-size: 1.2rem; font-weight: 700; line-height: 1.2; }
.ft-onlineshop .ja .i-blank { margin-left: 8px; }
.ft-others { display: flex; flex-wrap: wrap; }
.ft-others-item { font-size: 1.1rem; line-height: 1.2; }
.ft-copyright { font-family: 'Overpass', sans-serif; font-size: 0.9rem; font-weight: 400; line-height: 1.2; }
.ft-copyright > small { font-size: inherit; }
.ft-pagetop { position: absolute; bottom: 0; right: -10px; width: 42px; }
.ft-pagetop > a { display: block; }
.ft-pagetop span { display: block; margin-bottom: 4px; text-align: center; font-family: 'Overpass', sans-serif; font-size: 1.25rem; font-weight: 400; line-height: 1.2; }
.ft-pagetop i { display: block; position: relative; width: 100%; height: 42px; border: 1px solid #fff; border-radius: 50%; }
.ft-pagetop i::before,
.ft-pagetop i::after { content: ''; position: absolute; height: 1px; background-color: #fff; }
.ft-pagetop i::before { bottom: 22px; left: 11px; transform: rotate(-45deg); width: 10px; }
.ft-pagetop i::after { bottom: 12px; left: 6px; transform: rotate(90deg); width: 27px; }

.device-click .ft-contact-photo { will-change: transform; }
.device-click .ft-contact-photo picture { transition: ease 0.4s; }
.device-click .ft-contact .i-arrow::after { transition: width ease 0.4s; }
.device-click .ft-contact > a:hover { opacity: 1; }
.device-click .ft-contact > a:hover .ft-contact-photo picture { transform: scale(1.1); }
.device-click .ft-contact > a:hover .i-arrow::after { width: 50%; }

.device-click .ft-onlineshop .i-blank::before,
.device-click .ft-onlineshop .i-blank::after { transition: border-color ease 0.4s; }
.device-click .ft-onlineshop > a:hover { background-color: #a79d96; color: #fff; opacity: 1; }
.device-click .ft-onlineshop > a:hover .i-blank::before,
.device-click .ft-onlineshop > a:hover .i-blank::after { border-color: #fff; }

.device-click .ft-pagetop i::before,
.device-click .ft-pagetop i::after { transition: ease 0.4s; }
.device-click .ft-pagetop > a:hover { opacity: 1; }
.device-click .ft-pagetop > a:hover i::before { bottom: 27px; }
.device-click .ft-pagetop > a:hover i::after { bottom: 15px; left: 4px; width: 32px; }

@media screen and (max-width: 768px) {
  .ft-contact { background-color: #fff; }
  .ft-main { padding: 40px 0 24px; }
  .ft-main > .wrap { padding: 0 30px; }
  .ft-logo { margin: 0 auto; }
  .ft-address { margin: 28px 0 0 15px; }
  .ft-address p { margin-bottom: 12px; }
  .ft-address dl + dl { margin-top: 16px; }
  .ft-sns { top: 92px; right: 20px; }
  .ft-main-mid { margin-top: 45px; }
  .ft-links { justify-content: space-between; margin: 0 20px; }
  .ft-links-lists:not(:first-child),
  .ft-links-lists--item:not(:first-child) { margin-top: 24px; }
  .ft-onlineshop { margin: 35px 10px 0; }
  .ft-main-btm { margin-top: 36px; }
  .ft-others { justify-content: center; }
  .ft-copyright { margin-top: 18px; text-align: center; }
}

@media screen and (min-width: 769px) {
  #footer { margin-top: 150px; padding-top: 174px; }
  .ft-contact { margin-top: -174px; padding-right: 166px; }
  .ft-contact::before,
  .ft-contact::after { content: ''; position: absolute; left: 0; width: 100%; }
  .ft-contact::before { top: 0; left: 0; width: calc(100% - 166px); height: 100%; background-color: #fff; border-radius: 0 22px 0 0; z-index: -1; }
  .ft-contact::after { right: 0; bottom: 0; height: 9.22401171303vw; background-color: #534741; z-index: -2; }
  .ft-contact > a { padding-bottom: 25%; z-index: 1; }
  .ft-contact > a::after { border-radius: 0 22px 0 0; }
  .ft-contact-info { padding: 5.85651537335vw 0 0 calc((100vw - 1165px) / 2); }
  .ft-contact-en { font-size: 5.6rem; }
  .ft-contact-ja { margin-top: 10px; font-size: 1.6rem; }
  .ft-contact-text { margin-top: 20px; font-size: 1.4rem; }
  .ft-contact-photo { border-radius: 0 22px 0 0; }
  .ft-contact .i-arrow { right: 80px; }
  .ft-main { position: relative; padding: 74px 0 55px; }
  .ft-main > .wrap { display: flex; flex-direction: column; }
  .ft-main-top { display: flex; align-items: flex-end; order: 2; }
  .ft-logo { width: 282px; height: 66px; }
  .ft-address { display: flex; flex-wrap: wrap; row-gap: 20px; column-gap: 48px; margin: 0 0 -3px 35px; }
  .ft-address p { display: none; }
  .ft-address dl dt { margin-bottom: 8px; font-size: 1.2em; }
  .ft-address dl dd { font-size: 1.2rem; line-height: 1.79166666667; }
  .ft-sns { right: 78px; bottom: 42px; }
  .ft-main-mid { display: flex; justify-content: space-between; margin-bottom: 75px; order: 1; }
  .ft-links-column { display: flex; }
  .ft-links-column,
  .ft-links-lists { margin-left: 70px; }
  .ft-links-column:first-child,
  .ft-links-lists:first-child { margin-left: 0; }
  .ft-links-lists--item:not(:last-child) { font-size: 1.4rem; }
  .ft-links-lists--item:not(:last-child) { margin-bottom: 24px; }
  .ft-onlineshop > a { padding: 32px 38px; }
  .ft-onlineshop .en { font-size: 2.85686rem; }
  .ft-onlineshop .ja { margin-top: 6px; font-size: 1.4rem; }
  .ft-onlineshop .ja .i-blank { margin-left: 14px; }
  .ft-main-btm { display: flex; justify-content: flex-end; position: absolute; bottom: 0; right: 20px; order: 3; z-index: 2; }
  .ft-others { position: absolute; top: -40px; left: 0; }
  .ft-others-item { font-size: 1.2rem; }
  .ft-copyright { font-size: 1.2rem; }
  .ft-pagetop { right: 0; bottom: 38px; }
  .ft-pagetop span { font-size: 1.2rem; }
}

@media screen and (min-width: 769px) and (max-width: 900px) {
  .ft-main-top { display: block; }
  .ft-address { margin: 35px 0 0; }
}

@media screen and (min-width: 769px) and (max-width: 1180px) {
  .ft-address { display: grid; }
}

@media screen and (min-width: 769px) and (max-width: 1205px) {
  .ft-contact-info { padding-left: 20px; }
}

@media screen and (min-width: 769px) and (max-width: 1366px) {
  .ft-contact > a { padding-bottom: 300px; }
  .ft-contact::after { height: 126px; }
  .ft-contact-info { padding-top: 80px; }
}