@charset "UTF-8";
/*====================================================
//// webフォント読み込み
====================================================*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@100..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap");
/* font-family
----------------------------------------------------*/
/* 画面サイズ
----------------------------------------------------*/
html {
  font-size: 62.5%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

@media screen and (min-width: 768px) and (max-width: 1190px) {
  html {
    font-size: 0.8403361345vw;
  }
}
/*====================================================
//// カラーコード
====================================================*/
:root {
  --main-color01: #0072BE;
  --main-color02: #ECF0FC;
  --txt-color: #000000;
}

/*====================================================
////アニメーション設定
====================================================*/
.effect {
  opacity: 0;
  transition: opacity 0.5s;
}
.effect.active {
  opacity: 1;
}

/*====================================================
//// bg
====================================================*/
/*======================= PC =======================*/
/*====================================================
////common
====================================================*/
/* ---------- 基本設定 ----------*/
body {
  font-size: 1.6rem;
  max-width: 100vw;
  overflow-x: hidden;
  font-family: "Noto Sans", sans-serif;
}

img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
}

a {
  display: block;
  transition: 0.3s;
  text-decoration: none;
  color: inherit;
}

/* ---------- レスポンシブ切り替え ----------*/
.only-sp {
  display: block !important;
}
@media screen and (min-width: 768px) {
  .only-sp {
    display: none !important;
  }
}

.only-pc {
  display: none !important;
}
@media screen and (min-width: 768px) {
  .only-pc {
    display: block !important;
  }
}

.inner {
  width: 89.3333333333%;
  margin: 0 auto;
}
@media screen and (min-width: 768px) {
  .inner {
    max-width: 108.6rem;
  }
}
.inner.narrow {
  max-width: 80rem;
}

main {
  margin-top: 6.6rem;
}
@media screen and (min-width: 768px) {
  main {
    margin-top: 10rem;
  }
}

