@charset "utf-8";

@media screen and (max-width: 767px) {}
@media screen and (max-width: 899px) {}
@media screen and (max-width: 1260px) {}
@media screen and (max-width: 1440px) {}

/*----------------------------------------------------------
  normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css
----------------------------------------------------------*/
/* Document */
html{line-height:1.15;-webkit-text-size-adjust:100%}
/* Sections */
body{margin:0}
main{display:block}
/* Grouping content */
hr{box-sizing:content-box;height:0}
pre{font-family:monospace,monospace;font-size:1em}
/* Text-level semantics */
a{background-color:transparent}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bolder}
code,kbd,samp{font-family:monospace,monospace;font-size:1em}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}
sup{top:-0.5em}
/* Embedded content */
img{border-style:none}
/* Forms */
button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}
button,select{text-transform:none}
button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button; appearance:button;}
button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{padding:0.35em 0.75em 0.625em}
legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}
progress{vertical-align:baseline}
textarea{overflow:auto}
[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}
[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}
[type="search"]{-webkit-appearance:textfield; appearance:textfield; outline-offset:-2px}
[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
/* Interactive */
details{display:block}
summary{display:list-item}
/* Misc */
template{display:none}
[hidden]{display:none}

/* reset
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, ol, li, p, table, th, td, time { margin: 0; padding: 0; font-size: inherit;}
h1, h2, h3, h4, h5, h6, em, b { font-weight: inherit;}
em, b, i { font-style: inherit;}
li { list-style: none;}
figure { margin: 0;}
img { vertical-align: top; background-color: rgba(255, 255, 255, .01);}
table { border-collapse: collapse; border-spacing: 0;}
input, select, textarea { font-size: max(1.8rem, 18px); -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0;}
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder { color: transparent;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder { color: transparent;}
input:focus::-ms-input-placeholder, textarea:focus::-ms-input-placeholder { color: transparent;}
input:focus::placeholder, textarea:focus::placeholder { color: transparent;}
button { margin: 0; padding: 0; border: 0; outline: none; background: transparent; box-shadow: 0 0 0 0 transparent; cursor: pointer;}

/*----------------------------------------------------------
  custom
----------------------------------------------------------*/
:root {
  --w_max: 1260;
  --w_full: 1440;
  --w_tb: 768;
  --w_sp: 375;
  --c_white: #fff;
  --c_black: #4c4a49;
  --c_gray: #c4c7cc;
  --c_beige: #e9dbcc;
  --c_text: #2c2d2f;
  --c_link_hover: #84868b;
}

/*----------------------------------------------------------
  base
----------------------------------------------------------*/
html {
  position: relative;
  height: 100dvh;
  font-size: min(2.6667vw, 62.5%);
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Droid Sans", "Yu Gothic", YuGothic, "\30E1\30A4\30EA\30AA", Meiryo, "\30D2\30E9\30AE\30CE\89D2\30B4 ProN W3", "Hiragino Kaku Gothic ProN", "\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body {
  text-align: center;
  position: relative;
  min-height: 100dvh;
  background-color: var(--c_white);
  color: var(--c_text);
  font-size: 1.4rem;
  line-height: 1.8;
  font-weight: 400;
  -webkit-tap-highlight-color: transparent;
}
.en { font-family: "Satoshi", sans-serif;}
.enjp { font-family: "Satoshi", "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Droid Sans", "Yu Gothic", YuGothic, "\30E1\30A4\30EA\30AA", Meiryo, "\30D2\30E9\30AE\30CE\89D2\30B4 ProN W3", "Hiragino Kaku Gothic ProN", "\FF2D\FF33 \FF30\30B4\30B7\30C3\30AF", sans-serif;}

a, button {
  display: inline-block;
  color: inherit;
  text-decoration: none;
  outline: none;
  opacity: 1;
  transition: all .3s;
  backface-visibility: hidden;
}
a::after, button::after,
a::before, button::before {
  transition: all .3s;
  backface-visibility: hidden;
}
a img {
  vertical-align: top;
  background-color: rgba(255, 255, 255, .01);
}
img { width: 100%; height: auto;}
.image img, .photo img, .illust img, figure img, picture img { width: 100%;}
.skip { position: absolute; left: -9999px;}
.hide { display: none;}
.left { float: left;}
.right { float: right;}
.clear { clear: both;}
.cf::after { clear: both; content: ""; display: block;}
.ib { display: inline-block;}
.txtr { text-align: right;}
.txtc { text-align: center;}
.txt-up { text-transform: uppercase;}
.txt-br { word-break: keep-all; overflow-wrap: break-word; line-break: normal;}
.em { color: var(--c_em);}
.note { color: #585a60; font-size: 1.1rem;}

.sp01 { margin-top: .5em !important;}
.sp02 { margin-top: 1em !important;}
.sp03 { margin-top: 1.5em !important;}
.sp04 { margin-top: 2em !important;}
.sp05 { margin-top: 2.5em !important;}

.sp { display: block;}
.pc { display: none;}
.noscript-text { padding: 1em;}

@media screen and (min-width: 768px) {
  html { font-size: clamp(50%, 50% + ((1vw - 7.68px) * 0.463), 62.5%);} /* 768px => 1200px | 8px => 10px */
  body { font-size: 1.6rem;}
  .note { font-size: 1.4rem;}
  .sp { display: none;}
  .pc { display: block;}
}

/*----------------------------------------------------------
  js
----------------------------------------------------------*/
/* fade */
.js-fade { opacity: 0; transition: opacity .8s cubic-bezier(.4, 0, .2, 1);}
.js-fade.is-active { opacity: 1;}

/* loading */
#l-wrap { opacity: 0; transition: opacity .5s cubic-bezier(0.4, 0, 1, 1);}
#l-loading { z-index: calc(Infinity); display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; width: calc(var(--vw, 1vw) * 100); height: calc(var(--vh, 1vh) * 100); visibility: visible; opacity: 1; transition: visibility .3s linear, opacity .3s cubic-bezier(0, 0, 0.2, 1);}
.is-loaded #l-wrap { opacity: 1; transition-delay: .25s;}
.is-loaded #l-loading { visibility: hidden; opacity: 0;}

#l-loading .loader {
  width: 4.0rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(farthest-side, var(--c_black) 94%, #0000) top/0.5rem 0.5rem no-repeat,
    conic-gradient(#0000 30%, var(--c_black));
  -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 0.5rem), #000 0);
  mask: radial-gradient(farthest-side, #0000 calc(100% - 0.5rem), #000 0);
  animation: loading 1.2s infinite linear;
}
@keyframes loading {
  100% { transform: rotate(1turn);}
}

/*----------------------------------------------------------
  module
----------------------------------------------------------*/
/* grid */
.grid {
  display: flex;
  flex-direction: column;
  margin: 0 auto;
}
.grid-col {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 0 auto;
}
.grid-col.grid-rev {
  flex-direction: row-reverse;
}
@media screen and (min-width: 768px) {
  .grid {
    flex-direction: row;
    justify-content: space-between;
  }
  .grid-rev {
    flex-direction: row-reverse;
  }
}

/* title, text */
.head__title {
  position: relative;
  text-align: center;
  margin-bottom: 0.4rem;
  padding-bottom: 2.1rem;
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: 0.4em;
  text-indent: 0.4em;
}
.head__title::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: 0;
  width: 0.1rem;
  height: 1.6rem;
  background-color: var(--c_gray);
}
.head__ttl {
  text-align: center;
  font-size: 2.0rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-indent: 0.05em;
}
.head__text {
  text-align: center;
  margin-top: 0.3rem;
  color: #585a60;
  font-size: 1.2rem;
  letter-spacing: 0.08em;
  text-indent: 0.08em;
}
@media screen and (min-width: 768px) {
  .head__title {
    padding-bottom: 2.7rem;
    font-size: 2.0rem;
  }
  .head__ttl {
    font-size: 3.6rem;
  }
  .head__text {
    margin-top: 0.1rem;
    font-size: 1.5rem;
  }
}

/* list */
ul.disc {
  margin-right: -0.3em;
	padding-left: 1.2em;
}
ul.disc li {
  margin-top: 0.75em;
	list-style: disc;
}

/* link, btn */
.link__text a {
  padding-block: 0.5em;
}
a.link__line {
	--link_bg_h: 1px;
	display: inline;
	padding-bottom: 1px;
	background: linear-gradient(0deg, var(--c_black), var(--c_black)) no-repeat right bottom / 100% var(--link_bg_h);
	transition: background-size .35s;
}

a.link__line:focus-visible {
	background-size: 0 var(--link_bg_h);
	background-position-x: right;
}
@media (any-hover: hover) {
	a.link__line:hover {
		background-size: 0 var(--link_bg_h);
		background-position-x: right;
	}
}

.link__icon,
.link__btn {
  width: max-content;
  margin-inline: auto;
}
.link__ar a,
.link__icon a,
.link__icon .link__wide,
.link__btn a,
.link__btn button {
  text-align: center;
  position: relative;
  display: flex;
  align-items: center;
  font-weight: 700;
}
.link__ar a::after,
.link__icon a::after,
.link__icon .link__wide::after,
.link__btn a::after,
.link__btn button::after {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  border: 0px;
  border-top: solid 1px var(--c_white);
  border-right: solid 1px var(--c_white);
  transform: rotate(45deg) translate(0, -50%);
}
.link__icon a::before,
.link__icon .link__wide::before,
.link__btn a::before,
.link__btn button::before {
  content: "";
  position: absolute;
  top: 50%;
  border-radius: 50%;
  transform: translate(0, -50%);
}

.link__ar a {
  padding: 0.1em 0 0.1em 1.2rem;
}
.link__ar a::after {
  left: -0.2rem;
  width: 0.4rem;
  height: 0.4rem;
}
.link__icon a,
.link__icon .link__wide {
  padding: 1em 2.4rem 1em 0;
  font-size: 1.0rem;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
}
.link__icon a::after,
.link__icon .link__wide::after {
  right: 0.9rem;
  width: 0.5rem;
  height: 0.5rem;
}
.link__icon a::before,
.link__icon .link__wide::before {
  right: 0;
  width: 1.8rem;
  height: 1.8rem;
  background-color: var(--c_black);
}
.link__icon.link__back {
  margin-inline: auto;
}
.link__icon.link__back a {
  padding: 1em 0 1em 2.4rem;
}
.link__icon.link__back a::after {
  top: calc(50% - 0.5rem);
  left: 1.0rem;
  transform: rotate(225deg) translate(0, -50%);
}
.link__icon.link__back a::before {
  left: 0;
}
.link__btn a,
.link__btn button {
  justify-content: center;
  min-width: 31.1rem;
  height: 5.2rem;
  padding-inline: 3.2rem 6.4rem;
  border-radius: 100vh;
  background-color: var(--c_black);
  color: var(--c_white);
  font-size: 1.4rem;
  letter-spacing: 0.05em;
  text-indent: 0.05em;
}
.link__btn a::after,
.link__btn button::after {
  right: 4.2rem;
  width: 0.5rem;
  height: 0.5rem;
  border-color: var(--c_black);
}
.link__btn a::before,
.link__btn button::before {
  right: 3.2rem;
  width: 2.0rem;
  height: 2.0rem;
  background-color: var(--c_white);
}
.link__btn.icon-dl a::after,
.link__btn.icon-dl button::after {
  right: 4.1rem;
  border-top: 0;
  border-right: solid 1px var(--c_white);
  border-bottom: solid 1px var(--c_white);
}
.link__btn.link__back a,
.link__btn.link__back button {
  padding: 1em 2.4rem 1em 0;
}
.link__btn.link__back a::after,
.link__btn.link__back button::after {
  top: calc(50% - 0.5rem);
  left: 4.2rem;
  transform: rotate(225deg) translate(0, -50%);
}
.link__btn.link__back a::before,
.link__btn.link__back button::before {
  left: 3.2rem;
}
@media screen and (min-width: 768px) {
  .link__icon a,
  .link__icon .link__wide {
    padding-right: 2.6rem;
    font-size: 1.3rem;
  }
  .link__icon a::after,
  .link__icon .link__wide::after {
    right: 1.0rem;
  }
  .link__icon a::before,
  .link__icon .link__wide::before {
    width: 2.0rem;
    height: 2.0rem;
  }
  .link__btn a,
  .link__btn button {
    height: 6.0rem;
    font-size: 1.6rem;
  }
}

.link__icon a:focus-visible,
.link__wide-wrap:focus-visible .link__icon .link__wide {
  color: var(--c_link_hover);
}
.link__icon a:focus-visible::before,
.link__wide-wrap:focus-visible .link__icon .link__wide::before,
.link__btn a:focus-visible,
.link__btn button:focus-visible {
  background-color: var(--c_link_hover);
}
@media (any-hover: hover) {
  .link__icon a:hover,
  .link__wide-wrap:hover .link__icon .link__wide {
    color: var(--c_link_hover);
  }
  .link__icon a:hover::before,
  .link__wide-wrap:hover .link__icon .link__wide::before,
  .link__btn a:hover,
  .link__btn button:hover {
    background-color: var(--c_link_hover);
  }
}

/* mv__down */
.mv__down,
.mv__down::after,
.mv__down::before {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
}
.mv__down {
  padding-bottom: 3.6rem;
  color: var(--c_white);
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.4em;
  text-indent: 0.4em;
}
.mv__down::after {
  content: "";
  width: 1px;
  height: 3.2rem;
  background-color: var(--c_white);
}
.mv__down::before {
  content: "";
  bottom: 3.0rem;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: var(--c_white);
  transform: translate(-50%, 0);
}
@media screen and (min-width: 768px) {
  .mv__down {
    padding-bottom: 3.8rem;
    font-size: 1.2rem;
  }
}

/* brand__slide */
.brand__slide>li {
  position: absolute;
  list-style: none;
  visibility: hidden;
  animation: anime_slider_fade 12s 0s infinite;
}
.brand__slide>li:nth-of-type(2) { animation-delay: 4s;}
.brand__slide>li:nth-of-type(3) { animation-delay: 8s;}
@keyframes anime_slider_fade {
  0% { visibility: visible; opacity: 0;}
  15% { opacity: 1;}
  33.3% { opacity: 1;}
  48.3% { opacity: 0;}
  100% { opacity: 0;}
}

/* news__content */
.news__list li {
  border-bottom: solid 1px #c4c7cc;
}
.news__list li a {
  position: relative;
  display: block;
  padding: 1.1rem 3.4rem 1.4rem 0;
}
.news__list li a::after {
  content: "";
  position: absolute;
  top: calc(50% - 1px);
  right: 0.9rem;
  width: 0.5rem;
  height: 0.5rem;
  border: 0px;
  border-top: solid 1px var(--c_white);
  border-right: solid 1px var(--c_white);
  transform: rotate(45deg) translate(0, -50%);
}
.news__list li a::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 50%;
  background-color: var(--c_black);
  transform: translate(0, -50%);
}
.news__list li a .news-list__date {
  display: block;
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-indent: 0.08em;
}
.news__list li a .news-list__title {
  display: block;
  margin-top: 0.2rem;
  font-size: 1.4rem;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .news__list li a {
    display: flex;
    padding: 1.2rem 3.4rem 1.1rem 0;
  }
  .news__list li a .news-list__date {
    width: 14.4rem;
    font-size: 1.8rem;
  }
  .news__list li a .news-list__title {
    margin-top: 0.3rem;
    font-size: 1.6rem;
  }
}
.news__list li a:focus-visible {
  background-color: #eff0f4;
}
@media (any-hover: hover) {
  .news__list li a:hover {
    background-color: #eff0f4;
  }
}

/*----------------------------------------------------------
  common layout
----------------------------------------------------------*/
#l-wrap {
  display: flex;
  flex-direction: column;
  min-height: calc(var(--vh, 1vh) * 100);
}
#l-wrap::before {
  content: "";
  z-index: 50;
  position: fixed;
  top: 0;
  left: 0;
  width: calc(var(--vw, 1vw) * 100);
  height: calc(var(--vh, 1vh) * 100);
  visibility: hidden;
  opacity: 0;
}
.is-opened #l-wrap::before { visibility: visible; opacity: 1;}

