@charset "UTF-8";
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, center, 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, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body { line-height: 1; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

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

* { box-sizing: border-box; }

img { width: 100%; vertical-align: top; }

body { font-family: 'corm_m'; }

.device-pc { display: block; }

.device-sp { display: none; }

@font-face { font-family: 'corm_b'; src: url("https://ourplace.jp/font/Cormorant-Bold.woff") format("woff"), url("https://ourplace.jp/font/Cormorant-Bold.ttf") format("truetype"); font-weight: bold; font-style: bold; }

@font-face { font-family: 'corm_m'; src: url("https://ourplace.jp/font/Cormorant-Medium.woff") format("woff"), url("https://ourplace.jp/font/Cormorant-Medium.ttf") format("truetype"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'corm_r'; src: url("https://ourplace.jp/font/Cormorant-Regular.woff") format("woff"), url("https://ourplace.jp/font/Cormorant-Regular.ttf") format("truetype"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'corm_l'; src: url("https://ourplace.jp/font/Cormorant-Light.woff") format("woff"), url("https://ourplace.jp/font/Cormorant-Light.ttf") format("truetype"); font-weight: normal; font-style: normal; }

/* Slider */
.slick-loading .slick-list { background: #fff url("https://ourplace.jp/image/ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face { font-family: 'slick'; font-weight: normal; font-style: normal; src: url("https://ourplace.jp/font/slick.eot"); src: url("https://ourplace.jp/font/slick.eot?#iefix") format("embedded-opentype"), url("https://ourplace.jp/font/slick.woff") format("woff"), url("https://ourplace.jp/font/slick.ttf") format("truetype"), url("https://ourplace.jp/font/slick.svg#slick") format("svg"); }

/* Arrows */
.slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; padding: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; }

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; }

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; }

.slick-prev:before, .slick-next:before { font-family: 'slick'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: -25px; }

[dir='rtl'] .slick-prev { right: -25px; left: auto; }

.slick-prev:before { content: '←'; }

[dir='rtl'] .slick-prev:before { content: '→'; }

.slick-next { right: -25px; }

[dir='rtl'] .slick-next { right: auto; left: -25px; }

.slick-next:before { content: '→'; }

[dir='rtl'] .slick-next:before { content: '←'; }

/* Dots */
.slick-dotted.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; }

.slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; }

.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }

.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }

.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }

