/* =========================
Base
========================= */

/* Color Variable  ===== */
:root {
  --main-color: #6cd58f;
  --color_text: #000;
  --text-color: #000;
  --border-color: #000;
  --light-gray: #eaeaea;
  --light-beige: #efdcc5;
  --blue: #1dd0da;
  --yellow: #ffdd53;
  --pink: #f22276;
  --light-blue: #d1f5f9;
  --light-yellow: #fffdf1;
}
/* マーカー高さ調整  ===== */
:root {
  --jl-marker-pos: 64%; /* デフォルト（SWELLに近い） */
}

.mark-height .mark_blue {
  background: linear-gradient(
    transparent 0%,
    var(--light-blue) 0
  );
}

.mark-height .mark_yellow {
  background: linear-gradient(
    transparent 0%,
    var(--light-yellow) 0
  );
}

.mark-height .mark_green {
  background: linear-gradient(
    transparent 0%,
    var(--color_mark_green) 0
  );
}

html,
body{
background:#fffbe9;
}

body{
font-family:"M PLUS 1p",sans-serif;
color:var(--text-color);
line-height:1.7;
}

a{
text-decoration:none;
color:inherit;
}

img{
max-width:100%;
height:auto;
display:block;
}

.page-id-22 {
background:#FFFBEE;
}

.p-breadcrumb.-bg-on {
    background: transparent;
}

 #main_content .c-pageTitle {
	display:none;
}

@media (max-width:959px){

body{
padding-top:70px;
}

}
/* 固定ページ行間調整  ===== */
.post_content .lh-tight {
  line-height: 1.4;
}

.post_content .lh-normal {
  line-height: 1.9;
}

.post_content .lh-loose {
  line-height: 2.1;
}

/* スマホ改行  ===== */
/* 初期状態（PCでは非表示） */
.sp-br {
  display: none;
}

/* スマホ時だけ表示 */
@media screen and (max-width: 767px) {
  .sp-br {
    display: block;
  }
}
/* PC改行  ===== */
.pc-only-br {
  display: inline;
}

@media screen and (max-width: 767px) {
  .pc-only-br {
    display: none;
  }
}


/* トップへ戻るボタン */
#pagetop {
  width: 54px;
  height: 54px;
  right: 20px;
  bottom: 20px;
  opacity: 1;
  background-color: #ffcb05;
  color: #111111;

  border: 2px solid #111111;
  border-radius: 50%;
  box-shadow: none;

  transition: transform 0.2s ease,
              background-color 0.2s ease;
}

#pagetop:hover {
  background-color: #ffffff;
  color: #111111 !important;
  transform: translateY(-3px);
}

/* スマホ */
@media (max-width: 767px) {
  #pagetop {
    width: 48px;
    height: 48px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom));
  }
}

/* =====================================
   404ページ
===================================== */
#body_wrap.error404 .jl-404 {
  width: calc(100% - 40px);
  max-width: 1100px;
  margin-inline: auto;
}

#body_wrap.error404 .jl-404__inner {
  padding: 72px 20px 88px;
  text-align: center;
}

#body_wrap.error404 .jl-404__number {
  margin: 0 0 8px;
  color: var(--blue);
  font-size: clamp(72px, 10vw, 130px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.02em;
  -webkit-text-stroke: 2px #111;
}

#body_wrap.error404 .jl-404__title {
  margin: 0;
  font-size: clamp(22px, 4vw, 34px);
  font-weight: 900;
  line-height: 1.5;
}

#body_wrap.error404 .jl-404__text {
  margin: 28px 0 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 2;
}

#body_wrap.error404 .jl-404__buttons {
  display: flex;
  justify-content: center;
  gap: 18px;
  margin-top: 44px;
}

#body_wrap.error404 .jl-404__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-width: 250px;
  padding: 14px 28px;

  color: #111;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;

  border: 2px solid #111;
  border-radius: 100px;
  box-shadow: 3px 3px 0 #111;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
}

#body_wrap.error404 .jl-404__button--primary {
  background-color: #fff;
}

#body_wrap.error404 .jl-404__button--secondary {
  background-color: var(--yellow);
}

#body_wrap.error404 .jl-404__button:hover {
  color: #111;
  transform: translate(2px, 2px);
  box-shadow: 1px 1px 0 #111;
}

#body_wrap.error404 .jl-404__button:focus-visible {
  outline: 3px solid var(--pink);
  outline-offset: 4px;
}

@media (max-width: 767px) {
  #body_wrap.error404 .jl-404 {
    width: calc(100% - 32px);
  }

  #body_wrap.error404 .jl-404__inner {
    padding: 56px 0 72px;
  }

  #body_wrap.error404 .jl-404__number {
    -webkit-text-stroke: 1.5px #111;
  }

  #body_wrap.error404 .jl-404__text br {
    display: none;
  }

  #body_wrap.error404 .jl-404__buttons {
    flex-direction: column;
    gap: 14px;
    max-width: 340px;
    margin: 38px auto 0;
  }

  #body_wrap.error404 .jl-404__button {
    width: 100%;
    min-width: 0;
  }
}