@charset "utf-8";

/* Job list CSS Document */

/* 求人ページ幅*/
.path-job .layout-content{
  max-width:1040px;
  padding-left:16px;
  padding-right:16px;
  margin-left:auto;
  margin-right:auto;
}


/****求人検索 views ヘッダー****/
.path-job .view-joblist .view-header {
  position: relative;
}

.path-job .view-joblist .view-header .pagecnt {
  position: absolute;
  bottom: 0px;
  right: 0px;
}


.path-job main {
  background: #F8F9F9;
}

.node.node--type-job.node--view-mode-list {
  position: relative;
  border: 1px solid #EAF2F8;
  border-top: 5px solid #5499C7;
  padding: 10px 20px;
  margin-top: 15px;
  background: #fff;
}

.block.block-layout-builder.block-field-blocknodejobfield-job-pickup,
.block.block-layout-builder.block-field-blocknodejobfield-job-kyubo {
  display: inline-block;
}

.node.node--type-job.node--view-mode-list .layout__region--second .block {
  margin-bottom: 1rem;
}

.node--type-job.node--view-mode-list .field--type-image a img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.node--type-job.node--view-mode-list {
  line-height: 1.2;
  margin-bottom: 2rem;
}

.node--type-job.node--view-mode-list .field--name-field-job-message {
  padding: 1.5rem 2rem;
  background-color: #fafafa;
}

.node--type-job.node--view-mode-list h2,
.node--type-job.node--view-mode-list .block-field-blocknodejobtitle a {
  color: var(--h1-color);
  font-size: 1.8rem;
  font-weight: 600;
}

.node--type-job.node--view-mode-list .layout--twocol-section {
  flex-wrap: nowrap;
  margin-top: 1rem;
}

.node--type-job.node--view-mode-list .layout--twocol-section .layout__region.layout__region--first {
  /* padding-right:40px; */
  padding-right: 2rem;
}

.node--type-job.node--view-mode-list .layout--twocol-section .layout__region.layout__region--second .field .field__label {
  font-weight: 600;
  white-space: nowrap;
  color: var(--first-color);
}

.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-occupation .field,
.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-description .field,
.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-employment-type .field,
.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-salary-text .field {
  display: flex;
  flex-wrap: nowrap;
}

.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-occupation .field .field__label,
.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-description .field .field__label,
.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-employment-type .field .field__label,
.node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-salary-text .field .field__label {
  min-width: 60px;
}

.node--type-job.node--view-mode-list .layout__region--content {
  position: static;
}

.node--type-job.node--view-mode-list .block-extra-field-blocknodejobflag-flag-job .flag a {
  position: absolute;
  top: 4rem;
  left: 3rem;
  right: auto;
}

