html,
body{
  margin:0;
  padding:0;
}

body{
  font-family: "Noto Sans JP","游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  background:#f3ede7;
}

.site-main{
  margin:0;
  padding:0;
}

section{
  margin:0;
  padding:0;
}


/* =========================
Career Page
========================= */

.career-page{
  background:#f3ede7;
}

/* =========================
Career Hero
========================= */

.career-hero{
  position:relative;
  overflow:visible;
  background:#ffffff;
  padding:56px 0 0;
}

.career-hero__bg-pc{
  display:none;
}

.career-hero__inner{
  position:relative;
  z-index:3;
  padding:0 20px 56px;
  box-sizing:border-box;
}

.career-hero__heading{
  margin:0 0 32px;
}

.career-hero__label-wrap{
  display:flex;
  align-items:center;
  gap:0;
  margin:0;
}

.career-hero__slash{
  width:32px;
  height:36.71px;
  display:block;
  position:relative;
  top:4px;
}

.career-hero__label{
  font-weight:700;
  font-size:16px;
  line-height:1;
  color:#5E698F;
  white-space:nowrap;
  position:relative;
  top:8px;
  left:-16px;
}

.career-hero__title{
  margin:0;
  font-weight:700;
  font-size:40px;
  line-height:1;
  letter-spacing:0;
  color:#39446D;
}

.career-hero__text{
  margin:0;
  font-weight:500;
  font-size:13px;
  line-height:1.8;
  color:#000;
}

.career-hero__text--pc{
  display:none;
}

.career-hero__shape{
  position:absolute;
  display:block;
  height:auto;
  pointer-events:none;
}

.career-hero__shape--yellow{
  top:0;
  left:0;
  width:160px;
  z-index:1;
}

.career-hero__shape--aqua{
  right:0;
  bottom:0;
  width:200px;
  z-index:1;
}

.career-hero__shape--navy{
  right:0;
  bottom:0;
  width:108px;
  z-index:2;
}

/* =========================
Career Tabs
========================= */

.career-tabs{
  position:relative;
  z-index:4;
  width:390px;
  max-width:calc(100% - 24px);
  height:56px;
  margin:-28px auto -28px;
  padding:7px;
  box-sizing:border-box;

  display:flex;
  align-items:center;
  gap:8px;

  background:#fff;
  border-radius:999px;
  box-shadow:0 8px 20px rgba(0,0,0,0.12);
}

.career-tabs__tab{
  flex:1;
  height:42px;

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

  border-radius:999px;
  text-decoration:none;

  
  font-weight:700;
  font-size:16px;
  line-height:1;
  color:#9CA3AF;
}

.career-tabs__tab--active{
  background:#0D3B78;
  color:#fff;
}

/* =========================
Career Features
========================= */

.career-features{
  background:#f3ede7;
  padding:80px 20px 56px;
  margin-top:-28px;
}

#career-panel-freelance .career-features{
  background:#DFF3F3;
}

.career-features__inner{
  width:349px;
  max-width:100%;
  margin:0 auto;
}

.career-features__sub{
  margin:0;
  
  font-weight:700;
  font-size:14px;
  line-height:1;
  color:#5E698F;
}

.career-features__title{
  margin:0 0 12px;
  display:flex;
  align-items:flex-start;
  gap:0;

  
  font-weight:700;
  font-size:32px;
  line-height:1;
  letter-spacing:0;
  color:#39446D;
}

.career-features__title span{
  position:relative;
  z-index:1;
  top:10px;
  left:-16px;
}

.career-features__slash{
  width:32px;
  height:36.71px;
  display:block;

  position:relative;
  top:6px;
  z-index:0;
}

.career-features__lead{
  margin:0 8px 16px;
  
  font-weight:500;
  font-size:16px;
  line-height:1.8;
  color:#000;
}

.career-features__list,
.career-freelance-cards{
  display:flex;
  flex-direction:column;
  gap:32px;
}

.career-feature{
  text-align:center;
}

