@charset "UTF-8";
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
汎用
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
::selection {background: #cbcbcb;}

main {
  position: relative;
  display: block;
}

/*clearfix*/
.cf:after {
  content: "";
  display: block;
  clear: both;
  visibility: hidden;
}

/*コンテナ*/
.container {
  margin: 0 auto;
}

/*背景色*/
.bg1 {
  background-color: #CCC9C7;
}
.bg2 {
  background-color: #AFA191;
}
.bg2 a, .bg2 li, .bg2 p, .bg2 span, .bg2 dt, .bg2 dd, .bg2 h1, .bg2 h2, .bg2 h3, .bg2 h4 {
  color: #000;
}
.bg3 {
  background-color: #988061;
  color: #000;
}
.bg3 a, .bg3 li, .bg3 p, .bg3 span, .bg3 dt, .bg3 dd .bg3 h1, .bg3 h2, .bg3 h3, .bg3 h4 {
  color: #000;
}
.bg4 {
  background-color: #DFDFDF;
}
.bg4::selection {
  background-color: #CCC9C7;
}

/* 画像トリミング */
.img img {
  width: 100%;
  height: 100%;
}

/*--------------------------------------------------------------------------
パララックス＆ホバーアニメーション
--------------------------------------------------------------------------*/
/*------------------------------------
下から上に upflow
------------------------------------*/
.upflow {opacity: 0; transform: translateY(20px); transition: 1s ease;}
/* .upflow.active {visibility: visible; opacity: 1; transform: translateY(0);} */
.upflow.active {
  animation: upflow 1s ease forwards;
}
@keyframes upflow {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*------------------------------------
左から右に leftflow
------------------------------------*/
.leftflow {opacity: 0; transform: translateX(-20px); transition: 1s ease;}
/* .leftflow.active {visibility: visible; opacity: 1; transform: translateX(0);} */
.leftflow.active {
  animation: leftflow 1s ease forwards;
}
@keyframes leftflow {
  0% {
    opacity: 0;
    transform: translateX(-20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*------------------------------------
右から左に rightflow
------------------------------------*/
.rightflow {opacity: 0; transform: translateX(20px); transition: 1s ease;}
.rightflow.active {animation: rightflow 1s ease forwards;}
@keyframes rightflow {
  0% {
    opacity: 0;
    transform: translateX(20px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*------------------------------------
フェードイン
------------------------------------*/
.fade-in {
  opacity: 0;
  transform: translateY(20px);
}
.fade-in.active {
  animation: fadein 1s ease forwards;
}
@keyframes fadein {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/* フェードイン2(下からの移動なし) */
.fade-in-2 {
  opacity: 0;
}
.fade-in-2.active {
  animation: fadein2 1s ease forwards;
}
@keyframes fadein2 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*------------------------------------
ディレイ
------------------------------------*/
.delay01 {animation-delay: .25s!important;}
.delay02 {animation-delay: .5s!important;}
.delay03 {animation-delay: .75s!important;}
.delay04 {animation-delay: 1s!important;}
.delay05 {animation-delay: 1.25s!important;}
.delay06 {animation-delay: 1.5s!important;}
.delay07 {animation-delay: 1.75s!important;}
.delay08 {animation-delay: 2s!important;}
.delay09 {animation-delay: 2.25s!important;}
.delay10 {animation-delay: 2.5s!important;}
/*--------------------------------------------------------------------------
部品
--------------------------------------------------------------------------*/
/*------------------------------------
/*------------------------------------
汎用見出し
------------------------------------*/
.g-h {
  font-weight: 700;
  letter-spacing: .1em;
  text-indent: .1em;
  line-height: 1;
  text-align: center;
}
.g-h::first-letter {
  color: #EC6E03;
}
.g-h:after {
  display: block;
  content: "";
  background: #EC6E03;
}
/*-----------------------------------
汎用TOP見出し
------------------------------------*/
.main-visual {
  position: relative;
  width: 100%;
}
.main-visual .inner {
  position: relative;
  width: 100%;
  height: 100%;
}
.main-visual .img {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.main-visual .img img {
  position: absolute;
  top: 0;
  left: 0;
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 0;
  font-family: "object-fit: cover; object-position: 50% 0;";
}
.main-visual .txt {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  text-align: center;
  z-index: 2;
}
.main-visual .txt h1,
.main-visual .txt p {
  color: #fff;
  font-weight: 700;
  text-shadow: 0 0 0.5em rgba(84, 84, 84, 0.75);
}
/*------------------------------------
MORE
------------------------------------*/
.more {
  position: relative;
  display: inline-flex;
  box-sizing: border-box;
  z-index: 1;
  color: #988061 !important;
  line-height: 1;
}
.more:after {
  content: "";
  background: url(../img/common/r-arrow.png) no-repeat center/cover;
  display: block;
  position: absolute;
}

.more2 {
  color: #988061 !important;
  text-align: center;
  display: block;
  background: #fff;
  margin: auto;
  border-radius: 4rem;
  box-shadow: 0 .3rem .6rem 0 rgba(0,0,0,.16);
  position: relative;
  transition: .5s all ease;
}
.more2:hover {
  color: #fff !important;
  background:#EC6E03;
  opacity: 1;
}
.more2:after {
  content: "";
  background: url(../img/common/r-arrow.png) no-repeat center/contain;
  display: inline-block;
  vertical-align: middle;
  position: absolute;
  top: 55%;
  transform: translateY(-50%);
}
.more2:hover:after {
  background: url(../img/common/r-arrow-2.png) no-repeat center/contain;
}
/*------------------------------------
ページャー
------------------------------------*/
.g-pager {
  display: table;
  margin: 10rem auto;
  border-radius: 4px;
  overflow: hidden;
}
.g-pager .num {
  display: table-cell;
}
.g-pager .num:first-child {
  border-left: none;
}
.g-pager .num a {
  width: 3.2rem;
  height: 3.2rem;
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
  line-height: 1;
  background: #fff;
  margin: 0 .1rem;
}
/*------------------------------------
TOPに戻る
------------------------------------*/
#page_top {
  position: fixed;
  color: #fff;
  background: #707070;
  text-align: center;
  transition: none;
  z-index: 20;
}
#page_top:hover {
  background: #EC6E03;
  opacity: 1;
}
/*------------------------------------
パンくずリスト
------------------------------------*/
.topic-path {
  position: absolute;
}
.topic-path li {
  display: inline;
  position: relative;
}
.topic-path li:last-child:after {
  content: "";
  display: block;
  width: 100%;
  height: .2rem;
  position: absolute;
  bottom: -.3rem;
  left: 50%;
  transform: translateX(-50%);
  background: #EC6E03;
  border-radius: .4rem;
}
.topic-path li,
.topic-path li span,
.topic-pth li a span {
  color: #000;
  margin: 0 !important;
}
.topic-path li a {
  position: relative;
}
.topic-path li a:after {
  content: "／";
  padding: 0 1rem;
  color: #000;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										ヘッダー&フッター
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------------------
ヘッダー
----------------------------------------------------------------------------------------*/

/*------------------------------------
ハンバーガーメニュー
------------------------------------*/

/*----------------------------------------------------------------------------------------
フッター
----------------------------------------------------------------------------------------*/
#footer .container {
  justify-content: space-between;
}
#footer .footer-left .contact-wrap {
  align-items: center;
}
#footer .footer-left .conttact-wrap ul li a {
  text-decoration: none;
}
#footer .footer-right nav {
  flex-wrap: wrap;
}
#footer .copyright {
  text-align: center;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										フロントページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
/*------------------------------------
ヒーローヘッダー
------------------------------------*/
#front .main-visual {
  position: relative;
}
#front .main-visual,
#front .main-visual .inner {
  width: 100%;
}
#front .main-visual #top-slider {
  width: 100%;
  overflow: hidden;
}
#front .main-visual #top-slider .slick-track,
#front .main-visual #top-slider .slick-list,
#front .main-visual #top-slider .slick-slide,
#front .main-visual #top-slider .slick-slide > div,
#front .main-visual #top-slider .slick-list li,
#front .main-visual #top-slider .slick-list .img {
  width: 100%;
  height: 100%;
}

#front .main-visual #top-slider .slick-list .img img {
  /* width: 100%;
  height: 100%; */
  object-position: center bottom;
  font-family: "object-fit: cover; object-position: 50% 50%;";
  transform: scale(1, 1);
  transform-origin: center bottom;
  transition: 0s;
}
#front .main-visual #top-slider .slick-list .slick-active .img img {
  transform: scale(1.3, 1.3);
  transform-origin: center bottom;
  transition: ease 18s;
}
/*------------------------------------
GREETING
------------------------------------*/
#front .greeting {
  margin: auto;
  text-align: center;
  position: relative;
}
#front .greeting .treat_box .treat_text {
  margin: 0;
}
/*------------------------------------
PHOTO
------------------------------------*/
#front .photo {
  text-align: center;
  position: relative;
  background: url(../img/front/photo/top_photo_bg.jpg) no-repeat left top/cover;
}
#front .photo ul {
  flex-wrap: wrap;
}
#front .photo ul li .img {
  width: 100%;
  height: 100%;
}
#front .photo ul li .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#front .photo .gallerymodal-open {
  display: inline-block;
}
#front .photo .gallerymodal-open:after {
  content: "";
  display: block;
  background: #EC6E03;
}
/*------------------------------------
PHOTO modal
------------------------------------*/
/* モーダル表示時に背景固定 */
body.fixed {
  position: fixed;
  left: 0;
}

