.img_logo {
    width: 200px;
    height: auto;
    display: inline-block;
}
.img_logo_v{
	width: 165px;
	height: 212px;
	display: block;
	margin-right: auto;
	margin-left: auto;
	}
.img_index_about{
	width: 81px;
	height: 114px;
	display: block;
	background-image: url(../images/icon/iconforindex-1.svg);
	}
.img_index_about:hover{
	background-image: url(../images/icon/iconforindex-1-2.svg);
	}
.img_index_project{
	width: 81px;
	height: 114px;
	display: block;
	background-image: url(../images/icon/iconforindex-2.svg);
	}
.img_index_project:hover{
	background-image: url(../images/icon/iconforindex-2-2.svg);
	}
.img_index_careers{
	width: 81px;
	height: 114px;
	display: block;
	background-image: url(../images/icon/iconforindex-3.svg);
	}
.img_index_careers:hover{
	background-image: url(../images/icon/iconforindex-3-2.svg);
	}
	
.img_index_about, .img_index_project, .img_index_careers{
	width: 70px;
	height: 100px;
	}
	}
.img_index_about, .img_index_project, .img_index_careers{
	width: 60px;
	height: 86px;
	}
	}	
	
	
/*--NAV--*/
.img_logo{
	height: 48px;
	display: inline-block;
	}	
.img_home{
	width: 83px;
	height: 42px;
	display: inline-block;
	}
.img_about{
	width: 109px;
	height: 42px;
	display: inline-block;
	}
.img_projects{
	width: 111px;
	height: 42px;
	display: inline-block;
	}
.img_careers{
	width: 111px;
	height: 42px;
	display: inline-block;
	}
	.img_login{
	width: 111px;
	height: 42px;
	display: inline-block;
	}

.img_contact{
	width: 126px;
	height: 42px;
	display: inline-block;
	}
@media only screen and (max-width: 991px) {
.img_logo{
	width: 170px;
	height: 42px;
	display: inline-block;
	}	
.img_home{
display:none;
    width: 0px;
    height: 0px;
	}
.img_about{
	width: 103px;
	height: 36px;
	display: inline-block;
	}
.img_projects{
	width: 105px;
	height: 36px;
	display: inline-block;
	}
.img_careers{
	width: 105px;
	height: 36px;
	display: inline-block;
	}
.img_contact{
	width: 120px;
	height: 36px;
	display: inline-block;
	}
	.img_login{
	width: 105px;
	height: 36px;
	display: inline-block;
	}
	}

.icon_service100{
	width: 80px;
	height: 80px;
	}
	
.icon_careers_1{
	width: 130px;
	height: 120px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/careers-1-2.svg);
	}
.icon_careers_1:hover{
	background-image: url(../images/icon/careers-1.svg);
	}
.icon_careers_2{
	width: 108px;
	height: 120px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/careers-2-2.svg);
	}
.icon_careers_2:hover{
	background-image: url(../images/icon/careers-2.svg);
	}	
.icon_careers_3{
	width: 110px;
	height: 120px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/careers-3-2.svg);
	}
.icon_careers_3:hover{
	background-image: url(../images/icon/careers-3.svg);
	}	
.icon_careers_4{
	width: 112px;
	height: 121px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/careers-4-2.svg);
	}
.icon_careers_4:hover{
	background-image: url(../images/icon/careers-4.svg);
	}
	
	
.career_people{
	width: 100px;
	height: 92px;
	display: block;
	}
.career_life{
	width: 80px;
	height: 89px;
	display: block;
	}
.career_learning{
	width: 90px;
	height: 98px;
	display: block;
	}

.icon_careers_small_1{
	width: 70px;
	height: 87px;
	display: block;
	background-image: url(../images/icon/careers-1-small.svg);
	}
.icon_careers_small_1:hover{
	background-image: url(../images/icon/careers-1-small-2.svg);
	}	
.icon_careers_small_2{
	width: 70px;
	height: 86px;
	display: block;
	background-image: url(../images/icon/careers-2-small.svg);
	}
.icon_careers_small_2:hover{
	background-image: url(../images/icon/careers-2-small-2.svg);
	}	
