@charset "utf-8";
/* ========================================================
	top.css => トップページ用CSS
======================================================== */
.slide {
      position: relative;
}

.slide{
	max-height: 70vh;
	overflow: hidden;
}
.slide_text {
      width: 1000px;
      position: absolute;
      top: 20%;
      left: 55%;
      transform: translate(-50%, -50%);
      font-weight: 400;
      font-size: 5rem;
      color: #fff;
      letter-spacing: 2px;
      text-shadow: -1px 0px 6px rgba(0, 0, 0, 0.9);
}
.slide_text span {
      font-size: 1.4em;
}
@media screen and (max-width: 1100px) {
      .slide_text {
            top: 30%;
            width: 90%;
      }
}
@media screen and (max-width: 680px) {
      .slide_text {
            font-size: 3rem;
            top: auto;
            bottom: 4em;
            left: 2em;
            transform: translate(-00%, -0%);
      }
}
/* slick
------------------------------------------------------------- */
.slider li {
      position: relative;
}
.slider img {
      width: 100%;
   /*   height: auto;*/
	height: 50vh;
	object-position: top;
}
.slider span {
      position: absolute;
      right: 5vw;
      top: 5.5vw;
      z-index: 1;
      width: 30vw;
      height: auto;
}
.slick-slider {
      margin-bottom: 0 !important;
}
@media screen and (max-width: 680px) {
	.slider img {
	height: 60vh;
}
	
}
/*top_info_area
--------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 681px), print {
      .top_info_tab_flex {
            display: flex;
            justify-content: space-around;
            gap: 0 3%;
      }
      .top_info_tab {
            position: relative;
            cursor: pointer;
            display: flex;
            justify-content: center;
            padding: 1em 0;
            width: 100%;
            border-bottom: 3px solid var(--col_cate);
      }
      .top_info_tab.all {
            font-weight: 600;
            color: var(--col_gray);
      }
}
@media screen and (max-width: 680px) {
      .top_info_tab_flex {
            display: flex;
            flex-wrap: wrap;
            gap: 1em 2%;
      }
      .top_info_tab {
            padding: 0.2em 0;
            border: 1px solid var(--col_cate);
            position: relative;
            box-sizing: border-box;
            text-align: center;
            width: 49%;
            font-weight: 600;
            color: var(--col_cate);
      }
}
/*矢印*/
.top_info_tab.is-active:before:hover {
      bottom: -25px;
      transition: all 0.5s ease;
}
.top_info_tab.is-active:before, .top_info_tab:hover:before {
      content: "";
      position: absolute;
      border: 5px solid transparent;
      border-top: 7px solid var(--col_cate);
      left: 50%;
      box-sizing: border-box;
      bottom: -15px;
      transform: translate(-50%, -0%);
      z-index: 1;
}
@media screen and (max-width: 680px) {
      .top_info_tab.is-active:before, .top_info_tab:hover:before {
            bottom: -15px;
      }
      .top_info_tab.is-active {
            color: #fff !important;
	      /*koko*/
            background: var(--col_cate);
      }
}

/*top_info_list_style
------------------------------------------------------------------------*/
.top_info_list_style_inner {
      padding: 3em 0;
      width: 1180px;
      margin: 0 auto;
}
@media screen and (max-width: 1200px) {
      .top_info_list_style_inner {
            width: 95%;
      }
}
/*top_info_list_style用にデザイン変更
----------------------------------------------------*/
.top_info_list_style .info_list > li {
      margin-top: 0.5em;
}
.top_info_list_style .info_list_inner {
      border: none;
      background: #fff;
      border-radius: var(--mo_rudius_pc);
}
.info_list > li:first-child {
      border: none;
}
/*カテゴリデザイン変更
----------------------------------------------------*/
.top_info_list_style .info_list_inner .info_cate > *{
      background: #fff;
      border-radius: 2px;
	border: solid 1px var(--col_cate);
	color: var(--col_cate);
}
@media screen and (min-width: 961px) ,print{
	.top_info_list_style .info_list_inner .info_cate > a:hover {
      background: var(--col_cate);
	color: #fff;
}

}


