@charset "utf-8";

@media screen and (max-width:800px){
/* ------------------------------------------------------ */
/* スマホ　表示
=========================================================== */







.sp{ display: block}
/* ------------------------------------------------------ */
/* 共通
=========================================================== */	
div#content{ width:100%; overflow:hidden;margin:0;padding:0;border-width:0}
div#footcontent,div.retu{ width:100%}
article#main{ width:96% ; padding:2%; float:left; line-height:1.8; text-align:left; overflow:hidden}
aside{ clear:both;width:100% ; float:left; }
section#side,div#breadCrumb,div.thumbs{ display:none}

.retu a {right: 0px}

div.contentFooter { margin: 0;width:100%;}
div.contentFooter img {margin: 1%;width:98%;}
article.view_product > h2 + figure {margin:10px;overflow: hidden;width: 200px;}
/* ------------------------------------------------------ */
/* ヘッダ
=========================================================== */
header{ width:96%; height:88px; margin:0px 2% 10px; padding:0; background:url(../../images/sp/logo.png) no-repeat top left; background-size: 500px 88px;}
header h1 { float:left; margin:0px 2% 0; padding:0;width:70%; text-align:left; font-size:8px }
#contnet_head{margin:0;padding:0;width:100%;overflow:hidden;}	
header h1 a{ margin:0; padding:30px 0 0 70px;font-size:8px }
#contnet_head img {margin: 0 auto; width:100%;}
div.spHeadTel{ float:right; width:40px; height:40px; margin:8px 4px;background:url(../../images/sp/sp_tel_.gif) no-repeat top left; background-size: 40px 40px; }
div.spHeadTel a { display: block; width:100%; height:100%; text-indent:-9999px}
/* ------------------------------------------------------ */
/* ヘッダナビ
=========================================================== */
nav#gnav , nav#gnav ul.default{ display:block; width:100%; overflow:hidden; margin: 0; padding: 0;border-bottom: 1px solid #D7D5D5;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#912834+0,66020c+5,66060f+50,66020d+97,99202c+100 
background: #912834; /* Old browsers
//background: -moz-linear-gradient(top,  #912834 0%, #66020c 5%, #66060f 50%, #66020d 97%, #99202c 100%); /* FF3.6-15 
//background: -webkit-linear-gradient(top,  #912834 0%,#66020c 5%,#66060f 50%,#66020d 97%,#99202c 100%); /* Chrome10-25,Safari5.1-6 
//background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 5%,#ffffff 50%,#ffffff 97%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ 

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#912834', endColorstr='#99202c',GradientType=0 ); /* IE6-9  */
background:#ffffff;
}
nav#gnav ul.default li {
	
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#912834+0,66020c+5,66060f+50,66020d+97,99202c+100 */
background: #f1f4ff; /* Old browsers */
	background-position: auto;
	padding: 10px  0 10px 0;
	margin:0;
	width:33.33%;
	text-align:center;

	cleae:none;
	float:left
}
nav#gnav ul.default li a{ display:block; width:100%; background:none; margin:0 ; padding:0; text-indent:0; line-height:3; font-size:1.2; color:#5577aa}
nav#gnav ul.default li:nth-child(1),
nav#gnav ul.default li:nth-child(4),
nav#gnav ul.default li:nth-child(6)
{
	display:none
}
 div.pc{ display:none }
.pc{ display:none }
 
/* ------------------------------------------------------ */
/* コンテンツ
=========================================================== */
article#main h1 { border-radius:2px; width:96%; margin:0 0 10px; padding:15px 2%; }

.products h1{ border-radius:2px; width:96%; margin:0; padding:15px 2%; font-size:14px }

.info {
    
    margin: 2%;
    width: 96%;
}
,article#main h2{ border-radius:2px; width:96%; margin:0; padding:6px 2%; }
.products h2{ border-radius:2px; width:96%; margin:10px 0 0; padding:6px 2%; }
.scrollable img{width;40px;height:40px;margin:10px 0 0;}
.topmainBan{ width:96%; margin:2%}
/* ------------------------------------------------------ */
/* フッタ
=========================================================== */
footer{ margin-top:30px}

div#footcontent ul.default li{
	margin: 5px 5px;
	padding: 15px 0 15px 34px;
	text-align: left;
	width: 80px;
	border: solid #ccddff 1px;
	border-radius:6px
}
div#footcontent ul.default:nth-child(even) li{

	border: solid #ccddff 1px;

}

#footcontent #footlogo {
	clear:both;
    float: right;
    padding: 0;
}
#footlogo img { float: right; width:85px;margin-top:20px}


/* ------------------------------------------------------ */
/*form
=========================================================== */

