@charset "utf-8";
/* CSS Job Document */
html { scroll-behavior: smooth; }

/* 固定ヘッダーぶんズレるのを補正（見出しに余白を持たせる） */
:root { --header-h: 90px; }              /* 固定ヘッダーの高さに合わせて調整 */
*[id] { scroll-margin-top: calc(var(--header-h) + 8px); }

/* 動きが苦手な人の環境配慮 */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/******職種から検索サイド*******/
.occupation-side .views-row{
	margin-bottom:15px;
}
.occupation-side .row {
    display: flex;
    flex-wrap: nowrap;
    --bs-gutter-x: 30px;
}
.occupation-side .col-left {
    width: 110px;
    height: 70px;
    margin-top: 0;
}
.occupation-side img {
    max-width: 110px;
    height: 70px;
    object-fit: cover;
}
.occupation-side .col-right{
	width:auto;
	flex:1;
  padding-left: 0px;
}
.occupation-side .col-right .occupationl_ttl{
  font-size:1.5rem;
	font-weight: 600;
	color:var(--first-color);
}
.occupation-side .col-right p{
  font-size:1.4rem;
}
.occupation-side{
	display: flex;
	flex-wrap: wrap;
  gap: 0 4rem;
}
.occupation-side .views-row{
	/* width:50%; */
  width: calc((100% - 4rem)/ 2);
}
@media screen and (max-width: 767px) {
  .occupation-side{
    flex-direction: column;
  }
  .occupation-side .views-row {
    width: 100%;
  }
  .occupation-side .views-row .col-right p{
    font-size:1.2rem;
  }
}
/******carousel*******/
.node--type-job.node--view-mode-carousel .block.block-layout-builder .field {
	font-size:1.2rem;
	display: flex;
	gap:10px;
}
.node--type-job.node--view-mode-carousel .block.block-layout-builder .field .field__label{
	font-weight:600;
	white-space: nowrap;
	color:var(--first-color);
}
.region-highlighted .node--type-job.node--view-mode-carousel h2{
	font-size:1.6rem;
}
.node--type-job.node--view-mode-carousel .layout__region--content .field{
	margin-bottom:10px;
}
.node--type-job.node--view-mode-carousel .layout__region--content .field p{
	padding:0px;
	margin:0px;
}



.node--type-job.node--view-mode-list .block-extra-field-blocknodejoblinks {
  text-align: right;
}

.node--type-job.node--view-mode-list .block-extra-field-blocknodejoblinks ul li {
  padding: 0;
}
@media screen and (max-width: 767px) {
  .node--type-job.node--view-mode-carousel .block.block-layout-builder .field {
    font-size:1.1rem;
    display: block;
    gap:0;
  }
  .node--type-job.node--view-mode-carousel .layout__region--content .field{
    margin-bottom:5px;
  } 
}

/* links */
.node--type-job.node--view-mode-list .node__links a {
  font-size: 1.4rem;
  line-height: 3rem;
  height: 3rem;
}

/* flag */
.node--type-job.node--view-mode-list .layout--onecol .flag a {
  top: 0;
}


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


  .node--type-job.node--view-mode-list .layout-children-badge .field__item {
    background-color: rgb(255 255 255 / 80%);
  }
}

/* .node--type-job.node--view-mode-list .node__content > .layout--onecol:first-child {
  position: absolute;
  top: 3rem;
  left: 0.5rem;
}
.node--type-job.node--view-mode-list .layout-children-badge .field__item {
  background-color: rgb(255 255 255 / 80%);
} */



/* ***************************************************************************
 * 求人詳細
 **************************************************************************** */