#front .photo .g-modal-window{
  position: fixed;
  top: 0;
  width: 100%;
  height: 100vh;
  background: url(../img/front/photo/top_photo_bg.jpg) no-repeat center/cover;
  z-index: 9999;
  overflow-y: auto;
}
#front .photo .close-btn{
  position: absolute;
  display: block;

}
#front .photo .close-btn:before,.close-btn:after {
  content: "";
  display: block;
  width: 100%;
  background: #333;
  transform: rotate(45deg);
  transform-origin:0% 50%;
  position: absolute;
}
#front .photo .close-btn:after {
  transform: rotate(-45deg);
  transform-origin:100% 50%;
  left: auto;
}

#front .photo .close-btn2 {
  position: absolute;
  right: 50%;
  transform: translateX(50%);
  background: #988061;
  color: #fff;
}
/*モーダルウィンドウ（終）*/

/*====slickレイアウト設定====*/
#front .photo .g-slider{
  margin: 0 auto;
}
#front .photo .g-slider .slick-list,
#front .photo .g-slider .slick-list .slick-track,
#front .photo .g-slider .slick-list .slick-track .slick-slide,
#front .photo .g-slider .slick-list .slick-track .slick-slide div,
#front .photo .g-slider .slick-list .slick-track .slick-slide div li,
#front .photo .g-slider .slick-list .slick-track .slick-slide div li img {
  width: 100%;
  height: 100%;
}
#front .photo .g-slider img{
  height: 100%;
  width: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#front .photo .thumb-wrapper {
  position: relative;
  box-sizing: border-box;
}
#front .photo .thumb{
  margin: 0 auto;
  flex-wrap: wrap;
}

