@charset "UTF-8";
/*========== トップページ ==========*/
/*==========
メインビジュアル
==========*/
#mv {
  background: center/cover url("../img/index/index_mv.svg") no-repeat;
  font-size: clamp(0.75rem, 1.25vw, 1rem);
  padding-top: 2.5em;
  padding-bottom: 2.5em;
}
#mv .text_area {
  background: center/contain url("../img/index/index_mv_text-bg.svg") no-repeat;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 4em 5.25em;
  margin: -0.25em;
  position: relative;
}
#mv .text_area .title_main {
  width: 27.5em;
}
#mv .text_area .deco {
  position: absolute;
  width: 36.5em;
  left: 1.25em;
  bottom: 0;
  transform: translateY(80%);
}
#mv .text_area .btn_01 {
  margin-top: 1.5em;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding-left: 2em;
  padding-right: 2.5em;
  max-width: none;
  height: 3.4em;
  --color: #fff;
  --color_bg: var(--color_green_hover);
  --color_hover: #62C0B4;
  --color_border: var(--color_green_hover);
}
#mv .slider_area {
  margin-top: 1.625em;
  position: relative;
  z-index: 10;
  border-radius: 1.25em;
  background-color: rgba(42, 145, 137, 0.85);
  padding: 1em;
}
#mv .slider_area a {
  color: inherit;
  text-decoration: none;
}
@media screen and (max-width: 639px) {
  #mv {
    font-size: 0.875rem;
    background-position: top -3.5rem center;
    background-image: url("../img/index/index_mv-sp.svg");
    padding-top: 3rem;
    padding-bottom: 0;
  }
  #mv .container {
    padding: 0;
  }
  #mv .text_area {
    width: 100%;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    padding: 3rem 2.5rem 4rem;
    background-image: url("../img/index/index_mv_text-bg-sp.svg");
  }
  #mv .text_area::after {
    content: "";
    width: 58.4%;
    aspect-ratio: 220/122;
    background: center/contain url("../img/index/index_mv_deco_02-sp.svg") no-repeat;
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translateY(110%);
  }
  #mv .text_area .title_main {
    width: 100%;
  }
  #mv .text_area .deco {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    left: auto;
    right: auto;
    transform: translateY(50%);
  }
  #mv .text_area .btn_01 {
    padding-left: 1em;
    padding-right: 1.75em;
    margin-top: 1.25em;
    max-width: 300px;
    height: 48px;
  }
  #mv .text_area .btn_01::after {
    right: 0.625em;
  }
  #mv .slider_area {
    margin-top: 7rem;
    border-radius: 0;
  }
}

