/*
Theme Name: ColorMag Pro Child Theme
Theme URI: http://themegrill.com/themes/colormag-pro/
Description: ColorMag Pro Child Theme
Author: ThemeGrill
Author URI: http://themegrill.com
Template: colormag-pro
Version: 1.0
*/

@import url("../colormag-pro/style.css");

/* =Theme customization starts here
------------------------------------------------------- */


* {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

h1, h2, h3, h4, h5, h6 , p, pre, code, kbd, var, samp, tt, blockquote, ul,li{
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}


blockquote p, blockquote p:before {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

#site-description {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.search-icon:before {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.search-icon:before {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.main-navigation li {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.main-navigation li li.page_item_has_children > a:after {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.site-header .menu-toggle {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.site-header .menu-toggle:before {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.comments-area article header .comment-edit-link:before{
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

.comment .comment-reply-link:before {
	font-family: “Lucida Grande”, “segoe UI”, “ヒラギノ丸ゴ ProN W4”, “Hiragino Maru Gothic ProN”, “メイリオ”, Meiryo, Verdana, Arial, sans-serif, FontAwesome;
}

/*チェックマーク*/

.checkmark:before {
	content: " \f046";
	font-family: FontAwesome;
	color: #cc289d; 
	font-size:24px;
	font-weight : bold;
	margin-right:10px;
	font-style:normal!important; 
}

.checkmark {
	font-size:18px!important;
	font-weight : bold!important;
	font-style:normal!important;
}

.kousiki {
	border: 1px solid #15aeec;
	background-color: #1aba67;
	background-image: -webkit-linear-gradient(top, #1aba67, #1fde7a);
	background-image: linear-gradient(to bottom, #1aba67, #1fde7a);
	border-radius: 4px;
	color: #fff!important;
	line-height: 50px;
	-webkit-transition: none;
	transition: none;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    width:90%; /*ボタンの中央配置 */
    /*max-width: 400px;  ボタンの横幅 */
    text-align: center;  /*ボタン内の文字中央寄せ */
    padding: 10px;  /*ボタン内文字の余白 */
}
.kousiki:hover {
	border:1px solid #1aba67;
	background-color: #1aba67;
	background-image: -webkit-linear-gradient(top, #10b057, #1aba67);
	background-image: linear-gradient(to bottom, #10b057, #1aba67);
}
.kousiki:active {
	background: #1aba67;
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, .2);
	color: #1679a1;
	text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
.kousiki a {
 text-decoration: none !important;  /*ボタン内テキストリンク下線無し */
 color: #ffffff !important;  /*ボタン内の文字色 */
 display: block;
    font-size: 130%; 
}


.kousiki2 {
	border: 1px solid #15aeec;
	background-color: #49c0f0;
	background-image: -webkit-linear-gradient(top, #49c0f0, #2cafe3);
	background-image: linear-gradient(to bottom, #49c0f0, #2cafe3);
	border-radius: 4px;
	color: #fff!important;
	line-height: 50px;
	-webkit-transition: none;
	transition: none;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    width:90%; /*ボタンの中央配置 */
    /*max-width: 400px;  ボタンの横幅 */
    text-align: center;  /*ボタン内の文字中央寄せ */
    padding: 10px;  /*ボタン内文字の余白 */

}
.kousiki2:hover {
	border:1px solid #1090c3;
	background-color: #1ab0ec;
	background-image: -webkit-linear-gradient(top, #1ab0ec, #1a92c2);
	background-image: linear-gradient(to bottom, #1ab0ec, #1a92c2);
}
.kousiki2:active {
	background: #1a92c2;
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, .2);
	color: #1679a1;
	text-shadow: 0 1px 1px rgba(255, 255, 255, .5);
}
.kousiki2 a {
 text-decoration: none !important;  /*ボタン内テキストリンク下線無し */
 color: #ffffff !important;  /*ボタン内の文字色 */
 display: block;
    font-size: 130%; 
}

/*.clearfix{
	width:98%;
	align:center;
}*/

/*記事中の見出しタグの指定*/
div.entry-content h2 {
	color:#ffffff;
	background-color: #289dcc;
	font-size: 24px;
	font-weight: bold; 
	padding: .45em 0 .35em .75em !important;/*1ヶ目（上）と3ヶ目（左）で左ボーダーの高さが変わる*/
	margin: 45px 0px 25px 0px !important;
	border-left: 6px solid #289dcc !important;
	border-bottom: 1px solid #289dcc !important;
}
div.entry-content h3 {
	font-size: 21px;
	font-weight: bold; 
	padding: .2em 0 .2em .75em !important;
	margin: 35px 0px 25px 4px !important;
	border-left: 5px solid #289dcc !important;
}
div.entry-content h4 {
	font-size: 18px;
	padding: .1em 0 .1em .75em !important;
	margin: 0px 0px 15px 5px !important;
	border-left: 4px solid #289dcc !important;
}
div.entry-content h5 {
	font-size: 17px;
	padding: 0 0 0 .75em !important;
	margin: 0px 0px 15px 6px !important;
	border-left: 3px solid #289dcc !important;
}

/*記事中の本文をインデント*/
/*div.entry-content div, p {
	margin: 5px 0px 15px 7px !important;
	padding: 0px 0px 0px 0px !important;
}*/
div, p ,li{
	font-size: 17px !important;
}

/*記事中トップの画像を消す*/
.single .featured-image {
display: none;
}

blockquote{
	color: #ccc; 
	background-color: #F5F5F5;
	padding: 25px 1px 0px 1px; 
	margin: 10px 1px 10px 1px;
	border:5px solid #DBDBDB;
	border-radius: 0 20px 0 20px;         
	-webkit-border-radius: 0 20px 0 20px;  
	-moz-border-radius:  0 20px 0 20px;  

    }
 
blockquote p{
	color:#3D80B6;
	line-height: 1.8em;
	padding: 1px 1px 1px 50px; 
}

blockquote p:before{
	color: #248db8;
	text-indent: 25px;
}

/* 折り返す */
div.flexbox-container {
    display:-webkit-box;
    display:-moz-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin:0 0 0px;
}

/*スペック表*/
table.type05 {
	border-collapse: separate;
	border-spacing: 1px;
	text-align: left;
	line-height: 1.5;
	border-top: 1px solid #c6e8f4;
}
table.type05 th {
	/*width:200px;*/
	padding: 10px;
	font-weight: bold;
	vertical-align: top;
	border-bottom: 1px solid #c6e8f4;
	background: #c6e8f4;
}
table.type05 td {
	/*width:400px;*/
	padding: 10px;
	vertical-align: top;
	border-bottom: 1px solid #c6e8f4;
}

/*ランキング
http://coliss.com/articles/build-websites/operation/css/flexbox-responsive-layout-without-media-queries.html
*/
.ranking1, .ranking2, .ranking3, .ranking4, .ranking5, .ranking6, .ranking7, .ranking8, .ranking9, .ranking10{
  border-style: solid;
  border-width: 1px;
  border-color:#289dcc;
  padding:5px 5px 0px 5px!important;
  margin:0px 0px 20px 0px!important;
}

/*商品画像とスペック表*/
.container100{
  display:flex;
  flex-wrap:wrap;
  width:100%;
  margin:0px 0px 0px 0px!important;
  padding:0px 0px 0px 0px!important;
}

/*固定側　左側の商品画像*/
.fixedUnlessOnOwnRow1{
  flex-grow:1; /* もう一方と比較して小さい数字*/
  flex-shrink:1;
  flex-basis:250px; /*最小幅*/
margin:1px 1px 1px 1px!important;
 padding:0px 0px 0px 0px!important;
  /*画像中央揃え*/
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
}

 
/*可変側　右側のスペック表*/
.fluidWidthDownToAPoint1{
  flex-grow:999999; /* もう一方と比較して大きい数字（大きすぎるとIEは計算し損ねる）*/
  flex-shrink:1;
  flex-basis:250px; /*最小幅*/
margin:1px 1px 1px 1px!important;
 padding:0px 0px 0px 0px!important;
}

/*レーダーチャートと説明文*/

/*固定側　左側のレーダーチャート*/
.fixedUnlessOnOwnRow{
  flex-grow:1; /* もう一方と比較して小さい数字*/
  flex-shrink:1;
  flex-basis:250px; /*最小幅*/
  /*画像中央揃え*/
  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
}

/*可変側　右側の説明文*/
.fluidWidthDownToAPoint{
  flex-grow:999999; /* もう一方と比較して大きい数字（大きすぎるとIEは計算し損ねる）*/
  flex-shrink:1;
  flex-basis:250px; /*最小幅*/

}

/*リンクボタン*/

/*固定側　左側の詳細ボタン*/
.fixedUnlessOnOwnRow2{
  flex-grow:1; /* もう一方と比較して小さい数字*/
  flex-shrink:1;
  flex-basis:250px; /*最小幅*/
}

/*可変側　右側の説明文*/
.fluidWidthDownToAPoint2{
  flex-grow:999999; /* もう一方と比較して大きい数字（大きすぎるとIEは計算し損ねる）*/
  flex-shrink:1;
  flex-basis:250px; /*最小幅*/
}
 
/*サイドバーの全体枠*/
.sidelank{
	font-size:14px!important;
	font-weight: bold;
	border-style: solid;
	border-width: 2px;
	border-color:#f5f5f5;
	padding:3px;
	margin:2px;
	overflow: auto;
	height:100px;
	overflow:visible;
}
/*サイドバーの画像*/
.boxicon {
	font-size:14px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	float:left; 
	margin-right:7px;
	width: 100px;
	height: 100px;
}
/*サイドバーのラベル*/
.ranklabel{
	font-size:14px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	float:left; 
	margin-right:7px;
	width: 20px;
	height: 100px;
	color:red;
	background:#ffffff;
	display: flex;
	justify-content: center;
	align-items: center;
}

/*サイドバーのコピー赤*/
.sidecopy{
	color:red;
	font-size:14px!important;
}

/*サイドバーコピー黒*/
.sidecopyb{
	color:#555555;
	font-size:14px!important;
}

.absolute {
    position: absolute;
    bottom: 80px;
    color: #fff;
    background: rgba(0,0,0,.6);
    width: 100%;
    max-width: 600px;
    padding: 1em 0;
}
.absolute p {
    margin: 0;
    padding: 0 0.8em;
    font-size: 150%;
    text-align: center;
}

/******
#site-title {
	padding-left: 0!important;
	padding-right: 0!important;
	margin-left: 0!important;
	margin-right: 0!important;
	font-size:28px!important;
}
#site-title a {
	padding-left: 0!important;
	padding-right: 0!important;
	margin-left: 0!important;
	margin-right: 0!important;
	font-size:28px!important;
}
******/

/*thkより移植*/

/*インラインボタン*/
ul.nav	{
	list-style:none;
	padding:0px 0px 10px 0px;
	margin:auto;
	display:table;
	table-layout: fixed;
	width:90%;
}
ul.nav li{
	padding:0;
	margin:0; 
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}


ul.nav li a{
	color:#000000;
	font-size:20px;
	text-decoration:none;
	/*background-image: linear-gradient(to bottom, #fefefe, #eee);*/
	background-image: linear-gradient(to bottom, #71ea8c, #61da7c);
	padding:1px;
	display:block!important;
	border-radius:20px;
	border:1px solid #41ba5c;
}
ul.nav li a:hover{
	color:#fff;
	text-decoration:none;
	background:#77dd66;
}

ul.nav li a:before{
	content: " \f0a4";
	font-family: FontAwesome;
	color: #cc289d; 
	font-size:24px;
	font-weight : bold;
	margin-right:10px;
	font-style:normal!important; 
}

/*トップページのテーブル*/
.tophikaku td{
	font-size:15px;
}


.red{
	color : red;
	font-weight : bold;
	font-style:normal; 
}

.yellow{
	background-color : yellow;
	font-weight : bold;
	font-style:normal; 
}

.x-large{
	font-size : x-large;
	font-weight : bold;
	font-style:normal; 
}

.large{
	font-size : 110%;
	font-weight : bold;
	font-style:normal; 
}

.small{
	font-size : small;
	font-style:normal; 
}

/*無地四角枠*/
.shikakuwaku {
	border-style: solid;
	border-width: 5px;
	border-color:#dddddd;
	background-color:#ffffff;
	margin:20px 10px 20px 10px;
	padding:10px 10px 10px 10px!important;
}

/*無地黄色枠*/
.shikakuwaku2 {
	font-weight : bold;
	border-style: solid;
	border-width: 2px;
	border-color:#ff0000;
	background-color:#ffffd2;
	margin:20px 10px 20px 10px;
	padding:10px 10px 10px 10px!important;
}

/*ランキング*/
.rank1 {
	background-image: url(/wp-content/uploads/2016/10/rank1_a.gif);
	background-size:45px 45px;
	background-position: left center;
	background-repeat: no-repeat;
	margin: 3px auto;
	padding: 30px 0px 20px 50px;
}
.rank2 {
	background-image: url(/wp-content/uploads/2016/10/rank2_a.gif);
	background-size:45px 45px;
	background-position: left center;
	background-repeat: no-repeat;
	margin: 3px auto;
	padding: 30px 0px 20px 50px;
}
.rank3 {
	background-image: url(/wp-content/uploads/2016/10/rank3_a.gif);
	background-size:45px 45px;
	background-position: left center;
	background-repeat: no-repeat;
	margin: 3px auto;
	padding: 30px 0px 20px 50px;
}
.rank4 {
	background-image: url(/wp-content/uploads/2016/10/rank4_a.gif);
	background-size:45px 45px;
	background-position: left center;
	background-repeat: no-repeat;
	margin: 3px auto;
	padding: 30px 0px 20px 50px;
}
.rank5 {
	background-image: url(/wp-content/uploads/2016/10/rank5_a.gif);
	background-size:45px 45px;
	background-position: left center;
	background-repeat: no-repeat;
	margin: 3px auto;
	padding: 30px 0px 20px 50px;
}


.red{
	color : #CE2A81;
	font-weight : 700;
	font-style:normal; 
	font-size:18px;
}

.green{
	color : #12AB42;
	font-weight :700;
	font-style:normal;
	font-size:19px;
}

.yellow{
	background-color : yellow;
	font-weight : bold;
	font-style:normal; 
}

.x-large{
	font-size : x-large;
	font-weight : bold;
	font-style:normal; 
}

.large{
	font-size : 110%;
	font-weight : bold;
	font-style:normal; 
}

.small{
	font-size : small;
	font-style:normal; 
}


/*チェックマーク*/
.checkmark:before {
	content: " \f046";
	font-family: FontAwesome;
	color: #cc289d; 
	font-size:20px;
	font-weight : bold;
	margin-right:10px;
	font-style:normal!important; 
}

/*画像つきボックス 画像左*/
.profbox {
box-sizing: border-box;
width:98%;
display: block;
margin:30px 20px!important;
padding:10px 20px 10px 30px!important;
border: solid 5px #dddddd;
overflow: auto;
}
.profbox p,i{
font-size: 16px;
font-style:normal;
}
.profbox img{
text-align:left;
float:left;
margin: 0px 15px 0px 10px;
clear: both;
}

/*画像つきボックス　画像右*/
.profboxr {
box-sizing: border-box;
width: 98%!important;
display: block;
margin:30px 20px!important;
padding:10px 20px 10px 30px!important;
border: solid 5px #dddddd;
overflow: auto;
}
.profboxr p,i{
font-size: 16px;
}
.profboxr img{
text-align:left;
float:right;
margin: 0px 15px 0px 0px;
clear: both;
}

/*カラーボックス pink*/
.pinkbox{
	border-style: solid;
	border-width: 5px;
	border-color:#dddddd;
	background-color:#efc6d8;
	margin: 10px 20px 10px 20px!important;
}

/*無地四角枠*/
.shikakuwaku{
	border-style: solid;
	border-width: 5px;
	border-color:#dddddd;
	background-color:#ffffff;
	margin:30px 0;
	padding:10px 20px 10px 30px!important;

}

/*水色背景四角枠*/
.bwaku{
	border-style: solid;
	border-width: 1px;
	border-color:#ffffff;
	background-color:#c6e8f4;
	margin:30px 0;
	padding:20px 20px 10px 20px!important;
}
div.bwaku p{
	padding:10px 10px 0px 10px!important;
}

/*薄黄色四角枠*/
.pywaku{
	border-style: solid;
	border-width: 1px;
	border-color:#ffffff;
	background-color:#FDFF90;
	margin:30px 8px;
	padding:20px 20px 10px 20px!important;
}

div.pywaku p{
	padding:10px 10px 0px 10px!important;
}

/*ピンク四角枠*/
.pwaku{
	border-style: solid;
	border-width: 1px;
	border-color:#ffffff;
	background-color:#fdeff2;
	margin:30px 8px;
	padding:10px 20px 10px 20px!important;
}

div.pwaku p{
	padding:10px 10px 0px 10px!important;
}

/*黄色四角枠*/
div.ywaku{
	border-style: solid;
	border-width: 5px;
	border-color:#D94B9B;;
	background-color:#F1f899;
	margin:30px 0px;
	padding:10px 20px 10px 30px!important;
}
div.ywaku p{
	padding:10px 10px 0px 15px!important;
}


#post-1168{
margin-top:-30px!important;
}

/*トップページのテーブル*/
.tophikaku td{
	font-size:14px;
}

/*立体ボタン*/
.square_btn{
    display: inline-block;
    padding: 0.5em 0.7em;
	margin: 0.1em 0.1em;
    text-decoration: none;
    background: #668ad8;/*ボタン色*/
    color: #FFF;
	font-weight : bold;
    border-bottom: solid 4px #627295;
    border-radius: 3px;
}
.square_btn:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}
/*立体ボタン2*/
.square_btn2{
    display: inline-block;
    padding: 0.5em 0.7em;
	margin: 0.1em 0.1em;
    text-decoration: none;
    background: #66DA6E;/*ボタン色*/
    color: #FFF;
	font-weight : bold;
    border-bottom: solid 4px #649562;
    border-radius: 3px;
}
.square_btn2:active {/*ボタンを押したとき*/
    -ms-transform: translateY(4px);
    -webkit-transform: translateY(4px);
    transform: translateY(4px);/*下に動く*/
    border-bottom: none;/*線を消す*/
}

.square_btn2 a{
    color: #FFF;
	font-weight : bold;
    text-decoration: none;
}


/*星取表*/
.hoshitori{
	width: 100%;
	table-layout: fixed;
	overflow: auto;
}
table.hoshitori th{
	border-style: solid;
	border-width: 3px;
	border-color:#dddddd;
	background-color:#ffffff;
	text-align: center;
	width: 28%;
	font-size:15px;
	padding:3px;
}
table.hoshitori td{
	border-style: solid;
	border-width: 3px;
	border-color:#dddddd;
	background-color:#ffffff;
	text-align: center;
	width: 24%;
	font-size:15px;
	padding:3px;
}
table.hoshitori img{
    width:auto;
    height:auto;
    max-width:100%;
    max-height:100%;
}

/**/
.nijyumaru{
	color:#eb148f;
	font-size:60px;
	font-weight: bold;
	padding:0px!important;
	line-height: 0.9em;
	font-family:Arial!important;
}
.maru{
	color:#eb148f;
	font-size:80px;
	font-weight: bold;
	padding:0px!important; 
	line-height: 0.9em;
	font-family:Arial!important;
}

/*成分表金のすっぽん*/
table.seibun{
	width: 100%;
	table-layout: fixed;
	overflow: auto;
	margin:0px!important;
}
table.seibun th{
	border-style: solid;
	border-width: 3px;
	border-color:#dddddd;
	background-color:#ffffff;
	text-align: center;
	width: 28%;
	font-size:14px;
	padding:0px;
}
table.seibun td{
	border-style: solid;
	border-width: 3px;
	border-color:#dddddd;
	background-color:#ffffff;
	text-align: center;
	width: 18%;
	font-size:14px;
	padding:0px;
}

/*コピー防止ダミークラス*/
.Copyright_tamarapiller_com{
}

/*--------------------
 吹き出しを作る　https://moriawase.net/kaiwa-text
--------------------*/
/* 全体のスタイル */
.kaiwa {
  margin-top: 20px!important;
  margin-bottom: 60px!important;
}
/* 左画像 */
.kaiwa-img-left {
  margin: 0;
  float: left;
  width: 60px;
  height: 60px;
}
/* 右画像 */
.kaiwa-img-right {
  margin: 0;
  float: right;
  width: 60px;
  height: 60px;
}
.kaiwa figure img {
  width: 100%;
  height: 100%;
  border: 1px solid #aaa;
  border-radius: 50%;
  margin: 0;
}
/* 画像の下のテキスト */
.kaiwa-img-description {
  padding: 5px 0 0;
  font-size: 10px;
  text-align: center;
}
/* 左からの吹き出しテキスト */
.kaiwa-text-right {
  position: relative;
  margin-left: 80px;
  padding: 10px 10px 0px 10px;
  vertical-align: middle;
  border: 1px solid #aaa;
  border-radius: 10px;
}
/* 右からの吹き出しテキスト */
.kaiwa-text-left {
  position: relative;
  margin-right: 80px;
  padding: 10px 10px 0px 10px;
  vertical-align: middle;
  border: 1px solid #aaa;
  border-radius: 10px;
}
p.kaiwa-text {
  margin: 0 0 0 0px;
}
p.kaiwa-text:last-child {
  margin-bottom: 0;
}
/* 左の三角形を作る */
.kaiwa-text-right:before {
  position: absolute;
  content: '';
  border: 10px solid transparent;
  border-right: 10px solid;
  border-right-color: inherit;
  top: 15px;
  left: -20px;
}
.kaiwa-text-right:after {
  position: absolute;
  content: '';
  border: 10px solid transparent;
  border-right: 10px solid;
  border-right-color: inherit;
  top: 15px;
  left: -19px;
}
/* 右の三角形を作る */
.kaiwa-text-left:before {
  position: absolute;
  content: '';
  border: 10px solid transparent;
  border-left: 10px solid;
  border-left-color: inherit;
  top: 15px;
  right: -20px;
}
.kaiwa-text-left:after {
  position: absolute;
  content: '';
  border: 10px solid transparent;
  border-left: 10px solid;
  border-left-color: inherit;
  top: 15px;
  right: -19px;
}
/* 回り込み解除 */
.kaiwa:after,.kaiwa:before {
  clear: both;
  content: "";
  display: block;
}

/*バッジ*/
.b-badge, .g-badge {
  padding: 2px 4px;
  margin: 10px 10px 10px 10px;
  font-size: 100%;
  color: white;
  border-radius: 6px;
  box-shadow: 0 0 3px #ddd;
  white-space: nowrap;
}

.b-badge {
  background-color: #58ACFA; /*青*/
}

.g-badge {
  background-color: #04B404; /*緑*/
}

.center1{
  text-align: center;
}
.right1{
  text-align: right;
}

.left1{
  text-align: left;
}

/*アラートBOX　simplicity2*/
.alert{
  background-color: #F4F3EB;
  padding: 20px 20px 20px 72px!important;
  border-radius: 4px;
  position: relative;
  display: block;
  margin-top: 1em;
  margin-bottom: 1em;
  background-color: #fdeff2;
}

.alert::before{
  font-family: "FontAwesome";
  font-size: 50px;
  position: absolute;
  top: 0%;
  left: 13px;
  color: #EAE3B4;
  content: '\f06a';
  color: #ee827c;
}