@charset "UTF-8";

//Font Awesomeのアイコン
@import "fontawesome-before";
.components-button.is-button{
  padding: 0 4px;
}
/* copy from editor-style.css */
div.editor-styles-wrapper{
  margin: 20px;
  background-color: #fff;
  padding-top: 20px;
}

.editor-post-title .editor-post-title__input{
  font-size: 1.625rem;
}

// .editor-styles-wrapper div.block-editor-cocoon-wrap {
//   max-width: 860px;
//   width: auto;
//   padding-left: 14px;
//   padding-right: 14px;
//   margin: 20px auto !important;
// }

// .wp-block {
//   padding: 0;
//   margin: 0 auto;
//   max-width: none;
// }

// .edit-post-text-editor {
//   padding: 0;
//   margin: 0 auto;
//   max-width: 800px;
// }


//ブロックボックス内のインナーブロックのマージン変更
.block-box{
  .editor-block-list__layout .editor-block-list__block-edit{
    margin-top: 8px;
    margin-bottom: 8px;
  }
}

@media screen and (max-width: 600px) {
  div {
    &.editor-block-list__block::before, &.editor-block-list__layout .editor-block-list__block .editor-block-list__block-edit::before {
      left: 0;
      right: 0;
    }
    &.freeform-toolbar {
      margin: 0;
    }
  }
}

//ブロックエディタークラシックブロック本文の.mce-content-bodyをテーマデフォルトと同じにする
div.mce-content-body {
  line-height: 1.8;
  padding-top: 1em;
}

.editor-block-list__layout .editor-block-list__block,,//Wordpress 5.4未満
.block-editor-block-list__layout .block-editor-block-list__block //WordPress 5.4以降
 {
  &[data-type^="cocoon-blocks/button"], &[data-type^="cocoon-blocks/button-wrap"] {
    height: auto;
    padding: 0 0 1px;
  }
  &[data-type^="cocoon-blocks/micro-text"]{
    padding: 0.5em;
    margin-top: 1.2em;//これがないと「＋」ボタンが表示されない
    margin-bottom: 0.2em;//これがないと「＋」ボタンが表示されない
  }
  &[data-type^="cocoon-blocks/button"][data-align="left"],
  &[data-type^="cocoon-blocks/button-wrap"][data-align="left"],
  &[data-type^="cocoon-blocks/micro-text"][data-align="left"] {
    text-align: left;
  }
  &[data-type^="cocoon-blocks/button"][data-align="right"],
  &[data-type^="cocoon-blocks/button-wrap"][data-align="right"],
  &[data-type^="cocoon-blocks/micro-text"][data-align="right"] {
    text-align: right;
  }
  &[data-type^="cocoon-blocks/button"][data-align="center"],
  &[data-type^="cocoon-blocks/button-wrap"][data-align="center"],
  &[data-type^="cocoon-blocks/micro-text"][data-align="center"] {
    text-align: center;
  }
  &[data-type^="cocoon-blocks/button"] .editor-block-list__block-edit,
  &[data-type^="cocoon-blocks/button-wrap"] .editor-block-list__block-edit,
  &[data-type^="cocoon-blocks/micro-text"] .editor-block-list__block-edit {
    float: none;
    margin: 0;
  }
  &[data-type^="cocoon-blocks/micro-text"],
  &[data-type^="cocoon-blocks/micro-balloon"]{
    height: auto !important;
  }
  &[data-type^="cocoon-blocks/micro-balloon"] .editor-block-list__block-edit {
    float: none;
  }
  &[data-type^="cocoon-blocks/micro-balloon"][data-align="left"] .micro-copy {
    margin-right: auto;
  }
  &[data-type^="cocoon-blocks/micro-balloon"][data-align="center"] .micro-copy {
    margin-left: auto;
    margin-right: auto;
  }
  &[data-type^="cocoon-blocks/micro-balloon"][data-align="right"] .micro-copy {
    margin-left: auto;
  }
  &[data-type="core/freeform"] {
    clear: both;
  }
  &[data-type="core/image"][data-align="left"] .block-editor-block-list__block-edit {
    float: left;
    margin-right: 1em;
  }
  &[data-type="core/image"][data-align="right"] .block-editor-block-list__block-edit {
    float: right;
    margin-left: 1em;
  }
  // &[data-type="core/table"]{
  //   &::before,
  //   &::after{
  //     display: none;
  //   }
  // }


  .column-2,
  .column-3{
    .editor-inner-blocks{
      .column-left,
      .column-center,
      .column-right{
        width: auto;
      }
    }
  }

  .column-wrap{
    >.editor-inner-blocks ,//Wordpress 5.4未満
    >.block-editor-inner-blocks //WordPress5.4以降
    {
      width: 100% !important;
    }
     > .editor-inner-blocks > .editor-block-list__layout,//Wordpress 5.4未満
     > .block-editor-inner-blocks > .block-editor-block-list__layout //WordPress5.4以降
     {
      display: flex;
      position: relative;
      margin: 1em 0;


      >div{
        width: 100%;
        //padding: 0 0.45em;
        margin: 0;
        p{
          margin-top: 0;
        }
      }

      [data-type^="cocoon-blocks/column-left"]{
        background-color: #c7e1ef;
      }
      [data-type^="cocoon-blocks/column-center"]{
        background-color: #c9e8d8;
      }
      [data-type^="cocoon-blocks/column-right"]{
        background-color: #ffecd3;
      }
    }

    //1:2
    &.column-2-3-1-2{
      > .editor-inner-blocks > .editor-block-list__layout{
        [data-type^="cocoon-blocks/column-left"]{
          width: 34%;
        }
        [data-type^="cocoon-blocks/column-right"]{
          width: 66%;
        }
      }
    }

    //2:1
    &.column-2-3-2-1{
      > .editor-inner-blocks > .editor-block-list__layout{
        [data-type^="cocoon-blocks/column-left"]{
          width: 66%;
        }
        [data-type^="cocoon-blocks/column-right"]{
          width: 34%;
        }
      }
    }

    //1:3
    &.column-2-4-1-3{
      > .editor-inner-blocks > .editor-block-list__layout{
        [data-type^="cocoon-blocks/column-left"]{
          width: 25%;
        }
        [data-type^="cocoon-blocks/column-right"]{
          width: 75%;
        }
      }
    }

    //3:1
    &.column-2-4-3-1{
      > .editor-inner-blocks > .editor-block-list__layout{
        [data-type^="cocoon-blocks/column-left"]{
          width: 75%;
        }
        [data-type^="cocoon-blocks/column-right"]{
          width: 25%;
        }
      }
    }

  }
}