#front .photo .thumb li{
  list-style: none;
  transition: .2s ease;
}
#front .photo .thumb li:hover {
  opacity: .6;
  cursor: pointer;
}
#front .photo .thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
/*====slickレイアウト設定（終）====*/

/*------------------------------------
INFO
------------------------------------*/
#front .info {
  position: relative;
}
#front .info h2 {
  text-align: left;
}
#front .info .info-list {
  position: relative;
}
#front .info .info-list:before {
  content: "";
  display: block;
  position: absolute;
  background: url(../img/common/hotel_icon1.png) no-repeat center/cover;
}
#front .info .info-list:after {
  content: "";
  display: block;
  position: absolute;
  background: url(../img/common/logo_en.png) no-repeat center/contain;
}
#front .info .info-list .entry {
  border-bottom: 1px solid #988061;
  box-sizing: border-box;
}
#front .info .info-list .entry:hover {
  border-bottom: 1px solid #EC6E03;
}
#front .info .info-list .entry a {
  align-items: center;
  transition: all .5s ease;
}
#front .info .info-list .entry a:hover {
  opacity: .8;
}
#front .info .info-list .entry a time,
#front .info .info-list .entry a p {
  transition: all .5s ease;
}
#front .info .info-list .entry a:hover time,
#front .info .info-list .entry a:hover p {
  color: #EC6E03;
}
#front .info .info-list .entry p span {
  font-weight: 700;
  color: #A83216;
}
/*------------------------------------
PLAN-TREAT
------------------------------------*/
#front .plan-treat,
#front .plan-treat2 {
  width: 100%;
  height: 100%;
  background: #CCC9C7;
}
#front .plan-treat img {
  width: 100%;
  height: 100%;
  margin-bottom: -1px;
}
#front .plan-treat2 img {
  width: 100%;
  height: 100%;
  margin-top: -1px;
}
/*------------------------------------
PLAN
------------------------------------*/
#front .plan {
  position: relative;
}
#front .plan .container {
  background-color: #fff;
  width: 100%;
}
#front .plan .plan-list {
  padding: 8.66rem 11.3% 0;
}
#front .plan .plan-list .list {
  position: relative;
  border-bottom: 1px solid #988061;
}
#front .plan .plan-list .list h3 {
  font-weight: 700;
  line-height: 1;
}
#front .plan .plan-list .list .wrapper .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: contain;
  object-position: 50% 0;
  font-family: "object-fit: contain; object-position: 50% 0;";
}
#front .plan .plan-list .desc-wrapper .service-wrapper {
  flex-wrap: wrap;
}
#front .plan .plan-list .desc-wrapper .service-wrapper li {
  background-color: #988061;
  color: #fff;
  line-height: 1;
}
#front .plan .container .more {
  position: absolute;
  bottom: 1.96rem;
  right: 3rem;
}
/*------------------------------------
ROOMS
------------------------------------*/
#front .rooms {
  position: relative;
}
#front .rooms .desc {
  text-align: center;
}
#front .rooms .img {
  line-height: 0;
  padding: 0;
}
#front .rooms .img p {
  line-height: 1;
}
#front .rooms .img p:before {
  content: "";
  background: #707070;
  display: inline-block;
  vertical-align: middle;
}