.view-empty .alert.alert-success {
  background: #fff;
  padding: 20px;
  border-radius: 5px;
  color: #000;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

h4.alert-heading {
  margin-top: 0px;
  margin-bottom: 20px;
}

.view-empty .alert.alert-success p {
  margin: 0px;
}

/***** 検索フォーム*****/
.layout-sidebar-first .block-views-exposed-filter-blockjoblist-page-job-search {
  padding: 15px;
  background: #F2F3F4;
  border: 1px solid #E5E7E9;
  margin-top: 20px;
  border-radius: 3px;
}

.layout-sidebar-first .block-views-exposed-filter-blockjoblist-page-job-search .form-actions input[type="submit"] {
  width: 100%;
}

.layout-sidebar-first .block-views-exposed-filter-blockjoblist-page-job-search h2.block-title {
  margin-top: 0px;
}


@media screen and (max-width: 767px) {
  .node--type-job.node--view-mode-list .layout--twocol-section {
    flex-direction: column;
  }

  .node--type-job.node--view-mode-list .layout--twocol-section .layout__region.layout__region--first {
    padding-right: 0;
  }

  .node--type-job.node--view-mode-list .field--type-image a img {
    width: 100%;
  }

  .node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-occupation,
  .node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-description,
  .node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-employment-type,
  .node--type-job.node--view-mode-list .block.block-field-blocknodejobfield-job-salary-text {
    font-size: 1.2rem;
  }
}

.node--type-job.node--view-mode-list .block-field-blocknodejobfield-job-salary-text .field__item p:last-child {
  margin-bottom: 0;
}


@media screen and (max-width: 767px) {
  .node--type-job.node--view-mode-list .block-extra-field-blocknodejobflag-flag-job {
    top: 3rem;
    left: 0;
    right: 1rem;
  }

  .node.node--type-job.node--view-mode-list {
    padding: 5px 10px;
  }

  .node--type-job.node--view-mode-list h2,
  .node--type-job.node--view-mode-list .block-field-blocknodejobtitle a {
    font-size: 1.5rem;
  }
}



/* *************************************************************************************
 * Customize
 ************************************************************************************* */
.joblist {
  margin: 0;
}

.joblist li .job-head {
  position: relative;
}

.joblist li .job-head .field--name-field-job-image {
  display: flex;
}

.joblist li .job-head img {
  width: 100%;
  height: auto;
}

.joblist li .job-head .field--name-field-job-location-name {
  /*position: absolute;
  bottom: 0;
  */
  position: relative;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  padding: 3px 10px;
  color: #fff;
  height: 32px;
  /* font-size: 1.1rem; */
}

.joblist li .job-content {
  padding: 10px 10px 30px;
  height: 100%;
}

.joblist li .job-content h3 {
  margin-top: 0;
}

.joblist li .job-content h3 a {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  height: 28px;
}

/* TOP 共通 */
.top .joblist {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

.top .joblist li {
  width: calc((100% - 15px * 2) / 3);
}

.top .joblist li .job-content .target-area {
  display: inline-flex;
  flex-wrap: wrap;
}

.top .joblist li .job-content .target-area:before {
  content: '';
  display: block;
  background-image: url(../img/icon/pin.svg);
  background-repeat: no-repeat;
  background-size: cover;
  filter: invert(46%) sepia(0%) saturate(1689%) hue-rotate(216deg) brightness(99%) contrast(88%);
  width: 13px;
  height: 13px;
  margin-right: 2px;
}

.top .joblist li .job-content .field--name-field-job-occupation .field__item {
  display: inline-flex;
}

.top .joblist li .job-content .field--name-field-job-occupation{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  height: 26px;
}

.top .joblist li .job-content .field--name-field-job-occupation:before {
  content: '';
  display: block;
  background-image: url(../img/icon/car.svg);
  background-repeat: no-repeat;
  background-size: cover;
  filter: invert(46%) sepia(0%) saturate(1689%) hue-rotate(216deg) brightness(99%) contrast(88%);
  width: 13px;
  height: 13px;
  margin-right: 2px;
}

.top .joblist li .job-content .field--name-field-job-occupation .field__item:nth-child(2){
  margin-left: 15px;
}

/* 3番目以降非表示 */
.top .joblist li .job-content .field--name-field-job-occupation .field__item:nth-child(n+3) {
  display: none;
}


.joblist li .job-content .field--name-field-jobex-salary-detail {
  line-height: 1.2;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

@media screen and (max-width: 991px) {
  .top .joblist li {
    width: calc((100% - 15px * 1) / 2);
  }
}



/* h2
 *******************************************************************/
@media screen and (max-width: 767px) {
  .path-frontpage h2.block-title.block-title-views-blocknews-list-block-seeker-1,
  .path-frontpage h2.block-title.block-title-views-blockads-contents-block-3,
  .path-frontpage h2.block-title.block-title-simple-blockfront-career-magazine,
  .path-frontpage h2.block-title.block-title-views-blockads-contents-block-4,
  .path-frontpage h2.block-title.block-title-views-blockads-contents-block-1 {
    font-size: 24px !important;
  }
}

/* もっと見るボタン
 *******************************************************************/
 .path-frontpage.sticked .view-footer .mode {
  text-align: right;
  margin-top: 13px;
}

.path-frontpage.sticked .view-footer .mode a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  padding: 8px 20px;
  background-color: #1488c0; 
  border: 2px solid #1488c0; 
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 1px;
  position: relative;
  transition: all 0.3s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.path-frontpage.sticked .view-footer .mode a:hover {
  background-color: #106fa4; /* ホバー時に色が変わる */
  border-color: #106fa4;
  transform: translateY(-3px); /* 浮き上がるエフェクト */
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15); 
}

.path-frontpage.sticked .view-footer .mode a:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(20, 136, 192, 0.4); 
}

/* 矢印を右に追加 */
.path-frontpage.sticked .view-footer .mode a::after {
  content: ">"; 
  font-size: 12px;
    margin-bottom: 3px;
  margin-left: 10px;
  transition: transform 0.3s ease;
}

/* ホバー時に矢印が右に動く */
.path-frontpage.sticked .view-footer .mode a:hover::after {
  transform: translateX(8px); /* 矢印が少し右に動く */
}

/* 一覧表示
 * TOPページ（おすすめドライバー求人）など
 *******************************************************************/
/* .joblist.quick {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
} */
.joblist.quick li {
  /* width: calc((100% - 15px * 2) / 3); */
  background-color: #E7F3F8;
  position: relative;
  font-size: 1.1rem;
  border-radius: 5px;
  overflow: hidden;
}

.joblist.quick li:after {
  content: '';
  display: block;
  width: 48px;
  height: 38px;
  background-image: url(../img/contents/job/dorazamurai_pickup.svg);
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  bottom: 0;
  right: 5px;
}

@media screen and (max-width: 767px) {

  .path-frontpage #block-dorazamurai-front-views-block-joblist-block-2 h2.block-title.block-title-views-blockjoblist-block-2,
  .path-frontpage #block-dorazamurai-front-views-block-joblist-block-1 h2.block-title.block-title-views-blockjoblist-block-1 {
    text-align: center;
  }
}