section { position: relative; display: block;}
section::after { clear: both; content: ""; display: block;}
.inner {
  text-align: left;
  position: relative;
  max-width: calc(var(--w_max) * 1px);
  margin-inline: auto;
  padding-inline: min(5.333vw, 9.0rem);
}
.inner * { box-sizing: border-box;}
.inner.inner_small {
  max-width: 960px;
  padding-inline: min(8.533vw, 24.0rem);
}

/* #l-main
----------------------------------------------------------*/
#l-main {
  padding-bottom: 4.8rem;
}
.lab-plain #l-main {
  padding-block: 2.6rem 3.0rem;
}
.lab-plain .cat__head {
  padding-bottom: 4.0rem;
}
@media screen and (min-width: 768px) {
  #l-main {
    padding-bottom: 9.6rem;
  }
  .lab-plain #l-main {
    padding-block: 5.7rem 8.7rem;
  }
  .lab-plain .cat__head {
    padding-bottom: 3.6rem;
  }
}

/* header
----------------------------------------------------------*/
#l-header {
  padding-block: 1.6rem;
}
#l-header .inner {
  max-width: calc(var(--w_full) * 1px);
  padding-inline: 0;
}
#l-header .header__logo {
  margin-left: 1.6rem;
}
#l-header .header__logo img {
  width: 12.8rem;
}
@media screen and (min-width: 768px) {
  #l-header {
    padding-block: 4.0rem;
  }
  #l-header .header__logo {
    margin-left: 4.0rem;
  }
  #l-header .header__logo img {
    width: 24.3rem;
  }
}
/* footer
----------------------------------------------------------*/
#l-footer {
  margin-top: auto;
  padding-block: 2.5rem 3.2rem;
  background: var(--c_black);
  color: var(--c_white);
}
#l-footer .footer__content .link__ar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.2rem 2.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-indent: 0.05em;
}
#l-footer .footer__content .is-current {
  display: none;
}
#l-footer .footer__sns {
  margin-top: 1.2rem;
}
#l-footer .footer__sns .link__sns {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.0rem;
}
#l-footer .footer__sns .link__sns li {
  width: 2.3rem;
}
#l-footer .footer__corp {
  text-align: center;
  margin-top: 1.7rem;
  padding-top: 2.2rem;
  border-top: solid 0.5px #abacb0;
}
#l-footer .footer-corp__content .link__text {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;
  font-size: 1.1rem;
  letter-spacing: 0.05em;
  text-indent: 0.05em;
}
#l-footer .footer__corp .footer__copy {
  margin-top: 0.9rem;
  font-size: 1.0rem;
  font-weight: 500;
  letter-spacing: 0.03em;
}
@media screen and (min-width: 768px) {
  #l-footer {
    padding-top: 2.4rem;
  }
  #l-footer .inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  #l-footer .footer__content {
    flex-grow: 1;
  }
  #l-footer .footer__content .link__ar {
    justify-content: left;
    margin-left: -0.2rem;
  }
  #l-footer .footer__sns {
    margin-top: 0;
  }
  #l-footer .footer__sns .link__sns li {
    width: 2.9rem;
  }
  #l-footer .footer__corp {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    margin-top: 1.6rem;
    padding-top: 1.1rem;
  }
  #l-footer .footer-corp__content .link__text {
    gap: 3.2rem;
    font-size: 1.4rem;
  }
  #l-footer .footer__corp .footer__copy {
    margin-top: 0;
    font-size: 1.3rem;
  }
}

#l-footer a:focus-visible {
    color: var(--c_gray);
}
@media (any-hover: hover) {
  #l-footer a:hover {
    color: var(--c_gray);
  }
}
