﻿@charset "utf-8";
/* CSS Document */

/**/@import url("reset.css");

html,body{
	height:100%;
	font-family:  /*"Helvetica Neue", Helvetica, Arial,*/ "微軟正黑體", sans-serif;
	-webkit-text-size-adjust:none;
}

body{
	background-color:#479bf6;
	background-image:url(/Images/index/bgPage.png);
	background-repeat:repeat-x;
}




#Logo{
	position:absolute;
	z-index:9999;
}
#Logo img{
	width:100%;
}

#ContentCloud img,#MainBoxBottom img{
	width:100%;
	display:block;
}


#Copyright{
	position:relative;
	width:100%;
	color:#b5c9ff;
	text-align:center;
	/*background-color:#285be2;*/
}


/**/
.processLayout02 div button{ 
	display:block;
	width:100%;
	height:50px;
	text-decoration: none;
	text-align:center; 
	color:#FFF;
	line-height:50px;
	border-radius:5px;
	font-size:16px;
	border:0px solid #000;
	cursor:pointer;
	font-family:"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
}


.But01 button{
	background-color:#027bc0;
}

.But02 button{
	background-color:#ff4e00;
}
.But01 button:hover{
	background-color:#288fc9;
}

.But02 button:hover{
	background-color:#ff6826;
}

.oopsButton{
	position:relative;
	margin:auto;
	margin-top:70px;
	width:200px;
}

.oopsButton button{
	display:block;
	width:100%;
	height:50px;
	text-decoration: none;
	text-align:center; 
	color:#FFF;
	line-height:50px;
	border-radius:5px;
	font-size:16px;
	border:0px solid #000;
	cursor:pointer;
	font-family:"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
}


.processLayout04{
	overflow:hidden;
	width:50%;
	margin:auto;
	margin-top:40px;
}

.processLayout04 div{
	width:100%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}

.processLayout04 div button{
	display:block;
	width:100%;
	height:50px;
	text-decoration: none;
	text-align:center; 
	color:#FFF;
	line-height:50px;
	border-radius:5px;
	margin-top:30px;
	font-size:16px;
	border:0px solid #000;
	cursor:pointer;
	font-family:"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
}

.SCD_text{
	font-size:20px !important;
	line-height:40px;
	padding-top:20px;
	color:#333;
}
/**/




/*=======================================RWD logo=============================================*/

/*1680以上*/
@media screen and (min-width: 1680px) { 
	#Logo{
		top:20px;
		left:3%;
		width:258px;
	}
}

/*721~1027*/
@media screen and (min-width: 1100px) and (max-width: 1679px) { 
	#Logo{
		top:15px;
		left:3%;
		width:15%;
	}
}

/*最大道720  0~720*/
@media screen and (max-width: 1099px) {
	#Logo{
		top:18px;
		left:3%;
		width:146px;
	}
}


/*=======================================RWD=============================================*/






/*小於720*/
@media screen and (max-width: 720px) {

#main{
	position:relative;
	min-width:320px;
	overflow:hidden;
}

#Copyright{
	font-size:12px;
	padding-top:10px;
	padding-bottom:20px; 
}

/*====================================================*/

#MainBox{
	position:relative;
	margin:auto;
	width:100%;
	max-width:1100px;
	margin-top:90px;
}

#ContentCloud{
	display:none;
}


#MainContent{
	position:relative;
	width:96%;
	min-height:200px;
	margin:auto;
	background-color:#FFF;
	border-radius:10px;

	padding-top:20px;
	padding-bottom:40px;
	
}
#MainBoxBottom{
	display:none;
}