/* 一覧表示
 * TOPページ（新着ドライバー求人）など
 *******************************************************************/
.joblist.detail li {
  background-color: #EEF8F6;
  font-size: 1.1rem;
}




/* 一覧表示
 * 求人一覧ページ、お知らせ詳細ページなど
 *******************************************************************/
.path-job main>.container {
  padding-bottom: 120px;
}

@media screen and (max-width: 767px) {
  .path-job main>.container {
    padding-bottom: 60px;
  }
}

body.page-node-type-news .job-wrapper .plan {
  display: none;
}

.node.node--type-job.node--view-mode-list:has(.job-wrapper) {
  width: calc((100% - 20px) / 2);
  padding: 0;
  border: none;
}

.job-wrapper {
  width: calc((100% - 20px) / 2);
  background: #fff;
  border: 3px solid var(--main-color);
  padding: 10px 10px 15px 10px;
}

@media screen and (max-width: 767px) {
  .job-wrapper {
    width: 100%;
    padding: 20px 15px;
  }

}

.job-wrapper.premium {
  background: #ddf5ff;
  border: 6px solid var(--main-color);
}

.job-wrapper.standard {
  background: #ebf9ea;
  border: 3px solid #9bc098;
}

.job-wrapper.simple {
  background: #fdf2f7;
  border: 3px solid #f4a6c9;
}

.job-wrapper .plan {
  display: flex;
  align-items: center;
  gap: 30px;
}

.job-wrapper .plan .character {
  /* width: 80px; */
  width: 60px;
}

.job-wrapper .plan .character img {
  transform: scale(1.3);
}

.job-wrapper .plan .balloon {
  display: inline-block;
  position: relative;
  padding: 5px 10px;
  /* margin-left: 20px; */
  margin-bottom: 20px;
  background-color: #fff;
  border-radius: 20px;
  color: #0D6AA8;
  font-size: 14px;
  font-weight: 700;
  text-shadow: #fff 0 0 2px;
}

.job-wrapper .plan .balloon::before {
  content: '';
  position: absolute;
  display: block;
  border-radius: 50%;
  background-color: #fff;
  left: -17px;
  bottom: 8px;
  width: 15px;
  height: 15px;
}

.job-wrapper .plan .balloon::after {
  content: '';
  position: absolute;
  display: block;
  border-radius: 50%;
  background-color: #fff;
  left: -28px;
  bottom: 5px;
  width: 10px;
  height: 10px;
}

.job-wrapper .job-header {
  background: #0D6AA8;
  padding: 10px;
  border: solid 2px var(--main-color);
  border-radius: 3px;
  margin-bottom: 10px;
  color: #fff;
  position: relative;
}

.job-wrapper .job-header .field--name-field-jobex-jobplan {
  display: none;
}

.job-wrapper .job-header .ttl {
  margin-bottom: 10px;
  margin-top: 10px;
  /* width: 97%; */
}

body.path-job .job-wrapper.basic:has(.kyubo) .job-header .ttl{
  width: 95%;
}

