h1body{ min-width:auto;}

 @media screen and (min-width: 40em) {
body{ min-width:980px;}
}
}


/* ------------------------------------------
  NECESSARY STYLES FOR RESPONSIVE NAV
--------------------------------------------- */

.nav-collapse ul { margin: 0; padding: 0;  display: block; list-style: none; }
.nav-collapse li { width: 100%; display: block; }
.js .nav-collapse { clip: rect(0 0 0 0); max-height: 0; position: absolute; display: block; overflow: hidden; zoom: 1; }
.nav-collapse.opened { max-height: 9999px; }
 @media screen and (min-width: 40em) {
 .js .nav-collapse {
 position: relative;
 max-height: none;
}
 #nav-toggle {
 display: none;
}
}
/* ------------------------------------------
  DEMO PAGE'S STYLES
--------------------------------------------- */
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dt, dd, ol, ul, li, hr, fieldset, form, label, legend, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, summary, hgroup { margin: 0; padding: 0; border: 0; }
a:active, a:hover { outline: 0; }
 @-webkit-viewport {
width: device-width;
}
@-moz-viewport {
width: device-width;
}
@-ms-viewport {
width: device-width;
}
@-o-viewport {
width: device-width;
}
@viewport {
width: device-width;
}
body { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; color: #37302a; background: #fff; font: normal 100%/1.4 sans-serif; }
.site-branding { position: statice; }
 @media screen and (min-width: 40em) {
.site-branding {
position:absolute;
}
}
#nav { position:relative; padding:0 0 35px 10px; z-index:10000; top:0; }
@media screen and (min-width: 40em) {
#nav {
position:relative;
padding:35px 0 35px 10px;
}
}
.nav-collapse, .nav-collapse * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
 @media screen and (min-width: 40em) {
.nav-collapse ul {
 list-style: none;
 width:100%;
 float: left;
}
}
.nav-collapse ul { list-style: none; width: 100%; float: left; margin-top:0; }
.nav-collapse li { float: left; width: 100%; }

.nav-collapse li.overseas a{ padding:0;}
.overseas { margin-left:0; white-space:nowrap; }
@media screen and (min-width: 40em) {
.overseas {
	position:absolute;
	float:right;
	right:30px;
}
}

.nav-collapse  li#home{ padding-left:100px;}
 @media screen and (min-width: 40em) {
 .nav-collapse li {
 display:inline;
 width:auto;
}
}

.nav-collapse .overseas a { border-right:0; }
 @media screen and (min-width: 40em) {
 .nav-collapse li {
 display:inline;
 width:auto;
}
}
.nav-collapse a { color: #fff; text-decoration: none; width: 100%; background: #000; border-bottom: 1px solid white; padding: 0.7em 1em; float: left; }
 @media screen and (min-width: 40em) {
 .nav-collapse a {
 margin: 0;
 padding:0 1em;
 float: left;
 text-align: center;
 border-bottom: 0;
 border-right: 1px solid white;
}
}
.nav-collapse ul ul a { background: #ca3716; padding-left: 2em; }
 @media screen and (min-width: 40em) {
 .nav-collapse ul ul a {
 display: none;
}
}
#nav-toggle { -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: 0; cursor: pointer; width: 70px; height: 80px; float: right; text-indent: -9999px; overflow: hidden; background: #000 url("../images/hamburger.gif") no-repeat 50% 33%; top:0; }
 @media screen and (-webkit-min-device-pixel-ratio: 1.3), screen and (min--moz-device-pixel-ratio: 1.3), screen and (-o-min-device-pixel-ratio: 2 / 1), screen and (min-device-pixel-ratio: 1.3), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx) {
 #nav-toggle {
 background-image: url("../images/hamburger.gif");
 -webkit-background-size: 100px 100px;
 -moz-background-size: 100px 100px;
 -o-background-size: 100px 100px;
 background-size: 100px 100px;
top:0;
}
}
#mainimage img { display:none; }
@media screen and (min-width: 40em) {
#mainimage img {
width:100%;
height:auto;
display:block;
}
}
#mainimage-sm img { display:block; width:100%; }
@media screen and (min-width: 40em) {
#mainimage-sm img {
display:none;
}
}
#home-content { width:100%; margin:0 auto }
 @media screen and (min-width: 40em) {
#home-content {
width:980px;
margin:0 auto
}
}
h2 img { padding-top:0px; margin-left:10px; }
@media screen and (min-width: 40em) {
h2 img {
padding-top:0px;
margin-left:0;
}
}
/* top about*/
#aboutus { border-top: 1px solid #CCC; margin-top:20px; padding:0; background: url(../images/sm_img_about011.png) no-repeat right top; background-size: contain; padding-top:40px;}
@media screen and (min-width: 40em) {
#aboutus {
	border-top: 0 solid #CCC;
margin-top:20px;
padding-top:40px;
background: url(../images/img_about01.png) no-repeat;
 background-size: contain;
}
}

