/*
 * 読みもの系（特集記事本文，ニュース本文，サイト内説明文等）は背景を白にする
 */
body { background: #fff !important; }

#content h2 { clear:both;margin:12px 0 8px 0;color:#303030 !important;background-image:none !important; }
#content h3 { clear:both;margin:12px 0 8px 0;color:#303030 !important;background-image:none !important; }
#content h4 { clear:both;margin:12px 0 8px 0;color:#303030 !important;background-image:none !important;height:auto !important; }
#content h5 { clear:both;margin:12px 0 8px 0;color:#303030 !important;background-image:none !important;height:auto !important; }
#content h6 { clear:both;margin:12px 0 8px 0;color:#303030 !important;background-image:none !important;height:auto !important; }

p { line-height:1.75em !important;margin:0 0 1.75em 0; }

ul, ol { /*list-style-position: inside;*/ padding-left: 1.5em;}

/* feature */

h5.title { margin:0 !important; }

#center {
  display:table-cell !important;float:left;vertical-align:top;
  max-width:725px;
  text-align:left;
}

.article {
  max-width:700px;
  margin: 24px 10px 0;
  text-align: left;
  padding:0;
  color: #303030;
  font-family: "Open Sans","Hiragino Kaku Gothic ProN",HiraKakuPro-W3,Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  font-feature-settings: normal;
  font-size: 16px; font-size: 1rem;
}

#center .article .post_time {
  font-size: 16px; font-size: 1rem;
  line-height: 1.25em;
  color: #707070;
  text-align: right;
  text-decoration: none;
}

#center .article .is_pr {
}
#center .article .is_pr::after {
  content: "Sponsored";
  font-size: 11px;
  padding: 0px 4px;
  vertical-align: text-bottom;
  border-radius: 4px;
  border: 1px solid #949494;
  color: #949494;
}

#center .article .sponsored_by {
  margin: 0.25em 0 1em;
  font-size: 16px; font-size: 1rem;
  font-size: 13px; font-size:0.8125rem;
  line-height: 1.25em;
  color: #707070;
  text-align: right;
  text-decoration: none;
}

#center .article .sponsored_by .sponsor {
  margin-left: 0.5em;
}

#center .article .category_and_artists {
  font-size: 16px; font-size: 1rem;
  font-weight: normal;
  line-height: 1.25em;
  color: #707070 !important;
  text-align: right;
  text-decoration: none;
  width: 72%;
  height: 1.25em; height: 1lh;
  margin: 1em 0 1em auto;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border: none;
}

#center .article h1.article-header {
  margin: 12px 0;
}
#center .article h1.article-header > span {
  display: inline-block;
  font-size: 30px; font-size: 1.875rem;
  color: #303030;
  font-family: Roboto,"Hiragino Kaku Gothic ProN",HiraKakuPro-W3,Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  font-weight: normal;
  line-height: 1.5;
  letter-spacing: normal !important;
}

@media screen and (max-width:641px) {
  #center {
    padding: 0;
    margin: 0 15px;
  }
  .article {
    margin: 8px auto;
  }
  #center .article h1.article-header > span {
    font-size: 28px;
    font-size: 1.75rem;
    line-height: 1.25;
    word-break: break-word;
  }
  #center .article .category_and_artists {
    width: 80vw;
  }
}

#content .archive h2.section-header,
#center .article h2.article-header,
#center .article h3.article-header,
#center .article h4.article-header,
#center .article h5.article-header,
#center .article h6.article-header {
    margin-top:2em;
    margin-bottom:2em !important;
    padding:5px 0;
    width:auto;
    border-left:0 !important;
    border-width:2px;
    border-color: #ccc;
    line-height: 1.5;
}

#content .archive h2.section-header > span,
#center .article h2.article-header > span,
#center .article h3.article-header > span,
#center .article h4.article-header > span,
#center .article h5.article-header > span,
#center .article h6.article-header > span {
  padding:0;
  color: #303030;
  font-family: Roboto,"Hiragino Kaku Gothic ProN",HiraKakuPro-W3,Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  font-feature-settings:"palt";
  font-weight: normal;
  line-height: 1.25;
  letter-spacing: normal !important;
}

#content .archive h2.section-header > span,
#center .article h2.article-header > span {
  font-size: 30px; font-size: 1.875rem; }