.job-wrapper .job-header .ttl a {
  color: #fff;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1.5;
}

.job-wrapper .job-header .corp-name {
  text-align: right;
  font-size: 12px;
}

.job-wrapper .job-completed {
  margin-bottom: 10px;
}

.job-wrapper .job-completed .employment-completed {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 150px;
  text-align: center;
  padding: 5px 10px;
  border-radius: 3px;
  background: #fb4848;
  color: #fff;
}


.job-wrapper img {
  width: 100%;
  height: auto;
}

.job-wrapper .img_content_flex{
  display: flex;
  margin-bottom: 20px;
}

.job-wrapper .job-corp-image {
  font-size: 0;
  /* margin-bottom: 20px; */
  position: relative;
}

.job-wrapper .job-corp_wrap{
  width: 50%;
}


.job-wrapper .job-corp-image span {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 1.2rem;
  color: #fff;
  background-color: #ff0000;
  padding: 5px 10px;
}

.job-corp-image:not(:has(> a)) > span {
  position: relative !important;
}


/* .job-wrapper .job-content .job-data {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 20px;
} */

.job-wrapper:has(.job-completed) .job-content .job-data{
margin-top: 34.945px;
}

.job-wrapper .job-content .job-data .box {
  /* width: calc((100% - 20px) / 2); */
  display: flex;
  margin-left: 5px;
  align-items: center;
}

.job-wrapper .job-content .job-data .box:not(:last-child){
  border-bottom: 1px solid #ccc;
}

@media screen and (max-width: 1199px) {
  .job-wrapper .job-content .job-data {
    gap: 20px 15px;
  }

  .job-wrapper .job-content .job-data .box{
    margin: 0 15px;
    padding: 3px 0;
  }

  /* .job-wrapper .job-content .job-data .box {
    width: calc((100% - 15px) / 2);
  } */
}

@media screen and (max-width: 767px) {
  .job-wrapper .job-content .job-data {
    gap: 10px 0px;
    flex-wrap: wrap;
    display: flex;
    /* justify-content: space-around; */
  }

  .job-wrapper .job-corp_wrap{
    width: 100%;
  }

  .job-wrapper .img_content_flex {
    display: flex;
    flex-direction: column;
    margin-bottom: 0px;
    gap: 6px;
  }

  .job-wrapper .job-content .job-data .box{
    margin: 0;
    width: 50%;
    padding-bottom: 10px;
    border-bottom: 1px solid #BFDBDF;
  }

  .job-wrapper:has(.job-completed) .job-content .job-data{
    margin-top: 0px;
    }

    .job-wrapper .job-content .job-data .box.occupation .text{
      width: 100px;
    }

    .job-wrapper .job-content .job-data .box.occupation{
      border: none !important;
    }

    .job-wrapper .plan{
      gap: 15px;
    }
  /* .job-wrapper .job-content .job-data .box {
    width: calc((100% - 10px) / 2);
  } */
}



/* .job-wrapper .job-content .job-data .box .ttl {
  background-color: #16a6b6;
  color: #fff;
  padding: 6px 10px;
  width: 72px;
  margin-right: 5px;
  border-bottom: 1px solid #fff;
  display: flex;
  align-items: center;
  justify-content: center;
} */

.job-wrapper .job-content .job-data .box.area .text {
  font-size: 0;
}

.job-wrapper .job-content .job-data .box.area .text>* {
  font-size: 1.4rem;
}

.job-wrapper .job-content .job-data .box.area .text>* {
  display: inline-block;
}

/* .job-wrapper .job-content .job-data .box .text .field__items>* {
  margin-bottom: 5px;
} */

.job-wrapper .job-content .job-data .box.type .field .field__item:nth-child(n+3),
.job-wrapper .job-content .job-data .box.occupation .field .field__item:nth-child(n+3) {
  display: none;
}

.job-wrapper .job-content .job-data .box.type .field .field__item:nth-child(2)::after,
.job-wrapper .job-content .job-data .box.occupation .field .field__item:nth-child(2)::after {
  content: '...';
  display: inline;
  margin-left: 5px; /* 必要に応じて調整 */
}

/* .job-wrapper .job-content .job-data .box.salary .text .field--name-field-job-salary-system {
  margin-bottom: 5px;
} */