//タイムライン
.timeline-box{
  .editor-block-list__layout .editor-block-list__block-edit{
    margin-top: 0;
    margin-bottom: 0;
  }

  .editor-inner-blocks{
    margin-top: 1em;
  }

  .editor-block-list__block-edit li.timeline-item{
    margin: 0;
  }
}

/* main */
.wp-block.editor-block-list__block[data-align="left"],
.wp-block.editor-block-list__block[data-align="right"] {
  display: block;
  > .block-editor-block-list__block-edit{
    float: none;
  }
}
.block-editor-block-list__block[data-type="core/table"][data-align="left"] table{
  margin-left: 0;
  margin-right: auto;
}
.block-editor-block-list__block[data-type="core/table"][data-align="right"] table{
  margin-left: auto;
  margin-right: 0;
}
.wp-block.editor-block-list__block[data-align="wide"],
.wp-block.editor-block-list__block[data-align="full"]{
  table{
    width: 100%;
  }
}

// .block-editor-writing-flow {
//   max-width: 860px;
//   margin: auto;
//   padding-left: 14px;
//   padding-right: 14px;
//   background-color: white;
// }

// .editor-styles-wrapper .block-editor-writing-flow.main {
//   width: auto;
//   padding-left: 14px;
//   padding-right: 14px;
//   // margin-left: 20px;
//   // margin-right: 20px;
//   margin: 20px auto;
// }

/* wp-includes/css/dist/edit-post/style.css
 * wp-includes/css/dist/editor/style.css
@media (min-width:600px){.editor-post-title{padding-left:46px;padding-right:46px}}
@media (min-width:600px){.editor-block-list__layout{padding-left:46px;padding-right:46px}}
*/

