@charset "utf-8";
/*
	Theme Name: diver_child
	Template: diver
	Description:  Diverの子テーマです。
	Theme URI: http://tan-taka.com/diver/
	Author: Takato Takagi
 */

/* フォント変更 */
*, *:before, *:after {
    font-family:  Arial,メイリオ, Meiryo,游ゴシック体, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic",FontAwesome, sans-serif;
}

/* 表 */
.hatenablogcard{
  clear:both;
  width:100%;
  height:155px;
  margin:10px 0;
  max-width:680px;
}

/* マーカー強調カスタマイズ */
.marker1 {
 background: linear-gradient(transparent 65%, #a0d8ef 65%);
font-weight:bold;
}

/* マーカー強調カスタマイズ */
.marker2 {
 background: linear-gradient(transparent 65%, #f09199 65%);
font-weight:bold;
}

.marker3 {
 background: linear-gradient(transparent 65%, #f8e58c 65%);
font-weight:bold;
}

/* 複数テーブル */
.table1{
width:100%; /* 画面の幅に合わせる */
text-align: center; /* 中央寄せ */
border-collapse: collapse; /* 隣接するボーダー線を重ねる */
overflow:scroll; /* スクロールバー表示 */
overflow-y:hidden; /* 縦スクロール非表示 */
white-space: nowrap; /* 改行なし */
}
.table1::-webkit-scrollbar{ 
 height: 9px; /* スクロールバーの太さ */
}
.table1::-webkit-scrollbar-thumb { 
background: #b0c4de; /* スクロールバーのカラー */
border-radius: 4px; /* スクロールバーの角に丸み */ 
}

.table1 th{
color:#fff;  /* 好きなフォントカラーへ変更してください */
background:#71abb7!important;  /* 好きな背景カラーへ変更してください */
font-size:16px;  /* 好きなフォントサイズへ変更してください */
padding:10px;  /* マス目に余白を開ける */
border: solid 1px #e8e8e8;  /* 見出し周りをボーダー線で囲む */
} 
/* 奇数行の背景カラー */
.table1  tr:nth-child(odd){
 background:#f5f5f5; /* 好きな背景カラーへ変更してください */
 }
 /* 偶数行の背景カラー */
 .table1 tr:nth-child(even){
 background:#ffffff/* 好きな背景カラーへ変更してください */ }
/* マウスオーバー時の背景カラー*/
.table1 tr:hover{
background:#f0f8ff;/* 好きな背景カラーへ変更してください */
}
.table1 td{
border: solid 1px #e8e8e8;/* データ用セル（td）の区切り線  */
 padding:10px;/* セル内に余白を空ける */
font-size:14px;
} 
.table1 caption{
font-size:17px !important;
}

/* 2列テーブル */
.table2{
width:100%; /* 画面の幅に合わせる */
text-align:center; /* 中央寄せ */
}
.table2 th{
background:#71abb7;
font-size:15px;
color: #fff;
padding-top:10px;
padding-bottom:10px;
width:30%; /* 幅を指定 */
white-space: nowrap; /* 改行なし */
}
.table2 td{
padding:10px;
border: solid 1px #d7d7d7;
font-size:14px;
text-align:left;
}
.table2 tr:hover{
background:#ffffe0;
}
/* スマホ用 */
/*
@media screen and (max-width:500px){
.table2 th,.table2 td{
width:100%;
display:block;
border-top:none;
}
.table2 tr:first-child th {
border-top: 1px solid #d7d7d7;
 }}
*/

/* Embedlyカードの幅変更と枠線追加*/
.embedly-card{
border: 1px solid #E6E6E6;
padding: 0px 0px 0px 0px;
background-color:#fffff0;
border-radius:10px;
}

/* ワンポイントBOX1 */
.point-box1 {
    position: relative;
    margin: 10px 10px;
    padding: 10px 12px;
    box-sizing: border-box;
    border: solid 3px #07689f;
    border-left-width: 50px;
}
.point-box1:before{
    display: inline-block;
    position: absolute;
    top: 50%;
    left: -35px;
    transform: -ms-translateY(-50%);
    transform: -webkit-translateY(-50%);
    transform: translateY(-50%);
    vertical-align: middle;
    content: "\f0a4";
    font-family: FontAwesome;
    color: #FFF;
    font-size:22px; 
    line-height: 1;
}
.point-box1 p {
    position: relative;
    padding: 0;
    margin: 10px 5px;
    z-index: 3;
    line-height: 1.7;
}

/* ラベルBOX1 */
.label-box1 {
    position: relative;
    margin: 40px 10px 15px;
    padding: 0.5em 1em;
    border: solid 3px #07689f;
}
.label-box1-title {
    position: absolute;
    display: inline-block;
    top: -30px;
    left: -3px;
    padding: 0px;
    height: 30px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 16px;
    background: #07689f;
    color: #ffffff;
    font-weight: bold;
    border-radius: 3px 3px 0 0;
}
.label-box1 p {
    margin: 0; 
    padding: 0;
}


/* ↓リスト表示にWebアイコンフォントを使う */
.entry-content ul.list_check{
padding: 0em 0em 0em 0.5em;
position: relative;
}

.entry-content ul.list_check li:before{
width: 0; /*リストマークを消す*/
height: 0; /*リストマークを消す*/
font-family: fontawesome; /*Webアイコンフォント*/
content:"\f058"; /*Webアイコンフォントのコード*/
position: absolute;
font-size: 1.2em; /*アイコンのサイズ*/
left: -0.4em; /*左端からのアイコンまで*/
line-height:12px; /*行間*/
color: #5ab9ff; /*アイコンの色*/
}
/* ↑リスト表示にWebアイコンフォントを使う */

/* ------------------------------------- */
/*         ボックス カスタマイズ         */
/* ------------------------------------- */

/* --------- シンプルボックス --------- */
.custom-box1 {
    position: relative;
    padding: 1em;
    background: #fff; /* ボックス背景色 */
    border: 2px solid #5ab9ff; /* 外枠の色 */
    border-radius: 8px;
}
.custom-box1-title {
    position: absolute;
    display: inline-block;
    padding: 0 9px;
    top: -13px;
    left: 20px;
    line-height: 1em;
    background: #fff; /* タイトル背景色 */
    color: #5ab9ff; /* タイトル文字色 */
    font-size: 19px;
    font-weight: bold;
}
.custom-box1 p {
    margin-bottom: .8em;
}
.custom-box1 p:last-child {
    margin-bottom: 0;
}
.c_box.blue_box{
	background: #fff; /* 背景色 */
}
/* --------- シンプルボックス --------- */

/* ↓アプリーチ */
.appreach{ border-top:1.5px solid #043d78;/*上線の色*/ border-bottom:1.5px solid #043d78;/*下線の色*/} 
.appreach { text-align: left; padding: 25px; overflow: hidden;margin-top:-25px; } 
.appreach:after { content: ""; display: block; clear: both; } 
.appreach img, 
.appreach p { margin: 0; padding:0; } 
.appreach a:after { display: none; } 
.appreach__icon { float: left; border-radius: 10%; overflow: hidden; margin: 0 3% 0 0 !important; width: 25% !important; height: auto !important; max-width: 120px !important; } 
.appreach__detail { display: inline-block; font-size: 20px; line-height: 1.5; width: 72%; max-width: 72%; } 
.appreach__detail:after { content: ""; display: block; clear: both; } 
p.appreach__name { font-size: 16px; color:#555; padding-bottom:10px; font-weight:bold; line-height: 1.5em !important; max-height: 3em; overflow: hidden; } 
.appreach__info { font-size: 12px !important; color:#888; } 
.appreach__info a{ color:#aaa; } 
.appreach__developper, 
.appreach__price { margin-right: 0.5em; } 
.appreach__posted a { margin-left: 0.5em; } 
.appreach__links { float: left; height: 40px; margin-top: 15px; white-space: nowrap; } 
.appreach__aslink img { margin-right: 10px; height: 40px; width: 135px; } 
.appreach__gplink img { height: 40px; width: 134.5px; } 
@media only screen and (max-width: 786px){ 
.appreach{ margin-top:-25px;} 
.appreach__info { font-size: 11px !important;} 
p.appreach__name { font-size: 15px;}} 
/* ↑アプリーチ */

/* --------- シンプル カテゴリ --------- */
.widget.widget_categories ul,
.widget.widget_nav_menu ul{
    padding-left: 1.3em;
}

.widget.widget_categories li:first-child,
.widget.widget_nav_menu li:first-child{
    border-top: 1px dotted rgba(125, 125, 125, 0.2);
}

.widget.widget_categories li ul ul a:first-child,
.widget.widget_nav_menu li ul ul a:first-child{
    border-top: 1px dotted rgba(125, 125, 125, 0.2);
}

/* --------- 親+子カテゴリ --------- */
.widget.widget_categories li a,
.widget.widget_nav_menu li a{
    padding: .7em 1.2em .7em 0.3em;
    color: #666; /* フォント色 */
    /*font-weight: bold;*/ /* フォント太字 */
}

.widget.widget_categories li a:before,
.widget.widget_nav_menu li a:before{
    font-family: FontAwesome;
    content:'\f138'; /* アイコン指定  */
    color: #71abb7; /* アイコン色 */
    padding-right: .3em;
    font-size: 1.3em;
    vertical-align:middle
}

.widget.widget_categories li a:after,
.widget.widget_nav_menu li a:after{
    color: #71abb7; /* li右端＞の色 */
}

/* --------- 子カテゴリのみ --------- */
.widget.widget_categories li ul li a,
.widget.widget_nav_menu li ul li a{
    color: #666; /* フォント色 */
    font-weight: normal; /* フォント通常 */
}

.widget.widget_categories  li ul li a:before,
.widget.widget_nav_menu li ul li a:before{
    font-family: FontAwesome;
    content:'\f0da'; /* アイコン指定 */
    color: #666; /* アイコン色 */
    font-size: 1.3em;
}

.widget.widget_nav_menu li ul li a{ /* 子カテゴリ 1層目 */
    padding-left: 2.0em;
}

.widget.widget_categories li ul a{ /* 子カテゴリ 1層目 */
    padding-left: 2.0em;
}

.widget.widget_categories li ul ul a,
.widget.widget_nav_menu li ul ul a{ /* 子カテゴリ 2層目 */
    padding-left: 3.5em;
}



/* --------- 目次 --------- */
#toc_container {
  margin-bottom: 40px;
  padding: 15px 20px;
  background: #fff;
  border: 5px solid #e1eff4;
  border-radius: 2px;
  color: #666; }

#toc_container .toc_title {
  font-family: "Unica One", cursive;
  text-align: center;
  margin-bottom: 35px;
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0px;
  font-size: 1.7em;
  border-bottom: 2px solid #dedede; }

#toc_container .toc_list {
  list-style-type: none !important;
  counter-reset: li; }

#toc_container .toc_list > li {
  position: relative;
  margin-bottom: 15px;
  padding-top:2px;
  margin-left: 30px;
  line-height: 1.3em;
  font-size: 0.9em; }

#toc_container .toc_list > li:after {
  counter-increment: li;
  content: counter(li) ;
  position: absolute;
  left: -35px;
  top: 0px;
  background: none;
  font-family: "Unica One", cursive;
  font-size: 1.4em;
  letter-spacing: 0px;
  color: #008db7; }

#toc_container .toc_list > li a {
  text-decoration: none !important; }

#toc_container .toc_list > li a:hover {
  text-decoration: underline !important; }

#toc_container .toc_list > li ul {
  list-style-type: disc;
  margin-top: 15px;
  color: #008db7; }

#toc_container .toc_list > li > ul li {
  font-size: 0.9em;
  margin-bottom: 8px; }

@media only screen and (min-width: 641px) {
  #toc_container {
    padding: 25px 40px; }

  #toc_container .toc_title {
    font-size: 2em; }

  #toc_container .toc_list > li {
    margin-bottom: 18px;
    margin-left: 50px;
    font-size: 1em; }

  #toc_container .toc_list > li:after {
    left: -48px;
    top: 0px;
font-size: 26px; } }


@media screen and (max-width: 768px){
/* タグクラウドをスマホでも表示 */
 .catpage_tag{
display:block;
width:100%;
padding:0;
}
/* タグの余白を詰める */
 .catpage_tag a{
padding:2px 5px;
}
/* 見出しの余白を詰める */
.catpage_content_wrap .catpage_inner_content{
padding:0;
}
}