@charset "utf-8";

/* --------------------------------------------
下層ヘッダー
-----------------------------------------------*/
.page-header{
  position: relative;
  height: min(27.1111vw, 450px);
  padding-top: 92px;
  min-height: 300px;
}

.page-header__title{
  position: relative;
  font-size: var(--fontsize52);
  font-weight: 800;
  display: flex;
  align-items: center;
  height: 100%;
  z-index: 10;
}

.page-header__square--dark-green{
  width: min(347/1600 * 100vw, 347px);
  height: min(320/1600 * 100vw, 320px);
  background: var(--base-green);
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: skewX(-30deg);
  z-index: 1;
}

.page-header__square--green{
  width: min(350/1600 * 100vw, 350px);
  height: min(380/1600 * 100vw, 380px);
  background: var(--base-dark-green);
  position: absolute;
  top: 0;
  right: 55px;
  transform-origin: top right;
  transform: skewX(-30deg);
  opacity: 0.3;
  z-index: 3;
}

.page-header__square--blue{
  width: min(178/1600 * 100vw, 178px);
  height: min(201/1600 * 100vw, 201px);
  background: var(--base-blue);
  position: absolute;
  top: min(225/1600 * 100vw, 225px);
  right: min(422/1600 * 100vw, 422px);
  transform-origin: top right;
  transform: skewX(-30deg);
  opacity: 0.3;
  z-index: 2;
}

.page-header__square--pale-green{
  width: min(635/1600 * 100vw, 635px);
  height: min(500/1600 * 100vw, 500px);
  min-height: 330px;
  background: var(--base-green);
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: skewX(30deg);
  opacity: 0.2;
  z-index: 2;
}

@media screen and (max-width: 1199px) {
  .page-header{
    margin-top: 92px;
    padding-top: 0;
  }
}

@media screen and (max-width: 767px) {
  .page-header{
    margin-top: 80px;
    min-height: 200px;
  }

  .page-header__title {
    font-size: var(--fontsize30);
  }

  .page-header__square--pale-green{
    min-height: 230px;
    min-width: 200px;
  }
}

/* --------------------------------------------
パンくず
-----------------------------------------------*/
.breadcrumb{
  position: relative;
  z-index: 6;
}

.breadcrumb ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
}

.breadcrumb ul li,
.breadcrumb ul li a{
  font-size: var(--fontsize18);
  position: relative;
}

.breadcrumb ul li:not(:first-child){
  padding-left: 30px;
}

.breadcrumb ul li:not(:first-child)::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 12px;
  translate: 0 -50%;
  width: 5px;
  height: 5px;
  border-radius: 3px;
  background: var(--base-green);
}

.breadcrumb ul li:last-child{
  color: var(--base-green);
  font-weight: 600;
}

@media screen and (max-width: 767px) {
  .breadcrumb ul li,
  .breadcrumb ul li a {
    font-size: var(--fontsize12);
  }

  .breadcrumb ul li:not(:first-child)::before{
    left: 6px;
    translate: 0 -50%;
    width: 3px;
    height: 3px;
  }
}

/* --------------------------------------------
募集要項
-----------------------------------------------*/
#recruit .heading {
  margin-bottom: min(40 / 1200 * 100vw, 40px);
}

/* --------------------------------------------
会社情報
-----------------------------------------------*/
/* メッセージ */
#overview .message {
  margin-bottom: min(70/1300 * 100vw, 70px);
}

#overview .message__wrap{
  position: relative;
  display: flex;
  justify-content: space-between;
  margin-bottom: min(190/1300 * 100vw, 190px);
}

#overview .message__wrap-txt{
  position: relative;
  z-index: 2;
}

#overview .message__manager{
  font-size: var(--fontsize24);
  margin-bottom: min(70 / 1300 * 100vw, 70px);
  font-weight: 600;
  text-align: right;
  max-width: min(520 / 1300 * 100vw, 520px);
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 0.8em;
}

#overview .message__manager span {
  font-size: var(--fontsize18);
}

#overview .message__description{
  font-size: var(--fontsize18);
  line-height: 2;
  max-width: min(520/1300 * 100vw, 520px);
}

#overview .message__wrap-img{
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  max-width: min(560/1300*100vw,560px);
  z-index: 1;
}

#overview .message__wrap-img img{
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
}

#overview .message__square-green{
  width: min(235/1300 * 100vw, 235px);
  height: min(265/1300 * 100vw, 265px);
  position: absolute;
  bottom: -20px;
  right: 40px;
  opacity: 0.3;
  background: var(--base-dark-green);
  transform: skewX(-30deg);
  transform-origin: bottom right;
  z-index: 0;
}

#overview .message__wrap-bottom {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding-right: min(63/1300 * 100vw, 63px);
}

#overview .message__wrap-bottom p{
  font-size: var(--fontsize18);
  line-height: 2;
  letter-spacing: 0.04em;
}

@media screen and (max-width: 767px) {
  #overview .message{
    padding-right: 0;
    margin-bottom: min(50/384 * 100vw, 50px);
  }

  #overview .message__wrap {
    flex-direction: column;
    margin-bottom: min(40/384 * 100vw, 40px);
    gap: 10px;
  }

  #overview .message__manager {
    font-size: var(--fontsize20);
    margin-bottom: min(30 / 384 * 100vw, 30px);
    max-width: initial;
  }

  #overview .message__manager span {
    font-size: var(--fontsize14);
  }

  #overview .message__description{
    font-size: var(--fontsize14);
    line-height: 2;
    max-width: initial;
  }

  #overview .message__wrap-img{
    position: relative;
    top: initial;
    right: initial;
    width: 100%;
    max-width: initial;
  }

  #overview .message__wrap-bottom{
    padding-right: 0;
  }

  #overview .message__wrap-bottom p {
    font-size: var(--fontsize14);
  }
}

/* 会社概要 */
#overview .overview {
  margin-bottom: min(70 / 1300 * 100vw, 70px);
}

/* アクセス */
#overview .access {
  margin-bottom: min(80 / 1300 * 100vw, 80px);
}

#overview .access > p {
  font-size: var(--fontsize18);
  margin-bottom: min(40 / 1300 * 100vw, 40px);
}

@media screen and (max-width: 767px) {
  #overview .access > p {
    font-size: var(--fontsize14);
  }
}

/* --------------------------------------------
募集要項
-----------------------------------------------*/
#recruit .black__btn-wrap{
  text-align: center;
  margin-bottom: min(80 / 1200 * 100vw, 80px);
}

/* --------------------------------------------
福利厚生
-----------------------------------------------*/
.benefit__column1 {
  display: grid;
  grid-template-columns: 1fr;
  gap: min(30/1200*100vw,30px);
  margin-bottom: min(60/1200 * 100vw, 60px);
}

.benefit__column2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 79px;
  margin-bottom: min(60/1200 * 100vw, 60px);
}

.benefit__column2-txt {
  display: flex;
  flex-direction: column;
  gap: min(20/1200 * 100vw, 20px);
}

.benefit__column2-txt > p{
  font-size: var(--fontsize18);
  line-height: 2;
  letter-spacing: 0.04em;
}

.benefit__column2-txt--bold{
  font-weight: 600;
}

.benefit__column2-txt--small {
  font-size: var(--fontsize14);
}

/* 休暇制度 */
#benefit .vacation > p{
  font-size: var(--fontsize18);
  margin-bottom: min(50/1200 * 100vw, 50px);
  line-height: 2;
}

#benefit .vacation .benefit__column2-txt > p {
  font-size: var(--fontsize18);
}

/* 子育て支援制度 */
#benefit .childcare {
  margin-bottom: min(80 / 1200 * 100vw, 80px);
}

