

@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

* {
  box-sizing: border-box;
  font-family: "Noto Sans JP", sans-serif;
}

body {
  margin: 0;
  color: #666666;
  background: #fff;
  overflow-x:hidden ;
  font-weight: 400;
}

p{font-size: 16px;}

svg {
  width: 100%;
}

button{
  background-color: transparent;
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
}


.fade-in {
  opacity: 0;
  transform: translateY(20px);
  transition: 1s;
}

.fade-in.show {
  opacity: 1;
  transform: translateY(0);
}

.fade-in_02 {
  opacity: 0;
  transform: translateY(20px);
  transition: 1s;
}

.fade-in_02.show {
  opacity: 1;
  transform: translateY(0);
}

html.is-fixed,
body.is-fixed {
  overflow: hidden;
}

.HKGrotesk{font-family: "Hanken Grotesk", sans-serif;}
.NotoSans{font-family: "Noto Sans JP", sans-serif;}

.wrap {
  width: 90%;
  max-width: 1200px;
  margin: auto;
}

.arrow_svg {
  width: 25px;
}

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

  p{font-size: 14px;}


}

/* ================================================================================================================

共通タイトル

================================================================================================================ */



/* ================================================================================================================

header

================================================================================================================ */


.header {
  padding: 30px 0;
}

header .inner {
  display: flex;
  align-items: center;
  gap: 50px;
}

.logo {
  margin: 0;
  width: 145px;
}

.nav {
  display: flex;
  gap: 30px;
}


.nav a {
  position: relative;
  display: block;
  padding: 5px 0;
  transition: 0.3s;
  text-decoration: none;
  font-size: 13px;
  font-weight: 400;
  color: #666666;
}

.nav a::after {
  position: absolute;
  background: #666666;
  bottom: 0;
  left: 0;
  content: "";
  width: 100%;
  height: 2px;
  transform: scale(0, 1);
  transform-origin: right top;
  transition: transform 0.3s;
}

.nav a:hover::after {
  transform: scale(1, 1);
  transform-origin: left top;
}


#hamburger_button_01 {
  position: fixed;
  top: 20px;
  right: 5%;
  width: 50px;
  height: 50px;
  background-color: #fff;
  border-radius: 10px;
  transition: 0.3s;
  z-index: 1000;
}
#hamburger_button_01 span {
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 50%;
  height: 2px;
  background-color: #000;
  border-radius: 4px;
  transition: 0.5s;
}
#hamburger_button_01 .line_01 {top: 33%;}
#hamburger_button_01 .line_02 {top: 50%; left: 45%; transform: translate(-50%, -50%); width: 40%;}
#hamburger_button_01 .line_03 {bottom: 33%;}
#hamburger_menu_01 {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100vh;
  overflow: auto;
  background-color: #fff;
  transition: 0.5s;
  z-index: 999;
  padding: 50px;
}
.hamburger_button_01_line_02_anim {
  width: 40% !important;
  left: 30% !important;
}
.hamburger_menu_01_anim {right: 0 !important;}


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

  #hamburger_menu_01 nav{
    position: relative;
    display: block;
    margin-top: 50px;
    background-color: #F5F5F5;
    padding:8% 8% 25% 8%;
    border-radius: 30px;
    font-size: 20px;
  }
  #hamburger_menu_01 nav .hamburger_logo{
    position: absolute;
    right: 0;
    width: 80%;
  }
    #hamburger_menu_01 nav .hamburger_logo img{width: 100%;}

}

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

  #hamburger_menu_01{
    padding: 30px;
  }

}

/* ================================================================================================================

footer

================================================================================================================ */

.footer {
  position: relative;
  background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
  color: #fff;
  padding: 80px 60px 0; /* 下は余白消す */
  overflow: hidden;
}

.footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  max-width: 1500px;
  margin: 0 auto 100px;
}

.footer-left {
  max-width: 500px;
}

.footer .logo {
  margin-bottom: 20px;
}

.link{  margin-bottom: 6px;}

.link a{
  font-size: 14px;
  opacity: 0.9;
  cursor: pointer;
  text-decoration: none;
  color: #fff;
}

.link a:hover{opacity: 0.8;}

.company {
  margin-top: 40px;
  font-size: 14px;
  line-height: 1.6;
  opacity: 0.9;
}

.company p{  margin-bottom: 0;}

.footer-right {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.footer-inner .card {
  background: #fff;
  color: #A3DBB5;
  border-radius: 12px;
  padding:64px 28px;
  width: 260px;
  height: 100px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
}

.footer-inner a{text-decoration: none;}

.footer-inner .card-title {
  font-weight: 500;
  font-size: 22px;
  margin-bottom: 0;
  color: #A3DBB5;
}

.footer-inner  .card-sub {
  font-size: 14px;
  margin-top: 4px;
}



.footer-bg-text {
  width: 100%;
  line-height: 0;
  max-width: 1500px;
  margin: 0 auto 100px;
}

.footer-bg-text img {
  width: 100%;
  height: auto;
  display: block;
}

.foot_button .card,
.foot_button svg circle,
.foot_button svg path,
.foot_button .card-title {
  transition: .3s;
}

.foot_button:hover .card-title {
  color: #fff;
}

.foot_button:hover .card {
  background-color: #A3DBB5;
  color: #fff;
}

.foot_button:hover svg circle {
  fill: #fff;
}

.foot_button:hover svg path {
  stroke: #A3DBB5;
}

@media (max-width: 1080px) {

  .footer-inner {display: block;}
  .footer-right{flex-direction:inherit;margin-top: 30px;}
  .footer-inner .card{width: 40vw;height: 140px;}
}


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

  .footer {padding: 90px 30px 0;}

.footer-right{display: block;}
.footer-inner .card{width: 100%;margin-bottom: 10px;}

}


/* ================================================================================================================

ロード後アニメーション

================================================================================================================ */


.img_wrap {
    position: fixed;
    inset: 0;
    height: 100svh;
    background-color: #fff;
    z-index: 9999;
    overflow: hidden;
}

.img_wrap svg {
    position: absolute;
    top: 48%;
    left: 50%;
    width: min(80vw, 606px);
    height: auto;
    transform: translate(-50%, -50%) scale(1);
    transform-origin: 60% 73%;
}

.img_wrap.loaded svg {
    animation: logoZoomOut 2.5s ease 1s forwards;
}

.img_wrap.loaded {
    animation: wrapFadeOut 1s ease 2.5s forwards;
}

@keyframes logoZoomOut {
    0% {
        transform: translate(-50%, -50%) scale(1);
    }

    100% {
        transform: translate(-50%, -50%) scale(60);
    }
}

@keyframes wrapFadeOut {
    0% {
        opacity: 1;
        visibility: visible;
    }

    100% {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }
}




/* ================================================================================================================

fv

================================================================================================================ */



.hero {
  position: relative;
  overflow: hidden;
}

.slider{
  overflow: hidden;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}


.slider-track{
  display: flex;
  gap: 20px;
  width: max-content;

  animation: scroll 30s linear infinite;
}