.job-wrapper .job-content .job-data .box.salary{
  margin-top: 3px;
}

.job-wrapper .job-content .job-data .box.salary .text{
  display: flex;
  flex-direction: row;
  align-items: center;
  padding-top: 2px;
}

.job-wrapper .job-content .job-data .box.type .text,
.job-wrapper .job-content .job-data .box.area .text,
.job-wrapper .job-content .job-data .box.occupation .text{
  display: flex;
  align-items: center;
  padding: 5px 0;
}

.job-wrapper .job-content .job-data .box .ttl::before{
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 10px;
}

.job-wrapper .job-content .job-data .box.area .ttl::before{
  background-image: url('/themes/custom/dorazamurai_front/img/job/icon-area.svg')
}
.job-wrapper .job-content .job-data .box.type .ttl::before{
  background-image: url('/themes/custom/dorazamurai_front/img/job/icon-type.svg')
}
.job-wrapper .job-content .job-data .box.occupation .ttl::before{
  background-image: url('/themes/custom/dorazamurai_front/img/job/icon-occupation.svg')
}
.job-wrapper .job-content .job-data .box.salary .ttl::before{
  background-image: url('/themes/custom/dorazamurai_front/img/job/icon-salary.svg')
}


.job-wrapper .comment_wrap{
  border-top: 1px dotted #ccc;
  margin-bottom: 20px;
}

.job-wrapper .comment_wrap .comment .text{
  padding-top: 20px;
  padding-bottom: 8px;
}

/* .job-wrapper .comment_wrap .ttl {
  font-size: 1.6rem;
  font-weight: bold;
  color: #333;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.job-wrapper .comment_wrap .ttl:before {
  content: '';
  display: block;
  width: 40px;
  height: 40px;
  background-image: url(../img/contents/job/dorako_point.svg);
  background-repeat: no-repeat;
  background-size: 40px;
  transform: scale(1.3);
} */


.job-wrapper .job-footer {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  position: relative;
  margin-top: auto;
}

/* .job-wrapper .job-footer>* {
  width: calc((100% - 20px) / 2);
} */



.job-wrapper .job-footer .readmore {
  width: 100%;
}


.job-wrapper .job-footer .readmore ul,
.job-wrapper .job-footer .readmore ul li {
  margin: 0;
  padding: 0;
}

.job-wrapper .job-footer .readmore ul li:nth-child(2) {
  margin-top: 10px;
  display: block;
}

.job-wrapper .job-footer .readmore a,
.job-wrapper .job-footer .bookmark .flag a {
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  box-shadow: inset 0 2px 0 rgb(255 255 255 / 20%), 0 2px 2px rgb(0 0 0 / 19%);
  font-weight: bold;

}

.job-wrapper .job-footer .bookmark .flag a {
  width: 60px;
}

.job-wrapper .job-footer .readmore a {
  width: 100%;
  /* border-bottom: solid 2px #106289; */
  background-color: var(--main-color);
  border: solid 1px var(--main-color);
  border-radius: 9999px;
  box-shadow: none;
  font-size: 15px;
}

.job-wrapper .job-footer .bookmark .flag .js-flag-message {
  position: absolute;
  top: -35px;
  left: 0%;
}

.bookmark .flag a {
  position: initial;
  background: initial;
  font-size: 1.4rem;
  text-indent: initial;
  width: 100%;
  color: #fba848;
  padding: 8px 10px;
  text-indent: -9999px;
  background-color: #fff;
  border: 2px solid #fba848;
  box-shadow: none !important;
  border-radius: 9999px !important;
  font-size: 0 !important;
}

/*アイコン*/
.bookmark .flag a::before,
.bookmark .flag.action-unflag a::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-size: contain;
  vertical-align: middle;
  background-repeat: no-repeat;
  background-position: center;
  /* margin-right: 10px; */
  transition: all 0.3s ease;
}

.bookmark .flag a::before {
  background-image: url(/themes/custom/dorazamurai_front/img/icon/jobstar_line.svg);
}

/* .bookmark .flag.action-unflag a::before,
.bookmark .flag a:hover::before{
  background-image: url(/themes/custom/dorazamurai_front/img/icon/jobstar_white.svg);
} */

@media(hover: hover){
  .bookmark .flag a:hover::before {
    background-image: url(/themes/custom/dorazamurai_front/img/icon/jobstar.svg);
  }
}