.all_topcate {
      --col_cate: var(--col_btn_back);
}
.press-release_topcate {
      --col_cate: var(--col_blue_l);
}
.info_topcate {
      --col_cate: var(--col_green_l);
}
.event_topcate {
      --col_cate: var(--col_yellow);
}
.recruit_topcate{
      --col_cate: var(--col_green_b);
}
.ir_topcate {
      --col_cate: var(--col_pup);
}


/*top_service_area
--------------------------------------------------------------------------------------------------------------------------*/
.top_service_inner {
      position: relative;
}
.top_service_inner:before, .top_service_inner:after {
      content: "";
      background: var(--col_main);
      height: 80%;
      width: 50%;
      position: absolute;
      bottom: 0;
      z-index: -1;
}
.top_service_inner:before {
      left: 0;
}
.top_service_inner:after {
      right: 0;
      background: var(--col_green_b);
}
@media screen and (max-width: 680px) {
      .top_service_inner:before, .top_service_inner:after {
            content: none !important;
      }
}
/*top_service_flex*/
.top_service_flex {
      width: 1400px;
      margin: auto;
      display: flex;
}
.top_service_flex > .top_service_cont {
      width: 50%;
}
.looking_cont {
      padding: 0em 7em 4em 0;
}
.residents_cont {
      padding: 0em 0em 4em 7em;
}
.top_service_title {
      padding: 1em 0;
      text-align: center;
      color: #fff;
      font-weight: 600;
      letter-spacing: 2px;
}
.top_service_flex .img img {
      width: 100%;
}
@media screen and (max-width: 1450px) {
      .top_service_flex {
            width: 85%;
      }
      .looking_cont {
            padding: 0em 7.5% 4em 0;
      }
      .residents_cont {
            padding: 0em 0em 4em 7.5%;
      }
}
@media screen and (max-width: 680px) {
      .top_service_flex {
            display: block;
            width: 100%;
      }
      .top_service_flex > .top_service_cont {
            width: 90%;
            margin: auto;
            position: relative;
      }
      .top_service_flex > .top_service_cont + .top_service_cont {
            margin-top: 3em;
      }
      .top_service_flex > .top_service_cont:before {
            content: "";
            background: var(--col_main);
            height: 80%;
            width: 150%;
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translate(-50%, -0%);
            z-index: -1;
      }
      .residents_cont:before {
            background: var(--col_green_b) !important;
      }
      .looking_cont {
            padding: 0em 0 3em 0;
      }
      .residents_cont {
            padding: 0em 0em 3em 0;
      }
}
/*公社の取り組み
--------------------------------------------------------------------------------------------------------------------------*/
.top_action_area {
      padding: 8em 0;
}
.top_action_bg {
      position: relative;
}
.top_action_bg:before {
      content: "";
      background: var(--col_main_l);
      height: 120%;
      width: 1400px;
      position: absolute;
      top: 50%;
      left: 50%;
      z-index: -1;
      transform: translate(-50%, -50%);
}
/*スライドの時　５以下
------------------------------------------------------------*/
.one_slide {
      width: 98%;
      margin: auto;
      display: flex !important;
      justify-content: center;
      padding: 0em 0 0em 0 !important;
}
.one_slide li {
      width: calc(100% / 5) !important;
}
@media screen and (max-width: 960px) {
      .one_slide li {
            margin: auto 0em !important;
            width: calc(100% / 5) !important;
      }
}
@media screen and (max-width: 680px) {
      .one_slide li {
            width: 90% !important;
      }
}
/*スライドの時 6以上
------------------------------------------------------------*/
.action_slider.action_card_list {
      position: relative;
      display: block;
      padding: 1em 0 5em 0;
}
.action_slider.action_card_list li {
      width: auto;
      margin: auto 0.5em;
}
@media screen and (max-width: 680px) {
      .action_slider.action_card_list {
            padding: 0em 0 5em 0;
      }
      .action_slider.action_card_list li {
            margin: auto 2em;
      }
}
/*矢印　ドッド
------------------------------------------------------------*/
/*dods*/
.action_slider .slick-dots {
      bottom: 0;
}
.action_slider .slick-dots li {
      margin: auto 5px !important;
}
.action_slider .slick-dots li button:before {
      opacity: 1 !important;
      content: "";
      background: var(--bg_gray_ll);
      width: 24px;
      height: 4px;
}
.action_slider .slick-dots li.slick-active button:before {
      opacity: 1 !important;
      background: var(--col_main) !important;
}
/*arrow*/
/*矢印リセット*/
.action_slider .slick-prev:before, .action_slider .slick-next:before {
      font-size: inset;
      opacity: 1;
      background: url("../images/arrow_02.svg") no-repeat;
      background-position: center;
      background-size: 45%;
      filter: var(--fil_ff);
      aspect-ratio: var(--arrow_aspct_01);
      color: transparent;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
}
.action_slider .slick-prev:before {
      transform: translate(-50%, -50%) rotate(-180deg);
}
.action_slider .slick-prev, .action_slider .slick-next {
      z-index: 2;
      bottom: 0;
      top: auto;
      margin-top: auto;
      aspect-ratio: 1;
      width: 40px;
      height: auto;
      border: solid 1px var(--col_main);
      background: var(--col_main);
}
.action_slider .slick-prev {
      border: solid 1px var(--col_main);
      left: auto;
}
@media screen and (min-width:2001px), print {
      .action_slider .slick-prev {
            left: calc(50% + 500px);
            transform: translate(-50%, -0%);
      }
      .action_slider .slick-next {
            left: calc(50% + 500px + 40px + 10px);
            transform: translate(-50%, -0%);
      }
}
@media screen and (max-width: 2000px) {
      .action_slider .slick-prev {
            right: calc(20vw + 40px + 10px);
      }
      .action_slider .slick-next {
            right: 20vw;
      }
}
@media screen and (max-width: 1400px) {
      .action_slider .slick-prev {
            right: calc(10rem + 40px + 10px);
      }
      .action_slider .slick-next {
            right: 10rem;
      }
}
@media screen and (max-width: 960px) {
      .action_slider .slick-prev {
            right: calc(2rem + 40px + 10px);
      }
      .action_slider .slick-next {
            right: 2rem;
      }
}
@media screen and (max-width: 680px) {
      .action_slider .slick-prev, .action_slider .slick-next {
            bottom: auto;
            top: 40%;
            left: 0;
            transform: translate(-0%, -50%);
      }
      .action_slider .slick-next {
            right: 0;
            left: auto;
      }
}
/*企業情報 
--------------------------------------------------------------------------------------------------------------------------*/
.top_company_area {
      margin-bottom: 5em;
}
@media screen and (max-width: 680px) {
      .top_company_area {
            margin-bottom: 3em;
      }
}