.career-feature__heading{
  margin:0 0 12px;
  
  font-weight:700;
  font-size:16px;
  line-height:1.6;
  color:#39446D;
}

.career-feature__text{
  margin:0;
  
  font-weight:500;
  font-size:14px;
  line-height:18.75px;
  color:#000;
}

.career-feature__image{
  display:block;
  margin:0 auto 20px;
  height:auto;
}

.career-feature__image--1{
  width:103px;
}

.career-feature__image--2{
  width:162px;
}
.career-feature__image--3{
  width:137px;
}

/* =========================
Career Panel Toggle
========================= */

.career-panel{
  display:none;
}

.career-panel.career-panel--active{
  display:block;
}

.career-tabs__tab{
  cursor:pointer;
}

/* =========================
Freelance Features
========================= */

.career-features--freelance{
  background:#dff3f3;
}

.career-features--freelance .career-features__inner{
  width:350px;
}

.career-features--freelance .career-freelance-cards{
  display:flex;
  flex-direction:column;
  gap:24px;
  margin-top:0;
  align-items:center;
}

.career-features--freelance .career-freelance-card{
  position:relative;
  width:304px;
  padding:0;
  background:#ffffff;
  border-radius:10px;
  box-sizing:border-box;
  overflow:hidden;
  text-align:left;
}

.career-features--freelance .career-freelance-card--1{
  height:258px;
}

.career-features--freelance .career-freelance-card--2{
  height:211px;
}

.career-features--freelance .career-freelance-card--3{
  height:227px;
}

.career-features--freelance .career-freelance-card > *{
  box-sizing:border-box;
}

.career-features--freelance .career-freelance-card__number{
  position:absolute;
  top:44px;
  left:24px;
  width:94px;
  height:73px;
  margin:0;
  font-weight:700;
  font-size:79.58px;
  line-height:41.45px;
  letter-spacing:0;
  color:#c6eceb;
}

.career-features--freelance .career-freelance-card__image{
  position:absolute;
  display:block;
  margin:0;
  max-width:none;
  height:auto;
  z-index:2;
}

.career-features--freelance .career-freelance-card__image--1{
  width:111px;
  height:126px;
  top:24px;
  left:148px;
}

.career-features--freelance .career-freelance-card__image--2{
  width:122.5px;
  height:80px;
  top:44px;
  left:148px;
}

.career-features--freelance .career-freelance-card__image--3{
  width:104px;
  height:115px;
  top:22px;
  left:148px;
}

.career-features--freelance .career-freelance-card__heading{
  position:absolute;
  left:20px;
  right:20px;
  margin:0;
  font-weight:700;
  font-size:16px;
  line-height:1.6;
  letter-spacing:0;
  color:#39446D;
  text-align:center;
  z-index:3;
}

.career-features--freelance .career-freelance-card__text{
  position:absolute;
  left:16px;
  right:16px;
  margin:0;
  font-weight:500;
  font-size:14px;
  line-height:1.45;
  letter-spacing:0;
  color:#111111;
  text-align:center;
  z-index:3;
}

/* 01 */
.career-features--freelance .career-freelance-card--1 .career-freelance-card__heading{
  top:156px;
}

.career-features--freelance .career-freelance-card--1 .career-freelance-card__text{
  top:194px;
}

/* 02 */
.career-features--freelance .career-freelance-card--2 .career-freelance-card__heading{
  top:126px;
  left:12px;
  right:12px;
}

.career-features--freelance .career-freelance-card--2 .career-freelance-card__text{
  top:164px;
}

/* 03 */
.career-features--freelance .career-freelance-card--3 .career-freelance-card__heading{
  top:144px;
}

.career-features--freelance .career-freelance-card--3 .career-freelance-card__text{
  top:182px;
}

.career-features--freelance .career-freelance-card h3,
.career-features--freelance .career-freelance-card p{
  margin-block-start:0;
  margin-block-end:0;
}

/* =========================
Career Voices
========================= */

.career-voices{
  background:#F8FAFC;
  padding:20px 0 28px;
  overflow:hidden;
}

.career-voices__inner{
  width:100%;
  margin:0 auto;
}

