﻿div.contact-container{padding:100px 0px 100px 0px;background-color:#eeeded;}
div.storage-frame{position:relative;}
div.storage-frame p{font-family:'Segoe UI',Arial,sans-serif;font-size:24px;font-weight:lighter;position:absolute;bottom:-50px;width:100%;text-align:center;color:#535659;}
div.storage-frame p b{display:inline-block;padding:0 0 0 5px;letter-spacing:-1px;color:#ff9000;}
div.storage-frame div{margin:100px 0px;height:250px;background-size:contain;}
div.storage-finish div{background:url(../images/send-message.png) no-repeat center;}
div.storage-error div{background:url(../images/send-message-error.png) no-repeat center;}

/* CONTACT-INFO */
div.organization-info{margin:0px 0 0 300px;}
div.organization-info div.organization-wrapper{position:relative;}
div.organization-info p{line-height:28px;}
div.organization-info p.en-us{font-family:"Roboto-Light",Arial,sans-serif;font-size:22px;color:#636669;}
div.organization-info p.zh-tw{font-size:18px;color:#636669;}
div.organization-info p.og-addresses{font-size:13px;}
div.organization-info p.og-addresses span.og-postal-code{padding:0px 3px;display:inline-block;}
div.organization-info p.og-addresses dfn{font-style:normal;}
div.organization-info p.og-email a{padding:0 0 0 2px;font-family:Roboto,Arial,sans-serif;font-size:17px;color:#01C201;}
div.organization-info p.og-email a:hover{text-decoration:underline;color:#cc3300;}
div.organization-info p.og-telphone b{font-family:Roboto,Arial,sans-serif;font-size:17px;color:#01C201;font-weight:normal;}
div.organization-info p span.og-places{width:78px;font-size:13px;color:#636669;white-space:nowrap;margin:0 0 0 5px;padding:0px 5px 0px 25px;background:url(../images/places.png) no-repeat 3px center;display:inline-block;transition:padding,background .2s ease;}
div.organization-info p span.og-places:hover{padding:0px 10px 0px 20px;color:#fff;background-color:#d09626;background-position:-30px center;}

/* QR-code-icon */
div.organization-info div.og-qr-code{width:42px;height:42px;position:absolute;top:6px;left:-60px;background:url(../images/QR-code-icon.png?ver=1.0) no-repeat center;border-width:0;transition:all .2s ease;}
div.organization-info div.og-qr-code:hover{cursor:pointer;}
div.organization-info div.og-qr-code-short{width:260px;height:260px;top:24px;left:0px;background:url(../images/QR-code.png?ver=1.0) no-repeat center;border:50px solid #303336;z-index:2;}
div.organization-info div.og-qr-code-short:after{content:"";width:30px;height:30px;position:absolute;top:-38px;right:-38px;background:url(../images/cancel.png?ver=1.0) no-repeat center;z-index:3;}

/* CONTACT FORM for ZH-TW & EN-US */
div.contact-form-container{margin:60px 0 0px 200px;}
div.contact-form-container p.ws{font-size:13px;margin:0 0 30px 95px;padding:0 0 0 0;color:#636669;}
div.contact-form-container form{margin:0 0 0 0;}
div.contact-form-container form ul.c{margin:0;padding:0;}
div.contact-form-container form li{padding:2px 0 2px 0;}
div.contact-form-container form li span{font-size:15px;line-height:28px;width:95px;padding:0px 8px 0 0;text-align:right;color:#535659;display:inline-block;}
div.contact-form-container form li span.contents{vertical-align:top;}
div.contact-form-container form li span.important em{width:18px;font-family:Roboto,Arial,sans-serif;font-size:19px;color:#dd3300;font-style:normal;text-align:center;display:inline-block;position:relative;}
div.contact-form-container form li input.contact-text{font-family:'微軟正黑體','STHeitiTC-Light',Arial,sans-serif;font-size:16px;display:inline-block;height:28px;line-height:28px;padding:0 3px 0 3px;vertical-align:middle;color:#232629;border:1px solid #c5c9cc;border-radius:2px;background-color:#fff;-webkit-appearance:none;}
div.contact-form-container form li input.contact-text:focus{border:1px solid #a3a6a9;border-radius:0;}
div.contact-form-container form li input[name=Company]{width:400px;}
div.contact-form-container form li input[name=Name]{width:280px;}
div.contact-form-container form li input[name=Email]{width:280px;}
div.contact-form-container form li input[name=Telephone]{width:280px;}
div.contact-form-container form li input[name=Faxes]{width:280px;}
div.contact-form-container form li input[name=Mobile]{width:280px;}
div.contact-form-container form li input[name=Website]{width:280px;}
div.contact-form-container form li input[name=Address]{width:580px;}
/* SUBMIT */
div.contact-form-container form li input.send-message{line-height:48px;transition:all .2s linear;color:#939699;}
div.contact-form-container form li input.send-message{display:inline-block;width:200px;height:52px;margin:1px 0 0 0;padding:0 0 0 5px;border-width:0;border-radius:3px;background-color:#c3c6c9;-webkit-appearance:none;}
div.contact-form-container form li input.en-us{font-family:Roboto,Arial,sans-serif;font-size:18px;}
div.contact-form-container form li input.zh-tw{font-family:"微軟正黑體","STHeitiTC-Light",Arial,sans-serif;font-size:19px;letter-spacing:3px;}
div.contact-form-container form li input.go{width:260px;color:#fff;background-color:#01C201;}
div.contact-form-container form li input.go:hover{color:#fff;border-radius:0;background-color:#0083f5;}
/* /SUBMIT */
div.contact-form-container form li select{font-family:'微軟正黑體','STHeitiTC-Light',Arial,sans-serif;font-size:14px;margin-right:1px;padding:3px;border:1px solid #c5c9cc;border-radius:2px;background-color:#fff;box-sizing:content-box;}
div.contact-form-container form li select.onloaging{background:url(../images/loading-min.gif) no-repeat 12px 50%;}
div.contact-form-container form li select[name=sCity]{width:135px;}
div.contact-form-container form li select[name=sArea]{width:136px;}
div.contact-form-container form li select[name=sRoad]{width:140px;}
div.contact-form-container form li select[name=sNum]{width:142px;}
div.contact-form-container form li select[name=Country]{width:280px;font-family:Roboto,Arial,sans-serif;font-size:16px;}
div.contact-form-container form li select:focus{border:1px solid #a3a6a9;}
div.contact-form-container form li select optgroup{display:block;margin:10px 0 0 0;color:#535659;background-color:#ffffe0;}
div.contact-form-container form li select option{padding:0 0 0 20px;color:#232629;background-color:#fff;}
div.contact-form-container form li select.onloaging option{background-color:transparent;}
div.contact-form-container form li.choice-address strong.post-number{font-family:Arial,sans-serif;font-size:14px;padding:0 0 0 10px;color:#b52d3f;}
div.contact-form-container form li.choice-address strong.post-number.onloaging{background:url(../images/loading-min.gif) no-repeat 12px 50%;}
div.contact-form-container form li select option.country-select-choice{color:#818385;}
div.contact-form-container form li textarea{font-family:'微軟正黑體','STHeitiTC-Light',Arial,sans-serif;font-size:16px;width:580px;min-height:150px;max-height:500px;padding:3px;resize:vertical;color:#232629;border:1px solid #c5c9cc;background-color:#fff;-webkit-appearance:none;}
div.contact-form-container form li textarea:focus{border:1px solid #a3a6a9;}
div.contact-form-container form li textarea.x{background-color:#ffffe8;}
div.contact-form-container form li dfn{font-style:normal;line-height:28px;display:inline-block;height:28px;margin:0 0 0 1px;padding:0 10px 0 10px;transition:background .25s linear;vertical-align:middle;color:#fff;}
div.contact-form-container form li dfn b{font-family:Roboto,Arial,sans-serif;font-size:16px;font-weight:normal;letter-spacing:1px;}
div.contact-form-container form li dfn.x{background-color:#ad4b4e;}
div.contact-form-container form li input.x{background-color:#ffffe8;}

/* SERVER-CONTACT */
div.server-contact{padding:30px 0px 30px 0px;background-color:#3f65a8;}
div.server-contact ul{width:92%;margin:0px auto;}
div.server-contact ul li{width:50%;display:inline-block;}
div.server-contact ul li p.company{font-size:16px;font-weight:bold;}
div.server-contact ul li p{color:#fff;line-height:1.6em;}
/* SERVER-CONTACT */
@media (min-width:980px) and (max-width:1279px) {
 div.organization-info{margin:80px 0 0 180px;}
 div.contact-form-container{margin:60px 0 100px 80px;}
}
@media (min-width:768px) and (max-width:979px){
 div.organization-info{margin:80px 0 0 100px;}
 div.contact-form-container{margin:60px 0 100px 0;}
}
@media (max-width:767px){
 div.contact-container{padding:1px 0px 100px 0px;}
 div.organization-info{margin:35px 0 25px 0;padding:0 0 30px 3%;border-bottom:10px solid #c3c6c9;}
 div.organization-info span.og-faxnumber{display:block;}
 /*div.organization-info span.og-faxnumber:before{content:'公司';}*/
 div.organization-info div.og-qr-code{display:none;}
 div.contact-form-container{width:96%;margin:0 2% 50px 2%;}/*控制寬度*/
 div.contact-form-container form li.addresses span{margin-top:0px;}
 div.contact-form-container form li.choice-address{margin-top:20px;position:relative;}
 div.contact-form-container form li.choice-address strong.post-number{position:absolute;bottom:-25px;right:5px;}
 div.contact-form-container form li dfn{display:none;}
 div.contact-form-container form li dfn.x{margin:0 0 0 1%;width:98%;box-sizing:border-box;display:block;}
 div.contact-form-container form li span{width:100%;margin:10px 0 0 0;padding:0 0 0 2px;text-align:left;display:block;}
 div.contact-form-container form li span.important{padding:0;}
 div.contact-form-container form li input.contact-text{margin:0;padding:0 3px;width:100%;line-height:38px;height:38px;display:block;box-sizing:border-box;}
 div.contact-form-container form li input.send-message{display:block;width:50%;height:60px;line-height:60px;margin:0 auto;}
 div.contact-form-container form li select{height:38px;box-sizing:border-box;display:block;}
 div.contact-form-container form li select[name*=s]{width:100%;margin:2px 0;padding:3px;}
 div.contact-form-container form li select[name=Country]{width:100%;margin:0;padding:3px;}
 div.contact-form-container form li select[disabled=disabled]{display:none;}
 div.contact-form-container form li textarea{margin:0;width:100%;display:block;box-sizing:border-box;}
 div.storage-frame div{margin:50px auto;width:80%;max-width:325px;background-size:contain;}
 div.storage-frame p{font-size:15px;}
 div.organization-info div.organization-wrapper{padding-right:10px;}
}
@media (max-width:460px){
 div.organization-info p{line-height:30px;}
 div.organization-info p:lang(en-US).en-us{font-size:22px;color:#535659;font-weight:bold;line-height:40px;}
 div.organization-info p:lang(zh-TW).en-us{font-size:17px;color:#535659;}
 div.organization-info p:lang(zh-TW).zh-tw{font-size:30px;line-height:1.5em;}
 div.organization-info p.og-addresses{font-size:14px;}
 div.organization-info p.og-addresses dfn{display:block;}
 div.organization-info p.og-email a{display:block;}
 div.organization-info p span.og-places{margin:10px 0 10px 0px;display:block;}
 div.organization-info p.og-telphone b{display:block;}
 div.contact-form-container form li input.send-message{width:75%;}
}
@media (max-width:680px){
 div.server-contact ul li{width:100%;padding:15px 0px 0px 0px;display:block;}
 div.server-contact ul li p{text-align:center;}
}