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

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

/* ▼▼ヘッダーのロゴの下のスペースの設定▼▼ */
/* ヘッダーのロゴの下のスペースを削除 */
.logo-image * {
  display: block;
}
.logo-image {
  padding: 0;
}

/* ▲▲ヘッダーのロゴの下のスペースの設定▲▲ */

/* ▼▼グローバルメニューのスタイル設定▼▼ */
/*グローバルメニューの文字の設定*/
.navi-in .menu-header .item-label{
	/* font-size: 18px; */
	font-weight: bold;
	color: #ffffff;
	
	/* 文字に枠を設定 */
	/*text-shadow: 1px 1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,-1px -1px 0 #fff;
	padding-left: 1px;
	padding-right: 1px;*/
	
}


/* グローバルメニュー各項目間区切り線（両端区切り有）*/
.navi-in > ul > li{
	border-right: 1px solid #fffafa;
	background: #00a1e0;				/*グローバルメニューの背景色*/
	background: #81d742;
	
}
.navi-in > ul > li:first-child{
	  border-left: 1px solid #fffafa;
}


/*グローバルメニューに影*/
nav#navi, .menu-header .sub-menu{
	box-shadow:0 5px 12px -5px rgba(0,0,0,.6);
}


/* グローバルメニューの文字の左右のマージン設定 */
#navi .navi-in > .menu-header{
	margin: 0px 1px;
}

/*グローバルメニューの背景画像の設定*/
/*
#navi .navi-in>.menu-header{
	background-image: url("/wp-content/themes/cocoon-child-master/images/global_menu_218x40_001.png");
	background-repeat: repeat;
}
*/


/*グローバルメニューにマウスオーバー時 背景色と文字色が変わる*/
/*青系
#navi .navi-in a:hover{
	color: #ffffff;
	background: #137AA2;
	transition: 0.0s ;
}
*/

#navi .navi-in a:hover{
	color: #ffffff;
	background: #13A27A;
	transition: 0.0s ;
}


/*グローバルメニューのサブメニューの色を設定*/
#navi .navi-in > .menu-header .sub-menu{
	background: #808080;
}

/* ▲▲グローバルメニューのスタイル設定▲▲ */


/* ▼▼見出しの設定▼▼ */


/* ▼▼H1の設定 */


/*
h1 {
  background-image: -webkit-gradient(linear, left top, right top, from(#00a1e0), to(#137aa2));
  background-image: -webkit-linear-gradient(left, #00a1e0 0%, #137aa2 100%);
  background-image: linear-gradient(to right, #00a1e0 0%, #137aa2 100%);

	
	position: relative;
  overflow: hidden;
  padding: 1.5rem 2rem 1.5rem 1em;
  border: 3px solid #000;
  border-radius: 100vh 0vh 0vh 100vh;
}
*/
.article h1{
/*	padding: 1rem;
	border-top: 1px dotted #ffffff;
	border-right:  0px;*/
	font-weight:bold;
	/*青系
	color: #004080;
	*/
	color: #008040;
	
	/*box-shadow:0 5px 12px -5px rgba(0,0,0,.6);*/
	box-shadow: 0px 5px 10px -7px rgba(0,161,224,1);
	box-shadow: 0px 5px 12px -7px rgba(0,0,0,.5);
	border-radius: 100vh 0 0 100vh;
	padding: 1rem 2rem 1rem 0.9em;
}


/*
h1 span {
  font-size: 30px;
  font-size: 3rem;
  line-height: 50px;
  position: absolute;
  top: calc(50% - 25px);
  left: 10px;
  display: block;
  width: 50px;
  height: 50px;
  color: #fff;
  border-radius: 50%;
  background: #000;
}
*/


/* ▲▲H1の設定 */


