@charset "utf-8";
/*----------------------------------------------------
	custom properties
----------------------------------------------------*/
:root {
  --color-main: #1f51d7;
  --color-gray-dark: gray;
  --color-gray-light: silver;
  --size-main: 1200px; /*メインコンテンツ幅*/

  --18px: clamp(14px, 0.4848vw + 12.1818px, 18px);
  --30px: clamp(22px, 0.9697vw + 18.3636px, 30px);
}

/*----------------------------------------------------
	共通
----------------------------------------------------*/
/*Google Material Symbols*/
.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 48;
}

/*----------------------------------------------------
	box
----------------------------------------------------*/
.main {
  width: min(100%, var(--size-main));
  margin-inline: auto;
  font-size: var(--18px);
  line-height: 1.8;
  padding-top: 4.5em;
  padding-bottom: 4.5em;
}
.container {
  width: min(100% - 2em, var(--size-main));
  margin-inline: auto;
}
.container.-w1000 { width: min(100% - 2em, 1000px); }
.container.-w900 { width: min(100% - 2em, 900px); }
.container.-center { max-inline-size: max-content; }
.container.-padding { padding-block: 3em; }
.container.-margin { margin-block: 5em; }
@media (min-width: 768px) {
  /* PC */
  .full-container {
    /*全幅*/
    margin: 0 calc(50% - 50vw);
    width: 100vw;
  }
  .full-container-back {
    /*背景全幅*/
    margin: 0 calc(50% - 50vw);
    padding: 0 calc(50vw - 50%);
    width: 100vw;
  }
  .full-right {
    /*右側へ要素を広げる*/
    flex: 1;
    margin-right: calc(50% - 50vw);
  }
  .full-left {
    /*左側へ要素を広げる*/
    flex: 1;
    margin-left: calc(50% - 50vw);
  }
}

