@charset "big5";
/* CSS Document */
body {margin: 0;}
h1 {margin: 0; padding: 0; height: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; _display: none;}
.main {background:url(../images/index_bg0.gif) repeat center top #001a99;}
.containter {margin: 0 auto; width: 980px; background-color: #ffffff; box-shadow: 0 0 40px rgba(0, 0, 0, 1);}

.top-normal {height: 340px; background: url(../images/top.jpg) center top no-repeat;}
.top-mobile {display: none; padding-top: 40px;}
.top-mobile img {display: block; width: 100%;}

.article {width: 550px; float: left;}
.aside {width: 430px; float: right; padding: 15px 0 25px; background: url(../images/frame_02.gif) center top repeat-y #ffffff; position: relative;}
.footer {height: 0; clear: both;}

#menu {margin: 0 auto; width: 100%; max-width: 550px;}
#menu a {display: block; float: left; width: 20%; position: relative; cursor: pointer;}
#menu a img {width: 100%; border: none;}
#menu a img.hover {visibility: hidden; position: absolute; top: 0; left: 0;}
#menu a:hover img.hover, #menu a.current img.hover {visibility: visible;}
#menu a.current {cursor: default;}

.content h2 {height: 40px; background-position: left top; background-repeat: no-repeat; clear: both;}
.content h2 em {display: none; margin-bottom: 10px; width: 100%; padding: 5px; font-size: 16px; line-height: 16px; font-style: normal; font-family: Arial, Helvetica, sans-serif, '·L³n¥¿¶ÂÅé'; border-top-style: solid; border-top-width: 1px; border-bottom-style: solid; border-bottom-width: 2px;}
.content p {padding: 0 15px 15px; color: #333333; font-size: 13px; line-height: 20px; letter-spacing: 1px; text-align: justify;}
.content p img[align=left], .content p img[align=right] {margin-top: 10px; margin-bottom: 10px;}
.content p img[align=left] {margin-right: 10px;}
.content p img[align=right] {margin-left: 10px;}
.content .figure {margin-bottom: 10px;}
.content .figure img {display: block; margin: 0 auto; width: 100%; max-width: 520px;}

#content-1 h2 em {background-color: #daf1e6; color: #153727;}
#content-2 h2 em {background-color: #dae6f1; color: #152737;}
#content-3 h2 em {background-color: #f1dae6; color: #371527;}
#content-4 h2 em {background-color: #f1e0da; color: #371e15;}
#content-5 h2 em {background-color: #ebdaf1; color: #2e1537;}

.prod {margin: 0 5px; position: relative;}
.prod-head, .prod-foot {width: 100%; height: 45px; background-repeat: no-repeat; position: absolute; left: 0;}
.prod-head {background-image: url(../images/frame_01.gif); top: 0;}
.prod-foot {background-image: url(../images/frame_03.gif); bottom: 0;}

.menu-prod {display: block; margin: 0 auto; width: 90%; position: relative;}
.menu-prod li {display: block; float: left; width: 30%;}
.menu-prod a {display: block; margin: 0 auto; width: 100%; max-width: 90px; position: relative; cursor: pointer;}
.menu-prod a img {width: 100%; border: none;}
.menu-prod a img.hover {visibility: hidden; position: absolute; top: 0; left: 0;}
.menu-prod a:hover img.hover {visibility: visible;}
.menu-prod a.current {cursor: default;}

.hotline {width: 94%; height: 1px; margin: 0px auto; background: url(../images/line.gif) center bottom repeat-x;}
