@charset "utf-8";
/*----------------------------------------------------
	共通
----------------------------------------------------*/
body {
  font-size: min((var(--vw) * 100) * 18 / var(--size-main), 1.8rem);
}
@media (max-width: 767px) { /* SP */
body { font-size: 1.5rem; }
}

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

/*----------------------------------------------------
	custom properties
----------------------------------------------------*/
/* 本文：18pt,1.8送り */

:root {
  --vw: 1vw;
  --size-main: 1200; /*デザインのコンテンツ幅*/
  --height-nav: min(11.67vw, 140px);
  --color-main: #003cc8;
  --color-sub: #193082;
  --color-error: red;
  --color-gray-dark: #969696;
  --color-gray-light: #f4f4f4;
  --31px: min((var(--vw) * 100) * 31 / var(--size-main), 3.1rem);
  --18px: min((var(--vw) * 100) * 18 / var(--size-main), 1.8rem);
  --17px: min((var(--vw) * 100) * 17 / var(--size-main), 1.7rem);
  --16px: min((var(--vw) * 100) * 16 / var(--size-main), 1.6rem);
}

@media (max-width: 767px) { /* SP */
:root {
  --31px: 2.4rem;
  --18px: 1.6rem;
  --17px: 1.5rem;
  --16px: 1.5rem;
}
}


/*----------------------------------------------------
	box
----------------------------------------------------*/
.main {
  width: min(100%, var(--size-main) * 1px);
  margin-inline: auto;
  line-height: 1.8;
  font-weight: bold;
}
.container-inner {
  width: min(100% - 2em, var(--size-main) * 1px);
  margin-inline: auto;
}
.container-small-inner {
  width: min(100% - 2em, 800 * 1px);
  margin-inline: auto;
}
.container-table { 
  width: min(100% - 2em, 1000 * 1px);
  margin-inline: auto;
}
.container-center {
  max-inline-size: max-content;
  margin-inline: auto;
}

@media (min-width: 768px) { /* PC */
.container-full { /*全幅*/
  margin: 0 calc(50% - (var(--vw) * 50));
  width: calc(var(--vw) * 100);
}
.container-full-back { /*背景全幅*/
  margin: 0 calc(50% - (var(--vw) * 50));
  padding: 0 calc((var(--vw) * 50) - 50%);
  width: calc(var(--vw) * 100);
}
.full-right { /*右側へ要素を広げる*/
  flex: 1;
  margin-right: calc(50% - (var(--vw) * 50));
}
.full-left { /*左側へ要素を広げる*/
  flex: 1;
  margin-left: calc(50% - (var(--vw) * 50));
}
}

.-en {
  font-family: "Josefin Sans", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  text-align: center;
}

