@charset "utf-8";
.banner .slogan .title { margin: 30px 0 36px; }
.banner .slogan p.slogan-s { font-size: 24px; text-transform: uppercase; }
@media (max-width: 1440px) {
  .banner .slogan { max-width: 860px; padding: 0 30px; top: 60%; }
}
@media (max-width: 768px) {
  .banner .slogan p.slogan-s { display: none; }
  .banner .slogan .title { margin: 12px auto; }
}
@media (max-width: 414px) {
  .banner .slogan { top: 65%; width: 100%; padding: 0 10px; }
  .banner .slogan p { font-size: 18px; }
  .banner .slogan .title { font-size: 30px; }
}
@media (max-width: 359px) {
  .banner .slogan { width: 80%; }
}
.idx-title { font-family: "Roboto Bold Condensed", "微軟正黑體", "Microsoft JhengHei", sans-serif; font-size: 36px; margin-bottom: 12px; }
.idx-title img { width: 24px; height: 36px; margin-top: -6px; margin-right: 12px; } 
.idx-img { margin-bottom: 24px; }
/*.more a { font-size: 18px; font-family: "Roboto Condensed", "微軟正黑體", "Microsoft JhengHei", sans-serif; background: #000000; color: #ffffff; display: inline-block; padding: 8px 18px; }*/

.more a { font-family: "Roboto Condensed", "微軟正黑體", "Microsoft JhengHei", sans-serif; padding: 8px 24px; background: transparent; outline: none; transition: all 0.3s ease; position: relative; display: inline-block; }
.more a { border: 2px solid #000; z-index: 1; }
.more a:after { content: ""; position: absolute; width: 0; height: 100%; top: 0; right: 0; z-index: -1; background: #000; transition: all 0.3s ease; }
.more a:hover { color: #fff; }
.more a:hover:after { left: 0; width: 100%; }

.content { padding-top: 30px; margin-bottom: 72px; }
/** idx pro **/
.idx-pro { margin-bottom: 50px; }
.idx-pro ul { padding-top: 12px; padding-left: 0; margin: 12px 0 0; list-style: none; position: relative; overflow: hidden; }
.idx-pro ul::before { content: ""; background: #f5f6f7; border-top: #d7d8d9 1px solid; border-bottom: #d7d8d9 1px solid; display: block; height: 80%; width: 100%;  position: absolute; bottom: 0; }
.idx-pro ul::after { content: ""; display: table; clear: both; }
.idx-pro li { width: 18%; margin: 0 1%; float: left; text-align: center; position: relative; font-family: "Roboto Bold Condensed", "微軟正黑體", "Microsoft JhengHei", sans-serif; }
.idx-pro li .idx-pro-item { padding: 30px 0 12px; transition: all 0.4s ease; }
.idx-pro li.active .idx-pro-item, .idx-pro li:hover .idx-pro-item { background: #ffffff; box-shadow: 0px -2px 8px 0px rgba(0, 0, 0, 0.2); padding: 18px 0 24px; }
.idx-pro li .idx-pro-link { opacity: 0; transition: all 0.4s ease; }
.idx-pro li .idx-pro-link img { height: 14px; margin-top: -2px; }
.idx-pro li.active .idx-pro-link, .idx-pro li:hover .idx-pro-link { opacity: 1; }
.idx-pro li a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.idx-pro-link { font-size: 18px; margin-bottom: 18px; }
.idx-pro-name { font-size: 18px; }
.idx-pro:hover .title-effect { color: #d12326; }
.idx-pro:hover .title-effect::before { transform: scale3d(1, 1, 1); }
@media (max-width: 1023px) {
  .idx-pro ul::before { height: 100%; top: 0; }
  .idx-pro li { width: 30%; margin: 12px 1.6%; }
  .idx-pro li:nth-child(3n+1) { clear: both; }
  .idx-pro li.active .idx-pro-item, .idx-pro li:hover .idx-pro-item { box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2); }
}
@media (max-width: 768px) {
  .idx-pro li { width: 40%; margin: 12px 5%; }
  .idx-pro li:nth-child(3n+1) { clear: inherit; }
  .idx-pro li:nth-child(2n+1) { clear: both; }
}
@media (max-width: 480px) {
  .idx-pro ul::before { height: 100%; top: 0; }
  .idx-pro li { width: 90%; margin: 12px auto; float: none; }
}
/** idx com **/
.idx-com { margin-bottom: 50px; padding: 72px 0; border-top: #000 1px solid; border-bottom: #000 1px solid; }
.idx-com-left, .idx-com-right { width: 50%; float: left; }
.idx-com-right p { color: #4e4e4e; font-size: 18px; font-family: "Roboto Condensed", "微軟正黑體", "Microsoft JhengHei", sans-serif; line-height: 1.8; }
.idx-com-right:hover .title-effect { color: #d12326; }
.idx-com-right:hover .title-effect::before { transform: scale3d(1, 1, 1); }
@media (max-width: 1440px) {
  .idx-com-left, .idx-com-right { width: 48%; margin: 0 1%; }
}
@media (max-width: 1023px) {
  .idx-com-left { margin: 0 2% 0 0; }
  .idx-img { margin-bottom: 12px; }
  .idx-com-right { width: 100%; margin: 0; float: none; }
}
@media (max-width: 640px) {
  .idx-com-left { width: 100%; margin: 0; float: none; }
  .idx-img { margin-bottom: 24px; }
}
/** idx cata **/
.idx-cata { width: 50%; float: left; max-width: 665px; }
.idx-video { width: 50%; float: right; max-width: 665px; }
.idx-cata:hover .title-effect, .idx-video:hover .title-effect { color: #d12326; }
.idx-cata:hover .title-effect::before, .idx-video:hover .title-effect::before { transform: scale3d(1, 1, 1); }
@media (max-width: 1440px) {
  .idx-cata, .idx-video { width: 48%; margin: 0 1%; }
}
@media (max-width: 640px) {
  .idx-cata, .idx-video { width: 100%; margin: 0; float: none; }
  .idx-cata { margin-bottom: 30px; }
}