.slick-dots li button:before { font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-dots li.slick-active button:before { opacity: .75; color: black; }

.slick-slider { position: relative; display: block; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; }

.slick-track:before, .slick-track:after { content: ""; display: table; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }

[dir="rtl"] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

html, body { line-height: 1.6; background-color: #e7eef5; font-family: "Yu Mincho", "YuMincho", serif; letter-spacing: 1px; }

main { background-color: #bcb195; position: relative; z-index: 30; }

header { position: relative; z-index: 1; }

header h1 { font-family: 'corm_m'; width: 100%; text-align: center; margin: auto; font-size: 5vw; color: #fff; height: 200px; line-height: 1.2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.3); height: 100%; }

header h1 > img { width: 33%; }

.header-video { position: relative; width: 100%; overflow: hidden; }

.header-video video { position: relative; left: 0; top: 0; min-height: 100%; min-height: 100vh; min-width: 100%; min-width: 100vw; }

.header-video.active video { opacity: 0; }

a.header_logo { display: block; position: absolute; left: 3%; top: 20px; width: 91px; z-index: 99998; }


.AudioMute {
  position:absolute;
  top:80px;
  left:60px;
    
  width: 20px;
  height: 20px;
  z-index: 99999;
  }


nav { position: fixed; top: 0; right: 0; width: 300px; height: 100%; transition: 0.5s; background-color: rgba(188, 177, 149, 0.36); z-index: 50; }

nav ul.main-nav { height: 300px; width: 300px; position: absolute; top: 0; left: 0; bottom: 0; margin: auto; }

nav ul.main-nav li a { display: block; line-height: 3; text-decoration: none; color: #000; padding: 0 0 0 20px; font-family: 'corm_b'; }

nav.close { width: 60px; right: 30px; }

nav.close ul.main-nav { left: 0; width: 60px; }

nav.close ul.main-nav li a { display: none; }

.nav-btn { position: fixed; width: 40px; height: 40px; top: 10px; right: 40px; display: block; z-index: 60; }

.nav-btn span { position: absolute; top: 0; right: 0px; color: transparent; display: block; width: 40px; height: 40px; }

.nav-btn__open span:before, .nav-btn__open span:after { content: ""; display: block; width: 30px; height: 1px; background-color: #000; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; }

.nav-btn__open span:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.nav-btn__open span:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.nav-btn__close:before, .nav-btn__close:after, .nav-btn__close span { content: ""; display: block; position: absolute; width: 26px; height: 1px; border-top: 1px solid #000; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }

.nav-btn__close:before { top: 19px; }

.nav-btn__close:after { bottom: 16px; }

.nav-logo { position: fixed; right: 50px; bottom: 10%; width: 20px; height: 40px; }

.fb-logo img { margin-bottom: 20px; }

.menu_logo img { width: 11px; position: fixed; top: 0; bottom: 0; right: 55px; margin: auto; }

.slidein { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: slidein; animation-name: slidein; }

.header-icon { content: ""; position: fixed; bottom: 0; right: 0; left: 0; margin: auto; width: 3px; height: 55px; border-radius: 4px; background: #FFF; z-index: 9999; }

@-webkit-keyframes slidein { from { margin-left: 100%;
    width: 300%; }
  to { margin-left: 0%;
    width: 100%; } }

@keyframes slidein { from { margin-left: 100%;
    width: 300%; }
  to { margin-left: 0%;
    width: 100%; } }

.fadeOut { -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-name: fadeout; animation-name: fadeout; opacity: 0; }

@-webkit-keyframes fadeout { from { opacity: 1; }
  to { opacity: 0; } }

@keyframes fadeout { from { opacity: 1; }
  to { opacity: 0; } }

.nav-btn__open, .nav-btn__close { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: active2; animation-name: active2; opacity: 1; }

.nav-btn span.active { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: active; animation-name: active; opacity: 0; }

@-webkit-keyframes active { 0% { opacity: 1;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  10% { opacity: 0; }
  100% { opacity: 0;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes active { 0% { opacity: 1;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  10% { opacity: 0; }
  100% { opacity: 0;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@-webkit-keyframes active2 { 0% { opacity: 0;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  10% { opacity: 1; }
  100% { opacity: 1;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes active2 { 0% { opacity: 0;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  10% { opacity: 1; }
  100% { opacity: 1;
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

.default_open { visibility: hidden; }

.default_close { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: active3; animation-name: active3; opacity: 1; }

@-webkit-keyframes active3 { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } }

@keyframes active3 { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  to { -webkit-transform: rotate(0deg); transform: rotate(0deg); } }

.move_bitTop { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: move_bitTop; animation-name: move_bitTop; }

@-webkit-keyframes move_bitTop { 0% { bottom: 0px; }
  50% { bottom: 40px; }
  100% { bottom: 0px; } }

@keyframes move_bitTop { 0% { bottom: 0px; }
  50% { bottom: 40px; }
  100% { bottom: 0px; } }

.move_bitDown { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-name: move_bitDown; animation-name: move_bitDown; }

@-webkit-keyframes move_bitDown { 0% { bottom: 0px; }
  50% { bottom: -40px; }
  100% { bottom: 0px; } }

@keyframes move_bitDown { 0% { bottom: 0px; }
  50% { bottom: -40px; }
  100% { bottom: 0px; } }

.carousel li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }

.carousel li a.pop { width: 50%; position: relative; }

.carousel li a.pop:before { content: ""; width: 100%; height: 100%; display: block; position: absolute; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.3); z-index: 5; }

.carousel li a.pop:hover:before { background-color: transparent; }

.carousel li a.pop img { z-index: 1; position: relative; }

.sec_02__message { padding: 36px 0; text-align: center; }

.sec_02__message span { font-size: 0.9vw; display: block; margin-bottom: 24px; line-height: 2; letter-spacing: 1.6px; }

.sec_02__message a { color: #fff; font-size: 0.9vw; letter-spacing: 2px; text-decoration: none; }

.pop p { position: absolute; top: 60%; left: 8%; line-height: 1.2; color: #FFF; bottom: 0; margin: auto; font-size: 1vw; letter-spacing: 2.5px; height: 70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; z-index: 10; }

.close_btn:hover { cursor: pointer; }

.popupbg { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.65); visibility: hidden; z-index: 9999; }

.popup_wrapper { position: absolute; left: 0; right: 0; bottom: 0; margin: auto; z-index: 0; text-align: center; width: 70%; visibility: hidden; }

.close_btn { position: absolute; top: 0; left: 0; right: 0; margin: auto; background: #3e3a39; width: calc(10vmin - 60px); height: calc(10vmin - 60px); }

.close_btn:before, .close_btn:after { width: 20px; height: 1px; background: #FFF; content: ""; display: block; position: absolute; top: 0; right: 0; left: 0; bottom: 0; margin: auto; }

.close_btn:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.close_btn:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }

.slick-prev:before, .slick-next:before { font-family: 'slick'; font-size: 30px; line-height: 1; opacity: .45; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev { left: -10px; z-index: 9999; }

.slick-next { right: -10px; z-index: 9999; }

.slick-dots li.slick-active button:before { color: #FFF; }

.slick-dots li button:before { font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; color: #a9a9a9; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slider-caption { position: absolute; bottom: 5%; letter-spacing: 2.7px; line-height: 2; left: 4%; color: #fff; font-size: 1vw; font-weight: normal; text-align: left; }

ul#instafeed {
  width: 98%;
  height: 600px;
  margin: 20px auto;
  overflow: hidden;
}

ul#instafeed li {
  width: 100%;
  position: relative;
  opacity: 0;
}

ul#instafeed li.active {
  opacity: 1;
}

ul#instafeed a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

ul#instafeed a img {
  width: 100%;
  height: 600px;
  -o-object-fit: cover;
  object-fit: cover;
}

ul#instafeed a:before, ul#instafeed a:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 100;
  transition: opacity .5s ease-in-out;
  opacity: 0;
  will-change: opacity;
}

ul#instafeed a:before {
  background-color: #fff;
}

ul#instafeed a:after {
  background-image: url(https://ourplace.jp/image/Instagram_logo.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10%;
}

ul#instafeed a:hover:before {
  opacity: .3;
}

ul#instafeed a:hover:after {
  opacity: 1;
}

ul#instafeed li:nth-of-type(1) {
  z-index: 10;
}

section.sec_04 iframe { width: 100% !important; }

footer { background-color: #bcb195; }

footer address { text-align: center; }

footer h4 { padding: 16px 0 8px; font-size: 0.9vw; }

footer span { font-size: 80%; }

footer span.device-pc { display: inline-block; font-size: 100%; }

footer li:last-child { font-size: 0.9vw; margin-top: 4px; }

.footer-logo { width: 70px; margin: 36px auto 24px; }

.copy { font-size: 70%; padding-bottom: 12px; }

.sec_05{
background-color: #bcb195;
  margin-right: 0px;
  padding: 16px 0 8px; font-size: 0.9vw;
  text-align: center;
}
.sec_05 h4{
  padding: 16px 0 8px; font-size: 0.9vw;
}
.sec_05 h5{
  padding: 16px 0 8px; font-size: 0.9vw;
}

.sec_05 a{
    color: #fff;
    font-size: 0.9vw;
    letter-spacing: 2px;
    text-decoration: none;
}