@charset "utf-8";

/* =Typography
-----------------------------------------------------------------------------*/
body {
	overflow-y:scroll;
	background-color: #ffffeb;
	font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

	
/* =Links
-----------------------------------------------------------------------------*/



/* =Layout
-----------------------------------------------------------------------------*/
iframe{width:;}

.wrapper {
	margin: auto; 
	max-width: 1100px;
	padding: 10px 10px 0  10px;
	_width: 960px;		
}
#main aside {
	
}
#blocks li {
	background-color: #f8f8f8;
	height: 100px;
}

/* =Header
-----------------------------------------------------------------------------*/
#header {
	overflow: hidden;
	padding: 0.5em;
	margin-bottom: 1.5em;
	
	
	background-image: -moz-linear-gradient(top, #ffa927, #ff4a02);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffa927), to(#ff4a02));
	background-image: -webkit-linear-gradient(top, #ffa927, #ff4a02);
	background-image: -o-linear-gradient(top, #ffa927, #ff4a02);
	background-image: linear-gradient(to bottom, #ffa927, #ff4a02);
	background-repeat: repeat-x;
	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffa927', endColorstr='#ffff4a02', GradientType=0);
	border-radius: 5px ;
	position:relative;
}
#header h1 {
	float: left;
	margin: 0;
	color:#fff;
}

#header #counter{
	position:absolute;top:5px;right:5px;
}

.btn {
position: relative;
cursor: pointer;
outline: 0;
display: inline-block;
text-align: center;
text-decoration: none;

line-height: 1;
font-size: 13px;
font-weight: normal;
padding: 6px 16px;
border-radius: 4px;
background-color: transparent;
background-image: -moz-linear-gradient(top,#fff,#fff);
background-image: -ms-linear-gradient(top,#fff,#fff);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#fff));
background-image: -webkit-linear-gradient(top,#fff,#fff);
background-image: -o-linear-gradient(top,#fff,#fff);
background-image: linear-gradient(top,#fff,#fff);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#ffffff',GradientType=0);
border: 1px solid #dadada;
border-left: 1px solid #d2d2d2;
border-right: 1px solid #d2d2d2;
border-bottom-color: #a9a9a9;
box-shadow: 0 1px 0 rgba(0,0,0,0.15),inset 0 1px 1px 0 rgba(255,255,255,0.6);
text-shadow: 0 1px 0 #fff;
}


/* =#slider
-----------------------------------------------------------------------------*/
#slider{
	width:100%;
	max-width:1072px;
	height:auto;
}

#slider_wrap{height:auto;}

#slider_wrap .nivo-controlNav{
	width:100%;
	height:auto;
	
}




/* =Nav
-----------------------------------------------------------------------------*/
#nav {
	float: right;
	padding-top: 30px;
}
#nav ul, #navside ul {
	margin: 0;
	list-style: none;	
}
#nav ul li {
	float: left;
	margin-left: 1em;
	
}

#nav a,#nav {
	color:#fff;
	text-decoration:none;
	font-size:small;
	font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}

#navside ul li {
	padding: 2px 0;
}

#nav .btn{
	padding:4px 12px;
}






/* =Footer
-----------------------------------------------------------------------------*/
#footer {
	padding: 1em;
	margin: 1.5em 0 0 0;
	font-size: .85em;
	background:black;
	color:white;
	border-radius: 5px ;
}



/* =トップページ
-----------------------------------------------------------------------------*/
.inner {
	padding: 1em;
	margin-bottom:1.5em;
	
	-moz-box-shadow: 0 0 4px #aaa;
	-webkit-box-shadow: 0 0 4px #aaa;
	box-shadow: 0 0 4px #aaa;
	background:white;
	border-radius: 5px ;
}


#blocks li{background:none;}


.twitter-timeline {
　width: 100% !important;
}


#home-middle ul,#home-middle li {
	margin-left:0;
	padding-left:0;
	list-style: none;
}

#home-middle li img{
	margin-bottom:1em;
	width:100%;
}

#products-ban img{
	margin-bottom:0.3em;
	width:100%;
	max-width:300px;
}



a>img:hover {
	-webkit-transform: translate(1px, 1px);
	-moz-transform: translate(1px, 1px);
}



#news dd{
	margin-bottom:3px;
}

#news dt{

}

#news dd{
	font-size:0.8em;
}

#news dt{
	color:#e8680a;
}

#news dl{
	margin-bottom:0;
}


h4,h5,h6{
	border-bottom:1px solid #d6d6d6;
	color:#e8680a;
}


/* products
-----------------------------------------------------------------------------*/
div#products th{font-weight:bold;}
div#products td,div#products th{
	padding:0.1em 0.1em 0.1em 0;
	font-size:0.8em;
}
div#products h6.pull{color:#008eff;}
div#products h6.pull-latte{color:#7a1600;}



/* archive
-----------------------------------------------------------------------------*/
#archive .row dd{margin-bottom:1.5em;}
#archive .row dd a{text-decoration:none;}
#archive .row dd img{border:1px solid #e6e6e6;}
#archive .row dd a:hover{text-decoration:underline;}





/* support
-----------------------------------------------------------------------------*/
#support h6{
	border:0px;
	color:#333;
	background:#f7f7f7;
	padding:0.2em;
}
li{
	font-size:small;
	margin-bottom:0.2em;
}





/* =Tablet (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 960px) and (max-width: 1100px) {
    .wrapper { width: 950px; }
	
	.nivo-controlNav a,.nivo-controlNav a img{
		width:auto !important;
		max-width:140px !important;
		height:auto !important;
	}
}

/* =Tablet (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .wrapper { width: 748px; }
	
	.nivo-controlNav a,.nivo-controlNav a img{
		width:auto !important;
		max-width:110px !important;
		height:auto !important;
	}
}


/* =Mobile (Portrait)
-----------------------------------------------------------------------------*/
@media only screen and (max-width: 767px) {
	.wrapper { width: 300px; }
	#nav, #header h1 { float: none; }
	#header h1 { margin-bottom: .5em; }
	#nav ul li { margin: 0; float: none; margin-bottom: 1px; }
	#nav ul li a, #nav ul li span { display: block; padding: 2px 5px; }
	
	
	.nivo-controlNav a,.nivo-controlNav a img{
		width:auto !important;
		max-width:80px !important;
		height:auto !important;
	}
}

/* =Mobile (Landscape)
-----------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.wrapper { width: 420px; }
	
	
	.nivo-controlNav a,.nivo-controlNav a img{
		width:auto !important;
		max-width:120px !important;
		height:auto !important;
	}
}