@charset "UTF-8";

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

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


/*うんち*/

/*うんちここまで*/






/* アピールエリア　編集ここから*/
.appeal-title {
	color: #4a77ff;
	font-size: 1.2em;
  font-weight: bold;
}
/*アピールメッセージの背景色・文字色*/

.appeal-message {
	color: #4169e1;
}
/*アピールエリアタイトルの背景色・文字色*/

.appeal-title {
	text-shadow: 0px 0px 0 #4169e1;
}
/*アピールエリアの背景色*/
.appeal-content .appeal-button {
	background-color: #e06941; /*扉をあけるの背景*/
	color: #fff; /*その文字列*/
}

/* アピールエリア　編集ここまで*/

/* 見出しH2　変更ここから*/
.article h2 {
    color: #fff;
    padding: .8em 1em;
    margin-top: 80px;
    background: #4169e1;
    border-top: 4px solid #667d8c;
    border-bottom: 4px solid #667d8c;
}
/* 見出しH2　変更ここまで*/




/* モバイルのグローバルナビ(メニュー)の設定（左側からスライドするメニュー）ここから */
/* 背景色変更 */
.navi-menu-content {
	background: #cad0e0;
}

/*リンク文字拝啓オシャレ */

.menu-drawer a {
	background-color: #B0C4DE;
	color: #4169e1;
	box-shadow: inset 0 0 8px 15px #b4bfe0; /* この部分追記 */
}


/*リンクをタップしたとき */
.menu-drawer a:hover {
	background-color: #ffc2f5;
	color: #fff;
	font-weight: bold; /* 文字を太く */
	text-shadow: 0 1px 0 #ff77e8; /* シャドーを */
}


/* モバイルのグローバルナビ(メニュー)の設定（左側からスライドするメニュー）ここまで */

/*取扱保険会社　サムネイル幅統一ここから*/

p.insurance img {
    width: 400px;  /* 横幅を200pxに */
}

/*取扱保険会社　サムネイル幅統一ここまで*/



/* 全固定ページでタイトルを非表示ここから */
.page .entry-title {
    display: none;
}
/* 全固定ページでタイトルを非表示ここまで */



/* モバイルフッターメニュー変更ここから */

/*フッターモバイルメニュー変更*/
.mobile-menu-buttons {
	background:#cad0e0;/*フッターメニューの背景を半透明化*/
	color: #4169e1;/* AAAここは同じ文字色を */
}

/*フッターモバイル文字色変更*/

.mobile-footer-menu-buttons,
.navi-menu-content,
.mobile-footer-menu-buttons .menu-button > a,
.mobile-footer-menu-buttons .menu-button:hover,
.navi-menu-content a,
.navi-menu-content a:hover {
color:#4169e1 ;/* AAAここは同じ文字色を */
}



/* ボタンhover時の文字・背景変更 */

.mobile-menu-buttons .menu-button:hover {
	background:rgba(189, 71, 71,0.9); /* 背景色 */
	color: #4169e1; /* 文字の色 *//* AAAここは同じ文字色を */
}
/* トップ・ホームの『文字』は構造上別途必要 */
.top-menu-button a:hover, /*トップに戻る画像を入れる場合はこの1行削除*/
.home-menu-button a:hover {
	color: #4169e1; /* ここは同じ文字色を */
}




/*メニューにカーソルを乗せると下線が出てくる*/
.menu-header .menu-item:hover{
	 border-bottom:3px solid #ff8000 !important;/*線の太さ色*/
	    transition: all .3s;/*線が出てくる時間*/
}
.sub-menu .menu-item:hover{
	border-bottom:none !important;
}
/*メニューにカーソルを乗せると下線が出てくるここまで*/

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

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

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

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