/*
Theme Name: genique by digipress child
Version: 1.0.3.5
Template: dp-genique 
*/

/*見出し　　　　　　　　　　　　　　　　　*/
/*アメリカンな吹き出し*/
.post_content001{
position:relative;
padding:14px 20px;  /*高さ*/
margin: 20px 0;    /*見出し上下に余白をあける*/
font:bold 28px/1.6 Arial, Helvetica, sans-serif;
color:#333;
background:#fff;
text-shadow:
1px 1px 0 #fff,
2px 2px 0 #999;
border-top:#333 solid 3px;
border-bottom:#333 solid 3px;
background-image: -webkit-gradient(linear, left top, right bottom,
from( rgba(255, 255, 255, 0.0)),
color-stop(0.4, rgba(255, 255, 255, 0.0)),
color-stop(0.4, rgba(0, 0, 0, 0.1)),
color-stop(0.6, rgba(0, 0, 0, 0.1)),
color-stop(0.6, rgba(255, 255, 255, 0.0)),
to( rgba(255, 255, 255, 0.0))
);
background-image: -webkit-linear-gradient(top -45deg,
transparent 40%,
rgba(0, 0, 0, 0.1) 40%,
rgba(0, 0, 0, 0.1) 60%,
transparent 60%
);
background-image: -moz-linear-gradient(top -45deg,
transparent 40%,
rgba(0, 0, 0, 0.1) 40%,
rgba(0, 0, 0, 0.1) 60%,
transparent 60%
);
background-image: -o-linear-gradient(top -45deg,
transparent 40%,
rgba(0, 0, 0, 0.1) 40%,
rgba(0, 0, 0, 0.1) 60%,
transparent 60%
);
background-image: linear-gradient(to bottom -45deg,
transparent 40%,
rgba(0, 0, 0, 0.1) 40%,
rgba(0, 0, 0, 0.1) 60%,
transparent 60%
);
background-size:4px 4px;
}

.post_content001:before{
content:" ";
position:absolute;
top:100%;
left:24px;
width:0;
height:0;
border-width:12px;
border-style:solid;
border-color:transparent;
border-top-color:#333;
}

.post_content001:after{
content:" ";
position:absolute;
top:100%;
left:28px;
width:0;
height:0;
border-width:8px;
border-style:solid;
border-color:transparent;
border-top-color:#f0f0f0;
z-index:1;
}

/*ストライプ002*/
.post_content002 {
  color: #6cb4e4;
  text-align: left;
  padding: 0.65em;
  border-top: solid 2px #6cb4e4;
  border-bottom: solid 2px #6cb4e4;
  background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}

/*吹無地003*/
.post_content003{
    position: relative;
    padding: 1rem 1rem 1rem 1.5rem;
    border: 3px solid #333;
    font-weight: bold;
    font-size: 26px;
}

.post_content003:before,
.post_content003:after {
    position: absolute;
    top: 100%;
    left: 30px;
    height: 0;
    width: 0;
    border: solid transparent;
    content: "";
}

.post_content003:before {
    margin-left: -12px;
    border-color: transparent;
    border-top-color: #333;
    border-width: 12px;
}

.post_content003:after {
    margin-left: -8px;
    border-color: transparent;
    border-top-color: white;
    border-width: 8px;
}

/*吹無地004*/
.post_content004 {
    position: relative;
    padding: 0.8rem 0.8rem;
    margin-bottom: 0.2rem;
    border-bottom: 5px solid;
    color: black;
    font-weight: bold;
    font-size: 35px;
    text-align: center;
}

.post_content004:before,
.post_content004:after {
    position: absolute;
    top: 100%;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
}

.post_content004:before {
    border: 16px solid;
    border-color: transparent;
    border-top-color: black;
    margin-left: -16px;
}

.post_content004:after {
    border: 10px solid;
    border-color: transparent;
    border-top-color: white;
    margin-left: -10px;
}

/*下吹005*/

.post_content005{
    position: relative;
    padding: .5em .7em .4em;
    border-bottom: 3px solid #000000;
    color: #333333;
}

.post_content005::before,
.post_content005::after {
    position: absolute;
    left: 30px;
    bottom: -15px;
    width: 30px;
    height: 15px;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    content: '';
}