.career-voices__sub{
  margin:0 20px 0;
  
  font-weight:700;
  font-size:14px;
  line-height:1;
  color:#5E698F;
}

.career-voices__title{
  margin:0 20px 34px;
  display:flex;
  align-items:flex-start;
  gap:0;
  
  font-weight:700;
  font-size:32px;
  line-height:1;
  letter-spacing:0;
  color:#39446D;
}

.career-voices__title span{
  position:relative;
  z-index:1;
  top:10px;
  left:-16px;
}

.career-voices__slash{
  width:32px;
  height:36.71px;
  display:block;
  position:relative;
  top:6px;
  z-index:0;
}

.career-voices-slider.swiper{
  padding-left:20px;
  overflow:visible;
}

.career-voices-slider .swiper-wrapper{
  align-items:stretch;
}

.career-voices-slider .swiper-slide{
  width:280px;
  flex-shrink:0;
  margin-right:20px;
}

.career-voice-card{
  width:280px;
  min-height:320px;
  padding:22px 22px 10px;
  box-sizing:border-box;
  background:#fff;
  border-radius:24px;
  box-shadow:
    0 2px 4px -2px rgba(0,0,0,0.1),
    0 4px 6px -1px rgba(0,0,0,0.1);
}

.career-voice-card__head{
  display:flex;
  align-items:center;
  gap:12px;
}

.career-voice-card__icon{
  width:60px;
  height:60px;
  display:block;
  flex-shrink:0;
  border-radius:50%;
  object-fit:cover;
}

.career-voice-card__name{
  display:flex;
  flex-direction:column;
  margin:0;
  font-weight:900;
  font-size:16px;
  color:#0F3460;
}

.career-voice-card__name br{
  display:none;
}

.career-voice-card__name span:not(.career-voice-card__extra){
  font-size:16px;
  font-weight:700;
  color:#94A3B8;
}

#career-panel-freelance .career-voice-card__extra{
  display:block;
  font-size:16px;
  font-weight:900;
  color:#0F3460;
}

.career-voice-card__text{
  width:242px;
  margin-top:12px;
  
  font-weight:500;
  font-size:14px;
  line-height:20.4px;
  color:#4B5563;
}

.career-voice-card__title-pc{
  display:none;
}
.career-voice-card__title-sp{
  display:block;
}

.career-voice-card__title-pc,
.career-voice-card__title-sp{
  color:#0F3460; /* ← タイトル色を強制 */
  font-weight:900;
}

.career-voices-slider__pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin-top:16px;
  position:static;
}

.career-voices-slider__pagination .swiper-pagination-bullet{
  width:8px;
  height:8px;
  margin:0;
  display:block;
  border-radius:50%;
  opacity:1;
  background:#BFDBFE;
}

.career-voices-slider__pagination .swiper-pagination-bullet-active{
  background:#2563EB;
}

/* =========================
   Process
========================= */

.process {
  padding: 48px 20px 52px;
  background: #f3ede7;
}

#career-panel-job .process{
    padding-bottom: 0;
    margin-bottom: 0;
  }

#career-panel-job .process__list{
    margin-bottom: 0;
  }

.process__inner {
  width: 350px;
  max-width: 100%;
  margin: 0 auto;
}

.process__sub {
  margin: 0 0 8px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 14px;
  line-height: 1;
  color: #5E698F;
}

.process__title {
  margin: 0 0 28px;
  display: flex;
  align-items: flex-start;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 1;
  letter-spacing: 0;
  color: #39446D;
}

.process__slash {
  width:32px;
  height:36.71px;
  display:block;

  position:relative;
  top:6px;
  z-index:0;
}

.process__title span {
  position:relative;
  z-index:1;
  top:10px;
  left: -16px;
}

.process__flow {
  position: relative;
}

.process__line {
  position: absolute;
  top: 28px;
  bottom: 26px;
  left: 19px;
  width: 2px;
  background-image: repeating-linear-gradient(
    to bottom,
    #ffffff 0,
    #ffffff 2px,
    transparent 2px,
    transparent 4px
  );
  z-index: 0;
}

