.tit_txt01 {
    box-sizing: content-box;
}
p {
    margin-top: 0;
    margin-bottom: 0;
}
dl, ol, ul {
    margin-bottom: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}
body {
    font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","Lucida Grande","メイリオ",Meiryo,"ＭＳ Ｐゴシック",Verdana,Arial,sans-serif;
    font-size: 12px;
    -webkit-text-size-adjust: none;
    line-height: 2;
    color: #111;
}

.tit_txt02 {
    margin: 8% 0 5% 0 !important;
    background: none !important;
    background: rgb(229,57,53) !important;
    background: -moz-linear-gradient(0deg, rgba(229,57,53,1) 0%, rgba(229,57,53,1) 50%, rgba(244,67,54,1) 50%, rgba(244,67,54,1) 100%) !important;
    background: -webkit-linear-gradient(0deg, rgba(229,57,53,1) 0%, rgba(229,57,53,1) 50%, rgba(244,67,54,1) 50%, rgba(244,67,54,1) 100%) !important;
    background: linear-gradient(0deg, rgba(229,57,53,1) 0%, rgba(229,57,53,1) 50%, rgba(244,67,54,1) 50%, rgba(244,67,54,1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#e53935",endColorstr="#f44336",GradientType=1) !important;
    height: auto !important;
    line-height: 1.6em !important;
    font-size: 18px !important;
    padding: 15px !important;
    box-sizing: border-box !important;
    min-height: auto !important;
    border-radius: 6px;
    width: 100%;
}
@media (min-width: 576px) {
    .col-sm-12 {
        overflow: hidden;
    }
}
@media (min-width: 768px) {
    .col-md-12 {
        overflow: hidden;
    }
}
@media (min-width: 992px) {
    .col-lg-9 {
        overflow: hidden;
    }
}
@media (min-width: 992px) {
    .col-lg-9 {
        overflow: hidden;
    }
}

#breadcrumb li span:nth-child(n+5) {
    display: none;
}
#breadcrumb li span:last-child {
    display: contents;
}


.column.column-list .contents h1 {
  font-size: 1.25rem;
  color: #212529;
  line-height: 1.875rem;
  text-align: center;
  margin: 0 0 2rem;
  padding: 0;
}

.column h2.card-title {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1.4;
  padding-bottom: 0;
  text-align: left;
  margin: 0 0 0.75rem;
}

