@charset "utf-8";
/*==============================================
    
  BUSINESS

==============================================*/
/* 扉ページ
=========================================== */
.business .sub-main_inner {
  padding-bottom: 0;
}
.business .lead {
  line-height: 2;
}
.business .ers__business__field {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 2em auto 0;
  position: relative;
}
.business .ers__business__field h2 {
  font-family: var(--font-en);
  color: var(--mainColor);
  font-size: 2.5rem;
  font-weight: 700;
}
.business .ers__business__field .color__red {
  font-family: var(--font-en);
  color: var(--mainColor);
  font-weight: 600;
  font-size: 1.25rem;
}
.business .ers__business__field .risk__label {
  margin-top: 1.75rem;
  margin-bottom: 1.5rem;
  position: relative;
}
.business .ers__business__field .risk__label p {
  width: 50%;
  position: relative;
  background-color: var(--btnColor2);
  color: #fff;
  padding: 0.5em 1em;
}
.business .ers__business__field .risk__label p::after {
  content: '';
  display: inline-block;
  height: 100%;
  position: absolute;
  background-repeat: no-repeat;
  background-size: cover;
  top: 0;
}
.business .ers__business__field h3 {
  color: var(--mainColor);
  margin-bottom: 1rem;
  border-bottom: var(--border);
  padding-bottom: 0.5rem;
  position: relative;
}
.business .ers__business__field h3::before {
  content: '';
  display: block;
  width: 2em;;
  height: 5px;
  background: var(--mainColor);
  position: absolute;
  bottom: -2px;
  cursor: pointer;
}
.business .ers__business__field p.field__item__text {
  font-size: .875rem;
  margin-bottom: 2rem;
}
/*左*/
.business .ers__business__field .field__item__left {
  position: relative;
  z-index: 2;
}
.business .ers__business__field .field__item__left h3::before {
  left: 0;
}
.business .ers__business__field .field__item__left .risk__label p::after {
  background-image: url("../images/business/business_arrow_l.png");
  background-position: left center;
}
/*右*/
.business .ers__business__field .field__item__right {
  position: relative;
  z-index: 2;
}
/*中央*/
.business .ers__business__field .field__item__chart {
  margin: 0 auto;
  display: block;
  width: 100%;
  text-align: center;
}
.business .ers__business__field .field__item__chart img {
  width: 60%;
  vertical-align: bottom;
}
/*各リンク*/
.business .biz__links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.business .biz__links a{
  display: block;
}
.business .biz__links a img{
  vertical-align: bottom;
}
@media (min-width:1080px){ 
  .business .ers__business__field .field__item__chart {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
  }
  .business .ers__business__field .field__item__chart img {
    max-width: 535px;
    
  }
}
@media (min-width:768px) { /* 768px以上全て */
  .business .ers__business__field .risk__label p::after {
    width: 40px;
  }
  /*左*/
  .business .ers__business__field .field__item__left .risk__label p::after {
    right: -39px;
  }
  /*右*/
  .business .ers__business__field .field__item__right {
    text-align: right;
  }
  .business .ers__business__field .field__item__right .right__label {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .business .ers__business__field .field__item__right .risk__label p::after {
    left: -39px;
    background-image: url("../images/business/business_arrow_r.png");
    background-position: right center;
  }
  .business .ers__business__field .field__item__right h3::before {
    right: 0;
  }
  /*中央*/
  .business .ers__business__field .field__item__chart {
    margin-top: 5vw;
  }
  /*各リンク*/
  .business .biz__links {
    width: 96%;
    max-width: var(--width);
    margin: 0 auto;
    gap: 0 1em;
    position: relative;
    padding-bottom: 2em;
  }
  .business .biz__links .lineWrap {
    text-align: center;
    width: 100%;
  }
  .business .biz__links .lineWrap img{
    width: 56%;
    vertical-align: bottom;
  }
  .business .biz__links a{
    max-width: 250px;
    width: 18%;
    position: relative;
    transition: all 0.3s ease;
  }
  .business .biz__links a:hover{
    opacity: 0.7;
  }
}
@media screen and (max-width: 767px) { /* for SP */
  .business .ers__business__field h3::before {
    left: 0;
  }
  .business .ers__business__field .risk__label p {
    width: 85%;
    padding: 0.8em 1em;
    margin-bottom: 2em;
  }
  .business .ers__business__field .risk__label p::after {
    width: 11vw;
  }
  /*左*/
  .business .ers__business__field .field__item__left {
    order: 2;
  }
  .business .ers__business__field .field__item__left .risk__label p::after {
    right: -11vw;
  }
  /*右*/
  .business .ers__business__field .field__item__right {
    margin-top: 8vw;
    order: 3;
  }
  .business .ers__business__field .field__item__right .risk__label p::after {
    right: -11vw;
    background-image: url("../images/business/business_arrow_l.svg");
    background-position: left center;
  }
  /*中央*/
  .business .ers__business__field .field__item__chart {
    order: 1;
    margin-bottom: 10vw;
  }
  .business .ers__business__field .field__item__chart img {
    width: 100%;
  }
  .business .biz__links {
    background: var(--bg-gray);
    gap: 3vw;
    padding: 4vw;
    margin-top: 10vw;
  }
  .business .biz__links .lineWrap {
    display: none;
  }
  .business .biz__links a{
    width: calc((100% - 3vw) / 2);
  }
}


/* 下層 */
/* タイトル部分
=========================================== */
.bizPage-header {
  width: 100%;
  padding-top: 80px;
  padding-bottom: 190px;
  text-align: left;
  background: #000;
  color: #fff;
  position: relative;
}
.bizPage-header::after {
  content: '';
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  display: block;
  height: 100%;
  background-repeat: repeat;
}
.bizPage-header .inner {
  display: grid;
  grid-template-columns: 7.625rem 1fr;
  grid-template-rows: 30px auto 1fr;
  grid-template-areas:
    "icon pankuzu"
    "title title"
    "english english";
  gap: 12px 32px;
  max-width: var(--width);
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 1;
}
.bizPage-header .pageName-icon {
  grid-area: icon;
  display: block;
  align-self: center;
  padding: 6px 0.5em;
  text-align: center;
  font-size: 1.0625rem;
  font-family: var(--font-en);
  color: #FFF;
  background: #000;
  border-radius: 5px;
  line-height: 1;
}
.bizPage-header .breadLink {
  grid-area: pankuzu;
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: center;
  align-self: center;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  color: #fff;
}
.bizPage-header .breadLink a {
  color: #fff;
}
.bizPage-header .breadLink .slash {
  display: block;
  width: 7px;
  height: 11px;
  background: #ffff;
  margin-left: 8px;
  margin-right: 8px;
  clip-path: polygon(90% 0, 100% 0, 10% 100%, 0% 100%);
  position: relative;
  top: 1px;
}
.bizPage-header .breadLink .post {
  margin-bottom: 0;
}
.bizPage-header .breadLink [property="itemListElement"] span.post {
  color: #fff;
}
.bizPage-header h1 {
  font-weight: 400;
}
.bizPage-header .entry-title {
  grid-area: title;
  padding-top: 12px;
  font-size: 3.5rem;
  font-family: var(--font-zen);
  font-weight: 600;
  letter-spacing: 0.06em;
}
.bizPage-header .title-english {
  grid-area: english;
  margin-top: 0;
  font-family: var(--font-hanken);
  font-size: 1.125rem;
  text-transform: uppercase;
}
@media (min-width:768px) { /* 768px以上全て */
  .bizPage-header::after {
    width: 30%;
  }
}
@media screen and (min-width:768px) and (max-width:1499px) { /* for 幅狭PC＆TAB */
  .bizPage-header {
    grid-template-columns: 7.625rem 1fr auto;
    padding-left: 2vw;
    padding-right: 2vw;
  }
}
@media screen and (max-width: 767px) { /* for SP */
  .bizPage-header {
    padding: 7vw 5vw 12vw 5vw;
  }
  .bizPage-header .inner {
    grid-template-columns: 1fr 27vw;
    grid-template-rows: auto auto auto auto;
    grid-template-areas:
      "icon icon"
      "pankuzu pankuzu"
      "title title"
      "english english";
    gap: 2vw 5vw;
  }
  .bizPage-header::after {
    width: 30%;
    background-size: 90% auto;
  }
  .bizPage-header .pageName-icon {
    align-self: start;
    justify-self: start;
    font-size: 0.875rem;
    border-radius: 4px;
  }
  .bizPage-header .breadLink {
    letter-spacing: 0em;
  }
  .bizPage-header .breadLink .slash {
    width: 0.6em;
    height: 0.8em;
  }
  .bizPage-header .entry-title {
    padding-top: 2vw;
    font-size: 2rem;
    line-height: 1.2;
    letter-spacing: 0.03em;
  }
  .bizPage-header .title-english {
    font-size: 0.8125rem;
    align-self: start;
  }
}
/* タイトル部の下の画像
=========================================== */
.headImg {
  width: 96%;
  max-width: var(--width);
  margin-left: auto;
  margin-right: auto;
  border-radius: 10px;
  background: #f2f2f2;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  z-index: 1;
  aspect-ratio: 1 / 0.333;
}
@media (min-width:768px) { /* 768px以上全て */
  .headImg {
    margin-top: -80px;
  }
}
@media screen and (max-width: 767px) { /* for SP */
  .headImg {
    margin-top: -5vw;
  }
}
/* コンテンツレイアウト部分
=========================================== */
.bgGrayWrap {
  background: var(--bg-gray);
}
.biz_inner {
  width: 100%;
  max-width: var(--width);
  margin: 0 auto;
}
.biz_inner .nomalTexts {
  font-size: .875rem;
  line-height: 2;
}
.biz_inner .mgn{
  margin: 1.5rem 0;
}
.biz_inner .mgnbtm{
  margin-bottom: 1.5rem;
}
.biz_inner .circleList {
  font-size: .875rem;
}
.biz_inner .circleList li{
  line-height: 2;
}
.biz_inner .circleList li::before {
  top: 0.65rem;
}
.h-title {
  display: grid;
  grid-template-columns: 20px auto;
  grid-template-areas:
    "icon en"
    "title title";
  gap: 8px 5px;
  margin-bottom: 36px;
}
.h-title svg {
  grid-area: icon;
  align-self: center;
  width: 16px;
  height: 16px;
}
.h-title span[lnag="en"] {
  grid-area: en;
  display: block;
  align-self: center;
  font-size: 0.9375rem;
  font-family: var(--font-hanken);
  line-height: 1;
}
.h-title h2 {
  grid-area: title;
  font-family: var(--font-zen);
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.2;
}
.right-box {
  display: block;
  width: 100%;
}
@media (min-width:768px) { /* 768px以上全て */
  .biz_inner {
    width: 96%;
  }
  .biz_inner.item-flex {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0 1em;
  }
  .right-box {
    max-width: 1024px;
  }
}
@media (max-width: 767px) {
  .biz_inner {
    padding-left: 5vw;
    padding-right: 5vw;
  }
  .h-title {
    gap: 0.5em 1em;
    margin-bottom: 5vw;
  }
  .h-title svg {
    width: 1.5em;
    height: 1.5em;
  }
  .h-title h2 {
    font-size: 1.5rem;
    letter-spacing: 0.03em;
  }
}
/* 概要で主に使用
=========================================== */
#about .biz_inner .aboutNum {
  list-style: none;
  counter-reset: step;
  padding-left: 0;
  border-top: #D3D3D3 solid 1px;
}
#about .biz_inner .aboutNum li {
  border-bottom: #D3D3D3 solid 1px;
  counter-increment: step;
  position: relative;
  padding: 1.125rem 0 1.125em 2.625rem;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0.1em;
}
#about .biz_inner .aboutNum li::before {
  content: counter(step, decimal-leading-zero);
  position: absolute;
  left: 0;
  font-weight: 700;
  color: var(--mainColor);
  font-family: var(--font-hanken);
}
#about .biz_inner .aboutNote {
  margin: 2.5rem 0 1.5rem 0;
  font-size: .875rem;
  color: #333;
}
#about .biz_inner .targetTtl {
  margin: 4.125em 0 1.375em 0;
  font-weight: 600;
  letter-spacing: 0.1em;
}
#about .biz_inner .targetList {
  border-radius: 10px;
  background: var(--bg-gray);
  padding: 1.125rem 2.5rem;
  display: flex;
  flex-wrap: wrap;
}
#about .biz_inner .targetList li {
  position: relative;
  font-weight: 500;
  font-size: .875rem;
  padding-left: 1em;
  letter-spacing: 0.1em;
}
#about .biz_inner .targetList li::before {
  content: '';
  width: 0.5rem;
  height: 0.5rem;
  background: var(--mainColor);
  border-radius: 50px;
  position: absolute;
  left: 0;
  top: 0.5em;
}
#about .biz_inner .ind {
  padding-left: 1em;
}
@media (min-width:768px) { /* 768px以上全て */
  #about .biz_inner {
    width: 96%;
    padding: 7.5em 0;
  }
  #about .biz_inner .aboutNum {
    margin-top: 2.875rem;
  }
  #about .biz_inner .targetList {
    gap: 0.75em 3em;
  }
}
@media (max-width: 767px) {
  #about .biz_inner {
    padding-top: 12vw;
    padding-bottom: 16vw;
  }
  #about .biz_inner .targetList {
    flex-direction: column;
    gap: 0.5em;
  }
  #about .biz_inner .aboutNum {
    margin-top: 2em;
  }
}
/* ソリューションで主に使用
=========================================== */
#solution .mngEx {
  font-size: .875rem;
  line-height: 1.8;
  margin-bottom: 5rem;
}
#solution .nomalTitle.solmB {
  margin: 0.5rem 0 2.5rem 0;
}
#solution .nomalTitle.solmT {
  margin: 4rem 0 1rem 0;
}
#solution .caseWrap{
 background: #fff;
 border-radius: 10px;
}
#solution .caseWrap h3{
  padding: 1.5rem;
  font-size: 1.25rem;
  font-weight: 600;
  margin-bottom: 0;
}
#solution .caseList {
  display: flex;
  flex-wrap: wrap;
  border-top: var(--bg-gray) solid 1px;
}
#solution .caseList li {
  display: flex;
  flex-wrap: wrap;
  padding: 1.5em;
  gap: 0 1.25em;
  border-bottom: var(--bg-gray) solid 1px;
}
#solution .caseList li:nth-of-type(odd) {
  border-right: var(--bg-gray) solid 1px;
}
#solution .caseList li.bb0 {
  border-bottom: 0;
}
#solution .caseList li .texts {
  width: calc(100% - (80px + 1.25em));
}
#solution .caseList li h4 {
  font-weight: 500;
  font-family: var(--font-hanken);
  font-size: .75rem;
  margin-bottom: 0.3rem;
}
#solution .caseList li h4 span {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--mainColor);
  margin-left: 0.2rem;
}
#solution .caseList li p {
  font-size: .875rem;
}
#solution .caseList li p strong {
  font-size: 1.125rem;
  font-weight: 700;
}
#solution .caseList li .caseImg {
  width: 80px;
  align-self: flex-start;
}
#solution .worriesList {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  padding: 0 1.5rem;
  margin: 0 0 2rem 0;
}
#solution .worriesList li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0.5em;
  width: 7rem;
  height: 7rem;
  background: var(--btnColor2);
  color: #FFF;
  font-size: .875rem;
  font-weight: 600;
  border-radius: 10px;
}
@media (min-width:768px) { /* 768px以上全て */
  #solution {
    padding: 7.5em 0;
  }
  #solution .caseList li {
    width: 50%;
  }
  #solution .caseList li .caseImg {
    margin-top: 0.5rem;
  }
}
@media (max-width: 767px) {
  #solution {
    padding-top: 16vw;
    padding-bottom: 16vw;
  }
  #solution .nomalTitle.solmB {
    margin-bottom: 1rem;
  }
  #solution .caseList li {
    width: 100%;
  }
  #solution .worriesList {
    gap: 3vw;
  }
  #solution .worriesList li {
    width: calc((100% - 6vw) / 3);
  }
}
/* ソリューション内関連で主に使用
=========================================== */
#solution .serviceInArea + .serviceInArea {
  border-top: #ccc solid 1px;
}
#solution .serviceInArea.biz_inner:last-of-type {
  padding-bottom: 0;
}
#solution .serviceInArea h3 {
  font-size: 1.5625rem;
  font-weight: 600;
  margin-bottom: 2.375rem;
}
#solution .serviceInArea h3 span {
  display: inline-block;
  font-family: var(--font-hanken);
  font-size: 0.8125rem;
  font-weight: 400;
}
#solution .serviceInArea h3 span::before {
  content: '';
  display: inline-block;
  width: 7px;
  height: 11px;
  background: var(--fontColor);
  margin-left: 8px;
  margin-right: 8px;
  clip-path: polygon(90% 0, 100% 0, 10% 100%, 0% 100%);
  position: relative;
  top: 1px;
}
#solution .serviceInArea .wBox {
  background: #fff;
  border-radius: 10px;
  padding: 1.375rem 1.5rem 1.375rem 1.25rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