.process__list {
  margin: 0;
  padding: 0;
  list-style: none;
  position: relative;
  z-index: 1;
}

.process__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.process__item + .process__item {
  margin-top: 25px;
}

.process__icon {
  width: 40px;
  flex: 0 0 40px;
  margin-top: 8px;
}

.process__icon img {
  display: block;
  width: 40px;
  height: 40px;
}

.process__content {
  flex: 1;
  min-width: 0;
  padding-top: 2px;
}

.process__item-title {
  margin: 0 0 3px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: 0;
  color: #000000;
}

.process__text {
  margin: 0;
  max-width: 245px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.55;
  letter-spacing: 0;
  color: #6b7280;
}

/* =========================
   Career CTA
========================= */

.career-cta {
  background: #ffffff;
  overflow: hidden;
  margin-top:-72px;
}

.career-cta__inner {
  width: 100%;
  background: #ffffff;
}

.career-cta__image-wrap{
  width:100%;
  line-height:0;
}

.career-cta__image{
  width:120vw; 
  max-width:none;
  margin-left:calc(50% - 62vw); 
  display:block;
}

.career-cta__image--pc{
  display:none;
}

.career-cta__body {
  width: 390px;
  max-width: 100%;
  padding: 64px 24px 80px;
  box-sizing: border-box;
  background: #ffffff;
}

.career-cta__title {
  margin: 0 0 17px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 24px;
  line-height: 1.4;
  color: #0F3460;
}

.career-cta__text {
  margin: 0 0 29px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 25px;
  color: #374151;
}

.career-cta__button {
  width: 342px;
  max-width: 100%;
  height: 56px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border-radius: 4px;
  background: #0F3460;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.14);
  text-decoration: none;
}

.career-cta__button-text {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  color: #ffffff;
}

.career-cta__button-arrow {
  font-size: 22px;
  line-height: 1;
  color: #ffffff;
}
/* =========================
Career Success
========================= */

.career-success{
  background:#F8FAFC;
  padding:20px 0 28px;
  overflow:hidden;
}

.career-success__inner{
  width:100%;
  margin:0 auto;
}

.career-success__sub{
  margin:0 20px 0;
  
  font-weight:700;
  font-size:14px;
  line-height:1;
  color:#5E698F;
}

.career-success__title{
  margin:0 20px 34px;
  display:flex;
  align-items:flex-start;
  gap:0;
  
  font-weight:700;
  font-size:32px;
  line-height:1;
  letter-spacing:0;
  color:#39446D;
}

.career-success__title span{
  position:relative;
  z-index:1;
  top:10px;
  left:-16px;
}

.career-success__slash{
  width:32px;
  height:36.71px;
  display:block;
  position:relative;
  top:6px;
  z-index:0;
}

.career-success-slider.swiper{
  padding-left:20px;
  overflow:visible;
}

.career-success-slider .swiper-wrapper{
  display:flex;
  align-items:stretch;
}

.career-success-slider .swiper-slide{
  width:280px;
  flex-shrink:0;
  margin-right:20px;
}

.career-success-card{
  width:280px;
  min-height:324px;
  padding:22px 22px 10px;
  box-sizing:border-box;
  background:#fff;
  border-radius:24px;
  box-shadow:
    0 2px 4px -2px rgba(0,0,0,0.1),
    0 4px 6px -1px rgba(0,0,0,0.1);
}

.career-success-card__head{
  display:flex;
  align-items:center;
  gap:12px;
}

.career-success-card__icon{
  width:60px;
  height:60px;
  display:block;
  flex-shrink:0;
  border-radius:50%;
  object-fit:cover;
}

.career-success-card__name{
  display:flex;
  flex-direction:column;
  margin:0;
  font-weight:900;
  font-size:16px;
  color:#0F3460;
  gap:4px;
}

.career-success-card__name span{
  font-size:14px;
  font-weight:700;
  color:#94A3B8; 
}