#front .rooms .room-type {
  width: 100%;
  margin: 0 auto;
  justify-content: space-between;
  flex-wrap: wrap;
}
#front .rooms .room-type .type img {
  width: 100%;
  margin: 0 auto;
  position: relative;
}
#front .rooms .room-type .type p {
  line-height: 1;
}
#front .rooms .room-type .type p:before {
  content: "";
  background: #707070;
  display: inline-block;
  vertical-align: middle;
}
/*------------------------------------
RESTAURANT MORNING
------------------------------------*/
#front .m-restaurant {
  position: relative;
}
#front .m-restaurant h3 {
  text-align: left;
}
#front .m-restaurant .img {
  display: block;
  float: right;
}
#front .m-restaurant .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
/*------------------------------------
RESTAURANT & BAR　DINNER
------------------------------------*/
#front .d-restaurant {
  position: relative;
}
#front .d-restaurant h3 {
  text-align: left;
}
#front .d-restaurant .img img{
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
/*------------------------------------
SERVICE
------------------------------------*/
#front .service {
  position: relative;
}
#front .service .text {
  text-align: center;
}
#front .service .service-list {
  flex-wrap: wrap;
}
#front .service .service-list li {
  background: #fff;
  position: relative;
}
#front .service .service-list li:after {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-image : linear-gradient(to bottom, #707070, #707070 .2rem, transparent .2rem);
  background-position: left top;
  background-repeat: repeat-y;
}
#front .service .service-list li div .img {
  text-align: center;
  align-self: center;
  box-sizing: border-box;
}
#front .service .service-list li div .img img {
  margin: auto;
}
#front .service .service-list li div .img h3 {
  font-weight: 700;
  color: #707070;
}
#front .service .service-list li div .service-desc p {
  box-sizing: border-box;
}
/*------------------------------------
SPOT
------------------------------------*/
#front .spot {
  position: relative;
}
#front .spot .spot-list .post .img.thumbnail img {
  /* width: 100%;
  height: 100%; */
  object-fit: contain;
  object-position: 50% 0;
  font-family: "object-fit: contain; object-position: 50% 0;";
}

#front .spot .spot-list .post .spot-desc {
  border-bottom: 1px solid #B7B7B7;
}
#front .spot .spot-list .post .spot-desc .cat {
  color: #fff;
  background: #988061;
  display: inline-block;
  text-align: center;
}
#front .spot .spot-list .post .spot-desc .new {
  color: #A83216;
}
#front .spot .spot-list .post .spot-desc h3 {
  font-weight: 700;
  line-height: 1;
}
#front .spot .spot-list .post .spot-desc .author {
  line-height: 1;
}
#front .spot .spot-list .post .spot-desc .author .img.icon {
  display: inline-block;
  vertical-align: middle;
}
#front .spot .spot-list .post .spot-desc .author p {
  display: inline-block;
  vertical-align: middle;
}

#front .spot .img.treat2 {
  position: absolute;
  bottom: 0;
  right: 0;
}
/*------------------------------------
ACCESS
------------------------------------*/
#front .access {
  position: relative;
}
#front .access .glink {
  display: block;
  float: right;
}
#front .access .glink:after {
  content: "";
  background: url(../img/common/external-link_icon.png) no-repeat center/contain;
  display: inline-block;
}
#front .access .ggmap {
  width: 100%;
  margin: 0 auto;
  position: relative;
  height: 0;
  overflow: hidden;
}
#front .access .ggmap iframe,
#front .access .ggmap object,
#front .access .ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#front .access .left-area .img img {
  display: block;
  object-fit: contain;
}

#front .access .right-area {
  border-left: .1rem solid #fff;
}

#front .access .right-area ul li .traffic .img {
  align-self: center;
}
#front .access .right-area ul li .traffic .traffic-desc dl{
  flex-wrap: wrap;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										客室ページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#rooms .main-visual {
  position: relative;
}
#rooms .main-visual h1 {
  position: absolute;
  z-index: 10;
  height: auto;
}
#rooms .main-visual .desc {
  position: absolute;
  background: #fff;
  z-index: 10;
}
#rooms .main-visual .desc p:first-child {
  font-weight: 700;
  line-height: 1;
}
#rooms .main-visual .desc p:last-child {
  line-height: 1;
}
#rooms .main-visual nav ul {
  justify-content: center;
}
#rooms .main-visual nav ul li {
  box-shadow: 0 .3rem .6rem 0 rgba(0,0,0,.16);
}
#rooms .main-visual nav ul li a {
  display: block;
  width: 100%;
  height: 100%;
  background: #fff;
  text-align: center;
  transition: none;
}
#rooms .main-visual nav ul li a:hover {
  color: #fff;
  background:#EC6E03;
  opacity: 1;
}
#rooms .main-visual nav ul li a:hover span {
  color: #fff;
}

/* 設備・アメニティポップアップ */
#rooms .f-modal {
  display: none;
  position: fixed;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
}
#rooms .f-modal .f-overlay {
  width: 100%;
  height: 100vh;
  background-color: #DFDFDF;
}
#rooms .f-modal h2 {
  position: absolute;
  z-index: 3;
  font-weight: 700;
  letter-spacing: .1em;
  text-indent: .1em;
  line-height: 1;
}
#rooms .f-modal h2::first-letter {
  color: #EC6E03;
}
#rooms .f-modal h2:before {
  content: "";
  display: block;
  background: #EC6E03;
  border-radius: .2rem;
  position: absolute;
  left: 0;
}
#rooms .f-modal h2:after {
  content: "全室共通";
  position: absolute;
  left: 0;
  letter-spacing: .1em;
}
#rooms .f-modal .modal {
  position: absolute;
  background-color: #DFDFDF;
}
#rooms .f-modal .modal ul {
  flex-wrap: wrap;
}
#rooms .f-modal .modal ul li {
  width: calc((100% / 7) - .8rem);
  margin-right: .8rem;
}
#rooms .f-modal .modal ul li .img img {
  /* width: 100%;
  height: 100%; */
  background: #fff;
  object-fit: contain;
  font-family: "object-fit: contain;";
}
#rooms .f-modal .modal ul li p span {
  display: inline-block;
}
#rooms .f-modal .f-close-btn {
  display: block;
  background: #AFA191;
  text-align: center;
  position: absolute;
  right: 0;
  color: #000;
}