#solution .serviceInArea .wBox + .wBox {
  margin-top: 1rem;
}
#solution .serviceInArea .wBox .numImg svg {
  width: 3.375rem;
  height: 1.5625rem;
}
#solution .serviceInArea .wBox figure {
  margin: 0;
}
#solution .serviceInArea .wBox .images {
  object-fit: cover;
  border-radius: 8px;
  margin: 0;
}
#solution .serviceInArea .wBox .details {
  flex: 1;
}
#solution .serviceInArea .wBox .division {
  width: 100%;
  font-weight: 500;
  border-bottom: var(--border);
  padding-bottom: 0.625rem;
  margin-bottom: 1rem;
}
#solution .serviceInArea .wBox h4 {
  font-weight: 600;
  font-size: 1.4375rem;
}
#solution .serviceInArea .wBox .relationList {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  justify-content: flex-end;
  margin-top: 2.125rem;
}
#solution .serviceInArea .wBox .relationList li a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.875rem;
  font-size: .875rem;
  background-color: #000;
  color: #fff;
  border-radius: 50px;
  padding: 0.3rem 0.9375rem;
}
#solution .serviceInArea .wBox .relationList li a i {
  margin-left: auto;
}
#solution .serviceInArea .wBox .relationList li a i svg {
  display: block;
  width: 10px;
  height: 9px;
  fill: #fff;
}
#solution .imgBox {
  display: flex;
  flex-wrap: wrap;
}
#solution .imgBox .imgs{
  text-align: center;
}
@media (min-width:768px) { /* 768px以上全て */
  #solution .serviceInArea.biz_inner {
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
  }
  #solution .serviceInArea .wBox .numImg {
    margin-right: 1.375rem;
  }
  #solution .serviceInArea .wBox .images {
    width: 320px;
    height: 147px;
    margin-right: 3rem;
  }
  #solution .serviceInArea .wBox .relationList li a {
    min-width: 8.75rem;
  }
  #solution .imgBox {
    gap: 3em;
  }
  #solution .imgBox .texts{
    flex: 1;
  }
  #solution .imgBox .imgs{
    max-width: 280px;
  }
}
@media screen and (max-width: 767px) { /* for SP */
  #solution .serviceInArea.biz_inner {
    padding: 10vw 5vw;
  }
  #solution .serviceInArea h3 {
    margin-bottom: 1.5rem;
  }
  #solution .serviceInArea .wBox {
    flex-direction: column;
    align-items: flex-start;
  }
  #solution .serviceInArea .wBox figure {
    width: 100%;
    margin: 3vw 0;
  }
  #solution .serviceInArea .wBox .images {
    width: 100%;
    height: 9rem;
  }
  #solution .serviceInArea .wBox h4 {
    font-size: 1.25rem;
  }
  #solution .serviceInArea .wBox .relationList {
    gap: 0.5em 1em;
    justify-content: flex-start;
    margin-top: 1.5rem;
  }
  #solution .serviceInArea .wBox .relationList li {
    min-width: calc((100% - 1em)/2);
  }
  #solution .imgBox .imgs img{
    max-width: 80%;
  }
}
/* ラインナップで主に使用
=========================================== */
#lineup .relatedService--grid {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 7px;
  width: 100%;
}
#lineup .relatedService--parts {
  display: block;
  width: 100%;
  max-width: 199px;
  aspect-ratio: 1/1;
  background: var(--bg-gray);
  border-radius: 10px;
  position: relative;
}
#lineup .relatedService--parts .arrow {
  grid-area: arrow;
  align-self: center;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 20px;
  margin-bottom: 4px;
  color: #000;
  background: #FFF;
  border: var(--border);
  border-radius: 25px;
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 2;
}
#lineup .relatedService--parts .arrow svg {
  width: 10px;
  height: 9px;
}
#lineup .relatedService--grid .nothing {
  display: block;
  width: 100%;
  text-align: center;
  padding: 50px 2vw;
  font-size: 0.875rem;
  color: var(--fontColor-500);
}
#lineup .relatedService--grid img {
  vertical-align: bottom;
}
@media (min-width:768px) { /* 768px以上全て */
  #lineup {
    padding: 7.5rem 0 6.25em 0;
  }
  #lineup .relatedService--grid {
    margin-top: 5em;
  }
  #lineup .relatedService--parts {
    transition: opacity 0.3s ease;
  }
  #lineup .relatedService--parts:hover {
    opacity: 0.65;
    transition: opacity 0.3s ease;
  }
}
@media screen and (min-width:768px) and (max-width:1499px) { /* for 幅狭PC＆TAB */
  #lineup .relatedService--wrap {
    padding-left: 2vw;
    padding-right: 2vw;
  }
  #lineup .service--parts{
		width: calc((100% - 48px ) / 7);
	}
}
@media screen and (min-width:768px) and (max-width:1300px) { /* 特記サイズ */
  #lineup .relatedService--parts {
    width: calc((100% - 40px ) / 6);
  }
}
@media screen and (min-width:768px) and (max-width:1000px) { /* 特記サイズ */
  #lineup .relatedService--parts {
    width: calc((100% - 32px ) / 5);
  }
}
@media screen and (max-width: 767px) { /* for SP */
  #lineup {
    padding-top: 16vw;
    padding-bottom: 16vw;
  }
  #lineup .relatedService--wrap {
    padding-left: 5vw;
    padding-right: 5vw;
    margin: 16vw auto;
  }
  #lineup .relatedService--grid {
    gap: 2vw;
  }
  #lineup .relatedService--parts {
    max-width: calc((100% - 4.5vw) / 3);
  }
  #lineup .relatedService--parts .arrow {
    width: 5.5vw;
    height: 3.5vw;
		right: 0.8vw;
		bottom: 0.8vw;
  }
}



