@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap");
html {
  scroll-behavior: smooth;
}

main {
  padding: 0;
  line-height: 150%;
}

:root {
  --base-color-navy-1: #1f2f6f;
  --base-color-navy-2: #004be6;
  --base-color-green-1: #006978;
  --base-color-green-2: #00b4b4;
  --base-color-red-1: #ff5a5a;
  --base-color-red-2: #f587b4;
  --gradient-color-1: #003c96;
  --gradient-color-2: #00aaff;
  --base-color-1: #1f2f6f;
  --font-caption-1: #909090;
  --base-width-1: 980px;
  --table-border-1: #666666;
}

@media (width >= 1400px) {
  body {
    padding-top: 90px;
  }
}
@media (width < 1400px) {
  body {
    padding-top: 50px;
  }
  body:has(#mega-navigation.active) {
    overflow: hidden;
  }
}

@media (width < 782px) {
  p {
    font-size: 14px;
  }
}

.noto-sans {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.serif {
  font-family: "Noto Serif JP", serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.garamond {
  font-family: "EB Garamond", serif;
  font-optical-sizing: auto;
  font-style: normal;
}

#mega-header {
  border-top: 4px solid var(--base-color-1);
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background: #fff;
  box-sizing: border-box;
}
@media (width >= 1400px) {
  #mega-header > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
#mega-header li {
  list-style-type: none;
}
#mega-header a {
  color: inherit;
  box-sizing: border-box;
}
@media (width >= 1400px) {
  #mega-header {
    padding: 12px 17px;
    height: 90px;
  }
  #mega-header span img:nth-of-type(2) {
    display: none;
  }
}
@media (width < 1400px) {
  #mega-header {
    padding-top: 5px;
    height: 50px;
    transition: all 0.3s ease 0s;
  }
  #mega-header span {
    position: relative;
  }
  #mega-header span img:nth-of-type(2) {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
  }
}

#mega-header:has(#mega-navigation.active) {
  background: rgba(31, 47, 111, 0.9);
}
@media (width < 1400px) {
  #mega-header:has(#mega-navigation.active) span img:nth-of-type(1) {
    opacity: 0;
  }
  #mega-header:has(#mega-navigation.active) span img:nth-of-type(2) {
    opacity: 1;
  }
}

@media (width < 1400px) {
  #header-logo {
    flex: 0 0 180px;
  }
  #header-logo img {
    width: 200px;
  }
  #header-logo span {
    display: block;
  }
}

@media (width >= 1400px) {
  #mega-navigation {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 20px;
  }
}
@media (width < 1400px) {
  #mega-navigation {
    height: 0;
    overflow: hidden;
    position: fixed;
    top: 50px;
    background: rgba(31, 47, 111, 0.9);
    color: #fff;
    width: 100vw;
    transition: all 0.3s ease 0s;
  }
  #mega-navigation.active {
    height: calc(100vh - 50px) !important;
    overflow: auto;
  }
}

#mega-page-navigation {
  font-weight: bold;
}
@media (width >= 1400px) {
  #mega-page-navigation {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 20px;
    color: #212121;
  }
}
@media (width < 1400px) {
  #mega-page-navigation {
    padding: 25px;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
  }
}
#mega-page-navigation li {
  list-style-type: none;
}
@media (width < 1400px) {
  #mega-page-navigation li:last-of-type a {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  }
}
#mega-page-navigation a {
  position: relative;
  color: inherit;
}
@media (width >= 1400px) {
  #mega-page-navigation a:after {
    content: "";
    display: block;
    width: 0%;
    height: 2px;
    background: var(--base-color-1);
    position: absolute;
    left: 50%;
    bottom: -5px;
    transition: all 0.3s ease 0s;
  }
}
@media (width < 1400px) {
  #mega-page-navigation a {
    padding: 15px 20px;
    display: block;
    border-top: 1px solid rgba(255, 255, 255, 0.5);
  }
}
#mega-page-navigation a:hover:after {
  width: 100%;
  left: 0;
}
@media (width >= 1400px) {
  #mega-page-navigation .contact {
    display: none;
  }
  #mega-page-navigation li span {
    display: none;
  }
}
@media (width < 1400px) {
  #mega-page-navigation li {
    font-weight: normal;
  }
  #mega-page-navigation li span {
    font-style: italic;
    padding-left: 10px;
  }
}

@media (width >= 1400px) {
  #mega-form-navigation {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
  }
}
@media (width < 1400px) {
  #mega-form-navigation {
    display: block;
    padding: 0 25px 40px;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
  }
}
#mega-form-navigation a {
  display: block;
  border: 1px solid var(--base-color-1);
  text-align: center;
  font-size: 14px;
  line-height: 120%;
  transition: all 0.3s ease 0s;
}
@media (width >= 1400px) {
  #mega-form-navigation a {
    padding: 12px 5px;
    height: 54px;
    width: 120px;
  }
}
@media (width < 1400px) {
  #mega-form-navigation a {
    padding: 7px 5px;
  }
}
#mega-form-navigation a:hover {
  background: var(--base-color-1);
  color: #fff;
}
@media (width >= 1400px) {
  #mega-form-navigation span {
    display: block;
  }
}
#mega-form-navigation li {
  list-style-type: none;
}
@media (width >= 1400px) {
  #mega-form-navigation li:nth-of-type(1) a {
    padding-top: 18px;
  }
}
@media (width < 1400px) {
  #mega-form-navigation li {
    border: 2px solid #fff;
    margin-top: 10px;
  }
  #mega-form-navigation li .serif {
    padding-left: 5px;
  }
}
@media (width >= 1400px) {
  #mega-form-navigation .contact {
    display: none;
  }
}
#mega-form-navigation .contact .flex {
  gap: 15px;
}
#mega-form-navigation .contact .title {
  text-align: left;
  flex: 0 1;
  white-space: nowrap;
}
#mega-form-navigation .contact .phone {
  border-left: 2px solid #fff;
  text-align: center;
  flex: 1 0;
}
#mega-form-navigation .contact span {
  font-size: 10px;
}

#main-visual {
  display: flex;
  align-items: center;
  justify-content: start;
  overflow: hidden;
  position: relative;
  z-index: 10;
}
#main-visual .visual {
  flex: 1 1 auto;
  position: relative;
}
#main-visual .visual .main-copy {
  position: absolute;
  z-index: 10;
  padding-top: 30px;
}
#main-visual .visual .main-copy > div {
  margin-top: 15px;
  position: relative;
  width: 0;
}
@media (width >= 782px) {
  #main-visual .visual .main-copy > div img {
    width: 365px;
    max-width: 365px;
  }
}
@media (width < 782px) {
  #main-visual .visual .main-copy > div img {
    width: 200px;
    max-width: 200px;
  }
}
#main-visual .swiper-slide {
  height: calc(100vh - 80px);
  max-height: 2000px;
  overflow: hidden;
}
#main-visual .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1, 1);
  transition: all 10s ease 1s;
}
#main-visual .swiper-slide-visible img {
  transition: all 20s ease 0s;
  transform: scale(1.2, 1.2);
}

#main-visual-slider {
  overflow: hidden;
  flex: 0 0;
}
@media (width >= 1400px) {
  #main-visual-slider {
    width: calc(100vw - 120px);
  }
}
@media (width < 1400px) {
  #main-visual-slider {
    width: calc(100vw - 45px);
  }
}

#scroll-line {
  background: linear-gradient(to right, var(--base-color-navy-1), var(--base-color-navy-2));
  color: #fff;
  text-transform: uppercase;
  overflow: hidden;
}
@media (width >= 1400px) {
  #scroll-line {
    flex: 0 0 120px;
    width: 120px;
    height: 200px;
  }
}
@media (width < 1400px) {
  #scroll-line {
    flex: 0 0 45px;
    width: 45px;
    height: 160px;
  }
}
#scroll-line > div {
  position: relative;
}
@media (width >= 1400px) {
  #scroll-line > div {
    transform: translate(-20px, 70px) rotate(90deg);
  }
}
@media (width < 1400px) {
  #scroll-line > div {
    transform: translate(-2px, 30px) rotate(90deg);
  }
}
#scroll-line > div span.text {
  white-space: nowrap;
}
#scroll-line > div span.bar {
  top: 11px;
  display: block;
  top: 13px;
  left: 75px;
  width: 100px;
  height: 2px;
  background: #fff;
  position: absolute;
}

#home-message {
  padding-top: 100px;
  padding-bottom: 100px;
  color: var(--base-color-1);
  position: relative;
  z-index: 5;
}
#home-message:before {
  content: "";
  display: block;
  width: 100%;
  height: calc(100% + 50vh);
  background: url(../img2/img5.jpg) no-repeat center/cover;
  position: absolute;
  top: -50vh;
}
#home-message h2 {
  text-align: center;
}
#home-message .lead {
  margin-top: 40px;
  text-align: center;
}
#home-message .lead p {
  margin-top: 30px;
}

.buttons-1 li {
  list-style-type: none;
}
.buttons-1 .btn a {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  position: relative;
  padding: 0 0 0 30px;
  border: 3px solid #1F2F6F;
  font-size: 14px;
  color: #1F2F6F;
  overflow: hidden;
  transition: 0.3s all;
}
@media (width >= 782px) {
  .buttons-1 .btn a {
    width: 300px;
    height: 60px;
  }
}
@media (width < 782px) {
  .buttons-1 .btn a {
    max-width: 300px;
    width: 100%;
    height: 50px;
  }
}
.buttons-1 .btn a span {
  position: relative;
  z-index: 2;
}
.buttons-1 .btn a::before {
  content: "";
  display: block;
  position: relative;
  z-index: 2;
  width: 10px;
  height: 16px;
  margin-right: 30px;
  background: url("../img/cmn/arrow1.svg") no-repeat center/contain;
}
.buttons-1 .btn a::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #1F2F6F;
  z-index: 1;
  transform: translate(-100%, 0);
  transition: 0.3s all;
}
.buttons-1 .btn a:hover {
  color: #FFF !important;
}
.buttons-1 .btn a:hover::before {
  background: url("../img/cmn/arrow1_w.svg") no-repeat center/contain;
}
.buttons-1 .btn a:hover::after {
  transform: translate(0);
}

.page-h {
  line-height: 130%;
}
.page-h:before {
  line-height: 100%;
}
@media (width < 782px) {
  .page-h {
    font-size: 24px !important;
    margin-bottom: 30px !important;
  }
  .page-h:before {
    font-size: 14px !important;
    margin-bottom: 10px !important;
    letter-spacing: 0 !important;
  }
}

@media (width >= 782px) {
  .columns {
    display: flex;
  }
}
#home-knowledge {
  position: relative;
  z-index: 5;
}
#home-knowledge .columns {
  align-items: center;
  justify-content: start;
  gap: 60px;
}
#home-knowledge p {
  text-align: justify;
}
@media (width >= 782px) {
  #home-knowledge p {
    margin-top: 40px;
  }
}
@media (width < 782px) {
  #home-knowledge p {
    margin-top: 20px;
  }
}
#home-knowledge ul {
  margin-top: 40px;
}
#home-knowledge ul li {
  margin-top: 15px;
  list-style-type: none;
}
#home-knowledge .image {
  flex: 0 0 480px;
}

.flex {
  display: flex;
}