input,select
{width:100%; font-size:130%; padding:12px 0;}
form p.form input[type="text"], form p.form textarea{width:100%; margin:0; padding:0; border:#ACA8A8 1px solid; border-radius:4px}
input:focus,input:hover
{background:#acf3ff;}
textarea
{width:90%; font-size:120%; padding:5px; height:100px;}
textarea:focus,textarea:hover{
height: 150px;background:#acf3ff;}
input[type="submit"]

.focus
{background:#acf3ff;}

/* ------------------------------------------------------ */
/*table
=========================================================== */

.products table {

    border-radius: 6px;
    color: #22496e;
    margin: 20px 0 20px;
    padding: 10px 0;
    width: 100%;
}

/* ------------------------------------------------------ */
/*製品情報リスト
=========================================================== */
.unitProduct > img + ul{ display:inline-block; width:auto }

article#main > ul.statusProduct > li.unitProduct > h1 { text-indent:10px; vertical-align:middle; padding-top:9px; padding-bottom:8px}
/* ------------------------------------------------------ */
/* 01.インフォニュース
=========================================================== */
#newsinfo { display:block; clear:both;margin:10px auto; }

#newsinfo li{ display:block; clear:both; width:96%; padding:10px; line-height:2;border-bottom:#4F4D4C dotted 1px }
#newsinfo li:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

#newsinfo li:before { display:block; float:left; width:5px; height:16px; margin:0 10px 0 10px;  content:url(../../images/listicon/2/4.gif);  webkit-content:url(../images/listicon/2/4.gif); overflow:hidden; }
.infodate{ display:inline-block; margin:auto 10px; color: #ffffff;}
.infolink{ clear:both;display:block; width:96%;margin:0 2%;}
.infolink a{display:block;width:100%;height:40px;text-align:center;line-height:3.8;background:#eeeeee;color:#444444;}
/*detail*/
.newsdetail p img {box-shadow:4px 4px #cccccc; border:2px solid #ffffff; float:left; margin:0 10px 10px; }

/* ------------------------------------------------------ */
/* 03.ニュース
=========================================================== */
#renewsinfo { display:block; clear:both;margin:10px auto; }

#renewsinfo li{ display:block; clear:none; float:left;height:70px;overflow:hidden; width:96%; padding:0px 1% 10px;margin:10px 1%; line-height:2.6;border:#cccccc solid 1px }


#renewsinfo li:before { display:block; float:left; width:5px; height:20px; margin:0 10px 0 10px;  content:url(../../images/listicon/2/4.gif); overflow:hidden; }
#renewsinfo li img{ width:auto;max-width:28%;margin:0px 1%; float:right;clear:right;height:60%; }

#renewsinfo li .infoname{ display:block;height:25px; width:70%;color: #777777;float:left;text-overflow:ellipsis;}
#renewsinfo li .infodate{ display:block; height:25px; overflow:hidden;margin:auto 2px;font-size:10px;width:18%;color: #ffffff;float:right;clear:right;}
#renewsinfo li .infolink{ display:block; float:left;clear:left; width:64%;height:60%; margin:auto 2%;}
#renewsinfo li .infolink a{display:block;width:100%;height:100%;text-align:center;line-height:3.8;background:#eeeeee;color:#444444;}

/* ------------------------------------------------------ */
/* ニュース記事
=========================================================== */
.newsContent img{
float:left;
width:100%;
}
/* ------------------------------------------------------ */
/* 01.そうとは
=========================================================== */
.tempcolors{
	color: #ffffff;
	display: block;
	height: 40px;
	line-height: 3.8;
	 text-align: center;
	width: 96%;
	margin:0 2%;
	}
/* ------------------------------------------------------ */
/*オーナーページ
=========================================================== */
ul.statusProduct > li{background:#ffffff;height:94px}
ul.statusProduct > li:nth-child(even){background:#eeeeee}
ul.menuProduct, ul.unitProduct{height:94px}
ul.menuProduct > li:nth-child(1), ul.unitProduct > li:nth-child(1){ float:left;width:18%;height:15px;clear:none}
ul.menuProduct > li:nth-child(2), ul.unitProduct > li:nth-child(2) { float:left;width:24%;font-size:10px;height:15px;}
ul.menuProduct > li:nth-child(3), ul.unitProduct > li:nth-child(3) { float:left;width:48%;font-size:10px;height:15px;}
ul.menuProduct > li:nth-child(4), ul.unitProduct > li:nth-child(4) { float:left;width:44%;font-size:10px;height:40px;clear:left;line-height:3}
ul.menuProduct > li:nth-child(5), ul.unitProduct > li:nth-child(5) { float:right;width:44%;font-size:10px;height:40px;clear:right;line-height:3}
ul.unitProduct > li:nth-child(4) > a.butt,ul.unitProduct > li:nth-child(5) > a.butt {padding:5px 15px}

.linkb{width:auto;max-width:80%;margin:2% 10%}



/* ------------------------------------------------------ */
/* ここまでスマホ　表示
=========================================================== */
}
