/* CSS Document */


body {
  background-color: #fff;
}

.maincontent {
  max-width: 1110px;
  width    : 100%;
}

.bg-white {
  background-color: #fff !important;
}

.breadcrumb-area {
  background: #fff;
}

.breadcrumb-area .row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.breadcrumb-area nav {
  overflow: hidden;
  width: 100%;
}

.breadcrumb {
  display: flex;
  flex-wrap: nowrap;
  list-style: none;
  background: none;
  margin-top: 0;
  margin-bottom: 0;
  padding: 13px 0 22px 0;
  width: 100%;
  margin-left: 13px;
  margin-right: 13px;
  overflow-x: hidden;
  align-items: center;
  -ms-overflow-style: none;
}

.breadcrumb *::-webkit-scrollbar {
  display: none;
}

.breadcrumb-item {
  font-size: 12px;
  white-space: nowrap;
}

.breadcrumb-item,
.breadcrumb-item a {
  display: inline-block;
  white-space: nowrap;
}

.breadcrumb a {
  color: #B3B9BD;
}

.breadcrumb a:hover {
  color: #272D30;
  text-decoration: underline;
}

.breadcrumb-item + .breadcrumb-item {
  padding-left: 8px;
}

.breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;
  padding-right: 0.5rem;
  color: #B3B9BD;
  content: "/";
}

.breadcrumb .breadcrumb-item:last-child {
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #272B30;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 100%;
}

.breadcrumb-area .container {
  max-width: 962px;
}

@media screen and (max-width: 991px) {
  .breadcrumb-area .container {
    max-width: 1200px;
  }
}

@media screen and (max-width: 767px) {
  .breadcrumb .breadcrumb-item:last-child {
    text-overflow: ellipsis;
    padding-right: 16px;
    overflow: hidden;
    width: auto !important;
  }
}



a#main-content {
  display: none;
}


.slidewrapper {
        overflow: hidden;
        width: 100%;
        height: 400px;
      }

      .bx-wrapper {
        box-shadow: none !important;
        border: none !important;
      }

      .bx-viewport {

        width: 259;
        margin: 0 auto;
      }

      .bx-wrapper .bx-prev {
        display: none;
      }

      .bx-wrapper .bx-next {
        display: none;
      }

      .bx-wrapper .bx-pager {
        text-align: left;
      }

      .slidewrapper .box {
        display: grid;
        width: 259px !important;
      }


#content_bottom {
  background-color: #F0F2F5;
}

@media screen and (min-width: 1200px) {
  .col.content_area_center {
    max-width: 1110px;
  }
}

/* 新規登録 */
.cvareablock .btn.btn-cv {
  max-width: 620px;
  width    : 100%;
}


@media screen and (max-width: 767px) {
  .cvareablock .undercvtext {
    font-size  : 18px;
    line-height: 27px;
  }

  .cvareablock .btn.btn-cv {
    font-size  : 22px;
    line-height: 62px;
    height     : 72px;
  }
}




/* 共通 */

.text-center {
  text-align: center !important;
}

@media screen and (min-width: 991.5px) {
  .pc_only {
    display: block;
  }

  .sp_only {
    display: none;
  }
}

@media screen and (max-width: 991.4px) {
  .pc_only {
    display: none;
  }

  .sp_only {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .br-sp {
    display: none;
  }
}

.service {
  margin-bottom: 120px;
}

@media screen and (max-width: 767px) {
  .service {
    margin-bottom: 56px;
  }
}

.service .subttl {
  margin-bottom: 16px;
}

.service .subttl p {
  font-size  : 20px;
  font-weight: 700;
  line-height: 40px;
  color      : #7A8A93;
}

.service .subttl span {
  display: inline-block;
  width           : 40px;
  height          : 40px;
  background-color: #0095D8;
  border-radius   : 9999px;
  color           : #fff;
  text-align      : center;
  margin-right    : 4px;
}

.service .ttl h2 {
  font-size  : 28px;
  font-weight: 700;
  font-family: 'NotoSansJP', sans-serif;
  line-height: 50.4px;
}

@media screen and (max-width: 767px) {
  .service .ttl h2 {
    font-size  : 20px;
    line-height: 36px;
  }
}

.service h3 {
  font-size    : 20px;
  margin-bottom: 40px;
  text-align   : center;
}



/* #about *****************/

#about {
  text-align: center;
}

#about h1 {
  font-size: 28px;
  color    : #0095D8;
}

#about>img {
  display: block;
  width  : 50px;
  margin : 28px auto;
}

#about>p {
  color      : #7A8A93;
  font-size  : 16px;
  line-height: 28.8px;
}

@media screen and (max-width: 767px) {
  #about h1 {
    font-size  : 20px;
    line-height: 36px;
  }

  #about>img {
    margin: 16px auto;
  }

  #about>p {
    text-align: left;
    font-weight: 700;
  }
}


/* #vision *****************/
#vision .wrapper:not(.style) {
  display        : flex;
  gap            : 50px;
  justify-content: space-between;
  margin-bottom  : 40px;
}

#vision .wrapper:not(.style) .right {
  flex: 1;
}

@media screen and (max-width: 990px) {
  #vision .wrapper:not(.style) {
    display: block;
  }
}

#vision .wrapper.style {
  display              : grid;
  grid-template-columns: repeat(3, minmax(auto, 360px));
}

#vision .wrapper.style .img-box:nth-child(n+3) {
  grid-row-start: 2;
}

#vision .wrapper.style .img-box:nth-child(3) {
  grid-column-start: 2;
}

#vision .wrapper.style .img-box:nth-child(4) {
  grid-column-start: 3;
}

@media screen and (max-width: 990px) {
  #vision .wrapper.style {
    grid-template-columns: repeat(2, minmax(auto, 360px));
  }

  #vision .wrapper.style .img-box:nth-child(3),
  #vision .wrapper.style .img-box:nth-child(4) {
    grid-column-start: initial;
  }
}

@media screen and (max-width: 767px) {
  #vision .wrapper.style {
    /* grid-template-columns: repeat(2, minmax(auto, 188px)); */
    grid-template-columns: repeat(2, calc(100% / 2));
    justify-content      : center;

    margin-left: -15px;
    margin-right: -15px;
  }
}

#vision .wrapper.style .img-box {
  width     : 100%;
  max-height: 180px;
  height    : 100%;
}

/* あしらい文字 */
#vision .wrapper.style .img-box:nth-child(1),
#vision .wrapper.style .img-box:nth-child(4) {
  position: relative;
}

#vision .wrapper.style .img-box:nth-child(1)::after,
#vision .wrapper.style .img-box:nth-child(4)::after {
  color      : #fff;
  position   : absolute;
  top        : 0;
  bottom     : 0;
  font-size  : 56px;
  line-height: 0.8;
  font-weight: 700;
  transform  : rotate(90deg)
}

#vision .wrapper.style .img-box:nth-child(1)::after {
  content: 'WORK';
  right  : 0;
}

#vision .wrapper.style .img-box:nth-child(4)::after {
  content: 'LIFE';
  left   : -142px;
  bottom : -68px;
}

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

  #vision .wrapper.style .img-box:nth-child(1)::after,
  #vision .wrapper.style .img-box:nth-child(4)::after {
    font-size  : 30px;
    line-height: 30px;
  }

  #vision .wrapper.style .img-box:nth-child(1)::after {
    right: -5px;
  }

  #vision .wrapper.style .img-box:nth-child(4)::after {
    left  : -72px;
    bottom: -35px;
  }
}

/* #contract *****************/
.service_page .contract-img-wrap {
    display: flex;
    gap: 24px;
}

.service_page .contract-img {
    width: calc((100% - 24px) / 2);
}

.service_page #contract p {
    margin: 24px 0 40px;
}

@media only screen and (max-width: 768px){
  .service_page .contract-img-wrap {
    flex-direction: column;
    gap: 16px;
  }
    
  .service_page .contract-img {
    width: fit-content;
    margin: 0 auto;
  }
    
  .service_page #contract h2 br {
    display: none;
  }
    
  .service_page #contract p {
    margin: 16px 0 24px;
  }
}

/* #project *****************/

#project .ttl {
  margin-bottom: 54px;
}

@media screen and (max-width: 767px) {
  #project .ttl {
    margin-bottom: 24px;
  }
}

#project .wrapper.pj-list {
  box-sizing            : border-box;
  /* margin             : 50px; */
  margin                : 0 auto 50px;
  padding               : 1.5rem;
  /* 線の色設定 */
  --bg-gradient         : linear-gradient(#eee 0 100%);
  background-image      : var(--bg-gradient), var(--bg-gradient), var(--bg-gradient), var(--bg-gradient);
  background-repeat     : no-repeat;
  /* 線のサイズ設定（縦幅 横幅） */
  background-size       : 100% 2px, 2px 100%, 100% 2px, 2px 100%;
  /* 線の配置 */
  background-position   : left top 40px, right 40px top 200px, left bottom 40px, left 40px bottom 200px;
  position              : relative;
}

/* #project .wrapper.pj-list::before,
#project .wrapper.pj-list::after {
  content         : '';
  background-color: #eee;
  width           : 100%;
  height          : 2px;
  position        : absolute;
}

#project .wrapper.pj-list::before {
  top  : 40px;
  right: -50%;
}

#project .wrapper.pj-list::after {
  bottom: 40px;
  left  : -50%;
} */

#project .flex {
  display        : flex;
  flex-wrap      : nowrap;
  justify-content: space-between;
}

.box {
  /* padding: 60px 50px; */
  padding              : 62px 47px;
  display              : grid;
  grid-template-columns: 80px auto;
  gap                  : 16px 15px;
}

.box img {
  width           : 80px;
  height          : 80px;
  border-radius   : 9999px;
  /* margin       : 0 auto 10px; */
}

.box span {
  /* margin: 0 auto; */
  font-size  : 16px;
  font-weight: 700;
  line-height: 24px;
  margin     : 0;
  display    : flex;
  align-items: center;
}

.box ul {
  grid-column: 1/3;
}

.box ul li {
  list-style-type: none;
  position       : relative;
  padding-left   : 11px;
  font-size      : 16px;
  line-height    : 24px;
}

.box ul li:before {
  width     : 3px;
  height    : 3px;
  display   : block;
  position  : absolute;
  left      : 0;
  top       : 10px;
  content   : "";
  background: #0095D8;
}