#home-recruit {
  position: relative;
}
@media (width < 782px) {
  #home-recruit {
    margin-top: 100px;
  }
}
#home-recruit:before {
  content: "";
  background: #f3f7fa;
  background: #f3f7fa;
  display: block;
  height: 100%;
  position: absolute;
  left: 0;
  z-index: -1;
}
@media (width >= 782px) {
  #home-recruit:before {
    top: -100px;
    height: calc(100% + 200px);
    width: calc(100% - 80px);
  }
}
@media (width < 782px) {
  #home-recruit:before {
    top: -50px;
    height: calc(100% + 100px);
    width: calc(100% - 30px);
  }
}
#home-recruit h2 {
  text-align: center;
}
#home-recruit .flex {
  margin-left: auto;
  margin-right: auto;
}
@media (width >= 782px) {
  #home-recruit .flex {
    max-width: 640px;
    margin-top: 60px;
    gap: 40px;
  }
}
@media (width < 782px) {
  #home-recruit .flex {
    max-width: 280px;
    margin-top: 30px;
    gap: 10px;
  }
}
#home-recruit .flex div {
  flex: 1;
}
#home-recruit .buttons-1 {
  margin-top: 60px;
  margin-bottom: 100px;
  margin-left: auto;
  margin-right: auto;
  width: calc(100% - 20px);
  max-width: 300px;
}

.recruit-slider a {
  transition: all 0.3s ease 0s;
}
.recruit-slider a:hover {
  opacity: 0.5;
}
.recruit-slider nav {
  width: 80px;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 10px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
.recruit-slider nav div {
  width: 100%;
}
@media (width >= 782px) {
  .recruit-slider nav div {
    position: absolute;
    top: -30px;
    left: 400px;
  }
}
@media (width < 782px) {
  .recruit-slider nav div {
    text-align: center;
    margin-top: 20px;
  }
}
.recruit-slider nav button {
  width: 30px;
  height: 30px;
  border: none;
  background: var(--base-color-1);
  border-radius: 50%;
}
@media (width >= 782px) {
  .recruit-slider .swiper {
    margin-top: 50px;
  }
}
@media (width < 782px) {
  .recruit-slider .swiper {
    margin-top: 20px;
  }
}
.recruit-slider .swiper h3 {
  font-size: 18px;
  color: var(--base-color-1);
  margin-top: 15px;
  line-height: 150%;
}
.recruit-slider .swiper ul {
  margin-top: 15px;
  padding-left: 20px;
  color: var(--font-caption-1);
}
@media (width >= 782px) {
  .recruit-slider .swiper ul {
    font-size: 15px;
  }
}
@media (width < 782px) {
  .recruit-slider .swiper ul {
    font-size: 13px;
  }
}
.recruit-slider .swiper-slide {
  box-sizing: border-box;
}
.recruit-slider button {
  cursor: pointer;
  transition: all 0.3s ease 0s;
}
.recruit-slider button:hover {
  opacity: 0.6;
}

.cover {
  padding: 100px 30px;
}

.group {
  max-width: 1040px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}
@media (width >= 782px) {
  .group {
    padding: 100px 30px;
  }
}
@media (width < 782px) {
  .group {
    padding: 40px 20px;
  }
}

.navigation-1 li a {
  border: 3px solid var(--base-color-1);
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: start;
  color: var(--base-color-1);
  transition: all 0.2s ease 0s;
}
.navigation-1 li a:before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  border-right: 1px solid var(--base-color-1);
  border-bottom: 1px solid var(--base-color-1);
  transform: rotate(-45deg);
  margin-right: 25px;
  transition: all 0.2s ease 0s;
}
.navigation-1 li a:hover {
  color: #fff;
  background: var(--base-color-1);
}
.navigation-1 li a:hover:before {
  border-color: #fff;
}

.recruit-buttons-1 div {
  position: relative;
}
.recruit-buttons-1 a {
  font-weight: 200;
  display: blocK;
  color: #fff;
  text-align: center;
}
@media (width >= 782px) {
  .recruit-buttons-1 a {
    padding: 17px;
  }
}
@media (width < 782px) {
  .recruit-buttons-1 a {
    padding: 13px;
    font-size: 14px;
  }
}
.recruit-buttons-1 a:before {
  content: "";
  position: absolute;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  top: 4px;
  left: 4px;
  transition: all 0.3s ease 0s;
  z-index: 1;
  background: #fff;
  opacity: 0;
}
.recruit-buttons-1 a:hover:before {
  opacity: 1;
}
.recruit-buttons-1 a span {
  position: relative;
  z-index: 5;
}
.recruit-buttons-1 .fresher {
  background: linear-gradient(to right, var(--base-color-red-1), var(--base-color-red-2));
}
.recruit-buttons-1 .fresher a:hover span {
  background: linear-gradient(to right, var(--base-color-red-1), var(--base-color-red-2));
  background-clip: text;
  color: transparent;
}
.recruit-buttons-1 .career {
  background: linear-gradient(to right, var(--base-color-green-1), var(--base-color-green-2));
}
.recruit-buttons-1 .career a:hover span {
  background: linear-gradient(to right, var(--base-color-green-1), var(--base-color-green-2));
  background-clip: text;
  color: transparent;
}

.recruit-slider .swiper-slide {
  padding: 10px;
  background: #fff;
}

#footer-message {
  background: #2355e0 url(../img2/img13.svg) no-repeat left center;
  padding-top: 40px;
  padding-bottom: 40px;
  text-align: center;
  color: #fff;
  font-size: 20px;
}

footer {
  padding-top: 30px;
  color: #212121;
}
@media (width < 782px) {
  footer {
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
  }
}
footer > * {
  max-width: var(--base-width-1);
  margin-left: auto;
  margin-right: auto;
}
@media (width < 782px) {
  footer > .flex {
    display: block;
  }
}
footer .logo {
  flex: 0 0 300px;
}
footer h2 + .flex {
  margin-top: 15px;
  gap: 15px;
  align-items: center;
}
footer h2 + .flex p {
  font-size: 14px;
  color: var(--base-color-1);
}
footer .tel {
  border: 1px solid var(--base-color-1);
  color: var(--base-color-1);
  flex: 1 1 auto;
}
footer .tel a {
  color: inherit;
  font-weight: bold;
  line-height: 130%;
  display: block;
  font-size: 15px;
  padding: 5px;
  text-align: center;
}
@media (width >= 782px) {
  footer .tel a {
    pointer-events: none;
  }
}
footer .tel a span {
  font-weight: normal;
  font-size: 12px;
}
footer .sitemap {
  flex: 1 1 100%;
  padding-top: 10px;
}
@media (width < 782px) {
  footer .sitemap {
    flex-wrap: wrap;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
@media (width >= 782px) {
  footer .sitemap ul {
    gap: 20px;
    justify-content: end;
  }
}
@media (width < 782px) {
  footer .sitemap ul {
    gap: 10px;
    flex-wrap: wrap;
  }
}
footer .sitemap ul li {
  list-style-type: none;
  font-size: 14px;
}
footer .sitemap a {
  color: inherit;
  transition: all 0.3s ease 0s;
}
footer .sitemap a:hover {
  opacity: 0.5;
}

.rights {
  padding-top: 20px;
  padding-bottom: 20px;
  color: var(--font-caption-1);
}
@media (width >= 782px) {
  .rights {
    text-align: right;
    font-size: 12px;
  }
}
@media (width < 782px) {
  .rights {
    text-align: center;
    font-size: 10px;
  }
}

.gotop a {
  display: block;
  position: fixed;
  line-height: 100%;
  transform-origin: 0% 0%;
  transform: rotate(90deg);
  z-index: 100;
  opacity: 0;
  pointer-events: none;
  transition: all 1s ease 0s;
}
@media (width >= 782px) {
  .gotop a {
    right: -50px;
    bottom: 80px;
  }
}
@media (width < 782px) {
  .gotop a {
    right: -65px;
    bottom: 60px;
  }
}
.gotop a img {
  transform: rotate(-90deg);
  display: inline !important;
  position: relative;
  top: 3px;
  margin-right: 10px;
}
.gotop a span {
  display: inline;
  color: var(--font-caption-1);
  font-size: 12px;
}

.gotop-active a {
  opacity: 1;
  pointer-events: auto;
}

.tbl-1 {
  border-top: 1px solid var(--table-border-1);
}
.tbl-1 th, .tbl-1 td {
  padding: 30px 40px;
  border-bottom: 1px solid var(--table-border-1);
  text-align: left;
  font-weight: normal;
}

#about-data {
  display: flex;
  flex-direction: row;
  flex-flow: wrap;
  align-items: stretch;
  justify-content: start;
  gap: 40px;
  margin-top: 60px;
}
#about-data .flex {
  flex-wrap: wrap;
}
#about-data .data {
  flex: 0 0 auto;
  overflow: hidden;
  background: rgba(0, 91, 152, 0.05);
  box-sizing: border-box;
}
@media (width >= 992px) {
  #about-data .data {
    width: calc((100% - 80px) / 3);
    padding: 20px;
  }
}
@media (width < 992px) {
  #about-data .data {
    width: calc((100% - 40px) / 2);
    padding: 10px;
  }
}
@media (width < 782px) {
  #about-data .data {
    width: 100%;
  }
}
#about-data .number {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-size: 100px;
  font-weight: 900;
  background: linear-gradient(to bottom, var(--base-color-red-1), var(--base-color-red-2));
  background-clip: text;
  color: transparent;
  line-height: 100%;
  width: 100%;
  flex: 0 0 100%;
  padding-left: 0px;
  padding-right: 0px;
  box-sizing: border-box;
  text-align: center;
}
#about-data .number span.b {
  line-height: 100%;
  display: block;
}
#about-data .number span.s {
  font-size: 36%;
}
#about-data .number span.s,
#about-data .number span.u {
  line-height: 100%;
}
#about-data img {
  margin-left: auto;
  margin-right: auto;
}
#about-data h3 {
  font-size: 26px;
  text-align: center;
  border-bottom: 1px solid #d80020;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 130%;
}
@media (width >= 992px) {
  #about-data h3 {
    min-height: 65px;
    padding-bottom: 10px;
  }
}
@media (width < 992px) {
  #about-data h3 {
    padding-bottom: 15px;
    line-height: 130%;
  }
}
#about-data .caption {
  margin-top: 15px;
}
#about-data .detail {
  margin-top: 20px;
}
#about-data .detail p {
  line-height: 150%;
  color: var(--base-color-1);
}
#about-data .detail p.caption {
  color: var(--font-caption-1);
}
@media (width >= 782px) {
  #about-data .data:nth-of-type(1) span.b.s {
    margin-right: 0;
    margin-left: auto;
    width: fit-content;
    padding-right: 8px;
  }
}
@media (width < 782px) {
  #about-data .data:nth-of-type(1) span.b.s {
    text-align: center;
  }
}
#about-data .data:nth-of-type(1) img {
  margin-top: 20px;
}
#about-data .data:nth-of-type(2) .number {
  order: 2;
  margin-top: -30px;
}
#about-data .data:nth-of-type(2) img {
  order: 1;
}
#about-data .data:nth-of-type(3) img {
  margin-top: 15px;
}
#about-data .data:nth-of-type(4) img {
  margin-top: 15px;
}
#about-data .data:nth-of-type(5) img {
  margin-top: 30px;
  margin-bottom: 20px;
}
#about-data .data:nth-of-type(6) img {
  margin-top: 15px;
}
#about-data .data:nth-of-type(7) .number {
  text-align: left;
}
#about-data .data:nth-of-type(7) img {
  margin-right: 0;
  margin-left: auto;
  margin-top: -60px;
}
#about-data .data:nth-of-type(8) {
  flex: 1 1 auto;
}
#about-data .data:nth-of-type(8) .flex {
  width: 100%;
  justify-content: center;
  gap: 10px;
}
#about-data .data:nth-of-type(8) .number {
  flex: 0;
}
#about-data .data:nth-of-type(8) img {
  flex: 0;
  margin: 20px 0 0;
}

