@charset "UTF-8";

@font-face {
    font-family: 'Noto Serif JP Bold';
    src: url('https://cnctorsys.sakura.ne.jp/metropolitan-akita/fonts/NotoSerifJP-Bold.otf');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Noto Serif JP Medium';
    src: url('https://cnctorsys.sakura.ne.jp/metropolitan-akita/fonts/NotoSerifJP-Medium.otf');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Noto Serif JP Regular';
    src: url('https://cnctorsys.sakura.ne.jp/metropolitan-akita/fonts/NotoSerifJP-Regular.otf');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* CSS Document */
/* -- 全体 --*/

/* Reset box-model and set borders */
/* ============================================ */

*,
::before,
::after {
  box-sizing: border-box;
  border-style: solid;
  border-width: 0;
}

/* Document */
/* ============================================ */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 * 3. Remove gray overlay on links for iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -webkit-tap-highlight-color: transparent; /* 3*/
}

/* Sections */
/* ============================================ */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/* Vertical rhythm */
/* ============================================ */

p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
  margin: 0;
}

/* Headings */
/* ============================================ */

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

/* Lists (enumeration) */
/* ============================================ */

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Lists (definition) */
/* ============================================ */

dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
}

/* Grouping content */
/* ============================================ */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
  border-top-width: 1px;
  margin: 0;
  clear: both;
  color: inherit;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

address {
  font-style: inherit;
}

/* Text-level semantics */
/* ============================================ */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
  text-decoration: none;
  color: inherit;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: inherit; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Replaced content */
/* ============================================ */

/**
 * Prevent vertical alignment issues.
 */

svg,
img,
embed,
object,
iframe {
  vertical-align: bottom;
}

/* Forms */
/* ============================================ */

/**
 * Reset form fields to make them styleable.
 * 1. Make form elements stylable across systems iOS especially.
 * 2. Inherit text-transform from parent.
 */

button,
input,
optgroup,
select,
textarea {
  -webkit-appearance: none; /* 1 */
  appearance: none;
  vertical-align: middle;
  color: inherit;
  font: inherit;
  background: transparent;
  padding: 0;
  margin: 0;
  border-radius: 0;
  text-align: inherit;
  text-transform: inherit; /* 2 */
}

/**
 * Correct cursors for clickable elements.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
}

button:disabled,
[type="button"]:disabled,
[type="reset"]:disabled,
[type="submit"]:disabled {
  cursor: default;
}

/**
 * Improve outlines for Firefox and unify style with input elements & buttons.
 */

:-moz-focusring {
  outline: auto;
}

select:disabled {
  opacity: inherit;
}

/**
 * Remove padding
 */

option {
  padding: 0;
}

/**
 * Reset to invisible
 */

fieldset {
  margin: 0;
  padding: 0;
  min-width: 0;
}

