@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.2
*/

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

/* ホーム画面の記事の並びをカードっぽくする */
.home #list{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}
.home #list a{
  width: 49%;
}
.home #list .entry-card-thumb{
  float: none;
  width: 100%;
}
.home #list .entry-card-content{
  width: 100%;
  margin-left: 0;
}
.home #list .entry-card-snippet{
  display: none;
}

/* 一覧表示の記事タイトル */
.entry-card-title{
  line-height: 160%;
  margin-bottom: 16px;
}

/* カテゴリ表示のときとかの記事抜粋 */
.entry-card-snippet{
  line-height: 180%;
}

/* サイドバー */



/* マルケトのメルマガ登録フォーム */
.mail_cv{
  margin-bottom: 24px
}
.mail_cv p{
  margin: 0
}
.mktoForm{
  width: 100% !important;
}
.mktoForm *{
  float: none !important;
}
.mktoForm .mktoOffset{
  display: none !important;
}
.mktoAsterix{
  position: absolute;
  left: 0;
}
.mktoLabel{
  display: block !important;
  width: 100% !important;
  clear: both !important;
  padding-left: 16px !important;
  font-size: 1rem;
}
.mktoField{
  display: block !important;
  clear: both !important;
  width: 100% !important;
  padding: 8px 16px;
  margin-bottom: 16px;
}
.mktoForm input{
  padding: 8px 16px !important;
  background-color: #f6f6f6;
}
.mktoButtonRow{
  text-align: center !important;
  margin-top: 8px !important;
}
.mktoForm button{
  background-color: #d7240b;
  color: #fff;
  padding: 8px 16px;
  border: none;
  margin-bottom: 24px;
}
.mktoForm span{
  margin: 0 auto !important;
}

/* ヘッダーのロゴ */
.logo-header.logo-image{
  max-width: 400px;
  margin: 16px auto 0;
  padding-bottom: 0;
  }

/* フッターのロゴ */
.footer-bottom-logo img{
  height: auto;
  }


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

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/

  /* ヘッダーのロゴ */
  .logo-header.logo-image{
    width: 60%;
    margin: auto;
    padding-bottom: 0;
  }
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
  .home #list{
    display: block;
  }
  .home #list a{
    width: 100%;
  }
}