@charset "UTF-8";
/*
 Theme Name: SANGO Child
 Theme URI: https://saruwakakun.design
 Author: SARUWAKA
 Author URI: https://saruwakakun.com
 Template: sango-theme
 Version: 3.0
*/
/*こちらはSANGOの子テーマ用CSSです。以下にCSSを記入していきましょう。*/

body {
	color: #070707;
	font-family: Verdana,Geneva,sans-serif;
}

/* ヘッダータイトルサイズ */
#logo {
    font-size: 16px;/*スマホサイズ*/
}
@media only screen and (min-width: 481px) {
   #logo {
       font-size: 32px;/*481px以上での表示サイズ*/
   }
}

/* ヘッダーロゴを中央寄せにする */
@media only screen and (min-width: 768px) {
	#logo {
		max-width: 500px;/*768px以上での表示サイズ*/
	}

	.header--center #logo {
		margin: 0 auto;
	}
}

/* タイトル下のギザギザ非表示 */
.nothumb .entry-meta:after, .nothumb .page-title:after {
    content: none;
}


/* ウィジェットを中央寄せにする（fb） */
.fb_iframe_widget {
	margin: 10px auto;
}


/* タイトル下の余白を調整（狭く） */
@media only screen and (min-width: 1030px) {
	.article-header {
		margin-top: 10px;
		margin-bottom: 10px;
	}
}
@media only screen and (min-width: 768px) {
	.entry-meta {
		padding-bottom: 0;
	}
}

/* 見出しの色の変更<h2></h2> */
#inner-content .hh15 {
    background: #0b173b;
}

#inner-content .hh15:before {
    border-right: solid 20px rgb(149, 158, 155);
}

/* 見出しの色の変更<h3></h3> */
#inner-content .hh16 {
    background: #063765;
}

#inner-content .hh16:before {
    border-right: solid 20px rgb(149, 158, 155);
}

/* 見出しの色の変更<h4></h4>　タグ風 */
#inner-content .hh10 {
	background: #084B8A;
	color:#fff;
}



/* 見出しの色の変更 記事下の関連記事やfb */
#inner-content .hh24 {
	color: #070707;
}

/* ボックスの色変更 水色二重線を紺の二重線に */
.box5 {
    border: double 5px #0b173b;
    color: #070707;
}
.box11 {
	color: #25293B;
}
/* ふせん枠 */
.box26 {
	border: solid 3px #55ADFF;
}
.box26 .box-title {
	color: #55ADFF;
}
.memo {
	color: #070707;
}

/*日本とCSS　2016/7/20*/
/*
*/
/***************************************************************************/
/* Yanai add カスタムCSS */
/***************************************************************************/
/* コピーライト用 */
span.copy {
	color: darkgray;
}

span.bgc-yellow {
	background-color: #FFFF00;
/* 黄色 */
}

/* 記事下のsns拡散ボタンのmsg */
p.sns_msg {
	margin: 40px 0 10px;
/* 外部：値を4つ指定した場合：記述した順に[上][右][下][左] */
}

.sns-group-top {
/*border-bottom: gray dotted 1px;*/
	padding-bottom: 10px;
	margin-bottom: 30px;
}

span.big {
	font-size: large;
	font-weight: bold;
}

span.big2 {
	font-size: x-large;
	font-weight: bold;
}

span.big3 {
	font-size: xx-large;
	font-weight: bold;
}

span.red {
	color: red;
	font-weight: bold;
}

span.red_big {
	color: red;
	font-size: large;
	font-weight: bold;
}

span.red_big2 {
	color: red;
	font-size: 20px;
	font-weight: bold;
}

span.bg_y {
	background: yellow;
	font-weight: bold;
}

span.bg_y_big {
	background: yellow;
	font-size: large;
	font-weight: bold;
}

/* サイドバーの殿堂入り記事のスタイル */
.widget_views {
	margin-left: 10px;
	/*font-weight: bold;*/
}

.widget_dendou .tbcell img {
	width: 80px;
}

.widget_dendou .linkto figure {
	width: 80px;
}

.widget_dendou .tbcell {
	font-size: .9em;
}


/* レスポンシブのアドセンス広告で幅336のレクタングルをPCで表示させる */
/*  2018/5/23試しに一ヶ月削除してみる 過去30日間のCTR 2.66％ CPC \21 向上するか実験→5/24CTRが2％切ったので一時中断 */
.responsive-unit {
	max-width: 336px;
	margin-left: auto;
	margin-right: auto;
}


/* ダブルレクタングル */
.ad_dbl {
	width: 704px;
	margin-bottom: 20px;
}

.ad_left,.ad_right{
	margin-left: 12px;
	display: inline;
	float: left;
}

.clear {
	clear: both;
}

/* キャラ（フウクマ）の吹き出し */
.color_fu{background:#ffffe0;}
.color_fu:after{border-right-color:#ffffe0;}
.color_fu:before{}

/* キャラ（パパクマ）の吹き出し */
.color_papa{background:#f0f8ff;}
.color_papa:after{border-right-color:#f0f8ff;}
.color_papa:before{}

/* 右側に顔（パパクマ）の場合は三角部分の色も指定する */
.right .sc:after {
    right: -20px;
    border-left-color: #f0f8ff;
}

/* 記事下のSHAREボタンを非表示に */
.footer-contents .sns-btn {
    display: none;
}

/* メインビジュアルの画像と文字を重ねるスタイル */
.main_visual_relative {
    position: relative;
    max-width: 100%;
}
.main_visual_absolute_text {
    position: absolute;
    top: 40px;
    color: #fff;
    background: rgba(0,0,0,.6);
    width: 100%;
    max-width: 100%;
    padding: 1em 0;
}
.main_visual_absolute_text p {
    margin: 0;
    padding: 0 0.8em;
    font-size: 180%;
    font-weight: bold;
    text-align: center;
}