.column h3 {
  font-size: 1rem;
  line-height: 1.2;
  font-weight: 700;
  color: #212529;
}
.column h4 {
  font-size: 1rem;
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 500;
  line-height: 1.2;
  text-align: left;
}
.column.column-list .page-title {
  text-align: center;
  border-bottom: 1px solid #eee;
  background-image: url("../images/header/column.webp");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.column.education .page-title {
  text-align: center;
  background-image: url("../images/header/column-edu.webp");
  background-repeat: no-repeat;
  background-position: center 85%;
  background-size: cover;
}
.column.enterprise .page-title {
  text-align: center;
  background-image: url("../images/header/column-ent.webp");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.column.public .page-title{
  text-align: center;
  background-image: url(../images/header/column-pub.webp);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.column .contents ul, .column .contents ul li ul {
  margin-bottom: 0;
  padding-left: 1.5rem;
}
.contents ul li {
  padding-bottom: 0.5rem;
  list-style: disc;
}
.contents ol li {
  padding-bottom: 0.5rem;
  list-style: decimal;
}
.column .contents ul li:last-child, .column .contents ul li ul li:last-child {
  padding-bottom: 0;
}


/*--------------------
  コラム 
--------------------*/
body.column {
  background-color: #FFF;
}
.column .card-header {
  font-size: 0.8125rem;
  font-weight: 700;
}
.column.column-list .contents .card-body p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.column .card-footer .update {
  font-size: 0.8125rem;
}
.column .card .education, .column .card .private, .column .card .public {
  position: relative;
}
.column .card .education::before, .column .card .private::before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 0.25rem;
}
.column .card .public::before {
  display: inline-block;
  margin-right: 0.25rem;
}
.column .card .public::before{
  content: "";
  background-image: url(../images/common/icon-public.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  position: relative;
  width: 1rem;
  height: 1rem;
  bottom: -1px;
}
.column.public{
  text-align: left;
}
.column .card .education::before {
  content: "\f19d";
}
.column .card .private::before {
  content: "\f1ad";
}
.column .contents p:not(.lead) {
  line-height: 1.8rem;
}
.card-sm .card-body {
  font-size: 0.875rem;
}
.column .contents .side-bar p {
  line-height: 1.4rem;
}
.column .contents .side-bar .column-profile-body {
  font-size: 0.75rem;
  line-height: 1.125rem;
  color: #666;
  font-feature-settings: 'palt';
  margin-bottom: 0;
}
.text-public{
  color: #D44076 !important;
}

.side-bar > div {
  padding-left: 15px;
  padding-right: 15px;
}
.side-bar-title {
  font-weight: 700;
  padding-top: 0.5rem;
  margin-bottom: 0.5rem;
  color: #4bb5c5;
  border-top: 1px solid #4bb5c5;
  border-right: 1px solid #4bb5c5;
  position: relative;
}
.side-bar-title::before {
  content: "";
  background-image: url("/cms/asset/images/common/icon-column-thumb.svg");
  background-repeat: no-repeat;
  background-position: center center;
  margin-right: 0.25rem;
  display: inline-block;
  width: 1.125rem;
  height: 1rem;
  position: relative;
  top: 2px;
}
.column .contents .list-group-flush:last-child .list-group-item:last-child {
  border-bottom-left-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}
.column .contents .card-body p {
  display: inline-block;
  line-height: 1.7;
  margin-bottom: 0.5rem;
}
.column .contents p.note {
  line-height: 1.6;
}
.column .contents a:hover, .column .contents .card a:hover, .column .contents .border a:hover {
  text-decoration: none;
}
.column .contents li.list-unstyled, .column .contents .border p {
  font-size: 0.875rem;
  line-height: 1.7;
}
.column .contents ol.paren {
  margin-left: 1.5rem; /* サイトに合せて調整 */
}
.column .contents ol.paren li {
  list-style-type: none;
  counter-increment: cnt;
  position: relative;
}
.column .contents ol.paren li:before {
  content: "（"counter(cnt) "）";
  display: inline-block;
  margin-left: -2rem; /* サイトに合せて調整 */
  width: 1rem; /* サイトに合せて調整 */
  text-align: right;
  position: absolute;
  top: 0;
  left: 0;
}
.column .contents .border p.note {
  font-size: 0.75rem;
  margin-top: 0.375rem;
}


/* テーブルデザイン */
.column .contents .table-column {
  font-size: 0.875rem;
  margin-bottom: 0.75rem;
  width: 100%;
}
.column .contents .table-column th {
  background: #4bb5c5;
  color: #fff;
  border-bottom: 2px solid #fff;
  padding: 10px;
}
.column .contents .table-column td {
  background: #d0e5ea;
  vertical-align: baseline;
  word-break: break-all;
  border-top: 1px solid #fff;
  padding: 10px;
}
.column .contents .table-column tr:nth-of-type(odd) td {
  background: #e9f3f5;
}
.column .contents .table-column td p {
  line-height: 1.375rem;
}
.column .contents .table-column td p:last-child {
  margin-bottom: 0;
}
.column .contents .table-column td a {
  text-decoration: underline;
}


/*コラムダウンロードバナー*/
.column .contents .dl-banner .card-body {
  display: grid;
  grid-template-columns: 1fr 3fr;
  gap: 20px;
  background-color: #F7F7F8;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}
.column .contents .dl-banner .card-body .dl-thumb {
  grid-row: 1/3;
}
.column .contents .dl-banner .card-body .dl-btn {
  grid-column: 2/3;
  display: flex;
}
.column .contents .dl-banner .card-header {
  font-size: 1rem;
}
.column .contents .dl-banner h2.card-title {
  font-size: 2.25rem;
  font-weight: 700;
  color: #212529;
}
.column .contents .dl-banner .card-title {
  display: block;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.4;
  color: #212529;
  margin-bottom: 0.75rem;
}
.column .contents .dl-banner .card-body p.card-text {
  display: block;
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 0.25rem;
}


/*ダウンロードリスト*/
.download-list.contents .container {
  margin-bottom: 2rem;
}
.download-list.contents:not(:last-child) .container:after {
  content: "";
  display: block;
  width: 100%;
  height: 0;
  padding-top: 1.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, .1);
}
.download-list .row.no-gutters {
  height: 100%;
}
.card-lm, .card-extic {
  position: relative;
}
.download-list .card {
  border-radius: 0;
}
.download-list .doc-usefull .doc-thumb {
  border-right: 1px solid #28a745;
}
.download-list .doc-product .doc-thumb {
  border-right: 1px solid #0087c8;
}
.download-list .doc-column .doc-thumb {
  border-right: 1px solid #17a2b8;
}
.download-list .doc-thumb > img {
  height: 190px;
}
.download-list .card-body {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  padding: 1rem;
  margin-bottom: 0.5rem;
}
.download-list .card-body p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.card-lm .card-body, .card-extic .card-body {
  padding-top: 3.5rem;
}
.card-lm .card-body::before, .card-extic .card-body::before {
  content: "";
  height: 31px;
  width: 100%;
  display: block;
  background-repeat: no-repeat;
  background-position: top left;
  margin-bottom: 1rem;
  position: absolute;
  top: 1rem;
}
.card-lm .card-body::before {
  background-image: url("../images/common/SLogo-LM-h.svg");
  background-size: 150px auto;
}
.card-extic .card-body::before {
  background-image: url("../images/common/SLogo-EXTIC.svg");
  background-size: 100px auto;
}
.download-list .card-text {
  font-size: 0.875rem;
}
.doc-product .card {
  border-color: #0087c8;
}
.doc-column .card {
  border-color: #17a2b8;
}
.doc-usefull .card {
  border-color: #28a745;
}
.doc .thumb {
  max-height: 250px;
  overflow: hidden;
}
#inner-anchor li a::before {
  content: "\f063";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 0.25rem;
}
#inner-anchor li a:hover {
  text-decoration: none
}
/*トップページポップアップ：ニュースレター*/
#newsLetter {
  width: 90vw;
  max-width: 320px;
  padding: 15px 15px;
  height: 170px;
  background-color: #6CDAEA;
  background-image: url("../images/popup/newsLetter_bg.svg");
  background-repeat: no-repeat;
  background-position: 15px 20px;
  background-size: 110px auto;
  border: solid 1px #57B0BD;
  border-radius: 6px;
  align-items: center;
  box-shadow: 0px 0px 16px -6px rgba(0, 0, 0, 0.6);
}
#newsLetter h5 {
  padding-left: 120px;
  margin-bottom: 0.25rem;
}
#newsLetter p {
  font-size: 0.75rem;
  padding-left: 120px
}
/*-- バナー位置上書き ※必要ない場合はコメントアウト --*/
#__smz_content {
  bottom: 50px !important;
  right: 20px !important;
  z-index: 1029;
}
/*連携システム一覧*/
.system-list > .col {
  margin-bottom: 0.625rem;
}
/* 脚注 */
.footnote {
  background-color: #6D6D6D;
}
.footnote p, .footnote p > a {
  color: #ededed;
  font-size: 0.75rem;
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
  text-decoration: none;
}

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0; // See https://github.com/twbs/bootstrap/pull/22740#issuecomment-305868106
  height: $card-height;
  word-wrap: break-word;
  background-color: $card-bg;
  background-clip: border-box;
  border: $card-border-width solid $card-border-color;
  @include border-radius($card-border-radius);

  > hr {
    margin-right: 0;
    margin-left: 0;
  }

  > .list-group {
    border-top: inherit;
    border-bottom: inherit;

    &:first-child {
      border-top-width: 0;
      @include border-top-radius($card-inner-border-radius);
    }

    &:last-child  {
      border-bottom-width: 0;
      @include border-bottom-radius($card-inner-border-radius);
    }
  }

  // Due to specificity of the above selector (`.card > .list-group`), we must
  // use a child selector here to prevent double borders.
  > .card-header + .list-group,
  > .list-group + .card-footer {
    border-top: 0;
  }
}

