/* color */
/* hyundai blue : #002c5f */
/* active blue : #00aad2 */
* {
	margin: 0;
	padding: 0;
}

body {
	margin: 0px;
	background-color: #262626;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
}

.content {
	padding-top: 0px;
	width: 100%;
	margin: auto;
	max-width: 1120px;
}

.content #carName {
	font-size: 0px;
	position: absolute;
	top: 50px;
	left: 50px;
}

.content #carName img {
	width: 350px;
}

.content #naviText {
    position: absolute;
    right: 5%;
    bottom: 7%;
    color: #aacae6;
    font-family: "MTR_KB";
}

.content #naviText span {
    font-size: 35px;
    display: block;
    width: 100% !important;
    text-align: right;
}

.content #mainCar {
	position: relative;
	font-size: 0px;
	width: 100%;
	padding-bottom: 25px;
	margin-left: auto;
	margin-right: auto;
}

.content #mainCar img {
	width: 100%;
}

#mainCarPhone {
	display: none;
}

.content #buttonMenu {
	width: 91%;
	margin-right: auto;
	margin-left: auto;
}

.content #buttonMenu>a {
	float: left;
	width: 20%;
	height: 155px;
	text-decoration: none;
}

.content #buttonMenu>a>div {
	background-color:#fafafa;
	width: 92%;
	height: 92%;
	margin: auto;
	background-repeat: no-repeat;
	background-position: 50% 30%;
	text-align: center;
	color: #002c5f;
	font-family: "HyundaiSansTextKRMedium";
	background-size: 62px;
	text-transform: capitalize;
}

.content #buttonMenu>a>div:HOVER {
	background-color: #002c5f;
	color: #fafafa;
}

.content #buttonMenu>a>div>span {
	position: relative;
	top: 60%;
	display: block;
	width: 95%;
	margin-left: auto;
	margin-right: auto;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 13pt;
	line-height: 120%;
}

#buttonMenu_a>div {
	background-image: url("icon/H/01_general_H.png");
}

#buttonMenu_b>div {
	background-image: url("icon/H/04_media_H.png");
}

#buttonMenu_c>div {
	background-image: url("icon/H/03_DMB_H.png");
}

#buttonMenu_d>div {
	background-image: url("icon/H/02_radio_H.png");
}

#buttonMenu_e>div {
	background-image: url("icon/H/05_navi_H.png");
}

#buttonMenu_f>div {
	background-image: url("icon/H/06_bluetooth_H.png");
}

#buttonMenu_g>div {
	background-image: url("icon/H/12_blink_H.png");
}

#buttonMenu_h>div {
	background-image: url("icon/H/09_setting_H.png");
}

#buttonMenu_i>div {
	background-image: url("icon/H/08_etc_H.png");
}

#buttonMenu_j>div {
	background-image: url("icon/H/11_ref_H.png");
}

#buttonMenu_k>div {
	background-image: url("icon/H/Connectivitiy_H.png");
}

#buttonMenu_l>div {
	background-image: url("icon/H/SiriusXM_data_H.png");
}

#buttonMenu_m>div {
	background-image: url("icon/H/SiriusXM_radio_H.png");
}

#buttonMenu_n>div {
	background-image: url("icon/H/13_useful_H.png");
}

#buttonMenu_o>div {
	background-image: url("icon/H/14_assistance_H.png");
}

#buttonMenu_q>div {
	background-image: url("icon/H/15_troble_H.png");
}

#buttonMenu_r>div {
	background-image: url("icon/H/07_voice_H.png");
}

#buttonMenu_s>div {
	background-image: url("icon/H/16_Hydrid_H.png");
}

#buttonMenu_t>div {
	background-image: url("icon/H/17_Information_H.png");
}

#buttonMenu_u>div {
	background-image: url("icon/H/18_EV_H.png");
}

#buttonMenu_a>div:HOVER {
	background-image: url("icon/common/01_general.png");
}

#buttonMenu_b>div:HOVER {
	background-image: url("icon/common/04_media.png");
}

#buttonMenu_c>div:HOVER {
	background-image: url("icon/common/03_DMB.png");
}

