@charset "UTF-8";
/*================================================
 *  CSSリセット
 ================================================*/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary, time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	font-weight:normal;
}

h7{
	display: block;
}
body {
	line-height:1
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display:block
}
ul {
	list-style:none
}
blockquote, q {
	quotes:none
}
blockquote:before, blockquote:after, q:before, q:after {
	content:none
}
a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent
}
del {
	text-decoration:line-through
}
abbr[title], dfn[title] {
	border-bottom:1px dotted;
	cursor:help
}
table {
	border-collapse:collapse;
	border-spacing:0
}
hr {
	display:block;
	height:1px;
	border:0;
	border-top:1px solid #ccc;
	margin:1em 0;
	padding:0
}
input, select {
	vertical-align:middle
}
/*================================================
 *  一般・共通設定
 ================================================*/

body {
	width: 100%;
	margin: 0 auto;
	font-size: 16px;
	color: #333333;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
	line-height: 1.6;
	position: relative;
}
header{
	/*background: url(../img/common/bg_lg.png);
	background-repeat: repeat-x;
	background-size:200px;
	background-color: rgba(255,255,255,0.7);
	background-blend-mode: lighten;
	background-position: center;*/
}
.headerWP {
	width: 1000px;
	margin: 10px auto;
}
.spefont {
	font-family: "Anton", sans-serif;
  font-weight: 400;
  font-style: normal;
}
nav {
	width: 100%;
}
#contents {
	width: 1000px;
	margin: 10px auto;
}
#main,#main_contact {
	float: right;
	width: 75%;
}
a {
	color:#000;
}
a:hover {
	color:#e78f00;
}
h1 {
	width: 1000px;
	max-width: 100%;
	margin: 0 auto;
	color: #333333;
	font-size: 14px;
}
h1 a {
	color:#000;
	text-decoration:none;
}
h1 a:hover {
	color: #e78f00;
	text-decoration: underline;
}
h2 {
	margin-bottom: 0.5em;
	padding-left: 10px;
	font-size: 20px;
	color: #000;
	border-left: 5px solid #CA0007;
	font-weight: bold;
	margin: 0 0 20px 0;
}
h3 {
	margin-bottom: 0.5em;
	padding: 2px 5px;
	color: #CA0007;
	font-weight: bold;
	font-size: 18px;
}
h5 {
	margin-bottom:0.25em;
	padding:2px;
	color:#000;
	font-size:16px;
	border-top:1px dotted #999;
	border-bottom:1px dotted #999;
	background:#f1f1f1;
}
h6 {
	margin-bottom:0.25em;
	color:#382400;
	font-size:14px;
	font-weight:bold;
}
p {
	margin: 0.5em 0 1em 0;
}
img {
	vertical-align:bottom;
	max-width: 100%;
}
em {
	font-weight:bold;
}
strong {
	font-weight:bold;
	color:#f19500;
}
pre {
	margin:1em 0;
	padding:1em;
}
blockquote {
	margin-bottom:1em;
	padding:1em;
	border:1px dotted #ddd;
	border-left:5px solid #ddd;
}
ul, ol, dl {
	margin:0 0 1em 0;
}
ul li {
	list-style:disc;
}
ol li {
	list-style:decimal;
}
li {
	margin-left:2em;
}
/*dt {
	margin-bottom:0.5em;
	border-bottom:1px dotted #ddd;
}
dt:before {
	content:"\0025a0";
}
dd {
	margin-bottom:1em;
}*/

table {
	width:100%;
	margin-bottom:1em;
	border-collapse:collapse;
	border:1px solid #ddd;
}
th {
	padding:10px;
	text-align:center;
	vertical-align:middle;
	background:#f5f5f5;
}
td {
	padding:10px;
	text-align:left;
}
.clearFix:after {
	content: "";
	display: block;
	clear: both;
}
.img-responsive {
	max-width: 100%;
}
.sp,.tablet {
	display: none;
}
.kasari{
	position: relative;
}
/*================================================
 *  ヘッダー
 ================================================*/


.uehead{
	width: 1000px;
	max-width: 95%;
  margin: 10px auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
.ueheadlogo{
	width: 35%;
}
.uecontact{
	width: 65%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
}
.uecontact_tel,.uecontact_form{
	width: 47%;
	margin-left: 1%;
}

@media screen and (max-width:768px) {
	.ueheadlogo,.uecontact{
		width: 100%;
		text-align: center;
	}
	.uecontact_tel,.uecontact_form{
		width: 100%;
		margin-left: 0;
		margin-top: 2%;
}
}


/*================================================
 *  グローバルナビゲーション
 ================================================*/
nav {
	margin: 10px 0 0;
	padding: 0;
	background: #CA0007;
	overflow: hidden;
}
nav ul {
	width:960px;
	margin:0 auto;
	padding:0;
}
nav li {
	float:left;
	list-style:none;
	width:16.666%;
	margin:0;
	padding:0;
}
nav li a {
	display:block;
	padding:10px 0;
	color: #FFFFFF;
	font-weight: bold;
	text-align:center;
	text-decoration:none;
}
nav li a:hover {;
	text-decoration: none;
	background: #FFFFFF;
	color: #CA0007;
}
nav .navtab{
display: none;
}
/*=================================================
 *  サイドナビ
=================================================*/

#sub {
	float:left;
	width:21.25%;
}
/* 商品バナー */
#sub h3.prct {
	display: inline-block;
	color: #FFFFFF;
	line-height: 37px;
	position: relative;
	width: 100%;
	text-align: center;
	background-color: #CA0007;
	padding: 0;
}
#sub h3.prct:before {
	content: "\f06d";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 22px;
	vertical-align: middle;
}
/*しっぽ部分*/
/*
#sub h3.prct:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}*/
#sub .prct_bnr {
	overflow: hidden;
	margin: 3% 0 10%;
}
#sub .prct_bnr a{
	display: block;
	position: relative;
}
#sub .prct_bnr a .sideprott{
	position: absolute;
	bottom:0;
	left:0;
	padding: 2% 3% 6% 13%;
	box-sizing: border-box;
	width: 100%;
	font-size: 18px;
	font-weight: bold;
	margin: 0;
	color: #000;
	box-sizing: border-box;
}
@media screen and (max-width:1024px) {
	#sub .prct_bnr a .sideprott{
		font-size: 1.8vw;
}
}
@media screen and (max-width:768px) {
	#sub .prct_bnr a .sideprott{
		font-size: 7vw;
}
}
#sub .prct_bnr a .sideprottdou{
	line-height: 1;
	padding-bottom: 3%;
	font-size: 17px;
}
@media screen and (max-width:1024px) {
	#sub .prct_bnr a .sideprottdou{
		font-size: 1.5vw;
}
}
@media screen and (max-width:768px) {
	#sub .prct_bnr a .sideprottdou{
		font-size: 6vw;
}
}


#sub .prct_bnr a:hover {
	opacity: 0.7;
}
#sub .prct_bnr a img {
	margin-bottom: 2%;
}
/* サービス */
#sub h3.srv {
	display: inline-block;
	color: #FFFFFF;
	line-height: 37px;
	position: relative;
	width: 100%;
	text-align: center;
	background-color: #CA0007;
	padding: 0;
}
#sub h3.srv:before {
	content: "\f015";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 22px;
	vertical-align: middle;
}
/*しっぽ部分*/
/*
#sub h3.srv:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}*/
/* LINE QRコード登録 */
#sub h3.line {
		display: inline-block;
		color: #FFFFFF;
		line-height: 37px;
		position: relative;
		width: 100%;
		text-align: center;
		background-color: #CA0007;
		padding: 0;
	}
	#sub h3.line:before {
		content: "\f06d";
		font-family: FontAwesome;
		margin-right: 5px;
		font-size: 22px;
		vertical-align: middle;
	}
/*しっぽ部分*/
/*
#sub h3.line:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}*/
#sub h3.line i{
	margin: 0 10px 0 0;
}
.lineQR img{
	margin: 0 auto 10px auto;
	width: 180px!important;
	max-width: 100%!important;
	display: block;
}

