@charset "utf-8";
/* CSS Document */

@import url(about-pad.css);
@import url(quality-pad.css);
@import url(news-pad.css);
@import url(product-pad.css);
@import url(service-pad.css);
@import url(expert-pad.css);

/* common ========================
================================== */
body{ }
.l-body{ width: 100%; min-width: 480px;  overflow: hidden;}
.wrapper{ position: relative; display: block; margin: 0 auto; width: 100%; height:auto;}

.header{ height:auto;}
.header .header-inner{ padding: 20px 0;}
.header .header-inner h1{ display: block; margin: 0 auto; float: inherit;}
.header .header-inner h1 a{}
.header .header-inner .btn-menuopen{ position: absolute; display: block; width:79px; height:79px;  right:0; top:0; }/* forphone */
.header .header-inner .btn-menuopen a{ display: block; width: 100%; height: 100%; background: url(../images/all-m/m-menu-openbtn.png) center center no-repeat; text-indent: -9999px;}


.kv{ width: 100%; height: auto; margin:0; overflow: hidden; text-align: center;}
.kv img{ position: relative; width: 110%; height: auto; left:-5%;}

.container{ position: relative; display: block; width: 100%; height: auto; /*min-height: 400px;*/ padding: 20px; box-sizing: border-box; overflow: hidden;} 
.layout .block-pagetitle{ margin-bottom: 15px;}
.layout .block-main{ padding: 20px;}
.container .btn-alltop{ right:20px;}


/* 頁碼 */
.container .block-pagenumber{  }
.container .block-pagenumber ul{ }
.container .block-pagenumber ul li{ font-size:20px;}
.container .block-pagenumber ul li.totalpage{ margin-right:12px;}
.container .block-pagenumber ul li a{ font-size: 20px; padding: 2px 10px 4px 10px; margin: 0 2px;}
.container .block-pagenumber ul li a:hover,.container .block-pagenumber ul li.on a{ }
.container .block-pagenumber ul li.btn-arrow a{ display: block; width:30px; height: 30px; background: url(../images/all-m/m-icon-np-left.jpg) 0 0 no-repeat; text-indent:-9999px; margin:-4px 4px 0 3px; background-size:100% auto;}
.container .block-pagenumber ul li.btn-arrowleft a{ margin-left: 12px;}
.container .block-pagenumber ul li.btn-arrowright a{ background: url(../images/all-m/m-icon-np-right.jpg) 0 0 no-repeat; background-size:100% auto;}


/* 二欄型頁面 */
.layout-2column .block-left{ width: 100%; height: auto; margin-bottom: 15px; padding:0;}
.layout-2column .block-left-phone{ display: block; width: 100%; height:50px; padding:16px 18px; box-sizing: border-box; border-bottom: #FFFFFF 3px solid;}
.layout-2column .left-phone-title{ float: left;  font-size: 18px; font-weight: bold;}
.layout-2column .left-btn-arrow{ position: absolute; display: block; width: 46px; height: 50px; right: 0; top: 0;}
.layout-2column .left-btn-arrow a{ display: block; width: 100%; height: 100%; background:url(../images/icon-m/m-icon-arrow5.png) center center no-repeat; background-size: 20px auto; text-indent: -9999px;}
.layout-2column .block-left ul.left-menu{ display: none;}
.layout-2column .block-main{ width: 100%; }


.footer{ position: relative; display: block; width: 100%; height:auto; padding:0 20px 20px 20px; box-sizing: border-box;}
.footer-inner{ text-align: center;}
.footer-logo{ position: relative; display: block; width: 100%; height: auto; margin-bottom: 10px;}
.footer-logo>div{ display: inline-block; width: 300px; height: auto;}
.footer-logo>div img{ width: 100%; height: auto;}
.footer-content{ text-align:left; margin-bottom:20px;}
.footer-content p{  font-size:18px;  }
.footer-copyright{ position:relative; display: block; width: 100%; height: auto; font-size: 15px; right: 0; bottom: 0; margin-bottom: 10px;}
.footer-warning{ position:relative; display: block; width: 100%; height: auto; font-size: 15px; right: 0; bottom: 0; margin-bottom: 10px; line-height:20px;}
ul.footer-nav{ position: relative; display:inline-block; width: auto; height:auto; float:inherit;}
ul.footer-nav > li { float: left; margin-bottom: 15px;}
ul.footer-nav > li>a{ font-size: 18px; height: auto;}
ul.footer-nav > li.web-url a{ border-right: none; } 
ul.footer-nav > li.sharetxt{ display: none; font-size: 18px;}
ul.footer-nav > li.shareicon-fb {clear: both; margin-left: 143px;}
ul.footer-nav > li.shareicon-fb a{ width:60px; height:60px; background:url(../images/icon-m/m-icon-social-fb.gif) center center no-repeat; margin-right:10px; border-right: none; }
ul.footer-nav > li.shareicon-line a{ width:60px; height:60px; background:url(../images/icon-m/m-icon-social-line.gif) center center no-repeat; border-right: none;}


/* navbar ========================
================================== */
.navbar{ position: absolute; display: none; width:100%; height:100%; margin-right:0; top:0; left: 0; background: rgba(0%,0%,0%,0.8); z-index: 1000}
.navbar-inner{ position: absolute; width: 300px; height:100%; background: #fff; right:-400px;}
/* menu */
.navbar-inner ul.nav{ position: relative; width:100%; height:auto; margin-left:0px; margin-right:0px;}
.navbar-inner ul.nav > li{ float:none;}
.navbar-inner ul.nav > li > a{ display: block; width:100%; height:60px; text-align: left; padding-left: 25px; padding-top: 17px; font-size: 24px; border-bottom:#E6E6E6 1px solid; background: url(../images/all-m/m-menu-submenubtn.png) 260px 20px no-repeat; background-size:20px auto; }
.navbar-inner ul.nav > li > a span{ display: none; text-align: left;}
.navbar-inner ul.nav > li > a:hover{ background:#fff url(../images/all-m/m-menu-submenubtn.png) 260px 20px no-repeat; background-size:20px auto; color:#595959;}
.navbar-inner ul.nav > li > a.hover{ background:#fff url(../images/all-m/m-menu-submenubtn-r.png) 260px 20px no-repeat; background-size:20px auto;  color:#595959;}
.navbar-inner ul.nav > li.btn-menu06 > a { width: 100%;}

/* submenu */
ul.nav-submenu{ position: relative; display:none; width: 100%; height: auto; background: #90b75c;}
ul.nav-submenu > li > a{ display: block; width: 100%; height: 54px; font-size: 20px; text-align: left; line-height: 54px; color: #fff; text-decoration: none; border-top: #fff 1px dashed; padding-left:25px; }
ul.nav-submenu > li:first-child > a{ border-top: none;}
ul.nav-submenu > li > a:hover{ background: #b9d887;}

.btn-menuclose{ position: absolute; display: block; width: 60px; height: 60px; background: #90b75c; right: 300px;}
.btn-menuclose a{ display: block; color: #fff; width: 100%; height: 100%; font-size: 50px; line-height: 60px; padding-top:3px;  text-align: center; text-decoration: none;}


a.btn-shop { bottom: 10%; } 
a.btn-overseas { bottom: 2%; width: 80px; height: 80px; } 