.-x-richtext ul, .-x-richtext ol {
	list-style-position: inside;
}
[data-legal]{
	position:relative;
	--legal-offset-h:attr(data-legal-offset-h px);
	--legal-offset-v:attr(data-legal-offset-v px);
}
[data-legal][data-legal-safe="1"]::after{
	position: absolute;
	opacity: 0.5;
	color: black;
	content: "墨";
	font-size: 16px;
	display: block;
	height: 24px;
	padding-top: 0px;
	background-image: url(/_lib/lc.png);
	background-size: auto 20px;
	background-repeat: no-repeat;
	padding-left: 50px;
	background-position: left top;
}
[data-legal][data-legal-safe="1"]:hover::after {
    position: absolute;
    opacity: 0.5;
    color: black;
    content: attr(data-legal-check-at);
    white-space:nowrap;
    font-size: 11px;
    display: block;
    height: 24px;
    background-image: url(/_lib/lc.png);
    background-size: auto 20px;
    background-repeat: no-repeat;
    padding-top: 15px;
    padding-left: 0px;
    background-position: left top;
}

[data-legal-position="left-top"]::after{
	left:var(--legal-offset-h);
	top:var(--legal-offset-v);
}
[data-legal-position="left-bottom"]::after{
	left:var(--legal-offset-h);
	bottom:var(--legal-offset-v);
}
[data-legal-position="right-top"]::after{
	right:var(--legal-offset-h);
	top:var(--legal-offset-v);
}
[data-legal-position="right-bottom"]::after{
	right:var(--legal-offset-h);
	bottom:var(--legal-offset-v);
}
/*common_css*/
@charset "utf-8";
/* CSS Document */
/* -------------------------------------
Browser：Edge over
-------------------------------------
01: 共通
02: テンプレート
03: ヘッダー＆フッター
04: ページ
-------------------------------------*/

/** ==============================================
01.共通
============================================== **/
/* -------------------------------------
文字サイズ変更
-------------------------------------*/
.textsize {
  font-size: 14px;
  position: absolute;
  right: 0;
  top: 80px;
}
.textsize ul::before {
  content: "文字サイズ";
}
.textsize li:first-child {
  display: none;
}
.textsize li {
  display: inline-block;
  margin-left: 4px;
  padding: 6px;
  line-height: 1;
  color: #fff;
  text-align: center;
  background: var(--gray);
}
.textsize li:hover,
.textsize li.t2 {
  color: var(--color);
  background: var(--main-color_lll);
}

@media screen and (max-width: 979px) {
  .textsize {
    display: none;
  }
}

/* -------------------------------------
文字サイズ･･･em
-------------------------------------*/
body .fs12em {
  font-size: 0.75em;
}
body .fs14em {
  font-size: 0.95em;
}

body .fs16em {
  font-size: 1.06em;
}
body .fs17em {
  font-size: 1.13em;
}
body .fs18em {
  font-size: 1.2em;
}
body .fs20em {
  font-size: 1.33em;
}
body .fs22em {
  font-size: 1.46em;
}
body .fs24em {
  font-size: 1.6em;
}
body .fs26em {
  font-size: 1.73em;
}
body .fs28em {
  font-size: 1.86em;
}
body .fs30em {
  font-size: 2em;
}
body .fs32em {
  font-size: 2.13em;
}
body .fs35em {
  font-size: 2.33em;
}
body .fs40em {
  font-size: 2.66em;
}
body .fs44em {
  font-size: 2.93em;
}
body .fs46em {
  font-size: 3.06em;
}
body .fs54em {
  font-size: 3.6em;
}
body .fs50em {
  font-size: 3.33em;
}
body .fs60em {
  font-size: 4em;
}
body .fs70em {
  font-size: 4.66em;
}