#benefit .childcare p{
  font-size: var(--fontsize18);
  line-height: 2;
}

#benefit .childcare__wrap {
  display: flex;
  flex-direction: column;
  gap: min(57/1200 * 100vw, 57px);
}

/* 働く環境 */
#benefit .benefits {
  margin-bottom: min(80/1200 * 100vw, 80px);
}

#benefit .benefits p{
  line-height: 2;
  margin-bottom: min(50/1200 * 100vw, 50px);
}

@media screen and (max-width: 767px) {
  .benefit__column2 {
    grid-template-columns: repeat(1, 1fr);
    gap: 10px;
  }

  .benefit__column2 img{
    width: 100%;
    height: auto;
  }

  .benefit__column2-txt {
    order: 2;
  }

  .benefit__column2-txt > p,
  #benefit .benefits p {
    font-size: var(--fontsize14);
  }

  #benefit .vacation > p {
    font-size: var(--fontsize14);
  }

  #benefit .vacation .benefit__column2-txt > p,
  #benefit .childcare p {
    font-size: var(--fontsize14);
  }
}

/* --------------------------------------------
中途採用
-----------------------------------------------*/
#career .page-btn__item {
  margin-inline: initial;
}

/* --------------------------------------------
新卒採用
-----------------------------------------------*/
#graduate .graduate__content {
  display: grid;
  grid-template-columns: clamp(300px, 31vw, 378px) 1fr;
  gap: min(36 / 1200 * 100vw, 36px);
  margin-bottom: min(80/1200 * 100vw, 80px);
}

#graduate .graduate__caution {
  margin-bottom: min(50/1200 * 100vw, 50px);
  font-size: var(--fontsize18);
}


#graduate .graduate__image{
  text-align: center;
}

#graduate .graduate__image > p{
  text-align: right;
  font-size: var(--fontsize14);
  padding-top: 5px;
}

@media screen and (max-width: 767px) {
  #graduate .graduate__caution {
    font-size: var(--fontsize14);
  }

  #graduate .graduate__content {
    grid-template-columns: 1fr;
    gap: 3px;
  }

  #graduate .graduate__content .widget-btn {
    order: 2;
  }
}

/* --------------------------------------------
仕事・人を知る
-----------------------------------------------*/
#job .job__caution {
  font-size: var(--fontsize18);
  margin-bottom: min(35/1200 * 100vw, 35px);
}

#job .job__wrap {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: min(60/1200 * 100vw, 60px) min(35/1200 * 100vw, 35px);
}

#job .job__box{
  position: relative;
  width: 100%;
  overflow: hidden;
}

#job .job__box:hover {
  opacity: 1;
}

#job .job__box::after{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: rotate(45deg) translateX(-100%);
  background: linear-gradient(
      90deg,
      var(--base-blue),
      #00ffe0,
      var(--base-green)
    )
    no-repeat;
  background-size: 100% 100%;
  opacity: 0;
  mix-blend-mode: hard-light;
}

#job .job__box:hover::after {
  animation: gradientMove 0.5s linear;
}

@keyframes gradientMove {
  0% {
    transform: translateX(-200%);
  }
  5% {
    opacity: 0.3;
  }
  100% {
    transform: translateX(200%);
  }
}

#job .job__box img{
  width: 100%;
  height: auto;
}

#job .job__box-txt{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: min(45/1600 * 100vw, 45px) min(30/1600 * 100vw, 30px);
  display: flex;
  flex-direction: column;
  justify-content: end;
}

#job .job__box-txt > p{
  font-size: var(--fontsize20);
  color: var(--base-white);
  font-weight: 600;
  margin-bottom: min(45/1200 * 100vw, 45px);
  line-height: 1.6;
}

#job .job__box-txt > span{
  font-size: var(--fontsize18);
  color: var(--base-white);
  font-weight: 600;
}

@media screen and (max-width: 767px) {
  #job .job__caution {
    margin-bottom: min(20/384 * 100vw, 20px);
    font-size: var(--fontsize14);
  }

  #job .job__wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: min(60/1200 * 100vw, 60px) min(35/1200 * 100vw, 35px);
  }

  #job .job__box-txt > p {
    font-size: min(calc(16 / 570 * 100vw), 16px);
    margin-bottom: min(15/384 * 100vw, 15px);
  }

  #job .job__box-txt > span {
    font-size: min(calc(12 / 570 * 100vw), 12px);
  }
}

/* --------------------------------------------
インタビュー
-----------------------------------------------*/
#interview .interview__wrap{
  position: relative;
  padding-top: 40px;
}

#interview .interview__description{
  position: absolute;
  top: 0;
  left: 0;
  background: rgb(255, 255, 255, 0.8);
  padding: min(35/1200*100vw,35px) min(80/1200*100vw,80px) min(40/1200*100vw,40px) min(40/1200*100vw,40px);
  z-index: 5;
}

#interview .interview__image {
  margin-right: calc(50% - 50vw);
  padding-left: min(400/1200 * 100vw, 400px);
}

#interview .interview__image img{
  width: 100%;
  height: 100%;
  min-height: min(620/1200 * 100vw, 620px);
  object-fit: cover;
  object-position: top;
  max-height: 570px;
  max-width: 1160px;
}

#interview .interview__detail{
  text-align: right;
  margin-top: min(130/1200 * 100vw, 130px);
  font-size: var(--fontsize18);
  font-weight: 600;
}

#interview .interview__detail-name{
  font-size: var(--fontsize24);
  font-weight: 600;
}

/* QA */
#interview .interview__question{
  position: relative;
  padding-top: min(60/1200 * 100vw, 60px);
}

#interview .interview__question::before{
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  background : url(img/interview/interview-bg.webp) 0% 0% / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 84%;
  background-position: top right;
  margin-right: calc(50% - 50vw);
  width: 100vw;
  height: 100%;
  z-index: 0;
}

#interview .interview__question {
  padding-top: min(60/1200 * 100vw, 60px);
}

.interview__item{
  position: relative;
  margin-bottom: min(50/1200 * 100vw, 50px);
  z-index: 1;
}

#interview .interview__label{
  font-size: var(--fontsize48);
  font-weight: 600;
  font-family: Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", sans-serif;
  color: var(--base-green);
}

#interview .interview__answer-title{
  color: var(--base-green);
  font-size: var(--fontsize28);
  font-weight: 600;
  letter-spacing: 0.08em;
  margin-bottom: min(30/1200 * 100vw, 30px);
}

#interview .interview__qa-column2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: min(80/1200 * 100vw, 80px);
}

#interview .interview__answer-txt{
  display: flex;
  flex-direction: column;
  gap: min(30/1200 * 100vw, 30px);
  font-size: var(--fontsize18);
  line-height: 2;
  letter-spacing: 0.04em;
}

/* QA2 */
#interview .interview__item--q2 .interview__qa-image{
  margin-right: calc(50% - 50vw);
  width: 48vw;
  max-width: 920px;
}

#interview .interview__item--q2 .interview__qa-image img{
  width: 100%;
  max-height: 620px;
  object-fit: cover;
}

/* QA4 */
#interview .interview__item--q4 .interview__qa-image{
  margin-left: calc(50% - 50vw);
  text-align: right;
}

#interview .interview__item--q4 .interview__qa-image img{
  width: 48vw;
  height: auto;
  max-width: 920px;
}

/* 1日のスケジュール */
#interview .schedule-nav{
  position: relative;
  padding: 8px 0 32px;
  margin-bottom: min(120/1200*100vw,120px);
}

#interview .schedule-nav::after{
  content: "";
  position: absolute;
  top: 0;
  left: min(150/1200 * 100vw, 150px);
  width: 1px;
  height: 100%;
  background: #909090;
}

