@import url("https://fonts.googleapis.com/css2?family=Concert+One&family=Lilita+One&family=Noto+Sans+JP:wght@500;700&display=swap");
* {
  list-style: none;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
}

img,
picture {
  width: 100%;
  height: auto;
}

li {
  list-style-type: none;
}

.flex {
  display: flex;
}

.f-row {
  flex-direction: row;
}

.f-column {
  flex-direction: column;
}

.bold {
  font-weight: bold;
}

:root {
  --text-color: #000000;
  --text-color-gray: #5a5a5a;
  --text-color-red: #c8423c;
  --primary-color: #2c9afc;
  --sky-color-dark: #55adfe;
  --sky-color-light: #dbf0fd;
  --bg-color-gray: #dddddd;
  --bg-color-green: #bed2aa;
  --bg-color-purple: #cac1de;
  --bg-color-blue: #add3f5;
  --bg-color-pink: #eecfc7;
  --light-pink: #edcfc7;
  --dark-pink: #fa9793;
  --light-yellow: #f0c851;
  --dark-yellow: #fea01a;
  --light-green: #bed2aa;
  --dark-green: #68a8b0;
  --business-bg-color: #fef4c6;
  --business-yellow: #fdab49;
  --business-text: #fd900e;
  --seminar-bg-color: #bed2aa;
  --company-bg-color: #ebfdfc;
  --company-text-color: #68a8b0;
  --process-bg-color: #f9e6fe;
  --process-text-color: #9b37a1;
  --process-shape-color: #d68eda;
  --recruit-text-color: #7b5ac5;
  --recruit-light-purple: #b5a4da;
}

