/************************************************************************************
smaller than 1024
*************************************************************************************/
@media screen and (max-width: 1024px) {



#logoheader {
	padding: 0px 0px 0px 0px;
}

#hklogo {
	padding: 10px 0px 10px 15px;
}


#bblogo {
	padding: 10px 15px 10px 0px;
}



#titleheader {
	position: absolute;
    left: 15px;
    width: 750px;
}


#topcontent {
	position: absolute;
    left: 15px;
    width: 48%;
}

.titleinside {
	font-size: 56px;
	font-weight: bold;
	line-height: 100%;
}


.titlecontent {
	font-size: 26px;
	line-height: 130%;
}

#subtitleheader {
    width: 95%;
	margin: 0px 0px 0px 15px;
	
}

#subcontent {
    width: 95%;
	margin: 10px 0px 0px 15px;
}

#bulletpoint {
	margin: 0px 0px 0px 15px;
}

.bullet { 
	line-height: 120%;
	margin-left: 15px;
}

#share {
	text-align:left;
	margin-top: 20px;
	margin-left: 15px;
	margin-bottom: 50px;
	}

.hrline { width: 97% }

#tnc {
    width: 95%;
	margin: 10px 0px 60px 15px;
}

.tnccontent {
	font-size: 13px;
}



/************************************************************************************
FAQ
*************************************************************************************/
#butfaq1 { 
	font-size: 20px;	
}

.questiontext {
	font-size: 20px;
}

.faqchannel {
	font-size: 20px;
}	
	
#butxthomefaq { 
	font-size: 22px;
	
}

/************************************************************************************
PLAN MOB BUTTON
*************************************************************************************/
#butplanmob1 { 
	font-size: 20px;
	margin: 8px 7px 8px 7px;
}

.plantdbut {
	width:280px;
	}
	
	
.planmob_tdtext {
	font-size: 20px;
}


#butxt01Ahome { 
	font-size: 22px;
	margin: 5px 10px 5px 10px;
	line-height: 120%;
	
}


}

/************************************************************************************
smaller than 768
*************************************************************************************/
@media screen and (max-width: 768px) {


#hklogo {
	padding: 10px 0px 10px 15px;
}


#bblogo {
	padding: 10px 15px 10px 0px;
}


.logo {
	width: 60px;
	height: 84px;
}

.logo3bb {
	width: 70px;
	height: 84px;
}


#titleheader {
	position: absolute;
    left: 15px;
    width: 600px;
}


#topcontent {
	position: absolute;
    top: 70px;
    left: 15px;
    width: 370px;
}


.title {
	font-size: 42px;
	font-weight: bold;
	line-height: 100%;
}

.titleinside {
	font-size: 42px;
	font-weight: bold;
	line-height: 100%;
}

.titlecontent {
	font-size: 20px;
	line-height: 130%;
}


#subtitleheader {
    width: 95%;
	margin: 0px 0px 0px 15px;
}

#subcontent {
    width: 95%;
	margin: 10px 0px 0px 15px;
}


.subtitle {
	font-size: 35px;
	font-weight: bold;
	line-height: 100%;
	color: #ba2425;
}

.subtitlecontent {
	font-size: 25px;
	line-height: 130%;
	color: #000000;
}

.networktxt {
	font-size: 20px;
}


#bulletpoint {
	margin: 0px 0px px 15px;
}

.bullet { 
	font-size: 20px;
	line-height: 120%;
	margin-left: 15px;
}

#share {
	text-align:left;
	margin-top: 20px;
	margin-left: 15px;
	margin-bottom: 50px;
	}

.shareicon {
	width: 50px;
	height: 50px;
}

	
.hrline { width: 96% }

#tnc {
    width: 95%;
	margin: 10px 0px 60px 15px;
}

.tnccontent {
	font-size: 13px;
}

/************************************************************************************
PLAN MOB BUTTON
*************************************************************************************/
#butxt01A { 

	margin: 5px 20px 5px 20px;
}

#butxt01C { 
	font-size: 20px;
	margin: 5px 20px 5px 20px;
	
}

#butplanmob1 { 
	font-size: 18px;
	margin: 8px 7px 8px 7px;
}

.plantdbut {
	width:210px;
	}
	
.planmob_tdtext {
	font-size: 18px;
}
	
	
/************************************************************************************
FAQ
*************************************************************************************/
.faq_tdtext {
	font-size: 20px;
}	

#faqbutxt01 { 
	font-size: 20px;
	margin: 5px 20px 5px 20px;
	
}

#butxthomefaq { 
	font-size: 20px;
	
}


/************************************************************************************
SPACE
*************************************************************************************/
.plantdbutsim {
	width:400px;
	text-align:center
	}

#simplus { float: none; clear:both }

.simcenter1 {
    margin: auto;
    width: 400px;
}

