@charset "UTF-8";

/* ===============================================
  FEED
=============================================== */
.media .contents-main {
  margin-top: var(--margin);
}
.media .contents-main > .inner {
  max-width: 1280px;
}
/* 投稿 */
.media .contents-main {
  position: relative;
  overflow-x: unset; /* sitcky用にオーバーフローリセット */
}

.media .nav-breadcrumbs {
  padding-bottom: var(--margin-xs);
}

.media .contents-main > .inner {
  padding-top: 0 !important;
}

@media (min-width: 769px) {
  .media .contents-main > .inner {
    padding-top: 0 !important;
  }
}


/* ===============================================
  basic
=============================================== */

.article-area .section-insert {
  margin-top: var(--margin);
}

:where(.article-area) :where(.article-content) a:not(.btn) {
  color: rgb(var(--color-link));
}

.article-area .tags {
  margin-top: 1.75em;
}

.release .article-area .section-header .date {
  margin-top: 1.75em;
  text-align: right;
  display: block;
}

/* widthが指定されるセレクタの最大サイズを制御 */
.article-content > div,
.article-content .wp-caption {
  width: auto !important;
  max-width: 100%;
}

.article-content > * + *,
.article-content > p + p,
.article-content .col > * + *,
.article-content p br + img,
.article-content p img + br,
.article-content form > * + *,
.article-content form .col > * + * {
  margin-top: var(--margin);
}