/*----------------------------------------------------
	header
----------------------------------------------------*/
#check { display: none; }
@media (min-width: 1001px) { /* PC */
.header {
  position: sticky;
  top: 0;
  margin: 0 auto;
  z-index: 100;
  background: #fff;
  font-size: min(1.38vw, 18px);
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;

}
.header__inner {
  width: min(100% - 3em, 1390px);
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: height 0.3s ease-in-out; /* アニメーション */
  transform: translateY(0); /* 初期位置 */
  height: 140px;
}
.header__inner.shrink {
  height: 80px; /* 縮小後の高さ */
  transform: translateY(-2px); /* 上方向への移動量 */
}
.header__logo {
  padding-right: 1.5em;
  width: 26%;
}
.header__number {
  border-left: var(--color-main) 2px solid;
  border-right: var(--color-main) 2px solid;
  text-align: center;
  padding: 0 1em;
  margin-right: auto;
  height: min(4.75vw, 66px);
}
.header__number__tel {
  font-size: min(2.54vw, 33px);
  color: var(--color-main);
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
  display: flex;
  margin-bottom: .3em;
  white-space: nowrap;
}
.header__number__tel::before {
  justify-self: start;
  font-family: "Material Symbols Outlined";
  content: "call";
  font-variation-settings: "wght" 700;
}
.nav__sp__tel,
.nav__sp__fax { display: none; }
.header__contact__link {
  background: var(--color-main);
  padding: .5em 1em;
  border-radius: 100vh;
  color: #fff;
}

.header__nav { margin-right: 2em; }
.header__nav .nav__list { display: flex; list-style: none; }
.header__nav .nav__item { position: relative; z-index: 1; }
.header__nav .nav__item::after { content: ''; position: absolute; bottom: -1em; left: 15%; width: 70%; height: 2px; background: var(--color-main); transition: all .3s; transform: scale(0, 1); transform-origin: center top; }
.header__nav .nav__item:hover::after { transform: scale(1, 1); }
.header__nav .nav__item:hover .nav__sublist { visibility: visible; opacity: 1; }
.header__nav .nav__link { color: #000; padding-left: 1.25em; padding-right: 1.25em; text-decoration: none; display: block; }
.header__nav .nav__link:hover { color: var(--color-main); }
}
@media (max-width: 1000px) { /* SP */
.header { position: sticky; top: 0; z-index: 100; background: #fff; }
.header__inner { padding: 1em 0; }
.header__logo { width: 60%; max-inline-size: max-content; margin-inline: auto; text-align: center; }
.header__number,
.header__contact { display: none; }

.header__nav .nav__sp {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  right: -110%;
  z-index: 2;
  background: rgba(0,0,0,0.8);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.nav__sp__number {
  margin-top: 2em;
  color: #0090fb;
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}
.nav__sp__tel {
  font-size: 33px;
  display: flex;
}
.nav__sp__tel::before {
  justify-self: start;
  font-family: "Material Symbols Outlined";
  content: "call";
  font-variation-settings: "wght" 700;
}
.nav__sp__fax {
  margin-top: .5em;
  font-size: 20px;
}
.nav__sp__number a { color: #0090fb; }

.header__nav .nav__list { margin-top: -4em; }
.header__nav .nav__item { font-size: 24px; padding: .7em 0; list-style: none; }
.header__nav .nav__link { color: #fff; text-decoration: none; display: block; }

.header__nav .nav__button { background: var(--color-main) url("../images/nav_button.png") no-repeat; display: block; width: 50px; height: 50px; position: absolute; top: 10px; right: 10px; cursor: pointer; z-index: 200; }

#check:checked ~ .nav__sp { right: 0; transition: .4s; }
#check:checked ~ .nav__button { background-position: -50px 0; z-index: 300; }
}

/*----------------------------------------------------
	footer
----------------------------------------------------*/
.footer {
  border-top: #d7d7d7 2px solid;
}
.footer__inner {
  width: min(100% - 2em, var(--size-main));
  margin-inline: auto;
  clear: both;
  font-size: clamp(13px, 0.4926vw + 11.1527px, 18px);
  line-height: 1.7;
  margin-top: 2em;
  margin-bottom: 2em;
}
.footer__copyright {
  text-align: center;
  background: #d7d7d7;
  font-size: 14px;
  padding: .8em;
}
.footer__nav { align-self: flex-end; max-inline-size: max-content; margin-inline: auto; }
.footer__nav .nav__list { list-style: none; column-count: 2; flex-direction: column; }
.footer__nav .nav__item { border-left: var(--color-main) 2px solid; padding-left: 1em; }
.footer__nav .nav__link { color: var(--color-main); font-weight: bold; text-decoration: none; }

@media (min-width: 768px) { /* PC */
.footer__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.footer__contact { display: none; }
}
@media (max-width: 767px) { /* SP */
.footer__logo { max-inline-size: max-content; margin-inline: auto; }
.footer__nav { display: none; }
.footer__contact {
  background: var(--color-main);
  font-weight: bold;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 1em;
  overflow: hidden;
  z-index: 100;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
}
.footer__contact::before {
  justify-self: start;
  font-family: "Material Symbols Outlined";
  content: "mail";
  font-variation-settings: "wght" 500;
  font-size: 130%;
  margin-right: .5em;
}
.footer__contact__link { color: #fff; display: block; }
.pagetop { text-align: center; }
}
/*----------------------------------------------------
	line
----------------------------------------------------*/
hr { height: 0; border: 0; border-top: 1px solid var(--color-gray-dark); margin: 5em 0; }
@media (max-width: 767px) { /* SP */
hr { margin: 3em 0; }
}

/*----------------------------------------------------
	link
----------------------------------------------------*/
a { text-decoration: none; color: var(--color-main); }


/* -------- コンテンツを下からふわっと表示させるアニメーションの移動距離 -------- */

[data-aos="sample_amine1"] {
  transform: translateY(500px);/* 移動距離を指定 */
  transition-property: transform, opacity;
  opacity: 0;
}
[data-aos="sample_amine1"].aos-animate {
  transform: translateY(0px);
  opacity: 1;
}