@media screen and (max-width: 768px) {
  body .fs16em {
    font-size: 1em;
  }
  body .fs17em {
    font-size: 1em;
  }
  body .fs18em {
    font-size: 1em;
  }
  body .fs20em {
    font-size: 1.1em;
  }
  body .fs22em {
    font-size: 1.1em;
  }
  body .fs24em {
    font-size: 1.2em;
  }
  body .fs26em {
    font-size: 1.46em;
  }
  body .fs28em {
    font-size: 1.6em;
  }
  body .fs30em {
    font-size: 1.73em;
  }
  body .fs32em {
    font-size: 1.86em;
  }
  body .fs35em {
    font-size: 2em;
  }
  body .fs40em {
    font-size: 2.4em;
  }
  body .fs44em {
    font-size: 2.4em;
  }
  body .fs46em {
    font-size: 2.66em;
  }
  body .fs50em {
    font-size: 2.8em;
  }
  body .fs54em {
    font-size: 2.8em;
  }
  body .fs60em {
    font-size: 3.06em;
  }
  body .fs70em {
    font-size: 3.2em;
  }
}

@media screen and (max-width: 480px) {
  body .fs26em {
    font-size: 5vw;
  }
  body .fs28em {
    font-size: 5vw;
  }
  body .fs30em {
    font-size: 5vw;
  }
  body .fs32em {
    font-size: 6vw;
  }
  body .fs35em {
    font-size: 6vw;
  }
  body .fs40em {
    font-size: 7vw;
  }
  body .fs44em {
    font-size: 7vw;
  }
  body .fs46em {
    font-size: 7vw;
  }
  body .fs50em {
    font-size: 7vw;
  }
  body .fs54em {
    font-size: 7vw;
  }
  body .fs60em {
    font-size: 8.8vw;
  }
  body .fs70em {
    font-size: 8.8vw;
  }
}

/** ================================================================================
このサイトの共通装飾CSS
================================================================================ **/

/**-------------------------------------
content-box
-------------------------------------**/
.content-box {
  padding: 50px 80px;
  background: rgba(255, 255, 255, 0.8);
}

@media screen and (max-width: 768px) {
  .content-box {
    padding: 30px;
  }
}

/* -------------------------------------
list
-------------------------------------*/
.list li {
  display: flex;
  margin-bottom: 10px;
}
.list li::before {
  content: "check_circle";
  font-family: "Material Icons";
  font-size: 30px;
  color: var(--main-color_l);
  line-height: 1;
  margin-right: 4px;
}

/* -------------------------------------
list2
-------------------------------------*/
.list2 li {
  display: flex;
  margin-bottom: 10px;
}
.list2 li::before {
  content: "●";
  color: #008cd9;
  margin-right: 4px;
}

/**-------------------------------------
count  自動連番
-------------------------------------**/
.count li {
  counter-increment: li;
}
.count li::after {
  content: counter(li);
  /*	content: counter(li, decimal-leading-zero); ←各連番に0が付く（例）01、02、03･･･*/
}

/** ==============================================
02.テンプレート
============================================== **/

/**==============================================
03: ヘッダー
==============================================**/
header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background: #fff;
}
header h1 {
  margin-bottom: 14px;
  font-size: 12px;
}
header .inner {
}
header .inner .logo {
  width: 264px;
  margin: 0;
  padding: 10px 0 18px;
}
header .inner .logo img {
  width: 100%;
}

/*nav*/
header nav ul.menu1 {
  margin-left: calc((100% - 100vw) / 2);
  margin-right: calc((100% - 100vw) / 2);
  padding-left: calc((100vw - 980px) / 2);
  padding-right: calc((100vw - 980px) / 2);
  display: flex;
  justify-content: flex-start;
}
header nav ul.menu1 li {
  position: relative;
}
header nav ul.menu1 li + li::before {
  content: "";
  display: block;
  width: 1px;
  height: 16px;
  background: var(--color);
  position: absolute;
  left: 0;
  top: 20px;
}
header nav ul li a {
  display: block;
  padding: 20px;
  font-size: 0.95em;
  line-height: 1.2;
  text-align: center;
  position: relative;
}
header nav ul li a:hover {
  color: var(--main-color);
}

