@charset "utf-8";

.spnone{display: inherit!important;}
.pcnone{display: none!important;}

/*=====================================================================
# Navigation
======================================================================= */

#head {
    display: none;
}


/*=====================================================================
00. ハンバーガーメニュー
======================================================================= */

.menublock{
    display: inherit;
	position: fixed;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 99999;
    /*mix-blend-mode: difference;*/
    }

.menu_n{position: absolute; top: 8px; left: -64px; font-size: 13px; line-height: 1; color: #2d7a61;}
    
.menuarea{ width:100px; height: 100%; position: absolute; top:60px; right:60px; z-index: 99999; text-align: center; display: block; transition: all 0.3s ease;}
.menuarea a{width:100px; height: 11px; padding: 0px 0 17px; display: block;}
/*.menuarea a:hover .menu-line span{opacity: 0.6;}*/
    

/* ハンバーガーメニュー*/
.menu-line,
.menu-line span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}
.menu-line {
  position: relative;
	z-index: 2;
  top:0;
  width: 100px;
  height:11px;
}
.menu-line span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #2d7a61;
transition: all 0.3s ease;

}
.menu-line span:nth-of-type(1) {
  top: 0;
}

.menu-line span:nth-of-type(2) {
  top: 11px;
}

/* アニメーション*/
.menu-trigger.active span:nth-of-type(1) {
  transform:translateY(6px) rotate(10deg);
}

.menu-trigger.active span:nth-of-type(2) {
    transform:translateY(-6px) rotate(-10deg);
}


/*=====================================================================
00. ドロワーメニュー
======================================================================= */
/* 全画面ナビ */
#navigation {
  position: fixed;
  min-width: 1000px;

  background:#e3f2dc;

  inset: 6px 0 60px 0; /* 画面の上端に触れさせない(Safariが上部の色を拾って、閉じるときにパキっと切り替わるのを防ぐ) */
  box-shadow: 0 -6px 0 #e3f2dc; /* 上の6pxの隙間を同じ色で埋める */
  clip-path: inset(0 0 100% 0 round 0 0 120px 120px);
  visibility: hidden; /* 閉じている間は描画しない */
  transition: clip-path .6s ease, visibility 0s linear .6s;
  z-index:999;
  display:flex;
    align-items:center;
    justify-content:center;

	border-bottom-left-radius: 120px;
	border-bottom-right-radius: 120px;

}
.navigation_inner{
    width: 100%;
    min-width: 1000px;
    background-image:url("../images/navi_logo.png");
    background-repeat: repeat-x;
    background-size: 120vw auto;
    background-position: 0 center;
}

#navigation.active {
  clip-path: inset(-6px 0 0 0 round 0 0 120px 120px); /* 影の分(上6px)まで表示 */
  visibility: visible;
  transition: clip-path .6s ease, visibility 0s;
}

/* ドロワーの下の縁のドロップシャドウ(影専用の要素。#navigation の直後に置く。ライター一覧のhoverと同じ影)。高さをドロワーのせり下がりと同じ時間・同じ動きで伸ばして、影が縁についていく */
.nav_shadow{position: fixed; top: 6px; left: 0; right: 0; height: 0; z-index: 998; border-bottom-left-radius: 120px; border-bottom-right-radius: 120px; box-shadow: 0 10px 36px rgba(45,122,97,.22); visibility: hidden; pointer-events: none; transition: height .6s ease, visibility 0s linear .6s;}
#navigation.active + .nav_shadow{height: calc(100% - 66px); visibility: visible; transition: height .6s ease, visibility 0s;}

#navigation ul {
  list-style:none;
  margin:0;
  padding:0 0 0 49%; /*中央からやや右寄り*/
  display:flex;
  flex-direction:column;
  align-items:left;
  justify-content:center;
  height:100%;
}
#navigation ul li {
  overflow:hidden; /* マスクの役目 */
  margin:1.2rem 0;
}
#navigation ul li span {
  display:inline-block;
  transform:translateY(100%); /* 下に隠す */
  opacity:0;
  transition:transform .8s cubic-bezier(0.77, 0, 0.175, 1),
             opacity .6s ease;
}

#navigation ul li:first-child {
  display: block;
}

/* 開くとき順番に出す */
#navigation.active ul li:nth-child(1) span{transition-delay:.03s;}
#navigation.active ul li:nth-child(2) span{transition-delay:.06s;}
#navigation.active ul li:nth-child(3) span{transition-delay:.09s;}
#navigation.active ul li:nth-child(4) span{transition-delay:.12s;}
#navigation.active ul li span {
  transform:translateY(0);
  opacity:1;
}

/* 閉じるとき逆順で下に戻す */
#navigation.closing ul li span {
  transform:translateY(100%);
  opacity:1;
}
#navigation.closing ul li:nth-child(4) span{transition-delay:.03s;}
#navigation.closing ul li:nth-child(3) span{transition-delay:.06s;}
#navigation.closing ul li:nth-child(2) span{transition-delay:.09s;}
#navigation.closing ul li:nth-child(1) span{transition-delay:.12s;}


#navigation ul li a{
    text-decoration: none; 
    font-size: 29px;
	color: #2d7a61;
    position: relative; 
    letter-spacing: .01em; 
	
  display: inline-block;
  white-space: nowrap;
}

#navigation ul li a::after{
  position: absolute;
  bottom: 0px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #2d7a61;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .2s;
}
#navigation ul li a:hover::after{
  transform-origin: left top;
  transform: scale(1, 1);
}


#navigation .nv_logo{width: 184px; position: absolute; top: 44px; left: 60px;}
#navigation .nv_logo img{width:100%;}

#navigation .snslink{font-size: 12px; color: #2d7a61; position: absolute; bottom: 120px; left: 110px;}
#navigation .snslink .en02{margin-bottom:20px; line-height: 1;}
#navigation .snslink a{font-size: 22px; color: #2d7a61; margin-right: 40px;}
#navigation .snslink a:last-child{margin-right:0;}

#navigation .contact{font-size: 14px; letter-spacing: .02em; margin-bottom: 30px; position: absolute; bottom: 128px; right: 110px;}
#navigation .contact a{text-decoration: none; color: #2d7a61;}
#navigation .copyright{color: #2d7a61; font-size: 12px; letter-spacing: .02em; position: absolute; bottom: 120px; right: 110px;}


/*=====================================================================
wrap
======================================================================= */

.wrap{position: relative; min-width: 1100px; }


/*=====================================================================
header
======================================================================= */


header {
    width: 100%;
    min-width: 1100px;
	padding: 50px 60px 55px 60px;
    box-sizing: border-box;
    line-height:1;
    z-index: 3;
    position: relative;
}

.head_logo{width: 184px;}
.head_logo img{width:100%;}



/*=====================================================================
トップページ
======================================================================= */

/* メインビジュアル(4秒ごとに左へ。いまの画像は中央。動きは js/top.js) */
.kv{--kv-max-h: 720px; overflow: hidden;}  /* --kv-max-h = 画像の高さの上限(PC)。大きさを変えたいときは、この数字 */
.kv__viewport{overflow: hidden; touch-action: pan-y; -webkit-user-select: none; user-select: none;}
.kv__viewport.is-dragging,
.kv__viewport.is-dragging a{cursor: grabbing;}
.kv__slide a{cursor: pointer;}
.kv__track{display: flex; margin: 0; padding: 0; list-style: none; will-change: transform; transition: transform .9s cubic-bezier(.22, 1, .36, 1);}
.kv__track.is-instant{transition: none;}
/* JSで中央に置くまでは隠しておく */
.kv__track{opacity: 0;}
.kv.is-ready .kv__track{opacity: 1; transition: transform .9s cubic-bezier(.22, 1, .36, 1), opacity .6s ease;}
.kv.is-ready .kv__track.is-instant{transition: opacity .4s ease;}
.kv__slide{flex: 0 0 min(58%, calc(var(--kv-max-h) * 1404 / 1344)); width: min(58%, calc(var(--kv-max-h) * 1404 / 1344)); aspect-ratio: 1404 / 1344; margin: 0;}
.kv__slide a{display: block; height: 100%;}
.kv__slide img{display: block; width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; user-select: none; pointer-events: none;}

/* =====================================================================
   メインビジュアル(.kv)のスライド中身
   ===================================================================== */