.career-success-card__text{
  width:242px;
  margin-top:12px;
  
  font-weight:500;
  font-size:14px;
  line-height:20.4px;
  color:#4B5563;
}

.career-success-slider__pagination{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin-top:16px;
  position:static;
}

.career-success-slider__pagination .swiper-pagination-bullet{
  width:8px;
  height:8px;
  margin:0;
  display:block;
  border-radius:50%;
  opacity:1;
  background:#BFDBFE;
}

.career-success-slider__pagination .swiper-pagination-bullet-active{
  background:#2563EB;
}

/* =========================
Freelance Process only
========================= */

#career-panel-freelance .process{
  background:#DFF3F3;
}

#career-panel-freelance .process__line{
  background-image:repeating-linear-gradient(
    to bottom,
    #C9D3DD 0,
    #C9D3DD 2px,
    transparent 2px,
    transparent 4px
  );
}

#career-panel-freelance .process__item + .process__item{
  margin-top:24px;
}

#career-panel-freelance .process__item{
  gap:24px;
}

#career-panel-freelance .process__content{
  border-bottom:1px solid rgba(255,255,255,0.7);
}

#career-panel-freelance .process__item:last-child .process__content{
  border-bottom:none;
  padding-bottom:0;
}

#career-panel-freelance .process__text{
  font-size:12.5px;
  line-height:1.6;
}
#career-panel-freelance .process .process__line{
  background-image: repeating-linear-gradient(
    to bottom,
    #D1D5DB 0,
    #D1D5DB 2px,
    transparent 2px,
    transparent 4px
  );
}

#career-panel-freelance .process__content{
  border-bottom:1.7px solid rgba(255,255,255,0.9);
}

#career-panel-freelance .career-cta{
  background:#DFF3F3;
  padding-bottom:72px;
}

#career-panel-freelance .career-cta__inner{
  background:#DFF3F3;
}

#career-panel-freelance .career-cta__image-wrap{
  background:#DFF3F3;
}

#career-panel-freelance .career-cta__body{
  position:relative;
  z-index:2;
  margin:-96px auto 0;
  padding:0 24px 0;
  text-align:center;
  background:#DFF3F3;
}

#career-panel-freelance .career-cta__button{
  position:relative;
  z-index:3;
  margin:0 auto;
}

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

  .career-page{
    background:#fff;
  }

  .career-hero{
    min-height:560px;
    padding:0;
    background:none;
    position:relative;
    overflow:hidden;
  }

  .career-hero__inner{
    position:relative;
    z-index:2;
    width:1280px;
    margin:0 auto;
    padding:132px 80px 0;
    box-sizing:border-box;
  }

