@font-face {
  font-family: yumin;
  src: url(../font/yumin.ttf);
}
html, body {
  width: 100%; overflow-x: hidden; overflow-y: auto;
}
body { font-family: "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", Times, Garamond, Georgia, serif; }
.android body, .android pre, .android input, .android textarea, .android select { font-family: yumin, "Noto Serif JP", "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", Times, Garamond, Georgia, serif; }
h2 { font-size:25px; font-weight: 500; text-align: center; padding-bottom:20px; }
h3,h4 { font-weight: normal; }
p { line-height: 2em; font-size: 15px; color:#000; font-weight: 200; }

/* =========================================================
/  HEADER
/ ========================================================= */
.header-inner .gnav__link { font-size:15px; }
.header-inner .gnav__link.-reserve { background: none;border:1px solid #fff;padding:10px 20px;font-size: 15px}
.header-inner .gnav__link.-reserve:hover { background: #fff;color:#000}
.header-inner .gnav__item { position: relative; padding: 20px 0; }
.header-inner .gnav__link_child { height: 0; opacity: 0; position: absolute; top: 100%; left: 0; width: 200px; padding: 0 17px; background:rgba(0, 0, 0, 0.34); color: #fff; transition: .4s all ease; font-size: 15px; }
.header-inner .gnav__item:hover .gnav__link_child { display: block; height: auto; padding-top: 14px; padding-bottom: 14px; opacity: 1; }
.header-inner .gnav__link:after{background:#fff}
.nav-btn { list-style: none; }
.lang-btn { width: 100px; font-size:15px; border:none; padding-right: 20px; display: inline; position: relative; bottom: auto; left: auto; cursor: pointer }
.lang-btn .jp-link { display: none }
.lang-btn__list.-active { background: none; top: 40px; right: 20px; }
.lang-btn__list.-active a { border: 1px solid #fff; }
.lang-btn:after { content: " "; border: solid #fff; border-width: 0 2px 2px 0; display: inline-block; padding: 2px; transform: rotate(45deg); -webkit-transform: rotate(45deg); margin-bottom:2px }
.nav-btn h4{display: inline;color:#fff;padding-right: 10px;font-size:15px;padding-left:22px;border-left: 1px solid grey}
.header-fixed.-scroll { box-shadow: 0 3px 4px -2px rgba(0,0,0,.2); }
.bottom-links { bottom:38px;position: absolute;left:40px;z-index: 98}
.bottom-links a { color:#fff;display: inline;margin-right: 10px;font-size: 15px; line-height: 19px;border:1px solid #fff;padding:5px 38px;padding-left:15px;cursor: pointer;text-decoration: none; }
.bottom-links a:first-child { padding-right: 60px }
#hero-line { text-align: center;position: absolute;bottom:0;margin:0 auto;left:0;right: 0;height: 280px;width: 1px;background-color:#fff;left:-5px;z-index: 1;opacity: 25% }
#hero-about-button a { color:#fff; height: 54px; background-color: #B09833; text-align: center; text-decoration: none; line-height: 54px; position: absolute; bottom: 0; right: 0; z-index: 1; padding:0px 23px; }
#hero-about-button a:hover{background: #fff;color:#333}
/* メインスライダー */
.mv { background-color: #fff; overflow: hidden; }
.mv .mv-wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
body.start .mv .mv-wrap { width: calc( 100% - 40px ); height: calc( 100% - 40px ); transition: all 1.2s ease-out; transition-delay: 0s; }
.mv__txt, .mv .mv-wrap:nth-of-type(3) .mv__txt { writing-mode: vertical-rl; text-orientation: upright; font-size:25px; letter-spacing: 13px; line-height: 27px; top:30%!important; left:50%!important; width: 10px!important; height: 500px!important; font-weight: bold; }
@media screen and (max-width: 767px){
  body.start .mv .mv-wrap { width: calc( 100% - 12px ); height: calc( 100% - 12px ); }
}

/*  */
.sec-1 { margin-top:40px;margin-bottom:40px }
.sec-1 .wrapper { text-align:center }
.sec-1 .p2 { padding-top:48px }

/* 日本の歴史と文化を三井寺で体感する */
.sec-2 { overflow: hidden; }
.sec-2 .title{ padding-bottom: 94px }
.sec-2 .title h4 {font-size:19px;line-height: 21px;margin-bottom:33px!important}
.sec-2 .title h3 {font-size:24px;line-height: 33px;}
.sec-2 .title span { display: inline-block; width:123px; border-top: 1px solid #D5D5D5;margin-left:46px;vertical-align: middle; }
.sec-2 .wrapper { text-align: center; }
.sec-2 .text { margin-top: 30px }
.sec-2 .text p { padding-bottom:20px; max-width: unset; letter-spacing: 0; }
.sec-2 .slider22 { display: flex; }
.sec-2 .slider22 .slider_inner { display: flex; }
.sec-2 .slider22 .slider_item { min-width: 450px; }
.sec-2 .slider22 .slider_item img { width: 98%; }
@media only screen and (max-width:767px) {
  .sec-2 .slider22 .slider_item { min-width: 300px; }
}
.slider22 .slider_inner:first-child { animation: loop 90s linear infinite; }
.slider22 .slider_inner:nth-child(2) { animation: loop2 90s -120s linear infinite; }
.slider22 .slider_inner:last-child { animation: loop3 90s -60s linear infinite; }
@keyframes loop {
  0% { transform: translateX(200%); }
  to { transform: translateX(-100%); }
}
@keyframes loop2 {
  0% { transform: translateX(100%); }
  to { transform: translateX(-200%); }
}
@keyframes loop3 {
  0% { transform: translateX(0%); }
  to { transform: translateX(-300%); }
}
.more { margin:0 auto; margin-top:150px; text-align: center; padding-bottom: 40px }
.more img{display: inline;transform: rotate(180deg);margin-left:40px;}
.wrapper { max-width: 1200px; margin:0 auto }
.bottom-links a:hover { background: #fff; color:#333 }
.btn { width: 405px; height: 62px; border:1px solid #707070; line-height: 62px; text-decoration: none; font-size:15px; position: relative; }
@media screen and (min-width:768px){
  #textBg2 .btn { width: 600px; }
}
.btn > * { display: inline; }
.btn img { padding-top: 25px; position: absolute; right: 20px; }


/* 滋味染みわたる「近江懐石」、心身をととのえる */
.sec-4 { text-align: center; margin-bottom:40px; }
.sec-4 .content { margin-top:20px;display:grid;grid-template-columns: repeat(5,1fr);grid-gap:13px;margin-bottom:20px }
.sec-4 .content .col:nth-of-type(2) { grid-column: span 3; }
.sec-4 .content img { height: 100%;width: 100%;object-fit: cover; }
.sec-4 .content .col { width: 100%;height: 600px; }

/* 歴史と過ごす宿坊「和空三井寺」 */
.sec-3 { text-align: center; margin-bottom:40px; margin-top:40px; }
.sec-3 .content { height: 690px; display: grid; grid-template-columns: repeat(2,1fr); grid-gap:10px; margin-bottom: 20px }
.sec-3 .content .col figure { width: 100%; height: 100%; }
.sec-3 .content .col img {width: 100%; height: 100%; object-fit: cover; }
.sec-3 .content .col:nth-of-type(2) { display: grid; grid-template-columns: repeat(2, 1fr); }
.sec-3 .content .text { margin-top:20px; margin-bottom:20px }


/* 国宝体験 */
.sec-5 { margin-bottom:40px; text-align: center; }
.sec-5 .text { width: 90%; color: white; font-size: 18px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.sec-5 .first-row { display:grid; grid-template-columns: repeat(3, 1fr); grid-gap:13px; margin-bottom:13px; min-height: 400px; }
.sec-5 .first-row img { width: 100%; height: 100%; object-fit: cover;}
.sec-5 .second-row { display:grid;grid-template-columns: repeat(4, 1fr); grid-gap: 13px; }
.sec-5 .text,.sec-5 .second-row .text {font-size: 12px!important;}
.sec-5 .text .overTitle,.sec-5 .second-row .text .overTitle {font-size: 130%; font-weight: bold; display: block; padding-bottom: 5px; }
.sec-5 .img　{　position: relative;　}
@media screen and (max-width: 1400px) {
  .sec-5 .second-row { display:grid; grid-template-columns: repeat(2, 1fr); }
}
@media screen and (max-width: 767px) {
  .sec-5 .text,.sec-5 {font-size: 12px!important;}
  .sec-5 .first-row {display:grid;grid-template-columns: repeat(1, 1fr)!important;grid-gap:13px;margin-bottom:13px;}
  .sec-5 .first-row img {width: 100%;height: 100%; object-fit: cover;}
  .sec-5 .second-row {display:grid;grid-template-columns: repeat(2, 1fr); }
  .sec-5 .second-row .text {font-size: 10px!important;}
}

#ds { padding-bottom:50px;position: relative; }
#ds:before { content: url('../images/p-icon.svg');width: 9px;height: 12px;padding-right:8px; }
#ds span { display: inline-block; width: 123px; border-top: 1px solid #D5D5D5; vertical-align: middle; position: absolute; left:0; margin-left:-150px; margin-top:18px; }

/* お知らせ */
.sec-6 .wrapper{position: relative;}
.sec-6 .title{text-align: center;padding-bottom:20px;}
.sec-6 .title h4{color:#B09833;font-size:14px;line-height: 19px;font-family: 'EB Garamond'!important}
.sec-6 .title h3{font-size:25px;line-height: 32px;letter-spacing: 2px;padding-bottom:8px;font-weight: 500}
.sec-6 .title p{color:#000;font-size:15px;line-height: 32px;border-bottom:1px solid #707070;padding-bottom:10px;position: absolute;right:0;top:5px;margin-right: 20px}
.sec-6 .item { padding-bottom:10px; padding-top:10px; margin-left:95px; position: relative; border-top: 1px solid #E8E8E8 }
.sec-6 .item { margin:0 }
.sec-6 .item:last-child{border-bottom: 1px solid #E8E8E8}
.sec-6 .item p {max-width: 100%;}
.sec-6 img{position: absolute;right:0;margin-top:-20px;margin-right: 20px;transform: rotate(180deg)}
.sec-6 .item span:nth-child(1){font-size:15px;line-height: 32px;font-family: 'EB Garamond'!important}
.sec-6 .item span:nth-child(2){ font-size:13px;line-height: 32px;border:1px solid black;padding-left:15px;
  padding-right: 35px;padding-top:5px;padding-bottom:5px;margin-left:5px;margin-right:12px;}
.wrapper a { text-decoration: none }
.wrapper a:hover { opacity: 0.8 }


/* ムービー・Youtube */
.sec-7 { background: #fafafa; padding-top:40px }
.sec-7 .video{ padding-top: 56.25%; margin:0 auto; position: relative; }
.sec-7 .video iframe{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

/* アクセス・和空シリーズ */
.footer1 { background:#1A1A1A; padding-top:20px; padding-bottom:20px; }
.footer1 .wrapper2 .item.foot-access{ display: grid; grid-template-columns: 1fr 1fr; column-gap: 10px; }
.footer1 .wrapper2 .item.foot-access .right img { margin-top: 10em; }
.footer1 .left img { width: 90%; margin: 0 auto; height: auto; }
.footer1 .item .title h3{font-size:25px;line-height: 33px;letter-spacing: 2px;padding-bottom:20px}
.footer1 .item .title h4{font-size:19px;color:#B09833;font-family: 'EB Garamond';display: inline;padding-left:16px}
.footer1 .item .title h4{display: inline}
.footer1 .item p{font-size:15px;color:#000;line-height: 20px;margin-bottom:20px; text-align: left;}
.footer1 .item p span{color:#000}
.footer1 .item .left .title:nth-of-type(2) { margin-top:70px }
.footer1 .right .top { display: grid;grid-template-columns: 1fr 1fr;column-gap:35px;padding-right: 30px;row-gap:40px }
.footer1 a img,.footer1 a {width: 100%;}
.footer2 .col{ display: flex;  justify-content: center;	flex-direction: column;	}
.footer2 h4 { margin-top:5px;font-size:15px;color:#000 }
.footer2 .social >a{margin-right: 13px;margin-top:26px}
.footer2 .links{display: grid;}
.footer2 .wrapper{display: grid;grid-template-columns: auto 1fr;column-gap: 120px;}
.footer2 .links {display: grid;grid-template-columns: repeat(3, 1fr);}
.footer2 .links a{display: block;margin:5px 0;font-size:15px}

/* 空室検索 */
.footer-bar { width: 100%; background-color:#FAFAFA; color:#333; font-size:13px; box-shadow: 0px -1px 1px 1px rgba(0,0,0,.2); }
.footer-bar.on { transform: translateX(0%); }
.footer-bar .wrapper-bar form { margin-right: auto; margin-left: auto; }
.footer-bar .wrapper-bar form > *:not(.seek) { height: 100%; border-right: 1px solid #eee; padding-right: 2%; padding-left: 2%; display: flex; align-items: center; }
#ZenSearchFrom { height: 100%; line-height: 1; display: flex; justify-content: center; }
#ZenSearchFrom #name { font-size: 18px; text-align: center; border-left: 1px solid #eee; }
#ZenSearchFrom legend { margin-bottom: 0; }
#ZenSearchFrom #date .text { display: inline-block; vertical-align: middle; position: relative; }
#ZenSearchFrom #date .text:after {content: "";display: block;background: url("../images/calendar.svg") no-repeat;width: 17px;height: 17px;position: absolute;top: 50%;right: 10px;transform: translateY(-14%); }
#ZenSearchFrom #date input[type=text], #ZenSearchFrom select { width: 100%; background-color: #fff; border: 1px solid #ccc; border-radius: 0; appearance: none; -webkit-appearance: none; outline: none; }
#ZenSearchFrom #date input[type=text]{ padding: 0.5em 0.3em 0.5em 0.5em; }
#ZenSearchFrom select{ width: 100%; max-width: 6rem; text-align: center; padding: 0.8em 0.5em; }
#ZenSearchFrom .bar-list label { display: inline-block; padding-right: 5px; font-size:15px; margin-bottom: 0; }
#ZenSearchFrom .seek, .rSearch { background-color: #B09833; color: #fff; border: none; padding: 0; text-decoration: none; cursor: pointer; border-radius: 0; letter-spacing: 3px; }
#ZenSearchFrom .seek h3, .rSearch h3 { width: 100%; font-size:18px; text-align: center; }
#ZenSearchFrom .seek { width: 12rem; height: 4rem; line-height: 4rem; margin-top: auto; margin-bottom: auto; }
#ZenSearchFrom .seek i.fa { position: relative; top: -0.1rem; left: -0.4rem; }
button.rSearch { width: 18rem; height: 73px; position: fixed; bottom: 0; right:0; z-index: 1000; }
@media screen and (max-width: 900px){
  #ZenSearchFrom #name { max-width: 6rem; }
}
@media screen and (min-width: 768px){
  .footer-bar { height: 73px; position: fixed; bottom:0; right: 0; z-index: 999; transform: translateX(100%); transition: all 3s; }
  .footer-bar .wrapper-bar { width: calc( 100% - 18rem ); height: 100%; }
}
@media screen and (max-width: 767px) {
  .footer-bar { width: 100%; height: auto; box-shadow: none; }
  .footer-bar #ZenSearchFrom { flex-wrap: wrap; padding: 4vw 2vw; }
  .footer-bar #ZenSearchFrom select { width: 50px; }
  .footer-bar #ZenSearchFrom #name, #ZenSearchFrom #date { width: 100%; text-align: center; display: inline-block; }
  #ZenSearchFrom #name { max-width: inherit; }
  #ZenSearchFrom #date, #ZenSearchFrom .bar-list { padding-top: 10px; border: none; }
  .footer-bar .seekWrap { width: 100%; margin: 10px auto 0; }
  .footer-bar #ZenSearchFrom .seek { width: 100%; }
}



 .header-fixed.-scroll{
   padding: 5px 0;
   height: 50px;
 }
 .header-fixed .f-gnav__item{
   position: relative;
   padding: 20px 0;
 }
 .header-fixed .f-gnav__link_child{
  height: 0;
  opacity: 0;
  position: absolute;
  top: 100%;
  left: 0;
  width: 200px;
  padding: 0 17px;
  background:#fff;
  transition: .4s all ease;
}
.header-fixed .f-gnav__item:hover .f-gnav__link_child{
  display: block;
  height: auto;
  padding-top: 14px;
  padding-bottom: 14px;
  opacity: 1;
}
@media only screen and (min-width: 1300px) {
  .header-inner .inner { display: grid; grid-template-columns: auto 1fr auto; }
  .nav-btn, .header-inner .gnav { margin-top: 0px; justify-content: center; }
  .header-inner .gnav, .nav-btn { margin-top:0!important}
  .header-fixed.-scroll { height:80px; }
}
@media only screen and (max-width: 1300px) {
  .header-fixed .f-gnav { display: none!important; }
  .header-fixed .f-gnav__link.-reserve {display: none;}
  .header-fixed .toggle { position: relative; display:block; }
  .header-inner .gnav { display: none; }
  .nav-btn { display: none; }
  .header-inner .toggle { position: absolute; top: 50%; right: 40px; display:block; transform: translateY(-50%); }
  .gnav-sp { display: block; z-index: 98; padding-top:100px; }
  .gnav-sp__item,
  a.gnav-sp__link + ul{ font-size: 1.5rem; display: flex; align-items: center; justify-content: center; }
  a.gnav-sp__link + ul{ margin-left: 1em; position: relative; }
  a.gnav-sp__link + ul::before{ content: "−"; margin-right: 1em; }
  .reserve-btn { margin-left: auto; margin-right: 20px; }
  .reserve-btn.-white { margin-right: 20px; }
  .-sp { display: block !important; }
}
@media only screen and (max-width: 1200px) {
  .wrapper { max-width: 1100px }
}
@media only screen and (max-width: 1000px) {
  .wrapper { max-width: 900px; margin: 0 40px; }
  .sec-3 .content { height: 490px; }
  .sec-4 .content .col { width: 100%; height: 400px; }
  .sec-5 .first-row { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 15px; margin-bottom: 15px; min-height: 300px; }
  .sec-6 .item{margin-left: 10px;margin-right: 10px}
  .footer1{padding-right: 20px;padding-left:20px}
  .footer1 .right .top{padding-right: 0}
  .footer2 .wrapper { column-gap: 20px; }
}

@media only screen and (max-width: 800px){
  .nav-btn { display: none; }
  .reserve-btn.-white { margin-right: 30px; }
  .footer2 .wrapper { grid-template-columns: 1fr; justify-items: center; }
  .links { grid-template-columns: repeat(1, 1fr) !important; grid-row:1/2; margin-bottom:20px; justify-items: center; text-align: center; }
}


@media only screen and (max-width: 900px) {
  .footer1 .right .top .img { height: 90px; }
  .footer1 .right .top { column-gap: 10px; row-gap: 20px; }
}

@media only screen and (max-width: 770px){
  .bottom-links{display: none}
  #hero-about-button a{font-size:14px}
  .sec-5 .first-row{ min-height: 200px; }
  .sec-4 .content .col { width: 100%; height: 250px; }
  .sec-4 .content { grid-gap:7px }
  .sec-5 .first-row { grid-gap: 7px; margin-bottom:7px; }
  .sec-5 .second-row { grid-gap:7px}
  .sec-7 .wrapper { margin:0 auto }
  .footer2 .links { grid-template-columns: repeat(1, 1fr); }
}
@media only screen and (max-width: 767px){
  .header-inner .toggle { right: 20px; }
  .header-inner .logo a { display: block; }
  .btn { max-width: unset; width: auto; height: auto; padding: 1em 2em; line-height: 1.8; }
  .btn img { display: none; } 
  .sec-3 .content { height: 250px; }
}
@media only screen and (max-width: 720px){
  .sec-6 .item p { font-size: 13px }
  .sec-2 .title { padding-bottom:40px }
  .more { margin-top: 40px; font-size: 16px; }
  h2 { font-size: 22px }
}
@media only screen and (max-width: 700px){
  .wrapper{padding:0 20px}
  .footer1 .right .top {
      grid-template-columns: 1fr;
      column-gap: 0px;
      padding-right: 0px;
      row-gap: 20px;
      width: 90%;
  }
  .footer1 {padding:20px 0}
  .footer1 .wrapper .item{column-gap: 40px}
  .footer1 .right .text{padding-top:0}
  .footer1 .right .top img{height: 70px!important}
}

@media only screen and (max-width: 670px){
  .sec-6 img {    margin: 0;    position: relative;    float: right;  }
  .sec-6 .item{margin-left: 15px;margin-right: 15px;}
  .sec-6 .item p{    text-align: left;  }
  .sec-6 .item span {    display: block;    text-align: left;  }
  .sec-6 .item span:nth-child(2) {    line-height: 1;   width: fit-content;    margin: 0;  }
  .wrapper{ margin: 0;}
  .footer1 .right .top img { height: 100%!important; }
  .overlay { width: 100%; }
}

@media only screen and (max-width: 600px){
  .sec-4 .content .col { height: 180px; }
  .sec-5 .first-row { min-height: 150px; }
}


.nav-btn, .header-inner .gnav{margin-top:-10px}
#hero-line { z-index: 90; height: 140px }
#top-button{
 width:200px;height: 42px;line-height: 42px;color:#fff;background:rgba(34, 34, 34, 0.4);
 position: absolute;left:50%;top:80px;z-index:97;margin-left:-100px}
#top-button h4{color:#fff;padding-left:17px;font-size:14px;}
#top-button:hover{background:rgba(34, 34, 34, 0.8)}
button:focus { outline: none; }

.sec-3 .col:nth-of-type(2) {
  padding:0;
}

p { max-width: 1200px; margin: auto; letter-spacing: 0.14em; text-align: center; font-weight: 200; font-size: 15px; }
.sec-1 .wrapper p { font-size: 16px; letter-spacing: 0; text-align: center; transition-delay: .5s; }

.sec-5 figure { width: 100%; height: 100%; position: relative; overflow: hidden; }
.sec-5 figcaption { width: 100%; height: 100%; background: rgba(0,0,0,.6); position: absolute; top: 0; left: 0; z-index: 2; }
.sec-5 figure figcaption h3{font-size: 130%; font-weight: bold; display: block; padding-bottom: 5px; color: #fff;}
.sec-5 figure figcaption p{font-size: 12px!important; color: #fff;}
@media  only screen and (max-width: 767px){
  .sec-1 .wrapper{ margin: 0 auto; padding: 0 10px; }
  .sec-1 .wrapper p{    font-size: 15px;  }
  .wrapper p{    font-size: 14px;  }
  .mv__txt, .mv .mv-wrap:nth-of-type(1) .mv__txt, .mv .mv-wrap:nth-of-type(3) .mv__txt {
    text-align: left;
    line-height: 1.6;
    left: 0!important;
    right: 0!important;
    margin: auto;
    width: fit-content!important;
    height: auto!important;
    transform: inherit;
    white-space: nowrap;
  }
}



.btn a{text-decoration: none;}
.btn {
	position: relative;
	letter-spacing: 1.1rem;
	text-transform: uppercase;
	transition: all 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	cursor: pointer;
	user-select: none;
}
.btn:before, .btn:after {
	content: '';
	position: absolute;
	transition: inherit;
	z-index: -1;
}
.btn:hover {
	color: var(--def);
	transition-delay: .5s;
}
.btn:hover:before {
	transition-delay: 0s;
}
.btn:hover:after {
	background: #fff;
  transition-delay: .35s;
  background:rgb(226, 225, 225)
}
/* From Top */
.btn:before,
.btn:after {
	left: 0;
	height: 0;
	width: 100%;
}
.btn:before {
	bottom: 0;
	border: 1px solid black;
	border-top: 0;
	border-bottom: 0;
}
.btn:after {
	top: 0;
	height: 0;
}
.btn:hover:before,
.btn:hover:after {
	height: 100%;
}
.btn:hover { color:black;text-decoration: none;border:none }
.footer1 .right .top {
  padding-right: 0px;
  column-gap: 10px;
  row-gap: 10px;
 height: 100%;
}
.footer1 .right .text{text-align:center;}
.footer1 .right .text {
  text-align: center;
  padding: 0;
  margin: 0;
  height: 100%!important;
  font-size: 1.1em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer1 .right .text .img{
  height: 100%!important;
}
.rem{display:none}
.footer1 .right .top .img {
  height: 100%;
}
.footer1 .wrapper2 .item { margin-bottom: 0 !important; }
.footer1 .item .left { position: relative; }
.footer1 .item .left .text { text-align: center; padding: 0; margin: 0; height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; color:#fff; position: absolute; top:0 }

@media only screen and (max-width: 800px){
  .footer1 .wrapper2 .item, .footer1 .wrapper2 .item.foot-access { grid-template-columns: 1fr; }
  .footer1 .left { margin-bottom: 10px; }
  .footer1 .wrapper2 .item.foot-access .right img { margin: 0 auto; }
  .footer1 .wrapper2 .item.foot-access .left { margin-right: 0; }
}
.footer1 { padding: 40px 4.8vw; background: #FAFAFA;}
.footer1 h2 { margin-bottom: 20px; text-align: center; font-size: 2.4rem; letter-spacing: 3px;}
.footer1 h2 i { display: block; padding-top: 8px; font-size: 1.4rem; color: #B09833;}
.footer1 ul { display: flex; justify-content: space-between;}
.footer1 li { width: 32%;}
.footer1 li a { position: relative; display: block; height: 156px; overflow: hidden;}
.footer1 li a span { position: absolute; top: 50%; left: 32px; transform: translateY(-50%); font-size: 1.6rem; letter-spacing: 3px; color: #FFF;}
.footer1 li a span strong { display: block; margin-top: 4px; font-size: 22px; letter-spacing: 4px;}
.footer1 li a figure { padding-top: 156px;}
.footer1 li a figure img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%) scale(1); transition: all 1.6s ease 0s;}
.footer1 li a:hover { opacity: 1;}
.footer1 li a:hover figure img { transform: translate(-50%,-50%) scale(1.1); filter: grayscale(100%);}

@media only screen and (max-width: 700px){
  .footer1 .wrapper2 .item { grid-template-columns: 1fr; }
  .footer1 .left { margin-bottom: 20px; height: auto; }
  .footer1 .right .top { width: 100%; }
}
#fixnav-sp { opacity: 0; transition: opacity .6s; transition-delay: 1s; pointer-events: none; }
@media screen and (max-width: 767px){
  #fixnav-sp { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 999; font-size: 14px; }
  #fixnav-sp ul { overflow: hidden; background: #FFF; }
  #fixnav-sp ul li { width: 25%; float: left; }
  #fixnav-sp ul li a, #fixnav-sp ul li span { border-left: 1px solid #F5F2E5; display: block; cursor: pointer; text-align: center; padding: .5em .2em; text-decoration: none; color: #B09833; }
  #fixnav-sp ul li a em{ font-style: normal;}
  #fixnav-sp ul li:not(:nth-of-type(3)) a em{ color: #5F5F5F;}
  #fixnav-sp ul li i { font-size: 17px; display: block; text-align: center; margin-bottom: .08em; }
  #fixnav-sp ul li:first-child a { border-left: none; }
  #fixnav-sp ul li.btn_res a { background: #B09833; border-color: #B09833; color: #FFF; }
  #fixnav-sp ul li#obj_menuBtn a { background: #F5F2E5; border-color: #F5F2E5; }
  #fixnav-sp ul li.toggle { position: inherit; }
}

@media screen and (max-width: 1024px) {
  .footer1 h2 { margin-bottom: 20px;}
  .footer1 ul { display: block; }
  .footer1 li { width: auto; margin-top: 16px; }
}
@media screen and (max-width: 767px) {
  .is-active { pointer-events: auto; opacity: 1!important; transition-delay: 0.1s; }
  .gnav-sp__item{ font-size: 1.4rem; margin-top:20px; }
  .sec-5 figure figcaption h3 { font-size: 15px; }
  .sec-5 figure figcaption p { font-size: 15px; }
	.sec-5 .second-row figure figcaption p { display: none; }
}

/* Responsive
----------------------------------------------- */
.sp { display: none; }
.pc { display: none; }
@media screen and (min-width: 1025px){
  .pc { display: block; }
  .tb { display: none; }
}
@media screen and (max-width: 767px){
  .pc { display: none; }
  .tb { display: none; }
  .sp { display: block; }
}