.simcenter2 {
    margin: auto;
    width: 50px;
}

.center3 {
    margin: auto;
    width: 470px;
}

.width02 {width: 45%}

#width03 {width: 18px}


.tvbfunctionheader {
	font-family: Microsoft JhengHei, 微軟正黑體, sans-serif;
	font-size: 17px;
	color: #000000;
}

.tvbfunctiontext {
	font-family: Microsoft JhengHei, 微軟正黑體, sans-serif;
	font-size: 15px;
	color: #000000;
}

}




/************************************************************************************
smaller than 480
*************************************************************************************/

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


/*******************************************
TOP
*******************************************/
#langtext {
	font-size: 12px;
}

.homeicon {
	width: 18px;
	height: 15px;
    margin: 0px 0px 0px 0px;
}

#logoheader {
	width: 95%;
	background: #ffffff;
	clear:both;
	text-align: left;
	padding: 0px 0px 10px 10px;
}

#hklogo {
	padding: 10px 0px 5px 0px;
}


#bblogo {
	padding: 10px 0px 5px 0px;
}

.logo {
	width: 43px;
	height: 60px;
	margin: 0px 20px 0px 0px;
}

.logo3bb {
	width: 50px;
	height: 60px;
}

#topcolorblue {
	height: 7px;
}

#topcolormagenta {
	height: 7px;
}

#topcolorgreen {
	height: 7px;
}



/*******************************************
MAIN PHOTO
*******************************************/

.mainphoto_pc {
	display:none;
}

.mainphoto_mob {
	display:inline;
}

#titleheader {
	position: absolute;
    top: 10px;
    left: 10px;
    width: 350px;
    height: 100px;
}


#topcontent {
	position: absolute;
    top: 45px;
    left: 10px;
    width: 260px;
}


.title {
	font-size: 28px;
	font-weight: bold;
	line-height: 100%;
}

.titleinside {
	font-size: 26px;
	font-weight: bold;
	line-height: 100%;
}

.titlecontent {
	font-size: 16px;
	line-height: 120%;
}

.simbanner_pc {
	display:none;
}

.simbanner_mob {
	display:inline;
}


#simbanner_pc {
	display:none;
}

#simbanner_mob {
	display:inline;
}



.shopadd {
	width: 13px;
	height: 20px;
	}
	
	
/************************************************************************************
BUTTON
*************************************************************************************/
#butxt01A { 
	font-size: 18px;
	margin: 5px 10px 5px 10px;
}

#butxt01B { 
	font-size: 18px;
	margin: 5px 30px 5px 30px;
}

#butxt01C { 
	font-size: 18px;
	margin: 5px 10px 5px 10px;
	
}



/****** button01 *******/
#button01 {
	margin: 5px 0px 5px 0px;
}


#butxt01Ahome { 
	font-size: 16px;
	margin: 5px 10px 5px 10px;
	line-height: 120%;
	
}


/*******************************************
MENU
*******************************************/
#menugroup {
	width: 100%;
	clear:both;
	margin: 1px 0px 0px 0px;
}

#menutxt { 
	font-size: 14px;
	margin: 0px 0px 0px 0px;
	
}

/****** menu01 *******/
#menu01 { height: 105px; }

#menu01a { height: 100px; }

.menuicon01 {
	width: 35px;
	height: 60px;
    margin: 10px 0px 0px 0px;
}

/****** menu01 *******/
#menu02 { height: 105px; }

#menu02a { height: 100px; }

.menuicon02 {
	width: 64px;
	height: 60px;
    margin: 10px 0px 0px 0px;
}

/****** menu03 *******/
#menu03 { height: 105px; }

#menu03a { height: 100px; }

.menuicon03 {
	width: 51px;
	height: 60px;
    margin: 10px 0px 0px 0px;
}

/****** menu04 *******/
#menu04 { height: 105px; }

#menu04a { height: 100px; }

.menuicon04 {
	width: 51px;
	height: 60px;
    margin: 10px 0px 0px 0px;
}

/****** menu05 *******/
#menu05 { height: 105px; }

#menu05a { height: 100px; }

.menuicon05 {
	width: 51px;
	height: 60px;
    margin: 10px 0px 0px 0px;
}


/************************************************************************************
PLAN MOB
*************************************************************************************/

.plantable { 
margin:auto;
width: 95%
}

.subtitle_planmob {
	font-size: 26px;
}

.subtitle_mytv {
	font-size: 26px;
}

.subtitle_howto {
	font-size: 26px;
}

.subtitle_faq {
	font-size: 26px;
}


.planmob_subtitle {
	font-size: 20px;
}

.planmob_subtitle2 {
	font-size: 12px;
}

