@charset "UTF-8";

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

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

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*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){
  /*必要ならばここにコードを書く*/
}



/*------------------------------------------------------------
16、文字列の前にアイコン 賢威6.2より
-------------------------------------------------------------*/

/*------------------------------------------------------------
6、font-size・・・フォントサイズの設定
-------------------------------------------------------------*/

.b{ font-weight: bold!important; }/*太字*/
.normal{ font-weight: normal!important; }/*太字を解除*/

.big{ font-size: 1.2em!important; }
.big2{ font-size: 1.5em!important; }
.big3{ font-size: 1.8em!important; }
.small{ font-size: 0.8em!important; }

.f08em{ font-size: 0.8em; }
.f09em{ font-size: 0.9em; }
.f10em{ font-size: 1.0em; }
.f11em{ font-size: 1.1em; }
.f12em{ font-size: 1.2em; }
.f13em{ font-size: 1.3em; }
.f14em{ font-size: 1.4em; }
.f15em{ font-size: 1.5em; }
.f16em{ font-size: 1.6em; }
.f17em{ font-size: 1.7em; }
.f18em{ font-size: 1.8em; }
.f19em{ font-size: 1.9em; }
.f20em{ font-size: 2.0em; }
.f21em{ font-size: 2.1em; }
.f22em{ font-size: 2.2em; }
.f23em{ font-size: 2.3em; }
.f24em{ font-size: 2.4em; }

.f8pt{ font-size: 8.5pt!important; }
.f9pt{ font-size: 9.0pt!important; }
.f10pt{ font-size: 10pt!important; }
.f11pt{ font-size: 11pt!important; }
.f12pt{ font-size: 12pt!important; }
.f13pt{ font-size: 13pt!important; }
.f14pt{ font-size: 14pt!important; }
.f15pt{ font-size: 15pt!important; }
.f16pt{ font-size: 16pt!important; }
.f17pt{ font-size: 17pt!important; }
.f18pt{ font-size: 18pt!important; }
.f19pt{ font-size: 19pt!important; }
.f20pt{ font-size: 20pt!important; }
.f21pt{ font-size: 21pt!important; }
.f22pt{ font-size: 22pt!important; }
.f23pt{ font-size: 23pt!important; }
.f24pt{ font-size: 24pt!important; }


/*------------------------------------------------------------
7、color・・・フォントカラーの設定
-------------------------------------------------------------*/