/*
Animate.css - https://daneden.me/animate
Licensed under the MIT license

Copyright (c) 2013 Daniel Eden

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*/
.fade__animation {
  opacity: 0;
}

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    transform: translateY(80px);
    -webkit-transform: translateY(80px);
    -moz-transform: translateY(80px);
    -ms-transform: translateY(80px);
    -o-transform: translateY(80px);
  }
  60% {
    opacity: 0.5;
    transform: translateY(-20px);
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
  }
  80% {
    opacity: 1;
    transform: translateY(10px);
  }
  100% {
    transform: translateY(0);
  }
}
.bounceInUp span {
  animation-fill-mode: both;
  animation-name: bounceInUp;
  animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

@keyframes fadeInBottomLeft {
  0% {
    opacity: 0;
    transform: translate3d(-30%, 20px, 0);
    -webkit-transform: translate3d(-30%, 20px, 0);
    -moz-transform: translate3d(-30%, 20px, 0);
    -ms-transform: translate3d(-30%, 20px, 0);
    -o-transform: translate3d(-30%, 20px, 0);
  }
  to {
    opacity: 1;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
  }
}
.animated.fadeInBottomLeft {
  animation-name: fadeInBottomLeft;
  transition: opacity 1s ease, transform 1s ease;
  -webkit-transition: opacity 1s ease, transform 1s ease;
  -moz-transition: opacity 1s ease, transform 1s ease;
  -ms-transition: opacity 1s ease, transform 1s ease;
  -o-transition: opacity 1s ease, transform 1s ease;
}

@keyframes fadeInBottomRight {
  0% {
    opacity: 0;
    transform: translate3d(30%, 20px, 0);
    -moz-transform: translate3d(30%, 20px, 0);
    -ms-transform: translate3d(30%, 20px, 0);
    -o-transform: translate3d(30%, 20px, 0);
    -webkit-transform: translate3d(30%, 20px, 0);
  }
  to {
    opacity: 1;
    transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
  }
}
.animated.fadeInBottomRight {
  animation-name: fadeInBottomRight;
  transition: opacity 1s ease, transform 1s ease;
  -webkit-transition: opacity 1s ease, transform 1s ease;
  -moz-transition: opacity 1s ease, transform 1s ease;
  -ms-transition: opacity 1s ease, transform 1s ease;
  -o-transition: opacity 1s ease, transform 1s ease;
}
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(40px);
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.animated.fadeInUp {
  animation-name: fadeInUp;
  transition: opacity 1s ease, transform 1s ease;
  -webkit-transition: opacity 1s ease, transform 1s ease;
  -moz-transition: opacity 1s ease, transform 1s ease;
  -ms-transition: opacity 1s ease, transform 1s ease;
  -o-transition: opacity 1s ease, transform 1s ease;
}

.header-navigation {
  position: relative;
  z-index: 21;
}
.header-navigation nav {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  padding: 0 0 0 2em;
  background-color: #fff;
}
.header-navigation nav a {
  display: block;
}
.header-navigation nav .headerLogo {
  display: flex;
  align-items: center;
}
.header-navigation nav .headerLogo a {
  display: flex;
  align-items: center;
}
@media only screen and (min-width: 910px) {
  .header-navigation nav .headerLogo a {
    padding-top: 10px;
  }
}
.header-navigation nav .headerNavMenu {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding-left: 4%;
}
.header-navigation nav .headerNavMenu ul {
  display: flex;
  justify-content: flex-end;
}
.header-navigation nav .headerNavMenu ul li a {
  color: var(--text-color);
  font-weight: 700;
  text-align: center;
}
.header-navigation nav .headerNavMenu .menuList {
  flex-direction: column;
  width: 100%;
}
.header-navigation nav .headerNavMenu .menuList ul li {
  position: relative;
  border-bottom: 2px solid transparent;
  margin: 0;
  margin-right: min(20px, 4%);
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
.header-navigation nav .headerNavMenu .menuList ul li br {
  display: none;
}
@media only screen and (min-width: 910px) {
  .header-navigation nav .headerNavMenu .menuList ul li {
    padding-bottom: 4px;
  }
  @keyframes border_anim {
    0% {
      width: 0;
    }
    100% {
      width: 100%;
    }
  }
  .header-navigation nav .headerNavMenu .menuList ul li::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 0;
    border-bottom: dashed 2px var(--primary-color);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
  }
  .header-navigation nav .headerNavMenu .menuList ul li:hover::before {
    animation: border_anim 0.3s linear forwards;
    -webkit-animation: border_anim 0.3s linear forwards;
  }
}
.header-navigation nav .headerNavMenu .menuList ul.topList li {
  margin-bottom: 0.5em;
}
.header-navigation nav .headerNavMenu .menuList ul.topList li {
  font-size: 14px;
}
@media screen and (min-width: 320px) {
  .header-navigation nav .headerNavMenu .menuList ul.topList li {
    font-size: calc(14px + 0 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  .header-navigation nav .headerNavMenu .menuList ul.topList li {
    font-size: 14px;
  }
}
@media only screen and (max-width: 1100px) and (min-width: 910px) {
  .header-navigation nav .headerNavMenu .menuList ul.topList li {
    font-size: 1.3vw;
  }
}
.header-navigation nav .headerNavMenu .menuList ul.bottomList li {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  .header-navigation nav .headerNavMenu .menuList ul.bottomList li {
    font-size: calc(16px + 0 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  .header-navigation nav .headerNavMenu .menuList ul.bottomList li {
    font-size: 16px;
  }
}
@media only screen and (max-width: 1100px) and (min-width: 910px) {
  .header-navigation nav .headerNavMenu .menuList ul.bottomList li {
    font-size: 1.4vw;
  }
}
.header-navigation nav .headerNavMenu ul.menuButtonList {
  min-width: 258px;
}
@media only screen and (min-width: 1120.1px) {
    .header-navigation nav .headerNavMenu ul.menuButtonList:has( .instaBtn) {
        min-width: 387px;
    }
    .header-navigation nav .headerNavMenu .menuList .instaBtn {
        display:none;
    }
}
@media only screen and (max-width: 1120px) {
    .header-navigation nav .headerNavMenu .menuList .instaBtn {
        display:block;
        padding: 1em 4%;
    }
    .header-navigation nav .headerNavMenu .menuList .instaBtn a {
        color: var(--text-color);
        font-weight: 700;
        display:flex;
        align-items: center;
        justify-content: center;
        gap:10px;
        padding:20px;
        background-color: var(--light-green);
        position: relative;
        overflow: hidden;
    }
}

.header-navigation nav .headerNavMenu ul.menuButtonList .menu-button {
  display: none;
}
.header-navigation nav .headerNavMenu ul.menuButtonList li {
  display: flex;
  align-items: center;
  flex-basis: 50%;
}
.header-navigation nav .headerNavMenu ul.menuButtonList li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 2;
  width: 100%;
  height: 100%;
  padding: 1em 0;
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.phoneBtn {
  padding: 0;
  background-color: var(--light-pink);
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.phoneBtn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-pink);
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transform: translateX(-100%);
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.phoneBtn:hover::before {
  transform: translateX(0);
}
@media only screen and (min-width: 910px) {
  .header-navigation nav .headerNavMenu ul.menuButtonList li.phoneBtn a img {
    margin-top: 2px;
    width: 24px;
  }
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.mailBtn {
  background-color: var(--light-yellow);
  position: relative;
  overflow: hidden;
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.mailBtn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-yellow);
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transform: translateX(-100%);
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.mailBtn:hover::before {
  transform: translateX(0);
}
@media only screen and (min-width: 910px) {
  .header-navigation nav .headerNavMenu ul.menuButtonList li.mailBtn a img {
    margin-top: 2px;
    width: 24px;
  }
}

.header-navigation nav .headerNavMenu ul.menuButtonList li.instaBtn {
  background-color: var(--light-green);
  position: relative;
  overflow: hidden;
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.instaBtn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-green);
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transform: translateX(-100%);
}
.header-navigation nav .headerNavMenu ul.menuButtonList li.instaBtn:hover::before {
  transform: translateX(0);
}
@media only screen and (min-width: 910px) {
  .header-navigation nav .headerNavMenu ul.menuButtonList li.instaBtn a img {
    margin-top: 2px;
    width: 20px;
  }
}

@media only screen and (max-width: 1120px) {
  .header-navigation {
    position: relative;
    width: 100vw;
  }
  .header-navigation nav .headerLogo {
    z-index: 22;
  }
  .header-navigation nav .headerLogo a img {
    display: block;
  }
  .header-navigation nav .headerNavMenu {
    justify-content: flex-end;
  }
  .header-navigation nav .headerNavMenu .menuList {
    position: absolute;
    right: 0;
    top: 100%;
    background-color: #ffffff;
    z-index: 12;
    flex-direction: column-reverse;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transform: translateX(100%);
    display: none;
    opacity: 0;
    padding: 1em 0 4em;
  }
  .header-navigation nav .headerNavMenu .menuList ul {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 4%;
    padding: 1em 4%;
  }
  .header-navigation nav .headerNavMenu .menuList ul li {
    flex-basis: 48%;
    font-size: 16px !important;
    border: unset !important;
    margin: 0 !important;
  }
  .header-navigation nav .headerNavMenu .menuList ul li br {
    display: none !important;
  }
  .header-navigation nav .headerNavMenu .menuList ul li a {
    text-align: left;
    border-bottom: 2px solid var(--primary-color);
    padding: 1em;
  }
  .header-navigation nav .headerNavMenu #menuList.open-menu {
    display: flex;
  }
  .header-navigation nav .headerNavMenu #menuList.animate-menu {
    transition: all 0.5s ease-in-out;
    opacity: 1;
    transform: translateX(0%);
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList {
    z-index: 22;
    min-width: unset;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList .menu-button {
    display: flex;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList li {
    padding: 0 !important;
    flex-basis: unset;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList li a {
    width: 100px;
    padding: 0;
    justify-content: center;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList li a p {
    display: none;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList li.instaBtn {
    display:none;
  }
}
@media only screen and (max-width: 768px) {
  .header-navigation nav {
    padding-left: 4%;
  }
  .header-navigation nav .headerLogo {
    margin-top: 3px;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList .menu-button svg {
    width: min(72px, 15vw) !important;
  }
  .header-navigation nav .headerNavMenu ul.menuButtonList li a {
    width: min(100px, 15vw);
  }
}
@media only screen and (max-width: 405px) {
  .header-navigation nav .headerNavMenu .menuList ul {
    padding: 0 4%;
  }
  .header-navigation nav .headerNavMenu .menuList ul li {
    flex-basis: 100%;
  }
}

/*Sub-page Only*/
.footer-navigation {
  position: relative;
  color: var(--text-color);
  font-weight: 700;
  background: linear-gradient(var(--sky-color-light) 20%, var(--sky-color-light) 20%, var(--sky-color-dark) 100%);
  padding-top: min(10em, 7vw);
}
.footer-navigation::before {
  position: absolute;
  content: "";
  top: 0;
  width: 100vw;
  height: 100%;
  max-height: min(90px, 10vw);
  background: rgb(255, 255, 255);
  -webkit-clip-path: polygon(0 0, 100% 0%, 50% 100%);
          clip-path: polygon(0 0, 100% 0%, 50% 100%);
}
.footer-navigation a {
  color: var(--text-color);
}
.footer-navigation .footer-header {
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
  justify-content: space-between;
  align-items: end;
  padding: 3em 4%;
}
.footer-navigation .footer-header .phoneButton a {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.footer-navigation .footer-header .formButton a {
  background-color: var(--light-yellow);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.8em 1.5em;
  gap: 5px;
  position: relative;
  overflow: hidden;
}
.footer-navigation .footer-header .formButton a {
  font-size: 18px;
}
@media screen and (min-width: 320px) {
  .footer-navigation .footer-header .formButton a {
    font-size: calc(18px + 0 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  .footer-navigation .footer-header .formButton a {
    font-size: 18px;
  }
}
.footer-navigation .footer-header .formButton a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--dark-yellow);
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transform: translateX(-100%);
}
.footer-navigation .footer-header .formButton a:hover::before {
  transform: translateX(0);
}
.footer-navigation .footer-header .formButton a img,
.footer-navigation .footer-header .formButton a p {
  z-index: 3;
}
@media only screen and (max-width: 910px) {
  .footer-navigation .footer-header {
    flex-direction: column-reverse;
    align-items: center;
    padding: 6em 4% 4em;
  }
  .footer-navigation .footer-header .formButton {
    width: 100%;
  }
  .footer-navigation .footer-header .formButton a {
    width: 100%;
    max-width: 333px;
    padding: 1.5em 0;
    margin: 0 auto;
    border-radius: 5px;
  }
  .footer-navigation .footer-header .formButton,
  .footer-navigation .footer-header .phoneButton {
    margin-bottom: max(4%, 2em);
  }
  .footer-navigation .footer-header .footerAccessDetails {
    width: 100%;
    max-width: 333px;
  }
  .footer-navigation .footer-header .footerAccessDetails .footerLogo {
    width: 100%;
  }
  .footer-navigation .footer-header .footerAccessDetails .footerLogo a {
    display: block;
    width: 100%;
  }
}
.footer-navigation nav {
  max-width: 1000px;
  padding: 1em 4%;
  width: 100%;
  margin: 0 auto;
}
.footer-navigation nav ul {
  width: 100%;
  flex-wrap: wrap;
}
.footer-navigation nav ul li {
  flex-basis: 11.1111111111%;
}
.footer-navigation nav ul li a {
  border-right: 1px solid currentColor;
  text-align: center;
  font-size: 0.8em;
  padding: 0 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
}
.footer-navigation nav ul li a {
  font-size: 10px;
}
@media screen and (min-width: 320px) {
  .footer-navigation nav ul li a {
    font-size: calc(10px + 3 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  .footer-navigation nav ul li a {
    font-size: 13px;
  }
}
.footer-navigation nav ul li:first-child a {
  border-left: 1px solid currentColor;
}
@media only screen and (max-width: 910px) {
  .footer-navigation nav ul {
    justify-content: unset;
    gap: 4%;
  }
  .footer-navigation nav ul li {
    flex-basis: 30.6666666667%;
    margin-bottom: 2em;
  }
  .footer-navigation nav ul li br {
    display: none;
  }
  .footer-navigation nav ul li a {
    padding-bottom: 0.5em;
    border: none;
    border-bottom: 1px solid currentColor;
  }
  .footer-navigation nav ul li a {
    font-size: 14px;
  }
}
@media only screen and (max-width: 910px) and (min-width: 320px) {
  .footer-navigation nav ul li a {
    font-size: calc(14px + 4 * ((100vw - 320px) / 980));
  }
}
@media only screen and (max-width: 910px) and (min-width: 1300px) {
  .footer-navigation nav ul li a {
    font-size: 18px;
  }
}
@media only screen and (max-width: 910px) {
  .footer-navigation nav ul li:first-child a {
    border-left: none;
  }
}
@media only screen and (max-width: 768px) {
  .footer-navigation nav ul {
    gap: 2%;
  }
  .footer-navigation nav ul li {
    margin-bottom: 1em;
    flex-basis: 49%;
  }
}
@media only screen and (max-width: 910px) {
  .footer-navigation nav {
    display: none;
  }
}
.footer-navigation .backgroundImage img {
  display: block;
}

.pageTopButton {
  position: fixed;
  bottom: 10px;
  right: 10px;
  z-index: 99;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
}
@media only screen and (min-width: 768px) {
  .pageTopButton:hover {
    cursor: pointer;
    filter: drop-shadow(0 0 0.75rem var(--primary-color));
    -webkit-filter: drop-shadow(0 0 0.75rem var(--primary-color));
  }
}
@media only screen and (max-width: 768px) {
  .pageTopButton {
    width: min(15vw, 100px);
    text-align: right;
    min-width: 60px;
  }
  .pageTopButton img {
    display: block;
    max-width: 100% !important;
  }
}

:root {
  font-family: "Noto Sans JP", sans-serif;
  font-style: normal;
  font-display: swap;
}

p {
  line-height: 1.8;
}

body.top {
  --v-height: 90px;
}
@media only screen and (max-width: 768px) {
  body.top {
    --v-height: 60px;
  }
}
body.top header {
  position: relative;
  background: linear-gradient(var(--sky-color-dark) 10%, var(--sky-color-light) 100%);
}
@media only screen and (min-width: 910px) {
  body.top header .header-navigation nav {
    background-color: transparent;
  }
  body.top header .header-navigation nav .headerLogo {
    display: none;
  }
  body.top header .header-navigation nav .headerNavMenu {
    padding-left: 0;
  }
  body.top header .header-navigation nav .headerNavMenu .menuList {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    width: 100%;
  }
  body.top header .header-navigation nav .headerNavMenu .menuList ul li {
    margin: 0 10px;
    padding-bottom: 5px;
  }
  body.top header .header-navigation nav .headerNavMenu .menuList ul li br {
    display: block;
  }
  body.top header .header-navigation nav .headerNavMenu .menuList ul li {
    font-size: 16px;
  }
}
@media only screen and (min-width: 910px) and (min-width: 320px) {
  body.top header .header-navigation nav .headerNavMenu .menuList ul li {
    font-size: calc(16px + 0 * ((100vw - 320px) / 980));
  }
}
@media only screen and (min-width: 910px) and (min-width: 1300px) {
  body.top header .header-navigation nav .headerNavMenu .menuList ul li {
    font-size: 16px;
  }
}
@media only screen and (min-width: 910px) and (max-width: 1220px) and (min-width: 910px) {
  body.top header .header-navigation nav .headerNavMenu .menuList ul li {
    font-size: 1.2vw;
  }
}
@media only screen and (min-width: 910px) and (min-width: 910px) {
  body.top header .header-navigation nav .headerNavMenu .menuList ul li::before {
    border-bottom-color: #000;
  }
}
@media only screen and (min-width: 910px) {
  body.top header .header-navigation nav .headerNavMenu .menuList ul.topList li:nth-of-type(3) {
    display: none;
  }
}
@media only screen and (min-width: 910px) {
  body.top header .header-navigation nav .headerNavMenu ul.menuButtonList {
    min-width: 260px;
  }
  body.top header .header-navigation nav .headerNavMenu ul.menuButtonList li.phoneBtn {
    display: none;
  }
}
@media only screen and (min-width: 910px) and (min-width: 911px) {
  body.top header .header-navigation nav .headerNavMenu ul.menuButtonList {
    filter: drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.3));
    -webkit-filter: drop-shadow(0 0 0.5rem rgba(0, 0, 0, 0.3));
  }
}
@media only screen and (min-width: 910px) {
  body.top header .header-navigation nav .headerNavMenu ul.menuButtonList li.mailBtn a {
    justify-content: center;
  }
  body.top header .header-navigation nav .headerNavMenu ul.menuButtonList li.mailBtn a p {
    margin-left: 10px;
  }
}
body.top header .headerContainer {
  display: flex;
  flex-direction: row;
  padding-bottom: 2em;
  z-index: 9;
  position: relative;
  justify-content: space-between;
  max-width: 1500px;
  margin: 0 auto;
  margin-top: 4em;
}
@media only screen and (min-width: 2375px) {
  body.top header .headerContainer {
    z-index: 11;
  }
}
body.top header .headerContainer .textContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0 5% 0 4%;
}
body.top header .headerContainer .textContainer .catchText {
  width: 100%;
}
body.top header .headerContainer .textContainer .logoContainer {
  width: 100%;
  margin-top: 2em;
}
body.top header .headerContainer .textContainer p {
  margin: 0.5em 0;
}
body.top header .headerContainer .textContainer p {
  font-size: 14px;
}
@media screen and (min-width: 320px) {
  body.top header .headerContainer .textContainer p {
    font-size: calc(14px + 4 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top header .headerContainer .textContainer p {
    font-size: 18px;
  }
}
body.top header .headerContainer .textContainer p br {
  display: none;
}
body.top header .headerContainer .textContainer .phoneButton a {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
body.top header .headerContainer .textContainer .phoneButton span {
  font-size: 14px;
}
@media screen and (min-width: 320px) {
  body.top header .headerContainer .textContainer .phoneButton span {
    font-size: calc(14px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top header .headerContainer .textContainer .phoneButton span {
    font-size: 16px;
  }
}
body.top header .headerContainer .visualContainer {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 20px;
}
body.top header .headerContainer .visualContainer .imagesBlock {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
body.top header .headerContainer .visualContainer .imagesBlock .imageItem {
  overflow: hidden;
  filter: drop-shadow(0 0 0.8em rgba(0, 0, 0, 0.3));
  -webkit-filter: drop-shadow(0 0 0.8em rgba(0, 0, 0, 0.3));
}
body.top header .headerContainer .visualContainer .imagesBlock .imageItem div {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
body.top header .headerContainer .visualContainer .imagesBlock .imageItem div img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
body.top header .headerContainer .visualContainer .imagesBlock1 {
  max-width: 396px;
  width: 394px;
  height: 498px;
}
body.top header .headerContainer .visualContainer .imagesBlock1 .imageItem {
  position: relative;
  overflow: hidden;
  width: 100%;
  display: block;
  height: 100%;
}
body.top header .headerContainer .visualContainer .imagesBlock1 .imageItem .slick-list {
  border-radius: 22px;
}
body.top header .headerContainer .visualContainer .imagesBlock2 {
  gap: 20px;
  align-items: flex-start;
}
body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem {
  position: relative;
}
body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:first-child {
  width: 334px;
  height: 301px;
  max-width: 336px;
  margin-right: min(15%, 50px);
}
body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:first-child .slick-list {
  border-radius: 22px;
}
body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child {
  width: 393px;
  height: 381px;
}
@media only screen and (min-width: 1501px) {
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child {
    border-top-right-radius: 20px;
  }
}
body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child .slick-list {
  border-top-left-radius: 22px;
  border-bottom-left-radius: 22px;
}
@media only screen and (min-width: 910px) {
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:first-child {
    margin-bottom: 0;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child {
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 1280px) and (min-width: 910px) {
  body.top header .headerContainer .visualContainer .imagesBlock1 {
    max-width: 396px;
    width: 30vw;
    height: 37.9187817259vw;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:first-child {
    width: 26vw;
    height: 301px;
    height: 28.8504983389vw;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child {
    width: 30vw;
    height: 381px;
    height: 30.9448818898vw;
  }
}
@media only screen and (max-width: 910px) {
  body.top header .headerContainer .visualContainer {
    width: 100%;
    justify-content: flex-end !important;
  }
  body.top header .headerContainer .visualContainer .imagesBlock1 {
    max-width: 396px;
    width: 55vw;
    height: 69.5177664975vw;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:first-child {
    width: 37vw;
    height: 301px;
    height: 41.0564784053vw;
    margin-bottom: 0;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child {
    width: 48vw;
    height: 381px;
    height: 51.5748031496vw;
    border-bottom-left-radius: 22px;
    margin-bottom: 4%;
  }
}
@media only screen and (max-width: 500px) {
  body.top header .headerContainer .visualContainer {
    gap: 10px;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 {
    gap: 10px;
  }
  body.top header .headerContainer .visualContainer .imagesBlock2 .imageItem:last-child {
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 910px) {
  body.top header .headerContainer {
    margin-top: 4%;
    padding-left: 4%;
    flex-direction: column-reverse;
    align-items: flex-start;
  }
  body.top header .headerContainer .textContainer {
    width: 100%;
    margin: 0;
    margin-top: -20vw;
    padding-bottom: 5%;
  }
  body.top header .headerContainer .textContainer .catchText img {
    width: 45vw;
  }
  body.top header .headerContainer .textContainer .logoContainer {
    margin-top: 0;
    overflow: hidden;
  }
  body.top header .headerContainer .textContainer .logoContainer .logo {
    margin-left: 20px;
    transform: translate(50%, 25%);
    -webkit-transform: translate(50%, 25%);
    -moz-transform: translate(50%, 25%);
    -ms-transform: translate(50%, 25%);
    -o-transform: translate(50%, 25%);
  }
  body.top header .headerContainer .textContainer .logoContainer .logo img {
    width: 40vw;
  }
  body.top header .headerContainer .textContainer .logoContainer p {
    position: relative;
    transform: translateY(-145%);
    -webkit-transform: translateY(-145%);
    -moz-transform: translateY(-145%);
    -ms-transform: translateY(-145%);
    -o-transform: translateY(-145%);
  }
  body.top header .headerContainer .textContainer .logoContainer p {
    font-size: 14px;
  }
}
@media only screen and (max-width: 910px) and (min-width: 320px) {
  body.top header .headerContainer .textContainer .logoContainer p {
    font-size: calc(14px + 14 * ((100vw - 320px) / 980));
  }
}
@media only screen and (max-width: 910px) and (min-width: 1300px) {
  body.top header .headerContainer .textContainer .logoContainer p {
    font-size: 28px;
  }
}
@media only screen and (max-width: 910px) {
  body.top header .headerContainer .textContainer .logoContainer p br {
    display: block;
  }
}
@media only screen and (max-width: 910px) {
  body.top header .headerContainer .textContainer .logoContainer .phoneButton {
    display: none !important;
  }
}
@media only screen and (max-width: 910px) {
  body.top header .headerContainer .visualContainer {
    justify-content: flex-start;
  }
}
@media only screen and (max-width: 768px) {
  body.top header .headerContainer .textContainer .logoContainer .logo {
    transform: translate(50%, 1%);
    -webkit-transform: translate(50%, 1%);
    -moz-transform: translate(50%, 1%);
    -ms-transform: translate(50%, 1%);
    -o-transform: translate(50%, 1%);
  }
}
body.top header .headerBackground-1 {
  position: absolute;
  top: 100%;
  transform: translateY(-100%);
  left: 0;
  z-index: 10;
  overflow: hidden;
  width: 100%;
}
body.top header .headerBackground-1 .town {
  z-index: 99;
  position: relative;
}
body.top header .headerBackground-1 .town img {
  display: block;
  min-width: 400px;
}
body.top header .headerBackground-2 {
  position: absolute;
  top: 92%;
  transform: translateY(-92%);
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
@keyframes scrollRight {
  0% {
    background-position: 0 100%;
  }
  100% {
    background-position: 2000px 100%;
  }
}
body.top header .headerBackground-2 .cloud {
  width: 100%;
  height: 100%;
  animation-fill-mode: forwards;
  background-image: url("../images/top/header-cloud@2x.png");
  background-repeat: repeat-x;
  background-size: 100% auto;
  animation: scrollRight 80s linear infinite;
  -webkit-animation: scrollRight 80s linear infinite;
}
body.top header .headerBackground-2 .cloud img {
  min-width: 400px;
  display: block;
}
@media only screen and (max-width: 910px) {
  body.top header .headerBackground-2 .cloud {
    animation: scrollRight 100s linear infinite;
    -webkit-animation: scrollRight 100s linear infinite;
  }
}
body.top main {
  background-image: url("../images/common/block-back.png");
  background-size: auto 40%;
  background-repeat: repeat;
}
body.top main article section .sectionHeader {
  text-align: center;
  padding-top: 8em;
}
body.top main article section .sectionHeader h2 {
  font-size: 26px;
}
@media screen and (min-width: 320px) {
  body.top main article section .sectionHeader h2 {
    font-size: calc(26px + 9 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article section .sectionHeader h2 {
    font-size: 35px;
  }
}
body.top main article section .sectionHeader span {
  font-family: "Concert One", cursive;
  font-style: normal;
  font-display: swap;
  color: #ffffff;
  padding: 1em 0 2em;
}
body.top main article section .sectionHeader span {
  font-size: 21px;
}
@media screen and (min-width: 320px) {
  body.top main article section .sectionHeader span {
    font-size: calc(21px + 3 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article section .sectionHeader span {
    font-size: 24px;
  }
}
body.top main article section .sectionHeader p {
  margin-top: 2em;
}
body.top main article section .sectionHeader p {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  body.top main article section .sectionHeader p {
    font-size: calc(16px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article section .sectionHeader p {
    font-size: 18px;
  }
}
body.top main article section .sectionFooter {
  padding-top: 12em;
  text-align: center;
}
body.top main article section .sectionFooter a {
  color: #000000;
}
body.top main article section .sectionFooter a .seeMoreButton {
  min-width: 257px;
  background-color: #ffffff;
  border: 2px solid currentColor;
  display: inline-block;
  padding: 1em;
  border-radius: 32px;
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
body.top main article section .sectionFooter a .seeMoreButton {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  body.top main article section .sectionFooter a .seeMoreButton {
    font-size: calc(16px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article section .sectionFooter a .seeMoreButton {
    font-size: 18px;
  }
}
body.top main article section .sectionFooter a .seeMoreButton:hover {
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}
@media only screen and (max-width: 910px) {
  body.top main article section .sectionHeader {
    padding: min(15vw, 8em) 4% 0 4%;
  }
  body.top main article section .sectionHeader br {
    display: none;
  }
  body.top main article section .sectionHeader h2 br {
    display: block;
  }
  body.top main article section .sectionFooter {
    padding-top: min(15vw, 12em);
  }
}
body.top main article.about {
  position: relative;
  background-color: var(--bg-color-pink);
}
body.top main article.about::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  height: var(--v-height);
  width: 100%;
  background: var(--bg-color-pink);
  -webkit-clip-path: polygon(0 0, 100% 0%, 50% 100%);
          clip-path: polygon(0 0, 100% 0%, 50% 100%);
}
body.top main article.about section {
  max-width: 820px;
  margin: 0 auto;
  padding-bottom: 4em;
}
body.top main article.about section .sectionBody .itemList .item {
  --count-width: 262px;
  position: relative;
  margin-top: min(8em, 20vw);
}
body.top main article.about section .sectionBody .itemList .item .itemText {
  max-width: 560px;
  width: 100%;
  margin-left: 40px;
  z-index: 2;
  position: relative;
}
body.top main article.about section .sectionBody .itemList .item .itemText h4 {
  background-color: var(--text-color-red);
  color: #ffffff;
  display: block;
  padding: 0.3em;
  max-width: 208px;
}
body.top main article.about section .sectionBody .itemList .item .itemText h4 {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  body.top main article.about section .sectionBody .itemList .item .itemText h4 {
    font-size: calc(16px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.about section .sectionBody .itemList .item .itemText h4 {
    font-size: 18px;
  }
}
body.top main article.about section .sectionBody .itemList .item .itemText h3 {
  color: var(--text-color-red);
  padding: 0.5em 0;
}
body.top main article.about section .sectionBody .itemList .item .itemText h3 {
  font-size: 21px;
}
@media screen and (min-width: 320px) {
  body.top main article.about section .sectionBody .itemList .item .itemText h3 {
    font-size: calc(21px + 3 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.about section .sectionBody .itemList .item .itemText h3 {
    font-size: 24px;
  }
}
body.top main article.about section .sectionBody .itemList .item .itemText hr {
  border: 1px solid var(--text-color-red);
}
body.top main article.about section .sectionBody .itemList .item .itemText p {
  padding-top: 1.75em;
  max-width: 470px;
}
body.top main article.about section .sectionBody .itemList .item .itemText p {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  body.top main article.about section .sectionBody .itemList .item .itemText p {
    font-size: calc(16px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.about section .sectionBody .itemList .item .itemText p {
    font-size: 18px;
  }
}
body.top main article.about section .sectionBody .itemList .item .itemCount {
  color: var(--text-color-red);
  background-color: #ffffff;
  width: var(--count-width);
  height: var(--count-width);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 0.9;
  background-repeat: no-repeat;
  background-position: 45% 50%;
  background-size: auto;
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translate(-100%, -50%);
}
body.top main article.about section .sectionBody .itemList .item .itemCount .countUp {
  font-family: "Concert One", cursive;
  font-style: normal;
  font-display: swap;
}
body.top main article.about section .sectionBody .itemList .item .itemCount .countUp {
  font-size: 80px;
}
@media screen and (min-width: 320px) {
  body.top main article.about section .sectionBody .itemList .item .itemCount .countUp {
    font-size: calc(80px + 5 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.about section .sectionBody .itemList .item .itemCount .countUp {
    font-size: 85px;
  }
}
body.top main article.about section .sectionBody .itemList .item .itemCount span {
  font-family: "Lilita One", cursive;
  font-style: normal;
  font-display: swap;
}
body.top main article.about section .sectionBody .itemList .item .itemCount span {
  font-size: 44px;
}
@media screen and (min-width: 320px) {
  body.top main article.about section .sectionBody .itemList .item .itemCount span {
    font-size: calc(44px + 4 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.about section .sectionBody .itemList .item .itemCount span {
    font-size: 48px;
  }
}
body.top main article.about section .sectionBody .itemList .item:nth-of-type(1) .itemCount {
  background-image: url("../images/top/back-illust-1.png");
}
body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) {
  margin-left: var(--count-width);
}
body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) .itemText {
  padding-left: 40px;
  margin-left: 0;
}
body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) .itemText hr {
  margin-left: -80px;
}
body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) .itemCount {
  background-image: url("../images/top/back-illust-2.png");
  left: 0;
}
body.top main article.about section .sectionBody .itemList .item:nth-of-type(3) .itemCount {
  background-image: url("../images/top/back-illust-3.png");
}
@media only screen and (max-width: 910px) {
  body.top main article.about section .sectionBody .itemList .item .itemText {
    max-width: 100%;
    margin-left: 0;
  }
  body.top main article.about section .sectionBody .itemList .item .itemText hr {
    display: none;
  }
  body.top main article.about section .sectionBody .itemList .item .itemText p {
    max-width: 100%;
    margin-top: var(--count-width);
  }
  body.top main article.about section .sectionBody .itemList .item .itemCount {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) {
    margin-left: 0;
  }
  body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) .itemText {
    padding-left: 0;
  }
  body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) .itemText p {
    padding-top: 1.75em;
  }
  body.top main article.about section .sectionBody .itemList .item:nth-of-type(2) .itemCount {
    position: absolute;
    left: 50%;
    top: 43%;
    transform: translate(-50%, -43%);
  }
}
@media only screen and (max-width: 910px) {
  body.top main article.about section .sectionBody {
    padding: 0 4%;
  }
}
body.top main article.works {
  margin-top: var(--v-height);
  position: relative;
}
body.top main article.works::before {
  content: "";
  position: absolute;
  top: calc(var(--v-height) * -1);
  left: 0;
  height: calc(100% + var(--v-height));
  width: 100%;
  background-color: var(--bg-color-blue);
  -webkit-clip-path: polygon(50% var(--v-height), 100% 0%, 100% 100%, 10% 100%, 10% calc(var(--v-height) * 2));
          clip-path: polygon(50% var(--v-height), 100% 0%, 100% 100%, 10% 100%, 10% calc(var(--v-height) * 2));
  z-index: 0;
}
body.top main article.works section {
  position: relative;
  z-index: 1;
  padding-bottom: 4em;
}
body.top main article.works section .sectionBody {
  margin-top: 4em;
}
body.top main article.works section .sectionBody ul.worksList {
  flex-wrap: nowrap;
}
body.top main article.works section .sectionBody ul.worksList li a {
  padding: 0 6%;
  display: block;
  color: var(--text-color);
}
body.top main article.works section .sectionBody ul.worksList li a .imageBox {
  border-radius: 32px;
  overflow: hidden;
  height: min(19vw, 293px);
}
@media only screen and (max-width: 1100px) {
  body.top main article.works section .sectionBody ul.worksList li a .imageBox {
    height: min(25vw, 270px);
  }
}
@media only screen and (max-width: 768px) {
  body.top main article.works section .sectionBody ul.worksList li a .imageBox {
    height: min(35vw, 268px);
  }
}
body.top main article.works section .sectionBody ul.worksList li a .imageBox img {
  transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transform-origin: center center;
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}
@media only screen and (max-width: 500px) {
  body.top main article.works section .sectionBody ul.worksList li a {
    padding: 0 3%;
  }
  body.top main article.works section .sectionBody ul.worksList li a .imageBox {
    height: min(65vw, 268px);
  }
}
@media only screen and (min-width: 770px) {
  body.top main article.works section .sectionBody ul.worksList li a:hover .imageBox {
    overflow: hidden;
  }
  body.top main article.works section .sectionBody ul.worksList li a:hover .imageBox img {
    transform: scale(1.1);
  }
}
body.top main article.works section .sectionBody ul.worksList li a h4 {
  padding: 0.5em 0;
  margin-left: 5px;
  font-weight: 500;
}
body.top main article.works section .sectionBody ul.worksList li a h4 {
  font-size: 18px;
}
@media screen and (min-width: 320px) {
  body.top main article.works section .sectionBody ul.worksList li a h4 {
    font-size: calc(18px + 4 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.works section .sectionBody ul.worksList li a h4 {
    font-size: 22px;
  }
}
body.top main article.works section .sectionBody ul.worksList li a table {
  margin-left: 5px;
}
body.top main article.works section .sectionBody ul.worksList li a table tr th {
  color: var(--text-color-gray);
  min-width: 95px;
}
body.top main article.works section .sectionBody ul.worksList li a table tr th {
  font-size: 15px;
}
@media screen and (min-width: 320px) {
  body.top main article.works section .sectionBody ul.worksList li a table tr th {
    font-size: calc(15px + 1 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.works section .sectionBody ul.worksList li a table tr th {
    font-size: 16px;
  }
}
body.top main article.works section .sectionBody ul.worksList li a table tr td {
  padding-left: 10px;
}
body.top main article.works section .sectionBody ul.worksList li a table tr td {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  body.top main article.works section .sectionBody ul.worksList li a table tr td {
    font-size: calc(16px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.works section .sectionBody ul.worksList li a table tr td {
    font-size: 18px;
  }
}
@media only screen and (max-width: 440px) {
  body.top main article.works section .sectionBody ul.worksList li a table tr th {
    min-width: 75px;
  }
}
@media only screen and (max-width: 910px) {
  body.top main article.works section {
    padding-bottom: 10em;
  }
  body.top main article.works section .sectionBody {
    margin: 4em 0 2em;
  }
}
body.top main article.professional {
  position: relative;
}
body.top main article.professional::before {
  content: "";
  position: absolute;
  top: calc(var(--v-height) * -1);
  left: 0;
  height: 100%;
  width: 100%;
  background-color: var(--bg-color-purple);
  -webkit-clip-path: polygon(50% var(--v-height), 100% 0%, 100% calc(100% - var(--v-height)), 0% calc(100% + var(--v-height)), 0% 0%);
          clip-path: polygon(50% var(--v-height), 100% 0%, 100% calc(100% - var(--v-height)), 0% calc(100% + var(--v-height)), 0% 0%);
}
body.top main article.professional section {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin: 0 auto;
  padding-bottom: 300px;
}
body.top main article.professional section .sectionBody {
  padding-top: 10em;
  position: relative;
  width: 100%;
}
@media only screen and (min-width: 910px) {
  body.top main article.professional section .sectionBody .sp-section {
    display: none;
  }
}
@media only screen and (max-width: 910px) {
  body.top main article.professional section .sectionBody .pc-section {
    display: none !important;
  }
  body.top main article.professional section .sectionBody .sp-section div {
    text-align: left;
    padding: 0 4%;
  }
  body.top main article.professional section .sectionBody .sp-section .sectionHeader {
    margin-top: 3em;
  }
  body.top main article.professional section .sectionBody .sp-section .sectionHeader h2 {
    text-align: center;
  }
}
body.top main article.professional section .sectionFooter {
  position: absolute;
  position: absolute;
  left: 10%;
  top: 64.5%;
  transform: translate(-10%, -64.5%);
}
@media only screen and (max-width: 910px) {
  body.top main article.professional section .sectionFooter {
    position: absolute;
    left: 50%;
    top: 88%;
    transform: translate(-50%, -88%);
  }
}
body.top main article.seminar {
  position: relative;
  background-color: var(--bg-color-green);
}
body.top main article.seminar::before {
  content: "";
  position: absolute;
  top: calc(var(--v-height) * -2);
  left: 0;
  height: 100%;
  width: 100%;
  background-color: var(--bg-color-green);
  -webkit-clip-path: polygon(100% calc(var(--v-height) * 2), 100% 0%, 100% 100%, 0% 100%, 0% 0%);
          clip-path: polygon(100% calc(var(--v-height) * 2), 100% 0%, 100% 100%, 0% 100%, 0% 0%);
}
body.top main article.seminar::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  height: var(--v-height);
  width: 100%;
  background-color: var(--bg-color-green);
  -webkit-clip-path: polygon(0 0, 100% 0%, 50% 100%);
          clip-path: polygon(0 0, 100% 0%, 50% 100%);
}
body.top main article.seminar section {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin: 0 auto;
}
body.top main article.seminar section .sectionHeader .imageContainer {
  position: relative;
}
body.top main article.seminar section .sectionHeader .imageContainer .textImage {
  position: absolute;
  position: absolute;
  left: 51%;
  top: -50%;
  transform: translate(-51%, 50%);
}
body.top main article.seminar section .sectionHeader .imageContainer .seminarImage {
  display: flex;
  flex-direction: row;
  gap: 4%;
}
@media only screen and (min-width: 1280px) {
  body.top main article.seminar section .sectionHeader .imageContainer .seminarImage div {
    border-radius: 44px;
    overflow: hidden;
  }
}
body.top main article.seminar section .sectionHeader .imageContainer .seminarImage img {
  display: block;
}
body.top main article.seminar section .sectionHeader h2 {
  margin-top: 2em;
}
@media only screen and (max-width: 910px) {
  body.top main article.seminar section .sectionHeader {
    padding: min(15vw, 8em) 0 0;
  }
  body.top main article.seminar section .sectionHeader h2,
  body.top main article.seminar section .sectionHeader p {
    padding: 0 4%;
  }
}
body.top main article.seminar section .sectionFooter {
  padding-top: 4em;
}
body.top main article.news {
  background-color: var(--bg-color-gray);
}
body.top main article.news section {
  padding: 3em 4% 2em;
}
body.top main article.news section .sectionBody {
  margin: 4em 0;
}
body.top main article.news section .sectionBody ul {
  max-width: 920px;
  margin: 0 auto;
}
body.top main article.news section .sectionBody ul li {
  border-bottom: 1px solid var(--text-color);
  padding-bottom: 1em;
  margin-bottom: 1.5em;
}
body.top main article.news section .sectionBody ul li a {
  position: relative;
  display: flex;
  flex-direction: row;
  color: var(--text-color);
}
body.top main article.news section .sectionBody ul li a {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  body.top main article.news section .sectionBody ul li a {
    font-size: calc(16px + 2 * ((100vw - 320px) / 980));
  }
}
@media screen and (min-width: 1300px) {
  body.top main article.news section .sectionBody ul li a {
    font-size: 18px;
  }
}
body.top main article.news section .sectionBody ul li a p.date {
  margin-right: 10%;
  margin-left: 2%;
}
body.top main article.news section .sectionBody ul li a svg {
  position: absolute;
  left: 96%;
  top: 50%;
  transform: translate(-96%, -50%);
  width: 30px;
  float: right;
}
body.top main article.news section .sectionBody ul li a svg .circleBody,
body.top main article.news section .sectionBody ul li a svg .circleBorder,
body.top main article.news section .sectionBody ul li a svg .triangle {
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
}
@media only screen and (max-width: 440px) {
  body.top main article.news section .sectionBody ul li a {
    flex-direction: column;
  }
  body.top main article.news section .sectionBody ul li a p.date {
    margin: 0;
  }
}
body.top main article.news section .sectionBody ul li a:hover svg .circleBody {
  fill: var(--primary-color) !important;
}
body.top main article.news section .sectionBody ul li a:hover svg .circleBorder {
  stroke: var(--primary-color) !important;
}
body.top main article.news section .sectionBody ul li a:hover svg .triangle {
  fill: #ffffff !important;
}
body.top main article.news section .sectionFooter {
  padding-top: 2em;
}
body.top footer .footer-navigation {
  background: #ffffff;
}
body.top footer .footer-navigation::before {
  background: var(--bg-color-gray);
}