/*====================================================
//// header
====================================================*/
.header {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 99999;
  transition: 0.3s;
}
.header__wrap {
  background-color: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16);
  width: 100%;
  height: 6.6rem;
  position: relative;
  z-index: 10;
}
.header.close {
  top: -6.6rem;
}
.header__inner {
  margin: 0 2rem;
  padding: 1rem 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  z-index: 9999;
}
.header__logo {
  width: 71.6417910448%;
}
.header__menu-btn {
  width: 6.2rem;
  height: 2.6rem;
  position: relative;
}
.header__menu-btn span {
  position: absolute;
  left: 0;
  width: 2.1rem;
  height: 2px;
  background-color: var(--main-color01);
  transition: opacity 0.3s, transform 0.3s;
}
.header__menu-btn span:first-child {
  top: 0.1rem;
}
.header__menu-btn span:nth-child(2) {
  top: 50%;
}
.header__menu-btn span:last-child {
  bottom: 0.1rem;
}
.header__menu-btn::before, .header__menu-btn::after {
  color: var(--main-color01);
  font-size: 1.2rem;
  line-height: 2.1666666667;
  font-weight: 700;
  position: absolute;
  right: 0.1rem;
  top: 50%;
  transform: translateY(-50%);
}
.header__menu-btn::before {
  content: "MENU";
  opacity: 1;
}
.header__menu-btn::after {
  content: "CLOSE";
  opacity: 0;
}
.header__menu-btn.active span:first-child {
  transform: rotate(45deg);
  top: 1.2rem;
}
.header__menu-btn.active span:nth-child(2) {
  opacity: 0;
}
.header__menu-btn.active span:last-child {
  transform: rotate(-45deg);
  bottom: 1.2rem;
}
.header__menu-btn.active::before {
  opacity: 0;
}
.header__menu-btn.active::after {
  opacity: 1;
}
.header__nav {
  background-color: #F6F8FF;
  position: absolute;
  top: 6.6rem;
  left: 0;
  width: 100%;
  transition: transform 0.3s;
  transform: translateY(-100vh);
  min-height: 48rem;
  z-index: 1;
}
.header__nav.active {
  transform: translateY(0);
}
.header__nav .inner {
  width: 72.5333333333%;
  margin: auto;
  padding-top: 3.585rem;
}
.header__nav--menu li {
  border-bottom: 1px solid var(--main-color01);
}
.header__nav--menu li a {
  display: block;
  padding: 2.6rem 0;
  font-size: 2rem;
  line-height: 1.4;
  font-weight: 400;
  text-align: center;
}
.header__nav--sub {
  text-align: center;
  margin-top: 4.501rem;
}
.header__nav--sub li a {
  font-size: 1.4rem;
  line-height: 2;
  font-weight: 400;
}
.header__nav--sub li:last-child {
  margin-top: 0.661rem;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .header {
    width: 100%;
  }
  .header__wrap {
    height: 10rem;
    width: 100%;
  }
  .header.close {
    top: -10rem;
  }
  .header__inner {
    margin: 0;
    padding: 2.6rem 8rem;
  }
  .header__logo {
    max-width: 37.5rem;
  }
  .header__logo a {
    opacity: 1;
    transition: opacity 0.3s;
  }
  .header__logo a:hover {
    opacity: 0.8;
  }
  .header__pc-nav--menu {
    display: flex;
    gap: 3.6rem;
    justify-content: flex-end;
    align-items: center;
    height: 100%;
  }
  .header__pc-nav--menu a {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
    transition: color 0.3s;
  }
  .header__pc-nav--menu a:hover {
    color: var(--main-color01);
  }
}
/*====================================================
//// footer
====================================================*/
.footer__copy {
  background-color: var(--main-color01);
}
.footer__copy small {
  display: block;
  color: #fff;
  text-align: center;
  font-size: 1.2rem;
  line-height: 4.1666666667;
  font-weight: 400;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .footer {
    background-color: #ECEFF2;
    padding-top: 6.4rem;
  }
  .footer__wrap {
    max-width: 108.6rem;
    margin: auto;
  }
  .footer .inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
  }
  .footer__logo {
    width: 36rem;
  }
  .footer__nav {
    width: 31rem;
    padding-bottom: 6.3rem;
  }
  .footer__nav--list, .footer__nav--sub {
    display: flex;
    gap: 2.4rem;
    justify-content: flex-end;
    transition: color 0.3s;
  }
  .footer__nav--list a:hover, .footer__nav--sub a:hover {
    color: var(--main-color01);
  }
  .footer__nav--list {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
  }
  .footer__nav--sub {
    font-size: 1.4rem;
    line-height: 2;
    font-weight: 400;
    margin-top: 0.7rem;
  }
  .footer__copy small {
    max-width: 108.6rem;
    margin: auto;
    text-align: right;
    font-size: 1.4rem;
    line-height: 3.5714285714;
    font-weight: 400;
  }
}
/*====================================================
//// Fixed contents
====================================================*/
/*======================= PC =======================*/
/*====================================================
//// layout
====================================================*/
.page-title {
  font-size: 3rem;
  line-height: 1.5;
  font-weight: 700;
  font-family: "Ubuntu", sans-serif;
  color: var(--main-color01);
  text-align: center;
  padding-top: 8rem;
}

.section-title {
  font-size: 2.4rem;
  line-height: 1.5;
  font-weight: 700;
  font-family: "Ubuntu", sans-serif;
  color: var(--main-color01);
  position: relative;
  padding-bottom: 0.8rem;
}
.section-title::after {
  content: "";
  width: 100%;
  height: 2px;
  background-color: var(--main-color01);
  position: absolute;
  left: 0;
  bottom: 0;
}
.section-title + p {
  margin-top: 2.4rem;
  font-size: 1.6rem;
  line-height: 1.6875;
  font-weight: 400;
}

