@charset "utf-8";
/* CSS Document */

* {margin:0px; padding:0px;}
.cleardiv {clear:both;}
body {background:url(../images/bg.jpg) top center repeat;}
#back {position:fixed; right:40px; bottom:120px; cursor:pointer; display:none; z-index:10;}

#layout {width:980px; margin:auto; background:white; box-shadow:0px 0px 10px black; overflow:hidden;}

header {height:328px; background:url(../images/index_01.jpg) top center no-repeat; overflow:hidden; margin-top:40px;}
header sub {display:block; margin-top:240px; margin-left:102px;}
header .fleft {float:left;}

#mbheader, #goarticle {display:none;}


@keyframes imgexpand{from{width:144px; height:108px;} to{width:200px; height:150px;}}
#main p img:hover{width:200px; height:150px; animation:imgexpand 0.5s;}

/*#menu a{display:block; padding-top:5px; width:25%; color:#FFFFFF; font-size:21px; line-height:21px; font-family:"華康細黑體","MicrosoftJhengHei", "SimHei"; text-align:center; float:left;}*/
#menu a.tag{margin-top:10px; padding-bottom:5px; cursor:pointer;}
@keyframes menu_hover{from{margin-top:10px; padding-bottom:5px;} to{margin-top:0px; padding-bottom:15px;}}
#menu a.tag:hover,#menu a.selected{margin-top:0px; padding-bottom:15px; font-weight:bold; background-image:url(../images/menu.png); _background-image:url(../images/menu.gif); background-position:0 0; background-repeat:repeat-x;}