#interview .schedule-nav__wrap {
  display: flex;
  flex-direction: column;
  gap: min(57/1200*100vw,57px);
}

#interview .schedule-nav__item {
  display: flex;
}

#interview .schedule-nav__year{
  font-size: var(--fontsize30);
  font-weight: 600;
  font-family: Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", sans-serif;
  width: min(150/1200*100vw,150px);
  flex-shrink: 0;
}

#interview .schedule-nav__detail{
  position: relative;
  padding-left: min(75/1200 * 100vw, 75px);
}

#interview .schedule-nav__detail::before{
  content: "";
  position: absolute;
  transform-origin: center center;
  top: 0;
  left: 0;
  translate: -50%;
  width: min(30/1200 * 100vw, 30px);
  height: min(30/1200 * 100vw, 30px);
  border-radius: 100px;
  border: min(5/1200 * 100vw, 5px) solid var(--base-green);
  box-sizing: border-box;
}

#interview .schedule-nav__detail p{
  font-size: var(--fontsize24);
  font-weight: 600;
  margin-bottom: min(15/1200*100vw,15px);
}

#interview .schedule-nav__detail li{
  position: relative;
  padding-left: min(28/1200*100vw,28px);
  font-size: var(--fontsize18);
  line-height: 2;
}

#interview .schedule-nav__detail li::before{
  content: "";
  position: absolute;
  top: 0.75em;
  left: min(9/1200*100vw,9px);
  width: min(5/1200*100vw,5px);
  height: min(5/1200*100vw,5px);
  background: var(--base-green);
}

#interview .interview-btn {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: min(60/1200*100vw,60px);
}

#interview .interview-btn__wrap a{
  position: relative;
  display: inline-block;
  background: var(--base-black);
  color: var(--base-white);
  padding: 30px 50px 30px 50px;
  font-size: var(--fontsize20);
  font-weight: 600;
  z-index: 5;
  border: 1px solid #000;
  transition: all 0.3s;
  text-align: center;
  width: 100%;
}

.interview-btn__btn--prev a::before{
  content: "";
  background : url(img/common/white-right-arw.png) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 20px 22px;
  width: 20px;
  height: 22px;
  position: absolute;
  rotate: 180deg;
  top: 50%;
  left: 30px;
  translate: 0 -50%;
}

.interview-btn__btn--next a::after{
  content: "";
  background : url(img/common/white-right-arw.png) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 20px 22px;
  width: 20px;
  height: 22px;
  position: absolute;
  top: 50%;
  right: 30px;
  translate: 0 -50%;
}

@media screen and (max-width: 767px) {
  #interview .interview__wrap{
    position: relative;
    padding-top: 0;
    display: flex;
    flex-direction: column;
  }

  .interview__item {
    margin-bottom: min(20/384*100vw,20px);
  }

  #interview .interview__description{
    position: relative;
    top: initial;
    left: initial;
    order: 2;
    padding: 15px;
  }

  #interview .interview__image{
    margin-right: 0;
    padding-left: 0;
  }

  #interview .interview__detail{
    margin-top: 20px;
    font-size: var(--fontsize14);
  }

  #interview .interview__detail-name {
    font-size: var(--fontsize18);
  }

  #interview .interview__label {
    font-size: var(--fontsize30);
  }

  #interview .interview__answer-title{
    font-size: var(--fontsize18);
    text-align: left;
  }

  #interview .interview__qa-column2 {
    grid-template-columns: repeat(1, 1fr);
    gap: 15px;
  }

  #interview .interview__answer-txt  {
    font-size: var(--fontsize14);
  }

  #interview .interview__item--q2 .interview__qa-image{
    margin-right: 0;
    width: 100%;
  }

  #interview .interview__item--q4 .interview__qa-image{
    margin-left: 0;
  }

  #interview .interview__item--q4 .interview__qa-image img{
    width: 100%;
  }

  #interview .schedule-nav::after{
    left: 75px;
  }

  #interview .schedule-nav__year{
    font-size: var(--fontsize18);
    width: 75px;
  }

  #interview .schedule-nav__detail::before{
    width: 20px;
    height: 20px;
    border: 3px solid var(--base-green);
  }

  #interview .schedule-nav__detail {
    padding-left: min(20/384*100vw,20px);
  }

  #interview .schedule-nav__detail p {
    font-size: var(--fontsize18);
  }

  #interview .schedule-nav__detail li{
    padding-left: 12px;
    font-size: var(--fontsize14);
    line-height: 1.8;
  }

  #interview .schedule-nav{
    padding: 5px 0 20px;
  }

  #interview .schedule-nav__detail li::before{
    top: 0.7em;
    left: 3px;
    width: 3px;
    height: 3px;
  }

  #interview .interview-btn {
    grid-template-columns: repeat(1,1fr);
    gap: 20px;
  }

  #interview .interview-btn__wrap a{
    padding: 20px 50px 20px 30px;
    font-size: var(--fontsize18);
  }

  .interview-btn__btn--prev a::before,
  .interview-btn__btn--next a::after{
    background-size: 13px 15px;
    width: 13px;
    height: 15px;
  }
}


/* --------------------------------------------
5daysインターンシップ・キャリア教育
-----------------------------------------------*/
#internship .internship-btn{
  position: relative;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: min(80/1200*100vw,80px);
  margin-bottom: min(55/1200*100vw,55px);
  z-index: 5;
}

#internship .internship-btn__item{
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
  padding: 40px 50px 40px 65px;
  font-size: var(--fontsize20);
  font-weight: 600;
  z-index: 5;
}

#internship .internship-btn__item::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 40px;
  width: 6px;
  height: 6px;
  translate: 0 -50%;
  background: var(--base-green);
  border-radius: 2px;
}

#internship .internship-btn__item::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 32px;
  width: 22px;
  height: 20px;
  translate: 0 -50%;
  background : url(img/common/black-right-arw.png) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 22px 20px;
  border-radius: 2px;
  pointer-events: none;
  transition: all 0.3s;
}

#internship .internship-btn__item.widget-btn__external::after{
  background : url(img/common/external-icon.webp) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 24px 24px;
  width: 24px;
  height: 24px;
}

#internship .internship-career > p{
  font-size: var(--fontsize18);
  margin-bottom: min(35/1200*100vw,35px);
  line-height: 2;
}

#internship .internship-career__wrap {
  display: flex;
  gap: min(30/1200*100vw,30px);
  flex-direction: column;
  margin-bottom: min(80/1200*100vw,80px);
}

#internship .internship-career__wrap dl {
  border: 3px solid var(--base-green);
}

#internship .internship-career__wrap dt{
  background: var(--base-green);
  padding: 20px 40px;
  color: var(--base-white);
  font-size: var(--fontsize24);
  font-weight: 600;
}

#internship .internship-career__point {
  padding-right: min(35/1200*100vw,35px);
}

#internship .internship-career__wrap dd{
  background: var(--base-white);
  padding: 35px;
  font-size: var(--fontsize18);
  line-height: 2;
}

#internship .internship-voice {

}

#internship .internship-voice > p{
  font-size: var(--fontsize18);
  margin-bottom: min(35/1200*100vw,35px);
  line-height: 2;
}

#internship .internship-voice__wrap {
  margin-bottom: min(90/1200*100vw,90px);
}

#internship .internship-voice__bubble {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: min(70/1200*100vw,70px) min(60/1200*100vw,60px);
}

#internship .internship-voice__bubble-item{
  position: relative;
  padding: min(1200/28*100vw,28px) min(1200/25*100vw,25px) min(38/1200*100vw,38px);
  background: var(--base-white);
  border-radius: 20px;
  line-height: 2;
}

