
body {
    margin: 0;
    font-family: "微軟正黑體", "Microsoft JhengHei", "黑體-繁", "STHeiti Light", "蘋果儷中黑", "Apple LiGothic Medium";
    font-size: 15px;
    line-height: 1.8em;
    position: relative;
    min-width: 320px;
    overflow-x: hidden;
    margin-top: 32px;
    
}
h1, h2, h3, h4, h5, h6 {
    font-family: "微軟正黑體", "Microsoft JhengHei", "黑體-繁", "STHeiti Light", "蘋果儷中黑", "Apple LiGothic Medium";
    line-height: 1.8em;
}
footer{
    background: #54c4d0;
    padding:0;
}
.navbar-default{
    background: #fff;
    border-bottom: 1px solid #dc4675;
}
.navbar-default .navbar-brand{
    font-family: "微軟正黑體", "Microsoft JhengHei", "黑體-繁", "STHeiti Light", "蘋果儷中黑", "Apple LiGothic Medium";
}
.navbar-default .nav li a{
    font-family: "微軟正黑體", "Microsoft JhengHei", "黑體-繁", "STHeiti Light", "蘋果儷中黑", "Apple LiGothic Medium";
}

.navbar-default .navbar-nav > .active > a {
    background-color: transparent;
    color: #dc4675;
}
.navbar-default.navbar-shrink {
    background-color: #fff;
    padding: 10px 0;
}
.navbar-brand{
    padding: 0 15px;
}
.navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color: transparent;
}
.navbar-default .nav li a{
    color: #dc4675;
}
.navbar-default .nav li a:hover, .navbar-default .nav li a:focus {
    color: #fff;
    background: #dc4675;
}
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #fff;
    background-color: #dc4675
}
.navbar-fixed-top {
    padding-top: 50px;
}
.section_title{
    background: url("/wp-content/themes/voice-child/mmcApp/appIntroduction/img/title_bar.png") repeat-x;
    width: 100%;
    height: 52px;
    text-align: center;
}
.row{
    position: relative;
    margin: 0 20px;
}

.area{
    padding: 5px 0 0 0;
    margin-bottom: 50px;
}



.btn-danger {
    color: #fff;
    background-color: #ea6c94;
    border-color: #f583a7;
    text-transform: uppercase;
    font-weight: 700
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
    color: #fff;
/*    background-color: #fec503;
    border-color: #f6bf01*/
}

.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
    background-image: none
}

.btn-danger.disabled,
.btn-danger[disabled],
fieldset[disabled] .btn-danger,
.btn-danger.disabled:hover,
.btn-danger[disabled]:hover,
fieldset[disabled] .btn-danger:hover,
.btn-danger.disabled:focus,
.btn-danger[disabled]:focus,
fieldset[disabled] .btn-danger:focus,
.btn-danger.disabled:active,
.btn-danger[disabled]:active,
fieldset[disabled] .btn-danger:active,
.btn-danger.disabled.active,
.btn-danger[disabled].active,
fieldset[disabled] .btn-danger.active {
    background-color: #bc2454;
    border-color: #f583a7;
}

.btn-danger .badge {
    color: #bc2454;
    background-color: #fff
}

