@charset "big5";
/* CSS Document */
@font-face {
  font-family:"MicrosoftJhengHei";
  font-style:normal;
  font-weight:normal;
  src:local("Microsoft JhengHei"),
      local("MSJHBD.ttf");
}
@font-face {
  font-family:"MicrosoftJhengHeiBold";
  font-style:normal;
  font-weight:bold;
  src:local("Microsoft JhengHei"),
      local("MSJHBD.ttf");
}
@font-face {
  font-family:"SimHei";
  font-style:normal;
  font-weight:normal;
  src:local("SimHei"),
      local("SimHei.ttc");
}
@font-face {
  font-family:"SimHeiBold";
  font-style:normal;
  font-weight:bold;
  src:local("SimHei"),
      local("SimHei.ttc");
}

body {margin:0px;}
h1{margin:0; padding:0; height:0; text-indent:100%; white-space:nowrap; overflow:hidden;}

#design{background-color:#440000;}
#container{margin:0px auto; width:980px; background-color:#CC4422; box-shadow:0px 0px 15px #000000;}
#container #top img,#container #top-mobile img{display:block; width:100%;}
#container #top-mobile{display:none;}

#container #left{width:520px; float:left; margin:5px 0 0 5px;}
#container #right{width:440px; float:right; margin:5px 5px 0 0; padding:5px 0;}
#container #left,#container #right{background-color:#FFFFFF; border-radius:10px; box-shadow:2px 2px 3px #660000;}
#container #bottom{height:5px; clear:both;}

#jump{display:none; clear:both;}
#jump div{padding:10px 0; background-color:#FFFFFF; color:#CC0000; font-size:21px; font-weight:bold; letter-spacing:1px; text-align:center;}
#jump b{font-size:45px; font-weight:normal; position:relative; top:8px;}

#container #menu{width:530px; height:40px; position:absolute; top:305px; text-align:center;}
#container #menu a{display:inline-block; margin:0 3px; padding:5px 8px 1px; font-size:24px; line-height:24px; font-family:"MicrosoftJhengHeiBold","SimHeiBold"; position:relative; border-right:solid 1px; border-radius:5px 5px 0 0;}
#container #menu a.tag{height:24px; top:10px; cursor:pointer;}
#menu-1 a.tag{background-color:#FFCCE6; color:#CC0066;}
#menu-2 a.tag{background-color:#E6FFE6; color:#006600;}
#menu-3 a.tag{background-color:#CCDDFF; color:#003399;}
#menu-4 a.tag{background-color:#FFCCCC; color:#990000;}
@keyframes menu_hover{from{height:24px; top:10px;} to{height:34px; top:0px;}}
#container #menu a.tag:hover,#container #menu a.selected{height:34px; top:0px; color:#FFFFFF; border-right-color:#000000; text-shadow:1px 1px 0 #000000;}
#container #menu a.tag:hover{animation:menu_hover 0.1s linear;}
#menu-1 a.tag:hover,#menu-1 a.selected{background-color:#CC0066;}
#menu-2 a.tag:hover,#menu-2 a.selected{background-color:#006600;}
#menu-3 a.tag:hover,#menu-3 a.selected{background-color:#003399;}
#menu-4 a.tag:hover,#menu-4 a.selected{background-color:#990000;}

#left h2{margin:10px 5px 0; padding:5px; color:#FFFFFF; font-size:18px; line-height:18px; letter-spacing:1px; font-family:Verdana, Geneva, sans-serif,"MicrosoftJhengHeiBold","SimHeiBold"; border-radius:6px 0px 0px 0px; background:url(../images/title.png) right bottom no-repeat; _background:none; clear:both;}
#left p{margin:5px 10px 10px; padding:0; font-size:13px; line-height:20px; letter-spacing:1px; text-align:left; text-align:justify;}

#section-1 h2{background-color:#CC0066;}
#section-2 h2{background-color:#006600;}
#section-3 h2{background-color:#003399;}
#section-4 h2{background-color:#990000;}

.head{margin:5px 5px 0; padding-bottom:5px; border-bottom:solid 2px #990000; color:#990000; font-size:22px; font-family:"MicrosoftJhengHeiBold","SimHeiBold"; position:relative; top:5px;}
.memo{color:#999999;}

.image{margin-top:5px; margin-left:10px; margin-right:5px; width:280px; height:180px; float:right;}
.image img{display:block; border-radius:5px;}
.image .content{width:240px; height:180px; float:left; position:relative; overflow:hidden; border-radius:5px;}
.image .content i{position:absolute;}
.image .thumbnail{width:39px; float:right;}
.image .thumbnail img{margin-bottom:8px; cursor:pointer;}

.mobile-gallery{display:none; position:relative; overflow:hidden;}
.mobile-gallery img{width:80%; position:absolute; top:0;}
.mobile-gallery .gal-l img{left:-70%;}
.mobile-gallery .gal-m img{left:10%;}
.mobile-gallery .gal-r img{left:90%;}
.mobile-gallery .i-text{width:100%; padding:3px 0 5px; background:#000000; background:linear-gradient(to right,rgba(0,0,0,0),rgba(0,0,0,0.8) 25%,rgba(0,0,0,0.8) 75%,rgba(0,0,0,0)); color:#FFFFFF; font-size:16px; letter-spacing:1px; text-align:center; position:absolute; bottom:0; z-index:1;}
.mobile-gallery .button-l,.mobile-gallery .button-r{opacity:0.7; position:absolute; z-index:1;}
.mobile-gallery .button-l{left:5px;}
.mobile-gallery .button-r{right:5px;}
.mobile-gallery .content{display:none;}

#menuR,#menuR-sub{text-align:center;}
#menuR a{display:inline-block; position:relative; width:32%; max-width:120px; _width:120px; text-align:center;}
#menuR a img{display:block; border:none; width:100%;}
#menuR a img.hover{position:absolute; top:0; left:0; visibility:hidden;}
#menuR a:hover img.hover{visibility:visible;}
#menuR-sub a{display:inline-block; margin:10px; padding:0px 5px; background:lightpink; color:black; font-size:15px; line-height:25px; text-align:center; font-family:"MicrosoftJhengHei","SimHei"}
#menuR-sub a:hover,#menuR-sub .selected{background:mediumvioletred; color:white;}

#conrt_secd a {display:inline-block; margin:10px 4px; padding:0px 5px; background:lightpink; color:#600000; font-size:14px; line-height:25px; text-align:center; font-family:·L³n¥¿¶ÂÅé;}
#conrt_secd a:hover {background:#600000; color:white;}
#conrt_secd .slect {background:#600000; color:white; cursor:default;}



.hotline{width:94%; height:1px; margin:0px auto; background:url(../images/line.gif) center bottom repeat-x;}