#internship .internship-voice__bubble-item::after{
  content: "";
  position: absolute;
  left: 29px;
  top: 100%;
  width: min(1200/25*100vw,25px);
  height:  min(1200/25*100vw,25px);
  clip-path: polygon(0 0, 80% 100%, 100% 0);
  background-color: var(--base-white);
}

#internship .internship-five-days {
  margin-bottom: min(80/1200*100vw,80px);
}

#internship .internship-five-days__title{
  font-size: var(--fontsize32);
  font-weight: 600;
  color: var(--base-green);
  margin-bottom: min(38/1200*100vw,38px);
}

#internship .internship-five-days__achievement {
  padding: min(40/1200*100vw,40px);
  background: var(--base-white);
}

#internship .internship-five-days__green{
  padding: 20px;
  background: #d9eddf;
  margin-bottom: min(40/1200*100vw,40px);
}

#internship .internship-five-days__achievement dl {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

#internship .internship-five-days__achievement dt{
  font-size: var(--fontsize24);
  font-weight: 600;
}

#internship .internship-five-days__achievement dd{
  font-size: var(--fontsize18);
  letter-spacing: 0.04em;
  line-height: 2;
}

#internship .internship-five-days__detail dl{
  padding-bottom: min(40/1200*100vw,40px);
  margin-bottom: min(40/1200*100vw,40px);
  border-bottom: 1px solid #909090;
}

#internship .internship-five-days__detail dl:last-child{
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}

/* テーブル */
#internship .mypage-btn {
  margin: min(60/1200*100vw,60px) 0;
}

#internship .selection-mypage-btn a{
  margin:0;
  margin-bottom: min(30/1200*100vw,30px) ;
}

#internship .apply-flow{
  position: relative;
  display: block;
  margin: min(40/1200*100vw,40px) 0;
}

#internship .pic-column3 {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: min(57/1200*100vw,57px);
}

#internship .pic-column3 img{
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  #internship .internship-btn {
    grid-template-columns: repeat(1,1fr);
    gap: min(20/384*100vw,20px);
    margin-bottom: min(50 / 384 * 100vw, 50px);
  }

  #internship .internship-btn__item{
    padding: 17px 40px 17px 45px;
  }

  #internship .internship-btn__item::before{
    left: 20px;
  }

  #internship .internship-btn__item::after{
    right: 22px;
    width: 15px;
    height: 13px;
    background-size: 15px 13px;
  }

  #internship .internship-btn__item.widget-btn__external::after{
    background : url(img/common/external-icon.webp) center center / auto auto no-repeat scroll padding-box border-box transparent;
    background-size: 18px 18px;
    width: 18px;
    height: 18px;
  }

  #internship .internship-career > p {
    font-size: var(--fontsize14);
    margin-bottom: min(35/384*100vw,35px);
  }

  #internship .internship-career__wrap {
    margin-bottom: min(50/384*100vw,50px);
  }

  #internship .internship-career__wrap dt{
    padding: 15px 10px;
    font-size: var(--fontsize18);
  }

  #internship .internship-career__wrap dd{
    padding: 10px;
    font-size: var(--fontsize14);
  }

  #internship .internship-voice__wrap {
    margin-bottom: min(50 / 384 * 100vw, 50px);
  }

  #internship .internship-voice__bubble {
    grid-template-columns: repeat(2,1fr);
    gap: 20px min(15/384*100vw,15px);
  }

  #internship .internship-voice__bubble-item{
    padding: 10px min(10/384*100vw,10px) 15px;
    font-size: var(--fontsize12);
    line-height: 1.8;
    border-radius: 10px;
  }

  #internship .internship-voice__bubble-item::after{
    left: 20px;
    width: min(15/384*100vw,15px);
    height: min(15/384*100vw,15px);
  }

  #internship .internship-voice > p {
    font-size: var(--fontsize14);
  }

  #internship .internship-five-days__title {
    font-size: var(--fontsize20);
  }

  #internship .internship-five-days {
    margin-bottom: min(50 / 384 * 100vw, 50px);
  }

  #internship .internship-five-days__achievement{
    padding: 15px 10px;
  }

  #internship .internship-five-days__green{
    padding: 10px;
    margin-bottom: min(40/1200*100vw,40px);
  }

  #internship .internship-five-days__achievement dt {
    font-size: var(--fontsize18);
  }

  #internship .internship-five-days__achievement dd {
    font-size: var(--fontsize14);
  }

  #internship .internship-five-days__detail dl {
    padding-bottom: min(20/384*100vw,20px);
    margin-bottom: min(20/384*100vw,20px);
  }

  #internship .apply-flow{
    width: 50%;
    /* margin-inline: auto; */
  margin: 0 auto;
  }
}

/* --------------------------------------------
人材育成
-----------------------------------------------*/
#development .development-caution{
  font-size: var(--fontsize18);
  margin-bottom: min(40/1200*100vw,40px);
  line-height: 2;
}

#development .development__wrap {
  margin-bottom: min(50/1200*100vw,50px);
}

#development .development__image {
  margin-bottom: min(45/1200*100vw,45px);
}

#development .development__image img{
  width: 100%;
  height: auto;
}

#development .development__column2 {
  counter-reset: item;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: min(35/1200*100vw,35px) min(80/1200*100vw,80px);
}

#development .development__column2-item{
  counter-increment: item;
  position: relative;
  padding: 5px min(20/1200*100vw,20px);
  padding-bottom: 35px;
  font-size: var(--fontsize18);
  line-height: 2;
  border: 3px solid var(--base-green);
  border-radius: 15px;
  background: var(--base-white);
}

#development .development__column2-item::after{
  content: '0'counter(item);
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: var(--fontsize150);
  font-family: Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", sans-serif;
  line-height: 0.8;
  font-weight: 600;
  color: var(--base-green);
  opacity: 0.2;
  transform: skewX(-10deg);
}

#development .development__column2-item .sub-heading {
  margin-bottom: min(15 / 1200 * 100vw, 15px);
}

#development .development__column2-item ul {
  margin-bottom: min(35/1200*100vw,35px);
}

#development .development__column2-item li{
  position: relative;
  padding-left: 20px;
}

#development .development__column2-item li::before{
  content: "";
  position: absolute;
  top: 0.7em;
  left: 0;
  width: 5px;
  height: 5px;
  background: var(--base-green);
}

/* 教育体制 */
#development .education__wrap {
  font-size: var(--fontsize18);
}

#development .education__image {
  margin-bottom: min(50/1200*100vw,50px);
}

#development .education__wrap > p{
  margin-bottom: min(50/1200*100vw,50px);
  line-height: 2;
}

#development .education__image img{
  width: 100%;
  height: auto;
}

/* 一般教育 */
#development .education__flow{
  position: relative;
  padding: 35px 0;
  border-left: 4px solid var(--base-green);
  margin-bottom: min(40/1200*100vw,40px);
}

#development .education__flow-list {
  display: flex;
  flex-direction: column;
  gap: min(75/1200*100vw,75px);
}

#development .education__flow-item-details {
  display: grid;
  grid-template-columns: 320px 1fr;

}

#development .education__flow-item-title{
  padding-left: 10px;
  font-size: var(--fontsize24);
  font-weight: 600;
}

#development .education__flow-item-description{
  font-size: var(--fontsize18);
  display: flex;
  flex-direction: column;
  gap: 1em;
  line-height:  2;
}

#development .general-education > p,
#development .self-development > p {
  font-size: var(--fontsize18);
  margin-bottom: min(15/1200*100vw,15px);
}

#development .education__diagram-image{
  max-width: 633px;
  width: 60%;
  /* margin-inline: auto; */
  margin: 0 auto;
  margin-bottom: min(80/1200*100vw,80px);
}

