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

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

/*-------------------------------------------*/
/*	インフォメーションボックス スタイルシート(規約などで利用)
/*	<div class="infobox">囲みたい文章を、この中に入れる</div>
/*-------------------------------------------*/
.infobox {
		overflow:auto;
        width: 100%;
        height: 200px !important;
        overflow: scroll; /* スクロールバーを表示(※) */
        border: 1px solid #cccccc;  /* 枠線を追加 */
        background-color: #ffffff; /* 背景色を追加 */
}



/*-------------------------------------------*/
/*	お問い合わせフォームの入力 　★☆★ここから★☆★
/*-------------------------------------------*/

/*
.wpcf7 select
{
    width: 20%;
}

.wpcf7 input
{
    width: 10%;
}

*/


.wpcf7 input[name="your-last-name"] { /* 保護者　名前　姓　入力欄 */
	width: 25%;
}
.wpcf7 input[name="your-first-name"] { /*保護者　名前　名　入力欄 */
	width: 25%;
}

.wpcf7 input[name="child-last-name"] { /* 子ども　名前　姓　入力欄 */
	width: 25%;
}
.wpcf7 input[name="child-first-name"] { /*子ども　名前　名　入力欄 */
	width: 25%;
}

.wpcf7 input[name="child-last-name-kana"] { /* 子ども　名前　姓カナ　入力欄 */
	width: 25%;
}
.wpcf7 input[name="child-first-name-kana"] { /*子ども　名前　名カナ　入力欄 */
	width: 25%;
}

.wpcf7 select[name="child-age"] { /* 子ども　年齢（●歳） */
	width: 25%;
}
.wpcf7 select[name="child-age-month"] { /*子ども　年齢（●ヶ月） */
	width: 25%;
}


.wpcf7 input[name="your-email"] { /* メール入力欄 */
	width: 85%;
}
.wpcf7 input[name="your-subject"] { /* タイトル入力欄 */
	width: 85%;
}
.wpcf7 textarea[name="your-message"] { /* 本文入力欄 */
	width: 100%;
}



.wpcf7 select[name="booking-times-of-day"] { /* 予約時刻選択欄 */
	width: 25%;
}

.wpcf7 select[name="booking-time"] { /* 予約時間選択欄 */
	width: 25%;
}

.wpcf7 select[name="birth-year"] { /* 生年月日（年） */
	width: 25%;
}
.wpcf7 select[name="birth-month"] { /* 生年月日（月） */
	width: 25%;
}
.wpcf7 select[name="birth-day"] { /* 生年月日（日） */
	width: 25%;
}



/*-------------------------------------------*/
/*	お問い合わせフォームの入力 　★☆★ここまで★☆★
/*-------------------------------------------*/

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

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

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