.card{
  width: min(30vw, 400px);
  aspect-ratio: 345 / 460;
  border-radius: 30px;
  overflow: hidden;
  flex-shrink: 0;
}

.card img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@keyframes scroll{
    from{
        transform: translateX(0);
    }
    to{
        transform: translateX(calc(-50% - 10px));
    }
}



.copy {
  position: relative;
  z-index: 2;
  text-align: center;
  margin-top: 80px;
}

/*SVGアニメーション（点々付与）*/
.dot {
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
}

.fade-in.show .dot01 {
    animation: dotFade .6s ease 0.6s forwards;
}

.fade-in.show .dot02 {
    animation: dotFade .6s ease 1.1s forwards;
}

.fade-in.show .dot03 {
    animation: dotFade .6s ease 1.6s forwards;
}

.fade-in.show .dot04 {
    animation: dotFade .6s ease 2.1s forwards;
}

@keyframes dotFade {
    0% {
        opacity: 0;
        transform: translateY(20px) scale(0);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}








.text {
  margin-top: 34px;
  font-size: 16px;
  line-height: 1.9;
}

.bg-text {
margin-top: 60px;
}

.fvtitle{
  max-width: 600px;
  width: 90%;
  margin: auto;
}

@media (max-width: 1080px) {

  .slider {
    gap: 14px;
  }

  .card {
    width: 260px;
    height: 360px;
  }

  .copy {
    margin-top: 56px;
    padding: 0 20px;
  }

  .text {
    font-size: 14px;
  }


  .fvtitle{
  max-width: 500px;
  width: 90%;

}


}





/* ===== Aの左右ゆらゆら ===== */

.a-letter{
    transform-box: fill-box;
    transform-origin: center bottom;
    animation: swayA 2s ease-in-out infinite;
}

@keyframes swayA{
    0%,100%{
        transform: rotate(0deg);
    }

    25%{
        transform: rotate(-8deg);
    }

    50%{
        transform: rotate(0deg);
    }

    75%{
        transform: rotate(8deg);
    }
}


/* ===== Hのジャンプ ===== */

.h-letter{
    transform-box: fill-box;
    transform-origin: center bottom;
    animation: jumpH 2s ease-in-out infinite;
    animation-delay: .8s;
}

@keyframes jumpH{

    0%,80%,100%{
        transform: translateY(0);
    }

    87%{
        transform: translateY(-18px);
    }

    93%{
        transform: translateY(2px);
    }

    96%{
        transform: translateY(-1px);
    }

    100%{
        transform: translateY(0);
    }

}





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

  .text{text-align: left;margin-top: 10px;}
  .bg-text {margin-top: 30px;}

}


/* ================================================================================================================

about

================================================================================================================ */

.about{
    margin: 30px 20px;
    padding: 140px 20px 120px;
    overflow: hidden;
    border-radius: 30px;
    background:
    linear-gradient(
        90deg,
        #435897 0%,
        #62B4DA 50%,
        #A0D7A8 100%
    );
}

.section_anim {
    transform: scale(0.85);
    transition: 0.8s;
}

.section_anim_active {
    transform: scale(1);
}


.about_inner{
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: auto;
    text-align: center;
}

.about_sub{
    color: #fff;
    font-size: 28px;
    letter-spacing: 10px;
    font-weight: 200;
    margin-bottom: 40px;
}

.aboutpage_title{
  margin-bottom: 50px;
}

.aboutpage_title svg {
    width: 80%;
    max-width: 550px;
    margin: auto;
}

/* SVGアニメーション（点々） */
.about_dot{
    opacity: 0;
    transform-box: fill-box;
    transform-origin: center;
}

.about-fade-in.show .about_dot_dot01{
    animation: aboutDotFade .6s ease .6s forwards;
}

.about-fade-in.show .about_dot_dot02{
    animation: aboutDotFade .6s ease 1.1s forwards;
}

.about-fade-in.show .about_dot_dot03{
    animation: aboutDotFade .6s ease 1.6s forwards;
}

.about-fade-in.show .about_dot_dot04{
    animation: aboutDotFade .6s ease 2.1s forwards;
}

.about-fade-in.show .about_dot_dot05{
    animation: aboutDotFade .6s ease 2.6s forwards;
}

@keyframes aboutDotFade{
    0%{
        opacity: 0;
        transform: translate(0,20px) scale(0);
    }

    100%{
        opacity: 1;
        transform: translate(0,0) scale(1);
    }
}




.about_text{
    color:#fff;
    line-height: 2;
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 70px;
}

.about_card{

    max-width: 800px;
    width: 90%;
    margin: auto  auto 70px;
    padding: 60px 60px 100px;
    background: #fff;
    border-radius: 30px;
}

.about_card_title{
      color: #666666;
    font-size: 28px;
    letter-spacing: 10px;
    font-weight: 300;
    line-height: 1.3;
    margin-top: 20px;
}

.about_card img{width: 100%;}

.about_card_txt{margin-bottom: 40px;}

.read-more_btn{
  position: relative;
  width: 250px;
  height: 64px;
  margin: auto;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#455699;
  border-radius:50px;
  border: solid 2px #455699;
  color: #fff;
  text-decoration:none;
  font-weight:700;
  transition:.3s;
}

.read-more_btn::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  box-sizing: border-box;
  transition:.3s;
}

.read-more_btn:hover{
  background: #fff;
  color: #455699;
}

.read-more_btn:hover::after {
  right: 20px;
  border-top: 2px solid #455699;
  border-right: 2px solid #455699;
}


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

  .about{padding: 80px 0;}
  .about_inner{width: 85%;}
  .about_sub{font-size: 22px;letter-spacing: 5px;margin-bottom: 20px;}
  .aboutpage_title{margin-bottom: 30px;}
  .about_text{font-size: 16px;text-align: left;margin-bottom: 40px;}
  .about_card {max-width: 800px;width: 100%;padding: 40px 30px 100px;}
  .about_card_title {font-size: 22px;letter-spacing: 5px;}
  .about_card_txt{text-align: left;}
  
  
}


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

  .about{margin: 0;}
  .about_sub{font-size: 20px;margin-bottom: 15px;}
  .kyotupage_title{margin-bottom: 20px;}
  .about_text{font-size: 14px;line-height: 1.5;}
  .about_card{padding: 40px 20px 60px;}

}




/* ================================================================================================================

style

================================================================================================================ */


.style-section {
  padding: 80px 20px 100px;
  background: #fff;
}

.style-inner {
  max-width: 860px;
  margin: 0 auto;
  text-align: center;
}

.style-heading {
  margin-bottom: 56px;
}