#processBox{
	position:relative;
	width:100%;
	height:80px;
	background-color:#f4f4f4;
	margin-top:23px;
	overflow:hidden;
}
.processBoxA{
	position:relative;
	float:left;
	width:25%;
	height:100%;
	text-align:center;
	line-height:115px;
	color:#227d02;
	background-repeat:no-repeat;
	background-position:center 12px;
	background-size:36px;
	font-size:12px;	
}
.processBoxA_x3{
	position:relative;
	float:left;
	width:33.333%;
	height:100%;
	text-align:center;
	line-height:115px;
	color:#227d02;
	background-repeat:no-repeat;
	background-position:center 12px;
	background-size:36px;
	font-size:12px;	
}


.Num01{
	background-image:url(/Images/index/process_number01_g.png);
	z-index:4;
}
.Num02{
	background-image:url(/Images/index/process_number02_g.png);
	z-index:3;
}
.Num03{
	background-image:url(/Images/index/process_number03_g.png);
	z-index:2;
}
.Num04{
	background-image:url(/Images/index/process_number04_g.png);
	z-index:1;
}

.Num01_change{
	background-image:url(/Images/index/process_number01_w.png);
	background-color:#227d02;
	color:#FFF;
}
.Num02_change{
	background-image:url(/Images/index/process_number02_w.png);
	background-color:#227d02;
	color:#FFF;
}
.Num03_change{
	background-image:url(/Images/index/process_number03_w.png);
	background-color:#227d02;
	color:#FFF;
}
.Num04_change{
	background-image:url(/Images/index/process_number04_w.png);
	background-color:#227d02;
	color:#FFF;
}

.processBoxB{
	position:absolute;
	width:26px;
	height:100%;
	top:0px;
	right:-26px;
	background-image:url(/Images/index/process_ing01_w.png);
	background-repeat:no-repeat;
	background-size:auto 80px;	
}

.processBoxB_change{
	background-image:url(/Images/index/process_ing01_g.png);
}

#processFrame{
	position:relative;
	width:90%;
	min-height:200px;
	margin:auto;
	margin-top:31px;
	background-color:#f4f4f4;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	border:1px #e0e0e0 solid;
	overflow:hidden;
	padding-top:15px;
	padding-bottom:20px;
	
}
#processFrameA{
	position:relative;
	width:80%;
	margin:auto;
	
}


#processFrameB{
	position:relative;
	width:90%;
	margin:auto;
	color:#333;	
	font-size:12px;
	line-height:20px
}


#processTitle{
	position:relative;
	width:100%;
	text-align:center;
	font-size:18px;
	color:#090;
}

.processLayout01{
	margin-top:15px;
	overflow:hidden;
}
.processLayout01 div{
	float:left;
}


.inputName01{
	width:100%;
	height:100%;
	font-size:13px;
	color:#333;
	line-height:20px;
	
}
.inputBox01{
	width:100%;
	height:30px;
	
}
.inputBox01 input{
	width:100%;
	height:100%;
	border: 1px solid #c4c4c4;
	font-size:16px;
	color:#666;
	padding:5px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}

.inputBox01 select{
	width:100%;
	height:100%;
	border: 1px solid #c4c4c4;
	font-size:16px;
	color:#666;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}


.inputBox01 p{
	width:100%;
	height:100%;
	font-size:16px;
	color:#03C;
	line-height:24px;
	padding:3px;
	background-color:#e9e9e9;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}




.processLayout02{
	overflow:hidden;
	width:100%;
	margin:auto;
	margin-top:30px;

}
.processLayout02 div{
	float:left;
	width:50%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}

.processLayout02 div:nth-child(even){
	padding-left:5px;
}
.processLayout02 div:nth-child(odd){
	padding-right:5px;	
}






/*//////////////////////////////////////////////////////////////////////*/

/*//////////////////////////////////////////////////////////////////////*/

.Warning{
	width:100%;
	padding-top:20px;
	text-align:center; 
	font-size:14px;
	color:#F00;
	/*display:none;*/
}

.Text01{
	font-size:14px;
	font-weight:bold;
	color:#039;
	padding-bottom:3px;
}


.Red{
	color:#F00;
	font-size:24px;
	
}

.processLayout03{
	padding-top:55px;
	text-align:center;
	color:#333;
	font-size:15px;
}


#registerBox{
	position:relative;
	width:85%;
	max-width:670px;
	margin:auto;
	padding-top:28px;
	padding-bottom:20px;
	overflow:hidden;
}

/*
.outlineBoxTable{
	font-size:12px;
}
*/

/*==================================*/

#outlineBox{
	position:relative;
	width:95%;
	margin:auto;
	margin-top:30px;
	overflow:hidden;
	font-family:  /**/"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif !important;
}