.page-node-type-job .layout--threecol-section.layout--threecol-section--25-50-25 {
  margin-bottom: 4rem;
  padding-bottom:1rem;
}
.job-main-image img{
  width:100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  margin-bottom:20px;
  padding:10px;
  box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
  box-sizing: border-box;
}
.job-photo-gallary{
  margin-top:20px;
  margin-bottom:20px;
  background:#EBF5FB;
  padding: 20px;
  box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
}
.job-photo-gallary .slick__slide img{
  width:100%;
  height: auto;
  object-fit: cover;
}
.job-photo-gallary h2{
  margin-top: 0px;
}
#job-page-detailes .field .field__label{
	font-size:1.8rem;
	font-weight: 600;
	color:var(--black-color);
  padding-bottom:10px;
  border-bottom:1px solid #ebedef;
}
#job-page-detailes .field .field__item{
	font-size:1.5rem;
	line-height: 200%;
	font-weight: 500;
	color:var(--black-color);
	margin-bottom:1rem;
}
#job-page-detailes .block{
	margin-bottom:4rem;
}
#job-page-detailes .field--name-field-job-message {
      padding: 2rem 4rem 40px;
    background-color: #ebedef;
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--black-color);
    margin-bottom: 60px;
}
.block-field-blocknodejobfield-job-insurance .field__items{
  display: flex;
  gap:10px;
}
.block-field-blocknodejobfield-job-insurance .field__items .field__item{
  
}
.page-node-type-job .layout--threecol-section.layout--threecol-section--25-50-25 .layout__region {
	z-index:2;
}
.node.node--type-job.node--view-mode-full .block-layout-builder.block-field-blocknodejobfield-job-image img{
	width:100%;
	height:auto;
	object-fit: cover;
}
#fix-footer{
      padding: 10px 20% 50px 20%;
}
#fix-footer .entry-link.entry{
  text-align: right;
}
#fix-footer .block-field-blocknodejobfield-job-location-name{
  margin-bottom:3px;
}
#fix-footer .block-field-blocknodejobnid{
  font-weight: 600;
}

/*20260129追加------------------------*/
.field--name-field-job-worktime .field__item,
.field--name-field-job-holiday .field__item,
.field--name-field-job-location_name .field__item,
.field--name-field-job-from_officer .field__item{
  white-space: pre-wrap;
}
.field--name-field-job-holiday .field__item:has(.field--name-field-job-welfare) {
  white-space: normal;
}
.path-node.page-node-type-job .field--name-field-job-qualify-list .field__items .field__item,
.path-node.page-node-type-job .field--name-field-job-welfare.field__items .field__item{
  flex: 0 0 calc((100% - 40px) / 3) !important;
}
.page-node-type-job .salary-flex {
  gap: 0px;
}
.salary-flex .salary-type {
  margin-right: 20px; 
}
.page-node-type-job .text-only a .job-grid-image img{
    min-width:auto;
}

@media (max-width: 1200px) {
  .node--type-job.node--view-mode-full .node__content .flex-left {
    max-width: 690px !important;
  }
  .path-node.page-node-type-job .field--name-field-job-qualify-list .field__items .field__item,
  .path-node.page-node-type-job .field--name-field-job-welfare.field__items .field__item {
    flex: 0 0 calc((100% - 20px) / 2) !important;
  }
}
@media (max-width: 991.9px) {
  .page-node-type-job .job-h3 .field .field__item .field {
    float: none;
    display: block;
    text-align: center;
  }
}
@media (max-width: 500px) {
  .path-node.page-node-type-job .field--name-field-job-qualify-list .field__items .field__item,
  .path-node.page-node-type-job .field--name-field-job-welfare.field__items .field__item {
    flex: 0 0 100% !important;
  }
}
/*------------------------*/

@media screen and (min-width: 40em){
	.node.node--type-job.node--view-mode-full .layout--threecol-section .layout__region.layout__region--first {
		padding-right: 2rem;
	}
}

@media screen and (max-width: 991px) {
  .page-node-type-job .layout--threecol-section.layout--threecol-section--25-50-25 {
    gap: 2rem;
  }
  .node.node--type-job.node--view-mode-carousel{
    height:auto !important;
  }
  #fix-footer{
    display: block;
  }
  #fix-footer .layout__region.layout__region--first{
    display: none;
  }
  #fix-footer .layout__region.layout__region--second .entry-link.regentry a, 
  #fix-footer .layout__region.layout__region--second .entry-link.entry a{
    width:100%;
  }
}


.page-node-type-job .layout--threecol-section--25-50-25 > .layout__region--second {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}