.page {
  padding-bottom: 8.24rem;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .page-title {
    font-size: 4rem;
    line-height: 1.4;
    padding-top: 6rem;
  }
  .section-title {
    font-size: 2.8rem;
    line-height: 1.5714285714;
    font-weight: 700;
    padding-bottom: 1rem;
  }
  .section-title + p {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
  }
  .page {
    padding-bottom: 16rem;
  }
}
/*====================================================
//// button
====================================================*/
.btn a {
  padding: 0 1rem;
  border-width: 1px;
  border-style: solid;
  font-size: 1.4rem;
  line-height: 3.9285714286;
  font-weight: 400;
  position: relative;
}
@media screen and (min-width: 768px) {
  .btn a {
    font-size: 1.4rem;
    line-height: 3.5714285714;
    font-weight: 400;
    padding: 0 0.8rem;
  }
}
.btn a::after {
  content: "";
  background-repeat: no-repeat;
  background-size: cover;
  width: 0.8rem;
  aspect-ratio: 10/10;
  position: absolute;
  right: 1.6rem;
  top: 50%;
  transform: translateY(-50%);
  transition: right 0.3s;
}
.btn a:hover::after {
  right: 1.3rem;
}
.btn.bg-blue a {
  border-color: #fff;
  color: #fff;
  background-color: var(--main-color01);
}
.btn.bg-blue a::after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.649902%204.13656C0.290917%204.13656%20-9.76324e-05%204.42757%20-9.76324e-05%204.78656C-9.76324e-05%205.14555%200.290917%205.43656%200.649902%205.43656V4.78656V4.13656ZM9.10952%205.24618C9.36336%204.99234%209.36336%204.58078%209.10952%204.32694L4.97295%200.190366C4.71911%20-0.0634747%204.30755%20-0.0634747%204.05371%200.190366C3.79987%200.444207%203.79987%200.855764%204.05371%201.1096L7.73066%204.78656L4.05371%208.46352C3.79987%208.71736%203.79987%209.12891%204.05371%209.38275C4.30755%209.63659%204.71911%209.63659%204.97295%209.38275L9.10952%205.24618ZM0.649902%204.78656V5.43656H8.6499V4.78656V4.13656H0.649902V4.78656Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fsvg%3E");
}
.btn.bg-blue a:hover {
  background-color: #fff;
  color: var(--main-color01);
}
.btn.bg-blue a:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.649902%204.13658C0.290917%204.13658%20-9.76324e-05%204.42759%20-9.76324e-05%204.78658C-9.76324e-05%205.14556%200.290917%205.43658%200.649902%205.43658V4.78658V4.13658ZM9.10952%205.24619C9.36336%204.99235%209.36336%204.5808%209.10952%204.32696L4.97295%200.190382C4.71911%20-0.0634594%204.30755%20-0.0634594%204.05371%200.190382C3.79987%200.444222%203.79987%200.855779%204.05371%201.10962L7.73066%204.78658L4.05371%208.46353C3.79987%208.71737%203.79987%209.12893%204.05371%209.38277C4.30755%209.63661%204.71911%209.63661%204.97295%209.38277L9.10952%205.24619ZM0.649902%204.78658V5.43658H8.6499V4.78658V4.13658H0.649902V4.78658Z%22%20fill%3D%22%230072BE%22%2F%3E%0A%3C%2Fsvg%3E");
}
.btn.bg-white a {
  border-color: var(--main-color01);
  color: var(--main-color01);
  background-color: #fff;
}
.btn.bg-white a::after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.649902%204.13658C0.290917%204.13658%20-9.76324e-05%204.42759%20-9.76324e-05%204.78658C-9.76324e-05%205.14556%200.290917%205.43658%200.649902%205.43658V4.78658V4.13658ZM9.10952%205.24619C9.36336%204.99235%209.36336%204.5808%209.10952%204.32696L4.97295%200.190382C4.71911%20-0.0634594%204.30755%20-0.0634594%204.05371%200.190382C3.79987%200.444222%203.79987%200.855779%204.05371%201.10962L7.73066%204.78658L4.05371%208.46353C3.79987%208.71737%203.79987%209.12893%204.05371%209.38277C4.30755%209.63661%204.71911%209.63661%204.97295%209.38277L9.10952%205.24619ZM0.649902%204.78658V5.43658H8.6499V4.78658V4.13658H0.649902V4.78658Z%22%20fill%3D%22%230072BE%22%2F%3E%0A%3C%2Fsvg%3E");
}
.btn.bg-white a:hover {
  background-color: var(--main-color01);
  color: #fff;
}
.btn.bg-white a:hover::after {
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%2210%22%20viewBox%3D%220%200%2010%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M0.649902%204.13656C0.290917%204.13656%20-9.76324e-05%204.42757%20-9.76324e-05%204.78656C-9.76324e-05%205.14555%200.290917%205.43656%200.649902%205.43656V4.78656V4.13656ZM9.10952%205.24618C9.36336%204.99234%209.36336%204.58078%209.10952%204.32694L4.97295%200.190366C4.71911%20-0.0634747%204.30755%20-0.0634747%204.05371%200.190366C3.79987%200.444207%203.79987%200.855764%204.05371%201.1096L7.73066%204.78656L4.05371%208.46352C3.79987%208.71736%203.79987%209.12891%204.05371%209.38275C4.30755%209.63659%204.71911%209.63659%204.97295%209.38275L9.10952%205.24618ZM0.649902%204.78656V5.43656H8.6499V4.78656V4.13656H0.649902V4.78656Z%22%20fill%3D%22white%22%2F%3E%0A%3C%2Fsvg%3E");
}

