@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 768px){
  /*必要ならばここにコードを書く*/
    /* カラム全体のコンテナ（親要素） */
    .wp-block-columns {
        display: flex;       /* Flexboxを使って子要素（カラム）を横並びにする */
        flex-wrap: wrap;     /* カラムが多すぎる場合に折り返す設定（念のため） */
        /* gap: 20px; */     /* CSS gap プロパティが使える環境なら、これでカラム間の余白を設定できます */
        /* justify-content: space-between; */ /* カラム間に均等なスペースを配置（必要であれば） */
    }
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
.wp-block-columns {
        display: block; /* Flexboxを解除し、ブロック要素として扱う */
    }
}