/* 対応エリア */
#sub h3.area {
	display: inline-block;
	color: #FFFFFF;
	line-height: 38px;
	position: relative;
	width: 100%;
	text-align: center;
	background-color: #CA0007;
	padding: 0;
}
#sub h3.area:before {
	content: "\f041";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 22px;
	vertical-align: middle;
}
/*しっぽ部分*/
/*#sub h3.area:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}*/
/* メーカー */
#sub h3.mk {
	display: inline-block;
	color: #FFFFFF;
	line-height: 38px;
	position: relative;
	width: 100%;
	text-align: center;
	background-color: #CA0007;
	padding: 0;
}
#sub h3.mk:before {
	content: "\f06d";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 22px;
	vertical-align: middle;
}
/*しっぽ部分*/
/*#sub h3.mk:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}*/
#sub img.maker {
	border: solid 1px #CCC;
	margin: 1%;
	width: 98%;
	padding: 1% 0;
}
@media screen and (max-width:768px) {
.mkb {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
}
#sub img.maker {
	width: 150px;
	margin: 3%;
}
}
/*対応エリア*/
#sub p.area {
}
#sub p.area span {
	font-weight: bold;
	color: #330A00;
}
#sub p.area span:after {
	content: "\A";
	white-space: pre;
}
/* エコキュート交換の流れ */
#sub .bnr h3.step {
	display: inline-block;
	color: #FFFFFF;
	line-height: 38px;
	position: relative;
	width: 100%;
	text-align: center;
	background-color: #CA0007;
	padding: 0;
	margin-top: 1em;
}
#sub h3.step:before {
	content: "\f0ad";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 22px;
	vertical-align: middle;
}
/*しっぽ部分*/
/*#sub h3.step:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}*/
#sub .bnr dl {
	overflow: hidden;
	margin: 0;
}
#sub .bnr dl dt {
	float: left;
	width: 70px;
	clear: both;
	margin-right: 5px;
	margin-bottom: 5%;
}
#sub .bnr dl dt img {
	width: 70px;
}
#sub .bnr dl dd {
	font-size: 14px;
	line-height: 1.6;
	margin-bottom: 5%;
	margin-top: 0.5%;
}
#sub .bnr dl dd p {
	margin-top: 0;
}
#sub .bnr dl dd p span {
	padding: 1%;
	border: 1px solid;
	line-height: 2;
	color: #000000;
}
#sub .bnr a.jump {
	float: right;
}
#sub .bnr a.jump:before {
	content: "\f101";
	font-family: FontAwesome;
}
/* ページバナー */
#sub .bnr .page_bnr {
	margin: 20% 0 3%;
}
#sub .bnr .page_bnr img {
	margin-bottom: 3%;
}
#sub .page_bnr {
	text-align: center;
}
/* 追加のコラム */
#sub h3.column {
	display: inline-block;
	color: #FFFFFF;
	line-height: 38px;
	position: relative;
	width: 195px;
	text-align: center;
	background-color: #CA0007;
	padding: 0;
}
#sub h3.column:before {
	content: "\f06d";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 22px;
	vertical-align: middle;
}
#sub h3.column:after {
	content: "";
	border-style: solid;
	border-width: 0;
	position: absolute;
	width: 0;
	height: 0;
	border-color: #CA0007 transparent;
	right: -19px;
	border-width: 19px 19px 20px 0px;
}
#sub .column_list {
	overflow: hidden;
}
#sub .column_list ul {
}
#sub .column_list ul li {
}
#sub .column_list ul li a {
	font-weight: normal;
	line-height: 1.3;
	padding: 0;
	border: none;
}
#sub .column_list ul li a:hover {
	font-weight: bold;
}
/* 問い合わせ */
#sub .bnr .info {
	overflow: hidden;
	background: #CA0007;
	text-align: center;
	padding: 1% 0;
	margin-bottom: 5%;
	clear: both;
}
#sub .bnr .info h4 {
	color: #FFFFFF;
	width: 100%;
	border-bottom: 5px solid #FFFFFF;
	font-size: 18px;
	padding: 5% 0px;
}
#sub .bnr .info h4:before {
	content: "";
}
#sub .bnr .info p {
	padding: 0;
	margin: 5% 0 0 0;
	line-height: 1;
	color: #FFFFFF;
	font-size: 18px;
	font-weight: bold;
}
#sub .bnr .info a {
	display: block;
	background: #FFFFFF;
	margin: 3%;
	padding: 3% 0;
	border-radius: 40px;
	text-decoration: none;
	font-weight: bold;
	font-size: 18px;
}
#subnav {
	display:none;
}
.submenu li {
	margin:0;
	padding:0;
	list-style:none;
}
.submenu li a:before {
	content:"\0025a0";
	color:#000;
}
.submenu li a {
	display: block;
	padding:5px 2px;
	color: #000;
	border-bottom:1px dotted #ddd;
	text-decoration:none;
}
.submenu li a:hover {
	background:#eee;
}
/*.bnr {
	overflow:hidden;
}　エラーのため外し*/
.bnr ul {
	overflow:hidden;
}
.bnr li {
	margin: 0 0 6px 0;
	padding:0;
	list-style:none;
}
.bnr li a {
	padding: 5px;
	text-decoration: none;
	display: block;
	font-weight: bold;
	color: #330A00;
}
.bnr li a:hover {
	margin-bottom: -1px;
	border-bottom: 1px solid #330A00;
}
.bnr img {
	width:100%;
}
/*================================================
 *  宣言・お問い合わせ
 ================================================*/

 .appboxue{
 	position: absolute;
 	top: 0;
 	left: 0;
 	padding: 0% 1% 0 1%!important;
 	width: 100%;
 	font-size: 20px;
 	color: #fff;
 	font-weight: bold;
 	margin: 0;
	box-sizing: border-box;
 }
 .appboxst{
 	position: absolute;
 	bottom: 0;
 	left: 0;
 	padding: 1% 1% 2% 4%;
 	width: 100%;
 	font-size: 21px;
 	font-weight: bold;
 	margin: 0;
 	line-height: 1.2;
	box-sizing: border-box;

 }


ul.contact_banner {
	margin: 10px 0 10px;
	width: 100%;
}
ul.contact_banner li {
	list-style-type: none;
	margin: 0;
	float: left;
	width: 49.35%;
}
ul.contact_banner li + li {
	margin-left: 1.3%;
}
/* 電話 */
ul.contact_banner li.contacttel {
	background: url("../img/common/contact_tel.png") no-repeat;
	background-size:contain;
	width: 370px;
}
ul.contact_banner li.contacttel:hover {
	background: url("../img/common/contact_tel_on.png") no-repeat;
	background-size:contain;
}
ul.contact_banner li.contacttel a img {
	opacity: 0;
}
/* ウェブ */
ul.contact_banner li.contactweb {
	background: url("../img/common/contact_web.png") no-repeat;
	background-size:contain;
	width: 370px;
}
ul.contact_banner li.contactweb:hover {
	background: url("../img/common/contact_web_on.png") no-repeat;
	background-size:contain;
	width: 370px;
}
ul.contact_banner li.contactweb a img {
	opacity: 0;
}
footer {
	position: absolute;
	left: 0;
	clear:both;
	width: 100%;
}
.footmenu {
	width:100%;
	padding:20px 0;
	overflow:hidden;
	background: #4C1300;
}
.footmenu ul {
	position:relative;
	float:left;
	left:50%;
	margin:0;
}
.footmenu li {
	position:relative;
	left:-50%;
	float:left;
	list-style:none;
	margin:0;
	padding:0 10px;
	font-size:14px;
	text-align:center;
}
.footmenu li a {
	text-decoration: none;
	color: #ffffff;
}
.copyright {
	clear: both;
	padding: 5px 0;
	font-size: 14px;
	text-align: center;
	background: #CA0007;
	color: #FFFFFF;
}
 @media screen and (max-width:768px) {
.copyright {
	padding-bottom: 20%;
}
}
 @media screen and (max-width:480px) {
.copyright {
	padding-bottom: 70%;
}
}
/*================================================
 *  ページトップへの戻り
 ================================================*/
 .totop {
 	position:fixed;
 	bottom:15px;
 	right:15px;
 }
 @media screen and (max-width:768px) {
.totop {
	position:fixed;
	bottom:150px;
}
}
@media screen and (max-width:480px) {
	.totop {
		bottom:190px;
}
}
.totop a {
	display:block;
	text-decoration:none;
	text-align: right;
	width: 80px;
}
.totop img {
}
.totop img:hover {
	opacity: 0.8;
}
.totop .tomoline{
	display: block;
	margin-bottom: 2%;
}
@media screen and (max-width:480px) {
	.totop .tomoline,.totop .linebanner{
		display: none;
	}
}
/*================================================
 *  フロートバナー　電話
 ================================================*/
 .denwa{
	 display: none;
 }
 @media screen and (max-width:768px) {
.denwa{
	display: block;
	position: fixed;
	width: 40%;
	bottom:15px;
	right:15px;
}
.denwasp{
	display: none;
}
}
@media screen and (max-width:480px) {
	.denwa{
		width: 100%;
		right: 0;
		bottom: 0;
	}
	.denwasp{
		display: block;
	}
	.denwapc{
		display: none;
	}
}
.denwa img{
	max-width: 100%;
}
@media screen and (max-width:480px) {
	.denwa img{
		display:block;
	}
}

.contactsp{
	display: none;
}
@media screen and (max-width:767px) {
	.contactsp{
		display:flex;
		position: fixed;
		bottom: 0;
		left: 0;
		flex-wrap: wrap;
		width: 100%;
	}
}

.contactsp a{
	text-decoration: none;
	box-sizing: border-box;
	color: #fff;
	text-align: center;
	display: grid;
	place-items: center;
	font-size: 18px;
	font-weight: bold;
	padding: 2%;

}
@media screen and (max-width:600px) {
	.contactsp a{
		font-size: 3vw;
}
}
.contactsp a .smj{
	font-size: 60%;
}
.contactsp a:hover{
	background: #000;
	color: #fff;
}
a.ctdenwa{
	background: #0099ff;
	width: 45%;
}
a.ctweb{
	background: #c42082;
	width: 27.5%;
}
a.ctline{
	background: #00b900;
	width: 27.5%;
}


/*================================================
 *  クラス
 ================================================*/
.textL {
	text-align:left;
}
.textR {
	text-align:right;
}
.textC {
	text-align:center;
}
.verbase{
	vertical-align: baseline;
}
.list {
	padding:0 0 0 0.5em;
}
.list li {
	margin:0;
	padding:0 0 0 15px;
	list-style:none;
	background:url(../img/check.png) 0 5px no-repeat;
}
.info dt {
	border-bottom:none;
}
.info dd {
	padding-bottom:1em;
	border-bottom:1px solid #ddd;
}
.cobl{
	color: #000000;
}

