/*
Theme Name: Xwrite child
Version: 2.0.0
Template: xwrite
*/
/* ギャラリー  */
/* 基本：PC 3列 */
.fixed-gallery {
  justify-content: flex-start;
}

.fixed-gallery .wp-block-image {
  flex-basis: calc(33.333% - 16px) !important;
  flex-grow: 0 !important;
}

/* タブレット：2列 */
@media (max-width: 1024px) {
  .fixed-gallery .wp-block-image {
    flex-basis: calc(50% - 12px) !important;
  }
}

/* スマートフォン：1列 */
@media (max-width: 767px) {
  .fixed-gallery .wp-block-image {
    flex-basis: 100% !important;
  }
}

/* 全カラム数共通で、最後の画像を広げない */
.wp-block-gallery.has-nested-images .wp-block-image {
  flex-grow: 0 !important;
}


/* =========================================
   ギャラリー：ツールチップ型キャプション
========================================= */

/* ギャラリー画像のコンテナ */
.wp-block-gallery figure.wp-block-image {
  position: relative;
  cursor: pointer;
  overflow: visible;
  /* しっぽが見切れるのを防ぐ */
}

/* 画像が暗くなる効果を解除 */
.wp-block-gallery figure.wp-block-image img {
  filter: none !important;
  transition: none;
}

/* ツールチップ本体（キャプション部分） */
.wp-block-gallery figure.wp-block-image figcaption {
  background: #333333 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  position: absolute;
  bottom: 25px;
  /* しっぽの分、少し上に配置 */
  left: 50%;
  transform: translateX(-50%) translateY(10px);
  width: max-content;
  max-width: 95%;
  padding: 6px 8px;
  border-radius: 5px;
  box-sizing: border-box;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
  color: #ffffff;
  font-size: 12px;
  font-weight: normal;
  text-align: center;
  line-height: 1.4;
  word-wrap: break-word;
  white-space: normal;
  pointer-events: none;
  z-index: 10;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* ホバー時 ＆ タップ時にツールチップを表示 */
@media screen and (min-width: 640px) {
  .wp-block-gallery figure.wp-block-image:hover figcaption,
  .wp-block-gallery figure.wp-block-image:focus figcaption {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
  }
}


/* サイドバー */
body .side .widget h4:not(.widget-title):not(.xw-block-faq__question):not(.xw-block-faq__accordion) {
    background-color: #334155 !important;
    color:#fff !important;
}

body .side .widget .widget-title {
    background-color: #334155 !important;
    color:#fff !important;
}
/*.side .widget_block > h4 {
    color: #fff;
}

.side .widget_block > h4::after {
    content: "";
    display: block;
    width: 40px;
    height: 2px;
    margin-top: 8px;
    background: #dddddd;
}*/

/* テーマの調整用 */

.articleBody :where(.wp-block-image.is-style-default) img, .articleBody :where(.wp-block-image.is-style-rounded) img, .articleBody :where(.wp-block-image:not([class*=is-style-])) img, .articleBody :where(img[class*=wp-image-]) {
    box-shadow: 2px 2px 7px 0 rgba(0, 0, 0, .05);
    outline: none;
}