.page-node-type-job .layout--threecol-section--25-50-25 > .job-button-area {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-wrap: wrap;
}
.page-node-type-job .layout--threecol-section--25-50-25 > .job-button-area .block-extra-field-blocknodejobjob-entry-field,
.page-node-type-job .layout--threecol-section--25-50-25 > .job-button-area .block-extra-field-blocknodejobflag-flag-job{
  width:100%;
}

.page-node-type-job .layout--threecol-section--25-50-25 > .job-button-area a {
  width: 100%;
  box-sizing: border-box;
}

@media screen and (max-width: 991px) {
  .page-node-type-job .layout--threecol-section--25-50-25 > .job-button-area {
    flex: auto;
  }
	.page-node-type-job .page-title{
		font-size:2.1rem;
	}
}


.page-node-type-job .layout--onecol .block-layout-builder {
  margin-bottom: 2rem;
}

.page-node-type-job .layout--onecol .block-layout-builder.block-field-blocknodejobfield-job-salary-system {
  margin-bottom: 0;
}

.page-node-type-job .layout--onecol .block-layout-builder .field__label {
  margin-bottom: 10px;
}

.page-node-type-job .layout--onecol .block-layout-builder .field__item {
  line-height: 1.8;
}


.page-node-type-job .layout--onecol .block-layout-builder.block-field-blocknodejobfield-job-salary-system .field__item {
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--black-color);
    padding-bottom: 10px;
    border-bottom: 1px solid #ebedef;
}

.page-node-type-job .layout--onecol .block-field-blocknodejobfield-job-salary-low,
.page-node-type-job .layout--onecol .block-field-blocknodejobfield-job-salary-high {
  display: inline-block;
  font-size: 1.5rem;
  line-height: 200%;
  font-weight: 500;
  color: var(--black-color);
}

.page-node-type-job .layout--onecol .block-field-blocknodejobfield-job-salary-low + .block-field-blocknodejobfield-job-salary-high .field--name-field-job-salary-high:before {
  content: '～';
}

/* この企業のそのほかの求人情報 */
.block-views-blockjob-other-thiscompany-block-1 {
  margin-bottom: 5rem;
}

.block-views-blockjob-other-thiscompany-block-1 ul li {
  margin-bottom: 1.5rem;
  padding-bottom: 1.0rem;
  border-bottom: 0.1rem dotted #ccc;
}

.block-views-blockjob-other-thiscompany-block-1 ul li .views-field-title {
  margin-bottom: 0.8rem;
}