/*====================================================
//// breadcrumb
====================================================*/
.breadcrumb__list {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 2.4rem;
  padding-top: 1.2rem;
}
.breadcrumb__list li {
  font-size: 1.2rem;
  line-height: 1.5;
  font-weight: 400;
  position: relative;
  color: var(--main-color01);
}
.breadcrumb__list li a {
  color: #000;
}
.breadcrumb__list li a:hover {
  color: var(--main-color01);
}
.breadcrumb__list li::after {
  content: "";
  width: 0.8rem;
  height: 1px;
  background-color: var(--main-color01);
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -1.5rem;
}
.breadcrumb__list li:last-child::after {
  content: none;
}

@media screen and (min-width: 768px) {
  .breadcrumb__list {
    padding-top: 3rem;
  }
}
/*====================================================
//// TOP
====================================================*/
.top-title {
  font-size: 4rem;
  line-height: 1.725;
  font-weight: 500;
  font-family: "Ubuntu", sans-serif;
}
@media screen and (min-width: 768px) {
  .top-title {
    font-size: 6rem;
    line-height: 1.15;
    font-weight: 500;
    white-space: nowrap;
  }
}
.top-title.white {
  color: #fff;
}

/*====================================================
//// FV
====================================================*/
.top-fv {
  background-image: url(../img/top/sp/fv_bg.jpg);
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  min-height: 60.4rem;
  position: relative;
  z-index: 1;
}
.top-fv::after {
  content: "";
  background-color: #000;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.22;
  z-index: 2;
  width: 100%;
  height: 100%;
}
.top-fv .inner {
  width: 94.1333333333%;
}
.top-fv h1 {
  color: #fff;
  font-size: 2.6rem;
  line-height: 1.3846153846;
  font-weight: 700;
  font-family: "Ubuntu", sans-serif;
  padding-top: 18.7rem;
  position: relative;
  z-index: 10;
  text-shadow: 0 0.4rem 0.4rem rgba(0, 0, 0, 0.4);
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .top-fv {
    background-image: url(../img/top/fv_bg.jpg);
    min-height: 66.8rem;
  }
  .top-fv h1 {
    font-size: 4rem;
    line-height: 1.4;
    padding-top: 22.1rem;
  }
}
/*====================================================
//// Company Profile
====================================================*/
.top-company {
  position: relative;
  max-width: 100%;
  overflow-x: hidden;
  padding: 6.4rem 0;
}
.top-company::after {
  content: "";
  width: 56.7rem;
  height: 56.7rem;
  background-color: #ECF0FC;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: absolute;
  z-index: -1;
  left: -25.2rem;
  top: -32.2rem;
  transform: scale(0);
  transition: transform 1s;
}
.top-company.active::after {
  transform: scale(1);
}
.top-company .block.img figure {
  margin-top: 1.6rem;
}
.top-company .block.txt {
  margin-top: 1.6rem;
  font-size: 1.6rem;
  line-height: 1.6875;
  font-weight: 400;
}
.top-company .btn {
  margin-top: 3.2rem;
}

@media screen and (min-width: 768px) {
  .top-company {
    padding: 10rem 0;
  }
  .top-company::after {
    width: 97rem;
    height: 97rem;
    left: -26rem;
    top: -38.7rem;
  }
  .top-company .top-title {
    white-space: nowrap;
  }
  .top-company .inner {
    display: flex;
    justify-content: space-between;
    gap: 4.3rem;
  }
  .top-company__left {
    width: 46.3rem;
  }
  .top-company .block.img {
    display: flex;
    gap: 1.6rem;
  }
  .top-company .block.img figure {
    margin-top: 0;
    width: calc((100% - 1.6rem) / 2);
  }
  .top-company .block.txt {
    margin-top: 1.6rem;
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
  }
  .top-company .btn {
    margin-top: 2.4rem;
    width: 19.2rem;
  }
}
/*====================================================
//// Business Content
====================================================*/
.top-business {
  background-color: var(--main-color01);
  color: #fff;
  padding: 6.4rem 0;
}
.top-business .top-title {
  font-size: 4rem;
  line-height: 1.725;
  letter-spacing: -0.02em;
}
.top-business .block.left figure {
  margin-top: 1.6rem;
}
.top-business .block__txt {
  margin-top: 1.6rem;
}
.top-business .block__txt--head {
  font-size: 1.8rem;
  line-height: 1.4444444444;
  font-weight: 700;
  font-family: "Ubuntu", sans-serif;
}
.top-business .block__txt--list {
  margin-top: 0.2rem;
}
.top-business .block__txt--list li {
  font-size: 1.6rem;
  line-height: 1.6875;
  font-weight: 400;
}
.top-business .block__txt--list li::before {
  content: "・";
  display: inline-block;
}
.top-business .btn {
  margin-top: 3.5rem;
}