/* ブログ
=========================================== */
#postBlog--wrap{
	display: block;
	border-bottom: var(--bg-gray) 3px solid;
	padding-top: 120px;
	padding-bottom: 120px;
}
.postBlog--inner{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: flex-start;
	gap: 0 1em;
	width: 100%;
	max-width: var(--width);
	margin: 0 auto;
}
.postBlog--grid{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 15px;
	width: 100%;
	max-width: 1024px;
}
.postBlog--parts{
	display: grid;
	grid-template-columns: 120px auto auto 1fr 36px;
	grid-template-areas: 
		"thumb time cat blank arrow"
		"thumb txt txt txt arrow"
    "thumb read read read arrow";
  align-items: start;
	gap: 5px 30px;
	width: 100%;
	padding: 25px 40px;
	background: #FFF;
	border-radius: 10px;
	position: relative;
  border: var(--border);
}
.postBlog--parts time{
	grid-area: time;
	font-weight: 500;
	font-size: 0.8125rem;
	line-height: 1.8;
	letter-spacing: 0.08em;
	color: var(--fontColor-500);
}
.postBlog--parts .cat{
	grid-area: cat;
	width: 8em;
	padding: 0.45em 0.5em;
	line-height: 1;
	font-weight: 400;
	font-size: 0.75rem;
	border-radius: 3px;
	letter-spacing: 0.05em;
	text-align: center;
	background: var(--bg-gray2);
}
.postBlog--parts .txt{
	grid-area: txt;
	font-weight: 500;
	letter-spacing: 0.1em;
}
.postBlog--parts .arrow{
	grid-area: arrow;
	align-self: center;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 36px;
	height: 20px;
	margin-bottom: 4px;
	color: #FFF;
	background: var(--btnColor2);
	border-radius: 25px;
  fill: #fff;
}
.postBlog--parts .arrow svg{
	width: 10px;
	height: 9px;
}
.postBlog--parts .read{
  grid-area: read;
  font-size: .875rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.postBlog--parts .thumb{
  grid-area: thumb;
  grid-row: 1 / span 3; /* ← 3行分を占める */
  align-self: start;
}
.postBlog--parts .thumb img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.postBlog--grid .nothing{
	display: block;
	width: 100%;
	text-align: center;
	padding: 50px 2vw;
	font-size: 0.875rem;
	color: var(--fontColor-500);
}
.postBlog--footBtn{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-end;
	width: 100%;
	max-width: var(--width);
  margin-top: 2em;
}
.postBlog--footBtn a{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	background-color: var(--btnColor2);
	gap: 1em;
	width: 100%;
	max-width: 240px;
	padding: 20px 24px 20px 32px;
	border-radius: 50px;
	color: #FFF;
	font-size: 1rem;
	font-weight: 500;
	letter-spacing: 0;
	transition: all 0.3s ease;
}
.postBlog--footBtn a i{
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	width: 36px;
	height: 20px;
	padding-top: 1px;
	color: #000;
	background: #FFF;
	border-radius: 25px;
}
.postBlog--footBtn a svg{
	display: block;
	width: 10px;
	height: 9px;
	fill: currentColor;
}
@media (min-width:768px){ /* 768px以上全て */
	.postBlog--parts{
		transition: background-color 0.3s ease;
	}
	.postBlog--parts .txt{
		transition: color 0.3s ease;
	}
	.postBlog--parts:hover .txt{
		color: var(--mainColor);
		transition: color 0.3s ease;
	}
	.postBlog--parts:hover .arrow{
		background-color: var(--btnColor-crr);
		transition: background-color 0.3s ease;
  }
  .postBlog--footBtn a:hover{
		background-color: var(--btnColor2-crr);
		transition: all 0.3s ease;
	}
}
@media screen and (min-width:768px) and (max-width:1499px) {
/* for 幅狭PC＆TAB */
	#postBlog--wrap{
		padding-left: 2vw;
		padding-right: 2vw;
	}
	.postBlog--grid{
		width: calc(100% - 220px);
	}
}
@media screen and (max-width: 767px) { /* for SP */
	#postBlog--wrap{
		padding: 16vw 5vw;
	}
	.postBlog--grid{
		gap: 2vw;
	}
  .postBlog--parts{
      grid-template-columns: 20vw auto auto 1fr 36px;
			grid-template-areas:
				"thumb time cat blank arrow" 
				"thumb txt txt txt txt blank"
        "thumb read read read read blank";
			gap: 1vw 3vw;
			padding: 4vw;
	}
	.postBlog--parts .cat{
			width: 9em;
			padding: 0.35em 0.5em;
	}
	.postBlog--parts .txt{
		letter-spacing: 0.05em;
	}
	.postBlog--grid .nothing{
		padding: 50px 2vw;
	}
	.postBlog--footBtn{
		margin-top: 7vw;
	}
	.postBlog--footBtn a{
		max-width: 100%;
		padding: 5vw 8vw;
	}
}