@media screen and (min-width: 992px) {
  .box {
    width        : calc(100% / 3);
    margin-top   : -20px;
    margin-bottom: -20px;
  }

  .box01,
  .box02 {
    --bg-gradient      : linear-gradient(#eee 0 100%);
    background-image   : var(--bg-gradient), var(--bg-gradient), var(--bg-gradient), var(--bg-gradient);
    background-repeat  : no-repeat;
    background-size    : 0 0, 2px 100%, 0 0, 0 0;
    background-position: right;
  }

  .box02 {
    background-position: right 100px;
  }
}

@media screen and (max-width: 991px) {
  #project .flex {
    display: block;
  }

  #project .wrapper.pj-list {
    margin              : 50px;
    --bg-gradient-top   : linear-gradient(#eee 0 100%);
    --bg-gradient-right : linear-gradient(#eee 0 62%, transparent 62% 72%, #eee 72% 100%);
    --bg-gradient-bottom: linear-gradient(#eee 0 80%, transparent 81% 100%);
    --bg-gradient-left  : linear-gradient(#eee 0 40%, transparent 40% 50%, #eee 50% 100%);
    background-image    : var(--bg-gradient-top), var(--bg-gradient-right), var(--bg-gradient-bottom), var(--bg-gradient-left);
    background-repeat   : no-repeat;
    background-size     : 100% 2px, 2px 100%, 100% 2px, 2px 100%;
    background-position : left top 40px, right 40px top 0px, right 80px bottom 40px, left 40px bottom;
    position            : relative;
  }

  .box {
    width: 100%;
  }

  .box01 {
    /* 下線のみ */
    background-image   : linear-gradient(to right, #eee 0 80%, transparent 80% 100%);
    background-repeat  : no-repeat;
    background-size    : 100% 2px;
    background-position: bottom;
  }

  .box02 {
    /* 下線のみ */
    background-image   : linear-gradient(to left, #eee 0 80%, transparent 80% 100%);
    background-repeat  : no-repeat;
    background-size    : 100% 2px;
    background-position: bottom;
  }
}

@media screen and (max-width: 767px) {
  #project .wrapper.pj-list {
    margin-top  : 0;
    margin-left : -15px;
    margin-right: -15px;
    padding     : 0;
  }

  #project .wrapper.pj-list {
    background-position: left top 20px, right 15px top 0px, right 80px bottom 20px, left 15px bottom;
  }

  .box {
    padding: 52px 47px;
  }
}


/* 登録企業 */

#project .wrapper.company h3 {
  font-size    : 20px;
  font-weight  : 700;
  line-height  : 36px;
  text-align   : center;
  margin-bottom: 40px;
}

#project .company .registered {
  display              : grid;
  grid-template-columns: repeat(auto-fill, 160px);
  gap                  : 24px;
  justify-content      : center;
}

@media screen and (max-width: 767px) {
  #project .company .registered {
    gap: 10px;
  }
}


/* service4 User ライフスタイル… **/

#user .ttl {
  margin-bottom: 54px;
}

@media screen and (max-width: 767px) {
  #user .ttl {
    margin-bottom: 40px;
  }
}

.registrant-rate {
  margin-bottom: 60px;
}

.registrant-rate {
  position: relative;
}

.registrant-rate>span {
  text-align: right;
  width     : 100%;
  position  : absolute;
  top       : 10px;
}

.registrant-rate .wrapper {
  display: flex;
  gap    : 50px;
}

.registrant-rate .wrapper .rate {
  width: calc(100% / 3);
}

.registrant-rate .wrapper .rate.rate1 img {
  width: 100%;
}

@media screen and (max-width: 767px) {
  .registrant-rate>span {
    top: 30px;
  }

  .registrant-rate .wrapper {
    flex-wrap: wrap;
  }

  .registrant-rate .wrapper .rate {
    width        : 100%;
    text-align   : center;
    margin-bottom: 40px;
  }

  .registrant-rate .wrapper .rate:last-child {
    margin-bottom: 0;
  }
}


/* 利用者の声 */

.user-voice {
  max-width: 1080px;
  width    : 100%;
}

.user-voice .wrapper {
  display        : flex;
  gap            : 21px;
  justify-content: center;
  margin-top     : 71px;
}

.user-voice .wrapper .voice {
  border     : solid 1px #E5E9EB;
  padding    : 32px 32px 32px 69px;
  background : #fff;
  position   : relative;
  max-width  : 481px;
  width      : 100%;
  margin-top : 50px;
  margin-left: 50px;
}

.user-voice .wrapper .voice::before {
  position        : absolute;
  color           : #F0F2F5;
  font-size       : 28px;
  font-weight     : bold;
  transform-origin: left top;
  transform       : rotate(90deg);
  top             : 60px;
  left            : 40px;
  letter-spacing  : 0.1em;
  font-family     : "Arial Bold", sans-serif;
}

.user-voice .wrapper .voice.voice1::before {
  content: "USER VOICE 01";
}

.user-voice .wrapper .voice.voice2::before {
  content: "USER VOICE 02";
}

.user-icon {
  width   : 100px;
  height  : 100px;
  position: absolute;
  top     : -50px;
  left    : -50px;

}

.user-icon img {
  border          : 1px solid #E5E9EB;
  border-radius   : 9999px;
  background-color: #fff;
}

.user-voice .wrapper .voice .txt p {
  font-size  : 16px;
  line-height: 28.8px;
}

@media screen and (max-width: 990px) {
  .user-voice .wrapper .voice {
    padding    : 58px 16px 24px;
    margin-left: 0;
  }

  .user-voice .wrapper .voice::before {
    transform       : initial;
    transform-origin: initial;
    top             : 16px;
    left            : initial;
    right           : 16px;
  }

  .user-icon {
    left: -2px;
  }
}



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

  .user-voice h3 {
    margin-bottom: 24px;
  }

  .user-voice .wrapper {
    flex-wrap: wrap;
    gap      : 24px;
    margin-top: 0;
  }

  .user-voice .wrapper .voice {
    margin-top: 35px;
    padding: 48px 16px 24px;
  }

  .user-voice .wrapper .voice::before {
    font-size: 24px;
  }

  /* .user-voice .wrapper .voice::before {
    transform: initial;
    transform-origin: initial;
    top: 16px;
    left: initial;
    right: 16px;
  } */

  .user-icon {
    top   : -35px;
    width : 72px;
    height: 72px;
  }
}


/* エージェント *****************************/

@media screen and (max-width: 990px) {
  #block-views-block-tech-agent-list-block-1 {
    max-width   : 720px;
    margin-left : auto;
    margin-right: auto;
  }

  .agent-list header {
    margin-left  : 15px;
    margin-right : 15px;
    margin-bottom: 24px;
  }
}


@media screen and (max-width: 767px) {
  #block-views-block-tech-agent-list-block-1 {
    margin-left : -15px;
    margin-right: -15px;
  }
}

.agent-list {
  display        : flex;
  flex-wrap      : wrap;
  justify-content: center;
}

.agent-list .agent-item {
  /* width   : 175px;
  height  : 175px; */
  width   : 176px;
  height  : 176px;
  overflow: hidden;
}

.agent-list .field-content {
  display: inline;
}


/* 画像 */

.agent-list .agent-item .agent-hover {
  opacity: 1;
}

.agent-list .agent-item img {
  width     : 176px;
  height    : 176px;
  object-fit: cover;
  /* この一行を追加するだけ！ */
}

@media screen and (max-width: 990px) {
  .agent-list .agent-item {
    width : 125px;
    height: 125px;
  }

  .agent-list .agent-item img {
    width : 125px;
    height: 125px;
  }
}


/* hover　animation  */

.agent-list .agent-item .agent-main {
  transition: .3s;
  transform : rotateY(0deg);
}

.agent-list .agent-item .agent-hover {
  transition: .3s ease-in-out;
  transform : rotateY(90deg);
}

.agent-list .agent-item:hover .agent-main {
  opacity  : 0;
  width    : 0px;
  height   : 0px;
  transform: rotateY(90deg);
}

.agent-list .agent-item:hover .agent-hover {
  opacity         : 1;
  /* border-radius: 50%; */
  overflow        : hidden;
  transform       : rotateY(0deg);
}

.agent-list .agent-item .agent-hover img {
  border-radius: 9999px;
}


/* pc style */

@media only screen and (min-width: 991px) {

  /* layout */
  .agent-list {
    display              : grid;
    grid-template-columns: auto repeat(5, minmax(auto, 175px));
    grid-template-rows   : 56px repeat(6, minmax(auto, 87px));
    gap                  : 0;
  }

  .agent-list header {
    /* grid-column: 1/4; */
    grid-column: 1/5;
    grid-row   : 1/5;
  }

  .agent-list .views-row:nth-child(n+2) {
    grid-row-start: 2;
    margin        : 0;
  }

  .agent-list .views-row:nth-child(n+4) {
    grid-row-start: 4;
  }

  .agent-list .views-row:nth-child(n+7) {
    grid-row-start: 6;
  }

  .agent-list .views-row:nth-child(2) {
    grid-column: 5/6;
  }

  .agent-list .views-row:nth-child(3) {
    grid-column: 6/7;
  }

  .agent-list .views-row:nth-child(4) {
    grid-column: 4/5;
  }

  .agent-list .views-row:nth-child(7) {
    grid-column: 2/3;
  }

  .agent-list .views-row:nth-child(8) {
    grid-column: 3/4;
  }

  .agent-list .views-row:nth-child(9) {
    grid-column: 4/5;
  }

  .agent-list .views-row:nth-child(10) {
    grid-column: 5/6;
  }



  /* レイアウト変更 1026 */
  .agent-list {
    display: grid;
    grid-template-columns: auto repeat(5, minmax(auto, 176px));
    grid-template-rows: 56px repeat(3, minmax(auto, 176px));
    gap: 0;
  }
  
  .agent-list .views-row:nth-child(n+4) {
    grid-row-start: 3;
  }
  
  .agent-list .views-row:nth-child(n+7) {
    grid-row-start: 4;
  }
  
  .agent-list .views-row:nth-child(n+12) {
    grid-row-start: 5;
  }

  .agent-list .views-row:nth-child(n+18) {
    grid-row-start: 6;
  }

  .agent-list .views-row:nth-child(n+24) {
    grid-row-start: 7;
  }

  .agent-list .agent-item {
    margin-left: auto;
  }



  /* header */
  .agent-list header {
    display              : grid;
    grid-template-columns: auto repeat(3, 175px);
    grid-template-rows   : 56px repeat(8, minmax(auto, 43.5px));
    grid-template-rows   : 56px repeat(7, 43.5px);
    gap                  : 0;
  }

  .agent-list header .subttl {
    grid-column: 1/5;
  }

  .agent-list header .ttl {
    grid-column: 1/5;
  }

  .agent-list header .txt {
    grid-column   : 1/4;
    grid-row-start: 5;
  }

  /* other */
  .agent-list header .txt {
    padding-right: 20px;
  }
}


