@charset "UTF-8";
/* CSS Document */

html,body{  
	font-size:15px;
	font-weight:500;
	font-family:'Noto Sans TC','Arial', sans-serif;
	
	color:#fff; 
	background:#ddd;
	
 	width:100%; height:100%; margin:0;
	
	text-size-adjust:none;
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-ms-text-size-adjust:none;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale; 
} 

img{ border:none; padding:0; margin:0;  }
a{ font-size:inherit; color:inherit; text-decoration:none; -webkit-tap-highlight-color:rgba(0,0,0,0);   }
body, html, div, select, input, textarea, img, span{ font-family: 'Inter','Noto Sans TC','Arial', sans-serif; -webkit-tap-highlight-color:rgba(0,0,0,0); }

h1,h2,h3,h4{ font-weight:inherit; font-size:inherit; line-height:inherit; margin:0; padding:0; display:inherit; }
p{ margin:0 0 1em 0; }

input{ background-color:transparent; border:none; color:#fff;  }
input:focus, textarea:focus{ outline:none;    }
input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:hover {
    background:#fff; -webkit-box-shadow:inset 0 0 0px 9999px #fff; box-shadow:inset 0 0 0px 9999px #fff; color:#000; -webkit-text-fill-color:#000 !important;
}

ul, li{  padding:0; margin-left:0.8em;  }
ol, ol li{ margin-left:0; padding-left:0; }
ol{ margin-left:0em; margin-top:0; }
ol li{ margin-bottom:0em; list-style-position:inside;  }
ul li{ margin-bottom:0.3em }
ul li:last-child{ margin-bottom:0em }

button{ padding:0; margin:0; border:none; font-family:inherit; font-size:inherit; font-weight:inherit; color:inherit; line-height:1; cursor:pointer; background:transparent }

#canvasQR{ position:absolute; left:-1000vw; z-index:10; background:red; pointer-events:none; opacity:0.5 }

.clear{ clear:both; }
 
.desktop-ele{ }
.mobile-ele{ display:none  }

/* text style */

.txt-white{ color:#fff; } 


.txt-bold{ font-weight:900; }

.txt-giant{ font-size:2.5em; }
.txt-big{ font-size:1.5em; }
.txt-hl{ font-size:1.2em; }
.txt-small{ font-size:0.8em; }
.txt-mini{ font-size:0.6em; }


/* text style */


.page-container{ background:#fff;  width:100%; margin:auto;  max-width:1024px; min-height:100%; position:relative}
.inner-container{ margin:auto; width:90%; color:#000}
.page-header{ display:flex; padding:2em 0; justify-content:space-between; align-content:stretch;  width:100%; align-items:flex-end; flex-direction:row-reverse ; line-height:1   }

#property-logo{ text-transform: uppercase;}
#page-lang{ text-align:right;   flex-grow: 1; display:flex; justify-content:flex-end }
#page-lang table{  text-align:right}
#page-lang a{ color:#666}
#page-lang a.active, #page-lang a:hover{ color:#000}

#residential-menu{ display:flex; align-items:flex-start; margin-bottom:1em; text-transform:uppercase  }
#residential{ white-space:nowrap; margin-right:.25em;   }
#property-menu ul{ display:flex; flex-wrap:wrap; list-style-type:none;   margin-top:0;  }
#property-menu ul li{ margin:0 .25em 0.4em 0.25em; }
#property-menu ul li span{ padding-right:.5em}
#property-menu ul li:nth-child(1) span{ display:none}

#property-menu ul a{ color:#666}
#property-menu ul a.active, #property-menu ul a:hover{ color:#000}


#residential:after{ content:' »' }

#page-content{ margin-top:2em }

.content-table{ border-top:1px solid #000; margin-top:.25em; width:100%; font-size:.9rem; }
.content-table > div{  display:flex; align-items:flex-start; justify-content:space-between;  padding:1em 0; border-bottom:1px solid #000; text-align:left; } 

.content-table > div > div:nth-child(2){  width:10em; margin-right:1em; order:1;  }
.content-table > div > div:nth-child(1){  width:calc(100% - 19em - 2em); margin-right:1em; order:2;  }
.content-table > div > a:nth-child(3){  width:8em; text-align:center; order:3; color:#33afc8;  background-position:left center; background-size:contain; background-repeat:no-repeat; background-image:url("../img/dl.svg"); padding:0em 0 0em 1em;   }
.content-table > div > a:nth-child(3) > div{    }

#page-content table td:nth-child(2){ padding:1em .5em }


#adobe-download{ margin-top:4em; text-align:center; color:#666}
#adobe-download a{ text-decoration:underline}

#page-footer{ background:#aaa; position:absolute; bottom:0; width:100%; padding:.5em 0}
#page-footer > .txt-small{ width:90%; margin:auto; line-height:1}

@media only screen and (min-width:0px)  and (max-width:1023px) {
}


@media only screen and (min-width:0px)  and (max-width:768px) {
	.txt-small{ font-size:1em; }
	.page-header{ display:block; padding:.5em 0; margin-bottom:1em  }
	#page-lang{ margin-bottom:1em}
	
	#residential-menu{ display:block}
	#property-menu ul{ display:none; padding-left:1.5em; margin-left: 0;  list-style-type:disc;  }
	#property-menu ul.active{ display:block}
	#residential{ width:calc(100% - 2em); background:grey; padding:1em; text-align:center; cursor:pointer; margin-bottom:1em }
	#residential:after{ content:'  ▼' }
	#residential.active:after{ content:'  ▲' }
	 
	#property-menu ul li span{ display:none; padding:0}
	#property-menu ul li{ margin:.5em 0 ; }
	
	.content-table > div{ position: relative; display:block}
	.content-table > div > a:nth-child(3){ position:absolute; right:0; width:2em; top:calc(50% - 0em); transform:translateY(-50%)}
	.content-table > div > div:nth-child(1){  width:calc(100% - 4em);  margin-right:0em; margin-bottom:.4em  }
	.content-table > div > div:nth-child(2){  width:calc(100% - 4em); }
	.content-table > div > a:nth-child(3) span{ display:none; }
	
	.content-table > div > a:nth-child(3){ height:2em; background-position:center right; background-size:contain; background-repeat:no-repeat; }
}


@media only screen and (min-width:0px) and (max-width:479px) {
	html,body{  font-size:12px; }
	
}

@media only screen and (min-width:480px) and (max-width:768px) {
	html,body{  font-size:13px; }
	
}

@media only screen and (min-width:767px)  and (max-width:1023px) {
	html,body{  font-size:14px; }
}

@media only screen and (min-width:1024px) and (max-width:1279px) {

}

@media only screen and (min-width:1280px) and (max-width:1599px) {
	
}
@media only screen and (min-width:1600px) {
	
	
}