/* 各ルーム */
#rooms .room {
  position: relative;
}
#rooms .room .heading-box {
  position: absolute;
  top: 0;
  left: 0;
}
#rooms .room .heading-box .text-treat {
  position: absolute;
}
#rooms .room .heading-box h2 {
  position: absolute;
  height: auto;
  color: #fff;
  font-weight: 700;
  line-height: 1;
}
#rooms .room .heading-box h2 span {
  color: #fff;
  display: inline-block;
}
#rooms .room .heading-box h2:before {
  content: "";
  height: 0;
  display: block;
  position: absolute;
  left: 0;
  background: #988061;
  transition: all .5s cubic-bezier(0.05, 0.54, 0.6, 0.94);
  transition-delay: .1s;
}
#rooms .room .slick-wrap .room-slider .slick-list ,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li,
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li img {
  width: 100%;
  height: 100%;
}
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li img {
  object-fit: contain;
  object-position: 50% 0;
  font-family: "object-fit: contain; object-position: 50% 0;";
}
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li .img {
  position: relative;
  background: #fff;
}
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li .img img {
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#rooms .room .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li:last-child .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  object-fit: contain;
  font-family: "object-fit: contain;";
}

#rooms .room .slick-wrap .room-thumb-list li {
  cursor: pointer;
  position: relative;
  transition: .2s ease;
}
#rooms .room .slick-wrap .room-thumb-list li:hover {
  opacity: .6;
  cursor: pointer;
}
#rooms .room .slick-wrap .room-thumb-list li:last-child {
  background: #fff;
}
#rooms .room .slick-wrap .room-thumb-list li img {
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#rooms .room .slick-wrap .room-thumb-list li:last-child img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  object-fit: contain;
  font-family: "object-fit: contain;";
}

#rooms .room .desc-wrap .desc-text {
  border-bottom: 1px solid #988061;
}
#rooms .room .facility_link {
  color: #988061;
  float: right;
}

#rooms .room dl {
  flex-wrap: wrap;
}

/* Beachside Villa */
#rooms #sec-villa,
#rooms #sec-villa .heading-box {
  background-color: #508DB2;
  width: 100%;
}

#rooms #sec-villa .heading-box h2 span:first-of-type {
  margin: 0;
  display: block;
}
#rooms #sec-villa .heading-box h2:before {
  background: #508DB2;
  background: linear-gradient(180deg, #508DB2 19%, #fff 19%);
}

#rooms #sec-villa .slick-wrap .room-slider {
  width: 100%;
  margin: auto;
}
#rooms #sec-villa .slick-wrap .room-slider .slick-list .slick-track .slick-slide div li img {
  object-fit: contain;
  font-family: "object-fit: contain;";
}
#rooms #sec-villa .slick-wrap .room-thumb-list li {
  background: transparent;
}
#rooms #sec-villa .slick-wrap .room-thumb-list li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#rooms #sec-villa .desc-wrap .desc-text {
  border-bottom: 1px solid #fff;
  color: #000;
}
#rooms #sec-villa .desc-wrap div .room-search {
  float: right;
  color: #120D37;
  background: #fff;
  text-align: center;
  line-height: 1;
  box-sizing: border-box;
  transition: all .5s ease;
}
#rooms #sec-villa .desc-wrap div .room-search:hover {
  background: #120D37;
  color: #fff;
}
#rooms #sec-villa .desc-wrap div .room-search:before {
  display: inline-block;
  content: "";
  background: url(../img/rooms/search.png) no-repeat center/contain;
  vertical-align: middle;
  transition: all .5s ease;
}
#rooms #sec-villa .desc-wrap div .room-search:hover:before {
  background: url(../img/rooms/search_w.png) no-repeat center/contain;
}

#rooms #sec-villa .desc-wrap .container {
  padding: 5rem 0 10rem;
  justify-content: space-between;
}
#rooms #sec-villa .desc-wrap .container .left-area dl dt {
  color: #000;
}
#rooms #sec-villa .desc-wrap .container .left-area dl dd {
  color: #000;
}

#rooms #sec-villa .desc-wrap .container .right-area img {
  object-fit: contain;
  font-family: "object-fit: contain;";
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										レストランページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#restaurant .main-visual h1 {
  position: absolute;
  z-index: 10;
  height: auto;
}
#restaurant .main-visual h1 img {
  position: static;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#restaurant .main-visual .desc {
  position: absolute;
  left: 0;
  background: #fff;
  z-index: 10;
}
#restaurant .main-visual .desc p:first-child {
  font-weight: 700;
}

#restaurant .main-visual .img1 img,
#restaurant .main-visual .img2 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#restaurant .covid p {
  text-align: center;
  font-weight: 700;
  line-height: 2;
}