legend {
  padding: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * Correct the outline style in Safari.
 */

[type="search"] {
  outline-offset: -2px; /* 1 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Fix font inheritance.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/**
 * Fix appearance for Firefox
 */
[type="number"] {
  -moz-appearance: textfield;
}

/**
 * Clickable labels
 */

label[for] {
  cursor: pointer;
}

/* Interactive */
/* ============================================ */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/*
 * Remove outline for editable content.
 */

[contenteditable]:focus {
  outline: auto;
}

/* Tables */
/* ============================================ */

/**
1. Correct table border color inheritance in all Chrome and Safari.
*/

table {
  border-color: inherit; /* 1 */
  border-collapse: collapse;
}

caption {
  text-align: left;
}

td,
th {
  vertical-align: top;
  padding: 0;
}

th {
  text-align: left;
  font-weight: bold;
}

* {
    margin: 0;padding: 0;
}
:root {
    --main-BG:#F4F6F5;
    --main-accent:#638FA2;
    --main-txt:#343B2B;
}
html{
    overflow-x:hidden;
    scroll-behavior: smooth;
}
body {
    font-family: Lato, "Noto Serif JP Bold", "Noto Serif JP Medium", "Noto Serif JP Regular", "游ゴシック", "游ゴシック体", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    line-height: 1.6;
    font-size:16px;
    min-width: 1200px;
    margin: 0 auto;
    color: #343B2B;
    letter-spacing: .02em;
    background-color:#FDFBF7 !important;
}
img { 
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}
a { 
    text-decoration:none!important;
    color: #343B2B!important;
}
p{
    font-size: 1rem!important;
    color: var(--main-txt, #343B2B);
    font-weight: 400;
    font-family: 'Noto Serif JP Regular';
}
h2 {
  font-size: 2.5rem;
  font-family: 'Noto Serif JP Regular';
}
h3 {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 170%;
    margin-bottom: 1rem;
}
ul{
    list-style: none;
}
table {
    width: 100%;
    font-weight: 500;
}
tr {
    display: flex;
    padding: 0.2rem 0;
    /* border-bottom: solid 1px var(--main-txt); */
    gap: .5rem;
}
tr:last-child {
    border-bottom: none;
}
.inner{
    width: 1080px;
    padding: 5rem 0;
    margin: auto;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}
.sub-title {
    position: relative;
    color: #AACD99;
    font-size: 14px;
    padding-left: 27px;
    margin-bottom: 1rem;
    font-weight: 700;
}
.sub-title::before {
    position: absolute;
    content: "";
    background-image: url(https://rakutentravel.nishitetsu-hotels.net/n-inn/fukuoka/rakuten/images/common/main-icon.png);
    width: 19px;
    height: 19px;
    top: 4px;
    left: 0;
}
.main-title {
    color: var(--main-accent);
    margin-bottom: 2.5rem;
    font-family: 'Noto Serif JP Regular';
}

.list-title {
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
  padding: 1rem 0;
  background: #7E8082;
  color: #fff;
  width: 100%;
}

.list-box {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.list-box .text-box {
    padding: 0 2.5rem;
}

.list-box h3 {
  font-size: 1.5rem;
}

.bg-title {
  display: inline-block;
  margin-bottom: 1rem;
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
  padding: .5rem 1rem;
  background: var(--main-accent);
  color: #fff;
}

.main-btn,.main-btn-2 {
    position: relative;
    display: inline-block;
    border: 1px solid;
    border-radius: 3px;
    margin: 3rem auto 0;
    font-weight: 500;
    line-height: 170%;
    padding: 0.5rem 1rem .5rem 2rem;
    transition: all 0.3s ease;
}

.main-btn {
    background-color: #fff;
}

.main-btn:hover {
    background-color: #343B2B;
    color: #fff !important;
}

.main-btn-2 {
  border: 1px solid var(--main-accent);
  background-color: var(--main-accent);
  color: #fff !important;
}

.main-btn-2:hover {
    background-color: #fff;
    color: var(--main-accent) !important;
}

.main-btn::before,.main-btn-2::before {
    position: relative;
    display: inline-block;
    content: "▶︎";
    width: 8px;
    height: 8px;
    left: -1rem;
}

.top_contents {
  background-color: #fff;
}

/* ----------------------- TOP＿KV -----------------------*/

.cus_contents {
    width: 1080px !important;
    margin: 0 auto;
    padding-top:80px;
}
#cus_page {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-text-size-adjust: none;
	margin:0;
	padding:0;
	color:#333;
	position: relative;
}
.mv-bg {
    background: #F4F6F5;
}
.mv {
    margin: 0 auto;
    display: block;
}

/* -- ナビゲーション --*/
.header_nav {
    overflow: hidden;
    display: flex;
    justify-content: center;
}
.header_nav a {
    font-weight: 200;
    text-align: center;
    display: block;
}
.header_nav a:hover {
    text-decoration: underline;
    opacity: 0.7;
}
.header_title_nav {
    /* width: 1920px; */
    margin: auto;
    overflow: hidden;
    background:#638FA2;
    position: relative;
    left: 50%;
    transform: translate(-50%,0);
}

.header_title_nav .header_nav ul{
    width: 1080px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    padding: .25rem 0;
}
.header_title_nav .header_nav ul li {
    text-align: center;
    flex-grow: 1;
    width: calc(100% / 6);
}
.header_title_nav .header_nav ul li:nth-child(n+6):nth-child(-n+8){
    border-right: none!important;
}
.header_title_nav .header_nav ul .wh {
    position: relative;
    background: #fff;
    padding: 2.3rem 0 0.8rem;
}
.header_title_nav .header_nav ul .wh::before:hover,.header_title_nav .header_nav ul .gn::before:hover {
    opacity: 0.7;
}
.header_title_nav .header_nav ul li a {
    display: block;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
    padding: 1rem 0;
    color: #fff !important;
    background-color: #96AEBA;
}
.header_title_nav .header_nav ul li a span {
    font-size: 12px;
    font-weight: normal;
}

/* ----flexbox---- */
.flex-box {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
}

.flex-box>* {
  flex-basis: calc(100% / 2);
}

.fl,
.col_2,
.col_3,
.col_2_3,
.col_2_4,
.col_3_4,
.col_3_5 {
  display: flex;
  align-items: center;
  flex-flow: wrap;
}

.col_1,
.col_1_2 {
  display: block;
}

.col_1>* {
  display: block;
  width: 100%;
}

.col_1_2>* {
  flex-basis: 100%;
  margin-bottom: 1rem;
}

.col_right>*:last-child {
  flex-basis: calc(75%);
}

.col_3>* {
  flex-basis: calc(100% / 3 - .8rem);
}

.col_2_3>*,
.col_2_4>* {
  flex-basis: calc(100% / 2 - .5rem);
  margin-bottom: 1rem;
}

.col_3_5>* {
  flex-basis: calc(100% / 3 - .8rem);
  margin-bottom: 1rem;
}

.cols>* {
  width: 100%;
  min-width: 0;
}

.col-25 {
  flex: 0 0 25%;
  max-width: 25%;
}

.col-35 {
  flex: 0 0 35%;
  max-width: 35%;
}

.col-50 {
  flex: 0 0 50%;
  max-width: 50%;
}

.gap_05 {
  gap: 2.5rem .5rem;
}

.gap_1 {
  gap: 1.5rem;
}

.gap_2 {
  gap: 2rem;
}

.gap_3 {
  gap: 3rem;
}

/* ------------------ concept --------------------*/

.head-box {
  margin: auto;
  margin-bottom: 2rem;
}

.head-box h2 {
  margin-bottom: 1.5rem;
}

.head-box h2, .head-box p {
  font-family: 'Noto Serif JP Regular';
  text-align: center;
}

.border {
    border-bottom: 2px solid #333;
}

.common-title {
  position: relative;
  display: grid;
  margin-bottom: 2rem;
  text-align: center;
  margin: 0 auto 4rem;
  font-size: 2rem;
  font-family: 'Noto Serif JP Bold';
}

.common-title .en-title {
  font-size: 1rem;
}

.common-title::before {
  content: "";
  position: absolute;
  bottom: -1.5rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: var(--main-accent);
  width: 3rem;
  height: 3px;
}

.half-bg-l,
.half-bg-r {
  position: relative;
}

.half-bg-l::before {
    content: "";
    position: absolute;
    left: 0;
    background-color: #FAF2E9;
    width: 50vw;
    height: 100%;
    z-index: -1;
}

.half-bg-r::before {
  content: "";
  position: absolute;
  right: 0;
  background-color: #FAF2E9;
  width: 50vw;
  height: 100%;
  z-index: -1;
}

.concept-item:not(:last-child) {
    margin-bottom: 5rem;
}

.concept-box .img-box {
    margin-bottom: 2rem;
}

.concept-box .right-box p {
    /* margin-bottom: 2rem; */
    line-height: 2;
}

.concept-box .ttl-box {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

.concept-box h4 {
    font-size: 1.25rem;
    font-weight: 500;
}

.concept-box h3 {
    font-size: 2rem;
    font-weight: 500;
    font-family: 'Noto Serif JP Regular';
}

.concept-box .num {
    display: block;
    border: 1px solid #333;
    padding: .25rem .5rem;
}

.left-box {
    width: 50%;
}
.right-box {
    width: 50%;
}


.common-box {
  display: flex;
  flex-direction: row;
  background-color: #fff;
}

.common-box:not(:last-child) {
margin-bottom: 3rem;
}

.common-box .right-box h3 {
  font-size: 1.5rem;
}
.common-box .right-box.text-box {
  padding: 0 2.5rem;
  flex: 1 0 auto;
  display: flex;
  align-items: center;
}

.common-box .right-box ul:not(:last-child) {
margin-bottom: 1.5rem;
}

.common-box-wrap {
  display: flex;
  flex-direction: row;
  gap: 1.5rem;
}

.common-box02 {
  text-align: center;
  background-color: #fff;
}

.common-box02 .text-wrap ul {
  text-align: left;
  display: inline-block;
  padding: 1.5rem 1rem;
}


.common-txt-box {
  background-color: #fff;
  padding: 1.5rem;
  width: 100%;
}

.common-txt-box h3 {
  font-size: 1.5rem;
}

.btn-box >*:nth-child(2) {
  margin-left: 1rem;
}

.common-box02 h3 {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
  padding: .5rem 0;
  margin-bottom: initial;
}

.seven {
  background-color: #00A54F;
}

.starbucks {
  background-color: #016241;
}

/* ----------------------- restaurant -----------------------*/

#restaurant .main-title {
    font-size: 2.5rem;
    font-family: 'Noto Serif JP Regular';
}

#restaurant h3 {
    font-size: 1.5rem;
}


/* ----------------------- sightseeing -----------------------*/

#sightseeing .list-box {
    margin: auto;
    text-align: center;
}

#sightseeing .img-box {
  margin-bottom: 2rem;
}

/* ----------------------- conceptページ　room -----------------------*/

.room-txt-box {
  background-color: #fff;
  padding: 1.5rem;
}


.common-nav {
  width: 100%;
  margin-bottom: 5rem;
}

.common-nav a {
  position: relative;
  display: block;
  text-align: center;
  padding: 1.5rem 0;
  color: #fff !important;
  font-size: 1rem;
  font-weight: 500;
  outline: 1px solid #fff;
  outline-offset: -.5rem;
}

.common-nav a::after {
  position: absolute;
  top: 50%;
  right: 2em;
  width: 0.5em;
  height: 0.5em;
  transform: translateY(-50%) rotate(135deg);
  border-right: 2px solid currentColor;
  border-top: 2px solid currentColor;
  content: "";
}

.common-nav .left-box a {
  background-color: #96AEBA;
}

.common-nav .right-box a {
  background: #7E8082;
}
/* ----------------------- introduction -----------------------*/


#introduction{
    background: var(--main-BG);
}
#introduction .box-img {
    width: 60%;
}
#introduction .box-text {
    width: 60%;
    padding: 2.5rem;
}
#introduction h3 {
    color: var(--main-accent);
}
#introduction h4 {
    font-size: 20px;
    font-weight: 500;
    line-height: 170%;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: solid 1px #333;
}
#introduction p {
    line-height: 2;
}