/*----------------------------------------------------
	header
----------------------------------------------------*/
#check { display: none; }
.header__link { scroll-margin-top: var(--height-nav); }
@media (min-width: 768px) { /* PC */
.header { position: sticky; top: 0; margin: 0 auto; z-index: 100; background: #fff; }
.header__inner {
  width: 100%;
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: var(--height-nav);
}

.header__logo {
  display: flex;
  align-items: center;
  margin-right: auto;
  gap: 1.2em;
}
.header__logo .-sub {
  font-size: min((var(--vw) * 100) * 17 / 1400, 11.7rem);
  letter-spacing: .075em;
}

.header__logo .-mark {
  width: 16.67vw;
  max-width: 200px;
  height: var(--height-nav);
  background: var(--color-main);
	display: flex;
	justify-content: center;
	align-items: center;
}
.header__logo .-mark_en { width: min(11.25vw, 135px); }
.header__logo .-mark_ja { width: min(14.17vw, 170px); }

.header__contact {
  justify-self: end;
  font-size: font-size: min((var(--vw) * 100) * 16 / 1400, 1.6rem);
	display: flex;
	justify-content: center;
	align-items: center;
  flex-direction: column;
  background: var(--color-main);
  color: #fff;
  border-top-left-radius: 100vh;
  border-bottom-left-radius: 100vh;
  width: 15vw;
  max-width: 180px;
  height: var(--height-nav);
}
.header__contact a { color: #fff; }
.header__contact::before {
  justify-self: start;
  font-family: 'Material Symbols Outlined';
  content: 'mail';
  font-variation-settings:'wght' 200;
  font-size: 160%;
  margin-bottom: .2em;
}
.header__contact:hover::before { content: 'drafts'; }
.header__contact::after { content: ''; }

.header__nav { letter-spacing: .075em; font-weight: bold; margin-right: 1em; 
  font-size: min((var(--vw) * 100) * 18 / 1400, 1.8rem);
}
.header__nav .nav__list { display: flex; list-style: none; }
.header__nav .nav__item { position: relative; z-index: 1; }
.header__nav .nav__item:first-child { display: none; }
.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__link { color: #000; padding-left: 1.3em; padding-right: 1.3em; text-decoration: none; display: block; }
.header__nav .nav__link:hover { color: #000; }
}
@media (max-width: 767px) { /* SP */
.header { position: sticky; top: 0; z-index: 100; background: #fff; }
.header__inner { padding: 1em 0; }

.header__logo { width: 100%; text-align: center; margin: 1em auto; }
.header__logo .-mark { display: none; }
.header__logo .-sub { margin-top: .7em; }
.header__contact { display: none; }

.header__nav .nav__list { width: 100vw; height: 100vh; position: fixed; top: 0; right: -110%; z-index: 2; background: rgba(0,0,0,0.8); list-style: none; text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.header__nav .nav__item:first-child { margin-bottom: .5em; }
.header__nav .nav__item { font-size: 2.4rem; padding: .7em 0; }
.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__list { right: 0; transition: .4s; }
#check:checked ~ .nav__button { background-position: -50px 0; z-index: 300; }
}

/*----------------------------------------------------
	pagetop
----------------------------------------------------*/
.pagetop { position: absolute; top: 2em; right: 0; }

/*----------------------------------------------------
	footer
----------------------------------------------------*/
.cta {
  background: url("../images/footer_back.jpg") repeat;
  display: flex;
	justify-content: flex-start;
	align-items: center;
}
.cta__flex { width: 50%; }
.cta__flex.-img img { object-fit: cover; width: 100%; min-height: 510px; }
.cta__flex.-contact { width: min(700px, 50vw); color: #fff; padding: 2em 3em; line-height: 1.8; }
.cta__flex.-contact .contact { font-weight: bold; }
.cta__flex.-contact .contact__en { font-size: var(--31px); text-align: left; }
.tel {
  display: flex;
  align-items: center;
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}
.tel__number {
  font-size: min((var(--vw) * 100) * 60 / var(--size-main), 6.0rem);
  font-family: "Oswald", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  line-height: 1;
}
.tel__icon { width: 4.83vw; max-width: 58px; margin-right: .5em; }
@media (max-width: 767px) { /* SP */
.cta a { color: #fff; }
.tel__number { font-size: 40px; }
.tel__icon { width: 40px; }
}



.cta__contact {
  padding: .5em;
  border: 2px solid #fff;
  color: #fff;
  transition: .3s;
  line-height: 1.5;
  border-radius: 100vh;
  display: flex;
  justify-content: center;
  column-gap: .5em;
  align-items: center;
}
.cta__contact:is(:hover, :focus) {
  background: #fff;
  border-color: currentColor;
  color: var(--color-main);
}
.cta__contact::before {
  justify-self: start;
  font-family: 'Material Symbols Outlined';
  content: 'mail';
  font-variation-settings:'wght' 200;
  font-size: 160%;
}
.cta__contact:hover::before {
  content: 'drafts';
}
.cta__contact::after {
  content: '';
}
@media (max-width: 767px) { /* SP */
.cta { flex-direction: column; }
.cta__flex { width: 100%; }
.cta__flex.-contact { width: 100%; padding: 2em; }
.cta__flex.-img img { min-height: 250px; }
}


.footer__inner { width: min(100% - 3em, 1000px); margin-inline: auto; clear: both; padding-top: 2em; position: relative; }
.footer__logo { font-size: 2.4rem; font-weight: bold; text-align: center; }
.footer__add { margin-top: .7em; text-align: center; line-height: 1.2; }
.footer__copyright { text-align: center; margin: 2em 0; font-size: 1.3rem; color: #969696; }

.footer__nav { margin-top: 1.5em; }
.footer__nav .nav__list { display: flex; list-style: none; justify-content: center; }
.footer__nav .nav__link { display: block; color: var(--color-main); font-weight: bold; text-decoration: none; padding: 0 2.5em 0 0; }

@media (min-width: 768px) { /* PC */
.footer__contact { display: none; }
}

@media (max-width: 767px) { /* SP */
.footer__nav .nav__link { padding: 0 1.5em 0 0; }
.footer__copyright { margin: 1em 0 8em 0; }

.footer__contact {
  background: var(--color-main);
  text-align: center;
  font-weight: bold;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 1.5em;
  overflow: hidden;
  z-index: 100;
}
.contact__list { list-style: none; }

.footer__contact .contact__link {
  list-style: none;
  color: #fff;
  font-size: 18px;
  display: grid;
  grid-auto-flow: column;
  justify-content: center;
  column-gap: 1em;
  align-items: center;
}
.contact__link::before {
  justify-self: start;
  font-family: 'Material Symbols Outlined';
  content: 'mail';
  font-variation-settings:'wght' 200;
  font-size: 160%;
}
.footer__contact .contact__link:hover::before { content: 'drafts'; }
.footer__contact .contact__link::after { content: ''; }
}

/*----------------------------------------------------
	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: #000; }
