@charset "UTF-8";
/*
Theme Name: Gaxi Agent
Author: Refu
Version: 1.0
*/
*, *::before, *::after {
  box-sizing: border-box;
}

body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

ul[role=list], ol[role=list] {
  list-style: none;
}

html:focus-within {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  line-height: 1.5;
}

a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

img, picture {
  max-width: 100%;
  display: block;
}

input, button, textarea, select {
  font: inherit;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }
}
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
body {
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: #2E2E2E;
  word-break: auto-phrase;
  max-width: 1920px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  background: linear-gradient(to right, #3D82E5, #A8E1FE);
}
@media screen and (max-width: 767px) {
  body {
    font-size: 14px;
  }
}
body.active::-webkit-scrollbar {
  display: none;
}

.page-id-107,
.page-id-44,
.page-id-42,
.page-id-261,
.page-id-263,
.page-id-382,
.page-id-384 {
  background: transparent;
}
.page-id-107 .header-btn .gray,
.page-id-107 .header-btn .lightblue,
.page-id-44 .header-btn .gray,
.page-id-44 .header-btn .lightblue,
.page-id-42 .header-btn .gray,
.page-id-42 .header-btn .lightblue,
.page-id-261 .header-btn .gray,
.page-id-261 .header-btn .lightblue,
.page-id-263 .header-btn .gray,
.page-id-263 .header-btn .lightblue,
.page-id-382 .header-btn .gray,
.page-id-382 .header-btn .lightblue,
.page-id-384 .header-btn .gray,
.page-id-384 .header-btn .lightblue {
  display: none !important;
}

.page-id-107 .header-btn .arrow-btn {
  background-color: #219FFC;
}
.page-id-107 .header-btn .arrow-btn:hover {
  background-color: #219FFC;
}

.page-id-44 .header-btn .arrow-btn,
.page-id-384 .header-btn .arrow-btn {
  background-color: #A383EB;
}
.page-id-44 .header-btn .arrow-btn:hover,
.page-id-384 .header-btn .arrow-btn:hover {
  background-color: #A383EB;
}

.page-id-42 .header-btn .arrow-btn,
.page-id-382 .header-btn .arrow-btn {
  background-color: #F8A212;
}
.page-id-42 .header-btn .arrow-btn:hover,
.page-id-382 .header-btn .arrow-btn:hover {
  background-color: #F8A212;
}

.container {
  width: 80%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .container {
    width: 90%;
  }
}

ul, li {
  margin: 0;
  padding: 0;
  list-style: none;
}

img {
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.wp-pagenavi {
  width: 100%;
  margin: 5rem auto 0;
  position: relative;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .wp-pagenavi {
    margin-top: 2.5rem;
  }
}
.wp-pagenavi .pages {
  display: none;
}
.wp-pagenavi span,
.wp-pagenavi a {
  margin: 0 0.5rem !important;
  display: inline-block;
  color: #2E2E2E;
  padding: 0.65rem 1.2rem !important;
  background-color: #fff;
  border: none !important;
  border-radius: 100vh;
  aspect-ratio: 1/1;
  width: 50px;
  height: 50px;
  font-weight: bold;
  font-size: 18px;
}
.wp-pagenavi span:hover,
.wp-pagenavi a:hover {
  color: #3D82E5;
  background-color: #E8E8E8;
  opacity: 1;
}
@media screen and (max-width: 767px) {
  .wp-pagenavi span,
  .wp-pagenavi a {
    padding: 0.3rem 0rem;
    width: 40px;
    height: 40px;
  }
}
.wp-pagenavi a.last,
.wp-pagenavi a.first {
  display: contents;
}
.wp-pagenavi span.current {
  background-color: #3D82E5;
  color: #fff;
  pointer-events: none;
}

.sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .sp {
    display: block;
  }
}

@media screen and (max-width: 767px) {
  .pc {
    display: none !important;
  }
}

.container-70 {
  width: 70%;
  margin: 0 auto;
  max-width: 1164px;
}
@media screen and (max-width: 1024px) {
  .container-70 {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .container-70 {
    width: 90%;
  }
}

.container-90 {
  width: 90%;
  margin: 0 auto;
}

.table_design03 {
  border-collapse: collapse;
  width: 100%;
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
  word-break: auto-phrase;
  background-color: #F4F4F4;
  margin: 2rem 0;
  border-radius: 10px;
}
.table_design03 tbody {
  padding: 1rem 5%;
  display: block;
}
.table_design03 td {
  padding: 1rem 0 1rem 0.5rem;
  vertical-align: top;
}
.table_design03 td:first-child {
  width: 20%;
  min-width: 150px;
  font-weight: 500;
}
@media screen and (max-width: 767px) {
  .table_design03 td:first-child {
    min-width: 90px;
  }
}
.table_design03 td:last-child {
  width: 80%;
}
@media screen and (max-width: 767px) {
  .table_design03 td {
    padding: 1rem 0rem;
  }
}
.table_design03 tr:not(:last-child) {
  border-bottom: 1px solid #B4B4B4;
}

.accordion-area {
  list-style: none;
  margin-top: 2rem;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  /*アコーディオンタイトル*/
}
.accordion-area li {
  border-bottom: 1px solid #209FFC;
  background-color: #fff;
  padding: 2.5rem;
}
@media screen and (max-width: 1024px) {
  .accordion-area li {
    padding: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .accordion-area li {
    padding: 1rem;
  }
}
.accordion-area .accordion-title {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  word-break: break-all;
  position: relative;
  cursor: pointer;
  transition: all 0.5s ease;
  font-weight: bold;
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 95%;
  padding-left: 4rem;
}
@media screen and (max-width: 1024px) {
  .accordion-area .accordion-title {
    width: 90%;
    padding-left: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .accordion-area .accordion-title {
    gap: 0.5rem;
    width: 90%;
    padding-left: 1.5rem;
  }
}
.accordion-area .accordion-title::before {
  position: absolute;
  content: "";
  width: 24px;
  height: 15px;
  background: url(./images/faq-ico.svg) no-repeat;
  background-size: contain;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  right: -3rem;
}
@media screen and (max-width: 1400px) {
  .accordion-area .accordion-title::before {
    width: 30px;
    height: 30px;
  }
}
@media screen and (max-width: 1024px) {
  .accordion-area .accordion-title::before {
    width: 25px;
    height: 25px;
  }
}
@media screen and (max-width: 767px) {
  .accordion-area .accordion-title::before {
    right: -2rem;
    width: 15px;
    height: 10px;
  }
}
.accordion-area .accordion-title::after {
  position: absolute;
  content: "";
  width: 24px;
  height: 24px;
  background: url(./images/faq-ico2.png) no-repeat;
  background-size: contain;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  left: 0rem;
}
@media screen and (max-width: 1400px) {
  .accordion-area .accordion-title::after {
    width: 30px;
    height: 30px;
  }
}
@media screen and (max-width: 1024px) {
  .accordion-area .accordion-title::after {
    width: 25px;
    height: 25px;
  }
}
@media screen and (max-width: 767px) {
  .accordion-area .accordion-title::after {
    right: -2rem;
    width: 15px;
    height: 15px;
  }
}
.accordion-area .accordion-title.close::before {
  transform: rotate(180deg) translateY(50%);
}
.accordion-area .box {
  display: none; /*はじめは非表示*/
  margin: 1rem 0 1rem;
  padding: 1rem 2rem 0 4rem;
  transition: display 0.5s;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .accordion-area .box {
    padding-left: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .accordion-area .box {
    padding: 1rem 0rem 0 1.5rem;
  }
}
.accordion-area .box::after {
  position: absolute;
  content: "";
  width: 20px;
  height: 24px;
  background: url(./images/faq-ico3.png) no-repeat;
  background-size: contain;
  top: 20px;
  left: 0;
}
@media screen and (max-width: 1400px) {
  .accordion-area .box::after {
    width: 30px;
    height: 30px;
  }
}
@media screen and (max-width: 1024px) {
  .accordion-area .box::after {
    width: 25px;
    height: 25px;
  }
}
@media screen and (max-width: 767px) {
  .accordion-area .box::after {
    right: -2rem;
    width: 15px;
    height: 15px;
  }
}
.accordion-area .box p:not(:last-child) {
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .accordion-area .box p:not(:last-child) {
    margin-bottom: 0.5rem;
  }
}
.accordion-area .box a {
  color: #209FFC;
  text-decoration: underline;
}

.blue-wrap-bg {
  padding-bottom: 1rem;
}

.product img {
  max-width: 440px;
  margin: 0 auto 2rem;
  width: 70%;
}
.product p {
  text-align: center;
}

.slider {
  display: none;
}

.slider.slick-initialized {
  display: block;
}

#page-top {
  z-index: 100;
  display: none;
}

#page-top a {
  position: fixed;
  right: 2.5%;
  bottom: 5%;
  z-index: 10;
  aspect-ratio: 1/1;
  background: linear-gradient(to bottom, #e29616, #f7c674);
  border-radius: 999vh;
  width: 10%;
  max-width: 180px;
  transition: 1s;
  cursor: pointer;
  min-width: 140px;
  z-index: 100;
}
@media screen and (max-width: 1024px) {
  #page-top a {
    bottom: 2%;
  }
}
@media screen and (max-width: 767px) {
  #page-top a {
    width: 80px;
    min-width: auto;
  }
}
#page-top a:before {
  content: "";
  position: absolute;
  width: 95%;
  aspect-ratio: 1/1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  border-radius: 999vh;
  border: 3px solid #fff;
}
@media screen and (max-width: 767px) {
  #page-top a:before {
    border: 1px solid #fff;
  }
}
#page-top a p {
  color: #fff;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: -moz-max-content;
  width: max-content;
}
@media screen and (max-width: 767px) {
  #page-top a p {
    font-size: 11px;
  }
}

.page-id-384 #page-top a {
  background: linear-gradient(to bottom, #7e5dc7, #b9a3eb);
}

.new-cta {
  background: linear-gradient(to right bottom, #003F74, #0061A8);
  padding: 1.5rem 0 2rem;
}
@media screen and (max-width: 767px) {
  .new-cta {
    padding: 2.5rem 0 ;
  }
}
.new-cta-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 80%;
  margin: 0 auto;
  max-width: 1345px;
}
@media screen and (max-width: 1024px) {
  .new-cta-wrap {
    flex-direction: column-reverse;
    gap: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .new-cta-wrap {
    width: 90%;
  }
}
.new-cta-wrap img {
  width: 47%;
}
@media screen and (max-width: 1024px) {
  .new-cta-wrap img {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .new-cta-wrap img {
    width: 100%;
  }
}
.new-cta-text {
  width: 45%;
  color: #fff;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .new-cta-text {
    width: -moz-fit-content;
    width: fit-content;
  }
}
.new-cta-text h2 {
  font-size: clamp(2rem, 1.636rem + 1.21vw, 3rem);
}
.new-cta-text > p {
  font-size: clamp(1.125rem, 0.989rem + 0.45vw, 1.5rem);
  margin-bottom: 0.5rem;
}

.new-cta-btn a {
  background-color: #FF7F00;
  border-radius: 4px;
  padding: 14px 1.5rem;
  color: #fff;
  text-align: center;
  min-width: 250px;
  border: 2px solid #FFD690;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 380px;
  gap: 2rem;
  font-size: clamp(1.25rem, 1.159rem + 0.3vw, 1.5rem);
  margin: 1rem auto 0;
}
.new-cta-btn a svg path{
  transition: 0.3s;
}
.new-cta-btn a:hover {
  color: #FF7F00;
  background-color: #fff;
}

.new-cta-btn a:hover svg path{
  fill: #FF7F00;
}

.new-cta-btn a svg{
  width: 3rem;
}

.content a {
  word-break: break-all;
}

header {
  transition: transform 0.5s ease-in-out;
  position: fixed;
  z-index: 9999;
  width: 100%;
  top: 0;
  background-color: #3D82E5;
  border-bottom: 1px solid #C4C4C4;
  display: flex;
  justify-content: space-between;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  height: 7.5rem;
}
header.hidden {
  opacity: 0 !important;
}

header.UpMove {
  animation: UpAnime 0.5s forwards;
}
@media screen and (max-width: 1024px) {
  header.UpMove {
    animation: none;
  }
}

@keyframes UpAnime {
  from {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
  to {
    opacity: 0;
    transform: translateX(-50%) translateY(-100px);
  }
}
header.DownMove {
  animation: DownAnime 0.5s forwards;
}
@media screen and (max-width: 1024px) {
  header.DownMove {
    animation: none;
  }
}

@keyframes DownAnime {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(-100px);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}
.login {
  width: 10%;
}
.login p br {
  display: none;
}
@media screen and (max-width: 1279px) {
  .login p br {
    display: block;
  }
}
@media screen and (max-width: 1024px) {
  .login {
    display: none;
  }
}

.login a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  cursor: pointer;
  color: #fff !important;
}
.login a:hover {
  opacity: 0.7;
}
.login a img {
  width: 30px;
  filter: brightness(100);
}
@media screen and (max-width: 1279px) {
  .login a img {
    width: 25px;
  }
}
.login a p {
  font-weight: bold;
  font-size: 12px;
  text-align: center;
}
@media screen and (max-width: 1400px) {
  .login a p {
    font-size: 10px;
  }
}
@media screen and (max-width: 1279px) {
  .login a p {
    width: 80%;
  }
  .login a p span {
    display: block;
  }
}

.header-contents {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  background-color: #fff;
  padding: 0 5%;
}


.header-left {
  width: calc(100% - 450px);
}

.header-left > p{
  color:#717171;
}

.header-left-bottom{
  display: flex;
  gap: 4rem;
  align-items: center;
  margin-top: 1rem;
}

.header-left .hamburger-nav{
  width: calc(100% - 350px);
}


.header-left .hamburger-nav__list{
  display: flex;
  gap: 3rem;
}

.header-left .hamburger-nav__list .menu-item-has-children{
  position: relative;
}

.header-left .hamburger-nav__list .menu-item-has-children::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 55px;
}

.l-header.UpMove .header-left .hamburger-nav__list .menu-item-has-children::before{
  display: none;
}

.header-left .hamburger-nav__list .menu-item-has-children > a{
  position: relative;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.header-left .hamburger-nav__list .menu-item-has-children > a::after{
  content: ">";
  color: #1266B6;
}

.header-left .hamburger-nav__list a{
  color: #1266B6;
}

.header-left .hamburger-nav__list a:hover{
  opacity: 0.7;
}

.header-left .hamburger-nav__list .sub-menu{
font-size: 1rem;
    transition: .3s;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100vw;
    padding: 7.5rem 10% 2.5rem;
    visibility: hidden;
    opacity: 0;
    background-color: #fff;
    transition: opacity .2s cubic-bezier(.33, 1, .68, 1) 0s, visibility .2s cubic-bezier(.33, 1, .68, 1) 0s;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.header-left .hamburger-nav__list .sub-menu li{
  width: calc((100% - 150px)/6);
}

.header-left .hamburger-nav__list .sub-menu li a{
  width: 100%;
  box-shadow: 0 3px 6px rgba(0,0,0,0.6);
  border-radius: 8px;
  border: 1px solid rgba(0,0,0,0.1);
  transition: 0.3s;
}

.header-left .hamburger-nav__list .sub-menu li a:hover{
  opacity: 1;
  box-shadow: none;
}

.header-left .hamburger-nav__list .sub-menu li a img{
  height: 100%;
  width: 100%;
}

.header-left .hamburger-nav__list .menu-item-has-children:hover .sub-menu {
    visibility: visible;
    opacity: 1;
    transition: opacity .5s cubic-bezier(.33, 1, .68, 1) .2s, visibility .5s cubic-bezier(.33, 1, .68, 1) .2s;
}
 
.header-left a {
  display: flex;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
}
.header-left a img {
  width: 100%;
  height: 45px;
  max-width: 300px;
}

@media screen and (max-width: 1600px) {
  .header-left .hamburger-nav__list{
    gap: 2rem;
  }
  .header-contents{
    padding: 0 2.5%;
  }
}

@media screen and (max-width: 767px) {
  .header-left a img {
    width: 130px;
    height: 25px;
  }
}

.header-right {
  display: flex;
  align-items: end;
  flex-direction: column-reverse;
  gap: 1rem;
  padding: 1rem 0;
  justify-content: end;
}
@media screen and (max-width: 1600px) {
  .header-right {
    padding: 0.5rem 0;
  }
}
@media screen and (max-width: 1024px) {
  .header-right {
    gap: 0.8rem;
    padding: 0;
    flex-direction: row;
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  .header-right {
    right: 2rem;
    top: 5px;
  }
}
.header-right > .hamburger-nav > ul {
  display: flex;
  align-items: center;
  gap: 3rem;
  font-size: 14px;
  gap: 1rem !important;
}
@media screen and (max-width: 1400px) {
  .header-right > .hamburger-nav > ul {
    gap: 2.5rem;
  }
}
@media screen and (max-width: 1279px) {
  .header-right > .hamburger-nav > ul {
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .header-right > .hamburger-nav > ul {
    display: none;
  }
}
.header-right > .hamburger-nav > ul > li > a:hover {
  color: #3D82E5;
}
.header-right > .hamburger-nav > ul .menu-item-has-children {
  position: relative;
  padding-right: 1.5rem;
}
.header-right > .hamburger-nav > ul .menu-item-has-children:before {
  content: "";
  width: 16px;
  background: url(./images/header-arrow.svg) no-repeat;
  background-size: contain;
  position: absolute;
  right: 0;
  top: 0;
  height: 8px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.header-right > .hamburger-nav > ul .menu-item-has-children:hover .sub-menu {
  display: block;
  transition: 0.3s;
  opacity: 1;
}
.header-right ul.sub-menu {
  display: none;
  list-style: none;
  position: absolute;
  top: 100%;
  width: 160px;
  padding: 22px 0 0;
  text-align: left;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  font-size: 1rem;
  opacity: 0;
  transition: 0.3s;
}
@media screen and (max-width: 1024px) {
  .header-right ul.sub-menu {
    position: relative;
    background: transparent;
    padding: 0;
    width: 100%;
  }
}
.header-right ul.sub-menu li {
  background-color: #2E2E2E;
  padding: 0.5rem 0;
}
.header-right ul.sub-menu li:not(:last-child) {
  border-bottom: 1px solid #fff;
}
@media screen and (max-width: 1024px) {
  .header-right ul.sub-menu li {
    position: relative;
    margin: 0;
    font-size: 14px;
    padding: 0.4rem 0;
    background-color: #fff;
    border: none;
  }
  .header-right ul.sub-menu li::before {
    content: ">";
    left: 0;
  }
}
.header-right ul.sub-menu li > a {
  color: #fff;
  padding-left: 1rem;
}
@media screen and (max-width: 1024px) {
  .header-right ul.sub-menu li > a {
    color: #2E2E2E;
  }
}
@media screen and (max-width: 1024px) {
  .header-right > .header-btn {
    display: none;
  }
  .header-right > .header-btn:nth-child(2){
    display: flex;
    flex-direction: row;
    margin: 0 !important;
  }
}

.hamburger-menu {
  display: none;
}
@media screen and (max-width: 1024px) {
  .hamburger-menu {
    display: block;
  }
}
.hamburger-menu input {
  display: none;
}
.hamburger-menu .menu-btn {
  display: flex;
  height: 45px;
  width: 45px;
  justify-content: center;
  align-items: center;
  z-index: 30;
  position: relative;
}
@media screen and (max-width: 767px) {
  .hamburger-menu .menu-btn {
    height: 40px;
    width: 40px;
  }
}
.hamburger-menu .menu-btn span,
.hamburger-menu .menu-btn span:before,
.hamburger-menu .menu-btn span:after {
  content: "";
  display: block;
  height: 2px;
  width: 30px;
  background-color: #3D82E5;
  position: absolute;
  transition: 0.3s;
}
.hamburger-menu .menu-btn span:before {
  bottom: 8px;
}
.hamburger-menu .menu-btn span:after {
  top: 8px;
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span {
  background-color: rgba(255, 255, 255, 0); /*メニューオープン時は真ん中の線を透明にする*/
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span::before {
  bottom: 0;
  transform: rotate(45deg);
}
.hamburger-menu #menu-btn-check:checked ~ .menu-btn span::after {
  top: 0;
  transform: rotate(-45deg);
}
.hamburger-menu .menu-content .logo {
  width: 60%;
  margin: 0 auto;
  max-width: 250px;
}
.hamburger-menu .menu-content .c-arrow-link {
  margin: 1.5rem auto 0;
}
.hamburger-menu .menu-content .hamburger-wrap {
  margin: 0 auto 5rem;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .hamburger-menu .menu-content .hamburger-wrap {
    margin: 0 auto;
  }
}
.hamburger-menu .menu-content ul li a {
  font-size: 18px;
  font-weight: bold;
}
.hamburger-menu .gnavi__sp-style {
  opacity: 0;
  position: fixed;
  z-index: -2;
  top: 4rem;
  background-color: #fff;
  width: 100%;
  height: calc(100vh - 4rem);
  height: calc(100svh - 4rem);
  right: -100%;
  transition: all 0.5s;
  font-size: 1rem;
  display: flex;
  flex-direction: column;
  gap: 2rem;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15);
  overflow: scroll;
}

.hamburger-menu .gnavi__sp-style.active {
  opacity: 1;
  z-index: 999;
  right: 0;
}
.hamburger-menu .gnavi__sp-style.active .hamburger-wrap {
  opacity: 1;
  z-index: 1;
}
.hamburger-menu .menu-item-has-children {
  position: relative;
}
.hamburger-menu .menu-item-has-children label {
  position: relative;
  cursor: pointer;
  font-size: 1rem;
  font-weight: normal;
  transition: all 0.5s ease;
  width: 20px;
  height: 20px;
}
.hamburger-menu .menu-item-has-children label::before, .hamburger-menu .menu-item-has-children label::after {
  position: absolute;
  content: "";
  width: 15px;
  height: 2px;
  background-color: #333;
  top: 45%;
  right: 10%;
  transition: 0.3s;
}
.hamburger-menu .menu-item-has-children label::before {
  transform: rotate(0deg);
}
.hamburger-menu .menu-item-has-children label::after {
  transform: rotate(90deg);
}
.hamburger-menu .menu-item-has-children.close .sub-menu {
  opacity: 1;
}
.hamburger-menu .menu-item-has-children.close label::before {
  transform: rotate(45deg);
}
.hamburger-menu .menu-item-has-children.close label::after {
  transform: rotate(-45deg);
}
/* 
.header-right .current-menu-item a {
  color: #3D82E5 !important;
} */


#breadcrumbs {
  color: #fff;
  width: 100%;
  padding: 4px 5%;
  font-size: 12px;
  margin-top: 7.5rem;
  color: #717171;
}
@media screen and (max-width: 767px) {
  #breadcrumbs {
    font-size: 10px;
  }
}
#breadcrumbs a {
  color: #717171;
}

.footer {
  background-color: #FAFAFA;
  padding: 2.5rem 0;
  z-index: 1;
}

.footer .container{
  width: 90%;
  max-width: 1536px;
}
.footer a:hover {
  opacity: 0.7;
}
.footer-wrap {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1279px) {
  .footer-wrap {
    flex-direction: column;
    align-items: flex-start;
    gap: 2.5rem;
  }
}
.footer-wrap > .footer-ul {
  width: calc(100% - 430px);
  display: flex;
  gap: 5rem;
  justify-content: end;
}

@media screen and (max-width: 1600px) {
  .footer-wrap > .footer-ul,
  .footer-nav1 > ul {
    gap: 2.5rem;
  }
}

@media screen and (max-width: 1279px) {
  .footer-wrap > .footer-ul {
    width: 100%;
  }
}
.footer-left {
  width: 400px;
  color: #2E2E2E;
}
@media screen and (max-width: 1400px) {
  .footer-left {
    width: 380px;
  }
}
@media screen and (max-width: 1024px) {
  .footer-left {
    width: 100%;
  }
}
.footer .logo {
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .footer .logo {
    margin-bottom: 0.5rem;
  }
}
.footer .logo img {
  max-width: 340px;
}
.footer .logo + p {
  font-weight: 500;
  margin-bottom: 0.5rem;
}
.footer-nav {
  font-weight: 500;
  width: fit-content;
}
@media screen and (max-width: 767px) {
  .footer-nav {
    width: 100%;
  }
}
.footer ul {
  display: flex;
  gap: 1rem 2.5rem;
  flex-wrap: wrap;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .footer ul {
    gap: 20px 0;
  }
}
@media screen and (max-width: 767px) {
  .footer ul > li {
    width: 100%;
  }
}
.footer ul > li > a {
  width: -moz-fit-content;
  width: fit-content;
}
.footer ul > li > a:hover {
  color: #3D82E5;
}
.footer .copyright {
  margin-top: 1.5rem;
  color: #B4B4B4;
  font-size: 14px;
  padding: 0 10%;
}
.footer-link {
  display: flex;
  gap: 1rem;
  margin-top: 2.5rem;
  flex-direction: column;
}
@media screen and (max-width: 767px) {
  .footer-link {
    gap: 1rem 2rem;
  }
}
.footer-link a {
  border-bottom: 1px solid;
  position: relative;
  color: #707070;
  font-weight: 500;
  width: fit-content;
}
.footer-link a:hover{
  opacity: 0.7;
}
/* .footer-link a:last-child::before {
  display: none;
}
.footer-link a::before {
  content: "";
  position: absolute;
  width: 1px;
  height: 105%;
  transform: rotate(20deg);
  right: -1.2rem;
  top: 0;
  background-color: #707070;
}
@media screen and (max-width: 767px) {
  .footer-link a::before {
    right: -0.8rem;
  }
} */
.footer-link a:first-child {
  color: #3D82E5;
}
.footer-img {
  margin-top: 5rem;
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 2.5rem 10% 0;
  border-top:1px solid #C6C6C6;
  justify-content: end;
}
@media screen and (max-width: 1024px) {
  .footer-img {
    justify-content: center;
  }
}
.footer-img img {
  max-height: 100px;
  width: auto;
}
@media screen and (max-width: 767px) {
  .footer-img img:first-of-type {
    width: 25%;
  }
}
@media screen and (max-width: 767px) {
  .footer-img img:last-of-type {
    width: calc(75% - 20px);
  }
}

.section-title {
  font-size: clamp(1.5rem, 0.682rem + 2.73vw, 3.75rem);
  line-height: 1;
  margin-bottom: 1rem;
  text-align: center;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .section-title {
    position: initial;
  }
}
.section-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: clamp(3rem, 1.364rem + 5.45vw, 7.5rem);
  color: #CDCDCD;
  height: -moz-max-content;
  height: max-content;
  z-index: -1;
  font-weight: 400;
}
.section-title.not404:before {
  content: "404";
}
.section-title.policy-title {
  font-family: "Noto Sans JP", sans-serif;
}
.section-title.policy-title:before {
  content: "Policy";
}
.section-title.contact-title:before {
  content: "contact";
}
.section-title.news-section-title:before {
  content: "news";
}
.section-title.shop-title:before {
  content: "shop";
}
.section-title.outsourcing-title:before {
  content: "Sales consignment";
  z-index: 5;
}
@media screen and (max-width: 767px) {
  .section-title {
    margin-bottom: 4px;
  }
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  line-height: 1.5;
}

.balloon2 {
  position: relative;
  display: inline-block;
  margin: 0 0 1rem;
  padding: 10px 2rem;
  min-width: 120px;
  max-width: 100%;
  color: #209FFC;
  font-size: 16px;
  background: #FFF;
  border: solid 3px #209FFC;
  box-sizing: border-box;
  border-radius: 30px;
}
@media screen and (max-width: 767px) {
  .balloon2 {
    border-radius: 15px;
    padding: 8px 1rem;
  }
}

.balloon2:before {
  content: "";
  position: absolute;
  bottom: -23px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}

.balloon2:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #209FFC;
  z-index: 1;
}

.balloon2 p {
  margin: 0;
  padding: 0;
}

.title {
  text-align: center;
}
.title h2 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  letter-spacing: 0.12em;
}
.title div.img-title {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
}
@media screen and (max-width: 767px) {
  .title div.img-title {
    flex-direction: column;
  }
}
.title div.img-title img {
  max-width: 340px;
}
@media screen and (max-width: 1024px) {
  .title div.img-title img {
    max-width: 280px;
  }
}

.title-ballon {
  margin: 0 auto 3rem;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  padding: 1rem 4rem;
}
@media screen and (max-width: 767px) {
  .title-ballon {
    padding: 0.5rem 1rem;
    margin-bottom: 1rem;
    border-radius: 15px;
  }
}
.title-ballon h2 {
  color: #2E2E2E;
}
.title-ballon h2 span {
  color: #209FFC;
  display: block;
  font-size: clamp(1.5rem, 1.136rem + 1.21vw, 2.5rem);
}

a {
  text-decoration: none;
  color: #2E2E2E;
}
a:hover {
  transition: 0.3s;
}

.scroll-box {
  margin-top: 7.5rem;
  text-align: center;
}
.scroll-box p {
  margin-bottom: 0 !important;
  font-weight: bold;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}

.btn {
  display: block;
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration: none;
  background-color: #fff;
  color: #209FFC;
  border: 3px solid #219FFC;
  font-size: 1rem;
  padding: 1rem 3rem;
  border-radius: 999vh;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15);
  font-weight: bold;
}
.btn-right {
  position: relative;
}
.btn-right::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.5rem;
  transform: translateY(-50%) rotate(-90deg);
  -webkit-transform: translateY(-50%) rotate(-90deg);
  -ms-transform: translateY(-50%) rotate(-90deg);
  background: url(./images/faq-ico.svg) no-repeat center/contain;
  width: 14px;
  height: 10px;
}
.btn-right:hover::before {
  filter: brightness(500);
}
.btn:hover {
  background-color: #219FFC;
  color: #fff;
}