.editor-post-title, .editor-block-list__layout {
  padding: 0;
}

/* full width */

.editor-styles-wrapper {
  .wp-block[data-align=full] {
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }
  .block-editor-writing-flow textarea {
    min-height: auto;
  }
}

/* cocoon/style.css
textarea{
  min-height: 260px;
}
 */

/* wp-admin/css/common.css
ul{
    list-style:none;
}
 */

.wp-block {
  ul {
    list-style-type: disc;
  }
  li {
    display: list-item;
    text-align: -webkit-match-parent;
  }
  ul ul {
    list-style-type: circle;
  }
  ol {
    ul {
      list-style-type: circle;
    }
    ol ul, ul ul {
      list-style-type: square;
    }
  }
  ul {
    ol ul, ul ul {
      list-style-type: square;
    }
  }
  .wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
    max-width: none;
  }
  .wp-block-table__cell-content {
    padding: 0;
  }
  .wp-block-quote .editor-rich-text__tinymce > p:first-child {
    margin: 1em 0;
  }
}

.wp-block-table{
  table{
    font-size: 16px;
  }
}
.wp-block .wp-block-table__cell-content{
  min-width: 50px;
  padding: 8px;
}

// .block-editor-block-list__layout *{
//   box-sizing: border-box;
// }

// table{
//   width: 90% !important;
// }

/* wp-includes/css/dist/block-library/theme.css
.wp-block-separator:not(.is-style-wide):not(.is-style-dots){
    max-width:100px;
}
*/

/* wp-includes/css/dist/block-library/editor.css
.wp-block-table__cell-content{
    padding:.5em;
}
*/

/* wp-includes/css/dist/block-library/editor.css
.editor-rich-text__tinymce>p:first-child{
    margin-top:0;
}
*/

.wp-block-quote__citation {
  font-style: italic;
}

/* wp-includes/css/dist/block-library/editor.css
.editor-block-list__block[data-align=center] {
    text-align: center
}
*/

.wp-block {
  &.editor-block-list__block[data-align=center] {
    text-align: left;
    display: block;
    &[data-type="core/button"] {
      text-align: center;
    }
  }
  .wp-block-pullquote {
    border-top: none;
    border-bottom: none;
  }
}

/* wp-includes/css/dist/block-library/style.css
.wp-block-button.aligncenter {
    text-align: center
}
 */

/** wp-includes/css/dist/block-library/theme.css
.wp-block-pullquote {
    border-top: 4px solid #555d66;
    border-bottom: 4px solid #555d66;
    color: #40464d;
}
 */

/** cocoon/style.css
ol, ul {
  margin: 1em 0;
  padding-left: 40px;
}
 */