.icon_careers_small_3{
	width: 70px;
	height: 86px;
	display: block;
	background-image: url(../images/icon/careers-3-small.svg);
	}
.icon_careers_small_3:hover{
	background-image: url(../images/icon/careers-3-small-2.svg);
	}
.icon_careers_small_4{
	width: 70px;
	height: 86px;
	display: block;
	background-image: url(../images/icon/careers-4-small.svg);
	}
.icon_careers_small_4:hover{
	background-image: url(../images/icon/careers-4-small-2.svg);
	}	
	
@media only screen and (max-width: 768px) {

.icon_careers_small_1, .icon_careers_small_2, .icon_careers_small_3, .icon_careers_small_4{
	width: 60px;
	height: 74px;
	}
	}
	
.icon_portfolio{
	width: 81px;
	height: 105px;
	display: inline-block;
	background-image: url(../images/icon/p-01-2.svg);
	}
.icon_portfolio:hover{
	background-image: url(../images/icon/p-01.svg);
	}	
.icon_representative{
	width: 81px;
	height: 105px;
	display: inline-block;
	background-image: url(../images/icon/p-02-2.svg);
	}
.icon_representative:hover{
	background-image: url(../images/icon/p-02.svg);
	}	
.icon_futsucity{
	width: 81px;
	height: 105px;
	display: inline-block;
	background-image: url(../images/icon/p-03-2.svg);
	}
.icon_futsucity:hover{
	background-image: url(../images/icon/p-03.svg);
	}	
.icon_recent{
	width: 81px;
	height: 105px;
	display: inline-block;
	background-image: url(../images/icon/p-04-2.svg);
	}
.icon_recent:hover{
	background-image: url(../images/icon/p-04.svg);
	}	
.icon_futsu{
	width: 71px;
	height: 95px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-01-2.svg);
	}
.icon_futsu:hover{
	background-image: url(../images/icon/small%20icon/f-01.svg);
	}
.icon_service{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-02-2.svg);
	}
.icon_service:hover{
	background-image: url(../images/icon/small%20icon/f-02.svg);
	}	
.icon_history{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-03-2.svg);
	}
.icon_history:hover{
	background-image: url(../images/icon/small%20icon/f-03.svg);
	}	
.icon_honor{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-04-2.svg);
	}
.icon_honor:hover{
	background-image: url(../images/icon/small%20icon/f-04.svg);
	}		
.icon_organization{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-05-2.svg);
	}
.icon_organization:hover{
	background-image: url(../images/icon/small%20icon/f-05.svg);
	}	
.icon_safety{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-06-2.svg);
	}
.icon_safety:hover{
	background-image: url(../images/icon/small%20icon/f-06.svg);
	}
.icon_csr{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-07-2.svg);
	}
.icon_csr:hover{
	background-image: url(../images/icon/small%20icon/f-07.svg);
	}
.icon_publication{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-08-2.svg);
	}
.icon_publication:hover{
	background-image: url(../images/icon/small%20icon/f-08.svg);
	}
.icon_news{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-09-2.svg);
	}
.icon_news:hover{
	background-image: url(../images/icon/small%20icon/f-09.svg);
	}
.icon_group{
	width: 72px;
	height: 96px;
	display: inline-block;
	margin:auto;
	background-image: url(../images/icon/small%20icon/f-10-2.svg);
	}
.icon_group:hover{
	background-image: url(../images/icon/small%20icon/f-10.svg);
	}	
	
@media only screen and (max-width: 1024px) {
.icon_futsu, .icon_service, .icon_history, .icon_honor, .icon_organization, .icon_safety, .icon_csr, .icon_publication, .icon_news, .icon_group{
	width: 62px;
	height: 82px;
	}
	}
	
@media only screen and (max-width: 991px) {
.icon_futsu, .icon_service, .icon_history, .icon_honor, .icon_organization, .icon_safety, .icon_csr, .icon_publication, .icon_news, .icon_group{
	width: 48px;
	height: 63px;
	}
	}	
	
.icon_p_factory{
	width: 81px;
	height: 105px;
	display: block;
	background-image: url(../images/icon/port_icon_10.svg);
	}