/*menu2*/
header nav .menu2 {
  width: 670px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  position: absolute;
  right: 0;
  top: 10px;
}
header nav .menu2 p {
  display: flex;
  flex-direction: column;
  margin: 0 auto 0 0;
  font-size: 0.9em;
  line-height: 1.3;
}
header nav .menu2 a[href^="tel"] {
  margin: 3px 0 5px 0;
  font-family: var(--webf);
  color: var(--main-color);
  font-size: 1.7em;
}
header nav .menu2 a[href^="tel"] img {
  margin-right: 4px;
  vertical-align: middle;
}
header nav .menu2 a.h-btn {
  display: flex;
  justify-content: center;
  width: fit-content;
  min-width: 160px;
  line-height: 42px;
  margin-left: 10px;
  padding: 0 1em;
  align-items: center;
  background: var(--main-color_lll);
}
header nav .menu2 a.h-btn:hover {
  color: #fff;
  background: var(--main-color);
}
header nav .menu2 a.h-btn.h-acs {
  color: #fff;
  background: var(--main-color);
}
header nav .menu2 a.h-btn.h-acs:hover {
  color: var(--color);
  background: var(--main-color_lll);
}

@media screen and (max-width: 979px) {
  header h1 {
    display: none;
  }
  header .inner .logo {
    width: fit-content;
    padding: 0;
    height: 60px;
  }
  header .inner .logo a {
    padding: 10px 5%;
  }
  header .inner .logo img {
    height: 40px;
    width: auto;
  }

  #menu {
    --size: 60px;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1500;
    width: var(--size);
    height: var(--size);
    background: var(--main-color);
    text-align: center;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  #menu:before {
    color: #fff;
    content: "\e3c7";
    font-size: 36px;
    font-family: "Material Icons";
    line-height: 46px;
  }
  .on #menu:before {
    content: "\e5cd";
  }
  #menu:after {
    display: block;
    margin: -5px auto;
    color: #fff;
    content: "MENU";
    font-size: 11px;
    font-family: var(--webf);
  }
  .on #menu:after {
    content: "CLOSE";
  }

  header nav {
    display: none;
    width: 100% !important;
    height: calc(100vh - 50px);
    overflow-y: scroll;
  }
  header nav ul.menu1 {
    display: block;
    margin: 0;
    padding: 30px 0 10px;
    font-size: 15px;
  }
  header nav ul.menu1 li + li::before {
    display: none;
  }
  header nav ul.menu1 li a {
    padding: 14px 10%;
    line-height: 1.2;
  }

  header nav .menu2 {
    width: 100%;
    position: relative;
    top: 0;
    display: block;
    padding: 20px 20px 30px;
    text-align: center;
  }
  header nav .menu2 p {
    flex-flow: column;
    line-height: 1.7;
  }
  header nav .menu2 a[href^="tel"] {
    margin: 0 auto;
    font-size: 2.6em;
  }
  header nav .menu2 a.h-btn {
    width: 100%;
    max-width: 300px;
    margin: 20px auto -6px;
  }
}

/**==============================================
03: フッター
==============================================**/
footer {
  padding: 100px 0 50px;
  line-height: 1.3;
  background: var(--bg-color);
}
footer .sec-in {
  display: flex;
  justify-content: space-between;
  gap: 70px;
}
footer .sec-in .footer-main {
  width: 320px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}
footer .sec-in .footer-main .f-logo {
  display: block;
  width: fit-content;
  margin-bottom: 10px;
}
footer .sec-in .footer-main .f-logo img {
  width: 315px;
}
footer .sec-in .footer-main a[href^="tel:"] {
  display: flex;
  justify-content: flex-start;
  color: var(--main-color);
  line-height: 1;
}
footer .sec-in .footer-main .ico-svg-tel svg {
  --size: 22px;
  width: var(--size);
  height: var(--size);
  margin-right: 10px;
  fill: var(--main-color);
}

/*nav*/
footer nav {
  flex: 1;
  margin-bottom: 50px;
}
footer nav ul li a {
  display: block;
  padding: 0 10px 14px;
  width: 100%;
}
footer nav ul li a:hover {
  color: var(--main-color);
}