.imgcenter{
	display: block;
	margin: 1% auto;
}

.nodecor{
	text-decoration: none;
}

.mt5{
	margin-top: 5%;
}

.mt10{
	margin-top: 10%;
}

.mb5{
	margin-bottom: 5%;
}


/*================================================
 *  トップページ
 ================================================*/

 .uebn{
	 width: 950px;
	 max-width: 95%;
	 margin: 2% auto;
 }


/* スライドショー */
.slidesp{
	display: none!important;
}
/*.slide {
	display:none;
	position:relative;
	overflow:hidden;
}
.slidePrev {
	position:absolute;
	cursor:pointer;
	z-index:100;
}
.slideNext {
	position:absolute;
	cursor:pointer;
	z-index:100;
}
.slidePrev img {
	position:absolute;
	width:50px !important;
	height:60px !important;
}
.slideNext img {
	position:absolute;
	width:50px !important;
	height:60px !important;
}
.slideInner {
	position:relative;
	margin:0 0 5px 0;
	padding:0;
}
.slideInner li {
	float:left;
	margin:0;
	padding:0;
	list-style:none;
}
.slideInner li img {
	margin:0 5px;
	padding:0;
}
.filterPrev {
	position:absolute;
	left:0;
	opacity:0.5;
	filter:alpha(opacity=50);
	background-color:#fff;
}
.filterNext {
	position:absolute;
	right:0;
	opacity:0.5;
	filter:alpha(opacity=50);
	background-color:#fff;
}*/

/*slide*/
.topslide{
	background: url(../img/index/bg_km.png);
	background-size: cover;
	background-position: bottom center;
	background-color: rgba(255,255,255,0.2);
	background-blend-mode: lighten;
	padding: 2% 0;
}
.topslide .inner{
	width: 950px;
	max-width: 95%;
	margin: auto;
}
.topslide .slide{
	width: 90%;
	border: 10px #fff solid;
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
}
.topslide  .slide img{
	width: 100%;
}

.slide{
	line-height: 0;
}
.slick-dotted.slick-slider{
	margin-bottom: 0;
}
.slick-dots{
	bottom: 5px;
}

.slick-next:before,.slick-prev:before{
	font-size: 25px;
	font-weight: bold;
	background: rgba(0,0,0,0.8);
	border-radius: 50%;
	padding: 2% 30%;
}

.slick-next,.slick-prev{
	z-index: 10;
	right: 20px;
}
.slick-prev{
	left: 10px;
	right: auto;
}


.griy{
	background: #CA0007;
	padding: 1%;
	padding-bottom: 3%;
}
.griy .griytt{
	display: grid;
	place-items:center;
	color: #fff;
	font-weight: bold;
	font-size: 33px;
	margin-bottom: 1%;
	margin-top: 0;
	letter-spacing: 5px;
}

.griy .griyinbox{
	width: 900px;
	max-width: 90%;
	margin-left: auto;
	margin-right: auto;
	background: #fff;
	padding: 1.5%;
	display: grid;
	place-items:center;
	border-radius: 10px;
	box-shadow: 2px 2px 3px #333 inset;
}
.griy .griydt{
	font-weight: bold;
	font-size: 23px;
}




.controlNav {
	position:relative;
	float:left;
	left:50%;
}
.controlNav span {
	position:relative;
	left:-50%;
	float:left;
	margin:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	border-radius:5px;
	width:10px;
	height:10px;
	overflow:hidden;
	background:#ccc;
	text-indent:-9999px;
	vertical-align:middle;
}
.controlNav span:hover {
	background:#999;
	cursor:pointer;
}
.controlNav span.current {
	background:#f19500;
}
/* トップナビ */
* html .topNavi {
	height:1em;
	overflow:visible;
}
.topNavi {
	overflow:hidden;
	position:relative;
	margin-right:-1.030%;
	margin-top:20px;
	margin-bottom:20px;
}
.topNaviColumn {
	display:inline;
	width:32.302%;
	float:left;
	margin-right:1.030%;
}
.topNaviCon {
	position: relative;
	display: block;
	box-sizing: border-box;
	overflow: hidden;
	padding: 10px;
	text-decoration: none;
	transition: background 0s ease 0s, border 0.5s ease-out 0s;
	background: rgba(255, 50, 0, 0.08);
	border-radius:4px;
}
.topNaviCon:hover {
	color:#000;
	background:#fff9f5 none repeat scroll 0 0;
	transition:background 0s ease 0s, border 0.5s ease-out 0s;
}
.topNaviCon h2 {
	margin: 3px 0;
	padding: 0;
	font-size: 16px;
	font-weight: bold;
	color: #CA0007;
	border: none;
}
.topNaviCon:hover h2 {
}
.topNaviCon p {
	margin: 0;
	line-height: 1.5;
}
.hot_contact {
	float: right;
	text-decoration: none;
	font-size: 16px;
}
.hot_contact:after {
	content: "\f0a9";
	font-family: FontAwesome;
	margin-left: 3px;
}
.hot_contact:hover {
	font-weight: bold;
	color: #000;
}
.topNaviPhoto img {
	width:100%;
}
.indexPrct {
	letter-spacing: 5px;
	margin-bottom: 5%;
}
.indexPrct a:hover {
	opacity: 0.6;
}
.prctBox {
	display: inline-block;
	margin-bottom: 10px;
	position: relative;
}
.prctBox .prctBoxtt{
	position: absolute;
	top:0;
	left:0;
	padding: 1% 3%;
	box-sizing: border-box;
	margin: 0;
	font-size: 30px;
	font-weight: bold;
	color: #000;
}
@media screen and (max-width:1024px) {
	.prctBox .prctBoxtt{
		font-size: 3vw;
}
}
@media screen and (max-width:768px) {
	.prctBox .prctBoxtt{
		font-size: 7vw;
}
}
@media screen and (max-width:480px) {
	.prctBox .prctBoxtt{
		left: 5%;
}
}
@media screen and (max-width:400px) {
	.prctBox .prctBoxtt{
		left: 0;
}
}

/* エコキュートの知識 */
#main .point {
	overflow: hidden;
	background: #FFEAE5;
	margin-bottom: 2%;
}
#main .point .box {
	padding: 1%;
}
#main .point .box img {
	float: left;
	width: 50%;
	clear: both;
	margin: 0 1% 0 0;
}
@media screen and (max-width:768px) {
#main .point .box img {
	float: none;
	width: 100%;
}
}
#main .point .box .cmt {
	margin: 0;
}
@media screen and (max-width:768px) {
#main .point .box .cmt {
	padding: 1%;
}
}
#main .point a:hover {
	opacity: 0.7;
}
/*================================================
 *  商品ページ
 ================================================*/
 .products #main h4.shohinyo {
 margin-bottom: 0.25em;
 font-size: 18px;
 color: #000000;
 font-weight: bold;
 background-color: #ffcd3c;
 padding-left: 1%;
 }
 .products #main h4:before {
 content: "\f06d";
 font-family: FontAwesome;
 margin-right: 5px;
 }
 .products #main .tenlogo{
 width: 100px;
 }
.products #main .chushaku p{
	background-color: #e7141a;
	color: #ffffff;
	font-weight: bold;
	display: inline-block;
	padding: 1% 2%;
	margin: 1% 0;
	font-size: 18px;
}
.products #main .chushaku p.nobi{
	width: 96%;
}
.products #main .chushaku a{
	background-color: #CA0007;
	color: #ffffff;
	font-weight: bold;
	display: block;
	padding: 3% 2%;
	margin: 1% 0;
	font-size: 18px;
	text-decoration: none;
	width: 100%;
	box-sizing: border-box;
	text-align: center;
	border-radius: 8px;
}
.products #main .chushaku a:hover{
	opacity: 0.8;
}
.products .hojari{
	margin-top: 2%;
	margin-top: 2%;
	text-align: center;
	font-weight: bold;
	color: #fff;
	font-size: 30px;
	padding: 0.1%;
	background: #DB050D;

}

.products #main .shohin{
	width: 100%;
	margin-left:auto;
	margin-right:auto;
}



.products #main .shohin .shooutlf{
	width: 64%;
	float: left;
}
@media screen and (max-width:480px) {
	.products #main .shohin .shooutlf{
		width: 100%;
		float: none;
	}
}
.products #main .shohin .sholf{
	width: 40%;
	float: left;
}
.products #main .shohin .waribiki{
	background: linear-gradient(#FB0811, #CA0007);
	border-radius: 8px;
	box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.4);
	color: #ffffff;
	font-weight: bold;
	font-size: 40px;
	line-height: 1.2;
	padding-bottom: 5%;
	text-shadow: 3px 3px 2px #333333;
	width: 100%;
	marging-bottom: 2%;
	text-align: center;
	box-sizing: border-box;

}
@media screen and (max-width:768px) {
	.products #main .shohin .waribiki{
		font-size: 6vw;
	}
}
.products #main .shohin .wsmj{
	font-size: 60%;
	font-weight: bold;
}
.products #main .shohin .logoim{
	max-width: 100%;
	margin-left:auto;
	margin-right:auto;
	display: block;
}
.products #main .shohin .shoim{
	float: right;
	width: 55%;
	position: relative;
}
.products #main .shohin .shoim img{
	display:block;
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}
.products #main .shohin .shoim .addre{
	position: absolute;
	width: 45%;
	left: 0;
	top: 10%;
	border: dashed #CA0007 1px;
	padding: 1%;
	border-radius: 5px;
}
@media screen and (max-width:1024px) {
	.products #main .shohin .shoim .addre{
		position: static;
		width: 100%;
		box-sizing: border-box;
	}
}
.products #main .shohin .shoim .remotext{
	font-weight: bold;
	margin: 1% 1% 0 1%;

}
.products #main .shohin .shoyo{
	width: 35%;
	float: right;
	margin-top: 3%;
}
@media screen and (max-width:480px) {
	.products #main .shohin .shoyo{
		width: 100%;
		box-sizing: border-box;
		float: none;
		clear: both;
	}
}
.products #main .shohin .shoyo .shokai{
	list-style-type: none;
	background-color: #CA0007;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	padding: 2%;
	margin-bottom: 1%;
	border-radius: 8px;
	color: #ffffff;
}
@media screen and (max-width:480px) {
	.products #main .shohin .shoyo .shokai{
		margin-left: 0;
	}
}