.style-heading-ja {
  margin: 0 auto 8px;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: 0.06em;
  width: fit-content;
  background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.style-heading h2 {
  font-family: "Hanken Grotesk", sans-serif;
  margin: 0 auto;
  font-size: 62px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.04em;
  width: fit-content;
  background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.style-main-img {
  max-width: 680px;
  margin: 0 auto;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 18px 40px rgba(70, 90, 120, 0.16);
}

.style-main-img img {
  width: 100%;
  display: block;
}

.style-lead {
  margin: 62px 0 90px;
  color: #666;
  line-height: 2;
}

.style-check {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 28px;
}

.style-check-text {
  position: relative;
  margin: 0;
  font-size: 18px;
  line-height: 1.45;
}

.style-check-text span {
  display: block;
}

.style-check-text::before,
.style-check-text::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 2px;
  height: 38px;
  background: currentColor;
}

.style-check-text::before {
  left: 42px;
  transform: translateY(-50%) rotate(-14deg);
}

.style-check-text::after {
  right: 42px;
  transform: translateY(-50%) rotate(14deg);
}

.style-check-light {
  color: #8acdea;
}

.style-check-dark {
  color: #3f5596;
}

.style-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.style-card {
  position: relative;
  height: 260px;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  overflow: hidden;
}

.style-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  transition: .3s;
}

.style-card-light::before {
  background: rgba(75, 180, 220, 0.72);
}

.style-card-dark::before {
  background: rgba(45, 64, 130, 0.72);
}

.style-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: .3s;
}

.style-card:hover img {
  transform: scale(1.1);
}

.style-card.style-card-light:hover::before {
  background: rgb(43 119 148 / 72%);
}

.style-card.style-card-dark:hover::before {
  background: rgb(17 24 49 / 72%);
}


.style-card span {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 28px;
  font-weight: 500;
  line-height: 1;
}

.style-card span::after {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  background: url("../img/style-card_yaji01.svg") center center / contain no-repeat;
}

.style-card-dark span::after {
  background: url("../img/style-card_yaji02.svg") center center / contain no-repeat;}



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

  .style-section{padding: 0;margin: 100px 0;}
  .style-inner{width: 85%;}

  .style-heading-ja {font-size: 24px;}
  .style-heading h2{font-size: 47px;}
  .style-lead{text-align: left;margin: 30px 0 70px;line-height: 1.5;}

  .style-check,.style-cards{display: block;}
  .style-check{margin: 20px 0 15px;}


}


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

  .style-heading h2{font-size: 40px;}
  .style-heading-ja{font-size: 20px;}
  .style-section {margin: 60px 0;}

  .style-card span{font-size: 22px;}
  .style-card{height: 210px;}
  .style-check-text{font-size: 16px;}

}




/* ================================================================================================================

feature-section

================================================================================================================ */


.feature-section {
  margin: 30px 20px;
  padding-top: 100px;
  padding-bottom: 150px;
  background: #f8f8f8;
  border-radius: 30px;
}

.feature-inner {
  max-width: 1080px;
  margin: 0 auto;
}

.feature-heading {
  text-align: center;
  margin-bottom: 70px;
}

.feature-heading h2 {
  margin: 0 auto 18px;
  font-size: 42px;
  font-weight: 800;
  width: fit-content;
  background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.feature-heading p {
  margin: 0;
  color: #666;
  font-size: 16px;
  line-height: 1.8;
}

.feature-list {
  display: flex;
  flex-direction: column;
  gap: 48px;
}

.feature-card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
  padding: 70px 50px;
  background: #fff;
  border-radius: 24px;
  box-shadow: 0 16px 40px rgba(80, 90, 110, 0.06);
}

.feature-img {
  overflow: hidden;
}

.feature-img img {
  width: 100%;
  display: block;
}

.feature-content {
  text-align: left;
}

.feature-en {
  margin: 0 0 5px;
  color: #AFB5CD;
  font-size: 14px;
}

.feature-content h3 {
  margin: 0 0 28px;
  color: #3B4C82;
  font-size: 32px;
  line-height: 1.35;
  font-weight: 600;
}

.feature-content > p:not(.feature-en) {
  margin: 0;
  color: #666666;
  font-size: 16px;
  line-height: 1.5;
}

.feature-btn {
  position: relative;
  width: 210px;
  height: 54px;
  margin: 90px auto 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    #3D5292 0%,
    #5DAFDC 25%,
    #A4DBB4 50%,
    #5DAFDC 75%,
    #3D5292 100%
  );
  background-size: 200% 100%;
  background-position: left center;
  color: #fff;
  text-decoration: none;
  font-size: 15px;
  font-weight: 700;
  transition: background-position .5s ease;
}

.feature-btn::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  box-sizing: border-box;
  transition: .3s;
}

.feature-btn:hover {
  background-position: right center;
}

.feature-btn:hover::after {
  right: 20px;
}

.feature-btn img {
  width: 14px;
  height: 14px;
}



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


.feature-section{padding-top: 70px;}
.feature-card{display: block;margin-bottom: 50px;padding: 40px 30px;}
.feature-list{display: block;width: 90%;margin: auto;}

.feature-content{margin-top: 20px;}
.feature-content h3{font-size: 28px;}

}

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

.feature-section{margin: 0; padding-top: 50px;}
.feature-heading h2{font-size: 32px;}
.feature-heading {margin-bottom: 40px;}
.feature-content h3{font-size: 22px;}

.feature-btn{margin: 20px auto 0;}

}





/* ================================================================================================================

media

================================================================================================================ */

.content-inner {
  max-width: 980px;
  margin: 0 auto;
}

.interview-section {
  padding: 140px 20px 120px;
}

.media-section {
  padding: 80px 20px 160px;
}

.interview-section .read-more_btn,
.media-section .read-more_btn {
  margin-top: 70px;
}

.section-heading {
  text-align: center;
  margin-bottom: 70px;
}

.section-heading h2 {
  margin: 0 auto 14px;
  font-size: 48px;
  line-height: 1;
  font-weight: 800;
  width: fit-content;
  background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.section-heading p {
  margin: 0;
  color: #666666;
  font-size: 16px;
  line-height: 1.5;
}

/* Interview */
.interview-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.arrow_svg circle,
.arrow_svg path {
  transition: .3s;
}

.interview-card:hover circle,
.media-card:hover circle {
  fill: #3b4c82;
}

.interview-card:hover path,
.media-card:hover path {
  stroke: #f5f5f5;
}

.interview-card {
  display: block;
  color: inherit;
  text-decoration: none;
}

.interview-card {
  display: block;
  color: inherit;
  text-decoration: none;
}

.interview-card .interview-img_wrap {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  margin-bottom: 20px;
}

.interview-card .interview-img_wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: .3s;
  z-index: 1;
}

.interview-card .interview-img_wrap > img {
  width: 100%;
  aspect-ratio: 310 / 180;
  object-fit: cover;
  display: block;
  transition: .3s;
}

.interview-card:hover .interview-img_wrap::after {
  background: rgba(59, 76, 130, .3);
}

.interview-card:hover .interview-img_wrap > img {
  transform: scale(1.1);
}

.case {
  margin: 0 ;
  font-size: 12px;
  font-weight: 800;
  width: fit-content;
  background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 共通タイトル */
.card-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #666666;
  font-size: 17px;
}

.card-title span {
  line-height: 1.5;
}

.card-title img {
  width: 26px;
  height: 26px;
  flex-shrink: 0;
}

/* Media */
.media-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 54px 24px;
}

.media-card {
  display: block;
  color: inherit;
  text-decoration: none;
}