#outlineBox>div{
	float:left;
}

.outlineBoxHeight{
	position:relative;
	margin-bottom:20px;
}

.outlineBoxHeight>div{
	height:50px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

.outlineBoxHeight>div:first-child{
	height:30px;
}
/*
.outlineBoxHeight>div:nth-of-type(2){
	height:300px;
}

.outlineBoxHeight>div:nth-of-type(3){
	height:320px;
}
*/
.outlineBoxHeight>div:nth-of-type(5){
	height:80px;
}

.outlineBoxClass{
	width:20%;
}
.outlineBox01{
	width:40%;
}
.outlineBox02{
	width:40%;
}
.AllWidth{
	width:80%;
}

.outlineBoxClass>div{
	border:1px solid #fff;
	margin-top:-1px;
	background-color:#f75d00;
}
.outlineBox01>div{
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	border-right:1px solid #fff;
	margin-top:-1px;
}
.outlineBox02>div{
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	border-right:1px solid #fff;
	margin-top:-1px;
}

.outlineBoxClass table{
	width:100%;
	height:100%;
	text-align:center;
	color:#FFF;
	font-size:12px;
}

.outlineBox01 table,.outlineBox02 table{
	width:100%;
	height:100%;
	text-align:center;
	font-size:12px;
}

.colorOrange>div{
	background:#fee6cc;
	color:#b86101;
	font-size:12px;
}
.colorOrange>div:first-child{
	background:#f88200;
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
}

.colorBlue>div{
	background:#d9e9fe;
	color:#0056ca;
	font-size:12px;
}
.colorBlue>div:first-child{
	background:#4190fb;
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
}

.colorGreen>div{
	background:#d0eecf;
	color:#060;
	font-size:12px;
}
.colorGreen>div:first-child{
	background:#14a810;
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
}


#outlineBox ul{
	list-style:disc;
	padding-left:20px;
	padding-top:6px;
	padding-right:6px;
	padding-bottom:6px;
}

#outlineBox li{
	padding-bottom:6px;
}


.smallOP{
	display:block;
}


.textWeight{
	font-weight:bold;
	color:#F00;
	
}

.DsplayNone{
	display:none;
}


#errorBox{
	position:relative;
	width:80%;
	margin:auto;
	padding-top:20px;
}
#oops{
	font-size:70px;
	color:#999;
	text-align:center;
	font-weight:bold;
}
#oopsText{
	padding-top:10px;
	text-align:center;
	font-size:20px;
	color:#333;
}




.mp3_diskDownloadBox{
	position:relative;
	overflow:hidden;
	width:100%;
}
.mp3_diskDownloadBox>div{
	position:relative;
	float:left;
	width:50%;
	margin-top:40px;
	border-radius:20px;

	
}
.mp3_diskDownloadBox>div:last-child{
	margin-right:0%;
}
.mp3_diskDownloadBox>div>p{
	position:relative;
	text-align:center;
	font-size:18px;
	font-weight: bold;
	padding-top:6px;
	color:#666;
}


.mp3_diskDownloadBox img{
	display:block;
	width:100%;
	height:auto;
}






}



/* 大於721*/
@media screen and (min-width: 721px) { 

#main{
	position:relative;
	width:100%;
	overflow:hidden;
}

#Copyright{
	font-size:17px; 
	padding-top:10px;
	padding-bottom:10px;
}
.Copyright2{
	font-size:13px;
	margin-bottom:5px; 
	color:#fff;
}

