@charset "utf-8";

/* CSS Document */







/*----- 關於我們 -----*/

.aboutArea {

	padding: 80px 0 90px;

	background: url(../images/tw/about-bg.jpg) no-repeat center #f2f7fa;

}



.aboutTitle {

	font-size: 40px;

	color: #09396b;

	font-weight: bold;

	margin-bottom: 35px;

	position: relative;

}



.aboutImg {

	float: right;

	margin: 5px 0 40px 5%;

}







/* 公司特點 */

.featureBox {

	margin-top: 80px;

}



.featureBox .col-md-3 {

	padding-left: 35px;

	padding-right: 35px;

	text-align: center;

}



.featureBox p {

	font-size: 53px;

	color: #1161b4;

	font-weight: 500;

	line-height: 1.5;

	font-family: 'Rubik', 微軟正黑體, 新細明體, sans-serif;

}



.featureBox h3 {

    font-size: 20px;

	color: #000;

	font-weight: bold;

}





/* 歷史沿革 */

.historyArea {

	padding: 75px 0 100px;

	background-color: #fff;

}



.historyTitle:after {

	content: " ";

	display: block;

	width: 110px;

	height: 3px;

	background: #c06b1b;

	position: absolute;

	bottom: -12px;

	left: 50%;

	margin-left: -55px;

}



.historyWrap {

	width: 90%;

	margin: 0 auto;

	padding-top: 50px;

}



.historyBox + .historyBox .historyCon {

    padding-top: 31px;

}



.historyCon {

    display: -webkit-flex;

    display: -ms-flexbox;

    display: flex;

    position: relative;

}



.historyCon::before {

    content: '';

    position: absolute;

    width: 2px;

    height: 100%;

    top: 1px;

    left: 122px;

    z-index: 1;

    background-color: #1161b4;

}



.historyCon .year {

    -webkit-flex: 0 0 150px;

    -ms-flex: 0 0 150px;

    flex: 0 0 150px;

    position: relative;

    text-align: left;

    font-size: 30px;

    color: #1161b4;

	font-weight: 500;

    z-index: 2;

	line-height: 20px;

	font-family: 'Rubik', 微軟正黑體, 新細明體, sans-serif;

}



.historyCon .year::after {

    content: '';

    position: absolute;

    width: 16px;

    height: 16px;

    top: 1px;

    right: 19px;

    border-radius: 50%;

    border: 2px solid #1161b4;

    background-color: #fff;

}



.historyTxt {

	font-weight: normal;

    -webkit-flex-grow: 1;

    flex-grow: 1;

    display: -webkit-flex;

    display: -ms-flexbox;

    display: flex;

    -webkit-align-items: flex-start;

    -ms-flex-align: flex-start;

    align-items: flex-start;

    margin: -4px 0 0 40px;

	padding-bottom: 25px;

	border-bottom: 1px solid #dedede;

	line-height: 28px;

}



.historyTxt img {

	display: block;

	margin: 20px 0 7px;

}









/*----- 聯絡我們 -----*/

.contactWrap {

	width: 1200px;

	margin: 0 auto;

	padding: 0 15px;

}



.contactTitle {

	font-size: 36px;

	color: #000;

	padding-bottom: 8px;

	margin-bottom: 25px;

}



.contactWrap > .row {

	margin: 70px -35px;

}



.contactWrap > .row > .col-md-4 {

	padding-left: 40px;

	padding-right: 40px;

	border-right: 1px solid #cecece;

}



.contactWrap > .row > .col-md-4:last-child {

	border-right: none;

}



.contactWrap .headline {

	font-size: 22px;

	color: #09396b;

	font-weight: bold;

	padding-bottom: 4px;

	line-height: 1.4;

}



.contactWrap .headline i {

	font-size: 26px;

	color: #c06b1b;

	margin-right: 12px;

	vertical-align: text-bottom;

}



ul.contactInfo li {

	margin-top: 2px;

}



ul.contactInfo li a:hover,

ul.contactInfo li.active > a {

	color: #c06b1b;

}





