@charset "utf-8";
/* CSS Document */
@media screen and (max-width: 1024px)
{

input,select,textarea{ border-radius:0}
#inhd{ padding-left:30px;top:30px}
#inhd h1{ margin-right:0}
.inul li{ font-size:15px; height:180px; width:45px}
.inul li a{ padding:0 15px; width:15px}
#slider{ width:100%; max-height:768px; display:block}
.swipe-wrap .cover{ background-size:80%; background-repeat:no-repeat; background-position:center center}
.mobile{ display:none }
.swipe-wrap .cover{ background-size:auto 100%}
.noheader{ padding:10px 0 0; height:85px;overflow: visible;}
.hin{ width:100%; margin:0 auto}
.noheader h1{ width:40px; height:66px;background-image:url(../images/comm/mlogo.png); background-size:40px auto ; position:absolute; left:50%; margin-left:-20px}
.inbody .noheader h1{ background-image:url(../images/index/logo.png); background-size:40px auto}	
	}
	
/* 平版(直)768X1024 */
@media screen and (max-width: 1024px) and (orientation: portrait){
.foo18{ position:fixed}
footer h2,.login footer h2{ width:100%; padding:0; font-size:350%}
.forban{}
#slider{display:none;max-height:537px}
.swipe-wrap{ width:100%; height:537px}
.swipe-wrap .cover{ background-size: 130% auto}
.ppic{ display:block}
.mpic{ display:none}
.mobile{display:block}
.cir li{ margin:0 2px 0 10px; width:180px; height:180px; background-size:180px auto; padding:20px 5px 5px 0; font-size:150%}
.ltab{ margin-left:10px}
}
@media screen and (max-width: 960px) {
	#container{ width:640px; margin:0 auto}	
	}
@media screen and (max-width: 930px)
{
	}
