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

/************************************
** 子テーマ用のスタイルを書く
************************************/

img.header-site-logo-image {position: absolute; top: 30px; left: 30px;}
 /* トップイメージの右下を表示 */
header.header {background-position: bottom right;}

.blogcard-thumbnail img, .card-thumb img {aspect-ratio: auto;} /* TOPの固定ページ一覧 */
.navi-entry-card-content {display:none;}

/* ヘッダロゴ横に検索窓 */
.header-in {
  position: relative;
}
.header-in .search-box {
  position: absolute;
  top: 10%;
  right: 20px;
  margin: 0;
  width: 280px;
  transform: translateY(-50%);
}
.header-in input[type="text"] {
  padding: 8px 14px 8px 40px;
  font-size: 14px;
  background: #edf6f9;
  border: 1px solid #9fcde1;
  border-radius: 16px 16px 16px 16px / 50% 50% 50% 50%;
}
.header-in .search-submit {
  left: 3px;
  right: auto;
  color: #378cb0;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px) {
  .header-in .search-box {display: none;
  }
}

/*834px以下*/
@media screen and (max-width: 834px){
	img.header-site-logo-image {display:none;} /* ロゴ非表示 */
	.navicard {display:none;} /* アイコン非表示 */
}

/*480px以下*/
@media screen and (max-width: 480px){
   /* スマホ時に画像縦並べ */
	.alignleft {
      float: none;
   }
   img.alignleft {
      display: block;
      margin: 0 auto 0 auto;
      text-align: center;
   }
}