
.-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;
  }

  /** コピーライト **/

  /*sp-fix*/
  /* .sp-fix{
        width: 100vw;
        display: flex;
        position: fixed;
        left: 0;
        bottom: 0;
        box-shadow: 0 -1px 5px rgba(0,0,0,.3);
        z-index: 900;
    }
    .sp-fix a{
        display: block;
        line-height: 46px;
        width: 50%;
        font-size: 15px;
        text-align: center;
        background: var(--main-color);
    }
	.sp-fix a img{
		width: 20px;
		margin-right: 6px;
		vertical-align: middle;
	}
    .sp-fix a:last-child{
        background: #000;
    } */
}

/**================================================================================
お問い合わせ aside
================================================================================**/
/*
.asd-contact{
	background: #eee;
}
.asd-contact .catch{
	margin-right: 30px;
}
.asd-contact .catch i{
	padding-right: 10px;
}
.asd-contact .catch i img{
	vertical-align: middle;
}
.asd-contact .tel-wrap{
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-flow: column;
	flex-flow: column;
}
.asd-contact .tel-wrap a{
	margin-bottom: 4px;
}
.asd-contact .asd-btn-wrap{
	margin-left: auto;
}
.asd-contact .asd-btn-wrap .btn{
	width: 210px;
	margin: 0 6px;
}

@media screen and (max-width: 768px) {
	.asd-contact .inner{
		flex-flow: column;
		text-align: center;
	}
	.asd-contact .catch{
		margin:0 0 10px;
	}
	.asd-contact .tel-wrap{
		flex-flow: column;
		margin-bottom: 20px;
	}
	.asd-contact .tel-wrap a{
		font-size: 24px;
	}
	.asd-contact .asd-btn-wrap{
		flex-flow: column;
	}
	.asd-contact .asd-btn-wrap .btn{
		width: 80%;
		max-width: 300px;
		margin: 6px auto;
	}
} */

/**================================================================================
お問い合わせ aside2
================================================================================**/
/* .asd-contact2{
	background-image: url(../images/top-hero_pc.jpg);
}
.asd-contact2 .content-box{
	padding: 30px;
}
.asd-contact2 p a{
	display: inline-block;
	margin-right: 10px;
}

@media screen and (max-width: 768px) {
	.asd-contact2 >div{
		margin-top: 40px;
		margin-bottom: 40px;
	}
}

@media screen and (max-width: 480px) {
	.asd-contact2 .content-box{
		padding: 20px 10px;
	}
	.asd-contact2 .btn.fs22em{
		font-size: 1.0em;
	}
	.asd-contact2 p a.fs35em{
		display: block;
		margin: 10px auto 4px;
		font-size: 1.5em;
		line-height: 1.0;
	}
} */

/**
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;
  }
}

/**
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:3cfcd636-35a2-4d22-a363-26f13a5c3ed3*/
/*widget:1a59b70a-4db8-446c-a071-992ab57a8faf*/
/*widget:96233a41-7540-41ef-acc5-c3a604d07142*/
/*widget:7e308d6f-5a37-4fd1-9ccd-d43487f14883*/
/*widget:37d17bfd-ad5d-4e7b-a548-7470aa3f2a5c*/
/*widget:aa5a79c4-1cd5-493c-82dc-861814419bf9*/
[data-lib="200"] .cntct-tel{padding: 30px;
	line-height: 1.5;
	border: 8px solid var(--main-color_l);
	background: #fff;}[data-lib="200"] .cntct-tel a[href^="tel"]{display: flex;
	justify-content: center;
	color: var(--main-color);
	line-height: 1;}[data-lib="200"] .ico-svg-tel svg{--size:30px;
	width: var(--size);
	height: var(--size);
	margin-right: 10px;
	fill: var(--main-color);}@media screen and (max-width: 768px){}/*widget:1f3b2aa8-2121-40c2-965d-a5c1efc8c675*/
/*layout:1*//*layout:2*//*layout:3*//*layout:10*/