@charset "utf-8";
.ie6 img {	width:100%;}
ul, ol { margin: 1em 0; padding: 0 0 0 20px; }
img{ display: block;}
.wd100{width:100%;}

body{ margin:0 auto; background-color:#B10B1E; 	font-family:"微軟正黑體";	text-align:center;	}
.Main {	width:100%;	text-align:left; margin:0 auto;}
.mousehand{cursor:pointer;}
	
/*#Photo{transform-origin:right bottom;
transform:rotate(-10deg);}
*/
#PhotoDiv{transform-origin:right bottom;
transform:rotate(-10deg);
overflow:hidden;

}


.flex {display:flex; flex-direction:row; width:100%;}
.item { flex: 1; display: flex;  justify-content: left;  align-items: center; font-size: 1.2rem;}
.flex2 { display: flex; flex-direction: row; width:65%; text-align:center; margin:0 auto;}	

.MainDf{margin:0 auto; text-align:center; position:relative; width:50%; background-color:#C30D23;}	
.Mg{margin:0 auto; width:100%;}
.i2Css{margin:0 auto; width:40%;}
.i2Css2{width:40%;color:#FFF; margin:0 auto; padding-left:10%; letter-spacing:5px;}
.i3Css{margin:3% auto; width:70%;}
.i4Div{position:relative; padding:5% 0 35% 0;}
.i4Css{margin:3% 15%; width:70%; position:absolute;}
.i4Css2{color:#FFF; position:absolute; margin:9% 20%; width:30%; text-align:left; padding-left:27%;}
.i5Div{color:#FFF; letter-spacing:16px; font-size:1em; padding-bottom:10%;}
.btn_Up{margin:10% auto 0 auto; width:35%;}
.Pagebottom{color:#FFF; background-color:#A5121A; padding:4%; letter-spacing:5px;}

.bgcover{width:100%; height:100%; background-color:rgba(0,0,0,0.7); position:fixed; z-index:10; }
.uploading{text-align:center; color:#FFF; height:100%; margin:25% auto;}
.loader{ margin:auto auto; }


@media only screen and (min-width:768px) and (max-width: 1023px) {

.MainDf{margin:0 auto; text-align:center; position:relative; width:100%; background-color:#C30D23;}	
.Mg{margin:0 auto; width:100%;}
.i2Css{margin:0 auto; width:40%;}
.i2Css2{width:40%;color:#FFF; margin:0 auto; padding-left:8%; letter-spacing:0px; font-size:1.2em;}
.i3Css{margin:3% auto; width:80%;}
.i4Div{position:relative; padding:5% 0 35% 0;}
.i4Css{margin:3% 0; width:100%; position:absolute;}
.i4Css2{color:#FFF; position:absolute; margin:10% 20%; width:50%; text-align:left; padding-left:23%; font-size:1.2em;}
.i5Div{color:#FFF; letter-spacing:7px; font-size:1.2em; padding-bottom:10%;}
.btn_Up{margin:20% auto 0 auto; width:35%;}
.Pagebottom{color:#FFF; background-color:#A5121A; padding:4%; letter-spacing:1px; font-size:1.2em;}	
.uploading{text-align:center; color:#FFF; height:100%; margin:50% auto;}
	}

@media only screen and (min-width:301px) and (max-width: 767px) {
	
.MainDf{margin:0 auto; text-align:center; position:relative; width:100%; background-color:#C30D23;}	
.Mg{margin:0 auto; width:100%;}
.i2Css{margin:0 auto; width:40%;}
.i2Css2{width:40%;color:#FFF; margin:0 auto; padding-left:8%; letter-spacing:0px; font-size:0.8em;}
.i3Css{margin:3% auto; width:80%;}
.i4Div{position:relative; padding:5% 0 35% 0;}
.i4Css{margin:3% 0; width:100%; position:absolute;}
.i4Css2{color:#FFF; position:absolute; margin:5% 20%; width:50%; text-align:left; padding-left:23%; font-size:0.8em;}
.i5Div{color:#FFF; letter-spacing:3px; font-size:0.8em; padding-bottom:10%;}
.btn_Up{margin:20% auto 0 auto; width:35%;}
.Pagebottom{color:#FFF; background-color:#A5121A; padding:4%; letter-spacing:1px; font-size:0.8em;}
.uploading{text-align:center; color:#FFF; height:100%; margin:50% auto;}
	}

@media only screen and (min-width:301px) and (max-width: 320px) {

	}