.contactForm {
	padding: 70px 0 95px;
	background: url(../images/tw/contact-bg.jpg) no-repeat center #f6f6f6;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}



.contactTxt {

	margin: 50px 0 45px;

	text-align: center;

	line-height: 1.8;

}



.contactTxt span {

	color: #ec060b;

	margin: 0 2px;

}







/* 表單樣式 */



.form-group {

	margin-bottom: 20px;

	position: relative;

}



.form-column {

	padding: 16px 20px;

	border: 1px solid #d3d3d3;

	background-color: #fff;

}



.form-left,

.form-right {

	width: 48.5%;

	padding: 2px 0 2px 20px;

	border: 1px solid #d3d3d3;

	background-color: #fff;

}



.form-left {

	float: left;

}



.form-right {

	float: right;

}



.form-group label {

	width: 90px;

	font-size: 16px;

	vertical-align: middle;

}



.form-group label.textLabel {

	width: 100%;

	margin-bottom: 10px;

}



.form-field {

	width: -webkit-calc(100% - 95px);

	width: -moz-calc(100% - 95px);

	width: calc(100% - 95px);

	display: inline-block;

	vertical-align: middle;

}



.required {

	font-size: 14px;

	color: #fa0a0a;

	margin-left: 4px;

}



.sex-field {

	padding: 14px 15px;

}



label.radio-inline {

	width: auto;

	margin: 0 20px 0 5px;

	vertical-align:bottom;

}



.input {

	padding: 15px 12px 15px 0;

	border: none;

	background-color: #fff;

}



.input:focus,

.textarea:focus {

	outline: 0;

}



.textarea {

	min-height: 100px;

	padding: 0;

	border: none;

	background-color: #fff;

}



.codeInput {

	width: 70%;

	float: left;

}



.submit {

	width: 25%;

	float: right;

	position: relative;

    z-index: 1;

	margin-top: 18px;

	font-size: 18px; 

	color: #fff;

	display: block;

	padding: 12px 0 10px;

	text-align: center;

	border: none;

	cursor: pointer;

	background-color: #09396b;

	-webkit-transition: all 0.4s ease;

	-moz-transition: all 0.4s ease;

	-o-transition: all 0.4s ease;

	transition: all 0.4s ease;

}



.submit:hover {

	background-color: #c06b1b;

	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);

    transition: top .3s ease-out, background-color .2s ease-out, box-shadow .5s ease-out, color .3s ease-out .2s;

}



.submit::before {

  content: '';

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

  width: 100%;

  height: 0;

  background-color: #c06b1b;

  transition-duration: .3s;

}



.submit:hover::before {

  height: 100%;

  top: auto;

  bottom: 0;

}







@media (max-width: 1399px){



/*----- 關於我們 -----*/



}







@media (max-width: 1199px){



/*----- 聯絡我們 -----*/

.contactWrap {

	width: 100%;

	padding: 0 5%;

}



}







@media (max-width: 991px){



.wrap {

	padding: 0 7%;

}





/*----- 關於我們 -----*/

.featureBox {

	margin-top: 60px;

}



.featureBox .col-md-3 {

	padding-left: 15px;

	padding-right: 15px;

}



.featureBox p {

	font-size: 40px;

}



.featureBox h3 {

    font-size: 18px;

}



.historyWrap {

	width: 100%;

}







/*----- 聯絡我們 -----*/

.contactTitle {

	font-size: 32px;

} 

	

}





@media (max-width: 767px){



/*----- 關於我們 -----*/

.aboutImg {

	float: none;

	margin-left: 0;

}



.featureBox {

	margin-bottom: -40px;

}



.featureBox .col-md-3 {

	margin-bottom: 40px;

}







/*----- 聯絡我們 -----*/

.contactWrap > .row {

	margin-left: 10%;

	margin-right: 8%;

}



.contactWrap > .row > .col-md-4 {

	padding-left: 0;

	padding-right: 0;

	margin-bottom: 50px;

	border-right: none;

}



.contactWrap > .row > .col-md-4:last-child {

	margin-bottom: 0;

}



}





@media (max-width: 575px){



/*----- 關於我們 -----*/

.aboutArea {

	padding: 50px 0 70px;

}



.aboutTitle {

	font-size: 32px;

}



.featureBox {

	margin-top: 45px;

}



.historyArea {

	padding: 60px 0;

}



.historyCon::before {

	left: 90px;

}



.historyCon .year {

    -webkit-flex: 0 0 118px;

    -ms-flex: 0 0 118px;

    flex: 0 0 118px;

    font-size: 26px;

}



.historyTxt {

	margin: -5px 0 0 0;

}







/*----- 聯絡我們 -----*/

.contactWrap > .row {

	margin-top: 50px;

	margin-bottom: 50px;

}



.contactWrap .headline {

	font-size: 20px;

}



.contactWrap .headline i {

	font-size: 24px;

}



.contactForm {

	padding: 50px 0 70px;

}



.form-column {

	padding-left: 13px;

	padding-right: 13px;

}



.form-left,

.form-right {

	width: 100%;

	float: none;

	padding-left: 13px;

}



.form-right {

	margin-top: 20px;

}



.codeInput {

	width: 100%;

	float: none;

}



.submit {

	width: 100%;

	float: none;

	margin-top: 20px;

	font-size: 16px; 

}





}