/* ご利用の流れ ************/
#block-hiprotechservice-stepflow {
  margin-bottom: 120px;
}

@media screen and (max-width: 767px) {
  #block-hiprotechservice-stepflow {
    margin-bottom: 56px;
  }
}

.stepflowrow {
  display   : flex;
  margin-top: 40px;
}

.stepflow {
  text-align: center;
  padding   : 19px 24px;
  width     : 205px;
  height    : 322px;
  position  : relative;
}

.row.stepflowrow:before {
  display     : block;
  content     : "";
  height      : 1px;
  width       : 100%;
  /*     width: 1166px;
  margin-left : -128px; */
  background  : #EAECEE;
}

.row.stepflowrow:after {
  display            : block;
  content            : "";
  height             : 1px;
  width              : 100%;
  /*     width       : 1192px;
  margin-left        : -30px; */
  background         : #EAECEE;
  /*     margin-right: -300px; */
}

.stepflow.flow1:before {
  display    : block;
  content    : "";
  width      : 1px;
  height     : 311px;
  margin-top : -59px;
  background : #EAECEE;
  position   : absolute;
  margin-left: -24px;
}

.stepflow.flow2:before {
  display    : block;
  content    : "";
  width      : 1px;
  height     : 359px;
  margin-top : -37px;
  background : #EAECEE;
  position   : absolute;
  margin-left: -24px;
}

.stepflow.flow3:before {
  display    : block;
  content    : "";
  width      : 1px;
  height     : 321px;
  margin-top : 10px;
  background : #EAECEE;
  position   : absolute;
  margin-left: -24px;
}

.stepflow.flow4:before {
  display    : block;
  content    : "";
  width      : 1px;
  height     : 328px;
  margin-top : -45px;
  background : #EAECEE;
  position   : absolute;
  margin-left: -24px;
}

.stepflow.flow5:before {
  display    : block;
  content    : "";
  width      : 1px;
  height     : 322px;
  margin-top : 0px;
  background : #EAECEE;
  position   : absolute;
  margin-left: -24px;
}

.stepflow.flow5:after {
  display   : block;
  content   : "";
  width     : 1px;
  height    : 307px;
  top       : 40px;
  background: #EAECEE;
  position  : absolute;
  right     : 0px;
}


.stepflow img {
  margin-bottom: 15px;
  width: 80px;
  height: 80px;
  display: inline;
}

.stepflow h4 {
  font-size    : 16px;
  color        : #01314E;
  line-height  : 140%;
  font-family  : "ZenOldMincho";
  margin-bottom: 16px;
}

.stepflow p {
  text-align : left;
  font-size  : 12px;
  color      : #303030;
  line-height: 160%;
  width      : 156px;
  position   : absolute;
  bottom     : 20px;
}

.komes {
  color         : #707F87;
  font-size     : 10px;
  vertical-align: text-bottom;
}



.bx-controls {
  display: none;
}

@media screen and (max-width: 991.5px) {
  .bx-controls {
    display: block;
  }
}


.slidewrapper .box {
  display: grid;
  width  : 259px !important;
}



ul.kome {
  margin-top: 32px;
}

ul.kome li {
  font-size  : 12px;
  color      : #607079;
  line-height: 160%;
}

.komepoint {
  width: 25px;
  float: left;
}

.komecontent {
  margin-left: 25px;
}

@media screen and (max-width: 767px) {
  ul.kome li {
    font-size: 10px;
  }
}


#block-hiprotechhotomucveria {
  padding-top: 80px;
}

@media screen and (max-width: 767px) {
  #block-hiprotechhotomucveria {
    padding-top: 64px;
  }
}


/* sp */
.bx-wrapper {
  display: none;
}

.bx-wrapper .bx-pager.bx-default-pager a {
  background: #B3B9BD !important;
  width     : 8px !important;
  height    : 8px !important;
}

@media screen and (max-width: 991.5px) {
  .sp_none {
    display: none;
  }

  .bx-wrapper {
    display: block !important;
  }


  #stepflow .container {
    padding-right: 24px;
    padding-left : 24px;
  }



  .bx-viewport {
    height: 405px !important;
  }

  .sp_only {
    display: block !important;
  }

  .slidewrapper {
    overflow: hidden;
    width   : 100%;
    height  : 400px;
  }

  .slidewrapper::before {
    display    : block;
    content    : "";
    height     : 1px;
    width      : 1500px;
    margin-left: -128px;
    background : #EAECEE;
    position   : absolute;
    top        : 30px;
  }

  .stepflow {
    text-align: center;
    padding   : 19px 30px;
    width     : 256px;
    height    : 285px;
    position  : relative;
  }


  .bx-wrapper .box {
    display: initial;
  }

  .bx-wrapper .box img {
    margin: 0 auto 20px;
  }

  .bx-wrapper .box span {
    display: initial;
  }

  .stepflow p {
    width : 200px;
    bottom: initial;
  }
}


@media screen and (max-width: 767px) {
  .bx-wrapper .box {
    padding: 52px 15px;
  }
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
  background: #07507B !important;
}


/* よくある質問 ************************/
#block-views-block-tech-faq-block-1-2 {
  padding-top: 56px;
}


.ui-accordion .ui-accordion-header {
  padding: 24px 32px !important;
}

.ui-accordion .ui-accordion-content {
  padding: 0px 32px 24px !important;
}

.ui-accordion .ui-accordion-header .field-content {
  display: inline-flex;
}


@media screen and (max-width: 767px) {
  .ui-accordion .ui-accordion-header {
    padding: 16px 40px 16px 16px !important;
  }

  .ui-accordion .ui-accordion-content {
    padding: 0px 40px 16px 16px !important;
  }

  .ui-state-default,
  .ui-state-active {
    background-position: right 22px center;
  }
}





/* ***************************************************
 * リリース後対応
 * ***************************************************/

 @media screen and (min-width: 991.5px) {
  .dialog-off-canvas-main-canvas {
    overflow-x: hidden;
  }

  #block-hiprotechservice-stepflow .stepflowrow {
    justify-content: center;
  }
  
  .row.stepflowrow:before {
    background: initial;
    background-image: linear-gradient(to right,#eee 0 27%,transparent 27% 32%,#eee 32% 97%,transparent 97% 100%);
  }
  
  .row.stepflowrow:after {
    background: initial;
    background-image: linear-gradient(to right,#eee 0 70%,transparent 70% 75%,#eee 70% 100%);
  }
  
  .stepflow.flow2:before {
    background: initial;
    background-image: linear-gradient(to bottom, #eee 0 90%,transparent 90% 100%);
  }
  
  .stepflow.flow3:before {
    margin-top: 0;
    background: initial;
    background-image: linear-gradient(to bottom, #eee 0 92%,transparent 92% 100%);
  }
  
  .stepflow.flow4:before {
    background: initial;
    background-image: linear-gradient(to bottom, #eee 0 97%,transparent 97% 100%);
  }
  
  .stepflow.flow5:before {
    background: initial;
    background-image: linear-gradient(to bottom, #eee 0 90%,transparent 90% 100%);
  }
  
  .stepflow.flow5:after {
    background: initial;
    background-image: linear-gradient(to bottom, #eee 0 92%,transparent 92% 100%);
  }

  .stepflow.flow1::after {
    display: block;
    content: "";
    background: #EAECEE;
    position: absolute;
    top: -1px;
    width: 50vw;
    height: 1px;
    left: -50vw;
  }
  
  .stepflow.flow4::after {
    display: block;
    content: "";
    background: #EAECEE;
    position: absolute;
    bottom: -1.15px;
    width: 50vw;
    height: 1px;
    right: -50vw;
  }



  .komes {
    color: #707F87;
    font-size: 12px;
    vertical-align: text-bottom;
  }

}

@media screen and (max-width: 991.4px) {
  .slidewrapper::after {
    display: block;
    content: "";
    height: 1px;
    width: 1500px;
    margin-left: -128px;
    background: #EAECEE;
    position: absolute;
    bottom: 30px;
  }

  .stepflow h4 {
    font-family: 'NotoSansJP';
    color: #272B30;
  }

  .komes {
    color: #707F87;
    font-size: 12px!important;
    font-weight: 400;
    vertical-align: text-bottom;
  }
}



/* service.css 2023.03.23 追加 *******************************************************/
#uniqueness .wrapper:not(.function) {
  display: flex;
  gap: 40px;
  justify-content: space-between;
  margin-bottom: 40px;
}

#uniqueness .wrapper .right {
  flex: 1;
}

#uniqueness .function {
  display: flex;
  gap: 32px;
}

#uniqueness .function .box {
  display: flex;
  gap: 16px;
  width: calc((100% - 32px) / 2);
  margin: 0;
  padding: 0;
}

#uniqueness .function .box img {
  max-width: 178px;
  width: 100%;
  height: 100%;
  border-radius: initial;
  object-fit: cover;
}

#uniqueness .function .box img.sp {
  display: none;
}
.ttl.uniqueness_left{
	width:644px;
}
.uniqueness_right{
	width:344px;
}
.uniqueness_left p{
  max-width: 528px;
  line-height: 28.8px;
}
.uniqueness_left span.kome{
  color:#7A8A93;
  font-size:10px;
  line-height: 16px;
}
.uniqueness_left img.sp{
  display: none;
}

@media screen and (max-width: 991px) {
  #uniqueness .function .box img.sp {
    display: block;
  }
  #uniqueness .function .box img.pc {
    display: none;
  }
}

#uniqueness .function .box .description h4 {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
  color: #272B30;
  margin-bottom: 16px;
}

