@charset "utf-8";

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

common

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* ----------------------------------------------------
element base setting (common)
---------------------------------------------------- */
body { color: var(--c-txt); line-height: 1.8;}
body#home {background: var(--c-gray) url("../../img/common/bg-grad-01.svg") left top / 100% auto no-repeat;}
body:not(#home) { background: var(--c-gray) url("../../img/common/bg-grad-03.svg") left top / 100% auto no-repeat;}
a { color: var(--c-txt-purple);  text-decoration: none;}
a:hover { text-decoration: underline;}
.clickable a, .clickable a:hover { color: #333;}

/* ----------------------------------------------------
parts (common)
---------------------------------------------------- */
:root {
--ff-symbol: 'Material Symbols Outlined';
--ff-heading: "sicellemin", sans-serif;
--ff-en:"Roboto", sans-serif;
--c-txt: #333333;
--c-txt-purple:#4B2E5D;
--c-gray: #F2F3F5;
--c-purple:#C2A6D3;
--c-purple-light: #DACDE5;
}

/* icon */
.ic--symbol {position: relative; }
.ic--symbol::before {font-family: var(--ff-symbol); position: absolute; }
.ic--fill::before {font-variation-settings: 'FILL' 1;}
.ic--left::before { left: 0; top: 50%; transform: translateY(-50%);}
.ic--top::before  { left: 50%; top: 0; transform: translateX(-50%);}

/* flex */
.flex {display: flex; display: -webkit-flex; flex-wrap: wrap;}
.jc--sb {justify-content: space-between;}
.jc--c  {justify-content: center;}
.jc--fe {justify-content: flex-end;}

/* img */
img {width: 100%; height: auto;}
.img-obj {overflow: hidden;}
.img-obj img {width: 100%; height: 100%; object-fit: cover;}

/* Scroll Fade Animation */
.js-scroll-fade {opacity: 0;transition: opacity 0.8s ease, transform 0.8s ease; will-change: opacity, transform;}
.js-scroll-fade.is-active {opacity: 1; transform: translate(0, 0) scale(1);}

.fadeUp {transform: translateY(30px);}
.fadeLeft { transform: translateX(-30px);}
.fadeRight {transform: translateX(30px);}
.zoomIn { transform: scale(0.95);}

/* ----------------------------------------------------
calendar (common)
---------------------------------------------------- */
.ft__cal {background: #fff; padding: var(--w-40) 0;}
.ft__cal table {width: 100%;}

/* month prev/next */
div.cal_wrapper .cal_ui input:not(:nth-child(2)) {
 font-size: var(--fs-14);
 padding: 0 var(--w-15);
 background: var(--c-purple); color: #fff; border-radius: 30vw;
}
/* date */
div.cal_wrapper .headline {background:var(--c-purple); color: #fff;}
div.cal_wrapper .headline td {padding: var(--w-10) 0; font-size: var(--fs-14);}

/* day */
div.cal_wrapper tr:not(.headline) {column-gap:3px;}
div.cal_wrapper tr:not(.headline) td {margin-top:3px; font-size: var(--fs-14);}
div.cal_wrapper td > div {background: #fff; }

@media (max-width: 780px) {

}

/* color */

/* 午後休診 */
div.cal_wrapper td > div.Sat,
div.cal_wrapper td > div.Wed,
div.cal_wrapper td > div.Thu{
  background: #CCE7F4;
  color: #427198;
}
.cal-halfOff {color: #CCE7F4;}

/* 日曜・祝日 */
div.cal_wrapper td > div.Sun, div.cal_wrapper td > div.Holyday{
  background: #FAD5CF;
  color: #FA5F86;
}
.cal-off {color: #FAD5CF;}

/* その他 */
div.cal_wrapper td > div.otherDay {
  background: #EDF4C4;
  color: #333333;
}
.cal-other {color: #EDF4C4;}


/* 午後休診（イレギュラー) */
div.cal_wrapper td > div.PMOff {
  background: #CCE7F4;
  color: #427198;
}

/* 休診（イレギュラー） */
div.cal_wrapper td > div.dayOff {
  background: #FAD5CF;
  color: #FA5F86;
}

/* 休診→受診日（イレギュラー） */
div.cal_wrapper td > div.weekday {
  background: transparent;
  color: #333;
}

/* 本日 */
div.cal_wrapper td > div.Today {
  font-weight: bold;
  color: #333;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

header

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (min-width: 821px) {
 #header {}
 .hd-info {width: calc(100% - calc(var(--w-40)*2)); margin-inline:auto; position: relative; padding: var(--w-12) 0 0;}
 #hd-logo {margin-inline:auto; width: clamp(100px, 59.649px + 10.965vw, 200px);}
 .pc-tel {position: absolute; right: 0; top:var(--w-25); font-family: var(--ff-heading); color: var(--c-txt-purple); line-height: 1.4; font-size: var(--fs-15);}
 .pc-tel p {font-size: var(--fs-24); font-weight: 700;}
 
 #grandMenu {padding: var(--w-15) 0; position: sticky; width: 100%; left: 0; top: 0; z-index: 10; } 
 #navGlobal {display:flex; justify-content: center; gap:var(--w-40);}
 #navGlobal > li {position: relative;}
 #navGlobal > li > a {display: flex; flex-direction: column; align-items: center; font-family: var(--ff-heading); font-weight: 700;}
 #navGlobal > li > a span {color: #666; font-family: var(--ff-en); font-size: var(--fs-12); font-weight: 400;}
 .navChild {position: absolute; left: 50%; bottom: 0; transform: translate(-50%, 105%); background:var(--c-purple); z-index: 16; display: none; width: min(20vw , 240px); border-radius: var(--w-12); padding: 10px;}
 .navChild li a {display: block; color: #fff; font-size: var(--fs-16); padding: 8px ; line-height: 1.5;}
 .navChild li:not(:last-child) {border-bottom: 1px dashed #fff;}
 
 #grandMenu.fixed {position: fixed; left: 0; top: 0; width: 100%; background: rgba(242,243,245,0.8);}
  
 #header .sp-btnTel, #header #btnGlobal {display: none;}
}

@media (max-width: 820px) {

 /* tabletでは電話させない */
 @media (min-width: 420px) {
  #header {padding: 5px;}
  #header .pc-tel {display: block!important; position: absolute; top: 50%; transform: translateY(-50%); color: var(--c-txt-purple);right: min(17vw,90px);  line-height: 1.4; font-size: var(--fs-14); font-weight: 600;}
  #header .pc-tel p {font-size: var(--fs-24); font-family: var(--ff-heading);}
  #header .sp-btnTel {display: none!important;}
 }
 
 body {padding-top: min(15vw,70px);}
 #home main{ width: 100%; position: relative; }
 #header {position: fixed; left: 0; top: 0; z-index: 99;  width: 100%;  height: min(15vw,70px); background: var(--c-purple-light); padding: 5px; }
 #header #hd-logo {height: min(12vw,60px);}
 #header #hd-logo img {height: 100%; width: auto;}
 #header #hd-logo a {color: #fff;}
 #header .sp-btnTel {position: absolute;	height: min(15vw,70px); aspect-ratio: 1/1; right: min(15vw,70px);	top: 0;	z-index: 120;	background: var(--c-purple);	display: flex;	display: -webkit-flex;	justify-content: center;	align-items: center; }
 #header .sp-btnTel a {line-height: 1}
 #header .sp-btnTel span {color: #fff; font-size:var(--fs-40); line-height: 1;}
 #header .sp-btnTel span.fill{font-variation-settings: 'FILL' 1;}
 #btnGlobal {position: absolute; height: min(15vw,70px); aspect-ratio: 1/1;right: 0;	top: 0;	z-index: 120;	background: var(--c-txt-purple);	display: flex;	display: -webkit-flex;	justify-content: center;	align-items: center;}
 #btnGlobal .btnWrapGlobal {	position: relative;	width: min(7vw,3.5rem);	height: min(5vw,2.5rem);}
 #btnGlobal .btnLine { height: 3px; background: #fff; position: absolute; right:0; width: 100%;}
 #btnGlobal .btnLine.btnLineT {  top: 0;}
 #btnGlobal .btnLine.btnLineM { top: 50%; transform: translateY(-50%);}
 #btnGlobal .btnLine.btnLineB { bottom: 0; }
 #btnGlobal.active .btnLine {background: #fff;}
 #btnGlobal.active .btnLine.btnLineT { display: none;}
 #btnGlobal.active .btnLine.btnLineM { transform: translateY(0) rotate(45deg) ;}
 #btnGlobal.active .btnLine.btnLineB { transform: rotate(-45deg); bottom:inherit; top: 50%;}
 #btnGlobal .btnLine.btnLineM, #btnGlobal .btnLine.btnLineB {transition: all, ease-in-out, 0.3s;}
 #grandMenu {background: url("../../img/common/bg-grad-02.svg") center center / cover no-repeat; width: 100%; height: 100%; position: fixed; z-index: 100; left: 0; top: 0; display: none; overflow: auto; padding: min(18vw,100px) 8%;}
 #grandMenu a {color: var(--c-txt-purple);}

 #grandMenu #navGlobal li { font-size: var(--fs-18); border-bottom: 1px dotted var(--c-purple); line-height: 1.5;}
 #grandMenu #navGlobal li a {display:  block; padding: var(--w-20) 0; position: relative;}
 #grandMenu #navGlobal > li > a {display: flex; flex-direction: column;}
 #grandMenu #navGlobal > li > a > span {font-family: var(--ff-en); color: #666; font-size: var(--fs-12);}
 #grandMenu #navGlobal li a::after {content:""; position: absolute; right: 3%; top: 50%; width: min(2vw,10px); aspect-ratio:1/1; border-top:1px solid var(--c-txt-purple); border-right: 1px solid var(--c-txt-purple); transform: rotate(45deg) translateX(-50%);}
 #grandMenu #navGlobal li.btn-navChild a::after { transform:  rotate(135deg);}
 #grandMenu #navGlobal li.btn-navChild .navChild {display: none;}
 #grandMenu #navGlobal li.btn-navChild .navChild li {border-bottom: none; font-size:var(--fs-16); padding-left: 1em;}
 #grandMenu #navGlobal li.btn-navChild .navChild a::after {transform:  rotate(45deg) ;}

 #header .pc-tel {display: none;} 
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

footer

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* bnrRecruit */

#bnrRecruit {
 background: #E1DBE4;
 position: relative;
 padding-top: var(--w-100);
}
#bnrRecruit::before {
 content: "";
 width: 100%;
 height: calc(100% - var(--w-100));
 background: var(--c-purple);
 position: absolute;
 left: 0; top: 0;
}
.bnrRecruit__cont {
 width: 90%;
 max-width: 1280px;
 margin: 0 auto;
 position: relative;
 padding: var(--w-70) 0;
 border-radius: var(--w-20);
 background: var(--c-gray) url("../../img/home/bg-bnrRecruit-01.jpg") right top / auto 100% no-repeat;
}
.bnrRecruit__cont::before {
 content: "";
 background: url("../../img/home/img-bnrRecruit-01.png") center center / cover no-repeat;
 aspect-ratio: 328/407;
 width: 25.6%;
 position: absolute;
 right:5%;
 bottom: 0;
}

.bnrRecruit__inr {
 width: 90%;
 max-width: 1000px;

 margin: 0 auto;
 position: relative;
}
.bnrRecruit__inr .homTitle {
 margin-bottom: var(--w-20);
}

.bnrRec__list {
 margin: var(--w-50) 0 0;
}
.bnrRec__list li {
 display: inline-block;
 margin-right: 0.5em;
 min-width: 280px;
}

@media (max-width: 900px) {
.bnrRecruit__cont {padding: var(--w-70) var(--w-50);}
.bnrRecruit__cont::before {width: 40%; right: -3%;}
.bnrRecruit__inr {width: 55%; margin: 0;}
.bnrRec__list li {display: block; margin-top: 5px; min-width: inherit; width: 100%;}
.bnrRec__list li .btn--home {max-width: inherit;}
}

@media (max-width: 440px) {
.bnrRecruit__inr {width: 100%;}
.bnrRec__list {width: 60%;}
}


/* footer */

footer{padding: var(--w-80) 0 0; background: #E1DBE4;}
.inr-footer {width: 90%; max-width: 1000px; margin-inline: auto; font-size: var(--fs-16);
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-template-rows: max-content 1fr;
  grid-column-gap: var(--w-60);
  grid-row-gap: var(--w-20);
 }
 
.ft__info  {grid-area: 1 / 1 / 2 / 2;}
.ft__table {grid-area: 2 / 1 / 3 / 2;}
.ft__cal   {grid-area: 1 / 2 / 3 / 3;}

.ft__info h2 {width: 200px; margin-bottom: var(--w-15);}

.tel__num {color: var(--c-txt-purple); font-family: var(--ff-heading); font-size: var(--fs-12); font-weight: 700; line-height: 1.5;}
.tel__num a {font-size: var(--fs-24);}
.table__wrap {background: #fff; padding: var(--w-20) var(--w-30) var(--w-25) ; font-weight: 700; border-radius: var(--w-10);}

.table {width: 100%;}
.table th, .table td {text-align: center;}
.table--time {font-size: var(--fs-15); margin-bottom: 10px;}
.table--time thead tr {border-bottom: 1px solid #666;}
.table--time thead th {font-weight: normal; padding: 5px;}
.table--time tbody th {font-weight: normal; text-align: left;  padding: 8px 5px 0 5px;}
.table--time tbody td {color: var(--c-purple); padding: 8px 5px 0 5px;}

.table__wrap .note {font-size: var(--fs-12); background: var(--c-gray); letter-spacing:normal; padding: 5px; font-weight: normal;}
.time__tel__wrap {
  margin-top: 15px;
  color: var(--c-txt-purple);
  display: grid;
  grid-template-columns: 1fr max-content;
  grid-column-gap: var(--w-20);
  place-content: center;
}
.time__title {grid-area: 1 / 1 / 2 / 2;}
.time__tel {grid-area: 1 / 2 / 2 / 2;}

.time__title {font-size: var(--fs-12); line-height: 1.4; font-weight: normal;}
.time__title span {display: block; font-weight: 600;}
.ft__cal {padding: var(--w-40) var(--w-50) var(--w-25); border-radius: 10px;}

.ft__map {margin: var(--w-40) auto 0; width: 90%; max-width: 1278px; height: clamp(240px, 191.579px + 13.158vw, 360px); overflow: hidden; border-radius: var(--w-15);}
.ft__map iframe {width: 100%; height: 100%;}

.copy {text-align: center; background: var(--c-txt-purple); color: #fff; font-size: var(--fs-12); margin-top: var(--w-60); padding: var(--w-30);}
.copy a {color: #fff;}

#pagetop {  position: fixed;  bottom: 0;  right: 0;  z-index: 7;}
#pagetop a { display: block;  width: 45px;  height: 45px;color: #fff;  position: relative; z-index: 8;}
#pagetop a::after {content: ""; width: 12px; height: 12px; border-top: 2px solid #fff; border-right: 2px solid #fff; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) rotate(-45deg); z-index: 9;}
#pagetop::before {content: ""; width: 120px; aspect-ratio: 1/1; border-radius: 50%; background: var(--c-purple); position: absolute;right: 0; bottom: 0; translate:50% 50%; transition: 0.3s scale ease-in-out;}

@media (min-width: 769px) {
 #pagetop:hover::before {scale: 1.2;}
}

@media (max-width: 947px)  {
.time__tel__wrap {display: block;}
.time__title span {display: inline;}
}

@media (max-width: 768px) {
 #footer {position: relative;}
.inr-footer {display: block; max-width:600px;}
.ft__info h2 {margin: 0 auto var(--w-30);}
.ft__table {margin: var(--w-20) auto;}
.ft__cal .cal_wrapper {max-width:380px; margin-inline:auto;}
}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

home

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
/* visual */
#homVisual {padding: var(--w-70) 0 0; position: relative; width: calc(100% - calc(var(--w-40)*2)); margin-inline: auto;}
.homVis__copy {max-width: 1280px; margin: 0 auto ; padding-bottom: var(--w-90); }
.homVis__copy h2 {width: 50%; font-weight: 700; color: var(--c-txt-purple); font-family: var(--ff-heading); font-size: var(--fs-32); margin-bottom: var(--w-20);}
.homVis__copy p { margin-bottom: 0;}
.homVis__copy .homVis__txt {width: 50%;}
.homVis__copy::before {content: ""; background: url("../../img/common/bg-flower-05.svg") center center / cover no-repeat; aspect-ratio: 304/208; width: clamp(160px, 101.895px + 15.789vw, 304px); position: absolute; right: 0; top: 0; translate: 0 -50%;}

.homVis__visual { margin-inline:auto; position: relative;}
.homVis__cover {position: absolute; left: 0; bottom: 0; background: var(--c-gray); width: 50%; aspect-ratio: 68/12; border-radius: 0 var(--w-20) 0 0; max-width: 680px;}
.homVis__cover::before,.homVis__cover::after {content: ""; background: url("../../img/common/ic-corner.svg") left bottom / cover no-repeat; aspect-ratio: 1/1; width: var(--w-20); position: absolute;}
.homVis__cover::before {left: 0; top:0; translate: 0 -100%;}
.homVis__cover::after {right: 0; bottom:0; translate: 100% 0;}

.homSlider {aspect-ratio:136/70; border-radius: var(--w-20); overflow: hidden;}

#homVisual .table__wrap {position: absolute; left: 55%; top: 0; z-index: 1; translate: 0 45%;}

@media (max-width: 1110px) {
 #homVisual .table__wrap {right:0;}
}

@media (max-width: 774px) {
 .homVis__copy {padding-bottom: var(--w-30);}
 .homVis__copy h2 {width: 100%; margin-bottom: var(--w-10);}
 .homVis__copy .homVis__txt  {width: 100%; font-size: 11px; letter-spacing: normal;}
 #homVisual .table__wrap {position: relative; left: unset; top: unset; translate: 0 0; margin-top: var(--w-30);}
}


/* point */
.pointWrap {
  width: 90%;
  max-width: 1000px;
  margin: var(--w-20) auto var(--w-100);
}
.pointWrap h2 {
  font-weight: 700;
  color: var(--c-txt-purple);
  font-family: var(--ff-heading);
  font-size: var(--fs-28);
  padding-left: 1.5em;
  position: relative;
}
.pointWrap h2::before {
  content: "";
  background: url("../../img/common/ic-heading.svg") center center / cover no-repeat;
  aspect-ratio: 1/1;
  width: 0.8em;
  position: absolute;
  left: 0;
  top: 0.56em;
 }
 
.point {
 background: #fff;
 margin: var(--w-15) auto;
 padding: var(--w-40) var(--w-50);
 border-radius: var(--w-10)
}
.point h3 {
  color: var(--c-txt-purple);
  font-weight: 700;
  margin: var(--w-40) 0 5px;
}
.point h3:first-of-type {
  margin-top: 0;
}
.point p:last-child { margin-bottom: 0; }

table.schedule {
  width: 100%;
  margin-bottom: 10px;
  font-size: var(--fs-15);
}
table.schedule thead th {
  background-color: var(--c-purple);
  color: #fff;
  text-align: center;
  font-weight: normal;
  padding: 8px;
  line-height: 1.4;
}
table.schedule tbody tr {
 border-top: 2px solid #fff;
}
table.schedule tbody th {
 color: var(--c-txt-purple);
 background-color: var(--c-gray);
 padding: 8px;
}
table.schedule tbody td {
  padding: 8px;
  text-align: center;
  background-color: var(--c-gray);
  color: var(--c-txt-purple);
}

table.schedule th.sat,
table.schedule thead th span.sat { color: #0074D3; }
table.schedule th.red,
table.schedule thead th span.red { color: #D00000; }
table.schedule td.red { color: #BE0000; background: #FFEBEB;}

/*日付統合の調整*/
table.schedule thead th.merge span { display: inline-block; }
table.schedule thead th.merge span.btw { padding: 0 0.5em; vertical-align: middle; }

@media (max-width: 774px) {
 .pointWrap { margin-top: var(--w-60);}
}

@media (max-width:640px) {
  table.schedule {
    margin: var(--space-24) auto;
  }
  table.schedule:not(.schedule_y) {
    display: flex;
    width: auto !important;
    font-size: clamp(13px, 11.789px + 0.329vw, 16px);
  }
  table.schedule:not(.schedule_y) thead {
    display: block;
    width: 35%;
  }
  table.schedule:not(.schedule_y) thead tr {
    display: block;
  }
  table.schedule:not(.schedule_y) thead th {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 3.5em;
    border: 1px solid #fff; 
    border-top: 0;
  }
  table.schedule:not(.schedule_y) thead th br {
    display: none;
  }
  table.schedule:not(.schedule_y) tbody {
    display: flex;
    width: 65%;
  }
  table.schedule:not(.schedule_y) tbody tr {
    display: block;
    width: 50%;
    border: none;
  }
  table.schedule:not(.schedule_y) tbody th,
  table.schedule:not(.schedule_y) tbody td {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border: 1px solid #fff; 
    border-top: 0;
    min-height: 3.5em;
  }
  table.schedule:not(.schedule_y) tbody td br {
    display: none;
  }

  /* スマホでも横　*/
  table.schedule.schedule_y {
    font-size: min(2.4vw, 1.2rem);
  }
  table.schedule.schedule_y thead th,
  table.schedule.schedule_y tbody th,
  table.schedule.schedule_y tbody td {
    padding: 1vw;
  }
}

@media (min-width:641px) {
 table.schedule td br {display: none;}
 table.schedule th br.sp_br {display: none !important;}
}


/* greeting */
#homGreeting {
 margin: var(--w-20) auto 0;
 width: 90%;
 max-width: 1280px;
 position: relative;
 background: var(--c-gray);
 border-radius: var(--w-20) var(--w-20) 0 var(--w-20);
 padding-bottom: var(--w-40);
}

.homTitle {
  font-weight: 700;
  color: var(--c-txt-purple);
  font-family: var(--ff-heading);
  font-size: var(--fs-28);
  padding-left: 1.5em;
  position: relative;
}
.homTitle::before {
  content: "";
  background: url("../../img/common/ic-heading.svg") center center / cover no-repeat;
  aspect-ratio: 1/1;
  width: 0.8em;
  position: absolute;
  left: 0;
  top: 0.56em;
 }

.homGrt--01 {
 display: grid;
 grid-template-columns: 36% 1fr;
 grid-template-rows: max-content 1fr;
 grid-column-gap: var(--w-80);
 grid-row-gap: var(--w-50);
 margin: var(--w-60) auto var(--w-20);
 position: relative;
}
.homGrt--01 .homGrt__catch { grid-area: 1 / 2 / 2 / 3; }
.homGrt--01 .homGrt__txt { grid-area: 2 / 2 / 3 / 3; }
.homGrt--01 .homGrt__img { grid-area: 1 / 1 / 3 / 2; }

.homGrt--01 .homGrt__catch {color: var(--c-txt-purple); font-weight: 600; font-size: var(--fs-28); padding-top: var(--w-30);}
.homGrt--01 .homGrt__img {aspect-ratio: 465/560; overflow: hidden; border-radius: var(--w-20); position: relative;}
.homGrt--01 .homGrt__img img { width: 100%; height: 100%; object-fit: cover;}
.homGrt--01 .homGrt__img__txt {color: #fff; position: absolute; right: var(--w-25); bottom: var(--w-25); text-align: right; font-size: var(--fs-14);}
.homGrt--01 .homGrt__name { margin: 0; font-size: var(--fs-20); font-weight: 600;}
.homGrt--01 .homGrt__name rt {margin-bottom: 5px; font-size: var(--fs-12);}
.homGrt--01 .homGrt__txt p {line-height: 2;}

.homGrt--02 {position: relative; display: flex; justify-content: space-between;}
.homGrt--02 .homGrt__wrap {width: 50%; display: flex; justify-content: center; align-items: center;}
.homGrt--02 .homGrt__txt {max-width: 460px;}
.homGrt--02 .homGrt__img {width: 47%; padding-right: var(--w-30); aspect-ratio: 570/686; display: flex; justify-content: flex-end; align-items: flex-start; position: relative;}
.homGrt__img--01,.homGrt__img--02 {aspect-ratio: 390/435; border-radius: var(--w-20); width: 68%;}
.homGrt__img--02 {position: absolute; left: 0; bottom: 0; width: 64.5%;}

.homGrt__btn {margin: var(--w-60) auto 0;}
.homGrt__btn li {margin: 10px 0;}
.btn--home {display: block; background: var(--c-purple); border-radius: 30vw; max-width: 290px; padding: var(--w-15) var(--w-40); font-size: var(--fs-20); position: relative; font-weight: 600;}
.btn--home::before{content: ""; width: var(--w-10); aspect-ratio: 1/1; border-top:2px solid #fff; border-right: 2px solid #fff; position: absolute; right: var(--w-20); top: 50%; translate: 0 -50%; rotate: 45deg;}

.homGrt--01::before {
 content: "";
 background: url("../../img/home/bg-homGreeting-01.png") center center / cover no-repeat;
 aspect-ratio: 239/219;
 position: absolute;
 right: 0;
 top: 0;
 width: 18%;
 max-width: 239px;
 translate: 0 -20%;
}
.homGrt--01::after {
 content: "";
 background: url("../../img/home/bg-homGreeting-02.png") center center / cover no-repeat;
 aspect-ratio:107/95;
 position: absolute;
 left: 35%;
 bottom: 0;
 width: 8.3%;
 max-width: 107px;
}
.homGrt--02::before {
 content: "";
 background: url("../../img/home/bg-homGreeting-03.png") center center / cover no-repeat;
 aspect-ratio: 147/130;
 position: absolute;
 left: 0;
 top: 50%;
 translate: 0 -150%;
 width: 24%;
 max-width: 120px;
}
.homGrt--02::after {
 content: "";
 background: url("../../img/home/bg-homGreeting-04.png") center center / cover no-repeat;
 aspect-ratio: 110/127;
 position: absolute;
 left: 0;
 top: 50%;
 translate: -100% 0;
 width: 8.6%;
 max-width: 110px;
}
#homGreeting::before {
 content: "";
 background: url("../../img/home/bg-homGreeting-05.png") center center / cover no-repeat;
 aspect-ratio: 206/268;
 position: absolute;
 right: 0;
 bottom: 0;
 width: 16%;
 max-width: 206px;
}

@media (max-width:1110px) {
 .homGrt__catch br {display: none;}
}

@media (max-width:768px) {
 #homGreeting {padding-bottom: var(--w-80);}
 .homGrt--01 { display: block; }
 .homGrt--01 .homGrt__img {aspect-ratio: 3/2;}
 .homGrt--01 .homGrt__img img {object-position: center 25%;}
 .homGrt--01 .homGrt__catch {margin: var(--w-40) auto var(--w-30);}

 .homGrt--02 {display: block;}
 .homGrt--02 .homGrt__wrap {width:100%; display: block;}
 .homGrt--02 .homGrt__txt {max-width: unset;}
 .homGrt--02 .homGrt__img {width: 100%; padding-right: 0; aspect-ratio: unset; justify-content: space-between; margin-top: var(--w-60);}
 .homGrt__img--01,.homGrt__img--02 {aspect-ratio: 390/435; border-radius: var(--w-20); width: 49%;}
 .homGrt__img--02 {position: relative; left: unset; bottom:unset; width:49%;}

 .homGrt--02 .btn--home {margin-inline:auto;}
}


/* homAbout */
#homAbout {
  background: url("../../img/common/bg-grad-02.svg") left top / 100% auto no-repeat;
  position: relative;
 }
#homAbout::before {
 content: "";
 width: 52%;
 aspect-ratio: 752/120;
 background: var(--c-gray);
 position: absolute;
 right: 0;
 top: 0;
 border-radius: 0 0 0 var(--w-20);
}
#homAbout::after{
 content: "";
 background:url("../../img/common/ic-corner.svg") left bottom / cover no-repeat;
 width: var(--w-20);
 aspect-ratio: 1/1;
 position: absolute;
 left: 48%;
 top: 0;
 translate: -100% 0;
 rotate: 180deg;
}
#homAbout .spacer {
 background: #F2F3F5;
 background: linear-gradient(0deg, rgba(242, 243, 245, 1) 0%, rgba(242, 243, 245, 0) 100%);
 width: 100%;
 height: var(--w-150);
}
 
.homAbout__inr {
 margin: 0 auto;
 width: 90%;
 max-width: 1280px;
 padding: var(--w-90) 0 0;
}

.homAbout-block {
 display: flex;
 justify-content: space-between;
 column-gap: var(--w-100);
}
.homAbout-block .homAbout__img {
 flex: auto;
}
.homAbout-block .homAbout__img img {
 border-radius: var(--w-20);
}

.homAbout__cont {
 position: relative;
}
.homAbout-block h3 {
 font-weight: 600;
 color: var(--c-txt-purple);
 font-size: var(--fs-28);
 line-height: 1.6;
 margin-bottom: var(--w-50);
 position: relative;
 z-index: 1;
}
.homAbout__read {
 line-height: 2;
 margin-bottom: 0;
 position: relative;
 z-index: 1;
}
.homAbout__btn {
 margin: var(--w-40) 0 0;
}
.homAbout__num {
 font-family: "Carattere", cursive;
 position: absolute;
 font-size: 140px;
 color: #fff;
 line-height: 0.8;
 right: 0;
 top: 0;
}


.homAbout--01 {
 margin-top: var(--w-120);
 flex-direction: row-reverse;
}
.homAbout--01 .homAbout__cont {
 width: 48%;
 padding: var(--w-40) 0;
}
.homAbout--01 .homAbout__num {
 translate: 0 -40%;
}
	.homAbout--01 .homAbout__list {
 display: flex;
 gap: var(--w-10);
}
.homAbout--01 .homAbout__list a {
	font-size: 90%;
}
@media (max-width:870px) {
 .homAbout-block h3 {margin-bottom: var(--w-30);}
 .homAbout--01 { display: block; margin-top: var(--w-60);}
 .homAbout--01 .homAbout__cont {width: 100%; padding: 0;}
 .homAbout--01 .homAbout__img {aspect-ratio: 5/2; overflow: hidden; margin-top: var(--w-50);}
 .homAbout--01 .homAbout__img img {width: 100%; height: 100%; object-fit: cover;}
	.homAbout--01 .homAbout__list {
		display: block;
	}
	.homAbout--01 .homAbout__list a {
		font-size: 100%;
	}
}

.homAbout--02 {
 margin-top: var(--w-30);
}
.homAbout--02 .homAbout__cont {
 width: 50%;
 padding: var(--w-150) 0 0;
}
.homAbout--02 .homAbout__num {
 translate: 0 80%;
}
.homAbout--02 .homAbout__img {
 aspect-ratio: 527/612;
 position: relative;
 display: flex;
 justify-content: flex-end;
}
.homAbout__img--0201 {
 aspect-ratio: 35/45;
 width: 66.4%;
}
.homAbout__img--0202 {
 aspect-ratio: 342/400;
 width: 65%;
 position: absolute;
 left: 0;
 bottom: 0;
}

@media (max-width:870px) {
  .homAbout-block {
  column-gap: var(--w-60);
  }
  .homAbout--02 .homAbout__cont {
  width: 60%;
  }
  .homAbout__img--0201 {
   width: 90%;
   margin-top: var(--w-40);
  }
}

@media (max-width:734px) {
 .homAbout--02 {display: block;}
 .homAbout--02 .homAbout__cont {width: 100%; padding-top: var(--w-60);}
 .homAbout--02 .homAbout__img {aspect-ratio: unset; justify-content: space-between; margin-top: var(--w-40);}
 .homAbout__img--0201 {width: 49%; margin: 0; aspect-ratio: 342 / 400; overflow: hidden;}
 .homAbout__img--0201 img {width: 100%; height: 100%; object-fit: cover;}
 .homAbout__img--0202 {width: 49%; position: relative; left: unset; bottom: unset;}
 .homAbout--02 .homAbout__num {translate: unset;}
}


.homAbout--03 {
 margin-top: var(--w-120);
 flex-direction: row-reverse;
}
.homAbout--03 .homAbout__cont {
 width: 62%;
}
.homAbout--03 .homAbout__num {
 translate: 0 -30%;
}
.homAbout--03 .homAbout__list {
 display: flex;
 gap: var(--w-10);
}
.homAbout--03 .homAbout__list li {
 min-width: 290px;
}

@media (max-width:990px) {
 .homAbout--03 .homAbout__list {
  display: block;
 }
 .homAbout--01 .homAbout__list li, .homAbout--03 .homAbout__list li {
 margin-bottom: 10px;
 }
}

@media (max-width:734px) {
.homAbout--03 {margin-top: var(--w-80); display: block;}
.homAbout--03 .homAbout__cont { width: 100%;}
.homAbout--03 .homAbout__img {aspect-ratio: 5/2; overflow: hidden; margin-top: var(--w-50);}
.homAbout--03 .homAbout__img img {width: 100%; height: 100%; object-fit: cover;}
.homAbout--03 .homAbout__num {translate: unset;}
.homAbout__list .btn--home {margin-inline: auto;}
}


/* silder */
#homImgSlider {
 margin: 0 auto var(--w-130);
 position: relative;
}
#homImgSlider::before,
#homImgSlider::after {
 content: "";
 position: absolute;
 background-repeat: no-repeat;
 background-position: center center;
 background-size: cover;
}
#homImgSlider::before {
 background-image: url("../../img/home/bg-homSlider-01.png");
 aspect-ratio: 188/164;
 width: 13%;
 max-width: 188px;
 right: 6%;
 top: 0;
 translate: 0 -70%;
}
#homImgSlider::after {
 background-image: url("../../img/home/bg-homSlider-02.png");
 aspect-ratio: 173/181;
 width: 12%;
 max-width: 173px;
 left: 20%;
 bottom: 0;
 translate: 0 40%;
}
.photoSlider{
 margin-bottom: var(--w-10);
 position: relative;
 z-index: 1;
}
.phSlide {
 margin: 0;
}


@media (max-width:960px) {
 #homImgSlider {margin: 0 0 var(--w-60) ;}
}

/* homMenu */
#homMenu { padding-bottom: var(--w-190); position: relative;}
#homMenu::before{
 content: "";
 background: url("../../img/home/bg-homMenu-01.png") center center / cover no-repeat;
 aspect-ratio: 358/273;
 position: absolute; 
 right: 0;
 top: 0;
 width: 25%;
 max-width: 358px;
}
#homMenu::after{
 content: "";
 background: url("../../img/home/bg-homMenu-02.png") center center / cover no-repeat;
 aspect-ratio: 257/310;
 position: absolute; 
 left: 0;
 bottom: 0;
 width: 18%;
 max-width: 257px;
}

#homMenu .homTitle {
 width: 90%;
 max-width: 1280px;
 margin: 0 auto;
}

.homMenu-block {
 position: relative;
}
.homMenu-block::before {
 content: "";
 width: 80%;
 max-width: 1280px;
 position: absolute;
}

.homMenu__cont {
 width: 90%;
 max-width: 1280px;
 margin: 0 auto;
 background: rgba(255,255,255,0.95);
 border-radius: var(--w-20);
 box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);
 padding: var(--w-50) var(--w-80) var(--w-60);
 position: relative;
}
.homMenu__cont h3,
.homMenu__subcont h3 {
 font-size: var(--fs-24);
 color: var(--c-txt-purple);
 font-family: var(--ff-heading);
 text-align: center;
 position: relative;
 font-weight: 700;
 padding-top: var(--w-60);
}
.homMenu__cont h3{
 margin-bottom: var(--w-40);
}
.homMenu__cont h3::before,
.homMenu__subcont h3::before {
 content: "";
 aspect-ratio: 1/1;
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
 width: clamp(50px, 38.702px + 3.07vw, 78px);
 position: absolute;
 left: 50%;
 top: 0;
 translate: -50% 0;
}
.homMenu__cont h3 span,
.homMenu__subcont h3 span{
 position: relative;
}

.homMenu__list {
 display: flex;
 gap: var(--w-15);
 margin: var(--w-50) auto 0;
 flex-wrap: wrap;
}
.homMenu__list li {
 width: calc(calc(100% - calc(var(--w-15) * 4))/ 5 ) ;
 border: 1px solid var(--c-purple-light);
 border-radius: var(--w-10);
 text-align: center;
 padding: var(--w-25) var(--w-15);
 color: var(--c-txt-purple);
 line-height: 1.4;
}
.homMenu__list li span {
 font-size: var(--fs-16);
}
.homMenu__list li a {
 color: var(--c-txt-purple) !important;
}
.homMenu__list li img {
 max-width: 110px;
 width: 65%;
 display: block;
 margin: 0 auto var(--w-10);
}

.homMenu--01 {
 padding-top: var(--w-190);
 position: relative;
 margin: var(--w-40) 0 var(--w-60);
}
.homMenu--01::before {
 height: calc(100% - var(--w-100));
 background: url("../../img/home/img-homMenu-01.jpg") left bottom / cover no-repeat;
 left: 0;
 top: 0;
 border-radius: 0 var(--w-30) var(--w-30) 0;
}
.homMenu--01 .homMenu__cont {
 translate: var(--w-40) 0;
}
.homMenu--01 .homMenu__cont h3::before {
 background-image:url("../../img/home/title-homMenu-01.png");
}

.homMenu--02::before {
 height: 100%;
 background: url("../../img/home/img-homMenu-02.jpg") left bottom / cover no-repeat;
 right: 0;
 top: var(--w-100);
 border-radius: var(--w-30) 0 0 var(--w-30);
}
.homMenu--02 .homMenu__cont {
 translate: calc( var(--w-40) * -1) 0;
 margin-bottom: var(--w-50);
}
.homMenu--02 .homMenu__cont h3::before {
 background-image:url("../../img/home/title-homMenu-02.png");
}

.homMenu__sub {
 display: flex;
 justify-content: center;
 gap: var(--w-50);
 position: relative;
 width: 90%;
 max-width: 1000px;
 margin: 0 auto;
}
.homMenu__subcont {
  width: calc(calc(100% - var(--w-50)) / 2 );
  text-align: center;
  background: rgba(255,255,255,0.95);
  border-radius: var(--w-20);
  box-shadow: 0 0 10px 0 rgba(0,0,0,0.1);
  padding: var(--w-40) var(--w-30);
 }
.homMenu__subcont p {
 margin-bottom: 0;
}
.homMenu__subcont img {
 max-width: 110px;
 width: 65%;
 display: block;
 margin: 5px auto;
}
.homSub--01 h3::before {
 background-image:url("../../img/home/title-homMenu-03.png");
}
.homSub--02 h3::before {
 background-image:url("../../img/home/title-homMenu-04.png");
}

@media (max-width:1047px) {
 .homMenu__list li {width: calc(calc(100% - calc(var(--w-15) * 2 )) / 3) ; }
}
@media (max-width: 535px) {
 .homMenu__list li {width: calc(calc(100% - var(--w-15) ) / 2) ; }
}

@media (max-width:768px) {
 .homMenu__cont {margin-inline: inherit; width: 95%;}
 .homMenu--01 {display: flex; justify-content: flex-end; padding-top: var(--w-120);}
 .homMenu--01 .homMenu__cont {border-radius: var(--w-20) 0 0 var(--w-20); translate: unset;}
 .homMenu--02 {display: flex; flex-wrap: wrap;}
 .homMenu--02 .homMenu__cont {border-radius: 0 var(--w-20) var(--w-20) 0; translate: unset; }
 .homMenu__subcont img {max-width:80px;}
}
@media (max-width: 520px) {
 .homMenu--02 .homMenu__cont {margin-bottom: 0;}
 .homMenu__sub {display: block;}
 .homMenu__subcont {width: 100%; margin-top: var(--w-40);}
}

/* homNews */
#homNews {
 background: url("../../img/home/bg-homNews.svg") center center / cover no-repeat;
 padding: var(--w-80) 0;
 position: relative;
 margin-bottom: var(--w-10);
}
#homNews::before {
 content: "";
 background: url("../../img/home/bg-homNews-02.svg") center center / cover no-repeat;
 aspect-ratio: 1440/297;
 width: 100%;
 position: absolute;
 left: 0;
 bottom: 10%;
 opacity: 0.5;
}
.homNews__inr {
 width: 90%;
 max-width: 1000px;
 margin: 0 auto;
 display: grid;
 grid-template-columns: max-content 1fr;
 grid-template-rows: max-content 1fr;
 grid-column-gap: var(--w-90);
 grid-row-gap: 20px;
 position: relative;
}

.homTitle { grid-area: 1 / 1 / 2 / 2; }
.homNews__inr dl{ grid-area: 1 / 2 / 3 / 3; font-size: var(--fs-16); margin-bottom: 0; }
.homNews__btn { grid-area: 2 / 1 / 3 / 2; }

.homNews__inr dl dt {font-weight: 600; color: var(--c-txt-purple);}
.homNews__inr dl dt:not(:first-child) {margin-top: 2em;}

.btn--more {padding: 6px var(--w-30); max-width: 120px; font-size: var(--fs-16);}

@media (max-width:768px) {
 .homNews__inr { display: block;}
 .homNews__inr dl { margin-top: var(--w-30);}
 .homNews__inr dl dt:not(:first-child) {margin-top: 1em;}
 .btn--more  {margin-top: var(--w-40);}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

local navi

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (min-width: 781px) { /* 781px以上 */
 #navLocal {width: 90%; max-width: 1200px; margin: 0 auto 0;}
 #navLocal ul {display: flex; justify-content: center; flex-wrap: wrap; gap: var(--w-15);}
 #navLocal ul li {font-size:var(--fs-16);}
 #navLocal ul li a {display: block; text-align: center; padding: var(--w-12) var(--w-25); background: var(--c-purple); min-width: min( 15.8vw, 190px); font-weight: 600; border-radius: 30vw; color: #fff;  border: 2px solid var(--c-purple);}
 #navLocal ul li a.current, #navLocal ul.first li a.parentsLink, #navLocal ul li a:hover {background: #fff; color: var(--c-purple); }
}

@media (max-width: 780px) { /*　780px以下 */
 .col-reverse {display: flex; display: -webkit-flex; flex-direction: column-reverse;}
 #navLocal {background: var(--c-purple); width: 100%}
 #navLocal ul {margin: 0;}
 #navLocal ul li a {display: block; color: #fff; font-size: var(--fs-24); padding: var(--w-20) var(--w-30); border-bottom: 1px solid #fff; position: relative;}
 #navLocal ul li a::after {content: ""; width: var(--w-15); aspect-ratio: 1/1; margin-top: -0.5vw; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; right: var(--w-30); top: 50%; transform: rotate(45deg);}
 #navLocal ul li a.current, #navLocal ul.first li a.parentsLink {background:var(--c-txt-purple); font-weight: 600;} 
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

underlayer

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* --------------------------------------------------
visual / topicPath 
----------------------------------------------------- */
.wrap-visual { width: calc(100% - calc(var(--w-40)*2)); margin: var(--w-20) auto var(--w-60); position: relative; z-index: 1;}
.visual {display: flex; justify-content: center; align-items: center; background: url("../../img/page/common/page-visual.jpg") center center / cover no-repeat; height: clamp(180px, 107.368px + 19.737vw, 360px); border-radius: var(--w-20);}
.visual h2 {font-size: var(--fs-36); padding-bottom: 1em;}


/* topicPath */
.wrap-topicPath {width: 60%; max-width: 680px; position: absolute; left: 0; bottom: 0; background: var(--c-gray); display: flex; align-items: center; padding: var(--w-10) 0; height: clamp(50px, 29.825px + 5.482vw, 100px); border-radius: 0 var(--w-20) 0 0;}
.wrap-topicPath::before,.wrap-topicPath::after{content: ""; background: url("../../img/common/ic-corner.svg") left bottom / cover no-repeat; position: absolute; aspect-ratio: 1/1; width: var(--w-20);}
.wrap-topicPath::before {right: 0; bottom: 0; translate: 100% 0;}
.wrap-topicPath::after {left: 0; top:0; translate: 0 -100%;}

ol.topicPath {width:100%;}

@media (max-width: 971px) and (min-width: 781px) { }
@media (max-width: 780px) {
 .wrap-visual {margin-bottom: 0;}
}


/* --------------------------------------------------
container
----------------------------------------------------- */
#main {position: relative;}

.wrap-content {padding-block: var(--w-90); position: relative;}
.wrap-content:not(.bg-grad)::before {
 content: "";
 background: url("../../img/common/bg-flower-01.svg") center center / cover no-repeat;
 aspect-ratio: 239/219;
 width:clamp(180px, 156.193px + 6.469vw, 239px);
 position: absolute;
 right:0;
 top: 5%;
 opacity: 0.6;
}
.wrap-content:not(.bg-grad)::after {
 content: "";
 background: url("../../img/common/bg-flower-02.png") center center / cover no-repeat;
 aspect-ratio: 246/349;
 width: clamp(100px, 41.088px + 16.009vw, 246px);
 position: absolute;
 left: 0;
 bottom: 2%;
 opacity: 0.6;
}

.wrap-content.bg-grad::before{
 content: "";
 background: url("../../img/common/bg-flower-03.svg") center center / cover no-repeat;
 aspect-ratio: 358/273;
 width: clamp(200px, 136.246px + 17.325vw, 358px);
 position: absolute;
 right: 5%;
 top: 25%;
 opacity: 0.5;
}
.wrap-content.bg-grad::after{
 content: "";
 background: url("../../img/common/bg-flower-04.svg") center center / cover no-repeat;
 aspect-ratio: 257/310;
 width: clamp(240px, 211.754px + 7.675vw, 310px);
 position: absolute;
 left: 3%;
 bottom:15%;
 opacity: 0.4;
}


.bg-grad {background: url("../../img/common/bg-grad-02.svg") center top / cover no-repeat; }
.contents {width: 90%; max-width: 1280px; margin-inline: auto; position: relative; z-index: 2;}

@media (max-width: 780px) {
.wrap-content::before {top: 0;}
 .wrap-content::after {width: 30%;}
}


/* --------------------------------------------------
heading / p 
----------------------------------------------------- */
.hA {font-size: var(--fs-40); text-align: center; margin: var(--w-80) 0 var(--w-50); position: relative; padding-top:clamp(40px, 19.825px + 5.482vw, 90px); color: var(--c-txt-purple); }
.hA:first-child {margin-top: 0;}
.hA::before {content: ""; background: url("../../img/page/common/ic-hA-01.svg") center center / cover no-repeat; aspect-ratio: 175/150; width:clamp(40px, 19.825px + 5.482vw, 90px); position: absolute; left: 50%; top: 0; translate: -50% 0;}
.hB {font-size: var(--fs-28); padding: var(--w-20) var(--w-30); background: var(--c-purple-light); margin:var(--w-60) 0 var(--w-40); border-radius: var(--w-10); color: var(--c-txt-purple);}
.hC {font-size:var(--fs-24); color: var(--c-txt-purple); margin: var(--w-50) 0 var(--w-40); padding-left: 1.5em; position: relative;}
.hC::before {content: ""; background: url("../../img/common/ic-heading.svg") center center / cover no-repeat; aspect-ratio: 1/1; width: 0.8em; position: absolute; left: 0; top: 0.4em;}
.hD {font-size: var(--fs-22); color: var(--c-txt-purple); margin: var(--w-50) 0 var(--w-30); padding-left: 1.5em; position: relative;}
.hD::before {content: ""; width: 1em; height: 4px; background: var(--c-txt-purple); position: absolute; left: 0; top: 0.75em;}

.strongA { background: linear-gradient(transparent 60%, #ffff66 60%);}

@media (max-width: 971px) and (min-width: 781px) { }
@media (max-width: 780px) { }


/* --------------------------------------------------
link / list 
----------------------------------------------------- */
.telLink {font-size: var(--fs-26);}
.telLink::before { color:var(--c-txt-purple);}

a.linkArrow {display: inline-block; min-width: min(25.5vw,300px); padding: var(--w-15) var(--w-30); border-radius: 30vw; text-align: center; position: relative;}
a.linkArrow::after {content: "";	position: absolute;	right: var(--w-15);	top: 50%;	width: var(--w-10);	aspect-ratio:1/1;	border-top: 1px solid;	border-right: 1px solid;	transform: translateY(-50%) rotate(45deg);}

a.linkArrow {background: var(--c-txt-purple); color: #fff;}
a.linkArrow::after {border-color: #fff;}
a.linkExternal span::after { color: #fff;}

ul.listDot li::before { background:var(--c-txt-purple);}
ul.listCheck li::before { color: var(--c-txt-purple); font-variation-settings: 'FILL' 1;}

.listData dt {margin-top: 5px;}

@media (max-width: 780px) {
 .telLink a {color: inherit;}
 a.linkArrow {display:block; min-width:inherit; width: 80%; margin: 0 auto;}
}


/* --------------------------------------------------
decBox
----------------------------------------------------- */
.decBox { padding: var(--w-40); margin-bottom: var(--w-30); border-radius: var(--w-10);}

.decBox01 { border: 2px solid var(--c-purple);  background: #fff;}
.decBox02 { background: var(--c-purple); color: #fff;}
.decBox03 {background: #fff;}


@media (max-width: 780px) {}

/* --------------------------------------------------
table
----------------------------------------------------- */
.tblA, .tblTime {border: 1px solid #ccc;}
.tblA th, .tblA td, .tblTime th, .tblTime td {border:1px solid var(--c-purple); padding: var(--w-10);}
.tblA th, .tblTime th {background: var(--c-purple-light); color: var(--c-txt-purple);}
.tblA td, .tblTime td {background: #fff; color: #333;}

@media (max-width: 780px) {
	.tblA th, .tblA td, .tblTime th, .tblTime td {
		padding: var(--w-15);}
	
	
}


/* --------------------------------------------------
grid list (サイズ均等)
---------------------------------------------------- */
.grid02{ display: grid; grid-gap: 1.25em; grid-template-columns: repeat(2, 1fr);}
.grid03{ display: grid; grid-gap: 1.25em; grid-template-columns: repeat(3, 1fr);}
.grid04{ display: grid; grid-gap: 1.25em; grid-template-columns: repeat(4, 1fr);}

@media (max-width: 890px) {
 .grid04{grid-template-columns: repeat(3, 1fr) !important;}
}

@media (max-width: 730px) {
 .grid03, .grid04{ grid-template-columns:repeat(2, 1fr)!important;}
}

@media (max-width: 600px) {
.grid02,  .grid03,  .grid04{ grid-template-columns:repeat(1, 1fr) !important;}
}


/* --------------------------------------------------
gridレイアウト / 画像上テキスト
---------------------------------------------------- */
.grdImgBox {margin: var(--w-40) 0;}
.picOver__txt {background: rgba(0,0,0,0.2); color: #fff; padding: var(--w-15) var(--w-20);}

@media (max-width: 780px) {}


/* --------------------------------------------------
step
---------------------------------------------------- */
.stpBox{background: #fff; border-radius: var(--w-15); padding: var(--w-70) var(--w-60) var(--w-60); position: relative;}
.stpBox .stpNum {margin: 0; position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); border-radius: 50%; background:var(--c-purple); color: #fff; aspect-ratio: 1/1; width: var(--w-90); line-height: 1.3; display: flex; display: -webkit-flex; justify-content: center; align-items: center;}
.stpBox .stpNum span em {font-size: var(--fs-24); display: block; text-align: center;}
.stpBox .stpTitle h3 {font-weight: 600; font-size: var(--fs-20); margin-bottom:var(--w-20); }

@media (max-width: 780px) {}

/* ---------------------------------------------------
access
--------------------------------------------------- */
.acsStep__num {margin: 0 auto; background: var(--c-purple); color: #fff; aspect-ratio: 1/1; width: var(--w-50); display: flex; display: -webkit-flex; justify-content: center; align-items: center; border-radius: 50%;}
.acsStep h3 {text-align: center; font-size: var(--fs-20); margin: 0 auto var(--w-10);}

@media (max-width: 971px) and (min-width: 781px) {}
@media (max-width: 780px) {}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
other
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

@media (min-width:768px) {
 /* hover */
 a:hover,.clickable:hover {
   opacity: .8 !important;
   text-decoration: none;
   transition: all 0.2s ease-in-out;
 }

}
@media (max-width: 971px) and (min-width: 781px) {
}
@media (max-width: 780px) {
}



/*━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

column base

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.colFlex {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; width: 90%; max-width: 1200px;}
#colMain {width: 70%;}
#colSide {width: 25%;}

.navSide{margin-bottom: min(2.5vw,30px); background: #f3f3f3;}
.navSide h2 {background: #333; color:#fff; text-align: center; padding: min(1.25vw,15px);}
.navSide ul {margin: 0;}
.navSide ul li:not(:last-child) {border-bottom: 1px solid #fff; line-height: 1.5;}
.navSide ul li a {display: block; padding: min(1.25vw,15px) min(3.3vw,20px);}
.navSide ul li ul {border-top: 1px solid #fff; }
.navSide ul li ul  li a {padding: min(0.83vw,10px) min(3.3vw,20px) min(0.83vw,10px) min(2.92vw,35px);}
.navSide .navSide__inr {padding: min(3.3vw,20px);}
.navSide .navSide__inr select {width: 100%; padding: min(0.66vw, 8px);}

.postIndex {margin-bottom: min(2.5vw,30px); background: #f3f3f3; padding: min(2vw,24px) min(3.3vw,40px);}
.postIndex h2 {font-size: min(2vw,2.4rem); margin: min(0.83vw,10px) 0;}
.wp-pagenavi {margin-top: min(5vw,60px); text-align: center;}

/* parts */
.postDate {font-size: min(1.16vw,1.4rem); margin: 0;}
.postCat {margin: 0;  display: flex; display: -webkit-flex; column-gap: min(0.83vw,10px); flex-wrap: wrap; font-size: min(1.16vw,1.4rem);}

/* single */
.postHead {margin-bottom: min(2.5vw,30px); padding-bottom: min(2.5vw,30px); border-bottom: 1px dashed #ccc;}
.postHead .postDate {text-align: right;}
.postHead h2 { font-size: min(2vw,2.4rem); margin: 0 0 min(0.83vw,10px);}

.postBody {}
.postBody figure {margin: min(2.5vw,30px) auto;}
.postBody img {width: revert-layer; max-width: 100%;}
.postBody ul {list-style: disc; padding-left: 1.5em;}
.postBody ol {list-style: decimal; padding-left: 1.5em;}

.postRelated {margin-top: min(5vw,60px); padding:min(2.5vw,30px) min(3.3vw,40px) min(3.3vw,40px); background: #f3f3f3;}
.postRelated h3 {font-weight: 600; font-size: min(2vw,2.4rem); text-align: center; margin-bottom: min(1.66vw, 20px);}
.postRelated ul {margin: 0;}
.postRelated ul li a {display: block; border-bottom: 1px dashed #aaa; padding: min(1.25vw, 15px);}

@media (max-width: 767px) {
 #colMain {width: 100%;}
 #colSide {width: 100%;}
.navSide{margin-bottom: 0;}
.navSide h2 {padding: min(3vw,15px);}
.navSide ul li a {padding: min(3vw,15px) min(6vw,30px);}
.navSide ul li ul  li a {padding: min(2vw,10px) min(4vw,20px) min(2vw,10px) min(8vw,35px);}
.navSide .navSide__inr {padding: min(4vw,20px);}
.navSide .navSide__inr select {padding: min(1.6vw, 8px);}

.postIndex__flex{display: flex; display: -webkit-flex; column-gap:2%;}
.postIndex {width: 88%; margin: 0 auto min(3vw,30px); padding: min(4vw,24px) min(5vw,40px);}
.postIndex h2 {font-size: min(4.2vw,2.4rem); margin: min(1vw,10px) 0;}
.wp-pagenavi {margin: min(10vw,60px) 0 min(10vw, 50px); }

/* parts */
.postDate {font-size: min(3.4vw,1.4rem); }
.postCat {column-gap: min(2vw,10px); font-size: min(3.4vw,1.4rem);}

/* single */
.postHead {width: 88%;  margin: 0 auto min(4vw,30px); padding-bottom: min(4vw,30px); }
.postHead h2 { font-size: min(4.2vw,2.4rem); margin: 0 0 min(2vw,10px);}

.postBody {width: 88%; margin: 0 auto min(10vw, 60px);}
.postBody figure {margin: min(6vw,30px) auto;}

.postRelated {margin-top: min(8vw,60px); padding:min(6vw,30px) min(5vw,30px) min(8vw,50px); }
.postRelated h3 {font-size: min(4.2vw,2.4rem); margin-bottom: min(3vw, 20px);}
.postRelated ul li a {padding: min(3vw, 15px);}

}