.media-card .media-img_wrap {
  position: relative;
  overflow: hidden;
  border-radius: 16px;
  margin-bottom: 20px;
}

.media-card .media-img_wrap::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: .3s;
  z-index: 1;
}

.media-card .media-img_wrap > img {
  width: 100%;
  aspect-ratio: 470 / 238;
  object-fit: cover;
  display: block;
  transition: .3s;
}

.media-card:hover .media-img_wrap::after {
  background: rgba(0, 0, 0, .3);
}

.media-card:hover .media-img_wrap > img {
  transform: scale(1.1);
}

/* Button */
.more-btn {
  width: 230px;
  height: 56px;
  margin: 70px auto 0;

  text-decoration: none;

}

.more-btn img {
  width: 14px;
  height: 14px;
}

@media screen and ( max-width:1079px) {
  .interview-section,.media-section {padding:0;}

  .content-inner{width: 80%;}

  .section-heading {
    margin-bottom: 44px;
    margin-top: 70px;
  }

  .section-heading h2 {
    font-size: 38px;
  }

  .interview-list,
  .media-list {
    grid-template-columns: 1fr;
    gap: 34px;
  }

  .more-btn {
    margin-top: 56px;
  }
}


/* ================================================================================================================

faq

================================================================================================================ */

.faq {margin: 30px 20px;}

.faq_wrap {
  display: block;
  text-decoration: none;
  overflow: hidden;
  border-radius: 30px;
}

.faq_inner {
  position: relative;
  display: block;
  margin: auto;
  padding: 120px 80px 230px;
  background: #F7F7F7;
  overflow: hidden;
  transition: .3s;
}

.faq_inner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0);
  transition: .3s;
  z-index: 1;
  pointer-events: none;
}

.faq_content,
.faq_bg_text {
  position: relative;
  z-index: 2;
}

.faq_wrap:hover .faq_inner {
  transform: scale(1.05);
}

.faq_wrap:hover .faq_inner::after {
  background: rgba(102, 102, 102, 0.1);
}

.faq_content {
    position: relative;
    z-index: 2;
    max-width: 700px;
}

.faq_title {
    line-height: 1.2;
    font-size: 82px;
    width: fit-content;
    font-family: "Hanken Grotesk", sans-serif;
    font-weight: 800;
    background: linear-gradient(135deg, #3B4C82, #58ADD5, #A3DBB5);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-decoration: none;
}

.faq_text_wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.faq_text {
    font-size: 16px;
    line-height: 2;
    color: #666;
    margin-bottom: 0;
}

.faq_text_wrap .arrow_svg {
  flex-shrink: 0;
}

.faq_text_wrap .arrow_svg circle {
  fill: #3b4c82;
}

.faq_text_wrap .arrow_svg path {
  stroke: #f5f5f5;
}

/* Button */


.faq_btn img {
  width: 26px;
  height: 26px;
}


.faq_bg_text {
    position: absolute;
    right: -30px;
    bottom: 50px;
    line-height: 1;
}



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

  .faq_inner{padding: 50px 30px 170px;}
  .faq_text {font-size: 14px;line-height: 1.5;}
  .faq_title {font-size: 62px;}
  .faq_btn img {width: 32px;height: 32px;}



}



/* ================================================================================================================

パートナー募集

================================================================================================================ */

.partner{
  position: relative;
  background-image: url(../img/recruitment_bk.jpg);
  background-size: cover;
  background-position: top center;
  border-radius: 30px;
  padding: 60px 0 200px;
  margin: 30px 20px;
}

.partner-inner{
  max-width: 1080px;
  width: 100%;
  margin: auto;
  text-align: center;
}

.partner-inner h2{
  color: #FFF;
  text-align: center;
  text-shadow: 0 0 45px #000;
  font-size: 52px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin-top: 280px;
}


.partner-title {
  font-size: 28px;
  font-weight: bold;
  letter-spacing: 2px;
  background: linear-gradient(90deg, #3B4C82 0%, #58ADD5 48.56%, #A3DBB5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}



.partner-inner-btn {
  position: relative;
  margin: auto;
  display:block;
  padding: 14px 20px;
  min-width: 340px;
  background-color: #EC7016;
  border: solid 2px #EC7016;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  border-radius: 9999px;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease;
  margin-top: 30px;
  width: fit-content;
  box-sizing: border-box;
  text-decoration: none;
  transition: .3s;
}

.partner-inner-btn::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  box-sizing: border-box;
  transition: .3s;
}

.partner-inner-btn:hover {
  background-color: #fff;
  color: #EC7016;
}

.partner-inner-btn:hover::after {
  right: 20px;
  border-top: 2px solid #EC7016;
  border-right: 2px solid #EC7016;
}



.part-btn:hover{opacity: 0.9;transition: 0.3s;color: #fff;}




/*LINE登録*/

.partner3{
  background-color: #06C755;
  padding: 30px 0 30px;
  margin: 30px 20px;
  border-radius: 30px;
  text-align: center;
}



.partner3 .partner-title{
  margin-top: -20px;
  color: #fff;
  background: inherit;
}

.partner-title2 {
  font-size: 42px;
  line-height: 1.2;
  font-weight: bold;
  letter-spacing: 2px;
  color: #fff;
}

.partner-inner2 p{
  margin-top: 13px;
  color: #fff;
}

.partner-inner2 img{
  margin: 40px auto 0;
  border: 2px solid #fff;
  border-radius: 30px;
}

.partner-inner2 a{text-decoration: none;}


.part-btn {
  margin: auto;
  display:flex;
  align-items: center;
  justify-content: center;
  gap: 20px;

  padding: 14px 20px;
  min-width: 340px;

  background-color: #EC7016; 
  color: #ffffff;

  font-size: 16px;
  font-weight: 600;

  border: none;
  border-radius: 9999px;

  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease;

  margin-top: 30px;
  width: fit-content;
  box-sizing: border-box;
}

.partner3 .part-btn{

    background-color: #fff; 
    color: #06C755;

}

.part-btn:hover{opacity: 0.9;transition: 0.3s;color: #31DD77;}


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

  .partner{
    position: relative;
    z-index: 10;
    padding: 20px 0 280px;
  }

  .partner-title {font-size: 24px;}
  .partner-inner h2{margin-top: 210px;font-size: 28px;}
  .partner-inner2 {padding: 10% 5%;width: 80%;margin: auto;}
  .partner-inner2 p{text-align: left;}

  .partner-inner2 img{width: 80%;}

}

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

   .partner-inner2 img{width: 100%;}
}


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

  .partner{
  background-image: url(../img/recruitment_bk-sp.jpg);
  padding: 30px 0 390px
  }
  .partner-inner h2 {margin-top: 20px;font-size: 22px;}
  .partner-inner2 img {width: 90%;}
  .part-btn {min-width: 240px;}
  .partner-title {font-size: 18px;}
  .partner3 .partner-title2 {font-size: 32px;}


}

/* ================================================================================================================

kyotu

================================================================================================================ */

.kyotu_page{
    padding: 80px 0;
}

