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

top.css
- トップページ

//////////////////////////////////////////////////////////////////////////////
*/
/* mainvisual
===============================================
=============================================== */
.mainvisual { overflow: hidden; position: relative; height: 300px; text-align: center; }
.mainvisual img { height: 300px; width: auto; }
.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 }
.mainvisual_catch_bg{
  display:inline-block;
  max-width:320px;
  padding:10px 20px 7px;
  background:rgba(255,255,255,0.7);
  background:-moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 5%, rgba(255,255,255,0.7) 95%, rgba(255,255,255,0) 100%);
  background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 5%, rgba(255,255,255,0.7) 95%, rgba(255,255,255,0) 100%);
  background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 5%, rgba(255,255,255,0.7) 95%, rgba(255,255,255,0) 100%)
}
@media screen and (min-width: 600px){
  .mainvisual { height:480px; }
  .mainvisual img { height:480px; }
  .mainvisual_catch { font-size:3.2rem; }
  .mainvisual_catch_bg { max-width:550px; padding:20px 30px 15px; }
}
@media screen and (min-width: 960px) { 
  .mainvisual { height: auto; }
  .mainvisual img { width: 100vw; height: auto; }
  .mainvisual_img { position: relative; }
  .mainvisual_catch { font-size: 4.8rem; }
  .mainvisual_catch_bg { max-width:100%; padding:20px 40px 15px; } 
}
/* 求人検索
============================== */
.job_search { padding: 20px 0; background: #493759; color: #fff; text-align: center; }
.job_search .catch { padding:0 10px; font-weight:bold; font-size:1.8rem; }
.job_search .total { margin: 0 0 10px; line-height: 1; }
.job_search .total span { font-size: 3.5rem; font-weight: bold; }
.job_search p { margin: 0 auto 10px; }
.job_search .slct { width: 80%; }
.job_search .btn_icon { width: 70%; vertical-align: middle; }
@media screen and (min-width: 600px){.job_search .catch{font-size:2.0rem}}
@media screen and (min-width: 960px) { 
  .job_search { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; }
  .job_search .catch { width:100%; margin-bottom:5px; font-size:2.4rem; }
  .job_search .total { position: relative; margin-right: 30px; margin-bottom: 0; }
  .job_search p { margin: 0; }
  .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: bold; color: #dacfe5; font-size: 3.2rem; }
  .job_search .btn_icon { width: 50px; margin-left: 10px; } }

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

/* あなたへのオススメ
============================== */
.sec_recommend { padding:20px 10px;background:url("../img/home/bg_pickup.jpg"); background:-moz-linear-gradient(top, rgba(255,255,255,0) 95%, #fff 100%),url("../img/home/bg_pickup.jpg"); background:-webkit-linear-gradient(top, rgba(255,255,255,0) 95%, #fff 100%),url("../img/home/bg_pickup.jpg"); background:linear-gradient(to bottom, rgba(255,255,255,0) 95%, #fff 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:#fff;background:-moz-linear-gradient(left, #fff 0%, #fff 100%); background:-webkit-linear-gradient(left, #fff 0%, #fff 100%); background:linear-gradient(to right, #fff 0%, #fff 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); }
  .sec_recommend .box_wrap { width: 880px; }
  .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: 20px 10px; background: rgba(255, 255, 255, 0.8); }
.recommend_inner .box_wrap { margin-top: 40px; }
@media screen and (min-width: 600px) { .recommend_inner { padding: 30px 20px; } }
@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; } }

.recommend_no_data_txt { max-width: 600px; margin: auto auto 20px; }

.recommend_joboffer, .recommend_company, .recommend_event, .recommend_news { position: relative; margin-top: 30px; }
.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; }

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

.recommend_company::before { content: "企業情報"; color: #fff; background: #8491c3; }
.recommend_company::after { border-color: transparent transparent transparent #8491c3; }

.recommend_event::before { content: "イベント"; color: #493759; background: #dacfe5; }
.recommend_event::after { border-color: transparent transparent transparent #dacfe5; }

.recommend_news::before { content: "お知らせ"; color: #fff; background: #a25768; }
.recommend_news::after { border-color: transparent transparent transparent #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 #493759; }
.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: 1000px; margin: 50px auto 0; padding: 50px 0 0; }
  .sec_event .sec_event_btn { margin-top: 0; } }

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

.sec_news_title { margin: 0 20px 10px; padding: 20px; color: #fff; background: #493759; }
.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_info { position: relative; display: flex; padding: 0 10px; border-bottom: 1px solid #493759; }
.news_info::after { position: absolute; left: 0; bottom: -3px; display: block; content: ""; width: 90px; border-bottom: 3px solid #493759; }
@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 { display: flex; padding: 0; }
  .sec_news_title { margin: 0; padding: 50px 0 50px calc((100vw - 1000px)/2); width: 30%; box-sizing: content-box; }
  .news_list { padding: 30px calc((100vw - 1000px)/2) 40px 0; width: 70%; box-sizing: content-box; }
  .news_ttl { width: calc(100% - 100px); }
  .news_ttl a { transition: .2s; }
  .news_ttl a:hover { color: #aa4c8f; } }
.news_no_data_area{ text-align: left; padding: 10px 20px; }
/* バナー
============================== */
.link_bnr { margin-top: 20px; padding-top: 10px; border-top: 1px solid #493759; }
@media screen and (min-width: 600px) { .link_bnr { display: flex; flex-wrap: wrap; justify-content: space-around; margin-top: 30px; padding-top: 20px; } }
@media screen and (min-width: 960px) { .link_bnr { max-width: 1000px; margin: 40px auto 0; } }