#about-share h3 {
  font-weight: 500;
}
#about-share h4 {
  margin-bottom: 15px;
  font-weight: bold;
}

.graph-1 {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}
.graph-1:before {
  content: "50%";
  position: absolute;
  width: 100px;
  text-align: center;
  left: calc((100% - 100px) / 2);
  top: -35px;
}
.graph-1:after {
  content: "";
  display: block;
  width: 1px;
  height: calc(100% + 10px);
  border-left: 1px dotted #333;
  position: absolute;
  left: calc(50% - 0.5px);
  top: -5px;
}
.graph-1 div.bar {
  font-size: 14px;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  height: 60px;
  max-width: 0;
}
.graph-1 div.bar p {
  position: absolute;
  top: 15px;
}
.graph-1 div.bar span.number {
  font-size: 20px;
  font-weight: bold;
  padding-left: 5px;
}
.graph-1 div.bar:nth-of-type(1) {
  background: #f9d2d4;
  text-align: left;
  color: #b30868;
}
.graph-1 div.bar:nth-of-type(1) p {
  left: 15px;
}
.graph-1 div.bar:nth-of-type(2) {
  background: #accbda;
  text-align: right;
  color: #22537e;
}
.graph-1 div.bar:nth-of-type(2) p {
  right: 20px;
}

#linear .caption {
  color: var(--font-caption-1);
  margin-top: 20px;
}

.graph-2 + .graph-2 {
  margin-top: 30px;
}
.graph-2 dl {
  display: flex;
  align-items: center;
  justify-content: start;
}
.graph-2 dl dt {
  position: relative;
}
@media (width > 600px) {
  .graph-2 dl dt {
    flex: 0 0 100px;
    width: 100px;
  }
}
@media (width <= 600px) {
  .graph-2 dl dt {
    display: none;
  }
}
.graph-2 dl dd {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 20px;
  position: relative;
  flex: 1;
}
.graph-2 dl dd:after {
  content: "";
  width: 1px;
  height: 100%;
  border-left: 1px dotted #333;
  position: absolute;
  left: 0;
  top: 0;
}
@media (width >= 782px) {
  .graph-2 dl dd {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}
@media (width < 782px) {
  .graph-2 dl dd {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .graph-2 dl dd p {
    display: none;
  }
}
.graph-2 dl dd p {
  white-space: nowrap;
}
@media (width >= 782px) {
  .graph-2 .graph-caption {
    display: none;
  }
}
.graph-2 .bar {
  max-width: 0;
}
@media (width >= 782px) {
  .graph-2 .bar {
    height: 50px;
  }
}
@media (width < 782px) {
  .graph-2 .bar {
    height: 30px;
  }
}
.graph-2.before .bar {
  background: #accbda;
}
@media (width >= 782px) {
  .graph-2.after .bar {
    background: url(../img2/img26.svg) no-repeat right center/auto 100%;
  }
}
@media (width < 782px) {
  .graph-2.after .bar {
    background: url(../img2/img125.svg) no-repeat right center/auto 100%;
  }
}
.graph-2.after p {
  color: var(--base-color-red-1);
  font-weight: bold;
}

@media (width >= 782px) {
  .graph-2-1 .bar {
    width: 20px;
  }
}
@media (width < 782px) {
  .graph-2-1 .bar {
    width: 10px;
  }
}

@media (width >= 782px) {
  .graph-2-2 .bar {
    width: 80%;
  }
}
@media (width < 782px) {
  .graph-2-2 .bar {
    width: 90%;
  }
}

#entry-panel {
  background: url(../img2/img27.jpg) no-repeat center/cover;
}
#entry-panel > * {
  background: linear-gradient(to right, var(--base-color-navy-1), var(--base-color-navy-2));
}
@media (width >= 782px) {
  #entry-panel {
    padding: 100px 0;
  }
}
@media (width < 782px) {
  #entry-panel {
    padding: 50px 25px;
  }
}
#entry-panel .group {
  color: #fff;
  gap: 0;
}
@media (width >= 782px) {
  #entry-panel .group {
    padding: 40px 60px;
    align-items: center;
  }
}
@media (width < 782px) {
  #entry-panel .group {
    padding: 20px 30px;
    display: block;
  }
}
#entry-panel .group > div {
  box-sizing: border-box;
}
@media (width >= 782px) {
  #entry-panel .group > div {
    flex: 0 0 50%;
  }
  #entry-panel .group > div:nth-of-type(1) {
    padding-right: 30px;
  }
  #entry-panel .group > div:nth-of-type(1) p {
    margin-top: 40px;
  }
  #entry-panel .group > div:nth-of-type(2) {
    padding-left: 30px;
  }
}
#entry-panel h2 {
  text-align: left;
}
@media (width >= 782px) {
  #entry-panel .buttons {
    border-left: 1px dotted #fff;
  }
}
@media (width < 782px) {
  #entry-panel .buttons {
    margin-top: 20px;
  }
}
#entry-panel .button a {
  color: var(--base-color-1);
  position: relative;
  transition: all 0.3s ease 0s;
  background: #fff;
  display: block;
  box-sizing: border-box;
}
@media (width >= 782px) {
  #entry-panel .button a {
    padding: 40px 0 40px 50px;
  }
}
@media (width < 782px) {
  #entry-panel .button a {
    padding: 20px 0 20px 40px;
  }
}
#entry-panel .button a:before {
  content: "";
  display: block;
  width: 25px;
  height: 1px;
  background: #000;
  position: absolute;
  left: 0;
  top: 50%;
  transition: all 0.3s ease 0s;
}
#entry-panel .button {
  margin-top: 20px;
}
#entry-panel .button:nth-of-type(1) {
  margin-top: 0;
}
#entry-panel .fresher a:before {
  background: var(--base-color-red-1);
}
#entry-panel .fresher a:hover {
  background: var(--base-color-red-1);
  color: #fff;
}
#entry-panel .fresher a:hover:before {
  background: #fff;
}
#entry-panel .internship a:before {
  background: var(--base-color-navy-1);
}
#entry-panel .internship a:hover {
  background: var(--base-color-navy-1);
  color: #fff;
}
#entry-panel .internship a:hover:before {
  background: #fff;
}
#entry-panel .career a:before {
  background: var(--base-color-green-2);
}
#entry-panel .career a:hover {
  background: var(--base-color-green-2);
  color: #fff;
}
#entry-panel .career a:hover:before {
  background: #fff;
}

@media (width > 835px) {
  .page-member-sec {
    padding-bottom: 50px;
  }
  .page-member-sec .slider figure {
    column-gap: 8px;
  }
  .page-member-sec p.pos {
    font-size: 11px !important;
    line-height: 140%;
  }
}
.member-sec-sc .group {
  padding-top: 0px;
  padding-bottom: 0;
}

.member-header {
  padding-top: 0;
}

.member-header {
  position: relative;
  z-index: 10;
}
.member-header .title {
  margin-bottom: 50px;
}

.member-header-inner {
  padding-bottom: 0;
  align-items: center;
}
@media (width >= 782px) {
  .member-header-inner {
    padding-top: 50px;
  }
}
@media (width < 782px) {
  .member-header-inner {
    padding-top: 0px;
  }
  .member-header-inner .title img {
    filter: invert(100%);
  }
}
.member-header-inner .join {
  line-height: 140%;
}
.member-header-inner .tags {
  justify-content: start;
  gap: 10px;
}