@media screen and (max-width: 768px) {
.copy{ display:none}
#nolo h3{ padding-top:10%; font-size:250%; line-height:150%}
.login{ background-size:150%; background-position:center  70px }
#lolo h1{ margin:5% auto 0; width:70px; background-size:70px auto; height:90px}
.login h3{padding:10% 5% 5%; font-size:280%; width:90%; text-shadow:1px 1px 3px rgba(0, 0, 0, 0.6) }
.loform{ margin:15% auto 40px; width:80%}
.loform .lobtn{ width:100%}
.lobtn a{ width:45%}
#inhd{ display:block}
.inbody .noheader{ display:none; background:none;overflow: visible;}
.mobile img{ width:100%; height:auto}
.mlang select{ width:110%; background:none; border:none; line-height:40px; height:40px; padding:0 15px}
.nart{ width:90%;margin: 95px 5% 0px; padding-bottom:30px}
#plistn { margin: 70px auto 0;padding-bottom: 30px; width:90%}
.nart h4, .boedit h4{ font-size:120%}
.mbigh1{ font-size:220%; padding-bottom:15px}
.nart h2, .boedit h2{ font-size:150%; padding-bottom:10px; line-height:120% }
.maxw{ width:100%; margin:0 auto}
.ftop,.inbody .ftop{ width:96%; padding:0 2%; position:static}
.ftop form{ padding:10px 0; width:50%}
.ftop table{ width:100%}
.ftop table .td1{ width:80%}
.search_txt{ width:100%}
.flink{padding: 15px 0 0 10px;}
.flink li{ margin:0 5px}
footer,.inbody footer{ width:100%; padding:10px 0; position:static}
.par{ width:98%; margin:70px 1% 0; padding:47px 0 0}
.pone{ width:90%; margin:0 5%; height:auto; padding-bottom:20px;}	
.pone .pic{ height:auto}
.pone .plogo{ width:20%; height:70px; background-size:auto 60px;box-sizing: border-box; margin:0 0 20px 0}
.pone .add,.pone .name{ width:80%; padding:5px 0 5px 12px;box-sizing: border-box}
.pone .name{font-size:150%; padding:5px 0 7px 12px}
.pone .kind{ width:80%; padding:0 0 10px 12px;box-sizing: border-box}
.pone .des{ padding-top:10px; width:96%; margin:0 2%}
/*產品*/
.pola{ width:90%; margin:0 5%}
.pbot ul{ padding:0}
.alcohol{ width:100%; margin:0 auto; padding:0 0 30px}
.aline{ width:100%}
.prin{ width:100%; margin:50px auto 0; float:left}
.propic{ width:100%; margin:0 0 50px}
.propic img{max-width:30%;}
.pdel{ width:96%; margin:0 2%}
.pola .brand{ font-size:200%}
.pola .kind{ font-size:160%}
.pclass{ width:98%; padding:10px 1% 0; margin:0 }
.pclass ul{ width:48%; margin:0 1% 5%; float:left}
.cpb .title{ padding:10px 0}
.cpb .title{ font-size:110%}
.cpb .gold{ font-size:160%}
.cpb .gold span{ font-size:40%}
.pbot{width:90%; margin:0 5% 0; padding:10px 0 30px}
.bologo{ width:100%; background:none; padding-bottom:10px; height:auto; margin:0 }
#trbom .bologo{ background-position:center center; background-size:100%}
.bologo img{ width:33%}
.boname{ width:100%; font-size:180%; height:auto}
.boyear{ width:100%; padding-bottom:10px}
#trbom{ padding-bottom:10px}
#trbom .bodes{ padding-bottom:0}
.bodes{ width:100%; margin:0}
.bin{ width:96%; padding:25px 2% 0}
.bbedit{ width:100%}
.bah2{ font-size:180%; padding-bottom:15px}
.otblog{ display:none}
.bbbom{ margin:0 ; padding-bottom:20px; width:90%; padding:0 5%}
.conlist{ width:100%;margin: 70px auto 0; padding:47px 0 0}
.dlist{ width:84%; margin:0 auto; padding:0; background:none}
.drone{ width:46%; height:250px; margin:0 2% 5%; overflow:hidden}
.drone .pic,.adroll .pic{ width:100%; height:171px}
.drone .pic img,.adroll .pic img{width:auto; height:171px; max-width:150px}
.drone .name,.adroll ul h3{ width:100%; font-size:120%}
.drone .kind,.adroll ul h4{ width:100%;}
#wpola .cmbtn{ width:100%; margin:0 0 50px; height:40px}
.cmbtn a{ width:100%;}
.otdr{ display:none}
/*blog*/
#boh1{ margin:70px 2% 0; width:96%;}
.box{ margin:0 5px 30px}
.forbox .tit{font-size: 150%;
}
.forbox .des{ width:100%}
.boedit{ width:90%; margin:70px auto 0}
.boedit .sharefb{top:80px}
.reblo{ padding:23px 0 50px}
.blef,.brig{top:47%; z-index:50}
.brin{ width:96%; margin:0 auto}
.brin ul:first-child {margin-left: 0px;}
.brin ul {display: block;float: left; height: 180px;margin: 0 0 20px; overflow: hidden; width: 100%;}
.lincla,boclas{ width:96%; margin:0 2%}
.backli,.cobtn{ width:48%; margin:0 1%}
.boclas li{ margin-right:10px}
#infscr-loading { 
left: 50%; margin-left:-45px; bottom: 90px;width: 100px;}
.nnex a:hover{ background:#CCCCCC}
/*據點*/
.stle{ width:98%}
.sone .spic{ width:28%; padding:15px  2% 10px 1%}
.sone li{ width:68%; padding:3px 0}
.sone .sname{ padding:15px 0 4px}
.sone .swrd{ display:none}
.snadd{ height:auto}
.sone .gmap{ position:static; width:100%; float:left}
.gmap .oubtn{ width:100%; height:25px; line-height:25px; font-size:14px; float:left}
.snadd .del{ font-size:15px}
/*新聞*/
.news #container{ width:90%; margin:0 5%}
.mbigh1 span{ width:100%; position:static; margin:10px 0 0}
.mbigh1 span select{ width:100%; padding:9px 5% 7px}
.news .box{ width:100%; height:100px; position:relative}
#search .box{ height:49px}
.box ul{ display:table; width:100%}
.ntype{ width:17%; margin:0; text-align:left}
.nnex{ width:100%; margin:0}
.ndate{ margin:0; position:absolute;top:0; right:0}
.ntt{ width:96%; padding:15px 2%; margin-bottom:20px}
.ntt ul{ display:table; width:100%}
.ntit{ width:70%; margin:0 5% 0 0}
.ntt .ndate{ width:25%; position:static}
.newseditor{ width:96%; margin:0 2%; padding-bottom:0}
.newseditor p{ padding-bottom:0}

	}
/*  手機 (橫)  */
@media screen and (max-width: 767px) and (orientation: landscape)
{.foo18{ position:static}
	}