.btn-info {
  color: #fff;
    background-color: #dc4675;
    border-color: #f583a7;
}
.btn-info:focus,
.btn-info.focus {
  color: #fff;
    background-color: #bc2454;
    border-color: #f583a7;
}
.btn-info:hover {
  color: #fff;
    background-color: #bc2454;
    border-color: #f583a7;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color: #fff;
    background-color: #bc2454;
    border-color: #f583a7;
}
.btn-info:active:hover,
.btn-info.active:hover,
.open > .dropdown-toggle.btn-info:hover,
.btn-info:active:focus,
.btn-info.active:focus,
.open > .dropdown-toggle.btn-info:focus,
.btn-info:active.focus,
.btn-info.active.focus,
.open > .dropdown-toggle.btn-info.focus {
  color: #fff;
    background-color: #bc2454;
    border-color: #f583a7;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  background-image: none;
}
.btn-info.disabled:hover,
.btn-info[disabled]:hover,
fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus,
.btn-info[disabled]:focus,
fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus,
.btn-info[disabled].focus,
fieldset[disabled] .btn-info.focus {
    background-color: #bc2454;
    border-color: #f583a7;
}
.btn-info .badge {
  color: #5bc0de;
  background-color: #fff;
}
.img-responsive{
    display: inline-block;
}
/*about*/
.about_area{
   padding-bottom:50px;
   padding-top:100px; 
}
.about_area h4{
    font-weight: 500;
    padding: 10px;
}
.introd{
    margin-top: 30px;
}
.about_area .col-md-3{
   border-right: 2px solid #dc4675;
    height: 320px;
}
.about_area .col-md-3 p{
    width: 200px;
    text-align: justify;
    margin: 0 auto;
    padding: 15px 0;
    font-size: 18px;
    
}
.about_area .col-md-3 img{
    max-width: 86px;
}
/*active*/
#active{
    background: url("/wp-content/themes/voice-child/mmcApp/appIntroduction/img/bg.png") repeat-y center center;
}
.link_area{
    clear: both;
    overflow: hidden;
    margin: 0 auto;
    text-align: center;
    padding: 0 45px;
    width: 600px;
}
.link_area > *{
    float: left;
    padding: 15px;
}
a.qrcode{
    display: block;
}
.download_area{
    margin-bottom: 10px;
}
.download_area a{
    padding: 5px 0;
}
.index_main{
    background: url("/wp-content/themes/voice-child/mmcApp/appIntroduction/img/index_main.png");
    width: 952px;
    height: 543px;
    margin: 0 auto;
    position: relative;
}
.index_main a{
    position: absolute;
    bottom:35%;
    left:50%;
}


/*active_text*/
.active_text_area{
    padding: 10px 0 50px 0; 
}

.active_text_area h3 , h4{
   color: #dc4675;  
}
.active_text_area p{
    font-size: 16px;
}
.active_text_area ins{
    color: #54C4D0;
}
.active_text_area span{
    color: #dc4675; 
}

/*howto_area*/
.howto_area{
    padding: 10px 0 50px 0;
}
.howto_area .row{
    position: relative;
}
.title_b{
    font-size: 2.5em;
    background: #FFF;
    padding: 10px;
    width: 250px;
    left: 17%;
    height: 52px;
    font-weight: 700;
    color: #dc4675;
    text-align: center;
    position: relative;
    
}
.howto01{
    margin-top: 100px;
}
.howto01 .col-md-4 img{
    width: 224px;
}
.lazyowl{
    
}
.owl-step .lazyowl{
    width: 150px;
}
.owl-step .item p{
    width: 150px;
    /*text-align: center;*/
    margin: 0 auto;
    height: 100px;
}
.row h2{
    color: #dc4675;
}
span.blue{
    color: #2E93D8;
}
.owl-pagination {
    display: none;
}
/*.owl-prev{
    background: url("/wp-content/themes/voice-child/mmcApp/appIntroduction/img/arrow_left.png") no-repeat;
    width: 57px;
    height: 111px; 
}*/
.howto_area .item p b{
    color: #dc4675;
}
.customNavigation{
    
}
.customNavigation a{
    position: absolute;
    display: block;
    top:250px;
}
.customNavigation a.prev{
    left:-25px;    
}
.customNavigation a.next{
    right:0;    
}

/*exchange*/
.thumbnail{
    text-align: center;
    border: none;
}
.thumbnail h3{
    color: #54c4d0;
}
.thumbnail p{
    font-size: 16px;
}
.thumbnail h3 span{
    color: #ca4687;
    font-weight: 700;
    font-size: 1.5em;
}
.exchange_area{
    padding: 10px 0 50px 0;
}
/*shourtcut*/
.shortcut_area {
    padding: 10px 0 50px 0;
}
.shortcut_area h4 {
    color: #DC4675;
}
.shortcut_area h4 ins{
    color: #1772b7;
}
.station_map{
    background: url("/wp-content/themes/voice-child/mmcApp/appIntroduction/img/map.png");
    width: 720px;
    height: 275px;
    position: relative;
    margin: 0 auto;
}
.station_map a img{
    width: 105px;
}
.station_map a{
    position: absolute;
    opacity: 0.9;
}
.station_map a:hover{
    opacity: 1.0;
}
.station_map a.sta01{
    top: 100px;
    left: 60px;
}
.station_map a.sta02{
    top: 75px;
    left: 150px;
}
.station_map a.sta03{
    top: 75px;
    left:316px;
}
.station_map a.sta04{
    top: 75px;
    left:437px;
}
/*QA*/
.qa_area {
    padding: 10px 0 50px 0;
}
blockquote h4{
    font-weight: 500;
}
blockquote b{
    color: #dc4675;
    font-weight: 700;
}