#uniqueness .function .box .description p {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 180%;
  color: #272B30;
  margin-bottom: 8px;
}

#uniqueness .function .box .description .kome {
  font-style: normal;
  font-weight: 400;
  font-size: 10px;
  line-height: 160%;
  color: #7A8A93;
}

@media screen and (max-width: 991px) {
  .uniqueness_right img.pc{
    display: none;
  }
  .uniqueness_left img.sp{
    display: block;
    width:100%;
    height:auto;
    object-fit: cover;
    margin-bottom:15px;
  }
  .uniqueness_left p{
    width: 100%;
  }
  .ttl.uniqueness_left{
    width:100%;
  }
  .ttl.uniqueness_left h2 br{
    display: none;
  }
  .ttl.uniqueness_right{
    display: none;
  }
  #uniqueness .wrapper:not(.function) {
    display: block;
  }
  
  #uniqueness .function,
  #uniqueness .function .box {
    display: block;
  }
  
  #uniqueness .function .box {
    width: 100%;
    margin-bottom: 24px;
  }
  #uniqueness .function .box:last-child {
    margin-bottom: 0;
  }
  #uniqueness .function .box img {
    max-width: 100%;
    max-height: 191px;
    object-position: top;
    margin-bottom: 16px;
  }
  
  #uniqueness .function .box .description h4 {
    margin-bottom: 8px;
  }
}

@media screen and (max-width: 767px) {
  #uniqueness .ttl h2 br {
    display: none;
  }
}

.entry-link.entry a, .entry-link.regentry a{
    padding-top: 10px;
line-height:100% !important;
}
.path-reg-entry .profile--type--skill{
display:none;
}
.job-details-item-content .job_type {
    display: flex;
    background: url(/themes/custom/tech_front/custom/img/i-agent.svg) no-repeat;
    background-size: 16px 15px;
    padding-left: 20px;
    background-position: left;
    margin-right: 23px;
    margin-left: 23px;
}
form#node-entry-form {
border-radius:0px;
}
form#node-entry-form textarea{
border-radius:0px;
margin-bottom:8px;
}
.path-reg-entry .job-warp .actfreq .field--name-field-jobex-actfreq{
display:flex;
gap: 5px;
}
@media screen and (min-width: 992px){
.path-reg-entry .navigation {
     padding-top: 0px !important;
     padding-bottom: 0px !important;
}
}
.newslist li{
 color:#272D30;
}
.shwpd.eye-open {
    background: url(/themes/custom/tech_front/custom/img/eye-close.svg) no-repeat;
}
.shwpd.eye-close {
    background: url(/themes/custom/tech_front/custom/img/eye-open.svg) no-repeat;
}
.job-list  .field--name-field-job-occupation::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: #FFF;
}
.job-list  .list .field--name-field-job-occupation::before {
    content: "…";
    bottom: 0px;
    right: 0px;
    position: absolute;
    padding-left: 1em;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 30%);
}
.job-list .field--name-field-job-occupation {
    position: relative;
    line-height: 1.3;
    height: calc(1.3em * 2);
    overflow: hidden;
}
/* card　調整 */
.job-details.job.list .nolink{
    width:100%;
}
.job-details.job.list .field--name-field-job-occupation {
    display: block;
    width:99%;
    position: relative;
    font-size:12px;
    line-height: 1.5;
   /* height: calc(1.5em * 2);*/
height:auto;
        padding-left: 20px;
    background-position: left top 1px;
    overflow: hidden;
}
.field.field--name-field-job-occupation .field__item{
    display: inline;
    white-space: break-spaces;   
}

.login-form-page{
	margin-top: 0px !important;
	padding-top:40px !important;
}
.page-node-type-job .label-dev-warp{
margin-top: 3px;
}
.label-dev-warp .field--name-field-job-pg-skill .field__item,
.label-dev-warp .field--name-field-job-design .field__item,
.label-dev-warp .field--name-field-job-framework .field__item,
.label-dev-warp .field--name-field-job-infrastructure .field__item{
margin-bottom: 9px;
margin-top: -2px !important;
}
.column.grid .field--name-field-col-category:hover{
color:#636F78;
background:#E4E6E9;
border:1px solid #DADDDF
}
.cvbody{
 text-align:center;
margin-top:48px;
margin-bottom:80px;
}
.cvbody .undercvtext{
font-weight: 500;
font-size: 16px;
line-height: 150%;
color:#FB8D00;
margin-bottom:16px;
}
.cvbody .btn-cvbody{
 background: #FB8D00;
 font-size: 32px;
    color: #fff;
 font-size: 14px;
    width: 240px;
    height: 48px;
    line-height: 48px;
    font-weight: 700;
    border-radius: 0px;
}
.cvbody .btn-cvbody:hover{
  background: #DE7D00 !important;
  text-decoration:none !important;
}
.page-node-type-job #content_bottom .kodawari-warp .ttl h2{
margin-bottom:4px;
}
.dev-label{   float: left;
    margin-right: 10px;
}
.label-dev-warp{
clear:both;
}
.label-dev-warp:last-child{
margin-bottom:24px;
}
.user-logged-in #block-views-block-tech-faq-block-1-2 {
    padding-bottom: 80px;
}
.path-column .column-list-page header .columncategory>.item-list>ul>li:first-child {
    /*margin-left: 169px;*/
  /*margin-left: 185px;*/
}
.path-column .column-list-page header  header  .columncategory>.item-list>ul>li:first-child {
    margin-left: 0px;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 0px !important;
}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 0px !important;
}
@media screen and (max-width: 767px){
    .cd-slider .content, .cd-slider-left .content, .cd-slider-right .content {
        background-position: 30% 50%;
        background-size:100%;
        height: 200px;
    }
}

/* カルーセルタイトル調整 */
@media only screen and (min-width : 991.5px ) { 
    #block-tech-front-views-block-joblist-block-1 .blockcontent, 
    #block-tech-front-views-block-joblist-block-2 .blockcontent, 
    #block-views-block-joblist-block-3 .blockcontent, 
    #block-views-block-columnrecommend-block-1-2 .bottomblockcontent, 
    #block-views-block-tech-job-reccomend-block-1 .bottomblockcontent, 
    #block-views-block-tech-job-reccomend-block-2 .bottomblockcontent, 
    #block-views-block-tech-job-reccomend-block-3 .bottomblockcontent{
     margin-left:0!important;
    }
}

/*お知らせ一覧*/
 .newslist footer {
        max-width: 896px;
        margin-left: auto;
        margin-right: auto;
        margin-top:20px;
        position: relative;
        bottom: 0;
        right: 0;
        text-align:right;
 }
/* FAQ */
.ui-accordion .ui-accordion-content{
    border-radius:0;
}
.ui-accordion .views-row .views-row:last-child{
        border-bottom: 1px solid #E5E9EB;
}
/*登録フォーム PW*/
.form-control-wrap .pwd-prev input[type="password"]{
    display:block!important;
}

/* 開発言語・スキルから探す */
.tech-taxo-pgskill .item-list li img{
    width:32px;
    height:32px;
}
/* ヘルプ */
a.btn-icommon:hover {
    text-decoration: underline;
}

/*コラム pager*/
.column-list-body .pager{
    position:absolute;
    margin-top:0;
    z-index:19;
}
.column-list-page footer {
    max-width: 896px;
    margin-left: auto;
    margin-right: auto;
    
    position: relative;
    bottom: 0;
    right: 0;
    text-align:right;
}
@media only screen and (max-width : 767px ) { 
    .column-list-page footer {
        margin-top:-12px;
    }
    .column-list-page{
        margin-bottom:108px;
    }
    .column-list-body .pager{
        margin-top:30px;
        width:100%;
    }
}

/*ニュース pager*/
.newslist .column-list-body{
    margin-bottom:30px;
}
.newslist .pager{
    margin-top:20px;
}
.newslist footer {
    max-width: 896px;
    margin-left: auto;
    margin-right: auto;
    
    position: relative;
    bottom: 0;
    right: 0;
    text-align:right;
}
@media only screen and (max-width : 767px ) { 
    .newslist .column-list-page{
        margin-bottom:108px;
    }
    .newslist .column-list-body .pager{
        margin-top:52px;
        width:100%;
         z-index:19;
    }    
    .newslist footer {
        top:-18px;
    }
    .path-infomartion .newslist {
        margin-bottom: 85px;
    }
}


/* 検索フォーム PC版 業界 - 非表示 */
#block-tech-front-content-left-job-search #edit-industries-wrapper{
    display:none;
}
/* 検索フォーム SP版 業界tab - 非表示 */
#block-tech-front-content-job-search-sp #nav-wrap li.nav-item:nth-child(7){
    display:none;
}


/*詳細ページ　案件スライダ―*/
@media (min-width: 1200px){
    #block-views-block-tech-job-reccomend-block-1 .container .ttl, 
    #block-views-block-tech-job-reccomend-block-2 .container .ttl, 
    #block-views-block-tech-job-reccomend-block-3 .container .ttl,
    #block-views-block-columnrecommend-block-1-2 .container .ttl{
        max-width: 1104px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 12px;
    }
}