@media screen and (max-width: 640px) {
#container{ width:310px}
.noheader{ padding:10px 0 0; height:80px}

.foo18{ position:static}
footer h2, .login footer h2{ font-size:}
}
}
@media screen and (max-width: 620px) {

.goselec{ display:none}
	}
@media screen and (max-width: 616px) {
.nart{ width:90%;margin: 70px 5% 0px; padding-bottom:30px}
.mbigh1 { font-size: 180%; padding-bottom: 10px;}
.reblo{ width:90%; padding:23px 5% 20px}
.retit{ font-size:170%}
.brin{ padding-top:10px}
.bone .tit{ font-size:140%; padding:0 0 5px}
.brin ul,.bone .des{ height:auto} 
.nart h2, .boedit h2{ font-size:140%}
.cir li {
    background-size: 145px auto;
    height: 130px;
	font-size:120%; line-height:45px;
    width: 140px;
}
.coimg{ margin:0 auto; display:none; }
.celimg{ margin:15px auto 0; display:block;}
.intimg{ padding:0}
.dodo{ padding-top:5px}
.gotxt{ margin-bottom:45px}
.samt{ margin: 7px auto 19px;}
.t01{ padding-right:70%}
.lamm{ margin:7px auto 0}
.lamm li{margin: 0 13px 22px}
.lamm li img{ width:113px; height:auto}
.nart h2 span{ display:none}
.nart h2 br{ display:inline-block}
.wmus {padding: 10px 0 28px;}
.propic{margin:0 0 20px}
.ltab{ margin:0}
.ltab ul{ display:block}
.ltab ul:first-child{ margin-bottom:37px}
.ltab ul+ul:first-child{ margin-bottom:0}
.ltab ul li{ display:block}
.ltab ul li:first-child{ width:100%}
.ltab ul li:first-child img{ max-width:100%}
.ltab ul .trha{ text-align:center; width:100%}
#rha01,#rha02{ padding:0}
#rha03{ padding:30px 0 0}
#wpola .cmbtn{margin:0 0 20px;}
.drone .name br{ display:none}
.twul{ width:100%; margin:0}
.mimg{ display:block; margin:0 auto}
.nimg{ display:none; }
.ppdot{ width:15px}
.nart p{ line-height:160%}
.nart h3{line-height:200%; font-size:110%; width:100%}
.ppic{ display:none}
.mpic{ display:block}
#plistn .poohi{ width:50%}
.ppdot{ width:20px}
#inhd{ display:none}
.inbody .noheader{ display:block; z-index:9999; position:fixed;top:0}

.nav a{ text-align:left; padding:13px 15px}
.mlang{ display:block; height:40px; line-height:40px; border-bottom:1px solid #d5c7b0; border-top:1px solid #d5c7b0; background: #bda986}
#slider{ display:none; height:0}
.boedit{ padding-bottom:15px}
footer{ height:auto}
footer br{ display:block}
.mobile{ width:100%; height:auto; overflow:hidden; display:block; position:relative; z-index:1;}
footer h2, .login footer h2{width:100%; line-height:100%; height:auto; font-size:320%}
.forban{}

.comtab{ display:none}
.phonew{ display:block; width:100%}
.phonew ul{ overflow:hidden; border-bottom:1px solid #EFEFEF; padding-bottom:20px; margin-bottom:15px}
.phonew ul,.phonew li{ width:100%}
.phonew li { display:table; font-size:100%; color:#777; line-height:220%}
.phonew li img{ margin:0 auto; display:block; padding:0 0 15px}
.phonew li span{ display:table-cell}
.wleft{ width:30%; font-weight:bold}
	/*contact*/
.add{ width:96%; margin:70px 2%; padding-bottom:0}
.add .mbigh1{ padding-bottom:10px}
.add .ps{ width:84%; margin:0 8%}
.aform{ width:100%}
.blala li{ width:100%}
.in01,.in02,.in03{ width:100%}
.blala .subject{ width:98%; margin:0 1% 5px}
.in01 input,.in02 input,.in03 input,.tetra textarea{ width:90%; padding:0 4%; margin: 0 1% 5px}
.tetra textarea{ padding:15px 4%}
.subject select{  width:94%; padding:0 2%}
.code input{ width:40%}
.code .oubtn{ width:45%; margin:0 0 5px }
.code input{ float:left; margin:0 0 5px}
.code .coimg{ float:left}
.fright{ display:none}
.blef, .brig{ display:none}
.dlist{ width:308px}