.products #main dl {
	height: auto;
	box-sizing: border-box;
	margin: 10px 0 20px 0;
	padding: 0;
	letter-spacing: -.4em;
	border: 1px solid #CCCCCC;
}
.products #main dt {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	width: 100%;
	font-size: 20px;
	letter-spacing: normal;
	background-color: #EFEAE6;
	color: #572C00;
	font-weight: bold;
}

.products #main dt.marka {
	background-color: #CA0007;
	color:#fff;
	font-weight:bold;
	font-size:larger;
}
.products #main dd {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	line-height: 64px;
	font-size: 20px;
	letter-spacing: normal;
	color: #333333;
}
.products #main dd.markb {
	line-height: 80px;
	font-size: larger;
	background-color: #FDFFBB;
}
.products #main dd.markbnum {
	line-height: 40px!important;
}
.products #main dd.pnum {
	width: 40%;
	vertical-align: middle;
	line-height: 1.2;
}
.products #main dd.pnum span {
	font-size: 16px;
}
.products #main dd.price {
	width: 60%;
}
.products #main dd span.p1 {
}
.products #main dd span.p2 {
	vertical-align: middle;
	font-size: 36px;
	font-weight: bold;
	color: #CA0007;
}
.products #main dd span.p2:before {
	content: "\f0a9";
	font-family: FontAwesome;
	color: #333333;
	margin-right: 5px;
}
.products #main dd span.tax {
	font-size: 16px;
}
.products #main dd span.tax2 {
	color: #CA0007;
	font-size: 16px;
}
.products #main dd.alls {
	width: 100%;
	line-height: 1.3;
    text-align: left;
    padding-left: 3%;
    padding-bottom: 2%;
    border-top: dashed 1px #ccc;
    padding-top: 2%;
    box-sizing: border-box;
}

.products #main dd.hjh{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	width:95%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3%;
	background: #fff;

}
.products #main dd.hjh span{
	font-weight: bold;

}
.products #main .hjk{
	box-sizing: border-box;
	width: 40%;
	padding: 0.5% 5% 0.5% 1%;
	font-size: 20px;
	font-weight: bold;
	color: yellow;
	background: linear-gradient(#f40404,#ba0000);
	clip-path: polygon(0 0, 80% 0px, 100% 50%, 80% 100%, 0 100%);
	line-height: 2;
}
.products #main .hjt{
	font-size: 140%;
}
.products #main .hjg{
	box-sizing: border-box;
	overflow: hidden;
	width: 58%;
	font-size: 88px;
	font-weight: bold;
	display: flex;
	position: relative;
	padding: 1.5%;
	justify-content: space-between;
}
.products #main .hjg::before{
	position: absolute;
	top: -2px;
	left:0;
	width: 100%;
	height: 100%;
	content: "";
	background: linear-gradient(#fc2500,#ba0000);
	mix-blend-mode: screen;

}
.products #main .hjg span.spefont{
	font-weight: normal;
}
.products #main .hje{
	font-size: 25%;
	font-weight: bold;
	line-height: 1.8;
}
.products #main .hkr{
	font-size: 50%;
	font-weight: bold;
}



.products #main .shohinea{
	border-bottom: solid 2px #333333;
	border-top: none;
	margin-top: 2%;
	margin-bottom: 10%;
}

.products .include{
	border: solid 2px #4C1300;
	margin-bottom: 3%;
}
.products .incl_tt{
	background-color: #4C1300;
	padding: 2%;
	font-weight: bold;
	color: #ffffff;
	text-align: center;
	font-size: 18px;
	margin-top: 0;
}
.products .include_in{
	padding: 1%;
}
.products .incl_de{
	list-style: disc;
	font-weight: bold;

}
.products br.hjchosei{
			display: none;
}

@media screen and (max-width:980px) and (min-width:768px) {
	.products br.hjchosei{
		    display: block;
	}

}



@media screen and (max-width:980px) {


	.products #main dd.hjh{
		justify-content: center;
}
	.products #main .hjk{
		width: 60%;
		padding: 0.5% 0.5% 5% 0.5%;
		clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 98%, 0px 80%);
		margin-bottom: 3%;
	}
	.products #main .hjt{
		font-size: 140%;
	}
	.products #main .hjg{
		box-sizing: border-box;
		overflow: visible;
		width: 100%;
		font-size: 85px;
		justify-content: center;
	}
.products #main .hje{
	line-height: 2;

	}
}
	@media screen and (max-width:576px) {
		.products #main .hjk{
			font-size: 5vw;
}
		.products #main .hjg{
			font-size: 14vw;
		}


}

/*================================================
 *  商品詳細仕様ページ
 ================================================*/

  .shosai li{
		list-style-type: none;
		margin-left: 0;
	}
.shosai .shosainaiyo{
	margin-bottom: 15%;

}
 .shosai #main h4.shosaiyo {
 margin-bottom: 0.25em;
 font-size: 18px;
 color: #000000;
 font-weight: bold;
 background-color: #ffcd3c;
 padding-left: 1%;
 }
 .shosai #main h4.shosaiyo:before {
 content: "\f06d";
 font-family: FontAwesome;
 margin-right: 5px;
 }
 .shosai #main .shosaitenlogo{
 width: 100px;
 }

  .shosai .ttkino{
		margin-bottom: 4%;
		font-weight: bold;
	}
 .shosai .shonaiyo{
	 width: 30%;
	 margin-left: 1%;
	 display: inline-block;
	 background-color: #fce4a4;
	 padding: 1%;
	 border-radius: 3px;
	 box-sizing: border-box;
	 margin-bottom: 1%;
	 text-align: center;
 }
 @media screen and (max-width:768px) {
	 .shosai .shonaiyo{
		 width: 48%;
	 }
}
.shosai .shonaiyotwo{
	width: 48%;
	margin-left: 1%;
	display: inline-block;
	background-color: #fce4a4;
	padding: 1%;
	border-radius: 3px;
	box-sizing: border-box;
	margin-bottom: 1%;
	text-align: center;
	vertical-align: top;
}