.card-body {
  // Enable `flex-grow: 1` for decks and groups so that card blocks take up
  // as much space as possible, ensuring footers are aligned to the bottom.
  flex: 1 1 auto;
  // Workaround for the image size bug in IE
  // See: https://github.com/twbs/bootstrap/pull/28855
  min-height: 1px;
  padding: $card-spacer-x;
  color: $card-color;
}

.card-title {
  margin-bottom: $card-spacer-y;
}

.card-subtitle {
  margin-top: -$card-spacer-y * .5;
  margin-bottom: 0;
}

.card-text:last-child {
  margin-bottom: 0;
}

.card-link {
  @include hover() {
    text-decoration: none;
  }

  + .card-link {
    margin-left: $card-spacer-x;
  }
}


/// Grid system
//
// Generate semantic grid columns with these mixins.

@mixin make-container($gutter: $grid-gutter-width) {
  width: 100%;
  padding-right: $gutter * .5;
  padding-left: $gutter * .5;
  margin-right: auto;
  margin-left: auto;
}

@mixin make-row($gutter: $grid-gutter-width) {
  display: flex;
  flex-wrap: wrap;
  margin-right: -$gutter * .5;
  margin-left: -$gutter * .5;
}

// For each breakpoint, define the maximum width of the container in a media query
@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
  @each $breakpoint, $container-max-width in $max-widths {
    @include media-breakpoint-up($breakpoint, $breakpoints) {
      max-width: $container-max-width;
    }
  }
  @include deprecate("The `make-container-max-widths` mixin", "v4.5.2", "v5");
}