/*====================================================*/

#MainBox{
	position:relative;
	margin:auto;
	width:100%;
	max-width:1100px;
	margin-top:90px;
}
.smallSize{
	max-width:920px !important;
}
#ContentCloud{
	position:absolute;
	width:100%;
	max-width:1100px;
	height:auto;
	margin:auto;
	bottom:0%;
}
#ContentCloud1{
	position:relative;
	width:100%;
	height:auto;
}
#ContentCloud2{
	position:absolute;
	width:100%;
	height:auto;
	top:68%;
	left:0%;
}

#MainContent{
	position:relative;
	width:90.5%;
	min-height:500px;
	margin:auto;
	background-color:#fff;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
	padding-top:30px;
	padding-bottom:20px;
	
}

.parentsBg>img{
	display:block;
	width:100%;
	height:auto;
}

#MainBoxBottom{
	position:relative;
	max-width:1100px;
	margin:auto;
}

#MainTitle{
	position:relative;
	background-image:url(/Images/index/characteristic_titleBG.png);
	background-repeat:repeat-x;
	height:74px;
	width:100%;
	border-bottom:7px #ffc6a4 solid; 

}

#MainTitle p{
	font-size:36px;
	color:#FFF;
	line-height:74px;
	font-weight:bold;
	width:90%;
	margin:auto;
}

#processBox{
	position:relative;
	width:100%;
	height:94px;
	background-color:#f4f4f4;
	margin-top:43px;
	overflow:hidden;
}
.processBoxA{
	position:relative;
	float:left;
	width:25%;
	height:100%;
	text-align:center;
	line-height:145px;
	color:#227d02;
	background-repeat:no-repeat;
	background-size:50px;
	background-position:center 9px;
	font-size:16px;	
}

.processBoxA_x3{
	position:relative;
	float:left;
	width:33.333%;
	height:100%;
	text-align:center;
	line-height:145px;
	color:#227d02;
	background-repeat:no-repeat;
	background-size:50px;
	background-position:center 9px;
	font-size:16px;	
}



.Num01{
	background-image:url(/Images/index/process_number01_g.png);
	z-index:4;
}
.Num02{
	background-image:url(/Images/index/process_number02_g.png);
	z-index:3;
}
.Num03{
	background-image:url(/Images/index/process_number03_g.png);
	z-index:2;
}
.Num04{
	background-image:url(/Images/index/process_number04_g.png);
	z-index:1;
}

.Num01_change{
	background-image:url(/Images/index/process_number01_w.png);
	background-color:#227d02;
	color:#FFF;
}
.Num02_change{
	background-image:url(/Images/index/process_number02_w.png);
	background-color:#227d02;
	color:#FFF;
}
.Num03_change{
	background-image:url(/Images/index/process_number03_w.png);
	background-color:#227d02;
	color:#FFF;
}
.Num04_change{
	background-image:url(/Images/index/process_number04_w.png);
	background-color:#227d02;
	color:#FFF;
}

.processBoxB{
	position:absolute;
	width:26px;
	height:100%;
	top:0px;
	right:-26px;
	background-image:url(/Images/index/process_ing01_w.png);
	background-repeat:no-repeat;
	background-size:auto 94px;
}

.processBoxB_change{
	background-image:url(/Images/index/process_ing01_g.png);
}

#processFrame{
	position:relative;
	width:90%;
	min-height:200px;
	margin:auto;
	margin-top:31px;
	background-color:#f4f4f4;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	border:1px #e0e0e0 solid;
	overflow:hidden;
	padding-top:20px;
	padding-bottom:40px;
	
}
#processFrameA{
	position:relative;
	width:500px;
	margin:auto;	
}
#processFrameB{
	position:relative;
	width:80%;
	margin:auto;
	
	color:#333;	
	font-size:16px;
	line-height:28px
}
#processTitle{
	position:relative;
	width:100%;
	text-align:center;
	font-size:21px;
	color:#090;
	padding-bottom:5px;
	
}