.article h2 {
	position: relative;
  	/*display: inline-block;*/
  	padding: 1rem 2rem 1rem 1em;
  	color: #fff;
  	border-radius: 100vh 0 0 100vh;
  	/*background: #fa4141;*/
	/* 青系グラデーション背景色
	background-image: -webkit-linear-gradient(left, #00a1e0 0%, #137aa2 100%);
	background-image: -o-linear-gradient(left, #00a1e0 0%, #137aa2 100%);
	background-image: linear-gradient(to right, #00a1e0 0%, #137aa2 100%);
	*/
	background-image: -webkit-linear-gradient(left, #81d742 0%, #81d742 100%);
	background-image: -o-linear-gradient(left, #81d742 0%, #81d742 100%);
	background-image: linear-gradient(to right, #81d742 0%, #81d742 100%);
	
	
}

	
/*
.article h2:before {
  position: absolute;
  top: calc(50% - 4px);
  left: 3px;
  width: 8px;
  height: 8px;
  content: '';
  border-radius: 100%;
  background: #fff;
}
*/
/*
.article h2:after {
  position: absolute;
  top: calc(10%);
  right: 0px;
  width: 16px;
  height: 80%;
  content: '';
  background-image: -webkit-gradient(linear, left top, right top, from(#ffffff), to(#137aa2));
  background-image: -webkit-linear-gradient(left, #ffffff 0%, #137aa2 100%);
  background-image: linear-gradient(to right, #00a1e0 0%, #137aa2 100%);
}
*/


/*
.article h2 {
*/
    /*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
/*
    position: relative;
    color: #202122;
    background-image: -webkit-linear-gradient(bottom, #CCCCCC 0%, #F5F5F5 60%);
    background-image: -o-linear-gradient(bottom, #CCCCCC 0%, #F5F5F5 60%);
    background-image: linear-gradient(to top, #CCCCCC 0%, #F5F5F5 60%);
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1;
    margin: 20px 0 30px 0;
    padding: 10px 5px 10px 20px;
    box-shadow: 2px 4px 5px 0px #98a0ab;
    border-top: 5px solid #137aa2;
    border-left: 3px solid #137aa2;
}
*/



.article h3{
	/*青系
	color: #004080;*/
	color: #008040;
	position: relative;
  	overflow: hidden;
	border: 3px solid #00a1e0;
	background: #ffffff;
	border-left: 4px solid #00a1e0;
	border-right: none;
 	border-radius: 2vh 0vh 0vh 2vh;
	padding: 0.8rem 2rem 0.8rem 1em;
	
}

/*
.article h3:after {
  position: absolute;
  top: calc(15%);
  right: 0px;
  width: 16px;
  height: 70%;
  content: '';
  background-image: -webkit-gradient(linear, left top, right top, from(#00a1e0), to(#137aa2));
  background-image: -webkit-linear-gradient(left, #00a1e0 0%, #137aa2 100%);
  background-image: linear-gradient(to right, #ffffff 0%, #00a1e0 100%);
}
*/

.article h4{
	/青系*
	color: #004080;*/
	color: #008040;
	position: relative;
  	overflow: hidden;
	border: 1px solid #00a1e0;
	border-bottom: 1px solid #00a1e0;
	border-left: 4px solid #00a1e0;
	border-right: none;
 	border-radius: 10vh 0vh 0vh 10vh;
	padding: 0.6rem 2rem 0.6rem 1.1em;
}

/*
.article h4:after {
  position: absolute;
  top: calc(15%);
  right: 0px;
  width: 4px;
  height: 70%;
  content: '';
  background-image: -webkit-gradient(linear, left top, right top, from(#00a1e0), to(#137aa2));
  background-image: -webkit-linear-gradient(left, #00a1e0 0%, #137aa2 100%);
  background-image: linear-gradient(to right, #ffffff 0%, #00a1e0 100%);
}
*/


.article h5{
	/*青系
	color: #004080;*/
	color: #008040;
	position: relative;
  	overflow: hidden;
	border: 1px solid #00a1e0;
	border-bottom: 1px solid #00a1e0;
	background: #ffffff;
	/*border-left: none;*/
	border-right: none;
	/*border-top: 1px solid #137aa2;*/
	
 	border-radius: 100vh 0vh 0vh 100vh;
	padding: 0.4rem 2rem 0.4rem 1.3em;
}

.article h6{
	/*青系
	color: #004080;*/
	color: #008040;
	position: relative;
  	overflow: hidden;
	border: 1px solid #00a1e0;
	background: #ffffff;
	border-left: none;
	border-top: none;
	border-right: none;
 	border-radius: 100vh 0vh 0vh 100vh;
	padding: 0.4rem 2rem 0.4rem 1.3em;
	
}

/* ▲▲見出しの設定▲▲ */

.fdt-logo{
	/*青系
	border-top: 1px solid #137aa2;*/
	border-top: 1px solid #13a27a;
}

.footer .cf{
		
		
		padding-top: 8px;
		padding-bottom: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
		/*padding: 0rem 0rem 0rem 0em;*/

	
	}



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

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

	/* ▼▼モバイルサイトのキャッチコピーのコンテナ上下のスペースを設定▼▼ */
	#header-container{
		padding: 8px 0px 0px 0px;
		margin: 0px;
		
	}
	.tagline{
		padding: 0px 0px 0px 0px;
		margin: 0px;
	}
	/* ▲▲モバイルサイトのキャッチコピーのコンテナ上下のスペースを設定▲▲ */
	
	/* ▼▼モバイルサイトのメイン部分の上下のスペースを設定▼▼ */
	#main{
		padding-top: 0px;
		padding-bottom: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
	}

	
	#content{
		
		padding-top: 0px;
		padding-bottom: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
	}
	/* ▲▲モバイルサイトのメイン部分の上下のスペースを設定▲▲ */
	
	/* ▼▼モバイルサイトのフッター部分の上下のスペースを設定▼▼ */
	

	/* フッターに区切り線(border)を表示させない */
	.fdt-logo{
	/*青系
	border-top: 0px solid #137aa2;*/
	border-top: 0px solid #13a27a;
	}

	
	
	#footer{
		
		padding-top: 0px;
		padding-bottom: 0px;
		margin-top: 0px;
		margin-bottom: 0px;
		position: relative;
		padding: 0rem 0rem 0rem 0em;
		/*青系
		color: #137aa2;*/
		color: #13a27a;
		/*border-radius: 100vh 0 0 100vh;*/
		/*
		background-image: -webkit-gradient(linear, left top, right top, from(#D7F3FF), to(#C1E8F7));
		background-image: -webkit-linear-gradient(left, #D7F3FF 0%, #C1E8F7 100%);
		background-image: linear-gradient(to right, #D7F3FF 0%, #C1E8F7 100%);
		*/
		
		/*青系
		border-top: 1px solid #137aa2;*/
		border-top: 1px solid #13a27a;
		
	}
	
	/* ▲▲モバイルサイトのフッター部分の上下のスペースを設定▲▲ */

	
	
}

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


	
}