/* ボタン
=========================================== */
.footBtn {
  display: flex;
  flex-flow: row wrap;
  justify-content: flex-end;
  width: 100%;
  max-width: var(--width);
  margin-top: 60px;
}
.footBtn a {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
  background-color: var(--btnColor2);
  gap: 1em;
  min-width: 240px;
  padding: 20px 24px 20px 32px;
  border-radius: 50px;
  color: #FFF;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0;
  transition: all 0.3s ease;
}
.footBtn span {
  display: inline-block;
  width: calc(100% - (36px + 1em));
}
.footBtn a i {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 20px;
  padding-top: 1px;
  color: #000;
  background: #FFF;
  border-radius: 25px;
}
.footBtn a svg {
  display: block;
  width: 10px;
  height: 9px;
  fill: currentColor;
}
@media (min-width:768px) { /* 768px以上全て */
  .footBtn a:hover {
    background-color: var(--btnColor2-crr);
    transition: all 0.3s ease;
  }
}
@media screen and (max-width: 767px) { /* for SP */
  .footBtn {
    margin-top: 8vw;
  }
  .footBtn a {
    max-width: 100%;
    padding: 5vw 5vw 5vw 6vw;
  }
}
/* RMのみの設定
=========================================== */
.page.rm .bizPage-header {
  background-image: var(--rm);
}
.page.rm .bizPage-header::after {
  background-image: url("../images/bg_rm_large.png");
}
.page.rm .headImg {
  background-image: url("../images/rm/headimg.jpg");
}
.page.rm #solution .serviceInArea .wBox .relationList li a {
  background-color: var(--rm-bg);
}
.page.rm #solution .worriesList li {
  background: var(--rm-icon);
}
@media (min-width:768px) { /* 768px以上全て */
  .page.rm #solution .serviceInArea .wBox .relationList li a:hover {
    background-color: var(--rm-bg-crr);
  }
}
/* DDのみの設定
=========================================== */
.page.dd .bizPage-header {
  background-image: var(--dd);
}
.page.dd .bizPage-header::after {
  background-image: url("../images/bg_dd_large.png");
}
.page.dd .headImg {
  background-image: url("../images/dd/headimg.jpg");
}
.page.dd #solution .serviceInArea .wBox .relationList li a {
  background-color: var(--dd-bg);
}
.page.dd #solution .worriesList li {
  background: var(--dd-icon);
}
@media (min-width:768px) { /* 768px以上全て */
  .page.dd #about .biz_inner .targetList li {
    width: calc(50% - 3em);
  }
  .page.dd #solution .serviceInArea .wBox .relationList li a:hover {
    background-color: var(--dd-bg-crr);
  }
}
/* SEのみの設定
=========================================== */
.page.se .bizPage-header {
  background-image: var(--se);
}
.page.se .bizPage-header::after {
  background-image: url("../images/bg_se_large.png");
}
.page.se .headImg {
  background-image: url("../images/se/headimg.jpg");
}
.page.se #solution .serviceInArea .wBox .relationList li a {
  background-color: var(--se-bg);
}
.page.se #solution .worriesList li {
  background: var(--se-icon);
}
@media (min-width:768px) { /* 768px以上全て */
  .page.se #solution .serviceInArea .wBox .relationList li a:hover {
    background-color: var(--se-bg-crr);
  }
}
/* EMのみの設定
=========================================== */
.page.em .bizPage-header {
  background-image: var(--em);
}
.page.em .bizPage-header::after {
  background-image: url("../images/bg_em_large.png");
}
.page.em .headImg {
  background-image: url("../images/em/headimg.jpg");
}
.page.em #solution .serviceInArea .wBox .relationList li a {
  background-color: var(--em-bg);
}
.page.em #solution .worriesList li {
  background: var(--em-icon);
}
@media (min-width:768px) { /* 768px以上全て */
  .page.em #solution .serviceInArea .wBox .relationList li a:hover {
    background-color: var(--em-bg-crr);
  }
}