@media (min-width: 1200px){
    #block-views-block-tech-job-reccomend-block-1 .container, 
    #block-views-block-tech-job-reccomend-block-2 .container,
    #block-views-block-tech-job-reccomend-block-3 .container,
    #block-views-block-columnrecommend-block-1-2 .container{
        max-width: 1600px;
        padding-left: 0;
        padding-right: 0;
    }
}
@media (min-width: 1200px){
    #block-views-block-tech-job-reccomend-block-1 nav, 
    #block-views-block-tech-job-reccomend-block-2 nav, 
    #block-views-block-tech-job-reccomend-block-3 nav,
    #block-views-block-columnrecommend-block-1-2 nav{
        max-width: 1104px;
        width: 100%;
        position: relative;
        margin: auto;
    }
}
/* 文字化け対策 */
.path-taxonomy .term_main_image .term-head h2 div.field.field--name-name.field--type-string.field--label-hidden.field__item:after{
	content:"\306E\8EE2\8077\30FB\6C42\4EBA\691C\7D22\7D50\679C";
}
/* 関連サイトバナー */
#block-hiprotech-bottom-startersarea .bottomblockcontent a img{
height:auto;
}
/* 検索 スマホ 調整 */
@media only screen and (max-width: 991.4px){
.sp-condition-open .content_area_left .views-exposed-form#block-tech-front-content-job-search-sp .tab-content .form-checkboxes, .sp-condition-open .content_area_left .views-exposed-form#block-tech-front-content-job-search-sp .job-salaray .fieldset-wrapper, .sp-condition-open .content_area_left .views-exposed-form#block-tech-front-content-job-search-sp #tab-content-area_id_wrapper .fieldset-wrapper {
    height: calc(90vh - 200px);
    overflow-y: scroll;
}
#views-exposed-form-joblist-page-job-search-sp #edit-actions--4{
position: fixed;
bottom: 0px;
width: 100%;
background: #fff;
}
}
/* コラム詳細 */
/*.node--type-column .field--name-body h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 180%;
  color: #0095D8;
  margin-top: 80px;
  margin-bottom: 8px;
}

.node--type-column .field--name-body h3 {
  font-size: 16px;
  font-weight: 700;
  line-height: 180%;
  color: #272B30;
  margin-top: 40px;
  margin-bottom: 8px;
}

.node--type-column .field--name-body h4 {
  font-size: 16px;
  font-weight: 500;
  line-height: 150%;
  color: #272B30;
  margin-top: 40px;
  margin-bottom: 8px;
}

.node--type-column .field--name-body p {
  font-size: 16px;
  font-weight: 400;
  line-height: 180%;
  color: #272B30;
  margin-bottom: 8px;
}

.node--type-column .field--name-body table {
  margin-top: 16px;
  margin-bottom: 8px;
}*/

.widget-toc {
  margin-top: 40px;
  margin-bottom: 80px;
}
.column-details table{
width:100% !important;
}
/*
@media only screen and (max-width: 767px){
.tech_kodawari_accordion .ttl h2{
margin-bottom: 4px !important;
}
}
*/

/*TOP slider*/
@media only screen and (min-width : 1200px ) { 
    .job-slick .slick-track {
        margin-left: -253px;
    }
    .slick-prev.slick-arrow {
        left: 12px !important;
        bottom: 111px;
    }
    .slick-next.slick-arrow {
        right: 15px !important;
        bottom: 111px;
    }    
}

@media only screen and (max-width : 1199px ) { 
    
    .slick-prev.slick-arrow {
        position: absolute!important;
        left: 21px!important;
        bottom: 111px;
    }
    .slick-next.slick-arrow{
        position: absolute!important;
        right: 0px!important;
        bottom: 111px;
    }
    
}

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

    .slick-prev.slick-arrow {
        position: absolute!important;
        left: 21px!important;
        bottom: 111px;
    }
    .slick-next.slick-arrow{
        position: absolute!important;
        right: 145px!important;
         bottom: 111px;
    }
    
}
/* 20230113 */
.sp-condition-open #block-tech-front-content-job-search-sp .totalcnt.exposedformcnt.cntarea,
.sp-condition-open #block-tech-front-content-job-search-sp .submit-button.button.js-form-submit.form-submit,
.sp-condition-open #block-tech-front-content-job-search-sp .reset-button.button.js-form-submit {
  display: inline-block;
  margin-right: initial;
}

#block-tech-front-content-job-search-sp .totalcnt.exposedformcnt.cntarea, 
#block-tech-front-content-job-search-sp .submit-button.button.js-form-submit.form-submit,
#block-tech-front-content-job-search-sp .reset-button.button.js-form-submit{
  display: none;
}

/* 2023.02.03 追加 ***************************************/
/* 案件検索のモーダル 余白調整 */


 .search-modal-dialog > legend {
    margin: 0 !important;
  }

.search-modal-dialog .fieldset-wrapper fieldset {
    margin-top: 0;
    margin-bottom: 8px;
}

@media screen and (min-width: 992px) {
  .ui-widget.ui-widget-content .ui-dialog-title {
    margin: 0;
  }
  .ui-dialog .ui-dialog-content {
    margin: 16px 0 0;
  }

  .ui-dialog .ui-dialog-content>legend {
    margin: 0 !important;
  }

  .ui-dialog .ui-dialog-content .fieldset-wrapper fieldset {
    margin-top: 0;
    margin-bottom: 8px;
  }

  .ui-dialog .ui-dialog-content .fieldset-wrapper fieldset legend {
    margin-bottom: 16px;
  }

  .ui-dialog .ui-dialog-content .fieldset-wrapper fieldset label {
    margin-bottom: 8px;
  }
  
  .ui-dialog .ui-dialog-buttonpane {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 0px;
  }
  
  .ui-dialog .ui-dialog-buttonpane:before,
  .ui-dialog .ui-dialog-buttonpane:after {
    content: initial;
  }
  
  .ui-dialog .ui-dialog-buttonpane .totalcnt {
    font-weight: 400;
    font-size: 12px;
    line-height: 100%;
    color: #272B30;
  }
  
  .ui-dialog .ui-dialog-buttonpane .totalcnt .cnt {
    font-weight: 400;
    font-size: 24px;
    line-height: 100%;
    color: #0095D8;
    margin-left: 2px;
    margin-right: 3px;
  }
  
  .ui-dialog-buttonset .ui-button:first-child {
    width: 140px;
    margin-right: 24px;
  }
}

/* 職種 */
@media screen and (min-width: 992px) {
  #edit-occupations-dialog .fieldset-wrapper fieldset .fieldset-wrapper .form-checkboxes .form-item.js-form-type-checkbox {
    display: flex;
    margin-bottom: 8px;
  }
  #edit-occupations-dialog .fieldset-wrapper fieldset .fieldset-wrapper .form-checkboxes .form-item.js-form-type-checkbox label {
    display: flex;
    margin-bottom: 0;
  }
  #edit-occupations-dialog .fieldset-wrapper fieldset .fieldset-wrapper .form-checkboxes .form-item.js-form-type-checkbox input[type="checkbox"]+label::before {
    margin-top: 2px;
  }
}

@media only screen and (min-width : 991.5px ){
  #edit-occupations-dialog.search-modal-dialog .fieldset-wrapper .form-checkboxes .form-item.js-form-type-checkbox {
    display: flex;
    margin-bottom: 8px;
  }


  #edit-occupations-dialog.search-modal-dialog .fieldset-wrapper .form-checkboxes .form-item.js-form-type-checkbox label {
    display: flex;
    margin-bottom: 0;
  }

  #edit-occupations-dialog.search-modal-dialog .fieldset-wrapper .form-checkboxes .form-item.js-form-type-checkbox input[type="checkbox"]+label::before {
    margin-top: 2px;
  }
}

/*必須*/
.condition-box .profile-form .form-item .form-required::before{
    font-weight: 400;
    font-size: 10px;
    line-height: 100%;
    color: #fff;
    background-color: #B91509;
    margin-left: 8px;
    padding: 4px 4px 2px;
    display: block;
    content: '必須';
  float: right;
}


.login-form__top .form-required::before,
#edit-account .form-required::before{
  content: none;
}
/* 氏名の必須を消す */
.profile-seeker-profile-edit-form .field--name-field-skp-last-name .form-item .form-required::before,
.profile-seeker-profile-edit-form .field--name-field-skp-first-name .form-item .form-required::before,
.profile-seeker-profile-edit-form .field--name-field-skp-last-name-kana .form-item .form-required::before,
.profile-seeker-profile-edit-form .field--name-field-skp-first-name-kana .form-item .form-required::before{
    display:none!important;
}

/* 氏名 と　カタカナ*/
#edit-field-skp-last-name-wrapper,
#edit-field-skp-last-name-kana-wrapper{
    position:relative;
}

/* 氏名 */
#edit-field-skp-last-name-wrapper::after{
    font-weight: 400;
    font-size: 10px;
    line-height: 100%;
    color: #fff;
    background-color: #B91509;
    margin-left: 8px;
    padding: 4px 4px 2px;
    display: block;
    content: '必須';
    position:absolute;
    top:0;
    left:25px;
}

/* 氏名(カタカナ) */
#edit-field-skp-last-name-kana-wrapper::after{
    font-weight: 400;
    font-size: 10px;
    line-height: 100%;
    color: #fff;
    background-color: #B91509;
    margin-left: 8px;
    padding: 4px 4px 2px;
    display: block;
    content: '必須';
    position:absolute;
    top:0;
    left:100px;
}
/* 20230206 エントリー *****************************************************/
/* エントリー参照ヘッダー card*/
.node-entry-form .entryjob.block-fff{
   padding:9px 17px; 
}

.for-reference-head .job-list-title a{
    font-size: 20px;
    font-weight: 500;
    line-height: 150%;
    color: #272B30;
    width:100%;
}
.for-reference-head .job-list-title a::after{
    display:none;
}

.for-reference-head .entry_job .job-warp > .flex{
    margin-bottom:10px;
}

.for-reference-head .actfreq {
    display: flex;
    background: url(/themes/custom/tech_front/custom/img/i-time.svg) no-repeat;
    padding-left: 20px;
    background-position: left top 4px;
    margin-right:25px;
}
.for-reference-head .field--name-field-jobex-actfreq .field__item{
    font-size: 18px;
    color: #272D30;
    line-height:1.5;
}
.for-reference-head .money {
    display: flex;
    background: url(/themes/custom/tech_front/custom/img/i-money.svg) no-repeat;
    padding-left: 20px;
    background-position: left top 4px;
}
.for-reference-head .money .field{
    font-size: 18px;
    color: #272D30;
    line-height:1.5;
}

.for-reference-head .money .field--name-field-job-salary-low:after{
    content:"〜";
    padding:0 10px;
}
.for-reference-head .money .field--name-field-job-salary-system:before{
    content:"/";
      padding:0 10px
}
.for-reference-head .biz_type{
    display: flex;
    background: url(/themes/custom/tech_front/custom/img/i-earth.svg) no-repeat;
    padding-left: 20px;
    background-position: left;
    margin-bottom:10px;
}
.for-reference-head .occupation{
    display: flex;
    background: url(/themes/custom/tech_front/custom/img/i-type.svg) no-repeat;
    padding-left: 20px;
    background-position: left top 2px;
    margin-bottom:25px;
}