.post_content005::before {
    background-color: #000000;
}

.post_content005::after {
    bottom: -11px;
    background-color: #fff;
}

/*チェック柄上下線006*/
.post_content006{
    padding: .6em .7em;
    border-top: 2px solid #5ba9f7;
    border-bottom: 2px solid #5ba9f7;
    background-image: linear-gradient(45deg, #5ba9f712 25%, transparent 25%, transparent 50%, #5ba9f712 50%, #5ba9f712 75%, transparent 75%, transparent), linear-gradient(-45deg, #5ba9f712 25%, transparent 25%, transparent 50%, #5ba9f712 50%, #5ba9f712 75%, transparent 75%, transparent);
    background-color: #5ba9f70d;
    background-size: 20px 20px;
    color: #5ba9f7;
}

/*007*/



/*アイコン付見出し050*/
 .post_content050 {
	position: relative;
	padding: 0.5em 0.75em;
	border: solid 1px #27acd9;
	border-left: solid 2.5em #27acd9;
}
.post_content050:before {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	content: "\f0eb";
	font-weight: 900;
	color: #fff;
	padding: 0;
	left: -1.6em;
	top: 50%;
	transform: translateY(-50%);
}
  
 /*アイコン付見出し051*/
.post_content051 {
  position: relative;/*相対位置*/
  padding: 0.5em 0.5em 0.5em 1.5em;/*アイコン分のスペース*/
  line-height: 1.4;/*行高*/
  color: #ff6a6a;/*文字色*/
  border-top: solid 2px gray;
  border-bottom: solid 2px gray;
  background: #ffffff;
}

.post_content051::before {
  font-family: "Font Awesome 5 Free";/*忘れずに*/
  content: "\f138";/*アイコンのユニコード*/
  font-weight: 900;
  position: absolute;/*絶対位置*/
  font-size: 1em;/*サイズ*/
  left: 0.25em;/*アイコンの位置*/
  top: 0.5em;/*アイコンの位置*/
  color: #ff6a6a; /*アイコン色*/
	}

/*アイコン付見出し塗りつぶし052*/
.post_content052 {
  position: relative;
  color: white;
  background: #81d0cb;
  line-height: 1.4;
  padding: 0.5em 0.5em 0.5em 1.8em;
}

.post_content052:before {
  font-family: "Font Awesome 5 Free";
  content: "\f14a";
  font-weight: 900;
  position: absolute;
  left : 0.5em; /*左端からのアイコンまでの距離*/
}

/*タイトル付ボックス*/
.post_content150{
	background-color:#fff; /* ボックス背景色 */
	padding:2em; /* ボックス内側余白 */
	position:relative; /* 配置(ここを基準に) */
	border: 2px solid #666;/* ボックスの線 (太さ・種類・色)*/
}
.post_content150 .box-title {
	background-color:#fff; /* タイトル背景色 */
	font-size: 1em;/* タイトル文字の大きさ */
	font-weight:800;
	color: #666; /* タイトル文字色 */
	padding: 0 5px;/*タイトルの余白*/
	line-height: 1;/*タイトルの行の高さ*/
	position:absolute;/* 配置(ここを動かす) */
	top: -8px; /*上からの距離*/
	left: 20px; /*左からの距離*/
}

/*080H3アイコン付消える線*/
.post_content080{
	position: relative;
	line-height: 1.4;
	font-size: 1em;
	font-weight: normal;
	padding: 0 0 5px calc(1em + 5px);	
	color: #6699cc;
}
.post_content080:before{
	position: absolute;
	left: 0;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Free"; 
	font-weight: 900;
	content: '\f4ad';
}
.post_content080:after{
	position: absolute;
	bottom: -4px;
	display: block;
	width: 100%;
	height: 4px;
	background: rgba(102, 153, 204, 1);
	background: -moz-linear-gradient(left, rgba(102, 153, 204, 1) 0%, rgba(102, 153, 204, 0) 100%);
	background: -webkit-linear-gradient(left, rgba(102, 153, 204, 1) 0%, rgba(102, 153, 204, 0) 100%);
	background: linear-gradient(to right, rgba(102, 153, 204, 1) 0%, rgba(102, 153, 204, 0) 100%);
	left: 0;
	content: '';
}