.f-bnr-wrapper {
  display: flex;
  flex-direction: column;
}
.f-bnr-wrapper a {
  width: fit-content;
  margin-bottom: 14px;
}
.f-bnr-wrapper a img {
  width: 300px;
}
.f-btn-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.f-btn-wrapper .f-btn {
  width: min(100%, 260px);
  height: 56px;
  display: grid;
  place-items: center;
  text-align: center;
  line-height: 1.3;
  background: var(--main-color_lll);
}
.f-btn-wrapper .f-btn:hover {
  color: #fff;
  background: var(--main-color);
}

/* 色分け */
.f-btn-wrapper .f-btn.f-acs {
  color: #fff;
  background: var(--main-color);
}
.f-btn-wrapper .f-btn.f-acs:hover {
  color: var(--main-color);
  background: var(--main-color_lll);
}

.f-policy-link {
  display: block;
  width: fit-content;
  margin: 0 auto 30px;
  padding: 0 1em;
  line-height: 1;
  border-left: 1px solid var(--color);
  border-right: 1px solid var(--color);
}

/** コピーライト **/
.copyright {
  text-align: center;
}
.copyright small {
  display: block;
  width: 100%;
  font-size: 12px;
  line-height: 1;
}

@media screen and (max-width: 520px) {
  footer {
    padding: 50px 0 30px;
  }
  footer .sec-in {
    flex-flow: column;
    gap: 30px;
    margin-bottom: 30px;
  }

  footer .sec-in .footer-main {
    width: 100%;
  }
  footer .sec-in .footer-main .f-logo img {
    width: 180px;
  }

  footer .sec-in .footer-main a[href^="tel:"] {
    font-size: 2rem;
  }

  /*nav*/
  footer nav {
    column-count: 2;
    column-gap: 20px;
    margin-bottom: 0;
  }
  footer nav ul li {
    break-inside: avoid; /*ブロックの途中で改行させない*/
    margin-bottom: 6px;
    font-size: 14px;
  }

  footer .sec-in .footer-main .f-btn-wrapper {
    width: 100%;
    align-items: center;
  }

  .f-bnr-wrapper {
    flex-flow: row wrap;
    gap: 14px;
  }
  .f-bnr-wrapper a {
    width: calc((100% - 20px * 1) / 2);
    margin-bottom: 0;
    order: 2;
  }
  .f-bnr-wrapper a img {
    width: 100%;
  }
  .f-btn-wrapper.mt30 {
    width: 100%;
    gap: 14px;
    margin: -6px auto 10px;
    order: 1;
  }

  .f-policy-link {
    margin-top: 50px;
    font-size: 0.8em;
  }
}

/**
head-name
-------------------------------------------------------------**/
.head-name {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 30px 0 10px;
  font-family: var(--webf);
  color: var(--main-color_ll);
  text-align: center;
  line-height: 1;
}
.head-name::before,
.head-name::after {
  content: "";
  flex: 1;
  width: 100%;
  height: 2px;
  margin-top: 8px;
  background: var(--radial-grd);
}

@media screen and (max-width: 520px) {
  .head-name {
    margin-top: 20px;
  }
}

/**
HERO
-------------------------------------------------------------**/
.hero {
  --height: 850px;
  height: var(--height);
  overflow: hidden;
  position: relative;
}
.hero .swiper-slide {
  height: var(--height);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
}
.hero .swiper-slide img {
  width: 100%;
  height: var(--height);
  object-fit: cover;
}
.hero::after {
  content: "";
  display: block;
  width: 100%;
  height: 30%;
  background: rgb(61, 52, 46);
  background: linear-gradient(0deg, rgba(61, 52, 46, 5) 20%, transparent 100%);
  mix-blend-mode: multiply;
  opacity: 0.5;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  pointer-events: none;
}
.hero .catch {
  --edge: 1px;
  --blur: 6px;
  --edge-color: rgba(30, 30, 30, 0.2);
  color: #fff;
  font-family: var(--webf);
  font-weight: var(--fw-b);
  line-height: 1.2;
  text-shadow:
    var(--edge) var(--edge) var(--blur) var(--edge-color),
    calc(var(--edge) * -1) var(--edge) var(--blur) var(--edge-color),
    var(--edge) calc(var(--edge) * -1) var(--blur) var(--edge-color),
    calc(var(--edge) * -1) calc(var(--edge) * -1) var(--blur) var(--edge-color),
    var(--edge) 0px var(--blur) var(--edge-color),
    0px var(--edge) var(--blur) var(--edge-color),
    calc(var(--edge) * -1) 0px var(--blur) var(--edge-color),
    0px calc(var(--edge) * -1) var(--blur) var(--edge-color);
  position: absolute;
  left: 7%;
  bottom: 5vw;
  z-index: 3;
}
.hero .catch span {
  display: block;
  margin-bottom: 10px;
  font-size: 0.7em;
}
.hero .catch span b {
  font-size: 1.4em;
  color: var(--ylw);
}