@media screen and (max-width: 767px) {
  #development .development-caution {
    font-size: var(--fontsize14);
    margin-bottom: min(40/384*100vw,40px);
  }

  #development .development__wrap {
    margin-bottom: min(40/384*100vw,40px);
  }

  #development .development__column2 {
    grid-template-columns: repeat(1,1fr);
    gap: min(15/384*100vw,15px);
  }

  #development .development__column2-item{
    padding-bottom: 15px;
    font-size: var(--fontsize14);
    border-radius: 10px;
  }

  #development .general-education > p,
  #development .self-development > p,
  #development .education__wrap > p {
    font-size: var(--fontsize14);
    margin-bottom: min(15/384*100vw,15px);
  }

  #development .education__image {
    margin-bottom: min(30/384*100vw,30px);
  }

  #development .education__flow{
    padding: 15px 0;
    border-left: 2px solid var(--base-green);
    margin-bottom: min(20/384*100vw,40px);
  }

  #development .education__flow-list {
    gap: min(20/384*100vw,20px);
  }

  #development .education__flow-item-details {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  #development .education__flow-item-title {
    font-size: var(--fontsize18);
  }

  #development .education__flow-item-description{
    font-size: var(--fontsize14);
    padding-left: 1.5em;
  }

  #development .education__diagram-image{
    width: 85%;
    margin-bottom: min(50/384*100vw,50px);
  }
}

/* --------------------------------------------
3分でわかるKAPT
-----------------------------------------------*/
#three-minute .production__description{
  margin-bottom: min(60/1200*100vw,60px);
  font-size: var(--fontsize18);
  letter-spacing: 0.04em;
  line-height: 2;
}

#three-minute .data__wrap {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: min(40/1200*100vw,40px);
  grid-template-areas: "annual-holiday average-vacation"
      "long-vacation long-vacation"
      "granted-vacation average-overtime";
  margin-bottom: min(80/1200*100vw,80px);
}

#three-minute .data__box{
  position: relative;
  padding: min(30/1200*100vw,30px) min(25/1200*100vw,25px) min(20/1200*100vw,20px) min(30/1200*100vw,30px);
  background: var(--base-white);
  border: 6px solid rgb(92,181,170,0.2);
  display: flex;
  flex-direction: column;
}

/* 年間休日 */
#three-minute .data__annual-holiday {
  grid-area: annual-holiday;
}

#three-minute .data__annual-holiday .data__box-image{
  width: 30%;
}

/* 平均有給 */
#three-minute .data__average-vacation {
  grid-area: average-vacation;
}

#three-minute .data__average-vacation .data__box-image{
  width: 25%;
}

/* 長期連休 */
#three-minute .data__long-vacation {
  grid-area: long-vacation;
}

#three-minute .data__long-vacation .data__box-content {
  align-items: flex-start;
  padding-right: min(100/1200*100vw,100px);
  margin-bottom: min(35/1200*100vw,35px);
}

#three-minute .data__long-vacation .data__box-image{
  width: 35%;
}

/* 有給休暇 */
#three-minute .data__granted-vacation {
  grid-area: granted-vacation;
}

#three-minute .data__granted-vacation .data__box-image{
  width: 32%;
}

/* 平均残業 */
#three-minute .data__average-overtime {
  grid-area: average-overtime;
}

#three-minute .data__average-overtime .data__box-image{
  width: 20%;
}

#three-minute .data__box-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: min(15/1200*100vw,15px);
  padding-right: min(55/1400*100vw,55px);
  /* margin-bottom: min(30/1200*100vw,30px); */
}

#three-minute .data__long-vacation .data__box-image{
  margin-top: -55px;
}

#three-minute .data__box-txt{
  font-size: var(--fontsize40);
  font-weight: 600;
  color: var(--base-dark-blue);
  transform: skewX(-10deg);
  letter-spacing: 0px;
  line-height: 1;
}

#three-minute .data__box-txt--bold{
  font-size: var(--fontsize120);
  font-family: Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", sans-serif;
}

#three-minute .data__box-list li{
  position: relative;
  padding-left: 25px;
  display: flex;
  font-size: var(--fontsize18);
}

#three-minute .data__box-list li::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  translate: 0 -50%;
  width: 6px;
  height: 6px;
  background: var(--base-green);
  border-radius: 2px;
}

#three-minute .data__box-achievement{
  text-align: right;
  font-size: var(--fontsize16);
  margin-top: auto;
}

#three-minute .data__box-vacation{
  position: relative;
  display: block;
  width: min(232/1200*100vw,232px);
}

#three-minute .data__box-vacation::after{
  content: "・・・";
  position: absolute;
  top: 50%;
  right: 0;
  translate: 0 -50%;
}

#three-minute .data__box-vacation-number{
  padding-left: min(45/1200*100vw,45px);
  font-weight: 600;
  color: var(--base-green);
}

/* 若手のホンネ */
#three-minute .voice__description{
  font-size: var(--fontsize18);
  font-weight: 600;
  margin-bottom: min(50/1200*100vw,50px);
}

#three-minute .voice__btn{
  position: relative;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: min(60/1200*100vw,60px);
  margin-bottom: min(100/1200*100vw,100px);
  z-index: 6;
}

/* 入社前 */
#three-minute .voice__question{
  font-size: var(--fontsize32);
  font-weight: 600;
  color: var(--base-black);
  display: flex;
  align-items: center;
  gap: 20px;
  margin-bottom: min(30/1200*100vw,30px);
}

#three-minute .voice__question span{
  font-size: var(--fontsize100);
  font-weight: 600;
  font-family: Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", sans-serif;
  color: var(--base-green);
  line-height: 1;
}

/* 航空機業界に興味を持ったきっかけは？ */
#three-minute .voice__check{
  position: relative;
  background-color: var(--base-white);
  padding: min(30/1200*100vw,30px) min(42/1200*100vw,42px) min(90/1200*100vw,90px) min(37/1200*100vw,37px);
  z-index: 6;
  margin-bottom: min(70/1200*100vw,70px);
}

#three-minute .voice__check-item{
  position: relative;
  padding: min(30/1200*100vw,30px) 0 min(25/1200*100vw,25px) 48px;
  border-bottom: 1px solid var(--base-warm-gray);
  line-height: 2;
  letter-spacing: 0.04em;
  font-size: var(--fontsize18);
}

#three-minute .voice__check-item::before{
  content: "";
  position: absolute;
  top: calc(min(30/1200*100vw,30px)  + 1em);
  translate: 0 -50%;
  left: 0;
  background : url(img/three-minutes/check-icon.webp) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: min(29/1200*100vw,29px) min(21/1200*100vw,21px);
  width: min(29/1200*100vw,29px);
  height: min(21/1200*100vw,21px);
}

#three-minute .voice__check-illust{
  position: absolute;
  bottom: 56px;
  right: min(52/1200*100vw,52px);
  width: min(269/1200*100vw,269px);
  height: auto;
}

/* 飛行機アニメーション */
#three-minute .voice__check-illust--plane.anime-add {
  animation: plane_illust 1.2s ease-in-out 0.8s forwards;
  opacity: 0;
}

@keyframes plane_illust {
  0%{
    transform: translate(150px, -155px);
    scale: 0.5;
    rotate: -15deg;
    opacity: 0;
  }

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

/* 入社の決め手は何ですか */
#three-minute .voice__ellipse{
  position: relative;
  padding: 57px min(40/1200*100vw,40px) 63px;
  background: var(--base-white);
  margin-bottom: min(70 / 1200 * 100vw, 70px);
}

#three-minute .double-quotation::before{
  content: "“";
  position: absolute;
  top: -2.5%;
  left: 0;
  font-size: var(--fontsize100);
  color: var(--base-green);
  line-height: 1;
}

