@charset "utf-8"; 
a, abbr, acronym, address, applet, article, aside, audio,b, big, blockquote, body, caption, canvas, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, main, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td, u, ul, var, video{font-size:100%; vertical-align:baseline; white-space:normal; margin:0; padding:0; border:0; outline:0; background:transparent;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main{display:block;} ol, ul{list-style:none;} blockquote, q{quotes:none;}table{border-collapse:collapse; border-spacing:0;} *{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; -webkit-text-size-adjust:100%;} img{vertical-align:top; width: 100%;height: auto;} h1, h2, h3, h4, h5, h6{font-weight:normal;}


/*---------------------------
Link
---------------------------*/
a{outline:none; text-decoration: none; color: #302210;}
a:hover{ opacity: 0.8;}
a img:hover{ opacity: 0.8;}
a:hover{-webkit-transition:all .5s ease; transition:all .5s ease;}


@media screen and (max-width: 450px) {
a:hover{ opacity:1;}
}


/*---------------------------
Body
---------------------------*/

html{scroll-behavior: smooth;}
body{font-family:"Noto Serif JP", serif; font-style: normal; font-weight: 400; color: #302210; word-wrap:break-word; font-kerning:normal;font-size:13px;letter-spacing: 0.15em;overflow-x: hidden;background: #F9F7F2;}



/*---------------------------
共通
---------------------------*/
.cf:before,
.cf:after {content: " ";display: table;}
.cf:after {clear: both;}
.cf{*zoom: 1;}

.pc{display:block;}
.sp{display:none;}

@media screen and (max-width: 750px) {
.pc{display:none;}
.sp{display:block;}
}

h2{font-size: 18px; text-align: center; letter-spacing: 0.15em;font-family: "Lora", serif; font-weight: 500; }
h3{font-size: 15px; font-family: 'Lora', serif;position: relative;text-align: center; letter-spacing: 0.15em;font-weight: 500;}
h3:before, h3:after {content: ''; position: absolute;top: 50%;display: inline-block;width: 40%;height: 1px;background-color:#302210;}
h3:before {left:0;}
h3:after {right: 0;}
.reserve-btn{max-width:400px; width: 100%; margin: 70px auto 0;}
.reserve-btn.mb{ margin: 70px auto;}
.reserve-btn a{display: block; text-align: center; border: 1px solid #302210; background: #302210; color: #fff; padding:25px 20px; border-radius: 100px; font-size: 15px; letter-spacing: 0.2em; line-height: 1;}
.reserve-btn a:hover{background:#7F6F5E; border: 1px solid #7F6F5E;color: #fff; }
.reserve-txt{font-size:13px; padding: 5px; border: 1px solid #302210;text-align: center; margin-bottom: -40px;}

@media screen and (max-width: 1250px) {
.reserve-btn{max-width:32vw; margin: 5.6vw auto 0;}
.reserve-btn.mb{ margin: 5.6vw auto;}
.reserve-btn a{padding:2vw 1.6vw; font-size:1.2vw;}
.reserve-txt{margin-bottom: -20px;font-size:1.04vw;}
}

@media screen and (max-width: 450px) {
.reserve-btn{max-width:none; margin:10vw auto 0;}
.reserve-btn.mb{ margin: 5.6vw auto;}
.reserve-btn a{padding:5.55vw 4.44vw; font-size:3.33vw;}
.reserve-btn a:hover{background:#302210; border: 1px solid #302210;color: #fff; }
.reserve-txt{margin-bottom: 0;font-size:2.88vw;}
h3{margin-top: 11.1vw;}
h3:before, h3:after {width: 35%;}
}

/*---------------------------
コンテンツ
---------------------------*/
.wrapper{position: relative;width: 100%;height: 100vh;}
.main{position: relative;width: 100%;height: 100vh;}
.hero{position: relative;height: 100vh;width: 78%;margin-left:22%;overflow-x: hidden;}
.hero li{ height: 100vh; width: 100%;}
.hero li:first-child{background: url("../img/hero01.jpg") no-repeat center;background-size:cover;}
.hero li:nth-child(2){background: url("../img/hero02.jpg") no-repeat center;background-size:cover;}
.hero li:nth-child(3){background: url("../img/hero03.jpg?250702") no-repeat center;background-size:cover;}
.hero li:nth-child(4){background: url("../img/hero04.jpg") no-repeat center;background-size:cover;}
.hero li:nth-child(5){background: url("../img/hero05.jpg") no-repeat center;background-size:cover;}
.hero .copy{position: absolute;top: 42%; left: 0; right: 0; margin: auto;z-index: 1; text-align: center; font-size: 40px; letter-spacing: 0.15em;font-family: "Lora", serif; color: #fff;}

@media screen and (max-width: 1250px) {
.hero .copy{font-size: 3.2vw;}
}

@media screen and (max-width: 750px) {
.hero{height: 100vh;width: 100%;margin-left:0;}
}

@media screen and (max-width: 450px) {
.main{width: 100%;height: 55vh;}
.hero{height: 55vh;width: 100%;margin-left:0;}
.hero li{ height: 55vh; width: 100%;}
.hero li:first-child{background: url("../img/hero01.jpg") no-repeat right center;background-size:cover;}
.hero .copy{font-size: 6.66vw;}
}

.side{position: fixed;width: 22%;height: 100vh;top: 0;left: 0; background:#fff;}
.side h1{max-width: 260px; width: 80%; position: absolute; top: 35%; left: 0; right: 0; margin: auto;}
.side .side-btn{position: absolute; bottom: 0px; left: 0; right: 0; margin: auto;width: 100%;}
.side .side-btn a{display: block; text-align: center; border: 1px solid #302210; color: #fff; background: #302210; padding:20px; font-size: 15px; letter-spacing: 0.2em; line-height: 1;}
.side .side-btn a:hover{background:#7F6F5E; color: #fff; border: 1px solid #7F6F5E;}

@media screen and (max-width: 1250px) {
.side .side-btn a {font-size:1.2vw; padding:1.6vw;}
}

.container{width: 78%;margin-left:22%;}

@media screen and (max-width: 750px) {
.container{width: 100%;margin-left:0;}
}

.about{padding: 100px 0 0 0;}
.about .inner{max-width: 980px; width: 85%; margin: 50px auto 0;}
.about .body-copy{font-size:20px; text-align: center; line-height: 1.8; font-weight: 500;}
.about .copy{font-size:15px; text-align: center; margin-top: 30px; line-height: 2.0;}
.about .pro-box{background: #fff; border: 1px solid #302210; box-sizing: border-box; padding: 50px 80px; margin-top:70px;}
.about .pro-box .profile{display: flex; justify-content: center; align-items: center;}
.about .pro-box .profile .pict{width: 20%; margin-right: 5%;}
.about .pro-box .profile .txt-box{width: 75%;}
.about .pro-box .profile .txt-box .credit{font-size:13px;font-family: "Lora", serif; }
.about .pro-box .profile .txt-box .name{font-size:15px;font-family: "Lora", serif; margin-top: 20px;font-weight: 500; }
.about .pro-box .profile .txt-box .day{font-size:13px;margin-top: 10px;}
.about .pro-box .txt{font-size:13px;line-height: 2.0; margin-top: 30px;}

@media screen and (max-width: 1250px) {
.about{padding: 8vw 0 0 0;}
.about .inner{margin: 4vw auto 0;}
.about .body-copy{font-size:1.6vw;}
.about .copy{font-size:1.2vw; margin-top: 2.4vw;}
.about .pro-box{padding:4vw 6.4vw; margin-top:5.6vw;}
.about .pro-box .profile .txt-box .credit{font-size:1.04vw;}
.about .pro-box .profile .txt-box .name{font-size:1.2vw;  margin-top: 1.6vw;}
.about .pro-box .profile .txt-box .day{font-size:1.04vw; margin-top: 0.8vw;}
.about .pro-box .txt{font-size:1.04vw; margin-top: 2.4vw;}
}

@media screen and (max-width: 450px) {
.about{padding: 13.3vw 0 0 0;}
.about .inner{margin: 6.66vw auto 0;}
.about .body-copy{font-size:3.55vw;}
.about .copy{font-size:2.88vw; margin-top:4.44vw;}
.about .pro-box{padding:6.66vw; margin-top:10vw;}
.about .pro-box .profile{display: block;}
.about .pro-box .profile .pict{width: 50%; margin:0 auto;}
.about .pro-box .profile .txt-box{width: 100%; margin-top: 4.44vw;text-align: center;}
.about .pro-box .profile .txt-box .credit{font-size:2.66vw; letter-spacing: 0.05em; }
.about .pro-box .profile .txt-box .name{font-size:3.33vw;  margin-top: 1.6vw; letter-spacing: 0.05em;}
.about .pro-box .profile .txt-box .day{font-size:2.66vw; margin-top:1.6vw;letter-spacing: 0.05em;}
.about .pro-box .txt{font-size:2.88vw; margin-top: 4.44vw;}
}

.pran{padding: 100px 0 0 0;}
.pran .inner{max-width: 980px; width: 85%; margin: 50px auto 0;}
.pran .menu-box{display: flex; justify-content:center; margin-bottom: 70px; flex-wrap: wrap;}
.pran .menu-box li{width: 47.5%; margin-right: 5%; margin-bottom: 50px;}
.pran .menu-box li:nth-child(2n){margin-right: 0;}
.pran .menu-box li:nth-child(n+5){margin-bottom:0;}
.pran .menu-box li h4{font-size:15px; margin-top: 20px; font-weight: 500;}
.pran .menu-box li h4 span{font-size:13px;color: #583519; font-family: "Lora", serif;}
.pran .menu-box li .price{font-size:15px; margin-top:20px;font-weight: 500;}
.pran .menu-box li .txt{font-size:13px; margin-top:20px; line-height: 1.8;}
.pran .menu-box li .txt span{font-size:13px;color: #583519; font-family: "Lora", serif; margin-top:5px; display: block; text-indent: -1em; padding-left: 1em;}
.pran .menu-box li .txt span a{color:#583519; text-decoration: underline;}
.pran .menu-box.clum3{margin-top: 30px; margin-bottom: 0;}
.pran .menu-box.clum3 li{width: 30%; margin-right: 5%; margin-bottom: 50px;}
.pran .menu-box.clum3 li:nth-child(3n){margin-right: 0;}
.pran .menu-box.clum3 li:nth-child(n+4){margin-bottom:0;}
.pran .note-box{}
.pran .note-box p{font-size:13px; padding-left: 1em; text-indent: -1em; line-height: 1.8; text-align: center; margin-top: 30px;}

.pran .menu-box li .detaile-btn{max-width: 230px; margin-top: 20px;}
.pran .menu-box li .detaile-btn a{display: block; text-align: center; border: 1px solid #A08C7C; background: #A08C7C; color: #fff; padding:10px 5px; border-radius: 100px; font-size: 12px; letter-spacing: 0.2em; line-height: 1;}

#option{margin-top: -100px; padding-top: 100px;}

.a-modal-org h4{font-size:18px; margin-top: 20px; font-weight: 500; text-align: center;}
.a-modal-org h4 span{display: block;font-size:15px; margin-top: 10px;}
.a-modal-org .box{display: flex; justify-content: center; align-items: flex-start; margin-top: 30px;}
.a-modal-org .box .pict{width: 48%; margin-right: 4%}
.a-modal-org .box .txt{width: 48%;font-size:13px;line-height: 1.8;}
.a-modal-org .box .txt span{color: #A08C7C; margin-bottom: 10px; display: block; font-weight: 500;}

@media screen and (max-width: 1250px) {
.pran{padding: 8vw 0 0 0;}
.pran .inner{margin: 4vw auto 0;}
.pran .menu-box{ margin-bottom: 5.6vw;}
.pran .menu-box li{margin-bottom: 3.2vw;}
.pran .menu-box li h4{font-size:1.2vw;margin-top: 1.6vw;}
.pran .menu-box li h4 span{font-size:1.04vw;}
.pran .menu-box li .price{font-size:1.2vw;margin-top:1.6vw;}
.pran .menu-box li .txt{font-size:1.04vw;margin-top:1.6vw;}
.pran .note-box p{font-size:1.04vw;}
.pran .menu-box li .txt span{font-size:1.04vw; margin-top:0.4vw;}
.pran .menu-box.clum3{margin-top: 30px; margin-bottom: 0;}
.pran .menu-box.clum3 li{margin-bottom: 3.2vw;}
.pran .menu-box.clum3 li:nth-child(n+4){margin-bottom:0;}
.pran .menu-box li .detaile-btn{max-width: 32vw; margin-top: 1.6vw;}
.pran .menu-box li .detaile-btn a{padding:0.8vw 0.4vw; font-size: 0.96vw;}

.a-modal-org h4{font-size:1.44vw; margin-top: 1.6vw;}
.a-modal-org h4 span{font-size:1.2vw; margin-top: 0.8vw;}
.a-modal-org .box{margin-top: 2.4vw;}
.a-modal-org .box .txt{font-size:1.04vw;}
.a-modal-org .box .txt span{ margin-bottom: 0.8vw;}

}


@media screen and (max-width: 450px) {
.pran{padding: 13.3vw 0 0 0;}
.pran .inner{margin: 6.66vw auto 0;}
.pran .menu-box{display: block; margin-bottom: 8.88vw;}
.pran .menu-box li{width: 100%; margin-right:0; margin-bottom: 11.1vw;}
.pran .menu-box li:nth-child(n+5){margin-bottom: 11.1vw;}
.pran .menu-box li h4{font-size:3.55vw;margin-top: 3.33vw;}
.pran .menu-box li h4 span{font-size:2.88vw;}
.pran .menu-box li .price{font-size:3.55vw;margin-top:2.22vw;}
.pran .menu-box li .txt{font-size:2.88vw;margin-top:2.22vw;}
.pran .menu-box.clum3{margin-top: 6.66vw; margin-bottom: 0;}
.pran .menu-box.clum3 li{width: 100%;margin-bottom: 11.1vw;}
.pran .menu-box.clum3 li:nth-child(n+4){margin-bottom: 11.1vw;}
.pran .note-box p{font-size:2.88vw;margin-top: 5.55vw;}
.pran .menu-box li .txt span{font-size:2.88vw; margin-top:2.22vw;}

#option{margin-top: -50px; padding-top: 50px;}

.pran .menu-box li .detaile-btn{max-width:none; width: 100%; margin-top: 4.44vw;}
.pran .menu-box li .detaile-btn a{padding:3.33vw 1.11vw; font-size: 3.33vw;}

.a-modal-org h4{font-size:4vw; margin-top:0;}
.a-modal-org h4 span{font-size:3.33vw; margin-top: 0.8vw;}
.a-modal-org .box{display: block;margin-top: 4.44vw;}
.a-modal-org .box .pict{width: 100%; margin-right: 0%}
.a-modal-org .box .txt{font-size:2.88vw; width: 100%; margin-top: 4.44vw;}
.a-modal-org .box .txt span{ margin-bottom: 2.22vw;}

}


.info{padding: 30px 0 0 0;}
.info .inner{max-width: 980px; width: 85%; margin: 50px auto 0;}
.info li{font-size: 13px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;border-bottom: 1px dashed #7F6F5E;padding:30px;}
.info li:first-child{padding:0 30px 30px 30px;}
.info li h4 {font-weight: 500; width: 25%; text-align: center;}
.info li p{width: 75%;}

@media screen and (max-width: 1250px) {
.info{padding: 2.4vw 0 0 0;}
.info .inner{margin: 4vw auto 0;}
.info li{font-size:1.04vw;}
}

@media screen and (max-width: 450px) {
.info{padding: 6.66vw 0 0 0;}
.info .inner{margin: 6.66vw auto 0;}
.info li{font-size:2.88vw;padding:4.44vw; line-height: 1.8;}
.info li:first-child{padding:0 4.44vw 4.44vw 4.44vw;}
.info li h4 {text-align: left;}
}

.insta{padding: 100px 0;}
.insta .inner{max-width: 980px; width: 85%; margin: 50px auto 0;}

@media screen and (max-width: 1250px) {
.insta{padding: 8vw 0;}
.insta .inner{margin: 4vw auto 0;}
}

@media screen and (max-width: 450px) {
.insta{padding: 13.3vw 0 0 0;}
.insta .inner{margin: 6.66vw auto 0;}
}

footer{padding: 20px;}
footer p{font-size:12px; text-align: center;font-family: "Lora", serif;}

@media screen and (max-width: 450px) {
footer{padding:50px 20px 90px 20px;}
}


.sp-reserve-btn{position: fixed; bottom: 0; left: 0; right: 0;width:100%; z-index: 1;}
.sp-reserve-btn a{display: block; text-align: center; border: 1px solid #7F6F5E; color: #fff; background: #7F6F5E; padding:5.55vw 4.44vw;  font-size: 3.33vw; letter-spacing: 0.2em; line-height: 1;}

.campaign-btn{position: fixed; bottom:20px; right:20px; width:200px; z-index: 1;}

@media screen and (max-width: 1250px) {
.campaign-btn{width:16vw;}
}

@media screen and (max-width: 450px) {
.campaign-btn{width:33.3vw; bottom:75px; right:10px;}
}


header{width: 100%;}


#btn {
  display: none;
}


nav {
  position: fixed; z-index: 2;
  left: 0;
  right: 0;
  margin: auto;
  background: none;
}
nav a {
  margin-left: 25px;
  font-family: "Lora", serif;
  font-size: 15px;
  font-weight: 500;
  line-height: 1;
}

nav a span{margin-left:5px; font-size: 20px;}

nav .box{display: flex;  justify-content:flex-end;align-items: center;padding:0 70px; margin: 0 auto;height: 110px;width: 100%;}

nav a:hover { opacity: 0.8;
}
nav .logo a{
margin-left: 0;
}
nav .logo a:hover{
border-bottom: none;
}

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

nav a {
  margin-left: calc(20/1250 * 100vw);
  font-size: calc(15/1250 * 100vw);
}

}




@media screen and (max-width: 750px) {
header{height: 70px; position: fixed; z-index: 3; top: 0;}
header .logo{width: 100px; display: flex; align-items: center; height: 80px;margin: 0 auto; padding-left: 0;}
nav{margin-top: 0; display: block; border: none; background:#F9F7F2; padding: 0;}
nav .box{display: block; padding:0 20px; margin: 0 auto;height: 70px;width: 100%;}
nav::before{display: none;}
  #btn {
    position: fixed;
    top: 12px;
    right: 10px;
    width: 44px;
    height: 44px;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
    cursor: pointer;
  }
  #btn span {
    display: block;
    background-color: #302210;
    width: 36px;
    height: 2px;
    transition: all 0.5s ease;
  }
  #btn.on span {
    background-color: #302210;
  }
  #btn.on span:nth-of-type(1) {
    transform: translateY(11px) rotate(45deg);
  }
  #btn.on span:nth-of-type(2) {
    transform: scale(0);
  }
  #btn.on span:nth-of-type(3) {
    transform: translateY(-12px) rotate(-45deg);
  }
  nav {
    flex-direction: column;
    align-items: center;
    padding: 20px 0;
    transition: all 0.5s ease;
    top: -130vh;
    height: 100vh;
  }
  nav.on {
    top: 0;
    height: 100vh;
    overflow-x: scroll;
  }
  nav a {
    margin: 50px auto;
    display: block;
    text-align: center;
    font-size: 18px;
    border: none;
    color: #302210;
  }
}



/** VARIABLES
===================================*/
/** RESET AND LAYOUT
===================================*/
.bx-wrapper {
  position: relative;
  padding: 0;
  *zoom: 1;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  margin: 0 auto;
}
.bx-wrapper img {
  max-width: 100%;
  display: block;
}
.bxslider {
  margin: 0;
  padding: 0;
}
ul.bxslider {
  list-style: none;
}
.bx-viewport {
  /*fix other elements on the page moving (on Chrome)*/
  -webkit-transform: translatez(0);
}
/** THEME
===================================*/
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  position: absolute;
  bottom: -30px;
  width: 100%;
}

@media screen and (max-width: 750px) {
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  bottom: -20px;
}
}

/* PAGER */
.bx-wrapper .bx-pager {
  text-align: center;
  font-size: .85em;
  font-family: Arial;
  font-weight: bold;
  color: #666;
  padding-top: 20px;
}
.bx-wrapper .bx-pager.bx-default-pager a {
  background: #999;
  text-indent: -9999px;
  display: block;
  width: 10px;
  height: 10px;
  margin: 0 5px;
  outline: 0;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #302210;
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
  display: inline-block;
  vertical-align: bottom;
  *zoom: 1;
  *display: inline;
}
.bx-wrapper .bx-pager-item {
  font-size: 0;
  line-height: 0;
}
/* DIRECTION CONTROLS (NEXT / PREV) */


.bx-wrapper .bx-prev {
  left: 10px;
  background: url('../imgs/controls_prev.png') no-repeat;
  background-size: cover;
  width: 27px;
  height: 50px;
}
.bx-wrapper .bx-next {
  right: 10px;
  background: url('../imgs/controls_next.png') no-repeat;
  background-size: cover;
  width: 27px;
  height: 50px;
}

.bx-wrapper .bx-controls-direction a {
  position: absolute;
  top: 42%;
  outline: 0;
  text-indent: -9999px;
  z-index: 1;
}


@media screen and (max-width: 750px) {
.bx-wrapper .bx-controls-direction a {
  top:40%;
}
.bx-wrapper .bx-prev {
  width: 15px;
  height: 27px;
  left: 5px;
}
.bx-wrapper .bx-next {
  width: 15px;
  height: 27px;
  right: 5px;
}
}
.bx-wrapper .bx-controls-direction a.disabled {
  display: none;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
  text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
  display: block;
  text-indent: -9999px;
  width: 10px;
  height: 11px;
  outline: 0;
  background: url('images/controls.png') -86px -11px no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active,
.bx-wrapper .bx-controls-auto .bx-start:focus {
  background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
  display: block;
  text-indent: -9999px;
  width: 9px;
  height: 11px;
  outline: 0;
  background: url('images/controls.png') -86px -44px no-repeat;
  margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active,
.bx-wrapper .bx-controls-auto .bx-stop:focus {
  background-position: -86px -33px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
  text-align: left;
  width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
  right: 0;
  width: 35px;
}
/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  background: #666;
  background: rgba(80, 80, 80, 0.75);
  width: 100%;
}
.bx-wrapper .bx-caption span {
  color: #fff;
  font-family: Arial;
  display: block;
  font-size: .85em;
  padding: 10px;
}


.scroolbox {
  width: 200px;
  height: 100%;
  position:absolute;
  overflow: hidden;
  z-index: 1;
  bottom: 200px; right: -40px;
}

@media screen and (max-width: 750px) {
.scroolbox{right: -60px;bottom: 60px;}
}

/* アニメーション設定 */
.arrowWrap {
  position: absolute;
  right: 0;
  bottom: 30px;
  height: 200px
}

.arrowInner p {
  font-size: 10px;
  text-align: end;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  letter-spacing: 1em;
  color: #302210;
  font-family: "Lora", serif;
}

.arrow {
  width: 2px;
  height: 100px;
  margin: 90px auto 0;
  background-color: #eee;
  position: relative;
  overflow: hidden;
  background: none;
}

.arrow::before {
  content: '';
  width: 2px;
  height: 100px;
  margin: 50px auto 0;
  background-color: #302210;
  position: absolute;
  top: -150px;
  left: 0;
  -webkit-animation: arrow 2.5s ease 0s infinite normal;
  animation: arrow 2.5s ease 0s infinite normal;
}

@keyframes arrow {
  0% {
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0);
  }

  60% {
    -webkit-transform: translate3d(-50%, 100px, 0);
    transform: translate3d(-50%, 100px, 0);
  }

  100% {
    -webkit-transform: translate3d(-50%, 100px, 0);
    transform: translate3d(-50%, 100px, 0);
  }
}






.a-modal-org {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 190002;
}
.a-modal-org__inner {
  display: flex;
  align-items: center;
  margin: 0 auto;
  height: 100%;
}
@media print, screen and (min-width: 737px) {
  .a-modal-org__inner {
    width: 80vw;
    max-width: 1000px;
  }
}
@media screen and (max-width: 736px) {
  .a-modal-org__inner {
    width: 85vw;
  }
}
.a-modal-org__inner2 {
  position: relative;
  width: 100%;
}
.a-modal-org__inner3 {
  background-color: #ffffff;
}
@media print, screen and (min-width: 769px) {
  .a-modal-org__inner3 {
    max-height: 80vh;
    border-radius: 12px;
    border: 1.5rem solid #fff;
  }
}
@media print, screen and (max-width: 768px) {
  .a-modal-org__inner3 {
    max-height: 80vh;
    border-radius: 6px;
    border: 0.8rem solid #fff;
    padding: 10px;
  }
}
.a-modal-org__body {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}
.a-modal-org__scroll.is-scroll {
  overflow-y: scroll;
}
@media print, screen and (min-width: 769px) {
  .a-modal-org__scroll.is-scroll {
    padding-right: 0.5rem;
  }
}
.a-modal-org__close {
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
}
.a-modal-org__btn {
  box-sizing: border-box;
  background-color: #333333;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
}
.a-modal-org__btn-inner {
  display: inline-block;
  box-sizing: border-box;
  width: 20px;
  height: 20px;
  position: relative;
}
.a-modal-org__btn-inner::before, .a-modal-org__btn-inner::after {
  position: absolute;
  content: "";
  margin: auto;
  box-sizing: border-box;
  vertical-align: middle;
}
.a-modal-org__btn-inner::before {
  border-top: 2px solid #ffffff;
  width: 20px;
  height: 0;
  top: 0;
  bottom: 0;
  left: 0;
  transform: rotate(45deg);
}
.a-modal-org__btn-inner::after {
  border-left: 2px solid #ffffff;
  width: 0;
  height: 20px;
  top: 0;
  bottom: 0;
  left: 9px;
  transform: rotate(45deg);
}

/*=========
utility - display-off
=========*/

.a-display-off {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  overflow: hidden;
  padding: 0;
  clip: rect(0, 0, 0, 0);
}

/*=========
layout - a-modal-org-overlay
=========*/

.a-modal-org {
  display: none;
  z-index: 190001;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.7);
}