.contact-hidden-btn {
  position: fixed;
  right: 2.5%;
  bottom: 5%;
  z-index: 10;
  aspect-ratio: 1/1;
  background: linear-gradient(to bottom, #209FFC, #ABE2FF);
  border-radius: 999vh;
  width: 10%;
  max-width: 180px;
  opacity: 0;
  transition: 1s;
  cursor: pointer;
  min-width: 140px;
}
@media screen and (max-width: 1279px) {
  .contact-hidden-btn {
    display: none;
  }
}
.contact-hidden-btn.visible {
  opacity: 1;
}
.contact-hidden-btn p {
  color: #fff;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: -moz-max-content;
  width: max-content;
}
.contact-hidden-btn::before {
  content: "";
  position: absolute;
  width: 95%;
  aspect-ratio: 1/1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  border-radius: 999vh;
  border: 3px solid #fff;
}

.contact-btn {
  width: 40px;
  height: 60px;
  top: calc(35vh - 60px);
  right: 19%;
  background-color: #fff;
  z-index: 2;
  position: fixed;
  border-radius: 20px 0 0 20px;
  transition: 0.3s;
  cursor: pointer;
}
@media screen and (max-width: 1279px) {
  .contact-btn {
    display: none;
  }
}
.contact-btn.close {
  right: 0;
  opacity: 0;
}
.contact-btn img {
  position: absolute;
  width: 15px;
  height: 10px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
  -webkit-transform: translate(-50%, -50%) rotate(-90deg);
  -ms-transform: translate(-50%, -50%) rotate(-90deg);
}

.arrow-btn {
  color: #fff;
  background-color: #3D82E5;
  padding: 1rem 5rem 1rem 2.5rem;
  border-radius: 999vh;
  text-align: center;
  display: block;
  margin: 5rem auto 0;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: bold;
  position: relative;
  font-size: 18px;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15);
}
@media screen and (max-width: 767px) {
  .arrow-btn {
    font-size: 1rem;
    padding: 0.8rem 5rem 0.8rem 2.5rem;
  }
}
.arrow-btn.white {
  background-color: #fff;
  color: #3D82E5;
}
.arrow-btn.white::before {
  background: url(./images/arrow-btn-white.svg) no-repeat center/contain;
}
.arrow-btn.white:hover {
  background: linear-gradient(to bottom, #AAE2FF, #3D82E5);
}
.arrow-btn:hover {
  background: linear-gradient(to bottom, #3D82E5, #8FCDFA);
}
.arrow-btn::before {
  content: "";
  position: absolute;
  width: 3rem;
  height: 3rem;
  background: url(./images/arrow-btn.svg) no-repeat center/contain;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .arrow-btn::before {
    width: 2.5rem;
    height: 2.5rem;
  }
}
.arrow-btn.reverse::before {
  transform: translateY(-50%) rotate(180deg);
  -webkit-transform: translateY(-50%) rotate(180deg);
  -ms-transform: translateY(-50%) rotate(180deg);
}

.float-button__wrap {
  width: -moz-max-content;
  width: max-content;
  position: fixed;
  bottom: 1rem;
  z-index: 10;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
@media screen and (min-width: 1280px) {
  .float-button__wrap {
    display: none !important;
  }
}
.float-button__wrap a {
  display: block;
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration: none;
  background-color: #fff;
  color: #209FFC;
  border: 1px solid #209FFC;
  font-size: 1rem;
  padding: 1rem 3rem;
  border-radius: 999vh;
  box-shadow: 0 10px 10px rgba(0, 0, 0, 0.15);
  font-weight: bold;
}

.float-button__wrap.UpMove {
  animation: UpAnime 0.5s forwards;
}

.float-button__wrap.DownMove {
  animation: DownAnime 0.5s forwards;
}

.scroll-down1 {
  width: 50px;
  height: 50px;
  border-radius: 100%;
  border: 2px solid #fff;
  font-size: 30px;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  background-color: #fff;
}
.scroll-down1 span {
  width: 0.5rem;
  height: 0.5rem;
  left: 1.4rem;
  border-top: solid 2px #209FFC;
  border-right: solid 2px #209FFC;
  z-index: 2;
  transition: all 0.3s;
  animation: scrollDown1 1.5s ease infinite;
}

@keyframes scrollDown1 {
  0% {
    transform: translateY(-30px) rotate(135deg);
    opacity: 0;
  }
  50% {
    transform: translateY(0px) rotate(135deg);
    opacity: 1;
  }
  100% {
    transform: translateY(30px) rotate(135deg);
    opacity: 0;
  }
}
.header-btn {
  display: flex;
  gap: 1.5rem;
}
@media screen and (max-width: 1024px) {
  .header-btn {
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin-bottom: 1.5rem;
  }
}
.header-btn .arrow-btn {
  margin: 0;
  width: 220px;
  padding: 0.7rem 2rem 0.7rem 0;
  box-shadow: none;
  font-size: 14px;
  border-radius: 10px;
  font-weight: 400;
}
.header-btn .arrow-btn.gray {
  background-color: #F4F4F4;
  color: #707070;
}
.header-btn .arrow-btn.gray:hover {
  background-color: #F4F4F4;
}
.header-btn .arrow-btn.gray .c-arrow-link--icon:before,
.header-btn .arrow-btn.gray .c-arrow-link--icon:after {
  content: "";
  background: url(./images/header-btn1.png) no-repeat center/contain;
}
.header-btn .arrow-btn.lightblue {
  background-color: #AAE2FF;
}
.header-btn .arrow-btn.lightblue:hover {
  background-color: #AAE2FF;
}
.header-btn .arrow-btn:hover {
  background: #3D82E5;
}
.header-btn .arrow-btn .c-arrow-link--icon {
  overflow: hidden;
  position: absolute;
  right: 1.5rem;
  width: 9px;
  margin: auto 0;
  height: 20px;
  line-height: 1;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.header-btn .arrow-btn .c-arrow-link--icon:before,
.header-btn .arrow-btn .c-arrow-link--icon:after {
  content: "";
  background: url(./images/header-btn2.png) no-repeat center/contain;
  position: absolute;
  top: 0;
  right: 0;
  animation-fill-mode: both;
  animation-duration: 0.6s;
  width: 9px;
  height: 20px;
}
@media screen and (max-width: 1279px) {
  .header-btn .arrow-btn {
    width: 190px;
    font-size: 12px;
  }
}
@media screen and (max-width: 1024px) {
  .header-btn .arrow-btn {
    font-size: 18px;
    width: 300px;
    padding: 1.1rem;
  }
}
.header-btn .arrow-btn::before {
  display: none;
}
.header-btn .arrow-btn.white {
  background-color: #fff;
  border: 1px solid #3D82E5;
}
.header-btn .arrow-btn.white:hover {
  background: #fff;
}
.header-btn .arrow-btn.white .c-arrow-link--icon:before,
.header-btn .arrow-btn.white .c-arrow-link--icon:after {
  content: "";
  background: url(./images/header-btn2.svg) no-repeat center/contain;
}

.c-arrow-link.arrow-btn {
  margin: 0;
}
.c-arrow-link.arrow-btn:hover {
  background: #3D82E5;
}
.c-arrow-link.arrow-btn .c-arrow-link--icon {
  overflow: hidden;
  position: absolute;
  right: 1.5rem;
  width: 9px;
  margin: auto 0;
  height: 20px;
  line-height: 1;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.c-arrow-link.arrow-btn .c-arrow-link--icon:before,
.c-arrow-link.arrow-btn .c-arrow-link--icon:after {
  content: "";
  background: url(./images/header-btn.svg) no-repeat center/contain;
  position: absolute;
  top: 0;
  right: 0;
  animation-fill-mode: both;
  animation-duration: 0.6s;
  width: 9px;
  height: 20px;
}
.c-arrow-link.arrow-btn::before {
  display: none;
}
.c-arrow-link.arrow-btn.white {
  background-color: #fff;
  border: 1px solid #3D82E5;
}
.c-arrow-link.arrow-btn.white:hover {
  background: #fff;
}
.c-arrow-link.arrow-btn.white .c-arrow-link--icon:before,
.c-arrow-link.arrow-btn.white .c-arrow-link--icon:after {
  content: "";
  background: url(./images/header-btn2.svg) no-repeat center/contain;
}

.c-arrow-link--icon:after {
  transform: translateX(-100%);
}

.c-arrow-link.is-hover .c-arrow-link--icon:before {
  animation-name: transformLeftRight;
  animation-delay: 0.2s;
}

.c-arrow-link.is-hover .c-arrow-link--icon:after {
  animation-name: transformRightLeft;
}

.c-arrow-link.is-hover:hover .c-arrow-link--icon:before {
  animation-name: transformRightLeft;
  animation-delay: 0s;
}

.c-arrow-link.is-hover:hover .c-arrow-link--icon:after {
  animation-name: transformLeftRight;
  animation-delay: 0.2s;
}

@keyframes transformLeftRight {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes transformRightLeft {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(100%);
  }
}
.talk-btn {
  display: flex;
  background-color: #FFFAD3;
  border: 3px solid #F8A213;
  color: #F8A213;
  border-radius: 999vh;
  align-items: center;
  justify-content: center;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
  width: 560px;
  height: 160px;
  margin: 2rem auto 0 !important;
}
@media screen and (max-width: 1600px) {
  .talk-btn {
    width: 400px;
    height: 120px;
  }
}
@media screen and (max-width: 767px) {
  .talk-btn {
    width: 310px;
    height: 90px;
  }
}
.talk-btn p {
  margin: 0 20px 0 0 !important;
}
@media screen and (max-width: 1600px) {
  .talk-btn p {
    margin: 0 10px 0 0 !important;
  }
}
.talk-btn svg {
  width: 40px;
  height: 28px;
}
@media screen and (max-width: 767px) {
  .talk-btn svg {
    width: 28px;
  }
}
.talk-btn svg path {
  transition: 0.3s;
}
.talk-btn .gaxi {
  width: 180px;
  aspect-ratio: 1/1;
  margin: 0 0 1rem !important;
}
@media screen and (max-width: 1600px) {
  .talk-btn .gaxi {
    width: 140px;
  }
}
@media screen and (max-width: 767px) {
  .talk-btn .gaxi {
    margin: 0 0 0.5rem !important;
    width: 101px;
  }
}

/*お知らせ一覧ページ*/
.news {
  margin: 5rem 0 0rem;
}
@media screen and (max-width: 767px) {
  .news {
    margin: 2.5rem 0 0rem;
  }
}
.news .container {
  max-width: 1345px;
  width: 75%;
}
@media screen and (max-width: 1279px) {
  .news .container {
    width: 80%;
  }
}
@media screen and (max-width: 1024px) {
  .news .container {
    width: 90%;
  }
}
.news .item {
  padding: 0 0 1.5rem;
  border-bottom: 5px solid #fff;
}
.news .item:not(:last-child) {
  margin-bottom: 4rem;
}
@media screen and (max-width: 1024px) {
  .news .item:not(:last-child) {
    margin-bottom: 2rem;
  }
}
.news .top-news-list ul.newsList {
  display: flex;
  align-items: center;
  gap: 2rem;
}
@media screen and (max-width: 767px) {
  .news .top-news-list ul.newsList {
    gap: 0.5rem;
  }
}
.news .top-news-list ul.newsList li:first-child {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.news .top-news-list ul.newsList li:last-child {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  word-break: break-all;
}
.news .top-news-list .news-item:hover {
  cursor: pointer;
}

.news-category-flex {
  display: flex;
  justify-content: center;
  gap: 20px;
  align-items: stretch;
}
@media screen and (max-width: 1400px) {
  .news-category-flex {
    gap: 4px;
  }
}
@media screen and (max-width: 1024px) {
  .news-category-flex {
    gap: 1rem 0;
    flex-wrap: wrap;
  }
}

.news-right-wrap {
  margin-bottom: 5rem;
  border-bottom: 6px solid #3D82E5;
}
@media screen and (max-width: 1024px) {
  .news-right-wrap {
    border: none;
    max-width: 700px;
    margin: 0 auto 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap {
    max-width: 370px;
  }
}
.news-right-wrap a.news-category-btn {
  background-color: #3D82E5;
  width: 15.6666666667%;
}
@media screen and (max-width: 1400px) {
  .news-right-wrap a.news-category-btn {
    width: 16.6666666667%;
  }
}
@media screen and (max-width: 1024px) {
  .news-right-wrap a.news-category-btn {
    width: 28.3333333333%;
  }
}
.news-right-wrap .member-list:nth-child(2) a {
  background-color: #F7C674;
}
.news-right-wrap .member-list:nth-child(3) a {
  background-color: #A383EB;
}
.news-right-wrap .member-list:nth-child(4) a {
  background-color: #8FCDFA;
}
.news-right-wrap .member-list:nth-child(5) a {
  background-color: #F4F4F4;
  color: #3D82E5;
}
.news-right-wrap .member-list:nth-child(5) a::before {
  background-color: #3D82E5;
}
.news-right-wrap .member-list {
  width: 15.6666666667%;
}
@media screen and (max-width: 1400px) {
  .news-right-wrap .member-list {
    width: 16.6666666667%;
  }
}
@media screen and (max-width: 1024px) {
  .news-right-wrap .member-list {
    border-bottom: 3px solid #3D82E5;
    width: 28.3%;
  }
  .news-right-wrap .member-list:nth-child(2) {
    width: 30%;
  }
  .news-right-wrap .member-list:nth-child(2) a {
    margin: 0 auto;
    width: 95%;
  }
  .news-right-wrap .member-list:nth-child(5) {
    width: 30%;
  }
  .news-right-wrap .member-list:nth-child(5) a {
    margin: 0 auto;
    width: 95%;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap .member-list {
    width: 106px;
  }
  .news-right-wrap .member-list:nth-child(2) {
    width: 117px;
  }
  .news-right-wrap .member-list:nth-child(2) a {
    margin: 0 auto;
  }
  .news-right-wrap .member-list:nth-child(5) {
    width: 117px;
  }
  .news-right-wrap .member-list:nth-child(5) a {
    margin: 0 auto;
  }
}
.news-right-wrap a {
  text-align: center;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  display: block;
  aspect-ratio: 2.2/1;
  border-radius: 30px 30px 0 0;
  position: relative;
  color: #fff;
}
.news-right-wrap a::before {
  content: "";
  position: absolute;
  top: 25%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  background-color: #fff;
  border-radius: 999vh;
  opacity: 0;
  transition: 0.3s;
}
@media screen and (max-width: 1024px) {
  .news-right-wrap a::before {
    display: none;
  }
}
.news-right-wrap a:hover::before {
  opacity: 1;
}
@media screen and (max-width: 1024px) {
  .news-right-wrap a {
    aspect-ratio: 3/1;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap a {
    width: 100%;
    max-width: 106px;
    height: 50px;
  }
  .news-right-wrap a.news-category-btn {
    height: 53px;
    width: 106px;
  }
}
.news-right-wrap a span, .news-right-wrap a p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-weight: bold;
  width: -moz-max-content;
  width: max-content;
}
.news-right-wrap a p:nth-child(2) {
  font-size: 12px;
}
@media screen and (max-width: 1024px) {
  .news-right-wrap:has(.example-flex) {
    max-width: none;
    border-bottom: 3px solid #3d82e5;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap:has(.example-flex) a {
    border-radius: 20px 20px 0 0;
  }
}
@media screen and (max-width: 1400px) {
  .news-right-wrap .news-category-flex.example-flex {
    gap: 20px;
  }
}
@media screen and (max-width: 1024px) {
  .news-right-wrap .news-category-flex.example-flex {
    gap: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap .news-category-flex.example-flex {
    gap: 1%;
  }
}
@media screen and (max-width: 1024px) {
  .news-right-wrap .news-category-flex.example-flex .member-list {
    width: 22%;
    border: none;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap .news-category-flex.example-flex .member-list {
    width: 23%;
  }
}
.news-right-wrap .news-category-flex.example-flex .member-list:nth-child(2) a {
  margin: 0 auto;
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .news-right-wrap .news-category-flex.example-flex a.news-category-btn {
    width: 22%;
  }
}
@media screen and (max-width: 767px) {
  .news-right-wrap .news-category-flex.example-flex a.news-category-btn {
    width: 23%;
    height: 50px;
    border: none !important;
  }
}

/*詳細ページ*/
.single-news {
  margin-top: 12rem;
  padding: 5rem 0 7.5rem;
  background-color: #fff;
}
@media screen and (max-width: 1024px) {
  .single-news {
    margin-top: 7.5rem;
  }
}
@media screen and (max-width: 767px) {
  .single-news {
    margin-top: 8rem;
    padding: 2.5rem 0 5rem;
  }
}
.single-news .arrow-btn {
  background-color: #3D82E5;
}
.single-news .content,
.single-news .article_meta {
  max-width: 1345px;
  width: 75%;
  margin: 0 auto;
  word-break: normal;
}
.single-news .content {
  width: 80%;
}
@media screen and (max-width: 1600px) {
  .single-news .content {
    margin: 0 auto 0 0;
    width: 90%;
  }
}
@media screen and (max-width: 1279px) {
  .single-news .content {
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .single-news .content {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .single-news .article_meta {
    width: 90%;
  }
}
.single-news .single-contents {
  display: flex;
  align-items: flex-start;
  width: 75%;
  margin: 0 auto;
}
@media screen and (max-width: 1279px) {
  .single-news .single-contents {
    width: 90%;
  }
}
.single-news .single-left {
  width: calc(100% - 400px);
}
@media screen and (max-width: 1279px) {
  .single-news .single-left {
    width: 100%;
  }
}
.single-news .single-left .addtoany_share_save_container .addtoany_content {
  margin-bottom: 3rem;
}
.single-news .single-left .addtoany_share_save_container .addtoany_list {
  display: flex;
  justify-content: center;
  gap: 8px;
}
.single-news .single-left .addtoany_share_save_container a {
  margin: 0 !important;
}
.single-news .single-left .addtoany_share_save_container .addtoany_header {
  font-weight: bold;
  text-align: center;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1.5rem;
  margin: 4rem auto 1rem;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.single-news .single-left .addtoany_share_save_container .addtoany_header::before, .single-news .single-left .addtoany_share_save_container .addtoany_header::after {
  content: "";
  position: absolute;
  top: 49%;
  display: inline-block;
  width: 20px;
  height: 2px;
  background-color: #2E2E2E;
}
.single-news .single-left .addtoany_share_save_container .addtoany_header::before {
  left: -16px;
  transform: rotate(45deg);
}
.single-news .single-left .addtoany_share_save_container .addtoany_header::after {
  right: -16px;
  transform: rotate(-45deg);
}
.single-news .single-right {
  width: 400px;
  position: sticky;
  top: 7rem;
}
.single-news .single-right.sp-single {
  display: none;
}
@media screen and (max-width: 1279px) {
  .single-news .single-right {
    width: 80%;
    max-width: 600px;
    margin: 0 5% 3rem;
    position: relative;
    top: auto;
  }
  .single-news .single-right.pc-single {
    display: none;
  }
  .single-news .single-right.sp-single {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .single-news .single-right {
    width: 100%;
    margin: 0 0 2.5rem;
  }
}
.single-news .single-right img {
  max-height: 100px;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 1024px) {
  .single-news .single-right img {
    max-height: 80px;
  }
}
@media screen and (max-width: 767px) {
  .single-news .single-right img {
    width: 80%;
  }
}
.single-news .article_title {
  font-size: clamp(1.125rem, 0.807rem + 1.06vw, 2rem);
  margin: 1rem 0 2.5rem;
  line-height: 1.4;
}
.single-news .category {
  display: flex;
  gap: 1.5rem;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .single-news .category {
    gap: 0.5rem;
    flex-wrap: wrap;
  }
}
.single-news .category > span, .single-news .category > p {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  font-weight: bold;
}
.single-news .category > p {
  padding: 8px 1.5rem;
  border-radius: 30px;
  border: 1px solid;
}
@media screen and (max-width: 767px) {
  .single-news .category > p {
    padding: 4px 1rem;
  }
}
.single-news .category > p.category-school {
  border-color: #F8A212;
  color: #F8A212;
}
.single-news .category > p.category-sc-bpo {
  background-color: #FFEED3;
  color: #F8A212;
  border: none;
}
.single-news .category > p.category-fo-bpo {
  color: #7E5DC7;
  background-color: #F5F7FF;
  border: none;
}
.single-news .category > p.category-jichitai {
  border-color: #8FCDFA;
  color: #8FCDFA;
}
.single-news .category > p.category-found {
  border-color: #A383EB;
  color: #A383EB;
}
.single-news .category > p.category-all {
  border-color: #F4F4F4;
  color: #3D82E5;
  background-color: #F4F4F4;
}
.single-news .pick-name {
  gap: 1rem;
  margin: 0;
}
@media screen and (max-width: 767px) {
  .single-news .pick-name {
    gap: 0.5rem;
    width: 100%;
  }
}
.single-news .ex_text {
  margin-bottom: 2rem;
}
.single-news .ex_text > p {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
  padding: 0.5rem 1.5rem;
  border-radius: 10px;
  margin-bottom: 1rem;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 767px) {
  .single-news .ex_text > p {
    padding: 0.25rem 1rem;
    margin-bottom: 0.5rem;
  }
}
.single-news .ex_text div p {
  padding-left: 2rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .single-news .ex_text div p {
    padding-left: 1rem;
  }
}
.single-news .ex_text div p:not(:last-child) {
  margin-bottom: 1rem;
}
.single-news .ex_text div p::before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 999vh;
  top: 7px;
  left: 5px;
}
@media screen and (max-width: 1024px) {
  .single-news .ex_text div p::before {
    width: 9px;
    height: 9px;
    top: 8px;
  }
}
@media screen and (max-width: 767px) {
  .single-news .ex_text div p::before {
    width: 6px;
    height: 6px;
    top: 6px;
  }
}
.single-news .content h2 {
  font-size: clamp(1.125rem, 0.989rem + 0.45vw, 1.5rem);
  color: #fff;
  padding: 0.5rem;
  border-radius: 10px;
  margin: 2rem 0;
}
.single-news .content h3 {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  margin: 1.5rem 0;
}
.single-news .content p:not(:last-child) {
  margin-bottom: 1rem;
}
.single-news .content img {
  margin: 2rem 0;
}

.catch {
  width: 80%;
  margin: 0 auto 3rem;
}
@media screen and (max-width: 1600px) {
  .catch {
    margin: 0 auto 3rem 0;
    width: 90%;
  }
}
@media screen and (max-width: 1279px) {
  .catch {
    margin: 0 auto 3rem;
  }
}
@media screen and (max-width: 767px) {
  .catch {
    width: 100%;
  }
}
.catch img {
  border-radius: 50px;
}
@media screen and (max-width: 767px) {
  .catch img {
    border-radius: 25px;
  }
}

.news .top-news-list.single-wrap .category a {
  margin: 0 1rem 1rem 0;
  display: inline-block;
}

.news-tag p {
  margin-bottom: 1rem;
}
.news-tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 3%;
}
@media screen and (max-width: 767px) {
  .news-tag-list {
    gap: 0.5rem 3%;
  }
}
.news-tag-list a {
  border: 1px solid #3D82E5;
  border-radius: 20px;
  padding: 6px 1.5rem;
  display: block;
  color: #3D82E5;
}
@media screen and (max-width: 767px) {
  .news-tag-list a {
    padding: 4px 1rem;
  }
}
.news-tag-list a:hover {
  background-color: #3D82E5;
  color: #fff;
}

.achievement {
  margin: 10rem 0 2rem;
}
@media screen and (max-width: 767px) {
  .achievement {
    margin-top: 2.5rem;
  }
}
.achievement-title {
  display: flex;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 1279px) {
  .achievement-title {
    flex-direction: column;
    gap: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .achievement-title {
    gap: 1.5rem;
  }
}
.achievement-title::before, .achievement-title::after {
  content: "";
  position: absolute;
  width: 85px;
  aspect-ratio: 85/140;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 1400px) {
  .achievement-title::before, .achievement-title::after {
    width: 70px;
  }
}
@media screen and (max-width: 1279px) {
  .achievement-title::before, .achievement-title::after {
    display: none;
  }
}
.achievement-title::before {
  background: url(./images/award1.png) no-repeat center/contain;
  left: -8%;
}
@media screen and (max-width: 1400px) {
  .achievement-title::before {
    left: -7%;
  }
}
.achievement-title::after {
  background: url(./images/award2.png) no-repeat center/contain;
  right: -8%;
}
@media screen and (max-width: 1400px) {
  .achievement-title::after {
    right: -7%;
  }
}
.achievement-left {
  width: 50%;
  text-align: center;
  position: relative;
}
@media screen and (max-width: 1279px) {
  .achievement-left {
    width: -moz-fit-content;
    width: fit-content;
    padding: 0 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .achievement-left {
    padding: 0 2rem;
  }
}
.achievement-left::before, .achievement-left::after {
  content: "";
  position: absolute;
  width: 70px;
  aspect-ratio: 85/140;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  display: none;
}
@media screen and (max-width: 1279px) {
  .achievement-left::before, .achievement-left::after {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .achievement-left::before, .achievement-left::after {
    width: 40px;
  }
}
.achievement-left::before {
  background: url(./images/award1.png) no-repeat center/contain;
  left: -10%;
}
@media screen and (max-width: 767px) {
  .achievement-left::before {
    left: -5%;
  }
}
.achievement-left::after {
  background: url(./images/award2.png) no-repeat center/contain;
  right: -10%;
}
@media screen and (max-width: 767px) {
  .achievement-left::after {
    right: -5%;
  }
}
.achievement-left p {
  font-size: clamp(0.625rem, 0.534rem + 0.3vw, 0.875rem);
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1rem;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .achievement-left p {
    padding: 0;
  }
}
.achievement-left p::before, .achievement-left p::after {
  content: "";
  position: absolute;
  top: 45%;
  display: inline-block;
  width: 20px;
  height: 1px;
  background-color: #2E2E2E;
}
@media screen and (max-width: 767px) {
  .achievement-left p::before, .achievement-left p::after {
    width: 1rem;
  }
}
.achievement-left p::before {
  left: -16px;
  transform: rotate(45deg);
}
.achievement-left p::after {
  right: -16px;
  transform: rotate(-45deg);
}
.achievement-left h2 {
  font-size: clamp(1rem, 0.455rem + 1.82vw, 2.5rem);
  position: relative;
}
.achievement-left h2::before {
  content: "※2024年10月時点";
  position: absolute;
  font-size: 12px;
  color: red;
  top: 10px;
  font-weight: normal;
}
@media screen and (max-width: 1279px) {
  .achievement-left h2::before {
    top: 7px;
    font-size: 10px;
  }
}
@media screen and (max-width: 1024px) {
  .achievement-left h2::before {
    top: 4px;
  }
}
@media screen and (max-width: 767px) {
  .achievement-left h2::before {
    top: 2px;
    font-size: 8px;
  }
}
.achievement-left h2 span {
  font-size: clamp(2rem, 0.909rem + 3.64vw, 5rem);
  color: #FCD20B;
  line-height: 1;
  margin: 0 1rem;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .achievement-left h2 span {
    margin: 0 0.5rem;
  }
}
.achievement-right {
  width: 48%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem 2rem;
  min-width: 470px;
}
@media screen and (max-width: 1279px) {
  .achievement-right {
    width: -moz-fit-content;
    width: fit-content;
    max-width: 500px;
  }
}
@media screen and (max-width: 767px) {
  .achievement-right {
    min-width: auto;
  }
}
.achievement-right p {
  text-align: center;
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem);
  font-weight: bold;
}
.achievement-right p span {
  font-size: clamp(1.875rem, 1.193rem + 2.27vw, 3.75rem);
  color: #FCD20B;
  line-height: 1;
  margin: 0 0.5rem;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .achievement-right p span {
    font-size: 1.5rem;
    margin: 0 0.25rem;
  }
}
.achievement-item {
  position: relative;
}
.achievement-item:nth-child(odd) {
  width: 40%;
}
.achievement-item:nth-child(even) {
  width: 50%;
  max-width: 300px;
}
.achievement-item::before, .achievement-item::after {
  content: "";
  position: absolute;
  width: 30px;
  aspect-ratio: 85/140;
  top: 60%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 1400px) {
  .achievement-item::before, .achievement-item::after {
    width: 25px;
  }
}
@media screen and (max-width: 767px) {
  .achievement-item::before, .achievement-item::after {
    width: 20px;
  }
}
.achievement-item::before {
  background: url(./images/award1.png) no-repeat center/contain;
  left: -7%;
}
@media screen and (max-width: 1600px) {
  .achievement-item::before {
    left: -10%;
  }
}
@media screen and (max-width: 767px) {
  .achievement-item::before {
    left: -10%;
  }
}
.achievement-item::after {
  background: url(./images/award2.png) no-repeat center/contain;
  right: -7%;
}
@media screen and (max-width: 1600px) {
  .achievement-item::after {
    right: -10%;
  }
}
@media screen and (max-width: 767px) {
  .achievement-item::after {
    right: -10%;
  }
}

.news-recommend {
  background-color: rgba(255, 255, 255, 0.2);
  margin-top: 2.5rem;
  position: relative;
}
.news-recommend:has(.no-recommend) {
  display: none;
}
@media screen and (max-width: 767px) {
  .news-recommend {
    padding: 0;
  }
}
.news-recommend::before {
  content: "";
  position: absolute;
  width: 16%;
  aspect-ratio: 300/120;
  left: 16%;
  top: -65px;
  max-width: 250px;
  background: url(./images/pickup.png) no-repeat center/contain;
}
@media screen and (max-width: 1600px) {
  .news-recommend::before {
    top: -17%;
  }
}
@media screen and (max-width: 1279px) {
  .news-recommend::before {
    top: -12%;
    width: 18%;
    max-width: 200px;
  }
}
@media screen and (max-width: 1024px) {
  .news-recommend::before {
    width: 23%;
    left: 15%;
    top: -7%;
  }
}
@media screen and (max-width: 767px) {
  .news-recommend::before {
    width: 150px;
    left: 5%;
    top: -35px;
  }
}
.news-recommend .slick-slide {
  margin: 2rem 23rem;
}
@media screen and (max-width: 1600px) {
  .news-recommend .slick-slide {
    margin: 2rem 18rem;
  }
}
@media screen and (max-width: 1400px) {
  .news-recommend .slick-slide {
    margin: 2rem 15rem;
  }
}
@media screen and (max-width: 900px) {
  .news-recommend .slick-slide {
    margin: 2rem 10rem;
  }
}
@media screen and (max-width: 767px) {
  .news-recommend .slick-slide {
    margin: 2rem 2.5rem;
  }
}
.news-recommend .slick-slide img {
  height: 100%;
}
.news-recommend .slick-slide img:not(.thumbnail) {
  -o-object-fit: cover;
     object-fit: cover;
}
.news-recommend .slick-slide .thumbnail {
  padding: 10%;
}
.news-recommend .slick-next, .news-recommend .slick-prev {
  width: clamp(2rem, 0.909rem + 3.64vw, 5rem);
  height: clamp(2rem, 0.909rem + 3.64vw, 5rem);
  z-index: 10;
}
.news-recommend .slick-next {
  right: 5%;
}
@media screen and (max-width: 767px) {
  .news-recommend .slick-next {
    right: 1%;
  }
}
.news-recommend .slick-prev {
  left: 5%;
}
@media screen and (max-width: 767px) {
  .news-recommend .slick-prev {
    left: 1%;
  }
}
.news-recommend .slick-next:before,
.news-recommend .slick-prev:before {
  opacity: 1;
  font-size: clamp(2rem, 0.909rem + 3.64vw, 5rem);
  color: transparent;
}
.news-recommend .slick-next:before {
  background: url(./images/slider-1.png) no-repeat center/contain;
}
.news-recommend .slick-prev:before {
  background: url(./images/slider-2.png) no-repeat center/contain;
}
.news-recommend .filter-results-item {
  padding: 0;
}
@media screen and (max-width: 1024px) {
  .news-recommend .filter-results-item img {
    aspect-ratio: 500/256;
  }
}
@media screen and (max-width: 767px) {
  .news-recommend .filter-results-item img {
    aspect-ratio: 387/256;
  }
}
.news-recommend .filter-results-item a {
  display: flex;
}
@media screen and (max-width: 1024px) {
  .news-recommend .filter-results-item a {
    flex-direction: column;
  }
}
.news-recommend h2 {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
.news-recommend .news-img {
  background-color: #fff;
  width: 40%;
  border-radius: 10px 0 0 10px;
}
@media screen and (max-width: 1024px) {
  .news-recommend .news-img {
    width: 100%;
    border-radius: 10px 10px 0 0;
  }
}
.news-recommend .news-text {
  width: 60%;
  padding: 2rem 3%;
  border-radius: 0 10px 10px 0;
}
@media screen and (max-width: 1024px) {
  .news-recommend .news-text {
    width: 100%;
    border-radius: 0 0 10px 10px;
  }
}
@media screen and (max-width: 767px) {
  .news-recommend .news-text {
    padding: 1rem 3%;
  }
}
.news-recommend .filter-results-head p:first-child {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  padding: 4px 1.5rem;
  margin-bottom: 1rem;
  border-radius: 30px;
}
@media screen and (max-width: 767px) {
  .news-recommend .filter-results-head p:first-child {
    padding: 6px 1rem;
    margin-bottom: 0.5rem;
  }
}

.pick-name {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 3%;
  margin: 1rem 0 2.5rem;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .pick-name {
    margin: 0.5rem 0 2.5rem;
  }
}

.example-category-ex-school .category > p,
.use-category-use-school .category > p,
.whitepaper-category-dl-school .category > p,
.archive-category-archive-school .category > p,
.conference-category-conference-school .category > p,
.webinar-category-webinar-school .category > p {
  border-color: #F7C674;
  color: #F7C674;
}
.example-category-ex-school .table_design03 td:first-child,
.use-category-use-school .table_design03 td:first-child,
.whitepaper-category-dl-school .table_design03 td:first-child,
.archive-category-archive-school .table_design03 td:first-child,
.conference-category-conference-school .table_design03 td:first-child,
.webinar-category-webinar-school .table_design03 td:first-child {
  color: #F7C674;
}
.example-category-ex-school .ex_text > p,
.use-category-use-school .ex_text > p,
.whitepaper-category-dl-school .ex_text > p,
.archive-category-archive-school .ex_text > p,
.conference-category-conference-school .ex_text > p,
.webinar-category-webinar-school .ex_text > p {
  color: #fff;
  background-color: #F7C674;
}
.example-category-ex-school .ex_text div p::before,
.use-category-use-school .ex_text div p::before,
.whitepaper-category-dl-school .ex_text div p::before,
.archive-category-archive-school .ex_text div p::before,
.conference-category-conference-school .ex_text div p::before,
.webinar-category-webinar-school .ex_text div p::before {
  background-color: #F7C674;
}
.example-category-ex-school .content h2,
.use-category-use-school .content h2,
.whitepaper-category-dl-school .content h2,
.archive-category-archive-school .content h2,
.conference-category-conference-school .content h2,
.webinar-category-webinar-school .content h2 {
  background-color: #F7C674;
}
.example-category-ex-school .content h3,
.use-category-use-school .content h3,
.whitepaper-category-dl-school .content h3,
.archive-category-archive-school .content h3,
.conference-category-conference-school .content h3,
.webinar-category-webinar-school .content h3 {
  color: #F7C674;
}
.example-category-ex-school .talk-btn,
.use-category-use-school .talk-btn,
.whitepaper-category-dl-school .talk-btn,
.archive-category-archive-school .talk-btn,
.conference-category-conference-school .talk-btn,
.webinar-category-webinar-school .talk-btn {
  background-color: transparent;
  border: 3px solid #F8A213;
  color: #F8A213;
}
.example-category-ex-school .talk-btn svg path,
.use-category-use-school .talk-btn svg path,
.whitepaper-category-dl-school .talk-btn svg path,
.archive-category-archive-school .talk-btn svg path,
.conference-category-conference-school .talk-btn svg path,
.webinar-category-webinar-school .talk-btn svg path {
  fill: #F8A213;
}
.example-category-ex-school .talk-btn:hover,
.use-category-use-school .talk-btn:hover,
.whitepaper-category-dl-school .talk-btn:hover,
.archive-category-archive-school .talk-btn:hover,
.conference-category-conference-school .talk-btn:hover,
.webinar-category-webinar-school .talk-btn:hover {
  background-color: #FFFAD3;
}

.example-category-ex-foundation .category > p,
.use-category-use-foundation .category > p,
.whitepaper-category-dl-foundation .category > p,
.archive-category-archive-foundation .category > p,
.conference-category-conference-foundation .category > p,
.webinar-category-webinar-foundation .category > p {
  border-color: #A383EB;
  color: #A383EB;
}
.example-category-ex-foundation .table_design03 td:first-child,
.use-category-use-foundation .table_design03 td:first-child,
.whitepaper-category-dl-foundation .table_design03 td:first-child,
.archive-category-archive-foundation .table_design03 td:first-child,
.conference-category-conference-foundation .table_design03 td:first-child,
.webinar-category-webinar-foundation .table_design03 td:first-child {
  color: #A383EB;
}
.example-category-ex-foundation .ex_text > p,
.use-category-use-foundation .ex_text > p,
.whitepaper-category-dl-foundation .ex_text > p,
.archive-category-archive-foundation .ex_text > p,
.conference-category-conference-foundation .ex_text > p,
.webinar-category-webinar-foundation .ex_text > p {
  color: #fff;
  background-color: #A383EB;
}
.example-category-ex-foundation .ex_text div p::before,
.use-category-use-foundation .ex_text div p::before,
.whitepaper-category-dl-foundation .ex_text div p::before,
.archive-category-archive-foundation .ex_text div p::before,
.conference-category-conference-foundation .ex_text div p::before,
.webinar-category-webinar-foundation .ex_text div p::before {
  background-color: #A383EB;
}
.example-category-ex-foundation .content h2,
.use-category-use-foundation .content h2,
.whitepaper-category-dl-foundation .content h2,
.archive-category-archive-foundation .content h2,
.conference-category-conference-foundation .content h2,
.webinar-category-webinar-foundation .content h2 {
  background-color: #A383EB;
}
.example-category-ex-foundation .content h3,
.use-category-use-foundation .content h3,
.whitepaper-category-dl-foundation .content h3,
.archive-category-archive-foundation .content h3,
.conference-category-conference-foundation .content h3,
.webinar-category-webinar-foundation .content h3 {
  color: #A383EB;
}
.example-category-ex-foundation .talk-btn,
.use-category-use-foundation .talk-btn,
.whitepaper-category-dl-foundation .talk-btn,
.archive-category-archive-foundation .talk-btn,
.conference-category-conference-foundation .talk-btn,
.webinar-category-webinar-foundation .talk-btn {
  background-color: transparent;
  border: 3px solid #A383EB;
  color: #A383EB;
}
.example-category-ex-foundation .talk-btn svg path,
.use-category-use-foundation .talk-btn svg path,
.whitepaper-category-dl-foundation .talk-btn svg path,
.archive-category-archive-foundation .talk-btn svg path,
.conference-category-conference-foundation .talk-btn svg path,
.webinar-category-webinar-foundation .talk-btn svg path {
  fill: #A383EB;
}
.example-category-ex-foundation .talk-btn:hover,
.use-category-use-foundation .talk-btn:hover,
.whitepaper-category-dl-foundation .talk-btn:hover,
.archive-category-archive-foundation .talk-btn:hover,
.conference-category-conference-foundation .talk-btn:hover,
.webinar-category-webinar-foundation .talk-btn:hover {
  background-color: #F5F7FF;
}

.example-category-ex-municipality .category > p,
.use-category-use-municipality .category > p,
.whitepaper-category-dl-municipality .category > p,
.archive-category-archive-municipality .category > p,
.conference-category-conference-municipality .category > p,
.webinar-category-webinar-municipality .category > p {
  border-color: #8FCDFA;
  color: #8FCDFA;
}
.example-category-ex-municipality .table_design03 td:first-child,
.use-category-use-municipality .table_design03 td:first-child,
.whitepaper-category-dl-municipality .table_design03 td:first-child,
.archive-category-archive-municipality .table_design03 td:first-child,
.conference-category-conference-municipality .table_design03 td:first-child,
.webinar-category-webinar-municipality .table_design03 td:first-child {
  color: #209FFC;
}
.example-category-ex-municipality .ex_text > p,
.use-category-use-municipality .ex_text > p,
.whitepaper-category-dl-municipality .ex_text > p,
.archive-category-archive-municipality .ex_text > p,
.conference-category-conference-municipality .ex_text > p,
.webinar-category-webinar-municipality .ex_text > p {
  color: #209FFC;
  background-color: #E5F7FF;
}
.example-category-ex-municipality .ex_text div p::before,
.use-category-use-municipality .ex_text div p::before,
.whitepaper-category-dl-municipality .ex_text div p::before,
.archive-category-archive-municipality .ex_text div p::before,
.conference-category-conference-municipality .ex_text div p::before,
.webinar-category-webinar-municipality .ex_text div p::before {
  background-color: #209FFC;
}
.example-category-ex-municipality .content h2,
.use-category-use-municipality .content h2,
.whitepaper-category-dl-municipality .content h2,
.archive-category-archive-municipality .content h2,
.conference-category-conference-municipality .content h2,
.webinar-category-webinar-municipality .content h2 {
  background-color: #209FFC;
}
.example-category-ex-municipality .content h3,
.use-category-use-municipality .content h3,
.whitepaper-category-dl-municipality .content h3,
.archive-category-archive-municipality .content h3,
.conference-category-conference-municipality .content h3,
.webinar-category-webinar-municipality .content h3 {
  color: #209FFC;
}
.example-category-ex-municipality .talk-btn,
.use-category-use-municipality .talk-btn,
.whitepaper-category-dl-municipality .talk-btn,
.archive-category-archive-municipality .talk-btn,
.conference-category-conference-municipality .talk-btn,
.webinar-category-webinar-municipality .talk-btn {
  background-color: transparent;
  border: 3px solid #209FFC;
  color: #209FFC;
}
.example-category-ex-municipality .talk-btn svg path,
.use-category-use-municipality .talk-btn svg path,
.whitepaper-category-dl-municipality .talk-btn svg path,
.archive-category-archive-municipality .talk-btn svg path,
.conference-category-conference-municipality .talk-btn svg path,
.webinar-category-webinar-municipality .talk-btn svg path {
  fill: #209FFC;
}
.example-category-ex-municipality .talk-btn:hover,
.use-category-use-municipality .talk-btn:hover,
.whitepaper-category-dl-municipality .talk-btn:hover,
.archive-category-archive-municipality .talk-btn:hover,
.conference-category-conference-municipality .talk-btn:hover,
.webinar-category-webinar-municipality .talk-btn:hover {
  background-color: #DFF1FD;
}

.example-category-ex-school-bpo .category > p,
.use-category-use-school-bpo .category > p {
  background-color: #FFEED3;
  color: #F8A212;
  border: none;
}
.example-category-ex-school-bpo .table_design03 td:first-child,
.use-category-use-school-bpo .table_design03 td:first-child {
  color: #F8A212;
}
.example-category-ex-school-bpo .ex_text > p,
.use-category-use-school-bpo .ex_text > p {
  background-color: #FFEED3;
  color: #F8A212;
}
.example-category-ex-school-bpo .ex_text div p::before,
.use-category-use-school-bpo .ex_text div p::before {
  background-color: #F8A212;
}
.example-category-ex-school-bpo .content h2,
.use-category-use-school-bpo .content h2 {
  background-color: #F8A212;
}
.example-category-ex-school-bpo .content h3,
.use-category-use-school-bpo .content h3 {
  color: #F8A212;
}
.example-category-ex-school-bpo .talk-btn,
.use-category-use-school-bpo .talk-btn {
  background-color: transparent;
  border: 3px solid #F8A213;
  color: #F8A213;
}
.example-category-ex-school-bpo .talk-btn svg path,
.use-category-use-school-bpo .talk-btn svg path {
  fill: #F8A213;
}
.example-category-ex-school-bpo .talk-btn:hover,
.use-category-use-school-bpo .talk-btn:hover {
  background-color: #FFFAD3;
}

.example-category-ex-foundation-bpo .category > p,
.use-category-use-foundation-bpo .category > p {
  color: #7E5DC7;
  background-color: #F5F7FF;
  border: none;
}
.example-category-ex-foundation-bpo .table_design03 td:first-child,
.use-category-use-foundation-bpo .table_design03 td:first-child {
  color: #7E5DC7;
}
.example-category-ex-foundation-bpo .ex_text > p,
.use-category-use-foundation-bpo .ex_text > p {
  color: #7E5DC7;
  background-color: #F5F7FF;
}
.example-category-ex-foundation-bpo .ex_text div p::before,
.use-category-use-foundation-bpo .ex_text div p::before {
  background-color: #7E5DC7;
}
.example-category-ex-foundation-bpo .content h2,
.use-category-use-foundation-bpo .content h2 {
  background-color: #7E5DC7;
}
.example-category-ex-foundation-bpo .content h3,
.use-category-use-foundation-bpo .content h3 {
  color: #7E5DC7;
}
.example-category-ex-foundation-bpo .talk-btn,
.use-category-use-foundation-bpo .talk-btn {
  background-color: transparent;
  border: 3px solid #A383EB;
  color: #A383EB;
}
.example-category-ex-foundation-bpo .talk-btn svg path,
.use-category-use-foundation-bpo .talk-btn svg path {
  fill: #A383EB;
}
.example-category-ex-foundation-bpo .talk-btn:hover,
.use-category-use-foundation-bpo .talk-btn:hover {
  background-color: #F5F7FF;
}

.example-category-ex-common .category > p,
.use-category-use-common .category > p,
.whitepaper-category-dl-common .category > p {
  background-color: #F4F4F4;
  color: #3D82E5;
  border: none;
}
.example-category-ex-common .table_design03 td:first-child,
.use-category-use-common .table_design03 td:first-child,
.whitepaper-category-dl-common .table_design03 td:first-child {
  color: #3D82E5;
}
.example-category-ex-common .ex_text > p,
.use-category-use-common .ex_text > p,
.whitepaper-category-dl-common .ex_text > p {
  background-color: #F4F4F4;
  color: #3D82E5;
}
.example-category-ex-common .ex_text div p::before,
.use-category-use-common .ex_text div p::before,
.whitepaper-category-dl-common .ex_text div p::before {
  background-color: #3D82E5;
}
.example-category-ex-common .content h2,
.use-category-use-common .content h2,
.whitepaper-category-dl-common .content h2 {
  background-color: #3D82E5;
}
.example-category-ex-common .content h3,
.use-category-use-common .content h3,
.whitepaper-category-dl-common .content h3 {
  color: #2E2E2E;
}
.example-category-ex-common .talk-btn,
.use-category-use-common .talk-btn,
.whitepaper-category-dl-common .talk-btn {
  background-color: transparent;
  border: 3px solid #3D82E5;
  color: #3D82E5;
}
.example-category-ex-common .talk-btn svg path,
.use-category-use-common .talk-btn svg path,
.whitepaper-category-dl-common .talk-btn svg path {
  fill: #3D82E5;
}
.example-category-ex-common .talk-btn:hover,
.use-category-use-common .talk-btn:hover,
.whitepaper-category-dl-common .talk-btn:hover {
  background-color: #FFFAD3;
}

.news-top {
  margin-bottom: 5rem;
  display: flex;
  justify-content: left;
  gap: 20px;
  flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
  .news-top {
    margin-bottom: 2.5rem;
    gap: 10px;
  }
}
.news-top a {
  padding: 6px 1.5rem;
  color: #3D82E5;
  border-radius: 20px;
  background-color: #E8E8E8;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .news-top a {
    padding: 4px 1rem;
  }
}
.news-top a:hover {
  opacity: 0.7;
}

.blog .news-top a:first-child {
  background-color: #3D82E5;
  color: #fff;
}

.category-1 .news-top a:nth-child(2) {
  background-color: #3D82E5;
  color: #fff;
}

.category-36 .news-top a:nth-child(3) {
  background-color: #3D82E5;
  color: #fff;
}

.category-77 .news-top a:nth-child(4) {
  background-color: #3D82E5;
  color: #fff;
}

.blog .top-news-list ul.newsList, .archive .top-news-list ul.newsList {
  display: flex;
  align-items: center;
  gap: 2rem;
  flex-wrap: wrap;
  font-weight: 500;
  gap: 1rem 2rem;
}
@media screen and (max-width: 767px) {
  .blog .top-news-list ul.newsList, .archive .top-news-list ul.newsList{
    gap: 1rem;
  }
}
.blog .top-news-list ul.newsList li:first-child, .archive .top-news-list ul.newsList li:first-child, .top-news .top-news-list ul.newsList li:first-child {
  color: #3D82E5;
}
.blog .top-news-list ul.newsList a, .archive .top-news-list ul.newsList a {
  color: #3D82E5;
  background-color: #E5F7FF;
  padding: 4px 1rem;
  border-radius: 999vh;
  margin-right: 4px;
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  .blog .top-news-list ul.newsList a, .archive .top-news-list ul.newsList a{
    padding: 2px 0.5rem;
    font-size: 12px;
  }
}
.blog .news-item, .archive .news-item{
  position: relative;
  padding-right: 1.5rem;
  text-align: left;
  cursor: pointer;
}
.blog .news-item li:last-child, .archive .news-item li:last-child{
  position: relative;
}
.blog .news-item li:last-child::after, .archive .news-item li:last-child::after {
  content: "";
  /*絶対配置で線の位置を決める*/
  position: absolute;
  bottom: -4px;
  left: 0;
  /*線の形状*/
  width: 100%;
  height: 1px;
  background: #3D82E5;
  /*アニメーションの指定*/
  transition: all 0.3s;
  transform: scale(0, 1); /*X方向0、Y方向1*/
  transform-origin: left top; /*左上基点*/
}
.blog .news-item:hover li:last-child::after, .archive .news-item:hover li:last-child::after{
  transform: scale(1, 1);
}
.blog .news-item::before, .archive .news-item::before{
  content: "";
  position: absolute;
  width: 9px;
  height: 20px;
  background: url(./images/header-btn2.svg) no-repeat center/contain;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.blog .news .item:not(:last-child), .archive .news .item:not(:last-child) {
  margin-bottom: 3rem;
  padding-bottom: 0;
}
@media screen and (max-width: 767px) {
  .blog .news .item:not(:last-child), .archive .news .item:not(:last-child){
    margin-bottom: 2rem;
  }
}

.single-post .thanks {
  text-align: left;
}
.single-post .thanks p {
  font-size: 1rem;
}
@media screen and (max-width: 767px) {
  .single-post .thanks {
    padding: 2.5rem 3%;
  }
  .single-post .thanks p {
    font-size: 12px;
  }
}
.single-post .thanks h2 {
  color: #2E2E2E;
}
.single-post .thanks h2.article_title {
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .single-post .thanks h2.article_title {
    margin-bottom: 1.5rem;
  }
}
.single-post .thanks .catch img {
  max-width: none;
}
.single-post .category {
  display: flex;
  align-items: center;
  gap: 2rem;
  color: #3D82E5;
  font-weight: bold;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .single-post .category {
    gap: 1rem;
  }
}
.single-post .category a {
  color: #3D82E5;
  border: 1px solid #3D82E5;
  padding: 4px 1rem;
  border-radius: 999vh;
}

.bg-gray {
  padding: 3.5rem 5%;
  background-color: #F4F4F4;
  border-radius: 30px;
  margin: 5rem auto 0;
  width: 90%;
}
@media screen and (max-width: 767px) {
  .bg-gray {
    margin-top: 2.5rem;
    padding: 2.5rem 5%;
  }
}
.bg-gray > h2 {
  color: #3D82E5;
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .bg-gray .arrow-btn {
    margin-top: 2.5rem;
  }
}

#ez-toc-container a {
  margin: 0;
}

pre {
  white-space: pre-wrap;
}

/*404*/
.not-found {
  text-align: center;
  position: relative;
}
.not-found img {
  width: 60%;
  max-width: 460px;
  margin: 4rem auto;
}
@media screen and (max-width: 767px) {
  .not-found img {
    width: 70%;
    margin: 2rem auto;
  }
}
.not-found p {
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
  margin-bottom: 4rem;
}

.policy-title {
  text-align: center;
  color: #fff;
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  padding-top: 10rem;
}
@media screen and (max-width: 1024px) {
  .policy-title {
    padding-top: 8rem;
  }
}

.sec-policy {
  margin: 3rem auto 7.5rem;
  background-color: #fff;
  padding: 5rem 5%;
  border-radius: 20px;
}
@media screen and (max-width: 767px) {
  .sec-policy {
    border-radius: 0px;
    padding: 2.5rem 5%;
    width: 100%;
  }
}

.policy {
  margin-bottom: 3rem;
}
@media screen and (max-width: 767px) {
  .policy {
    margin-bottom: 1.5rem;
  }
}
.policy h3 {
  margin-bottom: 1.5rem;
  color: #fff;
  padding: 1rem 2.5rem;
  background-color: #3D82E5;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
@media screen and (max-width: 767px) {
  .policy h3 {
    margin-bottom: 1rem;
    padding: 0.7rem 20px;
  }
}
.policy p {
  line-height: 2;
}
.policy p:not(:last-child) {
  margin-bottom: 1rem;
}
.policy p span {
  display: inline-block;
}
.policy ul:not(.second-list) li {
  list-style: inside;
  padding-left: 1rem;
  margin-bottom: 0.5rem;
  line-height: 2;
}
.policy ol {
  padding-left: 1rem;
}
.policy ol > li {
  list-style: auto;
  margin-bottom: 0.5rem;
  line-height: 2;
}
.policy ol > li p {
  margin: 1rem 0;
}
.policy .second-list li {
  list-style: lower-roman;
  margin-bottom: 0.5rem;
  line-height: 2;
}

/*contact*/
.contact .contact-school {
  color: #3D82E5;
  font-weight: bold;
  background-color: #E5F6FF;
  padding: 1rem;
  border-radius: 30px;
  width: 80%;
  margin: 0 auto;
  font-size: 12px;
}
.contact .contact-school a {
  text-decoration: underline;
  color: #3D82E5;
}
.contact p span {
  color: red;
}

/*contact-confirm*/
.contact-confirm form > div:not(.submit-btn) p:last-child {
  color: #2E2E2E;
  padding: 20px 1rem;
}
@media screen and (max-width: 767px) {
  .contact-confirm form > div:not(.submit-btn) p:last-child {
    padding: 10px 1rem;
  }
}
.contact-confirm .submit-wrap {
  margin: 0;
}
.contact-confirm .submit-wrap:has(input[type=button])::before {
  display: none;
}
.contact-confirm .submit-wrap input[type=button] {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  padding: 1.3rem 0;
  color: #B4B3B3;
}
.contact-confirm .submit-wrap input[type=button]:hover {
  color: #fff;
  background-color: #B4B3B3;
  border-radius: 100vh;
}
.contact-confirm .submit-wrap:has(input[type=button])::after {
  left: 100%;
  width: 100%;
}
.contact-confirm .submit-wrap:has(input[type=button]):hover::after {
  left: 0;
}
.contact-confirm .submit-btn {
  margin-top: 5rem;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .contact-confirm .submit-btn {
    gap: 2rem;
    flex-direction: column-reverse;
  }
}
.contact-confirm .submit-btn p {
  width: 100% !important;
}

/*contact-thanks*/
.page-id-133 {
  background: linear-gradient(to right, #6DC3FD, #D3ECFD);
}

.thanks {
  text-align: center;
  margin: 3rem auto 7.5rem;
  background-color: #fff;
  padding: 3rem 5%;
  border-radius: 20px;
}
@media screen and (max-width: 767px) {
  .thanks {
    padding: 2.5rem 3%;
    width: 100%;
    border-radius: 0px;
  }
}
.thanks h2 {
  color: #209FFC;
  margin-bottom: 10px;
}
.thanks h2 span {
  display: inline-block;
}
.thanks p {
  font-size: clamp(0.875rem, 0.83rem + 0.15vw, 1rem);
}
.thanks p:not(:last-child) {
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .thanks p:not(:last-child) {
    margin-bottom: 0.5rem;
  }
}
.thanks img {
  max-width: 350px;
  margin: 2rem auto;
}
@media screen and (max-width: 767px) {
  .thanks img {
    margin: 1rem auto;
  }
}
.thanks-box > p {
  font-weight: 700;
  text-align: center;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 1.5rem;
  margin: 4rem auto 1rem;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
@media screen and (max-width: 767px) {
  .thanks-box > p {
    margin-top: 2rem;
  }
}
.thanks-box > p::before, .thanks-box > p::after {
  content: "";
  position: absolute;
  top: 49%;
  display: inline-block;
  width: 20px;
  height: 2px;
  background-color: #2e2e2e;
}
.thanks-box > p::before {
  left: -16px;
  transform: rotate(45deg);
}
.thanks-box > p::after {
  right: -16px;
  transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
  .thanks-box .talk-btn {
    margin-top: 1rem !important;
  }
}
.thanks-box .talk-btn p {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
@media screen and (max-width: 767px) {
  .thanks .arrow-btn {
    margin-top: 3rem;
  }
}

.slide-in {
  overflow: hidden;
  display: inline-block;
}

.slide-in_inner {
  display: inline-block;
}

.slideAnimeLeftRight {
  animation-name: slideTextX100;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes slideTextX100 {
  from {
    transform: translateX(-100%); /*要素を左の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
.slideAnimeRightLeft {
  animation-name: slideTextX-100;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes slideTextX {
  from {
    transform: translateX(-100%); /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
@keyframes slideTextX-100 {
  from {
    transform: translateX(100%); /*要素を右の枠外に移動*/
    opacity: 0;
  }
  to {
    transform: translateX(0); /*要素を元の位置に移動*/
    opacity: 1;
  }
}
@keyframes floating-y {
  0% {
    transform: translateY(-10%);
  }
  100% {
    transform: translateY(10%);
  }
}
@keyframes floating-y2 {
  0% {
    transform: translateY(10%);
  }
  100% {
    transform: translateY(-10%);
  }
}
@keyframes fadeTopAnime {
  from {
    opacity: 0;
    transform: translateY(150px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeUpAnime {
  from {
    top: 50%;
  }
  to {
    top: 20%;
  }
}
@keyframes zoomInAnime {
  from {
    opacity: 0;
    width: 50%;
  }
  to {
    opacity: 1;
    width: 100%;
  }
}
@keyframes fadeUpAnime_sp {
  from {
    top: 50%;
  }
  to {
    top: 25%;
  }
}
@keyframes fadeAnime {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeAboutImg {
  from {
    opacity: 0;
    right: -50%;
  }
  to {
    opacity: 1;
    right: -30%;
  }
}
@keyframes fadeAboutImg2 {
  from {
    opacity: 0;
    right: -30%;
  }
  to {
    opacity: 1;
    right: 0%;
  }
}
.blur span {
  color: transparent;
}
.blur.fadeUp span {
  animation: blur 5s ease-out forwards;
}
.blur span:nth-child(1) {
  animation-delay: 0.1s;
}
.blur span:nth-child(2) {
  animation-delay: 0.2s;
}
.blur span:nth-child(3) {
  animation-delay: 0.3s;
}
.blur span:nth-child(4) {
  animation-delay: 0.4s;
}
.blur span:nth-child(5) {
  animation-delay: 0.5s;
}
.blur span:nth-child(6) {
  animation-delay: 0.6s;
}
.blur span:nth-child(7) {
  animation-delay: 0.7s;
}
@keyframes blur {
  0% {
    text-shadow: 0 0 100px #2E2E2E;
    opacity: 0;
  }
  5% {
    text-shadow: 0 0 90px #2E2E2E;
  }
  15% {
    opacity: 1;
  }
  20% {
    text-shadow: 0 0 0px #2E2E2E;
  }
  80% {
    text-shadow: 0 0 0px #2E2E2E;
  }
  100% {
    text-shadow: 0 0 0px #2E2E2E;
  }
}

.bound {
  opacity: 0;
}
.bound.fadeUp {
  animation: bound 3s forwards 1.8s;
}
@media screen and (max-width: 767px) {
  .bound.fadeUp {
    animation: bound 3s forwards 1.5s;
  }
}

@keyframes bound {
  0% {
    transform: translateY(0);
    opacity: 0;
  }
  10% {
    transform: translateY(0);
    opacity: 0.2;
  }
  20% {
    transform: translateY(-25px);
    opacity: 0.4;
  }
  25% {
    transform: translateY(0);
    opacity: 0.6;
  }
  30% {
    transform: translateY(-15px);
    opacity: 0.8;
  }
  50% {
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
.page-id-42 .merit-item h4 {
  color: #F8A212;
}
.page-id-42 .merit-item span {
  background-color: #F8A212;
}
.page-id-42 .merit-item div {
  background-color: #FFFAD3;
}
.page-id-42 .contact span.required {
  color: #F8A212;
  border: 1px solid #F8A212;
}
.page-id-42 .contact p:has(select)::after {
  border-top: 10px solid #F8A212;
}
.page-id-42 .lower-fv-circle {
  background-color: #F7C674;
}
.page-id-42 .contact input[type=submit], .page-id-42 .contact input[type=button] {
  background: #F8A212;
}
.page-id-42 .balloon2 {
  color: #F8A212;
  border: 3px solid #F8A212;
}
.page-id-42 .balloon2:after {
  border-top: 14px solid #F8A212;
}
.page-id-42 .solve-img {
  background-color: #FFFAD3;
}
.page-id-42 .merit h2,
.page-id-42 .body-right .contact-img p,
.page-id-42 .contact .contact-policy a,
.page-id-42 .onayami-item .talk p,
.page-id-42 .solve .title p,
.page-id-42 .solve-item > p span,
.page-id-42 .system_1-left h3,
.page-id-42 .system_2-right p .blue {
  color: #F8A212;
}
.page-id-42 .body-right .contact-img p::before, .page-id-42 .body-right .contact-img p::after,
.page-id-42 .contact input[type=checkbox]:checked:after {
  background-color: #F8A212;
}
.page-id-42 .solve-wrap {
  max-width: none;
  width: 90%;
}
@media screen and (max-width: 1400px) {
  .page-id-42 .solve-wrap {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5rem 5%;
  }
}
.page-id-42 .solve-img {
  margin-bottom: 2rem;
}
.page-id-42 .solve-item {
  width: 30%;
}
@media screen and (max-width: 1400px) {
  .page-id-42 .solve-item {
    width: 40%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-42 .solve-item {
    width: 46%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-42 .solve-item {
    width: 100%;
  }
}
.page-id-42 .solve-item:last-child .balloon2 {
  padding: 1.25rem 1rem;
}
.page-id-42 .solve-item:last-child .balloon2 p {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
@media screen and (max-width: 1600px) {
  .page-id-42 .solve-item:last-child .school-br {
    display: none;
  }
}
@media screen and (max-width: 1400px) {
  .page-id-42 .solve-item:last-child .school-br {
    display: block;
  }
}
.page-id-42 .solve-item > p {
  font-size: 12px;
}
.page-id-42 .system .container {
  border: 3px solid #F8A212;
}
.page-id-42 .system h2 {
  color: #F8A212;
}
.page-id-42 .system_1 {
  background-color: #FFFAD3;
}
.page-id-42 .system_1 h4 {
  color: #F8A212;
}
.page-id-42 .system_1 h4::before, .page-id-42 .system_1 h4::after {
  background-color: #F8A212;
}
.page-id-42 .system_1::before {
  background-color: #FFFAD3;
}
.page-id-42 .system_1 li:before {
  background-color: #F8A212;
}
.page-id-42 .point-head p {
  color: #F8A212;
}
.page-id-42 .point-head p::before {
  background-color: #F8A212;
}
.page-id-42 .point-head span {
  -webkit-text-stroke: 1px #F8A212;
  text-stroke: 1px #F8A212;
}
.page-id-42 .point-item a {
  color: #F8A212;
}
.page-id-42 .point-item a::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
}
.page-id-42 .title-ballon h2 span {
  color: #F8A212;
}
.page-id-42 .scholarship-text li span {
  color: #F8A212;
}
.page-id-42 .scholarship .circle span::before {
  background: radial-gradient(circle 6px, #F8A212 50%, transparent 50%);
}
.page-id-42 .scholarship-text li::before {
  background: url(./images/scholarship-school.svg) no-repeat center/contain;
}
.page-id-42 .work .container > p {
  text-align: center;
  font-weight: bold;
  margin-top: 1.5rem;
  color: #f8a212;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
.page-id-42 .work .container > p span {
  font-size: clamp(1.25rem, 1.068rem + 0.61vw, 1.75rem);
  margin: 0 4px;
}
.page-id-42 .work .title h2 {
  color: #F8A212;
}
.page-id-42 .accordion-area li {
  border-bottom: 1px solid #F8A212;
}
.page-id-42 .accordion-area .accordion-title::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
}
.page-id-42 .accordion-area .accordion-title::after {
  background: url(./images/faq-ico2-school.png) no-repeat center/contain;
}
.page-id-42 .accordion-area .box a {
  color: #F8A212;
}
.page-id-42 .contact-hidden-btn {
  background: linear-gradient(to bottom, #E29616, #F7C674);
}
.page-id-42 .flow-img span {
  color: #F8A212;
}
.page-id-42 .flow-text h3 {
  color: #F8A212;
}
.page-id-42 .flow-text {
  background-color: #FFFAD3;
}
.page-id-42 .online .container > p {
  color: #F8A212;
}
.page-id-42 .online .container > p::before, .page-id-42 .online .container > p::after {
  background-color: #F8A212;
}
.page-id-42 .online-text p span {
  color: #F8A212;
}
.page-id-42 .scroll-down1 span {
  border-top: solid 2px #F8A212;
  border-right: solid 2px #F8A212;
}
.page-id-42 .flow .title-ballon h2 {
  color: #F8A212;
}
.page-id-42 .float-button__wrap a {
  color: #F8A212;
  border: 1px solid #F8A212;
}
@media screen and (max-width: 767px) {
  .page-id-42 .onayami-item .talk p {
    padding: 1rem;
  }
}
.page-id-42 .body-right .cta .blue a {
  background: #F8A212;
}
.page-id-42 .body-right .cta .blue a:hover {
  background: linear-gradient(to top, #F7C674, #F8A212);
}
.page-id-42 .body-right .cta .cta-btn-item p {
  color: #F8A212;
}
.page-id-42 .body-right .cta .cta-btn-item p::before, .page-id-42 .body-right .cta .cta-btn-item p::after {
  background-color: #F8A212;
}

.page-id-44 .merit-item h4 {
  color: #7E5DC7;
}
.page-id-44 .merit-item span {
  background-color: #A383EB;
}
.page-id-44 .merit-item div {
  background-color: #F4F4F4;
}
.page-id-44 .contact span.required {
  color: #A383EB;
  border: 1px solid #A383EB;
}
.page-id-44 .contact p:has(select)::after {
  border-top: 10px solid #7E5DC7;
}
.page-id-44 .lower-fv-circle {
  background-color: #B9A3EB;
}
.page-id-44 .contact input[type=submit], .page-id-44 .contact input[type=button] {
  background: #A383EB;
}
.page-id-44 .balloon2 {
  color: #A383EB;
  border: 3px solid #A383EB;
}
.page-id-44 .balloon2:after {
  border-top: 14px solid #A383EB;
}
.page-id-44 .solve-img {
  background-color: #F5F7FF;
}
.page-id-44 .merit h2,
.page-id-44 .body-right .contact-img p,
.page-id-44 .contact .contact-policy a,
.page-id-44 .onayami-item .talk p,
.page-id-44 .solve .title p,
.page-id-44 .solve-item > p span,
.page-id-44 .system_1-left h3,
.page-id-44 .system_2-right p .blue {
  color: #A383EB;
}
.page-id-44 .body-right .contact-img p::before, .page-id-44 .body-right .contact-img p::after,
.page-id-44 .contact input[type=checkbox]:checked:after {
  background-color: #7E5DC7;
}
.page-id-44 .system .container {
  border: 3px solid #7E5DC7;
}
.page-id-44 .system h2 {
  color: #7E5DC7;
}
.page-id-44 .system_1 {
  background-color: #F5F7FF;
}
.page-id-44 .system_1 h4 {
  color: #7E5DC7;
}
.page-id-44 .system_1 h4::before, .page-id-44 .system_1 h4::after {
  background-color: #7E5DC7;
}
.page-id-44 .system_1::before {
  background-color: #F5F7FF;
}
.page-id-44 .system_1 li:before {
  background-color: #7E5DC7;
}
.page-id-44 .point-head p {
  color: #7E5DC7;
}
.page-id-44 .point-head p::before {
  background-color: #7E5DC7;
}
.page-id-44 .point-head span {
  -webkit-text-stroke: 1px #7E5DC7;
  text-stroke: 1px #7E5DC7;
}
.page-id-44 .point-item a {
  color: #7E5DC7;
}
.page-id-44 .point-item a::before {
  background: url(./images/faq-ico-f.svg) no-repeat center/contain;
}
.page-id-44 .title-ballon h2 span {
  color: #A383EB;
}
.page-id-44 .scholarship-text li span {
  color: #7E5DC7;
}
.page-id-44 .scholarship .circle span::before {
  background: radial-gradient(circle 6px, #7E5DC7 50%, transparent 50%);
}
.page-id-44 .scholarship-text li::before {
  background: url(./images/scholarship-f.svg) no-repeat center/contain;
}
.page-id-44 .work .title h2 {
  color: #7E5DC7;
}
.page-id-44 .accordion-area li {
  border-bottom: 1px solid #7E5DC7;
}
.page-id-44 .accordion-area .accordion-title::before {
  background: url(./images/faq-ico-f.svg) no-repeat center/contain;
}
.page-id-44 .accordion-area .accordion-title::after {
  background: url(./images/faq-ico2-f.png) no-repeat center/contain;
}
.page-id-44 .accordion-area .box a {
  color: #7E5DC7;
}
.page-id-44 .contact-hidden-btn {
  background: linear-gradient(to bottom, #7E5DC7, #B9A3EB);
}
.page-id-44 .flow-img span {
  color: #7E5DC7;
}
.page-id-44 .flow-text h3 {
  color: #7E5DC7;
}
.page-id-44 .flow-text {
  background-color: #F5F7FF;
}
.page-id-44 .onayami-wrap {
  max-width: none;
  width: 90%;
}
@media screen and (max-width: 1400px) {
  .page-id-44 .onayami-wrap {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5rem 5%;
  }
}
.page-id-44 .onayami-item {
  width: 30%;
}
.page-id-44 .onayami-item > p {
  width: 100%;
}
@media screen and (max-width: 1400px) {
  .page-id-44 .onayami-item {
    width: 40%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-44 .onayami-item {
    width: 46%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-44 .onayami-item {
    width: 100%;
  }
}
.page-id-44 .onayami-item:nth-child(2) {
  margin-top: 4rem;
}
@media screen and (max-width: 1400px) {
  .page-id-44 .onayami-item:nth-child(2) {
    margin-top: 0;
  }
}
.page-id-44 .onayami-item:nth-child(3) .talk {
  animation: floating-y2 1.8s ease-in-out infinite alternate-reverse;
}
.page-id-44 .onayami-item .talk p {
  padding: 1.5rem 0;
}
@media screen and (max-width: 767px) {
  .page-id-44 .onayami-item .talk p {
    padding: 1rem 2rem;
  }
}
.page-id-44 .solve-wrap {
  max-width: none;
  width: 90%;
}
@media screen and (max-width: 1400px) {
  .page-id-44 .solve-wrap {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5rem 5%;
  }
}
.page-id-44 .solve-img {
  margin-bottom: 2rem;
}
.page-id-44 .solve-item {
  width: 30%;
}
@media screen and (max-width: 1400px) {
  .page-id-44 .solve-item {
    width: 40%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-44 .solve-item {
    width: 46%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-44 .solve-item {
    width: 100%;
  }
}
.page-id-44 .solve-item > p {
  font-size: 12px;
}
.page-id-44 .online .container > p {
  color: #A383EB;
}
.page-id-44 .online .container > p::before, .page-id-44 .online .container > p::after {
  background-color: #A383EB;
}
.page-id-44 .online-text p span {
  color: #A383EB;
}
.page-id-44 .flow .title-ballon h2 {
  color: #A383EB;
}
.page-id-44 .scroll-down1 span {
  border-top: solid 2px #A383EB;
  border-right: solid 2px #A383EB;
}
.page-id-44 .float-button__wrap a {
  color: #A383EB;
  border: 1px solid #A383EB;
}
.page-id-44 .body-right .cta .blue a {
  background: #A383EB;
}
.page-id-44 .body-right .cta .blue a:hover {
  background: linear-gradient(to top, #B9A3EB, #A383EB);
}
.page-id-44 .body-right .cta .cta-btn-item p {
  color: #A383EB;
}
.page-id-44 .body-right .cta .cta-btn-item p::before, .page-id-44 .body-right .cta .cta-btn-item p::after {
  background-color: #A383EB;
}

/*service*/
.lower-fv {
  position: relative;
  padding-top: 9rem;
  height: auto;
  background-color: #fff;
  z-index: 0;
}
@media screen and (max-width: 1400px) {
  .lower-fv {
    padding-bottom: 1rem;
  }
}
@media screen and (max-width: 1024px) {
  .lower-fv {
    padding-top: 5rem;
  }
}
@media screen and (max-width: 767px) {
  .lower-fv {
    padding-top: 4rem;
  }
}
.lower-fv-box {
  margin: 0 auto;
  max-width: 1536px;
}
@media screen and (max-width: 1600px) {
  .lower-fv-box {
    max-width: 1152px;
  }
}
.lower-fv::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(to left, #D3ECFD, #6DC3FD);
  border-radius: 0 0 0 100px;
  top: 0;
  left: 0;
  z-index: -1;
}
.lower-fv-bottom {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 1024px) {
  .lower-fv-bottom {
    flex-direction: column-reverse;
    gap: 2rem;
    margin-top: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .lower-fv-bottom {
    width: 90%;
    margin: 1rem auto 0;
    gap: 2.5rem;
    align-items: end;
  }
}
.lower-fv-top-wrap {
  display: flex;
  align-items: center;
  color: #fff;
  gap: 2rem;
  margin-left: 3%;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  .lower-fv-top-wrap {
    flex-direction: column;
    margin: 0 auto;
    width: 90%;
    align-items: flex-start;
    gap: 0.5rem;
  }
}
.lower-fv-circle {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  width: 15%;
  border-radius: 999vh;
  border: 5px solid #fff;
  aspect-ratio: 1/1;
  position: relative;
  background-color: #8FCDFA;
  max-width: 280px;
}
@media screen and (max-width: 1024px) {
  .lower-fv-circle {
    border: 5px solid #fff;
  }
}
@media screen and (max-width: 767px) {
  .lower-fv-circle {
    width: -moz-fit-content;
    width: fit-content;
    border-radius: 15px;
    aspect-ratio: auto;
    border: 4px solid #fff;
  }
}
.lower-fv-circle h2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
  font-size: clamp(1.25rem, 0.795rem + 1.52vw, 2.5rem);
}
@media screen and (max-width: 767px) {
  .lower-fv-circle h2 {
    position: relative;
    top: auto;
    left: auto;
    transform: none;
    padding: 0.25rem 1rem;
  }
  .lower-fv-circle h2 br {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .lower-fv-text {
    width: 95%;
    margin-left: auto;
  }
}
.lower-fv-text h1 {
  font-size: clamp(1.5rem, 0.955rem + 1.82vw, 3rem);
  opacity: 0;
}
.lower-fv-text h1.fadeUp {
  animation: slideTextX-100 1s ease-out 0s forwards;
}
.lower-fv-text p {
  font-weight: bold;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
  line-height: 2;
  word-break: break-all;
  margin-top: 1rem;
  opacity: 0;
}
.lower-fv-text p.fadeUp {
  animation: slideTextX-100 1.3s ease-out 0.8s forwards;
}
.lower-fv-img-box {
  width: 42%;
  max-height: 48vh;
  margin-bottom: -3rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .lower-fv-img-box {
    width: 60%;
    max-width: 470px;
  }
}
@media screen and (max-width: 1024px) {
  .lower-fv .hukidasi {
    display: none;
  }
}

.hukidasi {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 3%;
  padding: 16px 2rem;
  top: -17%;
  right: 0;
  width: -moz-max-content;
  width: max-content;
  opacity: 0;
}
@media screen and (max-width: 1610px) {
  .hukidasi {
    right: -15%;
  }
}
@media screen and (max-width: 1600px) {
  .hukidasi {
    right: -20%;
    top: -25%;
  }
}
@media screen and (max-width: 1400px) {
  .hukidasi {
    flex-direction: column;
    right: -5%;
    padding: 8px 1rem;
  }
}
@media screen and (max-width: 1024px) {
  .hukidasi {
    right: auto;
    left: -8%;
    top: -180px;
  }
}
@media screen and (max-width: 767px) {
  .hukidasi {
    flex-direction: row;
    max-width: none;
    left: -3%;
    top: -24%;
  }
}
@media screen and (max-width: 570px) {
  .hukidasi {
    flex-direction: column;
    padding: 8px 0.5rem;
    gap: 0.25rem;
  }
}
.hukidasi.fadeUp {
  animation: fadeAnime 1s ease-out 2s forwards;
}
.hukidasi p {
  width: 55%;
  font-weight: bold;
}
@media screen and (max-width: 1400px) {
  .hukidasi p {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .hukidasi p {
    font-size: 12px;
  }
}
.hukidasi p span {
  font-size: 12px;
}
@media screen and (max-width: 767px) {
  .hukidasi p span {
    font-size: 10px;
  }
}
.hukidasi div {
  width: 45%;
  display: flex;
  align-items: center;
  gap: 3%;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .hukidasi div {
    width: 100%;
  }
}
.hukidasi img {
  max-height: 40px;
}
@media screen and (max-width: 767px) {
  .hukidasi img {
    max-width: 40px;
  }
}
.hukidasi img:first-child {
  width: 25%;
}
.hukidasi img:last-child {
  width: 65%;
}
@media screen and (max-width: 1024px) {
  .hukidasi img:last-child {
    max-width: 120px;
  }
}

/*award*/
.award {
  width: 42%;
  max-width: 700px;
}
@media screen and (max-width: 1024px) {
  .award {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .award {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
  }
}
.award-item {
  background-color: #fff;
  border-radius: 70px;
  padding: 0.5rem 0;
  text-align: center;
  font-weight: bold;
  width: 80%;
  position: relative;
  max-width: 440px;
}
@media screen and (max-width: 1024px) {
  .award-item {
    max-width: 350px;
  }
}
@media screen and (max-width: 767px) {
  .award-item {
    max-width: 250px;
  }
}
.award-item::before, .award-item::after {
  content: "";
  position: absolute;
  width: 60px;
  height: 100px;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .award-item::before, .award-item::after {
    width: 25px;
    height: 50px;
  }
}
.award-item::before {
  background: url(./images/award1.png) no-repeat center/contain;
  left: 1rem;
}
@media screen and (max-width: 1400px) {
  .award-item::before {
    left: 0;
  }
}
.award-item::after {
  background: url(./images/award2.png) no-repeat center/contain;
  right: 1rem;
}
@media screen and (max-width: 1400px) {
  .award-item::after {
    right: 0;
  }
}
.award-item > p {
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 767px) {
  .award-item > p {
    font-size: 8px;
    margin-bottom: 0.2rem;
  }
}
.award-item:last-child {
  margin: 1rem 0 0 auto;
}
@media screen and (max-width: 767px) {
  .award-item:last-child {
    margin: 0;
  }
}
.award-item div {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 1rem;
}
.award-item .award1 {
  font-size: clamp(0.5rem, 0.227rem + 0.91vw, 1.25rem);
}
.award-item .award2 {
  font-size: clamp(1.5rem, 0.591rem + 3.03vw, 4rem);
  color: #FCD20B;
  line-height: 1;
}
.award-item .award2 span {
  font-size: clamp(2rem, 0.682rem + 4.39vw, 5.625rem);
  line-height: 0;
}

/*merit*/
.merit {
  background-color: #fff;
  padding: 2rem 0 3.5rem;
}
.merit .hukidasi {
  display: none;
}
@media screen and (max-width: 1024px) {
  .merit .hukidasi {
    display: block;
  }
}
.merit .container {
  max-width: 1536px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .merit .container > h2 {
    display: none;
  }
}
@media screen and (max-width: 1600px) {
  .merit .container {
    max-width: 1152px;
  }
}
@media screen and (max-width: 1400px) {
  .merit .container {
    max-width: 1024px;
  }
}
@media screen and (max-width: 767px) {
  .merit {
    padding: 0 0 3.5rem;
  }
}
.merit h2 {
  color: #209FFC;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  margin: 0 0 0 15%;
}
.merit h2 span {
  font-size: clamp(1.5rem, 1.136rem + 1.21vw, 2.5rem);
  margin: 0 0.25rem;
}
.merit-title-sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .merit-title-sp {
    display: flex;
    align-items: end;
    justify-content: center;
    gap: 0rem;
    margin-top: -1rem;
    position: relative;
  }
  .merit-title-sp img {
    width: 25%;
  }
  .merit-title-sp h2 {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0;
  }
}
.merit-wrap img {
  position: absolute;
  left: -1%;
  max-width: 200px;
  top: -150px;
  width: 13%;
}
@media screen and (max-width: 1024px) {
  .merit-wrap img {
    top: -100px;
  }
}
@media screen and (max-width: 767px) {
  .merit-wrap img {
    display: none;
  }
}
.merit .slider {
  position: relative;
}
.merit-wrap {
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.merit-item {
  text-align: center;
  position: relative;
  padding-top: 1.5rem;
  word-break: keep-all;
}
.merit-item-wrap {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem;
}
@media screen and (max-width: 1400px) {
  .merit-item-wrap {
    grid-template-columns: repeat(3, 1fr);
    gap: 3%;
  }
}
@media screen and (max-width: 767px) {
  .merit-item-wrap {
    grid-template-columns: repeat(2, 1fr);
  }
}
.merit-item div {
  background-color: #DFF1FD;
  border-radius: 10px;
  padding: 1.5rem 0.2rem 1rem;
}
@media screen and (max-width: 767px) {
  .merit-item div {
    padding: 1rem 0.2rem;
  }
}
.merit-item span {
  position: absolute;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  line-height: 1;
  font-weight: bold;
  color: #fff;
  padding: 0.6rem 1rem;
  border-radius: 100px;
  background-color: #209FFC;
  top: 0rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  aspect-ratio: 1/1;
}
@media screen and (max-width: 767px) {
  .merit-item span {
    padding: 0.7rem 1rem;
  }
}
.merit-item p {
  font-size: 12px;
}
.merit-item h4 {
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
  color: #209FFC;
}

.body-wrap {
  display: flex;
  align-items: stretch;
  background: linear-gradient(to left, #D3ECFD, #6DC3FD);
}
.body-left {
  width: 80%;
  transition: 0.3s;
}
@media screen and (max-width: 1279px) {
  .body-left {
    width: 100%;
  }
}
.body-left.centered {
  width: 100%;
}
.body-right {
  width: 20%;
  transition: 0.3s;
  position: fixed;
  height: auto;
  right: 0;
  top: 0;
  z-index: 20;
  overflow: scroll;
  /*スクロールバー非表示（IE・Edge）*/
  -ms-overflow-style: none;
  /*スクロールバー非表示（Firefox）*/
  scrollbar-width: none;
}

/*body-right*/
.body-right::-webkit-scrollbar {
  display: none;
}
@media screen and (max-width: 1279px) {
  .body-right {
    display: none;
  }
}
.body-right .cta-btn-item p::before, .body-right .cta-btn-item p::after {
  top: 70%;
  width: 30px;
}
.body-right.close {
  right: -20%;
  opacity: 0;
}

/*blue-wrap*/
.blue-wrap {
  padding: 2.5rem 0 10rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .blue-wrap {
    padding-bottom: 5rem;
  }
}
.blue-wrap::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 120px;
  background: url(./images/white-triangle.png) no-repeat center/cover;
  bottom: -1px;
  left: 0;
}
.blue-wrap .title {
  color: #fff;
  font-weight: bold;
}
.blue-wrap .title p {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  margin-bottom: 0.5rem;
}
.blue-wrap .title h2 {
  font-size: clamp(1.25rem, 0.886rem + 1.21vw, 2.25rem);
}

/*onayami*/
.onayami-wrap {
  max-width: 960px;
  margin: 2.5rem auto 0;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .onayami-wrap {
    width: 80%;
    flex-direction: column;
    gap: 2.5rem;
    margin-top: 2rem;
  }
}
.onayami-item {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .onayami-item {
    width: 100%;
  }
}
.onayami-item img {
  width: 75%;
  margin: 0 auto 1.5rem;
  font-weight: bold;
}
.onayami-item > p {
  color: #fff;
  line-height: 2;
  font-weight: bold;
  text-align: center;
  width: 90%;
  margin: 0 auto;
  letter-spacing: 2px;
  word-break: break-all;
  max-width: 395px;
}
@media screen and (max-width: 767px) {
  .onayami-item > p {
    width: 100%;
  }
}
.onayami-item > p br {
  display: none !important;
}
.onayami-item .talk p {
  background-color: #fff;
  border-radius: 60px;
  padding: 1.5rem 2rem;
  text-align: center;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  color: #209FFC;
  font-weight: 500;
  margin-bottom: 3rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .onayami-item .talk p {
    padding: 1rem 2rem;
    margin: 0 auto 2rem;
    width: -moz-fit-content;
    width: fit-content;
  }
}
.onayami-item .talk p::before {
  content: "";
  position: absolute;
  width: 85px;
  height: 80px;
  background: url(./images/talk.png) no-repeat center/contain;
  bottom: -5.5rem;
  right: 1rem;
}
@media screen and (max-width: 767px) {
  .onayami-item .talk p::before {
    width: 4rem;
    height: 3.5rem;
    bottom: -4rem;
  }
}
.onayami-item:first-child .talk {
  animation: floating-y2 1.8s ease-in-out infinite alternate-reverse;
}
.onayami-item:nth-child(2) .talk {
  animation: floating-y 1.8s ease-in-out infinite alternate-reverse;
}

/*solve*/
.solve {
  background-color: #fff;
  padding: 4rem 0 7.5rem;
}
.solve .title {
  font-weight: bold;
}
.solve .title p {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  color: #209FFC;
}
.solve .title p span {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
}
.solve .title h2 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
}
.solve-wrap {
  display: flex;
  margin: 5rem auto 0;
  max-width: 1100px;
  justify-content: space-between;
  align-items: baseline;
}
@media screen and (max-width: 767px) {
  .solve-wrap {
    flex-direction: column;
    gap: 2.5rem;
    margin-top: 2rem;
    width: 80%;
  }
}
.solve-wrap.fadeUp .solve-item:first-child img {
  animation: zoomInAnime 1s ease-out 0s forwards;
}
@media screen and (max-width: 767px) {
  .solve-wrap.fadeUp .solve-item:first-child img {
    animation: none;
  }
}
.solve-wrap.fadeUp .solve-item:nth-child(2) img {
  animation: zoomInAnime 1s ease-out 1s forwards;
}
@media screen and (max-width: 767px) {
  .solve-wrap.fadeUp .solve-item:nth-child(2) img {
    animation: none;
  }
}
.solve-wrap.fadeUp .solve-item:nth-child(3) img {
  animation: zoomInAnime 1s ease-out 2s forwards;
}
@media screen and (max-width: 767px) {
  .solve-wrap.fadeUp .solve-item:nth-child(3) img {
    animation: none;
  }
}
.solve-item {
  width: 48%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .solve-item {
    width: 100%;
  }
}
.solve-item .balloon2 {
  font-weight: bold;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  width: 80%;
  text-align: center;
  padding: 1.25rem;
}
.solve-item img {
  max-width: 350px;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  opacity: 0;
  height: 80%;
}
@media screen and (max-width: 767px) {
  .solve-item img.fadeUp {
    animation: zoomInAnime 1s ease-out 0s forwards !important;
  }
}
.solve-item > p {
  font-weight: 500;
  line-height: 2;
  text-align: center;
  letter-spacing: 2px;
}
.solve-item > p:not(:last-child) {
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .solve-item > p:not(:last-child) {
    margin-bottom: 1rem;
  }
}
.solve-item > p span {
  color: #209FFC;
}
.solve-img {
  aspect-ratio: 1/1;
  max-width: 340px;
  background-color: #EBF6FD;
  border-radius: 999vh;
  position: relative;
  width: 80%;
  margin-bottom: 4rem;
}
@media screen and (max-width: 767px) {
  .solve-img {
    margin-bottom: 1rem;
  }
}

/*system*/
.system {
  background-color: #fff;
  padding-bottom: 2.5rem;
}
.system .container {
  max-width: 1228px;
  width: 90%;
  margin: 0 auto;
  border-radius: 25px;
  border: 3px solid #3D82E5;
  padding: 4rem 3rem;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 1024px) {
  .system .container {
    padding: 2rem 1.5rem;
  }
}
.system h2 {
  color: #3D82E5;
}
.system .title {
  background-color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  margin: -6.5rem auto 1rem;
  padding: 0 2rem;
}
@media screen and (max-width: 1279px) {
  .system .title {
    margin-top: -4rem;
  }
}
@media screen and (max-width: 767px) {
  .system .title {
    margin-top: -5rem;
    padding: 0 1rem;
  }
}
.system-wrap {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22.5rem;
}
@media screen and (max-width: 1024px) {
  .system-wrap {
    margin-top: 1rem;
  }
}
.system_1 {
  display: flex;
  background-color: #EBF6FD;
  border-radius: 30px 30px 0 30px;
  padding: 1.5rem 2rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .system_1 {
    flex-direction: column;
    gap: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .system_1 {
    padding: 1rem;
  }
}
.system_1::before {
  content: "";
  position: absolute;
  right: -5px;
  top: 38%;
  display: inline-block;
  width: 33%;
  border-radius: 999vh;
  background: #EBF6FD;
  aspect-ratio: 1/1;
  height: auto;
  min-width: 300px;
  z-index: 0;
}
@media screen and (max-width: 1024px) {
  .system_1::before {
    top: auto;
    bottom: -150px;
  }
}
@media screen and (max-width: 767px) {
  .system_1::before {
    width: 60%;
    min-width: auto;
    bottom: -100px;
  }
}
@media screen and (max-width: 490px) {
  .system_1::before {
    bottom: -85px;
  }
}
.system_1-left {
  width: 60%;
}
@media screen and (max-width: 1024px) {
  .system_1-left {
    width: 100%;
  }
}
.system_1-left p {
  font-weight: 500;
  word-break: break-all;
  max-width: 510px;
}
.system_1-left p:first-child {
  font-weight: bold;
}
.system_1-left .system_1-p {
  padding-right: 3rem;
}
@media screen and (max-width: 1024px) {
  .system_1-left .system_1-p {
    padding-right: 0;
  }
}
.system_1-left h3 {
  color: #209FFC;
  font-size: clamp(1.125rem, 0.807rem + 1.06vw, 2rem);
  margin: 0.5rem 0;
}
@media screen and (max-width: 767px) {
  .system_1-left h3 {
    margin: 0;
  }
}
.system_1-right {
  width: 40%;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .system_1-right {
    width: 100%;
  }
}
.system_1-talk {
  background-color: #fff;
  border-radius: 10px;
  padding: 1rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .system_1-talk {
    padding: 0.5rem;
  }
}
.system_1-talk::before {
  content: "";
  position: absolute;
  bottom: -20px;
  right: 2rem;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 16px solid transparent;
  border-left: 16px solid transparent;
  border-top: 20px solid #ffffff;
  border-bottom: 0;
}
@media screen and (max-width: 767px) {
  .system_1-talk::before {
    display: none;
  }
}
.system_1-img {
  position: absolute;
  right: -2rem;
  width: 88%;
}
@media screen and (max-width: 1400px) {
  .system_1-img {
    right: -1rem;
  }
}
@media screen and (max-width: 1024px) {
  .system_1-img {
    width: -moz-fit-content;
    width: fit-content;
  }
}
@media screen and (max-width: 767px) {
  .system_1-img {
    width: 60%;
    right: -0.5rem;
    top: 90%;
  }
}
.system_1-img p {
  text-align: center;
  font-weight: 500;
  margin: 1rem 0 0.5rem;
}
@media screen and (max-width: 767px) {
  .system_1-img p {
    font-size: 8px;
  }
}
.system_1-img img.logo {
  width: 220px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .system_1-img img.logo {
    width: 110px;
  }
}
.system_1-img img.system1 {
  height: 200px;
}
@media screen and (max-width: 1024px) {
  .system_1-img img.system1 {
    height: 150px;
    width: 80%;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .system_1-img img.system1 {
    width: 110px;
    height: auto;
  }
}
.system_1 h4 {
  text-align: center;
  color: #209FFC;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
  margin-bottom: 0.5rem;
  padding: 0 1.5rem;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto 0.5rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .system_1 h4 {
    margin-bottom: 0.25rem;
  }
}
.system_1 h4::before, .system_1 h4::after {
  content: "";
  position: absolute;
  top: 55%;
  display: inline-block;
  width: 20px;
  height: 1px;
  background-color: #3D82E5;
}
.system_1 h4:before {
  left: -5px;
  transform: rotate(45deg);
}
.system_1 h4:after {
  right: -5px;
  transform: rotate(-45deg);
}
.system_1 li {
  padding-left: 1.5rem;
  position: relative;
  font-size: clamp(0.5rem, 0.364rem + 0.45vw, 0.875rem);
}
@media screen and (max-width: 767px) {
  .system_1 li {
    padding-left: 1rem;
  }
}
.system_1 li::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0%;
  width: 10px;
  height: 10px;
  border-radius: 999vh;
  background-color: #209FFC;
}
@media screen and (max-width: 767px) {
  .system_1 li::before {
    top: 2.5px;
    width: 8px;
    height: 8px;
  }
}
.system_2 {
  display: flex;
  background-color: #F7F7F7;
  border-radius: 30px;
  padding: 1.5rem 2rem;
  position: relative;
  justify-content: end;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .system_2 {
    flex-direction: column;
    padding: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .system_2 {
    padding: 1rem;
  }
}
.system_2::before {
  content: "";
  position: absolute;
  left: -5px;
  bottom: 0%;
  display: inline-block;
  width: 33%;
  border-radius: 999vh;
  background: #F7F7F7;
  aspect-ratio: 1/1;
  height: auto;
  min-width: 300px;
  z-index: -1;
}
@media screen and (max-width: 1024px) {
  .system_2::before {
    bottom: auto;
    top: -150px;
  }
}
@media screen and (max-width: 767px) {
  .system_2::before {
    width: 60%;
    min-width: auto;
    top: -100px;
  }
}
@media screen and (max-width: 490px) {
  .system_2::before {
    top: -85px;
  }
}
.system_2-img {
  position: absolute;
  left: 1rem;
  bottom: 3rem;
  width: 30%;
}
@media screen and (max-width: 1024px) {
  .system_2-img {
    bottom: auto;
    top: -250px;
    width: 40%;
    max-width: 240px;
  }
}
@media screen and (max-width: 767px) {
  .system_2-img {
    top: -130px;
    left: 1.5rem;
  }
}
.system_2-img p {
  text-align: center;
  font-weight: 500;
  margin: 0.5rem 0;
}
@media screen and (max-width: 767px) {
  .system_2-img p {
    font-size: 8px;
  }
}
.system_2-img .logo {
  width: 245px;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .system_2-img .logo {
    width: 110px;
  }
}
.system_2-img .system2 {
  height: 250px;
}
@media screen and (max-width: 1400px) {
  .system_2-img .system2 {
    height: 200px;
  }
}
@media screen and (max-width: 1024px) {
  .system_2-img .system2 {
    height: 150px;
  }
}
@media screen and (max-width: 767px) {
  .system_2-img .system2 {
    width: 50px;
    height: 75px;
    margin: 0 auto;
  }
}
.system_2-right {
  width: 65%;
}
@media screen and (max-width: 1024px) {
  .system_2-right {
    width: 100%;
  }
}
.system_2-right p {
  font-weight: 500;
  line-height: 2;
}
.system_2-right p .green {
  color: #006E75;
}
.system_2-right p .blue {
  color: #209FFC;
  font-weight: bold;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.system_middle {
  position: absolute;
  background-color: #3D82E5;
  top: 53%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 50%;
  aspect-ratio: 1/1;
  z-index: -2;
  border-radius: 999vh;
}
@media screen and (max-width: 1024px) {
  .system_middle {
    top: 60%;
  }
}
@media screen and (max-width: 767px) {
  .system_middle {
    top: 57%;
    width: 80%;
  }
}
.system_middle div {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.system_middle p {
  color: #fff;
  font-weight: bold;
  text-align: center;
  font-size: clamp(0.75rem, 0.386rem + 1.21vw, 1.75rem);
  line-height: 2;
}
@media screen and (max-width: 767px) {
  .system_middle p {
    line-height: 1.5;
  }
}
.system_middle p:first-child {
  font-size: clamp(1.5rem, 5vw, 5.625rem);
  line-height: 1;
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .system_middle p:first-child {
    margin-bottom: 0.5rem;
  }
}

/*point*/
.point {
  padding: 2.5rem 0 0;
  background: linear-gradient(to bottom, #DFF1FD, #fff);
}
.point h2 {
  color: #209FFC !important;
  width: 90%;
  margin: 0 auto;
}
.point-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  margin-top: 2.5rem;
  gap: 3rem 0;
  max-width: 1100px;
}
@media screen and (max-width: 1024px) {
  .point-wrap {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .point-wrap {
    grid-template-columns: repeat(1, 1fr);
  }
}
.point-wrap.fadeUp .point-item:first-child {
  animation: fadeTopAnime 1s ease-out 0s forwards;
}
@media screen and (max-width: 767px) {
  .point-wrap.fadeUp .point-item:first-child {
    animation: none;
  }
}
.point-wrap.fadeUp .point-item:nth-child(2) {
  animation: fadeTopAnime 1s ease-out 0.5s forwards;
}
@media screen and (max-width: 767px) {
  .point-wrap.fadeUp .point-item:nth-child(2) {
    animation: none;
  }
}
.point-wrap.fadeUp .point-item:nth-child(3) {
  animation: fadeTopAnime 1s ease-out 1s forwards;
}
@media screen and (max-width: 767px) {
  .point-wrap.fadeUp .point-item:nth-child(3) {
    animation: none;
  }
}
.point-wrap.fadeUp .point-item:last-child {
  animation: fadeTopAnime 1s ease-out 1.5s forwards;
}
@media screen and (max-width: 767px) {
  .point-wrap.fadeUp .point-item:last-child {
    animation: none;
  }
}
.point-item {
  background-color: #fff;
  border-radius: 30px;
  width: 90%;
  margin: 0 auto;
  padding: 2rem;
  max-width: 500px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 10px 10px 10px #EBF6FD;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .point-item {
    border-radius: 15px;
    padding: 1rem;
  }
  .point-item.fadeUp {
    animation: fadeTopAnime 1s ease-out 0s forwards !important;
  }
}
.point-item img {
  max-height: 150px;
  margin: 2rem auto;
  width: 70%;
}
.point-item > p {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  word-break: break-all;
}
.point-item a {
  margin: 1.5rem auto 0;
  color: #209FFC;
  font-weight: bold;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  padding-right: 2rem;
  position: relative;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.point-item a::before {
  content: "";
  position: absolute;
  width: 20px;
  height: 10px;
  background: url(./images/faq-ico.svg) no-repeat;
  background-size: contain;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  right: 0;
}
.point-head {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}
.point-head h3 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  margin-left: 0.5rem;
}
.point-head p {
  color: #209FFC;
  font-weight: bold;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  position: relative;
}
.point-head p::before {
  content: "";
  position: absolute;
  width: 50px;
  height: 4px;
  background-color: #209FFC;
  bottom: -6px;
  left: 0;
}
@media screen and (max-width: 1024px) {
  .point-head p::before {
    width: 40px;
  }
}
.point-head span {
  font-weight: bold;
  -webkit-text-stroke: 1px #209FFC; /*ベンダープレフィックス*/
  text-stroke: 1px #209FFC; /*1px赤色縁取り*/
  color: transparent;
  font-size: clamp(2rem, 1.273rem + 2.42vw, 4rem);
  line-height: 1;
  margin-top: -1rem;
}
@media screen and (max-width: 1024px) {
  .point-head span {
    margin-top: -0.5rem;
  }
}

/*scholarship*/
.scholarship {
  background-color: #fff;
  padding-top: 7.5rem;
}
@media screen and (max-width: 767px) {
  .scholarship {
    padding-top: 5rem;
  }
}
.scholarship p {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
.scholarship .circle span {
  position: relative;
  color: #2E2E2E;
}
.scholarship .circle span::before {
  position: absolute;
  top: -6px;
  left: 0;
  right: 0;
  margin: auto;
  content: "";
  padding-top: 8px;
  background: radial-gradient(circle 6px, #209FFC 50%, transparent 50%);
  background: -moz-radial-gradient(circle 6px, #209FFC 50%, transparent 50%);
}
@media screen and (max-width: 1024px) {
  .scholarship .circle span::before {
    background: radial-gradient(circle 4px, #209FFC 50%, transparent 50%);
    background: -moz-radial-gradient(circle 4px, #209FFC 50%, transparent 50%);
  }
}
.scholarship-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .scholarship-wrap {
    flex-direction: column;
    gap: 1rem;
  }
}
.scholarship-wrap img {
  width: 50%;
}
@media screen and (max-width: 767px) {
  .scholarship-wrap img {
    width: 100%;
  }
}
.scholarship-text {
  width: 48%;
}
@media screen and (max-width: 767px) {
  .scholarship-text {
    width: 100%;
  }
}
.scholarship-text ul {
  margin: 1.5rem 0;
}
@media screen and (max-width: 767px) {
  .scholarship-text ul {
    margin: 1rem 0;
  }
}
.scholarship-text li {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
  padding-left: 3rem;
  position: relative;
}
.scholarship-text li::before {
  content: "";
  position: absolute;
  width: 32px;
  height: 24px;
  background: url(./images/scholarship.svg) no-repeat center/contain;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 767px) {
  .scholarship-text li::before {
    width: 20px;
    height: 20px;
    left: 1rem;
  }
}
.scholarship-text li span {
  color: #209FFC;
}
.scholarship-text li:not(:last-child) {
  margin-bottom: 0.5rem;
}

/*online*/
.online {
  background-color: #fff;
  padding: 10rem 0 7.5rem;
}
.online .container {
  width: 90%;
}
.online .container > p {
  font-weight: bold;
  text-align: center;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 2rem;
  margin: 0 auto;
  color: #209FFC;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.online .container > p::before, .online .container > p::after {
  content: "";
  position: absolute;
  top: 45%;
  display: inline-block;
  width: 20px;
  height: 1px;
  background-color: #209FFC;
}
.online .container > p:before {
  left: -5px;
  transform: rotate(45deg);
}
.online .container > p:after {
  right: -5px;
  transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
  .online {
    padding: 5rem 0;
  }
}
.online video {
  width: 80%;
  margin: 3.5rem auto 2.5rem;
  display: block;
  max-width: 768px;
}
@media screen and (max-width: 767px) {
  .online video {
    width: 100%;
    margin: 1.5rem auto 2.5rem;
  }
}
.online-text {
  width: 80%;
  margin: 0 auto;
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .online-text {
    width: 100%;
    gap: 0.5rem;
  }
}
.online-text img {
  width: 40px;
}
@media screen and (max-width: 767px) {
  .online-text img {
    width: 30px;
  }
}
.online-text p {
  word-break: break-all;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
}
.online-text p span {
  color: #209FFC;
}
.online-text p br {
  display: none;
}

/*work*/
.work {
  background-color: #fff;
}
.work .container {
  width: 90%;
}
.work .title h2 {
  color: #209FFC;
}
.work .title h2 span {
  font-size: clamp(2rem, 0.455rem + 5.15vw, 6.25rem);
  line-height: 1;
  margin-right: 0.5rem;
}
.work-wrap {
  background-color: #C7D9F6;
  border-radius: 30px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 2rem 1rem;
  gap: 1rem;
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  .work-wrap {
    padding: 1rem;
    gap: 0.5rem;
  }
}
.work .button {
  display: none;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .work .button {
    display: block;
  }
}
.work .button p {
  text-align: center;
}
.work .button p::before {
  content: "詳しく見る";
  font-weight: bold;
  font-size: 12px;
}
.work .hidden-view.open + .button p::before {
  content: "閉じる";
}
.work .hidden-view.open + .button .scroll-down1 span {
  animation: scrollUp 1.5s ease infinite;
}
@keyframes scrollUp {
  0% {
    transform: translateY(30px) rotate(-45deg);
    opacity: 0;
  }
  50% {
    transform: translateY(0px) rotate(-45deg);
    opacity: 1;
  }
  100% {
    transform: translateY(-30px) rotate(-45deg);
    opacity: 0;
  }
}
.work-item {
  background-color: #fff;
  border-radius: 5px;
  padding: 0.5rem 0;
  display: flex;
  justify-content: space-between;
  width: calc((100% - 3rem) / 4);
}
@media screen and (max-width: 1024px) {
  .work-item {
    width: calc((100% - 1rem) / 2);
  }
}
@media screen and (max-width: 767px) {
  .work-item {
    width: 100%;
  }
  .work-item.hidden-view {
    display: none;
  }
  .work-item.open {
    display: flex;
  }
}
.work-item img {
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
  width: 40px;
  height: 40px;
}
.work-item div {
  width: calc(100% - 45px);
}
.work-item div h4 {
  font-size: clamp(0.875rem, 0.83rem + 0.15vw, 1rem);
}
.work-item div p {
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
}

/*flow*/
.flow {
  padding: 10rem 0 10rem;
  background-color: #fff;
}
@media screen and (max-width: 767px) {
  .flow {
    padding: 5rem 0;
  }
}
.flow .container {
  max-width: 1100px;
}
.flow .title-ballon h2 {
  color: #209FFC;
}
.flow .title-ballon h2 span {
  display: inline-block;
}
.flow-wrap {
  margin: 4rem auto 1rem;
}
@media screen and (max-width: 767px) {
  .flow-wrap {
    margin-top: 2rem;
  }
}
.flow-wrap + p {
  text-align: end;
}
.flow-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flow-item:not(:last-child) {
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 767px) {
  .flow-item:not(:last-child) {
    margin-bottom: 1.5rem;
  }
}
.flow-item:nth-child(3) img {
  width: 33%;
}
.flow-img {
  width: 110px;
  aspect-ratio: 1/1;
  background-color: #F6F7F7;
  border-radius: 100px;
  position: relative;
}
@media screen and (max-width: 767px) {
  .flow-img {
    width: 50px;
  }
}
.flow-img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 50%;
}
.flow-img span {
  position: absolute;
  top: -10%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  color: #209FFC;
  font-weight: bold;
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
@media screen and (max-width: 767px) {
  .flow-img span {
    top: -25%;
  }
}
.flow-text {
  width: calc(100% - 150px);
  background-color: #EBF6FD;
  padding: 1rem 2rem;
}
@media screen and (max-width: 767px) {
  .flow-text {
    width: calc(100% - 70px);
    padding: 0.5rem 1rem;
  }
}
.flow-text h3 {
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem);
  color: #209FFC;
}
.flow-text p {
  margin: 0.5rem 0 0 1.5rem;
}
@media screen and (max-width: 767px) {
  .flow-text p {
    margin: 0.25rem 0 0 1rem;
  }
}

/*faq*/
.faq {
  padding-bottom: 15rem;
  background-color: #fff;
}
.faq .container {
  max-width: 1100px;
}
@media screen and (max-width: 1279px) {
  .faq {
    padding-bottom: 10rem;
  }
}
@media screen and (max-width: 767px) {
  .faq {
    padding-bottom: 5rem;
  }
}

/*cta*/
.cta {
  padding: 5rem 0 8rem;
}
.cta + footer {
  margin-top: -3rem;
  position: relative;
}
.cta .title h2 {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
.cta .img-title img {
  max-width: 240px !important;
}
.cta-wrap {
  background-color: #fff;
  border-radius: 30px;
  width: 95%;
  margin: 0 auto;
  padding: 4rem 2rem 5rem;
  border-bottom: 2.5rem solid #3D82E5;
  position: relative;
  max-width: 1500px;
}
@media screen and (max-width: 767px) {
  .cta-wrap {
    padding: 2rem 5% 2.5rem;
  }
}
.cta-girl, .cta-boy {
  width: 25%;
  position: absolute;
  max-width: 400px;
  bottom: -2.5rem;
}
@media screen and (max-width: 1024px) {
  .cta-girl, .cta-boy {
    display: none;
  }
}
.cta-girl img, .cta-boy img {
  max-width: 300px;
  width: 80%;
}
.cta-girl p, .cta-boy p {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  text-align: center;
  font-weight: bold;
}
.cta-girl p span, .cta-boy p span {
  display: inline-block;
}
.cta-girl .cta-talk, .cta-boy .cta-talk {
  width: 100%;
  padding: 10px 0.5rem;
}
.cta-boy {
  right: -1%;
}
.cta-boy img {
  margin-left: auto;
}
.cta-girl {
  left: -1%;
}
.cta-girl p {
  padding: 1.5rem 0;
}
.cta-btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem 0;
  max-width: 890px;
  margin: 1.5rem auto 0;
  width: 70%;
  gap: 5%;
}
@media screen and (max-width: 1024px) {
  .cta-btn {
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
    width: 100%;
  }
}
.cta-btn-item {
  width: 40%;
}
@media screen and (max-width: 1024px) {
  .cta-btn-item {
    width: 100%;
  }
}
.cta-btn-item p {
  font-weight: 500;
  text-align: center;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 2rem;
  margin: 0 auto;
}
@media screen and (max-width: 1600px) {
  .cta-btn-item p {
    padding: 0 0.9rem;
  }
}
@media screen and (max-width: 1024px) {
  .cta-btn-item p {
    padding: 0 2rem;
  }
}
.cta-btn-item p::before, .cta-btn-item p::after {
  content: "";
  position: absolute;
  top: 45%;
  display: inline-block;
  width: 20px;
  height: 1px;
}
.cta-btn-item p:before {
  left: -16px;
  transform: rotate(45deg);
}
@media screen and (max-width: 767px) {
  .cta-btn-item p:before {
    left: 0;
  }
}
.cta-btn-item p:after {
  right: -16px;
  transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
  .cta-btn-item p:after {
    right: 0;
  }
}
.cta-btn-item a {
  display: flex;
  justify-content: center;
  gap: 1rem;
  padding: 1.4rem 0;
  border-radius: 40px;
  align-items: center;
  color: #fff;
  font-weight: bold;
  max-width: 340px;
  margin: 1rem auto 0;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.15);
}
@media screen and (max-width: 767px) {
  .cta-btn-item a {
    max-width: 300px;
  }
}
.cta-btn-item a img {
  width: 35px;
  height: auto;
  max-height: 30px;
}
.cta .cta-talk.boy {
  color: #3D82E5;
  border-color: #3D82E5;
}
@media screen and (max-width: 1400px) {
  .cta .cta-talk.boy {
    display: block;
    margin-left: auto;
  }
}
@media screen and (max-width: 1279px) {
  .cta .cta-talk.boy {
    max-width: none;
  }
}
@media screen and (max-width: 767px) {
  .cta .cta-talk.boy {
    text-align: center;
    margin: 0 !important;
  }
}
.cta .cta-talk.boy::after {
  border-top: 14px solid #3D82E5;
}
.cta .cta-talk.boy div {
  display: flex;
  align-items: center;
  gap: 1rem;
  justify-content: center;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .cta .cta-talk.boy div {
    gap: 0.5rem;
  }
}
.cta .cta-talk.boy div p {
  font-weight: bold;
}
.cta .cta-talk.boy div p:first-child {
  font-size: clamp(0.75rem, 0.477rem + 0.91vw, 1.5rem);
}
.cta .cta-talk.boy div p:last-child {
  font-size: clamp(2rem, 1.273rem + 2.42vw, 4rem);
  color: #FCD20B;
}
.cta .cta-talk.girl {
  color: #FE6A6A;
  border-color: #FE6A6A;
  font-weight: bold;
}
.cta .cta-talk.girl p {
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
}
@media screen and (max-width: 1279px) {
  .cta .cta-talk.girl {
    display: block;
    max-width: none;
    width: -moz-fit-content;
    width: fit-content;
  }
}
@media screen and (max-width: 1024px) {
  .cta .cta-talk.girl::before {
    left: 20%;
  }
  .cta .cta-talk.girl::after {
    left: 20%;
  }
}
@media screen and (max-width: 767px) {
  .cta .cta-talk.girl {
    text-align: center;
  }
}
.cta .cta-talk.girl::after {
  border-top: 14px solid #FE6A6A;
}
.cta .orange {
  width: 80%;
  margin: 1.5rem auto 0;
  color: #E29616;
}
@media screen and (max-width: 1024px) {
  .cta .orange {
    width: 100%;
  }
}
.cta .orange a {
  background: #E29616;
  width: 35%;
}
@media screen and (max-width: 1024px) {
  .cta .orange a {
    width: 100%;
  }
}
.cta .orange a:hover {
  background: linear-gradient(to top, #F7C674, #E29616);
}
.cta .orange p::before, .cta .orange p::after {
  background-color: #E29616;
}
.cta .purple {
  color: #7E5DC7;
}
.cta .purple a {
  background: #7E5DC7;
}
.cta .purple a:hover {
  background: linear-gradient(to top, #B9A3EB, #7E5DC7);
}
.cta .purple p::before, .cta .purple p::after {
  background-color: #7E5DC7;
}
.cta .blue {
  color: #219FFC;
}
.cta .blue a {
  background: #219FFC;
}
.cta .blue a:hover {
  background: linear-gradient(to top, #8FCDFA, #219FFC);
}
.cta .blue p::before, .cta .blue p::after {
  background-color: #219FFC;
}
.cta-sp {
  display: none;
  width: 70%;
  margin: 0 auto 1.5rem;
  max-width: 550px;
}
@media screen and (max-width: 1024px) {
  .cta-sp {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .cta-sp {
    width: 100%;
  }
}
.cta-sp img {
  max-height: 250px;
}
.cta-sp .balloon2 {
  border-radius: 10px;
}
.cta-sp .balloon2.boy {
  margin: 1rem 0 0 auto;
  display: flex;
  align-items: center;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: bold;
  gap: 0.5rem;
  justify-content: center;
}
@media screen and (max-width: 767px) {
  .cta-sp .balloon2.boy {
    flex-direction: column;
    margin: 0 5% 0 auto !important;
    gap: 0;
  }
}
.cta-sp .balloon2.boy:before {
  bottom: auto;
  top: -24px;
  left: 80%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-bottom: 12px solid #FFF;
}
@media screen and (max-width: 767px) {
  .cta-sp .balloon2.boy:before {
    left: 90%;
  }
}
.cta-sp .balloon2.boy:after {
  top: -30px;
  left: 80%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-bottom: 14px solid #3D82E5;
  bottom: auto;
}
@media screen and (max-width: 767px) {
  .cta-sp .balloon2.boy:after {
    left: 90%;
  }
}

.cta-one .orange a {
  width: 100%;
  background-color: #F8A212;
}
.cta-one .purple a {
  background-color: #A383EB;
}
.cta-one .cta-wrap {
  border: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  z-index: 0;
  padding: 4rem 5% 0rem 2.5%;
}
@media screen and (max-width: 1024px) {
  .cta-one .cta-wrap {
    padding-top: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta-wrap {
    flex-direction: column;
    padding: 0 0 20px 0;
  }
}
.cta-one .cta-wrap::before {
  content: "";
  position: absolute;
  width: 70%;
  height: 100%;
  background-color: #209FFC;
  top: 0;
  left: 0;
  background: url(./images/cta-bg.png) no-repeat right/cover;
  z-index: -1;
}
@media screen and (max-width: 1400px) {
  .cta-one .cta-wrap::before {
    width: 65%;
  }
}
@media screen and (max-width: 1024px) {
  .cta-one .cta-wrap::before {
    width: 60%;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta-wrap::before {
    display: none;
  }
}
.cta-one .cta-wrap > img {
  width: 40%;
}
@media screen and (max-width: 1400px) {
  .cta-one .cta-wrap > img {
    width: 35%;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta-wrap > img {
    display: none;
  }
}
.cta-one .cta-boy {
  position: relative;
  bottom: auto;
  right: auto;
  display: block;
}
@media screen and (max-width: 767px) {
  .cta-one .cta-boy {
    width: 100%;
    background-color: #209FFC;
    margin-bottom: 1rem;
    padding: 1.5rem 5% 1rem;
  }
  .cta-one .cta-boy img {
    position: absolute;
    width: 28%;
    bottom: 0;
    right: 5%;
  }
}
.cta-one .cta-boy .cta-talk {
  border: none;
}
.cta-one .cta-boy .cta-talk::after {
  border-top: 14px solid transparent;
}
@media screen and (max-width: 1024px) {
  .cta-one .cta-boy .cta-talk {
    padding: 10px 0;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta-boy .cta-talk {
    width: 70%;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta .cta-talk.boy div p:last-child {
    font-size: 3rem;
    line-height: 1;
  }
}
.cta-one .title div.img-title {
  flex-direction: column;
}
.cta-one .title > img {
  display: none;
}
@media screen and (max-width: 767px) {
  .cta-one .title > img {
    display: block;
    width: 60%;
    margin: 0.5rem auto 0;
  }
}
.cta-one .cta-btn-item {
  width: 100%;
  margin-top: 2.5rem;
}
@media screen and (max-width: 1024px) {
  .cta-one .cta-btn-item {
    margin-top: 1rem;
  }
}
.cta-one .cta-btn-item a img {
  width: 28px;
}
@media screen and (max-width: 767px) {
  .cta-one .cta-btn-item a img {
    width: 24px;
  }
}
@media screen and (max-width: 1024px) {
  .cta-one .cta-btn-item p::before, .cta-one .cta-btn-item p::after {
    top: 70%;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta-btn-item p::before, .cta-one .cta-btn-item p::after {
    top: 45%;
  }
}
@media screen and (max-width: 1024px) {
  .cta-one .cta-btn-item p {
    padding: 0 1rem;
  }
  .cta-one .cta-btn-item p span {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .cta-one .cta-btn-item p {
    padding: 0 2rem;
  }
  .cta-one .cta-btn-item p span {
    display: inline-block;
  }
}

.body-right .cta {
  background: none;
  padding: 7rem 0 0;
}
.body-right .cta .cta-sp {
  display: block;
  width: 100%;
  margin: 0;
}
.body-right .cta-wrap {
  padding: 1rem 5% 1.5rem;
  width: 95%;
  border: none;
  margin-right: 0;
  border-radius: 30px 0 0 30px;
  min-height: 75vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
}
.body-right .cta-wrap .img-title {
  flex-direction: column;
  gap: 0;
}
.body-right .cta .cta-talk.girl {
  display: block;
  text-align: center;
  padding: 10px;
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.16);
  margin: 0;
}
.body-right .cta .cta-talk.girl p {
  font-size: 14px;
}
@media screen and (max-width: 1400px) {
  .body-right .cta .cta-talk.girl p {
    font-size: 12px;
  }
}
.body-right .cta .cta-talk.girl::before {
  left: 20%;
}
.body-right .cta .cta-talk.girl::after {
  left: 20%;
}
.body-right .cta .cta-talk.boy {
  text-align: center;
  margin: 0 !important;
  padding: 0 10px;
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.16);
  flex-wrap: wrap;
  gap: 0;
}
.body-right .cta .cta-talk.boy div {
  gap: 0.5rem;
}
.body-right .cta .cta-talk.boy div p:last-child {
  font-size: clamp(1.25rem, 0.795rem + 1.52vw, 2.5rem);
  line-height: 1;
  margin-bottom: 0.5rem;
}
.body-right .cta .cta-talk.boy div p:first-child {
  font-size: 12px;
}
.body-right .cta .cta-talk.boy > p {
  font-size: 14px;
}
.body-right .cta .title h2 {
  font-size: 1rem;
}
.body-right .cta .cta-btn-item {
  width: 100%;
}
.body-right .cta .cta-btn-item a {
  padding: 1rem;
}
.body-right .cta .cta-btn-item a img {
  max-height: 40px;
}
.body-right .cta .cta-btn-item p {
  padding: 0 1.5rem;
}

.page-id-107 .body-right .cta .cta-btn-item a:hover {
  background: linear-gradient(to top, #8FCDFA, #219FFC);
}
.page-id-107 header {
  background-color: #209FFC;
}
@media screen and (max-width: 1024px) {
  .page-id-107 header {
    background-color: transparent;
  }
}
.page-id-107 header .login a {
  color: #fff !important;
}
.page-id-107 header .login a img {
  filter: brightness(100);
}
.page-id-107 .hamburger-menu .gnavi__sp-style .ham-login {
  background-color: #209FFC;
  color: #fff !important;
}
.page-id-107 .hamburger-menu .gnavi__sp-style .ham-login img {
  filter: brightness(100);
}

.page-id-42 .cta-one .cta-wrap::before {
  background: url(./images/cta-bg2.png) no-repeat right/cover;
}
@media screen and (max-width: 767px) {
  .page-id-42 .cta-one .cta-boy {
    background-color: #F8A212;
  }
}
.page-id-42 .cta-one .cta-talk.boy {
  color: #F8A212;
}
.page-id-42 .lower-ex .btn {
  border-color: #F8A212;
  color: #F8A212;
}
.page-id-42 .lower-ex .btn::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
}
.page-id-42 .lower-ex .btn:hover {
  background-color: #F8A212;
  color: #fff;
}
.page-id-42 header {
  background-color: #F7C674;
}
@media screen and (max-width: 1024px) {
  .page-id-42 header {
    background-color: transparent;
  }
}
.page-id-42 header .login a {
  color: #fff !important;
}
.page-id-42 header .login a img {
  filter: brightness(100);
}
.page-id-42 .hamburger-menu .gnavi__sp-style .ham-login {
  background-color: #F7C674;
  color: #fff !important;
}
.page-id-42 .hamburger-menu .gnavi__sp-style .ham-login img {
  filter: brightness(100);
}

.page-id-44 .cta-one .cta-wrap::before {
  background: url(./images/cta-bg3.png) no-repeat right/cover;
}
@media screen and (max-width: 767px) {
  .page-id-44 .cta-one .cta-boy {
    background-color: #A383EB;
  }
}
.page-id-44 .cta-one .cta-talk.boy {
  color: #A383EB;
}
.page-id-44 .lower-ex .btn {
  border-color: #A383EB;
  color: #A383EB;
}
.page-id-44 .lower-ex .btn::before {
  background: url(./images/faq-ico-f.svg) no-repeat center/contain;
}
.page-id-44 .lower-ex .btn:hover {
  background-color: #A383EB;
  color: #fff;
}
.page-id-44 header {
  background-color: #B9A3EB;
}
@media screen and (max-width: 1024px) {
  .page-id-44 header {
    background-color: transparent;
  }
}
.page-id-44 header .login a {
  color: #fff !important;
}
.page-id-44 header .login a img {
  filter: brightness(100);
}
.page-id-44 .hamburger-menu .gnavi__sp-style .ham-login {
  background-color: #B9A3EB;
  color: #fff !important;
}
.page-id-44 .hamburger-menu .gnavi__sp-style .ham-login img {
  filter: brightness(100);
}

.page-id-261 .lower-ex .btn,
.page-id-382 .lower-ex .btn {
  border-color: #F8A212;
  color: #F8A212;
}
.page-id-261 .lower-ex .btn::before,
.page-id-382 .lower-ex .btn::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
}
.page-id-261 .lower-ex .btn:hover,
.page-id-382 .lower-ex .btn:hover {
  background-color: #F8A212;
  color: #fff;
}
.page-id-261 header,
.page-id-382 header {
  background-color: #F8A212;
}
@media screen and (max-width: 1024px) {
  .page-id-261 header,
  .page-id-382 header {
    background-color: transparent;
  }
}
.page-id-261 header .login a,
.page-id-382 header .login a {
  color: #fff !important;
}
.page-id-261 header .login a img,
.page-id-382 header .login a img {
  filter: brightness(100);
}
.page-id-261 .hamburger-menu .gnavi__sp-style .ham-login,
.page-id-382 .hamburger-menu .gnavi__sp-style .ham-login {
  background-color: #F8A212;
  color: #fff !important;
}
.page-id-261 .hamburger-menu .gnavi__sp-style .ham-login img,
.page-id-382 .hamburger-menu .gnavi__sp-style .ham-login img {
  filter: brightness(100);
}

.lower-ex {
  margin-bottom: 7.5rem;
}
.lower-ex > h2 {
  text-align: center;
  color: #fff;
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  letter-spacing: 0.12em;
}
.lower-ex .btn {
  margin: 2.5rem auto 0;
}
.lower-ex .filter-results {
  max-width: 1160px;
  margin: 2.5rem auto 0;
  width: 90%;
}

.filter-results.three {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.filter-results.three .filter-results-item {
  width: 30%;
}
@media screen and (max-width: 1024px) {
  .filter-results.three .filter-results-item {
    width: 48%;
  }
}
@media screen and (max-width: 767px) {
  .filter-results.three .filter-results-item {
    width: 100%;
  }
}

.top-btn {
  color: #fff;
  background-color: #3D82E5;
  border-radius: 999vh;
  padding: 1rem 2rem;
  text-align: center;
  min-width: 270px;
  display: block;
  margin: 2rem auto 0;
  width: -moz-fit-content;
  width: fit-content;
  border: 1px solid #3D82E5;
  font-weight: bold;
}
@media screen and (max-width: 767px) {
  .top-btn {
    font-size: 14px;
    padding: 12px 2rem;
  }
}
.top-btn:hover {
  color: #3D82E5;
  background-color: #fff;
}
.top-btn.white {
  color: #3D82E5;
  background-color: #fff;
  border: 1px solid #fff;
}
.top-btn.white:hover {
  color: #fff;
  background-color: #3D82E5;
}

.home {
  background: #fff;
}
.home .title h2 {
  font-size: clamp(1.5rem, 1.227rem + 0.91vw, 2.25rem);
  color: #3D82E5;
}
.home .title div.img-title img {
  max-width: 520px;
  width: 35%;
}
@media screen and (max-width: 767px) {
  .home .title div.img-title img {
    width: 200px;
  }
}
.home .title div.img-title {
  flex-direction: row;
}
.home .blue-wrap {
  background-color: #E5F7FF;
}
.home .blue-wrap .title {
  color: #3D82E5;
}
.home .onayami-wrap {
  max-width: 1390px;
  width: 90%;
}
@media screen and (max-width: 1400px) {
  .home .onayami-wrap {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5rem 5%;
  }
}
.home .onayami-item {
  width: 30%;
}
.home .onayami-item > p {
  color: #2E2E2E;
}
@media screen and (max-width: 1400px) {
  .home .onayami-item {
    width: 45%;
  }
}
@media screen and (max-width: 1024px) {
  .home .onayami-item {
    width: 46%;
  }
}
@media screen and (max-width: 767px) {
  .home .onayami-item {
    width: 100%;
  }
}
.home .onayami-item:nth-child(2) {
  margin-top: 5rem;
}
@media screen and (max-width: 1400px) {
  .home .onayami-item:nth-child(2) {
    margin-top: 0;
  }
}
.home .onayami-item:nth-child(2) .talk p {
  padding: 0.5rem 2rem;
}
.home .onayami-item:nth-child(3) .talk {
  animation: floating-y2 1.8s ease-in-out infinite alternate-reverse;
}
.home .onayami-item .talk p {
  color: #3D82E5;
}
.home .solve {
  background-color: #fff;
  padding: 2.5rem 0 10rem;
  margin: 0;
  border-radius: 0 0 30px 30px;
}
@media screen and (max-width: 767px) {
  .home .solve {
    padding: 2.5rem 0 3rem;
  }
}
.home .solve .title h2 {
  color: #3D82E5;
}
.home .solve-item {
  width: 30%;
}
@media screen and (max-width: 1400px) {
  .home .solve-item {
    width: 45%;
  }
}
@media screen and (max-width: 1024px) {
  .home .solve-item {
    width: 47%;
  }
}
@media screen and (max-width: 767px) {
  .home .solve-item {
    width: 100%;
  }
}
.home .solve-item p {
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
}
.home .solve-item p span {
  color: #3D82E5;
}
.home .solve-item > p:first-child {
  color: #3D82E5;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  line-height: 1.3;
  height: 5rem;
}
@media screen and (max-width: 1400px) {
  .home .solve-item > p:first-child {
    height: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .home .solve-item > p:first-child {
    height: auto;
  }
}
.home .solve-wrap {
  max-width: 1390px;
  width: 90%;
}
@media screen and (max-width: 1400px) {
  .home .solve-wrap {
    flex-wrap: wrap;
    justify-content: center;
    gap: 2.5rem 5%;
  }
}
.home .flow {
  background-color: transparent;
  padding-top: 0;
  width: 85%;
}
.home .flow .top-flow-text {
  width: 460px;
  margin: 2rem auto 4rem;
}
.home .flow-wrap {
  padding: 0rem;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1024px) {
  .home .flow-wrap {
    justify-content: center;
    gap: 4rem 1rem;
    flex-wrap: wrap;
  }
}
.home .flow-wrap > h3 {
  font-size: clamp(1.125rem, 0.807rem + 1.06vw, 2rem);
  text-align: center;
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .home .flow-wrap > h3 {
    margin-bottom: 1.5rem;
  }
}
.home .flow-text p {
  font-size: clamp(0.875rem, 0.83rem + 0.15vw, 1rem);
  margin: 0;
}
.home .flow h3 {
  color: #3D82E5;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 0.5rem;
}
.home .flow-text {
  padding: 0;
  background-color: transparent;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .home .flow-text {
    width: 70%;
  }
}
.home .flow-item {
  padding: 2rem 1rem;
  position: relative;
  width: 19%;
  display: flex;
  flex-direction: column;
  opacity: 0;
  border-radius: 10px;
  border: 1px solid #A7E0FE;
  justify-content: flex-start;
  margin: 0 !important;
}
@media screen and (max-width: 1024px) {
  .home .flow-item {
    width: 30%;
  }
}
@media screen and (max-width: 767px) {
  .home .flow-item {
    width: 100%;
    flex-direction: row;
    padding: 2.5rem 0.5rem 2rem;
  }
}
.home .flow-item:nth-child(2) {
  border-color: #89C5F7;
}
.home .flow-item:nth-child(2) span {
  background-color: #89C5F7;
}
.home .flow-item:nth-child(3) {
  border-color: #73B2F2;
}
.home .flow-item:nth-child(3) span {
  background-color: #73B2F2;
}
.home .flow-item:nth-child(4) {
  border-color: #5D9EEC;
}
.home .flow-item:nth-child(4) span {
  background-color: #5D9EEC;
}
.home .flow-item:nth-child(5) {
  border-color: #4589E7;
}
.home .flow-item:nth-child(5) span {
  background-color: #4589E7;
}
.home .flow-item span {
  position: absolute;
  font-size: 2rem;
  color: #fff;
  font-weight: bold;
  background-color: #A7E0FE;
  padding: 14px 22px 17px;
  line-height: 1;
  top: -2.5rem;
  border-radius: 999vh;
}
@media screen and (max-width: 767px) {
  .home .flow-item span {
    top: -2rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}
.home .flow-item img {
  width: 90%;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .home .flow-item img {
    width: 30%;
  }
}
.home .flow-item.fadeUp {
  animation: fadeTopAnime 1s ease-out 0s forwards;
}
.home .faq {
  border-radius: 30px;
  overflow: hidden;
  background-color: #fff;
  padding: 2.5rem;
}
@media screen and (max-width: 767px) {
  .home .faq {
    padding: 1.5rem 1rem;
  }
}
.home .faq .title h2 {
  text-align: left;
}


.cta.long {
  background: transparent;
}
.cta.long .title h2 {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  color: #2E2E2E;
}
@media screen and (max-width: 1279px) {
  .cta.long .cta-talk.girl {
    max-width: none;
    width: -moz-fit-content;
    width: fit-content;
  }
}
@media screen and (max-width: 1279px) {
  .cta.long .cta-talk.boy {
    max-width: none;
    width: -moz-fit-content;
    width: fit-content;
  }
}
@media screen and (max-width: 1024px) {
  .cta.long .cta-talk.boy {
    flex-direction: column;
  }
}
@media screen and (max-width: 767px) {
  .cta.long .cta-talk.boy {
    margin: 0 10% 0 auto !important;
  }
}
.cta.long .cta-talk.boy div {
  flex-direction: column;
  gap: 0;
  margin-bottom: 0.5rem;
}
@media screen and (max-width: 1024px) {
  .cta.long .cta-talk.boy div {
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 767px) {
  .cta.long .cta-talk.boy div {
    gap: 0.5rem;
  }
}
.cta.long .cta-talk.boy div p:last-child {
  font-size: clamp(1.5rem, 0.773rem + 2.42vw, 3.5rem);
  line-height: 1;
}

.how {
  background: url(./images/how-bg.png) no-repeat center/cover;
  padding: 4rem 0 7.5rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .how {
    padding: 5rem 0;
    margin: 0rem auto;
  }
}

.how .container{
  max-width: 1345px;
}

.how h2 {
  color: #fff;
  text-align: center;
  font-size: clamp(1.25rem, 1.114rem + 0.45vw, 1.625rem);
  margin-bottom: 1.5rem;
}

.how h2 span{
  font-size: clamp(2rem, 1.818rem + 0.61vw, 2.5rem);
}

.how h2 strong{
  font-size: clamp(2.5rem, 2.318rem + 0.61vw, 3rem);
  font-weight: bold;
}

.how video {
  width: 60%;
  display: block;
}

.how-wrap{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.how-img{
  width: 15%;
  text-align: center;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  opacity: 0;
}

.how-img1.fadeUp{
  animation: fadeTopAnime 1.5s forwards ;
}

.how-img2.fadeUp{
  animation: fadeTopAnime 1.5s forwards ;
}

.how-img p:last-child{
  font-size: clamp(1.125rem, 1.08rem + 0.15vw, 1.25rem);
}

.how-img img + p{
  margin: 12px 0 4px;
}

.how-img:last-child img{
  width: 90%;
}

.service {
  margin: 10rem auto 5rem;
  width: 80%;
}
@media screen and (max-width: 767px) {
  .service {
    margin: 5rem auto 2.5rem;
  }
}
.service h2 {
  margin-bottom: 7.5rem;
}
@media screen and (max-width: 767px) {
  .service h2 {
    margin-bottom: 2.5rem;
  }
}
.service-wrap {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1279px) {
  .service-wrap {
    flex-wrap: wrap;
    gap: 2.5rem;
  }
}
.service-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 62vh;
  min-height: 570px;
  max-height: 600px;
}
@media screen and (max-width: 1279px) {
  .service-item {
    height: auto;
    min-height: auto;
    max-height: none;
  }
}
.service-item img {
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.16);
  margin-bottom: 1rem;
}
.service-item h3 {
  font-size: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);
  margin: 0.5rem 0 1rem 12%;
}
@media screen and (max-width: 1279px) {
  .service-item h3 {
    margin-left: 3rem;
  }
}
.service-item h3 + p {
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
  margin-bottom: 1rem;
}
.service-item .arrow-btn {
  margin: 1.5rem auto 0;
  width: 80%;
  max-width: 260px;
}
.service-item.service1 {
  height: 62vh;
  min-height: 550px;
  max-height: 600px;
}
@media screen and (max-width: 1279px) {
  .service-item.service1 {
    height: auto;
    min-height: auto;
    max-height: none;
  }
}
.service-box {
  min-width: 320px;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 30px;
  padding: 1rem 1.5rem 5rem;
  width: 30%;
  position: relative;
}
@media screen and (max-width: 1279px) {
  .service-box {
    width: 100%;
  }
}
.service-box > .service-item:nth-child(3) {
  margin-top: 5rem;
}
@media screen and (max-width: 767px) {
  .service-box > .service-item:nth-child(3) {
    margin-top: 3rem;
  }
}
.service-box > .service-item:nth-child(3) h3 {
  margin: 0.5rem 0;
}
.service-box.orange h3 {
  color: #E29616;
}
.service-box.orange .service-item h3 + p span {
  color: #E29616;
  font-weight: 500;
}
.service-box.orange .arrow-btn {
  background-color: #F7C674;
}
.service-box.orange .arrow-btn::before {
  background: url(./images/service_1.png) no-repeat center/contain;
}
.service-box.orange .arrow-btn:hover {
  background: linear-gradient(to bottom, #F7C674, #E29616);
}
.service-box-one.blue .service-circle {
  background-color: #8FCDFA;
}
.service-box-one.blue h3 {
  color: #209FFC;
}
.service-box-one.blue .service-item h3 + p span {
  color: #209FFC;
  font-weight: 500;
}
.service-box-one.blue .arrow-btn {
  background-color: #8FCDFA;
}
.service-box-one.blue .arrow-btn::before {
  background: url(./images/service_3.png) no-repeat center/contain;
}
.service-box-one.blue .arrow-btn:hover {
  background: linear-gradient(to bottom, #8FCDFA, #219FFC);
}
.service-box.purple .service-circle {
  background-color: #B9A3EB;
}
.service-box.purple h3 {
  color: #7E5DC7;
}
.service-box.purple .service-item h3 + p span {
  color: #7E5DC7;
  font-weight: 500;
}
.service-box.purple .arrow-btn {
  background-color: #B9A3EB;
}
.service-box.purple .arrow-btn::before {
  background: url(./images/service_2.png) no-repeat center/contain;
}
.service-box.purple .arrow-btn:hover {
  background: linear-gradient(to bottom, #B9A3EB, #7E5DC7);
}
.service-box-one {
  width: 30%;
  min-width: 320px;
}
@media screen and (max-width: 1279px) {
  .service-box-one {
    width: 100%;
  }
}
.service-box-one .service-box {
  width: 100%;
}
.service-circle {
  position: absolute;
  aspect-ratio: 1/1;
  border-radius: 999vh;
  background-color: #F7C674;
  border: 6px solid #fff;
  padding: 1rem;
  width: 30%;
  max-width: 120px;
  position: absolute;
  top: -50px;
  left: -50px;
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 1400px) {
  .service-circle {
    width: 28%;
    top: -30px;
    left: -30px;
    border: 4px solid #fff;
    max-width: 90px;
  }
}
.service-circle p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  font-weight: bold;
  width: -moz-max-content;
  width: max-content;
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
}
.service-circle p span {
  display: block;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
.service .boy-fly {
  margin-top: 3.5rem;
}
@media screen and (max-width: 1279px) {
  .service .boy-fly {
    width: 50%;
    margin: 2rem auto 0;
  }
}
@media screen and (max-width: 767px) {
  .service .boy-fly {
    width: 75%;
  }
}
.service .boy-fly p {
  color: #3D82E5;
  font-weight: bold;
  position: relative;
  padding: 2.5rem 5% 4rem;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  z-index: 0;
  text-align: center;
}
.service .boy-fly p::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: url(./images/boy-fly-bg.png) no-repeat center/contain;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.service .boy-fly img {
  width: 70%;
  margin: 2rem 0 0 auto;
}
@media screen and (max-width: 1279px) {
  .service .boy-fly img {
    margin-top: 0;
  }
}

.about {
  overflow: hidden;
  padding: 5rem 0 2.5rem;
}
.about .container {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 50px;
  padding: 3.5rem 5%;
  width: 90%;
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.16);
}
@media screen and (max-width: 767px) {
  .about .container {
    padding: 2.5rem 5%;
    width: 100%;
  }
}
.about .img-title {
  justify-content: left;
  background-color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  border-radius: 30px;
  padding: 1rem 3rem;
}
@media screen and (max-width: 767px) {
  .about .img-title {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    padding: 1rem 2rem;
    border-radius: 10px;
  }
}
.about .img-title img {
  width: 390px !important;
}
@media screen and (max-width: 1024px) {
  .about .img-title img {
    width: 250px !important;
  }
}
@media screen and (max-width: 767px) {
  .about .img-title img {
    width: 150px !important;
  }
}
.about .img-title h2 {
  color: #3D82E5;
}
.about-wrap {
  display: flex;
  position: relative;
  margin: 2.5rem 0 0;
  max-width: 1380px;
}
@media screen and (max-width: 1279px) {
  .about-wrap {
    flex-direction: column-reverse;
    gap: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .about-wrap {
    gap: 0.5rem;
    margin-top: 1.5rem;
  }
}
.about-wrap img {
  position: absolute;
  width: 78%;
  right: -30%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  opacity: 0;
}
.about-wrap img.fadeUp {
  animation: fadeAboutImg 1s ease-out 0s forwards;
}
@media screen and (max-width: 1400px) {
  .about-wrap img {
    top: 60%;
  }
}
@media screen and (max-width: 1279px) {
  .about-wrap img {
    width: 100%;
    position: relative;
    top: auto;
    right: auto;
    transform: none;
  }
  .about-wrap img.fadeUp {
    animation: fadeAboutImg2 1s ease-out 0s forwards;
  }
}
.about-text {
  width: 65%;
  color: #fff;
}
@media screen and (max-width: 1279px) {
  .about-text {
    width: 100%;
  }
}
.about-text h4 {
  line-height: 2;
  margin-bottom: 2rem;
  font-size: clamp(1.125rem, 0.898rem + 0.76vw, 1.75rem);
  min-width: 700px;
}
@media screen and (max-width: 1279px) {
  .about-text h4 {
    min-width: auto;
  }
}
@media screen and (max-width: 767px) {
  .about-text h4 {
    margin-bottom: 0.5rem;
    line-height: 2;
  }
}
.about-text p {
  width: 75%;
  font-weight: 500;
  line-height: 2;
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
}
@media screen and (max-width: 1279px) {
  .about-text p {
    width: 100%;
  }
}
.about-text p:not(:last-child) {
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .about-text p:not(:last-child) {
    margin-bottom: 0.5rem;
  }
}
.about-text p span {
  font-weight: bold;
}
.about-reason {
  background-color: #fff;
  width: 90%;
  margin: 0 auto;
  padding: 2.5rem 5% 4rem;
  border-radius: 10px;
}
@media screen and (max-width: 767px) {
  .about-reason {
    padding: 2.5rem 5% 4rem;
    width: 90%;
  }
}
.about-reason h3 {
  color: #3D82E5;
  margin-bottom: 2rem;
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  text-align: center;
}
@media screen and (max-width: 767px) {
  .about-reason h3 {
    margin-bottom: 1rem;
  }
}
.about-reason .slick-prev {
  display: none !important;
}
.about-reason .slick-next {
  width: 4rem;
  height: 4rem;
  right: -4rem;
}
@media screen and (max-width: 1400px) {
  .about-reason .slick-next {
    width: 3rem;
    height: 3rem;
    right: -1rem;
  }
}
@media screen and (max-width: 767px) {
  .about-reason .slick-next {
    width: 2rem;
    height: 2rem;
    right: auto;
    top: auto;
    bottom: -3rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
  }
}
.about-reason .slick-next:before {
  color: transparent;
  background: url(./images/slider-btn.png) no-repeat center/contain;
  display: block;
  width: 100%;
  height: 100%;
}

.p-goto-slider__item {
  margin-right: 15px;
  display: flex !important;
  justify-content: space-around;
  align-items: center;
}
@media screen and (max-width: 1279px) {
  .p-goto-slider__item {
    flex-direction: column;
    gap: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .p-goto-slider__item {
    gap: 1.5rem;
  }
}
.p-goto-slider__item h4 {
  color: #3D82E5;
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .p-goto-slider__item h4 {
    margin-bottom: 0.5rem;
  }
}
.p-goto-slider__item img {
  width: 45%;
}
@media screen and (max-width: 1279px) {
  .p-goto-slider__item img {
    width: 80%;
  }
}
.p-goto-slider__item:focus {
  outline: none;
}
.p-goto-slider__text {
  width: 45%;
}
@media screen and (max-width: 1279px) {
  .p-goto-slider__text {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .p-goto-slider__text {
    width: 90%;
  }
}
.p-goto-slider__text p {
  line-height: 2;
  word-break: break-all;
}
.p-goto-slider__text p:not(:last-child) {
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .p-goto-slider__text p:not(:last-child) {
    margin-bottom: 0.5rem;
  }
}
.p-goto-slider__text p span {
  font-weight: bold;
}
.p-goto-slider__text p span:not(.black) {
  color: #3D82E5;
}
.p-goto-slider__no {
  align-items: center;
  color: #999;
  display: flex;
  font-size: 24px;
  font-weight: bold;
  height: 100%;
  justify-content: center;
  width: 100%;
}
.p-goto-nav {
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .p-goto-nav {
    margin-bottom: 2.5rem;
  }
}
.p-goto-nav__lists {
  display: flex;
  justify-content: center;
  background-color: #F0F0F0;
  border-radius: 50px;
}
@media screen and (max-width: 767px) {
  .p-goto-nav__lists {
    flex-wrap: wrap;
    background-color: transparent;
    gap: 1rem;
  }
}
.p-goto-nav__list {
  color: #2E2E2E;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
  font-weight: bold;
  text-align: center;
  padding: 20px 0;
  border-radius: 50px;
  width: 20%;
  background-color: #F0F0F0;
}
@media screen and (max-width: 1279px) {
  .p-goto-nav__list {
    padding: 12px 0;
  }
}
@media screen and (max-width: 767px) {
  .p-goto-nav__list {
    width: calc((100% - 1rem) / 2);
  }
}
.p-goto-nav__list.active {
  background-color: #3D82E5;
  color: #fff;
}
.p-goto-nav__list:hover {
  cursor: pointer;
}

.top-light-blue {
  padding: 5rem 0;
  background-color: #E5F7FF;
}

.introduce {
  padding: 0 0 5rem;
  margin: 7.5rem 0 10rem;
  position: relative;
}

.top-news{
  margin: 10rem 0 7.5rem;
  padding: 0;
}

.introduce::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 80%;
  background: #E2EEF5;
  bottom: 0;
  left: 0;
  z-index: -1;
}
@media screen and (max-width: 767px) {
  .introduce {
    padding: 0 0 4rem;
    margin: 7.5rem 0 ;
  }
}
.introduce .lower-ex {
  margin: 0;
}
.introduce .lower-ex .filter-results {
  margin: 0 auto;
  width: 90%;
  max-width: 1245px;
}
.introduce .lower-ex .filter-results.sp {
  display: none;
}
@media screen and (max-width: 767px) {
  .introduce .lower-ex .filter-results.sp {
    display: block;
  }
}
.introduce .btn-right {
  background-color: #3D82E5;
  color: #fff;
  border-color: #3D82E5;
  margin: 0 0 0 auto;
}
@media screen and (max-width: 1400px) {
  .introduce .btn-right {
    padding: 1rem 3rem 1rem 1.5rem;
  }
}
@media screen and (max-width: 1279px) {
  .introduce .btn-right {
    margin: 2.5rem auto 0;
  }
}
.introduce .btn-right::before {
  filter: brightness(5);
}
.introduce .content_area {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  max-width: 1728px;
  margin: 0 auto;
}
@media screen and (max-width: 1279px) {
  .introduce .content_area {
    flex-direction: column;
    gap: 2.5rem;
  }

}
.introduce .tab-container {
  width: 180px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (max-width: 1279px) {
  .introduce .tab-container {
    width: 100%;
    max-width: none;
  }
  .introduce .tab-container .tab-list {
    display: flex;
    justify-content: flex-start;
    gap: 2rem;
  }
  .introduce .tab-container .btn-right {
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .introduce .tab-container .tab-list {
    gap: 0.5rem;
  }
}
.introduce .content-container {
  width: calc(100% - 230px);
}
@media screen and (max-width: 1279px) {
  .introduce .content-container {
    width: 100%;
    border-radius: 0;
  }
  .introduce .content-container .filter-results {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media screen and (max-width: 1024px) {
  .introduce .content-container .filter-results {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 767px) {
  .introduce .content-container .filter-results {
    grid-template-columns: repeat(1, 1fr);
    width: 100%;
  }
  .introduce .content-container .filter-results .filter-results-item {
    margin: 0 1rem;
  }
}
.introduce .content-container .news-text {
  border-radius: 0 0 10px 10px;
}
.introduce .content-container .filter-results-item {
  padding: 0;
}
.introduce h3 {
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
  margin-bottom: 1.5rem;
}
.introduce .tab-item {
  cursor: pointer;
  margin-top: 1rem;
  padding: 0 0 4px;
  color:#1266B6;
  position: relative;
  font-size: clamp(1.125rem, 1.08rem + 0.15vw, 1.25rem);
  width: fit-content;
  transition: 0.3s;
}

.introduce .tab-item:hover{
  opacity: 0.7;
}

@media screen and (max-width: 1279px) {
  .introduce .tab-item {
    margin-bottom: 0;
  }
}
.introduce .tab-item.active::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 3px;
  background-color: #1266B6;
  bottom: 0;
  left: 0;
}
.introduce .tab-content {
  opacity: 0; /* 非表示にする */
  position: absolute; /* 他のコンテンツに影響を与えないように */
  pointer-events: none; /* ユーザーのインタラクションを防ぐ */
  position: relative;
  height: 0;
  padding: 0;
}
.introduce .tab-content.school .lower-fv-circle {
  background-color: #F7C674;
}
.introduce .tab-content.found .lower-fv-circle {
  background-color: #B9A3EB;
}
.introduce .tab-content.munici .lower-fv-circle {
  background-color: #8FCDFA;
}
.introduce .tab-content .lower-fv-circle {
  position: absolute;
  left: -3%;
  top: -10%;
  color: #fff;
  max-width: 200px;
  border: 8px solid #fff;
  z-index: 10;
}
@media screen and (max-width: 1279px) {
  .introduce .tab-content .lower-fv-circle {
    left: 1%;
    top: -5%;
    border: 4px solid #fff;
  }
}
.introduce .tab-content.show {
  opacity: 1; /* 表示時に表示する */
  position: relative; /* 親のレイアウトに戻す */
  pointer-events: auto; /* インタラクションを可能にする */
  height: auto;
}
.introduce .intro-btn2 {
  display: none;
}
@media screen and (max-width: 1279px) {
  .introduce .intro-btn2 {
    display: block;
  }
}
.introduce .slick-list {
  padding: 1rem 10% !important;
}
.introduce .top-btn {
  width: 90%;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .introduce .top-btn {
    margin: 1.5rem auto 0;
  }
}
.introduce .news-text {
  padding: 1rem 5%;
}
.introduce .filter-results-item a {
  position: relative;
}
.introduce .filter-results-head p {
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  .introduce .filter-results-head p {
    font-size: 12px;
  }
}
.introduce .filter-results h2 {
  font-size: 16px;
  margin: 0.5rem 0 1rem;
}
.introduce .filter-results-foot div {
  gap: 0.5rem;
}

.top-news .container{
  max-width: 1345px;
}

.top-news .top-news-list ul.newsList li:first-child {
  color: #2E2E2E;
}
.top-news h2 {
  text-align: left;
}
.home .top-news .title{
  margin-bottom: 3rem;
}

.top-news::before{
  display: none;
}
.top-news .item:not(:last-child) {
  margin-bottom: 2.5rem;
}

.top-news .news-item{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.top-news .news-thumb{
  width: 30%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.top-news .news-thumb:has(img.no){
  border: 1px solid #393939;
}

.top-news .item:hover .news-thumb img{
  transform: scale(1.1);
}

.top-news .news-thumb a{
  display: block;
}

.top-news .news-thumb img{
  /* aspect-ratio: 16 / 9; */
  height: auto;
  /* object-fit: cover; */
  transition: 0.3s;
}

.top-news .top-news-list ul.newsList {
  width: 65%;
  padding-bottom: 20px;
  border-bottom: 1px solid #393939;
  font-size: 12px;
}

.top-news .top-news-list ul.newsList li:nth-child(2){
  margin: 12px 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.top-news .top-news-list ul.newsList a{
  background-color: #1266B6;
  color: #fff;
  font-weight: bold;
  padding: 0px 8px;
  font-size: 14px;
}

.top-news .top-news-list ul.newsList li:last-child{
  font-size: clamp(0.875rem, 0.739rem + 0.45vw, 1.25rem);
  font-weight: bold;
}

.top-news .btn-right {
  margin: 2.5rem auto 0;
  box-shadow: none;
  border: none !important;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 767px) {
  .top-news .btn-right {
    margin-top: 1.5rem;
  }
}
.top-news .top-btn {
  margin: 0 0 0 auto;
}
@media screen and (max-width: 767px) {
  .top-news .top-btn {
    margin: 0 auto;
  }
}

#example {
  padding: 5rem 0 7.5rem;
  background-color: #fff;
  margin-top: 3rem;
  overflow: hidden;
}

.filter-results {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5rem 3%;
  max-width: 1230px;
  margin: 2.5rem auto 0;
}
@media screen and (max-width: 1024px) {
  .filter-results {
    grid-template-columns: repeat(2, 1fr);
    width: 90%;
    gap: 2.5rem 3%;
  }
}
@media screen and (max-width: 767px) {
  .filter-results {
    grid-template-columns: repeat(1, 1fr);
  }
}
.filter-results-item {
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.16);
  border-radius: 5px;
  padding-bottom: 2rem;
  background-color: #fff;
}
.filter-results-item a:hover img {
  transform: scale(1.1);
}
.filter-results-item img {
  transition: 0.3s;
  aspect-ratio: 16/9;
}
.filter-results img:not(.thumbnail) {
  -o-object-fit: cover;
     object-fit: cover;
}
.filter-results .thumbnail {
  padding: 10%;
}
.filter-results-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 3%;
}
.filter-results-head p {
  font-size: clamp(0.875rem, 0.83rem + 0.15vw, 1rem);
}
.filter-results-head p:first-child {
  padding: 0 0.5rem;
  font-size: 12px;
  display: block;
  font-weight: bold;
  color: #fff;
}
.filter-results-head p.category-school {
  background: #F8A212;
}
.filter-results-head p.category-sc-bpo {
  background-color:#FFEED3;
}
.filter-results-head p.category-fo-bpo {
  background-color:#F5F7FF;
}
.filter-results-head p.category-jichitai {
  background-color: #8FCDFA;
}
.filter-results-head p.category-found {
  background-color: #A383EB;
}
.filter-results-head p.category-all {
  border-color: #F4F4F4;
  color: #3D82E5;
  background-color: #F4F4F4;
}
.filter-results-foot {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
}
.filter-results-foot > p {
  font-weight: bold;
  font-size: 10px;
}
.filter-results-foot div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}
.filter-results h2 {
  font-size: clamp(1.125rem, 1.08rem + 0.15vw, 1.25rem);
  margin: 12px 0 1rem;
  text-align: left;
  word-break: normal;
}

.news-img {
  overflow: hidden;
  border-radius: 5px 5px 0 0;
}

.news-text {
  padding: 2rem 5%;
  background-color: #fff;
}
@media screen and (max-width: 767px) {
  .news-text {
    padding: 1rem 3%;
  }
}

.vkfs:where(:not(.vkfs__layout--min)) .vkfs__outer-wrap {
  margin: 0 !important;
}

.vkfs {
  display: flex;
  align-items: flex-end;
  gap: 1rem;
}
@media screen and (max-width: 767px) {
  .vkfs {
    gap: 0.5rem;
    margin-bottom: 1.5rem !important;
  }
}
.vkfs input[type=text] {
  border: 1px solid #3D82E5;
  height: -moz-fit-content;
  height: fit-content;
  padding: 1rem 2rem;
  border-radius: 35px;
}
@media screen and (max-width: 767px) {
  .vkfs input[type=text] {
    padding: 0.5rem 1rem;
    font-size: 12px;
  }
}
.vkfs .btn[type=submit] {
  display: inline-block;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0;
  letter-spacing: 2px;
  background-color: #3D82E5;
  color: #fff;
  height: -moz-fit-content;
  height: fit-content;
  padding: 1rem 2rem;
  border-radius: 35px;
  border: 1px solid #3D82E5;
  box-shadow: none;
}
@media screen and (max-width: 767px) {
  .vkfs .btn[type=submit] {
    padding: 0.5rem 1rem;
    font-size: 12px;
  }
}
.vkfs .btn[type=submit]:hover {
  background-color: #fff;
  color: #3D82E5;
}

.vkfs__labels {
  display: block;
  width: 50%;
}
@media screen and (max-width: 767px) {
  .vkfs__labels {
    width: 80%;
  }
}

.vkfs__label-name {
  font-weight: normal;
}

.ex-category-title {
  font-size: clamp(1.25rem, 0.614rem + 2.12vw, 3rem);
  margin-bottom: 5rem;
}
@media screen and (max-width: 767px) {
  .ex-category-title {
    margin-bottom: 1.5rem;
  }
}
.ex-category-title strong {
  display: inline-block;
}
.ex-category-title span {
  color: #3D82E5;
}

.term-ex-school .ex-category-title,
.term-use-school .ex-category-title,
.term-dl-school .ex-category-title,
.term-conference-school .ex-category-title,
.term-archive-school .ex-category-title,
.term-webinar-school .ex-category-title {
  color: #F7C674;
}
.term-ex-school .news-right-wrap,
.term-use-school .news-right-wrap,
.term-dl-school .news-right-wrap,
.term-conference-school .news-right-wrap,
.term-archive-school .news-right-wrap,
.term-webinar-school .news-right-wrap {
  border-color: #F7C674;
}
@media screen and (max-width: 767px) {
  .term-ex-school .news-right-wrap .member-list,
  .term-use-school .news-right-wrap .member-list,
  .term-dl-school .news-right-wrap .member-list,
  .term-conference-school .news-right-wrap .member-list,
  .term-archive-school .news-right-wrap .member-list,
  .term-webinar-school .news-right-wrap .member-list {
    border-color: #F7C674;
  }
}
@media screen and (max-width: 767px) {
  .term-ex-school .news-right-wrap a.news-category-btn,
  .term-use-school .news-right-wrap a.news-category-btn,
  .term-dl-school .news-right-wrap a.news-category-btn,
  .term-conference-school .news-right-wrap a.news-category-btn,
  .term-archive-school .news-right-wrap a.news-category-btn,
  .term-webinar-school .news-right-wrap a.news-category-btn {
    border-bottom: 3px solid #F7C674;
  }
}

.term-ex-foundation .ex-category-title,
.term-use-foundation .ex-category-title,
.term-dl-foundation .ex-category-title,
.term-conference-foundation .ex-category-title,
.term-archive-foundation .ex-category-title,
.term-webinar-foundation .ex-category-title {
  color: #A383EB;
}
.term-ex-foundation .news-right-wrap,
.term-use-foundation .news-right-wrap,
.term-dl-foundation .news-right-wrap,
.term-conference-foundation .news-right-wrap,
.term-archive-foundation .news-right-wrap,
.term-webinar-foundation .news-right-wrap {
  border-color: #A383EB;
}
@media screen and (max-width: 767px) {
  .term-ex-foundation .news-right-wrap .member-list,
  .term-use-foundation .news-right-wrap .member-list,
  .term-dl-foundation .news-right-wrap .member-list,
  .term-conference-foundation .news-right-wrap .member-list,
  .term-archive-foundation .news-right-wrap .member-list,
  .term-webinar-foundation .news-right-wrap .member-list {
    border-color: #A383EB;
  }
}
@media screen and (max-width: 767px) {
  .term-ex-foundation .news-right-wrap a.news-category-btn,
  .term-use-foundation .news-right-wrap a.news-category-btn,
  .term-dl-foundation .news-right-wrap a.news-category-btn,
  .term-conference-foundation .news-right-wrap a.news-category-btn,
  .term-archive-foundation .news-right-wrap a.news-category-btn,
  .term-webinar-foundation .news-right-wrap a.news-category-btn {
    border-bottom: 3px solid #A383EB;
  }
}

.term-ex-municipality .ex-category-title,
.term-use-municipality .ex-category-title,
.term-dl-municipality .ex-category-title,
.term-conference-municipality .ex-category-title,
.term-archive-municipality .ex-category-title,
.term-webinar-municipality .ex-category-title {
  color: #8FCDFA;
}
.term-ex-municipality .news-right-wrap,
.term-use-municipality .news-right-wrap,
.term-dl-municipality .news-right-wrap,
.term-conference-municipality .news-right-wrap,
.term-archive-municipality .news-right-wrap,
.term-webinar-municipality .news-right-wrap {
  border-color: #8FCDFA;
}
@media screen and (max-width: 767px) {
  .term-ex-municipality .news-right-wrap .member-list,
  .term-use-municipality .news-right-wrap .member-list,
  .term-dl-municipality .news-right-wrap .member-list,
  .term-conference-municipality .news-right-wrap .member-list,
  .term-archive-municipality .news-right-wrap .member-list,
  .term-webinar-municipality .news-right-wrap .member-list {
    border-color: #8FCDFA;
  }
}
@media screen and (max-width: 767px) {
  .term-ex-municipality .news-right-wrap a.news-category-btn,
  .term-use-municipality .news-right-wrap a.news-category-btn,
  .term-dl-municipality .news-right-wrap a.news-category-btn,
  .term-conference-municipality .news-right-wrap a.news-category-btn,
  .term-archive-municipality .news-right-wrap a.news-category-btn,
  .term-webinar-municipality .news-right-wrap a.news-category-btn {
    border-bottom: 3px solid #8FCDFA;
  }
}

.term-ex-school-bpo .ex-category-title,
.term-use-school-bpo .ex-category-title {
  color: #F8A212;
  font-size: clamp(1.125rem, 0.625rem + 1.67vw, 2.5rem);
}
.term-ex-school-bpo .news-right-wrap,
.term-use-school-bpo .news-right-wrap {
  border-color: #FFEED3;
}
@media screen and (max-width: 767px) {
  .term-ex-school-bpo .news-right-wrap .member-list,
  .term-use-school-bpo .news-right-wrap .member-list {
    border-color: #FFEED3;
  }
}
@media screen and (max-width: 767px) {
  .term-ex-school-bpo .news-right-wrap a.news-category-btn,
  .term-use-school-bpo .news-right-wrap a.news-category-btn {
    border-bottom: 3px solid #FFEED3;
  }
}

.term-ex-foundation-bpo .ex-category-title,
.term-use-foundation-bpo .ex-category-title {
  color: #7E5DC7;
  font-size: clamp(1.125rem, 0.625rem + 1.67vw, 2.5rem);
}
.term-ex-foundation-bpo .news-right-wrap,
.term-use-foundation-bpo .news-right-wrap {
  border-color: #F5F7FF;
}
@media screen and (max-width: 767px) {
  .term-ex-foundation-bpo .news-right-wrap .member-list,
  .term-use-foundation-bpo .news-right-wrap .member-list {
    border-color: #F5F7FF;
  }
}
@media screen and (max-width: 767px) {
  .term-ex-foundation-bpo .news-right-wrap a.news-category-btn,
  .term-use-foundation-bpo .news-right-wrap a.news-category-btn {
    border-bottom: 3px solid #F5F7FF;
  }
}

.term-ex-common .ex-category-title,
.term-use-common .ex-category-title,
.term-dl-common .ex-category-title {
  color: #3D82E5;
}
.term-ex-common .news-right-wrap,
.term-use-common .news-right-wrap,
.term-dl-common .news-right-wrap {
  border-color: #F4F4F4;
}
@media screen and (max-width: 767px) {
  .term-ex-common .news-right-wrap .member-list,
  .term-use-common .news-right-wrap .member-list,
  .term-dl-common .news-right-wrap .member-list {
    border-color: #F4F4F4;
  }
}
@media screen and (max-width: 767px) {
  .term-ex-common .news-right-wrap a.news-category-btn,
  .term-use-common .news-right-wrap a.news-category-btn,
  .term-dl-common .news-right-wrap a.news-category-btn {
    border-bottom: 3px solid #F4F4F4;
  }
}

/*contact-thanks*/
.post-type-archive-use .filter-results,
.tax-use-category .filter-results,
.tax-use-tag .filter-results,
.single-use .filter-results {
  width: 100%;
}
.post-type-archive-use .news-recommend h2,
.tax-use-category .news-recommend h2,
.tax-use-tag .news-recommend h2,
.single-use .news-recommend h2 {
  color: #fff;
}
.post-type-archive-use .news-recommend .news-text,
.post-type-archive-use .news-recommend .news-img,
.post-type-archive-use .news-recommend .filter-results-item,
.tax-use-category .news-recommend .news-text,
.tax-use-category .news-recommend .news-img,
.tax-use-category .news-recommend .filter-results-item,
.tax-use-tag .news-recommend .news-text,
.tax-use-tag .news-recommend .news-img,
.tax-use-tag .news-recommend .filter-results-item,
.single-use .news-recommend .news-text,
.single-use .news-recommend .news-img,
.single-use .news-recommend .filter-results-item {
  background-color: transparent;
  box-shadow: none;
  border-radius: 10px;
}
.post-type-archive-use .news-recommend .news-text .thumbnail,
.post-type-archive-use .news-recommend .news-img .thumbnail,
.post-type-archive-use .news-recommend .filter-results-item .thumbnail,
.tax-use-category .news-recommend .news-text .thumbnail,
.tax-use-category .news-recommend .news-img .thumbnail,
.tax-use-category .news-recommend .filter-results-item .thumbnail,
.tax-use-tag .news-recommend .news-text .thumbnail,
.tax-use-tag .news-recommend .news-img .thumbnail,
.tax-use-tag .news-recommend .filter-results-item .thumbnail,
.single-use .news-recommend .news-text .thumbnail,
.single-use .news-recommend .news-img .thumbnail,
.single-use .news-recommend .filter-results-item .thumbnail {
  background-color: #fff;
}
.post-type-archive-use .news-recommend .filter-results-foot,
.tax-use-category .news-recommend .filter-results-foot,
.tax-use-tag .news-recommend .filter-results-foot,
.single-use .news-recommend .filter-results-foot {
  margin-top: 2.5rem;
}
@media screen and (max-width: 767px) {
  .post-type-archive-use .news-recommend .filter-results-foot,
  .tax-use-category .news-recommend .filter-results-foot,
  .tax-use-tag .news-recommend .filter-results-foot,
  .single-use .news-recommend .filter-results-foot {
    margin-top: 1.5rem;
  }
}
.post-type-archive-use .news-recommend .filter-results-foot p,
.tax-use-category .news-recommend .filter-results-foot p,
.tax-use-tag .news-recommend .filter-results-foot p,
.single-use .news-recommend .filter-results-foot p {
  background-color: #fff;
  border-radius: 999vh;
  border: 1px solid #3D82E5;
  color: #3D82E5;
  font-weight: bold;
  padding: 4px 1rem;
}
.post-type-archive-use .filter-results-head p.category-school,
.post-type-archive-use .filter-results-head p.category-found,
.post-type-archive-use .filter-results-head p.category-jichitai,
.tax-use-category .filter-results-head p.category-school,
.tax-use-category .filter-results-head p.category-found,
.tax-use-category .filter-results-head p.category-jichitai,
.tax-use-tag .filter-results-head p.category-school,
.tax-use-tag .filter-results-head p.category-found,
.tax-use-tag .filter-results-head p.category-jichitai,
.single-use .filter-results-head p.category-school,
.single-use .filter-results-head p.category-found,
.single-use .filter-results-head p.category-jichitai {
  background-color: #fff;
}
.post-type-archive-use .news-recommend::before,
.tax-use-category .news-recommend::before,
.tax-use-tag .news-recommend::before,
.single-use .news-recommend::before {
  background: url(./images/use.png) no-repeat center/contain;
  max-width: 300px;
  top: -70px;
  width: 18%;
}
@media screen and (max-width: 1400px) {
  .post-type-archive-use .news-recommend::before,
  .tax-use-category .news-recommend::before,
  .tax-use-tag .news-recommend::before,
  .single-use .news-recommend::before {
    top: -17%;
  }
}
@media screen and (max-width: 1024px) {
  .post-type-archive-use .news-recommend::before,
  .tax-use-category .news-recommend::before,
  .tax-use-tag .news-recommend::before,
  .single-use .news-recommend::before {
    top: -8%;
    width: 23%;
  }
}
@media screen and (max-width: 767px) {
  .post-type-archive-use .news-recommend::before,
  .tax-use-category .news-recommend::before,
  .tax-use-tag .news-recommend::before,
  .single-use .news-recommend::before {
    top: -8%;
    width: 200px;
    left: 2%;
  }
}
.post-type-archive-use .news-contents .news-text,
.tax-use-category .news-contents .news-text,
.tax-use-tag .news-contents .news-text,
.single-use .news-contents .news-text {
  padding-top: 0;
}
.post-type-archive-use .news-contents .filter-results-head,
.tax-use-category .news-contents .filter-results-head,
.tax-use-tag .news-contents .filter-results-head,
.single-use .news-contents .filter-results-head {
  margin-top: -1rem;
  position: relative;
  z-index: 10;
}
.post-type-archive-use .news-contents .filter-results-head p:first-child,
.tax-use-category .news-contents .filter-results-head p:first-child,
.tax-use-tag .news-contents .filter-results-head p:first-child,
.single-use .news-contents .filter-results-head p:first-child {
  border-radius: 30px;
  padding: 0.25rem 1rem;
}
.post-type-archive-use .news-contents .filter-results-item,
.tax-use-category .news-contents .filter-results-item,
.tax-use-tag .news-contents .filter-results-item,
.single-use .news-contents .filter-results-item {
  padding-bottom: 0;
  overflow: hidden;
}
.post-type-archive-use .news-contents .news-text:has(.category-sc-bpo) .filter-results-foot p,
.tax-use-category .news-contents .news-text:has(.category-sc-bpo) .filter-results-foot p,
.tax-use-tag .news-contents .news-text:has(.category-sc-bpo) .filter-results-foot p,
.single-use .news-contents .news-text:has(.category-sc-bpo) .filter-results-foot p {
  color: #F8A212;
}
.post-type-archive-use .news-contents .news-text:has(.category-school) .filter-results-foot p,
.tax-use-category .news-contents .news-text:has(.category-school) .filter-results-foot p,
.tax-use-tag .news-contents .news-text:has(.category-school) .filter-results-foot p,
.single-use .news-contents .news-text:has(.category-school) .filter-results-foot p {
  color: #F8A212;
}
.post-type-archive-use .news-contents .news-text:has(.category-found) .filter-results-foot p,
.tax-use-category .news-contents .news-text:has(.category-found) .filter-results-foot p,
.tax-use-tag .news-contents .news-text:has(.category-found) .filter-results-foot p,
.single-use .news-contents .news-text:has(.category-found) .filter-results-foot p {
  color: #A383EB;
}
.post-type-archive-use .news-contents .news-text:has(.category-all) .filter-results-foot p,
.tax-use-category .news-contents .news-text:has(.category-all) .filter-results-foot p,
.tax-use-tag .news-contents .news-text:has(.category-all) .filter-results-foot p,
.single-use .news-contents .news-text:has(.category-all) .filter-results-foot p {
  color: #3D82E5;
}
.post-type-archive-use .news-contents .news-text:has(.category-jichitai) .filter-results-foot p,
.tax-use-category .news-contents .news-text:has(.category-jichitai) .filter-results-foot p,
.tax-use-tag .news-contents .news-text:has(.category-jichitai) .filter-results-foot p,
.single-use .news-contents .news-text:has(.category-jichitai) .filter-results-foot p {
  color: #8FCDFA;
}
.post-type-archive-use .news-contents .news-text:has(.category-fo-bpo) .filter-results-foot p,
.tax-use-category .news-contents .news-text:has(.category-fo-bpo) .filter-results-foot p,
.tax-use-tag .news-contents .news-text:has(.category-fo-bpo) .filter-results-foot p,
.single-use .news-contents .news-text:has(.category-fo-bpo) .filter-results-foot p {
  color: #7E5DC7;
}
.post-type-archive-use .news-contents .filter-results,
.tax-use-category .news-contents .filter-results,
.tax-use-tag .news-contents .filter-results,
.single-use .news-contents .filter-results {
  max-width: none;
}

.post-type-archive-example .bg-gray .filter-results {
  max-width: none;
}
.post-type-archive-example .bg-gray .filter-results-item {
  padding-bottom: 1rem;
}
.post-type-archive-example .bg-gray .news-text {
  padding: 1rem 5%;
}

.single-use .single-news .single-right {
  position: relative;
  top: auto;
}
.single-use .single-news .single-right .news-tag-list {
  font-size: 14px;
}
.single-use .single-news .single-right .news-tag-list a {
  padding: 3px 1rem;
}
.single-use .filter-results {
  display: block;
  margin: 0;
}
.single-use .filter-results h2 {
  margin: 0.5rem 0;
}
.single-use .filter-results-item {
  box-shadow: none;
  border-radius: 0;
  padding-bottom: 0rem;
  border-bottom: 1px solid #E8E8E8;
}
.single-use .news-text {
  padding: 1rem 0 1.5rem;
}
.single-use .single-news .content, .single-use .single-news .article_meta {
  width: 100%;
}
.single-use .single-news .single-contents {
  max-width: 1345px;
  justify-content: space-between;
}
@media screen and (max-width: 1400px) {
  .single-use .single-news .single-contents {
    width: 80%;
  }
}
@media screen and (max-width: 1279px) {
  .single-use .single-news .single-contents {
    flex-direction: column;
    gap: 5rem;
  }
}
@media screen and (max-width: 767px) {
  .single-use .single-news .single-contents {
    width: 90%;
  }
}
.single-use .vkfs__labels {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .single-use .vkfs__labels {
    width: 80%;
  }
}
.single-use .single-news .single-right {
  width: 350px;
}
@media screen and (max-width: 1279px) {
  .single-use .single-news .single-right {
    width: 100%;
  }
}
.single-use .single-news .single-left {
  width: calc(100% - 420px);
}
@media screen and (max-width: 1279px) {
  .single-use .single-news .single-left {
    width: 100%;
  }
}
.single-use .latest-news {
  margin-top: 2.5rem;
}
.single-use .news .top-news-list.single-wrap a:not(.arrow-btn) {
  margin: 0;
}
@media screen and (max-width: 1400px) {
  .single-use .vkfs input[type=text] {
    padding: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .single-use .vkfs input[type=text] {
    padding: 0.5rem 1rem;
  }
}

.bpo-fv {
  background: linear-gradient(to left, #D3ECFD, #6DC3FD);
  padding: 9rem 0 3rem;
  overflow: hidden;
}
@media screen and (max-width: 1024px) {
  .bpo-fv {
    padding-top: 6rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-fv {
    padding: 5rem 0 0;
  }
}
@media screen and (max-width: 1279px) {
  .bpo-fv .bpo-cta-btn {
    gap: 1.5rem;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-fv .bpo-cta-btn {
    gap: 1rem;
    flex-direction: column;
  }
}
@media screen and (max-width: 1279px) {
  .bpo-fv .bpo-cta-btn a {
    padding: 1rem 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-fv .bpo-cta-btn a {
    padding: 0.5rem 2rem;
    width: 220px;
  }
}
.bpo-fv::before {
  content: "";
  position: absolute;
  width: 70%;
  height: 100%;
  background: url(./images/bpo-fv-bg.png) no-repeat right/cover;
  border-radius: 0;
  z-index: -2;
}
@media screen and (max-width: 767px) {
  .bpo-fv::before {
    background: url(./images/bpo-fv-bg-sp.png) no-repeat right/cover;
    width: 100%;
  }
}
.bpo-fv::after {
  content: "";
  position: absolute;
  width: 45%;
  aspect-ratio: 1/1;
  background-color: #fff;
  border-radius: 999vh;
  z-index: -1;
  top: 50%;
  right: 10%;
}
@media screen and (max-width: 1400px) {
  .bpo-fv::after {
    right: 5%;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-fv::after {
    right: 1%;
    top: 60%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-fv::after {
    right: auto;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    top: 65%;
    width: 85%;
  }
}
.bpo-fv .lower-fv-box {
  max-width: 1460px;
  margin-left: 15%;
  position: relative;
  width: 80%;
}
@media screen and (max-width: 1279px) {
  .bpo-fv .lower-fv-box {
    margin: 0 auto;
  }
}
.bpo-fv-wrap {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .bpo-fv-wrap {
    flex-direction: column;
    gap: 2rem;
  }
}
.bpo-fv .lower-fv-circle {
  position: absolute;
  background-color: #F8A212;
  left: -12%;
  top: -25%;
  width: 17%;
  border: 4px solid #fff;
  min-width: 70px;
  aspect-ratio: 1/1;
  border-radius: 999vh;
}
@media screen and (max-width: 1024px) {
  .bpo-fv .lower-fv-circle {
    top: -20%;
  }
}
.bpo-fv .lower-fv-circle p {
  color: #fff;
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem);
  font-weight: bold;
  width: -moz-fit-content;
  width: fit-content;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.bpo-fv-top {
  position: relative;
  left: -10%;
  opacity: 0;
}
@media screen and (max-width: 1279px) {
  .bpo-fv-top {
    left: -3%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-fv-top {
    left: 2%;
  }
}
.bpo-fv-top.fadeUp {
  animation: fadeAnime 1s ease-out 0.5s forwards;
}
@media screen and (max-width: 767px) {
  .bpo-fv-top.fadeUp {
    animation: fadeAnime 1s ease-out 0.3s forwards;
  }
}
.bpo-fv-top > p {
  color: #F8A212;
  font-weight: bold;
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  text-align: center;
  padding: 1rem 2.5rem 3rem;
  background: url(./images/bpo-fv-talk.png) no-repeat right/contain;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 767px) {
  .bpo-fv-top > p {
    padding: 1rem 3rem 2.5rem;
  }
}
.bpo-fv-left {
  width: 55%;
  max-width: 630px;
}
@media screen and (max-width: 767px) {
  .bpo-fv-left {
    width: 100%;
    max-width: 335px;
  }
}
.bpo-fv-left img {
  width: 65%;
  margin: 3% 0;
}
.bpo-fv-left img + p {
  color: #fff;
  font-size: clamp(0.75rem, 0.477rem + 0.91vw, 1.5rem);
  font-weight: bold;
  margin-bottom: 4%;
  line-height: 2;
}
.bpo-fv-right {
  width: 50%;
  position: absolute;
  right: 0;
  bottom: 0;
}
@media screen and (max-width: 1024px) {
  .bpo-fv-right {
    bottom: 5%;
    right: -10%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-fv-right {
    position: relative;
    bottom: auto;
    right: auto;
    width: 100%;
    max-width: 400px;
  }
}
.bpo-fv h1 {
  color: #fff;
  font-size: clamp(1.5rem, 1.227rem + 0.91vw, 2.25rem);
}
.bpo-fv-banner {
  position: absolute;
  bottom: -2rem;
  right: -5%;
  aspect-ratio: 1/1;
  background-color: #fff;
  border: 4px solid #F8A213;
  border-radius: 999vh;
  width: 18%;
  max-width: 230px;
}
@media screen and (max-width: 1024px) {
  .bpo-fv-banner {
    width: 22%;
    max-width: 230px;
    bottom: -3rem;
    right: -10%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-fv-banner {
    width: 35%;
    max-width: 150px;
    bottom: 0rem;
    right: -10%;
  }
}
@media screen and (max-width: 490px) {
  .bpo-fv-banner {
    width: 115px;
    bottom: 10rem;
    right: -10%;
    border: 2px solid #F8A213;
  }
}
.bpo-fv-banner div {
  position: absolute;
  top: 56%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 90%;
}
.bpo-fv-banner p {
  color: #F8A212;
  font-weight: bold;
  text-align: center;
  font-size: clamp(0.625rem, 0.398rem + 0.76vw, 1.25rem);
  line-height: 1;
}
.bpo-fv-banner p span {
  font-size: clamp(0.5rem, 0.409rem + 0.3vw, 0.75rem);
}
.bpo-fv-banner img {
  width: 80%;
  margin: 0 auto;
}

.bpo-service {
  margin: 10rem auto;
  width: 80%;
  max-width: 1345px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 1279px) {
  .bpo-service {
    flex-direction: column-reverse;
    gap: 5rem;
    margin: 5rem auto;
    max-width: 700px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-service {
    width: 90%;
    gap: 2.5rem 0;
    margin-bottom: 1.5rem;
  }
}
.bpo-service-left {
  width: 48%;
}
@media screen and (max-width: 1279px) {
  .bpo-service-left {
    width: 75%;
    max-width: 500px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-service-left {
    width: 100%;
  }
}
.bpo-service-left .bpo-service-logo {
  width: 50%;
  margin: 0 auto 2rem;
}
@media screen and (max-width: 767px) {
  .bpo-service-left .bpo-service-logo {
    margin-bottom: 0;
  }
}
.bpo-service-box {
  position: relative;
  padding: 155px 30px 2.5rem;
}
@media screen and (max-width: 767px) {
  .bpo-service-box {
    padding-top: 100px;
  }
}
.bpo-service-box::before {
  content: "";
  position: absolute;
  width: 90%;
  aspect-ratio: 1/1;
  background-color: #FFFAD3;
  border-radius: 999vh;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.bpo-service-box img {
  width: 70%;
  margin: 0 12% 0 18%;
  position: relative;
  z-index: 10;
}
.bpo-service-box > p {
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
  color: #F8A212;
  font-weight: bold;
  text-align: center;
  margin-top: 20px;
}
.bpo-service-talk {
  position: absolute;
  font-size: clamp(1.125rem, 0.807rem + 1.06vw, 2rem);
  font-weight: bold;
  text-align: center;
  aspect-ratio: 1/1;
  padding: 3.3rem 1.8rem;
  border-radius: 999vh;
  border: 6px solid #3D82E5;
  background-color: #F5F7FF;
  color: #3D82E5;
  top: 0;
  opacity: 0;
}
@media screen and (max-width: 767px) {
  .bpo-service-talk {
    border: 3px solid #3D82E5;
    padding: 1.9rem 1rem;
    top: 5%;
  }
}
@media screen and (max-width: 490px) {
  .bpo-service-talk {
    left: -2%;
  }
}
.bpo-service-talk.fadeUp {
  animation: fadeAnime 1s ease-out 0.5s forwards;
}
@media screen and (max-width: 767px) {
  .bpo-service-talk.fadeUp {
    animation: fadeAnime 1s ease-out 0.3s forwards;
  }
}
.bpo-service-talk.orange {
  right: 5%;
  border-color: #F8A213;
  color: #F8A212;
  background-color: #FDF1DD;
}
@media screen and (max-width: 490px) {
  .bpo-service-talk.orange {
    left: auto;
    right: -2%;
  }
}
.bpo-service-talk.orange.fadeUp {
  animation: fadeAnime 1s ease-out 1.5s forwards;
}
@media screen and (max-width: 767px) {
  .bpo-service-talk.orange.fadeUp {
    animation: fadeAnime 1s ease-out 1s forwards;
  }
}
.bpo-service-right {
  width: 45%;
}
@media screen and (max-width: 1279px) {
  .bpo-service-right {
    width: 100%;
  }
}
.bpo-service-right .balloon2 {
  border-color: #F8A213;
  padding: 16px 2rem;
}
@media screen and (max-width: 767px) {
  .bpo-service-right .balloon2 {
    padding: 1rem 0.5rem;
    margin: 0 auto;
    display: block;
    width: -moz-fit-content;
    width: fit-content;
  }
}
.bpo-service-right .balloon2::after {
  border-top: 14px solid #F8A213;
}
.bpo-service-right .balloon2 p {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  color: #F8A213;
  font-weight: bold;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .bpo-service-right .balloon2 p {
    font-size: 14px;
  }
}
.bpo-service-right img {
  width: 70%;
  margin: 3% 0 5%;
}
@media screen and (max-width: 1279px) {
  .bpo-service-right img {
    max-width: 500px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-service-right img {
    margin: 5% auto 5%;
    max-width: 400px;
    width: 80%;
  }
}
.bpo-service-right h2 {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  margin-bottom: 5%;
}
.bpo-service-right > p {
  line-height: 2.25;
}
.bpo-service-right > p:not(:last-child) {
  margin-bottom: 1rem;
}

.onayami {
  background-color: #F7F7F7;
  padding: 68px 0 128px;
}
@media screen and (max-width: 767px) {
  .onayami {
    padding: 5rem 0 5rem;
  }
}
.onayami .title h2 {
  color: #F8A212;
}
.onayami .title p {
  font-weight: bold;
}
.onayami-wrap {
  max-width: 1345px;
  width: 85%;
}
@media screen and (max-width: 1279px) {
  .onayami-wrap {
    flex-wrap: wrap;
    justify-content: space-around;
    gap: 2.5rem 0;
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .onayami-wrap {
    align-items: center;
  }
}
.onayami .onayami-item {
  width: 31%;
}
@media screen and (max-width: 1279px) {
  .onayami .onayami-item {
    width: 49%;
    max-width: 400px;
  }
}
@media screen and (max-width: 767px) {
  .onayami .onayami-item {
    width: 100%;
  }
}
.onayami .onayami-item:nth-child(3) .talk p {
  font-size: clamp(0.875rem, 0.601rem + 0.58vw, 1.25rem);
  padding: 1.5rem 1rem;
}
@media screen and (max-width: 1279px) {
  .onayami .onayami-item:nth-child(3) .talk p {
    font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  }
}
.onayami .onayami-item img {
  aspect-ratio: 4/3;
}
.onayami .onayami-item img + p {
  width: 100%;
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  .onayami .onayami-item img + p {
    font-size: 12px;
  }
}
.onayami .onayami-item > p {
  color: #2E2E2E;
}
.onayami .onayami-item .talk p {
  background-color: #F8A212;
  color: #fff;
}
@media screen and (max-width: 1279px) {
  .onayami .onayami-item .talk p {
    width: 90%;
    margin: 0 auto 3rem;
  }
}
.onayami .onayami-item .talk p::before {
  background: url(./images/talk-onayami.png) no-repeat center/contain;
}
.onayami .onayami-item:nth-child(3) .talk {
  animation: floating-y2 1.8s ease-in-out infinite alternate-reverse;
}

.reason {
  background: linear-gradient(to bottom, #DFF1FD, rgba(235, 246, 253, 0));
  padding: 5rem 0;
}
@media screen and (max-width: 767px) {
  .reason {
    padding: 2.5rem 0 0;
  }
}
.reason-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem;
  justify-content: center;
  margin: 1rem 0;
}
@media screen and (max-width: 767px) {
  .reason-title {
    gap: 1rem;
  }
}
.reason-title img {
  display: inline;
  height: 60px;
  width: auto;
}
@media screen and (max-width: 1024px) {
  .reason-title img {
    height: 40px;
  }
}
.reason h2 {
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
  text-align: center;
}
.reason h2 span {
  color: #F8A212;
  margin: 0 0.5rem;
}
.reason-wrap {
  display: flex;
  align-items: stretch;
  justify-content: end;
  gap: 7%;
}
@media screen and (max-width: 1024px) {
  .reason-wrap {
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  .reason-wrap {
    flex-direction: column-reverse;
    gap: 2rem;
  }
}
.reason-wrap:not(:last-child) {
  margin-bottom: 6rem;
}
@media screen and (max-width: 767px) {
  .reason-wrap:not(:last-child) {
    margin-bottom: 4rem;
  }
}
.reason-wrap.reverse {
  justify-content: left;
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .reason-wrap.reverse {
    flex-direction: column-reverse;
  }
}
.reason-wrap.reverse .reason-left {
  width: 30%;
}
@media screen and (max-width: 1024px) {
  .reason-wrap.reverse .reason-left {
    width: 35%;
  }
}
@media screen and (max-width: 767px) {
  .reason-wrap.reverse .reason-left {
    width: 80%;
    max-width: 300px;
  }
}
.reason-wrap.reverse .reason-right {
  border-radius: 0 30px 30px 0;
}
@media screen and (max-width: 767px) {
  .reason-wrap.reverse .reason-right {
    margin: 0 auto 0 0;
  }
}
.reason-wrap.reverse .reason-right > div {
  margin-left: auto;
}
.reason-left {
  width: 35%;
  opacity: 0;
}
@media screen and (max-width: 1024px) {
  .reason-left {
    width: 40%;
  }
}
@media screen and (max-width: 767px) {
  .reason-left {
    width: 90%;
    max-width: 400px;
  }
}
.reason-left .reason-logo {
  width: 55%;
  margin: 1rem auto 0;
}
.reason-left .balloon2 {
  border-color: #F8A212;
  padding: 1rem 2rem;
  margin: 0 auto 1rem;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 767px) {
  .reason-left .balloon2 {
    padding: 1rem;
  }
}
.reason-left .balloon2::after {
  border-top: 14px solid #F8A212;
}
.reason-left .balloon2 p {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
  color: #F8A212;
}
.reason-left.fadeUp {
  animation: fadeAnime 1s ease-out 0.5s forwards;
}
@media screen and (max-width: 767px) {
  .reason-left.fadeUp {
    animation: fadeAnime 1s ease-out 0.3s forwards;
  }
}
.reason-right {
  width: 50%;
  background-color: #fff;
  border-radius: 30px 0 0 30px;
  padding: 2rem 5%;
}
@media screen and (max-width: 1024px) {
  .reason-right {
    padding: 2rem 3%;
  }
}
@media screen and (max-width: 767px) {
  .reason-right {
    width: 95%;
    margin-left: auto;
    max-width: 600px;
  }
}
.reason-right > div {
  max-width: 530px;
  width: 100%;
}
.reason-right h3 {
  display: flex;
  align-items: center;
  gap: 0.5rem 1rem;
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
  color: #F8A212;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}
.reason-right h3 span {
  display: none;
}
@media screen and (max-width: 1279px) {
  .reason-right h3 span {
    display: block;
    width: 100%;
  }
}
.reason-right img {
  width: 200px;
}
.reason-right .label {
  color: #F8A212;
  font-size: clamp(3.5rem, 2.045rem + 4.85vw, 7.5rem);
  font-weight: bold;
  line-height: 1;
  margin-bottom: 1rem;
}
.reason-right p:not(:last-child) {
  margin-bottom: 1rem;
}
.reason .title {
  margin: 4rem auto 100px;
  width: 80%;
  max-width: 913px;
  background-color: #F8A212;
  color: #fff;
  font-size: clamp(1rem, 0.636rem + 1.21vw, 2rem);
  font-weight: bold;
  padding: 1rem 0.5rem;
  border-radius: 30px;
}
@media screen and (max-width: 767px) {
  .reason .title {
    margin: 3.5rem auto 1.5rem;
    padding: 0.5rem;
    width: 90%;
  }
}

.bpo-tab {
  margin: 20rem auto 130px;
  max-width: 1345px;
  width: 80%;
  border: 5px solid #F8A212;
  border-radius: 30px;
  padding: 7.5rem 5% 5rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .bpo-tab {
    margin: 5rem auto;
    width: 85%;
    padding: 5rem 3% 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab {
    width: 90%;
    border: 3px solid #F8A212;
  }
}
.bpo-tab h2 {
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  color: #F8A212;
  background-color: #fff;
  width: -moz-fit-content;
  width: fit-content;
  padding: 0 4rem;
  position: absolute;
  top: -50px;
  left: 5%;
}
@media screen and (max-width: 1279px) {
  .bpo-tab h2 {
    top: -40px;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-tab h2 {
    top: -30px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab h2 {
    padding: 0 2rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: -moz-max-content;
    width: max-content;
    top: -22px;
  }
}
.bpo-tab h3 {
  color: #F8A212;
  font-size: clamp(1.5rem, 1.227rem + 0.91vw, 2.25rem);
  margin: 3.5rem 0 2.5rem;
  text-align: center;
}
@media screen and (max-width: 1024px) {
  .bpo-tab h3 {
    margin-top: -2rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab h3 {
    margin-bottom: 1rem;
  }
}
.bpo-tab h3 + p {
  font-weight: bold;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.bpo-tab-item {
  border: 4px solid #F8A212;
  border-radius: 30px;
  padding: 1.5rem 5%;
  position: relative;
  z-index: 0;
}
@media screen and (max-width: 767px) {
  .bpo-tab-item {
    border: 3px solid #F8A212;
    padding-bottom: 3rem;
  }
}
.bpo-tab-item.right-0 img {
  right: 0;
}
.bpo-tab-item.img-big img {
  width: 30%;
  height: 70%;
}
@media screen and (max-width: 1279px) {
  .bpo-tab-item.img-big img {
    width: 20%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab-item.img-big img {
    width: 30% !important;
  }
}
.bpo-tab-item.small-tab img {
  width: 23%;
  right: 2%;
  bottom: 10%;
  height: 70%;
}
@media screen and (max-width: 1279px) {
  .bpo-tab-item.small-tab img {
    height: 50%;
  }
}
.bpo-tab-item.small-tab:not(:last-child) {
  margin-bottom: 2.5rem;
}
.bpo-tab-item.small-tab:not(:last-child)::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 40px solid transparent;
  border-left: 40px solid transparent;
  border-top: 36px solid #F8A213;
  border-bottom: 0;
  bottom: -36px;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
}
@media screen and (max-width: 767px) {
  .bpo-tab-item.small-tab:not(:last-child)::before {
    border-right: 25px solid transparent;
    border-left: 25px solid transparent;
    border-top: 20px solid #F8A213;
    bottom: -20px;
  }
}
.bpo-tab-item img {
  position: absolute;
  width: 23%;
  right: 2%;
  bottom: 15%;
  height: 57%;
  -o-object-position: center;
     object-position: center;
  z-index: -1;
}
@media screen and (max-width: 1279px) {
  .bpo-tab-item img {
    height: 30%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab-item img {
    width: 18% !important;
    right: 5% !important;
    bottom: 5% !important;
    height: auto !important;
  }
}
.bpo-tab-item h4 {
  color: #F8A212;
  font-size: clamp(1.25rem, 0.886rem + 1.21vw, 2.25rem);
  display: flex;
  gap: 1.5rem;
  align-items: center;
  margin-bottom: 1.5rem;
}
@media screen and (max-width: 767px) {
  .bpo-tab-item h4 {
    flex-direction: column;
    word-break: break-all;
    gap: 1rem;
  }
}
.bpo-tab-item h4 span {
  font-size: clamp(3.5rem, 2.5rem + 3.33vw, 6.25rem);
  line-height: 1;
}
.bpo-tab-item p {
  width: 70%;
}
@media screen and (max-width: 1024px) {
  .bpo-tab-item p {
    width: 80%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab-item p {
    width: 100%;
  }
}
.bpo-tab-item p:not(:last-child) {
  margin-bottom: 1rem;
}
.bpo-tab-item p span {
  color: #F8A212;
  font-weight: bold;
}
.bpo-tab-item:first-of-type {
  margin-top: 3.5rem;
}
@media screen and (max-width: 767px) {
  .bpo-tab-item:first-of-type {
    margin-top: 2.5rem;
  }
}
.bpo-tab-item:not(:last-child) {
  margin-bottom: 20px;
}
.bpo-tab .bpo-tab-class {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
  text-align: center;
  margin-top: 3rem;
}
@media screen and (max-width: 767px) {
  .bpo-tab .bpo-tab-class {
    margin-top: 1rem;
  }
}
.bpo-tab .bpo-tab-class span {
  color: #F8A212;
}
.bpo-tab .tab-2 {
  display: flex;
  flex-wrap: wrap;
  gap: 0 10px;
}
@media screen and (max-width: 1024px) {
  .bpo-tab .tab-2 {
    flex-direction: column;
    gap: 5rem;
    align-items: center;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab .tab-2 {
    gap: 3rem;
  }
}
.bpo-tab .tab-2 > label {
  flex: 1 1;
  order: -1;
  min-width: 70px;
  border-radius: 50px;
  padding: 20px;
  font-weight: bold;
  background-color: #F4F4F4;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  text-align: center;
  cursor: pointer;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .bpo-tab .tab-2 > label {
    width: 400px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab .tab-2 > label {
    width: 100%;
    max-width: 280px;
    padding: 1rem;
  }
}
.bpo-tab .tab-2 > label p {
  position: absolute;
  top: -50px;
  color: #F8A212;
  font-weight: bold;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
}
@media screen and (max-width: 1024px) {
  .bpo-tab .tab-2 > label p {
    top: -40px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-tab .tab-2 > label p {
    top: -28px;
  }
}
.bpo-tab .tab-2 > label p::before, .bpo-tab .tab-2 > label p::after {
  content: "";
  position: absolute;
  top: 45%;
  display: inline-block;
  width: 30px;
  height: 2px;
  background-color: #F8A212;
}
@media screen and (max-width: 1279px) {
  .bpo-tab .tab-2 > label p::before, .bpo-tab .tab-2 > label p::after {
    width: 20px;
  }
}
.bpo-tab .tab-2 > label p::before {
  left: -30px;
  transform: rotate(45deg);
}
@media screen and (max-width: 1279px) {
  .bpo-tab .tab-2 > label p::before {
    left: -24px;
  }
}
.bpo-tab .tab-2 > label p::after {
  right: -30px;
  transform: rotate(-45deg);
}
@media screen and (max-width: 1279px) {
  .bpo-tab .tab-2 > label p::after {
    right: -24px;
  }
}
.bpo-tab .tab-2 > label:hover {
  opacity: 0.8;
}
.bpo-tab .tab-2 > label:hover p {
  opacity: 1;
}
.bpo-tab .tab-2 input {
  display: none;
}
.bpo-tab .tab-2 > div {
  display: none;
  width: 100%;
  background-color: #fff;
}
.bpo-tab .tab-2 label:has(:checked) {
  opacity: 1;
  background-color: #F8A212;
  color: #fff;
}
.bpo-tab .tab-2 label:has(:checked) + div {
  display: block;
}

.offer {
  padding: 5rem 0;
  background-color: #FFEED3;
}
.offer-title {
  text-align: center;
  width: -moz-fit-content;
  width: fit-content;
  position: relative;
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  .offer-title {
    margin: 3rem auto 0;
  }
}
.offer-title::before, .offer-title::after {
  content: "";
  position: absolute;
  width: 33%;
  aspect-ratio: 1/1;
}
@media screen and (max-width: 767px) {
  .offer-title::before, .offer-title::after {
    width: 30%;
  }
}
.offer-title::before {
  background: url(./images/offer1.png) no-repeat center/contain;
  top: -5%;
  left: -180px;
}
@media screen and (max-width: 1024px) {
  .offer-title::before {
    left: -120px;
  }
}
@media screen and (max-width: 767px) {
  .offer-title::before {
    background: url(./images/offer-sp.png) no-repeat center/contain;
    aspect-ratio: 319/218;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 50%;
    top: -130%;
  }
}
.offer-title::after {
  background: url(./images/offer2.png) no-repeat center/contain;
  bottom: -25%;
  right: -180px;
}
@media screen and (max-width: 1024px) {
  .offer-title::after {
    right: -120px;
  }
}
@media screen and (max-width: 767px) {
  .offer-title::after {
    display: none;
  }
}
.offer-title h2 {
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  color: #F8A212;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .offer-title h2 {
    margin-bottom: 1rem;
  }
}
.offer-title p {
  font-weight: bold;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.offer-wrap {
  display: flex;
  justify-content: space-between;
  max-width: 1345px;
  width: 80%;
  margin: 7.5rem auto 0;
}
@media screen and (max-width: 1279px) {
  .offer-wrap {
    width: 90%;
  }
}
@media screen and (max-width: 1024px) {
  .offer-wrap {
    flex-wrap: wrap;
    gap: 6rem 2%;
  }
}
@media screen and (max-width: 767px) {
  .offer-wrap {
    margin-top: 5rem;
  }
}
.offer-item {
  width: 32%;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 3rem 2.5% 2rem;
  position: relative;
  gap: 2rem;
  border-radius: 10px;
}
@media screen and (max-width: 1024px) {
  .offer-item {
    width: 49%;
  }
}
@media screen and (max-width: 767px) {
  .offer-item {
    width: 100%;
    padding: 1.5rem 2rem 2rem;
  }
}
@media screen and (max-width: 1600px) {
  .offer-item:last-child .balloon2 {
    padding: 10px 2rem;
    top: -4rem;
  }
  .offer-item:last-child .balloon2 p span {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .offer-item:last-child .balloon2 {
    top: -3.5rem;
    padding: 1rem 2rem;
  }
  .offer-item:last-child .balloon2 p span {
    display: inline-block;
  }
}
.offer-item .balloon2 {
  position: absolute;
  top: -3.5rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  border-radius: 20px;
  color: #F8A213;
  border-color: #F8A213;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  font-weight: 500;
  padding: 1rem 2rem;
}
.offer-item .balloon2::after {
  border-top: 14px solid #F8A213;
}
.offer-item h3 {
  text-align: center;
  font-size: clamp(1.125rem, 0.989rem + 0.45vw, 1.5rem);
}
.offer-item ul, .offer-item li {
  list-style: inside;
}
.offer-item li {
  margin-bottom: 0.5rem;
  word-break: break-all;
}
.offer-item ::marker {
  color: #F8A212;
}
.offer .layer {
  background: rgba(0, 0, 0, 0.6);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  opacity: 0;
  visibility: hidden;
  display: none;
  transition: opacity 1s linear, visibility 1s linear, z-index 1s linear;
}
.offer .layer.is-open {
  z-index: 99999;
  opacity: 1;
  visibility: visible;
  display: block;
}
.offer .layer.is-open .modal {
  opacity: 1;
  visibility: visible;
}
.offer .modal__button-wrap {
  position: absolute;
  right: 1rem;
  top: 1rem;
  display: inline-flex;
}
@media screen and (max-width: 767px) {
  .offer .modal__button-wrap {
    right: 0.5rem;
    top: 0.5rem;
  }
}
.offer .close-button {
  position: relative;
  width: 39px;
  height: 39px;
  border-radius: 50%;
  padding: 0;
  border: transparent;
  cursor: pointer;
  background: transparent;
}
@media screen and (max-width: 767px) {
  .offer .close-button {
    width: 20px;
    height: 20px;
  }
}
.offer .close-button span {
  width: 40px;
  height: 3px;
  background: #F8A213;
  display: inline-block;
  position: absolute;
  left: calc(50% - 20px);
  top: 50%;
  border-radius: 20px;
}
@media screen and (max-width: 767px) {
  .offer .close-button span {
    width: 20px;
    left: calc(50% - 10px);
  }
}
.offer .close-button span:nth-child(1) {
  transform: rotate(45deg) translate(-1px, -1px);
}
.offer .close-button span:nth-child(2) {
  transform: rotate(-45deg) translate(1px, -1px);
}
.offer .modal {
  position: relative;
  margin-right: auto;
  margin-left: auto;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: visibility 0.3s linear, opacity 0.3s linear;
  height: 100%;
}
.offer .modal h4 {
  text-align: center;
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  margin-bottom: 0.5rem;
  color: #F8A212;
}
.offer .modal h4 + p {
  text-align: center;
}
.offer .modal__wrap {
  background-color: #FFEED3;
  border-radius: 10px;
  padding: 3.5rem 2rem 2rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .offer .modal__wrap {
    padding: 3.5rem 1rem 2rem;
  }
}
.offer .modal__wrap .balloon2 {
  position: absolute;
  top: -2.5rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
  border-radius: 20px;
  color: #F8A213;
  border-color: #F8A213;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  font-weight: 500;
  padding: 1rem 2rem;
}
.offer .modal__wrap .balloon2::after {
  border-top: 14px solid #F8A213;
}
.offer .modal__item {
  background-color: #fff;
  border-radius: 10px;
  width: 32%;
  padding: 1rem;
  font-size: 14px;
}
@media screen and (max-width: 1279px) {
  .offer .modal__item {
    width: 49%;
  }
}
@media screen and (max-width: 767px) {
  .offer .modal__item {
    width: 100%;
  }
}
.offer .modal__item__wrap {
  display: flex;
  gap: 1rem 2%;
  flex-wrap: wrap;
  margin-top: 1.5rem;
}
.offer .modal__item > p span {
  font-weight: bold;
  color: #F8A212;
}
.offer .modal__item > p:not(:last-child) {
  margin-bottom: 1rem;
}
.offer .modal__inner {
  word-break: break-all;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 10px;
  display: block;
  padding: 5rem 2rem 2.5rem;
  height: 90vh;
  width: 80%;
  max-height: 800px;
}
@media screen and (min-width: 1025px) and (max-height: 750px) {
  .offer .modal__inner {
    padding-top: 3rem;
  }
}
@media screen and (min-width: 1025px) and (max-height: 700px) {
  .offer .modal__inner {
    overflow: scroll;
  }
}
@media screen and (max-width: 1279px) {
  .offer .modal__inner {
    overflow: scroll;
  }
}
@media screen and (max-width: 1024px) {
  .offer .modal__inner {
    max-height: none;
    padding: 3rem 1rem 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .offer .modal__inner {
    width: 90%;
    padding-top: 4rem;
  }
}
.offer .modal__title {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.5rem;
}
.offer .modal__title img {
  aspect-ratio: 1/1;
  width: 15%;
}
.offer .modal__title h5 {
  color: #F8A212;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.offer .modal__content {
  padding-top: 15px;
  padding-bottom: 23px;
}
.offer .modal__button-area {
  max-width: 843px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 17px;
  padding-top: 15px;
}
.offer .button {
  color: #fff;
  padding: 1rem 5rem 1rem 2.5rem;
  border-radius: 999vh;
  text-align: center;
  display: block;
  margin: 0 auto;
  width: -moz-fit-content;
  width: fit-content;
  font-weight: 700;
  position: relative;
  font-size: 18px;
  text-align: center;
  background-color: #F8A212;
  border: none;
  cursor: pointer;
  transition: 0.3s;
}
.offer .button:hover {
  cursor: pointer;
  opacity: 0.7;
}
.offer .button::before {
  content: "";
  position: absolute;
  width: 9px;
  height: 18px;
  top: 50%;
  right: 1rem;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  background: url(./images/bpo-school-btn.svg) no-repeat center/contain;
  filter: brightness(100);
}

.point.bpo {
  background: none;
  margin-top: 130px;
}
@media screen and (max-width: 767px) {
  .point.bpo {
    margin-top: 2.5rem;
    padding-top: 0;
  }
}
.point.bpo h2 {
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  text-align: center;
  color: #F8A212 !important;
  margin-bottom: 70px;
}
@media screen and (max-width: 767px) {
  .point.bpo h2 {
    margin-bottom: 2rem;
  }
}
.point.bpo .balloon2 {
  border-color: #F8A212;
  padding: 1rem 2rem;
}
.point.bpo .balloon2::after {
  border-top: 14px solid #F8A212;
}
.point.bpo .balloon2 p {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  font-weight: bold;
  color: #F8A212;
}
.point.bpo .point-item {
  max-width: none;
  width: 48%;
  aspect-ratio: 1/1;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
  margin: 0;
}
@media screen and (max-width: 1024px) {
  .point.bpo .point-item {
    justify-content: flex-start;
  }
}
@media screen and (max-width: 767px) {
  .point.bpo .point-item {
    width: 100%;
    aspect-ratio: auto;
  }
}
.point.bpo .point-item img {
  margin: 0rem auto;
  width: 64%;
  aspect-ratio: auto;
  max-height: none;
}
@media screen and (max-width: 1024px) {
  .point.bpo .point-item img {
    height: 150px;
  }
}
.point.bpo .point-item:first-child img {
  width: 73%;
}
.point.bpo .point-item:nth-child(2) img {
  width: 65%;
}
.point.bpo .point-item:nth-child(3) img {
  width: 51%;
}
.point.bpo .point-item .label {
  text-align: center;
  color: #F8A212;
  font-weight: bold;
  font-size: clamp(3.125rem, 2.807rem + 1.06vw, 4rem);
  line-height: 1;
}
.point.bpo .point-item h3 {
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  margin-bottom: 1rem;
  text-align: center;
}
.point.bpo .point-wrap {
  margin-top: 2.5rem;
  gap: 5rem 0;
  max-width: 1280px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (max-width: 767px) {
  .point.bpo .point-wrap {
    gap: 2.5rem 0;
    max-width: 400px;
  }
}

.use-image {
  margin: 280px 0 100px;
}
@media screen and (max-width: 1024px) {
  .use-image {
    margin: 10rem 0 5rem;
  }
}
@media screen and (max-width: 767px) {
  .use-image {
    margin: 5rem 0 2.5rem;
  }
}
.use-image h2 {
  font-size: clamp(1.5rem, 0.818rem + 2.27vw, 3.375rem);
  text-align: center;
  color: #F8A212;
  margin-bottom: 2.5rem;
}
.use-image-wrap {
  background-color: #DFF1FD;
  padding: 75px 0 70px;
}
@media screen and (max-width: 767px) {
  .use-image-wrap {
    padding: 2rem 0;
  }
}
.use-image-box {
  background-color: #fff;
  width: 80%;
  max-width: 1345px;
  margin: 0 auto;
  border-radius: 30px;
  padding: 2rem 5%;
}
@media screen and (max-width: 1024px) {
  .use-image-box {
    width: 90%;
  }
}
.use-image-box > p {
  text-align: center;
  margin-top: 2rem;
}
@media screen and (max-width: 767px) {
  .use-image-box > p {
    margin-top: 1.5rem;
  }
}
.use-image-box-wrap {
  display: flex;
  justify-content: space-between;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .use-image-box-wrap {
    flex-direction: column;
    gap: 3rem;
    align-items: center;
  }
}
.use-image-item {
  width: 25%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2rem;
  align-items: center;
}
@media screen and (max-width: 767px) {
  .use-image-item {
    width: 60%;
    gap: 0.5rem;
  }
}
.use-image-item img:not(.use-image-logo) {
  flex: 1;
}
.use-image-item .use-image-logo {
  height: 60px;
}
@media screen and (max-width: 767px) {
  .use-image-item .use-image-logo {
    height: 30px;
  }
}
.use-image-item p {
  font-size: clamp(0.75rem, 0.477rem + 0.91vw, 1.5rem);
  color: #F8A212;
  font-weight: bold;
  line-height: 1.6666666667;
}
.use-image-item:first-child {
  position: relative;
}
.use-image-item:first-child::before {
  content: "";
  position: absolute;
  width: 58%;
  height: 100%;
  background: url(./images/use-image-ballon.png) no-repeat center/contain;
  right: -52%;
}
@media screen and (max-width: 767px) {
  .use-image-item:first-child::before {
    background: url(./images/use-image-sp1.png) no-repeat center/contain;
    right: auto;
    left: -35%;
    top: 70%;
    width: auto;
    aspect-ratio: 144/284;
    height: 140px;
  }
}
@media screen and (max-width: 767px) {
  .use-image-item:first-child::after {
    content: "";
    position: absolute;
    background: url(./images/use-image-sp2.png) no-repeat center/contain;
    right: -35%;
    top: 70%;
    width: auto;
    height: 140px;
    aspect-ratio: 144/284;
  }
}
.use-image-item:first-child img:not(.use-image-logo) {
  width: 80%;
}
.use-image-item:first-child .use-image-logo {
  opacity: 0;
  height: 30px;
}
@media screen and (max-width: 767px) {
  .use-image-item:first-child .use-image-logo {
    height: 0;
  }
}
.use-image-item:last-child {
  position: relative;
}
.use-image-item:last-child::before {
  content: "";
  position: absolute;
  width: 58%;
  height: 100%;
  background: url(./images/use-image-ballon2.png) no-repeat center/contain;
  left: -50%;
}
@media screen and (max-width: 767px) {
  .use-image-item:last-child::before {
    background: url(./images/use-image-sp3.png) no-repeat center/contain;
    right: auto;
    left: -35%;
    top: -40%;
    width: auto;
    aspect-ratio: 144/284;
    height: 140px;
  }
}
@media screen and (max-width: 767px) {
  .use-image-item:last-child::after {
    content: "";
    position: absolute;
    background: url(./images/use-image-sp4.png) no-repeat center/contain;
    right: -35%;
    top: -40%;
    width: auto;
    height: 140px;
    aspect-ratio: 144/284;
  }
}
.use-image-item:last-child img:not(.use-image-logo) {
  width: 80%;
  -o-object-position: center 85%;
     object-position: center 85%;
}
.use-image-item:last-child .use-image-logo {
  width: 70%;
}

.bpo-flow {
  margin: 12.5rem 0 10rem;
}
@media screen and (max-width: 1024px) {
  .bpo-flow {
    margin: 5rem 0 10rem;
  }
}
.bpo-flow h2 {
  font-size: clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
  text-align: center;
  color: #F8A212;
  margin-bottom: 2.5rem;
}
.bpo-flow-wrap {
  width: 80%;
  max-width: 1345px;
  display: flex;
  margin: 0 auto;
  justify-content: space-between;
}
@media screen and (max-width: 1279px) {
  .bpo-flow-wrap {
    flex-wrap: wrap;
    justify-content: space-around;
    gap: 4rem 0;
    max-width: 700px;
  }
}
@media screen and (max-width: 767px) {
  .bpo-flow-wrap {
    max-width: 300px;
  }
}
.bpo-flow-item {
  border: 3px solid #F8A213;
  border-radius: 10px;
  text-align: center;
  width: 22%;
  display: flex;
  flex-direction: column;
  padding: 5rem 1rem 3rem;
  align-items: center;
  gap: 2rem;
  position: relative;
}
@media screen and (max-width: 1400px) {
  .bpo-flow-item {
    width: 23%;
  }
}
@media screen and (max-width: 1279px) {
  .bpo-flow-item {
    width: 43%;
    padding: 2rem 1rem 1rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-flow-item {
    width: 100%;
    gap: 0.5rem;
    padding: 1rem;
  }
}
.bpo-flow-item h3 {
  color: #F8A213;
  font-size: 1.5rem;
  margin-bottom: 5%;
}
.bpo-flow-item p {
  font-weight: bold;
  line-height: 2;
}
.bpo-flow-item img {
  aspect-ratio: 1/1;
  width: 65%;
  -o-object-position: center;
     object-position: center;
}
@media screen and (max-width: 767px) {
  .bpo-flow-item img {
    width: 38%;
  }
}
.bpo-flow-item::before {
  content: "";
  position: absolute;
  height: 58px;
  width: 25px;
  background: url(./images/bpo-flow.svg) no-repeat center/contain;
  right: -15%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 1400px) {
  .bpo-flow-item::before {
    height: 53px;
    width: 20px;
    right: -12%;
  }
}
@media screen and (max-width: 1279px) {
  .bpo-flow-item::before {
    right: -14%;
  }
}
@media screen and (max-width: 767px) {
  .bpo-flow-item::before {
    top: auto;
    bottom: -4rem;
    right: auto;
    left: 50%;
    transform: translateX(-50%) rotate(90deg);
    -webkit-transform: translateX(-50%) rotate(90deg);
    -ms-transform: translateX(-50%) rotate(90deg);
  }
}
.bpo-flow-item:last-child::before {
  display: none;
}

.bpo-ex {
  padding: 4rem 0;
  background-color: #DFF1FD;
  margin-bottom: 15rem;
}
@media screen and (max-width: 1024px) {
  .bpo-ex {
    margin-bottom: 10rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-ex {
    margin-bottom: 5rem;
  }
}
.bpo-ex h2 {
  text-align: center;
  font-size: clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
}
.bpo-ex .news-recommend::before {
  display: none;
}
.bpo-ex .news-recommend .slick-next:before {
  background: url(./images/slider-bpo1.png) no-repeat center/contain;
}
.bpo-ex .news-recommend .slick-prev:before {
  background: url(./images/slider-bpo2.png) no-repeat center/contain;
}
@media screen and (max-width: 1024px) {
  .bpo-ex .news-recommend .slick-next {
    right: 3%;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-ex .news-recommend .slick-prev {
    left: 3%;
  }
}
.bpo-ex > .arrow-btn {
  margin: 2rem 15% 0 auto;
  background-color: #3D82E5;
  color: #fff;
  border-color: #3D82E5;
  padding: 1rem 3rem 1rem 2rem;
}
@media screen and (max-width: 767px) {
  .bpo-ex > .arrow-btn {
    margin: 2rem auto 0;
  }
}
.bpo-ex > .arrow-btn::before {
  filter: brightness(500);
}

.bpo-cta {
  position: relative;
  padding: 5rem 0 5rem;
  position: relative;
}
@media screen and (max-width: 767px) {
  .bpo-cta {
    padding: 0;
  }
}
.bpo-cta img {
  position: absolute;
  width: 29%;
  right: 10%;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
@media screen and (max-width: 1400px) {
  .bpo-cta img {
    right: 5%;
  }
}
@media screen and (max-width: 1279px) {
  .bpo-cta img {
    right: 2%;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-cta img {
    right: auto;
    top: auto;
    bottom: 4rem;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: 40%;
    max-height: 15rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-cta img {
    bottom: -1rem;
    width: 80%;
  }
}
.bpo-cta::before {
  content: "";
  top: -5%;
  position: absolute;
  width: 100%;
  height: 110%;
  z-index: -1;
  background-color: #fff;
}
.bpo-cta-wrap {
  width: 80%;
  margin: 0 auto;
  background-color: #F8A212;
  border-radius: 30px;
  padding: 3.5rem 0 3.5rem 5%;
  color: #fff;
  font-weight: bold;
}
@media screen and (max-width: 1024px) {
  .bpo-cta-wrap {
    padding: 3.5rem 5% 15rem 5%;
    text-align: center;
  }
}
@media screen and (max-width: 490px) {
  .bpo-cta-wrap {
    width: 90%;
    text-align: left;
    padding: 2.5rem 5% 15rem;
  }
}
.bpo-cta-wrap p:first-child {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
@media screen and (max-width: 490px) {
  .bpo-cta-wrap p:first-child {
    margin-bottom: 1rem;
    line-height: 2;
  }
}
.bpo-cta-wrap p:nth-child(2) {
  font-size: clamp(1.25rem, 0.886rem + 1.21vw, 2.25rem);
  margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
  .bpo-cta-wrap p:nth-child(2) {
    margin-bottom: 1.5rem;
  }
}
.bpo-cta-btn {
  display: flex;
  gap: 3.5rem;
}
@media screen and (max-width: 1400px) {
  .bpo-cta-btn {
    gap: 2.5rem;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-cta-btn {
    justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .bpo-cta-btn {
    flex-direction: column;
    gap: 1rem;
    align-items: center;
  }
}
@media screen and (max-width: 490px) {
  .bpo-cta-btn {
    align-items: flex-start;
  }
}
.bpo-cta-btn a {
  width: 280px;
  text-align: left;
}
@media screen and (max-width: 1279px) {
  .bpo-cta-btn a {
    width: 250px;
    padding: 1rem 2.5rem;
  }
}
.bpo-cta-btn .btn-right.bpo-cta-btn1 {
  border-color: #fff;
  background-color: #F8A212;
  color: #fff;
}
.bpo-cta-btn .btn-right.bpo-cta-btn1::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
  filter: brightness(500);
}
.bpo-cta-btn .btn-right.bpo-cta-btn2 {
  border-color: #F8A212;
  color: #F8A212;
}
.bpo-cta-btn .btn-right.bpo-cta-btn2::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
}

.bpo-school {
  padding-bottom: 5rem !important;
}
@media screen and (max-width: 767px) {
  .bpo-school {
    padding-bottom: 2.5rem !important;
  }
}
@media screen and (max-width: 767px) {
  .bpo-school > .arrow-btn {
    margin: 2rem auto 0;
  }
}
.bpo-school.filter-results-item {
  border-radius: 30px !important;
  margin: 2rem 20rem !important;
}
@media screen and (max-width: 1600px) {
  .bpo-school.filter-results-item {
    margin: 2rem 15rem !important;
  }
}
@media screen and (max-width: 1400px) {
  .bpo-school.filter-results-item {
    margin: 2rem 10rem !important;
  }
}
@media screen and (max-width: 1279px) {
  .bpo-school.filter-results-item {
    margin: 2rem 7rem !important;
  }
}
@media screen and (max-width: 1024px) {
  .bpo-school.filter-results-item {
    margin: 2rem 5rem !important;
  }
}
@media screen and (max-width: 767px) {
  .bpo-school.filter-results-item {
    margin: 2rem 2rem !important;
  }
}
.bpo-school.filter-results-item > .arrow-btn {
  background-color: #F8A212;
}
.bpo-school.filter-results-item > .arrow-btn:hover {
  background: linear-gradient(to bottom, #F8A212, #F7C674);
}
.bpo-school.filter-results-item > .arrow-btn::before {
  background: url(./images/bpo-ex-aroow.svg) no-repeat center/contain;
}
.bpo-school-wrap {
  padding: 0 5%;
  margin: 2rem 0;
}
.bpo-school-wrap h3 {
  color: #F8A212;
  padding: 1rem 1.5rem;
  line-height: 1;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  background-color: #FFFAD3;
  border-radius: 10px;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 1rem;
}
.bpo-school-contents {
  display: flex;
  gap: 5%;
  margin: 2rem 0;
  flex-wrap: wrap;
}
@media screen and (max-width: 1024px) {
  .bpo-school-contents {
    gap: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .bpo-school-contents {
    margin-top: 0.5rem;
    gap: 1rem;
  }
}
.bpo-school-item {
  width: 30%;
}
@media screen and (max-width: 1024px) {
  .bpo-school-item {
    width: 100%;
  }
}
.bpo-school-item h4 {
  color: #F8A212;
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
  margin-bottom: 1rem;
}
@media screen and (max-width: 767px) {
  .bpo-school-item h4 {
    margin-bottom: 0.5rem;
  }
}
.bpo-school .news-text {
  border-radius: 30px;
}
@media screen and (max-width: 767px) {
  .bpo-school .news-text {
    padding-bottom: 0;
  }
}
.bpo-school .news-text h2 {
  font-size: clamp(1.125rem, 0.898rem + 0.76vw, 1.75rem);
  color: #F8A212;
}
.bpo-school .pick-name {
  gap: 0;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}
@media screen and (max-width: 767px) {
  .bpo-school .pick-name {
    margin: 0.5rem 0 1rem;
  }
}
.bpo-school .filter-results-top {
  display: flex;
  flex-direction: row-reverse;
}
@media screen and (max-width: 767px) {
  .bpo-school .filter-results-top {
    flex-direction: column-reverse;
    gap: 28px;
    align-items: center;
  }
}
.bpo-school .filter-results-top .news-img {
  border-radius: 0 30px 0 30px;
}
@media screen and (max-width: 767px) {
  .bpo-school .filter-results-top .news-img {
    width: 90%;
  }
}

.page-id-261,
.page-id-382 {
  background: #fff;
}
.page-id-261 .balloon2 p,
.page-id-382 .balloon2 p {
  text-align: center;
}
.page-id-261 .faq,
.page-id-382 .faq {
  padding-bottom: 5rem;
}
.page-id-261 footer,
.page-id-382 footer {
  padding-top: 9rem;
  border-radius: 0;
}
.page-id-261 .accordion-area li,
.page-id-382 .accordion-area li {
  border-bottom: 1px solid #F8A212;
}
.page-id-261 .accordion-area .accordion-title::before,
.page-id-382 .accordion-area .accordion-title::before {
  background: url(./images/faq-ico-school.svg) no-repeat center/contain;
}
.page-id-261 .accordion-area .accordion-title::after,
.page-id-382 .accordion-area .accordion-title::after {
  background: url(./images/faq-ico2-school.png) no-repeat center/contain;
}
.page-id-261 .accordion-area .box a,
.page-id-382 .accordion-area .box a {
  color: #F8A212;
}
.page-id-261 .bpo-cta-btn1,
.page-id-382 .bpo-cta-btn1 {
  background-color: #F8A212;
  border: 3px solid #fff;
}
.page-id-261 .bpo-cta-btn1:hover,
.page-id-382 .bpo-cta-btn1:hover {
  background-color: #F8A212;
}
.page-id-261 .bpo-cta-btn2,
.page-id-382 .bpo-cta-btn2 {
  background-color: #fff;
  border: 3px solid #F8A212;
  color: #F8A212;
}
.page-id-261 .bpo-cta-btn2:hover,
.page-id-382 .bpo-cta-btn2:hover {
  background-color: #fff;
}
.page-id-261 .bpo-cta-btn2 .c-arrow-link--icon:before,
.page-id-261 .bpo-cta-btn2 .c-arrow-link--icon:after,
.page-id-382 .bpo-cta-btn2 .c-arrow-link--icon:before,
.page-id-382 .bpo-cta-btn2 .c-arrow-link--icon:after {
  background: url(./images/bpo-school-btn.svg) no-repeat center/contain;
}

.page-id-382 .lower-ex,
.page-id-384 .lower-ex {
  margin: 5rem 0 0;
  padding: 5rem 0;
  background-color: #ffeed3;
}
.page-id-382 .lower-ex > h2,
.page-id-384 .lower-ex > h2 {
  color: #F8A212;
}

.page-id-384 .lower-ex {
  background-color: #f7f7f7;
}
.page-id-384 .lower-ex > h2 {
  color: #a383eb;
}
.page-id-384 .lower-ex .btn {
  border-color: #a383eb;
  color: #a383eb;
}
.page-id-384 .lower-ex .btn:hover {
  background-color: #a383eb;
  color: #fff;
}
.page-id-384 .lower-ex .btn-right:before {
  background: url(./images/faq-ico-f.svg) no-repeat center/contain;
}

.page-id-384 {
  background: #fff;
}
.page-id-384 header {
  background-color: #A383EB;
}
@media screen and (max-width: 1024px) {
  .page-id-384 header {
    background-color: transparent;
  }
}
.page-id-384 header .login a {
  color: #fff !important;
}
.page-id-384 header .login a img {
  filter: brightness(100);
}
.page-id-384 .hamburger-menu .gnavi__sp-style .ham-login {
  background-color: #A383EB;
  color: #fff !important;
}
.page-id-384 .hamburger-menu .gnavi__sp-style .ham-login img {
  filter: brightness(100);
}
.page-id-384 .balloon2 {
  border-color: #A383EB;
}
.page-id-384 .balloon2::after {
  border-top: 14px solid #A383EB;
}
.page-id-384 .balloon2 p {
  text-align: center;
  color: #A383EB;
}
.page-id-384 .faq {
  padding-bottom: 5rem;
}
.page-id-384 footer {
  padding-top: 9rem;
  border-radius: 0;
}
.page-id-384 .accordion-area li {
  border-bottom: 1px solid #A383EB;
}
.page-id-384 .accordion-area .accordion-title::before {
  background: url(./images/faq-ico-f.svg) no-repeat center/contain;
}
.page-id-384 .accordion-area .accordion-title::after {
  background: url(./images/faq-ico2-f.png) no-repeat center/contain;
}
.page-id-384 .accordion-area .box a {
  color: #A383EB;
}
.page-id-384 .bpo-fv-banner {
  border-color: #A383EB;
}
.page-id-384 .bpo-fv-banner p {
  color: #A383EB;
}
.page-id-384 .bpo-fv-top > p {
  color: #A383EB;
}
.page-id-384 .bpo-fv .lower-fv-circle {
  background-color: #A383EB;
}
.page-id-384 .bpo-service-box::before {
  background-color: #F4F4F4;
}
.page-id-384 .bpo-service-box > p {
  color: #A383EB;
}
.page-id-384 .bpo-service-talk.orange {
  background-color: #F5F7FF;
  border-color: #A383EB;
  color: #A383EB;
}
.page-id-384 .bpo-found {
  border-color: #A383EB;
  padding: 5rem 2%;
}
@media screen and (max-width: 1400px) {
  .page-id-384 .bpo-found {
    width: 90%;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found {
    width: 80%;
    padding: 5rem 5%;
  }
}
@media screen and (max-width: 767px) {
  .page-id-384 .bpo-found {
    width: 90%;
    padding: 2.5rem 3%;
  }
}
.page-id-384 .bpo-found h2 {
  color: #A383EB;
}
.page-id-384 .bpo-found-wrap {
  display: flex;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-wrap {
    flex-direction: column;
  }
}
.page-id-384 .bpo-found-wrap-2 {
  margin: 3rem 0 0 auto;
  justify-content: end;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-wrap-2 {
    margin-top: 0;
  }
}
@media screen and (max-width: 1279px) {
  .page-id-384 .bpo-found-wrap-2 .bpo-found-item {
    width: 28%;
    max-width: 280px;
  }
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-wrap-2 .bpo-found-item {
    width: 100%;
    max-width: none;
  }
}
.page-id-384 .bpo-found-item {
  width: 26%;
  padding: 1rem 1rem 3rem 3rem;
  position: relative;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-item {
    width: 100%;
    padding: 3rem 1rem 2rem 3rem;
  }
}
@media screen and (max-width: 767px) {
  .page-id-384 .bpo-found-item {
    padding: 1.5rem 1rem 1.5rem 2rem;
  }
}
.page-id-384 .bpo-found-item::before {
  content: "";
  position: absolute;
  width: 2rem;
  height: 100%;
  right: -2rem;
  z-index: 10;
  top: 0;
  -webkit-clip-path: polygon(0 0, 0% 100%, 100% 50%);
          clip-path: polygon(0 0, 0% 100%, 100% 50%);
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-item::before {
    -webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
            clip-path: polygon(0 0, 50% 100%, 100% 0);
    top: auto;
    right: 0;
    width: 100%;
    height: 2rem;
    bottom: -2rem;
  }
}
@media screen and (max-width: 767px) {
  .page-id-384 .bpo-found-item::before {
    height: 1rem;
    bottom: -1rem;
  }
}
.page-id-384 .bpo-found-item > p {
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-item > p br {
    display: none;
  }
}
.page-id-384 .bpo-found-item > p:not(:last-child) {
  margin-bottom: 1rem;
}
.page-id-384 .bpo-found-item:first-child {
  border-radius: 10px 0 0 10px;
  padding-left: 1rem;
  width: 22%;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-item:first-child {
    width: 100%;
    border-radius: 10px 10px 0 0;
    padding-left: 3rem;
  }
}
@media screen and (max-width: 767px) {
  .page-id-384 .bpo-found-item:first-child {
    padding-left: 2rem;
  }
}
.page-id-384 .bpo-found-item:last-child {
  border-radius: 0 10px 10px 0;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-item:last-child {
    border-radius: 0 0 10px 10px;
  }
}
.page-id-384 .bpo-found .bpo-found-item1 {
  background-color: #FDFCFC;
}
.page-id-384 .bpo-found .bpo-found-item1::before {
  background-color: #FDFCFC;
}
.page-id-384 .bpo-found .bpo-found-item2 {
  background-color: #F7F7F7;
}
.page-id-384 .bpo-found .bpo-found-item2::before {
  background-color: #F7F7F7;
}
.page-id-384 .bpo-found .bpo-found-item3 {
  background-color: #F4F4F4;
}
.page-id-384 .bpo-found .bpo-found-item3::before {
  background-color: #F4F4F4;
}
.page-id-384 .bpo-found .bpo-found-item4 {
  background-color: #EDEDED;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found .bpo-found-item4 {
    border-radius: 0;
  }
}
.page-id-384 .bpo-found .bpo-found-item4::before {
  display: none;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found .bpo-found-item4::before {
    display: block;
    background-color: #EDEDED;
  }
}
.page-id-384 .bpo-found .bpo-found-item5 {
  background-color: rgb(232, 232, 232);
  width: 25%;
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found .bpo-found-item5 {
    width: 100%;
    border-radius: 0;
  }
}
.page-id-384 .bpo-found .bpo-found-item5::before {
  background-color: rgb(232, 232, 232);
}
.page-id-384 .bpo-found .bpo-found-item6 {
  background-color: #E3E3E3;
}
.page-id-384 .bpo-found .bpo-found-item6::before {
  background-color: #E3E3E3;
}
.page-id-384 .bpo-found .bpo-found-item7 {
  background-color: #DDDDDD;
}
.page-id-384 .bpo-found .bpo-found-item7::before {
  display: none;
}
.page-id-384 .bpo-found-top {
  color: #7E5DC7;
  font-weight: bold;
}
.page-id-384 .bpo-found-top p {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
@media screen and (max-width: 1024px) {
  .page-id-384 .bpo-found-top p br {
    display: none;
  }
}
.page-id-384 .bpo-found-top div {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
  .page-id-384 .bpo-found-top div {
    margin-bottom: 1rem;
  }
}
.page-id-384 .bpo-found-top div span {
  display: block;
  font-size: clamp(1.625rem, 1.034rem + 1.97vw, 3.25rem);
  line-height: 1;
}
.page-id-384 .bpo-found-top div p {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.page-id-384 .onayami .title h2 {
  color: #A383EB;
}
.page-id-384 .onayami .onayami-item:nth-child(3) .talk p {
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
.page-id-384 .onayami .onayami-item .talk p {
  background-color: #A383EB;
}
.page-id-384 .onayami .onayami-item .talk p:before {
  background: url(./images/talk-onayami-f.png) no-repeat center/contain;
}
.page-id-384 .reason h2.last-h2 {
  margin-top: 1rem;
}
@media screen and (max-width: 767px) {
  .page-id-384 .reason h2.last-h2 {
    line-height: 3;
  }
}
.page-id-384 .reason h2 span {
  color: #7E5DC7;
}
.page-id-384 .reason .title {
  background-color: #A383EB;
}
.page-id-384 .reason-right .label {
  color: #A383EB;
}
.page-id-384 .reason-right h3 {
  color: #A383EB;
}
.page-id-384 .use-image h2 {
  color: #A383EB;
}
.page-id-384 .use-image-item p {
  color: #A383EB;
}
.page-id-384 .use-image-item:first-child::before {
  background: url(./images/use-image-ballon-f.png) no-repeat center/contain;
}
@media screen and (max-width: 767px) {
  .page-id-384 .use-image-item:first-child::before {
    background: url(./images/use-image-sp1-f.png) no-repeat center/contain;
  }
}
@media screen and (max-width: 767px) {
  .page-id-384 .use-image-item:first-child::after {
    background: url(./images/use-image-sp2-f.png) no-repeat center/contain;
  }
}
.page-id-384 .use-image-item:last-child::before {
  background: url(./images/use-image-ballon2-f.png) no-repeat center/contain;
}
@media screen and (max-width: 767px) {
  .page-id-384 .use-image-item:last-child::before {
    background: url(./images/use-image-sp3-f.png) no-repeat center/contain;
  }
}
@media screen and (max-width: 767px) {
  .page-id-384 .use-image-item:last-child::after {
    background: url(./images/use-image-sp4-f.png) no-repeat center/contain;
  }
}
.page-id-384 .bpo-flow h2 {
  color: #A383EB;
}
.page-id-384 .bpo-flow-item {
  border-color: #A383EB;
}
.page-id-384 .bpo-flow-item::before {
  background: url(./images/bpo-flow-f.png) no-repeat center/contain;
}
.page-id-384 .bpo-flow-item h3 {
  color: #A383EB;
}
.page-id-384 .bpo-cta-wrap {
  background-color: #A383EB;
}
.page-id-384 .bpo-cta-btn1 {
  background-color: #A383EB;
  border: 3px solid #fff;
}
.page-id-384 .bpo-cta-btn1:hover {
  background-color: #A383EB;
}
.page-id-384 .bpo-cta-btn2 {
  background-color: #fff;
  border: 3px solid #A383EB;
  color: #A383EB;
}
.page-id-384 .bpo-cta-btn2:hover {
  background-color: #fff;
}
.page-id-384 .bpo-cta-btn2 .c-arrow-link--icon:before,
.page-id-384 .bpo-cta-btn2 .c-arrow-link--icon:after {
  background: url(./images/bpo-found-btn.svg) no-repeat center/contain;
}
.page-id-384 .bpo-school.filter-results-item > .arrow-btn {
  background-color: #A383EB;
}
.page-id-384 .bpo-school.filter-results-item > .arrow-btn:hover {
  background: linear-gradient(to bottom, #A383EB, #B9A3EB);
}
.page-id-384 .bpo-school.filter-results-item > .arrow-btn::before {
  background: url(./images/bpo-ex-aroow2.svg) no-repeat center/contain;
}
.page-id-384 .bpo-school .news-text h2 {
  color: #A383EB;
}
.page-id-384 .bpo-school-wrap h3 {
  color: #A383EB;
  background-color: #F4F4F4;
}
.page-id-384 .bpo-school-item h4 {
  color: #A383EB;
}
.page-id-384 .bpo-ex .news-recommend .slick-next:before {
  background: url(./images/slider-bg-f.svg) no-repeat center/contain;
}
.page-id-384 .bpo-ex .news-recommend .slick-prev:before {
  background: url(./images/slider-bg-f2.png) no-repeat center/contain;
}

section.whitepaper {
  width: 100%;
  margin: 3rem auto 10rem;
  padding: 5rem 0 !important;
}
section.whitepaper .filter-results-item {
  box-shadow: none;
}
section.whitepaper .filter-results-item .news-img {
  border-radius: 0;
}
section.whitepaper .filter-results-item img {
  aspect-ratio: 1200/630;
}
section.whitepaper .filter-results-item img:not(.thumbnail) {
  -o-object-fit: contain;
     object-fit: contain;
}
section.whitepaper .container {
  width: 90%;
}
@media screen and (max-width: 1024px) {
  section.whitepaper .container {
    width: 95%;
  }
}
section.whitepaper .filter-results {
  max-width: none;
}
@media screen and (max-width: 767px) {
  section.whitepaper .filter-results {
    gap: 0rem 3%;
  }
}
section.whitepaper .filter-results h2 {
  margin: 0 0 0.5rem;
  text-align: left;
}
section.whitepaper .news-text {
  padding: 1rem 0;
}
section.whitepaper .c-arrow-link.arrow-btn {
  margin: 0 auto;
}

.single-whitepaper .single-right.sp-only,
.single-archive .single-right.sp-only,
.single-conference .single-right.sp-only,
.single-webinar .single-right.sp-only {
  display: none;
}
@media screen and (max-width: 1279px) {
  .single-whitepaper .single-right.sp-only,
  .single-archive .single-right.sp-only,
  .single-conference .single-right.sp-only,
  .single-webinar .single-right.sp-only {
    display: block;
  }
}
@media screen and (max-width: 1279px) {
  .single-whitepaper .single-right.pc-only,
  .single-archive .single-right.pc-only,
  .single-conference .single-right.pc-only,
  .single-webinar .single-right.pc-only {
    display: none;
  }
}
@media screen and (max-width: 1279px) {
  .single-whitepaper .single-right,
  .single-archive .single-right,
  .single-conference .single-right,
  .single-webinar .single-right {
    width: 100%;
    margin: 2.5rem auto 0;
  }
}
.single-whitepaper .article_title,
.single-archive .article_title,
.single-conference .article_title,
.single-webinar .article_title {
  width: 90%;
}
@media screen and (max-width: 1279px) {
  .single-whitepaper .article_title,
  .single-archive .article_title,
  .single-conference .article_title,
  .single-webinar .article_title {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .single-whitepaper .article_title,
  .single-archive .article_title,
  .single-conference .article_title,
  .single-webinar .article_title {
    margin-bottom: 1.5rem;
  }
}
.single-whitepaper .catch,
.single-whitepaper .content,
.single-archive .catch,
.single-archive .content,
.single-conference .catch,
.single-conference .content,
.single-webinar .catch,
.single-webinar .content {
  width: 90%;
  margin: 0 0 3rem;
}
@media screen and (max-width: 1279px) {
  .single-whitepaper .catch,
  .single-whitepaper .content,
  .single-archive .catch,
  .single-archive .content,
  .single-conference .catch,
  .single-conference .content,
  .single-webinar .catch,
  .single-webinar .content {
    width: 100%;
  }
}
@media screen and (max-width: 1279px) {
  .single-whitepaper .single-contents,
  .single-archive .single-contents,
  .single-conference .single-contents,
  .single-webinar .single-contents {
    width: 80%;
    flex-direction: column;
  }
}

.archive .arrow-btn.play {
  background-color: #8FCDFA;
}
.archive .arrow-btn.play .c-arrow-link--icon::before, .archive .arrow-btn.play .c-arrow-link--icon::after {
  background: url(./images/play-btn.png) no-repeat center/contain;
}

section.webinar .filter-results-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
section.webinar .filter-results-item .news-img {
  border-radius: 0;
}
section.webinar .filter-results-item img {
  aspect-ratio: 1200/630;
}

.webinar-box {
  display: flex;
  gap: 1rem;
  align-items: center;
  margin: 0.5rem 0;
}
.webinar-box p:first-child {
  font-weight: bold;
  width: 40px;
}
.webinar-box p:nth-child(2) {
  width: calc(100% - 50px);
}

.event .news-contents > h2 {
  font-size: clamp(1.5rem, 0.955rem + 1.82vw, 3rem);
  color: #3D82E5;
  padding: 1rem 2rem;
  background-color: #E5F6FF;
  border-radius: 30px;
  margin-bottom: 2rem;
}
.event .news-contents:not(:last-child) {
  margin-bottom: 10rem;
}
@media screen and (max-width: 1024px) {
  .event .news-contents:not(:last-child) {
    margin-bottom: 5rem;
  }
}
.event-btn {
  display: flex;
  justify-content: center;
  gap: 2.5rem;
  margin: 50px 0 100px;
}
@media screen and (max-width: 1024px) {
  .event-btn {
    gap: 1.5rem;
    margin: 50px 0;
  }
}
@media screen and (max-width: 767px) {
  .event-btn {
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    margin: 2.5rem 0;
  }
}
.event-btn a {
  text-align: center;
  background-color: #fff;
  width: 260px;
  color: #3D82E5;
  padding: 1.5rem 1rem;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
}
@media screen and (max-width: 1024px) {
  .event-btn a {
    width: 200px;
    padding: 1rem;
  }
}
@media screen and (max-width: 767px) {
  .event-btn a {
    padding: 0.8rem 1rem;
  }
}
.event-btn a:hover {
  background-color: #E5F7FF !important;
}

section.use-search,
section.ex-search {
  width: 80%;
  margin: 3rem auto 0;
}
@media screen and (max-width: 1279px) {
  section.use-search,
  section.ex-search {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  section.use-search,
  section.ex-search {
    width: 100%;
  }
}
section.use-search .container,
section.ex-search .container {
  width: 90%;
}
@media screen and (max-width: 1024px) {
  section.use-search .container,
  section.ex-search .container {
    width: 95%;
  }
}
@media screen and (max-width: 767px) {
  section.use-search .filter-results,
  section.ex-search .filter-results {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  section.use-search .achievement,
  section.ex-search .achievement {
    width: 95%;
    margin: 2.5rem auto 0;
  }
}

.search-box .news-right {
  margin-bottom: 30rem;
}

.single-conference .catch img,
.single-whitepaper .catch img,
.single-archive .catch img,
.single-webinar .catch img {
  border-radius: 0;
}

.post-type-archive-whitepaper .filter-results-head {
  margin-bottom: 0.5rem;
}

.p-attention {
  color: red;
  margin-bottom: 1.5rem;
  font-size: 14px;
}
@media screen and (max-width: 767px) {
  .p-attention {
    font-size: 12px;
  }
}
.p-attention a {
  color: blue;
  text-decoration: underline;
}

html:has(.function-wrap) {
  scroll-behavior: smooth;
}

.function-main {
  padding-bottom: 3.5rem;
}
.function-main h1 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  margin-bottom: 2.5rem;
  letter-spacing: 5px;
}
.function-main .container {
  max-width: 1185px;
  width: 85%;
}
@media screen and (max-width: 767px) {
  .function-main .container {
    width: 95%;
  }
}
.function-main .container > p {
  color: #fff;
  text-align: center;
  margin-bottom: 2.5rem;
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
}

.function-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem 20px;
  align-items: center;
}
@media screen and (max-width: 1024px) {
  .function-wrap {
    gap: 2rem 10px;
  }
}
.function-wrap a {
  width: calc((100% - 100px) / 6);
  background-color: #fff;
  border-radius: 10px;
  padding: 1rem 0;
  text-align: center;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 2px solid #fff;
}
@media screen and (max-width: 1279px) {
  .function-wrap a {
    width: calc((100% - 60px) / 4);
  }
}
@media screen and (max-width: 1024px) {
  .function-wrap a {
    width: calc((100% - 20px) / 3);
  }
}
@media screen and (max-width: 767px) {
  .function-wrap a {
    font-size: 10px;
    padding: 1rem 0 0.5rem;
  }
}
.function-wrap a:hover {
  border: 2px solid #3D82E5;
}
@media screen and (max-width: 767px) {
  .function-wrap a:last-child .label {
    top: -1.5rem;
  }
}
.function-wrap a .label {
  position: absolute;
  color: #fff;
  background-color: #8FCDFA;
  border-radius: 1rem;
  padding: 2px 16px;
  font-size: clamp(0.75rem, 0.705rem + 0.15vw, 0.875rem);
  top: -1rem;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  width: -moz-max-content;
  width: max-content;
}
@media screen and (max-width: 767px) {
  .function-wrap a .label {
    padding: 2px 8px;
    font-size: 10px;
    width: 90%;
    top: -12px;
  }
}
.function-wrap a img {
  width: 3.5rem;
  margin: 0 auto 1rem;
  aspect-ratio: 1/1;
}
@media screen and (max-width: 767px) {
  .function-wrap a img {
    width: 2rem;
  }
}
.function-wrap a img + p {
  color: #3D82E5;
  font-weight: bold;
}

.function-body {
  background-color: #fff;
  padding: 4rem 0 100px;
}
@media screen and (max-width: 767px) {
  .function-body {
    padding-bottom: 40px;
  }
}
.function-body .container {
  max-width: 1190px;
}
.function-body h2 {
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  padding-bottom: 0.5rem;
  color: #3D82E5;
  border-bottom: 2px solid #3D82E5;
  margin-bottom: 3.5rem;
}
@media screen and (max-width: 767px) {
  .function-body h2 {
    margin-bottom: 1rem;
  }
}
.function-body .function-block {
  margin-bottom: 5rem;
}
.function-body .function-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2.5rem;
}
@media screen and (max-width: 1024px) {
  .function-body .function-box {
    flex-direction: column;
    gap: 1.5rem;
    align-items: center;
    margin-bottom: 4rem;
  }
}
@media screen and (max-width: 767px) {
  .function-body .function-box {
    gap: 0.5rem;
  }
}
.function-body .function-box > img {
  width: 40%;
}
@media screen and (max-width: 1024px) {
  .function-body .function-box > img {
    width: 75%;
  }
}
@media screen and (max-width: 767px) {
  .function-body .function-box > img {
    width: 100%;
  }
}
.function-body .function-box > div {
  width: 55%;
}
@media screen and (max-width: 1024px) {
  .function-body .function-box > div {
    width: 100%;
  }
}
.function-body .function-box > div p:not(:last-child) {
  margin-bottom: 1rem;
}
.function-body .function-title {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.5rem;
}
.function-body .function-title h3 {
  font-size: clamp(1.25rem, 1.068rem + 0.61vw, 1.75rem);
  color: #3D82E5;
}
.function-body .function-title img {
  max-width: 3.5rem;
  width: 8%;
  aspect-ratio: 1/1;
}

.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.6);
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.popup-content {
  background: #fff;
    padding: 3rem 5%;
    border-radius: 10px;
    text-align: center;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
        width: 80%;
}

@media screen and (max-width: 1024px) {
.popup-content {
width: 90%;
}
}

@media screen and (max-width: 767px) {
.popup-content {
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    padding: 1rem 5%;
}
.popup-content .top-btn{
    margin-top: 0.5rem;
}
}

.popup-item{
  width:47.5%;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2rem;
  position: relative;
}

@media screen and (max-width: 767px) {
.popup-item{
  width:100%;
  gap: 0;
}
}

.popup-item img{
  width:50%;
  margin:0 auto;
  max-width: 230px;
}
@media screen and (max-width: 767px) {
.popup-item img{
  max-width: 100px;
  margin-top: 8px;
}
}

.popup-item:first-child::before{
  content: "";
  position: absolute;
  width: 4px;
  height: 100%;
  background-color: #3d82e5;
  right:-5%;
  top: 0;
}

@media screen and (max-width: 767px) {
.popup-item:first-child::before{
  width: 100%;
  height: 2px;
  right: 0;
  top: auto;
  bottom: -1rem;
}
}

.popup-item:first-child img{
  width:80%;
  max-width: 350px;
}

@media screen and (max-width: 767px) {
.popup-item:first-child img{
  max-width: 150px;
}
}

.popup-item p{
  font-weight: bold;
  font-size: clamp(1.125rem, 0.989rem + 0.45vw, 1.5rem);
  color: #3d82e5;
}

.popup-item p:last-child{
  font-size: clamp(1.563rem, 0.994rem + 1.89vw, 3.125rem);
}

.footer-nav1{
  width: 65%;
}

.footer-nav1 > ul{
  gap: 5rem;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: end;
}

.footer-nav > ul > li > a{
  color: #1266B6;
  font-weight: bold;
  font-size: clamp(1.125rem, 1.08rem + 0.15vw, 1.25rem);
}

.footer ul.sub-menu{
  display: flex;
  flex-wrap: wrap;
    gap: 2rem 5%;
    flex-direction: row;
    width: 400px;
    margin-top: 2.5rem;
}


.footer ul.sub-menu li{
  width: 47.5%;
}

.footer-nav2 ul{
    gap: 2rem 2.5rem;
}

.icon-btn{
  display: flex;
  align-items: center;
  gap: 4px;
  color: #002D90;
  font-size: 14px;
  border: 1px solid ;
  border-radius: 4px;
  padding: 2px;
  font-weight: bold;
  width: 100px;
  justify-content: center;
}

.icon-btn:hover{
  color: #fff;
  background: #002D90;
}

.icon-btn:hover svg path{
  fill: #fff;
}

.icon-btn svg path{
  transition: 0.3s;
}

.icon-btn.blue{
  background: #002D90;
  color: #fff;
}

.icon-btn.blue:hover{
  color: #002D90;
  background: #fff;
}

.icon-btn.blue:hover svg path{
  fill: #002D90;
}


.icon-btn.blue:hover svg > g > path:last-child{
  fill: #fff;
}

.icon-btn svg path{
  transition: 0.3s;
}

.icon-btn svg{
  width: 18px;
}

.icon-btn.blue svg{
  width: 24px;
}

.new-btn{
  background-color: #1658AB;
  text-align: center;
  color: #fff;
  border-radius: 5px;
  width: 200px;
  font-weight: bold;
  font-size: clamp(1rem, 0.909rem + 0.3vw, 1.25rem);
  padding: 8px;
  border: 2px solid ;
}

.new-btn:hover{
  background-color: #fff;
  color: #1658AB;
}

.new-btn.orange{
  background-color: #FF7F00;
}

.new-btn.orange:hover{
  background-color: #fff;
  color: #FF7F00;
}

.footer-pankuzu{
  margin-top: 5rem;
}

.contact-banner{
  width: 80%;
  margin: 3rem auto 5rem;
  max-width: 1345px;
  border-radius: 1.5rem;
  background: #1266B5;
  color: #fff;
  border: 1px solid #707070;
  padding: 3.5rem 2.5%;
  display: flex;
  justify-content: space-between;
}

.contact-banner img{
  width: 16%;
}

.contact-banner-txt{
  width: 50%;
  text-align: center;
}

.contact-banner-txt h2{
  font-size: clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
}

.contact-banner-txt h2 span{
  display: inline-block;
}

.contact-banner-txt > p{
  margin: 10px 0 2rem;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
}

.contact-banner-txt a{
  color: #1266B5;
  background: #fff;
  border-radius: 4px;
  padding: 20px 4rem;
  display: block;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto;
  font-size: clamp(1.125rem, 0.989rem + 0.45vw, 1.5rem);
  transition: 0.3s;
  border: 2px solid;
}

.contact-banner-txt a:hover{
  color: #fff;
  background: #1266B5;
}

.top-use {
  margin: 7.5rem 0 0;
  padding: 5rem 0 ;
  background: #E2EEF5;
}
.top-use .container{
  max-width: 1345px;
}
.top-use .top-btn {
  margin-top: 2.5rem;
}
@media screen and (max-width: 767px) {
  .top-use {
    margin: 5rem auto 0;
  }
}

.top-use .filter-results {
  max-width: none;
  gap: 2.5rem 3%;
}
.top-use .news-text {
  padding: 1rem 5% ;
}
.top-use .c-arrow-link.arrow-btn.white {
  margin: 5rem auto 0;
  width: -moz-fit-content;
  width: fit-content;
  padding: 1rem 5rem 1rem 2.5rem;
  border: none;
}
@media screen and (max-width: 767px) {
  .top-use .c-arrow-link.arrow-btn.white {
    margin-top: 2.5rem;
  }
}
.top-use .c-arrow-link.arrow-btn.white .fv-btn-box {
  background-color: #3D82E5;
}
.top-use .c-arrow-link.arrow-btn.white .c-arrow-link--icon:before, .top-use .c-arrow-link.arrow-btn.white .c-arrow-link--icon:after {
  content: "";
  background: url(./images/header-btn.svg) no-repeat center/contain;
}
.top-use .c-arrow-link.arrow-btn.white .c-arrow-link--icon {
  overflow: hidden;
  position: absolute;
  width: 9px;
  margin: auto 0;
  height: 20px;
  line-height: 1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  z-index: 10;
}
.top-use .filter-results.slider4 {
  display: none;
  width: 100%;
}
@media screen and (max-width: 767px) {
  .top-use .filter-results.slider4 {
    display: block;
  }
}
.top-use .filter-results.slider4 .filter-results-item {
  margin: 0 1rem;
}
.top-use .filter-results.slider4 .slick-list {
  padding: 1rem 10% !important;
}

.top-blog-head{
  display: flex;
  align-items: center;
  gap: 1rem;
}


.home .title{
  position: relative;
  padding-bottom: 4px;
  width: fit-content;
  margin: 0 auto;
}

.home .title h2{
  color: #1266B6;
}

.home .title::before{
  position: absolute;
  content: "";
  width: 100%;
  height: 2px;
  background: #1266B6;
  bottom: 0;
  left: 0;
}

.blue-btn{
  color: #fff;
  font-weight: bold;
  background: #1658AB;
  border-radius: 6px;
  border: 2px solid ;
  padding: 20px 3.5rem;
  width: fit-content;
  display: block;
  font-size: clamp(1.25rem, 1.159rem + 0.3vw, 1.5rem);
  margin: 2.5rem auto 0;
}

.blue-btn:hover{
  background:#fff;
  color: #1658AB;
}

.blue-btn.orange{
  background: transparent;
  background-image: linear-gradient(to right bottom, #FFCE00, #FC7F02);
  box-shadow: 0 3px 6px rgba(0,0,0,0.55);
}

.blue-btn.orange:hover{
  color: #FC7F02;
  background: #fff;
}

.blue-btn.purple{
  background: transparent;
  background-image: linear-gradient(to right bottom, #B284E1, #7A5CBF);
  box-shadow: 0 3px 6px rgba(0,0,0,0.55);
}

.blue-btn.purple:hover{
  color: #7A5CBF;
  background: #fff;
}

.blue-btn.blue{
  background: transparent;
  background-image: linear-gradient(to right bottom, #759DD8, #366EE5);
  box-shadow: 0 3px 6px rgba(0,0,0,0.55);
}

.blue-btn.blue:hover{
  color: #366EE5;
  background: #fff;
}

.service-banner{
  max-width: 1080px;
  width: 75%;
  margin: 5rem auto 7.5rem;
  background: #1266B5;
  border-radius: 1.5rem;
  padding: 4rem 5% 3.5rem;
  text-align: center;
  color: #fff;
}

.service-banner h2{
  font-size:clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
}

.blue-bg{
  padding: 5rem 0 7.5rem;
  background-color: #E1EFF5;
}

.blue-bg .title{
  margin-bottom: 2rem;
}

.blue-bg .container{
  max-width: 1345px;
}

.top-about{
  margin-bottom: 7.5rem;
}

.top-about .title + p{
  font-weight: bold;
  text-align: center;
  font-size: clamp(0.875rem, 0.648rem + 0.76vw, 1.5rem);
  margin: 2rem 0;
}

.top-white-bg{
  text-align: center;
  padding: 24px 5% 2.5rem;
  background-color: #fff;
  border-radius: 10px;
}

.top-about h3{
  font-size: clamp(1.125rem, 0.852rem + 0.91vw, 1.875rem);
  text-align: center;
  margin-bottom: 0.5rem;
}

.top-about h3 + img{
  width: 280px;
  margin: 0 auto;
}

.top-about-wrap{
  display: flex;
  justify-content: space-between;
  position: relative;
  align-items: center;
  max-width: 1125px;
  margin: 0 auto;
}

.top-about-wrap img{
  width: 38%;
  opacity: 0;
}

.top-about2{
  z-index: 10;
}

.top-about1.fadeUp{
  animation: fadeTopAnime 1s forwards;
}

.top-about2.fadeUp{
  animation: fadeAnime 1s forwards 1s;
}

.top-about3.fadeUp{
  animation: fadeTopAnime 1s forwards;
}

.top-about-wrap img:nth-child(2){
  width: 34%;
  position: absolute;
  top: 50%;
  left: 51%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}

.top-about-wrap img:nth-child(3){
  width: 35.5%;
}

.top-service-wrap{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.top-service-txt{
  width: 35%;
  text-align: center;
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
  font-weight: bold;
}

.top-service-txt p:first-child{
  color: #fff;
  background-color: #1266B6;
  width: fit-content;
  margin: 0 auto;
  padding: 3px 20px;
  font-size: 1rem;
}

.top-service h3{
  font-size: clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
  margin: 4px 0;
}

.top-service-btn{
  width: 60%;
  display: flex;
  flex-wrap: wrap;
  gap: 2.5rem 10%;
  justify-content: center;
}

.top-service-btn > div{
  width: 45%;
  padding: 1.5rem 5%;
  color: #fff;
  border-radius: 10px;
  background: linear-gradient(to right bottom, #FFCB00, #FC7F02);
  box-shadow: 0px 3px 6px rgba(0,0,0,0.55);
  position: relative;
  overflow: hidden;
  z-index: 1;
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
  font-weight: bold;
}

.top-service-btn > div:first-child{
  margin: 0 10%;
}

.top-service-btn > div::before{
  content: "";
  position: absolute;
  width: 200px;
  height: 1.5rem;
  top: -5px;
  left: -50px;
  background: #FC8F02;
  z-index: 10;
  transform: rotate(-35deg);
}

.top-service-btn > div p:nth-child(2){
  font-size: clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
}

.top-service-btn > div a{
  padding: 10px 2rem;
  background-color: #fff;
  border-radius: 6px;
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
  color: #F8A213;
  width: fit-content;
  margin: 20px auto 0;
  display: block;
  border: 2px solid;
}

.top-service-btn > div a:hover{
  background:  #F8A213;
  color: #fff;
}

.top-service-btn > div.purple{
  background: linear-gradient(to right bottom, #B385E2, #7A5BBF);
}

.top-service-btn > div.purple::before{
  background: #7B5BC0;
}

.top-service-btn > div.purple a{
  color: #7E5BC0;
}

.top-service-btn > div.purple a:hover{
  background: #7E5BC0;
  color: #fff;
}

.top-service-btn > div.blue{
  background: linear-gradient(to right bottom, #779FD8, #366EE5);
}

.top-service-btn > div.blue::before{
  background: #3A71E5;
}

.top-service-btn > div.blue a{
  color: #3870E4;
}

.top-service-btn > div.blue a:hover{
  color: #fff;
  background: #3870E4;
}

.top-service-item-wrap{
  display: flex;
  margin-top: 10px;
  gap: 1rem;
  justify-content: space-between;
}

.top-service-item{
  width: calc((100% - 2rem)/3);
  border-radius: 10px;
  background-color: #fff;
  padding: 2.5rem  1rem 1.5rem;
  position: relative;
  text-align: center;
  border-bottom: 1rem solid #3952A7;
  overflow: hidden;
}

.top-service-item::before{
  content: "";
  position: absolute;
  width: 200px;
  height: 1.5rem;
  top: -5px;
  left: -50px;
  background: #3952A7;
  z-index: 10;
  transform: rotate(-35deg);
}

.top-service-item:nth-child(2){
  border-bottom: 1rem solid #377BE7;
}

.top-service-item:nth-child(2)::before{
  background: #377BE7;
}

.top-service-item:nth-child(3){
  border-bottom: 1rem solid #15ABBE;
}

.top-service-item:nth-child(3)::before{
  background: #15ABBE;
}

.top-service-item p{
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
  font-weight: bold;
}

.top-service-item img{
  width: 60%;
  margin: 2rem auto;
  aspect-ratio: 247/168;
}

.top-service-item .blue-btn{
  font-size: 18px;
  padding: 10px 3rem 10px 3.5rem;
}

.top-service-item .blue-btn.soon{
  pointer-events: none;
}


.top-service-item-head{
  display: flex;
  justify-content: center;
  gap: 14px;
}

.top-service-item-head p{
  color: #fff;
  background: #FC8701;
  padding: 3px 20px;
  width: fit-content;
  font-size: 1rem;
}

.top-service-item-head p.purple{
  background: #7C5DC0;
}

.top-service-item-head p.blue{
  background:#3A71E4;
}

.customize{
  margin: 5rem 0 0;
}

.customize .container{
  max-width: 1345px;
}

.customize .title + p{
  text-align: center;
  font-weight: bold;
  font-size: clamp(0.875rem, 0.784rem + 0.3vw, 1.125rem);
  margin: 2rem 0 3.5rem;
}

.customize-img-wrap{
  position: relative;
  display: flex;
  justify-content: center;
}

.customize-img{
  width: 50%;
  aspect-ratio: 1/1;
  position: relative;
  z-index: 10;
}

.customize-txt{
  position: absolute;
  left: 5%;
  width: 30%;
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
  padding-bottom: 8px;
  opacity: 0;
  min-width: 20%;
}

@media screen and (min-width: 768px) {

  .customize-img-wrap.fadeUp .customize-txt{
    animation: fadeAnime 1.5s forwards;
  }

  .customize-img-wrap.fadeUp .customize-txt2{
    animation-delay: 0.7s;
  }

  .customize-img-wrap.fadeUp .customize-txt3{
    animation-delay: 1.4s;
  }

  .customize-img-wrap.fadeUp .customize-txt4{
    animation-delay: 2.1s;
  }

}

@media screen and (max-width: 767px) {

  .customize-txt.fadeUp{
    animation: fadeAnime 1.5s forwards;
  }

}


.customize-txt::before{
  content: "";
  position: absolute;
  width: 140%;
  height: 3px;
  background-color: #01A0DB;
  bottom: 0;
  left: 0;
}

.customize-txt .label{
  color: #fff;
  background-color: #01A0DB;
  text-align: center;
  max-width: 215px;
  margin-bottom: 0.5rem;
  font-weight: bold;
}

.customize-txt li{
  font-weight: bold;
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.customize-txt li::before{
  content: "";
  width: 1.5rem;
  height: 1.5rem;
  background: url(./images/check.svg) no-repeat center/contain;
}

.customize-txt2{
  left: auto;
  right: 5%;
  width: fit-content;
  top: 7.5%;
}

.customize-txt2 .label{
  background-color: #005BD6;
}

.customize-txt2::before{
  background-color: #005BD6;
  left: -30%;
  width: 130%;
}

.customize-txt2 li::before{
  background: url(./images/check2.svg) no-repeat center/contain;
}

.customize-txt3{
  top: 60%;
}

.customize-txt3 .label{
  background-color: #15ABBE;
}

.customize-txt3::before{
  background-color: #15ABBE;
}

.customize-txt3 li::before{
  background: url(./images/check3.svg) no-repeat center/contain;
}

.customize-txt4{
  left: auto;
  right: 5%;
  width: fit-content;
  top: 60%;
}

.customize-txt4 .label{
  background-color: #3952A7;
}

.customize-txt4::before{
  background-color: #3952A7;
  left: -100%;
  width: 200%;
}

.customize-txt4 li::before{
  background: url(./images/check4.svg) no-repeat center/contain;
}

.customize-blue-txt{
  width: 90%;
  margin: 5rem auto;
  background-color: #EBF6FD;
  padding: 2rem 1rem;
  text-align: center;
  color: #1266B6;
  font-weight: bold;
  font-size: clamp(1.25rem, 1.159rem + 0.3vw, 1.5rem);
}

.customize-ex{
  border: 1px solid #707070;
  padding: 1rem 10% 2.5rem;
  text-align: center;
}

.customize-ex h3{
  color: #1266B6;
  font-size: clamp(1.5rem, 1.318rem + 0.61vw, 2rem);
}

.customize-ex-wrap{
  display: flex;
  justify-content: space-between;
  font-size: clamp(1.25rem, 1.159rem + 0.3vw, 1.5rem);
  font-weight: bold;
  margin-top: 2rem;
}

.customize-ex-item{
  width: 45%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.customize-ex-item img{
  margin-top: 1.5rem;
}

.top-function{
  margin: 200px 0 0;
}

.top-function .tab {
  margin-left: auto;
  margin-right: auto;
  margin-top: 30px;
  width: 100%;
}
.top-function .tab-list {
  display: flex;
    justify-content: center;
    gap: 5%;
    margin-bottom: 5rem;
}
.top-function .tab-menu {
  background-color: #fff;
  color: #B1B1B1;
  border: 4px solid #B1B1B1;
  cursor: pointer;
  width: 30%;
  max-width: 335px;
  text-align: center;
  padding: 2rem 0;
  box-shadow: 0px 3px 6px rgba(0,0,0,0.55);
  border-radius: 10px;
  transition: 0.3s;
}

.top-function .tab-menu:hover{
  box-shadow: none;
}

.top-function .tab-menu.current{
  box-shadow: none;
}

.top-function .tab-menu div{
  align-items: center;
  justify-content: center;
  display: flex;
  gap: 2rem;
}
.top-function .tab-menu div svg{
  width: 2.5rem;
}
.top-function .tab-menu div p span{
  font-size: clamp(1.25rem, 0.977rem + 0.91vw, 2rem);
  font-weight: bold;
}
.top-function .tab-menu.school.current {
  color: #F8A213;
  border-color: #F8A213;
}
.top-function .tab-menu.school.current svg circle {
  fill: #F8A213;
}
.top-function .tab-menu.fund.current {
  color: #7E5DC7;
  border-color: #7E5DC7;
}
.top-function .tab-menu.fund.current svg circle {
  fill: #7E5DC7;
}
.top-function .tab-menu.area.current {
  color: #1266B6;
  border-color: #1266B6;
}
.top-function .tab-menu.area.current svg circle {
  fill:#1266B6;
}
.top-function .content-box {
  display: none;
  width: 100%;
}

.top-function .content-box img {
  display: block;
  height: auto;
}

.function-wrap{
  display: flex;
  justify-content: space-between;
  padding: 3rem 8% 2rem 15%;
  position: relative;
}

.function-wrap:not(:nth-child(3)){
  margin-bottom: 7.5rem;
}

.function-wrap::before {
  content: "";
  position: absolute;
  width: 92.5%;
  height: 100%;
  background-color: #EBF6FD;
  left: 0;
  top: 0;
  z-index: -1;
}

.function-wrap:nth-child(2){
  flex-direction: row-reverse;
  padding: 3rem 15% 2rem 8%;
}

.function-wrap:nth-child(2)::before{
  left: auto;
  right: 0;
}

.function-txt-wrap{
  width: 47.5%;
}

.function-img{
  width: 47.5%;
  position: relative;
}

.function-img .sub{
  position: absolute;
  width: 47%;
  right: -5%;
  top: -5%;
  opacity: 0;
  transition: 1s;
}

.function-img.fadeUp .sub{
  opacity: 1;
}

.function-img .sub2{
  right:auto;
  left: -2.5%;
}

.function-img .sub3{
  top:auto;
  bottom: 20%;
  width: 50%;
}

.function-img .sub4{
  top: auto;
  bottom: 0;
  right: 10%;
}

.function-img .sub5{
  width: 95%;
  right: auto;
  top: -10%;
  left: 2%;
}

.function-title{
  display: flex;
  align-items: center;
  margin-bottom: 2.5rem;
  position: relative;
}

.function-title div{
  border-radius: 999vh;
  border: 3px solid #1266B6;
  aspect-ratio: 1 / 1;
  padding: 1rem;
  line-height: 1;
  color: #1266B6;
  background-color: #fff;
  display: flex;
  position: absolute;
  top: 50%;
  left: 0%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}

.function-title p{
  text-align: center;
  font-size: clamp(0.75rem, 0.659rem + 0.3vw, 1rem);
}

.function-title p span{
  font-size: clamp(2rem, 1.455rem + 1.82vw, 3.5rem);
  font-weight: bold;
  display: block;
  line-height: 1;
}

.function-title h3{
  color: #fff;
  background-color: #1266B6;
  font-size: clamp(1rem, 0.818rem + 0.61vw, 1.5rem);
  padding: 8px 8px 8px 10%;
  width: 90%;
  margin-left: auto;
}

.function-txt{
  width: 80%;
  margin-left:auto;
  font-weight: 500;
  font-size: 14px;
}

.function-txt p:not(:last-child){
  margin-bottom: 1.5rem;
}

.function-txt .big{
  color: #1266B6;
  font-size: clamp(1rem, 0.955rem + 0.15vw, 1.125rem);
  font-weight: bold;
}

.function-txt span:not(.big){
  display: inline-block;
}

.top-archive{
  margin: 2rem 0 20px;
  overflow: hidden;
}

.top-archive > img{
  width: 320px;
  margin: 0 auto 20px;
}

.top-function .content-box:last-child .function-title p{
  font-size: 12px;
}

.loopSlide {
    display: flex;
    width: 100vw;
    height: 160px;
    overflow: hidden;
    transform: scale(3);
}

.loopSlide img {
    width: auto;
    height: 100%;
    padding-right: 1rem;
}

.loopSlide img:first-child {
    animation: slide1 120s -60s linear infinite;
}

.loopSlide img:last-child {
    animation: slide2 120s linear infinite;
}

.top-swiper .swiper-wrapper {
  transition-timing-function: linear;
}

@keyframes slide1{
  0% {
      transform: translateX(100%);
  }

  100% {
      transform: translateX(-100%);
  }
}

@keyframes slide2{
  0% {
      transform: translateX(0%);
  }

  100% {
      transform: translateX(-200%);
  }
}

.fv{
  padding: 230px  10% 220px;
  background: url(./images/fv-bg.png) no-repeat center/cover;
  overflow: hidden;
  font-size: clamp(0.75rem, 0.568rem + 0.61vw, 1.25rem);
}

.fv-wrap{
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
  position: relative;
}


.fv-right{
  width: 60%;
  position: absolute;
  right: -10%;
  top: 60%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transition: 1s;
  opacity: 0;
}

.fv-right.fadeUp{
  opacity: 1;
  top: 45%;
}

.fv h1{
  font-size: clamp(1.25rem, 0.614rem + 2.12vw, 3rem);
  margin: 1rem 0 1.5rem;
  line-height: 1.7;
}

.fv h2{
  font-size: clamp(0.875rem, 0.466rem + 1.36vw, 2rem);
}

.home .filter-results-item:nth-child(4){
  display: none;
}

.how-img-wrap{
  display: none;
}

@media screen and (max-width: 1600px) {
  .customize-txt{
    left: 0%;
    min-width: 24%;
  }
  .customize-txt2,
  .customize-txt4{
    left: auto;
    right: 0;
  }
  .footer-nav1 > ul {
    gap: 2.5rem;
  }
  .fv {
    padding: 230px 7.5% 220px;
  }
  .header-left-bottom{
    gap: 2rem;
  }
}

@media screen and (max-width: 1400px) {
  .header-left .hamburger-nav__list {
    gap: 1rem;
  }
  .header-left a img{
    width: 200px;
  }
  .customize-txt2,
  .customize-txt4{
    left: auto;
    right: -5%;
    width: 26%;
  }
  .function-title h3{
    padding-left: 15%;
  }
    .header-left .hamburger-nav__list .sub-menu{
      padding: 7.5rem 5% 2.5rem;
    }
    .fv {
      padding: 230px 5% 220px;
    }
  .footer ul.sub-menu li {
    width: fit-content;
  }
  .footer ul.sub-menu {
    width: fit-content;
    gap: 1rem;
    margin-top: 1.5rem;
    flex-direction: column;
  }
}

@media screen and (max-width: 1279px) {
    .header-left a img {
        width: 180px;
    }
    .new-btn{
        width: 150px;
        padding: 6px;
    }
    .header-btn{
      gap: 0.5rem;
    }
    .header-left-bottom {
        gap: 1rem;
    }
    .header-contents {
        padding: 0 1%;
    }
    .header-left .hamburger-nav__list a{
      font-size: 14px;
    }
    .how .container,
    .blue-bg .container,
    .top-use .container,
    .top-news .container,
    .introduce .container{
      width: 90%;
    }
    .header-left .hamburger-nav__list .sub-menu{
      padding: 7.5rem 2.5% 2.5rem;
    }
    .top-service-wrap{
      flex-direction: column;
      gap: 2rem;
    }
    .top-service-txt{
      width: 100%;
      max-width: 500px;
    }
    .top-service-btn,
    .function-txt-wrap{
      width: 100%;
      max-width: 700px;
    }
    .function-wrap,
    .function-wrap:nth-child(2){
      flex-direction: column;
      align-items: center;
      gap: 2.5rem;
      justify-content: center;
      padding: 3rem 5% ;
    }
    .function-wrap::before{
      width: 100%;
    }
    .function-img{
      width: 100%;
      max-width: 650px;
    }
    .function-txt {
      width: 90%;
    }
    .fv-right {
      width: 55%;
      right: -8%;
    }
    .loopSlide{
      transform: scale(5);
      height: 100px;
    }
    .function-title h3 {
        padding-left: 10%;
    }
    .customize-img-wrap{
      flex-wrap: wrap;
      gap: 2.5rem 5%;
    }
    .customize-img{
      margin: 0 10%;
    }
    .customize-txt{
      position: relative;
      left: auto;
      top: auto;
      right: auto;
      bottom: auto;
      width: 47.5%;
      max-width: 350px;
    }
    .customize-txt::before{
      display: none;
    }
    .customize-txt .label{
      max-width: none;
      width: 100%;
    }
    .customize-ex{
      padding: 1rem 5% 2.5rem;
    }
    .introduce h3{
      margin-bottom: 0.5rem;
    }
    .top-service-item{
      padding-left: 0;
      padding-right: 0;
    }
    .header-left .hamburger-nav__list .menu-item-has-children > a{
      gap: 0.5rem;
    }
}

@media screen and (max-width: 1024px) {
  .loopSlide{
    height: 100px;
    transform: scale(4);
  }
  .home .filter-results-item:nth-child(4){
    display: block;
  }
  .header-left .hamburger-nav,
  .header-left > p{
    display: none;
  }
  .header-left-bottom{
    margin: 0;
  }
  header{
    height: 4rem;
  }
  .header-left{
    width: fit-content;
  }
  #breadcrumbs{
    margin-top: 4rem;
  }
  .header-contents {
    padding: 0 2.5%;
  }
  .hamburger-menu .menu-content ul li a{
    display: block;
    padding: 16px 0 16px 24px;
    border-bottom: 1px solid #e6e6e6;
    position: relative;
    color: #1266B6;
    font-weight: bold;
  }
  .hamburger-menu .menu-content ul li a::before{
    content: "";
    position: absolute;
    right: 1rem;
    width: 1rem;
    height: 1rem;
    background: url(./images/ham-arrow.png) no-repeat center/contain;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  }
  .hamburger-menu .menu-content ul li.menu-item-1590,
  .hamburger-menu .menu-content ul li.menu-item-288{
    display: none;
  }
  .hamburger-menu .header-btn{
    flex-direction: row;
    gap: 1rem;
    margin-top: 2.5rem;
    justify-content: center;
  }
  .hamburger-menu .new-btn {
    width: 250px;
    padding: 8px;
    font-size: 1.5rem;
  }
  .ham-service{
    padding: 3rem 5%;
    background-color: #E1EFF5;
  }

  .ham-service > a{
    display: block;
    padding: 16px 0 16px 24px;
    position: relative;
    color: #1266B6;
    font-weight: bold;
    width: fit-content;
    padding-right: 3rem;
    margin: 0 auto;
    font-size: 18px;
  }
  .ham-service > a::before{
    content: "";
    position: absolute;
    right: 1rem;
    width: 1rem;
    height: 1rem;
    background: url(./images/ham-arrow.png) no-repeat center/contain;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
  }
  .ham-service-link{
    max-width: 700px;
    margin: 0 auto;
    width: 80%;
  }
  .contact-banner{
    width: 90%;
  }
  .new-cta{
   background: linear-gradient(to bottom, #003F74, #0061A8);
  }
  .introduce .tab-container .tab-list{
    gap: 1.5rem;
  }
  .introduce .tab-item{
    font-size: 14px;
  }
  .top-function .container{
    width: 90%;
  }
  .top-function .content-box:last-child .function-title p {
    font-size: 10px;
  }
  .fv-right {
    width: 65%;
    right: -8%;
    transform: none;
    max-width: 500px;
  }
  .fv {
    padding: 120px 5% 300px;
  }
  .how-wrap > .how-img{
    display: none;
  }
  .how-img-wrap{
    display: flex;
    width: 100%;
    justify-content: space-between;
    max-width: 400px;
  }
  .how-img{
    width: 47.5%;
  }
  .how-wrap{
    flex-direction: column;
    gap: 2.5rem;
    align-items: center;
  }
  .how video{
    width: 100%;
  }
  .top-service-item-wrap{
    flex-wrap: wrap;
    gap: 2.5rem 5%;
    justify-content: center;
    margin-top: 2.5rem;
  }
  .top-service-item{
    width: 47.5%;
  }
  .top-function .tab-menu div svg {
    width: 2rem;
    height: 2rem;
  }
  .top-function .tab-menu div{
    gap: 1rem;
  }
  .customize .container{
    width: 90%;
  }
  .top-function .tab-menu{
    padding: 1rem 0;
  }
}


@media screen and (max-width: 767px) {
  .introduce .tab-container .tab-list{
    flex-wrap: wrap;
    gap: 1rem 1.5rem;
  }
  .header-left a img{
    width: 125px;
  }
  .icon-btn svg {
    width: 12px;
  }
  .icon-btn.blue svg{
    width: 16px;
  }
  .icon-btn{
    font-size: 10px;
    padding: 2px;
    width: 70px;
  }
  .new-cta-btn a{
    width: 100%;
  }
  .customize-txt{
    width: 80%;
  }
  .customize-img{
    width: 100%;
    margin: 0;
  }
  .footer .copyright{
    padding: 0 5%;
  }
  .footer{
    padding: 2rem 0 1.5rem;
  }
  .footer-img{
    padding: 1rem 5% 0;
    margin-top: 3.5rem;
  }
  .footer-wrap > .footer-ul, .footer-nav1 > ul{
    gap: 5%;
  }
  .footer-nav1 > ul,
  .footer-nav2 ul{
    flex-direction: column;
    gap: 20px;
  }
  .footer-nav1,
  .footer-nav{
    width: 47.5%;
  }
  .footer-link{
    margin-top: 2rem;
  }
  .ham-service-link{
    width: 90%;
  }
  .ham-service {
    padding: 0rem 0% 1rem;
  }
  .contact-banner{
    flex-direction: column;
    gap: 0.5rem;
    padding: 1rem 5%;
    border-radius: 10px;
    margin: 2.5rem auto ;
  }
  .contact-banner img {
    width: 47%;
  }
  .contact-banner-txt{
    width: 100%;
  }
  .contact-banner img:last-child{
    margin: 1rem 0 0 auto;
  }
  .contact-banner-txt a{
    padding: 14px 3rem;
  }
  .contact-banner-txt > p {
    margin: 8px 0 20px;
  }
  .new-cta-btn a svg{
    width: 2.5rem;
  }
  .new-cta-btn a{
    padding: 8px 0.5rem;
    gap: 1.5rem;
  }
  .filter-results{
    width: 100%;
  }
  .blue-btn{
    padding: 16px 2.5rem;
  }
  .home .filter-results-item:nth-child(4){
    display: none;
  }
  .top-news{
    margin: 7.5rem 0 5rem;
    padding: 0;
  }
  .top-news .top-news-list ul.newsList a{
    padding: 0px 4px;
    font-size: 10px;
  }
  .top-news .top-news-list ul.newsList li:nth-child(2){
    margin: 4px 0;
  }
  .top-news .top-news-list ul.newsList li:last-child{
    font-size: 12px;
  }
  .top-news .news-thumb{
    width: 35%;
  }
  .top-news .top-news-list ul.newsList{
    width: 63%;
    font-size: 10px;
    padding-bottom: 6px;
  }
  .introduce .content_area{
    gap: 2rem;
  }
  .introduce .tab-item{
    margin: 0;
  }
  .filter-results-item{
    padding: 0;
  }
  .introduce::before{
    height: 85%;
  }
  .service-banner{
    width: 90%;
    margin: 3.5rem auto 0;
    padding: 2.5rem 0;
    border-radius: 10px;
  }
  .service-banner .blue-btn.orange{
    margin-top: 20px;
  }
  .function-wrap:not(:nth-child(3)){
    margin-bottom: 3.5rem;
  }
  .function-wrap, .function-wrap:nth-child(2){
    padding: 2rem 5% 0;
  }
  .function-wrap{
    overflow: hidden;
  }
  .function-img .sub{
    width: 60%;
  }
  .function-img .sub3{
    width: 55%;
  }
  .function-img .sub5{
    width: 100%;
  }
  .function-title div{
    padding: 0.7rem 0.5rem 0;
    left: -2.5%;
  }
  .function-title h3 {
    padding-left: 12%;
  }
  .function-txt {
    width: 100%;
  }
  .function-title{
    margin-bottom: 2rem;
  }
  .function-txt p:not(:last-child) {
    margin-bottom: 1rem;
  }
  .top-function .tab-list{
    gap: 1rem 0;
    justify-content: space-between;
  }
  .top-function .tab-menu{
    width: 31%;
    border-width: 2px;
    padding: 0.5rem 4px;
    font-size: 12px;
  }
  .top-function .tab-menu div{
    flex-direction: column;
    gap: 0.5rem;
  }
  .top-function{
    margin-top: 7.5rem;
  }
  .customize-ex-wrap{
    flex-direction: column;
    align-items: center;
    gap: 2.5rem;
    margin-top: 2.5rem;
  }
  .customize-ex-item{
    width: 100%;
  }
  .customize-ex {
    padding: 2rem 5% 2.5rem;
  }
  .customize-blue-txt{
    width: 100%;
    padding: 1.5rem 1rem;
    font-size: 18px;
    margin: 2rem auto 2.5rem;
  }
  .customize-img-wrap{
    gap: 2rem;
  }
  .customize{
    margin-top: 3.5rem;
  }
  .top-service-item{
    width: 100%;
    padding: 2rem 1rem 1rem;
  }
  .blue-bg{
    padding-top: 3.5rem;
  }
  .top-service-item .blue-btn{
    padding: 10px 2rem 10px 2.5rem;
    margin-top: 20px;
  }
  .top-service-item-head p{
    padding: 3px 10px;
  }
  .top-service-item img{
    margin: 1rem auto 0;
  }
  .top-service-item::before,
  .top-service-btn > div::before{
    height: 1rem;
  }
  .top-service-btn > div{
    width: 90%;
    padding: 1rem 5%;
  }
  .top-service-btn > div:first-child{
    margin: 0;
  }
  .top-service-btn > div a{
    margin-top: 8px;
  }
  .top-service-btn{
    gap: 1.5rem;
  }
  .top-service-txt img{
    margin-top: 8px;
  }
  .top-about{
    margin-bottom: 5rem;
  }
  .top-about h3 + img{
    width: 230px;
    margin: 1rem auto 1.5rem;
  }
  .top-about-wrap img:nth-child(2){
    position: relative;
    top: auto;
    left: auto;
    transform: none;
  }
  .top-about-wrap{
    flex-direction: column;
    align-items: center;
  }
  .top-about-wrap img{
    width: 100%;
  }
  .top-about-wrap img:nth-child(3){
    width: 65%;
    margin: -15% 0 -10%;
  }
  .top-about-wrap img:nth-child(4){
    width: 100%;
  }
  .how {
    padding: 2rem 0;
    background: url(./images/how-bg-sp.png) no-repeat center/cover;
  }
  .how-wrap{
    gap: 1.5rem;
  }
  .top-archive{
    margin: 2rem 0;
  }
  .top-archive > img {
    width: 80%;
  }
  .loopSlide {
    height: 80px;
    transform: scale(8);
  }
  .fv-right{
    position: relative;
    right: auto;
    top: auto;
    width: 100%;
    transform: translateY(0%);
    margin-bottom: -10%;
    }
  .fv-right.fadeUp{
    transform: translateY(-10%);
  }
  .fv-wrap{
    flex-direction: column;
  }
  .fv{
    padding: 2.5rem 0 0;
  }
  .fv-left{
    width: 100%;
    padding: 0 0 0 2.5%;
  }
  .hamburger-menu .header-btn{
    flex-direction: column;
    align-items: center;
    gap: 1rem;
  }
  .hamburger-menu .new-btn{
    font-size: 20px;
  }
  .fv h1{
    margin: 0.5rem 0;
  }
  .top-about2.fadeUp{
    animation-delay: 0.5s;
  }

}

.home #breadcrumbs{
  display: none !important;
}

.fv{
  margin-top: 7.5rem;
}

@media screen and (max-width: 1024px) {
  .fv{
    margin-top: 4rem;
  }
}




.top-bpo-btn{
  display: flex;
  justify-content: space-between;
}

.top-bpo-btn div{
  padding: 8px;
  border-radius: 20px;
  box-shadow: 0px 3px 6px rgba(0,0,0,0.55);
  text-align: center;
  width: 47.5%;
  color: #fff;
  background: linear-gradient(to right bottom, #FFCB00, #FC7F02);
}

.top-bpo-btn div:last-child{
  background: linear-gradient(to right bottom, #B385E2, #7A5BBF);
}

.top-service-item .top-bpo-btn .blue-btn{
  margin: 8px auto 0;
  padding: 8px;
  background-color: #fff;
  color: #F8A213;
  font-size: 1rem;
}

.top-service-item .top-bpo-btn .blue-btn:hover{
    background: #F8A213;
    color: #fff;
}

.top-service-item .top-bpo-btn div:last-child .blue-btn{
  color: #7C5CC0;
}

.top-service-item .top-bpo-btn div:last-child .blue-btn:hover{
    background: #7E5BC0;
    color: #fff;
}

@media screen and (max-width: 1024px) {
  .top-bpo-btn{
    padding:0 5%;
  }
}

@media screen and (max-width: 767px) {
  .top-bpo-btn{
    padding:0;
    margin-top: 1rem;
  }
}