.processLayout01{
	margin-top:20px;
	overflow:hidden;
	width:100%;
	height:30px;
}
.processLayout01 div{
	float:left;
}


.inputName01{
	width:25%;
	height:100%;
	font-size:18px;
	color:#333;
	line-height:30px;
	
}
.inputBox01{
	width:75%;
	height:100%;
}
.inputBox01 input{
	width:100%;
	height:100%;
	border: 1px solid #c4c4c4;
	font-size:16px;
	padding:5px;
	color:#666;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}
.inputBox01 select{
	width:100%;
	height:100%;
	border: 1px solid #c4c4c4;
	font-size:16px;
	color:#666;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}
.inputBox01 p{
	width:100%;
	height:100%;
	font-size:16px;
	color:#03C;
	line-height:24px;
	padding:3px;
	background-color:#e9e9e9;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}



.processLayout02{
	overflow:hidden;
	width:80%;
	margin:auto;
	margin-top:40px;
}
.processLayout02 div{
	float:left;
	width:50%;

	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  
}


.processLayout02 div:nth-child(even){
	padding-left:10px;
}
.processLayout02 div:nth-child(odd){
	padding-right:10px;	
}

.processLayout02 div a{ 
	display:block;
	width:100%;
	height:50px;
	text-decoration: none;
	text-align:center; 
	color:#FFF;
	line-height:50px;
	border-radius:5px;
}

.But01 a{
	background-color:#027bc0;
}

.But02 a{
	background-color:#ff4e00;
}
.But01 a:hover{
	background-color:#288fc9;
}

.But02 a:hover{
	background-color:#ff6826;
}

.Warning{
	width:100%;
	padding-top:20px;
	text-align:center; 
	font-size:16px;
	color:#F00;
	/*display:none;*/
}

.Text01{
	font-size:16px;
	font-weight:bold;
	color:#039;
	padding-bottom:3px;
}

.Red{
	color:#F00;
	font-size:24px;
	
}

.processLayout03{
	padding-top:55px;
	text-align:center;
	color:#333;
	font-size:18px;
}


#registerBox{
	position:relative;
	width:85%;
	max-width:670px;
	margin:auto;
	padding-top:48px;
	padding-bottom:20px;
	overflow:hidden;
}
.registerBoxA{
	float:left;
	width:47.5%;
	min-height:400px;
	background-color:#f4f4f4;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
	border:1px #e0e0e0 solid;
	
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */  	
}
.registerBoxA:nth-child(even){
	margin-left:5%;
}

.registerBoxLayout01{
	position:relative;
	height:95px;
	width:100%;
	margin-top:56px;
	background-image:url(/Images/index/register_01.png),url(/Images/index/register_bg01.png);
	background-repeat:no-repeat,repeat-x;
	background-position:center center,left;
	background-size:80px 80px, auto 95px;
}
.registerBoxLayout02{
	position:relative;
	height:95px;
	width:100%;
	margin-top:56px;
	background-image:url(/Images/index/register_02.png),url(/Images/index/register_bg02.png);
	background-repeat:no-repeat,repeat-x;
	background-position:center center,left;
	background-size:80px 80px, auto 95px;
}

.registerBoxLayout03{
	position:relative;
	width:100%;
	text-align:center; 
	font-size:18px;
	margin-top:25px;
	color:#2c2c2c;
}

.registerFont01{
	font-size:38px;
	margin-top:5px;
	color:#027bc0;
}
.registerFont02{
	font-size:38px;
	margin-top:5px;
	color:#ff4e00;
}
.registerBut01{
	position:relative;
	width:200px;
	margin:auto;
}
.registerBut01 button{
	display:block;
	width:100%;
	height:50px;
	text-decoration: none;
	text-align:center; 
	color:#FFF;
	line-height:50px;
	border-radius:5px;
	margin-top:30px;
	font-size:16px;
	border:0px solid #000;
	cursor:pointer;
	font-family:"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
}


/*===========================*/

#outlineBox{
	position:relative;
	width:95%;
	margin:auto;
	margin-top:30px;
	overflow:hidden;
	font-family:  /**/"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif !important;
}
	
/*
.outlineBoxTable td{
	border:1px solid #fff;
	padding:5px;
	background-color:#d9e9fe;
	width:20%;
	font-size:12px
}

.outlineBoxTable tr:first-child td{
	text-align:center;
	color:#FFF;
	font-size:18px;
	background-color:#4190fb;
}

.outlineBoxTable td:nth-child(2){
	background-color:#fee6cc;
}
.outlineBoxTable tr:nth-child(1) td:nth-child(2){
	background-color:#f88200 !important;
}

.outlineBoxTable td:first-child{
	font-size:12px !important;
	text-align:center;
	background-color:#f75d00 !important;
	color:#FFF;
	width:100px;
}



.outlineBoxTable ul{
	list-style:disc;
	padding-left:18px;
}


.outlineBoxTable li{
	color:#0056ca;
	padding-bottom:6px;
}
.outlineBoxTable td:nth-child(2) li{
	color:#b86101;
}

.outlineBoxTable p{
	color:#0056ca;
	text-align:center;
}

*/

/*===========================*/

#outlineBox>div{
	float:left;
}

