.web_main{padding-bottom: 0;}

/* contact_box */
.contact_list{margin-top: 3%;}
.contact_item{width: 32%; margin-right: 2%; border: 1px solid rgba(var(--comColorRgb), 0.5); text-align: center; padding: 4% 18px 3%;}
.contact_item:last-child{margin-right: 0;}

.contact_item .item_icon{width: 70px; height: 70px; display: block; margin: 0 auto; background-repeat: no-repeat; background-position: center; background-size: 100% auto;}
.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_whatapp.png);}
.item_icon_email{background-image: url(../img/c_email.png);}
.item_icon_add{background-image: url(../img/c_add.png);}

.contact_item .title{color: #666; margin: 20px 0 0;}
.contact_item .con_info{font-size: 20px; margin-top: 6px; line-height: 1.25;}
.contact_item .con_info a{transition: color 0.3s ease; color: inherit;}


.contact_item:hover{border-color: var(--commonColor); background: var(--commonColor); color: #fff;}
.contact_item:hover .title{color: #fff;}
.contact_item:hover .con_info{color: #fff;}
.contact_item:hover .item_icon{animation: swing 0.5s;}
.contact_item:hover .item_icon_phone{background-image: url(../img/c_phone_h.png);}
.contact_item:hover .item_icon_fax{background-image: url(../img/c_fax_h.png);}
.contact_item:hover .item_icon_whatsapp{background-image: url(../img/c_whatapp_h.png);}
.contact_item:hover .item_icon_email{background-image: url(../img/c_email_h.png);}
.contact_item:hover .item_icon_add{background-image: url(../img/c_add_h.png);}

@media only screen and (max-width: 1200px) {
	.contact_list{flex-wrap: wrap;}
	.contact_item{width: 48%; margin-bottom: 20px;}
	.contact_item:nth-child(2n){margin-right: 0;}
	.contact_item .item_icon{width: 64px; height: 64px;}
	.contact_item .con_info{font-size: 18px;}
}
@media only screen and (max-width: 980px) {
	.contact_list{margin-top: 16px;}
	.contact_item{width: 49%; padding: 26px 16px 20px; margin-bottom: 16px;}
	.contact_item:nth-child(3n){margin-right: 2%;}
	.contact_item:nth-child(2n){margin-right: 0;}
	.contact_item .item_icon{width: 56px; height: 56px;}
}
@media only screen and (max-width: 760px) {
	.contact_item{width: 100%; margin-right: 0;}
	.contact_item:nth-child(3n){margin-right: 0;}
	.contact_item:nth-child(2n){margin-right: 0;}
	.contact_item:last-child{margin-bottom: 0;}
}

/* contact_form */
.form_left{width: 38%; padding-bottom: 3%;}
.form_left .web_th .title{text-transform: capitalize;}
.form_right{width: 55%;}
.form_right .pic{padding-bottom: 88.5%;}
.form_div{margin-top: 30px;}
.input_item{width: 100%; margin-bottom: 5%;}
.form_input .input_item:nth-child(-n+2){width: 47%;}
.form_input .input_item:last-child{margin-bottom: 0;}
.input_item p span{color: #ED2736; padding-right: 5px; margin-left: -11px;}
.input_item input, .input_item textarea{border-radius: 0; border: none; border-bottom: 1px solid #999; width: 100%; font-size: 16px; height: 36px; line-height: 36px; margin-top: 4px; font-family: 'AkzidenzGroteskBQ-Light';}
.input_item textarea{line-height: 28px; height: 112px; margin-top: 10px;}

.form_btn .submit_btn{background: #000; color: #fff; line-height: 28px; padding: 8px 60px; height: 44px; width: auto; font-size: 16px; margin: 8% 0 0; transition: all 0.3s ease; font-family: 'AkzidenzGroteskBQ-Light'; border: none;}
.form_btn .submit_btn:hover{background: var(--commonColor);}

@media only screen and (max-width: 950px) {
	.contact_form .layout{flex-direction: column;}
	.form_left{width: 100%; order: 2; margin-top: 20px; padding-bottom: 30px;}
	.form_right{width: 100%; order: 1;}
	.form_right .pic{padding-bottom: 75%;}
	.form_input .input_item:nth-child(-n+2){width: 100%;}
	.input_item{width: 100%; margin-bottom: 15px;}
	.form_btn .submit_btn{margin-top: 15px;}
	.form_div{margin-top: 20px;}
	.form_left .web_th .title{font-size: 24px;}
}


/* contact_map */
.contact_map iframe{display: block; width: 100%; height: 700px;}

@media only screen and (max-width: 1450px) {
	.contact_map iframe{height: 650px;}
}
@media only screen and (max-width: 1350px) {
	.contact_map iframe{height: 610px;}
}
@media only screen and (max-width: 1200px) {
	.contact_map iframe{height: 580px;}
}
@media only screen and (max-width: 950px) {
	.contact_map iframe{height: 320px;}
}