@charset "big5";
/* CSS Document */

/*虎航動畫*/
@keyframes bgchange {from {background:darkorange;} to {background:#F60;}}


body {margin: 0;}
h1 {margin: 0; padding: 0; height: 0; text-indent: 100%; white-space: nowrap; overflow: hidden; _display: none;}
.index {background: url(../images/index_bg1.gif) center top repeat-x #000000;}
.design {background: url(../images/index_bg0.gif) center top repeat-y;}

.top-normal {height: 500px; background: url(../images/top.jpg) center no-repeat;}
.top-mobile {display: none; padding-top: 40px; background-color: #124f2b;}
.top-mobile img {display: block; width: 100%;}

/* .main {background: url(../images/index_bg.jpg) center top no-repeat;} */
.containter {margin: 0 auto; width: 960px;}

.aside {padding: 10px 0; width: 420px; float: right; background-color: #ffffff; border-radius: 10px;}
.article {width: 520px; float: left;}
.footer {height: 10px; clear: both;}

.menu-top {height: 50px; background: url(../images/menu-top.png) center center no-repeat; _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/menu-top.png', sizingMethod='crop');}
.menu-top-mb {display: none; background: url(../images/index_bg.jpg) center top no-repeat;}
.menu-top-mb img {display: block; padding: 10px 0; width: 100%;}
.menu-bottom {height: 15px; border-top: solid 2px #9966cc; clear: both;}

#menu a {display: block; margin-top: 8px; padding: 4px 0; width: 24%; *width:23.5%; _width:21.5%; background-color: #401a66; color: #ccc0cc; font-size: 18px; line-height: 21px; letter-spacing: 2px; font-weight: bold; text-align: center; border: solid 1px #663399; border-bottom: none; float: left; cursor: pointer; white-space: nowrap; box-sizing: border-box; background: linear-gradient(#661a99, #2c0b41); text-shadow: 2px 2px 5px #000000;}
#menu a.current, #menu a:hover {margin-top: 0; padding: 8px 0; background-color: #9225da; color: #ffffff; font-size: 21px; background: repeating-linear-gradient(#9225da, #661a99 60%);}
#menu a.current {cursor: default;}
#menu-1, #menu-3 {margin-left: 1%; border-radius: 10px 0 0 0;}
#menu-2, #menu-4 {margin-right: 1%; border-radius: 0 10px 0 0;}

#content-2, #content-3, #content-4 {display: none;}

.article p {margin: 0 18px 20px; color: #ffffff; font-size: 13px; line-height: 22px; letter-spacing: 1px; text-align: justify;}
.article h2 {margin: 0px; padding: 0; background: url(../images/title.gif) center top no-repeat; color:#ffffff; font-size: 18px; line-height: 40px; letter-spacing: 3px; font-family: Arial, Helvetica, sans-serif; text-align: center;}
.article h2.big {font-size: 21px; letter-spacing: 9px;}
.article h2 img {margin: 3px 5px; vertical-align: middle;}
.article .figure {margin: 0 15px; padding-bottom: 30px;}
.article .figure img {display: block; margin: 0 auto; width: 100%; *width: auto; max-width: 486px;}

a.ticket:link, a.ticket:active, a.ticket:visited{display: block; width: 100%; background: #0066CC; color: #ffffff; text-align: center;}
a.ticket:hover {background:#33ffff; color:#000000;}

.menu-prod {margin: 0 auto; width: 400px; position:relative;}
.menu-prod a {display: block; width: 25%; float: left; position: relative;left: 50px}
.menu-prod a img {margin: 0 auto; width: 100%; /*max-width: 100px;*/ border: none;}
.menu-prod a img.hover {position: absolute; top: 0; left: 0; visibility: hidden;}
.menu-prod a:hover img.hover {visibility: visible;}

.link {padding-top: 10px; padding-bottom: 10px; padding-right: 15px; text-align: right;}
.link a {display: inline-block; background-color: #995533; border-radius: 15px 0px 0px 15px;}
.link a:hover {background-color: #ff00ff;}
.link div {padding: 6px; color: #ffffff; font-size:18px; letter-spacing: 1px; font-weight:bold; font-family:'微軟正黑體';}
@keyframes arrowanime{from {left: 0px;} to {left: 5px;}}
.link i{padding-left: 5px; padding-right: 8px; position: relative; animation: arrowanime 0.2s linear 0s infinite alternate;}

.hotline {width: 94%; height: 1px; margin: 0px auto; background: url(../images/line.gif) center bottom repeat-x;}