.topbanner{width: 95%; height: 500px; float: left;margin: 110px 2.5% 10px;border-radius: 15px;background-size: cover;background-position: center center;background-repeat: no-repeat}
.topbanner img{max-width: 100%; height: auto; margin: 0; display: block;}
.cnwarp{width:100%; float:left;background-repeat: no-repeat;background-position: center center;background-size: cover;font-family: "Times New Roman";}
.map-content{ float:left;width:100%; margin-top:0; padding:0;}
.map-container {position: relative;padding-bottom:500px;padding-top:0;height: 0;overflow: hidden; border-radius: 15px;}
.map-container iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%); filter: grayscale(100%);filter: gray;}
.map-wrap{width:100%;float:left;}
.map-inner{width:95%;margin:0 auto 100px;}
@media only screen and (max-width: 1600px) {
.topbanner{height: 460px; margin: 100px 2.5% 10px;}
.map-container {padding-bottom:460px;}
.map-inner{margin:0 auto 80px;}
}
@media only screen and (max-width: 1280px) {
.topbanner{ height: 400px; margin: 100px 2.5% 10px;}
.map-container {padding-bottom:400px;}
.map-inner{margin:0 auto 70px;}
}
@media only screen and (max-width: 980px) {
.topbanner{height: 340px; margin: 90px 2.5% 10px;}
.map-container {padding-bottom:340px;}
.map-inner{margin:0 auto 60px;}
}
@media only screen and (max-width: 767px) {
.topbanner{height: 280px; margin:70px 2.5% 10px;}	
.map-container {padding-bottom:280px;}
.map-inner{margin:0 auto 40px;}
}
.unlock{ width:100%;padding:0;position:relative;z-index:1;margin:0 auto; color: #000;}
.unlock input[type="checkbox"]{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px; }
.unlock input[type="checkbox"]:focus + label:before,.unlock input[type="checkbox"]:hover + label:before{border-color:#444444;border-width:2px;border-radius:99em; }
.unlock input[type="checkbox"]:active + label:before{-webkit-transition-duration:0;transition-duration:0;-webkit-filter:brightness(0.2);filter:brightness(0.2);}
.unlock input[type="checkbox"] + label{position:relative;padding:10px;padding-left:35px;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;margin-left:0;}
.unlock input[type="checkbox"] + label:before{box-sizing:content-box;content:'';position:absolute;top:50%;left:0;width:20px;height:20px;margin-top:-12px; border:2px solid #999999;border-radius:99em; text-align:left;}
.unlock input[type="checkbox"] + label:after{box-sizing:content-box;content:'';background-color:#717070;position:absolute;top:50%;left:4px;width:22px;height:22px;border-radius:99em; margin-top:-11px; -webkit-transform:scale(0);transform:scale(0);-webkit-transform-origin:50%;transform-origin:50%;-webkit-transition:-webkit-transform 200ms ease-out;transition:-webkit-transform 200ms ease-out;transition:transform 200ms ease-out;transition:transform 200ms ease-out,-webkit-transform 200ms ease-out;}
.unlock input[type="checkbox"] + label:after{background-color:transparent;top:50%;left:5px;width:0px;height:0px;margin-top:-7px;border-style:solid;border-color:#444444;border-width:7px;-o-border-image:none;border-image:none;-webkit-transform:scale(0);transform:scale(0);-webkit-transition:none;transition:none;}
.unlock input[type="checkbox"]:checked + label:after{content:'';-webkit-transform:scale(1);transform:scale(1);-webkit-transition:-webkit-transform 200ms ease-out;transition:-webkit-transform 200ms ease-out;transition:transform 200ms ease-out;transition:transform 200ms ease-out,-webkit-transform 200ms ease-out}
.send{cursor:pointer;}

 /*lock*/
.lock{float:left;width:50%; margin:8px 0 0;font-size:15px;}
.unlock{width:125px;position:relative;z-index:1;margin:0}
.sendwf{width:50%; float:left;margin:0;}
.send {width:140px;text-align:center; margin:0 0 0 auto}
.send-mail{width:80px;height:80px; margin:0;background-color:transparent; font-size:14px;text-decoration:none;transition:color .2s,border .2s;cursor:pointer;display:inline-block;line-height:30px;text-align: center;transition: 0.5s;-moz-transition: 0.5s;-webkit-transition: 0.5s;-o-transition: 0.5s;color: #fff;background-color: #231815;border: 2px solid #231815;border-radius: 50%;}
 .send-mail:hover{background-color:transparent;color: #231815;border: 2px solid #231815;transition: 0.5s;-moz-transition: 0.5s;-webkit-transition: 0.5s;-o-transition: 0.5s;}
.cnwarp{width:100%; float:left;font-size: 15px;font-family: "Noto Sans TC", sans-serif;}
.contact-inner{max-width:1400px;margin:0 auto;padding: 100px 0 110px}
.cntitle{width:100%;float:left;font-weight: 500;font-size: 100px;text-align: center; margin-bottom: 50px;line-height:1em;position: relative}
.cntitle::after {content: '';position: absolute;bottom:5px;left: 0;width: 100%; height: 1px; background-color: #ccc}
.cnsubtitle{width:80%; float:left;margin: 0 10% 50px;text-align: center;font-size: 16px;font-family: "Montserrat", "Noto Sans TC", sans-serif;fline-height: 2em;color: #333333;}
.red{color:#e70012; }
.textareabox{width:100%; height:100px;padding:8px 10px; border:1px solid #999;font-size: 15px; box-sizing:border-box;border-radius:0; background-color:transparent;color:#000 !important; line-height:1.5em;}
.leftbar-box{width:70%;float:left;margin: 0 15%}
.forms-a{width:48%; float:left; margin:0 2% 15px 0;}
.forms-b{width:48%; float:left; margin:0 0 15px 2%;}
.forms-c{width:100%; float:left;margin-bottom: 15px;}
.forms-title{float:left; width:100%;margin-bottom: 3px; letter-spacing: 0.1em;font-size: 14px;}
.forms-table{float:left; width:100%; margin:0}
.forms-table input:focus{border-style:solid;border:1px solid #5c6f75;outline: none}
.tableinfo{width:100%; line-height: 46px; padding:0 8px; border:1px solid #b2b6b9;box-sizing:border-box;background-color: transparent; font-size:16px;border-radius: 5px}
.message{float:left;width:100%; margin:0 0 15px 0;}
.message-tx{width:100%; height:100px;padding:10px 10px; border:1px solid #b2b6b9;box-sizing:border-box;background-color:transparent;font-weight:400; font-size:16px;border-radius:5px;}
.message textarea:focus{border:1px solid #5c6f75;outline: none}
.inquiredname{float:left; width:100%;margin: 8px 0 8px}
.time-tag{ width:9%;float:left;margin:0 1% 0 0;line-height:34px;font-size: 15px;letter-spacing: 0.1em;}
.baseinfo{float:left; width:90%;}
.baseinfo ul{margin:0; padding:0; list-style:none; } 
.baseinfo li{width:auto;margin:0 25px 10px 0; display: inline-block; line-height:34px;}
.address-from{width:100%;float:left;font-size: 14px;line-height: 46px;}
.address-from select{height:46px;width:100%; border:1px solid #b2b6b9;box-sizing:border-box;background-color: transparent; font-size:14px;border-radius: 5px}
@media only screen and (max-width: 1600px) {
.contact-inner{max-width:1200px;padding: 70px 0}
.cntitle{font-size: 85px}
.cntitle::after{position: absolute;bottom:4px;}	
.leftbar-box{width:80%;margin: 0 10%}
}
@media only screen and (max-width: 1280px) {
.contact-inner{max-width:88%;padding: 55px 0}
.cntitle{font-size: 65px}
.cntitle::after{position: absolute;bottom:3px;left: 0;}	
.send-mail{font-size:16px;}
.cnsubtitle{width:85%; margin: 0 7.5% 50px;}
.leftbar-box{width:85%;margin: 0 7.5%}	
.tableinfo{padding:0;}
}
@media only screen and (max-width: 980px) {
.contact-inner{max-width:90%;padding: 50px 0}
.textareabox{height:90px;}
.cntitle{font-size: 55px;margin-bottom: 40px}
.cnsubtitle{width:90%; margin: 0 5% 40px;}
.leftbar-box{width:90%;margin: 0 5%}	
.time-tag{ width:14%;margin:0 1% 0 0;}
.baseinfo{width:85%;}
}  
@media only screen and (max-width: 767px) {
.contact-inner{padding: 30px 0}
.cnbox{width:90%; margin:0 5%;}
.lock{margin:5px 0 0 0;}
.unlock{margin:0 0 15px 0;}
.textareabox{height:80px;}
.send {width:120px}
.send-mail{width:70px; height: 70px}
.cntitle{font-size: 34px;margin-bottom: 25px}
.cntitle::after{position: absolute;bottom:1px;left: 0;}	
.cnsubtitle{width:100%; margin: 0 0 30px;}
.leftbar-box{width:100%;margin: 0}
.forms-a{width:100%;margin:0 0 15px 0;}
.forms-b{width:100%;margin:0 0 15px 0}
.time-tag{ width:100%;margin:-5px 0 0 0;}
.baseinfo{width:100%;}
}

div.text-warning{margin: 2px 0 -10px 0;color: #c14948;font-size: 15px;display:block;padding: 0;}
span.text-warning{margin: 2px 0px 0px 0px;color: #c14948;font-size: 15px;padding:0;}
.hidden-input {opacity: 0;position: absolute;z-index: -1;}
input[type=checkbox]+span {display: inline-block;height: 13px;width: 13px;border-radius: 50px; margin:0 5px 0 0;background-color: #fff; border: 1px solid #555}
input[type=checkbox]:checked+span {background-color:#555;}
input::-webkit-input-placeholder {color:#000;}
input:-moz-placeholder {color: #000;}
input::-moz-placeholder {color: #000;}
input:-ms-input-placeholder {color: #000;}
input:-webkit-autofill,select:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset !important;} 
input:-webkit-autofill,textarea:-webkit-autofill,
select:-webkit-autofill {background-color: transparent!important;background-image: none !important;-webkit-box-shadow: 0 0 0 1000px #fff inset !important; border:1px solid #999; outline: none}
input:-webkit-autofill{-webkit-text-fill-color:#000;}
textarea::-webkit-input-placeholder {color:#000;}
textarea:-moz-placeholder {color: #000;}
textarea::-moz-placeholder {color: #000;}
textarea:-ms-input-placeholder {color: #000;}
textarea:-webkit-autofill,select:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px white inset !important;  } 
textarea:-webkit-autofill{-webkit-text-fill-color:#000;}
textarea{resize:vertical;}