/*
Theme Name: PORIPU for SANGO
Template:sango-theme
Theme Name:sango-theme-poripu
Theme URI:https://oldno07.com/poripu/
Author: マサオカ
Author URI:https://oldno07.com/
Description: SANGOの子テーマです。SANGO親テーマをインストールした状態で、本子テーマを適用してください。使い方は<a href="https://oldno07.com/poripu/">デモサイト</a>を御覧ください。
Version:1.4.1
*/
/*--------------------------------------
ここから下にCSSを追加してください
--------------------------------------*/

/*--------------------------------------
  見出しh2
--------------------------------------*/
.entry-content h2{

}
.fa5 .entry-content h2:before {/*fontawesome5を使う場合*/
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

/*--------------------------------------
  見出しh3
--------------------------------------*/
.entry-content h3 {

}
.fa5 .entry-content h3:before {/*fontawesome5を使う場合*/
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}
/*--------------------------------------
  見出しh4
--------------------------------------*/
.entry-content h4 {

}
.fa5 .entry-content h4:before {/*fontawesome5を使う場合*/
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}



/*--------------------------------------
  見出しh2カスタム
--------------------------------------*/
.entry-content h2 {
  position: relative;
  padding: 0.6em;
  background: #0b6000;
  color: white;
}
.entry-content　h2:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 15px solid transparent;
  border-top: 15px solid #0b6000;
  width: 0;
  height: 0;
}






/*--------------------------------------
  BOX6プロフ枠
--------------------------------------*/
.entry-content h2::before{
   position: absolute;
   content: '';
   top: 100%;
   left: 0;
   border: none;
   border-bottom: solid 15px transparent;
   border-right: solid 20px rgb(149, 158, 155);
}

.box6 {
    padding: 0.5em 1em;
    margin: 2em 0;
    background: #f0f7ff;
    border: dashed 2px #5b8bd0;/*点線*/
}
.box6 p {
    margin: 0; 
    padding: 0;
}
/*--------------------------------------
  箇条書きBOX線消し
--------------------------------------*/
.entry-content blockquote ul, .entry-content blockquote ol {
    border: none;
    padding: 5px 0 5px 20px;
    margin: 0;
}


/*--------------------------------------
  BOX5カスタマイズ（青二重線枠）
--------------------------------------*/
.box5 {
    padding: 0.5em 1em;
    margin: 2em auto;
	width: 90%;
    border: double 5px #4ec4d3;
	margin: auto;
}
.box5 p {
    margin: 0; 
    padding: 0;
}
/*--------------------------------------
  BOX6カスタマイズ（青点線塗りつぶし枠）
--------------------------------------*/
.box6 {
    padding: 0.5em 1em;
    margin: 2em auto;
	width: 90%;
    background: #f0f7ff;
    border: dashed 2px #5b8bd0;/*点線*/
	margin: auto;
}
.box6 p {
    margin: 0; 
    padding: 0;
}


/*--------------------------------------
  BOX3カスタマイズ（枠サイズ）
--------------------------------------*/
.box3 {
 margin: 2em auto;
 padding: 1em;
 width: 90%;
}
/*--------------------------------------
  BOX16カスタマイズ（枠サイズ）
--------------------------------------*/
.box16 {
 margin: 2em auto;
 padding: 1em;
 width: 90%;
}