@media (min-width:768px) {
    section {
        padding: 0;
    }
}

@media (max-width:768px) {
    section {
        padding: 15px 0;
    }
    .area{
        padding: 0px 0 0 0;
        margin-bottom: 0px;
    }
    .customNavigation a{
        position: absolute;
        display: block;
        top:57%;
    }
    .customNavigation a.prev{
        left:0;    
    }
    .customNavigation a.next{
        right:0;    
    }
    .row h2{
        text-align: center;
    }
    .howto02, .howto03{
        position: relative;
    }
    .m_text{
        margin: 0 15px;
    }
    .howto01{
        margin-top: 0;
    }
    .howto_area {
        padding: 0px 0 0 0;
    }
    .carousel-inner > .item > a > img, .carousel-inner > .item > img, .img-responsive, .thumbnail a > img, .thumbnail > img {
        display: inline-block;
        max-width: 100%;
        height: auto;
    }
    .link_area > * {
        float: none;
    }
    .thumbnail small{
        display: block;
    }
    .station_map{
        background: transparent;
        width: 100%;
        height: 100%;

    }
    .station_map a img{
        width: auto;
    }
    .station_map a{
        position: relative;
        opacity: 1.0;
        
    }
    .station_map a:hover{
        opacity: 1.0;
    }
    .station_map a.sta01{
        top: auto;
        left: auto;
    }
    .station_map a.sta02{
        top: auto;
        left: auto;
    }
    .station_map a.sta03{
        top: auto;
        left: auto;
    }
    .station_map a.sta04{
         top: auto;
        left: auto;
    }
    .link_area{
        width: 100%;
    }
    .about_area{
        padding-top: 40px;
    }
    .about_area .col-md-3 {
        border-right: none;
    }
    .navbar-default.navbar-shrink {
        background-color: #fff;
        /*padding: 30px 0 10px 0;*/
    }
    .title_b {
        font-size: 1.5em;
        margin: 0 auto;
        left: initial;

    }
    .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header{
        margin-left: 0;
        margin-right: 0;
    }
    .download_area a{
       display: block;
    }
}
/*@media screen and (max-width:800px){
    body{
        font-size: 30.5px;
    }
}*/
@media screen and (max-width: 640px) {
    body {
        font-size: 28.1px;
    }
    .navbar-fixed-top {
        padding-top: 32px;
    }
}
@media screen and (max-width: 568px) {
    body {
        font-size: 26.6px;
    }
}
@media screen and (max-width: 520px) {
    body {
        font-size: 24px;
    }
}
@media screen and (max-width: 480px) {
    body {
        font-size: 22.5px;
    }
}
@media screen and (max-width: 450px) {
    body {
        font-size: 20px;
    }
}
@media screen and (max-width: 400px) {
    body {
        font-size: 18px;
    }
}
@media screen and (max-width: 360px) {
    body {
        font-size: 15.5px;
    }
}
@media screen and (max-width: 320px) {
    body {
        font-size: 15px;
    }
}


/* MMC-Footer */

.site-footer{
    width: 100%;
    float: left;
    padding: 0;
    -moz-box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20);
}
.site-footer [class*='bit-']{
    margin-top: 20px;
}
.site-info{
    background: rgba(0,0,0,0.35);
    padding: 15px 0;
}
.site-info p{
    margin-bottom: 0;
    font-size: 13px;
}
.site-info .container{
    display: table;
    width: 100%;
}
.site-info .container > div{
    display: table-cell;
    width: auto;
}
.bottom-nav-menu li{
    list-style: none;
    position: relative;
    float: left;
    margin: 0 10px 0 0;
}
.bottom-nav-menu li:last-child{
    margin: 0;
}
.bottom-nav-menu a{
    font-size: 13px;
}
.bottom-nav-menu{
    margin: 0;
    padding: 0;
}
.site-info .bottom-nav-menu .sub-menu{
    background: rgba(0,0,0,0.35);
    display: none;
    position: absolute;
    bottom: 100%;
    left: 0;
    margin: 0;
    padding: 10px;
}
.site-info .bottom-nav-menu .sub-menu li{
    float: left;
    display: block;
    width: 200px;
}
.site-info .bottom-nav-menu li:hover .sub-menu{
    display: block;
}

