@charset "UTF-8";

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

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

/*h1～h6の見出しの変更*/
/*見出しデザインリセット*/
.article h2,
.article h3,
.article h4,
.article h5,
.article h6,
.sidebar h3{
	background-color:initial;/*背景色リセット*/
	border:initial;/*上下左右の枠線リセット*/
	border-radius:initial;/*角の丸みリセット*/
}

.article h1 {
 font-size: 24px;/*文字サイズ*/
 color: #005050;/*文字色*/
 padding: 1rem 0;
 text-shadow: #fff 1px 0, #fff -1px 0, #fff 0 -1px, #fff 0 1px, #fff 1px 1px, #fff -1px 1px, #fff 1px -1px, #fff -1px -1px, #fff 0px 1px, #fff 0px 1px, #fff 0px -1px, #fff 0px -1px, #fff 1px 0px, #fff -1px 0px, #fff 1px -0px, #fff -1px -0px, rgba(0, 0, 0, .3) 1.5px 1.5px 1.5px;
}
.article h1:before {
 font-size: 24px;
 content: '◆';
 color: #00A3A3;
 text-shadow:initial;
 margin-right: 1rem;
}
.article h1:after {
 font-size: 24px;
 content: '◆';
 color: #00A3A3;
 text-shadow:initial;
 margin-left: 1rem;
}

.article h2 {
 position: relative;
 font-size: 22px;/*文字サイズ*/
 color: #005050;/*文字色*/
 margin: 1.5rem 0 1rem;/*上のスペース、上／左右／下*/
 padding: 0.5rem 1.5rem;/*周囲のスペース*/
 display: inline-block;/*下線を文字の幅に*/
 border-bottom: 2.5px solid #00A3A3;/*下線、太さ、種類、色*/
}
/*四角の装飾*/
.article h2::before {
    position: absolute;
    top: 0;
    left: .3em;
    transform: rotate(55deg);
    height: 11px;
    width: 12px;
    background: #00A3A3;
    content: '';
}
.article h2::after {
    position: absolute;
    transform: rotate(15deg);
    top: .6em;
    left: 0;
    height: 8px;
    width: 8px;
    background: #00A3A3;
    content: '';
}

.article h3{
font-size: 20px;
margin: 1.5rem 0 1rem;/*上のスペース、上／左右／下*/
padding: 0.5em 0.5em;/*文字の上下 左右の余白*/
color: #005050;/*文字色*/
border-left: 6px solid #00A3A3;/*左線*/
}

.article h4{
font-size: 20px;
margin: 1.5rem 0 1rem;/*上のスペース、上／左右／下*/
padding: 0.5em 0.5em;/*文字の上下 左右の余白*/
color: #005050;/*文字色*/
border-left: 4px dotted #00A3A3;/*左線*/
}

.article h5{
 font-size: 18px;
 color: #005050;/*文字色*/
 margin: 1.5rem 0 1rem;/*上のスペース、上／左右／下*/
 padding: 0.5em 0.5em;/*文字の上下 左右の余白*/
 display: inline-block;/*下線を文字の幅に*/
 border-bottom: 3px solid #00A3A3
}

.article h6{
 font-size: 18px;
 color: #005050;/*文字色*/
 margin: 1.5rem 0 1rem;/*上のスペース、上／左右／下*/
 padding: 0.5em 0.5em;/*文字の上下 左右の余白*/
 display: inline-block;/*下線を文字の幅に*/
 border-bottom: 3px dotted #00A3A3
}

.sidebar h3 {
 color: #005050;
 padding: 0.5rem 0.5rem;
 border-top: 2px solid #00A3A3;
 border-bottom: 2px solid #00A3A3;
}

/* スライドイン背景色（モバイル） */
.mobile-menu-buttons {
background: rgba(130,210,200,0.8); /* RGBA形式 */
}

/*タブボックスの見出しを上書き*/
.bb-break::before {
content: "\f118  INFOMATION";
}
.bb-amazon::before {
content: "\f133  EVENT";
}

/*グローバルメニューデザイン*/
nav#navi, .menu-header .sub-menu{
    font-weight: 400;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,0.2);
}
.menu-header .sub-menu .item-label{
    font-size: 80%;
}
.menu-header .item-label{
     color: #ffffff !important;
}
.menu-header .current-menu-item,
.menu-header .current-post-item,
.menu-header .current-menu-ancestor,
.menu-header .current-post-ancestor,
.menu-header .menu-item:hover {
    color: #333 !important;
    border-bottom: 3px solid #55ffdd;
    transition: all .2s ease;
}
.menu-header .sub-menu .menu-item,
.menu-header .sub-menu .menu-item:hover{
    border-bottom: none;
}
.menu-header .current-menu-item>a .item-label,
.menu-header .current-post-item>a .item-label,
.menu-header .current-menu-ancestor>a .item-label,
.menu-header .current-post-ancestor>a .item-label,
.menu-header .item-label:hover{
    color: #005050 !important;
    transition: all .2s ease;
}
/* フロントページ・固定ページの各要素非表示 */
.home.page .entry-title{
  display: none;
}
.page .sns-share,
.page .sns-follow,
.page .date-tags{
  display: none;
}