/*==============================================
    
  変遷

==============================================*/
.risk_management .historyWrap{
  font-size: .875rem;
}
.risk_management .historyWrap .titles {
  display: flex;
  flex-wrap: wrap;
}
.risk_management .historyWrap .titles p {
  font-weight: 600;
  color: var(--mainColor);
}
.risk_management .historyWrap .timeline {
  position: relative;
}
.risk_management .historyWrap .timeline::before {
  content: '';
  position: absolute;
  top: 0;
  left: 13rem;
  background: var(--bg-gray);
  width: .3125rem;
  height: 100%;
}
.risk_management .historyWrap .timeline .timeline-item {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  padding-bottom: 2rem;
  margin-bottom: 2rem;
}
.risk_management .historyWrap .timeline .timeline-item::before {
  content: '';
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 2px;
  background-image: linear-gradient(90deg, #DDD 2px, transparent 0);
  background-size: 4px 2px;
  background-repeat: repeat-x;
  background-position: 0 100%;
}
.risk_management .historyWrap .timeline .timeline-item .year p{
  font-size: 1.375rem;
  font-weight: 700;
  color: #565252;
  line-height: 1.2;
}
.risk_management .historyWrap .timeline .timeline-item .year p span {
  font-family: var(--font-hanken);
  font-size: 2rem;
}
.risk_management .historyWrap .timeline .timeline-item .content .happen {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 0 1rem;
}
.risk_management .historyWrap .timeline .timeline-item .content .happen::before {
  content: '';
  display: block;
  background: var(--mainColor);
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 50px;
  position: absolute;
}
.risk_management .historyWrap .timeline .timeline-item .content .yt {
  display: inline-block;
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--mainColor);
}
.risk_management .historyWrap .timeline .timeline-item .content strong{
  font-size: 1rem;
  font-weight: 600;
  padding-top: 0.15rem;
}
.risk_management .historyWrap .timeline .timeline-item .content p {
  width: 100%;
}
.risk_management .historyWrap .timeline .timeline-item .content .happen + .happen{
  margin-top: 1rem;
}
.risk_management .historyWrap .timeline .timeline-item .content .arrowText{
  position: relative;
  margin: 1.5rem 0;
  padding-left: 2.5rem;
  color: #0e5a90;
  font-weight: 600;
  font-size: 1rem;
}
.risk_management .historyWrap .timeline .timeline-item .content .arrowText::before{
  content: '';
  display: block;
  width: 16px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: #b6cee0;
}
.risk_management .historyWrap .timeline .timeline-item .content .arrowText::after{
  content: '';
  font-size: 1.5rem;
  position: absolute;
  left: -9px;
  bottom: -10px;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 17px solid transparent;
  border-left: 17px solid transparent;
  border-top: 21px solid #b6cee0;
  border-bottom: 0;
}
.risk_management .historyWrap .timeline .timeline-item .content .arrowText.last-item::before {
  height: 200%;
}
.risk_management .historyWrap .timeline .timeline-item .content .arrowText.last-item::after{
  bottom: calc(-100% - 10px);
}
.risk_management .historyWrap .timeline .timeline-item .baloonBox {
  background: #000;
  color: #FFF;
  padding: 1rem 1.5rem;
  position: relative;
  font-weight: 600;
  margin-top: 2rem;
}
.risk_management .historyWrap .timeline .timeline-item .baloonBox p{
  padding: 0;
}
.risk_management .historyWrap .timeline .timeline-item .baloonBox::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  border-style: solid;
  border-width: 10px 20px 10px 0;
  border-color: transparent #000000 transparent transparent;
  translate: -100% -50%;
}
.risk_management .historyWrap .timeline .timeline-item .move p {
  position: relative;
  padding-left: 1.25rem;
}
.risk_management .historyWrap .timeline .timeline-item .move p::before {
  content: '';
  width: 0.25rem;
  height: 0.25rem;
  background: #000;
  border-radius: 50px;
  position: absolute;
  left: 0;
  top: 0.5rem;
}
.risk_management .historyWrap .timeline .timeline-item .move .arrow {
  color: #0e5a90;
  font-weight: 500;
  padding-left: 1.25rem;
  position: relative;
  margin-left: 1rem;
  margin-top: 0.2rem;
}
.risk_management .historyWrap .timeline .timeline-item .move .arrow::before {
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  background: url("../images/icon-right_arrow.svg") no-repeat center center;
  position: absolute;
  left: 0;
  top: 0.2rem;
}
.risk_management .historyWrap .timeline .timeline-item .move p + p:not(.arrow){
  margin-top: 1rem;
}
@media (min-width:768px){ /* 768px以上全て */
  .risk_management .historyWrap .titles {
    margin-bottom: 3rem;
  }
  .risk_management .historyWrap .titles p {
    font-size: 1.25rem;
  }
  .risk_management .historyWrap .titles p:first-of-type{
    width: 17rem;
  }
  .risk_management .historyWrap .titles p:nth-of-type(2){
    width: 35%;
  }
  .risk_management .historyWrap .titles p:last-of-type{
    flex: 1;
  }
  .risk_management .historyWrap .timeline .timeline-item .year {
    width: 13rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content {
    width: 35%;
    padding-left: 3rem;
    padding-right: 1.5rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content .happen::before {
    left: -3.2125rem;
    top: 0.6125rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content strong{
    width: calc(100% - 5em);
  }
  .risk_management .historyWrap .timeline .timeline-item .move{
    flex: 1;
  }
  .risk_management .historyWrap .timeline .timeline-item .baloonBox {
    display: inline-block;
  }
}
@media screen and (max-width: 767px) { /* for SP */
  .risk_management .historyWrap .titles{
    margin-bottom: 1.5rem;
  }
  .risk_management .historyWrap .titles p:nth-of-type(2)::before{
    content: '/';
    display: inline-block;
    margin: 0 0.5rem;
  }
  .risk_management .historyWrap .titles p:last-of-type{
    margin-left: 16%;
    padding-left: 1rem;
  }
  .risk_management .historyWrap .timeline::before {
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 1px;
  }
  .risk_management .historyWrap .timeline::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    background: var(--bg-gray);
    width: .3125rem;
    height: 100%;
    z-index: -1;
  }
  .risk_management .historyWrap .timeline .timeline-item .year {
    width: 100%;
    margin-bottom: 1rem;
    padding-left: 1.5rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .year p{
    font-size: 1.25rem;
  }
  .risk_management .historyWrap .timeline .timeline-item {
    justify-content: space-between;
  }
  .risk_management .historyWrap .timeline .timeline-item .year p span {
    font-family: var(--font-hanken);
    font-size: 1.75rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content {
    width: 46%;
  }
  .risk_management .historyWrap .timeline .timeline-item .content .happen {
    flex-direction: column;
    padding-left: 1.5rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content .happen::before {
    left: -0.2rem;
    top: 0.6125rem;
    z-index: 2;
  }
  .risk_management .historyWrap .timeline .timeline-item .content strong {
    font-size: .9375rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content .arrowText {
    line-height: 1.3;
    font-size: .9375rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content .arrowText::before {
    width: 0.8125rem;
    left: 1rem;
  }
  .risk_management .historyWrap .timeline .timeline-item .content .arrowText::after {
    left: 0.6rem;
    bottom: -0.625rem;
    border-right: 0.8125rem solid transparent;
    border-left: 0.8125rem solid transparent;
    border-top: 1.3125rem solid #b6cee0;
  }
  .risk_management .historyWrap .timeline .timeline-item .move {
    width: 46%;
  }
  .risk_management .historyWrap .timeline .timeline-item .move p {
    line-height: 1.3;
  }
}