#three-minute .double-quotation::after{
  content: "”";
  position: absolute;
  top: -2.5%;
  right: 0;
  font-size: var(--fontsize100);
  color: var(--base-green);
  line-height: 1;
}

#three-minute .voice__ellipse-column2 {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: min(20/1200*100vw,20px) min(80/1200*100vw,80px);
  margin-bottom: min(20/1200*100vw,20px);
}

#three-minute .voice__ellipse-item{
  padding: min(20/1200*100vw,20px) 10px;
  border-radius: 50px;
  text-align: center;
  font-size: var(--fontsize18);
}

#three-minute .voice__ellipse-column2 .voice__ellipse-item:nth-child(3n - 2){
  background-color: #fbe5cd;
  border: 1px solid var(--base-orange);
}

#three-minute .voice__ellipse-column2 .voice__ellipse-item:nth-child(3n - 1){
  background-color: #e4ebf5;
  border: 1px solid var( --base-blue);
}

#three-minute .voice__ellipse-column2 .voice__ellipse-item:nth-child(3n){
  background-color: #e3f1e4;
  border: 1px solid var(--base-dark-green);
}

#three-minute .voice__ellipse-content {
  display: grid;
  grid-template-columns: min(380/1200*100vw,380px) 1fr;
  gap: min(27/1200*100vw,27px);
}

#three-minute .voice__ellipse-content--img {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: min(310/1200*100vw,310px);
  margin-inline: auto;
}

#three-minute .voice__ellipse-content--view-company.anime-add {
  transform: scaleY(0);
  transform-origin: bottom center;
  animation: view_company 0.6s ease-in-out 1s forwards;
}

@keyframes view_company {
  0%{
    transform: scaleY(0);
  }

  50%{
    transform: scaleY(1.2);
  }

  70% {
    transform: scaleY(0.8);
  }

  90% {
    transform: scaleY(1.1);
  }

  100% {
    transform: scaleY(1);
  }
}

#three-minute .voice__ellipse-content--txt {
  display: flex;
  flex-direction: column;
  gap: min(20/1200*100vw,20px);
}

#three-minute .voice__ellipse-content--txt .voice__ellipse-item:nth-child(3n - 2){
  background-color: #e4ebf5;
  border: 1px solid var( --base-blue);
}

#three-minute .voice__ellipse-content--txt .voice__ellipse-item:nth-child(3n - 1){
  background-color: #e3f1e4;
  border: 1px solid var(--base-dark-green);
}

#three-minute .voice__ellipse-content--txt .voice__ellipse-item:nth-child(3n){
  background-color: #fbe5cd;
  border: 1px solid var(--base-orange);
}

/* 入社前と入社後に”ギャップ”を感じたことがありますか？ */
#three-minute .voice__stripe{
  position: relative;
  margin-bottom: min(70/1200*100vw,70px);
}

#three-minute .voice__stripe-list {
  display: flex;
  flex-direction: column;
  gap: min(30/1200*100vw,30px);
}

#three-minute .voice__stripe-item{
  font-size: var(--fontsize18);
  padding: min(35/1200*100vw,35px) min(20/1200*100vw,20px);
  border: 1px solid var(--base-dark-green);
  border-radius: 10px;
  text-align: center;
}

#three-minute .voice__stripe-item:nth-child(odd) {
  background-color: var(--base-white);
}

#three-minute .voice__stripe-item:nth-child(even){
  background-color: #e3f1e4;
}

#three-minute .voice__stripe-illust--thinker{
  position: absolute;
  bottom: 10px;
  left: 35px;
  width: min(152/1200*100vw,152px);
}

/* 学生時代の学び/専攻で仕事に活かされていることは何ですか？ */
#three-minute .voice__speech{
  position: relative;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: min(40/1200*100vw,40px) min(80/1200*100vw,80px);
  margin-bottom: min(70/1200*100vw,70px);
}

#three-minute .voice__speech-item{
  display: flex;
  justify-content: space-between;
  gap: min(30/1200*100vw,30px);
  padding: min(28/1200*100vw,28px) min(15/1200*100vw,15px) min(28/1200*100vw,28px) min(27/1200*100vw,27px);
  background: 
    linear-gradient(var(--base-white),var(--base-white)) padding-box,
    linear-gradient(90deg, #225686, #5bb5ab) border-box;
  border: 2px solid transparent;
  border-radius: 20px;
}

#three-minute .voice__speech-txt{
  font-size: var(--fontsize18);
  line-height: 2;
  letter-spacing: 0.04em;
}

#three-minute .voice__speech-image{
  width: min(94/1200*100vw,94px);
  height: min(94/1200*100vw,94px);
  min-width: 50px;
  min-height: 50px;
  border: 3px solid var(--base-light-gray);
  border-radius: 100px;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: flex-end;
}

#three-minute .voice__atmosphere-wrap {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

/* 職場の雰囲気はどんな感じですか？ */

#three-minutes .voice__atmosphere-content {
  display: grid;
  grid-template-columns: 1fr min(360/1200*100vw,360px) 1fr;
  gap: min(60/1200*100vw,60px);
  margin-bottom: min(75/1200*100vw,75px);
}

#three-minutes .voice__atmosphere-item{
  padding: min(22/1200*100vw,22px) 15px;
  border: 1px solid var(--base-dark-green);
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: var(--fontsize18);
  background: var(--base-white);
  line-height: 2;
  flex: 1;
}

#three-minutes .voice__atmosphere-item:nth-child(odd){
  background: #e3f1e4;
}

#three-minutes .voice__atmosphere-illust {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

/* 活躍している社員とはどのような人ですか？ */
#three-minute .voice__list{
  position: relative;
  padding: 42px min(72/1200*100vw,72px) 42px min(60/1200*100vw,60px);
  border-radius: 50px;
  border: 3px solid var(--base-green);
  background: var(--base-white);
  margin-bottom: min(75/1200*100vw,75px);
}

#three-minute .voice__list-wrap {
  display: flex;
  flex-direction: column;
  gap: min(12/1200*100vw,12px);
}

#three-minute .voice__list-item{
  position: relative;
  font-size: var(--fontsize18);
  padding-left: 25px;
  line-height: 2;
}

#three-minute .voice__list-item::before{
  content: "";
  width: 6px;
  height: 6px;
  background: var(--base-green);
  position: absolute;
  top: 0.8em;
  left: 0;
}

#three-minute .voice__list-illust{
  position: absolute;
}

#three-minute .voice__list-illust--work-clothes{
  width: min(220/1200*100vw,220px);
  bottom: 19px;
  right: min(80/1200*100vw,80px);
}

/* KAPTの強みは何ですか？ */
#three-minute .voice__Strengths-content {
  display: grid;
  grid-template-columns: min(270 / 1200 * 100vw, 270px) 1fr;
  gap: min(50/1200*100vw,50px);
}

#three-minute .voice__Strengths-content .voice__ellipse-item:nth-child(3n-2){
  background-color: #e3f1e4;
  border: 1px solid var(--base-dark-green);
}

#three-minute .voice__Strengths-content .voice__ellipse-item:nth-child(3n-1){
  background-color: #fbe5cd;
  border: 1px solid var(--base-orange);
}

#three-minute .voice__Strengths-content .voice__ellipse-item:nth-child(3n){
  background-color: #e4ebf5;
  border: 1px solid var(--base-blue);
}

#three-minute .voice__ellipse-content--work-clothes-man{
  width: min(160 / 1200 * 100vw, 160px);
  margin: 0 auto;
}

#three-minute .voice__list-illust--work-engineer{
  width: min(334/1200*100vw,334px);
  bottom: 34px;
  right: min(69/1200*100vw,69px);
}

/* 生産技術の仕事とは？ */
#three-minute .product-tec__question {
  display: flex;
  align-items: center;
  gap: 19px;
  margin-bottom: min(40/1200*100vw,40px);
}