/* ------------------ room --------------------*/
.room-box:not(:last-child) {
    margin-bottom: 5rem;
}


/* ----------------------- point -----------------------*/

#point {
    margin: 5rem 0;
}
#point h3 {
    color: var(--main-accent);
}
#point h4 {
    color: var(--main-accent);
    font-weight: 500;
    font-size: 20px;
}
#point p {
    margin-bottom: 2rem;
}
#point .list-box{
    gap: 2rem;
    margin-bottom: 5rem;
}
#point .box-img img{
    width: 450px;
}

/* ----------------------- access -----------------------*/
#access h3 {
    font-size: 2rem;
    margin-bottom: 2.5rem;
}
#access .box-item {
    margin-bottom: 1.5rem;
}
#access .box-item h4 {
    font-size: 20px;
}
#access h6 {
    font-size: 20px;
    color: var(--main-accent);
    font-weight: 700;
    padding-bottom: 1rem;
}
#access .list-box {
    gap: 2.5rem;
    width: 1080px;
}
#access .box-text {
    width: 50%;
}
#access p {
    letter-spacing: 0;
}
/* ----------------------- rooms -----------------------*/
#rooms .main-btn {
    margin-top: 1.5rem;
    color: var(--main-accent) !important;
    border: 1px solid var(--main-accent);
}
#rooms .room-btn {
    margin: 4rem auto;
    text-align: center;
}
.floor-title {
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
  padding: 1rem 0;
  width: 100%;
  color: #fff;
  margin-bottom: 4rem;
}