.article {width: 500px; float: left; padding-top: 13px;}
#menu {margin: 0 auto 15px;; text-align: center;}
#menu a {display:inline-block; margin: 0 6px; padding: 5px 9px; background-color: #e27b36; color: #ffffff; border:solid 1px #803300; font-size: 18px; line-height: 21px; font-weight: bold; font-family: '華康細黑體'; cursor: pointer; text-shadow: 0 0 2px #803300, 0 0 3px #803300; transition: background-color 0.3s;width:80px;}
#menu a:hover, #menu a.current {background-color: #ffffff; color: #803300; text-shadow: none; box-shadow: 0 2px 8px #803300;}
#menu a.current {cursor: default;}
.section {padding-bottom: 20px; clear: both;}
.section h2, .section p {margin: 0; padding: 0;}
.section h2 {padding-bottom: 15px; background-position: center top; background-repeat: no-repeat; font-size: 19px; line-height: 19px; font-family: '標楷體'; text-indent: 77px;}
.section p {padding: 0 10px; font-size: 13px; line-height: 21px; letter-spacing: 1px; text-align: justify;}
.section img {border: solid 3px #ffffff;}
/* .section img[align=right] {margin: 10px 5px 5px 10px; box-shadow: 2px 3px 5px rgba(60, 0, 0, 0.5);} */
.section .figure {margin-top: 10px; text-align: center;}

#content-1 h2 {background-image: url(../images/t1.gif); color: #663300;}
#content-2 h2 {background-image: url(../images/t1.gif); color: #663300;}
#content-3 h2 {background-image: url(../images/t3.gif); color: #990033;}
#content-4 h2 {background-image: url(../images/t4.gif); color: #000099;}

#content {position:relative; background:url(../images/index_02.png) top center no-repeat; margin-top:-15px;}

article {float:left; width:530px; margin-left:10px; margin-top:110px; margin-bottom:15px;}
article .title {margin-left:-10px;}
article .text {margin-bottom:10px;}
article .text h3 {font-size:26px; letter-spacing:1px; line-height:36px; color:#633; margin-top:-2px;}
article .text p {font-size:13px; letter-spacing:1px; line-height:19px; text-align:justify;}

.smmobile {display:none;}

aside {float:right; width:430px; margin-left:5px; margin-top:110px; margin-bottom:10px; background:url(../images/index_03.png) top center no-repeat;}
aside #goods {background:url(../images/index_04.png) bottom center no-repeat;}
aside #gdsbtn {margin-top:20px; margin-bottom:15px;}
aside #gdsbtn a {display:inline-block; padding:4px 10px; margin:0px 15px; color:#999; font-size:20px; font-family:微軟正黑體; font-weight:bold; letter-spacing:2px; border-top:2px solid #999; border-bottom:2px solid #888;}
aside #gdsbtn .gbs_btn:hover {color:#804040; border-color:#804040;}
aside #gdsbtn .gbs_slec {color:#804040; border-top:2px solid #804040; border-bottom:2px solid #804040; cursor:default;}
aside #gdsbtn .gbs_slec:hover {color:#804040; border-top:2px solid #804040; border-bottom:2px solid #804040; cursor:default;}

aside #gdsbtn2 {margin-top:16px; margin-bottom:12px;}
aside #gdsbtn2 a {display:inline-block; padding:4px 10px; margin:0px 15px; color:#999; font-size:15px; font-family:微軟正黑體; font-weight:bold; letter-spacing:2px; border-bottom:2px solid #888;}
aside #gdsbtn2 .gbs_btn:hover {color:#804040; border-color:#804040;}
aside #gdsbtn2 .gbs_slec {color:#804040;  border-bottom:2px solid #804040; cursor:default;}
aside #gdsbtn2 .gbs_slec:hover {color:#804040; border-bottom:2px solid #804040; cursor:default;}

aside #goods ul li {list-style:none; display:inline-block;}
aside #goods table {text-align:left;}
aside .tab_container {clear:both; padding-left:10px; padding-right:10px; padding-bottom:20px;}
aside .tab_container div {display:block; height:auto;}
aside ul.tabs {margin-bottom:15px;}
aside ul.tabs li {margin:0px 15px;}
aside ul.tabs li a {display:inline-block; padding:3px 10px; color:#666; font-size:16px; font-family:微軟正黑體; font-weight:bold; letter-spacing:2px;}
aside ul.tabs li a:hover {color:#804040; border-bottom:2px solid #804040;}
aside ul.tabs li.active {border-bottom:2px solid #804040;}
aside ul.tabs li.active a {color:#804040;}
aside ul.tabs li.active a:hover {border-bottom:none; color:#804040;}

aside ul.tabs2 {margin-bottom:15px;}
aside ul.tabs2 li {margin:0px 5px;}
aside ul.tabs2 li a {display:inline-block; padding:3px 10px; color:#666; font-size:16px; font-family:微軟正黑體; font-weight:bold; letter-spacing:2px;}
aside ul.tabs2 li a:hover {color:#804040; border-bottom:2px solid #804040;}
aside ul.tabs2 li.active {border-bottom:2px solid #804040;}
aside ul.tabs2 li.active a {color:#804040;}
aside ul.tabs2 li.active a:hover {border-bottom:none; color:#804040;}

aside ul.tabsnor {margin-bottom:15px;}
aside ul.tabsnor li {margin:0px 15px;}
aside ul.tabsnor li a {display:inline-block; padding:3px 10px; color:#666; font-size:16px; font-family:微軟正黑體; font-weight:bold; letter-spacing:2px;}
aside ul.tabsnor li a:hover {color:#804040; border-bottom:2px solid #804040;}
aside ul.tabsnor li a.activenor {color:#804040; border-bottom:2px solid #804040;}

aside ul.tabsnor2 {margin-bottom:15px;}
aside ul.tabsnor2 li {margin:0px 5px;}
aside ul.tabsnor2 li a {display:inline-block; padding:3px 10px; color:#666; font-size:16px; font-family:微軟正黑體; font-weight:bold; letter-spacing:2px;}
aside ul.tabsnor2 li a:hover {color:#804040; border-bottom:2px solid #804040;}
aside ul.tabsnor2 li a.activenor2 {color:#804040; border-bottom:2px solid #804040;}

.special{margin-bottom:10px;}
.special a{display:block; }
.special img{display:block; border:none;}
.special a:hover img{opacity:0.6; filter:alpha(opacity=60);}

.special1 a img{ display:none; max-width:100%; height:auto} 

.con_lt div.rt_spe {display:block; width:94%; box-sizing:border-box; padding:8px; marign:10px auto 0px auto; background:#def0fe; border:3px solid steelblue; border-radius:10px; font-size:14px; line-height:20px; font-family:微軟正黑體,MS Gothic,sans-serif; font-weight:bold; }

@media screen and (max-width: 768px) {
	#back {right:10px; bottom:10px;}
	#back img {width:40px; height:auto;}
	#layout {width:100%; box-shadow:none;}
	header {display:none;}
	#menu-mobile{display:block;}
	#mbheader {display:inherit; height:auto; margin-top:40px; position:relative;}
	#mbheader img {width:100%; height:auto;}
	#mbsub {display:block; position:absolute; bottom:0px; width:100%; background:url(../images/subbg.png) repeat;}
	#mbsub a {display:inline-block; width:17%; color:#C0C0C0; margin:0px -1%; font-family:微軟正黑體; font-size:16px; line-height:18px; padding:2% 0px;}
	#mbsub .mbslec {color:white;}
	#goarticle {display:block; width:70%; padding:6px 0px; background:#894250; color:white; font-size:13.5pt; letter-spacing:0.75pt; font-family:微軟正黑體, 新細明體;}
	#content {background-size:contain; margin-top:-1%; padding-top:11%;}
	aside {float:none; width:94%; margin:auto; margin-top:0px; margin-bottom:20px; background-size:contain;}
	aside #goods {background-size:contain; padding-top:20px;}
	aside #goods table {background-image:none; border-bottom:1px solid gray;}
	aside #gdsbtn {margin-top:0px;}
	aside #gdsbtn a {font-size:16px;}
	aside #gdsbtn2 a {font-size:13px;}
	aside ul.tabs li {margin:0px 8px;}
	aside ul.tabs li a {font-size:14px;}
	aside ul.tabs2 li {margin:0px 2px;}
	aside ul.tabs2 li a {font-size:14px;}
	aside ul.tabsnor li {margin:0px 8px;}
	aside ul.tabsnor li a {font-size:14px;}
	aside ul.tabsnor2 li {margin:0px 2px;}
	aside ul.tabsnor2 li a {font-size:14px;}
	article {float:none; width:96%; margin:auto; margin-top:0px;}
	article .title img {width:80%; height:auto;}
	article .text img {width:40%; height:auto;}
	.sm {display:none;}
	.smmobile {display:block;}
	.special a img{ display:none;}
	.special1 a img{ display:block; max-width:100%; height:auto} 
}

@media screen and (max-width: 480px) {
	#goarticle {font-size:11.25pt;}
	#mbsub a {font-size:13px;}
	.special a img{ display:none;}
	.special1 a img{ display:block; max-width:100%; height:auto} 
}

@media screen and (max-width: 360px) {
	#mbsub a {font-size:12px;}
}