#center .article h3.article-header > span {
  font-size: 24px; font-size: 1.5rem; }
#center .article h4.article-header > span {
  font-size: 18px; font-size: 1.125rem; }
#center .article h5.article-header > span {
  font-size: 16px; font-size: 1rem; }
#center .article h6.article-header > span {
  font-size: 16px; font-size: 1rem; }

.article p,
.article b,
.article span.strong2,
.article span.strong3
{
  color: #303030;
  font-family: "Open Sans","Hiragino Kaku Gothic ProN",HiraKakuPro-W3,Meiryo,"ＭＳ Ｐゴシック",sans-serif;
  font-size: 16px; font-size: 1rem;
  font-feature-settings: normal;
  line-height:1.5;
  margin-bottom:1.25em;
  line-break: loose;
}

.article b,
.article span.strong2,
.article span.strong3
{
  font-weight: bold;
}

.article span.strong3
{
  color: #d44950;
}

.article p b {
    color:#303030;
}

.article .image_box.center {
  width: 100%;
  margin: 0 auto;
}

.article .image_with_cap {
  max-width: 700px !important;
  overflow: hidden;
}

.article .image_with_cap.center {
  max-width: 100% !important;
  margin: 0 auto;
}

.image_with_cap.right {
  float: right;
  margin-left: 16px;
}
.image_with_cap.left {
  float: left;
  margin-right: 16px;
}

.article .image_with_cap img.feature_img {
    max-width:700px;
    width: 100%;
}
.article .image_caption {
  font-size: 13px; font-size:0.8125rem !important;
  color:#707070;
  padding-top: 8px;
}

.article .youtube_box_small_center,
.article .youtube_box_small_left,
.article .youtube_box_small_right,
.article .instagram_box_center,
.article .instagram_box_left,
.article .instagram_box_right,
.article .embed_box_center,
.article .embed_box_left,
.article .embed_box_right {
  font-size: 13px; font-size:0.8125rem !important;
  color:#707070;
}

.article .in_box_caption {
  text-align: center;
  line-height: 1.5;
  font-size: 13px; font-size:0.8125rem !important;
  color:#707070;
}

.article .youtube_box_small_center.caption,
.article .youtube_box_small_left.caption,
.article .youtube_box_small_right.caption {
  display: none;
}

.article .quote {
  font-size: 13px; font-size:0.8125rem !important;
}

@media screen and (max-width:641px) {
  .article .image_box.center {
    width: 100vw !important;
    margin: 0 -15px;
  }
  .article .image_box .social_buttons {
    margin-left: 15px;
    margin-right: 15px;
  }
  .article .image_with_cap.center {
    float: none !important;
    margin: 0;
    width: 100vw !important;
  }
  .article .image_with_cap.left,
  .article .image_with_cap.right {
    float: none !important;
    margin: 0;
    width: 100% !important;
  }
  .article .image_with_cap.center img.feature_img {
    width: 100vw !important;
  }
  .article .image_box.center .image_caption {
    margin: 0 15px;
  }
  .article .youtube_box_small_center,
  .article .youtube_box_small_left,
  .article .youtube_box_small_right {
    width: 100% !important;
    padding-bottom: 56.25%;
    height: 0px;
    position: relative;
    overflow: hidden;
  }
  .article .youtube_box_small_center iframe,
  .article .youtube_box_small_left iframe,
  .article .youtube_box_small_right iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
  }
  .article .youtube_box_small_center .in_box_caption,
  .article .youtube_box_small_left .in_box_caption,
  .article .youtube_box_small_right .in_box_caption {
    display: none;
  }
  .article .youtube_box_small_center.caption,
  .article .youtube_box_small_left.caption,
  .article .youtube_box_small_right.caption {
    display: block;
    width: 100% !important;
    height: auto;
    padding: 0;
    margin: 16px auto;
    text-align: center;
    font-size: 13px; font-size:0.8125rem !important;
    color:#707070;
  }
  iframe[src*="//www.youtube.com/embed"] {
    max-width: 100%;
    max-height: calc(100vw * (9 / 16));
  }
  iframe[src*="//player.vimeo.com/video/"] {
    max-width: 100%;
    height: auto;
  }
  iframe[src*="//live.line.me/channels/"] {
    max-width: 100%;
    margin-left: 0 !important;
  }

  .article .instagram_box_center iframe {
    margin: 0 auto;
  }
  .article div.embed_box_center,
  .article div.embed_box_left,
  .article div.embed_box_right {
    width: 100% !important;
    margin: 0 auto;
    float: none !important;
  }

  .article twitter-widget,
  .article twitterwidget {
    width: 100% !important;
    width: 350px !important; /* スマホでスレッド表示時の幅がはみ出す */
  }

  .article blockquote .image_box.center,
  .article blockquote .image_with_cap.center,
  .article blockquote .image_with_cap.center img.feature_img,
  .article blockquote twitter-widget,
  .article blockquote twitterwidget {
    width: 100% !important;
    margin: 0 auto;
  }
}