/* ----------------------- restaurant -----------------------*/
.restaurant-items {
  background: #FAF2E9;
}

.tag-list {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.tag-list li {
  background: #FAF2E9;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
}

.restaurant-items .text-wrap {
  display: grid;
  gap: 1rem;
}

.restaurant-items .list-box {
  background-color: #fff;
  align-items: initial;
}

.restaurant-items .list-box {
  flex-direction: column;
  gap: 1rem;
  padding: 1.5rem;
}

.common-detail-box {
  background: #FAF2E9;
  padding: 1rem;
}

.common-detail-box li:not(:last-child) {
  margin-bottom: 0.5rem;
}

.note-list {
  padding-left: 1rem;
  font-size: .85rem;
}

.note-list li {
  list-style: "※";
}

.restaurant-menu {
  display: grid;
  gap: 1rem;
}

#menu02.floor-title {
  background-color: #7E8082;
}

#menu01.floor-title {
  background-color: var(--main-accent);
}

.premiun-detail {
  background-color: var(--main-accent);
  color: #fff;
  padding: 1rem;
}

.standard-detail {
  background-color: #7E8082;
  color: #fff;
  padding: 1rem;
}

p + .premiun-detail,
p + .standard-detail {
  margin-top: 1rem;
}

#information.room {
  background: #EEEBE8;
}