.container {
  margin: 0 auto;
  max-width: 1140px;
}
.container-full{
    width: 100%;
}
.container-fix{margin: 0 -15px;}


/* Clearfix */
.container:after {
  content: "";
  display: table;
  clear: both;
}


/* Attribute selector */
[class*='bit-'] {
  float: left;
  padding: 15px;
}

/* Floats last ".bit-" to the right */
[class*='bit-']:last-of-type {
  float: right;
}

/* Main Widths */
.bit-1  { width: 100%; }
.bit-2  { width: 50%; }
.bit-3  { width: 33.33%; }
.bit-4  { width: 25%; }
.bit-5  { width: 20%; }
.bit-6  { width: 16.6666666667%; }
.bit-7  { width: 14.2857142857%; }
.bit-8  { width: 12.5%; }
.bit-9  { width: 11.1111111111%; }
.bit-10 { width: 10%; }
.bit-11 { width: 9.09090909091%; }
.bit-12 { width: 8.33%; }

.bit-23{
    width: 66.66%;
}

.sidebar{
    width: 300px;
    float: left;
    padding-top: 15px;
}
.vce-sid-left .sidebar{
    float: left;
    padding-top: 15px;
}
.vce-main-content{
    float: left;
    width: 840px;
    padding: 15px 30px 0 0;
}
.vce-sid-left .vce-main-content{
    padding:  15px 0 15px 30px;
}
.vce-sid-none .vce-main-content{
    padding: 15px 0 0;
}
.bit-no-top-bottom{
    padding: 0;
}

.site-footer .widget-title{
    font-size: 18px;
    color: #FFF;
    line-height: 24px;
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(0,0,0,0.2);
    padding-bottom: 15px;
    text-align: center;
    margin: 0 -20px 20px;
    background: rgba(0,0,0,0.15);
    padding-top: 14px;
}
.site-footer .widget.mks_author_widget img{
    margin: 10px auto 0 auto;
}
#footer.site-footer .mks_autor_link_wrap,
#footer.site-footer p.mks_read_more{
    padding: 10px 20px 10px;
    margin: 20px -20px -20px;
    border-top: 1px solid rgba(0,0,0,0.2);
    background: rgba(0,0,0,0.1);
}
.site-footer .widget{
    color: #FFF;
    margin-bottom: 30px;
    background: rgba(0,0,0,0.2);
    padding: 0 20px 15px 20px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,0.1);
    font-size: 14px;
    line-height: 22px;
}
.site-footer [class*='bit-'] .widget:last-child{
    margin-bottom: 15px;
}
.site-footer .widget > ul, 
.site-footer .widget > div, 
.site-footer .widget p{
    padding: 0;

}
.site-footer .widget li a{
    -webkit-transition: all .1s linear;
       -moz-transition: all .1s linear;
        -ms-transition: all .1s linear;
         -o-transition: all .1s linear;
            transition: all .1s linear;
    color: #FFF;
}
.site-footer .widget li{
    border-bottom: none;
    padding: 5px 0 5px;
}
.site-footer .vce_posts_widget .vce-post-list li{
    padding: 0; 
}
.site-footer .widget_categories li{
    padding: 0;
}
.site-footer .widget_categories li a:hover{
    text-decoration: none;
}
.site-footer .tagcloud a{
    background: rgba(0,0,0,0.09);
}
.site-footer .vce-search-form{
    padding: 0;
}
.site-footer table{
    background: transparent;
    color: #FFF;
    border-color: #333;
}
.site-footer td{
    border-color: #333;
}
.site-footer #wp-calendar tbody td:hover {
    background: rgba(0,0,0,0.5);
    box-shadow: -1px -1px 1px rgba(0,0,0,0.1);
}
.site-footer #wp-calendar caption,
.site-footer .mks_author_widget h3 {
    color: #FFF;
}
.site-footer .widget_nav_menu li a, 
.site-footer  .widget_pages li a{
    padding: 0;
}
.site-footer .widget.mks_social_widget{
    padding: 0 20px 12px 20px;
}
.comment-content a {
    word-wrap: break-word;
}

.bypostauthor {
    display: block;
}

.page-content img.wp-smiley,
.entry-content img.wp-smiley,
.comment-content img.wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