.article blockquote {
    margin-bottom:24px !important;
    border:0 !important;
    background:#f7f7f9 !important;
    border-radius:2px;
    box-sizing: border-box;
    padding:16px 24px;
    font-size:13px; font-size:0.8125rem;
    color: #505050;
}

.article blockquote b,
.article blockquote p b,
.article blockquote span.strong2,
.article blockquote span.strong3
{
  color: #505050;
  font-weight: bold;
}

.article blockquote span.strong3
{
  color: #d44950;
}

.article blockquote .clearfix:after {
  clear: both;
  display: block;
  height: 0px;
  visibility: hidden;
  content: '';

}

@media screen and (max-width:641px) {
  .article p {
  }
  .article p a {
    word-break: break-all;
  }
  .article blockquote {
    padding: 16px 8px;
    word-break: break-word;
  }
}

.article blockquote > iframe {
/*    max-width:560px !important; */
}

.article .package_box_large {
    margin:0 auto 16px auto;
    padding:0;
    border:1px;
    text-align:left;
}

.article .package_box_large .package_title > p {
    line-height:1.25em !important;
    margin-bottom:8px !important;
}
.article .package_box_large .package_info > p {
    font-size:13px; font-size:0.8125rem;
    color:#707070;
    line-height:1.25em !important;
    margin-bottom:16px !important;
}
.article .package_box_large .tracks > p {
    font-size:13px; font-size:0.8125rem;
    line-height:1.5em !important;
    margin-bottom:4px !important;
    overflow: hidden;
}
.article .package_box_large p.note {
    font-size:13px; font-size:0.8125rem;
    text-align:right;
    color:#707070;
}

.article .package_box_large .internal_left {
    width:160px;
    margin:0 16px 16px 0;
    border:0 !important;
}
.article .package_box_large .internal_left.jacket-container img { width:100%; }
.article .package_box_large .internal_right {
    width:160px;
    min-heith:160px;
    margin:0 0 16px 16px;
    border:0 !important;
}
.article .package_box_large .internal_right.jacket-container img { width:100%; }

