body{ font-size: 14px }

/* アドセンスPCスマホ切り替え */

/*--トップページPC--*/
.adpc2lr{ padding-bottom: 40px; text-align: center; }
.adpcul{ padding-left: 34px; padding-right: 40px; float: left; }
.adpcur{ float: none; }
.adpc1d{ text-align: center; }
@media screen and (max-width: 736px){.adpc2lr{display:none}}
@media screen and (max-width: 736px){.adpc1d{display:none}}

/*--トップページスマホ--*/
.adspu{ padding-top:20px; padding-bottom:30px; }
.adspc{ padding-top:20px; padding-bottom:30px; }
.adspd{ padding-top:20px; padding-bottom:30px; }
@media screen and (min-width: 736px){.adspu{display:none}}
@media screen and (min-width: 736px){.adspc{display:none}}
@media screen and (min-width: 736px){.adspd{display:none}}

/*--記事ページPC--*/
.padpc2lr{ width: 690px;margin-bottom: 20px;}
.padpcul{ margin-top: -4em;margin-bottom: 35px;display: inline;float: left; }
.padpcur{ margin-top: -4em;margin-bottom: 35px;margin-left: 17px;display: inline;float: left; }
.clear { clear: both; }
.padpc2lrp { text-align:center; }
@media screen and (max-width: 736px){.padpc2lr{display:none}}
@media screen and (max-width: 736px){.padpcul{display:none}}
@media screen and (max-width: 736px){.padpcur{display:none}}

/*--記事ページスマホ--*/
.padsp1lr{ width: 300px;margin-bottom: 20px;}
.padspu{ margin-top: -4em;margin-bottom: 40px; }
.padspc{ margin-top: -4em;margin-bottom: 40px; }
.padspd{ margin-top: -4em;margin-bottom: 40px; }
.padsp1lrp { text-align:left; }
@media screen and (min-width: 736px){.padsp1lr{display:none}}
@media screen and (min-width: 736px){.padspu{display:none}}
@media screen and (min-width: 736px){.padspc{display:none}}
@media screen and (min-width: 736px){.padspd{display:none}}

/* 見出しh3 */

#midashi3 {
	position: relative;
  	margin-top: 2.5em;
    margin-bottom: 2em;
	padding: 0 .5em .5em 2em;
	border-bottom: 1px solid #ccc;
  font-size: 19px;
}
#midashi3::before,
#midashi3::after {
	position: absolute;
	content: '';
	border-radius: 100%
}
#midashi3::before {
	top: .2em;
	left: .2em;
	z-index: 2;
	width: 18px;
	height: 18px;
	background: rgba(150, 150, 150, .5);
}
#midashi3::after {
	top: .7em;
	left: .7em;
	width: 13px;
	height: 13px;
	background: rgba(210, 210, 210, .5);
}

/* table ボーダーなし*/

#bnashi table { width: 60%; margin:0 0 24px 0; }
#bnashi td, #bnashi th { border:none; padding:10px 15px 7px; line-height:2; font-size: 14px; }
#bnashi th { background:#f2f2f2; font-weight:normal; }

/* リストマーク */