.outlineBoxHeight{
	position:relative;
	margin-bottom:20px;
}

.outlineBoxHeight>div{
	height:50px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}
/**/
.outlineBoxHeight>div:first-child{
	height:30px;
}
/*
.outlineBoxHeight>div:nth-of-type(2){
	height:250px;
}
.outlineBoxHeight>div:nth-of-type(3){
	height:350px;
}
*/
.outlineBoxHeight>div:nth-of-type(5){
	height:70px;
}

.outlineBoxClass{
	width:8%;
}
.outlineBox01{
	width:18.4%;
}
.outlineBox02{
	width:23%;
}

.outlineBoxClass>div{
	border:1px solid #fff;
	margin-top:-1px;
	background-color:#f75d00;
}
.outlineBox01>div{
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	border-right:1px solid #fff;
	margin-top:-1px;
}
.outlineBox02>div{
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	border-right:1px solid #fff;
	margin-top:-1px;
}

.outlineBoxClass table{
	width:100%;
	height:100%;
	text-align:center;
	color:#FFF;
	font-size:16px;
	
}

.outlineBox01 table,.outlineBox02 table{
	width:100%;
	height:100%;
	text-align:center;
	font-size:16px;
}

.colorOrange>div{
	background:#fee6cc;
	color:#b86101;
	font-size:16px;
}
.colorOrange>div:first-child{
	background:#f88200;
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
}

.colorBlue>div{
	background:#d9e9fe;
	color:#0056ca;
	font-size:16px;
}
.colorBlue>div:first-child{
	background:#4190fb;
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
}

.colorGreen>div{
	background:#d0eecf;
	color:#060;
	font-size:16px;
}
.colorGreen>div:first-child{
	background:#14a810;
	color:#fff;
	font-size:16px;
	text-align:center;
	line-height:30px;
}


#outlineBox ul{
	list-style:disc;
	padding-left:22px;
	padding-right:6px;
	padding-top:6px;
	padding-bottom:6px;
}

#outlineBox li{
	padding-bottom:10px;
}


.smallOP{
	display:none;
}

.textWeight{
	font-weight:bold;
	color:#F00;
	
}


#errorBox{
	position:relative;
	width:80%;
	margin:auto;
	padding-top:50px;
}
#oops{
	font-size:100px;
	color:#999;
	text-align:center;
	font-weight:bold;
}
#oopsText{
	padding-top:10px;
	text-align:center;
	font-size:20px;
	color:#333;
}

.bigWinSmallText td{
	font-size:12px !important;
}