.career-hero__bg-pc{
    position:absolute;
    top:0;
    right:0;

    width:100%;
    min-width:1280px;
    height:100%;

    object-fit:cover;
    display:block;

    z-index:0;
  }

  .career-hero__heading{
    margin:0 0 40px;
  }

  .career-hero__label-wrap{
    gap:0;
    margin:0 0 14px;
  }

  .career-hero__slash{
    width:32px;
    left:8px;
    height:auto;
    top:36px;
  }

  .career-hero__label{
    top:28px;
    left:12px;
    font-size:24px;
    line-height:1;
  }

  .career-hero__title{
    font-size:64px;
    line-height:1;
    color:#39446D;
  }

  .career-hero__text{
    width:837px;
    font-size:20px;
    line-height:46px;
  }

  .career-hero__text--sp{
    display:none;
  }

  .career-hero__text--pc{
    display:block;
  }

  .career-hero__shape--yellow,
  .career-hero__shape--aqua,
  .career-hero__shape--navy{
    display:none;
  }

  .career-tabs{
    z-index:4;
    width:403px;
    max-width:none;
    height:70px;
    margin:-35px auto -35px;
    padding:7px;
    gap:8px;
    box-shadow:0 8px 20px rgba(0,0,0,0.12);
  }

  .career-tabs__tab{
    height:56px;
    font-size:16px;
    line-height:1;
  }

  .career-features{
    padding:82px 0 72px;
    margin-top:-35px;
  }

  .career-features__inner{
    width:1280px;
    max-width:none;
    margin:0 auto;
    padding:0 40px;
    box-sizing:border-box;
  }

  .career-features__sub{
    margin:0 0 10px;
    font-size:24px;
    line-height:1;
  }

  .career-features__title{
    margin:0 0 24px;
    font-size:64px;
    line-height:1;
  }

  .career-features__title span{
    top:0;
    left:-28px;
  }

  .career-features__slash{
    width:32px;
    height:auto;
    top:0;
  }

  .career-features__lead{
    margin:0 0 32px;
    font-size:20px;
    line-height:1.8;
  }

  /* =========================
  共通カード
  ========================= */

  .career-features__list,
  .career-freelance-cards{
    display:flex;
    flex-direction:row;
    justify-content:center;
    gap:24px;
  }

  /* =========================
  転職カード
  ========================= */

  .career-feature{
    width:368px;
    min-height:420px;
    padding:28px 20px 16px;
    box-sizing:border-box;
    background:#fff;
    border-radius:4px;

    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  .career-feature__image{
    margin:0 auto 18px;
  }

  .career-feature__image--1{
    width:188px;
    height:188px;
  }

  .career-feature__image--2{
    width:267px;
    height:191px;
  }

  .career-feature__image--3{
    width:207px;
    height:187px;
  }

  .career-feature__heading{
    margin:0 48px 8px;
    font-size:24px;
    line-height:1.6;
    color:#39446D;
  }

  .career-feature__text{
    width:340px;
    margin:0 auto;
    font-size:20px;
    line-height:28px;
  }

  /* =========================
  フリーランスカード
  ========================= */

  #career-panel-freelance .career-freelance-cards{
    display:flex;
    flex-direction:row;
    justify-content:center;
    gap:24px;
  }

  #career-panel-freelance .career-freelance-card{
    width:368px;
    min-height:420px;
    background:#fff;
    border-radius:10px;
    position:relative;
    text-align:center;
  }

  #career-panel-freelance .career-freelance-card__heading{
    position:absolute;
    top:216px;
    left:24px;
    right:24px;

    font-size:24px;
    font-weight:700;
    line-height:1.4;
    color:#39446D;
  }

  #career-panel-freelance .career-freelance-card__text{
    position:absolute;
    top:288px;
    left:24px;
    right:24px;

    font-size:20px;
    line-height:1.5;
    color:#111;
  }

  #career-panel-freelance .career-voices-slider .swiper-slide{
    width:388px;
  }

  #career-panel-freelance .career-voice-card{
    width:388px;
  }

  /* =========================
  数字サイズ（01 / 02 / 03）
  ========================= */

  #career-panel-freelance .career-freelance-card__number{
    width:94px;
    height:75px;
    font-size:75px; /* ← 高さに合わせる */
    line-height:1;
  }

  /* =========================
  画像サイズ
  ========================= */
  #career-panel-freelance .career-freelance-card__image--1{
    width:145px;
    height:164px;
  }


  #career-panel-freelance .career-freelance-card__image--2{
    width:173px;
    height:112px;
  }

  #career-panel-freelance .career-freelance-card__image--3{
    width:163px;
    height:179px;
  }

/* =========================
Voices（転職者の声 × フリーランス実績）
========================= */
.career-voices,
.career-success{
  padding:80px 0;
  position: relative;
  z-index: 5; 
}

.career-voices__inner,
.career-success__inner{
  max-width:1280px;
  margin:0 auto;
  padding:0 40px;
}

.career-voices__sub,
.career-success__sub{
  margin:0 0 8px;
  font-size:24px;
  line-height:1;
}

.career-voices__title,
.career-success__title{
  margin:0 0 28px;
  font-size:56px;
  line-height:1;
}

.career-voices__title span,
.career-success__title span{
  top:10px;
  left:-16px;
}

.career-voices__slash,
.career-success__slash{
  width:32px;
  height:auto;
  top:8px;
}

.career-voices-slider .swiper-slide,
.career-success-slider .swiper-slide{
  width:340px;
}