@media screen and (max-width:480px) {
	.shosai .shonaiyo,.shosai .shonaiyotwo{
		font-size: 3vw!important;
		width: 85%;
		margin-left:auto;
		margin-right:auto;
		display: block;
	}
}

	.shosai .shobox{
		background: linear-gradient(#fce4a4,#ffffff);
		padding: 2%;
		border-radius: 8px;
		margin-top: 2%;
		margin-bottom: 2%;
	}
		.shosai .shoboxone{
			position: relative;
	}
	.shosai .shoboxone p{
		text-align: center;
		width: 100%;
	}
	.shoboxfour{
		width: 23%;
		margin: 1%;
		margin-left: 0;
		display: inline-block;
	}
	@media screen and (max-width:768px) {
		.shoboxfour{
			width: 45%;
		}
	}
	@media screen and (max-width:480px) {
		.shoboxfour{
		width: 100%;
		height: auto;
		margin-bottom: 5%;
}
}
	.shosai .shoboxfouchosei{
		position: relative;
		height: 200px;
	}
	@media screen and (max-width:768px) {
		.shosai .shoboxfouchosei{
		height: 250px;
	}
}
@media screen and (max-width:480px) {
	.shosai .shoboxfouchosei{
	height: auto;
}
}
.shosai .shoboxfouchosei img{
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (max-width:480px) {
	.shosai .shoboxfouchosei img{
		position: static;
		margin-left:auto;
		margin-right:auto;
		display: block;
	}
}
.shosai .shoboxfouchosei p{
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	width: 100%;
}
@media screen and (max-width:480px) {
	.shosai .shoboxfouchosei p{
		position: static;
	}
}

	.shosai .number{
		position: absolute;
		display: block;
		height: 20px;
		width: 20px;
		left: 0;
		top: 0;
		background-color: #ffcd3c;
		font-weight: bold;
		text-align: center;
		border-radius: 50%;
		box-shadow: 3px 3px 3px #333333;
	}
	.shosai .shoboxtwo{
		width: 48%;
		display: inline-block;
		vertical-align: top;
	}
	.shosai .shoboxtwobase{
		width: 48%;
		display: inline-block;
		vertical-align: baseline;
	}
	@media screen and (max-width:480px) {
		.shosai .shoboxtwo,.shosai .shoboxtwobase{
			width: 100%;
			display: block;
		}
}
.shosai .shonor{
	background-color: transparent;
	text-align: left;
}
.shosai li.ten:before,.shosai p.ten:before,.shosai .ten:before{
	content: "◆";
	margin-right: 5px;
	color: #ff3200;
	margin-right: 2%;
}
.shosai .kodawariim,.shosai .slimim{
	float: right;
	max-width: 30%;
}
@media screen and (max-width:480px) {
	.shosai .kodawariim,.shosai .slimim{
		display: block;
		margin-left: auto;
		margin-right: auto;
		float: none;
		max-width: 100%;
	}
}
/*=================================================
 *  ごあいさつページ　greeting
=================================================*/

.greeting_main {
	margin-bottom: 5%;
}

.greeting span {
	color: #4C1300;
	font-weight: bold;
}
.greeting .column {
	background: #CA0007;
	color: #FFFFFF;
	padding: 1px 5px;
	font-weight: bold;
	border-bottom: 4px double #FFFFFF;
}
.greeting .type {
	font-weight: bold;
	margin: 0;
	color: #330A00;
}
.greeting .type:before {
	content: "\f0ad";
	font-family: FontAwesome;
	margin-right: 5px;
}
.greeting ul.grtul {
}
.greeting ul li.grtli {
	list-style: none;
	font-weight: bold;
	font-size: 16px;
	margin: 0 0 0 5px;
}
.greeting ul li.grtli:before {
	content: "\f1ae";
	font-family: FontAwesome;
	font-size: 20px;
	margin-right: 5px;
}

.greeting .thrbox{
	border: inset 10px #ed6933;
	padding: 3%;
	width: 100%;
	box-sizing: border-box;
	margin: 2% auto;
}

.greeting .thrboxlf{
	float: left;
	max-width: 30%;
	display: block;
}
.greeting .thrboxri{
	float: right;
	max-width: 55%;
	display: block;
}
@media screen and (max-width:480px) {
	.greeting .thrboxlf{
		float: none;
		max-width: 95%;
		margin: 2% auto;
}

.greeting .thrboxri{
	float: none;
	max-width: 95%;
	margin: 2% auto;
}
}

.greeting .gtbox{
	padding: 3%;
	box-sizing: border-box;
	width: 100%;
	background-color: #fce69f;
	border: 1px solid #f9ce3e;
}
@media screen and (max-width:480px) {
.greeting .grtel{
	display: block;
	margin: 1% auto;
}
}
.greeting .gtshomei{
	text-align: right;
	font-weight: bold;
}

.greeting .tosite{
	font-size: 23px;
	font-weight: bold;
	color: #CA0007;
}
@media screen and (max-width:480px) {
	.greeting .tosite{
		font-size: 4.5vw;
	}
}
.greeting .tosite_each{
	font-size: 18px;
	font-weight: bold;
}
@media screen and (max-width:480px) {
	.greeting .tosite_each{
		font-size: 4.3vw;
	}
}

.greeting .tosite_each .fa-check-square{
	color: #CA0007;
	margin-right: 1%;
}

/*=================================================
 *  施工事例ページ　case
=================================================*/

.case .case_type {
	letter-spacing: 5px;
	margin-bottom: 5%;
}
.case .caseBox {
	display: inline-block;
	margin-bottom: 1%;
}

.case_detail li{
	display: inline-block;
	margin: 1%;
	width: 30%;
	position: relative;
}
.case_detail li span.numb{
	position: absolute;
	display: block;
	border-radius: 50%;
	height: 30px;
	width: 30px;
	line-height: 30px;
	vertical-align: middle;
	font-size: 16px;
	font-weight: bold;
	color: #ffffff;
	background-color: #CA0007;
	left: 0;
	top: 0;
	text-align: center;
	box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.4);
}
.case_detail img{
	display: block;
	margin-left:auto;
	margin-right:auto;
}

@media screen and (max-width:768px) {
	.case_detail .fbox{
		width: 47%;
	}
}
@media screen and (max-width:480px) {
	.case_detail .fbox{
		width: 97%;
	}
}
/*=================================================
 *  会社概要ページ　company
=================================================*/

.company_main {
	margin-bottom: 5%;
}
.company_main table {
	border: none;
}
.company_main th {
	width: 22%;
	background: #FFFECC;
	border-bottom: 1px solid #330A00;
	font-weight: bold;
	color: #330A00;
}
.company_main td {
	border-bottom: 1px solid #330A00;
	vertical-align: middle;
}
@media screen and (max-width:480px) {
	.company_main th,.company_main td {
		width: 95%;
		margin-left: auto;
		margin-right: auto;
		display: block;
	}
}

/*================================================
 *  お問い合わせページ　contact
=================================================*/

table.mailform {
	width: 100% !important;
	border: none;
	margin: 0 auto;
}
.mailform dl {
	border-bottom: dashed 1px #aaa;
	display: block;
	padding: 10px 20px;
}
table.mailform tr th {
	/*width: 400px !important;*/
	/* box-sizing: border-box; */
    background: transparent;
	border: none;
}
table.mailform td {
	border: none;
}
table span.hisu {
	margin-left: 10px;
	background: #ff0000;
	color: #fff;
	border-radius: 6px;
	padding: 1px 5px;
}
table span.nini {
	margin-left: 10px;
	background: #c7c7c7;
	color: #fff;
	border-radius: 6px;
	padding: 1px 5px;
}
.mailform span.hisu {
	margin-left: 10px;
	background: #ff0000;
	color: #fff;
	border-radius: 6px;
	padding: 1px 5px;
}
.mailform span.nini {
	margin-left: 10px;
	background: #c7c7c7;
	color: #fff;
	border-radius: 6px;
	padding: 1px 5px;
}
table.mailform tr:hover {
	background: #fcedef;
}
.g-recaptcha div{
	margin-top: 5%;
	margin-left: auto;
	margin-right: auto;
}
table.mailform input[type="text"], table.mailform textarea {
	width: 95%!important;
}

input[type=file] {
  max-width: 100%;
  font-size:14px;
  margin: 5px 0px 5px 0px;
}

.plmailwrap{
	display: block;
	position: relative;
	width: 100%;
	height:100%;
	cursor: pointer;
}
.plmail{
	display: block;
    width: 100%;
    height: 100%;
}
.plholder{
	pointer-events: none;
	position: absolute;
	width: 100%;
	left: 0;
	padding-left: 2.5%;
	top: 3%;
	opacity: 0.6;
	display:none;
}
.inputmail input:invalid +span.plholder,.inputmailcon input:invalid +span.plholder{
	display: inline;
}



/*=================================================
*フォーム送信完了ページ
=================================================*/

.thanks {
	height: 100%;
}
body.thanks footer {
	bottom: 0;
}
.thanks #main{
	width: 100%;
}
@media screen and (max-width:768px) {
	body.thanks footer {
	bottom: auto;
}
}
/*=================================================
 *  よくあるご質問ページ　faq
=================================================*/

.faq_main {
	margin-bottom: 5%;
}
faq_main p {
}
faq_main p span {
	color: #CA0007;
}
.FaQ {
	margin: 20px 0;
}
.answerWP {
	display: none;
}
.questionWP {
	position: relative;
	cursor: pointer;
}
.questionWP span {
	position: absolute;
	right: 10px;
	top: 6px;
}
.question {
	padding: 8px;
	margin: 0;
	font-weight: bold;
	color: #330A00;
}
.question:before {
	content: "\f059";
	font-family: FontAwesome;
	font-size: 20px;
	margin-right: 5px;
}
.answer {
	margin: 0;
	padding: 8px;
}
.answer:before {
	content: "\f118";
	font-family: FontAwesome;
	font-size: 20px;
	margin-right: 5px;
}
/*=================================================
 *  工事の流れページ　flow
=================================================*/

.flow_main {
	margin-bottom: 5%;
}
.flow {
	overflow: hidden;
	margin: 20px 0;
	padding: 0;
	background: #fff;
}
.imgR {
	float:right;
	margin:0 0 0.5em 0.5em;
}
.flow h4 {
	font-weight: bold;
	border-bottom: 1px dotted #CA0007;
	width: 140px;
	color: #330A00;
}
.flow h4:before {
	content: "\f1d8";
	font-family: FontAwesome;
	margin-right: 5px;
}

/*=================================================
 *  お客様の声ページ　voice
=================================================*/

.voice_main {
	margin-bottom: 5%;
}
.voice .word {
	border-bottom: 1px solid #CA0007;
	margin-bottom: 5%;
}
.voice dl.word dt {
	color: #330A00;
	font-weight: bold;
}
.voice dl.word dt span {
	margin-left: 10px;
	font-weight: bold;
	color: #CA0007;
}
.voice dl.word dt:before {
	content:"\f075";
	font-family: FontAwesome;
	color: #330A00;
	font-size: 25px;
	margin-right: 5px;
	vertical-align: middle;
}
.voice dl.word dd {
	padding: 0 0 1.0em 0;
}
.voice li{
	list-style-type: none;
}
.voice .tbox{
	width: 47%;
	margin: 1%;
	display: inline-block;
}
@media screen and (max-width:480px) {
	.voice .tbox{
	width: 97%;
}
}
.voice .tbox img{
	margin-left: auto;
	margin-right: auto;
}
.voice .onbox{
	width: 96.8%;
	margin: 1%;
}
/*=================================================
 *  ガスエコキュートの基礎知識 kyutoki.html
=================================================*/