.kv__slide{container-type: inline-size; position: relative; box-sizing: border-box; border: 1px solid #395149; border-right: 0;}
.kv__slide--column{background: var(--kv-bg, #dfe9e3);}
.kv__slide a.kv__link,
.kv__slide a.kv__link:link,
.kv__slide a.kv__link:visited,
.kv__slide .kv__link{position: relative; display: block; height: 100%; color: #28372f; text-decoration: none;}
.kv__slide .kv-ico{width: auto; height: auto; max-width: none; object-fit: contain;}  /* 共通の .kv__slide img(幅100%)を打ち消す */

/* hover:矢印の丸以外が薄くなる(サイトの a.mo_fade と同じ動き。濃さは opacity の数字) */
.kv__slide a.kv__link > *{transition: opacity .3s ease;}
@media (hover: hover) {
  .kv__slide a.kv__link:hover > *:not(.kv-arrow){opacity: .75; transition: opacity .2s ease;}
}

/* --- コラム --- */
.kv-col__bar{position: absolute; top: 0; left: 0; z-index: 2; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; width: 10.11%; height: 90.55%; padding-top: 4.06cqw; background: #235caf; border-right: 1px solid #395149; border-bottom: 1px solid #395149;}
.kv__slide .kv-col__icon{width: 5.13cqw;}
.kv-col__title{margin-top: 1.1cqw; max-height: 72cqw; overflow: hidden; font-size: 2.9cqw; line-height: 1.2; font-weight: 500; letter-spacing: 0; white-space: nowrap; color: #fff; writing-mode: vertical-rl; text-orientation: sideways;}  /* 文章全体を、右に90度倒した向きにする(かな・漢字・数字・英字ぜんぶ、横に寝る) */
.kv-col__title .is-sp{display: none;}
.kv-col__photo{position: absolute; top: 16.59%; left: 18.95%; box-sizing: border-box; width: 62.68%; aspect-ratio: 1; min-height: 0; padding: 4.49cqw; border-radius: 50%; background: #fff;}
.kv__slide .kv-col__photo img{position: absolute; top: 4.49cqw; left: 4.49cqw; display: block; width: calc(100% - 8.98cqw); height: calc(100% - 8.98cqw); border-radius: 50%; object-fit: cover;}

.kv-col__new{position: absolute; top: 26.79%; left: 64.67%; z-index: 2; box-sizing: border-box; display: flex; align-items: center; justify-content: center; gap: .5cqw; width: 25.43%; height: 8.03%; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 .15cqw #111; font-size: 4.6cqw; line-height: 1; color: #395149;}
.kv__slide .kv-col__new .kv-ico{width: 3.56cqw;}

.kv-col__side{position: absolute; top: 50.9%; left: 93.45%; transform: translate(-50%, -50%); font-size: 1.61cqw; line-height: 1; font-weight: 700; letter-spacing: .08em; white-space: nowrap; color: #395149; writing-mode: vertical-rl;}

.kv-col__who{position: absolute; top: 89.7%; left: 16.45%; display: block;}
.kv-col__name{display: block; font-size: 2.56cqw; line-height: 1.2; font-weight: 500; letter-spacing: .06em;}
.kv-col__pos{display: block; margin-top: .7cqw; font-size: 1.71cqw; line-height: 1.4; letter-spacing: .06em;}
.kv-col__date{position: absolute; top: 90.3%; right: 5.75%; display: flex; align-items: center; height: 5.73%; padding-left: 2.9cqw; border-left: 1px solid #28372f; font-size: 1.61cqw; line-height: 1; font-weight: 500; letter-spacing: .05em; white-space: nowrap;}

/* --- バナー(タイトルを入れたときだけ、紫の帯 + 矢印) --- */
.kv-bn__bar{position: absolute; bottom: 0; left: 0; z-index: 2; box-sizing: border-box; display: flex; align-items: center; gap: 2.1cqw; width: 86.6%; height: 10.2%; padding: 0 2cqw 0 3.9cqw; background: #9260cc; border-top: 1px solid #395149; border-right: 1px solid #395149;}
.kv__slide .kv-bn__icon{width: 4.63cqw; flex-shrink: 0;}
.kv-bn__title{min-width: 0; overflow: hidden; font-size: 2.7cqw; line-height: 1.3; font-weight: 500; letter-spacing: .02em; white-space: nowrap; text-overflow: ellipsis; color: #fff;}

/* --- 矢印の丸(コラム・バナー共通。位置も同じ) --- */
.kv-arrow{position: absolute; top: 71.8%; left: 81.2%; z-index: 2; width: 9.97%; aspect-ratio: 1; border-radius: 50%; background: #fff; overflow: hidden;}
.kv-arrow::after{content: ""; position: absolute; inset: 0; border-radius: 50%; box-shadow: inset 0 0 0 .15cqw #111; pointer-events: none;}  /* 丸の線は、矢印の線と同じく、スライドの大きさに合わせて細くなる */
.kv-arrow svg{position: absolute; top: 50%; left: 0; width: 100%; height: auto; transform: translate(0, -50%); fill: none; stroke: #111; stroke-width: 2;}
/* hover:矢印だけが右へ抜けて、左から戻ってくる(Company Profile・コンタクトボタンと同じ @keyframes arrow_through) */
@media (hover: hover) {
  a.kv__link:hover .kv-arrow svg{animation: arrow_through .5s both;}
}
@media (prefers-reduced-motion: reduce) {
  a.kv__link:hover .kv-arrow svg{animation: none;}
}

/* メッセージ */
.top-message{position: relative; margin: 150px 60px 40px;}
.top-message__inner{position: relative; box-sizing: border-box; padding: 190px 140px 90px 170px; border-radius: 120px; background: #e3f2dc;}

.top-message__heading{position: absolute; top: -80px; right: 140px; z-index: 1; text-align: right; white-space: nowrap; -webkit-user-select: none; user-select: none;}
.top-message__heading .blc01{margin: 0;}
.top-message__heading .blc02{margin: -18px 0 0;}
.top-message__heading .split-text{color: #3c8e70; font-size: 190px; line-height: 1; letter-spacing: .014em; visibility: hidden;}
.top-message__heading .split-text[data-split="done"]{visibility: visible;}

.top-message .top-message__lead{margin: 0; font-size: 38px; line-height: 2; font-weight: 500; letter-spacing: .06em; color: #31594c;}
.top-message__body{margin: 62px 0 0 115px; font-size: 22px; line-height: 2.3; font-weight: 500; letter-spacing: .08em; color: #31594c;}
.top-message__body p{margin: 0 0 48px;}
.top-message__body p:last-child{margin-bottom: 0;}

.top-message__side{position: absolute; top: 50%; right: 32px; transform: translateY(-50%); margin: 0; font-size: 12px; line-height: 1; font-weight:700; letter-spacing: .04em; color: #528c72; writing-mode: vertical-rl;}

.top-message__link{display: flex; justify-content: flex-end; margin: 50px -66px 0 0;}
a.round-link,
a.round-link:link,
a.round-link:visited{display: inline-flex; align-items: center; gap: 32px; color: #2d7a61; text-decoration: none;}
.round-link__text{font-size: 16px; line-height: 1; letter-spacing: .03em;}
.round-link__arrow{position: relative; flex-shrink: 0; display: block; width: 70px; aspect-ratio: 1; border-radius: 50%; background: #409b7d; overflow: hidden; transition: background-color .3s ease;}
.round-link__arrow img{position: absolute; top: 50%; left: 0; width: 42px; height: auto; transform: translate(0, -50%);}
/* hover:丸の色が変わり、矢印が右へ抜けて、左から戻ってくる(コンタクトボタンと同じ。@keyframes arrow_through) */
@media (hover: hover) {
  a.round-link:hover .round-link__arrow{background: #49b28c;}
  a.round-link:hover .round-link__arrow img{animation: arrow_through .5s both;}
}


/* Product */
.top-product{--tp-ink: #3b4d46; --product-green: #409b7d; padding-bottom: 20px;}  /* --product-green は、商品詳細ボタン(.product-btn)の色 */

/* 固定の大きいカード */
.tp-main{display: grid; grid-template-columns: 1fr 1fr; box-sizing: border-box; width: min(1135px, calc(100% - 120px)); margin: 0 auto; border: 1px solid var(--tp-ink); border-radius: 28px; overflow: hidden; background: #fff; color: var(--tp-ink);}
.tp-main__img{position: relative; border-right: 1px solid var(--tp-ink); background: #f7f7f7;}
.tp-main__img img{position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; object-fit: cover;}
.tp-main__body{display: flex; flex-direction: column; box-sizing: border-box; padding: 60px 56px 60px 54px;}
.tp-main__title{display: flex; align-items: center; margin: 0; font-size: 26px; line-height: 1.4; font-weight: 700; letter-spacing: .03em; color: #409b7d;}
.tp-main__line{display: block; flex: 1; height: 1px; margin-left: 46px; background: #2d7a61;}
.tp-main__catch{margin: 40px 0 0; font-size: 18px; line-height: 2; font-weight: 700; letter-spacing: .06em; color: #2c604f;}
.tp-main__desc{margin: 20px 0 10px; font-size: 15px; line-height: 2.4; font-weight: 500; letter-spacing: .04em;}
a.product-btn.tp-main__btn{margin-top: auto; height: 56px;}
a.product-btn.tp-main__btn .product-btn__text{font-size: 16px;}



/* 流れる7商品 */
.marquee--product{margin-top: 80px; padding-bottom: 30px;}
.marquee--product ul.marquee__list{align-items: stretch; gap: 48px; padding-right: 48px;}

.tp-card{display: flex; flex-direction: column; flex: 0 0 364px; box-sizing: border-box; width: 364px; margin: 0; border: 1px solid var(--tp-ink); border-radius: 28px; overflow: hidden; background: #fff; color: var(--tp-ink);}
.tp-card__img{position: relative; aspect-ratio: 364 / 353; background: #fafafa; border-bottom: 1px solid var(--tp-ink);}
.tp-card__img img{position: absolute; top: 36px; left: 36px; width: calc(100% - 72px); height: calc(100% - 72px); object-fit: contain; transform: scale(var(--img-scale, 1));}
.tp-card__body{display: flex; flex-direction: column; flex: 1; padding: 40px 34px 34px;}
.tp-card__title{margin: 0; min-height: 60px; font-size: 18px; line-height: 1.5; font-weight: 600; letter-spacing: .03em;}
.tp-card__buy{min-height: 58px; margin: 20px 0 30px;}
.tp-card__sub{margin: 0; font-size: 13px; line-height: 1.6; font-weight: 500; letter-spacing: .04em;}
.tp-card__price{margin: 6px 0 0; font-size: 18px; line-height: 1.4; font-weight: 500; letter-spacing: .02em;}
.tp-card__price span{margin-left: 8px; font-size: 11px; font-weight: 600; letter-spacing: .06em;}
a.product-btn.tp-card__btn,
a.product-btn.tp-card__btn:link,
a.product-btn.tp-card__btn:visited{margin-top: auto; height: 56px;}
a.product-btn.tp-card__btn .product-btn__text{font-size: 16px;}


/* Column:ランキング / Recommend / Tags */
.top-column{--tp-ink: #3b4d46; padding-bottom: 120px;}
.tc-grid{display: grid; grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr); column-gap: 64px; margin: 0 60px; padding-top: 20px;}
.tc-divider{display: block; width: 1px; margin-top: 72px; background: #2d7a61;}

.tc-head{display: flex; align-items: baseline; gap: 20px; margin: 0 0 38px;}
.tc-head__en{margin: 0; font-size: 24px; line-height: 1; font-weight: 600; letter-spacing: .02em; color: #2d7a61;}
.tc-head__ja{font-size: 14px; line-height: 1; font-weight: 500; letter-spacing: .1em; color: #2d7a61;}
.tc-head__note{margin-left: auto; font-size: 14px; line-height: 1; font-weight: 500; letter-spacing: .04em; color: #2d7a61;}

/* ランキングのカード */
ol.rank-list{display: flex; flex-direction: column; gap: 46px; margin: 0; padding: 0; list-style: none;}
.rank-card{position: relative; box-sizing: border-box; padding: 34px 34px 30px 33px; border: 1px solid var(--tp-ink); border-radius: 30px; background: #f7f7f7; color: inherit; transition: background-color .2s ease;}
.rank-card:hover{background: #dcf9ee;}
.rank-card__no{position: absolute; top: 20px; left: 18px; z-index: 2; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: #559e81; color: #fff; font-size: 15px; line-height: 1;}
.rank-card__top{display: flex; gap: 32px;}
.rank-card__thumb{flex-shrink: 0; display: block; box-sizing: border-box; width: 120px; height: 120px; overflow: hidden; border: 1px solid var(--tp-ink); background: #fff;}
.rank-card__thumb img{display: block; width: 100%; height: 100%; object-fit: cover;}
.rank-card__main{display: flex; flex-direction: column; justify-content: space-between; min-width: 0;}
.rank-card__title{margin: 0; font-size: 20px; line-height: 1.7; font-weight: 700; letter-spacing: .04em;}
a.rank-card__link,
a.rank-card__link:link,
a.rank-card__link:visited{color: inherit; text-decoration: none;}
a.rank-card__link::after{content: ""; position: absolute; inset: 0; z-index: 1; border-radius: 30px;}
.rank-card__writer{margin: 0; font-size: 12px; line-height: 1.3;}
.rank-card__writer span{display: block; font-weight: 500;}
.rank-card__writer b{display: block; margin-top: 3px; font-size: 15px; font-weight: 600; letter-spacing: .06em;}
.rank-card__bottom{display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 26px;}
.rank-card .tag-pills{position: relative; z-index: 2;}
.rank-card__date{flex-shrink: 0; font-size: 12px; line-height: 1; font-weight: 500; letter-spacing: .02em;}

/* タグ(ピル) */
ul.tag-pills{display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 0; list-style: none;}
a.tag-pill,
a.tag-pill:link,
a.tag-pill:visited{display: flex; align-items: center; box-sizing: border-box; height: 28px; padding: 0 17px 2px 17px; border: 1px solid #3f7a5f; border-radius: 999px; background: #fff; color: #2d7a61; font-size: 13px; line-height: 1; font-weight: 500; letter-spacing: .1em; text-decoration: none; transition: background-color .3s ease, color .3s ease;}
a.tag-pill:hover{background: #2d7a61; color: #fff;}
ul.tag-pills--sm{gap: 12px;}
.tag-pills--sm a.tag-pill,
.tag-pills--sm a.tag-pill:link,
.tag-pills--sm a.tag-pill:visited{height: 27px; padding: 0 12px; font-size: 12px;}

/* Recommend(コラム一覧のカードと同じ見た目) */
.rec{display: block;}
a.rec__link,
a.rec__link:link,
a.rec__link:visited{display: block; color: inherit; text-decoration: none;}
.rec__img{display: block; aspect-ratio: 547 / 388; overflow: hidden; border: 1px solid var(--tp-ink); background: #f7f7f7;}
.rec__img img{display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1); transition: .3s ease-out;}
a.rec__link:hover .rec__img img{transform: scale(1.06); opacity: .75; transition: .15s ease-out;}
.rec__title{display: block; margin-top: 28px; font-size: 20px; line-height: 1.6; font-weight: 700; letter-spacing: .04em;}
.rec__meta{display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 28px; padding: 8px 22px 8px 8px; border-radius: 999px; background: #f2f2f2;}
a.rec__writer,
a.rec__writer:link,
a.rec__writer:visited{display: flex; align-items: center; gap: 12px; min-width: 0; color: inherit; text-decoration: none;}
a.rec__writer:hover{opacity: .6;}
.rec__writer-img{flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; overflow: hidden;}
.rec__writer-img img{display: block; width: 100%; height: 100%; object-fit: cover;}
.rec__writer-name{font-size: 14px; font-weight: 600; letter-spacing: .04em;}
.rec__date{flex-shrink: 0; font-size: 12px; letter-spacing: .02em;}

.tc-tags{margin-top: 60px; padding-top: 40px; border-top: 1px solid #d6d8c9;}


/* Recent Post(新着6件。背景はライターの色) */
.top-recent__head{display: flex; align-items: baseline; gap: 20px; margin: 0 60px; padding: 42px 0 42px; border-top: 1px solid #2d7a61;}
.recent-list{margin: 0; padding: 0; list-style: none; border-top: 1px solid #2d7a61; overflow-x: clip;}
.top-recent + .section-writer .section-head{padding-top: 110px;}

/* ライター一覧(.writer-card)と同じ hover。--mx / --my は js/top.js が入れる */
.recent-item{position: relative; background: var(--writer-color, #f7f7f7); border-bottom: 1px solid #2d7a61; transition: scale .36s cubic-bezier(.22, 1, .36, 1), translate .6s cubic-bezier(.22, 1, .36, 1), box-shadow .5s ease, border-color .3s ease;}
.recent-item.is-moving{transition: scale .36s cubic-bezier(.22, 1, .36, 1), translate .22s ease-out, box-shadow .3s ease, border-color .3s ease;}
@media (hover: hover) {
  .recent-item:hover{z-index: 2; scale: 1.03; translate: calc(var(--mx, 0) * 10px) calc(var(--my, 0) * 6px); box-shadow: 0 10px 36px rgba(45,122,97,.22); border-bottom-color: transparent;}
}
@media (prefers-reduced-motion: reduce) {
  .recent-item{transition: none;}
}

a.recent-item__link,
a.recent-item__link:link,
a.recent-item__link:visited{display: flex; align-items: center; box-sizing: border-box; min-height: 227px; padding: 0 50px 0 60px; color:inherit; text-decoration: none;}
.recent-item__label{flex-shrink: 0; margin-right: 34px; font-size: 11px; line-height: 1; letter-spacing: .06em; font-weight: 600; white-space: nowrap; writing-mode: vertical-rl; rotate: 180deg;}
.recent-item__img{flex-shrink: 0; display: block; width: 154px; height: 154px; box-sizing: border-box; border: 1px solid #2d7a61; border-radius: 50%; overflow: hidden; background: #fff;}
.recent-item__img img{display: block; width: 100%; height: 100%; object-fit: cover;}
.recent-item__body{display: block; flex: 1; min-width: 0; margin-left: 44px;}
.recent-item__date{display: block; margin-bottom: 10px; font-size: 12px; line-height: 1; letter-spacing: .02em;}
.recent-item__title{display: block; font-size: 24px; line-height: 1.5; font-weight: 500; letter-spacing: .04em;}
.recent-item__writer{display: block; flex-shrink: 0; box-sizing: border-box; width: 250px; margin-left: 40px; padding: 4px 0 4px 30px; border-left: 1px solid #2d7a61;}
.recent-item__writer-name{display: block; font-size: 18px; line-height: 1.4; font-weight: 600; letter-spacing: .08em;}
.recent-item__writer-en{display: block; margin-top: 6px; font-size: 12px; line-height: 1.4; letter-spacing: .04em;}
.recent-item__writer-position{display: block; margin-top: 16px; font-size: 13px; line-height: 1.8; font-weight: 500; letter-spacing: .06em;}


/* 右下に固定のオンラインショップボタン(ライターのスライドで消える) */
.online-btn-wrap{position: fixed; right: 40px; bottom: 40px; z-index: 90; width: 320px; visibility: visible; transform: translateY(0); transition: transform .9s cubic-bezier(.16, 1, .3, 1), visibility 0s linear 0s;}
.online-btn-wrap.is-hidden{visibility: hidden; pointer-events: none; transform: translateY(calc(100% + 40px)); transition: transform .5s cubic-bezier(.87, 0, .13, 1), visibility 0s linear .5s;}
a.online-btn,
a.online-btn:link,
a.online-btn:visited{position: relative; display: block; isolation: isolate; aspect-ratio: 1035 / 305; text-decoration: none;}
.online-btn__bg{position: absolute; top: 2px; right: 2px; bottom: 2px; left: 2px; border-radius: 999px; background: #fff; transition: background-color .4s ease;}
.online-btn__img{position: relative; display: block; width: 100%; height: auto; mix-blend-mode: multiply;}
.online-btn__arrow{position: absolute; top: 20.6%; left: 79.2%; width: 16.3%; aspect-ratio: 1; border-radius: 50%; background: #2d7a61; overflow: hidden; transition: background-color .3s ease;}
.online-btn__arrow img{position: absolute; top: 50%; left: 0; width: 58.6%; height: auto; transform: translate(0, -50%);}
@media (hover: hover) {
  a.online-btn:hover .online-btn__bg{background: #efefef;}
  a.online-btn:hover .online-btn__arrow{background: #409b7d;}
  a.online-btn:hover .online-btn__arrow img{animation: arrow_through .5s both;}
}
@media (prefers-reduced-motion: reduce) {
  .online-btn-wrap,
  .online-btn-wrap.is-hidden{transition: none;}
  a.online-btn:hover .online-btn__arrow img{animation: none;}
}


/* マーキー(Column / Writer / Product):手のひらは、ドラッグしている間だけ(リンクの上は、指のマーク) */
.marquee__row{cursor: auto;}



/*=====================================================================
詳細ページ
======================================================================= */

/* ページタイトル */

.page_ttl_area{
	width: 100%;
	border-top: 1px solid #2d7a61;
	border-bottom: 1px solid #2d7a61;
	box-sizing: border-box;
	padding: 30px 60px 28px 60px;
}

.page_ttl_area h1{
	display: inline-block;
	font-size: 60px;
	line-height: 1;
}
.page_ttl_area span{
	font-size: 15px;
	line-height: 1;
	font-weight: 500;
	margin-left: 20px;
}

/* インナー */
.page_inner{
	width: 100%;
	padding: 0 60px;
	box-sizing: border-box;
	position: relative;
}

.page_inner.border_b{border-bottom: 1px solid #2d7a61;}
.page_inner.margin_b{margin-bottom: 80px;}


/* サイドにライン */
.line_inner{
	width: 100%;
	box-sizing: border-box;
	padding: 80px;
	border-left: 1px solid #2d7a61;
	border-right: 1px solid #2d7a61;
}



/* テキストボタン */
.link-btns {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 38px;
	
	position: absolute;
	top: 46px;
	right: 60px;
}

a.link-btn {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  padding: 0;
  margin: 0;
  width: auto;
  min-width: 0;
  background: none;
  border: none;
  text-decoration: none;
  line-height: 1;
}

a.link-btn .link-btn__text {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1;
  color: #3f7a5f;
  padding: 0;
  margin: 0;
  text-decoration: none;
}

a.link-btn .link-btn__icon {
  display: block;
  width: 27px;
  height: auto;
  margin: 0;
  flex-shrink: 0;
}




/*=====================================================================
コラム・ライター 共通
======================================================================= */

/* ページタイトルの右上にリンクを置く基準 */
.page_ttl_area{position: relative;}
.page_ttl_area p.en03{display: inline-block; font-size: 60px; line-height: 1; margin: 0;}

/* コラムカード */
.column-list{margin: 0; padding: 0; list-style: none;}
a.column-list__link,
a.column-list__link:link,
a.column-list__link:visited{display: block; color: inherit; text-decoration: none;}

.column-list__thumb{aspect-ratio: 11 / 8; overflow: hidden; background: #f7f7f7;}
.column-list__thumb img{display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1); transition: .3s ease-out;}
a.column-list__link:hover .column-list__thumb img{transform: scale(1.06); opacity: .75; transition: .15s ease-out;}

.column-list__head{display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-top: 24px;}
.column-list__title{margin: 0; font-size: 18px; line-height: 1.6; font-weight: 700; letter-spacing: .04em;}
.column-list__excerpt{margin: 15px 0 0; font-size: 14px; line-height: 2.1; letter-spacing: .04em; font-weight: 500;}
.column-list__date{font-size: 12px; letter-spacing: .02em;}
p.column-list__date{margin: 12px 0 0; text-align: right;}

/* ページ送り */
.pagination{display: flex; justify-content: center; gap: 16px; margin-top: 70px;}
.pagination .page-numbers{display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: #d7f4e9; font-size: 13px; line-height: 1; text-decoration: none;}
.pagination a.page-numbers,
.pagination a.page-numbers:link,
.pagination a.page-numbers:visited{color: #2d7a61; text-decoration: none; transition: opacity .1s ease;}
.pagination a.page-numbers:hover{opacity: .6;}
.pagination .page-numbers.current{background: #2d7a61; color: #fff;}
.pagination .page-numbers.dots{background: none;}


/*=====================================================================
ライター一覧
======================================================================= */
.writer-cards{display: grid; grid-template-columns: repeat(2, 1fr); margin: 0; padding: 0; background: #f7f7f7;}

.writer-card{position: relative; background: var(--writer-color, #f7f7f7); border-bottom: 1px solid #2d7a61; transition: scale .36s cubic-bezier(.22, 1, .36, 1), translate .6s cubic-bezier(.22, 1, .36, 1), box-shadow .5s ease, border-color .3s ease;}
/* マウスが乗っている間は、追従を速くする */
.writer-card.is-moving{transition: scale .36s cubic-bezier(.22, 1, .36, 1), translate .12s ease-out, box-shadow .5s ease, border-color .3s ease;}
.writer-card:nth-child(odd){border-right: 1px solid #2d7a61;}
@media only screen and (min-width: 769px) {
  :has(> .writer-card:last-child:nth-child(odd)){
    background-image: linear-gradient(#2d7a61, #2d7a61);
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: 50% 1px;
  }
}

a.writer-card__link,
a.writer-card__link:link,
a.writer-card__link:visited{position: relative; display: flex; align-items: center; box-sizing: border-box; min-height: 244px; padding: 30px 40px 30px 30px; color: inherit; text-decoration: none;}

.writer-card__label{writing-mode: vertical-rl; rotate: 180deg; margin: 0 44px 0 0; font-size: 12px; line-height: 1; letter-spacing: .08em; white-space: nowrap;}
.writer-card__img{flex-shrink: 0; width: 174px; height: 174px; box-sizing: border-box; border: 1px solid #2d7a61; border-radius: 50%; overflow: hidden;}
.writer-card__img img{display: block; width: 100%; height: 100%; object-fit: cover;}

.writer-card__body{margin: 0 0 0 36px; padding: 0 0 0 36px; border-left: 1px solid #2d7a61;}
.writer-card__name{margin: 0; font-size: 24px; line-height: 1.4; font-weight: 500; letter-spacing: .06em;}
.writer-card__name-en{margin: 8px 0 0; font-size: 12px; line-height: 1.4; letter-spacing: .06em;}
.writer-card__position{margin: 20px 0 0; font-size: 13px; line-height: 1.8; letter-spacing: .06em; font-weight: 500;}

.writer-card__count{position: absolute; right: 30px; bottom: 22px; margin: 0; font-size: 12px; line-height: 1;}
.writer-card__count-num{margin-right: 6px; font-size: 18px;}


/* hover:カードが拡大して、マウスの位置に応じてカード全体が動く(--mx / --my はJSが入れる) */
@media (hover: hover) {
  .writer-card:hover{z-index: 2; scale: 1.05; translate: calc(var(--mx, 0) * 16px) calc(var(--my, 0) * 10px); box-shadow: 0 10px 36px rgba(45,122,97,.22); border-bottom-color: transparent; border-right-color: transparent;}
}
@media (prefers-reduced-motion: reduce) {
  .writer-card,
  .writer-card__img,
  .writer-card__body,
  .writer-card__count{transition: none;}
}


/*=====================================================================
ライター詳細
======================================================================= */

/* プロフィール(左: ライターの色 / 右: 名前の白 + 薄い緑) */
.writer-profile{display: flex; border-bottom: 1px solid #2d7a61;}
/* コラム詳細:記事枠のすぐ下のプロフィールには、上の線を付ける */
.column-detail__frame ~ .writer-profile{border-top: 1px solid #2d7a61;}

.writer-profile__visual{position: relative; display: flex; align-items: center; justify-content: center; flex: 0 0 50%; box-sizing: border-box; min-height: 640px; background: var(--writer-color, #f7f7f7);}
.writer-profile__name-en{position: absolute; top: 50px; left: 60px; margin: 0; font-size: 14px; line-height: 1; letter-spacing: .06em;}
.writer-profile__photo{width: 390px; height: 390px; border-radius: 50%; overflow: hidden;}
.writer-profile__photo img{display: block; width: 100%; height: 100%; object-fit: cover;}
/* コラム詳細:写真はライター詳細へのリンク。hoverはライター一覧と同じ(拡大+マウス追従) */
a.writer-profile__photo{position: relative; display: block; transition: scale .36s cubic-bezier(.22, 1, .36, 1), translate .6s cubic-bezier(.22, 1, .36, 1), box-shadow .5s ease;}
a.writer-profile__photo.is-moving{transition: scale .36s cubic-bezier(.22, 1, .36, 1), translate .12s ease-out, box-shadow .5s ease;}
@media (hover: hover) {
  a.writer-profile__photo:hover{z-index: 2; scale: 1.05; translate: calc(var(--mx, 0) * 16px) calc(var(--my, 0) * 10px); box-shadow: 0 10px 36px rgba(45,122,97,.22);}
}
@media (prefers-reduced-motion: reduce) {
  a.writer-profile__photo{transition: none;}
}
.writer-profile__label{position: absolute; top: 50%; right: 30px; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; writing-mode: vertical-rl; height: 330px; margin: 0; padding-left: 16px; font-weight: 600; border-left: 1px solid #2d7a61; font-size: 12px; line-height: 1; letter-spacing: .08em; white-space: nowrap;}

.writer-profile__body{display: flex; flex-direction: column; flex: 1; box-sizing: border-box; border-left: 1px solid #2d7a61;}
.writer-profile__head{padding: 34px 60px 38px; border-bottom: 1px solid #2d7a61; background: #fff;}
.writer-profile__name{margin: 0; font-size: 26px; line-height: 1.4; font-weight: 500; letter-spacing: .06em;}
.writer-profile__position{margin: 10px 0 0; font-size: 13px; font-weight: 500; line-height: 1.6; letter-spacing: .06em;}

.writer-profile__info{flex: 1; padding: 44px 60px 50px; background: #f5f5f5;}
.writer-profile__text{font-size: 14px; font-weight: 500; line-height: 2.1; letter-spacing: .04em;}
.writer-profile__text p{margin: 0;}

ul.writer-profile__sns{display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 14px 28px; margin: 30px 0 0; padding: 0;}
.writer-provider.is-first{margin-top: 40px; padding-top: 38px; border-top: 1px solid #2d7a61;}
/* 本文もSNSもなく、提供者だけのときは線を出さない */
.writer-provider.is-first:first-child{margin-top: 0; padding-top: 0; border-top: none;}
ul.writer-profile__sns li a,
ul.writer-provider__links li a{position: relative; display: inline-block; color: #2d7a61; font-size: 13px; font-weight: 500; letter-spacing: .03em; text-decoration: none;}

/* 矢印(画像) */
ul.writer-profile__sns li a::after,
ul.writer-provider__links li a::after{content: ""; display: inline-block; width: 8px; height: 8px; margin-left: 10px; vertical-align: 0px; background: url("../images/arrow05.png") center / contain no-repeat;}

/* hover:下線がアニメーション */
ul.writer-profile__sns li a::before,
ul.writer-provider__links li a::before{content: ""; position: absolute; bottom: -4px; left: 0; width: 100%; height: 1px; background: #2d7a61; transform: scale(0, 1); transform-origin: right top; transition: transform .2s;}
ul.writer-profile__sns li a:hover::before,
ul.writer-provider__links li a:hover::before{transform-origin: left top; transform: scale(1, 1);}

.writer-provider{display: flex; align-items: flex-start; gap: 30px; margin-top: 38px;}
.writer-provider__img{flex-shrink: 0; width: 105px;}
.writer-provider__img img{display: block; width: 100%; height: auto;}
.writer-provider__name{margin: 0; font-size: 13px; line-height: 1.6; font-weight: 700; letter-spacing: .04em;}
.writer-provider__text{margin: 6px 0 0; font-size: 13px; line-height: 1.9; letter-spacing: .04em; font-weight: 500;}
ul.writer-provider__links{display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 14px 28px; margin: 14px 0 0; padding: 0;}
.writer-provider__body{flex: 1; min-width: 0;}

/* キービジュアルとシリーズ(左右に線の枠) */
.writer-detail__frame,
.column-detail__frame{box-sizing: border-box; margin: 0 60px; border-left: 1px solid #2d7a61; border-right: 1px solid #2d7a61;}

/* ライター詳細:キービジュアルの上、キービジュアルの下、シリーズ説明の下に、画面の端から端までの横線 */
.writer-detail__frame{--frame-gap: 60px; position: relative; margin-top: 60px;}
.writer-detail__frame::before,
.writer-detail__frame .writer-series::before,
.writer-detail__frame .writer-series::after{content: ""; position: absolute; left: calc(-1 * var(--frame-gap) - 1px); right: calc(-1 * var(--frame-gap) - 1px); height: 1px; background: #2d7a61; pointer-events: none;}
.writer-detail__frame::before{top: 0;}
.writer-detail__frame .writer-series{border-top: none; border-bottom: none;}
.writer-detail__frame .writer-series::before{top: 0;}
.writer-detail__frame .writer-series::after{bottom: 0;}

.writer-kv img{display: block; width: 100%; height: auto;}

.writer-series{position: relative; box-sizing: border-box; padding: 44px 70px 50px; border-top: 1px solid #2d7a61; border-bottom: 1px solid #2d7a61; background: var(--writer-color, #f7f7f7); background: color-mix(in srgb, var(--writer-color, #f7f7f7) 25%, #fff);}
.writer-series__body{padding-left: 20px;}
.writer-series__label{position: absolute; top: 50px; left: 40px; margin: 0; writing-mode: vertical-rl; rotate: 180deg; font-size: 12px; line-height: 1; font-weight: 600; letter-spacing: .04em; white-space: nowrap;}
.writer-series__title{margin: 0 0 18px; font-size: 22px; line-height: 1.5; font-weight: 500; letter-spacing: .06em;}
.writer-series__text{font-size: 14px; line-height: 2.1; letter-spacing: .04em; font-weight: 500;}
.writer-series__text p{margin: 0;}

/* このライターのコラム(3列) */
.writer-columns{padding: 70px 60px 60px;}
.writer-columns .column-list{display: grid; grid-template-columns: repeat(3, 1fr); gap: 60px;}
.writer-columns__empty{margin: 0; text-align: center; font-size: 14px;}


/*=====================================================================
コラム一覧
======================================================================= */
.column-archive__head{position: relative; box-sizing: border-box; padding: 70px 60px 40px; text-align: center; border-radius: 120px 120px 0 0; background: linear-gradient(180deg, #e3f2dc 0%, #fff 100%);}
.column-archive__head .link-btns{top: 60px;}
.column-archive__title{display: flex; flex-direction: column; align-items: center; margin: 0;}
.column-archive__en{font-size: 176px; line-height: 1; letter-spacing: .02em; color: #2d7a61; visibility: hidden;}
.column-archive__en.split-text[data-split="done"]{visibility: visible;}
.column-archive__ja{margin-top: 5px; font-size: 18px; line-height: 1; letter-spacing: .2em;}
.column-archive__lead{margin: 40px 0 0; font-size: 16px; font-weight: 500; line-height: 2.3; letter-spacing: .06em;}

.column-archive__body{padding: 40px 165px 90px;}
.column-archive__body .pagination{margin-top: 20px;}
.column-archive__empty{margin: 0; text-align: center; font-size: 14px;}
.column-list--archive{display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 100px;}
.column-list--archive .column-list__item{display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 0; padding-bottom: 70px;}
.column-list--archive .column-list__title{margin:28px 0 0; font-size: 20px; line-height: 1.6;}

.column-list__meta{display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 28px; padding: 8px 22px 8px 8px; border-radius: 999px; background: #f2f2f2;}
a.column-list__writer,
a.column-list__writer:link,
a.column-list__writer:visited{display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none;}
a.column-list__writer:hover{opacity: .6;}
.column-list__writer-img{flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; overflow: hidden;}
.column-list__writer-img img{display: block; width: 100%; height: 100%; object-fit: cover;}
.column-list__writer-name{font-size: 14px; font-weight: 600; letter-spacing: .04em;}

ul.column-list__tags{display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0 0; padding: 0;}
ul.column-list__tags li a,
ul.column-list__tags li a:link,
ul.column-list__tags li a:visited{display: block; padding: 6px 14px 7px 14px; border: 1px solid #2d7a61; border-radius: 999px; color: #2d7a61; font-size: 12px; line-height: 1; font-weight: 500; text-decoration: none; transition: all .3s ease;}
ul.column-list__tags li a:hover{background: #2d7a61; color: #fff;}

.column-tags{box-sizing: border-box; padding: 38px 60px 52px 60px; border-top: 1px solid #2d7a61; border-bottom: 1px solid #2d7a61; background: #f7f7f7; text-align: center;}
.column-tags__title{margin: 0 0 20px; font-size: 16px; line-height: 1; letter-spacing: .02em;}
.column-tags__title span{font-size: 13px; margin-left: 8px;}
ul.column-tags__list{display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin: 0; padding: 0;}
a.column-tags__item,
a.column-tags__item:link,
a.column-tags__item:visited{display: block; padding: 6px 14px 7px 14px; border: 1px solid #2d7a61; border-radius: 999px; background: #fff; color: #2d7a61; font-size: 13px; font-weight: 500; line-height: 1; text-decoration: none; transition: all .3s ease;}
a.column-tags__item:hover,
a.column-tags__item.is-current,
a.column-tags__item.is-current:link,
a.column-tags__item.is-current:visited{background: #2d7a61; color: #fff;}


/*=====================================================================
コラム詳細
======================================================================= */
.column-article{padding: 120px 220px 120px;}
.column-article__head{display: flex; align-items: center; justify-content: space-between; gap: 30px; padding-bottom: 32px; border-bottom: 1px solid #2d7a61;}
.column-article__title{margin: 0; font-size: 28px; line-height: 1.5; font-weight: 500; letter-spacing: .06em;}
.column-article__date{display: flex; align-items: center; flex-shrink: 0; height: 38px; margin: 0; padding-left: 20px; border-left: 1px solid #2d7a61; font-size: 11px; line-height: 1; letter-spacing: .06em;}

/* 記事本文の見出し(ブロックエディタ) */
.column-article__body h2{font-size: 22px; line-height: 1.6; font-weight: 600;}
.column-article__body h3{font-size: 20px; line-height: 1.6; margin-bottom: 20px;}
.column-article__body h4{font-size: 18px; line-height: 1.6;}

/* 記事のタグ:線の下30px、右寄せ(本文との間は、本文の margin-top 60px のまま) */
ul.column-list__tags.column-article__tags{justify-content: flex-end; margin: 34px 0 0;}

.column-article__body{margin-top: 30px; font-size: 15px; line-height: 2.4; letter-spacing: .04em; font-weight: 500;}
.column-article__body p{margin: 0 0 2em;}
.column-article__body img{display: block; width: 100%; height: auto; margin: 48px 0;}

/* 4コマ漫画のライター:PCだけ画像を70%に(SPはそのまま) */
@media (min-width: 769px){
  .column-article__body.is-img-small img{max-width: 72%; height: auto; margin: 0 auto;}
}

/* 本文中の動画(YouTube / Vimeo):横幅100%、16:9 */
.column-article__body iframe{display: block; max-width: 100%; margin: 40px 0; border: 0;}
.column-article__body iframe[src*="youtube.com"],
.column-article__body iframe[src*="youtube-nocookie.com"],
.column-article__body iframe[src*="youtu.be"],
.column-article__body iframe[src*="vimeo.com"]{width: 100%; height: auto; aspect-ratio: 16 / 9;}
.column-article__body figure{margin: 0;}


/* ブロックエディタ　カラムブロック(PC:横並び) */
.column-article__body .wp-block-columns{display: flex; flex-wrap: nowrap; align-items: normal; gap: 32px; margin: 0 0 2em;}
.column-article__body .wp-block-column{flex: 1 1 0; min-width: 0; overflow-wrap: break-word;}
.column-article__body .wp-block-column > :last-child{margin-bottom: 0;}
.column-article__body .wp-block-columns.are-vertically-aligned-center,
.column-article__body .wp-block-column.is-vertically-aligned-center{align-items: center; align-self: center;}
.column-article__body .wp-block-column.is-vertically-aligned-top{align-self: flex-start;}
.column-article__body .wp-block-column.is-vertically-aligned-bottom{align-self: flex-end;}

/* ブロックエディタの文字色(WP標準パレット) */
.column-article__body .has-black-color{color: #000;}
.column-article__body .has-white-color{color: #fff;}
.column-article__body .has-cyan-bluish-gray-color{color: #abb8c3;}
.column-article__body .has-pale-pink-color{color: #f78da7;}
.column-article__body .has-vivid-red-color{color: #cf2e2e;}
.column-article__body .has-luminous-vivid-orange-color{color: #ff6900;}
.column-article__body .has-luminous-vivid-amber-color{color: #fcb900;}
.column-article__body .has-light-green-cyan-color{color: #7bdcb5;}
.column-article__body .has-vivid-green-cyan-color{color: #00d084;}
.column-article__body .has-pale-cyan-blue-color{color: #8ed1fc;}
.column-article__body .has-vivid-cyan-blue-color{color: #0693e3;}
.column-article__body .has-vivid-purple-color{color: #9b51e0;}

/* ブロックエディタ　文字サイズ(本文13pxを基準に) */
.column-article__body .has-small-font-size{font-size: 13px;}
.column-article__body .has-medium-font-size{font-size: 15px;}
.column-article__body .has-large-font-size{font-size: 20px;}
.column-article__body .has-x-large-font-size{font-size: 26px;}

/* ブロックエディタ　文字揃え */
.column-article__body .has-text-align-center{text-align: center;}
.column-article__body .has-text-align-right{text-align: right;}


/* 前の記事 / この作家の記事 / 次の記事 */
.column-nav{display: flex; align-items: center; justify-content: center; gap: 70px; padding: 28px 20px; border-bottom: 1px solid #2d7a61;}
.column-nav a,
.column-nav a:link,
.column-nav a:visited{display: flex; align-items: center; color: #2d7a61; font-size: 14px; line-height: 1; letter-spacing: .08em; text-decoration: none; transition: opacity .3s ease;}
.column-nav a:hover{opacity: .6;}
.column-nav__prev::before,
.column-nav__next::after{content: ""; flex-shrink: 0; width: 27px; height: 27px; background: url("../images/arrow01.png") center / contain no-repeat;}
.column-nav__prev::before{margin-right: 16px; transform: scaleX(-1);}
.column-nav__next::after{margin-left: 16px;}

/* 関連コラム */
.related-column{padding: 70px 60px 70px; border-bottom: 1px solid #2d7a61;}
.related-column__title{display: flex; align-items: baseline; gap: 30px; margin: 0 0 40px; font-weight: 400;}
.related-column__en{font-size: 28px; line-height: 1; color: #2d7a61;}
.related-column__ja{font-size: 14px; line-height: 1;}
.related-column .column-list{display: grid; grid-template-columns: repeat(3, 1fr); gap: 60px;}



/*=====================================================================
共通セクション(Column / Writer のマーキー)
======================================================================= */

/* 見出し行:左にタイトル、中央に線、右にリンク */
.section-head{display: grid; grid-template-columns: 1fr minmax(0, 54%) 1fr; align-items: center; box-sizing: border-box; padding: 55px 60px;}
.section-head__title{margin: 0; font-size: 34px; line-height: 1; font-weight: 600; letter-spacing: .02em; color: #2d7a61;}
.section-head__line{display: block; height: 1px; background: #2d7a61;}
.section-head .link-btns{position: static; justify-self: end;}

.section-column .section-head{border-bottom: 1px solid #2d7a61;}
/* コラムが最後のとき(下がコンタクトに続くとき)だけ、ライターの下余白と同じだけあける */
.section-column:not(:has(+ .section-writer)){margin-bottom: 70px;}
.section-writer .section-head{padding-bottom: 0;}
/* ライター詳細:コラムセクションの上に線 */
body.tax-writer .section-column{border-top: 1px solid #2d7a61;}

/* マーキー(段ごとに横に流れる。動きはJS) */
.marquee{display: flex; flex-direction: column; overflow: hidden;}
.marquee--column{gap: 30px; padding: 50px 0; border-bottom: 1px solid #2d7a61; background: #f7f7f7;}
.marquee--writer{gap: 20px; padding: 60px 0 70px;}

.marquee__row{overflow: hidden; padding: 3px 0; margin: -3px 0; touch-action: pan-y; cursor: grab; -webkit-user-select: none; user-select: none;}
.marquee__row.is-dragging{cursor: grabbing;}
.marquee__track{display: flex; width: max-content; will-change: transform;}
ul.marquee__list{display: flex; align-items: center; flex-shrink: 0; gap: 20px; margin: 0; padding: 0 20px 0 0; list-style: none;}
.marquee__row img{-webkit-user-drag: none; user-drag: none; pointer-events: none;}

/* Column:緑の丸いラベル(サムネイル + タイトル — ライター名) */
a.pill-column,
a.pill-column:link,
a.pill-column:visited{display: flex; align-items: center; gap: 22px; box-sizing: border-box; height: 54px; padding: 0 30px 0 0; border: 1px solid #2d7a61; border-radius: 999px; background: #559e81; color: #fff; font-size: 14px; letter-spacing: .06em; white-space: nowrap; text-decoration: none; transition: background-color .3s ease;}
a.pill-column:hover{background: #3f8a6d;}
.pill-column__img{flex-shrink: 0; width: 52px; height: 52px; border-radius: 50%; overflow: hidden; background: #e2f2da; box-shadow: 0 0 0 1px #2d7a61;}
.pill-column__img img{display: block; width: 100%; height: 100%; object-fit: cover;}

/* Writer:薄い緑の丸いラベル(写真 + 名前・肩書 + 線) */
a.pill-writer,
a.pill-writer:link,
a.pill-writer:visited{display: flex; align-items: center; gap: 21px; box-sizing: border-box; height: 135px; padding: 0 23px 0 22px; border: 1px solid transparent; border-radius: 999px; background: #ddefdf; color: inherit; white-space: nowrap; text-decoration: none; transition: background-color .3s ease, border-color .3s ease;}
a.pill-writer:hover{background: #a3e8c9; border-color: #2d7a61;}
.pill-writer__img{flex-shrink: 0; width: 100px; height: 100px; border-radius: 50%; overflow: hidden; background: #fff;}
.pill-writer__img img{display: block; width: 100%; height: 100%; object-fit: cover;}
.pill-writer__body{display: block; min-width: 254px;}
.pill-writer__label{display: block; margin-bottom: 8px; font-size: 12px; line-height: 1; letter-spacing: .1em;}
.pill-writer__name{display: block; font-size: 18px; line-height: 1.4; font-weight: 700; letter-spacing: .08em;}
.pill-writer__position{display: block; margin-top: 6px; font-size: 12px; line-height: 1.8; font-weight: 500; letter-spacing: .07em;}
.pill-writer__line{flex-shrink: 0; width: 50px; height: 1px; background: #2d7a61;}


/*=====================================================================
製品情報(商品一覧)
======================================================================= */
.product-main{--product-ink: #3b4d46; --product-green: #409b7d; --img-pad: 36px; margin: 0 0 70px; border-radius: 120px; background: #e3f2dc;}

.product__head{padding: 76px 60px 65px; text-align: center;}
.product__title{display: flex; flex-direction: column; align-items: center; margin: 0;}
.product__en{font-size: 150px; line-height: 1; letter-spacing: .02em; color: #2d7a61; visibility: hidden;}
.product__en.split-text[data-split="done"]{visibility: visible;}
.product__ja{margin-top: 8px; font-size: 16px; line-height: 1; letter-spacing: .2em;}

.product__body{padding: 0 110px 120px;}

/* 商品カード(2列。行ごとに、画像・タイトル・本文・価格・ボタンの高さを揃える) */
ul.product-list{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 60px; max-width: 1100px; margin: 0 auto; padding: 0; list-style: none;}

.product-card{display: grid; grid-row: span 8; grid-template-rows: subgrid; row-gap: 0; box-sizing: border-box; border: 1px solid var(--product-ink); border-radius: 28px; overflow: hidden; background: #fafafa; color: var(--product-ink);}
.product-card > :not(.product-card__img):not(.product-card__inner){margin-left: 34px; margin-right: 34px; min-width: 0;}
.product-card{margin-bottom: 60px;}
.product-card:last-child,
.product-card:nth-last-child(2):nth-child(odd){margin-bottom: 0;}
.product-card::after{content: ""; grid-row: 8; height: 34px;}

.product-card__img{position: relative; grid-row: 1; margin: 0; aspect-ratio: 420 / 326; background: #fff; border-bottom: 1px solid var(--product-ink);}
.product-card__img img{position: absolute; top: var(--img-pad); left: var(--img-pad); width: calc(100% - var(--img-pad) * 2); height: calc(100% - var(--img-pad) * 2); object-fit: contain; transform: scale(var(--img-scale, 1));}

.product-card__title{grid-row: 2; margin-top: 34px; margin-bottom: 0; font-size: 20px; line-height: 1.5; font-weight: 700; letter-spacing: .03em;}
.product-card__catch{grid-row: 3; align-self: center; margin-top: 23px; margin-bottom: 0; padding-left: 16px; border-left: 3px solid var(--product-green); font-size: 16px; line-height: 1.9; font-weight: 700; letter-spacing: .06em;}
.product-card__desc{grid-row: 4; margin-top: 23px; margin-bottom: 0; font-size: 15px; font-weight: 500; line-height: 2.1; letter-spacing: .02em;}
.product-card__note{color: var(--product-green);}

.product-card__buy{grid-row: 5; align-self: end; margin-top: 25px; margin-bottom: 0;}
.product-card__spec{margin: 0; font-size: 13px; line-height: 1.6; letter-spacing: .03em; font-weight: 500; margin-bottom: 5px;}
.product-card__price{margin: 2px 0 0; font-size: 25px; line-height: 1.4; font-weight: 700; letter-spacing: .02em;}
.product-card__price span{margin-left: 8px; font-size: 11px; font-weight: 600; letter-spacing: .06em;}

/* 商品詳細ボタン */
a.product-btn,
a.product-btn:link,
a.product-btn:visited{position: relative; grid-row: 6; display: flex; align-items: center; justify-content: center; box-sizing: border-box; height: 56px; margin-top: 33px; margin-bottom: 0; border-radius: 999px; background: var(--product-green); color: #fff; font-size: 17px; font-weight: 500; letter-spacing: .1em; text-decoration: none; transition: background-color .3s ease-out;}
a.product-btn:hover{background: #6ab594; transition: background-color .1s ease-out;}
.product-btn__icon{position: absolute; top: 50%; right: 15px; width: 30px; height: 30px; margin-top: -15px; border-radius: 50%; 
	background: url("../images/arrow02.png") center / 30px auto no-repeat;}

/* 公式サイト・楽天・Yahoo・Qoo10 */
ul.product-links{grid-row: 7; align-self: start; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 26px; margin-bottom: 0; padding: 0; list-style: none;}
a.product-link,
a.product-link:link,
a.product-link:visited{display: flex; align-items: center; box-sizing: border-box; height: 47px; padding: 0 12px; border: 1px solid var(--product-ink); border-radius: 999px; color: var(--product-ink); text-decoration: none; transition: background-color .3s ease-out, border-color .3s ease-out;}
a.product-link:hover{background: #ebebeb; border-color: #395149; transition: background-color .1s ease-out;}
.product-link__arrow{flex-shrink: 0; width: 26px; height: 26px;}
.product-link__label{display: flex; align-items: center; justify-content: center; flex: 1; min-width: 0; padding-right: 24px; font-size: 14px; line-height: 1; font-weight: 600; letter-spacing: .1em; white-space: nowrap;}
.product-link__logo{display: block; height: auto;}
.product-link--rakuten .product-link__logo{width: 69px;}
.product-link--yahoo .product-link__logo{width: 109px;}
.product-link--qoo10 .product-link__logo{width: 61px;}

/* アーカイブ */
.product-archive{max-width: 1100px; margin: 100px auto 0;}
.product-archive__head{display: flex; align-items: center; margin-bottom: 60px;}
.product-archive__en{margin: 0; font-size: 26px; line-height: 1; font-weight: 600; letter-spacing: .02em; color: #2d7a61;}
.product-archive__line{display: block; flex: 1; height: 1px; margin: 0 120px 0 90px; background: #2d7a61;}
.product-archive__ja{font-size: 13px; font-weight: 500; line-height: 1; letter-spacing: .12em; color: #2d7a61;}

/* アーカイブのカードは、下にボタンをそろえる(縦並び) */
ul.product-list.product-list--archive{row-gap: 60px;}
.product-list--archive .product-card{margin-bottom: 0; display: flex; flex-direction: column; grid-row: auto; grid-template-rows: none;}
.product-list--archive .product-card::after{content: none;}
.product-list--archive .product-card__img{flex-shrink: 0;}
.product-card__inner{display: flex; flex-direction: column; flex: 1; margin: 0; padding: 34px; }
.product-card__inner > *{grid-row: auto; margin-left: 0; margin-right: 0;}
.product-card__inner .product-card__title{margin-top: 0;}
.product-card__inner .product-card__catch{align-self: flex-start;}
.product-card__inner .product-card__desc{margin-bottom: 33px;}
.product-card__inner a.product-btn{margin-top: auto;}


/* master.css の末尾に追加(前回までのオンラインショップ分はまるごと差し替え) */
/* ==============================
   オンラインショップ
============================== */
/* 緑の背景(上下とも大きい角丸) */
.shop-main {
  margin: 0 0 80px;
  padding: 80px 0 160px;
  background: #e3f2dc;
  border-radius: 150px;
}
.shop-inner {
  width: 1100px;
  margin: 0 auto;
}

/* 見出し */
.shop-ttl {
  margin: 0;
  text-align: center;
  font-weight: normal;
  line-height: 1;
  color: #2d7a61;
}
.shop-ttl .en03 {
  display: block;
  font-size: 140px;
	visibility: hidden;
}
.shop-ttl .en03.split-text[data-split="done"]{visibility: visible;}


.shop-ttl .ja {
  display: block;
  margin-top: 20px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: .2em;
}

/* 概要文 */
.shop-lead {
  margin: 40px 0 60px;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  line-height: 2.2;
  letter-spacing: .03em;
}

/* カード(2列。subgridで段の高さを揃える) */
.shop-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 56px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.shop-card {
  display: grid;
  grid-row: span 4;
  grid-template-rows: subgrid;
  row-gap: 0;
  overflow: hidden;
  border: 1px solid #2d7a61;
  border-radius: 20px;
  background: #f9f9f9;
}
.shop-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 220px;
  border-bottom: 1px solid #2d7a61;
  background: #fff;
}
.shop-logo img {
  max-width: 60%;
  max-height: 70px;
  scale: var(--img-scale, 1);
}
.shop-name {
  margin: 0;
  padding: 30px 32px 0;
  font-size: 20px;
  font-weight: bold;
  letter-spacing: .03em;
}
.shop-text {
  margin: 0;
  padding: 20px 30px 0;
  font-size: 15px;
  line-height: 2;
}
.shop-btn-wrap {
  align-self: end;
  padding: 32px 32px 40px;
}
/* ボタン(商品詳細ボタン .product-btn の背景色を、このページでも付ける) */
.shop-card a.product-btn,
.shop-card a.product-btn:link,
.shop-card a.product-btn:visited {
  background-color: #409b7d;
	font-size: 17px;
	letter-spacing: -.02em;
}
.shop-card a.product-btn:hover {
  background-color: #6ab594;
}

.shop-card a.product-btn {
  margin-top: 0;
}

/*=====================================================================
会社情報
======================================================================= */

.group_ttl{font-size: 24px; line-height: 1; font-weight:600; border-bottom: 1px solid #2d7a61; padding-bottom: 30px;}
.group_item{width: 100%;}
.group_item .fa_name{font-size: 18px; font-weight:600; line-height: 1; margin: 70px 0 20px;}
.group_item .fa_address{font-size: 15px; line-height:2.0; margin-bottom: 40px;}
.group_item iframe{
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	max-height: 400px;
}


.content_area{
	display: grid;
	grid-row-gap: 60px;
	}
#outline .block{
	display: grid;
	grid-row-gap: 60px;
	margin-bottom:80px;
	}
#outline .block:last-child{
	margin-bottom:0;
	}
#outline p,#history p{
	margin:0;
	padding:0;
	}
#outline .ttl, #history .ttl{
	float: left;
	font-size:16px;
	letter-spacing: .04em;
	}
#outline .ttl span, #history .ttl span{
	font-size:13px;
	font-weight: 500;
	margin-left: 28px;
	}
#outline .block#message{
	border-bottom:1px solid #beccb8;
	grid-row-gap: 70px;
	}
#message .body{
	display: grid;
	grid-template-columns: auto 1fr;
	grid-column-gap: 100px;
	padding-bottom: 70px;
	}
#message h3{
	font-size: 29px;
	letter-spacing: .05em;
	font-weight: 500;
	line-height: 200%;
	}
#message .lead{
	display: grid;
	grid-row-gap: 40px;
	font-size: 17px;
	font-weight: 500;
	letter-spacing: .04em;
	line-height: 220%;
	}
#overview dl{
	margin:0;
	padding:0;
	display: grid;
	grid-template-columns: 210px 1fr;
	grid-column-gap: 80px;
	}
#overview dt,#overview dd{
	margin:0;
	padding:0;
	padding:35px 0;
	font-size: 15px;
	line-height: 240%;
	}
#overview dt{
	border-top:1px solid #2d7a61;
	font-weight: 600;
	}
#overview dd{
	border-top:1px solid #beccb8;
	}
#overview dt:last-of-type{
	border-bottom:1px solid #2d7a61;
	}
#overview dd:last-of-type{
	border-bottom:1px solid #beccb8;
	}
#overview dd a{
	text-decoration: underline;
	}
#overview dd a:hover{
	text-decoration: none;
	}
/* CM:見出し → 提供番組 → CMリスト(2列) */
#cm .body{
	display: block;
	}
#cm .text{
	border-left: 1px solid #2d7a61;
	padding:15px 40px;
	font-size: 15px;
	line-height: 186.667%;
	}
#cm .text h3{
	font-size: 15px;
	}
#cm .text h3 span{
	font-weight: normal;
	}
#cm .text{display: inline-block;}
#cm .link{margin-top: 40px;}

/* CMリスト(mp3再生ボタン) */
.cm_list{list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-gap: 36px 32px;}
.cm_list li{margin: 0; padding: 0;}
button.cm_item{
	appearance: none; -webkit-appearance: none;
	display: flex; align-items: center; justify-content: space-between;
	width: 100%; height: 80px; margin: 0; padding: 0 20px 0 50px;
	box-sizing: border-box;
	border: 0; border-radius: 80px;
	background-color: #d7f2df;
	color: inherit; font: inherit; text-align: left;
	cursor: pointer;
	transition: opacity .3s, background-color .3s;
	}
button.cm_item:hover{opacity: .7;}
button.cm_item.is-playing{background-color: #bde3c6;}

.cm_name{display: block; font-size: 18px; font-weight: 700; line-height: 1.4; letter-spacing: .04em;}
.cm_sub{display: block; margin-top: 4px; font-size: 12px; font-weight: 700; letter-spacing: .06em;}

/* ▶ / ⏸ アイコン */
.cm_icon{
	flex-shrink: 0;
	display: flex; align-items: center; justify-content: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: #2d7a5f;
	}
.cm_icon::before{
	content: "";
	width: 0; height: 0;
	border-style: solid;
	border-width: 8px 0 8px 13px;
	border-color: transparent transparent transparent #fff;
	margin-left: 3px;
	}
.cm_item.is-playing .cm_icon::before{
	width: 4px; height: 16px;
	border-width: 0 4px;
	border-color: #fff;
	margin-left: 0;
	}
#history{
	width: 100%;
	margin: 0;
	padding: 80px 0;
	border-bottom: 1px solid #2d7a61;
	background-color: #f7f7f7;
	}
#history .title{
	box-sizing: border-box;
	width: calc(100% - 160px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: center;
	}
#history .btn_switch_display{
	display: grid;
	height: 40px;
	grid-template-columns: 146px 20px;
	background-color: #409b7d;
	border-radius: 20px;
	text-decoration: none !important;
	align-items: center;
	justify-items: center;
	justify-self: flex-end;
	position: relative;
	box-sizing: border-box;
	transition: opacity 0.3s;
	}
#history .btn_switch_display:hover{
	opacity: .7;
	}
#history .btn_switch_display .label{
	font-size: 13px;
	line-height: 100%;
	letter-spacing: .08em;
	color:#fff;
	grid-column: 1;
	grid-row: 1;
	padding-left: 6px;
	opacity: 1;
	transition: opacity 0.2s
	}
#history .btn_switch_display .label.close{
	opacity:0;
	}
#history.open .btn_switch_display .label.open{
	opacity:0;
	}
#history.open .btn_switch_display .label.close{
	opacity:1;
	}
#history .btn_switch_display .icon{
	display: block;
	width:20px;
	height:20px;
	background-color: #fff;
	border-radius: 10px;
	position: absolute;
	top:10px;
	right:10px;
	}
#history .btn_switch_display .icon:before,
#history .btn_switch_display .icon:after{
	content:"";
	display: block;
	width:8px;
	height:1px;
	background-color: #2d7a61;
	position: absolute;
	top:10px;
	left:6px;
	}
#history .btn_switch_display .icon:after{
	transform: rotate(90deg);
	transform-origin: center center;
	transition: transform 0.2s;
	}
#history.open .btn_switch_display .icon:after{
	transform: rotate(0deg);
	}
#history .btn_switch_display:hover{
	cursor: pointer;
	}
#history .body{
	overflow-x: auto;
	padding:0 80px;
	cursor: grab; /* 掴めるカーソル */
	user-select: none; /* ドラッグ中にテキストが選択されるのを防ぐ */
	}
#history .body *{
	user-select: none; /* ドラッグ中にテキストが選択されるのを防ぐ */
	}
#history .body::-webkit-scrollbar {
	display: none;
	}
#history .body:active {
	cursor: grabbing; /* 掴み中のカーソル */
	}
#history ul{
	margin: 0;
	padding: 0;
	display: grid;
	grid-auto-flow: column;
	justify-content: flex-start;
	grid-column-gap: 40px;
	}
#history ul.block_left,#history ul.block_right{
	display: contents;
	}
#history li{
	background-color: #fff;
	padding:20px 40px;
	display: grid;
	grid-template-columns: auto 1fr;
	grid-column-gap: 30px;
	width:540px;
	min-height: 115px;
	box-sizing: border-box;
	border-radius: 20px;
	align-items: center;
	justify-content: flex-start;
	}
#history ul.block_right:after{
	content:"";
	display: block;
	width:40px;
	}
#history .time{
	display: grid;
	grid-auto-flow: column;
	align-items: flex-end;
	justify-content: flex-start;
	grid-column-gap: 20px;
	}
#history .year{
	font-family: "aabak", sans-serif;
	font-size: 52px;
	}
#history .month{
	font-size: 14px;
	font-weight: 600;
	padding-bottom: 8px;
	}
#history .month:before{
	content:"/ ";
	}
#history p{
	font-size: 14px;
	line-height: 200%;
	}
#history.open .body{
	overflow-x: unset;
	cursor: unset;
	user-select: unset;
	}
#history.open .body *{
	user-select: unset;
	}
#history.open .body:active {
	cursor: unset;
	}
#history.open ul.list{
	grid-template-columns: 1fr 1fr;
	grid-auto-flow: unset;
	}
#history.open ul.block_left,
#history.open ul.block_right{
	display: grid;
	grid-auto-flow: row;
	justify-content: flex-start;
	align-content: flex-start;
	grid-row-gap: 40px;
	border-top:1px solid #2d7a61;
	padding-top:60px;
	}
#history.open li{
	background-color: unset;
	padding:0px;
	width:unset;
	min-height: unset;
	align-items: flex-start;
	}
#history.open .time{
	grid-template-columns: 96px 50px;
	grid-template-rows: 30px;
	align-items: center;
	grid-column-gap: 20px;
	}
#history.open .year,#history.open .month{
	font-family: "Noto Sans JP", sans-serif;
	font-optical-sizing: auto;
	font-weight: 600;
	font-style: normal;
	font-size: 14px;
	}
#history.open .year{
	background-color: #92ada4;
	color: #fff;
	border-radius: 6px;
	text-align: center;
	padding:0.4em 0;
	}
#history.open .year:after{
	content:"年";
	}
#history.open .year.same{
	visibility: hidden;
	}
#history.open .month{
	padding:0;
	}
#history.open .month:before{
	content:"";
	}


/*=====================================================================
ニュース一覧
======================================================================= */

#news{width: 100%; margin: 0; padding: 120px 0;}
#news .news_area{box-sizing: border-box; width: calc(100% - 160px); margin: 0 auto;}
#news .news_area .ttl{width: 290px; float: left; font-size:16px; letter-spacing: .04em;}
#news .news_area .ttl span{font-size:13px; font-weight: 500; margin-left: 28px;}

#news .news_area .body{width: calc(100% - 290px); float: left; }
#news .news_area .body ul{padding: 0; margin: 0;}
#news .news_area .body li{border-bottom: 1px solid #beccb8; padding:0 0 42px 0; margin:0 0 42px 0;}
#news .news_area .body li:last-child{ margin-bottom: 0;}

#news .news_area .body .date{font-size: 13px; margin-bottom: 5px; font-weight: 500; letter-spacing: .04em;}
#news .news_area .body a{font-size: 15px; letter-spacing: .04em; text-decoration: none; position: relative;}
#news .news_area .body a::after{
  position: absolute;
  bottom: -7px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #3f7766;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .2s;
}
#news .news_area .body a:hover::after{
  transform-origin: left top;
  transform: scale(1, 1);
}


/*=====================================================================
ニュース詳細
======================================================================= */

.article_ttl{
	font-size: 24px;
	padding-bottom: 24px;
	border-bottom: 1px solid #2d7a61;
}

.article_date{
	font-size: 12px;
	text-align: right;
	margin-top: 20px;
}

.article_body{
	font-size: 15px;
	line-height: 200%;
}


/*=====================================================================
お問い合せ(入力・確認・完了)  MW WP Form
======================================================================= */

.contact-page{--cf-green: #2d7a61; --cf-ink: #2d6a55; --cf-line: #cfd8d3; --cf-req: #e0555a; --cf-err: #e0443e;}
.page_inner.contact-page{padding-right: 64px;}
.contact-page .line_inner{padding: 80px 80px 80px 80px;}

/* 右の縦文字 */
.contact-page__label{position: absolute; top: 30px; right: 26px; margin: 0; font-size: 11px; line-height: 1; font-weight: 600; letter-spacing: .08em; color: var(--cf-green); writing-mode: vertical-rl;}

/* 説明文 */
.cf-lead{margin: 0; font-size: 16px; line-height: 2.2; font-weight: 700; letter-spacing: .06em; color: var(--cf-ink);}
.cf-note{margin: 36px 0 0; padding: 36px 40px 36px 42px; background: #f5f5f5; font-size: 12px; line-height: 2; font-weight: 500; letter-spacing: .04em;}
.cf-note p{margin: 0; padding-left: 1em; text-indent: -1em;}
.cf-reqnote{margin: 42px 0 0; font-size: 13px; line-height: 1.6; letter-spacing: .04em;}
.cf-reqnote .cf-req{margin: 0 4px;}

/* 必須バッジ */
.cf-req{display: inline-block; padding: 4px 10px 5px; border-radius: 3px; background: var(--cf-req); color: #fff; font-size: 12px; line-height: 1; font-weight: 700; letter-spacing: .06em;}

/* 項目 */
.cf-form{margin-top: 56px;}
.cf-row{display: grid; grid-template-columns: 294px minmax(0, 1fr); align-items: start; margin-top: 40px;}
.cf-row:first-child{margin-top: 0;}
.cf-label{display: flex; flex-direction: column; justify-content: center; min-height: 72px;}
.cf-row--top .cf-label{justify-content: flex-start; min-height: 0; padding-top: 24px;}
.cf-name{display: flex; align-items: center; gap: 16px; margin: 0; font-size: 16px; line-height: 1.5; font-weight: 700; letter-spacing: .08em; color: var(--cf-ink);}
.cf-error{margin: 10px 0 0; font-size: 13px; line-height: 1.6; font-weight: 500; letter-spacing: .04em; color: var(--cf-err);}
.cf-error:empty{display: none;}
.contact-page .error{display: block; color: var(--cf-err); font-size: 13px; line-height: 1.6;}

/* 入力欄 */
.contact-page .cf-input{display: block; box-sizing: border-box; width: 100%; max-width: 635px; height: 72px; padding: 0 24px; border: 1px solid var(--cf-line); border-radius: 0; background: #fff; color: var(--cf-ink); font: inherit; font-size: 15px; letter-spacing: .06em; appearance: none; -webkit-appearance: none; outline: none; transition: border-color .3s ease;}
.contact-page textarea.cf-input{height: 214px; padding: 22px 24px; line-height: 1.9; resize: vertical;}
.contact-page .cf-input::placeholder{color: #c3cbc7;}
.contact-page .cf-input:focus{border-color: var(--cf-green);}
.contact-page .cf-input.cf-input--short{max-width: 319px;}

/* セレクト(矢印は images/arrow01.png を下向きに) */
.cf-select{position: relative; width: 319px; max-width: 100%;}
.contact-page .cf-select .cf-input{padding-right: 68px; cursor: pointer;}
.cf-select::after{content: ""; position: absolute; top: 50%; right: 20px; width: 32px; height: 32px; margin-top: -16px; background: url("../images/arrow01.png") center / contain no-repeat; rotate: 90deg; pointer-events: none;}

/* ラジオ・チェックボックス */
.cf-field--radio{display: flex; align-items: center; min-height: 72px;}
.contact-page .mwform-radio-field,
.contact-page .mwform-checkbox-field{display: inline-block; margin: 0 36px 0 0;}
.contact-page .mwform-radio-field:last-child,
.contact-page .mwform-checkbox-field:last-child{margin-right: 0;}
.contact-page .mwform-radio-field label,
.contact-page .mwform-checkbox-field label{display: inline-flex; align-items: center; gap: 12px; cursor: pointer;}
.contact-page .mwform-radio-field-text,
.contact-page .mwform-checkbox-field-text{font-size: 15px; line-height: 1.5; font-weight: 700; letter-spacing: .08em; color: var(--cf-ink);}
.contact-page input[type="radio"],
.contact-page input[type="checkbox"]{position: relative; flex-shrink: 0; width: 20px; height: 20px; margin: 0; border: 1.5px solid var(--cf-green); background: #fff; appearance: none; -webkit-appearance: none; cursor: pointer;}
.contact-page input[type="radio"]{border-radius: 50%;}
.contact-page input[type="checkbox"]{border-radius: 3px; transition: background-color .3s ease;}
.contact-page input[type="radio"]:checked::after{content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--cf-green);}
.contact-page input[type="checkbox"]:checked{background: var(--cf-green);}
.contact-page input[type="checkbox"]:checked::after{content: ""; position: absolute; top: 2px; left: 6px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);}

/* 確認画面:入力した内容(文字)を出す */
.mw_wp_form_confirm .cf-field{padding: 21px 0; font-size: 15px; line-height: 30px; font-weight: 500; letter-spacing: .05em; color: var(--cf-ink);}
.mw_wp_form_confirm .cf-field--radio{display: block; min-height: 0;}
.mw_wp_form_confirm .cf-select::after{display: none;}

/* 個人情報の取り扱い */
.cf-privacy{margin-top: 64px; padding: 44px 62px 56px; border: 1px solid #dcdcdc; background: #f5f5f5;}
.cf-privacy__ttl{margin: 0; text-align: center; font-size: 20px; line-height: 1.5; font-weight: 700; letter-spacing: .08em; color: var(--cf-ink);}
.cf-privacy__lead{margin: 22px 0 0; text-align: center; font-size: 12px; line-height: 2.1; font-weight: 500; letter-spacing: .04em;}

/* アコーディオン(最初は閉じている) */
.cf-acc{margin-top: 34px; border-top: 1px solid #cfd2d0; border-bottom: 1px solid #cfd2d0;}
.cf-acc > br,
.cf-acc > p:empty{display: none;}
.cf-acc__btn{display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 38px 0; border: 0; background: none; font: inherit; font-size: 16px; line-height: 1.5; font-weight: 700; letter-spacing: .08em; text-align: left; color: var(--cf-ink); cursor: pointer;}
.cf-acc__icon{position: relative; flex-shrink: 0; width: 31px; height: 31px; border-radius: 4px; background: var(--cf-green); transition: background-color .3s ease;}
.cf-acc__btn:hover .cf-acc__icon{background: #409b7d;}
.cf-acc__icon::before,
.cf-acc__icon::after{content: ""; position: absolute; top: 50%; left: 50%; width: 11px; height: 1.5px; margin: -.75px 0 0 -5.5px; background: #fff; transition: transform .5s cubic-bezier(.22, 1, .36, 1);}
.cf-acc__icon::after{transform: rotate(90deg);}
.cf-acc.is-open .cf-acc__icon::after{transform: rotate(0);}
.cf-acc__panel{display: grid; grid-template-rows: 0fr; transition: grid-template-rows .6s cubic-bezier(.22, 1, .36, 1);}
.cf-acc.is-open .cf-acc__panel{grid-template-rows: 1fr;}
.cf-acc__inner{min-height: 0; overflow: hidden;}
.cf-acc__body{padding: 0 0 38px; font-size: 12px; line-height: 2.2; font-weight: 600; letter-spacing: .03em;}
.cf-acc__lead{margin: 0 0 22px;}
.cf-acc__list{margin: 0; padding: 0; list-style: none;}
.cf-acc__list li{margin: 0; padding-left: 1em; text-indent: -1em;}
.cf-acc__list li::before{content: "・";}

/* 同意のチェック(最後) */
.cf-agree{margin-top: 45px; text-align: center;}
.cf-agree .cf-error{text-align: center;}

/* ボタン */
.cf-buttons{margin-top: 38px; text-align: center;}
.contact-page .cf-btn,
a.cf-btn,
a.cf-btn:link,
a.cf-btn:visited{display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: 553px; max-width: 100%; height: 82px; margin: 0 auto; padding: 0; border: 0; border-radius: 999px; background-color: #409b7d; background-image: linear-gradient(#fff, #fff); background-repeat: no-repeat; background-size: 60px 1px; background-position: right 32px center; color: #fff; font: inherit; font-size: 20px; font-weight: 700; letter-spacing: .1em; text-decoration: none; cursor: pointer; appearance: none; -webkit-appearance: none; transition: background-color .3s ease-out, background-position .5s cubic-bezier(.22, 1, .36, 1);}
.contact-page .cf-btn:hover,
a.cf-btn:hover{background-color: #6ab594; background-position: right 20px center; transition: background-color .1s ease-out, background-position .5s cubic-bezier(.22, 1, .36, 1);}
.contact-page .cf-btn.cf-btn--back{width: 287px; height: 54px; margin-bottom: 22px; background-color: #aaa; background-image: none; font-size: 14px; letter-spacing: .08em;}
.contact-page .cf-btn.cf-btn--back:hover{background-color: #8f8f8f;}

/* 完了 */
.cf-done{padding: 0 0 0; text-align: center;}
.cf-done__ttl{margin: 0; font-size: 26px; line-height: 1.6; font-weight: 700; letter-spacing: .08em; color: var(--cf-ink);}
.cf-done__text{margin: 30px 0 0; font-size: 15px; line-height: 2.3; letter-spacing: .06em;}
.cf-done .cf-note{margin-top: 50px; padding: 56px 60px; text-align: left;}
.cf-done a.cf-btn,
.cf-done a.cf-btn:link,
.cf-done a.cf-btn:visited{margin-top: 60px; font-size:18px;}


/*=====================================================================
Footer
======================================================================= */

footer{
    width: 100%;
	box-sizing: border-box;
    position: relative;
    z-index: 2;
	background-color: #2d7a61;
	border-top-left-radius: 120px;
	border-top-right-radius: 120px;
	padding: 100px 50px 90px 50px;
	
	display: flex;
}

footer .foot_left{
	flex: 7;
	position: relative; 
}

footer .foot_right{
	flex: 3; 
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	padding-right: 30px;
	box-sizing: border-box;
}


footer .footmenu{
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

footer .footmenu ul{
	margin: 0 0 0 60px;
	padding: 0;
}

footer .footmenu ul li{margin: 0 0 30px 0;}
footer .footmenu ul li:last-child{margin: 0 0 0 0;}

footer .footmenu li a{
	color: #f0e7da;
    text-decoration: none; 
    font-size: 16px;
    position: relative; 
    letter-spacing: .06em; 
	
  display: inline-block;
  white-space: nowrap;
}

footer .footmenu li a::after{
  position: absolute;
  bottom: -6px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #f0e7da;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform .2s;
}
footer .footmenu li a:hover::after{
  transform-origin: left top;
  transform: scale(1, 1);
}


footer .split{
	margin-top: 45px;
  user-select: none;
  -webkit-user-select: none; /* Safari対応 */
  -ms-user-select: none;     /* 旧Edge・IE対応 */
}
footer .split .blc01{margin: 0;}
footer .split .blc02{margin: -20px 0 0 0;}
footer .split-text{color:#3b816b; font-size: 200px; line-height:1; letter-spacing: .014em; visibility: hidden;}
footer .split-text[data-split="done"]{
  visibility: visible;
}


footer .footlogo{width: 184px; margin-bottom: 110px;}
footer .footlogo img{width: 100%;}

footer .footsub .link{font-size: 12px; color: #f0e7da; margin-bottom: 150px;}
footer .footsub .link .en02{margin-bottom:20px; line-height: 1;}

footer .footsub .link a{font-size: 20px; color: #f0e7da; margin-right: 40px;}
footer .footsub .link a:last-child{margin-right:0;}


footer .footsub .contact{font-size: 13px; letter-spacing: .02em; margin-bottom: 30px; text-align: right;}
footer .footsub .contact a{text-decoration: none; color: #f0e7da;}

footer .footsub .copyright{font-size: 12px; letter-spacing: .02em; color: #f0e7da; text-align: right;}



/* Contact btn
------------------------------------------------------------------------ */

.contact_btn {
  width: 100%;
}

.contact_btn a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
	height: 248px;
  box-sizing: border-box;
  padding: 0 60px 0 110px;
  background: #f2e6d6;
  border-radius: 9999px;
  color: #2d7a5f;
  text-decoration: none;
}


/* マウスに追従して動くテキスト部分 */
.contact_btn__text {
transform-origin: left center; /* 拡大するとき左端を基準にする */
  will-change: transform;
  transition: transform .5s cubic-bezier(.22, 1, .36, 1);
}
.contact_btn__text.is-moving {
  transition: transform .12s ease-out; /* 追従中は素早く */
}

.contact_btn .en02 {
  font-size: 42px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.02em;
}
.contact_btn .ja {
  margin-top: .4em;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .1em;
}

/* 矢印の丸 */
.contact_btn__arrow {
  position: relative;
  flex-shrink: 0;
  display: block;
  width: 70px;
  aspect-ratio: 1;
  background: #2d7a5f;
  border-radius: 50%;
  overflow: hidden;            /* 丸枠の外に出た矢印を隠す */
transition: background-color .4s ease;
}
.contact_btn__arrow img {
  position: absolute;
  top: 50%;
  left: 0;
  width: 41px;
  height: auto;
  transform: translate(0, -50%);
}

/* hover:丸の色が変わり、矢印が右へ抜けて、左から戻ってくる */
@media (hover: hover) {
  .contact_btn a:hover {
    background: #f4ebdf;
  }
  .contact_btn a:hover .contact_btn__arrow {
    background: #409b7d;
  }
  .contact_btn a:hover .contact_btn__arrow img {
    animation: arrow_through .5s both;
  }
}
@keyframes arrow_through {
  0%   { transform: translate(0, -50%); animation-timing-function: cubic-bezier(.5, 0, 1, .6); }
  45%  { transform: translate(160%, -50%); }          /* 右の枠外へ */
  45.01% { transform: translate(-110%, -50%); animation-timing-function: cubic-bezier(0, .5, .3, 1); } /* 左の枠外へ瞬間移動 */
  100% { transform: translate(0, -50%); }             /* 左端の元の位置に戻る */
}

@media (prefers-reduced-motion: reduce) {
  .contact_btn__text { transition: none; }
  .contact_btn a:hover .contact_btn__arrow img { animation: none; }
}



/*=====================================================================
Animation
======================================================================= */

/* hover
------------------------------------------------------------------------ */
a.mo_fade{transition: all 0.3s ease;}
a.mo_fade:hover{opacity: 0.6; transition: all 0.2s ease;}

a.mo_fade2{transition: all 0.3s ease;}
a.mo_fade2:hover{opacity: 0.4; transition: all 0.2s ease;}



/* Newsサムネイル　hover拡大
------------------------------------------------------------------------ */

/* Hover Image */
a.hoverimg {
  display: block;
  transition: 0.3s ease-out;
    transform: scale(1.0);
}

a.hoverimg:hover {
  transform: scale(1.06);
  opacity: 0.75;
	transition: 0.15s ease-out;
}


/* スプリットテキスト */
.char-wrap {
  display:inline-block;
  overflow:hidden;
  vertical-align:bottom;
}
.char {
  display:inline-block;
  transform:translateY(100%);
  will-change:transform;
  white-space:pre;
}
@keyframes slideUp {
  from {transform:translateY(100%);}
  to   {transform:translateY(0%);}
}
.char.animate {
  animation-name:slideUp;
  animation-duration:0.6s;/* アニメーション間隔 */
  animation-fill-mode:forwards;
  animation-timing-function:cubic-bezier(.22,.9,.35,1);
  /* animation-delay はJSで付ける */
}
.sr-only {
  position:absolute!important;
  width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}


/* Fade in Up(default.js):JSが動く前から隠しておく(読み込み中に一瞬見えるのを防ぐ)
   JSが無効の環境では隠さない。表示はGSAPが inline で opacity を上書きする */
@media (scripting: enabled){
	.fade-up,
	.fade-up02,
	.fade-up03,
	.fade-up04{opacity: 0;}
}


/* 404
------------------------------------------------------------------------ */

.notfoundttl {width: 100%; text-align: center; font-size: 60px; letter-spacing:.02em; margin:80px 0 50px 0;}
.notfoundttl p{font-size: 17px; margin: 10px 0 0 0;}

.notfound_btn{width: 50%; margin: 0 auto 80px auto;}

.notfound_btn  a{
	 width: 100%; 
	height: 60px;
    font-size: 16px;
	border-radius: 30px;
	background-color: #2d7a61; 
	text-align: center; text-decoration: none;color: #FFF; 
	transition: all 0.3s ease;
/*　box要素縦中央 */
 display: -webkit-flex;
 display: flex;
 -webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
 align-items: center; /* 縦方向中央揃え */
 -webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 justify-content: center; /* 横方向中央揃え */

}

.notfound_btn  a:hover{background-color: #409b7d; color: #FFF; transition: all 0.1s ease;}