.mp3_diskDownloadBox{
	position:relative;
	overflow:hidden;
	width:100%;
}
.mp3_diskDownloadBox>div{
	position:relative;
	float:left;
	width:23%;
	margin-top:40px;
	margin-right:1.2%;
	border:3px solid #fff;
	border-radius:20px;
	padding-top:15px;
	padding-bottom:15px;
	
}
.mp3_diskDownloadBox>div:last-child{
	margin-right:0%;
}
.mp3_diskDownloadBox>div>p{
	position:relative;
	text-align:center;
	font-size:18px;
	font-weight: bold;
	padding-top:6px;
	color:#666;
}


.mp3_diskDownloadBox img{
	display:block;
	width:100%;
	height:auto;
}

.diskDownload:hover{
	border:3px solid #F90;
}

.mp3_starter{
	max-width:600px;
	margin:auto;
}
.mp3_starter>div{
	width:31%;
}



} /* 大於721*/
/*==============================手機直橫==================================================*/

/*直*/
@media all and  (max-width: 720px) and (orientation:portrait){
	
	
	.Copyright2{
		position:relative;
		width:300px;
		font-size:12px;
		padding-bottom:2px; 
		color:#fff;
		margin:auto;
	}
	
	/*================================================*/
	
	#MainTitle{
		position:relative;
		background-image:url(/Images/index/characteristic_titleBG.png);
		background-repeat:repeat-x;
		background-size:auto 50px;
		height:50px;
		width:100%;
		border-bottom:6px #ffc6a4 solid; 
	}
	
	#MainTitle p{
		font-size:25px;
		color:#FFF;
		line-height:50px;
		font-weight:bold;
		width:90%;
		margin:auto;
	}
	.processBoxB{
		background-size:10px 80px;	
	}
	
	
	
	.registerBoxA{
		width:100%;
		min-height:100px;
		background-color:#f4f4f4;
		border-radius:10px;
		border:1px #e0e0e0 solid;
		padding-bottom:20px;
		
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */
		box-sizing: border-box;         /* Opera/IE 8+ */  	
	}
	.registerBoxA:nth-child(odd){
		margin-bottom:20px;
	}
	
	.registerBoxLayout01{
		display:none;
		/*
		position:relative;
		height:50px;
		width:100%;
		background-image:url(/Images/index/register_01.png),url(/Images/index/register_bg01.png);
		background-repeat:no-repeat,repeat-x;
		background-position:center center,left;
		background-size:40px 40px, auto 50px;
		border-top-left-radius:10px;
		border-top-right-radius:10px;
		*/
	}
	.registerBoxLayout02{
		display:none;
		/*
		position:relative;
		height:50px;
		width:100%;
		background-image:url(/Images/index/register_02.png),url(/Images/index/register_bg02.png);
		background-repeat:no-repeat,repeat-x;
		background-position:center center,left;
		background-size:40px 40px, auto 50px;
		border-top-left-radius:10px;
		border-top-right-radius:10px;
		*/
	}
	
	.registerBoxLayout03{
		position:relative;
		width:100%;
		text-align:center; 
		font-size:16px;
		margin-top:15px;
		color:#2c2c2c;
	}
	
	.registerFont01{
		font-size:25px;
		margin-top:5px;
		color:#027bc0;
	}
	.registerFont02{
		font-size:25px;
		margin-top:5px;
		color:#ff4e00;
	}
	.registerBut01{
		position:relative;
		width:80%;
		margin:auto;
	}
	.registerBut01 button{
		display:block;
		width:100%;
		height:50px;
		text-decoration: none;
		text-align:center; 
		color:#FFF;
		line-height:50px;
		border-radius:5px;
		margin-top:20px;
		font-size:16px;
		border:0px solid #000;
		cursor:pointer;
		font-family:"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
	}


}

