@charset "UTF-8";
/*数値の設定
------------------------------------------*/
/*上記数値の設定を呼び出しているmixin
------------------------------------------*/
/*
よく使用するmixin
------------------------------------------*/
/* ====================
MV
======================= */
/*文字の縦書き*/
.mv_text h2 { font-size: clamp(24px, 3vw, 32px); letter-spacing: 0.09em; line-height: 1.4; display: flex; justify-content: center; text-align: left; }

.mv_text h2 span { display: inline-block; white-space: pre; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; -webkit-text-orientation: upright; -ms-text-orientation: upright; text-orientation: upright; }

/* ページ用カスタム */
.mv_text h3 { font-size: clamp(15px, 2.2vw, 25px); text-align: center; margin-top: 120px; }

#pageMainvisual .mv_text { padding: 120px 0 60px; }

#pageMainvisual .mv_text .lead { margin-top: 60px; }

/* ------------------------------
PC版 アンカーリンク カスタム
--------------------------------- */
/* 1025px以上の場合適用 */
@media only screen and (min-width: 1025px) { #pageContents #sideMenu { width: 260px; }
  #pageContents #sideMenu .sideMenu_inner { top: 120px; padding: clamp(60px, 8vw, 140px) 0 0 30px; }
  #pageContents #mainContent .sectionWrap { padding-left: 260px; }
  #pageContents #sideMenu .sideMenu_list li a { font-size: 16px; letter-spacing: 0.1em; color: #565152; display: block; position: relative; }
  #pageContents #sideMenu .sideMenu_list li a::before { display: none; }
  #pageContents #sideMenu .sideMenu_list li a::after { content: ""; margin: auto; position: absolute; top: 0; bottom: 0; left: 2px; transform: rotate(45deg); width: 8px; height: 8px; border-top: 1px solid #000; border-right: 1px solid #000; }
  #pageContents #sideMenu .sideMenu_list li a span { padding-left: 24px; display: block; position: relative; }
  #pageContents #sideMenu .sideMenu_list li a span::after { content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 10px; height: 1px; background: #565152; }
  #pageContents #sideMenu .sideMenu_list li a.is-current { border-bottom: 1px solid #565152; } }
/* 1025px以上の場合適用 */
@media only screen and (max-width: 767px) { .anclinkMenu { overflow: scroll; margin-bottom: 40px; }
  .anclinkMenu .anclinkMenu_list { width: 1080px; background: #eeefe7; display: flex; justify-content: space-evenly; align-items: center; }
  .anclinkMenu .anclinkMenu_list li { padding: 12px 0 12px 15px; position: relative; }
  .anclinkMenu .anclinkMenu_list li a { font-size: 13px; color: #565152; display: block; padding-left: 20px; position: relative; }
  .anclinkMenu .anclinkMenu_list li a:hover { opacity: 1; }
  .anclinkMenu .anclinkMenu_list li a:before { content: ""; margin: auto; position: absolute; top: 0; bottom: 0; left: 4px; transform: rotate(45deg); width: 6px; height: 6px; border-top: 1px solid #000; border-right: 1px solid #000; }
  .anclinkMenu .anclinkMenu_list li a:after { content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 10px; height: 1px; background: #565152; }
  .anclinkMenu .anclinkMenu_list li:before { content: ''; position: absolute; top: 50%; left: 0; width: 1px; height: 20px; background: #999; transform: translateY(-50%); }
  .anclinkMenu .anclinkMenu_list li.is-current a { color: #000; border-bottom: 1px solid #000; } }

/* -----------------------------------------------------------------------------
↓↓ ページ内共通スタイル ↓↓
-------------------------------------------------------------------------------- */
.inner { max-width: 1560px; max-width: 100%; }

.secHeadTitleWrap { margin-bottom: 60px; text-align: center; }
.secHeadTitleWrap h3 { font-size: clamp(20px, 3.2vw, 34px); letter-spacing: 0.04em; line-height: 1.7; }
.secHeadTitleWrap h4 { font-size: clamp(15px, 2vw, 22px); letter-spacing: 0.04em; }
@media only screen and (max-width: 767px) { .secHeadTitleWrap { margin-bottom: 40px; } }

.facilityContents .facility_box01.flex { justify-content: space-between; }
.facilityContents .facility_box01 + .facility_box01 { padding-top: 120px; }
.facilityContents .facility_box01:not(.reverse).flex .text { padding-right: 4%; }
.facilityContents .facility_box01.flex .text { width: 44%; }
.facilityContents .facility_box01.flex .photo { width: 56%; }
.facilityContents .facility_box01.reverse { flex-direction: row-reverse; }
.facilityContents .facility_box01.reverse .text { padding-left: 4%; }
.facilityContents .facility_box01 .text { padding-top: 40px; }
.facilityContents .full-width { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.facilityContents .full-width figure { width: 99.7%; }
.facilityContents .full-width img { width: 100%; }
@media only screen and (max-width: 767px) { .facilityContents .facility_box01.flex:not(#worklounge_box) { flex-direction: column-reverse; }
  .facilityContents .facility_box01 + .facility_box01 { padding-top: 40px; }
  .facilityContents .facility_box01:not(.reverse).flex .text { padding-right: 0; }
  .facilityContents .facility_box01.flex .text { width: 100%; }
  .facilityContents .facility_box01.flex .photo { width: 100%; }
  .facilityContents .facility_box01.reverse .text { padding-left: 0; }
  .facilityContents .facility_box01 .text { padding-top: 20px; } }

.HeadttlWrap { border-bottom: 1px solid #7c7c7c; padding-bottom: 7px; }

.HeadttlWrap .Headttl { font-size: clamp(20px, 3.2vw, 30px); letter-spacing: 0.04em; line-height: 1.7; }

.HeadttlWrap .Headttl span.en { font-size: clamp(12px, 1.6vw, 20px); color: #7c7c7c; display: block; }

.HeadttlWrap h4 { font-size: clamp(14px, 2vw, 22px); color: #004c15; letter-spacing: 0.04em; }

.copy { padding-top: clamp(20px, 2.4vw, 30px); }

.copy .text02 { padding-top: 20px; }

.copy .text01 .marker { background: linear-gradient(transparent 0%, #f3eac0 0%); padding: 1px 3px; }

.copy .tag { margin-top: 15px; }

.copy .tag li { font-size: clamp(13px, 1.6vw, 14px); color: #004c15; line-height: 1.8; display: inline-block; background: #fff; border: 1px solid #c7c7c7; border-radius: 4px; margin-top: 5px; padding: 2px 6px; }

.copy .tag li + li { margin-left: 6px; }

.copy .tag li:before { content: '#'; font-family: "Zen Old Mincho", number, serif; font-size: 16px; line-height: 1; display: inline-block; }

.grid-list { display: grid; gap: 40px; /* 1025px以上の場合適用 */ /* 1025px以上の場合適用 */ }
.grid-list.grid-list--cols2 { grid-template-columns: 1fr 1fr; }
.grid-list.grid-list--cols3 { grid-template-columns: 1fr 1fr 1fr; }
.grid-list.grid-list--cols4 { grid-template-columns: 1fr 1fr 1fr 1fr; }
.grid-list .text { padding-top: 40px; }
@media only screen and (min-width: 1025px) { .grid-list .HeadttlWrap .Headttl { font-size: clamp(24px, 3.2vw, 25px); }
  .grid-list .HeadttlWrap h4 { font-size: clamp(18px, 2vw, 20px); } }
@media only screen and (max-width: 767px) { .grid-list.grid-list--cols2, .grid-list.grid-list--cols3, .grid-list.grid-list--cols4 { grid-template-columns: 100%; }
  .grid-list .text { padding-top: 20px; } }

/* -----------------------------------------------------------------------------
↑↑ ページ内共通スタイル ↑↑
-------------------------------------------------------------------------------- */
/* --------------------
everyday
--------------------- */
#everyday { padding-top: clamp(60px, 8vw, 140px); }

/* --------------------
work-study
--------------------- */
#work-study { padding-top: clamp(60px, 8vw, 140px); }
#work-study #worklounge_box { margin-top: 40px; }
@media only screen and (max-width: 767px) { #work-study #worklounge_box { margin-top: 0; }
  #work-study #worklounge_box .photo { margin-top: 20px; } }

/* --------------------
kids-world
--------------------- */
#kids-world { padding-top: clamp(60px, 8vw, 140px); }

/* --------------------
exchange
--------------------- */
#exchange { padding-top: clamp(60px, 8vw, 140px); }

/* --------------------
special
--------------------- */
#special { padding-top: clamp(60px, 8vw, 140px); }

/* --------------------
smart-living
--------------------- */
#smart-living { padding-top: clamp(60px, 8vw, 140px); }

/* --------------------
community
--------------------- */
.community { padding: clamp(60px, 9vw, 140px) 0; text-align: center; background: #fdfdfa; margin-top: clamp(60px, 6vw, 100px); }
.community .inner { max-width: 1560px; }
.community .secHeadTitleWrap { margin-bottom: 0; }
.community .secHeadTitleWrap h3 { color: #004c15; margin-bottom: clamp(40px, 6vw, 80px); }
.community .secHeadTitleWrap h3 span { display: inline-block; border-bottom: 1px solid #004c15; padding-bottom: 12px; }
.community .secHeadTitleWrap h4 { font-size: clamp(15px, 2vw, 20px); }