.kyotu_inner2 {
    max-width: 1200px;
    margin: 0 auto;
    width: 90%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}

.kyotu_page .about_content {
    max-width: 620px;
}

.kyotupage_head {
    margin-bottom: 70px;
}

.kyotupage_head span {
    display: block;
    margin-bottom: -5px;

    color: #D8D8D8;
    font-size: 16px;
    font-family: "Hanken Grotesk", sans-serif;
}

.kyotupage_head h2 {
    color: #3B4C82;
    font-size: 20px;
    font-weight: 700;
}

.kyotu_page .kyotupage_title {
    margin-bottom: 70px;
    width: fit-content;
    line-height: 1.35;
    font-size: 42px;
    font-weight: 700;

    background: linear-gradient(
        90deg,
        #3B4C82 0%,
        #58ADD5 50%,
        #A3DBB5 100%
    );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.kyotu_page .kyotu_text{
    color: #666;
    font-size: 21px;
    line-height: 1.5;
}

.kyotu_page2 .kyotu_text{
    color: #666;
    font-size: 18px;
    text-align: center;
    line-height: 1.5;
}

.kyotu_page .kyotu_img {
    width: 38%;
    border-radius: 30px;
    overflow: hidden;
}

.kyotu_img img {
    width: 100%;
    display: block;
}

.kyotu_page2 .kyotupage_title2 {
  width: fit-content;
    margin: 20px auto 30px;
    font-size: 34px;
    font-weight: 700;
    background: linear-gradient(
        90deg,
        #3B4C82 0%,
        #58ADD5 50%,
        #A3DBB5 100%
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.kyotu_page2_img{
  width: 90%;
  max-width: 800px;
  margin:100px auto 0;
}

.kyotu_page2_img img{border-radius: 30px;}

.compare-section {
  padding: 40px 0;
}

.compare-inner {
  max-width: 1000px;
  width: 90%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.compare-card {
  background: #f3f3f3;
}

.compare-head {
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 24px;
  font-weight: 600;
}

.compare-card-normal .compare-head {
  background: #595959;
  font-weight: 400;
  font-size: 22px;
}

.compare-card-sherpa .compare-head {
  background: #58add5;
}

.compare-body {
  min-height: 560px;
  padding: 70px 40px 60px;
  text-align: center;
}

.compare-body img {
  width: 100%;
  max-width: 430px;
  margin: 0 auto 48px;
  display: block;
}

.compare-text {
  margin: 0;
  color: #595959;
  font-size: 28px;
  line-height: 1.55;
  font-weight: 500;
}

.compare-card-sherpa .compare-text {
  color: #3B4C82;
  font-size: 32px;
  line-height: 1.35;
  font-weight: 800;
}

.compare-sub {
  margin: 0;
  color: #3B4C82;
  font-size: 22px;
}



.kyotu_page3{
  background-color: #C3DDEC;
  border-radius: 30px;
  margin: 130px 20px;
  text-align: center;
}

.kyotu_inner3{padding-bottom: 140px;}

.kyotu_page3_txt {
    display: flex;
    gap: 20px;
}

.anim_16 {
    display: flex;
    letter-spacing: 0.2em;
    overflow: hidden;
    justify-content: center;
    padding-top: 70px;
    margin-bottom: 5px;
    color: #3B4C82;
}
.anim_16.displayed > span {
    display: inline-block;
    overflow: hidden;
}
.anim_16.displayed > span > span {
    display: inline-block;
    font-size: 24px;
    font-weight: 600;
    transform: translateY(100%);
    animation: anim_16_show 0.8s forwards;
}
@keyframes anim_16_show {
    0% {
        opacity: 0;
        transform: translateY(100%);
    }
    50% {
        opacity: 1;
        transform: translateY(-15%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.kyotu_page3_img_icon{width: 110px;}

.kyotu_page3 h3{
  position: relative;
  font-size: 28px;
  font-weight: 500;
  background-color: #3B4C82;
  padding: 10px;
  width: fit-content;
  margin:-1px auto 0;
  color: #fff;
  z-index: 10;
}

.kyotu_inner4{
  background-color: #fff;
  border-radius: 30px;
  max-width: 1200px;
  width: 90%;
  margin: -30px auto 0
}

.kyotu_inner5{
  display: flex;
  gap: 60px;
  padding: 80px;
  align-items: center;
}

.kyotu_inner5 img{width: 100%;max-width: 535px;}

.kyotu_page3 .feature-btn{
  left: inherit;
  transform: inherit;
  margin: 20px auto 0;
}

.kyotu_inner5_txt{text-align: left;}



.kyotu_wrap{max-width: 1000px;width: 90%;margin:150px auto 0;}
.kyotu_title{font-size: 32px;color: #3B4C82;font-weight: 600;margin-bottom: 20px;line-height: 1.5;}


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

  .kyotu_page{padding: 15px 0 50px;}

  .kyotu_inner2 {display:block;}
  .kyotu_page .about_content {max-width: inherit;}
  .kyotupage_head {margin-bottom: 30px;}
  .kyotu_page .kyotu_img {width: 70%;margin: auto;}
  .kyotu_page .kyotupage_title {font-size: 32px;margin-top: 50px;margin-bottom: 20px;}
  .kyotu_page .kyotu_text {font-size: 18px;}

  .kyotu_page2{width: 90%;margin: auto;}
  .kyotu_page2 .kyotu_text{font-size: 16px;}
  .kyotu_page2 .kyotupage_title2{font-size: 28px;line-height: 1.2;margin: 20px auto 20px;}


  .kyotu_inner5{display: block;}
  .kyotu_inner5 img{max-width: inherit;}
  .kyotu_inner5_txt{margin-top: 30px;}
  .kyotu_page3 .feature-btn {left: 50%;transform: translateX(-50%);}

  .kyotu_page3 h3{font-size: 22px;}

  .kyotu_title{font-size: 28px;}
  .kyotu_wrap {margin: 100px auto 0;}
  .kyotu_page2_img{margin: 20px auto 0;}

}

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

  .compare-inner {font-size: 18px;gap: 10px;}
  .compare-body {padding: 40px 20px 80px;}

  .compare-card-normal .compare-head{font-size: 18px;text-align: center;line-height: 1.2;}
  .compare-text{font-size: 18px;}
  .compare-sub{font-size: 14px;}
  .compare-card-sherpa .compare-text {font-size: 18px;}
  .compare-body img{margin: 0 auto 25px;}
  .compare-body{min-height: inherit;}

  .kyotu_inner5{padding: 80px 40px;}

}

@media screen and (max-width:479px) {
  .kyotu_page{padding: 15px 0 60px;}
  .kyotu_page .kyotu_img {width: 100%;margin: auto;}
  .kyotupage_head {margin-bottom: 20px;}
  .kyotupage_head h2{font-size: 18px;}
  .kyotupage_head span {font-size: 14px;}
  .kyotu_page .kyotupage_title {font-size: 24px;margin-top: 20px;}
  .kyotu_page .kyotu_text {font-size: 16px;}

  .kyotu_page2 .kyotupage_title2{font-size: 24px;text-align: center;}
   .kyotu_page2 .kyotu_text{text-align: left;}
  .compare-section {padding: 0 0 20px;}
  .compare-body {padding: 30px 40px 50px;margin-bottom: 20px;}

  .compare-card-normal .compare-head{font-size: 14px;}
  .compare-head{font-size: 20px;}
  
  .compare-inner{display: block;}

  .kyotu_page3{margin: 0 0 100px;border-radius: 30px 30px 0 0;}
  .kyotu_inner3{padding-bottom: 80px;}
  .kyotu_page3 h3 {font-size: 18px;}
  .kyotu_page3_img_icon {width: 80px;}
  .kyotu_inner5 {padding: 50px 20px;}

  .anim_16{padding-top: 30px;}

  .kyotu_wrap{margin: 50px auto 0;}
  .kyotu_title {font-size: 24px;margin-bottom: 10px;}
  .kyotu_page2_img{width: 100%;}

}



/* ================================================================================================================

active

================================================================================================================ */


.active{
  margin:0 auto 120px;
  width: 90%;
  max-width: 800px;
}


.active_title{
  font-size: 28px;
  width: fit-content;
  margin: auto;
  font-weight: 700;
  background: linear-gradient(
      90deg,
      #3B4C82 0%,
      #58ADD5 50%,
      #A3DBB5 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

}

.active_title2{
  font-family: "Hanken Grotesk", sans-serif;
  font-size: 62px;
  width: fit-content;
  margin: -15px auto 0;
  font-weight: 900;
  background: linear-gradient(
      90deg,
      #3B4C82 0%,
      #58ADD5 50%,
      #A3DBB5 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.active_txt{text-align: center;}

.active-container {
  display: flex;
  gap: 30px;
  justify-content: center;
  margin-top: 50px;
}

.active-card {
  flex: 1;
  background: #F5F5F5;
  border-radius: 10px;
  text-align: center;
}

.active-badge {
  display: inline-block;
  background: var(--Linear, linear-gradient(90deg, #3B4C82 0%, #497AA9 100%));
  color: #fff;
  width: 100%;
  font-size: 26px;
  font-weight: 500;
  padding: 20px 16px;
  border-radius: 10px 10px 0 0;
  box-sizing: border-box;
}

.active-badge.changecolor{background: var(--Linear, linear-gradient(90deg, #497AA9 0%, #A3DBB5 100%));}

.active-card-title {
  font-size: 22px;
  font-weight: 700;
  color: #333;
  margin-bottom: 20px;
}

/* 数字のスタイル */
.number {
  font-size: 84px;
  font-weight: bold;
  color: #fff;
}
.unit { font-size: 42px; font-weight: 600;}
.unit2 { font-size: 32px; align-self: center;font-weight: bold;margin: 10px 5px 0;}


.description {
  font-size: 16px;
  line-height: 1.8;
  color: rgba(255, 255, 255, 0.9);
  max-width: 1080px;
  margin: 0 auto;
}

/* 数字部分のグラデーション */
.active-num-wrap {
  font-weight: 800;
  color: #3B4C82;
  margin-top: 30px;
}

.active .number{
  font-weight: 700;
  color: #3B4C82;
}

.active-card-text {
  font-size: 16px;
  line-height: 1.5;
  color: #666666;
  text-align: left;
  padding: 0 40px;
  box-sizing: border-box;
  margin-bottom: 70px;
}



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


  .mnc-inner{width:47%;}

  .active-container{flex-wrap: wrap;}
  .active-card{flex: none;width: 45%;}
  .active-badge {font-size: 20px;padding: 12px 16px;}

  .number {font-size: 8vw;}

}

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

  .active-container{display: block;}
  .active-card{width: 100%;}

  .active_title{font-size: 22px;}
  .active_title2{font-size: 52px;}
  .active-card-text{padding: 0 40px 60px;margin-bottom: 30px;}

  .active-num-wrap{margin-top: 10px;}

  .number{font-size: 12vw;}
}


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

  .active_title{font-size: 18px;}
  .active_title2{font-size: 32px;}
  .mnc-inner{width:100%;margin-bottom: 30px;}
  .active-badge {font-size: 18px;}
  .active-card-text {padding: 0 30px 30px;font-size: 14px}

  .number{font-size: 15vw;}

}


/* ================================================================================================================

real-estate-side-job

================================================================================================================ */


.flow-section {
  padding: 100px 20px;
}

.flow-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 70px 80px;

  display: grid;
  grid-template-columns: 1fr 90px 1fr 90px 1fr;
  align-items: center;
  gap: 20px;

  background: #f5f5f5;
  border-radius: 28px;
}

.flow-item {
  text-align: center;
}

.flow-img {
  height: 190px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  margin-bottom: 28px;
}

.flow-img img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

.flow-item h3 {
  margin: 0 0 14px;
  color: #3b4c82;
  font-size: 26px;
  font-weight: 600;
}

.flow-item h3.pink {
  color: #f05b83;
}

.flow-item p {
  margin: 0;
  color: #666;
  font-size: 18px;
  line-height: 1.6;
  font-weight: 400;
}

.flow-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flow-arrow img {
  width: 66px;
  display: block;
}

.activitystyle_r,.activitystyle_e{
  background-color: #E0EEF5;
  border-radius: 30px;
  margin: 130px 20px;
  text-align: center;
}


.activity-inner {
  max-width: 1000px;
  width: 90%;
  margin: 0 auto;
  padding: 130px 0;

  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 80px;
  align-items: start;
}

.activity-content {
  padding-top: 20px;
  text-align: left;
}

.activity-en {
  margin: 0 0 18px;
  color: #58add5;
  font-size: 18px;
  font-family: "Hanken Grotesk", sans-serif;
  font-weight: 800;
}

.activity-content h2 {
  margin: 0 0 60px;
  color: #3b4c82;
  font-size: 30px;
  line-height: 1.45;
  font-weight: 800;
}

.activity-lead {
  margin: 0;
  color: #666;
  font-size: 16px;
  line-height: 2;
  font-weight: 400;
}

.activity-cards {
  display: flex;
  flex-direction: column;
  gap: 36px;
}

.activity-card {
  background: #fff;
  padding: 60px 48px 50px;
  text-align: center;
}

.activity-card h3 {
  margin: 0 0 36px;
  color: #3b4c82;
  font-size: 22px;
  line-height: 1.5;
  font-weight: 600;
}

.activity-img {
  height: 150px;
  margin-bottom: 36px;

  display: flex;
  align-items: center;
  justify-content: center;
}

.activity-img img {
  max-width: 100%;
  max-height: 100%;
  display: block;
}

.activity-card p {
  margin: 0;
  color: #666;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 400;
}


.high-standard{
  margin:0 auto 120px;
  width: 90%;
  max-width: 800px;
}


.high-standard_title{
  font-size: 34px;
  text-align: center;
  width: fit-content;
  margin: auto;
  line-height: 1.5;
  font-weight: 700;
  background: linear-gradient(
      90deg,
      #3B4C82 0%,
      #58ADD5 50%,
      #A3DBB5 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

}

.high-standard_txt{text-align: center;margin-top: 20px;}


.high-standard .feature-btn{width: 290px;}


@media (max-width: 1080px) {

  .flow-section {padding:0;width: 70%;margin: 50px auto;}
  .flow-inner {display: block;padding: 30px 0px}
  .flow-arrow {transform: rotate(90deg);}
  .flow-item h3 {font-size: 22px;}
  .flow-item p {font-size: 16px;margin-bottom: 30px;}

  .activity-inner{display: block;}
  .activity-en {margin: 0;}
  .activity-content h2{margin: 0 0 10px;}
  .activity-lead{margin-bottom: 20px;line-height: 1.5;}

  .activity-card{width: 100%;margin: auto;padding: 40px 48px 40px;}
}

@media (max-width: 800px) {

  .flow-section {width: 90%;}
  .activitystyle_r{margin: 20px 0;}

  .high-standard{margin: 100px auto 120px;}
  .high-standard_title{font-size: 30px;}
}

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

.flow-section {width: 90%;}
.flow-img{height: 150px;}
.flow-item h3 {margin: 0 0 5px}
.flow-arrow img {width: 46px;}
.activity-content h2{font-size: 26px;}
.activity-lead{font-size: 14px;}

.activity-inner {padding: 60px 0 100px;}
.activity-card p{font-size: 14px;}


.high-standard_title{font-size: 24px;}
.high-standard_txt {text-align: left;}

.high-standard .feature-btn{margin: 60px auto 0;}


}




/* ================================================================================================================

real-estate-career

================================================================================================================ */

.real-estate-career {
  margin: 80px auto;
  width: 90%;
  max-width: 1000px;
}

.real-estate-career_inner {
  max-width: 1100px;
  margin: 0 auto;
}

.real-estate-career_cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}

.real-estate-career_card {
  position: relative;
  margin-top: 90px;
}

.real-estate-career_body {
  background: #f5f5f5;
  border-radius: 28px;
  padding: 120px 40px 60px;
  text-align: center;
}

.real-estate-career_img {
  position: absolute;
  top: -90px;
  left: 50%;
  transform: translateX(-50%);
  width: 220px;
}

.real-estate-career_img img {
  width: 100%;
  display: block;
}

.real-estate-career_body h3 {
  margin: 0 0 28px;
  color: #3b4c82;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.4;
}

.real-estate-career_body p {
  margin: 0;
  color: #666666;
  font-size: 18px;
}

.activitystyle_e{background-color: #E2E6F5;}

@media (max-width: 1080px) {

  .real-estate-career_inner{margin: 140px auto;}
  .real-estate-career_cards{display: block;}
  
    
}

@media screen and (max-width:479px) {
  .real-estate-career_body p{font-size: 14px;}
  .real-estate-career_body h3 {margin: 0 0 10px;}
  .real-estate-career_img{width: 190px;top: -60px;}
}


/* ================================================================================================================

service

================================================================================================================ */

.service-support {
  padding-top:20px;
}

.service-support_inner {
  max-width: 1040px;
  width: 90%;
  margin: 0 auto;
}

.service-support_img {
 margin: auto;
  width: 120px;

}

.service-support_img img {
  width: 100%;
  display: block;
}

.service-support_cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
}

.service-support_card {
  min-height: 280px;
  padding: 72px 32px 44px;
  background: #E5F4FB;
  border-radius: 24px;
}

.service-support_card h3 {
  margin: 0 0 15px;
  color: #3B4C82;
  font-size: 22px;
  line-height: 1.4;
  font-weight: 600;
  text-align: center;
}

.service-support_card p {
  margin: 0;
  color: #666666;
  font-size: 16px;
  line-height: 1.5;
}

.high-commission {
    padding: 120px 20px;
}

.high-commission .content-inner {
    max-width: 1100px;
    margin: 0 auto;
}

.high-commission_head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 60px;

    margin-bottom: 70px;
}


.high-commission_img {
    width: 250px;
    flex-shrink: 0;
}

.high-commission_img img {
    width: 100%;
    display: block;
}

.high-commission_compare {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 24px;
}

.commission-card {
    background: #F5F5F5;
}

.commission-card_head {
    height: 72px;

    display: flex;
    justify-content: center;
    align-items: center;

    color: #fff;
    font-size: 22px;
    font-weight: 600;
}

.normal .commission-card_head {
    background: #5F5F5F;
}

.sherpa .commission-card_head {
    background: #58ADD5;
}

.commission-card_body {
    padding: 70px 40px;
    text-align: center;
}

.normal h4 {
    margin-bottom: 60px;

    color: #666;
    font-size: 82px;
    line-height: 1;
    font-weight: 600;
}

.sherpa h4 {
    margin-bottom: 60px;

    color: #58ADD5;
    font-size: 82px;
    line-height: 1;
    font-weight: 800;
}

.normal h4 span,.sherpa h4 span {font-size: .6em;}

.commission-card_body p {
    color: #666;
    font-size: 18px;
    line-height: 1.8;
}

@media (max-width: 1080px) {
  .high-commission>.content-inner {width: 90%!important;}
  .high-commission_compare{display: block;}
  .commission-card_body{padding: 40px 40px;}

  .normal h4,.sherpa h4{margin-bottom: 20px;}

}

@media (max-width: 800px) {

  .service-support_img {width: 96px;}
  .service-support_cards {grid-template-columns: 1fr;gap: 20px;}
  .service-support_card {min-height: auto;padding: 35px 75px 40px;}
  .service-support_card h3 {font-size: 21px;margin-bottom: 24px;}

  .high-commission_head {display: block;margin-bottom: 0;}
  .high-commission_img {margin: auto;}
  .high-commission {padding: 90px 0px;}

  .normal h4,.sherpa h4{font-size: 62px;}
  .commission-card_body p{font-size: 16px;}
}



@media screen and (max-width:479px) {
.service-support_card {padding: 35px 20px 40px;}
.high-commission_img img{width: 80%;margin: auto;}
.normal h4, .sherpa h4 {font-size: 52px;}


}




/* ================================================================================================================

インタビューページ（個別）

================================================================================================================ */



.interview_container-inner{
  width: 1000px;
  margin: 50px auto 100px;  
}

.interview_p_top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.interview_p_top .left {
  width: 55%;
}

.interview_p_top .case {
  background: linear-gradient(90deg, #3B4C82 0%, #497AA9 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;

  font-weight: 700;
  letter-spacing: 2px;
  width: fit-content;
  font-size: 23px;
  margin-bottom: 0;
}

.case_txt {
  font-size: 74px;
  font-weight: 700;
  margin: 10px 0 30px;
  line-height: 1;

  width: fit-content;
  background: linear-gradient(90deg, #3B4C82 0%, #58ADD5 48.56%, #A3DBB5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.name {
  font-size: 28px;
  margin-bottom: 10px;
  color: #3B4C82;
  font-weight: 700;
}

.desc {
  font-size: 16px;
  line-height: 1.6;
}

.interview_p_top .right img {
  width: 400px;
  border-radius: 20px;
}


.qa-item {
  background: #F7F7F7;
  border-radius: 30px;
  padding: 20px 50px;
  margin-bottom: 80px;
}



.interview_p_content p {
  font-size: 14px;
  line-height: 1.6;
}

.interview_p_q .interview_p_q_icon{
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-size: 80px;
  font-weight: 700;
  background: linear-gradient(90deg, #3B4C82 0%, #58ADD5 48.56%, #A3DBB5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.interview_p_q{
  margin: -60px 0 10px 20px;
  font-size: 28px;
  font-weight: 700;
  color: #3B4C82;

  display: flex;
  align-items: center;
  gap: 20px;
  line-height: 1;
}

.interview_container .partner{
  border-radius: 0;
}

.interviewbac-btn,
.partner-inner-btn{
  margin: auto;
  display:flex;
  align-items: center;
  justify-content: center;
  gap: 20px;

  padding: 14px 20px;
  min-width: 340px;

  background-color: #3B4C82; 
  color: #ffffff;

  font-size: 16px;
  font-weight: 600;

  border: none;
  border-radius: 9999px;

  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.1s ease;

  margin-top: 30px;
  width: fit-content;
  text-decoration: none;
  box-sizing: border-box;
}

.partner-inner-btn{background-color: #EC7016; }

.interviewbac-btn:hover{opacity: 0.9;transition: 0.3s;color: #fff;}
.partner-inner-btn:hover{opacity: 0.9;transition: 0.3s;color: #fff;}

.interview_container .partner{padding: 60px 0 170px;}

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

  .interview_container-inner{width: 90%;max-width: 590px;}
  .interview_p_top{flex-direction: column-reverse;margin: auto;}
  .interview_p_top .left {width:100%;margin-top: 20px;}
  .interview_p_top .right {width:400px;text-align: center;}
  .interview_p_top .right img{width: 100%;}

  .interview_p_top .case{font-size: 20px;}
  .case_txt{font-size: 50px;}
}

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

  .case_txt{font-size: 35px;margin-top: 0;}
  .name{font-size: 18px;margin-bottom: 0;}
  .desc{font-size: 14px;}

  .interview_container-inner{margin: 50px auto 30px;}

  .qa-item{padding: 20px 20px;}
  .interview_p_q{font-size: 18px;margin: -50px 0 10px;}
  .interview_p_q .interview_p_q_icon {font-size: 50px;}

  .qa-item{margin-bottom: 60px;}

  .interview_container .partner{margin-top: 60px;padding: 10px 0 60px;}

  .partner-inner-btn {margin-top: 30px;}
  .interviewbac-btn,
  .partner-inner-btn{min-width: 270px;}

  .interview_p_top .right img{width: 75%;margin: auto;}
  
}


/* ================================================================================================================

記事ページ

================================================================================================================ */

.media-section_page{
  padding: 80px 0;
}

.media-section_page_inner {
  max-width: 1200px;
  margin: 0 auto;
  width: 90%;
}

.media-section_page_inner h2{
  font-size: 42px;
  color: #272727;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 20px;
}
.media-section_page_inner h3{
  font-size: 34px;
  color: #3B4C82;
  font-weight: bold;
  line-height: 1.2;
  margin-bottom: 10px;
}

.media-section_page_inner h4{
  padding: 5px 15px;
  font-size: 24px;
  color: #1E1E1E;
  background: transparent;
  border-left: solid 5px #A4BEE4;
  margin: 30px 0 10px;
}

.media-section_page_inner figure{margin-top: 30px;}
.media-section_head {margin-bottom: 70px;}

.media-section_head span {
  display: block;
  margin-bottom: -5px;

  color: #D8D8D8;
  font-size: 16px;
  font-family: "Hanken Grotesk", sans-serif;
}

.media-section_head p {
  font-size: 24px;
  font-weight: 800;
  width: fit-content;
  background: linear-gradient(90deg, #3B4C82 0%, #58ADD5 48.56%, #A3DBB5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 0;
}

.media-section_head .post-updated {
  font-size: 14px;
  font-weight: normal;
  width: fit-content;
  color: #333;
background: none;
-webkit-background-clip: initial;
-webkit-text-fill-color: #333;
}

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

  .media-section_page{padding: 30px 0;}
  .media-section_head {margin-bottom: 30px;}
  .media-section_page_inner h2{font-size: 32px; line-height: 1.2;margin-bottom: 10px;}
  .media-section_page_inner h3{font-size: 28px;}
  .media-section_page_inner h4 {font-size: 22px;}

}


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

  .media-section_head p {font-size: 20px;}
  .media-section_head .post-updated {font-size: 12px;}
  .media-section_page_inner h2{font-size: 24px;}
  .media-section_page_inner h3{font-size: 20px;}
  .media-section_page_inner h4 {font-size:18px;}

}



/* ================================================================================================================

FAQ

================================================================================================================ */



.faq-inner{
  max-width: 800px;
  width: 100%;
  margin: auto;
  text-align: center;
}




/* ===== Q（全体が1つの箱） ===== */
.qa-q-box {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #EEEEEE;
  border-radius: 30px;
  padding: 14px 40px;
  width: 100%;
  box-sizing: border-box;
}

/* Qアイコン（背景なし） */
.qa-q .qa-icon {
  font-family: "Hanken Grotesk", sans-serif;
  font-size: 52px;
  font-weight: 700;
  background: linear-gradient(90deg, #3B4C82 0%, #58ADD5 48.56%, #A3DBB5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* ===== A ===== */
.qa-a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 40px;
   width: 100%;
  box-sizing: border-box;
}

.qa-a .qa-icon {
  font-family: "Hanken Grotesk", sans-serif;
  font-size: 52px;
  font-weight: 700;
  background: linear-gradient(90deg, #3B4C82 0%, #58ADD5 48.56%, #A3DBB5 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.qa-text {text-align: left;}

/* テキスト */
.qa-text {
  font-size: 22px;
  line-height: 1.6;
  color: #343434;
}

.qa-a .qa-text{font-size: 18px;}

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

  .qa-text {text-align: left;font-size: 20px;}
  .qa-a .qa-text{font-size: 16px;}
  .qa-q-box, .qa-a {padding: 8px 30px;}
  .qa-a{margin: 20px 0;}
  .faq-inner h2{font-size: 62px;}
  .faq-inner h3{font-size: 24px;}

}



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

  .qa-q-box {border-radius: 20px;}

  .qa-text {font-size: 16px;}
  .qa-a .qa-text{font-size: 14px;}
  .qa-q-box, .qa-a {padding: 0 22px;}
  .qa-q .qa-icon {font-size: 40px;}
  .qa-a .qa-icon {font-size: 40px;}

  .faq-inner h2{font-size: 50px;}
  .faq-inner h3{font-size: 20px;}
}




/* ================================================================================================================

404

================================================================================================================ */


.error404_page{
    padding:200px 0;
    text-align:center;
}

.error404_page h1{
    font-size:80px;
    font-weight:700;
}

.error404_text{
    margin:30px auto;
    line-height:2;
}