﻿@charset "utf-8";
body {margin:0; padding:0; font-size:15px; line-height:160%; font-family:Arial, Helvetica, sans-serif,'微軟正黑體';}
a{text-decoration:none;}
#header, #footer, #defaultimg, .content{width:100%; height:auto; float:left;}
.page{height:auto; position:relative; margin:auto auto; padding:auto auto;}
.block{height:auto; float:left; cursor:pointer;}
.rwdimg{width:100%; height:auto;}/*讓圖自適應用*/
*{box-sizing:border-box; }

/*header*/
#header{position:fixed; z-index:200; background:#666;}
.logo{ height:auto; float:left; line-height:0;}
.logo img{max-width:100%; height:auto;}
.toggle{cursor:pointer;}
/*nav*/
.nav{float:left; height:auto; width:100%;}
.nav div{width:30%; height:auto; float:left; text-align:center; padding-top:1em;}
.nav a{color:#03174e; text-align:center; display:inline-block; float:left;}
.nav a p{margin:0;}
.nav a:hover{color:#F90; background:#333;}
/*subnav*/
.subnav ul{margin:0; padding:0; list-style:none;  font-size:16px;}
.subnav ul li a{border-top:1px dotted #666; line-height:240%;}
.subnav ul li ul li a{padding-left:1.5em; border:none; font-size:15px; color:#666;}
.subnav a:hover{color:#d16a39; background:#efefef; }
.subnav a{width:100%; color:#333; display:block; padding-left:1em;}
/*defaultimg*/
#defaultimg{line-height:0;}
/*footer*/
#footer{background:#fff; color:#999; text-align:center; padding:0.3em 0; font-size:13px; line-height:130%; border-top:1px solid #efefef;}
/*content*/
h1.tit{color:#036; text-align:center; padding-top:0.2em; line-height:100%; padding-bottom:0; margin-bottom:0;}
.side{height:auto; float:left;box-sizing:border-box;}
.main{height:auto; float:left; box-sizing:border-box; line-height:180%; text-align:left;}
.innerhtml{width:100%; min-height:500px; clear:both;}
.one{width:100%;}
/*default page use*/
.d1{padding-bottom:1em;}
.d1 h1.tit{color:#B8D6E4;}
.d1 .block{color:#003366;}
.d1 .block h3.name{background:rgba(255,255,255,0.6); text-align:center; display:block; width:100%; height:90px; border-radius:1em; padding:0.5em 0; margin:0; line-height:180%;}
.d1 .block h3.name:hover{background:rgba(49,90,131,0.7); color:#fff;}
.d2{background:url(images/d-bg1-2.jpg) no-repeat left top #f5f5f5;}
.d2 .left{background:rgba(51,51,51,0.9); color:#FFF; padding:1em; height:auto; float:left;}
.d2 .left h2.tit{border:1px solid #F60; color:#f60; padding:0.5em 0.5em 0.5em 4em; margin:0; display:block; background:url(images/d1-icon.png) no-repeat; background-position:1em; line-height:150%;}
.d2 .left p{padding:0 1em 1em 1em; font-size:16px; line-height:190%;}
.d2 .right{height:auto; float:left; padding:0;}
.d2 .right div.block{padding:1em; text-align:center;}
.d2 .right p{text-align:center;}
/*search*/

.search th{background:#666; color:#fff; padding:0.5em ;}
.search .block{background:#fff; border:1px solid #efefef;}
.search td{padding:3px;}
.search tr:nth-child(even){background:#EEEDD9;}

/*newsmulti*/
.contentmulti .block{background:#fff; margin-bottom:0.3em; box-shadow:0 1px 5px rgba(0,0,0,0.1); padding:0.5em 0; border-left:3px solid #ccc;}
.contentmulti .block:hover{background:#FFC; color:#039;}
.contentmulti .block h3{width:100%; float:right; text-align:left; padding:0 1em; margin:0; line-height:180%;}
.contentmulti .block p{width:100%; float:right; text-align:left; padding:0 1em; margin:0; line-height:180%;}

/*contactinfo*/
.contactinfo{}
.contactinfo p{ border-bottom:1px dashed #999;}
.contactinfo .subtit{color:#666; font-weight:bold;}
.contactinfo span{color:#ccc; padding:0 0.2em; font-size:13px;}

/*input frame*/
/*.inputframe{height:auto; padding:10px 5%; text-align:left; float:left; width:100%;}*/
.contact{padding:1em;}
.contact .block{padding:0.5em; cursor:default;}
.contact p{margin-bottom:0;}
.contact input{height:30px; width:100%;}
.contact textarea{width:100%;}
select{height:30px; width:10em;}

/*btn*/
.btn{padding:0.5em 3em; background:#666; color:#fff; border-radius:0.3em;}
.btn:hover{background:#333;}

.btn_big{padding:0.5em 3em; background:#FF5700; color:#FFF; border-radius:0.3em; font-size: 19px;}
.btn_big:hover{background:#333;}


@media screen and (max-width:767px) {/*mobile*/
body{background:url(images/bg2.jpg) repeat-y; background-size:contain;}
.BannerDivPc{display:none;}
.hide-m{display:none;}
.page{width:100%; padding:0 2%;}
/*header*/
#header .page{padding:0;}
.logo{width:40%; padding-left:1%; padding-top:1%;}
.defaultbody{background:url(images/bg.jpg) no-repeat bottom center; background-size:contain;}

/*footer*/
#footer .left{text-align:center;}
#footer .left p{width:100%; height:auto; float:left; text-align:center;}
#footer .right{text-align:center;}
/*nav*/
.nav{width:100%; border-bottom:1px solid #ccc; display:none;}
.nav a{width:100%; text-align:center; border-top:1px dotted #ccc; line-height:200%; color:#ccc;}
/*defaultimg*/
/*subnav*/
#submenu{border:1px solid #ccc; float:left; width:100%; border-radius:5px; margin-top:3em;}
.subtoggle{padding:15px;}
.subnav{display:none;}
/*content*/
h1.tit{font-size:24px;}
.content{margin-top:0em;}
.side{width:100%; padding:0 1em; }
.main{width:100%; padding:1em;}
.four{width:100%;}
.three{width:100%;}
.two{width:100%;}

/*default page use*/
.d1 .block{width:50%; padding:0.5em;}
.d2 .left{width:100%;}
.d2 .right{width:100%;}
.d2 .left h2.tit{text-align:center; padding:1em; background:none;}
}

@media screen and (min-width:768px) and (max-width:1199px){/*pad*/
.BannerDivMobile{display:none;}
.hide-p{display:none;}
.page{width:100%; padding:0 2%;}
/*header*/

.defaultbody{background:url(images/bg.jpg) no-repeat  bottom center; background-size:130%;}
#header .page{padding:0 0.2em;}
.logo{width:25%; padding-left:1%; }
/*defaultimg*/
/*nav*/
.nav a{padding:0.5em; width:11.6%; color:#fff;}

/*subnav*/
.subtoggle{display:none;}
/*footer*/
#footer .left{text-align:left;}
#footer .left p{width:30%; height:auto; float:left; padding:0.5em 0.2em;}
#footer .right{text-align:right;}

/*content*/
h1.tit{font-size:36px;}
.side{width:28%; padding:0em 1em 1em 1em; }
.main{width:72%; padding:0em 1em 1em 1em; min-height:500px;}
.four{width:25%;}
.three{width:33.3%;}
.two{width:50%;}

/*default page use*/
.d1{padding-bottom:5em;}
.d1 .block{width:33.3%; padding:0.5em;}
.d2 .left{width:50%;}
.d2 .right{width:50%;}
}
@media screen and (min-width:900px) and (max-width:1199px){/*desktop*/
.nav a{font-size:15px; padding:2em 1em 0 1em;}

}

@media screen and (min-width:1200px){/*desktop*/
.BannerDivMobile{display:none;}
.hide-d{display:none;}
.page{width:1200px;}
/*header*/
.defaultbody{background:url(images/bg.jpg) no-repeat center bottom; background-size:cover; }
.logo{width:28%;}
/*defaultimg*/

/*nav*/

.nav a{padding:0.5em; width:11.6%; color:#fff;}


/*subnav*/
.subtoggle{display:none;}
/*footer*/
#footer .left{text-align:left;}
#footer .left p{width:30%; height:auto; float:left; padding:0.5em 0.2em;}
#footer .right{text-align:right;}

/*content*/
h1.tit{font-size:36px;}
.side{width:28%; padding:0em 1em 1em 1em; }
.main{width:72%; padding:0em 1em 1em 1em; min-height:600px;}
.four{width:25%;}
.three{width:33.3%;}
.two{width:50%;}
/*default page use*/
.d1{padding-bottom:5em;}
.d1 .block{width:33.3%; padding:0.5em;}
.d2 .left{width:33.3%;}
.d2 .right{width:66%;}
}