/* .bookmark .flag.action-unflag a::before{
  background-image: url(/themes/custom/dorazamurai_front/img/icon/star.svg);
} */

.bookmark .flag.action-unflag a::before {
  background-image: url(/themes/custom/dorazamurai_front/img/icon/jobstar.svg);
}

.bookmark .flag.action-unflag a {
  /* background: #fba848;
  border: solid 2px #fba848; */
  transition: all 0.3s ease;
  /* color: var(--black-color); */
}


@media(hover: hover){
.bookmark .flag.action-unflag a:hover {
  background: var(--white-color);
  /* border: solid 2px var(--gray-color); */
  border: solid 2px #fba848;
  color: var(--gray-color);
}


.bookmark .flag.action-unflag a:hover::before {
  background-image: url(/themes/custom/dorazamurai_front/img/icon/jobstar_line.svg);
}

}
/* .view .flag.action-unflag a {
  background: initial;
  background-color: #fff;
  border: 1px solid #000;
} */
.view .flag.action-unflag a {
  background: initial;
  background-color: #fff;
  border: 1px solid #fba848;
}

@media (hover: hover) {
  .job-wrapper .job-footer .readmore a:hover {
    background-color: #fff;
    color: var(--main-color);
    opacity: 1;
  }

  /* .readmore a:hover,
  .bookmark .flag a:hover {
    opacity: 0.8;
  } */
  .bookmark .flag a:hover {
    background: initial;
    /* background-color: #fba848;
    border-bottom: 2px solid #d27d00; */
    border-bottom: none;
    background-color: #fff;
    border: 2px solid #fba848;
    /* color: #fba848; */
  }
}

@media screen and (max-width: 1199px) {
  .job-wrapper .job-footer {
    gap: 15px;
  }

  /* .job-wrapper .job-footer>* {
    width: calc((100% - 15px) / 2);
  } */

  .job-wrapper .job-footer .bookmark .flag a {
    font-size: 1.2rem;
  }

  .job-wrapper .job-content .job-data .box.salary .text{
    display: block;
  }

}

@media screen and (max-width: 767px) {
  .job-wrapper .job-footer {
    gap: 10px;
  }
  

  .job-wrapper .job-content .job-data .box.salary{
    margin-top: 0;
    border: none;
  }
  /* .job-wrapper .job-footer>* {
    width: calc((100% - 10px) / 2);
  } */
}



/* 求人一覧ページ */
/* body.path-job .view-content ul.blazy--view--joblist li.grid .grid__content,
body.path-job .view-content ul.blazy--view--joblist li.grid .grid__content > div {
  height: 100%;
} */
body.path-job .job-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
}

body.path-job .job-wrapper .job-content {
  flex-grow: 1;
}



/* body.path-job .job-wrapper .job-content .comment {
  flex-grow: 1;
} */


/* body.path-job .view-content ul.blazy--view--joblist {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

body.path-job .view-content ul.blazy--view--joblist li.grid {
  width: calc((100% - 20px) / 2);
} */

body.path-job .job-wrapper {
  width: 100%;
}


.job-wrapper:has(.plan) .job-header {
  margin-top: -7px;
}

.job-wrapper.job-wrapper.premium:has(.plan) .job-header {
  margin-top: -10px;
}

/* @media screen and (max-width: 991px) {
  body.path-job .view-content ul.blazy--view--joblist li.grid {
    width: 100%;
  }
} */

/* 検討リスト */
/* body.path-bookmarks .view-content ul.blazy--view--flag-bookmark li.grid .grid__content,
body.path-bookmarks .view-content ul.blazy--view--flag-bookmark li.grid .grid__content > div {
  height: 100%;
} */
body.path-bookmarks .job-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
}

body.path-bookmarks .job-wrapper .job-content {
  flex-grow: 1;
}

body.path-bookmarks .job-wrapper .job-content .comment {
  flex-grow: 1;
}

/* body.path-bookmarks .view-content ul.blazy--view--flag-bookmark {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}
body.path-bookmarks .view-content ul.blazy--view--flag-bookmark li.grid {
  width: calc((100% - 20px) / 2);
} */

body.path-bookmarks .job-wrapper {
  width: 100%;
}