.for-reference-head .occupation .field--name-field-job-occupation {
    display: block;
    width: 99%;
    position: relative;
    font-size: 12px;
    line-height: 1.5;
    height: calc(1.5em * 2);
    background-position: left top 1px;
    overflow: hidden;
}
.for-reference-head .occupation .field--name-field-job-occupation>.field__item:nth-child(n + 2):before {
    content: "\30FB";
}
.for-reference-head .occupation .field--name-field-job-occupation::before {
    content: "…";
    bottom: 0px;
    right: 0px;
    position: absolute;
    padding-left: 1em;
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 30%);
}
.for-reference-head .occupation .field--name-field-job-occupation::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: #FFF;
}
.for-reference-head .skill .field__items{
    font-size: 0px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-content: flex-start;
}
.for-reference-head .skill .field__item{
    font-size: 11px;
    border: 1px solid #E5E9EB;
   display:inline-block;
    margin-top: 8px;
    border-radius: 10px !important;
    padding: 0px 8px !important;
    height: 20px;
    line-height: 18px;
    color: #636F78;
    background: #F0F2F5;
       max-width:250px;
}
.node--type-job.for-reference-head:not(.job-recommend):not(.list) .field--name-field-job-kodawari,
.for-reference-head .skill .field--name-field-job-kodawari{
    align-items: center;
    position: relative!important;
    bottom: 0!important;
    margin-top: 8px!important;
    margin-bottom: 0!important;
 
}



/* entry form ****************************************/
#node-entry-form .profile--type--seeker-profile.profile--is-default.profile--view-mode--for-entry, 
#node-entry-form .profile--type--skill.profile--is-default.profile--view-mode--for-entry {
    margin-bottom: 0px;
    padding: 9px;
    border:none;
    border-radius: 0px;
}

#node-entry-form .profile--type--seeker-profile.profile--is-default.profile--view-mode--for-entry .profile_group,
#node-entry-form .profile--type--skill.profile--is-default.profile--view-mode--for-entr .profile_group{
    border-top: 1px solid #E5E9EB;
    border-bottom: 1px solid #E5E9EB;
    padding-top:24px;
    padding-bottom:0;
}
#node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group > h3{
    font-size:0;
}
#node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group > h3:after{
    content:"ご登録者情報";
    font-weight: 500;
    font-size: 16px;
    line-height: 150%;
}
#node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group .field.field--label-inline{
    padding-top:0;
    padding-bottom:24px;
    padding-left:8px;
    padding-right:8px;
    border-bottom: none;
}
#node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group .field .field--name-field-skp-last-name-kana:before{
    content:"（";   
}
#node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group .field .field--name-field-skp-first-name-kana:after{
    content:"）";   
}


#node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group .field > .field__label{
    display:block;
    width:100%;
}


/* 任意 */
#node-entry-form .field--name-field-etr-pr .form-item label:after {
    display: inline-block;
    content: "任意";
    font-weight: 400;
    font-size: 10px;
    line-height: 150%;
    color: #fff;
    margin-left: 8px;
    background: #7A8A93;
    padding: 0px 4px;
    border-radius: 0px;
    height: 16px;
  
}


/* 完了ページ **/

body.page-node-16, body.path-register-tech, body.path-entry {
    background: #F0F2F5;
}

body.path-entry .maincontent .block-front-content > div h3:nth-child(4){
   display:none; 
}
body.path-entry .maincontent .block-front-content > div p:nth-child(3){
    margin-bottom:0!important;
}
body.path-entry .maincontent .block-front-content > div p:nth-child(5){
    color: #7A8A93;
    font-weight: 400;
    font-size: 10px;
    line-height: 150%;
    margin-bottom:0!important;
}
body.path-entry .maincontent .block-front-content > div p:nth-child(5):before{
    content:"※";
}

/* 20230207 追加 *****************************************************/
/* エントリー */

@media screen and (min-width: 992px) {
  .path-reg-entry .navigation {
    padding-top: 8px;
    padding-bottom: 8px;
  }
}

.path-reg-entry.page-node-type-job .block-front-content {
  position: relative;
}

.path-reg-entry.page-node-type-job .block-front-content:before {
  content: 'この案件の紹介を受けますか？';
  font-weight: 700;
  font-size: 24px;
  line-height: 180%;
  color: #272B30;
  margin-top: 24px;
  display: block;
}

.path-reg-entry .col.content_area_center {
  margin-bottom: 184px;
}

form#node-entry-form {
  margin-top: 24px;
  padding-bottom: 32px;
}


#node-entry-form .profile--type--seeker-profile.profile--is-default.profile--view-mode--for-entry {
  padding: 0 9px 0;
}

#node-entry-form .field--name-field-etr-pr {
  padding: 24px 9px 0;
}

#node-entry-form .field--name-field-etr-pr:before {
  content: '活かせる経験・スキル';
  font-weight: 500;
  font-size: 16px;
  line-height: 150%;
  color: #272B30;
  display: block;
  margin-bottom: 16px;
}

#node-entry-form .field--name-field-etr-pr .js-form-type-textarea {
  padding: 0 8px;
}

#node-entry-form .field--name-field-etr-pr .js-form-type-textarea label {
  font-weight: 500;
  font-size: 14px;
  line-height: 150%;
  color: #272B30;
  margin-bottom: 8px;
}

#node-entry-form .field--name-field-etr-pr .counter {
  text-align: right;
  font-weight: 400;
  font-size: 10px;
  line-height: 150%;
  color: #7A8A93;
}

#node-entry-form .field--name-field-etr-pr .counter strong {
  margin-right: 2px;
  color: #272B30;
}

#node-entry-form #edit-actions {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -106px;
}

#node-entry-form .for-reference-head .money {
  flex-wrap: wrap;
}

#node-entry-form .for-reference-head .money .field {
  white-space: pre;
}


@media screen and (max-width: 767px) {
  .node-entry-form .entryjob.block-fff {
    padding: 9px;
  }

  #node-entry-form .profile--type--seeker-profile.profile--view-mode--for-entry .profile_group .field.field--label-inline {
    padding-left: 0;
    padding-right: 0;
  }

  #node-entry-form .field--name-field-etr-pr .js-form-type-textarea {
    padding: 0;
  }
  #node-entry-form #edit-actions {
    position: initial;
    margin-top: 32px;
  }

  #node-entry-form .for-reference-head .money .field--name-field-job-salary-low:after {
    padding: 0 5px;
  }
  
  #node-entry-form .for-reference-head .money .field--name-field-job-salary-system:before {
    padding: 0 5px;
  }
}

/* エントリー完了 */
body.path-entry .maincontent .block-front-content {
  max-width: 804px;
  margin-left: auto;
  margin-right: auto;
}

body.path-entry .maincontent .block-front-content:before {
  content: 'この案件への参画を検討頂きありがとうございます。';
  display: block;
  font-weight: 700;
  font-size: 24px;
  line-height: 180%;
  color: #272B30;
  margin-bottom: 16px;
}

body.path-entry .maincontent .block-front-content > div {
  background-color: #fff;
  padding: 24px 24px 32px;
  position: relative;
}

body.path-entry .maincontent .block-front-content > div p {
  padding: 0 8px;
}

body.path-entry .maincontent .block-front-content > div p:first-child {
  margin-bottom: 32px!important;
  font-weight: 400;
  font-size: 16px;
  line-height: 180%;
  color: #272B30;
}

@media screen and (max-width: 767px) {
  body.path-entry .maincontent .block-front-content {
    padding-left: 16px;
    padding-right: 16px;
  }
  
  body.path-entry .maincontent .block-front-content > div p {
    padding: 0;
  }
}

@media screen and (max-width: 555px) {
  body.path-entry .maincontent .block-front-content > div p:nth-child(5):after {
    bottom: 110px;
  }
}

@media screen and (max-width: 339px) {
  body.path-entry .maincontent .block-front-content > div p:nth-child(5):after {
    bottom: 125px;
  }
}
/* 登録フォームボタン */
.tabbutton[disabled]:hover{
        background-color: #d6d5d5 !important;
        border: 1px solid #dcdada !important;
}


/* 2023.03.10 追加 *************************************************/

/* 関連記事 */
/* #block-views-block-tech-column-related-block-1 {
  padding-top: 56px;
  padding-bottom: 54px;
}

#block-views-block-tech-column-related-block-1 .bottomblockcontent > div > div {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 16px;
}

#block-views-block-tech-column-related-block-1 .related-warp {
  border: 1px solid #E5E9EB;
  width: calc((100% - 16px) / 2);
}

#block-views-block-tech-column-related-block-1 .related-warp a {
  display: flex;
}

#block-views-block-tech-column-related-block-1 .related-img {
  max-width: 164px;
  width: 100%;
  height: 100%;
}


#block-views-block-tech-column-related-block-1 .related-warp .related-warp {
  border: none;
  width: 100%;
  padding: 15px 16px;
  position: relative;
  font-size: 0;
}

#block-views-block-tech-column-related-block-1 .related-warp .related-warp .date {
  font-family: Arial;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 100%;
  color: #7A8A93;
  display: block;
  margin-bottom: 6px;
}

#block-views-block-tech-column-related-block-1 .related-warp .related-warp .category {
  font-size: 11px;
  margin-bottom: 8px;
  padding: 5px 8px 4px;
  text-align: center;
  width: auto;
  display: inline-block;
  color: #636F78;
  border: 1px solid #E5E9EB;
  background: #F0F2F5;
  border-radius: 10px !important;
  height: 20px;
  line-height: 100%;
}
#block-views-block-tech-column-related-block-1 .related-warp .related-warp .category a{
      color: #636F78;
}
#block-views-block-tech-column-related-block-1 .related-warp .related-warp .category:hover{
    background-color: #E4E6E9;
    border-color: #DADDDF;
    color: #636F78;
}
#block-views-block-tech-column-related-block-1 .related-warp .related-warp .title {
  font-family: 'NotoSansJP';
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 150%;
  color: #272B30;
  
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

#block-views-block-tech-column-related-block-1 .related-warp .related-warp .related-more {
  position: absolute;
  bottom: 16px;
  right: 16px;
  
  font-family: Arial;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 150%;
  text-align: right;
  color: #0095D8;
}

#block-views-block-tech-column-related-block-1 .related-warp a:hover .related-warp .related-more {
  text-decoration: underline;
  color: #007FB8;
}


@media screen and (max-width: 991.4px) {
  #block-views-block-tech-column-related-block-1 .bottomblockcontent > div > div {
    gap: 24px;
  }

  #block-views-block-tech-column-related-block-1 .related-warp {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  #block-views-block-tech-column-related-block-1 {
    padding-top: 40px;
    padding-bottom: 56px;
  }
  
  #block-views-block-tech-column-related-block-1 .related-warp {
    max-width: 343px;
    width: 100%;
    margin: 0 auto;
  }
  
  #block-views-block-tech-column-related-block-1 .related-warp a {
    flex-wrap: wrap;
  }
  
  #block-views-block-tech-column-related-block-1 .related-img,
  #block-views-block-tech-column-related-block-1 .related-img img {
    max-width: 100%;
    width: 100%;
    max-height: 191px;
    height: 100%;
    object-fit: cover;
  }
  
  #block-views-block-tech-column-related-block-1 .related-warp .related-warp {
    height: 173px;
    padding: 16px 24px 24px;
  }
  
  #block-views-block-tech-column-related-block-1 .related-warp .related-warp .date {
    display: inline-block;
    width: auto;
    margin-right: 8px;
  }
} */

