.main-contact{ margin:0px; padding:0px; }
.contact-wrap{width: 100%;  margin: auto; display: flex; flex-wrap: nowrap;  position: relative; }
.contact-detail{width:100%; padding: 10px; margin:0px auto;  display: flex; flex-wrap: wrap;  justify-content: flex-end  }
.contact-detail-txt {width:100%;  padding:60px 0px 20px 0px; margin:auto;   }
.contact-detail-box{width:50%; margin:auto 100px auto 0px}
.contact-detail-txt p{font-size:1.125rem;  font-size: min(max(3.5vw, .875rem), 1.125rem); line-height:2rem; font-weight:400;  margin-bottom: 10px;   }
.contact-map{width: 30%; margin:auto; border-radius:0px; overflow: hidden }
.contact-map iframe{width: 100%; min-height:20vh;margin:0px auto 30px auto; }
.contact-box{ width:calc(100% - 30%); }
.contact-line{ width: 100%; display: flex; flex-wrap: wrap; margin: 1% auto; padding:5px 10px 10px 10px;font-size: 1rem; border-bottom: solid 1px #fff; align-content: center; align-items: center; }
.contact-title{ width: 25%; font-size: 1rem; font-weight: 700; color: #000;  }
.contact-name{ width: 75%;  font-size:1rem; font-weight: 400; line-height: 1.75rem;   }
.contact-name a{color: #000;}
@media (max-width: 1024px) {
.contact-detail-txt{  max-width: 100%; padding:10px 20px 50px 20px;  }
}
@media (max-width: 992px) {
.contact-box{ width:100%;   }
.contact-detail{width:100%; } 
.contact-map{width: 100%;  border-radius:40px 40px 0px 0px;}	
.contact-map iframe{width: 100%; min-height:50vh; }
.contact-detail-box{ margin:auto 30px auto 0px}   
}
@media (max-width: 768px) {
.contact-wrap{  flex-wrap:  wrap;   }
.contact-detail-box{ width: 100%; margin:auto 0px}   
.contact-detail-txt p{font-size:.9rem; }
}
@media (max-width: 767.98px) {
.contact-detail{width:100%;  padding:0px;  }
.contact-box{ width:100%; }
.contact-detail-txt{ padding:10px 0px;  }
}



.bg-contact{ padding:0px 0px 50px 0px;   background: url("../images/index/bg.jpg"),linear-gradient(to bottom, #fff 20%, #fff 100% ); background-position: left 23vh,left top;  background-repeat: no-repeat ;background-size: 100% auto;  }
@media (max-width: 1024px) {
.bg-contact{ padding:20px 0px 0px 0px;background: none;    }	 
}
 
/*----------------------------------------/
title樣式5
----------------------------------------*/
.title-h2-sub{  margin: auto;}
.title-h2-sub h2{ color:#004098;font-size: 1.75rem;  font-size: min(max(3.5vw, 1.125rem), 1.75rem);  line-height: 130%;font-weight: 700; letter-spacing: 3px; margin-bottom: 20px; text-transform:uppercase}
.title-h2-sub span{ display: block; margin:10px auto 30px auto;font-size: 1.5rem;font-size: min(max(3.5vw, 1rem), 1.5rem); line-height: 130%;font-weight: 700; color: #555; text-transform:uppercase  }
.title-h2-sub p{ font-size:1.125rem;  font-size: min(max(3.5vw, 1rem), 1.125rem); line-height:1.75rem; font-weight:700; color: #000;}
@media (max-width: 998px) {
.title-h2-sub{text-align: left; padding-left: 20px;} 
}
@media (max-width: 768px) {
.title-h2-sub{ padding-left: 0px;} 
}



.ph { width: 30px; height: 30px;}
.ph img{ width: 100%; height: 100%;}
.contactform-container {display: flex; flex-direction: column; padding: 30px 2rem; }
.contactform-row {display: flex;}
.contactform-input-container { flex: 1; margin: 1.25rem;  height: 2.813rem; width: 25rem; display: flex; align-items: center; border-radius: 10px; border: 1px solid rgba(87, 87, 86, .5); overflow: hidden;  margin: 0 1.25rem 1.25rem 0;}
.contactform-textarea-container { flex: 1; margin: 1.25rem; display: flex; align-items: center; border-radius: 10px; border: 1px solid rgba(87, 87, 86, .5); overflow: hidden; margin: 0 1.25rem 1.25rem 0;}
.contactform-input-container i {  width: 30px; height: 100%; padding-left: .906rem;}
.contactform-input-container input,.contactform-input-container select { border: none; outline: none;  width: 100%;  height: 100%;}
.contactform-input-container select { background: none!important; padding-left: .906rem;   -webkit-appearance: none !important; -moz-appearance: none !important;  appearance: none !important; background-position: calc(100% - .3125rem) center !important; padding-right: 1.25rem; color: #575756;}
.contactform-input-container input {  padding: .75rem .906rem .75rem .75rem;}
.contactform-textarea-container textarea { height: 8.439rem; width: 100%; resize: none; outline: none; border: none;  padding: .75rem .906rem; color: #575756;}
.contactform-checkbox { margin-right: .625rem; margin-bottom: 0 !important;}
.searchbar-inquire-button { padding: 1rem 2rem;  margin-right: 1rem; color: #FFFFFF; background-color: #C8102E; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 0.95rem; font-weight: 700;  transition: 0.5s ease; text-decoration: none; width: 10rem; height:3rem;}
.searchbar-inquire-button:hover {  background-color:#555; box-shadow: 0px 8px 8px rgba(0,0,0,.3); -webkit-transition: all 0.3s;transition: all 0.3s; }
.contactform-button { margin-top: 1.25rem; border: none;}
@media (max-width: 768px) {
.contactform-container { padding: 30px 0px 30px 30px; }
}
@media (max-width: 767.98px) {
.contactform-container { padding: 30px 0px; }   
.contactform-row { flex-direction: column;}
.contactform-input-container {  width: 100%; margin: 0 0 1.25rem 0; }
.contactform-input-container select {  padding: .615rem; }
.contactform-textarea-container {  margin: 0 0 1.25rem 0;}
.contactform-input-container.full	{  margin: 0 0 1.25rem 0;} 
}