/* CSS Document */
@import url(font-awesome/css/font-awesome.min.css);

body {	-webkit-text-size-adjust:100%; margin:0; text-align:center; font-family:"微軟正黑體", "Arial", sans-serif; font-size:15px; color:#000000; line-height:24px; letter-spacing:1px; background:url(../images/bg.jpg) no-repeat top center; background-attachment:fixed; background-size:cover; }
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; color:#000000;
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s; }
a:hover {	color:#000000; text-decoration:none; }

* { margin:0; padding:0; list-style:none;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

.main-Box, .top-Box, .menu-Box, .banner-Box, .content-Box, .content2-Box, .footer-Box, .copyright-Box { max-width:1300px; margin:0 auto; text-align:left; position:relative; clear:both;}

.after-0:after { clear:both; display:block; content:""; height:0; text-indent:-99999px;}
.after-5:after { clear:both; display:block; content:""; height:5px; text-indent:-99999px;}
.after-10:after { clear:both; display:block; content:""; height:10px; text-indent:-99999px;}
.after-15:after { clear:both; display:block; content:""; height:15px; text-indent:-99999px;}
.after-20:after { clear:both; display:block; content:""; height:20px; text-indent:-99999px;}


.menu-bg { display:inline-block; vertical-align:top; background:url(../images/idx-nav-bg.png) no-repeat; width:303px; height:745px; padding-left:14px; padding-top:65px;}
.idx-logo { padding-left:40px; padding-bottom:32px;}
.idx-logo-rwd { display:none;}
ul.menu { width:267px;}
ul.menu li { display:block; background:url(../images/nav-line-1.png) no-repeat bottom center;}
ul.menu li > a { display:block; padding:13px 0; text-align:center; color:#000000; font-size:18px; letter-spacing:10px; font-weight:bold;}
ul.menu li > a:hover { color:#fff; background:rgba(0,0,0,.75);}
ul.menu li a img:nth-of-type(2) { display:none;}
ul.menu li a:hover img:nth-of-type(2) { display:inline;}
ul.menu li a:hover img:nth-of-type(1) { display:none;}
.m_menu { display:none;}

.idx-link { display:inline-block; vertical-align:top; width:calc(100% - 303px - 7px); padding:161px 0 0 24px;}
.idx-link li { display:inline-block; vertical-align:top; width:calc(33.333% - 5px); background:url(../images/idx-line.png) no-repeat top right; background-size:contain; padding:0 12px;}
.idx-link li:last-child { background:none;}
.idx-link li img {
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s;}
.idx-link li img:hover { opacity:0.65;  filter: alpha(opacity=65);}



@media only screen and (max-width: 1100px) {
.menu-bg { display:block; background:none; padding:20px 0 0 10px; width:100%; height:inherit;}
.idx-logo { display:none;}
.idx-logo-rwd { display:inline-block; position:absolute; z-index:10000; width:135px;}
ul.menu{ display:none;}
.m_menu{ display:block; position:absolute; height:46px; overflow:hidden; z-index:9999; margin-bottom:10px; text-align:right; right:0; width:100%; border-bottom:0px solid rgba(255,255,255,.3); top:50px; }
.m_menu.active{ }
.m_menu a.main{ display:block; padding:0 15px; font-size:15px; color:#000; line-height:18px; font-family:Abel;  height:50px;  font-weight:bold;}
.m_menu a.main i{ font-style:normal; font-family:Abel, FontAwesome; padding-right:3px; display:inline-block; font-size:30px; padding-top:3px; font-weight:bold;}
.m_menu ul.nav{ background:rgba(255,255,255,.9); margin-top:0px; border-top:1px solid rgba(0,0,0,.1); }
.m_menu ul.nav li { text-align:left; font-family:Abel; font-weight:bold;}
.m_menu ul.nav li > a { color:#000; display:block; padding: 12px 16px; font-size:18px; border-bottom:1px solid rgba(0,0,0,.1); }
.m_menu ul.nav li a img:nth-of-type(2) { display:none;}
.m_menu ul.nav li > a:hover { color:#000; }

.idx-link { width:100%; padding:120px 0 0 0;}
}

@media only screen and (max-width: 768px) {

}
@media only screen and (max-width: 640px) {

}
@media only screen and (max-width: 570px) {

}

@media only screen and (max-width: 414px) {

}

@media only screen and (max-width: 320px) {
/*.idx-link li { width:100%; padding:0; text-align:center; background:none;}*/
}