.slider_mv {
  max-width: 1192px;
  margin-left: auto;
  margin-right: auto;
}
.slider_mv .swiper-slide {
  height: auto;
  background-color: #fff;
  border-radius: 10px;
}
.slider_mv .swiper-slide:not(:has(a)),
.slider_mv .swiper-slide a {
  display: block;
  padding: 0.625em 0.9375em;
}
@media screen and (min-width: 960px) {
  .slider_mv .swiper-slide:not(:has(a)) img,
.slider_mv .swiper-slide a img {
    transition: transform 0.5s, height 0.5s, margin 0.5s;
  }
  .slider_mv .swiper-slide:not(:has(a)):hover img,
.slider_mv .swiper-slide a:hover img {
    transform: scale(1.05);
  }
}
.slider_mv .row_title {
  display: flex;
  gap: 0.625em;
}
.slider_mv .thumb {
  width: 7.5em;
  aspect-ratio: 120/80;
  overflow: hidden;
}
.slider_mv .thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.slider_mv .title_area {
  flex: 1;
}
.slider_mv .title_area .title {
  font-weight: 700;
  margin-top: 0.4em;
}
.slider_mv .list {
  font-size: 0.875em;
  margin-top: 0.625em;
  margin-bottom: 0.25em;
}
.slider_mv .list > * {
  padding: 0.325em 0;
  border-bottom: 1px dashed var(--color_border);
  display: flex;
}
.slider_mv .list > *:first-child {
  border-top: 1px dashed var(--color_border);
}
.slider_mv .list .title {
  width: 5em;
  font-weight: 700;
  color: var(--color_green);
}
.slider_mv .list .data {
  flex: 1;
}
.slider_mv .list .date {
  color: var(--color_green);
  font-weight: 700;
}
.slider_mv .text_blank {
  font-size: 0.875rem;
  text-align: right;
  margin-top: 0.5rem;
}
.slider_mv .navigation_area {
  margin-top: 0.625em;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.625em;
}
.slider_mv .navigation_area .slider_mv_pagination {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.slider_mv .navigation_area .swiper-pagination-bullet {
  width: 10px;
  height: auto;
  aspect-ratio: 1/1;
  background-color: #fff;
  opacity: 1;
}
.slider_mv .navigation_area .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--color_green);
}
.slider_mv .navigation_area .slider_arrow {
  display: flex;
  gap: 0.625em;
}
.slider_mv .navigation_area .slider_mv_prev,
.slider_mv .navigation_area .slider_mv_next {
  width: 2em;
  height: 1.5em;
  cursor: pointer;
}
.slider_mv .navigation_area .slider_mv_prev {
  background: center/contain url("../img/common/icon_slider-prev-green.svg") no-repeat;
}
.slider_mv .navigation_area .slider_mv_next {
  background: center/contain url("../img/common/icon_slider-next-green.svg") no-repeat;
}

/*==========
企業を探す
==========*/
#index_coordinator {
  margin-top: 1.5rem;
  background-color: var(--color_lightblue_bg);
  border-radius: var(--border_radius);
  position: relative;
}
#index_coordinator::after {
  content: "";
  width: 7.8125%;
  aspect-ratio: 1/2;
  background: center/contain url("../img/index/index_coordinator_deco.svg") no-repeat;
  position: absolute;
  top: -11%;
  right: 3%;
}
#index_coordinator .flex {
  padding-top: 1rem;
  padding-bottom: 1.5rem;
  display: flex;
  gap: 1rem 2rem;
}
#index_coordinator h2:not([class])::after {
  display: none;
}
#index_coordinator .detail_area {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
#index_coordinator .detail_area .bubble {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 440px;
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.375;
  font-weight: 500;
  padding: 1.325em 3.5em 2.625em;
  margin: -0.25em -0.75em;
  color: var(--color_orange);
  background: center/contain url("../img/index/index_coordinator_bubble.svg") no-repeat;
}
#index_coordinator .detail_area .bubble .big {
  font-size: 1.1428571em;
  font-weight: 700;
}
#index_coordinator .detail_area .row_pdf {
  display: flex;
  gap: 1.25rem;
  margin-top: 1.25rem;
}
#index_coordinator .detail_area .row_pdf .btn {
  flex: 1;
  border: 1px solid var(--color);
  color: var(--color);
  background-color: #fff;
  padding: 0.25rem 1rem;
  border-radius: 10px;
  font-weight: 700;
}
#index_coordinator .detail_area .row_pdf .btn[data-color=green] {
  --color: var(--color_green);
}
#index_coordinator .detail_area .row_pdf .btn[data-color=lightblue] {
  --color: var(--color_lightblue);
}
#index_coordinator .detail_area .row_pdf .btn[data-color=blue] {
  --color: var(--color_blue);
}
#index_coordinator .detail_area .row_pdf .btn .big {
  font-size: 1.25em;
}
#index_coordinator .detail_area .row_pdf .btn .small {
  font-size: 0.875em;
}
#index_coordinator .detail_area .row_pdf .btn .size {
  font-size: 0.8125em;
}
#index_coordinator .detail_area .row_btn {
  display: flex;
  gap: 1.25rem;
  margin-top: 1.25rem;
}
#index_coordinator .detail_area .row_btn .btn {
  flex: 1;
  border: 1px solid var(--color);
  background-color: var(--color);
  color: #fff;
  padding: 0.5rem 1.5rem 0.5rem 0.75rem;
  border-radius: 10px;
  font-weight: 700;
  position: relative;
}
#index_coordinator .detail_area .row_btn .btn[data-color=green] {
  --color: var(--color_green);
}
#index_coordinator .detail_area .row_btn .btn[data-color=lightblue] {
  --color: var(--color_lightblue);
}
#index_coordinator .detail_area .row_btn .btn[data-color=blue] {
  --color: var(--color_blue);
}
#index_coordinator .detail_area .row_btn .btn::after {
  content: "";
  width: 0.875em;
  aspect-ratio: 1/1;
  background: center/contain url("../img/common/icon_arrow-circle-white.svg") no-repeat;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.325rem;
}
#index_coordinator .detail_area .row_btn .btn .small {
  font-size: 0.8125em;
}
#index_coordinator .detail_area .btn_01 {
  font-size: clamp(1.125rem, 1.25vw, 1.25rem);
}
@media screen and (max-width: 959px) {
  #index_coordinator::after {
    width: 3.5rem;
    top: -2rem;
    right: -2rem;
  }
  #index_coordinator .flex {
    flex-direction: column;
  }
  #index_coordinator .detail_area .bubble {
    font-size: 0.875rem;
    padding: 1.325em 1.5em 2.625em;
  }
  #index_coordinator .detail_area .row_pdf {
    margin-top: 0.5rem;
    gap: 0.25em;
  }
  #index_coordinator .detail_area .row_pdf .btn {
    font-size: 0.75rem;
    padding: 0.5rem;
  }
  #index_coordinator .detail_area .row_pdf .btn .size {
    font-size: 0.875em;
    display: inline-block;
  }
  #index_coordinator .detail_area .row_btn {
    margin-top: 0.5rem;
    gap: 0.25em;
  }
  #index_coordinator .detail_area .row_btn .btn {
    font-size: 0.875rem;
    padding: 0.5rem;
  }
  #index_coordinator .detail_area .btn_01 {
    margin-top: 1rem;
    font-size: 0.9375rem;
  }
}

