@charset "UTF-8";
/*
//////////////////////////////////////////////////////////////////////////////

top.css
- トップページ

//////////////////////////////////////////////////////////////////////////////
*/



.catchphrase{
  font-family: serif;
  text-shadow: 3px 3px 3px black;
  color: #eeeeee;
}

/* mainvisual
===============================================
=============================================== */
.mainvisual {
  overflow: hidden;
  position: relative;
  height: auto;
  text-align: center;
  background-color: #fff;

  background-image: url("../img/home/mainvisual2025_02.jpg");
  background-repeat: no-repeat;
  width: 100%; /*600px*/
  height: 600px;  /* 530px 814px */
  height: calc(600vw / 4.4);

  background-size:100%;

  /*
  position: absolute;
  top: 120px;
  left: 0px; /*calc(calc(100% - 600px) / 2)
  */
}
.mainvisual img {
  height: auto;
  width: 100%;
  min-width: 500px;
  text-align: center;
  position: relative;
  left: 50%;
  transform: translate(-50%, 0%);

  display: none;
  width: 1200px;
  height: 933px;
}
.mainvisual p {
  margin: auto;
}

.mainvisual_img {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

.mainvisual_catch {
  position: absolute;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  width: 100%;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  color: #333;
  font-size: 2.4rem;
  text-align: center;
  line-height: 1.3;

  color: #FFF;
  font-size: 200%;
  font-weight: bold;
  text-shadow: 2px 2px 5px #000,
  -2px 2px 5px #000,
  2px -2px 5px #000,
  -2px -2px 5px #000;
}



@media screen and (min-width: 600px) {
  .mainvisual {
    height: auto;
    min-height: auto;

    background-image: url("../img/home/mainvisual2025.jpg");
    background-repeat: no-repeat;
    width: 1200px;
    height: 933px;
    background-size:contain;



    position: absolute;
    top: 120px;
    left: calc(calc(100% - 1200px) / 2);
  }
  .mainvisual img {
    
    height: auto;
    position: static;
    left: 0;
    margin-left: 0;
    transform: translate(0%, 0%);

     display: none;
  width: 1200px;
  height: 933px;
  }

  .mainvisual_catch {
    font-size: 3.2rem;
  }


}
@media screen and (min-width: 960px) {
  .mainvisual {
    /*height: auto;*/

    display: block;

    background-image: url("../img/home/mainvisual2025.jpg");
    background-repeat: no-repeat;
    width: 1200px;
    height: 933px;

    position: absolute;
    top: 120px;
    left: calc(calc(100% - 1200px) / 2);

  }
  .mainvisual img {
    width: 100%;
    max-width: 1200px;
    height: auto;
    background-color: #e8f3e4;

    display: none;
    width: 1200px;
    height: 933px;
  }

  .mainvisual_img {
    position: relative;
  }

  .mainvisual_catch {
    font-size: 4.8rem;
  }


}
/* 求人検索
============================== */
.job_search {

  
  
/*
  position: absolute;
  width: 345px;
  top: calc(420px * calc(375px / 345px));


  width: calc(345vw / 4.4);

  top: calc(calc(410vw / 4.4) * calc(100vw / calc(345vw / 4.4)));

  

  top:  calc(410px * calc(100vw / 375px));

  top:  calc(calc(530vw / 4.4) * (88% / 100%));
*/

  position: relative;
  position: absolute;
  width: 88%;
  top:  calc(525vw / 4.4);

  left: calc(calc(100% - 88%) / 2);
 /*
  border-radius:25px;
    background-color: #ff7bac;
  */
  padding: 0px 0 20px;
  /*background: #307036;*/
  /*background-color: #f8f7f0;*/
  color: #fff;
  text-align: center;

  display: flex;
  justify-content: center;
  align-items: flex-end;
  flex-wrap: wrap;
}
.job_search .catch {
  padding: 0 0px;
  margin-bottom: 0px;
  font-weight: bold;
  font-size: 1.35rem;

}

.job_search .total {
  position: relative;
  margin-right: 10px;
  margin-top: 10px;
  margin-bottom: 0px;
  display: flex;
  align-items: flex-end;
  line-height: 1;

  
}
.job_search .total span {
  font-size: 3.5rem;
  font-weight: bold;
  margin-right: 5px;

}
.job_search .total div{
  text-align: left;
  margin-right: 5px;
  margin-top: 3px;

}

.job_search p {
  margin: 5px 0 0;
}

.job_search .slct {
  width: 100%;
  font-size: 1.4rem;
  padding-right: 10px;
  /*margin-bottom: 5px;*/
}
.job_search .job_search_slct02 {
  position: relative;
  margin-left: 0px;
  padding: 0px;

}
  /*
  .job_search .job_search_slct02::before {
    position: absolute;
    top: 0;
    left: 0px;
    display: block;
    content: "×";
    width: 40px;
    height: 40px;
    font-weight: normal;
    color: #e8f3e4;
    font-size: 3.2rem;
  }
*/
.job_search .btn_icon {
    width: 50px;

    vertical-align: middle;
    margin-left: 10px;
    background-color: #cb5389;
    border: none;
}
.job_search .btn_icon:hover {
  background-color: #ff7bac;
  border: 1px solid white;
}

@media screen and (max-width: 599px) {
  .job_search .job_search_slct02 {
    width: 70%;
  }
}


@media screen and (min-width: 600px) {
  .job_search {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;

    
    width: 1020px;
    position: absolute;
    top:  800px;
    left: calc(calc(100% - 1020px) / 2);
    
    /*top: calc(800 * calc(100vw / 1200));*/
    
    /*
    border-radius:35px;
    background-color: #ff7bac;
    */
  }
  .job_search .catch {
    width: 100%;
    margin-bottom: 10px;
    font-size: 2.4rem;

  }
  .job_search .total {
    position: relative;
    margin-right: 10px;
    margin-bottom: 0;
    display: flex;
    
    align-items: flex-end;
    line-height: 1;

  }
  .job_search .total div{
    text-align: left;
    margin-right: 5px;
    margin-top: 3px;
  }
  .job_search p {
    margin: 0;
  }
  .job_search .select {

     margin-top: 10px;
     width: 100%;
  }
  .job_search .slct {
    width: 260px;
    margin: 0;
  }
  .job_search .job_search_slct02 {
    position: relative;
    margin-left: 40px;

  }
  .job_search .job_search_slct02::before {
    position: absolute;
    top: 0;
    left: -40px;
    display: block;
    content: "×";
    width: 40px;
    height: 40px;
    font-weight: normal;
    color: #e8f3e4;
    font-size: 3.2rem;
  }
  .job_search .btn_icon {
    width: 50px;
    margin-left: 10px;
  }
  .job_search .btn_icon{
    background-color: #cb5389;
    border: none;
  }
  .job_search .btn_icon:hover {
    background-color: #ff7bac;
    border: 1px solid white;
  }
}

@media screen and (min-width: 1200px) {
  .job_search {

    position: absolute;
   
    top: 800px;
    left: calc(calc(100% - 1020px) / 2);


  }
}
/* 新卒採用・インターンシップ誘導バナー
============================== */
.bn_sp{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    list-style: none;
    margin: 0 auto;
    padding: 0;
    background: #fff;
    /*background: #dfede0;*/
}
@media screen and (min-width: 960px) {
    .bn_sp{
        flex-wrap: nowrap;
        margin-top: 933px;
    }
}
@media screen and (min-width: 600px) {
    .bn_sp{
        flex-wrap: nowrap;
        margin-top: 933px;
    }
}
@media screen and (min-width: 1200px) {
    .bn_sp{
        flex-wrap: nowrap;
        margin-top: 933px;
    }
}
@media screen and (min-width: 600px) {
    .bn_sp li{
        max-width: 600px;
    }
}

.bn_sp img{
    width: 100%;
    max-width: 640px;
    height: auto;
}

/* contents
===============================================
=============================================== */
/* 共通
============================== */
h2 {
  margin: 0;
}

/* あなたへのオススメ
============================== */
.sec_recommend {
  padding: 0px 0px;
  /*background-color: #E1F6FF;*/
  /*
  background: url("../img/home/bg_pickup.jpg");
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 95%, white 100%), url("../img/home/bg_pickup.jpg");
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 95%, white 100%), url("../img/home/bg_pickup.jpg");
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 95%, white 100%), url("../img/home/bg_pickup.jpg");
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  */
  
}
.sec_recommend .sec_title {
  margin: .7rem 0 20px;
}
.sec_recommend .joboffer_box,
.sec_recommend .company_box,
.sec_recommend .event_box {
  /*
  background: red;
  background: -moz-linear-gradient(left, white 0%, white 100%);
  background: -webkit-linear-gradient(left, white 0%, white 100%);
  background: linear-gradient(to right, white 0%, white 100%);
  background-position: top 0 left 30px;
  background-repeat: no-repeat;
  */
}
@media screen and (min-width: 700px) {
  .sec_recommend {
    padding: 30px calc((100vw - 680px)/2);
  }
}
@media screen and (min-width: 960px) {
  .sec_recommend {
    /*padding: 50px calc((100vw - 960px)/2);*/
    /*padding: 50px calc((100vw - 1200px)/2 + 120px) 50px;*/
    padding: 50px 120px;
    background-color: #E1F6FF ;
    max-width: 1200px;
    margin: 0 auto;
  }
  .sec_recommend .box_wrap {
    width: 100%; /*880px*/
    margin: 40px auto auto;
  }
  .sec_recommend .box_wrap .joboffer_box,
  .sec_recommend .box_wrap .company_box,
  .sec_recommend .box_wrap .event_box {
    margin-left: 20px;
  }
  .sec_recommend .box_wrap .joboffer_box:nth-child(3n + 1),
  .sec_recommend .box_wrap .company_box:nth-child(3n + 1),
  .sec_recommend .box_wrap .event_box:nth-child(3n + 1) {
    margin-left: 0;
  }
}

.recommend_inner {
  padding: 0px;
  /*background: rgba(255, 255, 255, 0.8);*/
  background-color: #E1F6FF ;
  width: 100%;
  
}
.recommend_inner .box_wrap {
  margin-top: 40px;
}
@media screen and (min-width: 600px) {
  .recommend_inner {
    padding: 0px;
  }
}
@media screen and (min-width: 600px) {
  .recommend_inner .box_wrap {
    margin-top: 30px;
  }
}
@media screen and (min-width: 960px) {
  .recommend_inner .box_wrap {
    margin-top: 60px;

    /* 追加した？ */
    width: 920px;
    margin: 40px auto auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}

.recommend_no_data_txt {
  width: 325px;
  font-size: 1.1rem;
  text-align: center;
  /*
  max-width: 600px;
  */
  margin: auto auto 20px;
}

.recommend_joboffer,
.recommend_company,
.recommend_event,
.recommend_news {

  margin-top: 30px;
  width: 100%;
}
.recommend_joboffer::before,
.recommend_company::before,
.recommend_event::before,
.recommend_news::before {
  position: absolute;
  top: -20px;
  left: 0;
  display: block;
  font-size: 1.1rem;
  width: 74px;
  height: 19px;
  border-radius: 4px 0 0 0;
  text-align: center;
}
.recommend_joboffer::after,
.recommend_company::after,
.recommend_event::after,
.recommend_news::after {
  position: absolute;
  display: block;
  content: "";
  top: -20px;
  left: 73.5px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 19px 0 0 10px;
}

@media screen and (max-width: 440px) {
  .recommend_joboffer::before,
  .recommend_company::before,
  .recommend_event::before,
  .recommend_news::before {
    top: -9px;
    left: 55px;
  }
  .recommend_joboffer::after,
  .recommend_company::after,
  .recommend_event::after,
  .recommend_news::after {
    top: -9px;
    left: calc(55px + 73.5px);
  }
}

.recommend_joboffer::before {
  content: "求人情報";
  color: #fff;
  background: #e37aa9;  /*#307036*/
}
.recommend_joboffer::after {
  border-color: transparent transparent transparent #e37aa9;  /*#307036*/
}

.recommend_company::before {
  content: "企業情報";
  color: #fff;
  background: #e37aa9;  /*#2da638*/
}
.recommend_company::after {
  border-color: transparent transparent transparent #e37aa9;  /*#2da638*/
}

.recommend_event::before {
  content: "イベント";
  color: #fff;       /*#307036*/
  background: #e37aa9;  /*#e8f3e4*/
}
.recommend_event::after {
  border-color: transparent transparent transparent #e37aa9;  /*#e8f3e4*/
}

.recommend_news::before {
  content: "お知らせ";
  color: #fff;
  background: #e37aa9;  /*#a25768*/
}
.recommend_news::after {
  border-color: transparent transparent transparent #e37aa9;  /*#a25768*/
}

.recommend_nodata_bnr {
  display: flex;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.recommend_nodata_bnr li + li {
  margin-left: 10px;
}
.recommend_nodata_bnr li img {
  width: auto;
  height: 40px;
}

/* 山梨県の求人情報
============================== */
.sec_joboffer {
  padding: 20px 0 0;
}
@media screen and (min-width: 600px) {
  .sec_joboffer {
    padding: 30px 0 0;
  }
}
@media screen and (min-width: 960px) {
  .sec_joboffer {
    padding: 50px 0 0;
  }
}

/* イベント情報
============================== */
.sec_event {
  margin: 20px 10px 0;
  padding: 20px 0 0;
  /*border-top: 1px solid #307036;*/
  background-color: #f8f7f0;
}
.sec_event .inner {
  padding: 0;
}
@media screen and (min-width: 600px) {
  .sec_event {
    margin: 30px 10px 0;
    padding: 30px 0 0;
  }
}
@media screen and (min-width: 960px) {
  .sec_event {
    max-width: 1200px;
    margin: 50px auto 0;
    padding: 50px 0 50px 0;
  }
  .sec_event .sec_event_btn {
    margin-top: 0;
  }
}

/* お知らせ
============================== */
.sec_news {
  margin-top: 20px 10px 0;
  padding: 20px 0 0;
  background: white;
}
.sec_news .inner {
  padding: 0;
}
@media screen and (min-width: 600px) {
  .sec_news {
    margin-top: 30px;
    padding: 30px 0;
  }
}
@media screen and (min-width: 960px) {
  .sec_news {
    margin-top: 50px;
  }
}

.sec_news_title {
  margin: 0 20px 10px;
  padding: 20px;
  color: #fff;
  background: #307036;
}
.sec_news_title h2 {
  margin-bottom: 15px;
  font-size: 1.8rem;
  text-align: center;
  /*
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  */
}
.sec_news_title p {
  margin: 0;
}
.sec_news_title .btn_s {
  width: 160px;
  margin: auto;
}
.news_list {
  max-width: 930px;
  margin: auto;
}
@media screen and (min-width: 960px) {
  .news_list {
    margin: 40px 0;
  }
}
.news_info:nth-child(2n+1){
  background-color: #e3e3e3;
}
.news_info:nth-child(2n){
  background-color: white;
}

.news_info {
  position: relative;
  display: flex;
  padding: 0 30px;
  /*border-bottom: 1px solid #307036;*/
}
.news_info::after {
  position: absolute;
  left: 0;
  bottom: -3px;
  display: block;
  content: "";
  width: 90px;
  /*border-bottom: 3px solid #307036;*/
}
@media screen and (min-width: 600px) and (max-width: 959px) {
  .news_info::after {
    width: 120px;
  }
}
.news_info time, .news_info p {
  margin: 1rem 0;
}
.news_info time {
  display: block;
  width: 90px;
  white-space: nowrap;
}
@media screen and (min-width: 600px) and (max-width: 959px) {
  .news_info time {
    width: 120px;
  }
}

.news_ttl {
  width: calc(100% - 100px);
}
@media screen and (min-width: 600px) and (max-width: 959px) {
  .news_ttl {
    width: calc(100% - 130px);
  }
}
.news_ttl a {
  display: inline-block;
  text-decoration: none;
  color: #323232;
}

@media screen and (min-width: 960px) {
  
  .sec_news {
    max-width: 1000px;
    margin: 50px auto 0;
    padding: 50px 0 50px 0;
  }
  .sec_news .sec_news_btn {
    margin-top: 0;
  }

  .sec_news_title {
    margin: 0;
    padding: 50px 0 50px calc((100vw - 1000px)/2);
    width: 30%;
    box-sizing: content-box;
  }

  .news_info::after {

    width: 150px;
    /*border-bottom: 3px solid #307036;*/
  }

/*
  .news_list {
    padding: 30px calc((100vw - 1000px)/2) 40px 0;
    width: 70%;
    box-sizing: content-box;
  }
*/
  .news_info time {
    width: 150px;
  }
  .news_ttl {
    width: calc(100% - 100px);
  }
  .news_ttl a {
    transition: .2s;
  }
  .news_ttl a:hover {
    color: #ff7bac;
  }
}
/* バナー
============================== */
.link_bnr {
  margin-top: 20px;
  padding-top: 10px;
  border-top: 1px solid #307036;
}
@media screen and (min-width: 600px) {
  .link_bnr {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-top: 30px;
    padding-top: 20px;
  }
  .link_bnr > p + p{
      margin-left: 10px;
  }
    .link_bnr p{
        width: calc(50% - 10px);
    }
}
@media screen and (min-width: 600px) and (max-width: 959px) {
    .link_bnr p:nth-child(odd){
        margin-left: 0;
    }
}
@media screen and (min-width: 960px) {
  .link_bnr {
    max-width: 1000px;
    margin: 40px auto 0;
  }
    .link_bnr p{
        width: calc(25% - 10px);
    }
    .link_bnr p:nth-child(4n+1){
        margin-left: 0;
    }
}