.career-voice-card,
.career-success-card{
  width:340px;
  min-height:300px;
  padding:16px;
  border-radius:24px;
}

.career-voice-card__head,
.career-success-card__head{
  gap:10px;
  margin:0 0 12px;
}

.career-voice-card__icon,
.career-success-card__icon{
  width:60px;
  height:60px;
}

.career-voice-card__name,
.career-success-card__name{
  font-size:16px;
  line-height:1.4;
  color:#0F3460;
}

  #career-panel-freelance .career-voice-card__extra{
    font-size:16px;
  }

.career-voice-card__name span,
.career-success-card__name span{
  font-size:16px;
  line-height:1.4;
}

.career-voice-card__text,
.career-success-card__text{
  width:auto;
  margin-top:0;
  font-size:14px;
  line-height:24px;
  color:#4B5563;
}

  /* 名前エリア全体 */
  #career-panel-freelance .career-voice-card__name{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    min-height:96px;
  }

  /* 収入テキストは固定位置 */
  #career-panel-freelance .career-voice-card__extra{
    margin-top:4px;
  }

  .career-voice-card__title-pc{
    display:block;
  }
  .career-voice-card__title-sp{
    display:none;
  }

  #career-panel-freelance .career-voice-card__name br{
    display:block !important;
  }


@media screen and (min-width:1024px){
  #career-panel-freelance .career-results-slider .swiper-slide{
    width:340px;
  }
}

/* =========================
Process（共通）
========================= */

.process{
  padding:20px 0 140px;
  background:#f3ede7;
  overflow: visible;
  }

  .site-main.career-page{
    overflow: hidden;
  }

.process__inner{
  width:1280px;
  margin:0 auto;
  padding:0 40px 148px;
}

.process__sub{
  margin:0;
  font-weight:700;
  font-size:20.48px;
  line-height:1;
  color:#5E698F;
}

.process__title{
  margin:0 0 48px;
  display:flex;
  align-items:flex-start;
  font-weight:700;
  font-size:64px;
  line-height:1;
  color:#39446D;
}

.process__title span{
  top:10px;
  left:-28px;
}

.process__slash{
  width:32px;
  top:8px;
}

.process__flow{
  width:763px;
  height:521px;
  margin:0 auto;
}

.process__list{
  padding:48px 56px;
  background:#fff;
  border-radius:4px;
  box-shadow:0 8px 20px rgba(0,0,0,0.08);
  margin-bottom:80px;
}

.process__item{
  gap:16px;
}

.process__item + .process__item{
  margin-top:20px;
}

.process__icon{
  width:40px;
}

.process__item-title{
  font-size:24px;
}

.process__text{
  max-width:none;
  width:100%;
  font-size:20px;
}

/* =========================
CTA（共通）
========================= */

  .career-cta{
    overflow: visible;
    background:#fff;
    width:100%;
    max-width:none;
  }

  .career-cta__inner{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    box-sizing:border-box;
  }

  .career-cta__image-wrap{
    width:100vw;
    margin:-168px 0 0 calc(50% - 50vw);
    display:flex;
    justify-content:flex-end;
    line-height:0;
  }

  .career-cta__image{
    display:block;
    width:100%;
    max-width:none;
    object-fit:cover;
    object-position:right top;
  }

.career-cta{
  position:relative;
  z-index:3;
}

.career-cta::before{
  z-index:1;
}

.career-cta__image{
  position:relative;
  z-index:4;
}