/*==========
キャリア教育の事例紹介
==========*/
#index_career {
  padding-bottom: 0;
}
#index_career .layout_career_index {
  margin-top: 2.5rem;
}
#index_career .btn_area {
  margin-top: 2rem;
  display: flex;
  gap: 2.5rem;
  justify-content: space-between;
}
#index_career .btn_area > * {
  flex: 1;
}
#index_career .btn_area .deco {
  margin-left: -2.5rem;
  margin-bottom: -0.625rem;
}
#index_career .btn_area .btn_01 {
  margin-left: auto;
}
@media screen and (max-width: 959px) {
  #index_career .layout_career_index {
    margin-top: 1rem;
  }
  #index_career .btn_area {
    flex-direction: column;
  }
  #index_career .btn_area .btn {
    order: -1;
  }
  #index_career .btn_area .btn_01 {
    padding-left: 0.5em;
    margin-left: auto;
    margin-right: auto;
  }
}

/*==========
信州ものづくりマイスターの派遣
==========*/
#index_meister .intro_area {
  font-weight: 500;
}
#index_meister .intro_area .flex {
  display: flex;
  gap: 1.5rem;
}
#index_meister .intro_area .flex > * {
  flex: 1;
}
#index_meister .intro_area .left .link_blank {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  display: block;
  font-size: 1.125rem;
  font-weight: 700;
  text-decoration: none;
  margin-top: 1rem;
}
#index_meister .intro_area .bubble {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  padding: 1.125em 1.5em 1.625em;
  margin-top: -0.5em;
  font-size: clamp(1.125rem, 1.625vw, 1.625rem);
  line-height: 1;
  font-weight: 700;
  color: #fff;
  background: center/contain url("../img/index/index_meister_bubble.svg") no-repeat;
}
#index_meister .intro_area .btn_01 {
  margin-top: 2rem;
}
#index_meister .intro_area .bg {
  background-color: var(--color_lightblue_bg);
  padding: 1.5rem 2.5rem;
  border-radius: var(--border_radius);
  height: 100%;
}
#index_meister .intro_area .bg .title {
  font-size: clamp(1.125rem, 1.625vw, 1.625rem);
  font-weight: 700;
  color: var(--color_lightblue);
  margin-bottom: 1rem;
}
#index_meister .intro_area .bg .list_dots {
  margin-top: 0.625rem;
}
#index_meister .intro_area .bg .list_dots > *::before {
  color: var(--color_lightblue);
}
#index_meister .intro_area .bg .aside {
  margin-top: 0.625rem;
  font-size: 0.875rem;
  line-height: 1.428571;
  font-weight: 400;
}
#index_meister .report_area {
  margin-top: 4rem;
}
#index_meister .report_area .btn_01 {
  margin-top: 2.5rem;
  margin-left: auto;
  margin-right: auto;
}
#index_meister .case_area {
  margin-top: 4rem;
}
#index_meister .case_area h3:not([class]) {
  text-align: center;
}
#index_meister .case_area .btn_01 {
  margin-top: 2.5rem;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 959px) {
  #index_meister .intro_area .flex {
    flex-direction: column;
  }
  #index_meister .intro_area .left .link_blank {
    margin-top: 1rem;
    font-size: 0.875rem;
  }
  #index_meister .intro_area .bubble {
    font-size: 1rem;
  }
  #index_meister .intro_area .btn_01 {
    padding-left: 0.25rem;
  }
  #index_meister .intro_area .bg {
    padding: var(--paddingLR);
  }
  #index_meister .intro_area .bg .title {
    font-size: 1rem;
  }
  #index_meister .intro_area .bg .aside {
    font-size: 0.75rem;
  }
  #index_meister .report_area .btn_01,