embed,
iframe,
object {
    max-width: 100%;
}
.widget embed,
.widget iframe,
.widget object{
    vertical-align: middle;
}

/**/
.site-footer {
    background: #d28ea0;
}

footer#footer *{
    font-weight: 300;
}

#footer .container .widget .widget-title{
    padding: 10px;
}
#footer .container .container-fix div:first-child .widget .fb-page.fb_iframe_widget{
    margin: 3px 0 7px 0;
}
#footer .container .widget.widget_categories{
    display: none;
    visibility: hidden;
}
#footer .container .container-fix .bit-3:first-child{
    display: none;
    visibility: hidden;
}
#footer .container .container-fix .bit-3{
    margin: 10px 0 0;
}
#footer .container .container-fix .bit-3:first-child{
    display: block;
    visibility: visible;
}
#footer .container .container-fix .bit-3:last-child{
    margin: 10px 0 10px;
}
#footer .container .container-fix div:first-child .widget{
    text-align: center;
}
#footer .menu a:hover{
    color: #ffdddd;
}

#menu-mmc_footer li:first-child{
    padding-top: 0;
}
#menu-mmc_footer li:last-child{
    padding-bottom: 0;
}

.site-footer .widget li{
    padding: 3px 0;
    list-style: none;
    width: 100%;
    text-align: left;
}
.site-footer .widget li{


}
.site-footer .widget{
    padding: 0 20px 20px;
}

.site-footer .widget li a:hover, .site-footer .widget a, .site-info a {
    color: #dc4776;
}
.footer-btn:hover {
    border-top-color: #e3e3e3;
    background: #d4d2d4;
}
.footer-btn {
   border-top: 1px solid #ffffff;
   background: #b8b8b8;
   background: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#b8b8b8));
   background: -webkit-linear-gradient(top, #f7f7f7, #b8b8b8);
   background: -moz-linear-gradient(top, #f7f7f7, #b8b8b8);
   background: -ms-linear-gradient(top, #f7f7f7, #b8b8b8);
   background: -o-linear-gradient(top, #f7f7f7, #b8b8b8);
   padding: 6.5px 9px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   border-radius: 4px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   color: #ff8caf;
   font-size: 14px;
   text-decoration: none;
   vertical-align: middle;
}
.footer-btn:hover {
   border-top-color: #e3e3e3;
   background: #d4d2d4;
   color: #d4d2d4;
}
.footer-btn:active {
   border-top-color: #e0e0e0;
   background: #e0e0e0;
}

.site-footer, .site-footer .widget, .site-footer .widget li a, .site-footer .mks_author_widget h3 a, .site-footer .mks_author_widget h3, .site-footer .vce-search-form .vce-search-input, .site-footer .vce-search-form .vce-search-input:focus {
    color: #f9f9f9;
    line-height: 22px;
}

.site-footer .widget > ul, .site-footer .widget > div, .site-footer .widget p {
    padding: 0;
}

@media only screen and (max-width: 350px) and (min-width: 200px){
    #footer .container .container-fix .bit-3:first-child .widget{
        padding: 0 10px 10px 10px;
    }
    #footer .container .container-fix .bit-3:first-child .widget .widget-title{
        padding: 10px;
        margin: 0 -10px 10px;
    }
    #sidebar .widget.vce_posts_widget.MMC_Ranking_Widget .vce-post-list .vce-posts-wrap.top_author .vce-post-link.custom-widget-link{
        max-width: 130px !important;
    }
}

@media only screen and (max-width: 550px){
    #footer .container .container-fix .bit-3{
        margin-top: 10px;
        margin-bottom: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        width: 100%;
    }
    .site-footer [class*='bit-'] .widget:last-child{
        margin-bottom: 0;
    }
    #lineat_pc, .download_area_footer{display:none;}
    .download_area{
        margin-bottom: 5px;
    }
}

@media only screen and (max-width: 1100px){
    #footer_btn_2, #footer_btn_1{
        font-size: 13px;
    }

}

@media only screen and (max-width: 995px) and (min-width: 500px){
    #footer_btn_2, #footer_btn_1{
        font-size: 13px;
        display: block;
        width: 100%;
        margin-bottom: 10px;
    }
    #lineat_pc, .download_area_footer{display:none;}
    .download_area{
        margin-bottom: 5px;
    }
}
/* Site Footer END */