/* 記事カテゴリ一覧 */
/* #block-views-block-tech-column-category-block-1 {
  padding-bottom: 80px;
}

#block-views-block-tech-column-category-block-1 .columncategory.tax-category-list {
  margin-bottom: 0;
}

#block-views-block-tech-column-category-block-1 .columncategory.tax-category-list li a {
    font-size: 14px;
    padding: 0px 16px;
    text-align: center;
    width: auto;
    display: inline-block;
    margin-top: 8px;
    margin-bottom: 0px;
    margin-right: 8px;
    color: #636F78;
    border: 1px solid #E5E9EB;
    background: #F0F2F5;
    border-radius: 40px !important;
    height: 30px;
    line-height: 28px;
}
#block-views-block-tech-column-category-block-1 .columncategory.tax-category-list li a:hover{
       background-color: #E4E6E9;
    border-color: #DADDDF;
    color: #636F78; 
}

@media screen and (max-width: 767px) {
  #block-views-block-tech-column-category-block-1 {
    padding-bottom: 65px;
  }
} */

/* 20230323  リリース修正 **/
/* 案件リクエスト 気になる過去案件 無しの場合の対応  */
/* 無しの場合は消す */
body.page-node-type-case-request .req-job-warp.past-job{
    background: none;
    padding: 0;
    margin-bottom: 0px;
    border: none;
    position: relative;
}
body.page-node-type-case-request .req-job-warp.past-job h3{
    display:none!important;
}
/*有りの場合*/
body.page-node-type-case-request .req-job-warp.past-job .field--name-field-crq-job.field--type-entity-reference:before{
    content:"気になる過去案件";
    display:block;
    font-weight: 500;
    font-size: 20px;
    line-height: 150%;
    margin-bottom: 24px!important;
}
body.page-node-type-case-request .req-job-warp.past-job .field--name-field-crq-job.field--type-entity-reference{
    background: #fff;
    padding: 24px 24px 16px 24px;
    margin-bottom: 24px!important;
    border: 1px solid #E5E9EB;
    position: relative;
}
/* プレビューダイアログ */
.ui-dialog-titlebar{
    background:none;
    border:none;
        font-weight: 500;
    font-size: 16px;
    line-height: 150%;
}

.ui-dialog-content p{
    font-size:14px;
}

.ui-dialog-buttonset{
    text-align:center;
    float:none!important;
    width:100%;
}

.ui-dialog-buttonset .ui-button{
    display: block;
    color: #fff;
    font-size: 13px;
    background: #0095D8;
    text-align: center;
    font-weight: 500;
    border-radius: 0px;
    border: 1px solid #0095D8;
    width:100%;
    max-width: 228px;
    height: 48px;
    margin-left:auto;
    margin-right:auto;
}
.ui-dialog .ui-dialog-buttonpane button{
    margin:5px auto;
}
.ui-dialog-buttonset .ui-button:first-child{
    background: #fff;
    border: 1px solid #0095D8;
    color: #0095D8;
    margin-left:auto;
    margin-right:auto;
    width:100%;
}

/* 20230323 リリース後 */
.pager__items .pager__item--ellipsis{
    display:none;
}
/* 検索 modal修正 */
.path-job-search .ui-dialog-buttonset .ui-button{
    display:inline-block;
}
.path-job-search .ui-dialog-buttonset .ui-button:last-child{
   max-width:240px;
}
.path-job-search .ui-dialog-buttonset .ui-button:first-child{
    border:none;
    max-width: 190px;
}
.path-job-search .ui-dialog .ui-dialog-titlebar-close{
    top:0;
    right:-5px;
}
.path-job-search .ui-dialog-buttonset{
    text-align:right;
}

/* 20230324 */
/* 経歴・スキルの登録 */
.profile-tech-experience-skill-add-form .field--name-field-tes-company .form-item,
.profile-tech-experience-skill-add-form .field--name-field-tes-freelance .form-item,
.profile-tech-experience-skill-add-form .field--name-field-tes-representative .form-item,
.profile-tech-experience-skill-edit-form .field--name-field-tes-company .form-item,
.profile-tech-experience-skill-edit-form .field--name-field-tes-freelance .form-item,
.profile-tech-experience-skill-edit-form .field--name-field-tes-representative .form-item {
  display      : flex;
  align-items  : center;
  margin-bottom: 16px;
}
.profile-tech-experience-skill-add-form .field--name-field-tes-company .form-item label,
.profile-tech-experience-skill-add-form .field--name-field-tes-freelance .form-item label,
.profile-tech-experience-skill-add-form .field--name-field-tes-representative .form-item label,
.profile-tech-experience-skill-edit-form .field--name-field-tes-company .form-item label,
.profile-tech-experience-skill-edit-form .field--name-field-tes-freelance .form-item label,
.profile-tech-experience-skill-edit-form .field--name-field-tes-representative .form-item label {
  width        : 84px;
  margin-right : 16px;
  margin-bottom: 0;
}
.profile-tech-experience-skill-add-form .field--name-field-tes-company .form-item:after,
.profile-tech-experience-skill-add-form .field--name-field-tes-freelance .form-item:after,
.profile-tech-experience-skill-add-form .field--name-field-tes-representative .form-item:after,
.profile-tech-experience-skill-edit-form .field--name-field-tes-company .form-item:after,
.profile-tech-experience-skill-edit-form .field--name-field-tes-freelance .form-item:after,
.profile-tech-experience-skill-edit-form .field--name-field-tes-representative .form-item:after {
  content    : "年";
  margin-left: 4px;
}
.profile-tech-experience-skill-add-form .field--name-field-tes-company:before ,
.profile-tech-experience-skill-edit-form .field--name-field-tes-company:before {
  content      : "経歴";
  font-size    : 14px;
  font-weight  : 500;
  display      : block;
  margin-bottom: 8px;

}
.profile-tech-experience-skill-add-form .field--name-field-tes-company .form-item .form-select,
.profile-tech-experience-skill-add-form .field--name-field-tes-freelance .form-item .form-select,
.profile-tech-experience-skill-add-form .field--name-field-tes-representative .form-item .form-select,
.profile-tech-experience-skill-edit-form .field--name-field-tes-company .form-item .form-select,
.profile-tech-experience-skill-edit-form .field--name-field-tes-freelance .form-item .form-select,
.profile-tech-experience-skill-edit-form .field--name-field-tes-representative .form-item .form-select {
  width        : 117px;
  border       : solid 1px #D3DADD;
  border-radius: 0;
}
.profile-tech-experience-skill-add-form .form-item .form-select,
.profile-tech-experience-skill-edit-form .form-item .form-select {
  background: url(/themes/custom/tech_front/custom/img/down.svg) no-repeat 90% center !important;
}
/* service.css 2023.03.23 追加 *******************************************************/
#uniqueness .wrapper:not(.function) {
  display: flex;
  gap: 40px;
  justify-content: space-between;
  margin-bottom: 40px;
}

#uniqueness .wrapper .right {
  flex: 1;
}

#uniqueness .function {
  display: flex;
  gap: 32px;
}

#uniqueness .function .box {
  display: flex;
  gap: 16px;
  width: calc((100% - 32px) / 2);
  margin: 0;
  padding: 0;
}

#uniqueness .function .box img {
  max-width: 178px;
  width: 100%;
  height: 100%;
  border-radius: initial;
  object-fit: cover;
}

#uniqueness .function .box img.sp {
  display: none;
}

@media screen and (max-width: 991px) {
  #uniqueness .function .box img.sp {
    display: block;
  }
  #uniqueness .function .box img.pc {
    display: none;
  }
}

#uniqueness .function .box .description h4 {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
  color: #272B30;
  margin-bottom: 16px;
}

#uniqueness .function .box .description p {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 180%;
  color: #272B30;
  margin-bottom: 8px;
}

#uniqueness .function .box .description .kome {
  font-style: normal;
  font-weight: 400;
  font-size: 10px;
  line-height: 160%;
  color: #7A8A93;
}

@media screen and (max-width: 991px) {
  #uniqueness .wrapper:not(.function) {
    display: block;
  }
  
  #uniqueness .function,
  #uniqueness .function .box {
    display: block;
  }
  
  #uniqueness .function .box {
    width: 100%;
    margin-bottom: 24px;
  }
  #uniqueness .function .box:last-child {
    margin-bottom: 0;
  }
  #uniqueness .function .box img {
    max-width: 100%;
    max-height: 191px;
    object-position: top;
    margin-bottom: 16px;
  }
  
  #uniqueness .function .box .description h4 {
    margin-bottom: 8px;
  }
}

@media screen and (max-width: 767px) {
  #uniqueness .ttl h2 br {
    display: none;
  }
}

