@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/cwtexyen.css);		/* font-family: 'cwTeXYen', sans-serif; */
@import url(http://fonts.googleapis.com/earlyaccess/alefhebrew.css);	/* font-family: 'Alef Hebrew', sans-serif; */
/* CSS Reset & Overall */

* { padding:0; margin:0; }
html, body { width:100%; height:100%; }

	
section { position:relative; width:100%; min-height:100%; }
#page1 { background-color:#000; }
#page2 { background-color:#9CF; }
#page3 { background-color:#9C9; }
#page4 { background-color:#FC3;}


/***** nav導覽區 ********************************************************************/
#goTop { position:absolute; z-index:999; right:0; top:0; cursor:pointer; }

#navPoint { display:none; }

nav{ position:fixed; width:100%; min-height:80px; z-index:1000; background-color:rgba(0,0,0,0.5); }

.navbar-inverse { background-color:rgba(0,0,0,0.7); border: none; }
.navbar { min-height:85px; }
.fa { vertical-align:middle; margin-right:5px; }

.navbar-brand { min-height: 85px; padding: 10px 15px; }

.nav>li>a { padding: 10px 35px; font-size:16px; }
.navbar-inverse .navbar-nav>li>a { color: #FFF; }

.btnEn { display:inline-block; margin: 0 10px;}


@media (min-width: 768px) { 
#navPoint { display:block; position:absolute; width:100px; height:60px; left:-90px; bottom:0; 
			background-color:rgba(255,255,0,0.5); z-index:1001; /*box-shadow: 0 -2px 2px #000;*/
			border-top-left-radius:10px; border-top-right-radius:10px;}
			
.container-fluid { padding-right: 5px; padding-left: 5px; /*margin-right: auto; margin-left: auto;*/ }

#myNavbar ul.navbar-right {position:absolute; right:30px; bottom:0px; z-index:1002;}

.navbar-nav>li>a {  padding: 10px 15px; text-align:right; letter-spacing:1px; 
					font-family: 'cwTeXYen', sans-serif; font-size:18px;}

.btnEn { display:block; letter-spacing:0px; margin:0; font-family: 'Alef Hebrew', sans-serif; font-size:14px; }

}


/***** Page1區域 ********************************************************************/
#bgPhoto, #bgPhoto li { position:absolute; left:0; top:0; width:100%; height:100%;
						background-size:cover; background-position:center; }
#bgPhoto li { display:none; }
#bg1 { background-image:url(../images/web3_page1_photo/photo1.jpg); }
#bg2 { background-image:url(../images/web3_page1_photo/photo2.jpg); }
#bg3 { background-image:url(../images/web3_page1_photo/photo3.jpg); }
#bg4 { background-image:url(../images/web3_page1_photo/photo4.jpg); }



/***** Page2區域 ********************************************************************/
.jumbotron {  padding: 100px 40px 20px; background-color:#036; color:#CFF; margin:0; }
.page2block { position:relative; background-color:rgba(255,255,255,0.5); margin:10px;
			  border-radius:20px;  }
.page2block img { width:100%; height:auto; }
.page2block h3 { position:absolute; top:10px; left:10px; }
.page2block p { position:absolute; bottom:10px; left:10%; width:80%;}

@media screen and (min-width: 768px){
.jumbotron {  padding: 100px 50px 40px 50px; }
.container { padding-top:40px; padding-bottom:50px;}
.page2block { border-radius:50%; box-shadow:2px 1px 2px #666; text-align:center; }
.page2block img { border-radius:50%; }
.page2block h3 {top:0px; left:0px; width:100%; }
.page2block p { display:none; }
}


/***** Page3區域 ********************************************************************/
#page3 { padding-top:80px;}
#page3 .col-sm-3 .page3block{ width:90%; padding:5%; /*height:500px;*/ background:#F7F2BB; margin-bottom:20px;
						 border-radius:15px; box-shadow:3px 3px 3px #333;}
#page3 .col-sm-3 h3{ font-family: 'cwTeXYen', sans-serif; font-size:24px; color:#600; margin:0; }
#page3 .col-sm-3 p{ font-size:13px; text-indent:-5em; padding-left:5em; letter-spacing:0px; line-height:1.2em;}
#page3 .col-sm-3 img{width:85%; height:auto; border-radius:8px; box-shadow:-2px -2px 2px #333; 
					 display:block; margin:15px auto; cursor:pointer;}

#bigPhoto { width:80%; height:auto; position:fixed; top:100px; left:50%; margin-left:-40%; 
		    background-color:#FCF; z-index:2000; display:none; padding:20px;}
#bigPhoto img  { float:left; display:block; width:50%; height:auto; }
#bigPhoto .allContent { float:right; width:45%; }
#maskArea { background-color:rgba(0,0,0,0.7); position:fixed; width:100%; height:100%; top:0; left:0; 
			cursor:pointer; display:none; }

@media screen and (min-width: 768px){
#page3 .page3block { max-height:330px; overflow:hidden; }
}


/***** page4 ***********************************************************************/
#page4 { padding-top:120px;}
#page4Form { border:1px solid #666; border-radius:20px; position:relative; padding:40px 20px;}
#page4Form fieldset {position:absolute; top:-20px; left:20px; background-color:#000; color:#FFF; 
					 padding:10px 40px; border-radius:10px; font-size:24px; font-family: 'cwTeXYen'; font-weight:bold;}
#page4Form .wh2 { width:20px; height:20px; vertical-align:middle; margin-bottom:5px; }