/* アニメーション */
@keyframes zoomUp {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}
.hero .swiper-slide-active img,
.hero .swiper-slide-duplicate-active img,
.hero .swiper-slide-prev img {
  animation: zoomUp 10s linear 0s 1 normal both;
}

@media screen and (max-width: 520px) {
  .hero {
    --height: min(48vh, 480px);
  }
}

/**
top-365日のサポート
-------------------------------------------------------------**/
.top-support-head {
  --size: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  width: var(--size);
  aspect-ratio: 1/1;
  padding: 50px 0;
  text-align: center;
  background: var(--main-color_l);
  position: absolute;
  left: 50%;
  top: 120px;
  transform: translateX(-50%);
  outline: 6px double var(--main-color_ll);
  outline-offset: -16px;
}
.top-support-head .tit {
  color: #fff;
}

@media screen and (max-width: 520px) {
  .top-support-head {
    --size: 100%;
    gap: 20px;
    aspect-ratio: auto;
    margin-bottom: 30px;
    padding: 40px 0;
    position: static;
    transform: translateX(0);
  }
}

/* -------------------------------------
card-list
-------------------------------------*/
.card-list {
  --gap: 30px;
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
}
.card-list li {
  width: calc((100% - var(--gap) * 2) / 3);
  height: 500px;
  background: #fff;
  overflow: hidden;
}
.card-list li h3 {
  padding: 20px 20px 0;
  font-family: var(--webf);
  color: var(--main-color);
  text-align: center;
}
.card-list li p {
  padding: 12px 20px 20px;
}

/* 並び順 */
.top-support .card-list li:first-child {
  order: 1;
}
.top-support .card-list li:nth-child(2) {
  order: 3;
}
.top-support .card-list li:nth-child(3) {
  order: 4;
}
.top-support .card-list li:nth-child(4) {
  order: 5;
}
.top-support .card-list li:last-child {
  order: 6;
}
.top-support .card-list::before {
  content: "";
  display: block;
  width: calc((100% - var(--gap) * 2) / 3);
  order: 2;
}

@media screen and (max-width: 520px) {
  /* -------------------------------------
	card-list
	-------------------------------------*/
  .card-list {
    --gap: 20px;
  }
  .card-list li {
    width: 100%;
    height: auto;
  }
  .card-list li p {
    padding: 12px 26px 30px;
  }
  .top-support .card-list::before {
    display: none;
  }
}

/**
top-施設のご紹介
-------------------------------------------------------------**/
.top-facility-wrapper {
  display: flex;
  flex-direction: column;
  gap: 80px;
}

/* -------------------------------------
top-fac-content
-------------------------------------*/
.top-fac-content {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 70px;
}
.top-fac-content figure {
  width: 420px;
  z-index: 1;
}
.top-fac-content .text {
  width: 340px;
  margin-top: 30px;
}
.top-fac-content .text .tit {
  display: flex;
  flex-direction: column;
  gap: 20px;
  line-height: 1.2;
}
.top-fac-content .text .tit i {
  font-size: 1.8em;
  color: var(--main-color_lll);
  opacity: 0.4;
  position: relative;
}
.top-fac-content .text .tit i::after {
  content: "";
  display: block;
  width: 980px;
  height: 2px;
  background: var(--gray);
  position: absolute;
  right: -70px;
  bottom: -2px;
  z-index: -1;
}