#three-minute .product-tec__question span{
  width: 50px;
  height: 50px;
  font-size: var(--fontsize32);
  font-weight: 600;
  font-family: Arial, Helvetica, "Liberation Sans", "Nimbus Sans L", sans-serif;
  color: var(--base-white);
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--base-green);
  border-radius: 50%;
}

#three-minute .product-tec__wrap{
  position: relative;
  margin-bottom: min(80/1200*100vw,80px);
}

#three-minute .product-tec__list {
  display: flex;
  flex-direction: column;
  gap: min(20/1200*100vw,20px);
}

#three-minute .product-tec__list-item{
  display: flex;
  align-items: center;
  gap: min(18/1200*100vw,18px);
  padding: min(28/1200*100vw,28px) min(32/1200*100vw,32px);
  border: 1px solid var(--base-dark-green);
  border-radius: 15px;
  background: var(--base-white);
}

#three-minute .product-tec__image{
  width: min(64/1200*100vw,64px);
  height: min(64/1200*100vw,64px);
  min-width: 50px;
  min-height: 50px;
  border: 3px solid var(--base-light-gray);
  background: var(--base-white);
  border-radius: 100px;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: flex-end;
}

#three-minute .product-tec__txt{
  font-size: var(--fontsize18);
  line-height: 2;
}

#three-minute .product-tec__txt dt{
  font-weight: 600;
}


@media screen and (max-width: 1199px) {
  #three-minute .data__box-content{
    padding-left: 0;
    padding-right: 0;
  }
}

@media screen and (max-width: 767px) {
  #three-minute .production__description {
    margin-bottom: min(30/384*100vw,30px);
    font-size: var(--fontsize14);
  }

  #three-minute .data__wrap {
    grid-template-columns: repeat(1,1fr);
    gap: min(15/384*100vw,15px);
    grid-template-areas: initial;
  }

  #three-minute .data__annual-holiday,
  #three-minute .data__average-vacation,
  #three-minute .data__long-vacation,
  #three-minute .data__granted-vacation,
  #three-minute .data__average-overtime{
    grid-area: initial;
  }

  #three-minute .data__box{
    padding: 10px;
    border: 3px solid rgb(92,181,170,0.2);
  }

  #three-minute .data__box-content{
    padding-left: 15px;
    padding-right: 15px;
  }

  #three-minute .data__box-txt--bold {
    font-size: var(--fontsize70);
  }

  #three-minute .data__box-txt {
    font-size: var(--fontsize28);
  }

  #three-minute .data__box-achievement {
    font-size: var(--fontsize14);
  }


  /* 長期休暇 */
  #three-minute .data__long-vacation{
    padding-bottom: 30px;
  }

  #three-minute .data__box-list li{
    padding-left: 10px;
    font-size: var(--fontsize14);
  }

  #three-minute .data__box-list li::before{
    top: 0.6em;
    width: 3px;
    height: 3px;
  }

  #three-minute .data__long-vacation .data__box-content{
    flex-direction: column;
    margin-bottom: 30px;
    padding-right: 0;
  }

  #three-minute .data__box-vacation{
    width: initial;
    padding-right: 45px;
    flex-shrink: 0;
  }

  #three-minute .data__box-vacation::after{
    top: 0;
    right: 0;
    translate: initial;
  }

  #three-minute .data__long-vacation .data__box-image{
    margin-top: 0;
    position: absolute;
    bottom: 15px;
    left: 30px;
    width: 110px;
  }

  #three-minute .voice__question {
    font-size: var(--fontsize18);
    gap: 10px;
    margin-bottom: min(20 / 384 * 100vw, 20px);
  }

  #three-minute .voice__btn {
    grid-template-columns: repeat(1,1fr);
    gap: min(20 / 384 * 100vw, 20px);
    margin-bottom: min(30/384*100vw,30px);
  }

  /* 航空機業界に興味を持ったきっかけは？ */
  #three-minute .voice__check {
    padding: 10px 15px min(50/384*100vw,50px) 15px;
    margin-bottom: min(30/384*100vw,30px);
  }

  #three-minute .voice__check-item{
    padding: 10px 0 10px 30px;
    font-size: var(--fontsize14);
  }

  #three-minute .voice__check-item::before{
    content: "";
    position: absolute;
    top: calc(10px + 1em);
    translate: 0 -50%;
    left: 0;
    background : url(img/three-minutes/check-icon.webp) center center / auto auto no-repeat scroll padding-box border-box transparent;
    background-size: 19px 14px;
    width: 19px;
    height: 14px;
  }

  #three-minute .voice__check-illust{
    bottom: -18px;
    right: -20px;
    width: 80px;
  }

  /* 入社の決め手 */
  #three-minute .voice__ellipse {
    padding: 30px min(10/384*100vw,10px) 30px;
    margin-bottom: min(30 / 384 * 100vw, 30px);
  }

  #three-minute .double-quotation::after{
    top: -1.5%;
    font-size: var(--fontsize50);
  }
  
  #three-minute .double-quotation::before{
    top: -1.5%;
    font-size: var(--fontsize50);
  }

  #three-minute .voice__ellipse-column2 {
    grid-template-columns: repeat(1,1fr);
    gap: min(10/384*100vw,10px);
    margin-bottom: min(10/384*100vw,10px);
  }

  #three-minute .voice__ellipse-item {
    font-size: var(--fontsize14);
  }

  #three-minute .voice__ellipse-content {
    grid-template-columns: 1fr;
  }

  #three-minute .voice__ellipse-content--txt {
    gap: min(10/384*100vw,10px);
  }

  #three-minute .voice__ellipse-content--txt .voice__ellipse-item:last-child{
    width: 80%;
    margin-left: auto;
  }

  #three-minute .voice__ellipse-content--img{
    position: absolute;
    bottom: 15px;
    left: 7px;
    width: 18%;
  }

  /* 入社前と入社後に”ギャップ”を感じたことがありますか？ */
  #three-minute .voice__stripe {
    margin-bottom: min(30 / 384 * 100vw, 30px);
  }

  #three-minute .voice__stripe-list {
    gap: min(10/384*100vw,10px);
  }

  #three-minute .voice__stripe-item{
    font-size: var(--fontsize14);
    padding: 15px 10px;
    border-radius: 5px;
  }

  #three-minute .voice__stripe-item:last-child{
      padding-left: 25%;
  }

  #three-minute .voice__stripe-illust--thinker{
    bottom: 0px;
    left: 10px;
    width: 20%;
    max-width: 67px;
  }

  /* 学生時代の学び/専攻で仕事に活かされていることは何ですか？ */
  #three-minute .voice__speech-item{
    align-items: center;
    border-radius: 10px;
    padding: 10px;
  }

  #three-minute .voice__speech {
    grid-template-columns: repeat(1,1fr);
    gap: min(10/384*100vw,10px);
    margin-bottom: min(30 / 384 * 100vw, 30px);
  }

  #three-minute .voice__speech-txt {
    font-size: var(--fontsize14);
  }

  /* 職場の雰囲気はどんな感じですか？ */
  #three-minute .voice__atmosphere-wrap {
    gap: min(15/384*100vw,15px);
  }

  #three-minutes .voice__atmosphere-content {
    grid-template-columns: 1fr;
    gap: min(15/384*100vw,15px);
    margin-bottom: min(30/384*100vw,30px);
  }

  #three-minutes .voice__atmosphere-item {
    padding: min(10/384*100vw,10px) 10px;
    font-size: var(--fontsize14);
    flex: 1;
  }

  #three-minutes .voice__atmosphere-illust{
    order: 3;
    width: 50%;
    margin: 0 auto;
  }

  /* 福利厚生の中で魅力的なものは何ですか？ */
  #three-minute .voice__check-illust--working{
    bottom: 8px;
    right: 15px;
    width: 80px;
  }

  /* 活躍している社員とはどのような人ですか？ */
  #three-minute .voice__list{
    padding: 20px min(10/384*100vw,10px) 20px;
    border-radius: 20px;
    margin-bottom: min(30/384*100vw,30px);
  }

  #three-minute .voice__list-wrap {
    gap: min(10/384*100vw,10px);
  }

  #three-minute .voice__list-item{
    position: relative;
    font-size: var(--fontsize14);
    padding-left: 10px;
    line-height: 2;
  }

  #three-minute .voice__list-item::before{
    width: 3px;
    height: 3px;
  }

  #three-minute .voice__list-illust--work-clothes{
    bottom: -30px;
    right: 10px;
    width: min(55/384*100vw,55px);
  }

  /* KAPTの強みは何ですか？ */
  #three-minute .voice__Strengths-content {
    grid-template-columns: 1fr;
  }

  #three-minute .voice__ellipse-content--work-clothes-man{
    position: absolute;
    bottom: 5px;
    left: 8%;
    width: 10%;
    min-width: 45px;
  }

  /* 活躍している社員とはどのような人ですか？  */
  #three-minute .voice__list-illust--work-engineer{
    width: 20%;
    bottom: 0px;
    right: 2%;
    max-width: 75px;
  }

  #three-minute .voice__list-item:last-child{
    padding-right: 21%;
  }

  /* 生産技術の仕事とは？ */
  #three-minute .product-tec__question span{
    width: 40px;
    height: 40px;
    font-size: var(--fontsize24);
  }

  #three-minute .product-tec__list {
    gap: min(10/384*100vw,10px);
  }

  #three-minute .product-tec__list-item{
    padding: 10px;
  }

  #three-minute .product-tec__txt {
    font-size: var(--fontsize14);
  }
}


