@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: "HyundaiSansHeadOffice-Medium";
	src: url("../font/HyundaiSansHeadOffice-Medium.eot");
	src: url("../font/HyundaiSansHeadOffice-Medium.eot?#iefix") format("embedded-opentype"),
	url("../font/HyundaiSansHeadOffice-Medium.woff") format("woff"),
	url("../font/HyundaiSansHeadOffice-Medium.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

/*Common*/
html {overflow-y:scroll;}
html, body {
	margin: 0;
	padding: 0;
	background-color: #fff;
	width: 100%;
	height: 100%;
	font-family: 'HyundaiSansHeadOffice-Medium','Tahoma','Arial','Verdana','sans-serif';
	color: #5b5b5b;
	font-size: 12px;
}
hr {display:none;}
img,fieldset {border:0 none;outline:none;}
dl,ul,ol,li {list-style: none;}
h1,h2,h3,h4,h5,dl,dt,dd,ul,li,ol,th,td,p,blockquote,form,fieldset,legend {margin:0; padding:0; font-weight:normal;}
table {border-collapse:collapse; font-size:12px;}
th {color:#000;}
a ,a:link {text-decoration:none; color:#5f5f5f;} 
a:hover {text-decoration:none; color:#5f5f5f;} 
a:active {text-decoration:none;}
input, select, textarea {
	color: #666;
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-family: 'HyundaiSansHeadOffice-Medium','Tahoma','Arial','Verdana','sans-serif';
	border: 1px solid #dddddd;
	box-sizing: border-box;
}
input[type="radio"], input[type="file"], input[type="checkbox"] {border:none;}
caption {display:none;}
focus {outline:none;}
em {font-style: normal;}
.border_none {border:none !important;}
.tl {text-align:left !important;}
.tc {text-align:center !important;}
.tr {text-align:right !important;}


/* Login */
#login_wrap {width:100%; height:100%; background:url(../images/bg_login_wrap.gif) no-repeat; background-size:cover; overflow-y:hidden; min-height:700px; position:relative;}
.login_header {background:#f6f3f2; height:50px;}
.login_header .logo {position:relative; top:14px; left:20px; display:inline-block;}

#login_container {margin:50px 30px 0 30px; background-color:rgba(255,255,255,0.5); text-align:center; padding:140px 0 0; height:100%;}
.prd_name {font-family:'HyundaiSansHeadOffice-Medium'; font-size:54px; color:#002c5f; margin:50px 0;}

.login_input_wrap * {vertical-align:middle;}
.login_input li {border:1px solid #d0c6ba; height:44px; line-height:4px; text-align:left; padding:0 10px 0 60px; background:#f6f3f2; margin-bottom:10px; width:300px; margin:0 auto 10px; position:relative;}
.login_input li:before {content:''; display:inline-block; position:absolute; left:20px; top:12px;}
.login_input .id:before {background:url(../images/ico_id.png) no-repeat; width:15px; height:21px;}
.login_input .pw:before {content:''; display:inline-block; background:url(../images/ico_pw.png) no-repeat; width:16px; height:22px;}
.login_input input {height:44px; line-height:45px; background:none; font-size:15px; width:100%; border:none; outline:none; color:#333; font-weight:bold;}
.login_input .btn_login {display:inline-block; background:#002c5f; color:#fff; height:55px; line-height:52px; padding:0 10px; width:350px; font-size:20px; font-weight:bold; border:1px solid #002c5f; transition:all .4s ease;}
.login_input .btn_login:hover {background:none; color:#002c5f;}

#change_password .login_input_wrap {margin:35px auto; width:385px;}
#change_password .input_pw {width: auto; height: 50px; margin: 0 0 25px; border: 1px solid #D5D5D5; border-radius: 5px; padding-left: 50px;}
#change_password .input_pw:before {content:''; position:absolute; background:url(../images/ico_pw.png) no-repeat; background-size: 13px; width:16px; height:22px; margin:15px 0 0 -30px;}
#change_password .input_pw input {height:50px; line-height:50px; background:none; font-size:15px; width:100%; border:none; outline:none; color:#333; font-weight:bold;}
#change_password #btn_password {background-color: #002c5f; border: 1px solid #002c5f; color: #fff; font-size: 16px; padding: 15px 30px;}
#change_password #btn_password:hover {background-color: whitesmoke; border: 1px solid #002c5f; color:#002c5f;}

#select_lang {margin-top: 20px;}
#select_lang input {margin-left: 10px;}
#select_lang span{font-size: 15px;margin-left: 5px;}

#login_footer {text-align:center; width:100%; color:#888; font-size:11px; text-transform:uppercase; position:absolute; bottom:30px;}

/* Content */
#pdi_wrap {width:100%; min-width:1400px;}

#header_wrap {height:85px; padding:0 20px; background-color:#002c5f; text-align:center; position:relative;}
#header_wrap h1 {position:absolute; left:20px; top:30px;}
#header_wrap .title {display:inline-block; font-size:24px; color:#fff; position:relative; top:24px;}
#header_wrap .btn_logout {cursor:pointer; right:15px; top:45px; font-size:14px; color:#999;}
#header_wrap .btn_logout:before {content:''; background:url(../images/ico_logout.png) no-repeat; height:16px; width:16px; display:inline-block; position:relative; top:3px; margin-right:5px;}
#header_wrap .btn_logout:hover {background-position:0 -16px; color:#fff;}
#header_wrap .btn_change_password {cursor:pointer; font-size:14px; color:#999; margin-right:10px;}
#header_wrap .btn_change_password:before {content:''; background:url(../images/ico_pw.png) no-repeat; background-size: 15px; height:22px; width:16px; display:inline-block; position:relative; top:4px; margin-right:4px;}
#header_wrap .btn_change_password:hover {background-position:0 -16px; color:#fff;}

#header_menu {position: absolute; right: 20px; top: 9px;}
#header_menu a {font-size: 14px; color: #999;}
#header_menu a:hover {color: white;}

#user_info {position: absolute; right: 10px; color: white; font-size: 13px; top: 15px;}

#container {margin:0 auto; padding:20px 20px 70px;}

.tab_wrap {
	width: 100%;
	margin-bottom: 10px;
}
.tab_wrap ul {
	display: table;
	border-spacing: 3px;
	margin: 0 -3px;
}
.tab_wrap li {
		display: table-cell;
		margin-right: 3px;
		text-align: center;
		color: #999;
		font-size: 13px;
		height: 65px;
		line-height: 16px;
		padding: 0 5px;
		font-weight: bold;
		border: 2px solid #e4dbd4;
		cursor: pointer;
		transition: all .4s ease;
		box-sizing: border-box;			
		width: 150px;
		vertical-align: middle;
		background: url("../images/arr_sel.gif") bottom right no-repeat;
		position: relative;
	}
.tab_wrap li:last-child {
			margin-right: 0;
		}
.tab_wrap li:hover {
			color: #00aad2;
			border: 2px solid #00aad2;
		}

.tab_wrap li.active {
	color: #00aad2;
	border: 2px solid #00aad2;
}

.tab_wrap li.parent-active {
	color: #446ccf;
	border: 2px solid #446ccf;
}

.tab_wrap li:hover .submenu_wrap {
		display: inline-block;
}

.tab_wrap .submenu_wrap {
	  display: none;
		position: absolute;
		z-index: 10;
		top: 63px;
		width: 150px;
		left: -2px;
		background-color: #fff;
		border: 1px solid #e4dbd4;
		box-sizing: border-box;
		padding: 10px;
	}
.tab_wrap .submenu_wrap dd {
		padding: 20px 0;
		color: #999;
		height: 20px;
	}
.tab_wrap .submenu_wrap dd:hover {
				color: #00aad2;
			}
	.tab_wrap .submenu_wrap dd.active {
		color: #00aad2;
	}

.top_btn {text-align:right; width:100%; position:relative; min-height:14px;}
.top_btn .page_info {position:absolute; left:0; bottom:0;}
.top_btn .page_info em {color:#e63312; font-weight:bold;}
.top_btn a {display:inline-block; padding:5px 10px; border:1px solid #002c5f; font-weight:bold; color:#002c5f; transition:all .4s ease; min-width:60px; text-align:center; margin-right: 5px;}
.top_btn a:last-child{margin-right: 0}
.top_btn a:hover {border:1px solid transparent;}

.board_wrap {width:100%; min-width:1024px;}
.board_wrap table {width:100%; border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin:7px 0 50px 0;}
.board_wrap tr {border-bottom:1px solid #eee;}
.board_wrap tr:last-child {border-bottom:none;}
.board_wrap th {background:#f9f9f9; color:#000; text-align:left; padding:8px;}
.board_wrap td {padding:8px; min-height:25px;}
.board_wrap td input {width:100%; padding:5px;}

.board_wrap_list {width:100%; margin:0 0 20px 0;}
.board_wrap_list table {width:100%; border-top:1px solid #ccc; border-bottom:1px solid #ccc; margin:7px 0 0 0;}
.board_wrap_list tr {border-bottom:1px solid #dedede;}
.board_wrap_list tr:nth-child(even) {background:#fbfbfb;}
.board_wrap_list th {background:#f9f9f9; color:#000; font-weight:bold; padding:10px 0;}
.board_wrap_list td {padding:0 5px; text-align:center; height:40px;}
.board_wrap_list .status span {width:40%; display:inline-block;}
.board_wrap_list a {display:inline-block; padding:5px 10px; border:1px solid #e1dcd6; color:#002c5f; background:#f5f4f2; min-width:40px;}

.board_view .good {background:#2d8821; color:#fff; width:100%; display:inline-block; padding:5px 0;}
.board_view .nogood {background:#e22424; color:#fff; width:100%; display:inline-block; padding:5px 0;}

.required_photo {padding:6px 0;}
.required_photo table {border:none; margin:0;}
.required_photo tr {border:none;}
.required_photo th {background:none; text-align:left; vertical-align:top; font-weight:normal; padding:10px;}
.required_photo td {text-align:left; height:auto; padding-bottom:4px;}
.required_photo .photo {border:1px solid #dddddd; padding:6px; display:inline-block;}
.required_photo input {width:100%; padding:5px;}
.required_photo a {margin:5px 0 0;}

.board_view {width:100%; margin:0 0 20px 0;}
.board_view table {width:100%; margin:10px 0 0 0;}
.board_view tr {border-bottom:1px solid #dedede;}
.board_view th {background:#f9f9f9; color:#000; padding:8px; text-align:left; font-size:13px; border-top:1px solid #bebebe; border-bottom:1px solid #bebebe;}
.board_view td {padding:3px 5px; text-align:center; height:auto; padding:3px 5px;}
.board_view td input {width:100%; padding:4px 0 4px 3px;}
.board_view a {display:inline-block; padding:3px 10px; border:2px solid #4c4e51; font-weight:bold;}
.board_view a img {margin-right:5px;}
.board_view .status span {width:40%; display:inline-block;}

.view_list table {border:none; margin:5px 0;}
.view_list a {box-sizing:border-box; width:100%;}
a.btn_photo {color:#69b7cd; border:2px solid #69b7cd; width: 87%;}
a.btn_comment {color:#f6a74a; border:2px solid #f6a74a; width: 87%;}

.board_view .data_colletion table {border:1px solid #e7e7e7; margin:5px 0;}
.board_view .data_colletion th {background:#f9f9f9; border:1px solid #e7e7e7; text-align:center; font-weight:normal; padding:0;}
.board_view .data_colletion td {padding:10px 0; border-bottom:1px solid #e7e7e7; color:#707070;}
.board_view .data_colletion dl {display:inline-block;}
.board_view .data_colletion dt img {border:1px solid #ddd;}
.board_view .data_colletion dd {border:1px solid #ddd; margin-top:5px; padding:3px 0;}
.board_view .data_colletion .pressure span {display:inline-block; width:24%;}
.board_view .data_colletion .mileage span {display:inline-block; width:49%;}
.board_view .data_colletion .gds_data {padding:0;}
.board_view .data_colletion .gds_data span {display:inline-block; width:49%;}
.board_view .data_colletion .gds_data table {border:none;}
.board_view .data_colletion .gds_data th {border:none; text-align:left; padding:0 10px; font-size:12px; color:#707070; background:#fff;}
.board_view .data_colletion .gds_data td {border:none; padding:3px; text-align:left;}
.board_view .data_colletion .gds_data input {width:200px; text-align:center;}
.board_view .data_colletion .gds_data a {display:inline-block; padding:5px 10px; border:1px solid #e1dcd6; color:#002c5f; background:#f5f4f2; min-width:40px; text-align:center; font-weight:normal;}

.board_title {padding-left:12px; font-size:14px; font-weight:bold; color:#002c5f; position:relative; margin-bottom: 10px; margin-top: 15px;}
.board_title:before {content:'■'; color:#002c5f; display:inline-block; position:absolute; left:0; top:-2px;}

.board_view_title{background: #f9f9f9; color: #000; padding: 8px; text-align: left; font-size: 13px; border-top: 1px solid #bebebe; border-bottom: 1px solid #bebebe;}

.search_wrap {width:100%; margin:0 0 20px 0;}
.search_wrap table {width:100%; border:1px solid #ddd;}
.search_wrap tr {border-bottom:1px solid #dedede;}
.search_wrap th {background:#f9f9f9; font-weight:bold; height:45px; text-align:left; padding-left:15px;}
.search_wrap td {height:45px; font-size:12px; padding:0;}
.search_wrap td select {width:100%; padding:5px;}
.search_wrap td input {width:100%; padding:5px;}
.search_wrap .btn_wrap {text-align:center; margin:10px 0 0 0;}
.search_wrap .btn_wrap a {color:#fff; font-size:13px; display:inline-block; padding:0px 20px; height:31px; line-height:31px; min-width:60px; margin:0 3px;}
.search_wrap .btn_wrap .btn_type01 {background:#002c5f; border:1px solid #002c5f;}
.search_wrap .btn_wrap .btn_type02 {background:#777; border:1px solid #777;}

.form_wrap td select,
.board_wrap_list td select {padding: 5px 25px 5px 5px;}
.form_wrap td input {padding: 5px;}

.paging_wrap * {vertical-align:middle;}
.paging_wrap {text-align:center; margin:0 0 50px 0;}
.paging_wrap a {display:inline-block; color:#8f8f8f; height:20px; line-height:19px; border:1px solid transparent; margin:0 3px; font-size:12px; padding:0 6px; min-width:10px;}
.paging_wrap span {display:inline-block; color:#8f8f8f; height:20px; line-height:19px; border:1px solid transparent; margin:0 3px; font-size:12px; padding:0 6px; min-width:10px;}
.paging_wrap a:hover {border-color:#bbb; text-decoration:underline;}
.paging_wrap a:active {color:#002c5f ; border-color:#002c5f ; text-decoration:underline;}
.paging_wrap a.active {color:#002c5f ; border-color:#002c5f ; text-decoration:underline;}
.paging_wrap a.btn_arrow {border:1px solid #bbb; padding:1px 8px 0px; margin:0 10px;}
.paging_wrap a.btn_arrow:hover {text-decoration:none; border:1px solid #bbb;}

.btn_up { cursor:pointer; margin: 0 3px; padding: 4px 7px 2px; border:1px solid rgb(216, 216, 216); }
.btn_down { cursor:pointer; margin: 0 3px; padding: 4px 7px 2px; border:1px solid rgb(216, 216, 216); }
.btn_up:disabled, .btn_up[disabled] { -webkit-filter: grayscale(100%); filter: grayscale(100%); }
.btn_down:disabled, .btn_down[disabled] { -webkit-filter: grayscale(100%); filter: grayscale(100%); }

#reporting_table a {width: auto; min-width: 135px;}

.checkbox{float:left; margin-top: 2px; margin-right: 2px;}

/* row */
.hide_row {display:none;}

/* Footer */
#footer_wrap {width:100%; background:#999; text-align:center; padding:20px 0; color:#eee; position:fixed; bottom:0px; text-transform:uppercase; font-size:11px; left: 0;}

/* POP-UP */
#pop_header {background: #002c5f; position: relative; border: 5px solid #002c5f;}
#pop_header .top_wrap .navi {color: #fff; font-size: 16px; font-weight: bold; padding: 9px 0 3px 0;}

.chart_title{background: url(/images/icon_bullet.png) 0px 7px no-repeat; padding-left: 15px; font-size: 14px; font-weight: bold; color: #2b2d2f; margin: 20px 0 10px 0;}
.chart_sub_title {background-color: #f9f9f9; border-top: 2px solid #002c5f; border-right: 1px solid #bebebe; border-bottom: 1px solid #bebebe; border-left: 1px solid #bebebe; color: #213039; font-size: 13px; font-weight: bold; padding: 10px 10px 10px 10px;}

.std_title h3{font-size:14px; font-weight:bold;}
.add_btn{background-color:#fff; border:1px solid #002c5f; cursor:pointer; font-weight:bold; color:#002c5f; transition:all .4s ease; padding:3px 10px; width:80px; text-align:center; margin-right: 5px;}
.std_btn_lightgray{cursor:pointer;}
.std_btn_lightblue{cursor:pointer;}
 
/* Multi Select */
.multi_select {border-bottom: 1px solid #CCC; padding: 0px 5px; cursor: pointer;}
.multi_select .multi_input {display: inline-block; line-height: 2.5; width: calc(100% - 13px); cursor: pointer;}
.multi_select .caret {display: inline-block; width: 13px; color: #999999; font-size: 10px;}
.multi_select .select_box {position: absolute; margin: 0 0 0 -5px; padding-top: 6px; background-color: #FFF; border: 1px solid #CCC; z-index: 9999;}
.multi_select .select_box.hide {display: none;}
.multi_select .select_box .select_list {line-height: 2.5; cursor: default;}
.multi_select .select_box .select_list:nth-child(4) {padding: 0;}
.multi_select .select_box .select_list:hover {background-color: #F2F2F2;}
.multi_select .select_box .select_list .checkbox {width: 30px; height: 17px; margin-top: 6px;}
.multi_select .select_box .select_list span {width: calc(100% - 30px); vertical-align: sub;}
.multi_select .select_box .btn_type01 {background: #002c5f; border: 1px solid #002c5f; color: #FFF; font-size: 13px; display: inline-block; padding: 7px 20px; margin: 6px;}

.admin_pop_title {
	text-align: center;
	background-color: #3584cc;
	color: #ffffff;
	font-weight: bold;
}

.admin_std_tb {
	width: 100%;
	border-left: solid 1px #aeaeae;
	border-top: solid 1px #aeaeae;
	border-collapse: collapse;
}

.admin_std_td {
	text-align: center;
	border-bottom: 1px solid #afafaf;
	border-right: solid 1px #aeaeae;
	border-bottom: solid 1px #aeaeae;
	word-break: break-all;
}

.std_txt {
	height: 24px;
	line-height: 24px;
	width: 98%;
	border: solid 1px #aeaeae;
	padding-left: 3px;
}

.std_btn_default_1 {
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	font-family: Droid Sans,Tahoma;
	border: #2671b6 solid 1px;
	background: #3584cc;
	cursor: pointer;
	box-shadow: 0 2px 0px 0px rgba(0,0,0,0.2), 0 0 1px 1px rgba(255,255,255,0.4) inset;
	text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-o-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-moz-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-webit-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-moz-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
}

.std_btn_default_2 {
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	font-family: Droid Sans,Tahoma;
	border: #000000 solid 1px;
	background: #2c2d2f;
	cursor: pointer;
	box-shadow: 0 2px 0px 0px rgba(0,0,0,0.2), 0 0 1px 1px rgba(255,255,255,0.4) inset;
	text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-o-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-moz-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-webit-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
	-moz-text-shadow: 2px 2px 2px rgba(0,0,0, 0.6);
}

a.btn_device_selected, a.btn_cpo_manage_selected {
	background: url(/images/icon_active.png) 8px 7px no-repeat;
	padding-left: 22px;
	border-color: #c41a2b;
	color: #c41a2b;
	cursor: pointer;
	width: 50px;
}

a.btn_device_notselect, a.btn_cpo_manage_notselected {
	padding-left: 22px;
	border-color: #9f9f9f;
	color: #9f9f9f;
	cursor: pointer;
	width: 50px;
}

.input_error {
	background-color: rgba(255, 0, 0, 0.2);
}