.article-content .btn {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.article-content .btn.type-primary {
  font-weight: 500;
}

.media .article-content .btn.type-primary {
  border-color: rgb(var(--color-textblack));
  background-color: rgb(var(--color-textblack));
}

.seminar .article-content .btn.type-primary,
.ondemand .article-content .btn.type-primary {
  min-width: 75%;
}

.article-content small,
.article-content .img-caption,
.article-content .wp-caption-text {
  margin-top: 1em;
  color: rgba(var(--color-textblack), .5);
  font-size: var(--font-caption);
  line-height: 1.48;
  display: block;
}

.article-content .img-caption,
.article-content .wp-caption-text {
  margin-top: 1em;
}

.article-content .kakomi {
  padding: 1.5em;
  border: 1px double var(--color-border);
}

.article-content .kakomi > * + * {
  margin-top: 1em;
}

.article-content img {
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.article-content hr {
  margin-top: var(--margin) !important;
  margin-bottom: var(--margin) !important;
  border-top-color: var(--color-border);
}

.article-content strong {
  padding: 0 .25em;
  font-weight: 500;
  background-color: rgba(var(--color-flamingred), .1);
  background-color: rgba(207,236,86,.35);
}

.article-content .bold {
  font-weight: 500;
}

.article-content pre {
  padding: 1.5em;
  background-color: rgba(var(--color-gray-light), .6);
  color: rgb(var(--color-gray-dark));
  border-radius: 3px;
}



/* ===============================================
  記事ヘッダー
=============================================== */
.contents-header picture img {
  width: 100%;
}

.article-area .section-header {
  padding: var(--margin);
  color: #fff;
  background-color: rgb(var(--color-bgblack));
}

.article-area .section-header .article-info {
  font-size: var(--font-xs);
  display: flex;
  justify-content: space-between;
  gap: .5em;
}

.article-area .section-header .article-info .date-old {
  opacity: .6;
}

.article-area .section-header .article-info time.type-update::after {
  content: 'RENEWAL';
  margin-left: .5em;
  padding: .2em .25em;
  color: rgb(var(--color-textblack));
  line-height: 1;
  letter-spacing: 0;
  background-color: #fff;
  display: inline-block;
  border-radius: 1px;
}

.article-area .section-header .heading {
  margin-top: .75em;
}

.article-area .section-header picture {
  margin-top: var(--margin);
  margin-left: calc(var(--margin) * -1);
  margin-right: calc(var(--margin) * -1);
  margin-bottom: calc(var(--margin) * -1) !important;
}
.article-area .section-header picture img {
  width: 100%;
}

.article-area .breadcrumbs {
  font-size: var(--font-xs);
}

.article-area .category-list a {
  color: #fff;
  border-bottom-color: #fff;
}

.article-area .tag-list {
  margin-top: var(--margin-xs);
}
.article-area .tag-list a {
  padding: 0;
  color: rgba(255, 255, 255, .6);
}
.article-area .tag-list a::before {
  color: rgba(255, 255, 255, .6);
}

@media (max-width: 768px) {
  .article-area .section-header {
    margin-left: calc(var(--margin) * -1);
    margin-right: calc(var(--margin) * -1);
  }
  .article-area .section-header .article-info {
    flex-direction: column-reverse;
  }
}


/* ===============================================
  記事内の見出し
=============================================== */
.article-content h2,
.article-content h3,
.article-content h4,
.article-content h5,
.article-content h6 {
  font-weight: 500;
}

.article-content .title-lead {
  font-size: var(--font-lead);
  font-weight: 500;
}
.article-content .title-lead + h1,
.article-content .title-lead + h2,
.article-content .title-lead + h3,
.article-content .title-lead + h4,
.article-content .title-lead + h5,
.article-content .title-lead + h6 {
  margin-top: 0;
}

.article-content h2 {
  padding: .8em 10px;
  font-size: var(--font-m);
  line-height: 1.43;
  border-top: 1px solid rgb(var(--color-textblack));
  border-bottom: 1px solid rgb(var(--color-textblack));
  position: relative;
}
.article-content * + h2 {
  margin-top: var(--margin-l);
}
.article-content h3 {
  padding: .6em 10px;
  font-size: 1.25em;
  line-height: 1.6;
  background-color: rgb(var(--color-gray-light));
}
.article-content * + h3 {
  margin-top: calc(var(--margin) * 1.5);
}
.article-content h4 {
  margin-top: var(--margin);
  padding-left: 10px;
  font-size: var(--font-lead);
  border-left: 5px solid rgb(var(--color-textblack));
}
.article-content h5 {
  font-size: 1rem;
}


/* ===============================================
  記事内のリスト
=============================================== */

.article-content ul,
.article-content ol {
  padding-left: 20px;
  font-weight: 400;
  border-left: 10px solid rgb(var(--color-gray-light));
}

.article-content ul.note,
.article-content ul.note ul,
.article-content ol.note,
.article-content ol.note ol {
  font-weight: 300;
}

.article-content ul ul {
  margin-top: 10px;
  border-left: none;
}

.article-content li {
  position: relative;
  padding-left: calc(.5em + 10px);
}

.article-content ul li:before {
  content: '';
  width: .5em;
  height: .5em;
  border-radius: 50%;
  background-color: rgb(var(--color-textblack));
  display: inline-block;
  position: absolute;
  top: .5em;
  left: 0;
}
.article-content ul ul li:before {
  content: '-';
  width: auto;
  height: auto;
  background-color: transparent;
  border-radius: none;
  top: 0;
}

.article-content li + li {
  margin-top: 10px;
}


.article-content ol {
  counter-reset: count; 
}
.article-content ol li:before {
  counter-increment: count;
  content: counter(count)'.';
  position: absolute;
  left: 0;
}

.article-content li ol {
  margin-top: var(--margin-xs);
  padding: 20px;
  border-left: none;
  background-color: rgb(var(--color-gray-light));
}

.terms .article-content li {
  font-weight: 100;
}


/* ===============================================
  記事内のテーブル
=============================================== */

.article-content table {
  position: relative;
}

.article-content th,
.article-content td {
  padding: var(--margin-s) 0 ;
  text-align: left;
}

.article-content * + th,
.article-content * + td {
  padding-left: var(--margin);
}

.article-content th {
  font-weight: 500;
}

.article-content tr > :first-child {
  /* width: 15em; */
}

@media (max-width: 768px) {
  .article-content:not(.hold) th,
  .article-content:not(.hold) td {
    padding: 0;
  }
  .article-content:not(.hold) * + th,
  .article-content:not(.hold) * + td {
    margin-top: var(--margin-s);
  }
}

.article-content table tbody,
.article-content table tr {
  position: relative;
}

.article-content table tbody:after,
.article-content table tr:after {
  content: '';
  width: 100%;
  position: absolute;
  left: 0;
}

.article-content table tbody:after {
  border-top: 1px solid var(--color-border);
}

.article-content table tr:after {
  border-bottom: 1px solid var(--color-border);
}

.article-content table thead tr:after  {
  display: none;
}

.article-content table tbody th,
.article-content table tbody td {
  vertical-align: top;
}


@media (max-width: 768px) {
  .article-content table:not(.hold) thead {
    display: none;
  }
  .article-content table:not(.hold) tr {
    padding-top: 1em;
    padding-bottom: 1em;
  }
  .article-content table tr:after {
    top: 0;
  }
}

@media (max-width: 768px) {
  * + .article-content table:not(.hold) {
    margin-top: 1em;
  }
  .article-content table:not(.hold) > tbody > tr,
  .article-content table > tbody > tr > [class^="hold-"] {
    -js-display: flex;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    -webkit-flex-direction:row;
    flex-flow: row wrap;
    justify-content: flex-start;
  }
}


/* ===============================================
  introduction
=============================================== */
.article-content .introduction {
  font-size: var(--font-s);
}
.article-content .introduction * + * {
  margin-top: 1em;
}


/* ===============================================
  記事内のサービスプラン
=============================================== */

.article-content .service {
  letter-spacing: 0;
}

.article-content .service > .col {
  padding: 1.5em;
  border: 1px solid var(--color-border);
}

.article-content .service > .col.pickup {
  border: 2px solid rgb(var(--color-primary)) !important;
  /*box-shadow: 0px 0px 10px 0px rgba(var(--color-primary-dark), .15);*/
}

.article-content .service > .col > * + * {
  margin-top: 1em;
}

.article-content .service h5 {
  margin-top: 0 !important;
  font-size: var(--font-m);
}

.article-content .service h5 small {
  font-size: var(--font-s);
  color: var(--color-primary-dark);
  display: inline;
}

.article-content .service .lead {
  font-size: 1em;
  color: rgb(var(--color-primary)) !important;
}

.article-content .service table tr,
.article-content .service table th,
.article-content .service table td {
  display: block;
}

.article-content .service table th {
  width: auto;
  padding: 0;
  font-size: var(--font-caption);
  color: var(--color-text-gray);
  font-weight: 400;
}

.article-content .service table td {
  padding: 0;
  text-align: right;
}

.article-content .service table tbody:after,
.article-content .service table tr:after {
  display: none;
}


/* ===============================================
  記事内のお問合せ
=============================================== */

.article-area .contact .col {
  padding: var(--margin);
  background-color: rgb(var(--color-primary-light));
}

.article-area .contact .col > * + * {
  margin-top: 1em;
}


/* ===============================================
  記事共有
=============================================== */
.article-share {
  margin-top: 0 !important;
  position: absolute;
  top: 0;
  left: calc( var(--margin) - 4px );
}

.article-share .heading {
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  line-height: 1;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.article-share .list {
  display: inline-block;
}
.article-share .list > li {
  display: block;
}
.article-share .list > li + li {
  margin-top: 2em;
}

.article-share .icon:before {
  height: 1.25rem;
  margin-left: auto;
  margin-right: auto;
  display: block;
}
.icon.type-facebook:before {
  content: url( 'data:image/svg+xml;utf-8,<svg fill="%23191919" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 32"><path d="M16.3,17.4l0.7-5.7h-5.6V8.1c0-1.6,0.5-2.7,2.8-2.7h3V0.2C16.7,0.1,15,0,12.9,0C8.6,0,5.6,2.6,5.6,7.5v4.2H0.7v5.7h4.8V32h5.8V17.4L16.3,17.4L16.3,17.4z"/></svg>' );
  width: calc(1.25rem  * .5625);
}
.icon.type-twitter:before {
  content: url( 'data:image/svg+xml;utf-8,<svg viewBox="0 0 1200 1227" xmlns="http://www.w3.org/2000/svg"><g><path d="M714.163 519.284L1160.89 0H1055.03L667.137 450.887L357.328 0H0L468.492 681.821L0 1226.37H105.866L515.491 750.218L842.672 1226.37H1200L714.137 519.284H714.163ZM569.165 687.828L521.697 619.934L144.011 79.6944H306.615L611.412 515.685L658.88 583.579L1055.08 1150.3H892.476L569.165 687.854V687.828Z" fill="%23000000"/></g></svg>' );
  width: calc(1.25rem  * 1);
}
.icon.type-hatena:before {
  content: url( 'data:image/svg+xml;utf-8,<svg fill="%23191919" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 38 32"><path d="M29.8,0.1h7.4v21.2h-7.4V0.1z M22.9,17.1c-1.2-1.3-3-2.2-5.2-2.4c2-0.5,3.5-1.3,4.3-2.4c0.9-1.1,1.3-2.4,1.3-4.3c0-1.5-0.3-2.7-0.9-3.8c-0.7-1.1-1.5-1.9-2.7-2.6c-1.1-0.5-2.3-0.9-3.6-1.2C14.6,0.1,12.1,0,8.6,0H0.2v31.5h8.9c3.6,0,6.2-0.1,7.8-0.4s3-0.7,4-1.2c1.3-0.7,2.3-1.7,3.1-3c0.7-1.3,1.1-2.8,1.1-4.4C24.8,20.4,24.2,18.6,22.9,17.1L22.9,17.1zM8.1,7.3H10c2.2,0,3.6,0.3,4.3,0.7c0.7,0.5,1.1,1.3,1.1,2.6c0,1.1-0.4,1.9-1.2,2.4c-0.8,0.4-2.3,0.7-4.3,0.7H8.1L8.1,7.3L8.1,7.3zM15.4,25.3c-0.8,0.5-2.3,0.8-4.3,0.8h-3v-6.9h3.1c2.2,0,3.5,0.3,4.3,0.8c0.8,0.5,1.2,1.5,1.2,2.8C16.7,23.9,16.3,24.7,15.4,25.3L15.4,25.3z M33.5,23.4c-2.3,0-4.3,1.9-4.3,4.3c0,2.3,1.9,4.3,4.3,4.3c2.3,0,4.3-1.9,4.3-4.3S35.8,23.4,33.5,23.4z"/></svg>' );
  width: calc(1.25rem  * 1);
}
.icon.type-line:before {
  content: url( 'data:image/svg+xml;utf-8,<svg fill="%23191919" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 34 32"><path d="M33.8,13.6C33.8,6.1,26.3,0,17,0S0.2,6.1,0.2,13.6c0,6.7,5.9,12.4,14,13.4c0.6,0.1,1.3,0.3,1.5,0.8c0.2,0.4,0.1,1.1,0,1.6c0,0-0.2,1.2-0.2,1.5c-0.1,0.4-0.3,1.7,1.5,0.9C18.7,31,26.5,26,30.1,22l0,0C32.6,19.3,33.8,16.7,33.8,13.6L33.8,13.6z M10.4,18.1H7.1c-0.4,0-0.9-0.4-0.9-0.9v-6.7c0-0.4,0.4-0.9,0.9-0.9c0.4,0,0.9,0.4,0.9,0.9v5.8h2.5c0.4,0,0.9,0.4,0.9,0.9C11.3,17.7,11,18.1,10.4,18.1z M13.9,17.2c0,0.4-0.4,0.9-0.9,0.9s-0.9-0.4-0.9-0.9v-6.7c0-0.4,0.4-0.9,0.9-0.9s0.9,0.4,0.9,0.9C13.9,10.5,13.9,17.2,13.9,17.2z M21.9,17.2c0,0.3-0.2,0.7-0.6,0.8c-0.1,0-0.2,0-0.3,0c-0.2,0-0.6-0.1-0.7-0.3L16.9,13v4.1c0,0.4-0.4,0.9-0.9,0.9s-0.9-0.4-0.9-0.9v-6.7c0-0.3,0.2-0.7,0.6-0.8c0.1,0,0.2,0,0.3,0c0.2,0,0.6,0.1,0.7,0.3l3.5,4.7v-4.1c0-0.4,0.4-0.9,0.9-0.9s0.9,0.4,0.9,0.9C21.9,10.5,21.9,17.2,21.9,17.2z M27.3,13c0.4,0,0.9,0.4,0.9,0.9s-0.4,0.9-0.9,0.9h-2.5v1.6h2.5c0.4,0,0.9,0.4,0.9,0.9s-0.4,0.9-0.9,0.9h-3.4c-0.4,0-0.9-0.4-0.9-0.9v-3.4l0,0l0,0v-3.4c0-0.4,0.4-0.9,0.9-0.9h3.4c0.4,0,0.9,0.4,0.9,0.9s-0.4,0.9-0.9,0.9h-2.5V13L27.3,13L27.3,13z"/></svg>' );
  width: calc(1.25rem  * 1.1);
}

@media (max-width: 1340px) {
  .article-share {
    margin-top: var(--margin) !important;
    position: relative;
    top: auto;
    left: auto;
  }
  .article-share .heading {
    -ms-writing-mode: unset;
    writing-mode: unset;
    left: auto;
    transform: none;
  }
  .article-share .list {
    display: flex;
    gap: var(--margin);
    align-items: center;
    justify-content: center;
  }
  .article-share .list > li {
    margin: 0 !important;
  }
}


/* ===============================================
  記事目次
=============================================== */

.section-block.article-index {
  margin-top: var(--margin);
  font-size: var(--font-xs);
}

.article-index .list {
  margin-top: 1em;
}
.article-index .list > li {
  font-weight: 500;
  border-bottom: 1px solid rgb(var(--color-border));
}
.article-index .list > li .children {
  padding-left: 1em;
}

.article-index .list a {
  padding: .25em 2em .25em 0;
  color: rgb(var(--color-textblack));
  line-height: 1.4;
  display: block;
  position: relative;
}

.article-index .list > li > a:after {
  content: url( 'data:image/svg+xml;utf-8,<svg fill="%23191919" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 6 12"><path d="M4.1,8.4V0.3C4.1,0.1,3.9,0,3.8,0c0,0,0,0,0,0H2.2C2.1,0,1.9,0.1,1.9,0.3c0,0,0,0,0,0v8.1H0.7c-0.4,0-0.6,0.3-0.6,0.6c0,0.2,0.1,0.3,0.2,0.5l2.3,2.3c0.3,0.3,0.7,0.3,0.9,0l2.3-2.3C6,9.3,6,8.8,5.8,8.6C5.6,8.5,5.5,8.4,5.3,8.4H4.1z"/></svg>' );
  width: .5em;
  line-height: 0;
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 1em;
  transform: translateY(-50%);
}

.article-index .list .h3 {
  margin-left: 1em;
}

.article-index:empty,
.article-index.none,
.article-index.h2 .list .h3 {
  display: none;
}


/* ===============================================
  記事まとめ
=============================================== */

.article-summary {
  margin-top: var(--margin-l) !important;
}

.article-summary_list {
  margin-top: var(--margin-s);
  font-weight: bolder;
  /*background-color:  rgb(var(--color-gray-light));*/
  counter-reset: count;
}

.article-summary_list > li {
  position: relative;
  width: 100%;
  padding-left: calc(1em + var(--margin-s));
}

.article-summary_list > li + li {
  margin-top: var(--margin-xs);
  padding-top: var(--margin-xs);
  border-top: 1px solid rgb(var(--color-border));
}

.article-summary_list > li:before {
  counter-increment: count;
  content: counter(count)'.';
  position: absolute;
  left: 0;
}


/* ===============================================
  ライター
=============================================== */

.article-author {
  margin-top: var(--margin-l) !important;
  /*padding-top: var(--margin-s);
  text-align: right;
  border-top: 1px solid rgb(var(--color-border));*/
}

.article-author a {
  padding: var(--margin) var(--margin-s) var(--margin-s);
  color: rgb(var(--color-textblack));
  border: 1px solid rgb(var(--color-border));
  font-weight: 300;
  display: flex;
  gap: var(--margin-s);
  align-items: center;
  position: relative;
}

.article-author a:before {
  content: 'この記事の著者';
  padding: .5em;
  line-height: 1;
  font-size: var(--font-s);
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
}

.article-author picture {
  width: 80px;
  height: 80px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: 50%;
  overflow: hidden;
  display: inline-block;
}

.article-author .author-info {
  flex: 1;
}

.article-author .description {
  margin-top: .5em;
  font-size: var(--font-xs);
}
@media (max-width: 768px) {
  .article-author a {
  padding-top: 2rem;
  }
}


/* ===============================================
  関連資料
=============================================== */

/*  目次下の関連資料
------------------------------------- */
.article-area .related-document-cta {
  display: grid;
  grid-template-columns: min(40%, 180px) 1fr;
  align-items: center;
  gap: .7em 1em;
  padding: var(--margin-xs) var(--margin-s) calc( var(--margin-s) * .75 );
  background-color: rgba( var(--color-flamingred), .03 );
  border: 1px solid rgb( var(--color-flamingred) );
}
.article-area .related-document-cta > .heading {
  grid-column: 1 / 3;
  padding-bottom: .1em;
  border-bottom: 1px solid rgba(var(--color-flamingred), .3);
}
.article-area .related-document-cta .item-figure figure {
  margin: 0 auto;
  max-width: 400px;
}
.article-area .related-document-cta .item-info {
  display: grid;
  gap: .5em;
}
.article-area .related-document-cta .item-btn {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: .5em .8em;
}

.article-area .related-document-cta * {
  margin: 0;
}
.article-area .related-document-cta .description {
  font-size: var(--font-s);
}

@media (max-width: 768px) {
  .article-area .related-document-cta {
    grid-template-columns: 1fr;
  }
  .article-area .related-document-cta > .heading {
    grid-column: auto;
  }
}

/*  目次下のお問合せ（関連資料の代わり）
------------------------------------- */
.article-area .contact-cta {
  display: flex;
  grid-template-columns: auto min( 11em, 100% );
  gap: var(--margin-xs);
  align-items: center;
  padding: var(--margin-xs) var(--margin-s);
  background-color: rgba( var(--color-flamingred), .03 );
  border: 1px solid rgb( var(--color-flamingred) );
}
.article-area .contact-cta .item-info {
  flex: auto 1 1;
}
.article-area .contact-cta .item-btn {
  flex: auto 0 0;
}

.article-area .contact-cta .item-info > * {
  margin-top: 0;
}
.article-area .contact-cta .description {
  font-size: var(--font-s);
}

@media (max-width: 768px) {
  .article-area .contact-cta {
    flex-direction: column;
  }
}

/* 記事下の関連資料フォーム
------------------------------------- */
.article-area .related-document-form {
  display: grid;
  grid-template-columns: 54% auto;
  gap: var(--margin-s);
  align-items: flex-start;
  padding: var(--margin-xs) var(--margin-s) var(--margin-s);
  background-color: rgb(var(--color-gray-light));
}
.article-area .related-document-form .heading {
  grid-column: 1 / 3;
  padding-top: .2em;
  padding-bottom: .5em;
  border-bottom: 1px solid rgba(var(--color-textblack), .3);
}
.article-area .related-document-form .item-info {
  grid-column: 1 / 2;
}
.article-area .related-document-form .item-info > * {
  margin-top: 0;
}
.article-area .related-document-form .item-info .description {
  margin-top: 1em;
  font-size: var(--font-s);
}
.article-area .related-document-form .item-form {
  grid-column: 2 / 3;
}
.article-area .related-document-form .item-note {
  text-align: center;
  grid-column: 1 / 3;
}

@media (max-width: 768px) {
  .article-area .related-document-form .item-info {
    grid-column: 1 / 3;
  }
  .article-area .related-document-form .item-form {
    grid-column: 1 / 3;
  }
  .article-area .related-document-form .item-note {
    text-align: left;
  }
}

/* 投稿本文内の関連資料
------------------------------------- */
.article-area a.related-document {
  display: flex;
  gap: var(--margin-s);
  align-items: center;
  position: relative;
  padding: var(--margin-s);
  border: 1px solid rgb(var(--color-border));
  background-color: transparent;
  color: rgb(var(--color-textblack));
}
.article-area .related-document figure {
  margin-bottom: 0;
  flex: 0 0 30%;
}
.article-area .related-document .description {
  margin-top: 1em;
  font-size: var(--font-s);
}
.article-area .related-document .action {
  position: absolute;
  font-size: var(--font-xs);
  bottom: var(--margin-xs);
  right: var(--margin-xs);
  opacity: .75;
}

@media (max-width: 768px) {
  .article-area .related-document {
    flex-direction: column;
  }
  .article-area .related-document .description {
    display: none;
  }
}


/* ===============================================
  セミナー／見逃し配信
=============================================== */

/*  記事ヘッダー
------------------------------------- */
.seminar .article-area .date,
.ondemand .article-area .date {
  margin-top: var(--margin-s);
}
.seminar .article-area .article-info,
.ondemand .article-area .article-info {
  display: flex;
  gap: var(--margin-s);
  justify-content: flex-start;
  align-items: center;
}
.seminar .article-area .article-info .tag-list,
.ondemand .article-area .article-info .tag-list {
  margin-top: 0;
}
.seminar .article-area .tag-list a,
.seminar .article-area .tag-list a::before,
.ondemand .article-area .tag-list a,
.ondemand .article-area .tag-list a::before {
  color: rgb(var(--color-textblack));
}

.seminar .article-area .date,
.ondemand .article-area .date {
  font-weight: 700;
  font-size: var(--font-lead);
  display: block;
}
.seminar .article-area .date .time,
.ondemand .article-area .date .time {
  padding-left: .5em;
  font-size: 1rem;
  color: #797979;
}

@media (max-width: 768px) {
  .seminar .article-area .section-header ,
  .ondemand .article-area .section-header {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .seminar .article-area .article-info ,
  .ondemand .article-area .article-info {
    margin-top: 0;
    flex-wrap: wrap;
  }
  .seminar .article-area .article-info .semina-status,
  .seminar .article-area .article-info .tag-list,
  .ondemand .article-area .article-info .semina-status,
  .ondemand .article-area .article-info .tag-list {
    width: 100%;
    flex: auto;
  }
}


/*  セミナーメニュー
------------------------------------- */
.seminar-index {
  padding: var(--margin);
  font-size: var(--font-xs);
  font-weight: 700;
  background-color: rgb(var(--color-gray-light));
}

.seminar-index > .list {
  counter-reset: count;
  padding: 0;
  border: none;
}
.seminar-index > .list > li::before {
  content: none;
}

.seminar-index .heading {
  padding: .5em 0;
  font-size: var(--font-s);
  display: block;
  position: relative;
}
.seminar-index .heading::before {
  counter-increment: count;
  content: counter(count)'. ';
}
.seminar-index .heading::after {
  content: '';
  border-bottom: 1px solid rgb(var(--color-border));
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

.seminar-index .list .children {
  margin-top: .5em;
  margin-left: 1.2em;
  padding: 0;
  border: none;
  font-weight: 300;
}
.seminar-index .list .children li {
  padding-left: 1em;
}
.seminar-index .list .children li:before {
  content: '-';
  position: absolute;
  top: 0;
  left: 0;
}


/* 登壇者
------------------------------------- */
.speakers {
  font-size: var(--font-s);
  align-items: flex-start;
}
[class*="split-diff"].gcol.speakers > .col {
  width: calc(70% - var(--margin));
}
[class*="split-diff"].gcol.speakers > :nth-child(2n-1) {
  width: 30% !important;
  max-width:234px;
}

.speakers picture {
  border-radius: 1em;
  overflow: hidden;
}
.speakers .heading {
  font-size: var(--font-lead);
}
.speakers .heading .ruby {
  font-size: var(--font-s);
  font-weight: 300;
  display: block;
}
.speakers .description  {
  margin-top: var(--margin-s);
}

@media (max-width: 768px) {
  [class*="split-diff"].gcol.speakers > :nth-child(2n-1) {
    width: 100% !important;
  }
}

/* 注意事項等
------------------------------------- */
.single .seminar .note {
  font-size:  var(--font-s);
}

/* セミナー詳細
------------------------------------- */
.table.seminar-detail th {
  width: 7.5em;
}

@media (max-width: 768px) {
  .table.seminar-detail th {
    width: 100%;
  }
}


/* ===============================================
  資料ダウンロード
=============================================== */
.deadline .alert {
  color: rgb(var(--color-flamingred));
}


/* ===============================================
  ショートコード：ブログカード
=============================================== */
.blogcard a {
  display: flex;
  align-items: center;
  border: 1px solid rgb(var(--color-border));
}
.blogcard div {
  margin: 0;
}
.blogcard div:empty {
  display: contents;
}
.blogcard .btn {
  position: static;
  transform: none;
}
.blogcard-thumb {
  flex: 0 0 min(240px, 30%);
}
.blogcard.document .blogcard-thumb {
  flex: 0 0 min(280px, 40%);
}
.blogcard.showcase .blogcard-thumb {
  flex-basis: min(200px, 20%);
}
.blogcard-thumb img {
  width: auto !important;
}
.blogcard-thumb .img-caption {
  display: none;
}
.blogcard-content {
  flex: 1 1 auto;
  padding: calc( var(--margin-s) / 2) var(--margin-s);
}
.blogcard-title {
  color: rgb(var(--color-textblack));
}
.blogcard-excerpt {
  color: rgb(var(--color-gray-dark));
  font-size: var(--font-s);
}
.blogcard-button {
  text-align: right;
}

@media (max-width: 768px) {
  .blogcard-title {
    font-size: var(--font-s);
  }
  .blogcard-excerpt {
    display: none;
  }
  .blogcard .blogcard-button {
    margin-top: .5em;
  }
}


/* ===============================================
  ショートコード：WEBLIFE eye
=============================================== */
.weblifeeye {
  padding: .75em 1.25em;
  border: 1px solid rgb(var(--color-flamingred));
}
.weblifeeye-title {
  display: inline-block;
  border-bottom: 2px solid rgb(var(--color-flamingred));
  color: rgb(var(--color-flamingred));
  font-size: var(--font-s);
  font-weight: 600;
}
.weblifeeye-title::before {
  content: url( 'data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 388.34"><path d="m244.29,5.88c-15.94,11.25-180.72,120.47-180.72,120.47H0v211.32h63.58l141.02,46.64c37.52,12.71,78.49-5.57,94.1-41.98l49.32-122.28h120.47c24.03,0,43.51-19.48,43.51-43.5,0-21.77-15.99-39.8-36.85-43l.04-.51h-217.83c-8.54,0-16.26-5.1-19.63-12.95-3.36-7.86-1.72-16.95,4.18-23.14,0,0,7.39-9.1,44.2-42.56,36.81-33.46-13.39-68.6-41.83-48.52Z" fill="%23ec6256"/></svg>' );
  display: inline-block;
  margin-right: 4px;
  width: 1.2em;
  line-height: 0;
}
.weblifeeye-content {
  margin-top: 8px;
}


/* ===============================================
  ショートコード：お問合せカード
=============================================== */
.contact-card a {
  display: flex;
  gap: var(--margin-xs);
  align-items: center;
  padding: var(--margin-s);
  background-color: rgba(var(--color-flamingred),.2);
  color: rgb(var(--color-textblack));
  line-height: 1.48;
}
.contact-card a .body {
  flex: 1 1 auto;
  font-weight: 400;
}
.contact-card a .action {
  flex: 0 0 auto;
}
@media (max-width: 768px) {
  .contact-card a {
    flex-direction: column;
  }
}


/* ===============================================
  表組テーブル
=============================================== */
.article-content .tag-table {
  width: 100%;
  position: relative;
  border-collapse: collapse;
}
.article-content .tag-table tr {
  position: relative;
  vertical-align: top;
}
.article-content .tag-table th,
.article-content .tag-table td {
  word-break: break-word;
  border: 1px solid rgb(var(--color-border));
  padding: .4rem ;
  vertical-align: top;
}

@media (max-width: 768px) {
  .article-content .table-wrap {
    overflow-x: scroll;
  }
  .article-content .tag-table {
    width: 100%;
    min-width: 840px;
  }
  .article-content .table-wrap .tag-table tr {
    display: table-row;
  }
}