@charset "UTF-8";
@import url("./page_specific.css");

strong {
  font-weight: 700;
}

.max-w-900 {
  max-width: 900px;
}
.max-w-850 {
  max-width: 850px;
}
.max-w-800 {
  max-width: 800px;
}
.max-w-750 {
  max-width: 750px;
}
.max-w-700 {
  max-width: 700px;
}
.max-w-650 {
  max-width: 650px;
}
.max-w-600 {
  max-width: 600px;
}


.fs-150p {
  font-size: 150%;
}
.fs-110p {
  font-size: 110%;
}
.fs-105p {
  font-size: 105%;
}
.fs-90p {
  font-size: 90%;
}
.fs-85p {
  font-size: 85%;
}
.fs-80p {
  font-size: 80%;
}
.fs-75p {
  font-size: 75%;
}
.fs-70p {
  font-size: 70%;
}

.checked-list li {
  position: relative;
  padding-left: 1.6em;
}
.checked-list li + li {
  margin-top: .4em;
}
.checked-list li::before {
  content: "";
  display: inline-block;
  width:1em;
  aspect-ratio: 1;
  vertical-align: middle;
  margin-inline: -1.6em .6em;
  background: url("/assets/images/common/icon_check.svg") no-repeat center/contain;
  color: #0d479e;
  font-weight: bold;
}

.lineMarked {
  background: linear-gradient(to bottom, transparent 60%, #ffff0080 60%);
}

.u-inheritedColor {
  color: inherit;
}

.dot-list>li span {
    font-size: .9rem;
}

.tags .tag > a {color:inherit;}


.cols--hasSeparatorArrows {
  gap: 50px;
}
.cols--hasSeparatorArrows > .col {
  position: relative;
}
.cols--hasSeparatorArrows > .col:not(:last-child)::after {
  content: "";
  display: block;
  position: absolute;
  translate: -50% -50%;
  background-color:#0d479e;
}

@media (min-width: 768px) {
  .table-b :where(tr + tr > *) {
    border-top: 1px solid #0001;
  }
  .pc-cols--l4r1 {
    display: grid;
    grid-template-columns: 4fr 1fr;
  }
  .pc-cols--l3r1 {
    display: grid;
    grid-template-columns: 3fr 1fr;
  }
  .pc-cols--l2r1 {
    display: grid;
    grid-template-columns: 2fr 1fr;
  }
  .pc-cols--l5r3 {
    display: grid;
    grid-template-columns: 5fr 3fr;
  }
  .pc-cols--l3r2 {
    display: grid;
    grid-template-columns: 3fr 2fr;
  }

  .cols--hasSeparatorArrows > .col:not(:last-child)::after {
    width: 20px;
    aspect-ratio: 1/2;
    top: 50%;
    left: calc(100% + 25px);
    clip-path: polygon(0 0, 100% 50%, 0 100%);
  }

}

@media (max-width: 767.98px) {
  .sp-text-center {
    text-align: center;
  }

  .cols--hasSeparatorArrows > .col:not(:last-child)::after {
    height: 20px;
    aspect-ratio: 2/1;
    top: calc(100% + 25px);
    left: 50%;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
  }
}

@media(min-width: 768px) {
  .content-section__list--fullWidth {
    grid-template-columns: repeat(auto-fill, minmax(270px,1fr));
    overflow: hidden;
  }

  .content-section__list--fullWidth .content-section__item:not(:last-child):after {
    content:"";
    display: block;
    position: absolute;
    top: 0;
    right: -30px;
    width: 1px;
    height: 100%;
    background-color: #ccc
  }

  .content-section__list--fullWidth:has(.case-card) {
    gap: 40px 30px;
  } 
}

.event-label--online {
  border: 1px currentColor solid;
  background-color: #fff;
  color: #186DED;
}

a .content-section__label,
a:hover .content-section__title {
  text-decoration: none!important;
}

.news-item__tag {
  background-color: #856FAA;
  font-size: .8em;
}
.news-item__tag.-solution {
  background-color: #DFAD30;
}
.news-item__tag.-sustainability {
  background-color: #2E9200;
}
.news-item__tag.-company {
  background-color: #206BB7;
}

@media (min-width: 768px) {
  .news-item__tag {
    width:9em;
  }
}


/* 関連情報等の画像つきカード 画像の縦横比を一律化 */

:is(.keywords__image, .content-section__list .content-section__image) img  {
  width:100%; 
  aspect-ratio:4/3; 
  object-fit:cover; 
  border-radius:4.2666666667vw; 
  background:#EEF3F6;
}
:is(.content-section__list .content-section__image--short) img {
  aspect-ratio:15/7; 
  object-fit:contain;
}
:is(.of--contain img, img.of--contain) {
  object-fit:contain;
}
.content-section__list .content-section__image {width: 100%;}
@media (min-width: 768px) {
  :is(.keywords__image, .content-section__list .content-section__image) img {border-radius:min(16px, .8888888889vw);}
}

/* 関連情報 長すぎるダイジェストをカットして表示 */
.content-section__info .content-section__text {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 汎用カード（角丸ボーダーとパディング） */

.c-imgLabelBtnCard__item {
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 6.6666666667vw;
  border-radius: 2.1333333333vw;
  text-align: center;
}
.c-imgLabelBtnCard__item > a {display:contents;}
.c-imgLabelBtnCard__label {
  display: grid;
  place-content: center;
  line-height: 1.5;
}

@media (min-width: 768px) {
  .c-imgLabelBtnCard__item {
    grid-row: span 3;
    display: grid;
    grid-template-rows: subgrid;
    gap: .6em;
    padding: 25px;
    border-radius: 16px;
  }
}

/* 画像＋説明の縦積みリスト */

.c-imgDescList__item + .c-imgDescList__item {
  margin-top: 3em;
  padding-top: 3em;
  border-top: 1px solid #0002;
}
.c-imgDescList__img img {
  max-width: 100%;
  max-height: min(100%, 90vw);
}

@media (min-width:768px){
  .c-imgDescList__item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 4%;
    container-type: inline-size;
  }
  .c-imgDescList__img {
    width: 25cqw;
    aspect-ratio: 1;
    text-align: center;
  } 
}



.solution-card__desc {
  line-height: 1.6;
  font-size: 93%;
}

.page-head {
  max-height: none;
}

@media (min-width:768px){
  .header__main-logo {
    width: min(123px,8.2777777778vw);
    height: min(54px,2.8888888889vw);
  }
}

.btn-new {
  background: #ff9800;
  border-radius: 0.2em;
  color: #fff;
  font-size: 0.85rem;
  padding: 0.2em 0.5em;
  margin-right: 8px;
  display: inline-block;
  vertical-align: middle;
}

.lv4-heading a {
  display: inine-flex;
  align-items: center;
}

.lv4-heading a::after {
  content: '';
  display: inline-block;
  box-sizing: border-box;
  width: 0.6rem;
  height: 0.6rem;
  vertical-align: middle;
  margin-left: 5px;
  border-style: solid;
  border-width: 2px 2px 0 0;
  border-color: currentColor;
  transform: rotate(45deg);
}

.box .feature-card {
  background: #fff;
}

@media (min-width: 769px){
  
  a img {
    transition: .3s opacity ease-in;
  }
  
  a:hover img {
    opacity: .7;
  }
  
}

.text-link--arrow-icon {
  display: inline-block;
}

a.u-inheritedTextStyle {
  font: inherit;
  color: inherit;
  text-decoration: none;
}
a.u-inheritedTextStyle:hover {
  text-decoration: underline;
}

.related-solution__slide > a {
  all: inherit;
  cursor: pointer;
  flex-grow: 1;
  margin: 0;
}

.swiper-slide {
  height: auto;
}


/* .c-cmsOptimized
    配下要素に対し、クラス無しでスタイル自動適用させる
*/

.c-cmsOptimized :where(* ~ p, * ~ ul, * ~ ol, * ~ table, * ~ dl) {
  margin-block: 1rem;
}
.c-cmsOptimized *:first-child {
  margin-top: 0;
}
.c-cmsOptimized *:last-child {
  margin-bottom: 0;
}
.c-cmsOptimized table {
  width: 100%;
  border-collapse: collapse;
}
.c-cmsOptimized table tr > * {
  border: 1px solid #0002;
  padding: .6rem 1rem;
  line-height: 1.5;
  vertical-align: middle;
}
.c-cmsOptimized th {
  background-color: #89ABC622;
}
.c-cmsOptimized :where(thead, .thead) th {
  background-color: #89ABC655;
}

/* 
11/10 開発中の暫定措置として、汎用な追加スタイルとページ固有のものを別ファイルとしました。
ソリューションページ等で固有のスタイルはpage_specific.cssに記載してください。

*/

/* 翻訳プルダウン */
#msta_langArea select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  outline: none;
  background: transparent url('/assets/images/common/icon-en.svg') no-repeat left 0px center/16px auto;
  box-shadow: none;
  padding-left: 22px;
  cursor: pointer;
		}