@media (width >= 782px) {
  .member-header01 {
    background: url(../img2/img50.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .member-header01:before {
    background: url(../img2/img136.jpg) no-repeat center/cover !important;
  }
}

@media (width >= 782px) {
  .member-header02 {
    background: url(../img2/img59.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .member-header02:before {
    background: url(../img2/img135.jpg) no-repeat center/cover !important;
  }
}

@media (width >= 782px) {
  .member-header03 {
    background: url(../img2/img67.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .member-header03:before {
    background: url(../img2/img134.jpg) no-repeat center/cover !important;
  }
}

@media (width >= 782px) {
  .member-header04 {
    background: url(../img2/img75.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .member-header04:before {
    background: url(../img2/img133.jpg) no-repeat center/cover !important;
  }
}

@media (width >= 782px) {
  .member-header05 {
    background: url(../img2/img84.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .member-header05:before {
    background: url(../img2/img132.jpg) no-repeat center/cover !important;
  }
}

@media (width >= 782px) {
  .member-timeline .s {
    text-align: right;
  }
}
@media (width < 782px) {
  .member-timeline .s {
    text-align: left;
  }
}
.member-timeline .group {
  padding: 0;
}
.member-timeline .group h2.disabled {
  cursor: normal;
}
.member-timeline .group h2.disabled:after {
  display: none;
}
.member-timeline .group section {
  width: 100%;
  max-width: 370px;
}

@media (width >= 782px) {
  .member-paging figure {
    grid-template-columns: 150px 1fr !important;
  }
}
.page-member-sec50 figure {
  position: relative;
  transition: all 0.3s ease 0s;
}
.page-member-sec50 figure:hover {
  z-index: 20;
  transform: scale(1.05);
}
.page-member-sec50 figure a {
  position: relative;
  z-index: 5;
}
.page-member-sec50 figure .logo {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 20;
}
.page-member-sec50 figure .title {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 20;
}
.page-member-sec50 figure figcaption span {
  border-bottom: 2px solid #ff5a5a;
  display: inline !important;
  padding-bottom: 5px;
}

.page-member-sec4 {
  z-index: 60;
}
@media (width >= 782px) {
  .page-member-sec4 {
    background: url(../img2/img30.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .page-member-sec4 {
    background: url(../img2/img138.jpg) no-repeat center/cover;
  }
}

.page-member-sec3 {
  z-index: 50;
}
@media (width >= 782px) {
  .page-member-sec3 {
    background: url(../img2/img31.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .page-member-sec3 {
    background: url(../img2/img139.jpg) no-repeat center/cover;
  }
}

.page-member-sec2 {
  z-index: 40;
}
@media (width >= 782px) {
  .page-member-sec2 {
    background: url(../img2/img32.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .page-member-sec2 {
    background: url(../img2/img140.jpg) no-repeat center/cover;
  }
}

.page-member-sec1 {
  z-index: 30;
}
@media (width >= 782px) {
  .page-member-sec1 {
    background: url(../img2/img33.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .page-member-sec1 {
    background: url(../img2/img141.jpg) no-repeat center/cover;
  }
}

.page-member-sec6 {
  z-index: 20;
}
@media (width >= 782px) {
  .page-member-sec6 {
    background: url(../img2/img34.jpg) no-repeat center/cover;
  }
}
@media (width < 782px) {
  .page-member-sec6 {
    background: url(../img2/img142.jpg) no-repeat center/cover;
  }
}

@media screen and (max-width: 835px) {
  .page-member-sec2 .member-profile h2,
  .page-member-sec4 .member-profile h2,
  .page-member-sec6 .member-profile h2 {
    align-items: start;
  }
  .page-member-sec2 .member-profile > p,
  .page-member-sec4 .member-profile > p,
  .page-member-sec6 .member-profile > p {
    text-align: left;
  }
  .page-member-sec2 .member-profile .member-tags,
  .page-member-sec4 .member-profile .member-tags,
  .page-member-sec6 .member-profile .member-tags {
    margin-right: auto;
    margin-left: 0;
  }
  .page-member-sec1 .member-profile h2,
  .page-member-sec3 .member-profile h2 {
    align-items: end;
  }
  .page-member-sec1 .member-profile > p,
  .page-member-sec3 .member-profile > p {
    text-align: right;
  }
  .page-member-sec1 .member-profile .member-tags,
  .page-member-sec3 .member-profile .member-tags {
    margin-right: 0;
    margin-left: auto;
    justify-content: end;
  }
}
.page-member-sec h2 {
  margin-bottom: 1vw;
}

.slide-right {
  text-align: center;
}
.slide-right img {
  margin-left: auto;
  margin-right: auto;
}
.slide-right.scroll-active img {
  transform: translate(0, 0);
}

.red-line {
  border-bottom: 6px solid #f587b4;
}

.green-line {
  border-bottom: 6px solid #00b4b4;
}

.simple-header {
  margin-bottom: 0px !important;
  padding-bottom: 100px !important;
}

.spbtn {
  width: 40px;
  height: 45px;
  background: transparent;
  position: fixed;
  top: 0;
  right: 0;
  box-sizing: border-box;
  padding: 10px;
  z-index: 1100;
}
@media (width >= 1400px) {
  .spbtn {
    display: none;
  }
}
.spbtn span {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--base-color-navy-1);
  position: relative;
  transition: all 0.25s ease-out 0s;
}
.spbtn .l1 {
  top: 7px;
}
.spbtn .l2 {
  top: 10px;
}
.spbtn .l3 {
  top: 13px;
}
.spbtn.active span {
  background: #fff;
}
.spbtn.active .l1 {
  left: 0;
  top: 14px;
  transform: rotate(135deg);
}
.spbtn.active .l2 {
  opacity: 0;
}
.spbtn.active .l3 {
  left: 0;
  top: 10px;
  transform: rotate(-135deg);
}

.sp-navigation {
  width: 100%;
  z-index: 50;
  overflow: hidden;
  height: 0;
}
.sp-navigation.active {
  animation-name: naActive;
  animation-duration: 0.3s;
  animation-timing-function: ease-out;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
}
.sp-navigation.hide {
  animation-name: naHide;
  animation-duration: 0.3s;
  animation-timing-function: ease-out;
  animation-delay: 0s;
  animation-iteration-count: 1;
  animation-direction: normal;
  animation-fill-mode: forwards;
  animation-play-state: running;
}

@keyframes naActive {
  0% {
    height: 100%;
    opacity: 0;
    transform: scale(0.8);
  }
  100% {
    height: 100%;
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes naHide {
  0% {
    height: 100%;
    opacity: 1;
    transform: scale(1);
  }
  99% {
    height: 100%;
    opacity: 0;
    transform: scale(0.8);
  }
  100% {
    height: 0%;
  }
}
@media ( width < 992px ) {
  .lt {
    display: none !important;
  }
}

@media ( width < 600px ) {
  .lt-tb {
    display: none !important;
  }
}

@media ( width < 600px ), ( width >= 992px ) {
  .tb {
    display: none !important;
  }
}

@media ( width >= 992px ) {
  .tb-sp {
    display: none !important;
  }
}

@media ( width >= 600px ) {
  .sp {
    display: none !important;
  }
}

.tl {
  text-align: left !important;
}

@media (width >= 992px) {
  .tllt {
    text-align: left !important;
  }
}

@media (width >= 600px) {
  .tllt-tb {
    text-align: left !important;
  }
}

@media (600px <= width < 992px) {
  .tltb {
    text-align: left !important;
  }
}

@media (width < 992px) {
  .tltb-sp {
    text-align: left !important;
  }
}

@media (width < 600px) {
  .tlsp {
    text-align: left !important;
  }
}

.tc {
  text-align: center !important;
}

@media (width >= 992px) {
  .tclt {
    text-align: center !important;
  }
}

@media (width >= 600px) {
  .tclt-tb {
    text-align: center !important;
  }
}

@media (600px <= width < 992px) {
  .tctb {
    text-align: center !important;
  }
}

@media (width < 992px) {
  .tctb-sp {
    text-align: center !important;
  }
}

@media (width < 600px) {
  .tcsp {
    text-align: center !important;
  }
}

.tr {
  text-align: right !important;
}

@media (width >= 992px) {
  .trlt {
    text-align: right !important;
  }
}

@media (width >= 600px) {
  .trlt-tb {
    text-align: right !important;
  }
}

@media (600px <= width < 992px) {
  .trtb {
    text-align: right !important;
  }
}

@media (width < 992px) {
  .trtb-sp {
    text-align: right !important;
  }
}

@media (width < 600px) {
  .trsp {
    text-align: right !important;
  }
}

.tj {
  text-align: justify !important;
}

@media (width >= 992px) {
  .tjlt {
    text-align: justify !important;
  }
}

@media (width >= 600px) {
  .tjlt-tb {
    text-align: justify !important;
  }
}

@media (600px <= width < 992px) {
  .tjtb {
    text-align: justify !important;
  }
}

@media (width < 992px) {
  .tjtb-sp {
    text-align: justify !important;
  }
}

@media (width < 600px) {
  .tjsp {
    text-align: justify !important;
  }
}

.m-10 {
  margin: 10px !important;
}

@media (width >= 992px) {
  .mlt-10 {
    margin: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-10 {
    margin: 10px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-10 {
    margin: 10px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-10 {
    margin: 10px !important;
  }
}

@media (width < 600px) {
  .msp-10 {
    margin: 10px !important;
  }
}

.mt-10 {
  margin-top: 10px !important;
}

@media (width >= 992px) {
  .mtlt-10 {
    margin-top: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-10 {
    margin-top: 10px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-10 {
    margin-top: 10px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-10 {
    margin-top: 10px !important;
  }
}

@media (width < 600px) {
  .mtsp-10 {
    margin-top: 10px !important;
  }
}

.mr-10 {
  margin-right: 10px !important;
}

@media (width >= 992px) {
  .mrlt-10 {
    margin-right: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-10 {
    margin-right: 10px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-10 {
    margin-right: 10px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-10 {
    margin-right: 10px !important;
  }
}

@media (width < 600px) {
  .mrsp-10 {
    margin-right: 10px !important;
  }
}

.mb-10 {
  margin-bottom: 10px !important;
}

@media (width >= 992px) {
  .mblt-10 {
    margin-bottom: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-10 {
    margin-bottom: 10px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-10 {
    margin-bottom: 10px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-10 {
    margin-bottom: 10px !important;
  }
}

@media (width < 600px) {
  .mbsp-10 {
    margin-bottom: 10px !important;
  }
}

.ml-10 {
  margin-left: 10px !important;
}

@media (width >= 992px) {
  .mllt-10 {
    margin-left: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-10 {
    margin-left: 10px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-10 {
    margin-left: 10px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-10 {
    margin-left: 10px !important;
  }
}

@media (width < 600px) {
  .mlsp-10 {
    margin-left: 10px !important;
  }
}

.m-20 {
  margin: 20px !important;
}

@media (width >= 992px) {
  .mlt-20 {
    margin: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-20 {
    margin: 20px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-20 {
    margin: 20px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-20 {
    margin: 20px !important;
  }
}

@media (width < 600px) {
  .msp-20 {
    margin: 20px !important;
  }
}

.mt-20 {
  margin-top: 20px !important;
}

@media (width >= 992px) {
  .mtlt-20 {
    margin-top: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-20 {
    margin-top: 20px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-20 {
    margin-top: 20px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-20 {
    margin-top: 20px !important;
  }
}

@media (width < 600px) {
  .mtsp-20 {
    margin-top: 20px !important;
  }
}

.mr-20 {
  margin-right: 20px !important;
}

@media (width >= 992px) {
  .mrlt-20 {
    margin-right: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-20 {
    margin-right: 20px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-20 {
    margin-right: 20px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-20 {
    margin-right: 20px !important;
  }
}

@media (width < 600px) {
  .mrsp-20 {
    margin-right: 20px !important;
  }
}

.mb-20 {
  margin-bottom: 20px !important;
}

@media (width >= 992px) {
  .mblt-20 {
    margin-bottom: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-20 {
    margin-bottom: 20px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-20 {
    margin-bottom: 20px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-20 {
    margin-bottom: 20px !important;
  }
}

@media (width < 600px) {
  .mbsp-20 {
    margin-bottom: 20px !important;
  }
}

.ml-20 {
  margin-left: 20px !important;
}

@media (width >= 992px) {
  .mllt-20 {
    margin-left: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-20 {
    margin-left: 20px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-20 {
    margin-left: 20px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-20 {
    margin-left: 20px !important;
  }
}

@media (width < 600px) {
  .mlsp-20 {
    margin-left: 20px !important;
  }
}

.m-30 {
  margin: 30px !important;
}

@media (width >= 992px) {
  .mlt-30 {
    margin: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-30 {
    margin: 30px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-30 {
    margin: 30px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-30 {
    margin: 30px !important;
  }
}

@media (width < 600px) {
  .msp-30 {
    margin: 30px !important;
  }
}

.mt-30 {
  margin-top: 30px !important;
}

@media (width >= 992px) {
  .mtlt-30 {
    margin-top: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-30 {
    margin-top: 30px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-30 {
    margin-top: 30px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-30 {
    margin-top: 30px !important;
  }
}

@media (width < 600px) {
  .mtsp-30 {
    margin-top: 30px !important;
  }
}

.mr-30 {
  margin-right: 30px !important;
}

@media (width >= 992px) {
  .mrlt-30 {
    margin-right: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-30 {
    margin-right: 30px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-30 {
    margin-right: 30px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-30 {
    margin-right: 30px !important;
  }
}

@media (width < 600px) {
  .mrsp-30 {
    margin-right: 30px !important;
  }
}

.mb-30 {
  margin-bottom: 30px !important;
}

@media (width >= 992px) {
  .mblt-30 {
    margin-bottom: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-30 {
    margin-bottom: 30px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-30 {
    margin-bottom: 30px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-30 {
    margin-bottom: 30px !important;
  }
}

@media (width < 600px) {
  .mbsp-30 {
    margin-bottom: 30px !important;
  }
}

.ml-30 {
  margin-left: 30px !important;
}

@media (width >= 992px) {
  .mllt-30 {
    margin-left: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-30 {
    margin-left: 30px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-30 {
    margin-left: 30px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-30 {
    margin-left: 30px !important;
  }
}

@media (width < 600px) {
  .mlsp-30 {
    margin-left: 30px !important;
  }
}

.m-40 {
  margin: 40px !important;
}

@media (width >= 992px) {
  .mlt-40 {
    margin: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-40 {
    margin: 40px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-40 {
    margin: 40px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-40 {
    margin: 40px !important;
  }
}

@media (width < 600px) {
  .msp-40 {
    margin: 40px !important;
  }
}

.mt-40 {
  margin-top: 40px !important;
}

@media (width >= 992px) {
  .mtlt-40 {
    margin-top: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-40 {
    margin-top: 40px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-40 {
    margin-top: 40px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-40 {
    margin-top: 40px !important;
  }
}

@media (width < 600px) {
  .mtsp-40 {
    margin-top: 40px !important;
  }
}

.mr-40 {
  margin-right: 40px !important;
}

@media (width >= 992px) {
  .mrlt-40 {
    margin-right: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-40 {
    margin-right: 40px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-40 {
    margin-right: 40px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-40 {
    margin-right: 40px !important;
  }
}

@media (width < 600px) {
  .mrsp-40 {
    margin-right: 40px !important;
  }
}

.mb-40 {
  margin-bottom: 40px !important;
}

@media (width >= 992px) {
  .mblt-40 {
    margin-bottom: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-40 {
    margin-bottom: 40px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-40 {
    margin-bottom: 40px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-40 {
    margin-bottom: 40px !important;
  }
}

@media (width < 600px) {
  .mbsp-40 {
    margin-bottom: 40px !important;
  }
}

.ml-40 {
  margin-left: 40px !important;
}

@media (width >= 992px) {
  .mllt-40 {
    margin-left: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-40 {
    margin-left: 40px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-40 {
    margin-left: 40px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-40 {
    margin-left: 40px !important;
  }
}

@media (width < 600px) {
  .mlsp-40 {
    margin-left: 40px !important;
  }
}

.m-50 {
  margin: 50px !important;
}

@media (width >= 992px) {
  .mlt-50 {
    margin: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-50 {
    margin: 50px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-50 {
    margin: 50px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-50 {
    margin: 50px !important;
  }
}

@media (width < 600px) {
  .msp-50 {
    margin: 50px !important;
  }
}

.mt-50 {
  margin-top: 50px !important;
}

@media (width >= 992px) {
  .mtlt-50 {
    margin-top: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-50 {
    margin-top: 50px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-50 {
    margin-top: 50px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-50 {
    margin-top: 50px !important;
  }
}

@media (width < 600px) {
  .mtsp-50 {
    margin-top: 50px !important;
  }
}

.mr-50 {
  margin-right: 50px !important;
}

@media (width >= 992px) {
  .mrlt-50 {
    margin-right: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-50 {
    margin-right: 50px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-50 {
    margin-right: 50px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-50 {
    margin-right: 50px !important;
  }
}

@media (width < 600px) {
  .mrsp-50 {
    margin-right: 50px !important;
  }
}

.mb-50 {
  margin-bottom: 50px !important;
}

@media (width >= 992px) {
  .mblt-50 {
    margin-bottom: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-50 {
    margin-bottom: 50px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-50 {
    margin-bottom: 50px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-50 {
    margin-bottom: 50px !important;
  }
}

@media (width < 600px) {
  .mbsp-50 {
    margin-bottom: 50px !important;
  }
}

.ml-50 {
  margin-left: 50px !important;
}

@media (width >= 992px) {
  .mllt-50 {
    margin-left: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-50 {
    margin-left: 50px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-50 {
    margin-left: 50px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-50 {
    margin-left: 50px !important;
  }
}

@media (width < 600px) {
  .mlsp-50 {
    margin-left: 50px !important;
  }
}

.m-60 {
  margin: 60px !important;
}

@media (width >= 992px) {
  .mlt-60 {
    margin: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-60 {
    margin: 60px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-60 {
    margin: 60px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-60 {
    margin: 60px !important;
  }
}

@media (width < 600px) {
  .msp-60 {
    margin: 60px !important;
  }
}

.mt-60 {
  margin-top: 60px !important;
}

@media (width >= 992px) {
  .mtlt-60 {
    margin-top: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-60 {
    margin-top: 60px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-60 {
    margin-top: 60px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-60 {
    margin-top: 60px !important;
  }
}

@media (width < 600px) {
  .mtsp-60 {
    margin-top: 60px !important;
  }
}

.mr-60 {
  margin-right: 60px !important;
}

@media (width >= 992px) {
  .mrlt-60 {
    margin-right: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-60 {
    margin-right: 60px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-60 {
    margin-right: 60px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-60 {
    margin-right: 60px !important;
  }
}

@media (width < 600px) {
  .mrsp-60 {
    margin-right: 60px !important;
  }
}

.mb-60 {
  margin-bottom: 60px !important;
}

@media (width >= 992px) {
  .mblt-60 {
    margin-bottom: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-60 {
    margin-bottom: 60px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-60 {
    margin-bottom: 60px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-60 {
    margin-bottom: 60px !important;
  }
}

@media (width < 600px) {
  .mbsp-60 {
    margin-bottom: 60px !important;
  }
}

.ml-60 {
  margin-left: 60px !important;
}

@media (width >= 992px) {
  .mllt-60 {
    margin-left: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-60 {
    margin-left: 60px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-60 {
    margin-left: 60px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-60 {
    margin-left: 60px !important;
  }
}

@media (width < 600px) {
  .mlsp-60 {
    margin-left: 60px !important;
  }
}

.m-70 {
  margin: 70px !important;
}

@media (width >= 992px) {
  .mlt-70 {
    margin: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-70 {
    margin: 70px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-70 {
    margin: 70px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-70 {
    margin: 70px !important;
  }
}

@media (width < 600px) {
  .msp-70 {
    margin: 70px !important;
  }
}

.mt-70 {
  margin-top: 70px !important;
}

@media (width >= 992px) {
  .mtlt-70 {
    margin-top: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-70 {
    margin-top: 70px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-70 {
    margin-top: 70px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-70 {
    margin-top: 70px !important;
  }
}

@media (width < 600px) {
  .mtsp-70 {
    margin-top: 70px !important;
  }
}

.mr-70 {
  margin-right: 70px !important;
}

@media (width >= 992px) {
  .mrlt-70 {
    margin-right: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-70 {
    margin-right: 70px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-70 {
    margin-right: 70px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-70 {
    margin-right: 70px !important;
  }
}

@media (width < 600px) {
  .mrsp-70 {
    margin-right: 70px !important;
  }
}

.mb-70 {
  margin-bottom: 70px !important;
}

@media (width >= 992px) {
  .mblt-70 {
    margin-bottom: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-70 {
    margin-bottom: 70px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-70 {
    margin-bottom: 70px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-70 {
    margin-bottom: 70px !important;
  }
}

@media (width < 600px) {
  .mbsp-70 {
    margin-bottom: 70px !important;
  }
}

.ml-70 {
  margin-left: 70px !important;
}

@media (width >= 992px) {
  .mllt-70 {
    margin-left: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-70 {
    margin-left: 70px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-70 {
    margin-left: 70px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-70 {
    margin-left: 70px !important;
  }
}

@media (width < 600px) {
  .mlsp-70 {
    margin-left: 70px !important;
  }
}

.m-80 {
  margin: 80px !important;
}

@media (width >= 992px) {
  .mlt-80 {
    margin: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-80 {
    margin: 80px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-80 {
    margin: 80px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-80 {
    margin: 80px !important;
  }
}

@media (width < 600px) {
  .msp-80 {
    margin: 80px !important;
  }
}

.mt-80 {
  margin-top: 80px !important;
}

@media (width >= 992px) {
  .mtlt-80 {
    margin-top: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-80 {
    margin-top: 80px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-80 {
    margin-top: 80px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-80 {
    margin-top: 80px !important;
  }
}

@media (width < 600px) {
  .mtsp-80 {
    margin-top: 80px !important;
  }
}

.mr-80 {
  margin-right: 80px !important;
}

@media (width >= 992px) {
  .mrlt-80 {
    margin-right: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-80 {
    margin-right: 80px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-80 {
    margin-right: 80px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-80 {
    margin-right: 80px !important;
  }
}

@media (width < 600px) {
  .mrsp-80 {
    margin-right: 80px !important;
  }
}

.mb-80 {
  margin-bottom: 80px !important;
}

@media (width >= 992px) {
  .mblt-80 {
    margin-bottom: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-80 {
    margin-bottom: 80px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-80 {
    margin-bottom: 80px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-80 {
    margin-bottom: 80px !important;
  }
}

@media (width < 600px) {
  .mbsp-80 {
    margin-bottom: 80px !important;
  }
}

.ml-80 {
  margin-left: 80px !important;
}

@media (width >= 992px) {
  .mllt-80 {
    margin-left: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-80 {
    margin-left: 80px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-80 {
    margin-left: 80px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-80 {
    margin-left: 80px !important;
  }
}

@media (width < 600px) {
  .mlsp-80 {
    margin-left: 80px !important;
  }
}

.m-90 {
  margin: 90px !important;
}

@media (width >= 992px) {
  .mlt-90 {
    margin: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-90 {
    margin: 90px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-90 {
    margin: 90px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-90 {
    margin: 90px !important;
  }
}

@media (width < 600px) {
  .msp-90 {
    margin: 90px !important;
  }
}

.mt-90 {
  margin-top: 90px !important;
}

@media (width >= 992px) {
  .mtlt-90 {
    margin-top: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-90 {
    margin-top: 90px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-90 {
    margin-top: 90px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-90 {
    margin-top: 90px !important;
  }
}

@media (width < 600px) {
  .mtsp-90 {
    margin-top: 90px !important;
  }
}

.mr-90 {
  margin-right: 90px !important;
}

@media (width >= 992px) {
  .mrlt-90 {
    margin-right: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-90 {
    margin-right: 90px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-90 {
    margin-right: 90px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-90 {
    margin-right: 90px !important;
  }
}

@media (width < 600px) {
  .mrsp-90 {
    margin-right: 90px !important;
  }
}

.mb-90 {
  margin-bottom: 90px !important;
}

@media (width >= 992px) {
  .mblt-90 {
    margin-bottom: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-90 {
    margin-bottom: 90px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-90 {
    margin-bottom: 90px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-90 {
    margin-bottom: 90px !important;
  }
}

@media (width < 600px) {
  .mbsp-90 {
    margin-bottom: 90px !important;
  }
}

.ml-90 {
  margin-left: 90px !important;
}

@media (width >= 992px) {
  .mllt-90 {
    margin-left: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-90 {
    margin-left: 90px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-90 {
    margin-left: 90px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-90 {
    margin-left: 90px !important;
  }
}

@media (width < 600px) {
  .mlsp-90 {
    margin-left: 90px !important;
  }
}

.m-100 {
  margin: 100px !important;
}

@media (width >= 992px) {
  .mlt-100 {
    margin: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .mtb-100 {
    margin: 100px !important;
  }
}

@media (600 <= width) {
  .mlt-tb-100 {
    margin: 100px !important;
  }
}

@media (width < 992px) {
  .mtb-sp-100 {
    margin: 100px !important;
  }
}

@media (width < 600px) {
  .msp-100 {
    margin: 100px !important;
  }
}

.mt-100 {
  margin-top: 100px !important;
}

@media (width >= 992px) {
  .mtlt-100 {
    margin-top: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .mttb-100 {
    margin-top: 100px !important;
  }
}

@media (600 <= width) {
  .mtlt-tb-100 {
    margin-top: 100px !important;
  }
}

@media (width < 992px) {
  .mttb-sp-100 {
    margin-top: 100px !important;
  }
}

@media (width < 600px) {
  .mtsp-100 {
    margin-top: 100px !important;
  }
}

.mr-100 {
  margin-right: 100px !important;
}

@media (width >= 992px) {
  .mrlt-100 {
    margin-right: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .mrtb-100 {
    margin-right: 100px !important;
  }
}

@media (600 <= width) {
  .mrlt-tb-100 {
    margin-right: 100px !important;
  }
}

@media (width < 992px) {
  .mrtb-sp-100 {
    margin-right: 100px !important;
  }
}

@media (width < 600px) {
  .mrsp-100 {
    margin-right: 100px !important;
  }
}

.mb-100 {
  margin-bottom: 100px !important;
}

@media (width >= 992px) {
  .mblt-100 {
    margin-bottom: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .mbtb-100 {
    margin-bottom: 100px !important;
  }
}

@media (600 <= width) {
  .mblt-tb-100 {
    margin-bottom: 100px !important;
  }
}

@media (width < 992px) {
  .mbtb-sp-100 {
    margin-bottom: 100px !important;
  }
}

@media (width < 600px) {
  .mbsp-100 {
    margin-bottom: 100px !important;
  }
}

.ml-100 {
  margin-left: 100px !important;
}

@media (width >= 992px) {
  .mllt-100 {
    margin-left: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .mltb-100 {
    margin-left: 100px !important;
  }
}

@media (600 <= width) {
  .mllt-tb-100 {
    margin-left: 100px !important;
  }
}

@media (width < 992px) {
  .mltb-sp-100 {
    margin-left: 100px !important;
  }
}

@media (width < 600px) {
  .mlsp-100 {
    margin-left: 100px !important;
  }
}

.p-10 {
  padding: 10px !important;
}

@media (width >= 992px) {
  .plt-10 {
    padding: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-10 {
    padding: 10px !important;
  }
}

@media (600 <= width) {
  .plt-tb-10 {
    padding: 10px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-10 {
    padding: 10px !important;
  }
}

@media (width < 600px) {
  .psp-10 {
    padding: 10px !important;
  }
}

.pt-10 {
  padding-top: 10px !important;
}

@media (width >= 992px) {
  .ptlt-10 {
    padding-top: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-10 {
    padding-top: 10px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-10 {
    padding-top: 10px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-10 {
    padding-top: 10px !important;
  }
}

@media (width < 600px) {
  .ptsp-10 {
    padding-top: 10px !important;
  }
}

.pr-10 {
  padding-right: 10px !important;
}

@media (width >= 992px) {
  .prlt-10 {
    padding-right: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-10 {
    padding-right: 10px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-10 {
    padding-right: 10px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-10 {
    padding-right: 10px !important;
  }
}

@media (width < 600px) {
  .prsp-10 {
    padding-right: 10px !important;
  }
}

.pb-10 {
  padding-bottom: 10px !important;
}

@media (width >= 992px) {
  .pblt-10 {
    padding-bottom: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-10 {
    padding-bottom: 10px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-10 {
    padding-bottom: 10px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-10 {
    padding-bottom: 10px !important;
  }
}

@media (width < 600px) {
  .pbsp-10 {
    padding-bottom: 10px !important;
  }
}

.pl-10 {
  padding-left: 10px !important;
}

@media (width >= 992px) {
  .pllt-10 {
    padding-left: 10px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-10 {
    padding-left: 10px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-10 {
    padding-left: 10px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-10 {
    padding-left: 10px !important;
  }
}

@media (width < 600px) {
  .plsp-10 {
    padding-left: 10px !important;
  }
}

.p-20 {
  padding: 20px !important;
}

@media (width >= 992px) {
  .plt-20 {
    padding: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-20 {
    padding: 20px !important;
  }
}

@media (600 <= width) {
  .plt-tb-20 {
    padding: 20px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-20 {
    padding: 20px !important;
  }
}

@media (width < 600px) {
  .psp-20 {
    padding: 20px !important;
  }
}

.pt-20 {
  padding-top: 20px !important;
}

@media (width >= 992px) {
  .ptlt-20 {
    padding-top: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-20 {
    padding-top: 20px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-20 {
    padding-top: 20px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-20 {
    padding-top: 20px !important;
  }
}

@media (width < 600px) {
  .ptsp-20 {
    padding-top: 20px !important;
  }
}

.pr-20 {
  padding-right: 20px !important;
}

@media (width >= 992px) {
  .prlt-20 {
    padding-right: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-20 {
    padding-right: 20px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-20 {
    padding-right: 20px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-20 {
    padding-right: 20px !important;
  }
}

@media (width < 600px) {
  .prsp-20 {
    padding-right: 20px !important;
  }
}

.pb-20 {
  padding-bottom: 20px !important;
}

@media (width >= 992px) {
  .pblt-20 {
    padding-bottom: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-20 {
    padding-bottom: 20px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-20 {
    padding-bottom: 20px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-20 {
    padding-bottom: 20px !important;
  }
}

@media (width < 600px) {
  .pbsp-20 {
    padding-bottom: 20px !important;
  }
}

.pl-20 {
  padding-left: 20px !important;
}

@media (width >= 992px) {
  .pllt-20 {
    padding-left: 20px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-20 {
    padding-left: 20px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-20 {
    padding-left: 20px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-20 {
    padding-left: 20px !important;
  }
}

@media (width < 600px) {
  .plsp-20 {
    padding-left: 20px !important;
  }
}

.p-30 {
  padding: 30px !important;
}

@media (width >= 992px) {
  .plt-30 {
    padding: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-30 {
    padding: 30px !important;
  }
}

@media (600 <= width) {
  .plt-tb-30 {
    padding: 30px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-30 {
    padding: 30px !important;
  }
}

@media (width < 600px) {
  .psp-30 {
    padding: 30px !important;
  }
}

.pt-30 {
  padding-top: 30px !important;
}

@media (width >= 992px) {
  .ptlt-30 {
    padding-top: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-30 {
    padding-top: 30px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-30 {
    padding-top: 30px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-30 {
    padding-top: 30px !important;
  }
}

@media (width < 600px) {
  .ptsp-30 {
    padding-top: 30px !important;
  }
}

.pr-30 {
  padding-right: 30px !important;
}

@media (width >= 992px) {
  .prlt-30 {
    padding-right: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-30 {
    padding-right: 30px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-30 {
    padding-right: 30px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-30 {
    padding-right: 30px !important;
  }
}

@media (width < 600px) {
  .prsp-30 {
    padding-right: 30px !important;
  }
}

.pb-30 {
  padding-bottom: 30px !important;
}

@media (width >= 992px) {
  .pblt-30 {
    padding-bottom: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-30 {
    padding-bottom: 30px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-30 {
    padding-bottom: 30px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-30 {
    padding-bottom: 30px !important;
  }
}

@media (width < 600px) {
  .pbsp-30 {
    padding-bottom: 30px !important;
  }
}

.pl-30 {
  padding-left: 30px !important;
}

@media (width >= 992px) {
  .pllt-30 {
    padding-left: 30px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-30 {
    padding-left: 30px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-30 {
    padding-left: 30px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-30 {
    padding-left: 30px !important;
  }
}

@media (width < 600px) {
  .plsp-30 {
    padding-left: 30px !important;
  }
}

.p-40 {
  padding: 40px !important;
}

@media (width >= 992px) {
  .plt-40 {
    padding: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-40 {
    padding: 40px !important;
  }
}

@media (600 <= width) {
  .plt-tb-40 {
    padding: 40px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-40 {
    padding: 40px !important;
  }
}

@media (width < 600px) {
  .psp-40 {
    padding: 40px !important;
  }
}

.pt-40 {
  padding-top: 40px !important;
}

@media (width >= 992px) {
  .ptlt-40 {
    padding-top: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-40 {
    padding-top: 40px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-40 {
    padding-top: 40px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-40 {
    padding-top: 40px !important;
  }
}

@media (width < 600px) {
  .ptsp-40 {
    padding-top: 40px !important;
  }
}

.pr-40 {
  padding-right: 40px !important;
}

@media (width >= 992px) {
  .prlt-40 {
    padding-right: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-40 {
    padding-right: 40px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-40 {
    padding-right: 40px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-40 {
    padding-right: 40px !important;
  }
}

@media (width < 600px) {
  .prsp-40 {
    padding-right: 40px !important;
  }
}

.pb-40 {
  padding-bottom: 40px !important;
}

@media (width >= 992px) {
  .pblt-40 {
    padding-bottom: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-40 {
    padding-bottom: 40px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-40 {
    padding-bottom: 40px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-40 {
    padding-bottom: 40px !important;
  }
}

@media (width < 600px) {
  .pbsp-40 {
    padding-bottom: 40px !important;
  }
}

.pl-40 {
  padding-left: 40px !important;
}

@media (width >= 992px) {
  .pllt-40 {
    padding-left: 40px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-40 {
    padding-left: 40px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-40 {
    padding-left: 40px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-40 {
    padding-left: 40px !important;
  }
}

@media (width < 600px) {
  .plsp-40 {
    padding-left: 40px !important;
  }
}

.p-50 {
  padding: 50px !important;
}

@media (width >= 992px) {
  .plt-50 {
    padding: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-50 {
    padding: 50px !important;
  }
}

@media (600 <= width) {
  .plt-tb-50 {
    padding: 50px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-50 {
    padding: 50px !important;
  }
}

@media (width < 600px) {
  .psp-50 {
    padding: 50px !important;
  }
}

.pt-50 {
  padding-top: 50px !important;
}

@media (width >= 992px) {
  .ptlt-50 {
    padding-top: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-50 {
    padding-top: 50px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-50 {
    padding-top: 50px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-50 {
    padding-top: 50px !important;
  }
}

@media (width < 600px) {
  .ptsp-50 {
    padding-top: 50px !important;
  }
}

.pr-50 {
  padding-right: 50px !important;
}

@media (width >= 992px) {
  .prlt-50 {
    padding-right: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-50 {
    padding-right: 50px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-50 {
    padding-right: 50px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-50 {
    padding-right: 50px !important;
  }
}

@media (width < 600px) {
  .prsp-50 {
    padding-right: 50px !important;
  }
}

.pb-50 {
  padding-bottom: 50px !important;
}

@media (width >= 992px) {
  .pblt-50 {
    padding-bottom: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-50 {
    padding-bottom: 50px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-50 {
    padding-bottom: 50px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-50 {
    padding-bottom: 50px !important;
  }
}

@media (width < 600px) {
  .pbsp-50 {
    padding-bottom: 50px !important;
  }
}

.pl-50 {
  padding-left: 50px !important;
}

@media (width >= 992px) {
  .pllt-50 {
    padding-left: 50px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-50 {
    padding-left: 50px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-50 {
    padding-left: 50px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-50 {
    padding-left: 50px !important;
  }
}

@media (width < 600px) {
  .plsp-50 {
    padding-left: 50px !important;
  }
}

.p-60 {
  padding: 60px !important;
}

@media (width >= 992px) {
  .plt-60 {
    padding: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-60 {
    padding: 60px !important;
  }
}

@media (600 <= width) {
  .plt-tb-60 {
    padding: 60px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-60 {
    padding: 60px !important;
  }
}

@media (width < 600px) {
  .psp-60 {
    padding: 60px !important;
  }
}

.pt-60 {
  padding-top: 60px !important;
}

@media (width >= 992px) {
  .ptlt-60 {
    padding-top: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-60 {
    padding-top: 60px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-60 {
    padding-top: 60px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-60 {
    padding-top: 60px !important;
  }
}

@media (width < 600px) {
  .ptsp-60 {
    padding-top: 60px !important;
  }
}

.pr-60 {
  padding-right: 60px !important;
}

@media (width >= 992px) {
  .prlt-60 {
    padding-right: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-60 {
    padding-right: 60px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-60 {
    padding-right: 60px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-60 {
    padding-right: 60px !important;
  }
}

@media (width < 600px) {
  .prsp-60 {
    padding-right: 60px !important;
  }
}

.pb-60 {
  padding-bottom: 60px !important;
}

@media (width >= 992px) {
  .pblt-60 {
    padding-bottom: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-60 {
    padding-bottom: 60px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-60 {
    padding-bottom: 60px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-60 {
    padding-bottom: 60px !important;
  }
}

@media (width < 600px) {
  .pbsp-60 {
    padding-bottom: 60px !important;
  }
}

.pl-60 {
  padding-left: 60px !important;
}

@media (width >= 992px) {
  .pllt-60 {
    padding-left: 60px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-60 {
    padding-left: 60px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-60 {
    padding-left: 60px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-60 {
    padding-left: 60px !important;
  }
}

@media (width < 600px) {
  .plsp-60 {
    padding-left: 60px !important;
  }
}

.p-70 {
  padding: 70px !important;
}

@media (width >= 992px) {
  .plt-70 {
    padding: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-70 {
    padding: 70px !important;
  }
}

@media (600 <= width) {
  .plt-tb-70 {
    padding: 70px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-70 {
    padding: 70px !important;
  }
}

@media (width < 600px) {
  .psp-70 {
    padding: 70px !important;
  }
}

.pt-70 {
  padding-top: 70px !important;
}

@media (width >= 992px) {
  .ptlt-70 {
    padding-top: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-70 {
    padding-top: 70px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-70 {
    padding-top: 70px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-70 {
    padding-top: 70px !important;
  }
}

@media (width < 600px) {
  .ptsp-70 {
    padding-top: 70px !important;
  }
}

.pr-70 {
  padding-right: 70px !important;
}

@media (width >= 992px) {
  .prlt-70 {
    padding-right: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-70 {
    padding-right: 70px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-70 {
    padding-right: 70px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-70 {
    padding-right: 70px !important;
  }
}

@media (width < 600px) {
  .prsp-70 {
    padding-right: 70px !important;
  }
}

.pb-70 {
  padding-bottom: 70px !important;
}

@media (width >= 992px) {
  .pblt-70 {
    padding-bottom: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-70 {
    padding-bottom: 70px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-70 {
    padding-bottom: 70px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-70 {
    padding-bottom: 70px !important;
  }
}

@media (width < 600px) {
  .pbsp-70 {
    padding-bottom: 70px !important;
  }
}

.pl-70 {
  padding-left: 70px !important;
}

@media (width >= 992px) {
  .pllt-70 {
    padding-left: 70px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-70 {
    padding-left: 70px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-70 {
    padding-left: 70px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-70 {
    padding-left: 70px !important;
  }
}

@media (width < 600px) {
  .plsp-70 {
    padding-left: 70px !important;
  }
}

.p-80 {
  padding: 80px !important;
}

@media (width >= 992px) {
  .plt-80 {
    padding: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-80 {
    padding: 80px !important;
  }
}

@media (600 <= width) {
  .plt-tb-80 {
    padding: 80px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-80 {
    padding: 80px !important;
  }
}

@media (width < 600px) {
  .psp-80 {
    padding: 80px !important;
  }
}

.pt-80 {
  padding-top: 80px !important;
}

@media (width >= 992px) {
  .ptlt-80 {
    padding-top: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-80 {
    padding-top: 80px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-80 {
    padding-top: 80px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-80 {
    padding-top: 80px !important;
  }
}

@media (width < 600px) {
  .ptsp-80 {
    padding-top: 80px !important;
  }
}

.pr-80 {
  padding-right: 80px !important;
}

@media (width >= 992px) {
  .prlt-80 {
    padding-right: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-80 {
    padding-right: 80px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-80 {
    padding-right: 80px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-80 {
    padding-right: 80px !important;
  }
}

@media (width < 600px) {
  .prsp-80 {
    padding-right: 80px !important;
  }
}

.pb-80 {
  padding-bottom: 80px !important;
}

@media (width >= 992px) {
  .pblt-80 {
    padding-bottom: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-80 {
    padding-bottom: 80px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-80 {
    padding-bottom: 80px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-80 {
    padding-bottom: 80px !important;
  }
}

@media (width < 600px) {
  .pbsp-80 {
    padding-bottom: 80px !important;
  }
}

.pl-80 {
  padding-left: 80px !important;
}

@media (width >= 992px) {
  .pllt-80 {
    padding-left: 80px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-80 {
    padding-left: 80px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-80 {
    padding-left: 80px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-80 {
    padding-left: 80px !important;
  }
}

@media (width < 600px) {
  .plsp-80 {
    padding-left: 80px !important;
  }
}

.p-90 {
  padding: 90px !important;
}

@media (width >= 992px) {
  .plt-90 {
    padding: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-90 {
    padding: 90px !important;
  }
}

@media (600 <= width) {
  .plt-tb-90 {
    padding: 90px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-90 {
    padding: 90px !important;
  }
}

@media (width < 600px) {
  .psp-90 {
    padding: 90px !important;
  }
}

.pt-90 {
  padding-top: 90px !important;
}

@media (width >= 992px) {
  .ptlt-90 {
    padding-top: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-90 {
    padding-top: 90px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-90 {
    padding-top: 90px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-90 {
    padding-top: 90px !important;
  }
}

@media (width < 600px) {
  .ptsp-90 {
    padding-top: 90px !important;
  }
}

.pr-90 {
  padding-right: 90px !important;
}

@media (width >= 992px) {
  .prlt-90 {
    padding-right: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-90 {
    padding-right: 90px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-90 {
    padding-right: 90px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-90 {
    padding-right: 90px !important;
  }
}

@media (width < 600px) {
  .prsp-90 {
    padding-right: 90px !important;
  }
}

.pb-90 {
  padding-bottom: 90px !important;
}

@media (width >= 992px) {
  .pblt-90 {
    padding-bottom: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-90 {
    padding-bottom: 90px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-90 {
    padding-bottom: 90px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-90 {
    padding-bottom: 90px !important;
  }
}

@media (width < 600px) {
  .pbsp-90 {
    padding-bottom: 90px !important;
  }
}

.pl-90 {
  padding-left: 90px !important;
}

@media (width >= 992px) {
  .pllt-90 {
    padding-left: 90px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-90 {
    padding-left: 90px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-90 {
    padding-left: 90px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-90 {
    padding-left: 90px !important;
  }
}

@media (width < 600px) {
  .plsp-90 {
    padding-left: 90px !important;
  }
}

.p-100 {
  padding: 100px !important;
}

@media (width >= 992px) {
  .plt-100 {
    padding: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .ptb-100 {
    padding: 100px !important;
  }
}

@media (600 <= width) {
  .plt-tb-100 {
    padding: 100px !important;
  }
}

@media (width < 992px) {
  .ptb-sp-100 {
    padding: 100px !important;
  }
}

@media (width < 600px) {
  .psp-100 {
    padding: 100px !important;
  }
}

.pt-100 {
  padding-top: 100px !important;
}

@media (width >= 992px) {
  .ptlt-100 {
    padding-top: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .pttb-100 {
    padding-top: 100px !important;
  }
}

@media (600 <= width) {
  .ptlt-tb-100 {
    padding-top: 100px !important;
  }
}

@media (width < 992px) {
  .pttb-sp-100 {
    padding-top: 100px !important;
  }
}

@media (width < 600px) {
  .ptsp-100 {
    padding-top: 100px !important;
  }
}

.pr-100 {
  padding-right: 100px !important;
}

@media (width >= 992px) {
  .prlt-100 {
    padding-right: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .prtb-100 {
    padding-right: 100px !important;
  }
}

@media (600 <= width) {
  .prlt-tb-100 {
    padding-right: 100px !important;
  }
}

@media (width < 992px) {
  .prtb-sp-100 {
    padding-right: 100px !important;
  }
}

@media (width < 600px) {
  .prsp-100 {
    padding-right: 100px !important;
  }
}

.pb-100 {
  padding-bottom: 100px !important;
}

@media (width >= 992px) {
  .pblt-100 {
    padding-bottom: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .pbtb-100 {
    padding-bottom: 100px !important;
  }
}

@media (600 <= width) {
  .pblt-tb-100 {
    padding-bottom: 100px !important;
  }
}

@media (width < 992px) {
  .pbtb-sp-100 {
    padding-bottom: 100px !important;
  }
}

@media (width < 600px) {
  .pbsp-100 {
    padding-bottom: 100px !important;
  }
}

.pl-100 {
  padding-left: 100px !important;
}

@media (width >= 992px) {
  .pllt-100 {
    padding-left: 100px !important;
  }
}

@media (600 <= width < 992px) {
  .pltb-100 {
    padding-left: 100px !important;
  }
}

@media (600 <= width) {
  .pllt-tb-100 {
    padding-left: 100px !important;
  }
}

@media (width < 992px) {
  .pltb-sp-100 {
    padding-left: 100px !important;
  }
}

@media (width < 600px) {
  .plsp-100 {
    padding-left: 100px !important;
  }
}

*[class*=spacer] {
  display: block;
}

.spacer-10 {
  height: 10px;
}

.spacer-20 {
  height: 20px;
}

.spacer-30 {
  height: 30px;
}

.spacer-40 {
  height: 40px;
}

.spacer-50 {
  height: 50px;
}

.spacer-60 {
  height: 60px;
}

.spacer-70 {
  height: 70px;
}

.spacer-80 {
  height: 80px;
}

.spacer-90 {
  height: 90px;
}

.spacer-100 {
  height: 100px;
}

@media (width >= 992px) {
  .spacer-lt-10 {
    height: 10px !important;
  }
  .spacer-lt-20 {
    height: 20px !important;
  }
  .spacer-lt-30 {
    height: 30px !important;
  }
  .spacer-lt-40 {
    height: 40px !important;
  }
  .spacer-lt-50 {
    height: 50px !important;
  }
  .spacer-lt-60 {
    height: 60px !important;
  }
  .spacer-lt-70 {
    height: 70px !important;
  }
  .spacer-lt-80 {
    height: 80px !important;
  }
  .spacer-lt-90 {
    height: 90px !important;
  }
  .spacer-lt-100 {
    height: 100px !important;
  }
}
@media (width >= 600px) {
  .spacer-lt-tb-10 {
    height: 10px !important;
  }
  .spacer-lt-tb-20 {
    height: 20px !important;
  }
  .spacer-lt-tb-30 {
    height: 30px !important;
  }
  .spacer-lt-tb-40 {
    height: 40px !important;
  }
  .spacer-lt-tb-50 {
    height: 50px !important;
  }
  .spacer-lt-tb-60 {
    height: 60px !important;
  }
  .spacer-lt-tb-70 {
    height: 70px !important;
  }
  .spacer-lt-tb-80 {
    height: 80px !important;
  }
  .spacer-lt-tb-90 {
    height: 90px !important;
  }
  .spacer-lt-tb-100 {
    height: 100px !important;
  }
}
@media (600px <= width < 992px) {
  .spacer-tb-10 {
    height: 10px !important;
  }
  .spacer-tb-20 {
    height: 20px !important;
  }
  .spacer-tb-30 {
    height: 30px !important;
  }
  .spacer-tb-40 {
    height: 40px !important;
  }
  .spacer-tb-50 {
    height: 50px !important;
  }
  .spacer-tb-60 {
    height: 60px !important;
  }
  .spacer-tb-70 {
    height: 70px !important;
  }
  .spacer-tb-80 {
    height: 80px !important;
  }
  .spacer-tb-90 {
    height: 90px !important;
  }
  .spacer-tb-100 {
    height: 100px !important;
  }
}
@media (width < 992px) {
  .spacer-tb-sp-10 {
    height: 10px !important;
  }
  .spacer-tb-sp-20 {
    height: 20px !important;
  }
  .spacer-tb-sp-30 {
    height: 30px !important;
  }
  .spacer-tb-sp-40 {
    height: 40px !important;
  }
  .spacer-tb-sp-50 {
    height: 50px !important;
  }
  .spacer-tb-sp-60 {
    height: 60px !important;
  }
  .spacer-tb-sp-70 {
    height: 70px !important;
  }
  .spacer-tb-sp-80 {
    height: 80px !important;
  }
  .spacer-tb-sp-90 {
    height: 90px !important;
  }
  .spacer-tb-sp-100 {
    height: 100px !important;
  }
}
@media (width < 600px) {
  .spacer-sp-10 {
    height: 10px !important;
  }
  .spacer-sp-20 {
    height: 20px !important;
  }
  .spacer-sp-30 {
    height: 30px !important;
  }
  .spacer-sp-40 {
    height: 40px !important;
  }
  .spacer-sp-50 {
    height: 50px !important;
  }
  .spacer-sp-60 {
    height: 60px !important;
  }
  .spacer-sp-70 {
    height: 70px !important;
  }
  .spacer-sp-80 {
    height: 80px !important;
  }
  .spacer-sp-90 {
    height: 90px !important;
  }
  .spacer-sp-100 {
    height: 100px !important;
  }
}
.tc {
  text-align: center !important;
}

.tl {
  text-align: left !important;
}

.tr {
  text-align: right !important;
}

@media (width >= 992px) {
  .tc-lt {
    text-align: center !important;
  }
  .tl-lt {
    text-align: left !important;
  }
  .tr-lt {
    text-align: right !important;
  }
}
@media (width >= 600px) {
  .tc-lt-tb {
    text-align: center !important;
  }
  .tl-lt-tb {
    text-align: left !important;
  }
  .tr-lt-tb {
    text-align: right !important;
  }
}
@media (600px <= width < 992px) {
  .tc-tb {
    text-align: center !important;
  }
  .tl-tb {
    text-align: left !important;
  }
  .tr-tb {
    text-align: right !important;
  }
}
@media (width < 992px) {
  .tc-tb-sp {
    text-align: center !important;
  }
  .tl-tb-sp {
    text-align: left !important;
  }
  .tr-tb-sp {
    text-align: right !important;
  }
}
@media (width < 600px) {
  .tc-sp {
    text-align: center !important;
  }
  .tl-sp {
    text-align: left !important;
  }
  .tr-sp {
    text-align: right !important;
  }
}
.topicpath {
  position: relative;
  top: 10px;
}

.load-layer:after {
  background: url(../img2/site-logo2.svg) no-repeat !important;
}

.anchor {
  height: 0;
  position: relative;
}
@media (width >= 1400px) {
  .anchor {
    top: -90px;
  }
}
@media (width < 1400px) {
  .anchor {
    top: -50px;
  }
}

@media (min-width: 836px) {
  .career-entry-title {
    padding-top: 8.3333333333vw;
  }
}
@media (max-width: 835px) {
  .career-entry-title {
    padding-top: 14.6666666667vw;
  }
}

.custom-heading {
  background: rgba(236, 237, 242, 0.1);
  line-height: 140%;
  margin-bottom: 40px;
  color: var(--base-color-navy-1);
  font-weight: normal;
  border-left: 5px solid var(--base-color-navy-1);
  padding: 10px;
}
@media (width >= 782px) {
  .custom-heading {
    font-size: 32px;
  }
}
@media (width < 782px) {
  .custom-heading {
    font-size: 20px;
  }
}

.career-entry-form input[type=text],
.career-entry-form input[type=email],
.career-entry-form input[type=tel],
.career-entry-form select {
  border: 1px solid #f2f2f2;
  border-radius: 5px;
}
.career-entry-form input[name=form-name1],
.career-entry-form input[name=form-name2],
.career-entry-form input[name=form-kana1],
.career-entry-form input[name=form-kana2] {
  display: inline-block;
  width: 200px;
  max-width: 47%;
}
.career-entry-form .gender label {
  display: inline-block;
  width: 100px;
}
.career-entry-form .birth label {
  display: inline-block;
  width: 100px;
  max-width: 33%;
}
.career-entry-form dt {
  padding-right: 0;
  margin-bottom: 3vw;
}
@media (width >= 992px) {
  .career-entry-form dt {
    white-space: nowrap;
  }
}
@media (width < 992px) {
  .career-entry-form dt {
    line-height: 140%;
  }
}
.career-entry-form strong.require {
  white-space: nowrap;
  flex: 0 0 60px;
}
@media screen and (min-width: 836px) {
  .career-entry-form span.note {
    flex: 0 1 auto;
    white-space: wrap;
    font-size: 13px;
  }
}
@media screen and (max-width: 835px) {
  .career-entry-form span.note {
    display: block !important;
    width: 100%;
    margin-left: 0 !important;
    font-size: 80% !important;
  }
}
@media (width >= 782px) {
  .career-entry-form dl {
    margin-left: 70px;
  }
}
@media (width < 782px) {
  .career-entry-form dl {
    margin-left: 30px;
  }
}
.career-entry-form dl:last-of-type dd {
  border-bottom: none;
  padding-bottom: 0;
}
.career-entry-form input[type=radio] {
  vertical-align: middle;
  position: relative;
  top: -2px;
}
.career-entry-form select {
  width: 100%;
  padding: 10px 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border-radius: 10px;
}
.career-entry-form dd.tel label {
  display: block;
}
.career-entry-form dd.tel label + label {
  margin-top: 20px;
}
.career-entry-form dd.tel input {
  display: inline-block;
  width: 20em;
  margin-left: 20px;
}
.career-entry-form .renrakusaki-address-type > span {
  display: block;
}
.career-entry-form .renrakusaki-address-type > span + span {
  margin-top: 20px;
}
.career-entry-form .year-month input {
  width: 170px;
  max-width: 45%;
  margin-right: 10px;
}
@media (width >= 782px) {
  .career-entry-form .year-month {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-direction: row;
    flex-flow: wrap;
  }
  .career-entry-form .year-month span {
    width: 50px;
    margin-right: 10px;
    display: block;
    text-align: center;
  }
}
@media (width < 782px) {
  .career-entry-form .year-month span {
    display: block;
  }
}
.career-entry-form .substitute {
  margin-top: 10px;
  border: 1px solid #E60020 !important;
  padding: 10px !important;
  border-radius: 5px;
}
.career-entry-form input[name=form-school-initial],
.career-entry-form input[name=form-koukou-sotsugyou-initial] {
  width: 240px !important;
  display: inline-block;
  margin-right: 20px;
}
.career-entry-form input[name=form-school-initial] + button,
.career-entry-form input[name=form-koukou-sotsugyou-initial] + button {
  display: inline-block;
  border: none;
  background: #808080;
  color: #fff;
  padding: 5px 15px;
  border-radius: 5px;
}
.career-entry-form .renrakusaki-selected.input-renrakusaki-disabled {
  display: none;
}
.career-entry-form > dd:has(dl.input-renrakusaki-disabled) dd {
  border-bottom: none !important;
}
@media screen and (max-width: 835px) {
  .career-entry-form dt {
    flex-flow: wrap;
  }
}

.mfp-wrap .form-confirm-layer dl {
  display: flex;
  flex-direction: row;
  flex-flow: wrap;
  align-items: stretch;
  justify-content: center;
  gap: 0;
}
.mfp-wrap .form-confirm-layer dl dt {
  flex: 0 0 250px;
  box-sizing: border-box;
  line-height: 130%;
  text-align: left;
  display: block;
}
.mfp-wrap .form-confirm-layer dl dd {
  flex: 0 0 calc(100% - 250px);
  box-sizing: border-box;
}
.mfp-wrap .form-confirm-layer dl > .title {
  flex: 0 0 100%;
  text-align: center;
  font-weight: bold;
  font-size: 120%;
}

#scroll-line > div span.bar {
  animation: scroll-line-animation-frame 3s cubic-bezier(0.2, 0.11, 0.15, 1.02) 0s infinite normal forwards running;
}

@keyframes scroll-line-animation-frame {
  0% {
    width: 0;
  }
  80% {
    width: 120px;
  }
  100% {
    width: 120px;
  }
}
.main-copy .mask {
  overflow: hidden;
}
.main-copy .mask:before {
  content: "";
  position: absolute;
  width: 0px;
  left: 0;
  bottom: 0;
  transform-origin: left bottom;
}
@media (width >= 782px) {
  .main-copy .mask:before {
    width: 200px;
    height: 60px;
  }
}
@media (width < 782px) {
  .main-copy .mask:before {
    width: 110px;
    height: 35px;
  }
}
.main-copy .message:nth-of-type(1) .mask {
  animation: main-copy-animation 0.9s ease 0.2s 1 normal forwards running;
}
.main-copy .message:nth-of-type(1) .mask img {
  animation: main-copy-animation-image 0.9s ease 0.2s 1 normal forwards running;
}
.main-copy .message:nth-of-type(1) .mask:before {
  background: linear-gradient(to right, var(--base-color-navy-1), var(--base-color-navy-2));
  animation: main-copy-animation-before 0.6s ease 0s 1 normal forwards running;
}
.main-copy .message:nth-of-type(2) .mask {
  animation: main-copy-animation 0.9s ease 0.6s 1 normal forwards running;
}
.main-copy .message:nth-of-type(2) .mask img {
  animation: main-copy-animation-image 0.9s ease 0.6s 1 normal forwards running;
}
.main-copy .message:nth-of-type(2) .mask:before {
  background: linear-gradient(to right, var(--base-color-green-1), var(--base-color-green-2));
  animation: main-copy-animation-before 0.6s ease 0.4s 1 normal forwards running;
}
.main-copy .message:nth-of-type(3) .mask {
  animation: main-copy-animation 0.9s ease 1s 1 normal forwards running;
}
.main-copy .message:nth-of-type(3) .mask img {
  animation: main-copy-animation-image 0.9s ease 1s 1 normal forwards running;
}
.main-copy .message:nth-of-type(3) .mask:before {
  background: linear-gradient(to right, var(--base-color-red-1), var(--base-color-red-2));
  animation: main-copy-animation-before 0.6s ease 0.8s 1 normal forwards running;
}

@keyframes main-copy-animation {
  from {
    width: 0;
  }
  to {
    width: 400px;
  }
}
@keyframes main-copy-animation-image {
  from {
    transform: translateX(-10px);
  }
  to {
    transform: translateX(0);
  }
}
@keyframes main-copy-animation-before {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}
main > *,
main > * > *,
.scroll-animation-target {
  transform: translateY(50px);
  opacity: 0;
}

main > .scroll-active,
main > * > .scroll-active,
.scroll-animation-target.scroll-active {
  animation: scroll-animation 1s ease 0s 1 normal forwards running;
}

@keyframes scroll-animation {
  from {
    transform: translateY(50px);
    opacity: 0;
  }
  to {
    transform: translateY(0px);
    opacity: 1;
  }
}
.scroll-active .graph-1 .bar {
  animation: graph-animation 5s cubic-bezier(0.17, 0.67, 0.48, 1.03) 1s 1 normal forwards running;
}

@keyframes graph-animation {
  from {
    max-width: 0;
  }
  to {
    max-width: 100%;
  }
}
.graph-2.scroll-active .bar {
  animation: graph-2-animation 3s ease 1s 1 normal forwards running;
}

@keyframes graph-2-animation {
  from {
    max-width: 0;
  }
  to {
    max-width: 100%;
  }
}
.scroll-active .member-timeline:after {
  height: 100%;
}

/*# sourceMappingURL=custom.css.map */