/*SNSボタンを丸くする*/
#main .button-caption {
	display: none; /*キャプション非表示*/
}
/*SNSシェアボタン*/
.sns-share-message{
	font-weight: bold; /*太字*/
}
.sns-share-buttons {
	flex-wrap: nowrap; /*折り返さない*/
	justify-content: center; /*中央寄せ*/
}
.sns-share-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-share a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/*SNSフォローボタン*/
.sns-follow-message{
 font-weight: bold; /*太字*/
}
.sns-follow-buttons {
	justify-content: center; /*中央寄せ*/
}
.sns-follow-buttons a {
	border-radius: 50%; /*丸くする*/
	font-size: 20px; /*アイコンのサイズ*/
	margin: 0 10px; /*ボタン同士の間隔*/
}
#main .sns-follow a {
	width: 40px; /*ボタンの横幅*/
	height: 40px; /*ボタンの高さ*/
}

/**申し込みフォーム */
table.cf7-seminar{
	width:85%;
	margin:0 auto;
	margin-bottom:100px
	border: 3px solid #e5e5e5;
}

.single .entry-content table.cf7-seminar,
.page .entry-content table.cf7-seminar-policy, .single table.cf7-seminar-policy,
.page .entry-content table.cf7-seminar{
display:table;
}

/*日程整列 */
.cf7-seminar .wpcf7-list-item{
	display:block;	
	margin:.5em 0;
}

/*入力欄の色*/
.cf7-seminar input, .cf7-seminar textarea {
	border: 1px solid #d8d8d8;
	border-radius:5px;
}
.cf7-seminar ::placeholder {
	color:#797979;
}

/*「必須」文字*/
.cf7-req{
	font-size:.9em;
	padding: 5px;
	background: #ff8787;/*リンク色*/
	color: #fff;
	border-radius: 3px;
	margin-right:1em;
}

/*区切り線*/
.cf7-seminar tr{
	border-top: 1px solid #e5e5e5;
}

/*タイトル背景色*/
.cf7-seminar th{
	background-color:#ebedf5;
	text-align:left;
}

/*プライバシーポリシー欄*/
table.cf7-seminar-policy{
	margin:0 auto;
	text-align:center;
	width:85%;
}
.cf7-seminar-policy p{
	margin-bottom:0;
}

.cf7-seminar-policy td ,.cf7-seminar-policy th{
border:none!important;
}

.privacy-box{
	height:200px;
	width:85%;
	margin:0 auto;
	overflow-y:scroll;
	border:2px solid #ddd;
	background-color:#fff2dd;/*選択文字背景色*/
	border-radius:.5em;
	line-height:1.3em;
	font-size:.9em;
	margin-bottom:1.5em;
	text-align:left;
}
.coment-box{
	width:85%;
	margin:0 auto;
	text-align:left;
}
	
	
/* 「送信する」ボタン */
.cf7-btn input.wpcf7-submit {
	background-color:#ff8787;/*リンク色*/
	width:85%;
	margin:0 auto;
	border:0;
	color:#fff;
	font-size:1.2em;
	font-weight:bold;
	margin:20px 0 100px 0; 
}
.cf7-btn{
	text-align:center;
}
.wpcf7-spinner{
	width:0;
	margin:0;
}

/* メッセージの文字*/
.wpcf7-not-valid-tip,
.wpcf7-response-output.wpcf7-validation-errors {
color: #ff8787;
}

/*申し込みフォーム レスポンシブ */
@media screen and (max-width: 768px){
	table.cf7-seminar, table.cf7-seminar-policy{
		width:100%;
	}
	
	table.cf7-seminar{
		border:2px solid #e5e5e5;
	}
		
	.cf7-seminar tr, .cf7-seminar td, .cf7-seminar th{
		display: block;
		width: 100%;
		line-height:2.5em;
	}


/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*768px以上でボックスを80％*/
@media screen and (min-width: 768px){
.information-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.question-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.memo-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.alert-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.ok-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.ng-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.good-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.bad-box {
 width: 80%;
 margin: 1rem auto 1rem
}

.primary-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.secondary-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.success-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.info-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.warning-box {
 width: 80%;
 margin: 1rem auto 1rem
}
.danger-box {
 width: 80%;
 margin: 1rem auto 1rem
}

/* レスポンシブ */
@media screen and (max-width: 768px){
	table.cf7-seminar, table.cf7-seminar-policy{
		width:100%;
	}
	
	table.cf7-seminar{
		border:2px solid #e5e5e5;
	}
		
	.cf7-seminar tr, .cf7-seminar td, .cf7-seminar th{
		display: block;
		width: 100%;
		line-height:2.5em;
	}
}

/*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){
  /*必要ならばここにコードを書く*/
}