/* @media screen and (max-width: 991px) {
  body.path-bookmarks .view-content ul.blazy--view--flag-bookmark li.grid {
    width: 100%;
  }
} */


/* 閲覧履歴 */
.job-wrapper-sidebar {
  display: flex;
  gap: 8px;
}

.job-wrapper-sidebar .ttl a {
  color: var(--main-color);
  font-weight: bold;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.job-wrapper-sidebar .job-image {
  /* width: 75px; */
  width: 100%;
  height: auto;
}

.job-wrapper-sidebar .job-image img {
  /* width: 75px;
  height: 75px; */
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.job-wrapper-sidebar .job-content {
  width: calc(100% - -305px);
}

.job-wrapper-sidebar .job-data-area .ttl,
.job-wrapper-sidebar .job-data-type .ttl {
  display: none;
}

.job-wrapper-sidebar .job-data-area .text,
.job-wrapper-sidebar .job-data-type .text {
  display: flex;
  color: var(--text-color);
  font-weight: normal;
}

.job-wrapper-sidebar .job-data-area .text:before,
.job-wrapper-sidebar .job-data-type .text:before {
  content: '';
  display: block;
  background-repeat: no-repeat;
  background-size: cover;
  filter: invert(46%) sepia(0%) saturate(1689%) hue-rotate(216deg) brightness(99%) contrast(88%);
  width: 16px;
  height: 15px;
  margin-right: 2px;
  border: 1px solid transparent;
}


.job-wrapper-sidebar .job-data-type .text .field__item:nth-child(n+3) {
  display: none;
}

.job-wrapper-sidebar .job-data-area .text:before {
  background-image: url(../img/icon/pin.svg);
}

.job-wrapper-sidebar .job-data-type .text:before {
  background-image: url(/themes/custom/dorazamurai_front/img/job/icon-type_bk.svg);
}

/* 閲覧履歴ページ */
.layout-content .view-content ul[class*="blazy--view--"] {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.layout-content .view-content ul[class*="blazy--view--"] li.grid {
  width: calc((100% - 20px) / 2);
}

.layout-content .view-content ul[class*="blazy--view--"] li.grid .grid__content,
.layout-content .view-content ul[class*="blazy--view--"] li.grid .grid__content>div,
.layout-content .view-content ul[class*="blazy--view--"] li.grid .views-field .node--type-job {
  height: 100%;
}

body.path-recently .job-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

body.path-recently .job-wrapper .job-content {
  flex-grow: 1;
}

@media screen and (max-width: 991px) {
  .layout-content .view-content ul[class*="blazy--view--"] li.grid {
    width: 100%;
  }
}




/* 一覧表示
 * 求人詳細ページ（他営業所の募集／同じカテゴリーの求人）
 *******************************************************************/
 .block-views-bloc-with-lazy-builder-examplejob-other-sales-office-block-1,
.block-views-bloc-with-lazy-builder-examplesame-category-job-block-1,
.block-views-blockjob-other-sales-office-block-1,
.block-views-blocksame-category-job-block-1 {
  margin-bottom: 80px;
}

.joblist.article {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
}

.joblist.article li {
  width: calc((100% - 20px * 2) / 3);
  box-shadow: 0 1px 8px rgb(0 0 0 / 10%);
}

.joblist.article li:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, .15);
  cursor: pointer;
}


.joblist.article li img {
  width: 100%;
  height: auto;
  transition: transform 0.4s ease;
}

.joblist.article li .field__item:hover img {
  transform: scale(1.08);
}


.joblist.article li .ttl {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px 20px 0px;
}

.joblist.article li .ttl a {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.joblist.article li .field__item {
  overflow: hidden;
}

.joblist.article .field--name-field-job-location-name {
  font-weight: bold;
  margin-bottom: 5px;
}

#block-dorazamurai-front-views-block-job-other-sales-office-block-1 .joblist .field--name-field-job-location-name {
  display: none;
}

.joblist.article li .target-area {
  font-size: 0;
  display: inline-flex;
  flex-wrap: wrap;
  margin-bottom: 5px;
}

.joblist.article li .target-area,
.joblist.article .field--name-field-job-location-name {
  padding: 0px 20px 0px;
}

.joblist.article li .field--name-field-job-occupation {
  padding: 0px 20px 15px;
}


.joblist.article li .target-area:before {
  content: '';
  display: block;
  background-image: url(../img/icon/pin.svg);
  background-repeat: no-repeat;
  background-size: cover;
  filter: invert(46%) sepia(0%) saturate(1689%) hue-rotate(216deg) brightness(99%) contrast(88%);
  width: 13px;
  height: 13px;
  margin-right: 2px;
}

.joblist.article li .target-area * {
  width: auto;
  display: inline-block;
  font-size: 1.3rem;
}


.joblist.article li .field--name-field-job-occupation .field__item {
  display: inline-flex;
}

.joblist.article li .field--name-field-job-occupation .field__item:before {
  content: '';
  display: block;
  background-image: url(../img/icon/car.svg);
  background-repeat: no-repeat;
  background-size: cover;
  filter: invert(46%) sepia(0%) saturate(1689%) hue-rotate(216deg) brightness(99%) contrast(88%);
  width: 13px;
  height: 13px;
  margin-right: 2px;
}

/* 3番目以降非表示 */
.joblist.article li .field--name-field-job-occupation .field__item:nth-child(n+3) {
  display: none;
}

/* カテゴリーが3個以上の時、2番目の要素の後ろに表示 */
.joblist.article li .field--name-field-job-occupation:has(> .field__item:nth-child(3)) .field__item:nth-child(2):after {
  content: '...';
}

@media screen and (max-width: 767px) {
  .joblist.article li {
    width: calc((100% - 20px) / 2);
  }
}

/*（他営業所の募集／同じカテゴリーの求人）タイトル*/
.block-views-bloc-with-lazy-builder-examplejob-other-sales-office-block-1 h2,
.block-views-bloc-with-lazy-builder-examplesame-category-job-block-1 h2,
h2.block-title-views-blockjob-other-sales-office-block-1,
h2.block-title-views-blocksame-category-job-block-1 {
  border-bottom: solid 3px #ecf1f4;
  position: relative;
  padding-bottom: 10px;
}
.block-views-bloc-with-lazy-builder-examplejob-other-sales-office-block-1 h2:after,
.block-views-bloc-with-lazy-builder-examplesame-category-job-block-1 h2:after,
h2.block-title-views-blockjob-other-sales-office-block-1:after,
h2.block-title-views-blocksame-category-job-block-1:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #0E7AC4;
  bottom: -3px;
  width: 20%;
}