#kyutoki {
}
.kyutoki_main {
	margin-bottom: 5%;
	overflow: hidden;
}
.kyutoki_main h3 {
	color: #FFFFFF;
	background: #330A00;
	width: 20%;
}
@media screen and (max-width:768px) {
.kyutoki_main h3 {
	color: #FFFFFF;
	background: #330A00;
	width: 30%;
}
}
@media screen and (max-width:480px) {
.kyutoki_main h3 {
	width: 100%;
}
}
.kyutoki_main .box {
	overflow: hidden;
	clear: both;
	margin-bottom: 2%;
}
.kyutoki_main .box .right {
	float: right;
	margin-left: 2%;
}
@media screen and (max-width:480px) {
.kyutoki_main .box .right {
	float: none;
	margin: 0;
}
}
.kyutoki_main .box img {
	width: 100%;
}
.kyutoki_main .box p {
}
.kyutoki_main .box h4 {
	font-weight: bold;
	font-size: 18px;
	border-bottom: 2px solid;
}
.kyutoki_main .box h5 {
	background: none;
	color: #330A00;
	border: none;
	padding: 0%;
	font-weight: bold;
}
.kyutoki_main .box ul {
	overflow: hidden;
	margin: 0;
}
.kyutoki_main .box ul li {
	list-style: none;
	padding: 5px 0;
	border: 1px solid #330A00;
	margin: 0 5px 0 0;
	float: left;
	text-align: center;
	width: 32.5%;
	height: 430px;
}
@media screen and (max-width:480px) {
.kyutoki_main .box ul li {
	width: 99%;
	padding: 1% 0;
	margin: 1% 0;
	height: 300px;
}
}
@media screen and (max-width:320px) {
.kyutoki_main .box ul li {
	width: 99%;
	padding: 1% 0;
	margin: 1% 0;
	height: 320px;
}
}
.kyutoki_main .box ul li:nth-child(3) {
	margin: 0;
}
.kyutoki_main .box ul li p {
	text-align: left;
	padding: 2%;
}
.kyutoki_main .box ul li img {
	width: 95%;
}
@media screen and (max-width:480px) {
.kyutoki_main .box ul li img {
	width: 50%;
}
}
.kyutoki_main .box .legend {
	margin: 2% 0 3% 0;
}
.kyutoki_main .box .legend p.pink {
	line-height: 1;
	margin: 1% 0;
}
@media screen and (max-width:480px) {
.kyutoki_main .box .legend p.pink {
	font-size: 13px;
	padding: 10px 0 5px 0;
}
}
.kyutoki_main .box .legend p.pink:before {
	content: "";
	background: #ff9cc6;
	width: 50px;
	height: 50px;
	padding: 0 20px;
	margin-right: 10px;
}
.kyutoki_main .box .legend p.blue {
	line-height: 1;
	margin: 1% 0;
}
@media screen and (max-width:480px) {
.kyutoki_main .box .legend p.blue {
	font-size: 13px;
}
}
.kyutoki_main .box .legend p.blue:before {
	content: "";
	background: #a3dbff;
	width: 50px;
	height: 50px;
	padding: 0 20px;
	margin-right: 10px;
}
/*=================================================
 *  エコジョーズの基礎知識 ecojozu.html
=================================================*/

#ecojozu {
}
.ecojozu_main {
	margin-bottom: 5%;
	overflow: hidden;
}
.ecojozu_main h3 {
	color: #FFFFFF;
	background: #330A00;
	width: 20%;
}
@media screen and (max-width:768px) {
.ecojozu_main h3 {
	color: #FFFFFF;
	background: #330A00;
	width: 30%;
}
}
@media screen and (max-width:480px) {
.ecojozu_main h3 {
	width: 100%;
}
}
.ecojozu_main .box {
	overflow: hidden;
	clear: both;
	margin-bottom: 2%;
}
.ecojozu_main .box .right {
	float: right;
	margin-left: 2%;
}
@media screen and (max-width:480px) {
.ecojozu_main .box .right {
	float: none;
	margin: 0;
}
}
.ecojozu_main .box img {
	width: 100%;
}
.ecojozu_main .box p {
}
.ecojozu_main .box h4 {
	font-weight: bold;
	font-size: 18px;
	border-bottom: 2px solid;
}
.ecojozu_main .box p.out-link {
	background: #d7d7d7;
	padding: 5px 10px;
	border-radius: 5px
}
.ecojozu_main .box p.out-link:before {
	content: "\f08e";
	font-family: FontAwesome;
	margin-right: 5px;
}
/************************************
コラム .column
*************************************/
.column .column_main {
	padding: 0 0 30px;
}
.column .column_main .bread {
	font-size: 80%;
	margin: 0 0 20px;
	text-align: right;
}
.column .column_main .column_list {
	overflow: hidden;
	margin: 0 0 30px;
}
.column .column_main .column_list ul {
	margin: 0;
	padding: 10px 10px 0 30px;
}
.column .column_main .column_list ul li {
	padding: 0 0 1em;
	list-style: decimal;
}
.column .column_main h3 {
	border-bottom:dotted 2px #330A00;
	padding:5px;
	margin: 30px 0 10px;
}
.column .column_main table {
	width: 100%;
	border-collapse: collapse;
	text-align: left;
	border-left:#fff;
	border-right:#fff;
	border-top:none;
	border-bottom:none;
}
.column .column_main table th {
	color:#330A00;
	border: 1px solid #330A00;
	border-left:#fff;
	padding: 10px;
	background: #fffecc;
	vertical-align: middle;
	font-weight:bold;
}
.column .column_main table td {
	border: 1px solid #330A00;
	border-right:#fff;
	padding: 10px;
}
/************************************
コラム内 .column_inside
*************************************/
.column_inside .bread {
	font-size: 80%;
	margin: 0 0 20px;
	text-align: right;
}
/***********************************
サイドエリア
************************************/
/*お役立つコラム*/
h4.column_in {
	color: #CA0007;
	font-weight: bold;
	font-size:larger;
	border-bottom: dashed 2px #CCC;
	padding: 1%;
	margin-bottom: 1%;
}
/*.sidearea_main　共通*/
.sidearea_main h3 {
	clear:both;
	background-color: #CA0007;
	padding: 1%;
	border-bottom: 5px double #fff;
	color: #fff;
}
.sidearea_main img {
	float:right;
	width: 30%;
	box-shadow: 3px 5px 5px 2px rgba(0,0,0,0.1);
}
/***************************************
プライバシーポリシー　.privacy
****************************************/
.privacy h3 {
	background: #CA0007;
	color: #FFFFFF;
	padding: 1px 5px;
	font-weight: bold;
	border-bottom: 4px double #FFFFFF;
}
.privacy #sub h3 {
	border-bottom: none;
}
.privacy .privacy_box {
	overflow: hidden;
	margin: 0 0 30px;
}

/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:980px) {
body {
	box-sizing: border-box;
	width: 100%;
	padding: 0 10px;
}
.headerWP {
	width: 100%;
}
nav ul {
	width: 100%;
}
#contents {
	width: 100%;
	max-width: 100%;
}
.appboxue{
font-size: 1.9vw;

}
.appboxst{
font-size: 2vw;
}

.indexPrct {
	letter-spacing: 4px;
}
.prctBox {
	width: 49.2%;
}
.prctBox img {
	width: 100%;
}
/* トップナビ */
	.topNavi {
	margin-right: 0;
}
.topNaviColumn {
	display: block;
	box-sizing: border-box;
	width: 100%;
	float: none;
	margin-right: 0;
	margin-bottom: 10px;
}
.topNaviCon h2 {
	font-size: 16px;
}
.topNaviCon p {
	line-height: 1.2;
	font-size: 16px;
}
.hot_contact {
	float: right;
	text-decoration: none;
	font-size: 14px;
}
.hot_contact:after {
	content: "\f0a9";
	font-family: FontAwesome;
	margin-left: 3px;
}
.hot_contact:hover {
	font-weight: bold;
	color: #000;
}
/*問い合わせbanner*/
ul.contact_banner li.contacttel, ul.contact_banner li.contactweb, ul.contact_banner li.contacttel:hover, ul.contact_banner li.contactweb:hover {
	width: 49%;
}
ul.contact_banner li.contacttel a img, ul.contact_banner li.contactweb a img {
	width: 100%;
}
/* お問い合わせフォーム */
	table.mailform tr th {
	width: 250px !important;
}
table.mailform {
	max-width: 100%;
}
}



/*==============================================================
 *  スマートフォン向けデザイン　767以下
 =============================================================*/
@media screen and (max-width:767px) {
body {
	font-size: 16px;
}
header{
	background-position: top;
}
h1 {
	margin-bottom: 0;
	font-size: 13px;
}
.pctablet{
	display: none!important;
}
.tablet{
	display: block!important;
}

.contact {
	margin:10px 0;
}
.contact #sub{

}
#main,#main_contact {
	float: none;
	width: 100%;
}
#sub {
	float: none;
	width: 100%;
}
.appboxue{
	font-size: 2.5vw;

}
.appboxst{
	font-size: 2.6vw;
}

.bnr ul {
	overflow: hidden;
}
.bnr li {
	float:left;
	width:100%;
	margin:0 2% 2% 0;
	font-size: 18px;
}
/* ヘッダー */
	.headerWP .contactBox {
	margin: 10px 0;
}
.contact_web, .contact_tel {
	position: static;
	top: 0;
/*	width: 49.5%;*/
	width: 100%
/*	float: left;*/
}
div.contact_web + div.contact_tel {
	margin-left: 1%;
}
.contact_tel a span, .contact_web a span {
	display: none;
}
.sp {
	display: block;
}
.pcsp{
	display:none;
}

