@charset "utf-8";
/****************
common
****************/
:root {
  --bg_lb: #fbfbfb;
  --maincolor: #4c4948;
  --themecolor: #681e8d;
  --cover-bg:#aba8a6;
  --hov :#934500;

  --s-l  : clamp(80px,  15vw, 150px);
  --s-mm : clamp(40px,  6vw,  64px);
  --s-m  : clamp(20px,  3vw,  32px);
  --s-ms : clamp(16px,  2vw,  24px);
  --s-sm: 16px;
  --s-s: 8px;
  --s-ss: 4px;
  --s-m-vw: 2vw;
  --s-s-vw: 1vw;

  --inner_l: 1280px;
  --inner_m: 1000px;

  --w-inner: min(2000px, 95%);

/* font */
  --f-noto: "Noto Serif JP", serif;
  --f-en: "byington", serif;
  --f-gothic: "Yu Gothic", "YuGothic", sans-serif;
  --fs-l : clamp(1.2rem, 1.4vw, 1.4rem);
  --fs-mm: clamp(1.05rem, 1.2vw, 1.125rem);
  --fs-m : 1rem;
  --fs-s : .8rem;
  --ttl  : clamp(1rem, 1.2vw, 1.1rem);
  --page_ttl: clamp(24px,3.2vw,40px);
}

.mb-l { margin-bottom: var(--s-l);}
.mt-l { margin-top: var(--s-l);}
.mb-mm { margin-bottom: var(--s-mm);}
.mt-mm { margin-top: var(--s-mm);}
.mb-m { margin-bottom: var(--s-m);}
.mt-m { margin-top: var(--s-m);}
.mb-ms { margin-bottom: var(--s-ms);}
.mt-ms { margin-top: var(--s-ms);}
.mb-sm { margin-bottom: var(--s-sm);}
.mt-sm { margin-top: var(--s-sm);}
.mb-s { margin-bottom: var(--s-s);}
.mt-s { margin-top: var(--s-s);}
.mb-ss { margin-bottom: var(--s-ss);}
.mt-ss { margin-top: var(--s-ss);}

.font-en { font-family: var(--f-en);}
.font-ja { font-family: var(--f-noto);}
.center  { text-align: center!important;}
.t-right { text-align: right!important;}

@font-face {
  font-family: "byington";
  src: url("../fonts/byington.woff2") format("woff2");

  font-style: normal;
  unicode-range: U+0041-005A, U+0061-007A;
}
@font-face {
  font-family: "byington_bold";
  src: url("../fonts/byington_bold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  unicode-range: U+0041-005A, U+0061-007A;
}

.mincho {
  font-family: "Shippori Mincho B1", serif;
  font-style: normal;
  font-weight: 600;
}
.en-font {
  font-family: "byington";
  font-weight: 400;
}

:where(a) {
  color: var(--maincolor);
}
:where(a):active {
  color: var(--hov);
}
:where(a):hover {
    text-decoration: none;
    color: var(--hov);
}
:where(a):hover .color--red {
  color: var(--hov);
}
a img {
  cursor: pointer;
}
::marker {
  line-height: 1;
}