.editor-styles-wrapper {
  ol.wp-block-gallery, ul.wp-block-gallery {
    padding: 0;
  }
  .article {
    ul.wp-block-gallery li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin: 0 16px 16px 0;
      }
    }
    ol.wp-block-gallery li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin: 0 16px 16px 0;
      }
    }
    ul.wp-block-gallery li {
      &.blocks-gallery-image figure, &.blocks-gallery-item figure {
        margin: 0;
      }
    }
    ol.wp-block-gallery li {
      &.blocks-gallery-image figure, &.blocks-gallery-item figure {
        margin: 0;
      }
    }
    ul.wp-block-gallery li {
      &.blocks-gallery-image:nth-of-type(even), &.blocks-gallery-item:nth-of-type(even) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery li {
      &.blocks-gallery-image:nth-of-type(even), &.blocks-gallery-item:nth-of-type(even) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-1 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-1 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery li {
      &.blocks-gallery-image:last-child, &.blocks-gallery-item:last-child {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery li {
      &.blocks-gallery-image:last-child, &.blocks-gallery-item:last-child {
        margin-right: 0;
      }
    }
  }
}

/** cocoon/style.css
.article ul li,
.article ol li {
  margin: 0.2em;
}
 */
 .editor-styles-wrapper .article .wp-block-gallery ul li{
  margin-left: 0;
}

@media (min-width: 600px) {
  .editor-styles-wrapper .article {
    ul.wp-block-gallery.columns-3 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ol.wp-block-gallery.columns-3 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ul.wp-block-gallery.columns-4 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ol.wp-block-gallery.columns-4 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ul.wp-block-gallery.columns-5 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ol.wp-block-gallery.columns-5 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ul.wp-block-gallery.columns-6 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ol.wp-block-gallery.columns-6 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ul.wp-block-gallery.columns-7 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ol.wp-block-gallery.columns-7 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ul.wp-block-gallery.columns-8 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ol.wp-block-gallery.columns-8 li {
      &.blocks-gallery-image, &.blocks-gallery-item {
        margin-right: 16px;
      }
    }
    ul.wp-block-gallery.columns-1 li {
      &.blocks-gallery-image:nth-of-type(1n), &.blocks-gallery-item:nth-of-type(1n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-1 li {
      &.blocks-gallery-image:nth-of-type(1n), &.blocks-gallery-item:nth-of-type(1n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-2 li {
      &.blocks-gallery-image:nth-of-type(2n), &.blocks-gallery-item:nth-of-type(2n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-2 li {
      &.blocks-gallery-image:nth-of-type(2n), &.blocks-gallery-item:nth-of-type(2n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-3 li {
      &.blocks-gallery-image:nth-of-type(3n), &.blocks-gallery-item:nth-of-type(3n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-3 li {
      &.blocks-gallery-image:nth-of-type(3n), &.blocks-gallery-item:nth-of-type(3n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-4 li {
      &.blocks-gallery-image:nth-of-type(4n), &.blocks-gallery-item:nth-of-type(4n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-4 li {
      &.blocks-gallery-image:nth-of-type(4n), &.blocks-gallery-item:nth-of-type(4n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-5 li {
      &.blocks-gallery-image:nth-of-type(5n), &.blocks-gallery-item:nth-of-type(5n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-5 li {
      &.blocks-gallery-image:nth-of-type(5n), &.blocks-gallery-item:nth-of-type(5n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-6 li {
      &.blocks-gallery-image:nth-of-type(6n), &.blocks-gallery-item:nth-of-type(6n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-6 li {
      &.blocks-gallery-image:nth-of-type(6n), &.blocks-gallery-item:nth-of-type(6n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-7 li {
      &.blocks-gallery-image:nth-of-type(7n), &.blocks-gallery-item:nth-of-type(7n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-7 li {
      &.blocks-gallery-image:nth-of-type(7n), &.blocks-gallery-item:nth-of-type(7n) {
        margin-right: 0;
      }
    }
    ul.wp-block-gallery.columns-8 li {
      &.blocks-gallery-image:nth-of-type(8n), &.blocks-gallery-item:nth-of-type(8n) {
        margin-right: 0;
      }
    }
    ol.wp-block-gallery.columns-8 li {
      &.blocks-gallery-image:nth-of-type(8n), &.blocks-gallery-item:nth-of-type(8n) {
        margin-right: 0;
      }
    }
  }
}

@media screen and (max-width: 834px) {
  .editor-styles-wrapper .editor-block-list__layout .editor-block-list__block .editor-block-drop-zone {
    margin: 0;
  }
  .editor-block-list__layout .editor-block-list__block {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media screen and (max-width: 600px) {
  .editor-block-list__layout .editor-block-list__block {
    padding-left: 0;
    padding-right: 0;
  }
}

/* for classic editor */

.block-library-rich-text__tinymce {
  padding: 10px;
}

/* for Firefox */

.editor-rich-text__tinymce:after {
  white-space: normal;
}

/* for IE11 */
/* Unnecessary space below element which has large image with flex */
/* This is Gutenberg's bug */
/*
- add [flex-shrink:0] explicitly
- clear [flex-grow: 1] -> parent has [flex-direction: column;], so this style has no effect
.edit-post-layout__content {
    display: flex;
    flex-direction: column;
}
- clear [height: 100%] of .block-editor-writing-flow
*/

.edit-post-layout__content .edit-post-visual-editor {
  flex-shrink: 0;
  flex-grow: 0;
  padding: 0 10px;
}

.editor-styles-wrapper {
  .block-editor-writing-flow {
    height: auto;
    flex-shrink: 0;
    > div {
      flex-shrink: 0;
    }
  }
  .wp-block-image img {
    flex-shrink: 0;
  }
}

//見出しが二重になれ不具合修正
.editor-styles-wrapper .article .editor-rich-text__tinymce{
  margin: 0;
}

//インラインツールバー調整
.editor-styles-wrapper .red{
  margin-left: 0;
}


//トグルボックス
.toggle-wrap{
  .toggle-button{
    div{
      display: inline;
    }
  }
}

//ブロック追加ボタン
.editor-block-list__empty-block-inserter {
  left: -16px;
}

.icon-setting-buttons{
  .fab-none::before{
    content: 'none';
  }
}

.label-box-label,
.tab-caption-box-label{
  *{
    display: inline;
  }
}

//アイコンリスト内のCSS不具合修正
.editor-styles-wrapper .article{
  .iconlist-box{
    ul, ol{
      li{
        margin: 0;
      }
    }
  }
}

// .wp-block .widget.open{
//   margin-left: 0;
// }

.micro-content{
  display: inline-flex;
}

.btn-wrap{
  background-color: #f8e58c !important;
}

.tab-caption-box-label.box-label,
.label-box-label.box-label {
  margin-bottom: -2px;
}

.timeline-box [data-block]{
  margin: 0;
}

.editor-styles-wrapper .components-select-control__input{
  padding: 0 10px;
}

// .editor-post-title__block {
//   padding-left: 58px;
//   padding-right: 58px;
// }

//WordPress 5.4からの吹き出しの不具合対応
.speech-wrap .components-button{
  height: auto;
}

.body,
.body p{
  font-size: 18px;
}

//ブロックエディタータイトル余白の修正
.block-editor-editor-skeleton__body {
  .editor-post-title{
    margin: 0 6px;
  }
}
//ブロックエディターパーマリンク余白の修正
@media screen and (min-width: 600px){
  .edit-post-visual-editor .editor-post-title__block .editor-post-permalink{
    margin: 0 -18px;
  }
}

//ブロックエディターの吹き出しスタイルの調整
.speech-balloon{
  min-width: 160px;
}


//マイクロソフトブラウザーでツールボタンの表示が崩れる不具合修正
@mixin ms_block_fix{
  .editor-block-toolbar.block-editor-block-toolbar{
    position: relative;
    .block-editor-block-toolbar__slot{
      display: inline-flex;
    }
  }
}
//IEのみに適用されるブラウザハック
@media all and (-ms-high-contrast: none){
  @include ms_block_fix;
}
//Edgeのみに適用されるブラウザハック
@supports (-ms-ime-align: auto) {
  @include ms_block_fix;
}

//ブロックエディター入力カラムの下（SEO等の設定項目の上）にある余白を削除
.block-editor-writing-flow__click-redirect{
  display: none;
}

//ブロックエディターですおが隠れてしまう
// .wp-block-table {
// 	overflow: auto;
// }

//Gutenbergオプションのセレクトボックスの調整
.meta-box-sortables select {
  box-sizing: border-box;
}

// プレイビュースタイルの調整
.has-drop-cap:not(:focus)::first-letter {
  float: none;
  font-size: 1em;
}

// プレイビュースタイルの背景色を白にする
.wp-block-paragraph.has-drop-cap{
  background-color: #fff;
}

//Gutenbergエディター.block-editor-block-list__layoutの最後に
//.block-list-appenderが来るので:last-child余白調整が入らないのを修正
.block-editor-inner-blocks{
  .block-editor-block-list__layout{
    :nth-last-child(2){
      margin-bottom: 0;
    }
  }
}

p {
  margin-top: 0;
}

.page-type-wide{
  max-width: 96% !important;
}

//ブロックエディターの背景画像問題の修正
.block-editor-block-styles__item-preview .editor-styles-wrapper::before{
  // background-image: none !important;
  // width: 0;
  // height: 0;
  display: none;
}
body,
body::before,
.editor-styles-wrapper::before {
  background: none !important;
}