#aboutus .txt-wrap {
width:96%;position:static; z-index:100; padding: 0; line-height:1.2; float:none; padding-top:40px; margin:0 auto 40px auto; }

@media screen and (min-width: 40em) {
#aboutus .txt-wrap {
width:535px;
position:static;
z-index:100;
padding:20px 0;
margin-left:50px;
line-height:1.2;
float:left;
line-height:1.8;
margin-bottom:0;
}
}
#aboutus .txt-wrapB { 
width:96%; position:static; z-index:100; padding:0; line-height:1.2; float: none; margin:0 auto;}
@media screen and (min-width: 40em) {
#aboutus .txt-wrapB {
width:535px;
position:static;
z-index:100;
margin-right:50px;
line-height:1.2;
float: right;
line-height:1.8;
right:0;
}
}





#aboutttl01 img { width:100%; height:auto }
@media screen and (min-width: 40em) {
#aboutttl01 img {
width:100%;
height:auto
}
}
#aboutttl02 img { width:100%; height:auto }
@media screen and (min-width: 40em) {
#aboutttl02 img {
width:100%;
height:auto
}
}
#aboutus h2 img { padding-top:0px; margin-left:6px; }
@media screen and (min-width: 40em) {
#aboutus h2 img {
padding-top:0px;
}
}
#aboutus .txt-wrap h3 img { width:100%; height:auto }
@media screen and (min-width: 40em) {
#aboutus .txt-wrap h3 img {
width:auto;
height:auto
}
}
#aboutus .txt-wrapB h3 img { width:100%; height:auto }
@media screen and (min-width: 40em) {
#aboutus .txt-wrapB h3 img {
width:auto;
height:auto
}
}

p#info-border{padding-bottom:10px; border-bottom:1px solid #666; margin-bottom:10px;}
#aboutus .txt-wrapB #info img { width:100%; height:auto;  }
@media screen and (min-width: 40em) {
#aboutus .txt-wrapB #info img {
width:auto;
height:auto;
}
}

/* top product*/


#product .productB { width:100%; height:auto; float:left; background:none; margin-right:0; border-top: 1px solid #CCC; margin-top:20px; }
 @media screen and (min-width: 40em) {
#product .productB {
width:480px;
height:508px;
float:left;
background:url(../images/bg_pro.png) no-repeat top left;
margin-right:14px;
border-top: 0px solid #CCC;
}
}

#product .txt-wrap { position:static; z-index:100; padding:30px 30px 0px 20px; line-height:1.2; float:left; }
 @media screen and (min-width: 40em) {
#product .txt-wrap {
position:absolute;
z-index:100;
padding:30px;
line-height:1.2;
float:left;
}
}
h1{ height:80px; display:table-cell; vertical-align:middle;}

h1 span { font-size:80%; font-size:x-small; color:#FFF; padding-left:20px; font-weight:normal; }
 @media screen and (max-width: 40em) {
 h1 span {
display:none;
}
}

h1 img { height:80px; width:auto;margin:auto 0 auto 20px; }
@media screen and (max-width: 40em) {
 h1 img {
 margin:auto 0 auto 20px; }
}


.copyright img { height:50px; width:auto;margin:auto 0  ; }
@media screen and (max-width: 40em) {
 h1 img  { height:50px; width:auto;margin:auto 0  ;}
}


.oters { margin-left:6px; }

.oters li{ margin-bottom:20px;}
@media screen and (min-width: 40em) {
.oters li{ margin-bottom:0px;}}

/* top news column*/

		#news-section { width:100%; margin:40px auto 0 auto; padding-top:1.5em }
 @media screen and (min-width: 40em) {
 #news-section {
width:980px;
margin:40px auto 0 auto;
padding-top:1.5em
}
}
#news-section h2 img{ margin-left:10px; }
#news-section ul li{ margin-left:20px; }
#column-section { width:100%; margin:0 auto; padding-top:1.5em; padding-bottom:1.5em; }
 @media screen and (min-width: 40em) {
#column-section {
width:980px;
margin:0 auto;
padding-top:1.5em;
padding-bottom:1.5em;
}
}
#column-section h2 img{ margin-left:10px; }
#column-section ul li{ margin-left:20px; }