#block-views-block-tech-agent-list-block-1{
		margin-top:-70px;
		margin-bottom:70px;
	}
	#block-hiprotechservice-stepflow .hiprottl{
		letter-spacing: 1.6px;
	}
	#block-hiprotechservice-stepflow .stepflow{
		padding: 23px 24px;
		height: 337px;
		width:auto;
	}
	#block-hiprotechservice-stepflow .stepflow img {
		margin-bottom:16px;
	}
	#block-hiprotechservice-stepflow .stepflow h4{
		font-family: 'NotoSansJP', "Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo ,sans-serif;
		font-weight:500;
		color:#272B30;
		margin-bottom:37px;
	}
	#block-hiprotechservice-stepflow .stepflow p{
		font-size:12px;
		line-height:160%;
		position: relative;
		width:167px;
	}
	#block-hiprotechservice-stepflow  ul.kome{
		margin-top: 25px;
		font-size:10px;
		color:#7A8A93;
	}
	#block-hiprotechservice-stepflow ul.kome li {
		font-size:10px;
		color:#7A8A93;
	}
	#block-hiprotechservice-stepflow ul.kome li .komepoint {
		width:17px;
	}
	#block-hiprotechservice-stepflow ul.kome li .komecontent {
		margin-left: 18px;
	}
	#block-hiprotechservice-stepflow .stepflowrow {
		    width: 1110px;
	}

  #uniqueness .wrapper:not(.function) {
  display: flex;
  gap: 40px;
  justify-content: space-between;
  margin-bottom: 40px;
}

#uniqueness .wrapper .right {
  flex: 1;
}

#uniqueness .function {
  display: flex;
  gap: 32px;
}

#uniqueness .function .box {
  display: flex;
  gap: 16px;
  width: calc((100% - 32px) / 2);
  margin: 0;
  padding: 0;
}

#uniqueness .function .box img {
  max-width: 178px;
  width: 100%;
  height: 100%;
  border-radius: initial;
  object-fit: cover;
}

#uniqueness .function .box img.sp {
  display: none;
}
.ttl.uniqueness_left{
	width:644px;
}
.uniqueness_right{
	width:344px;
}
.uniqueness_left p{
  max-width: 528px;
  line-height: 28.8px;
}
.uniqueness_left span.kome{
  color:#7A8A93;
  font-size:10px;
  line-height: 16px;
}
.uniqueness_left img.sp{
  display: none;
}

@media screen and (max-width: 991px) {
  #uniqueness .function .box img.sp {
    display: block;
  }
  #uniqueness .function .box img.pc {
    display: none;
  }
}

#uniqueness .function .box .description h4 {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
  color: #272B30;
  margin-bottom: 16px;
}

#uniqueness .function .box .description p {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 180%;
  color: #272B30;
  margin-bottom: 8px;
}

#uniqueness .function .box .description .kome {
  font-style: normal;
  font-weight: 400;
  font-size: 10px;
  line-height: 160%;
  color: #7A8A93;
}

@media screen and (max-width: 991px) {
  .uniqueness_right img.pc{
    display: none;
  }
  .uniqueness_left img.sp{
    display: block;
    width:100%;
    height:auto;
    object-fit: cover;
    margin-bottom:15px;
  }
  .uniqueness_left p{
    width: 100%;
  }
  .ttl.uniqueness_left{
    width:100%;
  }
  .ttl.uniqueness_left h2 br{
    display: none;
  }
  .ttl.uniqueness_right{
    display: none;
  }
  #uniqueness .wrapper:not(.function) {
    display: block;
  }
  
  #uniqueness .function,
  #uniqueness .function .box {
    display: block;
  }
  
  #uniqueness .function .box {
    width: 100%;
    margin-bottom: 24px;
  }
  #uniqueness .function .box:last-child {
    margin-bottom: 0;
  }
  #uniqueness .function .box img {
    max-width: 100%;
    max-height: 191px;
    object-position: top;
    margin-bottom: 16px;
  }
  
  #uniqueness .function .box .description h4 {
    margin-bottom: 8px;
  }
}

@media screen and (max-width: 767px) {
  #uniqueness .ttl h2 br {
    display: none;
  }
}

/* service.css contract 2026.03.10 追加 ******************************************************* */
#block-tech-front-content .align-items-center.row {
    display: unset;
}

.service_area .contract-img-wrap {
    display: flex;
    gap: 24px;
}

.service_area .contract-img {
    width: calc((100% - 24px) / 2);
}

.service_area #contract p {
    margin: 24px 0 40px;
}

@media only screen and (max-width: 768px){
  .service_area .contract-img-wrap {
    flex-direction: column;
    gap: 16px;
  }
    
  .service_area .contract-img {
    width: fit-content;
    margin: 0 auto;
  }
    
  .service_area #contract h2 br {
    display: none;
  }
    
  .service_area #contract p {
    margin: 16px 0 24px;
  }
}
@media (min-width: 576px) {
    section.node--type-page .container {
        max-width: 1080px;
    }
}


/*layout調整*/
@media only screen and (min-width: 991px) {
  .agent-list .views-row:nth-child(7) {
    grid-column: 3/4;
  }

  .agent-list .views-row:nth-child(8) {
    grid-column: 4/5;
  }

  .agent-list .views-row:nth-child(9) {
    grid-column: 5/6;
  }
}

@media only screen and (min-width: 991px) {
    .agent-list .views-row:nth-child(n+6) {
        grid-row-start: 4;
    }
    
    .agent-list .views-row:nth-child(4) {
        grid-column: 5;
    }
    
        .agent-list .views-row:nth-child(7) {
        grid-column: 5;
    }
    
}


/* content_bottom（よくある質問・新規登録CTA） ************/
#content_bottom h2 {
  font-size: 20px;
  font-weight: 500;
  color: #272D30;
  margin: 0;
}

#content_bottom .ttl h2 {
  margin-bottom: 26px;
}

#block-views-block-tech-faq-block-1-2 {
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
}

#block-views-block-tech-faq-block-1-2 .col-md-12 {
  position: relative;
}

.rightlistlink {
  position: absolute;
  right: 0;
  top: 9px;
  font-size: 14px;
  color: #0095D8;
}

.rightlistlink:hover {
  color: #0072A6;
  text-decoration: underline;
}

/* FAQアコーディオン */
.accordion {
  width: 100%;
  background-color: #fff;
  border: 1px solid #E5E9EB;
  border-bottom: 0;
}

.accordion-list .item-list:last-child .accordion {
  border-bottom: 1px solid #E5E9EB;
}

.accordion-list .item-list .field-content {
  width: 100%;
}

.accordion .ttl {
  width: 100%;
  padding: 24px 76px 24px 32px !important;
  text-align: left !important;
  display: flex;
  gap: 24px;
  align-items: flex-start;
  cursor: pointer;
}

.accordion .ttl::-webkit-details-marker {
  display: none;
}

.accordion-list details[open] .ttl {
  padding-bottom: 8px !important;
}

.accordion .ttl span {
  font-family: Arial;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  text-align: center;
  color: #7A8A93;
  width: 13px;
}

.accordion .ttl a {
  font-family: 'NotoSansJP';
  font-weight: 500;
  font-size: 16px;
  line-height: 150%;
  color: #272B30;
  width: calc(100% - 13px - 24px);
  pointer-events: none;
}

.accordion .content {
  width: 100%;
  padding: 0px 28px 27px 32px;
  display: grid;
  grid-template-columns: 13px 1fr;
  gap: 0 24px;
  align-items: flex-start;
}

.accordion .content .answer {
  font-family: Arial;
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  text-align: center;
  color: #0095D8;
  width: 13px;
  grid-column: 1;
}

.accordion .content > *:not(.answer) {
  grid-column: 2;
}

.accordion .content p {
  font-family: Arial;
  font-weight: 400;
  font-size: 12px;
  line-height: 150%;
  color: #272B30;
  width: auto;
  padding-top: 2px;
  margin: 0 0 8px;
}

.accordion .content p a {
  color: #0095D8;
}

.accordion .content p a:hover {
  color: #0072A6;
  text-decoration: underline;
}

.accordion .content ul {
  list-style: disc;
  margin-bottom: 8px;
  padding-left: 20px;
  font-family: Arial;
  font-size: 12px;
  line-height: 150%;
  color: #272B30;
}

.accordion .content ul:last-of-type {
  margin-bottom: 0;
}

.accordion-list details .ttl,
.accordion-list details[open] .ttl {
  background-position: right 32px top 25px;
  background-repeat: no-repeat;
}

.accordion-list details .ttl {
  background-image: url(../img/a-down.svg);
}

.accordion-list details[open] .ttl {
  background-image: url(../img/a-up.svg);
}

.accordion-list details .ttl:hover {
  background-image: url(../img/h-down.svg);
  background-repeat: no-repeat;
}

.accordion-list details[open] .ttl:hover {
  background-image: url(../img/h-up.svg);
  background-repeat: no-repeat;
}

@media screen and (max-width: 767px) {
  .accordion .ttl {
    padding: 16px 44px 16px 16px !important;
    gap: 8px;
  }

  .accordion-list details[open] .ttl {
    padding-bottom: 8px !important;
  }

  .accordion .ttl a {
    width: calc(100% - 13px - 8px);
  }

  .accordion-list details .ttl,
  .accordion-list details[open] .ttl {
    background-position: right 16px top 19px;
    background-repeat: no-repeat;
  }

  .accordion .content {
    padding: 0px 16px 16px 16px;
    gap: 0 8px;
  }
}

/* 新規登録CTA */
#block-hiprotechhotomucveria {
  padding-top: 80px;
  padding-bottom: 80px;
}

@media screen and (max-width: 991px) {
  #block-hiprotechhotomucveria {
    padding-bottom: 64px;
  }
}

@media screen and (max-width: 767px) {
  #block-hiprotechhotomucveria {
    padding-top: 64px;
  }
}

.cvareablock {
  text-align: center;
}

.cvareablock .undercvtext {
  font-family: Arial;
  font-size: 20px;
  font-weight: 400;
  color: #FB8D00;
  line-height: 150%;
  margin-bottom: 17px;
}

.cvareablock .btn.btn-cv {
  display: inline-block;
  font-size: 32px;
  color: #fff;
  height: 96px;
  line-height: 80px;
  font-weight: 700;
  background: #FB8D00;
  border-radius: 0px;
  text-align: center;
}

.cvareablock .btn.btn-cv:hover,
.cvareablock .btn.btn-cv:active {
  background: #DE7D00 !important;
  color: #fff;
  text-decoration: none;
}

@media screen and (min-width: 991.5px) {
  .cvareablock .undercvtext {
    margin-bottom: 16px;
  }

  .cvareablock .btn.btn-cv {
    line-height: 88px;
  }
}

@media only screen and (min-width: 768px) {
  .pcN {
    display: none;
  }
}