/* 一覧表示
 * 検索フォーム調整
 *******************************************************************/
body.path-job .form-item {
  margin-bottom: 20px;
}

body.path-job #views-exposed-form-joblist-page-job-search .form-type-select>label,
body.path-job form .form-item legend .fieldset-legend,
body.path-job form .form-item label:not(.option) {
  margin-bottom: 5px;
  display: block
}


.kyubo {  
  display: inline-block;
  position: absolute;
  top: -6px;
  right: 8px;
  margin: 0;
  padding: 15px 0 10px;
  z-index: 2;
  width: 40px;
  text-align: center;
  color: white;
  font-size: 14px;
  background: linear-gradient(#ff785b 0%, #e95738 100%);
  border-radius: 2px 0 0 0;
  }

.kyubo:before {
  position: absolute;
  content: '';
  top: 0;
  right: -6px;
  border: none;
  border-bottom: solid 6px #cf4a2d;
  border-right: solid 6px transparent;
}
.kyubo:after {
  content: '';
  position: absolute;
  left: 0;
  top: 100%;
  height: 0;
  width: 0;
  border-left: 20px solid #e95738;
  border-right: 20px solid #e95738;
  border-bottom: 10px solid transparent;
}

/*バナー付き求人検索一覧*/

@media screen and (min-width: 767px) {
  .block-simple-blockspecial-feature-banner .special_bnr {
    text-align: center;
    margin: 20px auto;
    height: 230px;
    overflow: hidden;
  }

  .block-simple-blockspecial-feature-banner .special_bnr img {
    width: 100%;
    /* max-width: 600px; */
    height: auto; 
    margin: 0 auto; 
    display: block; 
  }
}
@media screen and (max-width: 767px) {
  .block-simple-blockspecial-feature-banner .special_bnr img {
    width: 100%;
  }
}

/*閲覧数を消す*/
.role-manager .view-joblist .job-list .job-footer .node__links li:nth-child(2){
  display:none;
}