/* グローバルナビ */
	nav {
	display: block;
	position: relative;
	width: 100%;
}
nav h3 {
	cursor: pointer;
	margin-bottom: 0;
	color: #fff;
	background: #CA0007;
	border: none;
}
nav h3:after {
	position: absolute;
	content: "\0025bc";
	top: 3px;
	right: 5px;
}
nav h3.menuOpen:after {
	position: absolute;
	content: "\0025b2";
	top: 3px;
	right: 5px;
}
nav ul {
	width:100%;
}
nav li {
	width: 33.33%;
	margin: 0;
	padding: 0;
	list-style: none;
}
nav li:first-child a {
	width: 100%;
}
nav li a {
	display: block;
	width: 100%;
	border-bottom: 1px dotted #ddd;
	text-decoration: none;
}
nav .navtab{
	display: block;
}
/* トップナビ */
	.topNavi {
	margin-right:0;
}
.topNaviColumn {
	display: block;
	box-sizing: border-box;
	width: 100%;
	float: none;
	margin-right: 0;
	margin-bottom: 10px;
}
.topNaviCon h2 {
	font-size: 16px;
}
.topNaviCon p {
	line-height: 1.2;
	font-size: 16px;
}
.hot_contact {
	float: right;
	text-decoration: none;
	font-size: 16px;
}
.hot_contact:after {
	content: "\f0a9";
	font-family: FontAwesome;
	margin-left: 3px;
}
.hot_contact:hover {
	font-weight: bold;
	color: #000;
}
/* サイドバー */
	#sub p.area {
	font-size: 11px;
}
/* トップページ */
	.prctBox {
	text-align: center;
	width: 100%;
}
/* contact */
	#main_contact .form {
	font-size: 12px;
}
/*お問い合わせフォーム*/
.mailform {
	width: 100% !important;
	max-width: 100%;
	display: block;
}
.mailform {
	display: block;
}
.mailform dl dt, .mailform dt dd {
	display: block;
	width: 100% !important;
	max-width: 100%;
	text-align: left !important;
}
.mailform dl dt {
	padding: 1% 0 !important;
}
.mailform dl dd {
	padding: 1% 0 !important;
}
textarea.mfp {
	max-width: 95%;
}
/*table.mailform input, table.mailform textarea {
	font-size: 1.2em;
	width: 95% !important;
	padding: 10px;
}
table.mailform input[type="checkbox"]{
	width:inherit!important;
	display: inline;
}
table.mailform input#send_confirm {
	width: 5% !important;
}*/
.mailform dd{
	display :block;
}
.mailform dd input[type="text"]{
	display: block;
	width: 95%;
	margin-left: auto;
	margin-right: auto;
}
.ft120 {
	font-size: 120%;
}
div#confirmBody {
	width: 100% !important;
	left: 0 !important;
}
div#confirmWindow {
	height: 100% !important;
}
table.infield {
	width: 90% !important;
	display: block;
	border: none;
}
ul.confirm_layer li {
	width: 100% !important;
}
ul.confirm_layer {
	width: 100% !important;
}
li.confirm_middle {
	background: none !important;
}
li.confirm_top {
	background: none !important;
}
ul.confirm_layer li {
	background: none !important;
}
table.infield tr th {
	width: 96% !important;
	display: block;
	text-align: left !important;
	border-bottom: none !important;
}
table.infield tr td {
	width: 96% !important;
	display: block;
	border-bottom: none !important;
}
table.infield tr {
	width: 100% !important;
	display: block;
}
table.infield tr:nth-child(even) td {
	background: #f5f5f5;
}
/* product ページ */

.products #main dl {
	height: auto;
	box-sizing: border-box;
	margin: 10px 0 20px 0;
	padding: 0;
	letter-spacing: -.4em;
	border: 1px solid #CCCCCC;
}
.products #main dt {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	width: 100%;
	font-size: 16px;
	letter-spacing: normal;
	background-color: #EFEAE6;
	color: #572C00;
	font-weight: bold;
}
.products #main dd {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	line-height: 64px;
	font-size: 16px;
	letter-spacing: normal;
	color: #333333;
	display: block;
}
.products #main dd.pnum {
	width: 100%;
	line-height: 1.5;
	font-weight: bold;
}
.products #main dd.price {
	width: 100%;
	line-height: 1.5;
	font-weight: bold;
}
.products #main dd span.p1 {
	font-weight: bold;
}
.products #main dd span.p2 {
	vertical-align: middle;
	font-size: 20px;
	font-weight: bold;
	color: #CA0007;
}
.products #main dd span.tax {
	font-size: 12px;
}
.products #main dd span.tax2 {
	font-size: 12px;
	color: #CA0007;
}
/* greeting */
	.greeting_main {
	font-size: 12px;
}
/* flow */
	.flow_main {
}
.flow h4 {
	width: 100%;
	margin-bottom: 10px;
}
.flow {
	font-size: 12px;
}
/* voice */
	.voice_main {
	font-size: 12px;
}
/* footer */
	.copyright {
	font-size: 12px;
}

}

/*==============================================================
 *  スマートフォン向けデザイン　480px以下 iPhone6縦等
 =============================================================*/
@media (max-width: 480px) {
body {
	font-size: 16px;
}
.prctBox img {
	width: inherit;
}
ul.contact_banner li {
	float: none;
	width: 370px;
	max-width: 100%;
	margin: 0 auto;
}
ul.contact_banner li + li {
	margin: 10px auto 0;
}
/*お問い合わせ*/
	input.mfp {
	max-width: 95%;
}
/* トップナビ */
	.topNavi {
	margin-right:0;
}
.topNaviColumn {
	display:block;
	box-sizing:border-box;
	width:100%;
	float:none;
	margin-right:0;
	margin-bottom:10px;
}
.topNaviCon h2 {
	font-size: 16px;
}
.topNaviCon p {
	line-height: 1.2;
	font-size: 16px;
}
.hot_contact {
	float: right;
	text-decoration: none;
	font-size: 16px;
}
.hot_contact:after {
	content: "\f0a9";
	font-family: FontAwesome;
	margin-left: 3px;
}
.hot_contact:hover {
	font-weight: bold;
	color: #000;
}


/* サイドバー */
	#sub .bnr li {
	font-size: 14px;
}
#sub p.area {
	font-size: 14px;
}
#sub p.area span {
	font-size: 15px;
}
/* contact */
	#main_contact .form {
	font-size: 15px;
}

.slidesp{
	display: block!important;
}
.slidepc{
	display: none!important;
}

/*問い合わせbanner*/
ul.contact_banner li.contacttel, ul.contact_banner li.contactweb, ul.contact_banner li.contacttel:hover, ul.contact_banner li.contactweb:hover {
	width: 100%;
}
/* product ページ */
.products #main dl {
	height: auto;
	box-sizing: border-box;
	margin: 10px 0 20px 0;
	padding: 0;
	letter-spacing: -.4em;
	border: 1px solid #CCCCCC;
}
.products #main dt {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	width: 100%;
	font-size: 16px;
	letter-spacing: normal;
	background-color: #EFEAE6;
	color: #572C00;
	font-weight: bold;
}
.products #main dd {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	line-height: 64px;
	font-size: 16px;
	letter-spacing: normal;
	color: #333333;
	display: block;
}
.products #main dd.pnum {
	width: 100%;
	line-height: 1.5;
	font-weight: bold;
}
.products #main dd.price {
	width: 100%;
	line-height: 1.5;
	font-weight: bold;
}
.products #main dd span.p1 {
	font-weight: bold;
}
.products #main dd span.p2 {
	vertical-align: middle;
	font-size: 20px;
	font-weight: bold;
	color: #CA0007;
}
.products #main dd span.tax {
	font-size: 12px;
}
.products #main dd span.tax2 {
	font-size: 12px;
	color: #CA0007;
}
/* greeting */
	.greeting_main {
	font-size: 15px;
}
/* flow */
	.flow_main {
}
.flow {
	font-size: 15px;
}
.flow h4 {
	width: 100%;
	margin-bottom: 10px;
}
/* voice */
	.voice_main {
	font-size: 15px;
}
}
 @media (max-width: 320px) {
div.buttons input {
	display: inline-block;
	width: 47.905%;
}
/* product ページ */
	.products #main h4 {
	margin-bottom: 0.25em;
	font-size: 18px;
	color: #CA0007;
	font-weight: bold;
}
.products #main h4:before {
	content: "\f06d";
	font-family: FontAwesome;
	margin-right: 5px;
}
.products #main dl {
	height: auto;
	box-sizing: border-box;
	margin: 10px 0 20px 0;
	padding: 0;
	letter-spacing: -.4em;
	border: 1px solid #CCCCCC;
}
.products #main dt {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	width: 100%;
	font-size: 16px;
	letter-spacing: normal;
	background-color: #EFEAE6;
	color: #572C00;
	font-weight: bold;
}
.products #main dd {
	text-align: center;
	margin: 0;
	padding: 0;
	display: inline-block;
	line-height: 64px;
	font-size: 16px;
	letter-spacing: normal;
	color: #333333;
	display: block;
}
.products #main dd.pnum {
	width: 100%;
	line-height: 1.5;
	font-weight: bold;
}
.products #main dd.price {
	width: 100%;
	line-height: 1.5;
	font-weight: bold;
}
.products #main dd span.p1 {
	font-weight: bold;
}
.products #main dd span.p2 {
	vertical-align: middle;
	font-size: 20px;
	font-weight: bold;
	color: #CA0007;
}
.products #main dd span.tax {
	font-size: 12px;
}
.products #main dd span.tax2 {
	font-size: 12px;
	color: #CA0007;
}
}




