.bg-gray {
  background-color: #eaeaea; }

.font-serif {
  font-family: 'Noto Serif JP', serif;
  font-weight: 500; }

.kv {
  aspect-ratio: 2600/980;
  overflow: hidden; }
  @media (max-width: 767px) {
    .kv {
      aspect-ratio: 414/550; } }
  .kv img, .kv video {
    object-fit: cover;
    object-position: center;
    max-width: initial;
    width: 100% !important;
    height: 100%; }

#contents h1 {
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
  font-size: 28px;
  letter-spacing: 0.4em;
  margin: 0 0 3em;
  padding-top: 210px; }
  @media (max-width: 767px) {
    #contents h1 {
      padding-top: 100px; } }
#contents .article-body {
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
  display: flex;
  gap: 0 80px; }
  @media (max-width: 767px) {
    #contents .article-body {
      flex-direction: column; } }
  #contents .article-body > div:nth-of-type(1) {
    flex-grow: 1; }
    @media (max-width: 767px) {
      #contents .article-body > div:nth-of-type(1) {
        order: 2;
        width: auto; } }
  #contents .article-body > div:nth-of-type(2) {
    width: 36.7%;
    flex-shrink: 0; }
    @media (max-width: 767px) {
      #contents .article-body > div:nth-of-type(2) {
        order: 1;
        width: auto; } }
  #contents .article-body h1, #contents .article-body h2, #contents .article-body h3, #contents .article-body h4, #contents .article-body h5 {
    font-weight: 500;
    padding: 0;
    margin: 2em 0 1em;
    letter-spacing: 0.4em; }
  #contents .article-body h2 {
    font-size: 24px; }
  #contents .article-body h3 {
    font-size: 20px; }
  #contents .article-body h4 {
    font-size: 16px; }
  #contents .article-body h5 {
    font-size: 12px; }
  #contents .article-body .content {
    margin-bottom: 3em; }
  #contents .article-body .artist-box {
    display: flex;
    align-items: flex-start;
    gap: 0 30px; }
    @media (max-width: 767px) {
      #contents .article-body .artist-box {
        flex-direction: column;
        gap: 20px 0; } }
    #contents .article-body .artist-box img {
      width: 56%; }
      @media (max-width: 767px) {
        #contents .article-body .artist-box img {
          width: 100%; } }
    #contents .article-body .artist-box .artist_text {
      border: 1px solid #000;
      padding: 10px 13px;
      font-size: 86%; }

.takumi_tb {
  width: 700px; }

@media (max-width: 767px) {
  .takumi_tb {
    width: 100%; }
    .takumi_tb td {
      width: 100%;
      display: block; }
    .takumi_tb td:first-child {
      background-color: #dee2e6; } }
