/*===============================================
 スマホ：画面の横幅が580pxまで
===============================================*/
@media screen and (max-width:580px){
html,body,section,footer { 
width:100%; 
overflow-x:hidden;

}
*{
	font-size: 100%;
}
body {
   margin:0; padding:0;
   line-height:22px;
   letter-spacing:1px;
   font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
   font-size:0.9em;
   color:#404040;
   background:#ffffff  url("../../images/bg.jpg") 0 0 repeat-x;
   width:100%;
   overflow:hidden;
}


ul{
list-style:none;
}

img{
width : auto;
    max-width : 100%;
    height : auto;
    box-sizing: border-box;
}

strong{ color:#FF7E00; font-size:18px; font-weight:bold; }
hr { background: url("../../images/hr.png") center repeat-x; border:0px; height: 43px; width:100%; clear:both; }

.bold{
	font-weight: bold;
	font-size: 1em;
	color: #C91C3C;
}

/* ========TEMPLATE LAYOUT======== */
#contents_top { clear:both; width:100%; margin:25px auto; padding:0px; }
#contents { clear:both; width:100%; margin:70px auto; padding:0px; }
#main_top { float:none; width:95%; margin-left:7px ; }

#main { 
float:none; 
width:93%; 
margin-left:0px; 
background: url("../../images/bg_main.png") 2px 25px no-repeat; 

padding:10px 10px 50px 14px;
display:block; 
background-size: contain;
background-size:100% auto;
}



/* ========MAIN CONTENTS CUSTOMIZE======== */
#main h1 { width:98%; margin-top:40px; margin-left:3px; margin-bottom:20px; padding:5px 0 0 5px; height:30px; font-size:21px; font-weight:normal; color:#044A6C; border-bottom:4px solid #4BA6D9; }

#main h1 span { display: block; color: #0077D9; font-size: 0.6em; font-weight:normal; }

#main h2 {
 width:90%;
margin:20px 7px 10px 3px; 
padding:6px 0 5px 32px; 
font-size:16px;
color: #005B9D; 
font-weight:bold; 
background:#ebf9f9 url("../../images/bg_h2.png") 5px 2px no-repeat;
 clear:both; 
 display:block; 
 border:2px solid #97c5e1;
  border-radius: 6px;        /* CSS3草案 */  
    -webkit-border-radius: 6px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 6px;   /* Firefox用 */  
 }

#main h3 { margin:10px 7px 10px 7px; padding: 4px; font-size:16px; font-weight:normal; background-color:#eee;}


/* ========HEADER CUSTOMIZE======== */
#headWrap {}
#header { position:fixed; top:0;  width:100%; height:80px; z-index: 1;background:#ffffff; border-bottom:2px solid #55bcff;}
.header_logo { position:absolute; top:5px; left:0px; }
.header_logo img{width:80%;}
.contact { background:url(../../images/bg_contact.png) no-repeat; position:absolute; top:35px; right:0px; width:180px; height:60px; padding-left:250px; padding-top:10px;  display:none;}
#gnavi { position:absolute; top:8px; left:720px; font-size:12px; display:none;}
#gnavi  a{ background:url(../../images/mark_arrow.png) left 1px no-repeat; padding-left:15px; margin-left:20px;display:none;}
#header h1 { margin-left:10px; color:#ffffff; font-size:12px; font-weight:normal; display:none;}


/* ========FOOTMENU CUSTOMIZE======== */
#footer { background:#f1f7fa url("../../images/bg_foot.jpg") repeat-x; font-size:12px; padding-top:5px; width:100%; margin:0 auto; height:90px; }
.foot_menu { width:960px; margin:0 auto; padding-top:30px; 	display:none;}
.foot_access { float:right; margin-top:20px; width:650px; font-size:90%; display:block; text-align:right; display:none;}
.box_footer{ display:none; width:100%; padding:10px; background:#e4f0f6; color:#60a4c8; line-height:1.4em; margin:0 auto; margin-bottom:10px; border:1px solid #ffffff; display:none;}
.copyright { height:20px; text-align:right; width:100%; margin:0; padding-top:4px; }




#menu{
	display:none;
}