/* てれこ */
.top-fac-content:nth-child(even) {
  flex-direction: row;
}
.top-fac-content:nth-child(even) .text .tit i::after {
  right: auto;
  left: -70px;
}

@media screen and (max-width: 520px) {
  .top-facility-wrapper {
    gap: 30px;
  }

  /* -------------------------------------
	top-fac-content
	-------------------------------------*/
  .top-fac-content {
    flex-direction: column;
    justify-content: flex-start;
    gap: 10px;
  }
  .top-fac-content figure {
    width: 100%;
  }
  .top-fac-content .text {
    width: 100%;
    margin-top: -50px;
    z-index: 2;
  }
  .top-fac-content .text .tit {
    gap: 10px;
    margin-bottom: 10px;
  }
  .top-fac-content .text .tit i {
    font-size: 1.8em;
    color: #fff;
    opacity: 0.6;
  }
  .top-fac-content .text .tit i::after {
    display: none;
  }

  /* てれこ */
  .top-fac-content:nth-child(even) {
    flex-direction: column;
  }
}

/*!! test *********************************************/
/*!! test *********************************************/

/**================================================================================
top-施設のご紹介
================================================================================**/
.top-facility-content {
  display: flex;
  justify-content: space-between;
}
.top-facility-content .text {
  width: 40%;
}
.top-facility-content .text h4,
.top-facility-content .text h4 img {
  height: 70px;
}
.top-facility-content .text a[href^="tel:"] i img {
  width: 18px;
}
.top-facility-content .text .btn {
  margin-left: 0;
}

/* 施設スライド */
.fac-slide {
  --fac-slide-width: 53%;
  --fac-slide-height: calc(var(--fac-slide-width) / 1.5);
  width: var(--fac-slide-width);
  padding-top: var(--fac-slide-height); /* 画像の高さ */
  position: relative;
  font-size: 0;
}
.fac-slide > img {
  aspect-ratio: 1.5 / 1;
  width: 100%;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.5s;
}
.fac-slide input {
  display: none;
}
/* サムネイル */
.fac-slide label {
  width: 20%;
  margin: 10px 0 0;
  display: inline-block;
  cursor: pointer;
  transition: all 0.5s ease;
  opacity: 0.6;
}
.fac-slide label:hover {
  opacity: 0.9;
}
.fac-slide label img {
  display: block;
  width: 100%;
}
.fac-slide input:checked + label {
  opacity: 1;
}
.fac-slide input ~ img {
  opacity: 0;
}
.fac-slide input:checked + label + img {
  opacity: 1;
}

@media screen and (max-width: 768px) {
  .top-facility-content .text h4,
  .top-facility-content .text h4 img {
    height: 50px;
  }
}

@media screen and (max-width: 480px) {
  .top-facility-content {
    flex-flow: column;
    justify-content: center;
  }
  .top-facility-content .text {
    width: 100%;
    margin-bottom: 30px;
  }
  .top-facility-content .text h4,
  .top-facility-content .text h4 img {
    text-align: center;
    height: 50px;
  }
  .top-facility-content .text a[href^="tel:"] i img {
    width: 18px;
  }
  .top-facility-content .text .btn {
    margin-left: auto;
  }
  /* 施設スライド */
  .fac-slide {
    --fac-slide-width: 100%;
  }
}

/*!! test *********************************************/
/*!! test *********************************************/

/**
top-ご入居について
top-周辺環境・アクセスについて
-------------------------------------------------------------**/
.about-grid {
  display: flex;
}
.top-moving.about-grid {
  flex-direction: row-reverse;
}
.about-grid .grid-main {
  width: 560px;
  display: flex;
  flex-direction: column;
}
.about-grid .grid-main > * {
  width: 100%;
  height: 280px;
}
.about-grid .grid-main figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.about-grid .grid-main .text {
  display: flex;
  flex-direction: column;
  padding: 40px;
  background: #fff;
}
.about-grid .grid-main .text .tit {
}
.about-grid .grid-fig {
  width: 420px;
  display: flex;
  flex-direction: column;
}
.about-grid .grid-fig img {
  width: 100%;
  height: 280px;
  object-fit: cover;
}