.block-views-blockjob-other-thiscompany-block-1 ul li .views-field-title a {
  font-size: 1.4rem;
  font-weight: bold;
}
.occupation-icon{
	border: 1px solid var(--green-color);
    height: 25px;
    border-radius: 120px;
    line-height: 25px;
    padding: 0px 20px;
    font-size: 1rem;
    color: var(--white-color);
    background: var(--green-color);
    display: inline-block;
}
.occupation-1{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-2{
	border: 1px solid #778899;
	color: #fff;
    background: #778899;
}
.occupation-3{
	border: 1px solid #006400;
	color: #fff;
    background: #006400;
}
.occupation-4{
	border: 1px solid #f5deb3;
	color: #000;
    background: #f5deb3;
}
.occupation-5{
	border: 1px solid #ff0000;
	color: #fff;
    background: #ff0000;
}
.occupation-6{
	border: 1px solid #c0c0c0;
	color: #fff;
    background: #c0c0c0;
}
.occupation-7{
	border: 1px solid #b0c4de;
	color: #fff;
    background: #b0c4de;
}
.occupation-8{
	border: 1px solid #2f4f4f;
	color: #fff;
    background: #2f4f4f;
}
.occupation-9{
	border: 1px solid #ff4500;
	color: #fff;
    background: #ff4500;
}
.occupation-10{
	border: 1px solid #f0f8ff;
	color: #000;
    background: #f0f8ff;
}
.occupation-11{
	border: 1px solid #f0e68c;
	color: #000;
    background: #f0e68c;
}
.occupation-12{
	border: 1px solid #ff8c00;
	color: #fff;
    background: #ff8c00;
}
.occupation-13{
	border: 1px solid #1e90ff;
	color: #fff;
    background: #1e90ff;
}
.occupation-14{
	border: 1px solid #d2691e;
	color: #fff;
    background: #d2691e;
}
.occupation-15{
	border: 1px solid #800000;
	color: #fff;
    background: #800000;
}
.occupation-16{
	border: 1px solid #556b2f;
	color: #fff;
    background: #556b2f;
}
.occupation-17{
	border: 1px solid #483d8b;
	color: #fff;
    background: #483d8b;
}
.occupation-18{
	border: 1px solid #40e0d0;
	color: #fff;
    background: #40e0d0;
}
.occupation-19{
	border: 1px solid #9932cc;
	color: #fff;
    background: #9932cc;
}
.occupation-20{
	border: 1px solid #FFCC00;
	color: #fff;
    background: #FFCC00;
}
.occupation-21{
	border: 1px solid #3366FF;
	color: #fff;
    background: #3366FF;
}
.occupation-22{
	border: 1px solid #9966CC;
	color: #fff;
    background: #9966CC;
}
.occupation-23{
	border: 1px solid #CC3366;
	color: #fff;
    background: #CC3366;
}
.occupation-24{
	border: 1px solid #27AE60;
	color: #fff;
    background: #27AE60;
}
.occupation-25{
	border: 1px solid #D35400;
	color: #fff;
    background: #D35400;
}
.occupation-26{
	border: 1px solid #9A7D0A ;
	color: #fff;
    background: #9A7D0A ;
}
.occupation-27{
	border: 1px solid #E74C3C ;
	color: #fff;
    background: #E74C3C ;
}
.occupation-28{
	border: 1px solid #5499C7;
	color: #fff;
    background: #5499C7;
}
.occupation-29{
	border: 1px solid #5DADE2;
	color: #fff;
    background: #5DADE2;
}
.occupation-30{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-31{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-32{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-33{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-34{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-35{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-36{
	border: 1px solid #a9a9a9;
	color: #000;
    background: #a9a9a9;
}
.occupation-102{
	border: 1px solid #34495E;
	color: #fff;
    background: #34495E;
}
.occupation-213 {
	border: 1px solid #3498DB;
	color: #fff;
    background: #3498DB;
}

@media screen and (max-width: 767px) {
  .block-views-blockjob-other-thiscompany-block-1 {
    margin-bottom: 6rem;
  }
  
  
  .view .field--type-image a img {
    width: 100%;
    object-fit: cover;
  }
}



/* 同じ職種の求人 ******************************** */

.block-views-blockrecommend-job-block-1 .views-view-responsive-grid--horizontal {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
}

.block-views-blockrecommend-job-block-1 .views-view-responsive-grid--horizontal .views-view-responsive-grid__item {
  width: calc((100% - 30px * 3) / 4);
}

.block-views-blockrecommend-job-block-1 .views-view-responsive-grid--horizontal .views-view-responsive-grid__item .layout__region--content {
  margin-bottom: 0;
}

.node--type-job.node--view-mode-carousel .block.block-layout-builder .field img {
  width: 100%;
  height: auto;
}

.node--type-job.node--view-mode-carousel .layout--onecol .block-layout-builder {
  margin-bottom: 0;
}

@media screen and (max-width: 991px) {
  .block-views-blockrecommend-job-block-1 .views-view-responsive-grid--horizontal {
    gap: 2rem;
  }

  .block-views-blockrecommend-job-block-1 .views-view-responsive-grid--horizontal .views-view-responsive-grid__item {
    width: calc((100% - 20px * 2) / 3);
  }
}

@media screen and (max-width: 767px) {
  .block-views-blockrecommend-job-block-1 .views-view-responsive-grid--horizontal .views-view-responsive-grid__item {
    width: 100%;
  }
  .block-views-blockrecommend-job-block-1 .field--type-image a {
    width: 100%;
  }
  #job-page-detailes .field--name-field-job-message{
    font-size:1.5rem;
  }
  #job-page-detailes .field .field__label{
    font-size:1.5rem;
  }
}



.node--type-job.node--view-mode-list .layout--twocol-section .field--name-field-job-message {
  padding: 0;
  background-color: initial;
}
.node--type-job.node--view-mode-list .layout--twocol-section .field--name-field-job-message p{
  font-size:1.2rem;
  line-height: 150%;
}
.node--type-job.node--view-mode-list .layout--twocol-section .field--name-field-job-description p,
.node--type-job.node--view-mode-list .layout--twocol-section .field--name-field-job-salary-text p{
  margin-top: 0px;
  line-height: 150%;
}
.salary-text{
  white-space: pre-wrap;
}

@media screen and (min-width: 768px) {
  .node--type-job.node--view-mode-list .layout--twocol-section .field--name-field-job-message p {
    margin-bottom: 0;
  }
}


/* ***************************************************************************
 * 検討リスト
 **************************************************************************** */

.path-bookmarks .blazy--view--flag-bookmark .field--type-image a img {
  width: 100%;
}

.path-bookmarks  .block-extra-field-blocknodejobflag-flag-job {
  left: 24rem!important;
}
/* JOB ステータス表示 **/
.block-views-blockjobstatus-block-1 {
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  height: auto;
  background: #EAECEE;
  z-index: 999;
  padding: 10px;
}
.block-views-blockjobstatus-block-1 .view-jobstatus {
  width: 100%;
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 10px;
}

.block-views-blockjobstatus-block-1 .views-row {
  display: flex;
  gap: 0px;
  max-width: 100%;
  min-width: 60%;
}
.block-views-blockjobstatus-block-1 .views-row .views-label {
  font-weight: 600;
  color: #000;
  border-bottom: 1px solid #ddd;
  background: #D5D8DC;
  text-align: left;
  padding: 5px;
  display: block;
}
.block-views-blockjobstatus-block-1 .views-row .field-content {
  background: #fff;
  text-align: left;
  padding: 5px;
  display: block;
}
.block-views-blockjobstatus-block-1 .views-row .views-field {
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd;
  background: #fff;
  min-width: 80px;
  flex: 1 0 80px;
}
.block-views-blockjobstatus-block-1 .views-row .views-field:last-child {
  border-right: 1px solid #ddd;
}
.block-views-blockjobstatus-block-1 header {
  text-align: left;
}
.question-icon {
  color: red;
}
.tooltips {
  cursor: pointer;
  text-decoration: underline;
  position: relative;
  margin-bottom: 15px;
}
.tooltips .tooltips_text {
  color: #333;
  display: none;
  text-decoration: none !important;
  cursor: default;
  opacity: 0;
  /* はじめは隠しておく */
  visibility: hidden;
  /* はじめは隠しておく */
}
.tooltips:hover .tooltips_text {
  visibility: visible;
  opacity: 1;
  display: block;
  text-decoration: none !important;
  cursor: default;
  position: absolute;
  bottom: 20px;
  background: #fff;
  padding: 15px;
  border-radius: 5px;
  max-width: 600px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.tosbox .tosbox-wrapper dd {
  display: flex;
}
#job-head{
  margin-top:20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#job-head .field--name-field-job-location-name{
  font-size:1.5rem;
  font-weight: 800;
}
#job-head .title {
  margin:0px;
  font-size:2.4rem;
  font-weight: 600;
}
#job-head .flex-group{
  display: flex;
  flex-wrap: wrap;
  gap:5px;
}
#job-head .field--name-field-job-special,
#job-head .field--name-field-job-pickup,
#job-head .field--name-field-job-kyubo {
  display: inline-block;
  height:25px;
  line-height: 25px;
  border-radius: 12px;
  padding:0px 12px;
}
#job-head .field--name-field-job-kodawari .field__items{
  display: flex;
  gap:4px;
  flex-wrap: wrap;
}
#job-head .field--name-field-job-special{
  background:#1abc9c;
  color:#fff;
}
#job-head .field--name-field-job-pickup {
  background:var(--blue-color);
  color:#fff;
}
#job-head .field--name-field-job-kyubo{
  background:var(--pink-color);
  color:#fff;
}
.job-in-menu{
  position: relative;
  box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
  background:#fff;
}
.sticked .job-in-menu{
  position: sticky;
  top:104px;
  
  z-index: 1;
  
}
body.sticked .job-in-menu{
  opacity: 0;
  transform: translateY(20px);
  animation: slideUpFadeIn 0.7s ease-out forwards;
  animation-delay: 0.4s;
}
.job-in-menu ul{
  display: flex;
}
.job-in-menu ul li{
  flex:1;
}
.job-in-menu ul li a{
  width:100%;
  text-align: center;
  height:50px;
  line-height: 50px;
  display: block;
}
.job-in-menu a.is-active,
.job-in-menu a:hover{ background:#e8f1ff; }
.job-h3{
  padding-top:20px;
}
.job-h3 .field{
  padding: 15px 0px;
  display: flex;
  border-bottom: 1px dotted #d5d8dc;
}
.job-h3 .field .field__item .field{
  padding:0px;
  border-bottom:none;
  margin-bottom:15px;
  float: left;
  margin-right: 10px;
}
.job-h3 .field .field__item .field img{
	padding:10px;
	box-sizing: border-box;
	background: #fff;
    box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;
}
.job-h3 .field .field__item{
  line-height: 180%;
  flex:1;
}
.job-h3 .field__label {
    font-size: 15px;
    font-weight: 500;
    color: #2c2e31;
    width: 200px;
}
.node--type-job.node--view-mode-full .field--name-field-job-message{
  padding:25px;
  border:1px solid #d5d8dc;
  font-size:1.6rem;
  margin-top:10px;
  line-height: 180%;
  border-radius: 5px;
}
.node--type-job.node--view-mode-full .node__content{
  display: flex;
  gap:20px;
  padding-bottom:40px;
  margin-bottom:80px;
  border-bottom:1px solid #d5d8dc;
}
.node--type-job.node--view-mode-full .node__content .flex-left{
  max-width:880px;
  width: 100%;
  font-size:15px;
}
.node--type-job.node--view-mode-full .node__content .flex-right{
  position: sticky;
  top: 120px;
  right: 0px;
  height: fit-content;
  width: 100%;
  margin-top: 20px;
  max-width: 280px;
  
}
.node--type-job.node--view-mode-full .node__content .flex-right .hw-data{
  margin-top:10px;
}
.node--type-job.node--view-mode-full .node__content .flex-right .job-left-entry{
  margin-bottom:10px;
}
.node--type-job.node--view-mode-full .node__content .flex-right .right-box{
  margin-bottom:15px;
  box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
  border-radius: 5px;
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  display: block;
  
}
.node--type-job.node--view-mode-full .node__content .flex-right .right-box.company_service p{
  line-height: 150%;
  color: var(--text-color);
}
.node--type-job.node--view-mode-full .node__content .flex-right a.company_service {
    width: 100%;
    color: var(--text-color);
    background:#EBF5FB url(../img/bn.webp) no-repeat right -20px bottom -15px;
    padding-bottom: 20px;
}

.node--type-job.node--view-mode-full .node__content .flex-right a.company_service p.text2{
  padding-right:90px;  
}
.node--type-job.node--view-mode-full .node__content .flex-right .flag-flag-job a{
  display: inline-block;
  font-weight: 600;
  color: var(--blue2-color);
  text-align: center;
  vertical-align: middle;
  background-color: var(--white-color);
  border: 2px solid var(--blue2-color);
  padding: 0 20px;
  font-size: 1.4rem;
  line-height: 40px;
  border-radius: 20px;
  height: 40px;
  width:100%;
}
.node--type-job.node--view-mode-full .node__content .flex-right a.company_service:hover{
  background-color:#D6EAF8;
}
.path-node.page-node-type-job .dialog-off-canvas-main-canvas{
  overflow:inherit;
}
.hw-data{
  padding:15px;
  background:#FEF9E7;
  font-size:11px;
  color:#B7950B;
  margin-bottom:20px;
}
.hw-text,
.job-message{
  font-size:16px;
  line-height: 180%;
  margin-top:20px;
  margin-bottom:20px;
  white-space: pre-wrap;
  
}
.path-node.page-node-type-job .field--name-field-job-welfare.field__items,
.path-node.page-node-type-job .field--name-field-job-qualify-list .field__items{
  flex-wrap: wrap;
  gap:20px;
}
.path-node.page-node-type-job .field--name-field-job-welfare.field__items .field__item,
.path-node.page-node-type-job .field--name-field-job-qualify-list .field__items .field__item{
  display: flex;
  gap: 10px;
  flex: auto;
}
.path-node.page-node-type-job .field--name-field-job-welfare.field__items .field__item:before,
.path-node.page-node-type-job .field--name-field-job-qualify-list .field__items .field__item:before{
  display: block;
  content: "";
  background: url(../img/icon.svg)no-repeat;
  width: 20px;
  height: 20px;
  margin-top: 5px;
  min-width: 20px;
}
.salary-flex{
  display: flex;
  gap:20px;
  margin-bottom:10px;
}
.job-hw-id{
  float:right;
}
.field--name-field-job-hw_remark,
.hw-text .field,
.field--name-field-job-description .field__item,
.field--name-field-job-qualify-text{
  white-space: pre-wrap;
}
@media (min-width: 1200px) {
    .job-h3 h3, .job-h3 h2 {
        font-size: 24px;
        padding-top: 30px;
        padding-bottom: 20px;
    }
    .job-h3 .field__label {
        font-size: 15px;
    }
}
@media (max-width: 991.9px) {
  .node--type-job.node--view-mode-full .node__content .flex-right .job-left-entry{
    margin-top:0px;
    padding-top:0px;
  }
  .node--type-job.node--view-mode-full .node__content .flex-right .right-box{
    margin-bottom:0px;
  }
  .node--type-job.node--view-mode-full .node__content .flex-right .right-box:nth-child(2){
    display: none;
  }
  .job-in-menu{
    width:100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow-x: clip; /* or hidden */
    margin-top:-20px;
  }
  .salary-flex{
    width:100%;
  }
    .sticked .job-in-menu{
      margin-top:0px;
      width:100vw;
      top:66px;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      overflow-x: clip; /* or hidden */
    }
    .job-h3 .field {
        display: block;
        gap: 0px;
        border-bottom: none;
    }
    .job-h3 .field__label, .job-h3 .field--name-field-jobex-free-0-ttl.field__item, .job-h3 .field--name-field-jobex-free-1-ttl.field__item, .job-h3 .field--name-field-jobex-free-2-ttl.field__item, .job-h3 .field--name-field-jobex-free-3-ttl.field__item, .job-h3 .field--name-field-jobex-free-4-ttl.field__item {
        margin-bottom: 15px;
        padding: 10px;
        background: #d5d8dc;
        border-radius: 3px;
        width:100%;
    }
  .node--type-job.node--view-mode-full .node__content{
    display: block;
  }
  .node--type-job.node--view-mode-full .node__content .flex-left{
    width:100%;
  }
  .node--type-job.node--view-mode-full .node__content .flex-right{
    position: fixed;
    width:100vw;
    max-width: 100vw;
    /*flex-direction: row;*/
    top: auto;
    background: #fff;
    bottom: 0;
    right: 0;
    left: 0;
    border-radius: 0px;
    z-index: 999;
}

  .node--type-job.node--view-mode-full .node__content .flex-right .field--name-entity-id-wv{
    display: none;
  }
  .node--type-job.node--view-mode-full .node__content .flex-right .entry-link.entry,
  .node--type-job.node--view-mode-full .node__content .flex-right .flag-flag-job{
    flex:1;
  }
  .node--type-job.node--view-mode-full .node__content .flex-right .entry-link.entry a,
  .node--type-job.node--view-mode-full .node__content .flex-right .flag-flag-job a{
    padding:0px 12px;
    font-size:12px;
  }
	.node--type-job.node--view-mode-full .node__content .flex-right .entry-link.entry a, .node--type-job.node--view-mode-full .node__content .flex-right .flag-flag-job a{
		width:100%;
		max-width: 100%;
	}
  #job-head .title{
    font-size:2.1rem;
  }
}
@media screen and (max-width: 767px) {
  #job-head .title{
    font-size:1.8rem;
  }
  .hw-text, .job-message {
    font-size: 1.5rem;
    line-height: 160%;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .flex-right .hw-data{
    display: none;
  }
}