.icon_p_factory:hover{
	background-image: url(../images/icon/port_icon_10-2.svg);
	}	
.icon_p_hitech{
	width: 80px;
	height: 104px;
	display: block;
	background-image: url(../images/icon/port_icon_1.svg);
	}
.icon_p_hitech:hover{
	background-image: url(../images/icon/port_icon_1-2.svg);
	}	
.icon_p_office{
	width: 81px;
	height: 122px;
	display: block;
	background-image: url(../images/icon/port_icon_2.svg);
	}
.icon_p_office:hover{
	background-image: url(../images/icon/port_icon_2-2.svg);
	}	
.icon_p_resident{
	width: 81px;
	height: 104px;
	display: block;
	background-image: url(../images/icon/port_icon_3.svg);
	}
.icon_p_resident:hover{
	background-image: url(../images/icon/port_icon_3-2.svg);
	}	
.icon_p_hotel{
	width: 81px;
	height: 122px;
	display: block;
	background-image: url(../images/icon/port_icon_4.svg);
	}
.icon_p_hotel:hover{
	background-image: url(../images/icon/port_icon_4-2.svg);
	}	
.icon_p_public{
	width: 81px;
	height: 104px;
	display: block;
	background-image: url(../images/icon/port_icon_5.svg);
	}
.icon_p_public:hover{
	background-image: url(../images/icon/port_icon_5-2.svg);
	}	
.icon_p_education{
	width: 81px;
	height: 104px;
	display: block;
	background-image: url(../images/icon/port_icon_6.svg);
	}
.icon_p_education:hover{
	background-image: url(../images/icon/port_icon_6-2.svg);
	}	
.icon_p_hospital{
	width: 82px;
	height: 121px;
	display: block;
	background-image: url(../images/icon/port_icon_7.svg);
	}
.icon_p_hospital:hover{
	background-image: url(../images/icon/port_icon_7-2.svg);
	}	
.icon_p_shop{
	width: 82px;
	height: 121px;
	display: block;
	background-image: url(../images/icon/port_icon_8.svg);
	}
.icon_p_shop:hover{
	background-image: url(../images/icon/port_icon_8-2.svg);
	}	
.icon_p_tracffic{
	width: 82px;
	height: 104px;
	display: block;
	background-image: url(../images/icon/port_icon_9.svg);
	}
.icon_p_tracffic:hover{
	background-image: url(../images/icon/port_icon_9-2.svg);
	}	
.icon_p_oversea{
	width: 82px;
	height: 105px;
	display: block;
	background-image: url(../images/icon/port_icon_11.svg);
	}
.icon_p_oversea:hover{
	background-image: url(../images/icon/port_icon_11-2.svg);
	}	
.icon_p_others{
	width: 82px;
	height: 105px;
	display: block;
	background-image: url(../images/icon/port_icon_12.svg);
	}
.icon_p_others:hover{
	background-image: url(../images/icon/port_icon_12-2.svg);
	}	
	
	
@media only screen and (max-width: 1199px) {
.icon_p_factory, .icon_p_hitech, .icon_p_public, .icon_p_resident, .icon_p_education{
	width: 66px;
	height: 86px;
	}
.icon_p_tracffic, .icon_p_oversea, .icon_p_others {
	width: 66px;
	height: 84px;
	}	
.icon_p_office, .icon_p_hospital, .icon_p_shop{
	width: 65px;
	height: 97px;
	}
.icon_p_hotel{
	width: 65px;
	height: 98px;
	}	
}
@media only screen and (max-width: 991px) {
.icon_p_factory, .icon_p_hitech, .icon_p_public, .icon_p_resident, .icon_p_education, .icon_p_tracffic, .icon_p_oversea, .icon_p_others {
	width: 82px;
	height: 105px;
	}
.icon_p_office, .icon_p_hotel, .icon_p_hospital, .icon_p_shop{
	width: 81px;
	height: 121px;
	}
}
@media only screen and (max-width: 768px) {
.icon_p_factory, .icon_p_public, .icon_p_resident, .icon_p_education, .icon_p_tracffic, .icon_p_oversea, .icon_p_others {
	width: 81px;
	height: 104px;
	}
.icon_p_hitech{
	width: 81px;
	height: 105px;
	}
.icon_p_office, .icon_p_hotel, .icon_p_hospital, .icon_p_shop{
	width: 79px;
	height: 118px;
	}
}