@media screen and (min-width: 768px) {
  .top-business {
    padding: 10rem 0;
  }
  .top-business .top-title {
    font-size: 6rem;
    line-height: 1.15;
  }
  .top-business .inner {
    display: flex;
    gap: 4.3rem;
    justify-content: space-between;
  }
  .top-business .block.right {
    order: 2;
  }
  .top-business .block.left {
    width: 58rem;
    order: 1;
  }
  .top-business .block.left figure {
    margin-top: 0;
  }
  .top-business .block__txt {
    margin-top: 1.6rem;
  }
  .top-business .block__txt--head {
    font-size: 2rem;
    line-height: 1.5;
    font-weight: 700;
  }
  .top-business .block__txt--list {
    margin-top: 0.2rem;
  }
  .top-business .block__txt--list li {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
  }
  .top-business .btn {
    margin-top: 2.5rem;
    width: 19.2rem;
    transform: translateX(1rem);
  }
}
/*====================================================
//// Careers
====================================================*/
.top-careers {
  padding: 6.4rem 0 34.4rem;
  overflow: hidden;
  max-width: 100%;
  position: relative;
}
.top-careers::after {
  content: "";
  width: 56.7rem;
  height: 56.7rem;
  background-color: #ECF0FC;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: absolute;
  z-index: -1;
  right: -25.2rem;
  bottom: -13.2rem;
  transform: scale(0);
  transition: transform 1s;
}
.top-careers.active::after {
  transform: scale(1);
}
.top-careers .block.right {
  margin-top: 1.6rem;
}
.top-careers .block.right > p {
  font-size: 1.8rem;
  line-height: 1.4444444444;
  font-weight: 700;
  font-family: "Ubuntu", sans-serif;
}
.top-careers .block__txt li {
  margin-top: 2rem;
}
.top-careers .block__txt li h3 {
  font-size: 1.6rem;
  line-height: 1.75;
  font-weight: 700;
}
.top-careers .block__txt li p {
  margin-top: 1rem;
  font-size: 1.6rem;
  line-height: 1.6875;
  font-weight: 400;
  padding-left: 1.2rem;
}
.top-careers .btn {
  margin-top: 3.2rem;
}

@media screen and (min-width: 768px) {
  .top-careers {
    padding: 10rem 0 34.4rem;
    overflow: hidden;
  }
  .top-careers::after {
    width: 97rem;
    height: 97rem;
    right: -26rem;
    bottom: -38.7rem;
  }
  .top-careers .inner {
    display: flex;
    gap: 4.3rem;
    justify-content: space-between;
  }
  .top-careers .block.left {
    padding-left: 0.2rem;
  }
  .top-careers .block.right {
    width: 58rem;
    margin-top: 0;
  }
  .top-careers .block.right > p {
    font-size: 2rem;
    line-height: 1.5;
  }
  .top-careers .block__txt li {
    margin-top: 1.8rem;
  }
  .top-careers .block__txt li h3 {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 700;
  }
  .top-careers .block__txt li p {
    margin-top: 0.8rem;
    font-size: 1.7rem;
    line-height: 1.5882352941;
    font-weight: 400;
    padding-left: 2rem;
  }
  .top-careers .btn {
    margin-top: 1.7rem;
    width: 19.2rem;
  }
}
/*====================================================
//// Group
====================================================*/
.top-group {
  background-color: #ECEFF2;
  position: relative;
  min-height: 44.5rem;
}
.top-group .inner {
  position: absolute;
  top: -28rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: #fff;
  padding: 2.9rem 5.629rem 3.345rem 5.629rem;
  box-shadow: 0 0 2rem rgba(0, 0, 0, 0.08);
  border-radius: 0.8rem;
  -webkit-border-radius: 0.8rem;
  -moz-border-radius: 0.8rem;
  -ms-border-radius: 0.8rem;
  -o-border-radius: 0.8rem;
}
.top-group__list {
  margin-top: 3.6rem;
  display: flex;
  flex-direction: column;
  gap: 3.6rem 0;
}
.top-group__list li {
  max-width: 22.2rem;
}
.top-group__list li:nth-child(3) {
  max-width: 19.023rem;
}
.top-group__list li:last-child {
  max-width: 12.24rem;
}

