/* .contact_item .shareBtn img{
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
} */

/* contact_step */
.contact_step .title{text-transform: none;}
.contact_step .brief a{color: var(--commonColor);}
.contact_step .brief a:hover{text-decoration: underline;}

.step_div{margin: 4% 0 0;}
.step_div .step_item{width: 150px; padding-right: 40px; position: relative; margin-right: 30px; box-sizing: unset;}
.step_div .step_item::before{position: absolute; content: ''; width: 32px; height: 32px; background: url(../img/icon_ser.png) no-repeat center; background-size: 32px auto; right: 0; top: 30px; }
.step_div .step_item:last-child{padding-right: 0; margin-right: 0;}
.step_div .step_item:last-child::before{display: none;}
.step_div .step_item .item_icon{width: 92px; height: 92px; border-radius: 50%; box-shadow: 0px 0px 17px 0px rgba(0,0,0,0.13); background: #fff; position: relative; padding-top: 32px; margin: 0 auto;}
.step_div .step_item .order{position: absolute; top: 0; right: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--commonColor); color: #fff; text-align: center; line-height: 30px; font-size: 14px; z-index: 1;}
.step_div .step_item img{display: block; height: 28px; margin: 0 auto 0;}
.step_div .step_item .title{line-height: 22px; text-align: center; margin-top: 14px;}

.step_div .step_item:hover img{animation: swing 0.5s;}
.step_div .step_item:hover .order{animation: bounceInA 0.5s;}

@media only screen and (max-width: 980px) {
	.step_div{flex-wrap: wrap; justify-content: flex-start; margin: 30px 0;}
	.step_div .step_item{width: 50%; box-sizing: border-box; margin-right: 0; padding-right: 30px;}
	.step_div .step_item:last-child{padding-right: 30px;}
	.step_div .step_item::before{right: 4px; background-size: 26px auto; width: 26px; height: 26px;}
	.step_div .step_item:nth-child(n+3){margin-top: 24px;}

	.step_div .step_item .item_icon{width: 80px; height: 80px; padding-top: 25px;}
}

/* contact_box */
.contact_box{position: relative; z-index: 1;}
.contact_inner{box-shadow: 0px 20px 29px 0px rgba(0,0,0,0.16); padding: 20px 3.5% 4.5%; position: relative; background: #fff;}
.contact_inner::before{position: absolute; left: 50%; top: 10%; height: 70%; width: 1px; content: ''; background: #e5e5e5;}
.contact_info{width: 46%;}
.contact_info .web_th .title{color: var(--commonColor);}
.contact_list{margin-top: 3%;}
.contact_item{margin-bottom: 5%; position: relative; padding-left: 52px;}

.contact_item .item_icon{width: 36px; height: 36px; display: block; margin: 0 auto; background-repeat: no-repeat; background-position: center; background-size: 100% auto; position: absolute; left: 0; top: 6px;}
.item_icon_phone{background-image: url(../img/c_phone.png);}
.item_icon_fax{background-image: url(../img/c_fax.png);}
.item_icon_whatsapp{background-image: url(../img/c_whatsapp.png);}
.item_icon_email{background-image: url(../img/c_email.png);}
.item_icon_add{background-image: url(../img/c_add.png);}

.contact_item .title{margin: 20px 0 0;}
.contact_item .con_info{margin-top: 4px; line-height: 1.25;}
.contact_item .con_info a{transition: color 0.3s ease; color: inherit;}
.contact_item .con_info a:hover{color: var(--commonColor);}

.contact_item:hover .item_icon{animation: swing 0.5s;}

.contact_icon{margin: 8% 0 0;}
.contact_icon .shareBtn{display: inline-block; width: 42px; height: 42px; border-radius: 50%; background: #000; padding: 6px; margin-right: 5%;}
.contact_icon .shareBtn:last-child{margin-right: 0;}
.contact_icon .shareBtn:hover{background: var(--commonColor);}
.contact_icon .shareBtn:hover img{animation: swing 0.5s;}

@media only screen and (max-width: 980px) {
	.contact_inner{flex-direction: column; padding: 6px 20px 30px;}
	.contact_inner::before{width: 0;}
	.contact_item{padding-left: 48px;}
	.contact_info{width: 100%;}
	.contact_icon .shareBtn{width: 38px; height: 38px; padding: 6px; margin-right: 15px;}
}

/* contact_form */
.contact_form{}

.table_wrap{width: 100%; overflow-x: auto; padding-bottom: 2px;}
.form_table tr th, .form_table tr td{border: none; background: none; padding: 0;}
.form_table tr th, .form_table tr td{padding-right: 8px; font-weight: normal;}
.form_table tr th:last-child, .form_table tr td:last-child{padding-right: 0;}
.form_table tr th span{display: block; background: #F7F7F7; line-height: 26px; padding: 10px; min-height: 46px; text-align: center; color: #666;}
.form_table tr th span em{color: #ED2736; margin-right: 1px;}

.form_table tr td input.txt{border: 1px solid #E5E5E5; background: #fff; padding: 0 15px; height: 44px; line-height: 44px; width: 100%; margin-top: 15px; font-size: 14px;}
.form_table tr td:last-child{text-align: center;}
.form_table tr td .remove_item{display: inline-block; height: 32px; line-height: 32px; background: #830000; color: #fff; padding: 0 30px; border: none; text-align: center; margin: 15px 0 0; width: auto; font-size: 14px; transition: all 0.4s ease;}
.form_table tr td .remove_item:hover{opacity: 0.8;}

.add_item{display: inline-block; height: 32px; line-height: 32px; padding: 0 24px; background: var(--commonColor); margin-left: 3.5%; margin-top: 15px; cursor: pointer; transition: all 0.4s ease;}
.add_item:hover{background: var(--secondColor);}
.add_item span{display: block; padding-left: 20px; background: url(../img/icon_plus_c.png) no-repeat left center; background-size: 14px auto; color: #fff; font-size: 14px;}

@media only screen and (max-width: 1200px) {
	.form_table tr td .remove_item{padding: 0 20px;}
	.form_table tr td input.txt{padding: 0 10px;}
}
@media only screen and (max-width: 980px) {
	.form_table tr th span{white-space: nowrap; min-width: 110px; min-height: 42px; padding: 8px 10px;}
	.form_table tr th, .form_table tr td{padding-right: 6px;}
	.form_table tr td .remove_item{padding: 0 16px;}
	.form_table tr td input.txt,
	.form_table tr td .remove_item{margin-top: 12px;}
	.add_item{margin-left: 0;}
	.form_table tr td input.txt{height: 40px; line-height: 40px;}
}

.form_input{margin-top: 6px;}
.form_input .input_item{width: 32%; margin-top: 26px; position: relative; background: #F7F7F7;}
.form_input .input_item:nth-child(n+7){width: 48.5%;}
.input_item p span{color: #ED2736; padding-right: 5px;  position: absolute; left: 18px; top: 15px;}
.input_item input, .input_item textarea, .input_item select{border-radius: 0; border: none; width: 100%; font-size: 16px; height: 46px; line-height: 46px; margin-top: 0; background: #F7F7F7; padding: 0 20px 0 34px; color: #666;}
.input_item textarea{line-height: 28px; height: 112px; margin-top: 10px;}
.input_item select{color: ;}

.form_btn{text-align: center; margin-top: 3%;}
.form_btn .submit_btn{background: var(--commonColor); color: #fff; line-height: 40px; padding: 0 80px; height: 40px; width: auto; font-size: 16px; transition: all 0.3s ease; border: none;}
.form_btn .submit_btn:hover{background: var(--secondColor);}

@media only screen and (max-width: 1100px) {
	.form_input .input_item{width: 48.5%;}
}
@media only screen and (max-width: 980px) {
	.contact_form{width: 100%; margin-top: 24px;}
	.form_input{margin-top: 0;}
	.form_input .input_item{width: 100% !important; margin-top: 16px;}
	.input_item input, .input_item select{padding: 0 15px 0 25px;}
	.input_item p span{left: 12px;}
	.form_btn{margin-top: 20px;}
}

/* coninfo_box */
.coninfo_box{background: #F7F7F7; padding: 5% 0; margin-top: 4%;}
.coninfo_item{width: 48%;}
.coninfo_item .pic{padding-bottom: 55%;}
.coninfo_item .title{font-size: 20px; font-weight: bold; margin: 16px 0 14px;}
.coninfo_item .coninfo_row{margin-top: 10px; padding-left: 30px; font-size: 18px; position: relative; line-height: 28px;}
.coninfo_item .coninfo_row::before{position: absolute; width: 18px; height: 28px; left: 0; top: 0; content: ''; background-position: center; background-repeat: no-repeat; background-size: 17px auto;}

.coninfo_item .row_tel::before{background-image: url(../img/icon_tel.png);}
.coninfo_item .row_email::before{background-image: url(../img/icon_email.png);}
.coninfo_item .row_add::before{background-image: url(../img/icon_add.png);}
.coninfo_item .coninfo_row a,
.coninfo_item .coninfo_row span{font-size: 18px; color: #666;}
.coninfo_item .coninfo_row a:hover{color: var(--commonColor); text-decoration: underline;}

.coninfo_item .coninfo_row:hover::before{animation: swing 0.5s;}

@media only screen and (max-width: 980px) {
	.coninfo_box{padding: 30px 0; margin-top: 30px;}
	.coninfo_inner{flex-direction: column;}
	.coninfo_item{width: 100%;}
	.coninfo_item:nth-child(n+2){margin-top: 20px;}
}