.icon_p_1{
	width: 56px;
	height: 73px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_1-dark.svg);
	}
.icon_p_1:hover{
	background-image: url(../images/icon/port_icon_1.svg);
	}
.icon_p_2{
	width: 56px;
	height: 84px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_2-dark.svg);
	}
.icon_p_2:hover{
	background-image: url(../images/icon/port_icon_2.svg);
	}
.icon_p_3{
	width: 56px;
	height: 73px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_3-dark.svg);
	}
.icon_p_3:hover{
	background-image: url(../images/icon/port_icon_3.svg);
	}
.icon_p_4{
	width: 56px;
	height: 83px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_4-dark.svg);
	}
.icon_p_4:hover{
	background-image: url(../images/icon/port_icon_4.svg);
	}
.icon_p_5{
	width: 56px;
	height: 73px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_5-dark.svg);
	}
.icon_p_5:hover{
	background-image: url(../images/icon/port_icon_5.svg);
	}
.icon_p_6{
	width: 56px;
	height: 73px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_6-dark.svg);
	}
.icon_p_6:hover{
	background-image: url(../images/icon/port_icon_6.svg);
	}
.icon_p_7{
	width: 56px;
	height: 83px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_7-dark.svg);
	}
.icon_p_7:hover{
	background-image: url(../images/icon/port_icon_7.svg);
	}
.icon_p_8{
	width: 56px;
	height: 83px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_8-dark.svg);
	}
.icon_p_8:hover{
	background-image: url(../images/icon/port_icon_8.svg);
	}
.icon_p_9{
	width: 56px;
	height: 70px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_9-dark.svg);
	}
.icon_p_9:hover{
	background-image: url(../images/icon/port_icon_9.svg);
	}
.icon_p_10{
	width: 56px;
	height: 73px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_10-dark.svg);
	}
.icon_p_10:hover{
	background-image: url(../images/icon/port_icon_10.svg);
	}
.icon_p_11{
	width: 56px;
	height: 72px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_11-dark.svg);
	}
.icon_p_11:hover{
	background-image: url(../images/icon/port_icon_11.svg);
	}
.icon_p_12{
	width: 56px;
	height: 72px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/port_icon_12-dark.svg);
	}
.icon_p_12:hover{
	background-image: url(../images/icon/port_icon_12.svg);
	}
	
	
/*--?ĺ°žICON--*/
.icon_end_home{
	width: 83px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-1.svg);
	}
.icon_end_home:hover{
	background-image: url(../images/icon/icon-1-orange.svg);
	}	
.icon_end_about{
	width: 109px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-2.svg);
	}
.icon_end_about:hover{
	background-image: url(../images/icon/icon-2-orange.svg);
	}	
.icon_end_projects{
	width: 111px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-3.svg);
	}
.icon_end_projects:hover{
	background-image: url(../images/icon/icon-3-orange.svg);
	}
.icon_end_careers{
	width: 111px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-4.svg);
	}
.icon_end_careers:hover{
	background-image: url(../images/icon/icon-4-orange.svg);
	}	
	.icon_end_clerk{
	width: 111px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-6.svg);
	}
.icon_end_clerk:hover
{
	background-image: url(../images/icon/icon-6-orange.svg);
}
.icon_end_login{
	width: 125px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-7.svg);
	}
.icon_end_login:hover{
	background-image: url(../images/icon/icon-7-orange.svg);
	}
.img_config{
	width: 125px;
	height: 42px;
	display: block;
	background-image: url(../images/icon/icon-8.svg);
	}
.img_config:hover{
	background-image: url(../images/icon/icon-8-orange.svg);
	}
.icon_end_contact{
	width: 126px;
	height: 42px;
	display: block;
	margin:auto;
	background-image: url(../images/icon/icon-5.svg);
	}
.icon_end_contact:hover{
	background-image: url(../images/icon/icon-5-orange.svg);
	}