select::-ms-expand {
  display: none;
}

/* メールフォーム */
.form_content .required{
	color: red;
}

#wp .media__body h3 {
    color: #0d479e;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 1.3333333333em;
    font-size:7.4666666667vw
}

@media (min-width: 768px) {
    #wp .media__body h3 {
        font-size:1.875rem
    }
}

@media (min-width: 1000px) {
    #wp .media__body h3 {
        font-size:1.875rem
    }
}

@media (min-width: 768px) {
    #wp .media__body h3 {
        line-height:1.6
    }
}

.module-sub-solution-body-section {
  h3 {
    text-align: center;
    color: #0d479e;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 1.3333333333em;
    font-size: 7.4666666667vw;
  }
  @media (min-width: 768px) {
    h3 {
      font-size: 1.875rem;
      line-height: 1.6;
    }
  }
  p {
    line-height: 1.8;
    margin: 1em 0;
  }
  h4 {
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 1em;
    font-size: 4.8vw;
    border-bottom: 1px solid #ccc;
    padding-bottom: 10px;
  }
  @media (min-width: 768px) {
    h4 {
      font-size: 1.25rem;
    }
}
}
/* column 
.is-column {
  .case-card {
    position: relative;
  }
  .case-card__logo--column {
    order: 0;
  }
  .case-card__title--column {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 12px;
    margin-top: 0;
  }
  .case-card__description {
    order: 1;
    display: -webkit-box;             
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2; 
  }
  .content-section__time {
    order: 2;
  }
  .case-card__tag {
    order: 3;
  }
  .case-card__header--column {
    overflow: hidden;
  }
  @media (min-width: 768px) {
    .case-card__header--column {
      min-height: 0;
    }
  }
}*/