.article .package { position:relative;display:inline-block;width:152px;height:242px;background:#fff;box-shadow:0 1px 2px 0 rgba(0,0,0,0.2); }
.article .package.left  { float:left; margin:0 20px 20px 0; }
.article .package.right { float:right; margin:0 0 20px 20px; }
.article .package > figure { width:100%;height:150px;background:#ccc;background-size:cover;margin:0 !important; }
.article .package > .package-content { padding:6px;text-align:left; }
.article .package > .package-content > p.artist { font:normal 85% Arial,Verdana,sans-serif;color:#000;line-height:1.4em !important;height:1.4em;overflow:hidden;text-overflow:ellipsis;margin-bottom:2px;word-break:break-all; }
.article .package > .package-content > p.artist > a { font:inherit;color:#888 !important;text-decoration:none; }
.article .package > .package-content > p.artist > a:hover { text-decoration:underline; }
.article .package > .package-content > p.package-title { font:bold 93% sans-serif;line-height:1.4em !important;height:2.8em;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px;word-break:break-all; }
.article .package > .package-content > p.package-title > a { font:inherit;color:#000;text-decoration:none; }
.article .package > .package-content > p.package-title > a:hover { text-decoration:underline; }
.article .package .buttons { margin-top:4px; }
.article .package .buttons > div {
    float:left;
    width:74px;
    height:24px;
    line-height:24px;
    background:#B0BEC5;
    text-align:center;
    margin-left:1px;
    font-size:12px;
}
.article .package .buttons > div.add-cart { width:75px; }
.article .package.opus .buttons > div { width:150px; }
.article .package .buttons > div:hover { background:#81D4FA; }
.article .package .buttons > div > a,
.article .package .buttons > div > span { color:#fff;display:block;height:24px; }

@media screen and (max-width:641px) {
  .article .package_box_large {
    width: calc(100vw - 43px);
  }
}

figure img { width:100%;height:auto; }
figure:hover { opacity:0.95; }

.tweet-button { display:inline-block;width:180px;margin-left:8px; }
fb\:like > span { vertical-align:top !important; }

.archive {
    margin-bottom:24px;
}

#content .archive h2.section-header {
  text-align: left;
  margin-bottom: 8px !important;
  border-bottom: 2px solid #e0e0e0;
}
#content .archive h2.section-header a {
  color: #303030;
}

.article span.doubledash {
    letter-spacing:0 !important;
}
.article h1 span.doubledash {
    letter-spacing:-0.075em !important;
    color:inherit;
}

.fig { overflow: hidden; }


/*
 * moved from tal/feature/column.css
 */
.article_column {
    box-sizing: border-box;
    width: 45%;
    text-align: justify;
    margin: 0 18px 36px 18px;
    float: left; overflow: hidden; }

.article_column img.article_column_image_right { float: right; margin: 0 0 0 10px; border: 0; }
.article_column img.article_column_image_left { float: left; margin: 0 10px 0 0; border: 0; }

.article_column a { color: #303030; }
.article_column_title {
  font-size: 16px; font-size: 1rem;
  font-weight: bold;
  margin: 0; margin-bottom: 0.25em; width: 100%; height: 1.5em; text-align: left; overflow: hidden; }

.article_column_body {
  font-size: 13px; font-size: 0.8125rem;
  font-weight: normal;
  line-height: 18px; height:144px; overflow: hidden; }
.article_column_postbody {
  font-size: 13px; font-size: 0.8125rem;
  font-weight: normal;
  text-align: right; line-height: 16px; height: 16px; }
.article_column_clear { clear: both; }

@media screen and (max-width:641px) {
  .article_column {
    width: 100%;
    border-bottom: 1px solid #ccc;
    margin: 0 0 12px 0;
    padding: 0 0 12px 0;
  }
  .article_column img { display: none; }
  .article_column_title { height: 3em; }
  .article_column_body {
    height: 5.7em;
    overflow: hidden; }
}

iframe[src*="//www.facebook.com/plugins/like.php"] { width: 103px; }

/*
 * pager related parts
 */
.article .pager {
  margin-bottom: 36px;
}

.article .nextPageLink, .article .firstPageLink {
  margin: 48px auto 36px;
  width: 80%;
  padding: 12px 24px;
  text-align: center;
  border: 1px solid #aaa;
  border-radius: 4px;
  color: #303030;
  background: #f7f7f9;
  clear: both;
}

.article .nextPageLink a, .article .firstPageLink a {
  font-size: 16px; font-size: 1rem;
  line-height: 1.5;
  color: #0277bd;
  text-decoration: none;
}

.article .nextPageLink .arrow, .article .firstPageLink .arrow {
  margin-bottom: 8px;
}

.article .nextPageLink .arrow a, .article .firstPageLink .arrow a {
  font-size: 13px; font-size: 0.8125rem;
  line-height: 1.5;
  color: #303030;
}

.article .nextPageLink a:hover, .article .firstPageLink a:hover {
  text-decoration: underline;
}

.article .nextPageLink .arrow a:hover, .article .firstPageLink .arrow a:hover {
  text-decoration: underline;
}

@media screen and (max-width:641px) {
  .article .nextPageLink, .article .firstPageLink {
    width: 100%;
  }
}

/*
 * added at the time of introducing ArticleParser
 */
.right {
  text-align: right;
}
.left {
  text-align: left;
}
.center {
  text-align: center;
}
.clear {
  clear: both;
}
@media screen and (max-width:641px) {
  .clear-sp {
    clear: both;
  }
}
span.strike2 {
  text-decoration: line-through;
}
span.strike3 {
  text-decoration: line-through;
  font-weight: bold;
}

/*
 * styles for the new article page
 */

.article .series-head {
  background: #f7f7f9;
  color: #505050;
  padding: 3px 6px 3px 6px;
  margin: 0 0 36px 0;
  width: fit-content;
}
.article .series-head .bar {
  color: #ccc;
}

.article .series-head a,
.article .series-head a:link,
.article .series-head a:active,
.article .series-head a:visited,
.article .series-head a:focus,
.article .series-head a:hover
{
  color: #505050;
}

.article-addendum {
  margin-top: 0;
}

.about_writer_box {
  margin-top: 24px;
}

.about_writer_box img.writer-image {
  width:64px;
  height:64px;
  padding: 0;
  margin:0 18px 12px 0;
  float:left;
  vertical-align:top;
  border-radius: 50%;
}
.about_writer_box .name {
  font-size: 16px; font-size: 1rem;
  color: #303030;
  line-height: 1.25;
  display: block;
  vertical-align:top;
  margin: 0 12px 0 0;
  padding: 0;
}
.about_writer_box .name::after {
  content: "";
  display: block;
  clear: both;
}
.about_writer_box .name p {
  font-size: 13px; font-size: 0.8125rem;
  color: #303030;
  line-height:1.5 !important;
  margin: 12px 0 12px 82px;
  padding: 0;
}
.about_writer_box .related {
  font-size: 13px; font-size: 0.8125rem;
  color: #303030;
  margin: 6px 0;
}

.about_writer_box .collapsed-same-author {
  display: none;
}
.about_writer_box .collapsed-same-editor {
  display: none;
}
.about_writer_box .collapse-close {
  display: none;
}

@media screen and (max-width:641px) {
  .about_writer_box .name p {
    word-break: break-word;
  }
}

.related_features {
  margin: 24px 0;
}

.related_features .section-header {
  font-size: 24px; font-size: 1.5rem;
  font-weight: normal;
  font-family: 'Roboto',sans-serif;
  line-height: 1.25;
  color: #303030;
  text-align: left !important;
  margin: 24px 0 16px 0 !important;
  border-bottom: 2px solid #ccc;
  padding-bottom: 6px;

}

#to_index.related_features .section-header {
  font-size: 16px; font-size: 1rem;
}

.related_features .seeall {
  margin: 0 0 24px 0;
  padding: 0;
  text-align: right;
  font-size: 16px; font-size: 1rem;
  color: #0277bd;
}

.related_features .collapsed-same-series,
.related_features .collapsed-same-category,
.related_features .collapsed-series-list,
.related_features .collapse-close {
  display: none;
}

[class|="collapse"] {
  border: none;
  color: inherit;
}

.article-list-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 16px 0 0 0;
}
.article-list-box.center {
  justify-content: center;
  margin: 0;
}
.article-list-box.right {
  flex-direction: row-reverse;
}

.article-list {
  display: flex;
  justify-content: space-between;
  margin: 6px 0;
  padding-bottom: 12px;
  border-bottom: solid 1px #f0f0f0;
}
.article-list:last-child {
  border-bottom: unset;
}
@media screen and (min-width:641px) {
  .article-list:nth-child(odd):nth-last-child(2) {
    border-bottom: unset;
  }
}
.article-list figure {
  border-radius: unset;
}
.article-list p {
  font-weight: normal;
  overflow: hidden;
  margin: 0;
  text-overflow: ellipsis;
  display: -webkit-box; -webkit-box-orient: vertical;
  color: #303030;
}

.article-list.small {
  width: 318px;
}
.article-list.small figure {
  flex-basis: 48px;
  width: 48px;
  min-width: 48px;
  height: 36px;
}
.article-list.small p {
  flex-basis: 268px;
  font-size: 13px; font-size: 0.8125rem;
  line-height: 1.4 !important;
  height: 36px;
  padding: 0 0 0 12px;
  -webkit-line-clamp: 2;
}

.article-list.large {
  width: 330px;
}
.article-list.large figure {
  flex-basis: 144px;
  width: 144px;
  height: 108px;
}
.article-list.large p {
  flex-basis: 170px;
  font-size: 16px; font-size: 1rem;
  line-height: 1.4 !important;
  height: 108px;
  padding: 0 0 0 0;
  -webkit-line-clamp: 5;
}

.article-list p a,
.article-list p a:link,
.article-list p a:active,
.article-list p a:visited,
.article-list p a:focus,
.article-list p a:hover
{
  color: #303030;
  word-break: break-word;
}

.article-list-box .more {
    flex-basis: 50%;
}
@media screen and (max-width:641px) {
  .article .series-head {
    margin: 0 0 18px 0;
  }
  .article-list.small,
  .article-list.large {
    width: 100%;
  }
  .article-list.small figure,
  .article-list.large figure {
    flex-grow: 0;
    width: auto;
  }
  .article-list.small p,
  .article-list.large p {
    flex-grow: 1;
    padding: 0 0 0 12px;
  }
  .article-list-box .more {
    flex-basis: 100%;
  }
}

.article-embedded {
  display: flex;
  width: 100%;
  background: #fff;
  padding: 6px;
  margin: 0 0 20px 0;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
  overflow: hidden;
  border-radius: 2px;
}
.article-embedded figure {
  background: #fff;
  flex-shrink: 0;
  overflow: hidden;
}
.article-embedded figure img {
  object-fit: contain;
  border-radius: 2px;
}
.article-embedded p {
  font-size: 16px; font-size: 1rem;
  font-weight: normal;
  line-height: 1.45 !important;
  overflow: hidden;
  margin: 0 0 0 16px;
  text-overflow: ellipsis;
  display: -webkit-box; -webkit-box-orient: vertical;
  color: #303030;
}
.article-embedded p > a {
  color: #303030 !important;
  text-decoration:none;
}
.article-embedded p > a:hover {
  text-decoration:underline;
}
#center .article-embedded p.category.review {
  padding: 0;
}
#center .article-embedded p.category.column {
  width: unset;
  clear: unset;
  padding-bottom: unset;
}

.article-embedded.small {
  flex-direction: row;
  height: 84px;
}
.article-embedded.small figure {
  flex-basis: 108px;
  width: 108px;
}
.article-embedded.small .title-div {
  display: flex;
  align-items: center;
}
.article-embedded.small .title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.article-embedded.large {
  flex-direction: column;
  height: 352px;
  max-width: 100%;
  width: 500px;
  margin: 0 auto 20px;
}
.article-embedded.large figure {
  height: 264px;
  width: 100%;
}
.article-embedded.large .title-div {
  height: 78px;
}
.article-embedded.large .category {
  font-size: 13px; font-size: 0.8125rem;
  font-weight: lighter;
  color: #949494;
  height: 18px;
  line-height: 1.75 !important;
  margin: 6px 0 0 0;
}
.article-embedded.large .title {
  margin: 6px 0 0 0;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

@media screen and (max-width:641px) {
  .article-embedded.large {
    height: 335px;
    width: 100%;
  }
  .article-embedded.large figure {
    height: 224px;
  }
  .article-embedded.large .title-div {
    height: 99px;
  }
  .article-embedded.large .title {
    -webkit-line-clamp: 3;
  }
}

button.toglePlayPauseButton {
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 4px 4px 3px 4px;
  line-height: 1;
  vertical-align: text-bottom;
}

button.toglePlayPauseButton.large {
  padding: 8px 8px 8px 8px;
}

div.googleform-iframe-div {
}

iframe.googleform-iframe {
  min-width: 100%;
  width: 100px;
  *width: 100%;
}

.loader {
  text-align: center;
  margin: 100px 0;
  color: #2ab002;
  display: none;
}

.article div[id].anchor {
  display: block;
  padding-top: 28px;
  margin-top: -28px;
}

/*
 * for Photo Gallery (PhotoSwipe)
 */
.pswp-gallery {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-gap: 4px;
  place-items: stretch stretch;
  place-content: stretch stretch;
}
@media screen and (max-width: 641px) {
  .pswp-gallery {
    grid-template-columns: repeat(4, 1fr);
  }
}
.article .pswp-gallery a {
  display: block;
  place-self: center center;
  color: transparent;
}
.article .pswp-gallery a img {
  width: 100%;
}
.article .pswp-gallery a img:hover {
  opacity: 0.95;
}