@media screen and (min-width: 768px) {
  .top-group {
    min-height: 32rem;
  }
  .top-group .inner {
    top: -24rem;
    padding: 6.4rem 5.4rem 6.4rem 6.4rem;
    display: flex;
    gap: 20.5rem;
  }
  .top-group__list {
    margin-top: 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 0 6rem;
    align-items: center;
  }
  .top-group__list li {
    max-width: initial;
    width: calc((100% - 6rem) / 2);
  }
  .top-group__list li a:hover {
    opacity: 0.8;
  }
  .top-group__list li:first-child {
    flex-basis: 100%;
    margin-bottom: 3.3rem;
  }
  .top-group__list li:first-child a {
    width: 28.4rem;
  }
  .top-group__list li:nth-child(2) {
    max-width: initial;
    margin-bottom: 3.8rem;
  }
  .top-group__list li:nth-child(2) a {
    width: 25.2rem;
  }
  .top-group__list li:nth-child(3), .top-group__list li:nth-child(5) {
    max-width: initial;
    margin-bottom: 3.8rem;
  }
  .top-group__list li:nth-child(3) a, .top-group__list li:nth-child(5) a {
    width: 24.3rem;
  }
  .top-group__list li:nth-child(4) {
    max-width: initial;
    margin-bottom: 3.8rem;
  }
  .top-group__list li:nth-child(4) a {
    width: 23.7rem;
  }
  .top-group__list li:nth-child(6) {
    max-width: initial;
  }
  .top-group__list li:nth-child(6) a {
    width: 25.6rem;
  }
  .top-group__list li:last-child {
    max-width: initial;
  }
  .top-group__list li:last-child a {
    width: 15.6rem;
  }
}
/*====================================================
//// About
====================================================*/
.page-about__link {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 2.3rem 2.6rem;
  width: 90.7462686567%;
  margin: 6.4rem auto 0 auto;
}
.page-about__link li {
  width: calc((100% - 2.6rem) / 2);
}
.page-about__link li a {
  text-align: center;
  border-bottom: 1px solid #C8C8C8;
  font-size: 1.7rem;
  line-height: 1.6470588235;
  font-weight: 500;
  padding-bottom: 2.3rem;
  position: relative;
  transition: color 0.3s;
}
.page-about__link li a::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210%22%20height%3D%2213%22%20viewBox%3D%220%200%2010%2013%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%3Cpath%20d%3D%22M4.13662%200.650024C4.13662%200.291039%204.42764%202.44222e-05%204.78662%202.44379e-05C5.14561%202.44536e-05%205.43662%200.291039%205.43662%200.650024L4.78662%200.650024L4.13662%200.650024ZM5.24624%2012.1096C4.9924%2012.3635%204.58084%2012.3635%204.327%2012.1096L0.190427%207.97307C-0.0634139%207.71923%20-0.0634139%207.30767%200.190427%207.05383C0.444267%206.79999%200.855825%206.79999%201.10967%207.05383L4.78662%2010.7308L8.46358%207.05383C8.71742%206.79999%209.12897%206.79999%209.38281%207.05383C9.63666%207.30767%209.63666%207.71923%209.38281%207.97307L5.24624%2012.1096ZM4.78662%200.650024L5.43662%200.650024L5.43662%2011.65L4.78662%2011.65L4.13662%2011.65L4.13662%200.650024L4.78662%200.650024Z%22%20fill%3D%22%230072BE%22%2F%3E%0A%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: cover;
  width: 1.1rem;
  aspect-ratio: 11/13;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0.7rem;
  transition: bottom 0.3s;
}
.page-about__link li a:hover {
  color: var(--main-color01);
}
.page-about__link li a:hover::after {
  bottom: 0.4rem;
}
.page-about section {
  padding-top: 6.4rem;
}
.page-about section p {
  margin-top: 1.5rem;
}
.page-about section p:first-of-type {
  margin-top: 2.4rem;
}
.page-about__company figure {
  width: 23.512rem;
  margin: 2.4rem auto 0 auto;
}
.page-about__company figure a:hover {
  opacity: 0.8;
}
.page-about__philosophy h3 {
  font-size: 1.8rem;
  line-height: 1.4444444444;
  font-weight: 700;
  color: var(--main-color01);
  margin-top: 2.4rem;
  font-family: "Ubuntu", sans-serif;
}
.page-about__philosophy img {
  display: block;
  margin-top: 2.4rem;
}
.page-about__profile dl dt {
  color: var(--main-color01);
  font-size: 1.7rem;
  line-height: 1.6470588235;
  font-weight: 700;
  padding-top: 2.4rem;
}
.page-about__profile dl dd {
  font-size: 1.6rem;
  line-height: 1.6875;
  font-weight: 400;
  margin-top: 0.8rem;
  padding-bottom: 2.4rem;
  border-bottom: 1px solid #C8C8C8;
}
.page-about__profile dl dd:first-of-type {
  padding-bottom: 1.6rem;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .page-about__link {
    flex-wrap: nowrap;
    align-items: flex-end;
    justify-content: center;
    gap: 4.8rem;
    width: 70rem;
    margin: 6.4rem auto 0 auto;
  }
  .page-about__link li {
    width: 13.9rem;
  }
  .page-about__link li a {
    padding-bottom: 3.2rem;
  }
  .page-about__link li a::after {
    width: 1.1rem;
    bottom: 1.5rem;
  }
  .page-about__link li a:hover {
    color: var(--main-color01);
  }
  .page-about__link li a:hover::after {
    bottom: 1rem;
  }
  .page-about section {
    padding-top: 16rem;
  }
  .page-about__company figure {
    width: 38.8rem;
  }
  .page-about__philosophy h3 {
    font-size: 2rem;
    line-height: 1.5;
    margin-top: 2.4rem;
  }
  .page-about__philosophy img {
    display: block;
    margin-top: 2.4rem;
  }
  .page-about__profile {
    transform: translateY(-0.5rem);
  }
  .page-about__profile dl {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    align-items: stretch;
  }
  .page-about__profile dl dt {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 700;
    padding: 3.1rem 0;
    border-bottom: 1px solid #C8C8C8;
    width: 27.5%;
  }
  .page-about__profile dl dd {
    width: 72.5%;
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
    margin-top: 0;
    padding: 3.1rem 0;
  }
  .page-about__profile dl dd:first-of-type {
    padding: 3.2rem 0;
  }
}
/*====================================================
//// Our Services
====================================================*/
.page-services .section-title {
  margin-top: 6.4rem;
}
.page-services .block .txt {
  font-size: 1.6rem;
  line-height: 1.6875;
}
.page-services .block .txt p {
  margin-top: 1.5rem;
}
.page-services .block .txt p:first-of-type {
  margin-top: 2.4rem;
}
.page-services .block figure {
  margin-top: 2.4rem;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .page-services .section-title {
    margin-top: 15.5rem;
  }
  .page-services .section-title:first-of-type {
    margin-top: 10rem;
  }
  .page-services .block {
    display: flex;
    align-items: flex-start;
    gap: 2.4rem;
  }
  .page-services .block .txt {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    width: calc(100% - 37.6rem - 2.4rem);
  }
  .page-services .block figure {
    margin-top: 2.4rem;
    width: 37.6rem;
  }
}
/*====================================================
//// Contact
====================================================*/
.page-contact dl {
  margin-top: 6.4rem;
}
.page-contact dl dt {
  color: var(--main-color01);
  font-size: 1.7rem;
  line-height: 1.6470588235;
  font-weight: 700;
}
.page-contact dl dt:last-of-type {
  padding-top: 2.4rem;
}
.page-contact dl dd {
  font-size: 2rem;
  line-height: 1.4;
  font-weight: 700;
  margin-top: 0.8rem;
  padding-bottom: 1.6rem;
  border-bottom: 1px solid #C8C8C8;
}
.page-contact dl dd:last-of-type {
  font-size: 1.7rem;
  line-height: 1.5882352941;
  font-weight: 400;
  border-bottom: none;
  padding-bottom: 0;
}
.page-contact .map {
  aspect-ratio: 335/212;
  margin-top: 2.4rem;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .page-contact dl {
    margin-top: 10rem;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0;
  }
  .page-contact dl dt {
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 700;
    width: 22.5%;
    border-bottom: 1px solid #C8C8C8;
    padding-bottom: 3.2rem;
  }
  .page-contact dl dt:last-of-type {
    padding-top: 3.2rem;
    border: none;
  }
  .page-contact dl dd {
    width: 77.5%;
    margin-top: 0;
    padding-bottom: 3.2rem;
  }
  .page-contact dl dd:last-of-type {
    font-size: 1.7rem;
    line-height: 1.5882352941;
    font-weight: 400;
    border-bottom: none;
    padding-bottom: 0;
    padding-top: 3.2rem;
  }
  .page-contact .map {
    aspect-ratio: 335/212;
    margin-top: 3.6rem;
  }
}
/*====================================================
//// Privacy Policy
====================================================*/
.page-policy__body p {
  margin-top: 6.4rem;
  font-size: 1.7rem;
  line-height: 1.6470588235;
  font-weight: 400;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .page-policy .inner {
    max-width: 79.6rem;
  }
  .page-policy__body p {
    margin-top: 10.2rem;
    font-size: 1.7rem;
    line-height: 1.6470588235;
    font-weight: 400;
  }
}
/*====================================================
//// accessibility
====================================================*/
.page-accessibility .page-title + p {
  margin-top: 6.4rem;
}
.page-accessibility p {
  font-size: 1.6rem;
  line-height: 1.6875;
  font-weight: 400;
}
.page-accessibility h2 {
  margin-top: 2.4rem;
  font-size: 2rem;
  line-height: 1.5;
  font-weight: 700;
  color: var(--main-color01);
  font-family: "Ubuntu", sans-serif;
}
.page-accessibility h2 + p {
  margin-top: 0.8rem;
}