.top_company_flex {
      display: flex;
      gap: 0 5%;
      position: relative;
      padding: 10em 0 5em 0;
}
.top_company_flex:before {
      content: "";
      z-index: -1;
      position: absolute;
      right: -40%;
      height: 60%;
      width: 100%;
      bottom: 0;
      background: var(--bg_gray_l);
}
.top_company_flex .img {
      width: 30%;
      transform: translate(-10em, 8em) scale(1.7);
}
.top_company_flex .img img {
      width: 100%;
}
.top_company_flex .text_box {
      width: 70%;
}
@media screen and (max-width: 1200px) {
      .top_company_flex:before {
            right: -45%;
      }
      .top_company_flex .img {
            width: 40%;
            transform: translate(0, 0) scale(1);
      }
      .top_company_flex .text_box {
            width: 60%;
            margin-right: 2.5%;
      }
}
@media screen and (max-width: 680px) {
      .top_company_flex:before {
            right: 0;
            width: 100%;
            height: 80%;
            bottom: -3em;
      }
      .top_company_flex .img {
            width: auto;
            overflow: hidden;
            height: 19em;
      }
      .top_company_flex .text_box {
            width: auto;
            margin-right: auto;
      }
      .top_company_title {
            text-align: center !important;
      }
      .top_company_title span {
            padding-left: 0 !important;
            padding-top: 1.8em !important;
      }
      .top_company_title span:before {
            top: 0 !important;
            left: 50% !important;
            transform: translate(-50%, -0%) !important;
      }
      /*順番変更
	--------------------------------------------------------*/
      .top_company_w {
            display: flex;
            flex-direction: column;
      }
      /*ボックスの無効化*/
      .top_company_w .text_box, .top_company_flex {
            display: contents;
      }
      .top_company_w .top_company_title {
            order: 1;
      }
      .top_company_w .img {
            order: 2;
      }
      .top_company_w .top_company_list {
            order: 3;
      }
      .top_company_btn {
            order: 4;
      }
}
/*top_company_list
------------------------------------------------------*/
.top_company_list {
      display: flex;
      flex-wrap: wrap;
      gap: 3em 4%;
}
.top_company_list > li {
      width: calc((100% / 2) - (4% / 2));
}
@media screen and (max-width: 680px) {
      .top_company_list {
            padding-top: 2em;
            width: 90%;
            margin: auto;
            display: block;
      }
      .top_company_list > li {
            width: auto;
      }
      .top_company_list > li + li .midashi_10 {
            border-top: none;
      }
}
/*top_recruit_area
--------------------------------------------------------------------------------------------------------------------------*/
.top_recruit_area {
      overflow: hidden;
      padding: 7em 0 5em 0;
}
.top_recruit_w {
      width: 1728px;
      margin: auto;
}
@media screen and (max-width: 1815px) {
      .top_recruit_w {
            width: 100%;
      }
}
@media screen and (max-width: 680px) {
      .top_recruit_area {
            padding: 3em 0 0em 0;
      }
}
.top_recruit_cont {
      position: relative;
}
.top_recruit_img_01 img, .top_recruit_img_02 img {
      width: 100%;
}
/*text_box パーツ
------------------------------------------------------------------*/
.top_recruit_title {
      font-weight: bold;
      color: var(--col_green);
      letter-spacing: 1px;
      font-size: 6.5em;
      position: relative;
      transform: translateX(-1.4em);
      line-height: 1;
}
@media screen and (max-width: 680px) {
      .top_recruit_title {
            transform: translateX(0);
      }
}
.top_recruit_sub_title {
      font-weight: 600;
      font-size: 2.25em;
      padding: 1em 0 1em 0;
      line-height: 1.4;
}
.top_recruit_txt {
      font-size: 1.1em;
}
.top_recruit_btn {
      padding-top: 8.5em;
}
/*順番 画像サイズ調整　pc
------------------------------------------------------------------*/
.top_recruit_cont {
      min-height: 694px;
      position: relative;
}
@media screen and (max-width: 1815px) {
      .top_recruit_cont {
            min-height: 40vw;
      }
}
@media screen and (max-width: 680px) {
      .top_recruit_cont {
            min-height: none;
      }
}
.top_recruit_cont > * {
      position: absolute;
}
.top_recruit_img_01, .top_recruit_img_02 {
      z-index: -1;
}
.top_recruit_img_01 {
      width: 678px;
      top: 4em;
      left: 0;
}
.top_recruit_cont .text_box {
      top: 0;
      left: 40%;
      transform: translate(-50%, -0%);
}
.top_recruit_img_02 {
      width: 848px;
      top: -5em;
      right: 0;
}
@media screen and (max-width: 1815px) {
      .top_recruit_img_01 {
            width: 38vw;
            top: 3.0em;
      }
      .top_recruit_cont .text_box {
            font-size: 1.2rem;
      }
      .top_recruit_btn {
            padding-top: 6vw;
      }
      .top_recruit_img_02 {
            width: 50vw;
      }
}
@media screen and (max-width: 960px) {
      .top_recruit_cont .text_box {
            font-size: 1vw;
      }
}
/*sp*/
@media screen and (max-width: 680px) {
      .top_recruit_cont > * {
            width: 100%;
            position: static;
            top: auto;
            left: auto;
            right: auto;
            transform: translate(-0%, -0%) !important;
      }
      .top_recruit_cont .text_box {
            font-size: 1.2rem;
            width: 90%;
            margin: 5em auto;
      }
      .top_recruit_txt {
            font-size: 1.8em;
      }
      .top_recruit_btn {
            font-size: 1.6rem;
      }
      .top_recruit_btn .btn_m > * {
            width: 100%;
      }
}