/************************************
** box1-purpleカスタマイズ
************************************/
.box1-purple{
	margin: 2em auto; /* ボックスの余白 */
	background: #f4f4fc; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	 width: 90%;
	border: 10px solid #E6E6FA
}
.box1-purple p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box1-ivoryカスタマイズ
************************************/
.box1-ivory{
	margin: 2em auto; /* ボックスの余白 */
	background: #fef9ed; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	width: 90%;
}
.box1-ivory p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box1-orangeカスタマイズ
************************************/
.box1-orange{
	margin: 2em auto; /* ボックスの余白 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	width: 90%;
	border: 3px solid #FFCC33
}
.box1-orange p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box1-grayカスタマイズ
************************************/
.box1-gray {
 margin: 2em auto;
 padding: 1em;
 width: 90%;
 color: #666; /* 文字色 */
 background-color: #f7f7f7; /* 背景色 */
 border: 1px solid #ccc; /* 枠線 */
}
.box1-gray p {
    margin: 0; 
    padding: 0;
}

/*--------------------------------------
 ** box1-yellowカスタマイズ
--------------------------------------*/
.box1-yellow{
	margin: 2em auto; /* ボックスの余白 */
	background: #FFFFCC; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	width: 90%;
}
.box1-yellow p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box1-blueカスタマイズ
************************************/
.box1-blue{
	margin: 2em auto; /* ボックスの余白 */
	background: #F8FCFF; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	 width: 90%;
	border: 10px solid #DDF0F7
}
.box1-blue p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box1-greenカスタマイズ(New)
************************************/
.box1-green {
 margin: 2em auto;
 padding: 1em;
 width: 90%;
 color: #666; /* 文字色 */
 background-color: #ecfcf4; /* 背景色 */
 border: 1px solid #9cd8c4; /* 枠線 */
}
.box1-gray p {
    margin: 0; 
    padding: 0;
}

/************************************
** box1-pinkカスタマイズ
************************************/
.box1-pink{
	margin: 2em auto; /* ボックスの余白 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	width: 90%;
	border: 3px solid #FF9999
}
.box1-pink p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}



/************************************
** box1-orange(破線)カスタマイズ
************************************/
.box1-orange2{
	margin: 2em auto; /* ボックスの余白 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 1.5em 2em 2em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
	width: 90%;
	border: 3px dashed #FFCC33
}
.box1-orange2 p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box2-yellow(タイトル）カスタマイズ
************************************/
.box2-yellow{
	margin: 2em auto; /* ボックスの余白 */
	background: #fef9ed; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 3.5em 2em 1.5em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
}
.box2-yellow .box-title {
	background: #fdc44f; /* タイトル背景色 */
	color: #fff; /* タイトル文字色 */
	font-weight: bold; /* タイトル文字の太さ */
	font-size: 20px;/* タイトル文字の大きさ */
	padding: 5px;/* タイトル周りの余白 */
	text-align: center;	/* タイトル中央寄せ */
	border-radius: 4px 4px 0px 0px;	/* タイトル角丸 */
	position:absolute;	/* 配置に関するもの(ここを動かす) */
	top:0;	/*上から(0px)に配置 */
	left:0; /*左から(0px)に配置 */
	width:100%;/*横幅最大幅 */
}
.box2-yellow p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box2-pink(タイトル）カスタマイズ
************************************/
.box2-pink{
	margin: 2em auto; /* ボックスの余白 */
	background: #fdf1f4; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 3.5em 2em 1.5em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
}
.box2-pink .box-title {
	background: #f27398; /* タイトル背景色 */
	color: #fff; /* タイトル文字色 */
	font-weight: bold; /* タイトル文字の太さ */
	font-size: 20px;/* タイトル文字の大きさ */
	padding: 5px;/* タイトル周りの余白 */
	text-align: center;	/* タイトル中央寄せ */
	border-radius: 4px 4px 0px 0px;	/* タイトル角丸 */
	position:absolute;	/* 配置に関するもの(ここを動かす) */
	top:0;	/*上から(0px)に配置 */
	left:0; /*左から(0px)に配置 */
	width:100%;/*横幅最大幅 */
}
.box2-pink p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box2-blue(タイトル）カスタマイズ
************************************/
.box2-blue{
	margin: 2em auto; /* ボックスの余白 */
	background: #e6f1f9; /* ボックス背景色 */
	border-radius:4px; /* ボックス角丸 */
	max-width:600px; /* ボックス横幅 */
	padding: 3.5em 2em 1.5em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
}
.box2-blue .box-title {
	background: #0e7ac4; /* タイトル背景色 */
	color: #fff; /* タイトル文字色 */
	font-weight: bold; /* タイトル文字の太さ */
	font-size: 20px;/* タイトル文字の大きさ */
	padding: 5px;/* タイトル周りの余白 */
	text-align: center;	/* タイトル中央寄せ */
	border-radius: 4px 4px 0px 0px;	/* タイトル角丸 */
	position:absolute;	/* 配置に関するもの(ここを動かす) */
	top:0;	/*上から(0px)に配置 */
	left:0; /*左から(0px)に配置 */
	width:100%;/*横幅最大幅 */
}
.box2-blue p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box3-pink(タイトル）カスタマイズ
************************************/
.box3-pink{
	margin: 2em auto; /* ボックスの余白 */
	max-width:600px; /* ボックス横幅 */
	border:2px solid #ffb6c1; /* ボックス線 */
	padding: 3.5em 2em 1.5em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
}
.box3-pink .box-title {
	background: #ffb6c1; /* タイトル背景色 */
	color: #fff; /* タイトル文字色 */
	font-weight: bold; /* タイトル文字の太さ */
	font-size: 20px;/* タイトル文字の大きさ */
	padding: 5px;/* タイトル周りの余白 */
	text-align: center;	/* タイトル中央寄せ */
	position:absolute;	/* 配置に関するもの(ここを動かす) */
	top:0;	/*上から(0px)に配置 */
	left:0; /*左から(0px)に配置 */
	width:100%;/*横幅最大幅 */
}
.box3-pink p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}

/************************************
** box3-blue(タイトル）カスタマイズ
************************************/
.box3-blue{
	margin: 2em auto; /* ボックスの余白 */
	max-width:600px; /* ボックス横幅 */
	border:2px solid #C2EEFF; /* ボックス線 */
	padding: 3.5em 2em 1.5em; /* ボックス内側余白 */
	position:relative; /* 配置に関するもの(ここを基準に) */
}
.box3-blue .box-title {
	background: #C2EEFF; /* タイトル背景色 */
	color: #fff; /* タイトル文字色 */
	font-weight: bold; /* タイトル文字の太さ */
	font-size: 20px;/* タイトル文字の大きさ */
	padding: 5px;/* タイトル周りの余白 */
	text-align: center;	/* タイトル中央寄せ */
	position:absolute;	/* 配置に関するもの(ここを動かす) */
	top:0;	/*上から(0px)に配置 */
	left:0; /*左から(0px)に配置 */
	width:100%;/*横幅最大幅 */
}
.box3-blue p {
	margin: 0;/* 文字の余白リセット */
	padding: 0; /* 文字の内側余白リセット*/
}