/* ========Top======== */
#point{
background:#F7F7F7; 
width:95%; 
height:100%; 
display:inline-block; 
border:4px solid #ffffff;
/* box-shadow */
box-shadow:0px 0px 6px 0px #999999;
-moz-box-shadow:0px 0px 6px 0px #999999;
-webkit-box-shadow:0px 0px 6px 0px #999999;
padding:0;
margin-left:5px;
position:relative;
text-align:center;
}

#point p{float:none; margin:0; width:100%;}



#news{
	margin: 10px 0 20px 0;
display:inline-block; 
clear:both;
padding-top:5px;
}
#news p{
	margin-left: 0px;
	font-weight: bold;
	font-size: 120%;
	border-bottom: 3px solid #4BA7DA;
	padding: 5px 0;
}
#news li{
	list-style-type: none;
	padding: 5px;
	border-bottom: 1px dotted #ccc;
	margin-left: -20px;
}
#news li a{
	margin-left: 10px;
}


.left{
float:left;
width:40%;
}

/* ========SUBCONTENTS CUSTOMIZE======== */
#sub_top { float:none; width:240px; font-size:0.85em; margin-top:29px; margin-right:auto; clear:both;display:inline-block; margin-left:18%;}

#sub { float:none; width:100%; font-size:0.85em; clear:both;
display:inline-table; margin:0 auto;
text-align:center; }



#submenu { width:240px; padding-top:5px; }
#submenu ul { padding:0; margin-left:0; }
#submenu li { height:44px; list-style:none; }



.sub2{ 
width:232px;
 margin:0 auto;
height:auto; 
text-align:center;
border:4px solid #e6e6e6;
margin-bottom:10px;
margin-top:-6px;
display:block;
background:#ffffff;
padding:0;
}

.sub2 img{
text-align:center;
margin:0 auto;
}

.sub2 p{
line-height:16px;
text-align:center;
width:100%;
}
.s_tit{
width:240px;

}

.fb-like-box{
margin:0 auto;
}

/* ========PAGEOP CUSTOMIZE========= */

#page-top {
    position: fixed;
    bottom: 0px;
    right:20px;

	z-index:100;
	border:1px solid #efefef;
	display:block;
	width:150px;
	height:38px;
	background:#ffffff;
}

#page-top a {
    padding: 0px;
	margin:0;

text-align:center;

}

#page-top a:hover {
    text-decoration: none;
	-webkit-transition: 0.3s ease-in-out;
     -moz-transition: 0.3s ease-in-out;
     -o-transition: 0.3s ease-in-out;
     transition: 0.3s ease-in-out;
}




/* ========SLIDER======== */
ul.bxslider li img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: -5px;
  max-width: 96%;
  max-height: 100%;
  margin: auto;
}


ul.bxslider li {
margin:0px auto;
padding:0px;
display:block;
height:150px;
text-align:center;
padding-left:5px;
  position: relative;
  width:100%;
}

.catch{
position:relative;
width:100%;
margin:0px auto;
z-index:1;
}


.banner{
clear:both;
width:100%;
display:block;
margin-left:2px;
}


.bx-wrapper .bx-prev {
	left: 10px;
margin-top:50%;
	background: url(../../images/controls.png) no-repeat 0 -32px;
	display:none;
}

.bx-wrapper .bx-next {
margin-top:50%;
	right: 25px;
	background: url(../../images/controls.png) no-repeat -43px -32px;
		display:none;
}

/* ========スマホメニュー======== */

.header_contact{
position:fixed;
top:13px;
right:10px;
display:block;
z-index:999999;
}


#mainnavi{
position:absolute;
top:80px;
left:0;
background:#399bcd;
text-align:left;
width:100%;
padding-bottom:20px;

z-index:999999;
display:block;
}

#mainnavi ul{
list-style:none;
padding:0;
margin:0;
}

