@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Template:   cocoon-master
Version:    1.0.6
*/

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


/* アンダーラインの色 */

.marker-under-DeepRightBlue{
background:linear-gradient(transparent 60%, #99ffff 0%);
}

.marker-under-Emerald{
background:linear-gradient(transparent 60%, #66ffcc 0%);
}

.marker-under-Orange{
background: linear-gradient(transparent 60%, #ffcc99 0%);
}

.marker-under-Purple{
background:linear-gradient(transparent 60%, #ccccff 0%);
}

/* 見出し1の色 */
h1{
	color: #555555;
}

/* 見出し3の色 */
h3{
	color: #555555;
}

/* 画像タップ時のグレーバック消去 */
a{-webkit-tap-highlight-color: transparent;}

/* お問い合わせボタン */
.box1{
	border: 0px;
	width: 200px;
    height: 64px;
	outline: focus; 
    background: url(https://noriko-musicschool.com/wp-content/uploads/2019/09/お問い合わせ（前）.png) center no-repeat;

}
.box1:active{
	border: 0px;
	width: 200px;
    height: 64px;
	outline: focus; 
    background: url(https://noriko-musicschool.com/wp-content/uploads/2019/09/お問い合わせ（後）.png) center no-repeat;
}

/* 電話ボタン */
.box2{
	border: 0px;
	width: 300px;
	height: 70px;
	outline: focus; 
    background: url(https://noriko-musicschool.com/wp-content/uploads/2019/09/電話番号（前）.png) center no-repeat;
}
.box2:active{
	border: 0px;
	width: 300px;
　　height: 70px;
	outline: focus; 
    background: url(https://noriko-musicschool.com/wp-content/uploads/2019/09/電話番号（後）.png) center no-repeat;
}

/* 送信ボタン */
.submit_btn{
	border: 0px;
	width: 200px;
    height: 64px;
	outline: none; 
	background: url(https://noriko-musicschool.com/wp-content/uploads/2019/09/送信（前）.png) center no-repeat;
}
.submit_btn:active{
	border: 0px;
	width: 200px;
    height: 64px;
	outline: none;
    background: url(https://noriko-musicschool.com/wp-content/uploads/2019/09/送信（後）.png) center no-repeat;
}
.container input[type='submit']{
	border: none;
    background-color: #fff;
}
input[type='submit'], #bbp_reply_submit, .bp-login-widget-register-link a {
    width: 200px;
}

/* 必須マーク */
.must {
	background: #ff7f7f;
}

/* 任意マーク */
.free {
	background: #999;
}

.must,
.free {
	color: #FFF;
	border-radius: 3px;
	font-size: 12px;
	margin-right: 10px;
	padding: 5px 10px;
	letter-spacing: 0.2em;
}

/* box14 */
.box14{
    padding: 1.5em 1.5em;
    margin: 2em 0;
    background: #ffddbc;
    box-shadow: 0px 0px 15px 10px #ffddbc;
    border: dashed 2.5px white;
}
.box14 p {
    margin: 0; 
    padding: 0;
}

/* サイドバー */
.sidebar h3 {
	padding: 10px;
    background-color: #dbedff;
    color: saddlebrown;
	border-top: 1.5px solid saddlebrown;
	border-bottom: 1.5px solid saddlebrown;
}

/* 見出し2 */
.article h2 {
	padding: 10px;
    background-color: #dbedff;
    color: saddlebrown;
	border-top: 1.5px solid saddlebrown;
	border-bottom: 1.5px solid saddlebrown;
}

/* スライドイン背景色変更 */
.mobile-menu-buttons {
	background: #dbedff;
}
/* メニューのみ */
.navi-menu-button {
	color: #8b4513;
}
/* ホームのみ */
.mobile-menu-buttons .home-menu-button > a {
	color: #8b4513;
}
/* 検索のみ */
.search-menu-button {
	color: #8b4513;
}
/* トップのみ：トップに画像を入れる際は不要 */
.mobile-menu-buttons .top-menu-button > a {
	color: #8b4513;
}
/* サイドバーのみ */
.sidebar-menu-button {
	color: #8b4513;
}
/* スライドインのメニュー背景色変更 */
.navi-menu-content {
	background: #dbedff;
	color: #8b4513;
}
.menu-drawer a {
	color: #8b4513;
	background-color: #dbedff;
	box-shadow: inset 0 0 15px 3px #dbedff;
}
/* インスタアイコン */
.insta_btn2{/*ボタンの下地*/
  color: #FFF;/*文字・アイコン色*/
  border-radius: 7px;/*角丸に*/
  position: relative;
  display: inline-block;
  height: 50px;/*高さ*/
  width: 190px;/*幅*/
  text-align: center;/*中身を中央寄せ*/
  font-size: 25px;/*文字のサイズ*/
  line-height: 50px;/*高さと合わせる*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
  overflow: hidden;/*はみ出た部分を隠す*/
  text-decoration:none;/*下線は消す*/
}

.insta_btn2:before{/*グラデーション②*/
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;/*全体を覆う*/
  height: 100%;/*全体を覆う*/
  background: -webkit-linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
  background: linear-gradient(15deg, #ffdb2c, rgb(249, 118, 76) 25%, rgba(255, 77, 64, 0) 50%) no-repeat;
}

.insta_btn2 .fa-instagram{/*アイコン*/
  font-size: 35px;/*アイコンサイズ*/
  position: relative;
  top: 4px;/*アイコン位置の微調整*/
}

.insta_btn2 span {/*テキスト*/
  display:inline-block;
  position: relative;
  transition: .5s
}

.insta_btn2:hover span{/*ホバーで一周回転*/
  -webkit-transform: rotateX(360deg);
  -ms-transform: rotateX(360deg);
  transform: rotateX(360deg);
}

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

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

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

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