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

/*ロゴ画像を横全体に表示*/
#inner-header, #drawer + #inner-header,#logo{
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}
.header--center #logo img {
    padding: 0;
    height: auto;
    width: 100%;
    max-width: 1200px;
}
.header--center #logo {
    padding: 0;
}
/*END ロゴ画像を横全体に表示*/

/*ヘッダーメニューホバー線細く*/
.desktop-nav li:after {
    position: absolute;
    bottom: 7px;
    left: 12%;
    width: 75%;
    height: 1px;
    content: "";
    transition: transform .2s ease-in-out;
    transform: scale(0, 1);
    transform-origin: left top;
}
/*END ヘッダーメニューホバー線細く*/

/*見出しh2*/
.entry-content h2{
position: relative;
padding: 0.25em 1em;
border-top: solid 2px #DF013A;
border-bottom: solid 2px #DF013A;
}
.entry-content h2:before, .entry-content h2:after{
content: '';
position: absolute;
top: -7px;
width: 2px;
  height: -webkit-calc(100% + 14px);
height: calc(100% + 14px);
background-color: #DF013A;
}
.entry-content h2:before {left: 7px;}
.entry-content h2:after {right: 7px;}
/*END 見出しh2:/

/*見出しh3/
entry-content h3{
position: relative;
display: inline-block;
padding: 0 45px;
}
entry-content h3:before, entry-content h3:after{
content: '';
position: absolute;
top: 50%;
display: inline-block;
width: 44px;
height: 2px;
font-size: 17px;
background-color: #DF013A;
-moz-transform: rotate(-60deg);
-webkit-transform: rotate(-60deg);
-ms-transform: rotate(-60deg);
transform: rotate(-60deg);
}
h1:before {left:0;}
h1:after {right: 0;}
/*END 見出しh3*/

/*内部リンク*/
.linkto img{
border-radius : 50% ;
}
.linkto {
background: #ffeff3;
border: none;
}
.linkto div:before {
content: 'CHECK';
 font-size: 0.7em;
 font-weight: bold;
 color: #fff;
 background: #ffafc5;
 width: 5em;
 display: inline-block;
 padding: 0.2em;
 position: relative;
 top: -2px;
 text-align: center;
 margin-right: 0.5em;
 -webkit-border-radius: 2px;
 -moz-border-radius: 2px;
 border-radius: 2px;
}
/*END 内部リンク*/

/*ピンク蛍光ペン*/
.pink_pen {
background: linear-gradient(transparent 65%, #F7819F 10%);
padding-bottom: .2em;
font-weight:bold;
}
/*END ピンク蛍光ペン*/

/*--------------------------------------
  ふきだしの色を変える（←左）
--------------------------------------*/
.sc {
 border: solid 2px #df013a;/*ふきだしの線の色*/
 background: #FFEEFF;/*ふきだしの中の色*/
  color: #000000;/*文字の色*/
}
.sc:before {
 border: 12px solid transparent;
 border-right: 12px solid #df013a;/*ふきだしの線の色*/
 content: "";
}
.sc:after {
 display: inline-block;
 position: absolute;
 border: 12px solid transparent;
border-right: 12px solid #FFEEFF;/*ふきだしの中の色*/
content: "";
}

/*--------------------------------------
  ふきだしの色を変える（右→）
--------------------------------------*/
.right .sc {
 background: #FFEEFF ;/*ふきだしの中の色*/
  color: #000000;/*文字の色*/
}
.right .sc:before,
.right .sc:after {
 right: -23px;
 left: auto;
 border: 12px solid transparent;
 border-left: 12px solid #df013a;/*ふきだしの線の色*/
}
.right .sc:after {
 right: -20px;
 border-left-color: #FFEEFF ;/*ふきだしの中の色*/
}

/*--------------------------------------
wppでランキング順位を表示する
--------------------------------------*/
/* カウンタをリセット */
.my-widget.show_num {
    counter-reset: wpp-ranking;
}
/* 一覧の表示 */
.my-widget.show_num li {
    position: relative;
}
/* 順位を表示 */
.my-widget.show_num li:before {
    content: counter(wpp-ranking, decimal);
    counter-increment: wpp-ranking;
 	display: inline-block;
 	position: absolute;
 	z-index: 1;
 	top: 0;
 	left: 0;
 	width: 25px;
 	height: 25px;
	border-radius: 50%;
	text-align: center;
	line-height: 25px;
}
/* 1位 */
.my-widget.show_num li:nth-child(1):before {
	background: #df013a;
	color: #fff;
}
/* 2位 */
.my-widget.show_num li:nth-child(2):before {
	background: #FA58AC;
	color: #fff;
}
/* 3位 */
.my-widget.show_num li:nth-child(3):before {
	background: #FA58AC;
	color: #fff;
}
/* 4位以降の色 */
.my-widget.show_num li:nth-child(n + 4):before{
	background: #f3f3f3;
	color: #9a9a9a;
}

/*Strong改造*/
strong {
background: linear-gradient(transparent 40%, #F7819F 30%);
}

/*サイドバー余白透明化*/
.widget_custom_html {
  background-color: transparent;
}