#restaurant .covid .btn .more2 {
  font-weight: 700;
  border: none;
  border-radius: .8rem;
  box-shadow: 0 .3rem .6rem rgba(0, 0, 0, 0.16);
}

#restaurant .morning .morning-h {
  width: 100%;
}
#restaurant .morning .morning-h img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#restaurant .morning dl {
  flex-wrap: wrap;
}
#restaurant .morning .morning-desc1 p {
  line-height: 2.1;
}

#restaurant .morning .morning-wrap {
  position: relative;
}
#restaurant .morning .morning-wrap .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#restaurant .morning .morning-wrap .morning-desc2 {
  background: #fff;
  position: absolute;
  left: 0;
}
#restaurant .morning .morning-wrap .morning-desc2 p {
  line-height: 2.1;
}
#restaurant .morning .morning-wrap2 ul li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#restaurant .night .night-h {
  width: 100%;
}
#restaurant .night .night-h img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#restaurant .night dl {
  flex-wrap: wrap;
}
#restaurant .night .night-desc1 p {
  line-height: 2.1;
}
#restaurant .night .night-wrap {
  position: relative;
}
#restaurant .night .night-wrap .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#restaurant .night .night-wrap .night-desc2 {
  background: #fff;
  position: absolute;
  right: 0;
}
#restaurant .night .night-wrap .night-desc2 p {
  line-height: 2.1;
}

#restaurant .night .night-wrap2 ul li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#restaurant .night .night-wrap3 {
  position: relative;
}
#restaurant .night .night-wrap3 .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#restaurant .night .night-wrap3 .night-desc3 {
  background: #fff;
  position: absolute;
  left: 0;
}
#restaurant .night .night-wrap3 .night-desc3 p {
  line-height: 2.1;
}

#restaurant .night .night-wrap4 .night-desc4 p {
  line-height: 2.1;
}
#restaurant .night .night-wrap4 ul li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										コロナ取組ページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#covid .main-visual .hero {
  width: 100%;
}
#covid .main-visual .hero img {
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#covid .main-visual .wrapper {
  text-align: center;
}
#covid .main-visual .wrapper h1 {
  font-weight: 700;
}
#covid .main-visual .wrapper p {
  line-height: 2.1;
}

#covid .request h2 {
  width: 100%;
  text-align: center;
  font-weight: 700;
  letter-spacing: .4em;
  text-indent: .4em;
  background: #707070;
  color: #fff;
  justify-content: center;
  align-items: center;
}
#covid .request h2:before {
  content: "";
  background: url(../img/covid/covid_attension.svg) no-repeat center center/contain;
  display: inline-block;
}
#covid .request .request-wrap .img img {
  object-fit: contain;
  object-position: 50% 0;
  font-family: "object-fit: contain; object-position: 50% 0;";
}

#covid .request .request-wrap2 {
  border-top: 2px solid #707070;
}
#covid .request .request-wrap2 p:last-child {
  line-height: 2.1;
}

#covid .room h3, #covid .inside h3, #covid .meal h3 {
  font-weight: 700;
  letter-spacing: .3em;
  background: #707070;
  color: #fff;
  box-sizing: border-box;
}

#covid .room .request-wrap3 ul, #covid .inside .request-wrap4 ul, #covid .meal .request-wrap5 .container {
  box-sizing: border-box;
}
#covid .room .request-wrap3 .img img, #covid .inside .request-wrap4 .img img, #covid .meal .request-wrap5 .img_wrap .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: contain;
  object-position: 50% 0;
  font-family: "object-fit: contain; object-position: 50% 0;";
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										アクセスページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#access .logo {
  height: auto;
}

#access .access {
  text-align: center;
}
#access .access .img img{
  margin: auto;
}

#access .glink {
  display: block;
  float: right;
}
#access .glink:after {
  content: "";
  background: url(../img/common/external-link_icon.png) no-repeat center/contain;
  display: inline-block;
}

#access .ggmap {
  margin: 0 auto;
  position: relative;
  height: 0;
  overflow: hidden;
}
#access .ggmap iframe, #access .ggmap object, #access .ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#access .access_summary .inner {
  background: #fff;
  box-sizing: border-box;
}
#access .access_summary .inner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}

#access .facility table{
  margin: auto;
}
#access .facility tr th {
  text-align: left;
}


/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										姶良の魅力ページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#spot .main-visual {
  position: relative;
}
#spot .main-visual .main-visual-text {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  text-align: center;
}
#spot .main-visual .main-visual-text h1 {
  font-weight: 700;
  line-height: 1;
  letter-spacing: .1em;
  position: relative;
}
#spot .main-visual .main-visual-text h1::first-letter {
  color: #EC6E03;
}
#spot .main-visual .main-visual-text h1:before {
  content: "";
  background: url(../img/spot/spot-icon.png) no-repeat center/contain;
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
#spot .main-visual .desc-wrapper {
  position: relative;
}

#spot .main-visual .desc-wrapper .desc p {
  line-height: 2.1;
}
#spot .main-visual .desc-wrapper .treat1 {
  position: absolute;
}
#spot .main-visual .desc-wrapper .treat1 img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  font-family: "object-fit: contain;";
}
#spot .main-visual .desc-wrapper .treat2 {
  position: absolute;
  bottom: 0;
}