.marublack li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/blackli.gif);
  font-size: 14px;
}
.marublue li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/blueli.gif);
  font-size: 14px;
}
.marubrown li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/brownli.gif);
  font-size: 14px;
}
.marugray li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/grayli.gif);
  font-size: 14px;
}
.marugreen li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/greenli.gif);
  font-size: 14px;
}
.marunavy li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/navyli.gif);
  font-size: 14px;
}
.maruoran li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/orangeli.gif);
  font-size: 14px;
}
.marupink li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/pinkli.gif);
  font-size: 14px;
}
.marured li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/redli.gif);
  font-size: 14px;
}
.marusian li {
	list-style-type: none;
	list-style-image: url(https://www.healing-aqua.com/wp-content/themes/ha-img/limark/sianli.gif);
  font-size: 14px;
}

/* ワンポイントアドバイス囲み */

.opabox {
    line-height: 195%;
    background-color: #fff;
    margin: 3.5em 0;
    padding: 2em;
    position: relative;
    z-index: 1;
}
.opabox::before,
.opabox::after {
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
    content: "";
    height: 100%;
    position: absolute;
    width: 100%;
}
.opabox::before {
    background-color: rgba(255, 255, 255, .5);
    left: 0;
    top: 0;
    z-index: -1;
}
.opabox::after {
    background-color: #efefef;
    top: 5px;
    left: 5px;
    z-index: -2;
}

/* お断り囲み */

.okotowaribox {
    border: 1px solid #da4033;
    border-radius: 4px;
    margin: 2em 0;
    padding: 2em;
    position: relative;
    font-size: 14px;
}
.okotowaribox::before {
    background-color: #fff;
    color: #da4033;
    content: "お断り";
    font-weight: bold;
    left: 1em;
    padding: 0 .5em;
    position: absolute;
    top: -1em;
}

/* 前編・続編記事 類似記事 */

.headline_kiji { border-bottom:1px solid #ddd; padding:0; margin:0 0 25px 0; }
.headline_kiji span { border-bottom:4px solid #ccc; padding:0 0 10px 0; margin:0; display:inline-block; font-size:18px; }

/* YouTube */

/*--.ytvideo {
position: relative;
padding-top: 30px;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
margin-top: 20px;
margin-bottom: 20px;
}

.ytvideo iframe {
position: absolute;
top: 0;
left: 0;
width: 56%;
height: 56%;
}--*/

.ytvideo{
margin-bottom: 30px;
}
@media screen and (max-width: 736px){.ytvideo{display:none}}
@media screen and (max-width: 736px){.ytvideo{display:none}}

.spytvideo {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
margin-top: 20px;
margin-bottom: 20px;
}

.spytvideo iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media screen and (min-width: 736px){.spytvideo{display:none}}
@media screen and (min-width: 736px){.spytvideo{display:none}}

/*--------------------------------------------------------
目次ページへのリンクボタン
------------------------------------------------------*/

.mokuji_link {
    margin:5px 10px 20px 0px;
    max-width: 100%;
    text-align: center;
    padding: 15px 0px;
    /*--margin-right: auto;--*/
    /*--margin-left: auto;--*/
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 16px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f0f9ff+0,cbebff+47,a1dbff+100;Blue+3D+%2313 */
background: #f0f9ff; /* Old browsers */
background: -moz-linear-gradient(top, #f0f9ff 0%, #cbebff 47%, #a1dbff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f0f9ff 0%,#cbebff 47%,#a1dbff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f9ff', endColorstr='#a1dbff',GradientType=0 ); /* IE6-9 */
}

.mokuji_link a {
 text-decoration: none !important;
 color: #333333 !important;
 display: block;
}

/*--------------------------------------------------------
リンクボタン　立ち上げ記録目次
------------------------------------------------------*/

.tachiage_mokuji {
    margin:10px auto 10px auto;
    max-width: 98%;
    text-align: center;
    padding: 4px 30px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 14px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f3e2c7+0,c19e67+50,b68d4c+51,e9d4b3+100;L+Brown+3D */
background: #f3e2c7; /* Old browsers */
background: -moz-linear-gradient(top, #f3e2c7 0%, #c19e67 50%, #b68d4c 51%, #e9d4b3 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f3e2c7 0%,#c19e67 50%,#b68d4c 51%,#e9d4b3 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f3e2c7 0%,#c19e67 50%,#b68d4c 51%,#e9d4b3 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3e2c7', endColorstr='#e9d4b3',GradientType=0 ); /* IE6-9 */
}

.tachiage_mokuji a {
 text-decoration: none !important;
 color: #ffffff !important;
 display: block;
}

/*--------------------------------------------------------
リンクボタン　その後の記録目次
------------------------------------------------------*/

.sonogo_mokuji {
    margin:10px auto 10px auto;
    max-width: 98%;
    text-align: center;
    padding: 4px 30px;
    background-color: #E53935;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 14px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#c7efe2+0,7cc7ae+50,85cbb5+51,b4ded0+100 */
background: #c7efe2; /* Old browsers */
background: -moz-linear-gradient(top, #c7efe2 0%, #7cc7ae 50%, #85cbb5 51%, #b4ded0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #c7efe2 0%,#7cc7ae 50%,#85cbb5 51%,#b4ded0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #c7efe2 0%,#7cc7ae 50%,#85cbb5 51%,#b4ded0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7efe2', endColorstr='#b4ded0',GradientType=0 ); /* IE6-9 */
}

.sonogo_mokuji a {
 text-decoration: none !important;
 color: #ffffff !important;
 display: block;
}

/*--------------------------------------------------------
リンクボタン　記録終了
------------------------------------------------------*/

.kirokuend_mokuji {
    margin:10px auto 10px auto;
    max-width: 98%;
    text-align: center;
    padding: 4px 30px;
    background-color: #E53935;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 14px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#febbbb+0,ff5c5c+51,febbbb+100 */
background: #febbbb; /* Old browsers */
background: -moz-linear-gradient(top, #febbbb 0%, #ff5c5c 51%, #febbbb 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #febbbb 0%,#ff5c5c 51%,#febbbb 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #febbbb 0%,#ff5c5c 51%,#febbbb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febbbb', endColorstr='#febbbb',GradientType=0 ); /* IE6-9 */
}

.kirokuend_mokuji a {
 text-decoration: none !important;
 color: #ffffff !important;
 display: block;
}

/*--------------------------------------------------------
リンクボタン　記事ページへジャンプ
------------------------------------------------------*/

.kijipage {
    margin:10px auto 10px auto;
    max-width: 98%;
    text-align: center;
    padding: 4px 1px;
    background-color: #E53935;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 14px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+51,fbdf93+100;Orange+3D+%235 */
background: #fceabb; /* Old browsers */
background: -moz-linear-gradient(top, #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=0 ); /* IE6-9 */
}

.kijipage a {
 text-decoration: none !important;
 color: #066945 !important;
 display: block;
}

/*--------------------------------------------------------
リンクボタン　スペック比較ページへ
------------------------------------------------------*/

.specpage {
    margin:10px auto 10px auto;
    max-width: 98%;
    text-align: center;
    padding: 4px 30px;
    background-color: #E53935;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 14px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ebf1f6+0,abd3ee+50,89c3eb+51,d5ebfb+100;Blue+Gloss+%234 */
background: #ebf1f6; /* Old browsers */
background: -moz-linear-gradient(top, #ebf1f6 0%, #abd3ee 50%, #89c3eb 51%, #d5ebfb 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ebf1f6 0%,#abd3ee 50%,#89c3eb 51%,#d5ebfb 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ebf1f6 0%,#abd3ee 50%,#89c3eb 51%,#d5ebfb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=0 ); /* IE6-9 */
}

.specpage a {
 text-decoration: none !important;
 color: #333333 !important;
 display: block;
}

/*--------------------------------------------------------
リンクボタン　レビューページへ
------------------------------------------------------*/

.reviewpage {
    margin:10px auto 10px auto;
    max-width: 98%;
    text-align: center;
    padding: 7px 10px;
    background-color: #E53935;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    font-weight: bold;
    color: #ffffff !important;
    font-size: 14px;
    box-shadow:2px 2px #999;
  
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f6f8f9+0,e5ebee+50,d7dee3+51,f5f7f9+100;White+Gloss */
background: #f6f8f9; /* Old browsers */
background: -moz-linear-gradient(top, #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f8f9', endColorstr='#f5f7f9',GradientType=0 ); /* IE6-9 */
}

.reviewpage a {
 text-decoration: none !important;
 color: #333333 !important;
 display: block;
}

/*--------------------------------------------------------
もっとアクアリウム　ページナビ
------------------------------------------------------*/

.ha-pagenavi a, .ha-pagenavi span {
    color:#999;
    background-color:#FFF;
    border:solid 1px #999;
    padding: 8px 15px;
    margin:0 2px;
    white-space: nowrap;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -webkit-transition: 0.2s ease-in-out;
    -moz-transition: 0.2s ease-in-out;
    -o-transition: 0.2s ease-in-out;
    transition: 0.2s ease-in-out;
}
.ha-pagenavi a:hover{
    color:#FFF; 
    background-color:#999; 
    border-color:#999;
    }
.ha-pagenavi span.current{
    color:#FFF;
    background-color:#666;
    border-color:#666;
    font-weight: bold;
    }

/*--------------------------------------------------------
　楽天・Amazon・Yahoo公式サイトへ
------------------------------------------------------*/

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

#rays{
	width:94%;
	/*--margin:0 3%;--*/
  margin-top: -1.8em;
  margin-bottom: 2.8em;
}

#rays ul{
	overflow: hidden;
	margin-left: 0px;
}

#rays ul li{
	height:50px;
	margin-top:20px;
	margin-right:20px;
	/*--background: #F7B981;--*/
	float:left;
	color: #ffffff !important;
	font-size: 15px;
	font-weight: bold;
	width: 33.33333%;
	width: calc((100% - 40px) / 3);
	width: -webkit-calc((100% - 40px) / 3);
	width: -moz-calc((100% - 40px) / 3);
	border-radius: 6px;
	text-align: center;
	display: table-cell;
	vertical-align: middle;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
}

#rays a{color: #fff !important;}

@media all and (-ms-high-contrast:none){
	#demo-rays ul.column3 li{
		width: calc((100% - 41px) / 3);
	}
}
#rays ul li:last-child {
	margin-right:0;
}

/*media query*/
@media screen and (max-width: 480px) {
	#rays ul li{
		float:none;
		width:100%;
	}
}

.rays:nth-child(1) {background-color: #e03939;}
.rays:nth-child(2) {background-color: #6ac7c7;}
.rays:nth-child(3) {background-color: #fbb54e;}