/************************************************************
 news系　共通CSS

 ***************************************************************/
.tolist {

	margin: 2% 0;
	text-align: right;

}

@media screen and (max-width:480px) {
	.tolist {

		margin: 3% 10px;
		text-align: right;

	}
}


/*====================================================================
 *  最新情報 PHP news/top-uekomi.php(index.html) OR (index.php)  CSS
 ===================================================================*/

/* news/top-uekomi.php OR index.php */


/* clearfix */
.clearfix:after { content:"."; display:block; clear:both; height:0; visibility:hidden; }
.clearfix { display:inline-block; }

/* for macIE \*/
* html .clearfix { height:1%; }
.clearfix { display:block; }

iframe {
	overflow: hidden;
}

#top_newsWrap {
	margin: 1%;
}

ul#top_newsList{
	margin:0 0 15px;
	padding:0;
	font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.title a{line-height:2;text-decoration:none; color:#09c; font-weight:bold;}

ul#top_newsList li{
	color:#000;
	font-size:12px;
	margin:0;
	padding:8px 0;
	margin-bottom:3px;
	/*border-bottom:1px dotted #ccc;*/
	border-bottom: dotted 2px #ccc;
	line-height:120%;
	list-style-type:none;
	font-weight: bold;
/*	display: inline-block;*/
}
a{color:#4C1300;text-decoration:underline;}
a:hover{color:#039;text-decoration:none;}

.top_up_ymd {
    font-weight: bold;
}

.top_catName{
	display:inline-block;
	padding:3px 8px;
	border:1px solid #ccc;
	border-radius:6px;
	font-size:11px;
	line-height:100%;
	margin:0 2px;
}
.top_newMark{
	display:inline-block;
	border:1px solid #F00;
	padding:1px 4px;
	font-size:11px;
	line-height:100%;
	background:#F00;
	color:#fff;
	box-shadow:1px 1px 1px #999;
	border-radius:8px;
	font-style:italic;
}
/*.top_comment{
	line-height:2.5em;
	clear:both;
	padding:3px;
	overflow:hidden;
	width:240px;
}
.top_thumbNailWrap{
	line-height:2em;
	clear:both;
	padding:5px;
	width:240px;
	height:280px;
	overflow:hidden;

}*/


/************************************************************
 news/case.php CSS (工事事例一覧)

 ***************************************************************/
#newsWrap {
  width: 100%;
}

.case-box {
	margin: 0 auto;
	width: 100%;
	border: solid 1px #ccc;
}

ul#newsList{
  margin:0 0 15px;
  padding:0;
  font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

ul#newsList li{
  color:#000;
  font-size:12px;
/*  margin:0;
  padding:5px 0;*/
  margin-bottom:2%;
/*  border-bottom:1px dotted #ccc;*/
  line-height:120%;
  list-style-type:none;
}

.title a{text-decoration:none; color:#09c; font-weight:bold;}

.catName{
  display:inline-block;
  padding:3px 8px;
  border:1px solid #ccc;
  border-radius:6px;
  font-size:11px;
  line-height:100%;
  margin:0 2px;
}
.newMark{
  display:inline-block;
  border:1px solid #F00;
  padding:1px 4px;
  font-size:11px;
  line-height:100%;
  background:#F00;
  color:#fff;
  box-shadow:1px 1px 1px #999;
  border-radius:8px;
  font-style:italic;
}

.thumbNailWrap {
    display: block;
    /*float: left;*/
    height: auto;
    margin: 10px auto;/*左のコメントと高さをそろえる*/
    overflow: hidden;
    width: 95%;
    text-align: center;
}

@media screen and (max-width:480px) {
	.thumbNailWrap {
	    display: block;
	    /*float: left;*/
	    height: auto;
	    margin: 10px auto;/*左のコメントと高さをそろえる*/
	    overflow: hidden;
	    width: 95%;
	    text-align: center;
	}
}

.case_comment {
    display: block;
    line-height: 2em;
    overflow: hidden;
    width: 95%;
   /* margin-top: 10px;右の写真と高さをそろえる*/
   margin: 0 auto;
}

@media screen and (max-width:480px) {
	.case_comment {
	    display: block;
	    line-height: 2em;
	    overflow: hidden;
	    width: 92%;
	   /* margin-top: 10px;右の写真と高さをそろえる*/
	   margin: 10px auto;
	}
}


/* Pager style（外部化可） */
.pager{
  text-align:right;
  padding:10px;
  clear:both;
}
/*ページャーボタン*/
.pager a{
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #333;
    font-size: 12px;
    padding: 3px 7px 2px;
    text-decoration: none;
  margin:0 1px;
}

/*現在のページのボタン*/
.pager a.current{
    background: #999;
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #fff;
    font-size: 12px;
    padding: 3px 7px 2px;
  margin:0 1px;
    text-decoration: none;
}

.pager a:hover{
    background:#999;
    color: #fff;
}

.overPagerPattern{
  padding:0 2px ;
}

.update{
  width: 95%;
  margin: 2% auto;
}

.update .date_cat {
	margin: 1% 0;
}

.up_ymd{
/*  float: right;*/
  margin: 1% auto;

}

.catName{
  text-align: right;
  border-bottom: dotted 1px #ccc;
  font-size: 12px;
  margin: 1% auto;
}

.case_catName{
  display:inline-block;
  padding:6px 8px;
  border:1px solid #ccc;
  border-radius:6px;
  font-size:11px;
  line-height:100%;
  margin:0 2px;
}

.title{
  text-align: left;
	background: #eee;
	font-size: 17px;
	font-weight: bold;
	padding: 12px 16px 12px 16px;
	width: 95%;
	margin: 0% auto 1% auto;
	display: inline-block;
}

@media screen and (max-width:480px) {
	.title{
	  text-align: left;
		background: #eee;
		font-size: 17px;
		font-weight: bold;
		padding: 12px 16px 12px 16px;
		width: 92%;
		margin: 0% auto 1% auto;
		display: inline-block;
	}
}

.comment{
/*  position: absolute;*/
  width: 50%;
  margin: 3% auto;
}

/************************************************************

news/news-detail.php CSS (詳細ページ１ページ)

***************************************************************/

.pNav {
	font-size:12px;
	margin-bottom: 10px;
}

.backORcloseBtn{
	text-align:center;
	line-height:2.5em;
	margin:15px 0;
}

@media screen and (max-width:480px) {
	.backORcloseBtn{
		text-align:center;
		line-height:1.5em;
		margin:15px 0;
	}
}

.backORcloseBtn a{
	display:inline-block;
	padding:4px 15px;
	border:1px solid #aaa;
	color: #000;
	border-radius:6px;
	text-decoration:none;
	font-size:12px;
}

.detailUpfile{
	margin:5px 0 35px;
	text-align:center;
}

.detailUpfile img{
	margin-top:50px;
	max-width:100%;
	height:auto;
}

@media screen and (max-width:480px) {
	.detailUpfile{
		margin:0 0 10px;
		text-align:center;
	}

	.detailUpfile img{
		margin-top:10px;
		max-width:100%;
		height:auto;
	}
}



#up_ymd_detail{
	text-align:right;
	margin:2% 10px 0;
	border-bottom: dotted 1px #ccc;
}

.title_detail {
	text-align: left;
	background: #eee;
	font-size: 17px;
	font-weight: bold;
	padding: 12px 16px 12px 16px;
/*	width: 51.5%;*/
/*	position: absolute;*/
	margin: -15px;
}

.entry {
    margin: 0 auto;
    width: 100%;
    box-shadow: 3px 3px 3px rgba(0,0,0,0.4);
    border: solid 1px #ccc;
}

.entry-box {
    margin: 3% auto;
	width: 95%;
}

.entry-box h2{
	padding: 12px 16px 12px 16px;
	width: 95%;
	margin: 0;
	border-left: none;
	background: #eee;
}


@media screen and (max-width:480px) {
	.entry-box h2{
		padding: 12px 16px 12px 16px;
		width: 92%;
		margin: 0;
		border-left: none;
		background: #eee;
	}
}


#detail {
	margin: 3% auto;
}

.detailText {
	line-height: 1.6;
	padding: 0px 0px 12px 0px;
}



/*=================================================
 *  スタッフ情報ページ　staff
=================================================*/
#staffpage .staff {
	overflow:hidden;
	margin:20px 0;
	padding:0;
	background:#fff;
}
#staffpage .staff .imgL {
	float:left;
	margin: 0 10px 10px 0;
}
@media screen and (max-width:480px) {
#staffpage .staff .imgL {
	float: none;
	width: 100%;
	text-align: center;
}
}
#staffpage .staff h4 {
	font-size: 16px;
	color: #330A00;
	font-weight: bold;
	padding: 0 0 0.25em 0;
	margin-top: 2px;
}
#staffpage .staff h4:before {
	content: "\f0a1";
	font-family: FontAwesome;
	margin-right: 5px;
	font-size: 30px;
	vertical-align: middle;
	background: #330A00;
	color: #FFFFFF;
	border-radius: 30px;
	padding: 10px;
}