#spot .spot .spot-list {
  position: relative;
}
#spot .spot .spot-list a {
  opacity: 1;
}

#spot .spot .spot-list .post .img.thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: 50% 0;
  font-family: "object-fit: cover; object-position: 50% 0;";
}

#spot .spot .spot-list .post .spot-desc .cat {
  font-weight: 700;
  color: #fff;
  background: #988061;
  display: inline-block;
  text-align: center;
}
#spot .spot .spot-list .post .spot-desc .new {
  color: #A83216;
  background: transparent;
  text-align: left;
}
#spot .spot .spot-list .post .spot-desc h3 {
  font-weight: 700;
  line-height: 1;
}
#spot .spot .spot-list .post .spot-desc .author {
  line-height: 1;
}
#spot .spot .spot-list .post .spot-desc .author .img.icon {
  display: inline-block;
  vertical-align: middle;
}
#spot .spot .spot-list .post .spot-desc .author p {
  display: inline-block;
  vertical-align: middle;
}

#spot .spot .spot-archive {
  flex-wrap: wrap;
  justify-content: space-between;
  margin: auto;
}
#spot .spot .spot-archive li {
  border-bottom: 1px solid #988061;
}
#spot .spot .spot-archive li .img {
  width: 100%;
}
#spot .spot .spot-archive li .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}
#spot .spot .spot-archive li span {
  font-weight: 700;
  color: #fff;
  background: #988061;
  display: inline-block;
  text-align: center;
}
#spot .spot .spot-archive li p:first-of-type {
  font-weight: 700;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										FAQページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#faq .nav1 ul {
  align-items: flex-end;
}
#faq nav ul li {
  transition: .5s all ease-out;
}
#faq .nav1 ul li:nth-child(1) {
  font-weight: 700;
  text-align: center;
}
#faq .nav1 ul li:nth-child(1) h1 {
  font-weight: 700;
}
#faq .nav1 ul li:nth-child(1) span {
  display: inline-block;
}
#faq .nav1 ul li:nth-child(2) {
  text-align: center;
  box-sizing: border-box;
}
#faq .nav1 ul li:nth-child(2) a {
  transition: none;
}
#faq .nav1 ul li:nth-child(3) {
  background: #BBB;
  text-align: center;
}
#faq .nav1 ul li:nth-child(3) a {
  transition: none;
}

#faq .nav1 ul li a {
  width: 100%;
  height: 100%;
  display: block;
  color: #333;
  transition: all .5s ease;
}

#faq .nav2 ul li:not(:first-child):before {
  content: "／";
  display: inline-block;
}
#faq .nav2 ul li a {
  position: relative;
  opacity: 1;
  transition: all .5s ease;
}
#faq .nav2 ul li a:after {
  position: absolute;
  left: 0;
  display: block;
  content: "";
  width: 100%;
  border-radius: .3rem;
  background: #EC6E03;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: all .5s ease;
}
#faq .nav2 ul li a:hover:after {
  transform: scale(1,1);
}

#faq .faq-wrap li .question{
  background: #fff;
  cursor: pointer;
  transition: all .5s ease;
  position: relative;
}
#faq .faq-wrap li .question:before,
#faq .faq-wrap li .question:after {
  position: absolute;
  content: "";
  display: block;
  background: #707070;
}
#faq .faq-wrap li .question:before {
  transform: rotate(0deg);
  transition: all .2s ease;
}
#faq .faq-wrap li .question:after {
  transform: rotate(90deg);
  transition: all .2s ease;
}
#faq .faq-wrap li .question.close:before {
  transform: rotate(45deg);
}
#faq .faq-wrap li .question.close:after {
  transform: rotate(-45deg);
}
#faq .faq-wrap li .question span {
  display: inline-block;
  background: #988061;
  color: #fff;
  font-weight: 700;
  text-align: center;
}
#faq .faq-wrap li .question.close span {
  background: #fff;
  color: #988061;
}
#faq .faq-wrap li .question h3 {
  display: inline-block;
}
#faq .faq-wrap li .answer {
  background: #AFA191;
  position: relative;
  display: none;
}
#faq .faq-wrap li .answer span {
  display: block;
  color: #fff;
  font-weight: 700;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										利用規約／個人情報保護ページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#privacy nav ul {
  align-items: flex-end;
}
#privacy nav ul li {
  transition: .5s all ease-out;
}
#privacy nav ul li:nth-child(1) {
  font-weight: 700;
  text-align: center;
  border-radius: 2rem 2rem 0 0;
}
#privacy nav ul li:nth-child(1) a {
  transition: none;
}
#privacy nav ul li:nth-child(1) span {
  display: inline-block;
}
#privacy nav ul li:nth-child(2) {
  text-align: center;
  border-radius: 2rem 2rem 0 0;
  box-sizing: border-box;
}
#privacy nav ul li:nth-child(2) a {
  transition: none;
}
#privacy nav ul li:nth-child(3) {
  background: #BBB;
  text-align: center;
  border-radius: 2rem 2rem 0 0;
}
#privacy nav ul li a {
  width: 100%;
  height: 100%;
  display: block;
}
#privacy .t-of-s .inner {
  background: #BBB;
}
#privacy .t-of-s h2 {
  font-weight: 700;
}
#privacy .privacy .inner {
  background: #BBB;
}
#privacy .privacy h2 {
  font-weight: 700;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										お問い合わせページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#contact nav ul {
  align-items: flex-end;
}
#contact nav ul li {
  transition: .5s all ease-out;
}
#contact nav ul li:nth-child(1) {
  font-weight: 700;
  text-align: center;
  border-radius: 2rem 2rem 0 0;
}
#contact nav ul li:nth-child(1) a {
  transition: none;
}
#contact nav ul li:nth-child(1) span {
  display: inline-block;
}
#contact nav ul li:nth-child(2) {
  text-align: center;
  border-radius: 2rem 2rem 0 0;
  box-sizing: border-box;
}
#contact nav ul li:nth-child(3) {
  background: #BBB;
  text-align: center;
  border-radius: 2rem 2rem 0 0;
}
#contact nav ul li:nth-child(3) a {
  color: #000;
  transition: none;
}
#contact nav ul li a {
  width: 100%;
  height: 100%;
  display: block;
  transition: all .5s ease;
}