.plus {
	width: 15px;
	height: 15px;
    margin: 8px 3px 0px 3px;
	padding: 0px 0px 0px 0px;
	}
	
.pricetitle {
	font-size: 20px;
    }
	
.price {
	font-size: 20px;
    }
	
.planmob_tdfreetext {
	font-size: 20px;
}

.planmob_tdtext {
	font-size: 12px;
}

.tick {
	width: 25px;
	}

.plantdbut {
	width:105px;
	}

.plantdbutsim {
	width:250px;
	text-align:center
	}
	
	
.center {
    margin: auto;
    width: 140px;
}

.center2 {
    margin: auto;
    width: 285px;
}

.center3 {
    margin: auto;
    width: 320px;
}



.mytv_subtitle {
	font-size: 22px;
}


.howto_subtitle {
	font-size: 22px;
}



.planmob_plantitle {
	font-size: 15px;
}

.planmob_plantext {
	font-size: 18px;
}

.planmob_plantextno {
	font-size: 13px;
}

.planmob_pchan {
	font-size: 12px;
}

.planbullet { 
	font-size: 12px;
	line-height: 150%;
}

/************************************************************************************
PLAN MOB BUTTON
*************************************************************************************/
#butplanmob1 { 
	font-size: 10px;
	margin: 8px 7px 8px 7px;
}

.top {
	width: 23px;
	height: 20px;
    margin: 5px 0px 10px 0px;
	padding: 0px 0px 0px 0px;
	}
	

/************************************************************************************
NETWORK
*************************************************************************************/


#subtitleheader {
    width: 95%;
	margin: 0px 0px 0px 10px;
	padding: 15px 0px 0px 0px;
}

#subcontent {
    width: 95%;
	margin: 5px 0px 0px 10px;
}

.subtitle {
	font-size: 26px;
	font-weight: bold;
	line-height: 100%;
	color: #ba2425;
}

.subtitlecontent {
	font-size: 18px;
	line-height: 130%;
	color: #000000;
}

#networkphoto {
	text-align:center;
	margin-bottom: 10px;
	}
	
	
.combinenetwork {
	width: 90%;
}


#network_pc {
	display: none;
}

#network_content {
	width: 95%;
	margin: 0px 0px 0px 10px;
	clear:both;
}

.networkpic {
	width: 300px;
	padding: 0px 0px 0px 10px;
	}

.networktxt {
	font-size: 18px;
	padding: 0px 10px 0px 15px;
}

#tvc_pc {
	display: none;
}

#tvc_mob {
	display: inline;
	width: 95%;
	margin: 0px 0px 0px 0px;
}


#bulletpoint {
	width: 95%;
	margin: 0px 0px 0px 10px;
	clear: both;
}

.bullet { 
	font-size: 18px;
	line-height: 120%;
	margin-left: 20px;
}

#share {
	text-align:center;
	margin-top: 20px;
	margin-left: 0px;
	margin-bottom: 40px;
	}
	
.shareicon {
	width: 50px;
	height: 50px;
}


.hrline { width: 94% }

#tnc {
    width: 95%;
	margin: 10px 0px 60px 10px;
}

.tnccontent {
	font-size: 12px;
}


/************************************************************************************
FAQ
*************************************************************************************/
.questiontext {
	font-size: 18px;
}

#butfaq1 { 
	font-size: 18px;	
}

.faq_tdtext {
	font-size: 15px;
}

.faqwidth01 {width: 45%;}

.faqwidth02 {width: 35%;}

.faqwidth03 {width: 20%;}

#faqbutxt01 { 
	font-size: 15px;
	margin: 5px 10px 5px 10px;
}

.faqchannel {
	font-size: 18px;
}

#butxthomefaq { 
	font-size: 18px;
	
}

#width01 {width: 20px}

#width03 {width: 0px}


.faqphoto_pc {
	display:none;
}

.faqphoto_mob {
	display:inline;
}


/************************************************************************************
howto
*************************************************************************************/

.mobprice01 {
	font-size: 22px;
	line-height: 100%;
}

.pricecolor01 {
	width: 7px;
	height: 45px;
	}
	
.faq_subtitle {
	font-size: 22px;
}

.faq_subtitle2 {
	font-size: 22px;
}

.faq_subtitle3 {
	font-size: 22px;
}

/************************************************************************************
SPACE
*************************************************************************************/

#height01 {clear:both;; height: 25px}
#height02 {clear:both;; height: 30px}
#height03 {clear:both;; height: 15px}
#height04 {clear:both;; height: 40px}
#simplus { float: none; clear:both }

.simcenter1 {
    margin: auto;
    width: 250px;
}

.simcenter2 {
    margin: auto;
    width: 20px;
}

.width02 {width: 45%}


/* disable webkit text size adjust (for iPhone) */
html {
	-webkit-text-size-adjust: none;
}


}