/*======================= PC =======================*/
@media screen and (min-width: 768px) {
  .page-accessibility .page-title + p {
    margin-top: 10rem;
  }
  .page-accessibility p {
    font-size: 1.7rem;
    line-height: 1.6470588235;
  }
  .page-accessibility h2 {
    font-size: 2.4rem;
    line-height: 1.5;
  }
}
/* 404
----------------------------------------------------*/
.error {
  text-align: center;
  padding: 7rem 0;
  min-height: calc(100svh - 6.6rem - 5rem);
}
.error .inner {
  width: 90.6666666667%;
}
.error h1 {
  color: var(--main-color01);
  font-size: 10rem;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.error h1 span {
  font-size: 4rem;
  line-height: 1;
  letter-spacing: 0em;
  margin-top: 1rem;
  display: block;
}
.error p {
  width: 85%;
  margin: 1.75rem auto 0 auto;
  font-size: 1.4rem;
  line-height: 1.5714285714;
}
.error .btn {
  max-width: 30rem;
  margin: 5.3rem auto 0 auto;
}
.error .btn a {
  font-size: 1.8rem;
  line-height: 1.5;
  font-weight: 700;
  border-radius: 3rem;
  -webkit-border-radius: 3rem;
  -moz-border-radius: 3rem;
  -ms-border-radius: 3rem;
  -o-border-radius: 3rem;
  padding: 1rem 0;
  border: 1px solid var(--main-color01);
}
.error .btn a::after {
  content: "";
  width: 0.8rem;
  height: 0.8rem;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  position: absolute;
  right: 2.5rem;
  top: 50%;
  transform: rotate(45deg) translateY(-50%);
  background-image: none;
}
.error .btn a:hover::after {
  border-color: var(--main-color01);
  right: 2rem;
  top: 50%;
  transform: rotate(45deg) translateY(-50%);
  background-image: none;
}

@media screen and (min-width: 768px) {
  .error {
    padding: 10rem 0;
    min-height: initial;
  }
  .error .inner {
    width: 90.6666666667%;
  }
  .error h1 {
    font-size: 15rem;
    line-height: 1;
  }
  .error h1 span {
    font-size: 6rem;
    line-height: 1;
    letter-spacing: 0em;
  }
  .error p {
    width: 85%;
    margin: 5rem auto 0 auto;
    font-size: 1.8rem;
    line-height: 1.4444444444;
  }
  .error .btn {
    max-width: 30rem;
    margin: 5.3rem auto 0 auto;
  }
  .error .btn a {
    padding: 1.5rem 0;
    font-size: 1.8rem;
    line-height: 1.5;
    font-weight: 700;
  }
}/*# sourceMappingURL=style.css.map */