#contact .form .wrap {
  text-align: center;
}
#contact .form .wrap h1 {
  font-weight: 700;
  line-height: 1;
}
#contact .form .wrap h1 span {
  display: block;

}
#contact .form .g-form .form-col .req {
  display: inline-block;
  text-align: center;
  color: #fff;
  background: #B42F39;
  border-radius: .4rem;
}

#contact .form .g-form input[type="text"],
#contact .form .g-form input[type="email"],
#contact .form .g-form input[type="tel"],
#contact .form .g-form  textarea {
  display: block;
  background: #fff;
  width: 100%;
  box-sizing: border-box;
}
#contact .form .g-form  textarea {
  resize: none;
}
#contact .submit-list {
  text-align: center;
}
#contact .submit-list .submit {
  border-radius: .8rem;
  box-shadow: 0 0.3rem 0.6rem 0 rgb(0 0 0 / 16%);
}
#contact .submit-list .submit p {
  color: #fff;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										シングルスポットページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#s-spot h1 {
  font-weight: 700;
  border-bottom: 1px solid #988061;
}
#s-spot .wrap {
  justify-content: space-between;
}
#s-spot .wrap .cat {
  font-weight: 700;
  color: #fff;
  background: #988061;
  text-align: center;
}
#s-spot .photo {
  width: 100%;
  height: auto;
}
#s-spot .photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: 50% 50%;
  font-family: "object-fit: contain;";
}
#s-spot .text p {
  line-height: 2;
}

#s-spot .author {
  justify-content: flex-end;
  line-height: 1;
}
#s-spot .author .icon {
  display: inline-block;
  vertical-align: middle;
}
#s-spot .author p {
  display: inline-block;
  vertical-align: middle;
}
#s-spot-aside ul li {
  border-bottom: 1px solid #988061;
}

#s-spot-aside .wrap {
  justify-content: space-between;
}
#s-spot-aside .wrap .cat {
  color: #fff;
  background: #988061;
  text-align: center;
}

#s-spot-pager.pager-wrapper {
  padding: 10rem 0;
  background: #DFDFDF;
  position: relative;
}
#s-spot-pager.pager-wrapper .g-pager {
  margin: 0 auto;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										シングルインフォ　ページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#s-info .new {
  color: #A83216;
}
#s-info .wrap {
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid #988061;
}
#s-info .wrap h1 {
  font-weight: 700;
}
#s-info .text p {
  line-height: 2;
}

#s-info-aside ul li a h3 {
  border-bottom: 1px solid #988061;
}
#s-info-aside ul li a .date {
  display: block;
}

#s-info-pager.pager-wrapper {
  padding: 10rem 0;
  background: #DFDFDF;
  position: relative;
}
#s-info-pager.pager-wrapper .g-pager {
  margin:0 auto;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										Information　archiveページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#a-info {
  margin: auto;
}
#a-info .info-list .new {
  color: #A83216;
}
#a-info .wrap {
  justify-content: space-between;
  align-items: baseline;
  border-bottom: 1px solid #988061;
}
#a-info .wrap h2 {
  font-weight: 700;
}
#a-info .text p {
  line-height: 2;
}

#a-info-aside ul li a h3 {
  border-bottom: 1px solid #988061;
}

#a-info-aside ul li a .date {
  display: block;
}
/*----------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
										404ページ
------------------------------------------------------------------------------------------
------------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------*/
#notfound .inner {
  text-align: center;
  margin: auto;
}

#notfound .photo-wrap {
  flex-wrap: wrap;
}
#notfound .photo-wrap li {
  height: auto;
}
#notfound .photo-wrap li .img {
  width: 100%;
  height: 100%;
}
#notfound .photo-wrap li .img img {
  /* width: 100%;
  height: 100%; */
  object-fit: cover;
  object-position: 50% 50%;
  font-family: "object-fit: cover; object-position: 50% 50%;";
}