#buttonMenu_d>div:HOVER {
	background-image: url("icon/common/02_radio.png");
}

#buttonMenu_e>div:HOVER {
	background-image: url("icon/common/05_navi.png");
}

#buttonMenu_f>div:HOVER {
	background-image: url("icon/common/06_bluetooth.png");
}

#buttonMenu_g>div:HOVER {
	background-image: url("icon/H/12_blink_w.png");
}

#buttonMenu_h>div:HOVER {
	background-image: url("icon/common/09_setting.png");
}

#buttonMenu_i>div:HOVER {
	background-image: url("icon/common/08_etc.png");
}

#buttonMenu_j>div:HOVER {
	background-image: url("icon/common/11_ref.png");
}

#buttonMenu_k>div:HOVER {
	background-image: url("icon/common/Connectivitiy_white.png");
}

#buttonMenu_l>div:HOVER {
	background-image: url("icon/common/SiriusXM_data_white.png");
}

#buttonMenu_m>div:HOVER {
	background-image: url("icon/common/SiriusXM_radio_white.png");
}

#buttonMenu_n>div:HOVER {
	background-image: url("icon/common/13_useful.png");
}

#buttonMenu_o>div:HOVER {
	background-image: url("icon/common/14_assistance.png");
}

#buttonMenu_q>div:HOVER {
	background-image: url("icon/common/15_troble.png");
}

#buttonMenu_r>div:HOVER {
	background-image: url("icon/common/07_voice.png");
}

#buttonMenu_s>div:HOVER {
	background-image: url("icon/common/16_Hydrid.png");
}

#buttonMenu_t>div:HOVER {
	background-image: url("icon/common/17_Information.png");
}

#buttonMenu_u>div:HOVER {
	background-image: url("icon/common/18_EV.png");
}

.content #bottomText {
    clear: left;
    width: 100%;
    margin: auto;
    padding-top: 15px;
    padding-left: 60px;
    font-family: 'HyundaiSansTextKRRegular';
    font-size: 14px;
    color: #ffffff;

}

.content #bottomText>p {
    width: 100%;
    font-family: 'HyundaiSansTextKRMedium';
	color: #363636;
	font-size: 13px;
}

.fontChangeDiv {
	position: absolute;
	top: -35px;
	left: 5%;
	display: none;
}

@media screen and (min-width: 800px) and (max-width: 1280px) {
	.content #buttonMenu>a>div>span {
		line-height: 110%;
	}
}

@media screen and (max-width: 800px) {
	.content #carName {
		top: 50px;
		left: 50px;
	}
	.content #buttonMenu>a {
		width: 33.3%;
	}
	#mainCarPhone {
		display: block;
	}
	#mainCarPc {
		display: none;
	}
	.content #buttonMenu {
		width: 92%;
	}
	.content #naviText span {
		font-size: 25px;
	}
}

@media screen and (max-width: 480px) {
	.content {
		padding-top: 0px;
	}
	.content #carName {
		top: 25px;
		left: 25px;
	}
	.content #carName img {
		width: 85%;
	}
	.content #buttonMenu {
		position: relative;
		top: 0px;
	}
	.content #buttonMenu>a>div {
		background-color: rgba(250, 250, 250);
		background-size: 55px;
	}
	.content #buttonMenu>a {
		height: 120px;
	}
	.content #buttonMenu>a>div>span {
		font-size: 9pt;
		top: 60%;
		line-height: 120%;
		overflow: hidden;	/*ian 19-09-20*/
		text-overflow: ellipsis;	/*ian 19-09-20*/
		display:	-webkit-box; -webkit-line-clamp: 3; /* ¶óÀμö */ 	/*ian 19-09-20*/
					-webkit-box-orient: vertical;	/*ian 19-09-20*/
	}
	.content #naviText {
		bottom: 12%;
	}
	.content #naviText span {
		font-size: 15px;
	}
	.content #bottomText {
    clear: left;
    width: 85%;
    margin: auto;
	padding-top: 10px;
	padding-left: 20px;
	font-family: 'HyundaiSansTextKRRegular';
	font-size: 13px;

}