@mixin make-col-ready($gutter: $grid-gutter-width) {
  position: relative;
  // Prevent columns from becoming too narrow when at smaller grid tiers by
  // always setting `width: 100%;`. This works because we use `flex` values
  // later on to override this initial width.
  width: 100%;
  padding-right: $gutter * .5;
  padding-left: $gutter * .5;
}

@mixin make-col($size, $columns: $grid-columns) {
  flex: 0 0 percentage(divide($size, $columns));
  // Add a `max-width` to ensure content within each column does not blow out
  // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
  // do not appear to require this.
  max-width: percentage(divide($size, $columns));
}

@mixin make-col-auto() {
  flex: 0 0 auto;
  width: auto;
  max-width: 100%; // Reset earlier grid tiers
}

@mixin make-col-offset($size, $columns: $grid-columns) {
  $num: divide($size, $columns);
  margin-left: if($num == 0, 0, percentage($num));
}

// Row columns
//
// Specify on a parent element(e.g., .row) to force immediate children into NN
// numberof columns. Supports wrapping to new lines, but does not do a Masonry
// style grid.
@mixin row-cols($count) {
  > * {
    flex: 0 0 divide(100%, $count);
    max-width: divide(100%, $count);
  }
}

#breadcrumb ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0 4px;
}
#breadcrumb li {
    white-space: revert-layer;
}


.contents h1 {
    font-size: 2rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
    text-align: left;
    padding-bottom: 0;
}
.lead {
    font-size: 1.23rem;
 }

@media(max-width:991px) {
  .side-bar {
    display: flex;
    flex-wrap: wrap;
  }
  .side-bar > div {
    flex: 0 0 50%;
    max-width: 50%;
  }
}

@media(max-width:480px) {
  /*コラムダウンロードバナー*/
  .column .contents .dl-banner .card-body {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 15px;
    background-color: #F7F7F8;
  }
  .column .contents .dl-banner .card-body .dl-btn {
    grid-column: 1/3;
  }
  .column .contents .dl-banner .card-header {
    font-size: 0.8125rem;
  }
  .column .contents .dl-banner .card-title {
    font-size: 1.375rem
  }
  .column .contents .dl-banner h2.card-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
  }
  .column .contents .dl-banner .card-body p.card-text {
    font-size: 0.875rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
  }
  .d-xs-block {
    display: block !important;
  }
}

a.external-link::after {
    font-family: "Font Awesome 5 Free";
    padding-left: 0.25rem;
    content: '\f360';
    font-weight: 900;
}