@media screen and (max-width: 520px) {
  .about-grid,
  .top-moving.about-grid {
    flex-direction: column;
  }
  .about-grid .grid-main {
    width: 100%;
  }
  .about-grid .grid-main > * {
    height: 170px;
  }
  .about-grid .grid-main .text {
    padding: 20px;
    height: auto;
  }
  .about-grid .grid-main .text .tit {
  }
  .about-grid .grid-fig {
    flex-direction: row;
    width: 100%;
  }
  .about-grid .grid-fig img {
    width: 50%;
    height: auto;
  }
}

/**
top-お知らせ&ニュース
-------------------------------------------------------------**/
.nb-wrap {
  display: flex;
  gap: 4%;
}
.nb-wrap .nb-content {
  display: flex;
  flex-flow: column;
  padding: 34px;
  background: #fff;
  box-shadow: var(--shadow);
}
.nb-wrap .nb-content .btn {
  margin-top: auto;
}

@media screen and (max-width: 520px) {
  .nb-wrap .nb-content {
    width: 100%;
    padding: 30px;
  }
  .nb-wrap .nb-content + .nb-content {
    margin-top: 30px;
  }
  .nb-wrap .nb-content .btn {
    margin-top: 10px;
  }
}

/* -------------------------------------
news-list
-------------------------------------*/
.news-list li {
  padding: 20px 0;
}
.news-list li + li {
  border-top: 1px dotted var(--gray);
}
.news-list a {
  display: block;
}
.news-list .boxLR {
  justify-content: flex-start;
  margin: 0 0 14px;
}
.news-list figure {
  margin-right: 15px;
  width: 130px;
  float: left;
  overflow: hidden;
}
.news-list a:hover figure {
  opacity: 0.8;
}
.news-list .text {
  min-height: 120px;
}
.news-list em {
  display: inline-block;
  min-width: 130px;
  max-width: 200px;
  margin-right: 15px;
  padding: 4px 8px;
  color: #fff;
  font-size: 0.9em;
  text-align: center;
  line-height: 1.2;
  background: var(--color);
}
.news-list time {
  font-size: 0.9em;
  color: var(--main-color_l);
}
.news-list h3 {
  margin-bottom: 4px;
  font-size: 1.1em;
}
.news-list p {
  font-size: 0.9em;
}

@media screen and (max-width: 520px) {
  .news-list li {
    padding: 15px 0;
  }
  .news-list li em {
    font-size: 13px;
  }
  .news-list figure {
    width: 90px;
  }
  .news-list .text {
    min-height: 84px;
  }
  .news-list h3 {
    font-size: 1rem;
  }
}

/* -------------------------------------
blog-list
-------------------------------------*/
.blog-list {
  margin: 20px auto;
}
.blog-list li {
  border: 1px solid var(--gray);
}
.blog-list li + li {
  margin-top: 20px;
}
.blog-list li a {
  display: block;
}
.blog-list li em {
  display: inline-block;
  min-width: 130px;
  margin-left: 20px;
  padding: 4px 8px;
  color: #fff;
  font-size: 0.9em;
  text-align: center;
  line-height: 1.2;
  background: var(--color);
  transform: translate(0, -14px);
}
.blog-list h3 {
  padding: 0 20px 10px;
  font-size: 1.1em;
}
.blog-list time {
  display: block;
  padding: 0 20px 20px;
  font-size: 0.9em;
  color: var(--main-color_l);
}
.blog-list img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

@media screen and (max-width: 520px) {
  .blog-list li em {
    min-width: 130px;
    margin-left: 10px;
  }
  .blog-list h3 {
    padding: 0 10px 10px;
    font-size: 1rem;
  }
  .blog-list time {
    padding: 0 10px 10px;
  }
}

/**
top-和香 泉大津の想い
-------------------------------------------------------------**/

.top-message {
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: cover;
}
.top-message-content {
  width: 52%;
}

@media screen and (max-width: 520px) {
  .top-message-content {
    width: 100%;
  }
}