/* ----------------------- sight-seeing -----------------------*/
.sight-seeing {
  background: #fff;
}

.sight-seeing-list {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);
}

.sight-seeing-list h3 {
  display: flex;
  flex-direction: column;
}

.sight-seeing-list h3 .en {
  font-size: 1.25rem;
  color: var(--main-accent);
}

.sight-seeing-list .img-box {
  margin-bottom: 1rem;
}

.sight-seeing-list .txt-box > p:not(:last-child) {
  margin-bottom: 1rem;
}

/* ----------------------- access -----------------------*/
#access {
  background: #FAF2E9;
}

.map-wrap {
  background-color: #fff;
  width: 100%;
  margin-bottom: 5rem;
}

.map-container {
  position: relative;
  width: 100%;
  height: 400px; /* 固定の高さを設定 */
  margin: 0 0 1rem;
}

.map-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.map-nav{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem 1.5rem 2rem;
}

.map-info {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
  border-bottom: 1px solid #333;
  padding-bottom: 2rem;
}

.map-info .map-info {
  border-bottom: 1px solid #333;
}

.map-info .txt-box {
  text-align: center;
}

.map-info h2 {
  font-size: 1.5rem;
}

.map-nav-list {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 5rem;
  padding-top: 1rem;
}

.map-nav-list li {
  position: relative;
  border-bottom: 1px solid #333;
}

.map-nav-list li::before {
  content: "▼";
  /* border: 1px solid var(--main-accent); */
  color: var(--main-accent);
  border-radius: 100%;
  display: flex;
  justify-content: center;
  position: absolute;
  top: 50%;
  width: 1.75rem;
  left: -2rem;
  transform: translateY(-50%);
  font-size: 1rem;
}

.map-box .img-box:not(:last-child) {
  margin-bottom: 5rem;
}

/* ----------------------- Facility -----------------------*/
#facility {
  background: #FAF2E9;
}

/* ----------------------- Facility -----------------------*/
.footer {
    /* width: 1920px; */
    overflow: hidden;
    position: relative;
    background: var(--main-BG);
    padding: 5rem 0;
    left: 50%;
    transform: translate(-50%, 0);
    margin-top: 2.5rem;
    padding: 3rem;
    background: var(--main-BG);
}
.footer p{
    margin-top: 1.5rem;
    line-height: 2;
}
.footer img {
    width: 40% !important;
}