@charset "UTF-8";
/* default sp
----------------------------------------------- */
* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, section, summary, time, mark, audio, video { padding: 0; margin: 0; font: inherit; word-wrap: break-word; border: 0; vertical-align: baseline; outline: none; }

body { padding: 0; margin: 0; color: #000; font-size: 3.5vw; font-family: 游ゴシック体, YuGothic, 'Yu Gothic', "游ゴシック Medium", "Yu Gothic Medium", 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; -webkit-text-size-adjust: 100%; font-style: normal; line-height: 1; }
article, aside, canvas, details, figcaption, figure, header, footer, hgroup, main, menu, nav, section, summary { display: block; }
blockquote, q { quotes: none; }
strong, b { font-weight: bold; }
ul, ol, li { list-style: none; }
table { border-spacing: 0; border-collapse: collapse; }
img, video, object { height: auto; border: none; display: block; }
img { max-width: 100%; }
ins { background: none; color: #000; text-decoration: none; }
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
hr { height: 1px; padding: 0; margin: 1em 0; border: 0; border-top: 1px solid #ccc; display: block; }
*:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
a { color: #000; text-decoration: none; display: block; -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
a:hover { opacity: 0.6; }
.clearfix:after { content: ''; display: block; clear: both; }
.pc { display: none; }
.sp { display: block; }

/* common sp
----------------------------------------------- */
.container { width: 100%; padding-top: 60px; z-index: 1; overflow: hidden; position: relative; }
.fade { opacity: 0; -moz-transition: 1.2s; -o-transition: 1.2s; -webkit-transition: 1.2s; transition: 1.2s; }
.fade-left { -moz-transform: translateX(-10px); -ms-transform: translateX(-10px); -webkit-transform: translateX(-10px); transform: translateX(-10px); }
.fade-right { -moz-transform: translateX(10px); -ms-transform: translateX(10px); -webkit-transform: translateX(10px); transform: translateX(10px); }
.fade-bottom { -moz-transform: translateY(10px); -ms-transform: translateY(10px); -webkit-transform: translateY(10px); transform: translateY(10px); }
.fade-active { opacity: 1; -moz-transform: translate(0); -ms-transform: translate(0); -webkit-transform: translate(0); transform: translate(0); }

/* header sp
----------------------------------------------- */
.header { width: 100%; height: 60px; background: #fff; z-index: 10; position: fixed; top: 0; left: 0; }
.sp-header { width: 100%; height: 100%; display: block; }
.pc-header { display: none; }
.header-content { width: 100%; height: 100%; padding: 1px 0; position: relative; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-align-items: center; align-items: center; }
.header-logo { margin: 4px auto 0 15px; font-size: 5.53vw; font-family: 'Cinzel'; letter-spacing: 1vw; }
.header-logo a { color: #7a6c64; }

.header-navi-button { width: 58px; height: 58px; cursor: pointer; z-index: 11; position: relative; }
.header-navi-button .line { width: 34px; height: 1px; background: #000; position: absolute; left: 12px; -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.header-navi-button .line-top { top: 13px; }
.header-navi-button .line-middle { top: 22px; }
.header-navi-button .line-bottom { top: 31px; }
.header-navi-button .line-text { width: 100%; font-size: 11px; font-family: 'Cinzel'; text-align: center; letter-spacing: 1px; position: absolute; bottom: 8px; }
.header-navi-button .line-text:before { content: 'CLOSE'; width: 100%; opacity: 0; position: absolute; top: 0; left: 0; -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -webkit-transform: translateY(-5px); transform: translateY(-5px); }
.header-navi-button .line-text span { display: block; -moz-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.3s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.header-navi { width: 75vw; height: 100%; background: #fff; -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); z-index: 1; opacity: 0; visibility: hidden; position: fixed; top: 0; left: -10vw; -moz-transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); -o-transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); -webkit-transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); transition: all 0.2s cubic-bezier(0.05, 0.05, 0.31, 0.97); }
.header-navi-inner { width: 100%; height: 100%; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.header-navi-inner::-webkit-scrollbar { display: none; }
.header-navi-scroll { width: 100%; height: 100%; padding-bottom: 1px; background: #fff; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.header-navi-scroll::-webkit-scrollbar { display: none; }
.header-navi-mask { width: 100vw; height: 100vh; background: rgba(247, 247, 247, 0.5); z-index: -1; position: fixed; top: 0; left: 0; }
.header-navi-items { width: 100%; margin: 0 auto 100px; }
.header-navi-item { width: 100%; text-align: center; border-bottom: 1px solid #eee; position: relative; }
.header-navi-item a {padding: 6vw 0;}
.header-navi-item .jp { font-size: 5.26vw; font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E,serif; line-height: 1.4; display: block; }
.header-navi-item .en {color: #aaa;font-size: 3.42vw;font-family: 'Cinzel';letter-spacing: 2px;}
.header-navi-open { width: 100%; height: 100%; position: fixed; }
.header-navi-open .line-top { top: 22px; -moz-transform: rotate(40deg); -ms-transform: rotate(40deg); -webkit-transform: rotate(40deg); transform: rotate(40deg); }
.header-navi-open .line-middle { opacity: 0; }
.header-navi-open .line-bottom { top: 22px; -moz-transform: rotate(-40deg); -ms-transform: rotate(-40deg); -webkit-transform: rotate(-40deg); transform: rotate(-40deg); }
.header-navi-open .line-text:before { opacity: 1; -moz-transform: translateY(0.2vw); -ms-transform: translateY(0.2vw); -webkit-transform: translateY(0.2vw); transform: translateY(0.2vw); }
.header-navi-open .line-text span { opacity: 0; -moz-transform: translateY(5px); -ms-transform: translateY(5px); -webkit-transform: translateY(5px); transform: translateY(5px); }
.header-navi-open .header-navi { opacity: 1; visibility: visible; left: 0; }

/* hero sp
----------------------------------------------- */
.hero { width: 100%; position: relative; }
.top-hero-content { position: relative; }
.top-hero-image { width: 100%; }
.top-hero-image img { width: 100%; }
.top-hero-text { width: 100%; padding: 1px 5vw 5vw; background: rgba(255, 255, 255, 0.8); z-index: 1; position: absolute; bottom: 0; left: 0; }
.top-hero-text-big { margin: -5vw 0 1.5vw; color: #a68f72; font-size: 10.79vw; font-family: 'Cinzel'; letter-spacing: 1.2vw; }
.top-hero-text-middle { margin-bottom: 2.5vw; font-size: 5.53vw; font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E,serif; line-height: 1.2; letter-spacing: 0.4vw; -moz-transition-delay: 0.3s; -o-transition-delay: 0.3s; -webkit-transition-delay: 0.3s; transition-delay: 0.3s; }
.top-hero-text-small { font-size: 3.16vw; letter-spacing: 0.4vw; -moz-transition-delay: 0.6s; -o-transition-delay: 0.6s; -webkit-transition-delay: 0.6s; transition-delay: 0.6s; }
.top-hero-gallery-items { width: 100%; }
.top-hero-gallery-item { width: 50vw; }

/* footer sp
----------------------------------------------- */
.footer { padding-bottom: 16vw; }
.copyright { padding: 3.5vw 0 3vw; color: #fff; font-size: 3.16vw; text-align: center; letter-spacing: 0.2vw; background: #191819; display: block; }
.footer-fixed { width: 100%; height: 16vw; padding-top: 1vw; color: #fff; text-align: center; background: #729fab; opacity: 0; visibility: hidden; z-index: 9; position: fixed; bottom: 0; left: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
.footer-fixed.active { opacity: 1; visibility: visible; }
.footer-fixed .text { padding: 0 16vw; background: url(../images/arrow03.png) no-repeat center right; background-size: 8vw; }
.footer-fixed .en { margin-bottom: 1vw; font-size: 4.74vw; font-family: 'Cinzel'; letter-spacing: 1vw; display: block; }
.footer-fixed .jp { font-size: 3.16vw; display: block; }

/* =============================================
pc-size
================================================*/
@media screen and (min-width: 960px) { /* default pc ----------------------------------------------- */
  body { font-size: 16px; }
  .sp { display: none; }
  .pc { display: block; }
	
  /* common pc ----------------------------------------------- */
  .container { padding-top: 0; }
	
  /* header pc ----------------------------------------------- */
  .header { width: 100%; height: 180px; background: none; position: absolute; }
  .sp-header { display: none; }
  .pc-header { display: block; }
  .pc-header-content { width: 100%; height: 85px; padding: 1px 0; background: #fff; }
  .pc-header-logo { margin: 28px auto 0; font-size: 32px; font-family: 'Cinzel'; letter-spacing: 10px; display: table; }
  .pc-header-logo a { color: #7a6c64; }
  .pc-header-navi { width: 100%; }
  .pc-header-navi-items { width: 100%; height: 95px; background: rgba(255, 255, 255, 0.6); z-index: 10; position: absolute; top: 85px; left: 0; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
  .pc-header-navi-items.active { position: fixed; top: 0; }
  .pc-header-navi-items li { margin: 0 25px; text-align: center; }
  .pc-header-navi-items a { padding: 5px; }
  .pc-header-navi-items .en { margin-bottom: 5px; color: #7a6c64; font-size: 18px; font-family: 'Cinzel'; letter-spacing: 2px; display: block; }
  .pc-header-navi-items .jp { font-size: 14px; display: block; }
	
  /* hero pc ----------------------------------------------- */
  .top-hero-content { width: 100%; min-width: 2000px; z-index: 2; position: relative; left: 50%; -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); }
  .top-hero-text { width: 550px; padding: 0; background: none; position: absolute; top: 50%; bottom: auto; left: calc(50% + 50px); -moz-transform: translateY(-25%); -ms-transform: translateY(-25%); -webkit-transform: translateY(-25%); transform: translateY(-25%); }
  .top-hero-text-big { margin: 0 0 15px; font-size: 62px; letter-spacing: 8px; }
  .top-hero-text-middle { margin-bottom: 20px; font-size: 40px; letter-spacing: 4px; }
  .top-hero-text-small { font-size: 18px; letter-spacing: 2px; }
  .top-hero-enter { width: 50vw; color: #fff; font-size: 20px; font-family: 'Cinzel'; letter-spacing: 5px; z-index: 1; position: absolute; bottom: -32px; left: calc(50% + 60px); background: #729fab; display: block; }
  .top-hero-enter .title { width: 400px; padding: 25px 30px 22px; background: url(../images/arrow03.png) no-repeat center right; background-size: 35px; display: block; }
	
  .top-hero-gallery-item { width: 440px; }
  /* footer pc ----------------------------------------------- */
  .footer { width: 100%; padding: 0; }
  .copyright { padding: 15px 0 13px; font-size: 12px; letter-spacing: 2px; }
  .footer-fixed { width: 120px; height: 120px; padding: 0; right: 0; bottom: 0; left: auto; }
  .footer-fixed .text { padding: 0 0 30px; background: url(../images/arrow03.png) no-repeat center bottom; background-size: 38px; }
  .footer-fixed .en { margin-bottom: 5px; font-size: 18px; letter-spacing: 4px; }
  .footer-fixed .jp { font-size: 12px; }

  /* retina用 ----------------------------------------------- */   }
@media screen and (min-width: 960px) and (-webkit-min-device-pixel-ratio: 2), screen and (min-width: 960px) and (min-resolution: 2dppx) { .footer-fixed .text { background: url(../images/arrow03@2x.png) no-repeat center bottom; background-size: 38px; } }
  /* pad用 -----------------------------------------------
@media screen and (min-width: 820px) {
  body{max-width: 1100px; overflow-x: hidden; margin: 0 auto; }
}
 */ 