/*橫*/
@media all and (max-width: 720px) and (orientation:landscape){
	
	
	.Copyright2{
		position:relative;
		width:300px;
		font-size:12px;
		padding-bottom:2px; 
		color:#fff;
		margin:auto;
	}
	
	
	
	/*================================================*/
	
	#MainTitle{
		position:absolute;
		height:50px;
		width:100%;
		top:-75px;
	}
	
	#MainTitle p{
		font-size:25px;
		color:#FFF;
		line-height:50px;
		font-weight:bold;
		width:100%;
		text-align:center;
	}
	
	
	
	.registerBoxA{
		float:left;
		width:47.5%;
		min-height:100px;
		background-color:#f4f4f4;
		border-radius:10px;
		border:1px #e0e0e0 solid;
		
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */
		box-sizing: border-box;         /* Opera/IE 8+ */  
		
		padding-bottom:20px;	
	}
	.registerBoxA:nth-child(even){
		margin-left:5%;
	}
	
	.registerBoxLayout01{
		display:none;
		/*
		position:relative;
		height:95px;
		width:100%;
		margin-top:56px;
		background-image:url(/Images/index/register_01.png),url(/Images/index/register_bg01.png);
		background-repeat:no-repeat,repeat-x;
		background-position:center center,left;
		background-size:80px 80px, auto 95px;
		*/
	}
	.registerBoxLayout02{
		display:none;
		/*
		position:relative;
		height:95px;
		width:100%;
		margin-top:56px;
		background-image:url(/Images/index/register_02.png),url(/Images/index/register_bg02.png);
		background-repeat:no-repeat,repeat-x;
		background-position:center center,left;
		background-size:80px 80px, auto 95px;
		*/
	}
	
	.registerBoxLayout03{
		position:relative;
		width:100%;
		text-align:center; 
		font-size:16px;
		margin-top:15px;
		color:#2c2c2c;
	}
	
	.registerFont01{
		font-size:25px;
		margin-top:5px;
		color:#027bc0;
	}
	.registerFont02{
		font-size:25px;
		margin-top:5px;
		color:#ff4e00;
	}
	.registerBut01{
		position:relative;
		width:80%;
		margin:auto;
	}
	.registerBut01 button{
		display:block;
		width:100%;
		height:50px;
		text-decoration: none;
		text-align:center; 
		color:#FFF;
		line-height:50px;
		border-radius:5px;
		margin-top:20px;
		font-size:16px;
		border:0px solid #000;
		cursor:pointer;
		font-family:"Helvetica Neue", Helvetica, Arial, "微軟正黑體", sans-serif;
	}

	
}

/* 家長充電區背景星星RWD=======================================*/

@media screen and (min-width: 1050px) { /* 大於1500*/
.parentsBg{
	position:absolute;
	top:37px;
	left:-6.5%;
	width:112.9%;
}

}

@media screen and (max-width: 1050px) { /*小於1500*/
.parentsBg{
	display:none;
}
}

.mp3DownloabButBox{
	padding-top:20px;
}

.mp3DownloabButBox img{
	display:block;
	width:100%;
	height:auto;
}
.mp3DL_starter{
	display:block;
	position:relative;
	margin:auto;
	max-width:686px;
	width:90%;
	background-image: url(/Images/index/mp3_download_btn0.png);
	background-size:100% auto;
}
.mp3DL_starter:hover{
	background-image: url(/Images/index/mp3_download_btn0_over.png);
}
.mp3DL_book{
	position:relative;
	max-width:700px;
	width:90%;
	margin:auto;
	overflow:hidden;
}
.mp3DL_book>a{
	display:block;
	width:24%;
	background-image:url(/Images/index/mp3_download_btnBg2.png);
	background-size:100% auto;
	float:left;
	margin-left:0.5%;
	margin-right:0.5%;
	margin-top:10px;
}

.mp3DL_book>a:hover{
	background-image:url(/Images/index/mp3_download_btnBg2_over.png);
}



.mp3DtCenter{
	text-align:center;
	color:#999;
	font-size:18px;

}


.processLayout02-2>.But02{
	float:inherit;
	margin:auto;
}