#mainnavi li{
list-style:none;
margin-left:0px;
}

#mainnavi li a{
padding:7px 5px 7px 15px;
border-bottom:1px dotted #cdcdcd;
display:block;
color:#ffffff;
z-index:999999;
text-decoration:none;

}

#mainnavi ul li ul li{
background:#2e7aa1;
color:#666666;
padding-left:10px;
}


/* ========テーブル======== */
.datatable {
	width: 98%;
	margin-left: 5px;
	font-size:13px;
	line-height:1.6em;
	border-collapse:collapse;
	background:#FFF;
}
.datatable td {
	font-size:13px;
	line-height:1.6em;
	padding:8px;
	vertical-align:top;
	border:solid 1px #ccc;
	color:#333;
	background:#FFF;
}
.datatable th {
	font-size:12px;
	line-height:1.6em;
	width:95px;
	vertical-align:middle;
	padding:8px;
	font-weight:bold;
	text-align: left;
	border:solid 1px #ccc;
	background:#f0f0f0;
}
.datatable input.habahalf { width:50%; }
.datatable input.habafull { width:98%; }
.datatable textArea.habafull { width:98%; }

#maker ul{
	width: 100%;
	padding: 0px;
}
#maker li{
	float: left;
	border:1px solid #cdcdcd; 
	margin:0px;
	margin-bottom: 10px;
	margin-right: 10px;
	padding: 10px;
}
#maker li a img{
	width: 80px;
}
#past_work ul{
	padding: 0px;
}
#past_work li{
	clear: both;
	width: 100%;
}

#past_work li img{ 
	float: left; 
	border:4px solid #E8E8E8; 
	margin-top:10px; 
	display:inline-block; 
	width:40%; 
	max-height:150px;
	margin-bottom:5px; 
	margin-right: 10px;
}

#main .topics{
	width: 98%;
	margin-left: 5px;
}
#main .topics img{
	padding-right: 10px;
}
#main .topics p.title{
	border-top: 2px dotted #4BA6D9;
	border-bottom: 2px dotted #4BA6D9;
	font-size: 110%;
	padding: 10px 0;
	margin-bottom: 20px;
	margin-top: 10px;
}
#main .topics p{
	margin: 40px 0;
}
#main .topics p br { 
	display:none;
}
#main .topics p.wrote{
	margin: 40px 0 0 0;
}

/* こんなにお得！売電状況 */
.baiden-title{
	text-align: center;
	font-size: 110%;
	font-weight: bold;
	color: orange;
}
.baiden-title img{
	margin-right: 5px;
	vertical-align: bottom;
}
#baiden{
	width: 100%;
	display: block;
}
#baiden th{ 
	display: block;
}
#baiden td{ 
	display: block;
}
#baiden .point{
	margin:20px 0;
	padding:10px;
	border: 2px red dotted;
}
#baiden .price{
	font-size: 100%;
}
#baiden .sum{
	font-weight: bold;
}
#baiden .plus{
	color: blue;
}
#baiden .minus{
	color: red;
}

#company, #company th, #company td{
	display: block;
	width: 96%;
}
table#company .company-logo{
	width: 200px;
}

#oshirase{
	background-color: #FAFAFA;
	margin-bottom: 15px;
	padding: 1px 5px;
	font-size: 90%;
}
#oshirase .border-top{ border-top: 1px dotted #ccc; }
#oshirase .midashi{ font-size:15px;color:#C91C3C; font-weight:bold; padding-top:5px;}

.fair{
	display: none;
}

#contents.battery #main p {
    margin: 20px 10px;
}
#contents.battery p.leadtext1{
	font-size: 16px;
	color: white;
	background: darkcyan;
	padding: 0.5rem 1rem;
	text-align: center;
	font-weight: bold;
	margin-bottom: 2rem !important;
}
#contents.battery p.leadtext2{
	font-size: 16px;
	text-align: left;
	font-weight: bold;
	margin-bottom: 1rem !important;
	border-bottom: 1px dotted;
	padding-bottom: 0.5rem;
}

}