@charset "utf-8";
body{margin:0;padding:0;font-family:"微軟正黑體", Arial; background-color:#fff}
.style1 {color:#fff;letter-spacing:1px;padding:0%;font-weight:normal;text-shadow:none}
.style2 {color:#fff;letter-spacing:2px;padding:3%;font-weight:normal;text-shadow:none}
.style3 {letter-spacing:2px;color:#000;font-weight:normal;text-shadow:none;}
.style4 {padding-left:2.5%;letter-spacing:1px;font-weight:normal;text-shadow:none}
a:link{text-decoration:none;color:#000;letter-spacing:1px;font-size:0.85em;outline:none;text-shadow:none}
a:hover{text-decoration:none;color:#000;letter-spacing:1px;font-size:0.85em;outline:none;text-shadow:none}
a:visited{text-decoration:none;color:#000;letter-spacing:1px;font-size:0.85em;outline:none;text-shadow:none}
.style3 a:hover{text-decoration:none;color:#000;letter-spacing:2px;font-size:0.85em;outline:none;text-shadow:none;}
.style3 a:visited{text-decoration:none;color:#000;letter-spacing:2px;font-size:0.85em;outline:none;text-shadow:none;}
.text1{letter-spacing:2px;line-height:1.875;text-align:left;font-size:4em;color:#fff; font-weight:bold;padding:10px 0px 0px 15px;}
.text1:link{text-decoration:none;color:#fff}
.text1:hover{text-decoration:none;color:#fff}
.text1:visited{text-decoration:none;color:#fff}
/* This is to remove the arrow of select element in IE */
select::-ms-expand {	display: none; }
select{
    -webkit-appearance: none;
    appearance: none;
}
.ui-panel{width:17em;min-height:100%;max-height:none;border-width:0;position:absolute;top:0;display:block; background-color:#e63082}

/* Mobile Specific Styles */
.mobile-header {
  width: 100%;
  padding: 0;
}

.mobile-header-top {
  width: 100%;
  padding-top: 1%;
}

.mobile-logo {
  float: left;
  width: 75%;
}

.mobile-menu-button {
  float: right;
  width: 25%;
  padding-top: 20px;
}

.mobile-menu-button1 {
  float: right; 
}

.mobile-title-bar {
  width: 100%;
}
.mobile-title-bar1 {
 font-size:1.2em;
}

.mobile-title-table {
  width: 100%;
  border: 0;
  align: center;
  cellpadding: 0;
  cellspacing: 0;
}

.mobile-title-cell {
  width: 100%;
  align: center;
  valign: top;
  background-color: #555656;
}

.mobile-content {
  width: 100%;
  padding: 0;
  padding-top: 2%;
  font-size: 0.3em;
}

.mobile-content1 {
 padding-top:0.7%;padding-bottom:1.3%;
}

.mobile-warning {
  font-size: 3.3em;
  letter-spacing: 2px;
  color: red;
}

.mobile-video-container {
  width: 95%;
  padding-top: 3%;
  padding-left: 2.5%;
}

.mobile-video-container1 {
 width:100%;height:320px;
}

.mobile-video-list { 
  padding-top: 8%;
  padding-bottom: 1%;
  padding-left: 1%;
}

.mobile-video-item {
  padding-bottom: 5px;
}

.mobile-video-thumbnail {
  background-image: url(../images/kc-1.jpg);
  width: 200px;
  height: 180px;
}

.mobile-video-info {
  font-size: 3.4em; 
}

.mobile-video-info1 {
  font-size: 3.4em;
  padding-top: 12px;
}

.mobile-download-button {
  width: 18%;
}

.mobile-footer {
  width: 100%;
  padding: 0;
  font-size: 1em;
}

.mobile-footer-table {
  width: 100%;
  border: 0;
  align: center;
  cellpadding: 0;
  cellspacing: 0;
  background-color: #555656;
}

.mobile-panel {
  width: 17em;
  min-height: 100%;
  max-height: none;
  border-width: 0;
  position: absolute;
  top: 0;
  display: block;
  background-color: #e63082;
}

.mobile-iframe{
  width:100%;
  height:320px;
}

.mobile-download-img{
  width:18%;
}