/* --------------------------------------------
オープンカンパニー
-----------------------------------------------*/
#opencompany .opencompany-description {
  font-size: var(--fontsize18);
  margin-bottom: min(30/1200*100vw,30px);
}

#opencompany .opencompany-btn{
  position: relative;
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: min(80/1200*100vw,80px);
  margin-bottom: min(50/1200*100vw,50px);
  z-index: 5;
}

#opencompany .opencompany-btn__item{
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
  padding: 40px 50px 40px 65px;
  font-size: var(--fontsize20);
  font-weight: 600;
  z-index: 5;
}

#opencompany .opencompany-btn__item::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 40px;
  width: 6px;
  height: 6px;
  translate: 0 -50%;
  background: var(--base-green);
  border-radius: 2px;
}

#opencompany .opencompany-btn__item::after{
  content: "";
  position: absolute;
  top: 50%;
  right: 32px;
  width: 22px;
  height: 20px;
  translate: 0 -50%;
  background : url(img/common/black-right-arw.png) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 22px 20px;
  border-radius: 2px;
  pointer-events: none;
  transition: all 0.3s;
}

#opencompany .opencompany-btn__item.widget-btn__external{
  max-width: 560px;
  width: 100%;
  /* margin-inline: auto; */
  margin: 0 auto;
  margin-bottom: min(50/1200*100vw,50px);
}

#opencompany .open-recruit .opencompany-btn__item.widget-btn__external::after{
  background : url(img/common/external-icon.webp) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: 24px 24px;
  width: 24px;
  height: 24px;
}

#opencompany .open-recruit__wrap > p{
  font-size: var(--fontsize18);
  margin-bottom: min(45/1200*100vw,45px);
  line-height: 2;
}

#opencompany .open-recruit-btn {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: min(60/1200*100vw,60px);
}

#opencompany .open-recruit-btn__item{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background: rgba(255, 255, 255, 0.8);
  padding: min(40/1200*100vw,40px) min(50/1200*100vw,50px) min(40/1200*100vw,40px) min(45/1200*100vw,45px);
  font-size: var(--fontsize20);
  font-weight: 600;
}

#opencompany .open-recruit-btn__item::after{
  content: "";
  position: absolute;
  top: 50%;
  right: min(30/1200*100vw,30px);
  width: min(22/1200*100vw,22px);
  height: min(20/1200*100vw,20px);
  translate: 0 -50%;
  background : url(img/common/green-right-arw.png) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: min(22/1200*100vw,22px) min(20/1200*100vw,20px);
  border-radius: 2px;
  pointer-events: none;
  transition: all 0.3s;
}

#opencompany .open-recruit-btn__item.widget-btn__external::after{
  background : url(img/common/green-external-icon.png) center center / auto auto no-repeat scroll padding-box border-box transparent;
  background-size: min(24/1200*100vw,24px) min(24/1200*100vw,24px);
  width: min(24/1200*100vw,24px);
  height: min(24/1200*100vw,24px);
}

@media screen and (max-width: 767px) {
  #opencompany .opencompany-description,
  #opencompany .open-recruit__wrap > p {
    font-size: var(--fontsize14);
  }

  #opencompany .opencompany-btn {
    grid-template-columns: repeat(1,1fr);
    gap: min(20/384*100vw,20px);
    margin-bottom: min(50 / 384 * 100vw, 50px);
  }

  #opencompany .opencompany-btn__item{
    padding: 17px 40px 17px 45px;
  }

  #opencompany .opencompany-btn__item.widget-btn__external {
    max-width: initial;
  }

  #opencompany .opencompany-btn__item::before{
    left: 20px;
  }

  #opencompany .opencompany-btn__item::after{
    right: 22px;
    width: 15px;
    height: 13px;
    background-size: 15px 13px;
  }

  #opencompany .opencompany-btn__item.widget-btn__external::after{
    background : url(img/common/external-icon.webp) center center / auto auto no-repeat scroll padding-box border-box transparent;
    background-size: 18px 18px;
    width: 18px;
    height: 18px;
  }

  #opencompany .open-recruit-btn {
    grid-template-columns: repeat(1,1fr);
    gap: min(20/384*100vw,20px);
  }

  #opencompany .open-recruit-btn__item{
    padding: 17px 40px 17px 45px;
  }

  #opencompany .open-recruit-btn__item::after{
    right: 22px;
    width: 15px;
    height: 13px;
    background-size: 15px 13px;
  }

  #opencompany .open-recruit-btn__item.widget-btn__external::after{
    background-size: 18px 18px;
    width: 18px;
    height: 18px;
  }
}

/* --------------------------------------------
事業内容
-----------------------------------------------*/
#service .service__central-wrap {
  display: grid;
  grid-template-columns: 1fr min(560/1200*100vw,560px);
  gap: min(40/1500*100vw,40px);
  margin-bottom: min(80/1200*100vw,80px);
}

#service .service__central-img img{
  width: 100%;
  height: auto;
}

#service .service__central-box {
  display: grid;
  grid-template-columns: 1fr min(360/1200*100vw,360px);
  gap: min(52/1200*100vw,52px);
  margin-bottom: min(80/1200*100vw,80px);
}

#service .service__central-box--txt p{
  line-height: 2;
  font-size: var(--fontsize18);
  letter-spacing: 0.04em;
}

#service .service__central-box--img img{
  width: 100%;
  height: auto;
}

@media screen and (max-width: 767px) {
  #service .service__central-wrap {
    grid-template-columns: 1fr;
    gap: min(15/384*100vw,15px);
    margin-bottom: min(40/384*100vw,40px);
  }

  #service .service__central-box {
    grid-template-columns: 1fr;
    gap: min(15/384*100vw,15px);
    margin-bottom: min(30/384*100vw,30px);
  }

  #service .service__central-box--txt p {
    font-size: var(--fontsize14);
  }
}