/**
top-採用情報
-------------------------------------------------------------**/
.top-recruit-content {
  margin-left: 58%;
}

@media screen and (max-width: 520px) {
  .top-recruit-content {
    margin-left: auto;
    margin-top: 30px;
  }
}

/**================================================================================
採用一覧
================================================================================**/
.rec-list {
  max-width: 980px;
  margin: 30px auto;
}
.rec-list li {
  margin: 0 0 30px;
  background: #fff;
}
.rec-list li a {
  border: 3px solid var(--main-color_l);
  padding: 20px;
  display: flex;
  position: relative;
}

.rec-list li figure {
  width: 395px;
  flex: none;
}
.rec-list li figure img {
  display: block;
}
.rec-list li .text {
  flex: 1;
  padding: 0 0 0 20px;
}
.rec-list li .text .titD {
  margin-bottom: 10px;
  font-size: 22px;
}
.rec-list li .ctgr {
  margin: 0 5px 10px 0;
}

@media screen and (max-width: 520px) {
  .rec-list {
    margin: 20px 5%;
  }
  .rec-list li a {
    flex-flow: column;
    padding: 10px;
  }
  .rec-list li figure {
    width: 100%;
    flex: none;
  }
  .rec-list li .text {
    padding: 10px 0 0;
  }
}
/*widget:bb9c0390-45da-4909-9110-cdc95d75b7c6*/
/*widget:1d6fad24-38ad-4257-9d84-00b70055389c*/
/*widget:e0c55e7b-5fee-4700-9fad-ca12ba6b4e55*/
/*widget:0ad7d7ca-a62d-4b8a-85ed-8477141280d1*/
/*widget:7e308d6f-5a37-4fd1-9ccd-d43487f14883*/
/*widget:c87e85e3-0100-4a55-af5a-a35e252388f7*/
/*widget:f86b085c-6778-4a88-92fa-d9a415d7f754*/
/*widget:56ed2583-cf4b-4ffc-aa6b-1591e8f3ad6a*/
/*widget:defb97fb-5e22-46fc-8b43-02a5cdfabb0f*/
/*widget:55e1174a-6ec6-43e1-a360-cb0798517f77*/
/*widget:f052ca1c-67a7-4f8c-9efb-c8d21a44a96d*/
/*widget:15076cce-730b-4dd1-ada7-66a5129976ec*/
/*widget:178a724d-7998-4efb-9465-d29129c73577*/
/*widget:247ee0dc-1a05-45e0-9b75-fbae6a0238f1*/
/*widget:87b24319-b24f-4361-8dbb-ad95c27401eb*/
/*widget:60fe0fe4-f1f2-4fc2-902f-4e3e435ca191*/
/*widget:c2ea57b1-855f-48b0-b8c5-c0715b043aac*/
/*widget:fdcd9cad-22a9-4a71-b380-3be1a62cdab0*/
/*widget:e126e5bb-8a02-45d1-9df3-162237f4495e*/
/*widget:254d5154-faa1-4a5e-bd4d-f0538ce5ad8f*/
/*instance:59*/[data-instance="59"]{background-image:url(/_img/ja/cms/59/bg_img/_/?1790262364);}/*instance mediea*/@media screen and (max-width: 520px) {[data-instance="59"]{background-image:url(/_img/ja/cms/59/bg_img_sp/_/?1790262364);}}/*widget:cbcb3dbc-fb8f-4c3d-9aab-b189af4d59e3*/
/*widget:b323a7a0-c3fa-4f07-b6d3-93b78f8ed051*/
/*instance:64*/[data-instance="64"]{background-image:url(/_img/ja/cms/64/bg_img/_/?1790262364);}/*instance mediea*/@media screen and (max-width: 520px) {[data-instance="64"]{background-image:url(/_img/ja/cms/64/bg_img_sp/_/?1790262364);}}/*widget:1666b1b7-5783-42f3-924c-13e4c7977628*/
/*widget:ea1d1a1d-0c1c-4136-aff9-066f938ae232*/
/*layout:1*//*layout:2*/