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

/*引用*/
#content blockquote{
	position:relative;
	color:#3F3F3F;
	margin-top:20px;
	padding:20px 20px 20px 70px;
	background-color: #F2F2F2;
}
#content blockquote::before{
	position:absolute;
	top:10px;
	left:20px;
	font-family: "icomoon";
	content: "\e909";
	font-size:3rem;
	color:#D9D9D9;
}

/*枠線ボックス*/
#content .borderBox{
	border:1px solid #E5E5E5;
	padding:20px;
	margin-top:20px;
}

/*二重線ボックス*/
#content .border2Box{
	border:4px double #E5E5E5;
	padding:20px;
	margin-top:20px;
}

/*背景ボックス*/
#content .bgBox{
	background:#F2F2F2;
	padding:20px;
	margin-top:20px;
}

/*ペーパーボックス*/
#content .paperBox {
	position: relative;
	padding:20px;
	margin-top:20px;
	background-color: #F2F2F2;
}
#content .paperBox::after {
    content: "";
	position: absolute;
	bottom: 0;
    right: 0;
    border-color: #D8D8D8 #ffffff #ffffff #D8D8D8;
    border-style: solid;
    border-width: 0 0 20px 20px;
}

/*太文字ボックス*/
#content .boldBox{
	border:3px solid #191919;
	padding:20px;
	margin-top:20px;
	font-weight:700;
}

/*括弧ボックス*/
#content .bracketsBox{
	position:relative;
	padding:20px;
	margin-top:20px;
}
#content .bracketsBox:before,
#content .bracketsBox:after {
    display: inline-block;
    position: absolute;
    width: 20px;
    height: 30px;
    content: "";
}
#content .bracketsBox:before {
    top: 0;
    left: 0;
    border-top: solid 1px #191919;
    border-left: solid 1px #191919;
}
#content .bracketsBox:after {
    right: 0;
    bottom: 0;
    border-right: solid 1px #191919;
    border-bottom: solid 1px #191919;
}

/*はてなボックス*/
/*ビックリボックス*/
#content .questionBox,
#content .exclamationBox{
	position:relative;
	margin-top:20px;
	padding:20px 20px 20px 70px;
}
#content .questionBox{background-color: #D9EFF7;}
#content .exclamationBox{background-color: #F6E1DF;}
#content .questionBox::before,
#content .exclamationBox::before{
	position:absolute;
	top:20px;
	left:20px;
	font-size:2rem;
	font-weight:700;
	color: #ffffff;
    text-align: center;
    vertical-align: middle;
    width: 30px;
    height: 30px;
	line-height: 30px;
    border-radius: 50%;
}
#content .questionBox::before{content: "?";background: #0096c8;}
#content .exclamationBox::before{content: "!";background: #c53929;}

/*ポイントボックス*/
#content .pointBox {
	position: relative;
    border: 2px solid #c53929;
    border-radius: 5px;
    padding:20px;
	margin-bottom:5px;
	margin-top:20px;
}
#content .pointBox::before {
	content: "POINT";
	position: absolute;
	top: -25px;
	left: 15px;
	font-size: 1.6rem;
	font-weight: 700;
    background-color: #ffffff;
    color: #c53929;
    padding: 0 10px;
}


/*注釈*/
#content .asterisk{
	display: block;
    font-size: 1.3rem;
    color: #7F7F7F;
}

/*イエローマーカー*/
#content .markerYellow{background: linear-gradient(transparent 60%, #ffffbc 60%);}
/*ピンクマーカー*/
#content .markerPink{background: linear-gradient(transparent 60%, #FFDFEF 60%);}
/*ブルーマーカー*/
#content .markerBlue{background: linear-gradient(transparent 60%, #cce5ff 60%);}