.career-cta__body{
  width:100%;
  max-width:600px;
  margin:0 auto 0;
  text-align:center;
}

  .career-cta__button{
    width:420px;
    height:70px;
    background:#3A4675;

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

  .career-cta__button-text{
    font-size:23.4px;
    line-height:1;
  }

.career-cta__image--sp{
    display:none;
  }

.career-cta__image--pc{
    display:block;
  }

.career-cta__title{
    font-size:36px;
  }

.career-cta__text{
    font-size:20px;
    white-space:nowrap;
  }

.career-freelance-cards{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    justify-content:center;
    align-items:stretch;
    gap:24px;
    width:100%;
    margin:0;
    padding:0;
  }

  .career-freelance-card{
    width:368px;
    min-width:368px;
    max-width:368px;
    min-height:420px;
    margin:0;
    flex:0 0 368px;
    box-sizing:border-box;
  }

  .career-features--freelance .career-features__inner{
  width:1280px;
  }

  .career-features--freelance .career-freelance-cards{
    flex-direction: row;
  }

  #career-panel-freelance .process{
    padding-bottom:148px;
  }

  #career-panel-freelance .career-cta{
  position: relative;
  z-index: 3;
}


  #career-panel-freelance .career-cta__image-wrap{
    width: 1280px;
    margin: -140px auto 0;
    display: flex;
    justify-content: flex-end;
    overflow: visible;
    position: relative;
    z-index: 2; 
  }

#career-panel-freelance .career-cta__image{
  display: block;
  width: 100%;
  max-width: none;

  object-fit: cover;
  object-position: right top;

  transform: none;

  margin-top: -60px;

    position: relative;
  z-index: 2;
}
  #career-panel-freelance .career-cta__image:not(.career-cta__image--pc){
  display:none;
}

  #career-panel-freelance .career-cta__body{
    padding: 0;
    max-width:420px;
  position: relative;
  z-index: 3;
  }

  #career-panel-freelance .process__text{
    font-size:20px;
  }

  .career-features,
  .career-voices,
  .process,
  .career-success{
    position:relative;
    overflow:hidden;
  }

  .process{
  overflow: visible; 
}

.career-cta{
  position: relative;
  z-index: 3;
}

  .career-features::before,
  .career-voices::before,
  .process::before,
  .career-success::before{
    content:"";
    position:absolute;
    width:700px;
    height:2677.5px;
    background:#FFF;
    opacity:0.46;
    border-radius:7.31px;
    transform:rotate(44.12deg);
    transform-origin:left top;
    pointer-events:none;
    z-index:1;
  }

  .career-features::before{
    top:-180px;
    right:-600px;
  }

  .career-voices::before{
    top:-220px;
    left:-180px;
  }

  .process::before{
    top:-490px;
    right:420px;
  }

.process::after{
  content:"";
  position:absolute;
  width:387px;
  height:1202px;
  background:#FFF;
  opacity:0.46;
  border-radius:7.31px;
  transform:rotate(44.12deg);
  transform-origin:left top;
  pointer-events:none;
  z-index:1;

  top:0px;
  right:-388px;
}  

  .career-features__inner,
  .career-voices__inner,
  .process__inner,
  .career-cta__inner,
  .career-success__inner,
  .career-feature,
  .career-voice-card,
  .career-success-card,
  .process__list,
  .career-cta__body{
    position:relative;
    z-index:2;
  }

  .career-hero{
    position:relative;
    z-index:2;
  }

  .career-hero__inner{
    position:relative;
    z-index:3;
  }

  .career-tabs{
    position:relative;
    z-index:4;
  }

  #career-panel-freelance{
    width:100%;
    max-width:none;
  }
  
  #career-panel-freelance .career-cta{
    background: transparent;
    padding-bottom:72px;
    position: relative;
    z-index: 2;
  }

#career-panel-freelance .career-cta__inner{
  background: transparent;

  width:100%;
  max-width:none; 
  padding:0;
}

#career-panel-freelance .career-cta__image-wrap{
  background: transparent;
  position: relative;
  z-index: 2;

  width:100vw; 
  margin-left:calc(50% - 50vw); 
}

#career-panel-freelance .career-cta__image{
  position: relative;
  z-index: 2;

  width:100%;
}

  #career-panel-freelance .career-cta__body{
    background: transparent;
    position: relative;
    z-index: 3;
  }

  #career-panel-freelance .process{
    overflow: visible;
    position: relative;
    z-index: 1;
  }

  #career-panel-freelance,
  #career-panel-freelance .process,
  #career-panel-freelance .career-cta{
    background:#DFF3F3;
}

}