#index_meister .case_area .btn_01 {
    margin-top: 1.5rem;
  }
}

/*==========
新着情報
==========*/
#index_news .flex {
  display: flex;
  gap: 1rem 2.5rem;
}
#index_news .title_area {
  margin-top: 0.5rem;
  width: 31.25%;
}
#index_news .list_area {
  flex: 1;
}
@media screen and (max-width: 959px) {
  #index_news .flex {
    flex-direction: column;
  }
  #index_news .title_area {
    display: contents;
  }
  #index_news .btn_02 {
    order: 1;
    margin-left: auto;
  }
}

/*==========
index_footer
==========*/
#index_footer {
  background-color: #EBEEED;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}
#index_footer .row_upper {
  display: flex;
  gap: 1rem 2.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #C9C9C9;
  margin-bottom: 1.5rem;
}
#index_footer .row_upper .title_main {
  font-size: 1.375rem;
  color: var(--color_green);
  font-weight: 700;
}
#index_footer .row_upper .link_area {
  flex: 1;
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  margin-left: auto;
}
#index_footer .row_upper .link_area .flex {
  display: flex;
  gap: 1.25rem;
}
#index_footer .row_upper .link_area .flex:not(:last-child) {
  margin-bottom: 1rem;
}
#index_footer .row_upper .link_area .item:not(:last-child) {
  border-right: 1px dashed var(--color_green);
  padding-right: 1.25rem;
}
@media screen and (max-width: 959px) {
  #index_footer .row_upper {
    flex-direction: column;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
    border-bottom: none;
  }
  #index_footer .row_upper .title_main {
    font-size: 1.125rem;
  }
  #index_footer .row_upper .link_area .flex {
    flex-direction: column;
    gap: 0.5rem;
  }
  #index_footer .row_upper .link_area .flex:not(:last-child) {
    margin-bottom: 0.5rem;
  }
  #index_footer .row_upper .link_area .item:not(:last-child) {
    border-right: none;
    padding-right: 0;
  }
  #index_footer .row_upper .link_area .item {
    padding-bottom: 0.5rem;
    border-bottom: 1px dashed var(--color_green);
  }
}

.layout_banner {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
}
.layout_banner > * {
  height: clamp(48px, 6.25vw, 100px);
}
.layout_banner > * img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (max-width: 959px) {
  .layout_banner {
    gap: var(--paddingLR);
  }
}