.red{ color: #ff0000!important; }/*赤*/
.blue{ color: #0000dd!important; }/*青*/
.green{ color: #008000!important; }/*緑*/
.yellow{ color: #ffff00!important; }/*黄*/
.navy{ color: #1F26A9!important; }/*紺*/
.orange{ color: #ff6600!important; }/*橙*/
.pink{ color: #cc6699!important; }/*ピンク*/
.purple{ color: #660099!important; }/*紫*/
.olive{ color: #808000!important; }/*黄土色*/
.lime{ color: #00ff00!important; }/*黄緑*/
.aqua{ color: #167FA6!important; }/*水色*/
.black{ color: #000!important; }/*黒*/
.gray{ color: #ccc!important; }/*灰*/
.white{ color: #fff!important; }/*白*/


.arrowr{
	padding: 0 0 0 30px!important;
	background: url(./images/icon2/icon-arrow-r.png) left 3px no-repeat;
}

.caution1{
	padding: 10px 0 10px 60px!important;
	background: url(./images/icon2/icon-check01.png) left top no-repeat;
}

.caution2{
	padding: 10px 0 10px 60px!important;
	background: url(./images/icon2/icon-check02.png) left top no-repeat;
}

.caution3{
	padding: 10px 0 10px 60px!important;
	background: url(./images/icon2/icon-point01.png) left top no-repeat;
}

.caution4{
	padding: 10px 0 10px 60px!important;
	background: url(./images/icon2/icon-point02.png) left top no-repeat;
}

.caution5{
	padding: 7px 0 7px 45px!important;
	background: url(./images/icon2/icon-check03.png) left top no-repeat;
}

.caution6{
	padding: 7px 0 7px 45px!important;
	background: url(./images/icon2/icon-point03.png) left top no-repeat;
}

.caution7{
	padding: 10px 0 10px 60px!important;
	background: url(./images/icon2/icon-check07.png) left top no-repeat;
}

.caution8{
	padding: 10px 0 10px 60px!important;
	background: url(./images/icon2/icon-check08.png) left top no-repeat;
}

/*初心者マーク*/
.wakaba{
	padding: 7px 0 7px 36px!important;
	background: url(./images/icon2/icon-wakaba.png) left top no-repeat;
}

/*メールアイコン*/
.mail{
	padding: 0 0 0 36px!important;
	background: url(./images/icon2/icon-mail.png) left top no-repeat;
}

/*PDFアイコン*/
.pdf{
	padding: 7px 0 7px 36px!important;
	background: url(./images/icon2/icon-pdf.png) left top no-repeat;
}

/*PDFアイコン小*/
.pdfs{
	padding: 2px 0 2px 20px!important;
	background: url(./images/icon2/icon-pdf-16.png) left top no-repeat;
}

/*ZIPアイコン*/
.zip{
	padding: 7px 0 7px 36px!important;
	background: url(./images/icon2/icon-zip.png) left top no-repeat;
}



/*小さいRSSアイコン*/
.rss-mini{
	padding-left: 16px!important;
	background: url(./images/icon2/icon-rss-orange.png) left 5px no-repeat;
}

/*後ろにメールアイコン*/
.mail-back{
	padding: 0 34px 0 0!important;
	background: url(./images/icon2/icon-mail.png) right top no-repeat;
}

/*後ろにPDFアイコン*/
.pdf-back{
	padding: 10px 34px 10px 0!important;
	background: url(./images/icon2/icon-pdf.png) right top no-repeat;
}

/*後ろにZIPアイコン*/
.zip-back{
	padding: 10px 34px 10px 0!important;
	background: url(./images/icon2/icon-zip.png) right top no-repeat;
}

/*後ろにRSSアイコン*/
.rss-back{
	padding: 5px 26px 5px 0!important;
	background: url(./images/icon2/icon-rss02.png) right top no-repeat;
}



/*Twitter-Digestプラグイン用*/
ul.ws_tweet_list{
margin:0;
}

ul.ws_tweet_list li.ws_tweet{
padding:5px 0;
border-bottom:#cccccc 1px solid;
list-style:none;
}

/* new clearfix */
ul.ws_tweet_list li.ws_tweet:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}

ul.ws_tweet_list a.ws_tweet_time{
float:left;
width:95px;
}

ul.ws_tweet_list li span{
float:left;
width:550px;
}
/*Twitter-Digestプラグイン用ここまで*/

/*動画表示用*/
.movie_center {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    margin: 0 auto 24px 0;
}
.movie_center iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/*動画表示用ここまで*/


/**カルーセル画像高さ**/
.carousel-entry-card-thumb{
height:110px;
}
/**カルーセル背景透明**/ .carousel-in{
background-color:transparent;
}
/**カルーセル左右矢印の色・大きさ**/
.carousel .slick-arrow:before{
color:#1b325f;
font-size:28px;
}
/**カルーセル記事タイトル文字**/
.carousel-entry-card-title{
margin-top:10px;
color:#339cff;
font-weight:normal;
max-height: 5.2em;
}


/*****************************
** ■ランキング文字大きさ
*****************************/
.nwa .ranking-item-name-text, .nwa .widget_item_ranking .main-widget-label {
    font-size: 16px;
}


/*****************************
** ■スタイルラベル色変更
*****************************/
.bct-related .blogcard::before{/*関連記事*/
	background-color:#00008b;
}
.bct-reference .blogcard::before{/*参考記事*/
	background-color:#ff8c00;
}
.bct-popular .blogcard::before{/*人気記事*/
	background-color:#dc143c;
}
.bct-together .blogcard::before{/*あわせて読みたい*/
	background-color:#3cb371;
}
.bct-detail .blogcard::before{/*詳細はこちら*/
	background-color:#c71585;
}
.bct-check .blogcard::before{/*チェック*/
	background-color:#d2691e;
}
.bct-pickup .blogcard::before{/*ピックアップ*/
	background-color:#8b008b;
}
.bct-official .blogcard::before{/*公式サイト*/
	background-color:#ffd700;
}


/*****************************
** ■サイドバー文字大きさ
*****************************/
#sidebar {
    font-size: 15px;
}

/************************************
** ■サイドバータイトル カスタマイズ
************************************/
#sidebar h3{
  color: #333; /*フォントカラー*/
  background: #f0f8ff; /*背景カラー*/
	  font-size: 16px; /*フォントサイズ*/
  margin: 10px 0px 20px 0px;
  padding: 10px 10px 10px 10px;
  border-left: 6px solid #66B5FF; /*左ラインの太さとカラー*/
  border-bottom: 1px solid #66B5FF; /*アンダーラインの太さとカラー*/
  line-height: 100%;
}

/************************************
** ■サイドバータイトル スライドインボタン設定時カスタマイズ
************************************/
#sidebar-menu-content h3{
  color: #333; /*フォントカラー*/
  background: #f0f8ff; /*背景カラー*/
	  font-size: 16px; /*フォントサイズ*/
  margin: 10px 0px 20px 0px;
  padding: 10px 10px 10px 10px;
  border-left: 6px solid #66B5FF; /*左ラインの太さとカラー*/
  border-bottom: 1px solid #66B5FF; /*アンダーラインの太さとカラー*/
  line-height: 100%;
}

/*****************************
** ■目次カスタマイズ
*****************************/
.toc {
  border: 2px solid #66B5FF; /*全体の枠線の色*/
  font-size: 14px; /*フォントサイズ*/
  line-height: 1.5; /*行の高さ指定*/
  padding: 0;
  margin-top: 3em; /*目次上の空間*/
  margin-bottom: 1em; /*目次下の空間*/
  min-width:65%; /*目次横幅*/
  border-radius: 6px;/*角丸コーナー*/
  background: #f0f8ff; /*背景カラー*/
  box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.3); /*シャドー（影）*/
}
@media screen and (max-width: 1030px){
  .toc {
    min-width:100%; /*モバイル時の目次横幅*/
  }
}
.toc-title {
  background: #66B5FF; /*目次タイトル背景カラー*/
  color: #fff; /*目次タイトルフォントカラー*/
  font-size: 16px; /*目次タイトルフォントサイズ*/
  text-align: center; /*目次タイトル中央寄せ*/
  padding: 6px 16px;
  font-weight: bold; /*文字強調*/
  font-style: oblique; /*斜体フォント*/
}
.toc-title::before {
  font-family: FontAwesome;
  content: '\f0f6'; /*目次タイトルのアイコン指定*/
  margin-right: 0.3em;
  font-weight: 500; /*アイコンの太さ*/
  font-style: normal; /*通常フォント*/
}
.toc-content {
  padding: 6px;
}
.toc-content li a:hover {
  text-decoration:none; /*選択時装飾無し*/
  background: #99ceff; /*選択時の背景カラー*/
  transition: all 0.8s ease; /*ふわっと変化するアニメーション*/
}
.toc ul.toc-list>li, .toc ol.toc-list>li {
  margin-top: 0.4em; /*h2の上側の空間*/
}
.toc ul.toc-list>li>a, .toc ol.toc-list>li>a {
  border-bottom: 1px solid #66B5FF; /*h2のアンダーラインの太さとカラー*/
  font-weight: bold;
}
.toc ul li a, .toc ol li a {
  display: block;
  border-bottom: 1px dotted #66B5FF; /*h3～h6のアンダーラインの太さとカラー*/
  margin-left: -20px; /*アンダーライン調整*/
  padding-left: 20px; /*アンダーライン調整*/
}

/*YouTubeレスポンシブサイズ*/
.youtube {
    position: relative;
    max-width: 100%;
    padding-top: 56.25%;
}
.youtube iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}