@charset "utf-8";
@import url(modal.css);
/* ========================================================================
* 태그 초기화 및 기본설정 (공통)
* ======================================================================== */

*, *::before, *::after {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	vertical-align: baseline;
	/* display: inline-block; */
}

h1, h2, h3, h4, h5, h6, th {
	font-size: 100%;
	font-weight: normal;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

img {
	border: none;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption {
	overflow: hidden;
	font-size: 0;
	line-height: 0;
}

a:link {
	color: #666;
	text-decoration: none;
}

a:visited {
	color: #666;
	text-decoration: none;
}

a:active {
	color: #333;
	text-decoration: none;
}

a:hover {
	color: #333;
	text-decoration: none;
}

.hidden {
	position: absolute;
	top: -9999px;
	font-size: 0;
	line-height: 0;
	text-indent: -9999px;
}

.clr::after {
	content: '';
	display: block;
	clear: both;
}

.mgt0 {
	margin-top: 0 !important;
}

.mgt3 {
	margin-top: 0.214rem !important;
}

.mgt5 {
	margin-top: 0.357rem !important;
}

.mgt10 {
	margin-top: 0.714rem !important;
}

.mgt20 {
	margin-top: 1.429rem !important;
}

.mgt30 {
	margin-top: 2.143rem !important;
}

.mgt40 {
	margin-top: 2.857rem !important;
}

.mgt50 {
	margin-top: 3.571rem !important;
}

.red {
	color: #e60012 !important;
}
.blue {
	color: #2E9AFE !important;
}

html {
	font-size: 14px;
}

body {
	line-height: 1;
	font-family: Noto Sans KR, sans-serif;
	color: #666;
}

body.open {
	height: 100%;
	overflow: hidden;
}

/* ========================================================================
* 폼 (공통)
* ======================================================================== */

select, input, textarea, button {
	font-family: Noto Sans KR, sans-serif;
	font-size: 1.000rem;
	color: #666;
}

textarea {
	padding: 7px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
}

textarea.w100 {
	width: 100%;
}

button {
	cursor: pointer;
}

button[disabled] {
	cursor: not-allowed;
	pointer-events: none;
	opacity: 0.4;
}

select {
	min-width: 70px;
	height: 30px;
	border: 1px solid #e3e3e3;
	padding: 0 30px 0 10px;
	border-radius: 0;
	background-image: url(../img/common/bg-selectbox.gif);
	background-color: #fff;
	background-position: right center;
	background-repeat: no-repeat;
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	-ms-appearance: none;
	vertical-align: middle;
	line-height: 30px;
	/*transition: all 0.4s ease;*/
}

select:hover {
	border-color: #999;
}

select::-ms-expand {
	display: none;
}

select.arrow {
	width: auto !important;
	min-width: 10px;
	height: 24px;
	margin-right: 10px;
	padding: 0 20px 0 10px;
	background-color: transparent;
	border: none;
	background-image: url(../img/common/bg-selectbox2.png);
	font-size: 1.000rem;
	color: #333;
	line-height: 24px;
	vertical-align: top;
	cursor: pointer;
}

input[type='text'], input[type='number'], input[type='password'], input[type='submit'], input[type='tel'], input[type='email'], input[type='button'] {
	width: 220px;
	height: 30px;
	padding-left: 10px;
	border: 1px solid #e3e3e3;
	line-height: 30px;
	border-radius: 0;
	-webkit-appearance: none;
	vertical-align: middle;
}

input[type='file'] {
	font-size: 13px;
	font-weight: 300;
	color: #888;
}

input[readonly] {
	background-color: #f8f8f8;
}

input.hasDatepicker {
	background-image: url(../img/common/icon-calendar.png);
	background-repeat: no-repeat;
	background-position: right center;
}

input[type='checkbox'] {
	background: #fff;
	border: solid 1px #e3e3e3;
	width: 16px;
	height: 16px;
	-webkit-appearance: none;
	border-radius: 1px;
	vertical-align: -2px;
}

input[type='checkbox']:checked {
	background: #fff;
	border: solid 1px #aaa;
}

input[type='checkbox']:checked:after {
	content: '';
	display: block;
	width: 10px;
	height: 10px;
	background: #333;
	position: relative;
	top: 2px;
	left: 2px;
	border-radius: 1px;
}

input[type='radio'] {
	background: #fff;
	border: solid 1px #aaa;
	width: 15px;
	height: 15px;
	-webkit-appearance: none;
	border-radius: 10px;
	vertical-align: -2px;
}

input[type='radio']:checked {
	background: #fff;
	border: solid 1px #aaa;
}

input[type='radio']:checked:after {
	content: '';
	display: block;
	width: 11px;
	height: 11px;
	background: #333;
	position: relative;
	top: 1px;
	left: 1px;
	border-radius: 10px;
}

/* ========================================================================
* 툴팁 (공통)
* ======================================================================== */

.help {
	position: relative;
	display: inline-block;
	z-index: 100;
}

.help::after {
	content: '?';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: red;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	line-height: 20px;
	font-size: 14px;
	vertical-align: middle;
	cursor: help;
}

.help .help-layer {
	display: none;
	position: absolute;
	top: 50px;
	left: 10px;
	width: 400px;
	height: auto;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	padding: 20px;
	z-index: 200;
}

.help:hover .help-layer {
	display: block;
}

.help .help-layer dt {
	position: absolute;
	top: -9999px;
	font-size: 0;
	line-height: 0;
	text-indent: -9999px;
}

.help .help-layer dd {
	font-size: 1.000rem;
	line-height: 1.4;
}

/* ========================================================================
* 버튼  (공통)
* ======================================================================== */

.btn {
	display: inline-block;
	min-width: 11.429rem;
	height: 3.214rem;
	margin: 0 5px;
	padding-left: 1.429rem;
	padding-right: 1.239rem;
	border-radius: 3px;
	background-color: #f7f7f7;
	border: 1px solid #e3e3e3;
	text-align: center;
	font-size: 1.143rem !important;
	font-weight: 300;
	vertical-align: middle;
	line-height: 1;
	color: #888 !important;
	/* transition: all 0.4s ease; */
}

a.btn {
	padding-top: 0.857rem;
	/* IE */
	padding-top: 1.214rem\0;
}

.btn:hover {
	background-color: #7b7b7b;
	border-color: #717171;
	color: #fff !important;
}

.btn.md {
	min-width: 5.714rem;
	height: 30px;
	padding-left: 1.000rem;
	padding-right: 1.000rem;
	font-size: 1.000rem !important;
}

a.btn.md {
	padding-top: 0.500rem;
	/* IE */
	padding-top: 0.786rem\0;
}

.btn.sm {
	min-width: 5.714rem;
	height: 1.714rem;
	padding-left: 1.000rem;
	padding-right: 1.000rem;
	font-size: 12px !important;
	border-radius: 1px;
}

.btn.round {
	border-radius: 30px;
}

.btn.btn01 {
	background-color: #222;
	border-color: #222;
	color: #fff !important;
}

.btn.btn01:hover {
	background-color: #111;
	border-color: #111;
}

.btn.btn02 {
	background-color: #666;
	border-color: #666;
	color: #fff !important;
}

.btn.btn02:hover {
	background-color: #333;
	border-color: #333;
}

.btn.btn03 {
	background-color: #e60012;
	border-color: #e60012;
	color: #fff !important;
}

.btn.btn03:hover {
	background-color: #730009;
	border-color: #730009;
}

.btn.btn04 {
	background-color: #b2b2b2;
	border-color: #b2b2b2;
	color: #fff !important;
}

.btn.btn04:hover {
	background-color: #595959;
	border-color: #595959;
}

.btn.btn05 {
	background-color: #d7841e;
	border-color: #d7841e;
	color: #fff !important;
}

.btn.btn05:hover {
	background-color: #ac6a18;
	border-color: #ac6a18;
}

.btn.btn06 {
	background-color: #3270c5;
	border-color: #3270c5;
	color: #fff !important;
}

.btn.btn06:hover {
	background-color: #285a9e;
	border-color: #285a9e;
}

/* 삭제 버튼 */

button.delete-x {
	position: relative;
	width: 16px;
	height: 16px;
	margin: 0 5px;
	background-color: #444;
	border-radius: 3px;
	color: #fff;
	font-size: 0;
	vertical-align: middle;
}

button.delete-x::before, button.delete-x::after {
	content: '';
	display: block;
	position: absolute;
	top: 8px;
	left: 5px;
	width: 7px;
	height: 1px;
	background-color: #fff;
	transform: rotate(45deg)
}

button.delete-x::after {
	transform: rotate(-45deg)
}

/* 콘텐츠 하단에 위치시 사용 */

.btn-bottom {
	margin-top: 2.857rem;
	text-align: center;
	font-size: 0;
}

/* table 하단에 위치시 사용 */

.btn-table-bottom {
	margin-top: 10px;
	font-size: 0;
}

.btn-table-bottom:after {
	content: '';
	display: block;
	clear: both;
}

.btn-table-bottom .left {
	float: left;
}

.btn-table-bottom .right button {
	margin-left: 0;
	margin-right: 5px;
}

.btn-table-bottom .right {
	float: right;
}

.btn-table-bottom .right button {
	margin-left: 5px;
	margin-right: 0;
}

/* 
 * @ on off 버튼의 경우
 * 환경설정-결재관리(기업용).html
 * 환경설정-거래처등록(1).html
 * 고객센터-단말기업데이트.html
 */

.btn-onoff {
	display: inline-block;
	font-size: 0;
}

.btn-onoff button {
	display: inline-block;
	width: 30px;
	height: 20px;
	font-size: 9px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	text-align: center;
}

.btn-onoff button.active {
	background-color: #333;
	border-color: #333;
	color: #fff;
}

/* table 상단 버튼 영역 */

.btn-function {
	margin-top: 2.857rem;
}

.btn-function::after {
	content: '';
	display: block;
	clear: both;
}

.btn-function.title-side {
	position: relative;
	z-index: 20;
	margin-top: -30px;
}

.btn-function .left {
	float: left;
	display:flex;
}

.btn-function .right {
	float: right;
}

.btn-function .txt {
	line-height: 30px; margin-right:10px; 
}

.btn-function .txt strong {
	font-weight: 500;
	color: #333;
}

.btn-function .txt .red {
	color: #e60012;
}

.btn-function select {
	height: 30px;
	padding-right: 50px;
	line-height: 30px;
	font-size: 12px !important;
	vertical-align: top;
	color: #888;
}

.btn-function input {
	font-size: 12px !important;
}

.btn-function button {
	height: 30px;
	padding-left: 10px;
	padding-right: 10px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	font-size: 12px !important;
	color: #888;
	font-weight: 300;
	/* transition: all 0.4s ease; */
}

.btn-function button:hover {
	border-color: #999;
}

.btn-function button::before {
	content: '';
	display: inline-block;
	margin-right: 5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
}

.btn-function button.btn {
	vertical-align: top;
}

.btn-function button.btn::before {
	display: none;
}

.btn-function button.excel::before {
	width: 15px;
	height: 15px;
	background-position: -230px -50px;
	vertical-align: -2px;
}

.btn-function button.stop::before {
	width: 10px;
	height: 10px;
	background-position: -150px -50px;
}

.btn-function button.delete::before {
	width: 14px;
	height: 14px;
	background-position: -170px -50px;
	vertical-align: -1px;
}

.btn-function button.view::before {
	width: 10px;
	height: 13px;
	background-position: -190px -50px;
	vertical-align: -1px;
}

.btn-function button.write::before {
	width: 13px;
	height: 13px;
	background-position: -210px -50px;
}

.btn-function button.location::before {
	width: 11px;
	height: 15px;
	background-position: -280px -50px;
	vertical-align: -1px;
}

.btn-function button.repair::before {
	width: 15px;
	height: 15px;
	background-position: -320px -50px;
	vertical-align: -2px;
}

.btn-function button.download::before {
	width: 15px;
	height: 14px;
	background-position: -150px -70px;
	vertical-align: -1px;
}

.btn-function button.invite {
	background-color: #888;
	border-color: #888;
	color: #fff;
}

.btn-function button.invite::before {
	width: 16px;
	height: 11px;
	background-position: -300px -50px;
}

.btn-function .car-condition
,.btn-function .car-condition-bad {
	border: 1px solid #aaa;
	height: 30px;
	padding: 6px 15px 0;
}

.btn-function .car-condition span {
	display: inline-block;
	margin-left: 10px;
	color: #469e13;
}

.btn-function .car-condition-bad span {
	display: inline-block;
	margin-left: 10px;
	color: #e0131d;
}

.btn-function .car-condition span::before
,.btn-function .car-condition-bad span::before {
	content: '●';
	display: inline-block;
	margin-right: 5px;
}

.btn-function button.car-register {
	background-color: #333;
	border-color: #333;
	color: #fff;
}

.btn-function button.car-register::before {
	display: none;
}

.btn-function .date {
	display: inline-block;
	font-size: 0;
}

.btn-function .date button {
	margin-left: 2px;
	padding-left: 7px;
	padding-right: 7px;
}

.btn-function .date button.active {
	background-color: #b2b2b2;
	border-color: #b2b2b2;
	color: #fff;
}

.btn-function .date button:first-child {
	margin-left: 0;
}

.btn-function .date button::before {
	display: none;
}

.btn-function .date button.active.bg-red { background: #e60012; border-color:#e60012; color: #fff; }
.btn-function .date button.active.bg-blue { background: #517cb1; border-color:#517cb1; color: #fff; }
.btn-function .date button.active.bg-black { background: #222; border-color:#222; color: #fff; }
.btn-function .date button.active.bg-gray { background: #777; border-color:#777; color: #fff; }
.btn-function .date .direct {
	display: inline-block;
	margin-left: 5px;
	vertical-align: top;
	font-size: 0.857rem;
}

.btn-function .date .direct input {
	width: 115px;
}

/* 이미지형 버튼 */

.btn-img {
	position: relative;
	width: 23px;
	height: 23px;
	background-color: #fff;
	border: 1px solid #e3e3e3;
	font-size: 0;
	line-height: 0;
	vertical-align: middle;
}

.btn-img:hover {
	border-color: #999;
}

.btn-img::before {
	content: '';
	display: block;
	position: absolute;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
}

.btn-img.modify::before {
	top: 4px;
	left: 4px;
	width: 13px;
	height: 13px;
	background-position: -210px -50px;
}

.btn-img.delete::before {
	top: 3px;
	left: 5px;
	width: 13px;
	height: 14px;
	background-position: -170px -50px;
}

.btn-img.change::before {
	top: 4px;
	left: 6px;
	width: 10px;
	height: 13px;
	background-position: -190px -50px;
}

.btn-img.camera::before {
	top: 4px;
	left: 3px;
	width: 16px;
	height: 13px;
	background-position: -260px -50px;
}

.btn-img.location::before {
	top: 3px;
	left: 5px;
	width: 11px;
	height: 15px;
	background-position: -280px -50px;
}

.btn-img.repair::before {
	top: 3px;
	left: 3px;
	width: 15px;
	height: 15px;
	background-position: -320px -50px;
}

.btn-img.search::before {
	top: 3px;
	left: 4px;
	width: 15px;
	height: 15px;
	background-position: -340px -50px;
}

.btn-img.plus::before {
	top: 5px;
	left: 5px;
	width: 11px;
	height: 11px;
	background-position: -360px -50px;
}

.btn-img.minus::before {
	top: 10px;
	left: 5px;
	width: 11px;
	height: 1px;
	background-position: -380px -50px;
}

.btn-img.download::before {
	top: 3px;
	left: 3px;
	width: 15px;
	height: 14px;
	background-position: -150px -70px;
}

.btn-img.sett::before {
	top: 3px;
	left: 3px;
	width: 15px;
	height: 14px;
	background: url(../img/common/ico_sett.png) no-repeat 50% 50%; 
}

/* ========================================================================
* 아이콘 기본정의 (공통)
* ======================================================================== */

/* 폰트 아이콘 */

@font-face {
	font-family: 'viewcar-font';
	src: url('./fonts/viewcar-font.eot?moi24y');
	src: url('./fonts/viewcar-font.eot?moi24y#iefix') format('embedded-opentype'), url('./fonts/viewcar-font.ttf?moi24y') format('truetype'), url('./fonts/viewcar-font.woff?moi24y') format('woff'), url('./fonts/viewcar-font.svg?moi24y#viewcar-font') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* 이미지 아이콘 */

.icon-spr {
	position: relative;
}

.icon-spr::before {
	content: '';
	display: block;
	position: absolute;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
}

/* ========================================================================
* 바로가기 메뉴 (공통)
* ======================================================================== */

#skip-navigation {
	position: absolute;
	width: 100%
}

#skip-navigation dt {
	position: absolute;
	top: -9999px
}

#skip-navigation a.skip {
	display: block;
	position: absolute;
	top: -99999px;
	left: 0;
	z-index: 100;
	width: 100%;
	background: #fff;
	border-bottom: 1px solid #cdcdcd;
	font-family: dotum;
	font-weight: 700;
	line-height: 40px;
	color: #333;
	text-align: center
}

#skip-navigation a.skip:hover, #skip-navigation a.skip:focus, #skip-navigation a.skip:active {
	top: 0
}

/* ========================================================================
* 상단 레이아웃 (공통)
* ======================================================================== */

#header, #container, #footer {
	padding-left: 5%;
	padding-right: 5%;
	margin-right: 61px;
}

#header {
	position: relative;
	z-index: 30;
	border-bottom: 2px solid #e91627;
	height: 92px; 
}

#header .section01 {
	width: 100%;
	min-height: 90px;
	margin: 0 auto;
	padding: 0 160px;
	font-size: 0;
}

#header .section01 .logo {
	position: absolute;
	top: 20px;
	left: 5%;
}

#header .section01 .logo span {
	display: block;
	margin-top: 5px;
	text-align: center;
	font-size: 0.857rem;
	letter-spacing: 3px;
}

#header .section01 .language {
	position: absolute;
	top: 50%;
	right: 10%;
	min-width: 100px;
	height: 30px;
	margin-top: -15px;
	border-color: #ccc;
	font-size: 1.000rem;
	line-height: 30px;
}

/* ========================================================================
* 상단메뉴 (공통)
* ======================================================================== */

#gnb {
	display: block;
}

#gnb ul li.depth1 {
	position: relative;
	display: inline-block;
	width: 25%;
}

#gnb ul li.depth1>a {
	display: block;
	padding: 22px 0 23px;
	color: #333;
	font-size: 1.214rem;
	line-height: 45px;
	text-align: center;
	font-weight: 500;
	color: #333;
}

#gnb ul li.depth1>a:hover, #gnb ul li.depth1.active>a {
	color: #ed1c24;
}

#gnb ul li ul {
	display: none;
	position: absolute;
	top: 92px;
	left: 0%;
	z-index: 20;
	width: 100%;
	height: 280px;
	padding-top: 20px;
	border-left: 1px solid #e5e5e5;
	background-color: #fff;
}

#gnb ul li.gnb04 ul {
	border-right: 1px solid #e5e5e5;
}

#gnb ul li ul li a {
	display: block;
	padding: 0 0 0 25px;
	font-size: 1.000rem;
	line-height: 26px;
	color: #888;
	font-weight: 300;
}

#gnb ul li ul li a:hover {
	color: #e60012;
}

.bg-gnb {
	display: none;
	position: absolute;
	top: 92px;
	left: 0;
	right: 0;
	z-index: 10;
	background-color: #fff;
	width: 100%;
	height: 280px;
	box-shadow: 0 5px 10px -4px rgba(0, 0, 0, 0.4);
}

/* ========================================================================
* 하단 레이아웃  (공통)
* ======================================================================== */

#footer {
	border-top: 1px solid #e3e3e3;
	padding-top: 20px;
	padding-bottom: 20px;
	height:123px;
}

#footer .section01 {
	position: relative;
	width: 100%;
	padding-left: 125px;
	font-size: 12px;
	color: #888;
	line-height: 18px;
	font-weight: 300;
}

#footer .section01 .logo {
	position: absolute;
	top: 50%;
	left: 90px;
	margin-top: -9px;
}

#footer .section01 ul li {
	position: relative;
	display: inline-block;
	margin-right: 20px;
}

#footer .section01 ul li::before {
	content: '';
	position: absolute;
	top: 4px;
	right: -11px;
	width: 1px;
	height: 11px;
	background-color: #e3e3e3;
}

#footer .section01 ul li:last-child::before {
	display: none;
}

#footer .section01 ul li a {
	display: block;
	color: #888;
}

#footer .section01 address {
	margin-top: 10px;
	font-style: normal;
}

#footer .section01 address span {
	display: inline-block;
	margin-right: 13px;
}

/* ========================================================================
* 우측 사이드 바 (공통)
* ======================================================================== */

#quick-menu {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 30;
	width: 61px;
	height: 100%;
	overflow: hidden;
}

#quick-menu .inner {
	position: absolute;
	top: 0;
	right: -261px;
	bottom: 0;
	z-index: 50;
	width: 322px;
	height: auto;
	border-left: 1px solid #e3e3e3;
	background-color: #fff;
	transition: all 0.4s ease;
}

#quick-menu .inner::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 59px;
	width: 1px;
	height: 100%;
	background-color: #e3e3e3;
	transition: all 0.4s ease;
}

#quick-menu .btn-closed {
	display: none;
	position: absolute;
	top: 10px;
	left: -17px;
	z-index: 10;
	font-size: 0;
	line-height: 0;
	transition: all 0.4s ease;
}

#quick-menu .btn-closed::before {
	content: '';
	display: block;
	width: 16px;
	height: 26px;
	background-position: -290px -0;
}

#quick-menu>.inner>ul>li>a {
	display: block;
	position: relative;
	width: 60px;
	height: 65px;
	padding-top: 5px;
	font-family: 'viewcar-font' !important;
	line-height: 1;
	letter-spacing: -1px;
}

#quick-menu>.inner>ul.login-before>li>a {
	height: 80px;
}

#quick-menu>.inner>ul.login-before>li>a:hover {
	color: #ec4754
}

#quick-menu>.inner>ul>li>a::before {
	display: block;
	width: 100%;
	padding-top: 9px;
	color: #333;
	font-size: 42px;
	letter-spacing: 0;
	text-align: center;
}

#quick-menu>.inner>ul>li>.active>a::before {
	color: #ec4754
}

#quick-menu>.inner>ul>li.active>a::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 0;
	width: 2px;
	height: 24px;
	margin-top: -12px;
	background-color: #ec4754;
}

#quick-menu>.inner>ul.login-before>li>a span {
	display: block;
	margin-top: 3px;
	font-size: 10px;
	text-align: center;
}

#quick-menu>.inner>ul.login-after>li>a span, #quick-menu>.inner>ul.login-after>li>a:focus-within {
	transition: all 0.4s ease;
}

#quick-menu>.inner>ul.login-after>li>a span {
	position: absolute;
	top: 50%;
	left: -100px;
	height: 28px;
	margin-top: -14px;
	padding: 0 10px;
	background-color: #333;
	border-radius: 3px;
	color: #fff;
	font-size: 12px;
	line-height: 28px;
	opacity: 0;
}

#quick-menu>.inner>ul.login-after>li>a span:before {
	content: '';
	display: block;
	position: absolute;
	top: 8px;
	right: -3px;
	width: 10px;
	height: 10px;
	background-color: #333;
	transform: rotate(45deg);
}

#quick-menu>.inner>ul.login-after>li>a:hover span {
	left: -64px;
	opacity: 1;
}

#quick-menu>.inner>ul.login-after>li.login>a:hover span, #quick-menu>.inner>ul.login-after>li.user>a:hover span, #quick-menu>.inner>ul.login-after>li.store>a:hover span {
	left: -54px;
}

#quick-menu>.inner>ul.login-after>li.api>a:hover span {
	left: -66px;
}

#quick-menu>.inner>ul.login-after>li.manual>a:hover span, #quick-menu>.inner>ul.login-after>li.mypage>a:hover span {
	left: -75px;
}

#quick-menu>.inner>ul.login-after>li.report>a:hover span {
	left: -87px;
}

#quick-menu li .cont {
	display: none;
	position: absolute;
	top: 153px;
	left: 60px;
	width: 260px;
	font-size: 0;
}

#quick-menu li.active .cont {
	display: block;
}

/* 타이틀 */

#quick-menu .cont h2.tit {
	padding-top: 20px;
	padding-left: 15px;
	border-top: 1px solid #e3e3e3;
	font-size: 1.000rem;
	color: #333;
	font-weight: 300;
}

#quick-menu .cont h2.tit.border {
	border-top-width: 5px;
}

#quick-menu .cont h2.tit2 {
	padding: 15px;
	border-top: 5px solid #e3e3e3;
	border-bottom: 1px solid #e3e3e3;
	font-size: 1.071rem;
	color: #333;
	font-weight: 400;
	text-align: center;
}

/* 2차메뉴 */

#quick-menu .sub-menu {
	margin-top: 20px;
	padding: 0 10px;
}

#quick-menu .sub-menu li {
	display: inline-block;
	width: 33.33%;
	margin-bottom: 20px;
	text-align: center;
	vertical-align: top;
}

#quick-menu .sub-menu li a {
	display: block;
	position: relative;
	font-size: 12px;
	color: #999;
	text-align: center;
	font-weight: 300;
	font-family: 'viewcar-font' !important;
	line-height: 1.3;
	letter-spacing: -1px;
}

#quick-menu .sub-menu li a::before {
	display: block;
	color: #999;
	font-size: 42px;
	letter-spacing: 0;
	line-height: 1;
}

#quick-menu .sub-menu li a:hover::before {
	color: #e72c3b;
}

/* 즐겨찾기 메뉴 */

#quick-menu .favorites-menu {
	margin-top: 20px;
	padding: 0 10px;
}

#quick-menu .favorites-menu li {
	display: inline-block;
	width: 33.33%;
	margin-bottom: 20px;
	text-align: center;
	vertical-align: top;
}

#quick-menu .favorites-menu li a {
	display: block;
	width: 100%;
	font-size: 12px;
	color: #999;
	text-align: center;
	font-weight: 300;
	line-height: 1.3;
}

#quick-menu .favorites-menu li a::before {
	display: block;
	width: 62px;
	height: 62px;
	margin: 0 auto 7px;
	padding-top: 8px;
	border: 1px solid #e3e3e3;
	border-radius: 3px;
	font-family: 'viewcar-font' !important;
	letter-spacing: -1px;
	font-size: 42px;
	line-height: 1;
}

#quick-menu .favorites-menu li a:hover::before {
	background-color: #e81626;
	border-color: #e81626;
	color: #fff;
}

/* 1차메뉴 아이콘 */

.icon-user::before {
	content: '\e954';
	color: #ed1c24 !important;
}

.icon-login::before {
	content: '\e900';
}

.icon-join::before, .icon-mypage::before {
	content: '\e901';
}

.icon-driving::before {
	content: '\e902';
}

.icon-vehicle::before {
	content: '\e903';
}

.icon-report::before {
	content: '\e904';
}

.icon-api::before {
	content: '\e905';
}

.icon-setting::before {
	content: '\e906';
}

.icon-manual::before {
	content: '\e907';
}

.icon-cs::before {
	content: '\e908';
}

.icon-store::before {
	content: '\e909';
}

/* 2차메뉴 아이콘 */

.icon-driving01::before {
	content: '\e90a';
}

.icon-driving02::before {
	content: '\e90b';
}

.icon-driving03::before {
	content: '\e90c';
}

.icon-driving04::before {
	content: '\e90d';
}

.icon-driving05::before {
	content: '\e90e';
}

.icon-driving06::before {
	content: '\e90f';
}

.icon-driving07::before {
	content: '\e910';
}

.icon-driving08::before {
	content: '\e911';
}

.icon-driving09::before {
	content: '\e912';
}

.icon-vehicle01::before {
	content: '\e914';
}

.icon-vehicle02::before {
	content: '\e915';
}

.icon-vehicle03::before {
	content: '\e916';
}

.icon-vehicle04::before {
	content: '\e917';
}

.icon-vehicle05::before {
	content: '\e918';
}

.icon-vehicle06::before {
	content: '\e919';
}

.icon-vehicle07::before {
	content: '\e91a';
}

.icon-vehicle08::before {
	content: '\e91b';
}

.icon-report01::before {
	content: '\e91e';
}

.icon-report02::before {
	content: '\e91f';
}

.icon-report03::before {
	content: '\e920';
}

.icon-report04::before {
	content: '\e921';
}

.icon-report05::before {
	content: '\e922';
}

.icon-report06::before {
	content: '\e923';
}

.icon-api01::before {
	content: '\e928';
}

.icon-api02::before {
	content: '\e929';
}

.icon-api03::before {
	content: '\e92a';
}

.icon-api04::before {
	content: '\e92b';
}

.icon-user01::before {
	content: '\e900';
}

.icon-user02::before {
	content: '\e906';
}

.icon-user03::before {
	content: '\e908';
}

.icon-user04::before {
	content: '\e907';
}

.icon-user05::before {
	content: '\e909';
}

.icon-user06::before {
	content: '\e952';
}

.icon-mypage01::before {
	content: '\e950';
}

.icon-mypage02::before {
	content: '\e951';
}

.icon-mypage03::before {
	content: '\e952';
}

.icon-mypage04::before {
	content: '\e953';
}

.icon-setting01::before {
	content: '\e946';
}

.icon-setting02::before {
	content: '\e947';
}

.icon-setting03::before {
	content: '\e948';
}

.icon-setting04::before {
	content: '\e949';
}

.icon-setting05::before {
	content: '\e94a';
}

.icon-setting06::before {
	content: '\e94b';
}

.icon-setting07::before {
	content: '\e94c';
}

.icon-setting08::before {
	content: '\e94d';
}

.icon-setting09::before {
	content: '\e94e';
}

.icon-setting10::before {
	content: '\e94f';
}

.icon-cs01::before {
	content: '\e936';
}

.icon-cs02::before {
	content: '\e937';
}

.icon-cs03::before {
	content: '\e938';
}

.icon-cs04::before {
	content: '\e939';
}

.icon-cs05::before {
	content: '\e93a';
}

.icon-cs06::before {
	content: '\e93b';
}

/* 상단으로 가기 */

#quick-menu #page-up {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 30;
	width: 59px;
	height: 40px;
	background-color: #fff;
	border-top: 1px solid #e3e3e3;
	transition: all 0.4s ease;
}

#quick-menu #page-up a {
	display: block;
	padding: 17px 0 0 13px;
	font-size: 0.857rem;
	color: #999;
}

#quick-menu #page-up a::before {
	top: 18px;
	left: 42px;
	width: 9px;
	height: 11px;
	background-position: -270px -0;
}

/* 사용자 정보 */

#quick-menu .user-info {
	position: absolute;
	top: 0;
	right: 0;
	background-color: #f7f7f7;
	width: 260px;
}

#quick-menu .user-info .top {
	padding: 0 15px;
	border-bottom: 1px solid #e3e3e3;
	height: 40px;
	font-size: 12px;
	line-height: 40px;
}

#quick-menu .user-info .top a {
	display: block;
	float: right;
}

#quick-menu .user-info .vehicle {
	position: relative;
	padding: 19px 19px 15px;
	font-size: 0.786rem;
}

#quick-menu .user-info .vehicle h2 {
	font-size: 1.000rem;
	color: #333;
}

#quick-menu .user-info .vehicle .name {
	display: inline-block;
	margin-top: 15px;
	margin-bottom: 3px;
	text-align: center;
}

#quick-menu .user-info .vehicle .name span {
	display: block;
	margin-top: 5px;
}

#quick-menu .user-info .vehicle ul {
	position: absolute;
	top: 45px;
	right: 15px;
	width: 100px;
}

#quick-menu .user-info .vehicle ul li {
	position: relative;
	margin-top: 7px;
	padding-left: 15px;
	font-weight: 300;
}

#quick-menu .user-info .vehicle ul li span {
	display: block;
	float: right;
}

#quick-menu .user-info .vehicle ul li::before {
	content: '';
	position: absolute;
	top: 1px;
	left: 0;
	width: 9px;
	height: 9px;
	border-radius: 50%;
}

#quick-menu .user-info .vehicle ul li.grade01::before {
	background-color: #a150cb;
}

#quick-menu .user-info .vehicle ul li.grade02::before {
	background-color: #ea2b7e;
}

#quick-menu .user-info .vehicle ul li.grade03::before {
	background-color: #69b2c2;
}

#quick-menu .user-info .vehicle .btn-next {
	position: absolute;
	top: 19px;
	left: 75px;
	font-size: 1.000rem;
	color: #e92534;
}

#quick-menu .user-info .vehicle .state-parking {
	display: inline-block;
	position: absolute;
	top: 15px;
	right: 15px;
	padding: 6px 15px;
	background-color: #a0a0a0;
	border-radius: 15px;
	color: #fff;
}

#quick-menu .user-info .vehicle .state-driving {
	display: inline-block;
	position: absolute;
	top: 15px;
	right: 15px;
	padding: 6px 15px;
	background-color: #0000ff;
	border-radius: 15px;
	color: #fff;
}

#quick-menu .user-info .vehicle .state-unused {
	display: inline-block;
	position: absolute;
	top: 15px;
	right: 15px;
	padding: 6px 15px;
	background-color: #ff0000;
	border-radius: 15px;
	color: #fff;
}

/* 차량 정보 */

#quick-menu .vehicle-condition {
	padding: 15px;
	border-top: 1px solid #e3e3e3;
	font-size: 0.857rem;
}

#quick-menu .vehicle-condition .top {
	text-align: center;
}

#quick-menu .vehicle-condition .top a {
	display: inline-block;
	width: 12px;
	height: 14px;
	font-size: 0;
	line-height: 0;
	vertical-align: top;
}

#quick-menu .vehicle-condition .top a::before {
	width: 12px;
	height: 14px;
}

#quick-menu .vehicle-condition .top a.prev::before {
	background-position: -240px -0;
}

#quick-menu .vehicle-condition .top a.next::before {
	background-position: -253px -0;
}

#quick-menu .vehicle-condition .top span {
	display: inline-block;
	margin: 0 5px;
	font-size: 1.000rem;
	color: #333;
	vertical-align: top;
}

#quick-menu .vehicle-condition .detail {
	position: relative;
	margin-top: 15px;
	font-size: 0;
}

#quick-menu .vehicle-condition .detail::before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 100%;
	height: 1px;
	background-color: #e3e3e3;
}

#quick-menu .vehicle-condition .detail dl {
	display: inline-block;
	width: 50%;
	padding: 13px 0 13px 8px;
}

#quick-menu .vehicle-condition .detail dt {
	font-size: 12px;
	font-weight: 300;
}

#quick-menu .vehicle-condition .detail dd {
	margin-top: 7px;
	font-size: 1.286rem;
	color: #333;
	font-weight: 500;
}

#quick-menu .vehicle-condition .detail dd span {
	font-size: 1.000rem;
	font-weight: 300;
}

/* 마스크 */

.bg-modal {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	z-index: 40;
	background: #000;
	filter: alpha(opacity=20);
	opacity: .2;
	/* transition: all 0.4s ease; */
}

/* 오픈시 */

#quick-menu.over {
	z-index: 50 !important;
	width: 100% !important;
}

body.open #quick-menu {
	overflow: hidden auto;
}

body.open #quick-menu>.inner::before {
	left: 59px;
}

body.open #quick-menu>.inner {
	right: 0;
}

body.open #quick-menu .btn-closed {
	display: block;
}

body.open .bg-modal {
	display: block;
}

/* ========================================================================
* 메인 페이지
* ======================================================================== */

#main {
	width: 100%;
}

#main .section01 {
	position: relative;
	margin-top: 80px;
	height: 470px;
}

#main .section01 .section-left {
	position: absolute;
	top: 0;
	left: 30px;
	width: 49%;
	height: 470px;
	padding-top: 280px;
}

#main .section01 .section-left::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 306px;
	height: 217px;
	background-image: url(../img/main/main-img01.png);
	background-repeat: no-repeat;
}

#main .section01 .section-left::after {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
	width: 255px;
	height: 392px;
	background-image: url(../img/main/main-img02.png);
	background-repeat: no-repeat;
}

#main .section01 .section-left a {
	display: block;
	width: 217px;
	margin-top: 8px;
}

#main .section01 .section-right {
	margin-left: 55%;
	font-size: 0;
}

#main .section01 .section-right .top a {
	display: inline-block;
	width: 40%;
	height: 175px;
	padding: 15px;
	background-color: #e91627;
	vertical-align: top;
	color: #fff;
	font-size: 1.143rem;
	font-weight: 500;
}

#main .section01 .section-right .top span {
	position: relative;
	display: inline-block;
	width: 60%;
	vertical-align: top;
}

#main .section01 .section-right .top span::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 10;
	width: 1px;
	height: 100%;
	background-color: #fff;
}

#main .section01 .section-right .top span a {
	width: 100%;
	height: 87px;
}

#main .section01 .section-right .top span a:last-child {
	margin-top: 1px;
}

#main .section01 .section-right .top .btn01::before {
	right: 25px;
	bottom: 15px;
	background-position: -0 -0;
	width: 37px;
	height: 37px;
}

#main .section01 .section-right .top .btn02::before {
	right: 20px;
	bottom: 15px;
	background-position: -60px -0;
	width: 33px;
	height: 33px;
}

#main .section01 .section-right .top .btn03::before {
	right: 20px;
	bottom: 15px;
	background-position: -120px -0;
	width: 25px;
	height: 33px;
}

#main .section01 .section-right .bottom {
	margin-top: 6px;
}

#main .section01 .section-right .bottom span {
	display: inline-block;
	vertical-align: top;
	width: 40%;
}

#main .section01 .section-right .bottom span a {
	display: block;
	width: 100%;
	height: 49px;
	margin-top: 1px;
	padding: 15px;
	background-color: #979797;
	color: #fff;
	font-size: 1.143rem;
}

#main .section01 .section-right .bottom span a:first-child {
	margin-top: 0;
}

#main .section01 .section-right .bottom .latest-board {
	position: relative;
	display: inline-block;
	width: 60%;
	height: 199px;
	padding: 10px 35px 15px 15px;
	background-color: #f2f2f2;
	vertical-align: top;
}

#main .section01 .section-right .bottom .latest-board::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 10;
	width: 1px;
	height: 100%;
	background-color: #fff;
}

#main .section01 .section-right .bottom .latest-board h2 a {
	font-size: 1.143rem;
	color: #333;
}

#main .section01 .section-right .bottom .latest-board ul li {
	margin-top: 15px;
}

#main .section01 .section-right .bottom .latest-board ul li a {
	position: relative;
	display: block;
	padding-left: 8px;
	font-size: 12px;
	line-height: 1.5;
	color: #333;
}

#main .section01 .section-right .bottom .latest-board ul li a:hover {
	text-decoration: underline;
}

#main .section01 .section-right .bottom .latest-board ul li a::before {
	content: '';
	display: block;
	position: absolute;
	top: 8px;
	left: 0;
	width: 2px;
	height: 2px;
	background-color: #222;
}

#main .section01 .section-right .bottom .latest-board .more {
	display: block;
	position: absolute;
	top: 10px;
	right: 40px;
}

#main .section01 .section-right .bottom .latest-board .more::before {
	background-position: -180px -0;
	width: 24px;
	height: 23px;
}

/* ========================================================================
* 대시보드 페이지(공통/개인)
* ======================================================================== */

#dashboard {
	padding: 50px 0 100px;
	font-weight: 300;
	color: #888;
	font-size: 13px;
}

#dashboard h2.tit {
	position: relative;
	min-height: 26px;
	margin-top: 40px;
	margin-bottom: 20px;
	padding-left: 10px;
	font-size: 1.571rem;
	color: #222;
}

#dashboard h2.tit::before {
	content: '';
	display: block;
	position: absolute;
	top: 3px;
	/* IE */
	top: -3px\0;
	left: 0;
	width: 3px;
	height: 18px;
	background-color: #666
}

#dashboard h2.tit select {
	height: 24px;
	line-height: 24px;
}

#dashboard .top {
	position: relative;
	padding-bottom: 10px;
	border-bottom: 2px solid #e3e3e3;
	color: #333;
}

#dashboard .top .name {
	font-size: 2.143rem;
	font-weight: 300;
}

#dashboard .top .name strong {
	font-weight: 500;
}

#dashboard .top .current-point {
	position: absolute;
	top: -25px;
	right: 0;
	font-size: 1.429rem;
	font-weight: 500;
	color: #3270c5;
}

#dashboard .top .current-point::before {
	content: '';
	display: inline-block;
	width: 26px;
	height: 28px;
	margin-right: 5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -180px -250px;
	vertical-align: -10px;
}

#dashboard .top .btn-wrap {
	position: absolute;
	top: 15px;
	right: 0;
}

#dashboard .top .btn-wrap button {
	margin-left: 15px;
	background-color: transparent;
	font-size: 1.000rem;
}

#dashboard .top .btn-wrap button::before {
	content: '';
	display: inline-block;
	margin-right: 5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
}

#dashboard .top .btn-wrap button.charge::before {
	width: 20px;
	height: 16px;
	background-position: -170px -70px;
	vertical-align: -2px;
}

#dashboard .top .btn-wrap button.use-list::before {
	width: 22px;
	height: 16px;
	background-position: -200px -70px;
	vertical-align: -3px;
}

#dashboard .row {
	margin: 0 -10px;
}

#dashboard .row .col {
	float: left;
	width: 50%;
	padding: 0 10px;
}

/* 고객님의 차량정보 */

#dashboard .individual-vehicle {
	border: 1px solid #e3e3e3;
}

#dashboard .individual-vehicle .vehicle {
	position: relative;
	min-height: 191px;
}

#dashboard .individual-vehicle .vehicle .img {
	position: absolute;
	top: 10px;
	left: 25px;
}

#dashboard .individual-vehicle .vehicle .img img {
	width: auto;
	height: 170px;
}

#dashboard .individual-vehicle .vehicle .info {
	margin-left: 300px;
	padding: 25px 0;
	font-size: 13px;
	color: #666;
	line-height: 1.35;
}

#dashboard .individual-vehicle .vehicle .info .tit {
	display: block;
	color: #333;
	font-weight: 400;
}

#dashboard .individual-vehicle .vehicle .info .state {
	margin-top: 15px;
}

#dashboard .individual-vehicle .vehicle .info .state div {
	display: inline-block;
	height: 1.714rem;
	background-color: #1f7021;
	padding-left: 1.000rem;
	padding-right: 1.000rem;
	border-radius: 3px;
	font-size: 12px;
	color: #fff;
	line-height: 1.714rem;
}

#dashboard .individual-vehicle .vehicle .info .state button {
	min-width: 10px;
	border-radius: 3px;
}

#dashboard .individual-vehicle .vehicle .next-vehicle {
	position: absolute;
	top: 50%;
	right: 15px;
	margin-top: -16px;
	background-color: transparent;
	font-size: 0;
	line-height: 0;
}

#dashboard .individual-vehicle .vehicle .next-vehicle::before {
	content: '';
	display: inline-block;
	width: 32px;
	height: 32px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -410px -0;
}

#dashboard .individual-vehicle .vehicle-detail {
	height: 250px;
	background-color: #f8f8f8;
	border-top: 1px solid #e3e3e3;
	padding: 20px;
}

#dashboard .individual-vehicle .vehicle-detail li {
	position: relative;
	float: left;
	width: 50%;
	min-height: 23px;
	padding: 5px 0 5px 90px;
	font-size: 13px;
	line-height: 1.4;
}

#dashboard .individual-vehicle .vehicle-detail li:nth-child(5) {
	width: 100%;
	;
}

#dashboard .individual-vehicle .vehicle-detail li button {
	min-width: 10px;
	border-radius: 3px;
}

#dashboard .individual-vehicle .vehicle-detail li span {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	color: #333;
	font-weight: 500;
}

#dashboard .individual-vehicle .vehicle-detail li span::after {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

/* 차량 위치 */

#dashboard .vehicle-position {
	border: 1px solid #e3e3e3;
}

#dashboard .vehicle-position .select {
	position: relative;
	padding: 10px 15px;
	border-bottom: 1px solid #e3e3e3;
	color: #333;
	font-weight: 400;
}

#dashboard .vehicle-position .select select {
	height: 22px;
	font-size: 12px;
	line-height: 22px;
	vertical-align: 0;
}

#dashboard .vehicle-position .select button {
	position: absolute;
	top: 50%;
	right: 20px;
	width: 21px;
	height: 21px;
	margin-top: -10px;
	background-color: transparent;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -230px -70px;
	font-size: 0;
	line-height: 0;
}

#dashboard .vehicle-position .select button.closed {
	background-position: -260px -70px;
}

#dashboard .vehicle-position .map {
	height: 348px;
}

#dashboard .vehicle-position .state {
	height: 50px;
	border-top: 1px solid #e3e3e3;
	font-size: 0;
	text-align: center;
}

#dashboard .vehicle-position .state>div {
	display: inline-block;
	width: 50%;
	font-size: 13px;
	color: #333;
	font-weight: 500;
}

#dashboard .vehicle-position .state .driving {
	border-right: 1px solid #e3e3e3;
}

#dashboard .vehicle-position .state .tit {
	display: inline-block;
	margin: 0 7px;
	line-height: 50px;
}

#dashboard .vehicle-position .state span {
	display: inline-block;
	margin: 0 7px;
	font-weight: 400;
}

#dashboard .vehicle-position .state span::before {
	content: '';
	display: inline-block;
	width: 17px;
	height: 24px;
	margin-right: 5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	vertical-align: -7px;
}

#dashboard .vehicle-position .state span.state01::before {
	background-position: -290px -70px;
}

#dashboard .vehicle-position .state span.state02::before {
	background-position: -310px -70px;
}

#dashboard .vehicle-position .state span.state03::before {
	background-position: -330px -70px;
}

#dashboard .vehicle-position .state span.state04::before {
	background-position: -350px -70px;
}

/* 운행통계 */

#dashboard .driving-stats {
	border: 1px solid #e3e3e3;
}

#dashboard .driving-stats h3 {
	position: absolute;
	top: -1px;
	left: -1px;
	width: 70px;
	height: 30px;
	padding-top: 7px;
	background-color: #444;
	color: #fff;
	text-align: center;
	font-weight: 300;
}

#dashboard .driving-stats .left {
	position: relative;
	float: left;
	width: 34%;
	margin-right: -1px;
	border-right: 1px solid #e3e3e3;
}

#dashboard .driving-stats .right {
	position: relative;
	float: left;
	width: 66%;
	border-left: 1px solid #e3e3e3;
}

#dashboard .driving-stats .right .chart .item {
	float: left;
	width: 50%;
}

#dashboard .driving-stats .right .chart .item>div:not(.txt) {
	padding: 40px 20px 30px;
}

#dashboard .driving-stats .right .chart .item .txt {
	text-align: center;
	font-weight: 400;
	color: #333;
}

#dashboard .driving-stats .right .chart .item.chart02 .txt {
	margin-top: 7px;
}

#dashboard .driving-stats .right .chart .item .txt .sub-txt {
	margin-top: 7px;
	font-size: 11px;
	color: #999;
}

#dashboard .driving-stats .right .chart .item .txt span {
	font-weight: 300;
}

#dashboard .driving-stats .right .chart .item .txt span.safe {
	color: #eb277c;
}

#dashboard .driving-stats .right .chart .item .txt span.fuel {
	color: #a150cc;
}

#dashboard .driving-stats .right .chart .item .txt span.echo {
	color: #62aebf;
}

#dashboard .driving-stats .right .chart .item .txt span i {
	font-style: normal;
}

#dashboard .driving-stats .right .chart .item .txt span i::before {
	content: '';
	display: inline-block;
	width: 1px;
	height: 10px;
	margin: 0 5px;
	background-color: #ccc;
}

#dashboard .driving-stats .left {
	padding: 20px;
}

#dashboard .driving-stats .right .grade {
	position: relative;
	padding-bottom: 30px;
	border-bottom: 1px solid #e3e3e3;
}

#dashboard .driving-stats .right .use {
	position: relative;
	padding-bottom: 30px;
}

/* 경비현황 */

#dashboard .expense-stats {
	position: relative;
	padding: 30px 40px;
	border: 1px solid #e3e3e3;
}

#dashboard .expense-stats h3 {
	position: absolute;
	top: -1px;
	left: -1px;
	width: 90px;
	height: 30px;
	padding-top: 7px;
	background-color: #444;
	color: #fff;
	text-align: center;
	font-weight: 300;
}

#dashboard .expense-stats .tab-menu {
	overflow: hidden;
}

#dashboard .expense-stats .tab-menu>li {
	float: left;
	width: 33.33%;
}

#dashboard .expense-stats .tab-menu>li>a {
	position: absolute;
	top: 10px;
	left: 100px;
	font-size: 12px;
	color: #888;
}

#dashboard .expense-stats .tab-menu>li>a::before {
	content: '';
	display: inline-block;
	margin: 0 5px;
	width: 1px;
	height: 10px;
	background-color: #e3e3e3;
}

#dashboard .expense-stats .tab-menu>li.list01>a::before {
	display: none;
}

#dashboard .expense-stats .tab-menu>li.on>a {
	color: #333;
	font-weight: 400;
}

#dashboard .expense-stats .tab-menu>li.list02>a {
	left: 120px;
}

#dashboard .expense-stats .tab-menu>li.list03>a {
	left: 160px;
}

#dashboard .expense-stats .tab-list {
	width: 300%;
	margin-top: 0;
	margin-left: 0;
}

#dashboard .expense-stats .tab-list .point {
	float: left;
	width: 60%;
	padding-top: 70px;
	padding-right: 40px;
	font-size: 2.143rem;
	color: #333;
	font-weight: 500;
	text-align: center;
}

#dashboard .expense-stats .tab-list .point::before {
	content: '';
	display: inline-block;
	width: 33px;
	height: 33px;
	margin-right: 7px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -230px -250px;
	vertical-align: -7px;
}

#dashboard .expense-stats .tab-list dl {
	float: left;
	width: 40%;
}

#dashboard .expense-stats .tab-list dl dt {
	border-bottom: 2px solid #ccc;
	padding-bottom: 10px;
	font-size: 1.143rem;
	font-weight: 500;
	color: #666;
}

#dashboard .expense-stats .tab-list dl dd {
	position: relative;
	padding: 10px 0;
	border-bottom: 1px solid #e3e3e3;
	font-size: 13px;
	font-weight: 400;
	color: #333;
}

#dashboard .expense-stats .tab-list dl dd::before {
	content: '';
	display: inline-block;
	margin: 0 10px 0 10px;
	width: 11px;
	height: 11px;
	border-radius: 50%;
}

#dashboard .expense-stats .tab-list dl dd.item01::before {
	background-color: #39bf9c;
}

#dashboard .expense-stats .tab-list dl dd.item02::before {
	background-color: #ffaa24;
}

#dashboard .expense-stats .tab-list dl dd.item03::before {
	background-color: #4581ff;
}

#dashboard .expense-stats .tab-list dl dd.item04::before {
	background-color: #ff3c69;
}

#dashboard .expense-stats .tab-list dl dd span {
	position: absolute;
	top: 9px;
	right: 10px;
}

/* 차량헬스 */

#dashboard .vehicle-condition {
	position: relative;
	height: 226px;
	border: 1px solid #e3e3e3;
}

#dashboard .vehicle-condition::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 55%;
	bottom: 0;
	width: 1px;
	height: 100%;
	background-color: #e3e3e3;
}

#dashboard .vehicle-condition .left {
	float: left;
	width: 55%;
	padding: 20px;
}

#dashboard .vehicle-condition .left .condition {
	text-align: center;
}

#dashboard .vehicle-condition .left .condition.good::before {
	content: '';
	display: block;
	width: 48px;
	height: 48px;
	margin: 0 auto;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -280px -250px;
}

#dashboard .vehicle-condition .left .condition strong {
	display: block;
	margin-top: 20px;
	font-size: 1.286rem;
	font-weight: 400;
	color: #555;
}

#dashboard .vehicle-condition .left .condition span {
	display: block;
	margin-top: 3px;
	font-size: 11px;
	color: #888;
}

#dashboard .vehicle-condition .left .list {
	border-top: 1px solid #e3e3e3;
	margin-top: 20px;
	padding-top: 15px;
	font-size: 0;
}

#dashboard .vehicle-condition .left .list span {
	display: inline-block;
	width: 33.33%;
	margin: 5px 0;
	font-size: 13px;
	font-weight: 400;
	color: #444;
}

#dashboard .vehicle-condition .left .list span::before {
	content: '';
	display: inline-block;
	margin-right: 5px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
}

#dashboard .vehicle-condition .left .list span.good::before {
	background-color: #11943e;
}

#dashboard .vehicle-condition .left .list span.bad::before {
	background-color: #ed1a26;
}

#dashboard .vehicle-condition .right {
	float: left;
	width: 45%;
}

#dashboard .vehicle-condition .right li {
	border-bottom: 1px solid #e3e3e3;
	height: 45px;
	line-height: 45px;
	color: #333;
}

#dashboard .vehicle-condition .right li .tit {
	display: inline-block;
	width: 80px;
	font-weight: 400;
}

#dashboard .vehicle-condition .right li a {
	position: relative;
	display: block;
	padding-left: 20px;
}

#dashboard .vehicle-condition .right li a::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 20px;
	width: 7px;
	height: 13px;
	margin-top: -6px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -0 -70px;
}

/* ========================================================================
* 대시보드 페이지(기업)
* ======================================================================== */

#dashboard .service table.table thead th {
	white-space: normal;
	font-size: 13px;
	line-height: 1.4;
}

#dashboard .service table.table tbody td {
	font-size: 12px;
}

#dashboard .ranking {
	position: relative;
	height: 190px;
}

#dashboard .ranking table {
	width: 1905px;
}

#dashboard .ranking table td {
	position: relative;
	height: 190px;
	padding: 30px 65px 0;
	border: 1px solid #e3e3e3;
	text-align: center;
	line-height: 1.4;
}

#dashboard .ranking table td img {
	width: 130px;
	height: auto;
}

#dashboard .ranking table td .num {
	position: absolute;
	top: -1px;
	left: -1px;
	width: 30px;
	height: 30px;
	padding-top: 5px;
	font-style: normal;
	background-color: #ed1f2b;
	color: #fff;
	text-align: center;
}

#dashboard .ranking table td:nth-child(4) .num, #dashboard .ranking table td:nth-child(5) .num, #dashboard .ranking table td:nth-child(6) .num, #dashboard .ranking table td:nth-child(7) .num {
	background-color: #666;
}

#dashboard .ranking table td strong {
	display: block;
	margin-top: 5px;
	font-size: 1.071rem;
	color: #333;
	font-weight: 400;
}

#dashboard .ranking table td span {
	display: block;
	white-space: nowrap;
	color: #999;
}

#dashboard .ranking .tab-menu2 {
	overflow: hidden;
}

#dashboard .ranking .tab-menu2>li>a {
	position: absolute;
	top: -35px;
	right: 80px;
	font-size: 12px;
	color: #888;
}

#dashboard .ranking .tab-menu2>li.list02>a {
	right: 40px;
}

#dashboard .ranking .tab-menu2>li.list03>a {
	right: 0;
}

#dashboard .ranking .tab-menu2>li>a::before {
	content: '';
	display: inline-block;
	margin: 0 5px;
	width: 1px;
	height: 10px;
	background-color: #e3e3e3;
}

#dashboard .ranking .tab-menu2>li.list01>a::before {
	display: none;
}

#dashboard .ranking .tab-menu2>li.on>a {
	color: #333;
	font-weight: 400;
}

#dashboard .ranking .tab-menu2 .tab-list {
	position: absolute;
	top: -9999px;
	width: 100%;
}

#dashboard .ranking .tab-menu2 .on .tab-list {
	top: 0;
}

#dashboard .vehicle-cost {
	position: relative;
	height: 225px;
}

#dashboard .vehicle-cost table {
	width: 913px;
}

#dashboard .vehicle-cost table td {
	position: relative;
	height: 225px;
	padding: 30px 35px 0;
	border: 1px solid #e3e3e3;
	text-align: center;
	line-height: 1.4;
}

#dashboard .vehicle-cost table td img {
	width: 84px;
	height: auto;
}

#dashboard .vehicle-cost table td .num {
	position: absolute;
	top: -1px;
	left: -1px;
	width: 30px;
	height: 30px;
	padding-top: 5px;
	font-style: normal;
	background-color: #ed1f2b;
	color: #fff;
	text-align: center;
}

#dashboard .vehicle-cost table td:nth-child(4) .num, #dashboard .vehicle-cost table td:nth-child(5) .num {
	background-color: #666;
}

#dashboard .vehicle-cost table td strong {
	display: block;
	margin-top: 15px;
	font-size: 1.071rem;
	color: #333;
	font-weight: 400;
}

#dashboard .vehicle-cost table td span {
	display: block;
	margin-top: 15px;
	color: #999;
}

#dashboard .vehicle-cost .tab-menu3 {
	overflow: hidden;
}

#dashboard .vehicle-cost .tab-menu3>li>a {
	position: absolute;
	top: -35px;
	right: 70px;
	font-size: 12px;
	color: #888;
}

#dashboard .vehicle-cost .tab-menu3>li.list02>a {
	right: 35px;
}

#dashboard .vehicle-cost .tab-menu3>li.list03>a {
	right: 0;
}

#dashboard .vehicle-cost .tab-menu3>li>a::before {
	content: '';
	display: inline-block;
	margin: 0 5px;
	width: 1px;
	height: 10px;
	background-color: #e3e3e3;
}

#dashboard .vehicle-cost .tab-menu3>li.list01>a::before {
	display: none;
}

#dashboard .vehicle-cost .tab-menu3>li.on>a {
	color: #333;
	font-weight: 400;
}

#dashboard .vehicle-cost .tab-menu3 .tab-list {
	position: absolute;
	top: -9999px;
	width: 100%;
}

#dashboard .vehicle-cost .tab-menu3 .on .tab-list {
	top: 0;
}

/* ========================================================================
* 대시보드 페이지(제휴기업)
* ======================================================================== */

#dashboard .table .btn-wrap {
	margin-top: 3px;
	margin-bottom: 3px;
}

#dashboard .table .btn-wrap button {
	position: relative;
	display: inline-block;
	margin: 0 5px;
	background-color: transparent;
	border: none;
	font-size: 12px;
	color: #888;
}

#dashboard .table .btn-wrap button:first-child::after {
	content: '';
	position: absolute;
	top: 5px;
	right: -8px;
	width: 1px;
	height: 10px;
	background-color: #e3e3e3;
}

#dashboard .btn-function.title-side {
	margin-top: -50px;
}

#dashboard .table div.reply {
	position: relative;
	margin-top: 15px;
	padding-top: 15px;
	padding-left: 30px;
	border-top: 1px solid #e3e3e3;
}

#dashboard .table div.reply::before {
	content: '';
	display: block;
	position: absolute;
	top: 20px;
	left: 5px;
	width: 10px;
	height: 10px;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
}

#dashboard .table div.insert-reply {
	margin-top: 20px;
}

#dashboard .table div.insert-reply textarea {
	width: 100%;
	min-height: 80px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
}

#dashboard .table td.insert-reply {
	vertical-align: bottom;
	padding-bottom: 40px;
}

/* ========================================================================
* 콘텐츠 페이지 기본 정의 (공통)
* ======================================================================== */

#sub-container {
	width: 100%;
	margin: 0 auto;
	padding: 60px 0 100px;
}

/* 각 페이지 대제목(공통) */

#sub-container .page-header {
	padding-bottom: 10px;
	border-bottom: 2px solid #ccc;
}

#sub-container .page-header h2 {
	display: inline-block;
	margin-right: 15px;
	font-size: 2.143rem;
	color: #272727;
	font-weight: 500;
	vertical-align: bottom;
}

#sub-container .page-header h2.md {
	vertical-align: middle
}

#sub-container .page-header span {
	display: inline-block;
	font-size: 1.000rem;
	color: #888;
	font-weight: 300;
	vertical-align: middle;
	line-height: 1.3;
}

/* 콘텐츠 페이지 내부 사용(공통) */

#contents-page {
	margin-top: 20px;
	color: #888;
	font-weight: 300;
}

/* 제목 h3유형1 - (제목 위에 붉은색 선 디자인)(공통) */

#contents-page h3.tit {
	font-size: 1.571rem;
	color: #222;
}

#contents-page h3.tit::before {
	content: '';
	display: block;
	margin-bottom: 7px;
	width: 20px;
	height: 3px;
	background-color: #e81626;
}

/* 제목 h3유형2 - (제목앞에 검정 세로 바 디자인)(공통) */

#contents-page h3.tit2 {
	position: relative;
	padding-left: 10px;
	font-size: 1.571rem;
	color: #222;
}

#contents-page h3.tit2::before {
	content: '';
	display: block;
	position: absolute;
	top: 3px;
	/* IE */
	top: -3px\0;
	left: 0;
	width: 3px;
	height: 18px;
	background-color: #666
}

/* 제목 h3유형3 - (박스형 레이아웃 디자인)(공통) */

#contents-page h3.tit3 {
	font-size: 2.143rem;
	color: #222;
}

/* 제목 h4유형1 - h3유형1이 상단에 있는 경우 하위 제목으로 노출 - (제목앞에 검정 세로 바 디자인)(공통)*/

#contents-page h4.tit {
	position: relative;
	padding-left: 10px;
	font-size: 1.286rem;
	color: #222;
}

#contents-page h4.tit::before, #contents-page h4.tit::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 3px;
	height: 9px;
	background-color: #666
}

#contents-page h4.tit::after {
	top: 9px;
	background-color: #333;
}

/* 제목 h4유형2 - (박스형 레이아웃 디자인)(공통) */

#contents-page h4.tit2 {
	font-size: 1.429rem;
	color: #333;
}

#contents-page p.txt01 {
	margin-top: 15px;
	font-size: 1.000rem;
	line-height: 1.714rem;
	color: #888;
	font-weight: 300;
}

#contents-page p.txt01 .red {
	color: #e81626;
}

#contents-page p.txt01 strong {
	font-weight: 500;
	color: #333;
}

/* 
 * @제목 하단 기본 텍스트
 * 메인(개인).html
 * 메인(기업).html
 * 환경설정-단위선택(1).html
 * 환경설정-단위선택(2).html
 */

.sub-txt {
	margin-top: 20px;
	font-size: 1.143rem;
}

/* table(공통) */

table.table {
	width: 100%;
	border-top: 1px solid #e3e3e3;
}

table.table input[type='text'], table.table input[type='password'], table.table input[type='number'], table.table input[type='tel'], table.table input[type='email'], table.table input[type='file'], table.table select {
	width: 100%;
}

table.table thead th {
	padding: 1.000rem 0.714rem;
	background-color: #f7f7f7;
	border: 1px solid #e3e3e3;
	font-size: 1.000rem;
	color: #333;
	text-align: center;
	font-weight: 400;
	line-height: 1.4;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden
}

table.table thead th.order::after {
	content: '▼';
	margin-left: 3px;
	font-size: 10px;
	vertical-align: 2px;
	color: #3270c5;
}

table.table thead th.order.active::after {
	content: '▲';
	color: #e60012;
}

table.table tbody th {
	position: relative;
	width: 180px;
	padding: 10px 10px 10px 15px;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	text-align: left;
	font-size: 1.000rem;
	color: #333;
	font-weight: 400;
	line-height: 1.4;
	vertical-align: middle;
}

table.table tbody th.help {
	display: table-cell;
}

table.table tbody th.help:hover {
	z-index: 110;
}

table.table tbody th.help::after {
	content: '?';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: red;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	line-height: 1.4;
}

table.table tbody th.help .layer {
	display: none;
	position: absolute;
	top: 50px;
	left: 10px;
	width: 400px;
	height: auto;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	padding: 20px;
	z-index: 200;
}

table.table tbody th.help:hover .layer {
	display: block;
}

table.table tbody td {
	padding: 0.357rem 0.714rem;
	border: 1px solid #e3e3e3;
	font-size: 1.000rem;
	color: #888;
	line-height: 1.4;
	vertical-align: middle;
}

table.table tbody td.left {
	text-align: left !important;
}

table.table tbody td.bd-rt {
	border-right: 1px solid #e3e3e3 !important;
}

table.table tfoot {
	background-color: #f8f8f8;
}

table.table tfoot th, table.table tfoot td {
	/* padding: 0.357rem 0.714rem; */
	/* border: 1px solid #e3e3e3; */
	/* border-top: 3px solid #e3e3e3; */
	/* font-size: 1.000rem; */
	/* font-weight: 300; */
	/* color: #888; */
	/* line-height: 1.4; */
	/* vertical-align: middle; */
	/* color: #ff6600; */
	/* font-weight: 500; */
}

table.table tfoot th {
	padding: 10px 10px 10px 15px;
	text-align: left;
	color: #333;
}

table.table .car-img span {
	display: inline-block;
	margin: 0 2px;
	vertical-align: middle
}

table.table .car-img span.img img {
	vertical-align: middle;
}

table.table .user-img span {
	display: inline-block;
	margin: 0 2px;
	vertical-align: middle
}

table.table .user-img span.img img {
	vertical-align: middle;
}

/* 목록형 table(공통) */

table.table.list thead th {
	border: none;
	vertical-align: middle;
	line-height: 24px;
	/* width: 50%; */
}

table.table.list tbody {
	border-top: 1px solid #e3e3e3;
}

table.table.list tbody td {
	padding: 0.571rem 0.714rem;
	border: none;
	border-bottom: 1px solid #e3e3e3;
	vertical-align: middle;
	text-align: center
}

table.table.list tbody td a {
	text-decoration: none;
	color: #222;
}

table.table.list tbody tr:hover td a {
	text-decoration: underline;
}

/*  border table(공통) */

table.table.border th, table.table.border td {
	border: 1px solid #e3e3e3 !important;
}

/* 
 * @ table 내부에 table
 * 회원가입-4단계(기업).html
 * 회원가입-5단계(기업).html
 * 환경설정-My서비스스토어(2).html
 * 운행정보-버스(셔틀)노선정보(3).html
 * 차량관리-벌점과태료(2).html
 * 차량관리-정비현황조회등록(2).html
 */

table.table td.table {
	padding: 0;
}

table.table td.table table {
	width: 100%;
}

table.table td.table tr th:first-child {
	border-left: none;
}

table.table td.table tr:first-child th, table.table td.table tr:first-child td {
	border-top: none;
}

table.table td.table tr:last-child th, table.table td.table tr:last-child td {
	border-bottom: none;
}

table.table td.table tr td:last-child {
	border-right: none;
}

/* 
 * @ 안내 텍스트
 * 회원가입-4단계(개인).html
 * 회원가입-4단계(기업직원회원).html
 * 회원가입-5단계(개인).html
 * 회원가입-5단계(기업직원회원).html
 * 환경설정-차량등록(기업)(2).html
 * 환경설정-차량등록(특수차량)(3).html
 * 환경설정-차량등록(4)(상세페이지-기업).html
 * 마이페이지-회원정보설정(개인).html
 */

table.table td.txt01 {
	padding: 1.429rem;
	background-color: #f7f7f7;
	border-left: 1px solid #e3e3e3;
	line-height: 1.6;
	color: #333;
}

table.table .necessary {
	color: #e60012;
}

/* 
 * @ 경고문구
 * 회원가입-사전단계.html
 * 보고서결재-차량보고서조회제출(1).html
 */

table.table .warning {
	padding: 5px 0;
	font-size: 1.071rem;
	color: #e60012;
}

/* 
 * @ ! 중요표시
 * 운행정보-미배차운행(1).html
 * 보고서결재-차량사고보고서(1).html
 */

table.table .important {
	color: #e60012;
	font-weight: 500;
}

table.table .important::after {
	content: '!';
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-left: 5px;
	background-color: red;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	line-height: 20px;
	font-size: 14px;
	vertical-align: 0;
}

/* 
 * @테이블 iscroll
 * 메인(기업).html
 * 메인(렌트카).html
 * 보고서결재-운행통계.html
 */

#table-iscroll {
	position: relative;
}

/* 차량 상태(공통) */

.car-state-normal {
	color: #74b94b !important;
}

.car-state-error {
	color: #e0131d !important;
}

/* 
 * @차량 상세정보 
 * 운행정보-상세운행기록.html
 * 운행정보-등록차량상세정보.html
 * 보고서결재-차량보고서조회제출(2).html
 */

.car-info {
	padding: 0.357rem 0;
}

.car-info ul {
	font-size: 0;
}

.car-info ul li {
	display: inline-block;
	position: relative;
	width: 33.33%;
	font-size: 1.000rem;
	line-height: 2;
}

.car-info ul li span {
	display: inline-block;
	width: 90px;
	color: #555;
	font-weight: 500;
}

.car-info .spec {
	margin-top: 1.000rem;
	padding-top: 1.000rem;
	border-top: 1px dashed #ccc;
}

.car-info .current {
	margin-top: 10px;
	color: #e60012;
	font-weight: 500;
}

/* 
 * @차량 정보 (좌측에 차량 우측에 정보) 노출
 * 운행정보-등록차량상세정보.html
 * 차량관리-정비현황조회등록(2).html
 * 차량관리-정비현황조회등록(3).html
 */

.vehicle-info {
	position: relative;
	min-height: 315px;
	margin-top: 30px;
}

.vehicle-info>.img {
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -121.5px;
}

.vehicle-info>.info {
	margin-left: 380px;
}

.vehicle-info>.info tbody::after {
	content: '';
	display: block;
	height: 10px;
}


.vehicle-info2 {
	position: relative;
	min-height: 245px;
	margin-top: 30px;
}

.vehicle-info2>.img {
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -121.5px;
}

.vehicle-info2>.info {
	margin-left: 380px;
}

.vehicle-info2>.info tbody::after {
	content: '';
	display: block;
	height: 10px;
}
/**/

/* 
 * @회원 정보 (좌측에 회원 우측에 정보) 노출
 * 마이페이지-회원정보설정(개인).html
 * 마이페이지-회원정보설정(기업).html
 * 마이페이지-회원정보설정(기업일반직원회원).html
 * 보고서결재-차량보고서조회제출(2).html
 */

.user-info2 {
	position: relative;
	min-height: 105px;
	margin-top: 30px;
}

.user-info2>.img {
	position: absolute;
	top: 0;
	left: 0;
}

.user-info2>.img .file {
	margin-top: 5px;
}

.user-info2>.img .file input {
	display: none;
}

.user-info2>.img .file label {
	position: relative;
	display: block;
	width: 115px;
	height: 36px;
	margin-top: 10px;
	padding-top: 9px;
	padding-left: 40px;
	border: 1px solid #e3e3e3;
	cursor: pointer;
}

.user-info2>.img .file label::before {
	content: '';
	display: block;
	position: absolute;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	top: 10px;
	left: 14px;
	width: 16px;
	height: 13px;
	background-position: -260px -50px;
}

.user-info2>.info {
	margin-left: 140px;
}

.user-info2>.info tbody::after {
	content: '';
	display: block;
	height: 10px;
}

.user-info2 .same {
	position: absolute;
	top: -30px;
	right: 0;
}



/*
 * @위반목록
 * 운행정보-등록차량상세정보.html
 * MAP설정.html
 */

.violation-list {
	margin-top: 30px;
}

.violation-list .inner {
	padding: 20px;
	border: 1px solid #e3e3e3;
	text-align: center;
}

.violation-list .inner div {
	display: inline-block;
	margin: 0 20px;
	padding: 5px;
}

.violation-list .inner div span {
	color: #e60012;
	font-weight: 500;
}

.violation-list .inner div::before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 16px;
	margin-right: 5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	vertical-align: -4px;
}

.violation-list .inner div.list01::before {
	background-position: -150px -200px;
}

.violation-list .inner div.list02::before {
	background-position: -170px -200px;
}

.violation-list .inner div.list03::before {
	background-position: -190px -200px;
}

.violation-list .inner div.list04::before {
	background-position: -210px -200px;
}

.violation-list .inner div.list05::before {
	background-position: -230px -200px;
}

.violation-list .inner div.list06::before {
	background-position: -250px -200px;
}

.violation-list .inner div.list07::before {
	background-position: -270px -200px;
}

.violation-list .inner div.list08::before {
	background-position: -290px -200px;
}

/* 탭 디자인 메뉴(공통) */

.page-tab {
	position: relative;
	margin-top: 30px;
	overflow: hidden;
}

.page-tab::after {
	content: '';
	display: block;
	position: absolute;
	top: 46px;
	width: 100%;
	height: 1px;
	background-color: #e60012;
}

.page-tab>li {
	position: relative;
	float: left;
	width: 50%;
}

.page-tab.col-3>li {
	width: 33.33%;
}

.page-tab.col-4>li {
	width: 25%;
}

.page-tab.col-5>li {
	width: 20%;
}

.page-tab>li>a {
	display: block;
	position: relative;
	margin-left: -1px;
	border: 1px solid #e3e3e3;
	border-bottom: 1px solid #e60012;
	color: #272727;
	font-size: 1.000rem;
	line-height: 45px;
	text-align: center;
	color: #999;
}

.page-tab>li:first-child>a {
	margin-left: 0
}

.page-tab>li.on {
	z-index: 1
}

.page-tab>li.on>a {
	border: 1px solid #e60012;
	border-bottom: 1px solid #fff;
	color: #272727;
}

/* 박스형 텍스트 디자인(공통) */

.box-info {
	margin-top: 30px;
	padding: 15px 20px;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
}

.box-info h4 {
	position: relative;
	margin-top: 15px;
	margin-bottom: 10px;
	font-size: 1.143rem;
	color: #333;
	font-weight: 500;
	letter-spacing: -.5px;
}

.box-info ul li {
	position: relative;
	margin-top: 5px;
	padding-left: 10px;
	line-height: 1.4;
	font-size: 12px;
}

.box-info ul li::before {
	content: '';
	display: block;
	position: absolute;
	top: 8px;
	left: 0;
	width: 5px;
	height: 1px;
	background-color: #888;
}

.box-info ul li:first-child {
	margin-top: 0;
}

.box-info ul li strong {
	display: inline-block;
	width: 70px;
	font-weight: 400;
	color: #666;
}

.box-info ul li .state {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 5px;
	border-radius: 50%;
	font-size: 0;
	vertical-align: 10px;
}

.box-info ul li .normal {
	background-color: #74b94b;
}

.box-info ul li .error {
	background-color: #e60012;
}

.box-info p {
	line-height: 1.5;
	font-size: 12px;
}

/* 운행정보(공통) */

.driving-info {
	position: relative;
	line-height: 1.8;
}

.driving-info.with-btn {
	padding-right: 30px;
}

.driving-info li {
	position: relative;
	line-height: 1.5;
	letter-spacing: -0.7px;
}

.driving-info li:first-child {
	margin-top: 0;
}

.driving-info li strong.title {
	float: left;
	width: 80px;
	font-weight: 500;
	color: #555;
}

.driving-info li strong.title.w40 {
	width: 40px
}

.driving-info li strong.title.w50 {
	width: 50px
}

.driving-info li span {
	display: block;
	overflow: hidden;
}

.driving-info li strong.reference {
	margin-left: 20px;
	color: #ed1c24;
}

.driving-info li strong.reference::before {
	content: '!';
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background-color: #ed1c24;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	line-height: 20px;
	vertical-align: -1px;
}

.driving-info button.btn-img {
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -11.5px;
}

/* 탭 메뉴(공통) */

.tab-menu li .tab-list {
	display: none;
	width: 400%;
	margin-top: 30px
}

.tab-menu.col-5 li .tab-list {
	width: 500%
}

.tab-menu li.on .tab-list {
	display: block
}

.tab-menu li.list02 .tab-list {
	margin-left: -100%
}

.tab-menu li.list03 .tab-list {
	margin-left: -200%
}

.tab-menu li.list04 .tab-list {
	margin-left: -300%
}

.tab-menu li.list05 .tab-list {
	margin-left: -400%
}

/* ul 스타일(공통) */

ul.type-01 {
	margin-top: 20px;
}

ul.type-01 li {
	position: relative;
	margin-top: 7px;
	padding-left: 15px;
}

ul.type-01 li:first-child {
	margin-top: 0;
}

ul.type-01 li::before {
	content: '';
	display: block;
	position: absolute;
	top: 7px;
	left: 0;
	width: 7px;
	height: 1px;
	background-color: #ccc;
}

/* 분할(공통) */

.division {
	display: table;
	width: 100%;
}

.division>div {
	display: table-cell;
}

.division>div.space {
	width: 5px;
}

.division .col-1 {
	width: 8.33333333%;
}

.division .col-2 {
	width: 16.66666667%;
}

.division .col-3 {
	width: 25%;
}

.division .col-4 {
	width: 33.33333333%;
}

.division .col-5 {
	width: 41.66666667%;
}

.division .col-6 {
	width: 50%;
}

.division .col-7 {
	width: 58.33333333%;
}

.division .col-8 {
	width: 66.66666667%;
}

.division .col-9 {
	width: 75%;
}

.division .col-10 {
	width: 83.33333333%;
}

.division .col-11 {
	width: 91.66666667%;
}

.division .col-12 {
	width: 100%;
}

.text-end {
	position: relative;
}

.text-end span.text {
	position: absolute;
	top: 0;
	right: 10px;
	bottom: 0;
}

.text-end span.text::after {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

/* 상태값 노출(공통)  */

.states-value {
	display: inline-block;
	margin-top: 3px;
	margin-bottom: 3px;
	padding: 2px 8px 0;
	/* IE */
	padding: 5px 8px 0 \0;
	min-width: 76px;
	height: 24px;
	border-radius: 20px;
	text-align: center;
	font-size: 12px;
	line-height: 1.4;
	font-weight: 300;
}

button.states-value {
	padding-top: 0;
}

.states-value.state01 {
	border: 1px solid #e3e3e3;
	background-color: #f7f7f7;
	cursor: pointer;
}

.states-value.state02 {
	border: 1px solid #1b733c;
	background-color: #1b733c;
	color: #fff;
}

.states-value.state03 {
	border: 1px solid #ed1c24;
	background-color: #ed1c24;
	color: #fff;
}

.states-value.state04 {
	border: 1px solid #3270c5;
	background-color: #3270c5;
	color: #fff;
}

.states-value.state05 {
	border: 1px solid #333;
	background-color: #333;
	color: #fff;
}

.states-value.state06 {
	border: 1px solid #888;
	background-color: #888;
	color: #fff;
}

.states-value.state07 {
	border: 1px solid #5b5b5b;
	background-color: #5b5b5b;
	color: #fff;
}

.states-value.state08 {
	border: 1px solid #d7841e;
	background-color: #d7841e;
	color: #fff;
}

/* 페이징(공통) */

#paging {
	margin-top: 40px;
	font-size: 0;
	text-align: center;
}

#paging span.current {
	display: inline-block;
	width: 29px;
	height: 29px;
	margin: 0 5px;
	vertical-align: middle;
	font-size: 1.143rem;
	color: #333;
	line-height: 29px;
}

#paging a {
	display: inline-block;
	width: 29px;
	height: 29px;
	margin: 0 5px;
	vertical-align: middle;
	line-height: 29px;
}

#paging a.num {
	font-size: 1.143rem;
}

#paging a:not(.num) {
	border: 1px solid #e3e3e3;
	border-radius: 50%;
}

#paging a:not(.num)::before {
	top: 9px;
	width: 7px;
	height: 9px;
}

#paging a.first::before, #paging a.prev::before {
	left: 10px;
}

#paging a.next::before, #paging a.last::before {
	left: 11px;
}

#paging a.first::before {
	background-position: -0 -50px;
}

#paging a.prev::before {
	background-position: -20px -50px;
}

#paging a.next::before {
	background-position: -40px -50px;
}

#paging a.last::before {
	background-position: -60px -50px;
}

/*  페이지 상단 상태값 및 현재시간 표시(공통) */

#contents-page .top-state {
	font-size: 1.000rem;
	color: #888;
	font-weight: 300;
	min-height: 30px;
}

#contents-page .top-state .item {
	float: left;
}

#contents-page .top-state .item span {
	display: inline-block;
	margin-right: 8px;
	color: #666;
}

#contents-page .top-state .item span strong {
	font-weight: 700;
	color: #ed1c24;
}

#contents-page .top-state .item span.division {
	position: relative;
	width: auto;
	margin-left: 15px;
}

#contents-page .top-state .item span.division::before {
	content: '';
	display: block;
	position: absolute;
	top: 2px;
	left: -11px;
	width: 1px;
	height: 10px;
	background-color: #ccc;
}

#contents-page .top-state .time {
	float: right;
}

#contents-page .top-state .time span {
	display: inline-block;
	margin-left: 7px;
}

#contents-page .top-state .time .btn {
	margin: 0 0 0 10px;
	min-width: 65px;
	height: 24px;
	font-size: 1.000rem !important;
}

/* 페이지 상단 검색(공통) */

#contents-page .top-search {
	margin-top: 30px;
	padding: 2.000rem 0;
	background-color: #f7f7f7;
	border: 1px solid #e3e3e3;
	text-align: center;
}

#contents-page .top-search select {
	min-width: 160px;
	height: 3.214rem;
}

#contents-page .top-search input {
	min-width: 400px;
	height: 3.214rem;
}

#contents-page .top-search button {
	vertical-align: top;
}

#contents-page .top-search span.search-tit {
	font-weight: 500;
	color: #333;
	margin: 0 5px 0 20px;
}

/* 박스 디자인 버튼(공통) */

.box-register {
	position: relative;
	min-height: 80px;
	margin-top: 1.429rem;
	padding: 2.143rem 13.571rem 2.143rem 2.143rem;
	border: 1px solid #e3e3e3;
	font-size: 1.143rem;
	font-weight: 300;
	color: #888;
	line-height: 1.4;
}

.box-register .right {
	position: absolute;
	top: 50%;
	right: 25px;
	margin-top: -1.786rem;
}

.box-register .right button {
	min-width: 10.00rem;
	height: 3.571rem;
}

.box-register a.link01 {
	color: #3270c5;
	text-decoration: underline;
}

.box-register .type-01 li::before {
	top: 11px;
}

/* ========================================================================
 * @ tbody 스크롤
 * 환경설정-부서차량등록(1).html
 * 환경설정-서비스스토어(1).html
 * 운행정보-미배차운행(1).html
 * 운행정보-운행일지.html
 * 보고서결재-결재관리(1).html
 * 보고서결재-국세청운행일지.html
* ======================================================================== */

.scroll-table .table {
	display: flex;
	flex-flow: column;
	height: 100%;
	width: 100%;
	background-color: #f7f7f7;
}

.scroll-table .table thead {
	flex: 0 0 auto;
	width: calc(100% - 17px);
}

.scroll-table .table tbody {
	flex: 1 1 auto;
	display: block;
	overflow-y: scroll;
	background-color: #fff;
}

.scroll-table .table tbody tr {
	width: 100%;
}

.scroll-table .table thead, .scroll-table .table tbody tr {
	display: table;
	table-layout: fixed;
}

/* 환경설정-부서차량등록(1).html - 구성원 */

#user-dialog .scroll-table {
	height: 319px;
}

#user-dialog .scroll-table thead th:nth-of-type(1), #user-dialog .scroll-table tbody td:nth-of-type(1) {
	width: 81px;
}

#user-dialog .scroll-table thead th:nth-of-type(2), #user-dialog .scroll-table tbody td:nth-of-type(2), #user-dialog .scroll-table thead th:nth-of-type(3), #user-dialog .scroll-table tbody td:nth-of-type(3) {
	width: 130px;
}

#user-dialog .scroll-table thead th:nth-of-type(4), #user-dialog .scroll-table tbody td:nth-of-type(4), #user-dialog .scroll-table thead th:nth-of-type(5), #user-dialog .scroll-table tbody td:nth-of-type(5) {
	width: 210px;
}

#user-dialog .scroll-table thead th:nth-of-type(6) {
	width: 137px;
}

#user-dialog .scroll-table tbody td:nth-of-type(6) {
	width: 120px;
}

/* 환경설정-부서차량등록(1).html  - 구성차량수 */

#car-dialog .scroll-table {
	height: 314px;
}

#car-dialog .scroll-table thead th, #car-dialog .scroll-table tbody td {
	width: 110px;
}

#car-dialog .scroll-table thead th:nth-of-type(1), #car-dialog .scroll-table tbody td:nth-of-type(1) {
	width: 81px;
}

#car-dialog .scroll-table thead th:nth-of-type(2), #car-dialog .scroll-table tbody td:nth-of-type(2), #car-dialog .scroll-table thead th:nth-of-type(3), #car-dialog .scroll-table tbody td:nth-of-type(3) {
	width: 100px;
}

#car-dialog .scroll-table thead th:nth-of-type(4), #car-dialog .scroll-table tbody td:nth-of-type(4) {
	width: 270px;
}

#car-dialog .scroll-table thead th:last-child {
	width: 127px;
}

/* 환경설정-서비스스토어(1).html */

#select-car-dialog .scroll-table {
	height: 314px;
}

#select-car-dialog .scroll-table thead th, #select-car-dialog .scroll-table tbody td {
	width: 150px;
}

#select-car-dialog .scroll-table thead th:nth-of-type(1), #select-car-dialog .scroll-table tbody td:nth-of-type(1) {
	width: 81px;
}

#select-car-dialog .scroll-table thead th:nth-of-type(2), #select-car-dialog .scroll-table tbody td:nth-of-type(2) {
	width: 120px;
}

#select-car-dialog .scroll-table thead th:nth-of-type(3), #select-car-dialog .scroll-table tbody td:nth-of-type(3) {
	width: 250px;
}

#select-car-dialog .scroll-table thead th:nth-of-type(5), #select-car-dialog .scroll-table tbody td:nth-of-type(5) {
	width: 160px;
}

#select-car-dialog .scroll-table thead th:nth-of-type(6) {
	width: 137px;
}

#select-car-dialog .scroll-table tbody td:nth-of-type(6) {
	width: 120px;
}

/* 운행정보-미배차운행(1).html */

.none-dispatch .scroll-table {
	height: 549px;
}

.none-dispatch .scroll-table thead th:nth-of-type(1), .none-dispatch .scroll-table tbody td:nth-of-type(1) {
	width: 8%;
}

.none-dispatch .scroll-table thead th:nth-of-type(2), .none-dispatch .scroll-table tbody td:nth-of-type(2) {
	width: 20%;
}

.none-dispatch .scroll-table thead th:nth-of-type(4), .none-dispatch .scroll-table tbody td:nth-of-type(4) {
	width: 10%;
}

.none-dispatch .scroll-table thead th:nth-of-type(5), .none-dispatch .scroll-table tbody td:nth-of-type(5) {
	width: 13%;
}

/* 환경설정-운행정보-운행일지.html */

.driving-report .scroll-table {
	height: 549px;
}

.driving-report .scroll-table thead th:nth-of-type(1), .driving-report .scroll-table tbody td:nth-of-type(1) {
	width: 8%;
}

.driving-report .scroll-table thead th:nth-of-type(2), .driving-report .scroll-table tbody td:nth-of-type(2) {
	width: 20%;
}

.driving-report .scroll-table thead th:nth-of-type(4), .driving-report .scroll-table tbody td:nth-of-type(4) {
	width: 15%;
}

/* 보고서결재-결재관리.html */

.sign-management2 .list01 .scroll-table {
	height: 739px;
}

.sign-management2 .list01 .scroll-table thead th:nth-of-type(1), .sign-management2 .list01 .scroll-table tbody td:nth-of-type(1) {
	width: 15%;
}

.sign-management2 .list01 .scroll-table thead th:nth-of-type(2), .sign-management2 .list01 .scroll-table tbody td:nth-of-type(2) {
	width: 25%;
}

.sign-management2 .list01 .scroll-table thead th:nth-of-type(3), .sign-management2 .list01 .scroll-table tbody td:nth-of-type(3) {
	width: 15%;
}

.sign-management2 .list01 .scroll-table thead th:nth-of-type(5), .sign-management2 .list01 .scroll-table tbody td:nth-of-type(5) {
	width: 7%;
}

.sign-management2 .list02 .scroll-table {
	height: 739px;
}

.sign-management2 .list02 .scroll-table thead th:nth-of-type(1), .sign-management2 .list02 .scroll-table tbody td:nth-of-type(1) {
	width: 15%;
}

.sign-management2 .list02 .scroll-table thead th:nth-of-type(2), .sign-management2 .list02 .scroll-table tbody td:nth-of-type(2) {
	width: 25%;
}

.sign-management2 .list02 .scroll-table thead th:nth-of-type(3), .sign-management2 .list02 .scroll-table tbody td:nth-of-type(3) {
	width: 10%;
}

.sign-management2 .list02 .scroll-table thead th:nth-of-type(4), .sign-management2 .list02 .scroll-table tbody td:nth-of-type(4) {
	width: 10%;
}

.sign-management2 .list02 .scroll-table thead th:nth-of-type(6), .sign-management2 .list02 .scroll-table tbody td:nth-of-type(6) {
	width: 7%;
}

.sign-management2 .list03 .scroll-table {
	height: 739px;
}

.sign-management2 .list03 .scroll-table thead th:nth-of-type(1), .sign-management2 .list03 .scroll-table tbody td:nth-of-type(1) {
	width: 15%;
}

.sign-management2 .list03 .scroll-table thead th:nth-of-type(2), .sign-management2 .list03 .scroll-table tbody td:nth-of-type(2) {
	width: 25%;
}

.sign-management2 .list03 .scroll-table thead th:nth-of-type(3), .sign-management2 .list03 .scroll-table tbody td:nth-of-type(3) {
	width: 10%;
}

.sign-management2 .list03 .scroll-table thead th:nth-of-type(4), .sign-management2 .list03 .scroll-table tbody td:nth-of-type(4) {
	width: 10%;
}

.sign-management2 .list03 .scroll-table thead th:nth-of-type(6), .sign-management2 .list03 .scroll-table tbody td:nth-of-type(6) {
	width: 10%;
}

.sign-management2 .list03 .scroll-table thead th:nth-of-type(7), .sign-management2 .list03 .scroll-table tbody td:nth-of-type(7) {
	width: 7%;
}

.sign-management2 .list04 .scroll-table {
	height: 739px;
}

.sign-management2 .list04 .scroll-table thead th:nth-of-type(1), .sign-management2 .list04 .scroll-table tbody td:nth-of-type(1) {
	width: 12%;
}

.sign-management2 .list04 .scroll-table thead th:nth-of-type(2), .sign-management2 .list04 .scroll-table tbody td:nth-of-type(2) {
	width: 12%;
}

.sign-management2 .list04 .scroll-table thead th:nth-of-type(3), .sign-management2 .list04 .scroll-table tbody td:nth-of-type(3) {
	width: 25%;
}

.sign-management2 .list04 .scroll-table thead th:nth-of-type(4), .sign-management2 .list04 .scroll-table tbody td:nth-of-type(4) {
	width: 10%;
}

.sign-management2 .list04 .scroll-table thead th:nth-of-type(6), .sign-management2 .list04 .scroll-table tbody td:nth-of-type(6) {
	width: 7%;
}

/* 보고서결재-국세청운행일지.html */

/* .NTS-report .scroll-table {
	height: 294px;
}

.NTS-report .scroll-table thead th:nth-of-type(1), .NTS-report .scroll-table tbody td:nth-of-type(1) {
	width: 8%;
}

.NTS-report .scroll-table thead th:nth-of-type(3), .NTS-report .scroll-table tbody td:nth-of-type(3) {
	width: 16%;
}

.NTS-report .scroll-table thead th:nth-of-type(4), .NTS-report .scroll-table tbody td:nth-of-type(4) {
	width: 16%;
}

.NTS-report .scroll-table thead th:nth-of-type(5), .NTS-report .scroll-table tbody td:nth-of-type(5) {
	width: 16%;
}

.NTS-report .scroll-table thead th:nth-of-type(6), .NTS-report .scroll-table tbody td:nth-of-type(6) {
	width: 16%;
} */

/* ========================================================================
* 박스형 레이아웃(공통)
* ======================================================================== */

.box-layout {
	position: relative;
	margin-top: 35px;
	border: 1px solid #e3e3e3;
	color: #888;
}

.box-layout>.title {
	min-height: 5.571rem;
	padding: 1.429rem 5.429rem 1.429rem 1.429rem;
	border-bottom: 1px solid #e3e3e3;
}

.box-layout>.title h3 {
	display: inline-block;
	line-height: 2.643rem;
}

.box-layout>.title .btn-closed a {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 5.429rem;
	height: 5.500rem;
	border-left: 1px solid #e3e3e3;
	font-size: 0;
}

.box-layout>.title .btn-closed a::before {
	top: 50%;
	left: 50%;
	background-position: -100px -50px;
	width: 26px;
	height: 26px;
	margin-top: -13px;
	margin-left: -13px;
}

.box-layout .contents-wrap {
	padding: 40px 29px;
}

/* 안내 텍스트(공통) */

.info-txt {
	margin: -41px -29px 0;
	padding: 2.143rem;
	background-color: #f7f7f7;
	border-top: 1px solid #e3e3e3;
	border-bottom: 1px solid #e3e3e3;
	font-size: 1.143rem;
	line-height: 1.4;
	color: #888;
	font-weight: 300;
}

.info-txt strong {
	font-weight: 400;
	color: #222;
}

.info-txt .red {
	color: #ed1c24;
}

/* ========================================================================
* 다이얼로그(공통)
* ======================================================================== */

.ui-dialog {
	padding: 0;
	border-radius: 0;
	color: #888;
	font-family: Noto Sans KR, sans-serif;
}

.ui-dialog .ui-dialog-titlebar {
	height: 77px;
	padding: 0;
	border: none;
	border-bottom: 1px solid #e3e3e3;
	background-color: #fff;
	border-radius: 0;
}

.ui-dialog .ui-dialog-title {
	display: block;
	margin: 0;
	padding-top: 25px;
	padding-left: 30px;
	float: none;
	font-size: 2.143rem;
	font-weight: 400;
}

.ui-dialog .ui-dialog-titlebar-close {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 76px;
	height: 76px;
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	background-color: transparent;
	border-left: 1px solid #e3e3e3;
	font-size: 0;
}

.ui-dialog .ui-dialog-titlebar-close span {
	display: none;
}

.ui-dialog .ui-dialog-titlebar-close::before {
	content: '';
	display: block;
	position: absolute;
	top: 25px;
	left: 25px;
	width: 26px;
	height: 26px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -100px -50px;
}

.ui-dialog .ui-dialog-content {
	/* padding: 20px 30px 50px; */
}

.ui-dialog .ui-dialog-content h3.tit {
	position: relative;
	padding-left: 12px;
	font-size: 1.429rem;
	color: #333;
}

.ui-dialog .ui-dialog-content h3.tit::before {
	content: '';
	display: block;
	position: absolute;
	top: 6px;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #333;
}

.ui-dialog .ui-dialog-content .top-info {
	color: #888;
	font-weight: 300;
}

.ui-dialog .ui-dialog-content .top-info .left {
	float: left;
}

.ui-dialog .ui-dialog-content .top-info .right {
	float: right;
}

.ui-dialog .ui-dialog-content .top-info .right.car strong {
	font-weight: 500;
	color: #ed1c24;
}

.ui-dialog .ui-dialog-content .top-info b {
	font-weight: 500;
	color: #333;
	;
}

.ui-dialog .ui-dialog-content .info-txt {
	margin-top: -21px;
}

.ui-dialog .ui-dialog-buttonset button {
	font-size: 1.143rem;
}

/* 검색 바 */

.ui-dialog .top-search {
	margin-top: 50px;
	text-align: center;
}

.ui-dialog .top-search select {
	min-width: 160px;
	height: 45px;
}

.ui-dialog .top-search input {
	min-width: 400px;
	height: 45px;
}

.ui-dialog .top-search button {
	vertical-align: top;
}

/* ========================================================================
* 로그인 다이얼로그
* ======================================================================== */

#login-dialog {
	padding: 0 64px;
	font-family: Noto Sans KR, sans-serif;
}

#login-dialog h2 {
	margin-top: 40px;
	font-size: 1.857rem;
	font-weight: 500;
	color: #272727;
	text-align: center;
}

#login-dialog input[type='text'], #login-dialog input[type='password'] {
	margin-top: 5px;
	width: 100%;
	height: 45px;
	line-height: 45px;
	font-size: 1.000rem;
}

#login-dialog .btn-login {
	margin: 20px 0 0 0;
	width: 100%;
	height: 55px;
}

#login-dialog .btn-join {
	margin: 40px 0 0 0;
	padding-top: 18px;
	width: 400px;
	height: 55px;
	border-radius: 3px;
}

#login-dialog .clr {
	margin-top: 15px;
	font-size: 1.000rem;
}

#login-dialog .clr .id-save {
	float: left;
}

#login-dialog .clr a {
	display: block;
	float: right;
}

#login-dialog .login-tab {
	margin-top: 30px;
	overflow: hidden;
}

#login-dialog .login-tab li {
	position: relative;
	float: left;
	width: 50%;
}

#login-dialog .login-tab li a.tab {
	display: block;
	position: relative;
	border-bottom: 1px solid #e60012;
	color: #272727;
	font-size: 1.000rem;
	line-height: 45px;
	text-align: center;
	color: #999;
}

#login-dialog .login-tab li:first-child a.tab {
	margin-left: 0
}

#login-dialog .login-tab li.on {
	z-index: 10
}

#login-dialog .login-tab li.on a.tab {
	border: 1px solid #e60012;
	border-bottom: none;
	color: #272727;
}

#login-dialog .login-tab li .tab-list {
	display: none;
	width: 200%;
	margin-top: 20px
}

#login-dialog .login-tab li.on .tab-list {
	display: block
}

#login-dialog .login-tab li.list02 .tab-list {
	margin-left: -100%
}

/* 다이얼로그가 아닌 로그인 / 아이디,비밀번호 찾기 창 */

.login-page {
	width: 600px;
	margin: 30px auto 0 !important;
	font-family: Noto Sans KR, sans-serif;
}

.login-page input[type='text'], .login-page input[type='password'] {
	margin-top: 5px;
	width: 100%;
	height: 45px;
	line-height: 45px;
	font-size: 1.000rem;
}

.login-page .btn-login {
	margin: 20px 0 0 0;
	width: 100%;
	height: 55px;
}

.login-page .btn-join {
	margin: 40px 0 0 0;
	padding-top: 18px;
	width: 100%;
	height: 55px;
	border-radius: 3px;
}

.login-page .clr {
	margin-top: 15px;
	font-size: 1.000rem;
}

.login-page .clr .id-save {
	float: left;
}

.login-page .clr a {
	display: block;
	float: right;
}

.login-page .login-tab {
	margin-top: 30px;
	overflow: hidden;
}

.login-page .login-tab>li {
	position: relative;
	float: left;
	width: 50%;
}

.login-page .login-tab>li a.tab {
	display: block;
	position: relative;
	border-bottom: 1px solid #e60012;
	color: #272727;
	font-size: 1.000rem;
	line-height: 45px;
	text-align: center;
	color: #999;
}

.login-page .login-tab>li:first-child a.tab {
	margin-left: 0
}

.login-page .login-tab>li.on {
	z-index: 10
}

.login-page .login-tab>li.on a.tab {
	border: 1px solid #e60012;
	border-bottom: none;
	color: #272727;
}

.login-page .login-tab>li .tab-list {
	display: none;
	width: 200%;
	margin-top: 20px
}

.login-page .login-tab>li.on .tab-list {
	display: block
}

.login-page .login-tab>li.list02 .tab-list {
	margin-left: -100%
}

/* ========================================================================
* 아이디 비밀번호 찾기
* ======================================================================== */

.find-page {
	width: 600px;
	margin: 30px auto 0 !important;
	font-family: Noto Sans KR, sans-serif;
}

.find-page input[type='text'], .find-page input[type='password'] {
	width: 100%;
	height: 45px;
	line-height: 45px;
	font-size: 1.000rem;
}

.find-page select {
	width: 100%;
	height: 45px;
	line-height: 45px;
	font-size: 1.000rem;
}

.find-page button.resend {
	min-width: 100%;
	height: 45px;
	margin: 0;
	line-height: 45px;
	border-radius: 0;
}

.find-page .btn-login {
	margin: 20px 0 0 0;
	width: 100%;
	height: 55px;
}

.find-page .btn-join {
	margin: 40px 0 0 0;
	padding-top: 18px;
	width: 100%;
	height: 55px;
	border-radius: 3px;
}

.find-page .result-txt {
	margin-top: 20px;
}

.find-page .result-txt ul {
	border: 1px solid #e3e3e3;
	margin-top: 10px;
	padding: 30px;
	font-size: 1.000rem;
}

.find-page .result-txt li span {
	display: inline-block;
	margin: 7px 0;
	width: 100px;
	font-weight: 400;
	color: #333;
}

.find-page .result-txt li span::before {
	content: '';
	display: inline-block;
	width: 3px;
	height: 3px;
	margin-right: 5px;
	background-color: #666;
	vertical-align: 4px;
}

.find-page .txt {
	margin-top: 10px;
	font-size: 13px;
	line-height: 1.35;
	font-weight: 300;
}

.find-page .text-end span.text {
	font-weight: 600;
	color: #e60012;
}

.find-page .check-link {
	border: 1px solid #e3e3e3;
	margin-top: 10px;
	padding: 30px;
	font-size: 1.143rem;
	font-weight: 400;
	text-align: center;
	color: #333;
	line-height: 1.4;
}

.find-page .check-link span {
	display: block;
	margin-top: 10px;
	font-size: 1.000rem;
	/* color: #888; */
}

.find-page .check-link strong {
	display: block;
	margin-top: 20px;
	font-size: 2.143rem;
	color: #e60012;
}

/* ========================================================================
* 회원가입
* ======================================================================== */

#contents-page.join-page {
	margin-top: 40px;
}

/* 회원가입 step */

.join-step {
	margin-bottom: 50px;
	padding-bottom: 30px;
	border-bottom: 1px solid #e3e3e3;
	font-size: 0;
}

.join-step li {
	display: inline-block;
	width: 14.285%;
	text-align: center;
	color: #999;
}

.join-step li::after {
	display: block;
	width: 6.143rem;
	height: 6.143rem;
	margin: 0.714rem auto 0;
	padding-top: 0.714rem;
	border-radius: 50%;
	background-color: #eee;
	border: 2px solid #eee;
	font-family: 'viewcar-font' !important;
	font-size: 4.286rem;
	color: #999;
}

.join-step li.step01::after {
	content: '\e93c';
}

.join-step li.step02::after {
	content: '\e93d';
}

.join-step li.step03::after {
	content: '\e93e';
}

.join-step li.step04::after {
	content: '\e93f';
}

.join-step li.step05::after {
	content: '\e940';
}

.join-step li.step06::after {
	content: '\e941';
}

.join-step li.step07::after {
	content: '\e942';
}

.join-step li span {
	font-size: 0.857rem;
}

.join-step li strong {
	display: block;
	margin-top: 5px;
	font-size: 1.143rem;
	font-weight: 500;
}

.join-step li.active {
	color: #ed1c24;
}

.join-step li.active::after {
	border-color: #ed1c24;
	background-color: #fff;
	color: #ed1c24;
}

/* ========================================================================
* 회원가입-사전단계
* ======================================================================== */

.join-page .password-check {
	padding: 5px 0;
}

.join-page .password-check .bar {
	position: relative;
	display: inline-block;
	width: 129px;
	height: 6px;
	border: 1px solid #ccc;
	background-color: #f1f1f1;
	vertical-align: middle;
}

.join-page .password-check .bar::before, .join-page .password-check .bar::after {
	content: '';
	display: none;
	position: absolute;
	top: -1px;
	width: 43px;
	height: 6px;
}

.join-page .password-check .bar::before {
	left: 42px;
	background-color: #ffc000;
}

.join-page .password-check .bar::after {
	left: 85px;
	background-color: #92d050;
}

.join-page .password-check .bar.step02::before, .join-page .password-check .bar.step03::before, .join-page .password-check .bar.step03::after {
	display: block;
}

.join-page .password-check .bar span {
	display: block;
	position: absolute;
	top: -1px;
	left: -1px;
	width: 43px;
	height: 6px;
	background-color: #ff0000;
	font-size: 0;
}

.join-page .password-check p {
	display: inline-block;
	margin-left: 10px;
	vertical-align: middle
}

.join-page .password-check span.warning {
	margin-left: 0 !important;
}

/* ========================================================================
* 회원가입-1단계
* ======================================================================== */

.join-page .join-type-select {
	margin-top: 40px;
	font-size: 0;
}

.join-page .join-type-select ul {
	margin: 0 -10px;
}

.join-page .join-type-select ul li {
	display: inline-block;
	width: 50%;
	padding: 0 10px;
	vertical-align: top;
}

.join-page .join-type-select ul li a {
	position: relative;
	display: block;
	width: 100%;
	min-height: 280px;
	padding-top: 40px;
	border: 1px solid #e3e3e3;
	text-align: center;
	font-size: 1.143rem;
	line-height: 22px;
	color: #888;
}

.join-page .join-type-select ul li a:hover {
	border-color: #ed1c24
}

.join-page .join-type-select ul li a span {
	display: block;
}

.join-page .join-type-select ul li a span::after {
	content: '';
	display: block;
	width: 60px;
	height: 1px;
	margin: 20px auto 0;
	background-color: #e3e3e3;
}

.join-page .join-type-select ul li a strong {
	display: block;
	margin-top: 110px;
	font-size: 1.429rem;
	color: #222;
	font-weight: 500;
}

.join-page .join-type-select ul li a::before {
	position: absolute;
	top: 110px;
	left: 0;
	width: 100%;
	text-align: center;
	font-family: 'viewcar-font' !important;
	font-size: 6.429rem;
	line-height: 1;
	color: #ccc;
}

.join-page .join-type-select ul li.type01 a::before {
	content: '\e932';
}

.join-page .join-type-select ul li.type02 a::before {
	content: '\e933';
}

.join-page .join-type-select ul li.type03 a::before {
	content: '\e934';
}

.join-page .join-type-select ul li.type04 a::before {
	content: '\e935';
}

/* ========================================================================
* 회원가입-2단계
* ======================================================================== */

.terms-agree {
	border: 1px solid #e3e3e3;
	text-align: center;
}

.terms-agree strong {
	display: block;
	padding: 35px;
	font-size: 1.429rem;
	color: #333;
}

.terms-agree strong em {
	color: #e60012;
	font-style: normal;
}

.terms-agree .checkall {
	padding: 17px;
	border-top: 1px solid #e3e3e3;
	background-color: #f7f7f7;
}

.terms-agree .checkall label {
	cursor: pointer;
}

.terms-list .top {
	position: relative;
	margin-top: 50px;
}

.terms-list .top h3 {
	font-size: 1.571rem;
	color: #222;
}

.terms-list .top h3 span {
	color: #999;
}

.terms-list .top .check {
	position: absolute;
	top: 5px;
	right: 0;
}

.terms-list .terms-box {
	border: 1px solid #cbcbcb;
	margin-top: 15px;
	padding: 20px;
	height: 320px;
	overflow-y: auto;
	line-height: 1.7;
	font-size: 12px;
	font-family: dotum;
	text-align: left;
}

.terms-list .terms-box h4 {
	margin-top: 30px;
	margin-bottom: 10px;
	font-weight: 700;
	color: #333;
}

.terms-list .terms-box p {
	margin-top: 10px;
}

.terms-list .terms-box ol {
	margin-top: 10px;
}

.terms-list .terms-box ol li {
	position: relative;
	margin-top: 5px;
	padding-left: 20px;
}

.terms-list .terms-box ol li:first-child {
	margin-top: 0;
}

.terms-list .terms-box ol li span.num {
	position: absolute;
	top: 0;
	left: 0;
}

.terms-list .terms-box ol ol {
	padding-left: 10px;
	border-left: 1px dashed #ccc;
}

.terms-list .terms-box table {
	margin-top: 10px;
	width: 100%;
}

.terms-list .terms-box table thead th {
	background-color: #f8f8f8;
	padding: 8px;
	border: 1px solid #e3e3e3;
	border-bottom: 2px solid #ccc;
	text-align: center;
}

.terms-list .terms-box table tbody th {
	background-color: #f8f8f8;
	padding: 8px;
	border: 1px solid #e3e3e3;
	text-align: center;
}

.terms-list .terms-box table tbody td {
	padding: 8px;
	border: 1px solid #e3e3e3;
}

/* ========================================================================
* 회원가입-6단계(기업)
* ======================================================================== */

.join-page .select-grade {
	margin-top: 40px;
	font-size: 0;
}

.join-page .select-grade>ul {
	margin: 0 -10px;
}

.join-page .select-grade>ul>li {
	display: inline-block;
	width: 33.33%;
	padding: 0 10px;
	vertical-align: top;
}

.join-page .select-grade>ul>li .inner {
	position: relative;
	min-height: 475px;
	padding-top: 25px;
	border: 1px solid #e3e3e3;
	text-align: center;
	font-size: 1.000rem;
	line-height: 1.714rem;
}

.join-page .select-grade>ul>li .inner:hover {
	border-color: #ed1c24;
}

.join-page .select-grade ul li strong {
	display: block;
	font-size: 1.429rem;
	color: #333;
	font-weight: 500;
}

.join-page .select-grade ul li strong::after {
	content: '';
	display: block;
	width: 60px;
	height: 1px;
	margin: 20px auto 0;
	background-color: #e3e3e3;
}

.join-page .select-grade ul li.grade01::before, .join-page .select-grade ul li.grade02::before, .join-page .select-grade ul li.grade03::before {
	top: 95px;
	left: 50%;
	width: 72px;
	height: 77px;
	margin-left: -36px;
}

.join-page .select-grade ul li.grade01::before {
	background-position: -0 -100px
}

.join-page .select-grade ul li.grade02::before {
	background-position: -100px -100px
}

.join-page .select-grade ul li.grade03::before {
	background-position: -200px -100px
}

.join-page .select-grade ul li ul {
	margin-top: 125px;
}

.join-page .select-grade ul li ul li {
	position: relative;
	padding-left: 30px;
	text-align: left;
}

.join-page .select-grade ul li ul li::before {
	content: '';
	display: block;
	position: absolute;
	top: 11px;
	left: 20px;
	width: 4px;
	height: 4px;
	border-radius: 10px;
	background-color: #666;
}

.join-page .select-grade ul li .select {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 15px 20px;
	border-top: 1px solid #e3e3e3;
	font-size: 1.143rem;
	font-weight: 500;
	color: #333;
}

.join-page .select-grade ul li .select span {
	display: block;
	font-size: 0.857rem;
	color: #888;
}

.join-page .select-grade ul li.grade03 p {
	margin-top: 10px;
	padding-left: 30px;
	font-size: 1.000rem;
	color: #fb8e01;
	text-align: left;
}

.join-page .non-select {
	margin-top: 20px;
	font-size: 1.000rem;
	color: #888;
}

/* ========================================================================
* 회원가입-완료
* ======================================================================== */

.join-complete {
	text-align: center;
	line-height: 1.4;
}

.join-complete strong {
	display: block;
	font-size: 5.00rem;
	font-family: Arial, sans-serif;
	color: #ed1c24;
	font-weight: 700;
	letter-spacing: -1px;
}

.join-complete span {
	display: block;
	margin-bottom: 30px;
	font-size: 2.286rem;
	color: #333;
}

/* ========================================================================
* 환경설정
* ======================================================================== */

/* 
 * @별등급 표시 
 * 환경설정-서비스스토어(1).html
 * 환경설정-서비스스토어(2).html
 * 환경설정-서비스스토어(3).html
 */

.grade-star {
	font-size: 0;
}

.grade-star span {
	display: inline-block;
	margin: 0 -2px;
}

.grade-star span::before {
	content: '\e958';
	font-family: 'viewcar-font' !important;
	font-size: 1.714rem;
	line-height: 1;
	color: #333;
}

.grade-star span.on::before {
	content: '\e957';
}

/* ========================================================================
* 환경설정-서비스스토어 (1)
* 환경설정-My서비스스토어(1).html
* ======================================================================== */

.store-list .section01, .store-list .section02 {
	margin-top: 30px;
}

.store-list .table .btn-wrap {
	margin-top: 3px;
	margin-bottom: 3px;
}

.store-list .table .btn-wrap button {
	position: relative;
	display: inline-block;
	margin: 0 5px;
	background-color: transparent;
	border: none;
	font-size: 12px;
	color: #888;
}

.store-list .table .btn-wrap button:first-child::after {
	content: '';
	position: absolute;
	top: 5px;
	right: -8px;
	width: 1px;
	height: 10px;
	background-color: #e3e3e3;
}

.store-list .table div.reply {
	position: relative;
	margin-top: 15px;
	padding-top: 15px;
	padding-left: 30px;
	border-top: 1px solid #e3e3e3;
}

.store-list .table div.reply::before {
	content: '';
	display: block;
	position: absolute;
	top: 20px;
	left: 5px;
	width: 10px;
	height: 10px;
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
}

.store-list .table div.insert-reply {
	margin-top: 20px;
}

.store-list .table div.insert-reply textarea {
	width: 100%;
	min-height: 80px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
}

.store-list .table td.insert-reply {
	vertical-align: bottom;
	padding-bottom: 40px;
}

.chart-list {
	margin-top: 30px;
	margin-left: -1%;
	margin-right: -1%;
}

.chart-list .list {
	float: left;
	width: 23%;
	margin: 0 1%;
}

.chart-list.col-2 .list {
	width: 48%;
}

.chart-list .list .tit {
	margin-bottom: 15px;
	padding: 13px 10px;
	background-color: #f8f8f8;
	border: 1px solid #e3e3e3;
	text-align: center;
	color: #333;
}

/* ========================================================================
* 환경설정-서비스스토어 (2)
* 환경설정-서비스스토어 (3)
* ======================================================================== */

.store-detail .title span.badge {
	display: inline-block;
	height: 35px;
	margin-left: 20px;
	padding: 8px 35px 0;
	/* IE */
	padding: 12px 35px 0\0;
	background-color: #333;
	border-radius: 30px;
	color: #fff;
	vertical-align: 6px;
}

.store-detail .title .grade-star {
	display: inline-block;
	vertical-align: -3px;
}

.store-detail .grade-star {
	margin-left: 20px;
}

.store-detail .grade-star span {
	margin: 0 -3px;
}

.store-detail .grade-star span::before {
	font-size: 2.429rem;
	color: #ed1c24;
}

/* 서비스 등록자 정보 (공통) */

.store-detail .section01 {
	position: relative;
}

.store-detail .section01 .img {
	position: absolute;
	top: 0;
	left: 0;
	width: 345px;
}

.store-detail .section01 .img img {
	width: 345px;
	height: 233px;
	border: 1px solid #e3e3e3;
}

.store-detail .section01 .info {
	position: relative;
	min-height: 233px;
	margin-left: 385px;
}

.store-detail .section01 .info p {
	margin-top: 20px;
	font-size: 1.000rem;
	line-height: 1.4;
}

.store-detail .section01 .info .more {
	display: inline-block;
	margin-top: 20px;
	font-size: 1.000rem;
	text-decoration: underline;
	color: #888;
}

/* 사용정보 (공통) */

.store-detail .section02 {
	margin-top: 60px;
	padding-top: 40px;
	border-top: 1px solid #e3e3e3;
}

.store-detail .section02 ul {
	margin-top: 20px;
	margin-left: -16px;
	margin-right: -16px;
}

.store-detail .section02 ul li {
	float: left;
	width: 33.33%;
	padding: 0 16px;
}

.store-detail .section02 ul li img {
	width: 100%;
	height: auto;
	border: 1px solid #e3e3e3;
}

.store-detail .section02 ul li span {
	display: block;
	margin-top: 10px;
	font-size: 1.000rem;
	line-height: 1.4;
}

/* 사용자 평가ㆍ내 평가점수 (공통) */

.store-detail .section03 {
	margin-top: 60px;
	padding-top: 40px;
	border-top: 1px solid #e3e3e3;
}

.store-detail .section03 h4 {
	float: left;
	width: 11%;
	margin-top: 7px;
}

.store-detail .section03 .user-assessment, .store-detail .section03 .my-assessment {
	float: left;
	width: 39%;
}

.store-detail .section03 .grade-star {
	display: inline-block;
	margin-left: 0;
	vertical-align: middle;
}

.store-detail .section03 .user-assessment .member {
	display: inline-block;
	margin-left: 5px;
	font-size: 1.143rem;
	vertical-align: -4px;
}

.store-detail .section03 .user-assessment .member strong {
	color: #ed1c24;
	font-weight: 500;
}

.store-detail .section03 .user-assessment .result {
	margin-top: 20px;
}

.store-detail .section03 .user-assessment .result .list {
	margin-top: 10px;
	font-size: 1.000rem;
}

.store-detail .section03 .user-assessment .result .list>span {
	display: inline-block;
	vertical-align: -3px;
}

.store-detail .section03 .user-assessment .result .list .grade-star {
	display: inline-block;
	margin: 0 20px;
}

.store-detail .section03 .user-assessment .result .list .grade-star span {
	margin: 0 -1px;
}

.store-detail .section03 .user-assessment .result .list .grade-star span::before {
	font-size: 1.643rem;
}

.store-detail .section03 .user-assessment .result .list .bar {
	position: relative;
	display: inline-block;
	width: 125px;
	height: 5px;
	margin-right: 15px;
	background-color: #eee;
}

.store-detail .section03 .user-assessment .result .list .bar::before {
	content: '';
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	height: 5px;
	background-color: #ed1c24;
}

.store-detail .section03 .user-assessment .result .list .bar.point-1::before {
	width: 20%;
}

.store-detail .section03 .user-assessment .result .list .bar.point-2::before {
	width: 40%;
}

.store-detail .section03 .user-assessment .result .list .bar.point-3::before {
	width: 60%;
}

.store-detail .section03 .user-assessment .result .list .bar.point-4::before {
	width: 80%;
}

.store-detail .section03 .user-assessment .result .list .bar.point-5::before {
	width: 100%;
}

/* 서비스 등록자 정보 */

.store-detail-type1 .section01 .info .copy {
	position: absolute;
	bottom: 0;
	left: 0;
	font-size: 0;
}

.store-detail-type1 .section01 .info .copy span {
	display: inline-block;
	height: 30px;
	vertical-align: top;
	font-size: 1.000rem;
	padding-top: 7px;
	/* IE */
	padding-top: 12px\0;
	padding-left: 25px;
	padding-right: 25px;
}

.store-detail-type1 .section01 .info .copy .state {
	background-color: #666;
	color: #fff;
	text-align: center;
}

.store-detail-type1 .section01 .info .copy .price {
	margin-left: 5px;
	padding-left: 10px;
	padding-right: 30px;
	border: 1px solid #e3e3e3;
}

.store-detail-type1 .section01 .info .copy .price::before {
	width: 9px;
	height: 5px;
	top: 12px;
	right: 10px;
	background-position: -80px -50px
}

.store-detail-type1 .section01 .info .copy button {
	display: inline-block;
	height: 30px;
	margin-left: 5px;
	padding-left: 25px;
	padding-right: 25px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	vertical-align: top;
	font-size: 1.000rem;
}

/* 사용자 리뷰 */

.store-detail-type1 .section04 {
	margin-top: 60px;
	padding-top: 40px;
	border-top: 1px solid #e3e3e3;
}

.store-detail-type1 .section04 h4 {
	display: inline-block;
	margin-right: 10px;
}

.store-detail-type1 .section04 .total-review {
	font-size: 1.000rem;
}

.store-detail-type1 .section04 .total-review strong {
	color: #000;
}

.store-detail-type1 .section04 .textarea {
	margin-top: 20px;
}

.store-detail-type1 .section04 .textarea textarea {
	width: 100%;
	height: 100px;
	border: 1px solid #e3e3e3;
}

.store-detail-type1 .section04 .textarea .btn-wrap {
	margin-top: 10px;
	text-align: right;
}

.store-detail-type1 .section04 .textarea .btn-wrap .btn {
	margin: 0;
}

.store-detail-type1 .section04 .reply {
	text-align: left;
}

.store-detail-type1 .section04 .reply button {
	display: inline-block;
	width: 60px;
	height: 30px;
	/* IE */
	padding-top: 5px\0;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	text-align: center;
	font-size: 1.000rem;
}

.store-detail-type1 .section04 .reply div {
	display: inline-block;
	margin-left: 10px;
	line-height: 24px;
	vertical-align: -1px;
}

.store-detail-type1 .section04 .reply div::before {
	display: inline-block;
	width: 24px;
	height: 24px;
	margin-right: 3px;
	padding-top: 2px;
	background-color: #f17b57;
	border-radius: 50%;
	font-family: 'viewcar-font' !important;
	font-size: 18px;
	line-height: 1;
	text-align: center;
	color: #fff
}

.store-detail-type1 .section04 .reply div::before {
	content: '\e959';
}

.store-detail-type1 .section04 .reply div.nogood::before {
	transform: rotate(180deg);
	background-color: #7286c5;
}

/* 서비스 등록자 정보 */

.store-detail-type2 .section01 .use-list {
	position: relative;
	margin-top: 2.143rem;
	padding-right: 300px;
}

.store-detail-type2 .section01 .use-list::before {
	content: '';
	position: absolute;
	top: 0;
	right: 275px;
	width: 1px;
	height: 100%;
	background-color: #e3e3e3;
}

.store-detail-type2 .section01 .use-list .table .minus, .store-detail-type2 .section01 .use-list .table .plus {
	width: 17px;
	height: 17px;
	/* IE */
	padding-top: 4px\0;
	border: 1px solid #ccc;
	background-color: transparent;
	text-align: center;
	line-height: 1;
}

.store-detail-type2 .section01 .use-list .copy {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 0;
}

.store-detail-type2 .section01 .use-list .copy span {
	display: inline-block;
	height: 35px;
	vertical-align: top;
	font-size: 1.000rem;
	padding-top: 10px;
	/* IE */
	padding-top: 15px\0;
	padding-left: 25px;
	padding-right: 25px;
}

.store-detail-type2 .section01 .use-list .copy .state {
	display: block;
	margin-top: 7px;
	background-color: #666;
	color: #fff;
	text-align: center;
}

.store-detail-type2 .section01 .use-list .copy .price {
	padding-left: 10px;
	padding-right: 30px;
	border: 1px solid #e3e3e3;
}

.store-detail-type2 .section01 .use-list .copy .price::before {
	width: 9px;
	height: 5px;
	top: 15px;
	right: 10px;
	background-position: -80px -50px
}

.store-detail-type2 .section01 .use-list .copy button {
	display: inline-block;
	height: 35px;
	margin-left: 5px;
	padding-left: 25px;
	padding-right: 25px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	vertical-align: top;
	font-size: 1.000rem;
}

/* ========================================================================
* 환경설정-My서비스스토어(2).html
* ======================================================================== */

.search-store .line {
	display: none;
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px dashed #ccc;
}

.search-store .table td.list span {
	display: inline-block;
	min-width: 120px;
	margin-right: 10px;
}

.search-store .more::before {
	right: 20px;
	width: 23px;
	height: 24px;
	background-position: -320px -0;
	cursor: pointer;
}

.search-store .table tr.active .line {
	display: block;
}

.search-store .table tr.active .top5 {
	margin-top: 10px;
}

.search-store .table tr.active .more::before {
	background-position: -350px -0;
}

.search-store .closed {
	margin: 20px 0 0 0;
	width: 100%;
}

.search-store .closed::after {
	content: '▲';
	margin-left: 5px;
	font-size: 0.857rem;
}

.search-store .section01.active .table {
	display: none;
}

/* ========================================================================
* 환경설정-My서비스스토어(3).html
* ======================================================================== */

.invite-store .booking {
	margin-top: 30px;
}

.invite-store .booking strong {
	font-size: 1.714rem;
	color: #333;
	font-weight: 400;
}

.invite-store .booking span.maker {
	margin-left: 10px;
}

.invite-store .booking .info-wrap {
	position: relative;
	margin-top: 20px;
	min-height: 321px;
}

.invite-store .booking .info-wrap .img {
	position: absolute;
	top: 0;
	left: 0;
}

.invite-store .booking .info-wrap .img select {
	display: block;
	margin-top: 5px;
}

.invite-store .booking .info-wrap .info {
	margin-left: 270px;
	padding-top: 10px;
	font-size: 1.143rem;
	line-height: 1.5;
}

.invite-store .type-01.payment li {
	padding-left: 140px;
}

.invite-store .type-01.payment li::before {
	top: 50%;
}

.invite-store .type-01.payment li span {
	display: block;
	position: absolute;
	top: 0;
	left: 15px;
	bottom: 0;
	color: #333;
}

.invite-store .type-01.payment li span::after {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

/* ========================================================================
* 환경설정-My서비스스토어(4).html
* ======================================================================== */

.register-store .insert-img li {
	display: inline-block;
	margin-right: 20px;
}

.register-store .insert-img li div {
	font-size: 0;
}

.register-store .insert-img li div .btn {
	margin: 0 2px;
	min-width: 52px;
}

/* ========================================================================
* 환경설정-부서차량등록(1)
* ======================================================================== */

.department-list .section01, .department-list .section02, .department-list .section03 {
	margin-top: 50px;
}

.department-list .section01 div {
	margin-top: 20px;
	border: 1px solid #e3e3e3;
	padding: 10px;
}

.department-list .section01 div input {
	width: 330px;
}

.department-list .section02 div {
	margin-top: 20px;
	border: 1px solid #e3e3e3;
	padding: 10px 10px 10px 30px;
}

.department-list .section02 div span {
	margin-right: 10px;
}

/* ========================================================================
* 환경설정-차량등록(개인)(1).html
* ======================================================================== */

.select-mileage {
	margin-top: 10px;
	padding: 20px;
	border: 1px solid #e3e3e3;
}

/* ========================================================================
* 환경설정-사용자등록(2)(사용자초대).html
* ======================================================================== */

.invite-user .result {
	margin-top: 15px;
}

.invite-user .success {
	color: #3297de;
}

.invite-user .fail {
	color: #ed1c24;
}

.invite-user .mail-insert {
	margin-top: 10px;
}

.invite-user .mail-insert input {
	width: 100%;
	height: 50px;
	line-height: 50px;
}

.invite-user .mail-check {
	margin-top: 10px;
	padding-top: 20px;
	border-top: 1px solid #e3e3e3;
}

.invite-user .mail-check li {
	margin-bottom: 10px;
}

.invite-user .mail-check li span {
	display: inline-block;
	margin-left: 10px;
	color: #3297de;
}

/* ========================================================================
* 환경설정-사용자등록(3)(사용자개발등록).html
* ======================================================================== */

.register-individual .register-form {
	position: relative;
	margin-top: 2.857rem;
}

.register-individual .register-form .left {
	position: absolute;
	top: 0;
	left: 0;
	width: 115px;
}

.register-individual .register-form .left a {
	display: block;
	width: 115px;
	height: 36px;
	margin-top: 10px;
	padding-top: 9px;
	padding-left: 40px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	background-image: url(../img/common/icon-photo.png);
	background-repeat: no-repeat;
	background-position: 18px 11px;
}

.register-individual .register-form .right {
	margin-left: 130px;
}

/* ========================================================================
* 환경설정-사용자등록(4)(대량등록).html
* ======================================================================== */

.register-mass .btn-download {
	display: inline-block;
	height: 36px;
	padding: 7px 20px 0;
	border-width: 1px 2px 2px 1px;
	border-style: solid;
	border-color: #e3e3e3 #ccc #ccc #e3e3e3;
}

.register-mass .btn-download::before {
	content: '';
	display: inline-block;
	width: 10px;
	height: 13px;
	margin-right: 5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -190px -50px;
}

/* ========================================================================
* 환경설정-차량등록(3)(상세페이지-개인).html
* 환경설정-차량등록(4)(상세페이지-기업).html
* 환경설정-차량등록(5)(완료).html
* ======================================================================== */

.register-step-box {
	position: relative;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	padding: 25px;
	text-align: center;
	font-size: 0;
}

.register-step-box::before {
	content: '';
	display: block;
	position: absolute;
	top: 46px;
	left: 50%;
	width: 88px;
	height: 1px;
	margin-left: -44px;
	background-color: #ccc;
}

.register-step-box li {
	display: inline-block;
	min-width: 68px;
	margin: 0 30px;
	font-size: 1.000rem;
	text-align: center;
}

.register-step-box li::before {
	content: '1';
	display: block;
	width: 40px;
	height: 40px;
	margin: 0 auto 10px;
	padding-top: 11px;
	border: 2px solid #ccc;
	background-color: #fff;
	border-radius: 50%;
	font-size: 1.000rem;
	color: #333;
}

.register-step-box li.active {
	color: #e60012;
}

.register-step-box li:last-child::before {
	content: '2';
}

.register-step-box li.active::before {
	color: #e60012;
	border-color: #e60012;
}

/* 완료 후 팝업창 */

#register-complete-dialog .txt {
	line-height: 1.5;
}

#register-complete-dialog .txt ul {
	margin-top: 20px;
}

#register-complete-dialog .txt ul li {
	position: relative;
	padding-left: 10px;
}

#register-complete-dialog .txt ul li::before {
	content: '';
	display: block;
	position: absolute;
	top: 9px;
	left: 0;
	width: 4px;
	height: 4px;
	background-color: #aaa;
	border-radius: 50%;
}

/* ========================================================================
* 환경설정-차량등록(5)(완료).html
* ======================================================================== */

.register-complete .info-txt {
	margin: 20px 0 0;
	border: 1px solid #e3e3e3;
	text-align: center;
}

.register-complete .info-txt strong {
	color: #e60012;
}

.register-complete .action-txt {
	position: relative;
	margin-top: 50px;
	padding-top: 200px;
	padding-bottom: 50px;
	border-bottom: 1px dashed #ccc;
	background-image: url(../img/register-complete-img01.png);
	background-repeat: no-repeat;
	background-position: center 50px;
	text-align: center
}

.register-complete .action-txt p {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	text-align: center;
}

.register-complete .action-txt .btn {
	min-width: 260px;
}

/* ========================================================================
* 환경설정-거래처등록(2).html
* ======================================================================== */

.register-client .root_daum_roughmap_landing {
	width: 100% !important;
}

/* ========================================================================
* 환경설정-결재관리(1)(기업용).html
* ======================================================================== */

.sign-management .section01, .sign-management .section02 {
	margin-top: 30px;
}

.sign-management .section01 .left, .sign-management .section02 .left {
	float: left;
	width: 49%;
}

.sign-management .section01 .right, .sign-management .section02 .right {
	float: right;
	width: 49%;
}

.sign-management .help::after {
	margin-left: 5px;
	vertical-align: 2px;
}

.sign-management .title h3 {
	display: inline-block;
}

.sign-management .btn-onoff {
	margin-left: 10px;
	vertical-align: 3px;
}

.sign-management .setting li {
	margin-top: 0.714rem;
	border: 1px solid #e3e3e3;
	padding: 1.071rem 1.143rem;
	font-size: 1.143rem;
	color: #333;
	text-align: right;
}

.sign-management .setting li div.fleft {
	min-width: 5.714rem;
	width: 45%;
	height: 31px;
	display: inline-block;
	float: left;
	text-align: left;
	padding-top: 6px;
}



.sign-management .setting li span {
	display: inline-block;
}

.sign-management .setting li span.name {
	/* max-width: 37%; */
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.sign-management .setting li button.btn {
	/* margin-right: 20px; */
}

.sign-management .setting li .btn-onoff {
	vertical-align: 1px;
}

.sign-management .txt {
	margin-top: 10px;
}

.sign-management .txt li {
	position: relative;
	margin-top: 7px;
	padding-left: 15px;
	font-size: 1.000rem;
	line-height: 1.5;
}

.sign-management .txt li:first-child {
	margin-top: 0;
}

.sign-management .txt li .red {
	color: #ed1c24;
	font-weight: 400;
}

.sign-management .txt li::before {
	content: '※';
	position: absolute;
	top: 0;
	left: 0;
}

/* ========================================================================
* 환경설정-단위설정(1).html
* ======================================================================== */

.local-select .table thead th {
	padding: 15px;
	background-color: #666;
	color: #fff;
	font-size: 1.143rem;
}

.local-select .img {
	margin-top: 50px;
	text-align: center;
}

/* ========================================================================
* 환경설정-이수지역설정(2).html
* ======================================================================== */

.register-area .btn-add {
	margin-top: 5px;
	text-align: center;
}

.register-area .btn-add button {
	display: block;
	width: 100%;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	padding: 10px;
}

.register-area .btn-add span {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 30px;
	background-color: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 0;
}

.register-area .btn-add button span::before {
	content: '+';
	display: block;
	padding-top: 4px;
	font-size: 1.000rem;
}



/* ========================================================================
* 환경설정-버스노선등록(2).html
* ======================================================================== */

.register-bus .table button.btn {
	margin: 0;
}

.register-bus .table .selected {
	padding: 5px 0;
}

.register-bus .table .selected b {
	margin-right: 10px;
	font-weight: 500;
	color: #666;
}

.register-bus .table .selected.active {
	margin-top: 10px;
	padding: 8px;
	border: 2px dashed #e60012;
}

.register-bus .table .success {
	color: #74b94b;
	font-weight: 500;
}

.register-bus .table .fail {
	color: #e60012;
	font-weight: 500;
}

/* ========================================================================
* 환경설정-버스노선등록(4).html
* ======================================================================== */

.register-bus-map .station li {
	position: relative;
	margin-top: 40px;
	padding: 30px;
	border: 5px solid #e3e3e3;
}

.register-bus-map .station li .btn-wrap {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 0;
}

.register-bus-map .station li .btn-wrap button {
	width: 23px;
	height: 24px;
	border: none;
	margin-left: -1px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	font-size: 0;
}

.register-bus-map .station li .btn-wrap button.down {
	background-position: -320px -0;
}

.register-bus-map .station li .btn-wrap button.up {
	background-position: -350px -0;
}

.register-bus-map .station li .btn-wrap button.delete {
	background-position: -380px -0;
}

.register-bus-map .station .btn-add {
	margin-top: 5px;
	text-align: center;
}

.register-bus-map .station .btn-add button {
	display: block;
	width: 100%;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	padding: 10px;
	font-size: 1.143rem;
}

.register-bus-map .station .btn-add span {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 30px;
	margin-right: 7px;
	background-color: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 0;
}

.register-bus-map .station .btn-add button span::before {
	content: '+';
	display: block;
	padding-top: 4px;
	font-size: 1.000rem;
}

#bus-map-dialog .map .left {
	float: left;
	width: 70%;
}

#bus-map-dialog .map .right {
	float: right;
	width: 25%;
}

#bus-map-dialog .map ul li {
	margin-top: 10px;
	color: #666;
}

/* ========================================================================
* 환경설정-즐겨찾기설정.html
* ======================================================================== */

.bookmark {
	font-size: 0;
}

.bookmark ul {
	margin: 0 -10px;
}

.bookmark ul li {
	display: inline-block;
	width: 50%;
	padding: 20px 10px;
	vertical-align: top;
}

.bookmark .list {
	margin-top: 10px;
	padding: 15px;
	border: 1px solid #e3e3e3;
	border-top: 2px solid #999;
}

.bookmark .list li {
	display: inline-block;
	width: 25%;
	padding: 10px;
	vertical-align: top;
}

.bookmark li:nth-child(2) .list {
	height: 378px;
}

.bookmark li:nth-child(4) .list {
	height: 282px;
}

.bookmark li:nth-child(6) .list {
	height: 397px;
}

.bookmark .list li label {
	display: block;
	cursor: pointer;
}

.bookmark .list li span {
	display: block;
	font-size: 1.000rem;
	text-align: center;
	line-height: 1.4;
}

.bookmark .list li span::before {
	display: block;
	font-family: 'viewcar-font' !important;
	font-size: 60px;
	line-height: 1;
}

.bookmark .list li input:checked+span {
	color: #d7841e;
}

/* ========================================================================
* 운행정보-등록차량상세정보.html
* ======================================================================== */

.register-vehicle-detail .chart {
	width: 80%;
	margin: 30px auto 0;
	text-align: center;
}

.register-vehicle-detail .chart .myChart {
	display: inline-block;
	position: relative;
	width: 16%;
	vertical-align: middle;
}

.register-vehicle-detail .chart .myChart .doughnutSummary {
	display: none;
}

.register-vehicle-detail .chart .myChart .level {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	margin-top: -18px;
	font-size: 2.571rem;
	line-height: 36px;
	text-align: center;
	color: #333;
}

/* .register-vehicle-detail .chart .myChart .level::after {
	content: '▲';
	display: inline-block;
	margin-left: 10px;
	font-size: 0.857rem;
	color: #e60012;
} */

.register-vehicle-detail .chart .chart-explain {
	display: inline-block;
	width: 22%;
	margin-top: 15px;
	margin-left: 30px;
	border-top: 2px solid #ccc;
	vertical-align: middle;
}

.register-vehicle-detail .chart .chart-explain ul li {
	position: relative;
	padding: 12px;
	border-bottom: 1px solid #e3e3e3;
	color: #333;
	text-align: left;
}

.register-vehicle-detail .chart .chart-explain ul li::before {
	content: '■';
	display: inline-block;
	margin-right: 10px;
}

.register-vehicle-detail .chart .chart-explain ul li.purple::before {
	color: #a150cb;
}

.register-vehicle-detail .chart .chart-explain ul li.pink::before {
	color: #ea2b7e;
}

.register-vehicle-detail .chart .chart-explain ul li.blue::before {
	color: #68b2c2;
}

.register-vehicle-detail .chart .chart-explain ul li span {
	float: right;
}

.register-vehicle-detail .chart .detail {
	display: inline-block;
	width: 50%;
	margin-left: 50px;
	vertical-align: middle;
	text-align: left;
}

.register-vehicle-detail .total-price {
	margin-top: 20px;
	padding: 15px;
	background: #f8f8f8;
	border-top: 1px solid #e3e3e3;
	border-bottom: 1px solid #e3e3e3;
	font-size: 1.000rem;
	text-align: center;
	color: #333;
}

.register-vehicle-detail .total-price span {
	color: #e60012;
}

.register-vehicle-detail .vehicle-expenses span {
	display: inline-block;
	margin-left: 10px;
}

.register-vehicle-detail .vehicle-expenses span i {
	font-style: normal;
	font-size: 1.286rem;
}

.register-vehicle-detail .vehicle-expenses span i.up {
	color: #e60012;
	font-size: 0.857rem;
}

.register-vehicle-detail .vehicle-expenses span i.down {
	color: #3270c5;
	font-size: 0.857rem;
}

.register-vehicle-detail dl.states {
	margin-top: 20px;
	padding: 15px 20px;
	border: 1px solid #e3e3e3;
}

.register-vehicle-detail dl.states dt {
	display: inline-block;
	color: #333;
}

.register-vehicle-detail dl.states dd {
	display: inline-block;
}

.register-vehicle-detail dl.states span {
	display: inline-block;
	width: 15px;
	height: 15px;
	margin-left: 20px;
	margin-right: 3px;
	border-radius: 50%;
	font-size: 0;
	line-height: 0;
	vertical-align: 13px;
}

.register-vehicle-detail dl.states span.state01 {
	background-color: #74ba4b;
}

.register-vehicle-detail dl.states span.state02 {
	background-color: #f47321;
}

.register-vehicle-detail .violation-list p {
	margin-top: 10px;
	text-align: right;
}

/* ========================================================================
* 운행정보-차량배차(1).html
* 운행정보-차량배차(2).html
* ======================================================================== */

.vehicle-schedule .top-search input {
	min-width: 300px !important;
}

.vehicle-schedule .top-search #start-date {
	min-width: 150px !important;
	width: 150px;
}

#vehicle-schedule-dialog .table tbody::after {
	content: '';
	display: block;
	height: 10px;
}

/* ========================================================================
* 운행정보-차량배차(3).html
* ======================================================================== */

.register-vehicle-schedule .search-schedule {
	margin-top: 30px;
}

.register-vehicle-schedule .search-schedule input {
	width: 150px;
}

/* ========================================================================
* 운행정보-운행일지.html
* ======================================================================== */

.driving-report .form {
	padding: 15px;
	border: 1px solid #e3e3e3;
}

.driving-report .form strong {
	margin: 0 20px 0 5px;
	color: #ff6600
}

/* ========================================================================
* 운행정보-버스(셔틀)노선정보(1).html
* ======================================================================== */

.bus-route .notice {
	margin-top: 40px;
	padding-top: 120px;
	text-align: center;
	font-size: 1.286rem;
	color: #666;
	font-weight: 500;
	line-height: 1.4;
}

.bus-route .notice::before {
	top: 0;
	left: 50%;
	width: 75px;
	height: 100px;
	margin-left: -38px;
	background-position: -280px -100px;
}

.bus-route .notice span {
	font-size: 0;
}

.bus-route .notice span::before {
	content: '\e958';
	font-family: 'viewcar-font' !important;
	font-size: 28px;
	line-height: 1;
	vertical-align: -4px;
}

.bus-route input.star {
	display: none;
}

.bus-route label.star::before {
	content: '\e958';
	font-family: 'viewcar-font' !important;
	font-size: 28px;
	line-height: 1;
	vertical-align: -4px;
	cursor: pointer;
}

.bus-route input.star:checked+label.star::before {
	content: '\e957';
	color: #ff6600
}

/* ========================================================================
* 운행정보-버스(셔틀)노선정보(2).html
* ======================================================================== */

.bus-route-detail .route {
	margin-top: 2.857rem;
	padding: 2.143rem;
	border: 1px solid #e3e3e3;
	font-size: 0;
	text-align: center;
}

.bus-route-detail .route li {
	display: inline-block;
	position: relative;
	margin: 1.429rem 0;
	padding-top: 40px;
	text-align: center;
	font-size: 1.000rem;
}

.bus-route-detail .route li::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	z-index: 20;
	margin-left: -15px;
	width: 30px;
	height: 30px;
	border: 2px solid #e60012;
	background-color: #fff;
	border-radius: 50%;
	text-align: center;
}

.bus-route-detail .route li::after {
	content: '';
	display: block;
	position: absolute;
	top: 15px;
	z-index: 10;
	width: 100%;
	height: 3px;
	background-color: #ccc;
}

.bus-route-detail .route li .time {
	display: block;
	margin-top: 5px;
	margin-bottom: 10px;
	color: #e60012;
	font-size: 0.857rem;
}

.bus-route-detail .route li.start, .bus-route-detail .route li.end {
	width: 20%;
}

.bus-route-detail .route li.arrow {
	width: 20%;
}

.bus-route-detail .route li.dot {
	width: 15%;
}

.bus-route-detail .route li.start::before {
	content: '기점';
	padding-top: 6px;
	color: #e60012;
	font-size: 12px;
}

.bus-route-detail .route li.start::after {
	left: 50%;
}

.bus-route-detail .route li.end::after {
	right: 50%;
}

.bus-route-detail .route li.end::before {
	content: '종점';
	padding-top: 6px;
	color: #e60012;
	font-size: 11px;
}

.bus-route-detail .route li.arrow::before {
	border-color: #ccc;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -120px -202px;
}

.bus-route-detail .route li.dot::before {
	top: 8px;
	width: 16px;
	height: 16px;
	background-color: #ccc;
	border: none;
	margin-left: -8px;
}

/* ========================================================================
* 운행정보-상세운행기록.html
* ======================================================================== */

.search-bus-route {
	display: block;
}

/* ========================================================================
* 운행정보-차량위치(1).html
* ======================================================================== */

.vehicle-location .map {
	position: relative;
	margin-top: 2.857rem;
}

.vehicle-location .badge {
	position: relative;
	display: inline-block;
	width: 25px;
	height: 35px;
	font-size: 0;
}

.vehicle-location .badge::before {
	content: '';
	display: block;
	position: absolute;
	width: 25px;
	height: 35px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	cursor: pointer;
}

.vehicle-location .icon01::before {
	background-position: -0 -200px;
}

.vehicle-location .icon02::before {
	background-position: -30px -200px;
}

.vehicle-location .icon03::before {
	background-position: -60px -200px;
}

.vehicle-location .icon04::before {
	background-position: -90px -200px;
}

.vehicle-location .badge-info dl {
	display: inline-block;
	margin-right: 50px;
}

.vehicle-location .badge-info dl dt {
	display: inline-block;
	font-weight: 500;
	color: #e60012;
	vertical-align: middle;
}

.vehicle-location .badge-info dl dd {
	display: inline-block;
	margin-left: 10px;
	vertical-align: middle;
}

.vehicle-location .badge-info dl dd .badge {
	top: 9px;
	width: auto;
	margin-right: 10px;
	padding-left: 35px;
	font-size: 1.000rem;
}

.vehicle-location .badge-info dl dd .badge::before {
	top: -9px;
	left: 0;
}

.vehicle-location .multiple .left {
	position: relative;
	float: left;
	margin-right: 2%;
	width: 49%;
}

.vehicle-location .multiple .left .select {
	position: relative;
	padding: 15px;
	background-color: #f8f8f8;
	border: 1px solid #e3e3e3;
}

.vehicle-location .multiple .left select {
	margin-left: 20px;
}

.vehicle-location .multiple .left .delete {
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -15px;
	width: 30px;
	height: 30px;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	font-size: 0;
}

.vehicle-location .multiple .left .delete::before {
	content: '';
	display: inline-block;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	width: 10px;
	height: 10px;
	background-position: -150px -50px;
}

.vehicle-location .multiple .right {
	float: left;
	width: 49%;
	height: 350px;
	padding: 50px;
	background-color: #f8f8f8;
	border: 5px solid #e3e3e3;
	text-align: center;
}

.vehicle-location .multiple .right .select {
	margin-top: 2.857rem;
}

.vehicle-location .multiple .right .select select {
	width: 80%;
	height: 45px;
}

.vehicle-location .multiple .right strong {
	font-size: 1.429rem;
	font-weight: 500;
	color: #555;
	line-height: 1.4;
}

/* ========================================================================
* 차량관리-운행스케쥴(2).html
* ======================================================================== */

.driving-schedule .section01 {
	position: relative;
}

.driving-schedule .section01 .left {
	position: absolute;
	top: 0;
	left: 0;
}

.driving-schedule .section01 .right {
	margin-left: 240px;
}

/* ========================================================================
* 차량관리-실시간자가진단(1).html
* ======================================================================== */

.self-diagnosis .section01 ul {
	margin-top: 2.143rem;
	font-size: 0;
}

.self-diagnosis .section01 ul li {
	display: inline-block;
	width: 12.5%;
	padding: 0 10px;
	text-align: center;
	vertical-align: top;
}

.self-diagnosis .section01 ul li input {
	display: none;
}

.self-diagnosis .section01 ul li label {
	position: relative;
	display: block;
	margin: 0 auto;
	padding-top: 7.857rem;
	font-size: 1.143rem;
	line-height: 1.4;
	cursor: pointer;
}

.self-diagnosis .section01 ul li label::before {
	content: '';
	position: absolute;
	top: 12px;
	left: 0;
	right: 0;
	z-index: 20;
	font-family: 'viewcar-font' !important;
	font-size: 70px;
	line-height: 1;
	cursor: pointer;
	color: #333;
}

.self-diagnosis .section01 ul li label::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 10;
	display: block;
	width: 7.143rem;
	height: 7.143rem;
	margin: 0 auto;
	border: 1px solid #e3e3e3;
	border-radius: 50%;
}

.self-diagnosis .section01 ul li.type01 label::before {
	content: '\e95a';
}

.self-diagnosis .section01 ul li.type02 label::before {
	content: '\e95b';
}

.self-diagnosis .section01 ul li.type03 label::before {
	content: '\e95c';
}

.self-diagnosis .section01 ul li.type04 label::before {
	content: '\e95d';
}

.self-diagnosis .section01 ul li.type05 label::before {
	content: '\e95e';
}

.self-diagnosis .section01 ul li.type06 label::before {
	content: '\e95f';
}

.self-diagnosis .section01 ul li.type07 label::before {
	content: '\e960';
}

.self-diagnosis .section01 ul li.type08 label::before {
	content: '\e961';
}

.self-diagnosis .section01 ul li input:checked+label::before {
	color: #fff
}

.self-diagnosis .section01 ul li input:checked+label::after {
	background-color: #e60012;
	border-color: #e60012;
}

.self-diagnosis .section02 div {
	margin-top: 1.429rem;
	padding: 1.000rem 1.500rem;
	border: 1px solid #e3e3e3;
}

.self-diagnosis .section02 div strong {
	display: block;
	margin-bottom: 10px;
	font-size: 1.143em;
	font-weight: 500;
	color: #555;
}

.self-diagnosis .section02 li label {
	position: relative;
	display: block;
	padding: 8px 0 8px 10px;
	font-size: 1.143em;
	cursor: pointer;
}

.self-diagnosis .section02 li label::before {
	content: '';
	position: absolute;
	top: 15px;
	left: 0;
	width: 3px;
	height: 3px;
	background-color: #333;
	border-radius: 50px;
}

.self-diagnosis .section02 li input {
	display: none;
}

.self-diagnosis .section02 li input:checked+label {
	color: #333;
	text-decoration: underline;
}

.self-diagnosis .section03 div {
	margin-top: 1.429rem;
	padding: 1.000rem 1.500rem;
	border: 1px solid #e3e3e3;
}

.self-diagnosis .section03 div li {
	padding: 5px 0;
	font-size: 1.143em;
	color: #333;
}

.self-diagnosis .section03 div strong {
	font-weight: 500;
}

.self-diagnosis .section03 div strong::after {
	content: ':';
	margin-left: 3px;
	font-weight: 300;
}

.self-diagnosis .section04 div {
	margin-top: 1.429rem;
	padding: 1.000rem 1.500rem;
	border: 1px solid #e3e3e3;
}

.self-diagnosis .section04 div li {
	padding: 5px 0;
	font-size: 1.143em;
	color: #333;
}

.self-diagnosis .section04 div strong {
	font-weight: 500;
}

.self-diagnosis .section04 div strong::after {
	content: ':';
	margin-left: 3px;
	font-weight: 300;
}

.self-diagnosis .section04 div span {
	position: relative;
	display: inline-block;
	padding-right: 15px;
}

.self-diagnosis .section04 div span::after {
	content: '';
	display: block;
	position: absolute;
	top: 2px;
	right: 5px;
	width: 1px;
	height: 16px;
	background-color: #ccc;
}

.self-diagnosis .section04 div span:last-child::after {
	display: none;
}

.self-diagnosis .section04 p.txt {
	padding: 1.000rem;
	border: 1px solid #e3e3e3;
	border-top: none;
	background-color: #f7f7f7;
	font-size: 1.000rem;
}

/* ========================================================================
* 차량관리-벌점과태료(2).html
* ======================================================================== */

.register-fine .section01 {
	position: relative;
}

.register-fine .section01 .left {
	position: absolute;
	top: 0;
	left: 0;
}

.register-fine .section01 .right {
	margin-left: 140px;
}

.register-fine .user tbody::after {
	content: '';
	display: block;
	height: 10px;
}

/* ========================================================================
* 차량관리-정비현황조회등록(2).html
* ======================================================================== */

.register-vehicle-repair .detail {
	font-size: 0;
	margin: 10px 0;
	padding: 10px 5px;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
}

.register-vehicle-repair .detail div {
	display: inline-block;
	width: 25%;
	padding: 0 5px;
	font-size: 1.000rem;
}

.register-vehicle-repair .detail div span {
	display: block;
	margin-bottom: 5px;
	font-size: 12px;
	color: #666;
}

.register-vehicle-repair .detail div input {
	padding-right: 10px;
	text-align: right;
}

.register-vehicle-repair .total-price {
	margin-top: 30px;
	text-align: center;
	font-size: 1.286rem;
	line-height: 1.5;
	color: #333;
}

.register-vehicle-repair .total-price .total {
	display: inline-block;
	font-size: 1.786rem;
}

.register-vehicle-repair .total-price .total span {
	color: #111;
}

.register-vehicle-repair .total-price .total strong {
	color: #e60012;
	font-size: 2.857rem;
}

.register-vehicle-repair .total-price .items {
	display: inline;
}

.register-vehicle-repair .total-price .items span {
	color: #1b733c;
	font-weight: 500;
}

.register-vehicle-repair .total-price .info {
	margin-top: 5px;
	font-size: 1.000rem;
	color: #666;
}

/* ========================================================================
* 차량관리-차량경비(1).html
* ======================================================================== */

.vehicle-cost .cost-list {
	position: relative;
	border: 1px solid #e3e3e3;
	margin-top: 30px;
	padding: 20px;
}

.vehicle-cost .cost-list .btn-function {
	margin-top: 0;
	position: absolute;
	top: 15px;
	right: 20px;
}

/* ========================================================================
* 차량관리-차량경비(2).html
* ======================================================================== */

.register-vehicle-cost .btn-add {
	margin-top: 20px;
	text-align: center;
}

.register-vehicle-cost .btn-add button {
	display: block;
	width: 100%;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	padding: 10px;
}

.register-vehicle-cost .btn-add span {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 30px;
	background-color: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 0;
}

.register-vehicle-cost .btn-add button span::before {
	content: '+';
	display: block;
	padding-top: 4px;
	font-size: 1.000rem;
}

.register-vehicle-cost .btn-remove {
	/* margin-top: 20px; */
	/* text-align: center; */
	height: 100%;
}

.register-vehicle-cost .btn-remove button {
	display: block;
	width: 100%;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	padding: 10px;
	height: 100%;
}

.register-vehicle-cost .btn-remove span {
	position: relative;
	display: inline-block;
	width: 30px;
	height: 30px;
	background-color: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 0;
}

.register-vehicle-cost .btn-remove button span::before {
	content: '-';
	display: block;
	padding-top: 4px;
	font-size: 1.000rem;
}

.register-vehicle-cost .total-price {
	margin-top: 30px;
	padding: 20px 30px;
	border: 5px solid #e3e3e3;
}

.register-vehicle-cost .total-price .price {
	padding: 10px 0;
	font-size: 1.286rem;
	color: #e60012
}

.register-vehicle-cost .total-price .price span {
	display: inline-block;
	/* width: 120px; */
	margin-right: 10px;
	font-size: 1.429rem;
	color: #333;
	text-align: right;
}

/* ========================================================================
* 보고서결재-차량보고서조회제출(2).html
* ======================================================================== */

.vehicle-report-detail .used-vehicle {
	position: relative;
}

.vehicle-report-detail .used-vehicle .img {
	position: absolute;
	top: 50%;
	left: 10px;
	margin-top: -46px;
}

.vehicle-report-detail .used-vehicle .img img {
	width: 130px;
	height: auto;
}

.vehicle-report-detail .used-vehicle .info {
	margin-left: 180px;
}

.vehicle-report-detail .parking-location {
	position: relative;
	margin-top: 20px;
	padding-bottom: 10px;
	border-bottom: 1px solid #e3e3e3;
}

.vehicle-report-detail .parking-location p {
	color: #333;
}

.vehicle-report-detail .parking-location .btn-function {
	position: absolute;
	top: -15px;
	right: 0;
	margin-top: 0;
}

/* ========================================================================
* 보고서결재-차량사고보고서(1).html
* ======================================================================== */

.accident-report .box-register {
	font-size: 1.000rem;
}

.accident-report .box-register>div.txt {
	position: relative;
	margin-bottom: 10px;
	padding-left: 125px;
}

.accident-report .box-register>div.txt p {
	line-height: 1.4;
}

.accident-report .box-register>div.txt strong {
	position: absolute;
	top: 0;
	left: 0;
	font-weight: 400;
	color: #333;
}

/* ========================================================================
* 보고서결재-차량사고보고서(2).html
* ======================================================================== */

.register-accident-report .add-file input {
	display: none;
}

.register-accident-report .add-file label {
	display: block;
	padding: 35px 0 15px;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	text-align: center;
	color: #333;
}

.register-accident-report .add-file label::before {
	content: '+';
	display: block;
	width: 25px;
	height: 25px;
	margin: 0 auto 5px;
	padding-top: 3px;
	background-color: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 1.000rem;
}

/* ========================================================================
* 보고서결재-결재관리html
* ======================================================================== */

.sign-management2 .checked-item {
	margin-top: 10px;
}

.sign-management2 .checked-item span {
	display: inline-block;
	margin-right: 5px;
	padding: 8px 10px;
	border-width: 1px;
	border-style: solid;
	border-color: #e3e3e3 #999 #999 #e3e3e3;
	background-color: #f8f8f8;
	color: #333;
	font-size: 13px;
}

.sign-management2 .table tr td {
	padding: 1.071rem 0.714rem !important;
}

.sign-management2 .table tr:nth-child(odd) td {
	border-bottom: none;
}

.sign-management2 .table .process {
	font-size: 0;
	background-color: #f8f8f8;
}

.sign-management2 .table .process li {
	position: relative;
	display: inline-block;
	width: 33.33%;
	vertical-align: middle;
}

.sign-management2 .table .process.col-4 li {
	width: 25%;
}

.sign-management2 .table .process li input {
	vertical-align: middle;
}

.sign-management2 .table .process li strong {
	display: inline-block;
	margin-right: 15px;
	margin-left: 10px;
	font-weight: 500;
	color: #333;
	font-size: 1.000rem;
	vertical-align: middle;
}

.sign-management2 .table .process li div {
	display: inline-block;
	font-size: 1.000rem;
	vertical-align: middle;
}

/* ========================================================================
* 보고서결재-리포트.html
* ======================================================================== */

.report-list .search-wrap {
	position: relative;
	border: 1px solid #e3e3e3;
	padding: 20px;
	background-color: #f8f8f8;
}

.report-list .search-wrap input {
	height: 3.214rem
}

.report-list .search-wrap .btn-wrap {
	position: absolute;
	top: 20px;
	right: 20px;
}

.report-list .search-wrap button.search {
	min-width: 70px;
}

/* ========================================================================
* 보고서결재-운행통계.html
* ======================================================================== */

.driving-stats .btn-function {
	margin-top: 5px;
	padding: 20px;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
}

.driving-stats .btn-function .left {
	color: #333;
}

.driving-stats .table thead th {
	padding: 1.000rem 1.429rem;
}

.driving-stats .table td {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden
}

/* ========================================================================
* API-개발자지원.html
* ======================================================================== */

.apply-developer {
	font-size: 1.143rem;
	line-height: 1.4;
}

.apply-developer .section01 {
	min-height: 125px;
	padding-top: 20px;
	padding-left: 150px;
}

.apply-developer .section01::before {
	top: 0;
	left: 0;
	width: 125px;
	height: 125px;
	background-position: -370px -100px;
}

.apply-developer .section02 {
	margin-top: 20px;
}

.apply-developer .section02 li {
	position: relative;
	margin-top: 10px;
	padding-left: 13px;
}

.apply-developer .section02 li::before {
	content: '';
	display: block;
	position: absolute;
	top: 9px;
	left: 0;
	width: 3px;
	height: 3px;
	background-color: #333;
	border-radius: 2px;
}

.apply-developer .section03 {
	font-size: 0;
	margin-top: 20px;
	margin-right: -4%;
}

.apply-developer .section03 li {
	display: inline-block;
	width: 25%;
	padding-right: 4%;
	font-size: 1.143rem;
}

.apply-developer .section03 li span {
	position: relative;
	display: block;
	padding: 18px 0;
	border: 1px solid #ccc;
	border-radius: 3px;
	text-align: center;
}

.apply-developer .section03 li.list02 span {
	border: 2px solid #ccc;
}

.apply-developer .section03 li.list03 span {
	border: 3px solid #ccc;
}

.apply-developer .section03 li.list04 span {
	border: 4px solid #ccc;
}

.apply-developer .section03 li span::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: -29px;
	margin-top: -5px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -120px -225px;
	width: 29px;
	height: 10px;
}

.apply-developer .section03 li:last-child span::after {
	display: none;
}

/* ========================================================================
* API-문서.html
* ======================================================================== */

.api-document .list {
	margin-top: 20px;
}

.api-document .list li {
	position: relative;
	margin-top: 7px;
	padding-left: 100px;
	border-width: 1px;
	border-style: solid;
	line-height: 40px;
	color: #333;
}

.api-document .list li:first-child {
	margin-top: 0;
}

.api-document .list li span.method {
	position: absolute;
	top: -1px;
	left: -1px;
	display: block;
	width: 80px;
	height: 42px;
	color: #fff;
	text-align: center;
}

.api-document .list li span.txt {
	position: absolute;
	top: 0;
	right: 10px;
	font-weight: 500;
}

.api-document .list li.get {
	background-color: #e8f1f7;
	border-color: #d2e3f1;
}

.api-document .list li.get span.method {
	background-color: #176ab5;
}

.api-document .list li.get span.txt {
	color: #176ab5;
}

.api-document .list li.put {
	background-color: #faf2e9;
	border-color: #f5e8d8;
}

.api-document .list li.put span.method {
	background-color: #c68629;
}

.api-document .list li.put span.txt {
	color: #c68629;
}

.api-document .list li.post {
	background-color: #e8f6ed;
	border-color: #d2eedd;
}

.api-document .list li.post span.method {
	background-color: #0fa549;
}

.api-document .list li.post span.txt {
	color: #0fa549;
}

.api-document .list li.delete {
	background-color: #f6e8e8;
	border-color: #eed4d5;
}

.api-document .list li.delete span.method {
	background-color: #a42124;
}

.api-document .list li.delete span.txt {
	color: #a42124;
}

/* ========================================================================
* 고객센터
* ======================================================================== */

#view-dialog {
	font-size: 1.000rem;
	color: #666;
	line-height: 1.6;
}

/* ========================================================================
* 마이페이지-회원정보설정.html
* ======================================================================== */

.check-pw .info-txt {
	margin: 20px 0 0;
	border: 1px solid #e3e3e3;
	text-align: center;
	font-weight: 400;
	color: #333;
}

.check-pw .table {
	width: 500px;
	margin: 40px auto 0;
}

/* ========================================================================
* 마이페이지-회원정보설정(개인).html
* ======================================================================== */

.modify-individual .division .time {
	position: relative;
}

.modify-individual .division .time span {
	position: absolute;
	top: 5px;
	right: 10px;
}

.modify-individual .txt {
	margin-top: 10px;
	color: #666;
	font-weight: 400;
}

.modify-individual .txt a {
	text-decoration: underline;
	color: #3270c5;
}

/* ========================================================================
* 마이페이지-회원정보설정(기업).html
* ======================================================================== */

.modify-corporation .type div:not(.txt) {
	display: inline-block;
	position: relative;
	padding: 10px 20px 10px 55px;
	background-color: #f8f8f8;
	border-radius: 2px;
	border: 1px solid #e3e3e3;
	line-height: 30px;
	color: #333;
}

.modify-corporation .type div::before {
	position: absolute;
	top: 50%;
	left: 15px;
	margin-top: -15px;
	font-family: 'viewcar-font' !important;
	font-size: 30px;
	line-height: 1;
}

.modify-corporation .type div.corporation::before {
	content: '\e933';
}

.modify-corporation .type div.rent::before {
	content: '\e934';
}

.modify-corporation .type div.partner::before {
	content: '\e935';
}

.modify-corporation .type div.txt {
	margin-top: 10px;
	padding-left: 0;
	padding-bottom: 5px;
	line-height: 1.4;
}

.modify-corporation .division .time {
	position: relative;
}

.modify-corporation .division .time span {
	position: absolute;
	top: 5px;
	right: 10px;
}

.modify-corporation .txt {
	margin-top: 10px;
	color: #666;
	font-weight: 400;
}

.modify-corporation .txt a {
	text-decoration: underline;
	color: #3270c5;
}

/* ========================================================================
* 마이페이지-가족관리(1)(개인).html
* ======================================================================== */

.family-management .user div {
	padding: 2px 0;
	font-size: 0;
}

.family-management .user div .name {
	display: inline-block;
	width: 45%;
	margin-right: 5%;
	text-align: right;
	font-size: 1.000rem;
	vertical-align: middle;
}

.family-management .user div .btn {
	width: 50%;
	margin: 0;
}

/* ========================================================================
* 마이페이지-가족관리(2)(개인).html
* ======================================================================== */

.invite-vehicle-user .invite {
	margin-top: 30px;
}

.invite-vehicle-user .invite .select {
	text-align: center;
	color: #333;
	font-weight: 400;
}

.invite-vehicle-user .invite ul {
	margin-top: 20px;
	padding: 15px;
	border: 1px solid #e3e3e3;
}

.invite-vehicle-user .invite ul li {
	position: relative;
	margin-top: 10px;
	padding: 0 50px 0 120px;
}

.invite-vehicle-user .invite ul li:first-child {
	margin-top: 0;
}

.invite-vehicle-user .invite ul li input {
	width: 100%;
	height: 40px;
	background-color: #f8f8f8;
}

.invite-vehicle-user .invite ul li .tit {
	position: absolute;
	top: 0;
	left: 0;
	color: #333;
	font-weight: 400;
	line-height: 40px;
}

.invite-vehicle-user .invite ul li button {
	position: absolute;
	top: 0;
	right: 0;
	width: 40px;
	height: 40px;
	background-color: #333;
	border-radius: 3px;
	color: #fff;
	font-size: 0;
	line-height: 0;
}

.invite-vehicle-user .invite ul li button::before, .invite-vehicle-user .invite ul li button::after {
	content: '';
	display: block;
	position: absolute;
	top: 13px;
	left: 19px;
	width: 2px;
	height: 14px;
	background-color: #fff;
}

.invite-vehicle-user .invite ul li button::before {
	top: 19px;
	left: 13px;
	width: 14px;
	height: 2px;
}

.invite-vehicle-user .invite .check {
	margin-top: 30px;
	text-align: center;
	font-size: 1.143rem;
	color: #333;
}

/* ========================================================================
* 마이페이지-이용요금조회결제(1).html
* ======================================================================== */

.service-fee .box-register .grade {
	margin-bottom: 10px;
	color: #333;
	font-weight: 400;
}

.service-fee .box-register .grade>div {
	position: relative;
	margin-top: 5px;
	padding-left: 100px;
}

.service-fee .box-register .grade>div:first-child {
	margin-top: 0;
}

.service-fee .box-register .grade>div button {
	vertical-align: 1px;
}

.service-fee .list04 .box-register .grade>div {
	padding-left: 160px;
}

.service-fee .box-register .grade>div span.tit {
	position: absolute;
	top: 0;
	left: 0;
}

.service-fee .service-name {
	display: block;
}

.service-fee .service-name b {
	display: block;
	margin-bottom: 5px;
	font-weight: 500;
	color: #333;
}

#payment-dialog .change-period {
	position: relative;
	border-bottom: 1px solid #e3e3e3;
	padding: 15px 0 15px 150px;
}

#payment-dialog .change-period span.tit {
	position: absolute;
	top: 0;
	left: 10px;
	bottom: 0;
	font-weight: 500;
	color: #333;
}

#payment-dialog .change-period span.tit::after {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

#payment-dialog .change-period select {
	width: 200px;
}

#payment-dialog .payment-info {
	position: relative;
	margin-top: 10px;
	border-bottom: 1px solid #e3e3e3;
}

#payment-dialog .payment-info .left {
	position: relative;
	width: 50%;
}

#payment-dialog .payment-info .left::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: -16px;
	margin-top: -8px;
	width: 33px;
	height: 15px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -160px -220px;
}

#payment-dialog .payment-info .right {
	position: absolute;
	top: 0;
	right: 20px;
}

#payment-dialog .payment-info ul li {
	position: relative;
	min-height: 24px;
	padding: 5px 0 5px 120px;
	color: #888;
}

#payment-dialog .payment-info ul li .tit {
	position: absolute;
	top: 0;
	left: 10px;
	bottom: 0;
	font-weight: 500;
	color: #333;
}

#payment-dialog .payment-info ul li .tit::after {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
}

#point-charge-dialog .point-info {
	margin: 30px -29px 0;
	padding-bottom: 30px;
	border-bottom: 1px solid #e3e3e3;
	font-size: 0;
}

#point-charge-dialog .point-info li {
	position: relative;
	display: inline-block;
	width: 33.33%;
	padding-bottom: 45px;
	text-align: center;
}

#point-charge-dialog .point-info li:first-child::after {
	content: '+';
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -15px;
	font-size: 2.143rem;
	font-weight: 300;
}

#point-charge-dialog .point-info li:last-child::after {
	content: '=';
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -15px;
	font-size: 2.143rem;
	font-weight: 300;
}

#point-charge-dialog .point-info li span.tit {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	font-size: 1.000rem;
}

#point-charge-dialog .point-info li span.point {
	font-size: 1.571rem;
	font-weight: 300;
	color: #888;
}

#point-charge-dialog .point-info li span.point select {
	width: 100px;
}

#point-charge-dialog .txt {
	margin-top: 15px;
	color: #888;
	font-weight: 300;
	line-height: 1.4;
}

#point-exchange-dialog .point-info {
	margin: 30px -29px 0;
	padding-bottom: 30px;
	border-bottom: 1px solid #e3e3e3;
	font-size: 0;
}

#point-exchange-dialog .point-info li {
	position: relative;
	display: inline-block;
	width: 33.33%;
	padding-bottom: 45px;
	text-align: center;
}

#point-exchange-dialog .point-info li:first-child::after {
	content: '-';
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -15px;
	font-size: 2.143rem;
	font-weight: 300;
}

#point-exchange-dialog .point-info li:last-child::after {
	content: '=';
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -15px;
	font-size: 2.143rem;
	font-weight: 300;
}

#point-exchange-dialog .point-info li span.tit {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	font-size: 1.000rem;
}

#point-exchange-dialog .point-info li span.point {
	font-size: 1.571rem;
	font-weight: 300;
	color: #888;
}

#point-exchange-dialog .point-info li span.point select {
	width: 100px;
}

#point-exchange-dialog .txt {
	margin-top: 15px;
	color: #888;
	font-weight: 300;
	line-height: 1.4;
}

#point-exchange-dialog .txt b {
	font-weight: 400;
	color: #333;
}

#point-exchange-dialog .exchange-user {
	margin-top: 30px;
}

#point-exchange-dialog .exchange-user li {
	position: relative;
	min-height: 30px;
	margin-top: 5px;
	padding-left: 100px;
	color: #888;
	line-height: 30px;
}

#point-exchange-dialog .exchange-user li::before {
	content: '';
	display: block;
	position: absolute;
	top: 13px;
	left: 0;
	width: 4px;
	height: 4px;
	background-color: #666;
	border-radius: 5px;
}

#point-exchange-dialog .exchange-user li span.tit {
	position: absolute;
	top: 0;
	left: 10px;
}

/* ========================================================================
* 마이페이지-이용요금조회결제(2).html
* ======================================================================== */

.detail-service-fee .payment-info {
	padding: 20px;
	border-bottom: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	text-align: center;
}

.detail-service-fee .payment-info ul li {
	display: inline-block;
	margin: 0 10px;
	color: #888;
}

.detail-service-fee .payment-info ul li .tit {
	display: inline-block;
	margin-right: 5px;
	font-weight: 500;
	color: #333;
}

/* ========================================================================
* 마이페이지-비밀번호변경.html
* ======================================================================== */

.change-pw {
	width: 600px;
	margin: 3.571rem auto 0;
}

/* ========================================================================
* MAP설정.html
* ======================================================================== */

.setting-map .time {
	margin: -40px -29px 0;
	padding: 25px;
	border-bottom: 1px solid #e3e3e3;
	font-size: 0;
}

.setting-map .time div {
	position: relative;
	display: inline-block;
	width: 45%;
	font-size: 1.143rem;
	line-height: 1.6;
	color: #333;
}

.setting-map .time div .tit {
	display: block;
	font-size: 1.429rem;
	color: #e60012;
	font-weight: 500;
}

/* .setting-map .time div.departure {
	margin-right: 10%;
} */

/* .setting-map .time div.departure::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: -16px;
	margin-top: -8px;
	width: 33px;
	height: 15px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -160px -220px;
} */

.setting-map .driving-route {
	position: relative;
	margin-top: 30px;
}

.setting-map .driving-route .vehicle {
	font-size: 1.429rem;
	color: #333;
}

.setting-map .driving-route .vehicle strong {
	font-weight: 500;
}

.setting-map .driving-route .map {
	margin-top: 30px;
}

.setting-map .driving-route .btn-wrap {
	position: absolute;
	top: 0;
	right: 0;
}

.setting-map .driving-route .btn-wrap button {
	display: inline-block;
	margin-left: 7px;
	background-color: transparent;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	font-size: 0;
	line-height: 0;
}

.setting-map .driving-route .btn-wrap button.print {
	width: 25px;
	height: 26px;
	background-position: -0 -250px;
}

.setting-map .driving-route .btn-wrap button.full-screen {
	width: 27px;
	height: 26px;
	background-position: -40px -250px;
}

.setting-map .driving-route .btn-wrap button.full-screen.closed {
	background-position: -80px -250px;
}

.setting-map .speed-check {
	margin-top: 20px;
}

.setting-map .speed-check .congestion {
	background-color: #ff0000;
}

.setting-map .speed-check .slow {
	background-color: #ff8314;
}

.setting-map .speed-check .middle {
	background-color: #A901DB;
}

.setting-map .speed-check .high {
	background-color: #00b050;
}

.setting-map .speed-check .normal {
	background-color: #0070c0;
}

.setting-map .speed-check .stick {
	position: relative;
	margin-top: 50px;
}

.setting-map .speed-check .stick .img {
	position: relative;
	top: 0;
	left: 0;
	width: 29px;
}

.setting-map .speed-check .stick .img::after {
	content: '';
	display: block;
	width: 29px;
	height: 36px;
	background-image: url(../img/common/icon-spr.png);
	background-repeat: no-repeat;
	background-position: -26px -200px;
	cursor: e-resize;
}
/*background-position: -120px -250px;*/

.setting-map .speed-check .stick .timescale {
	position: relative;
	height: 5px;
	background-color: #ccc;
	border-radius: 5px;
	font-size: 0;
}

.setting-map .speed-check .stick .timescale .speed span {
	display: inline-block;
	height: 5px;
}

.setting-map .speed-check .stick .timescale .start-end {
	margin-top: 5px;
}

.setting-map .speed-check .stick .timescale .start-end span {
	display: inline-block;
	width: 25%;
	font-size: 1.000rem;
	color: #333;
	font-weight: 400;
	text-align: right;
}

.setting-map .speed-check .stick .timescale .start-end span.start {
	position: absolute;
	top: 10px;
	left: 0;
	text-align: left;
}

.setting-map .speed-check .stick .timescale .start-end.col-2 span {
	width: 50%;
}

.setting-map .speed-check .stick .timescale .start-end.col-3 span {
	width: 33.33%;
}

.setting-map .speed-check .stick .timescale .start-end.col-4 span {
	width: 25%;
}

.setting-map .speed-check .stick .timescale .start-end.col-5 span {
	width: 20%;
}

.setting-map .speed-check .stick .timescale .start-end.col-6 span {
	width: 16.66%;
}

.setting-map .speed-check .stick .timescale .start-end.col-7 span {
	width: 14.28%;
}

.setting-map .speed-check .info {
	margin-top: 40px;
	border: 1px solid #e3e3e3;
	background-color: #f8f8f8;
	padding: 20px;
	text-align: center;
}

.setting-map .speed-check .info div {
	display: inline-block;
	margin: 0 30px;
}

.setting-map .speed-check .info div span {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 7px;
	border-radius: 50%;
}

/* ========================================================================
* 가로사이즈 1024px 이하
* ======================================================================== */

@media ( max-width :1024px) {
	html {
		font-size: 12px;
	}
	#wrap {
		width: 1024px;
		margin: 0 auto;
	}
	#wrap2 {
		width: auto;
		margin: 0 auto;
	}
	#header, #container, #footer {
		padding-left: 5%;
		padding-right: 5%;
		margin-right: 60px;
	} 
	#wrap.scroll #header, #wrap.scroll #container, #wrap.scroll #footer {
		margin-right: 78px
	}
	#dashboard h2.tit {
		margin-bottom: 10px;
	}
	#dashboard .driving-stats .right .chart .item>div:not(.txt) {
		padding: 30px 10px 20px;
	}
	#dashboard .row .col {
		float: none;
		width: 100%;
		margin: 15px 0;
	}
	#dashboard .vehicle-cost table {
		width: 100%;
	}
	#contents-page h3.tit2::before {
		height: 15px;
	}
	#header .section01 .logo {
		left: 20px;
	}
	#header .section01 .language {
		right: 80px;
	}
	.store-detail-type2 .section01 .use-list {
		padding-right: 270px;
	}
	.store-detail-type2 .section01 .use-list::before {
		right: 247px;
	}
	.join-page .select-grade>ul>li .inner {
		min-height: 435px;
	}
	/*
    .btn-function.row-2 .left {
        float: none;
    }
    .btn-function.row-2 .right {
        float: none;
        margin-top: 5px;
	}
	*/
	.none-dispatch .btn-function .left .btn-wrap {
		display: block;
		margin-bottom: 5px;
	}
	.none-dispatch .btn-function .left .btn-wrap button {
		margin: 0;
	}
	.none-dispatch .btn-function .right {
		margin-top: 35px;
	}
	.bookmark li:nth-child(2) .list {
		height: 369px;
	}
	.bookmark li:nth-child(4) .list {
		height: 273px;
	}
	.bookmark li:nth-child(6) .list {
		height: 385px;
	}
	.none-dispatch .scroll-table {
		height: 475px;
	}
	.driving-report .scroll-table {
		height: 485px;
	}
	.sign-management2 .list01 .scroll-table {
		height: 635px;
	}
	.sign-management2 .list02 .scroll-table {
		height: 635px;
	}
	.sign-management2 .list03 .scroll-table {
		height: 635px;
	}
	.sign-management2 .list04 .scroll-table {
		height: 635px;
	}
	.sign-management2 .list04 .scroll-table {
		height: 635px;
	}
	.NTS-report .scroll-table {
		height: 280px;
	}
}

/* ========================================================================
* 가로사이즈 1280px 이하
* ======================================================================== */

@media ( max-width :1280px) {
	#main .section01 .section-left {
		left: 0;
		width: 500px;
	}
	#main .section01 .section-right {
		margin-left: 540px;
	}
}

/* ========================================================================
* 가로사이즈 1440px 이상
* ======================================================================== */

@media ( min-width :1440px) {
	#header, #container, #footer {
		padding-left: 15%;
		padding-right: 12%;
	}
	#header .section01 .logo {
		left: 15%;
	}
	#header .section01 .language {
		right: 15%;
	}

	/* 202305 */
	#header { padding-left:60px; padding-right:60px;}
	#header .section01 { max-width:1560px; margin:0 auto; position: relative;  padding-left: 230px;;}
	#header .section01 .logo { left:90px; }
	#header .section01 .language { right:30px; }
	#container { padding-left:60px; padding-right:60px; max-width:1560px; margin:0 auto; }
	#footer { padding-left:60px; padding-right:60px; }
	#footer .section01 { max-width:1560px; margin:0 auto; position: relative; padding-left:210px;  }
}

/* ========================================================================
* h3 help 툴팁
* ======================================================================== */
h3.help:hover {
	z-index: 110;
}

h3.help::after {
	content: '?';
	display: inline-block;
	width: 20px;
	height: 20px;
	background-color: red;
	border-radius: 50%;
	color: #fff;
	text-align: center;
	line-height: 1.4;
}

h3.help .layer {
	display: none;
	position: absolute;
	top: 50px;
	left: 10px;
	width: 400px;
	height: auto;
	border: 1px solid #e3e3e3;
	background-color: #fff;
	padding: 20px;
	z-index: 200;
	
	text-align: left;
    font-size: 1.000rem;
    color: #333;
    font-weight: 400;
    line-height: 1.4;
}

h3.help:hover .layer {
	display: block;
}


/******************************************************************************************
	New 2022.06
******************************************************************************************/
.search-result-msg { text-align: center; margin:30px 0; text-align:center; font-size:16px; color: #777; padding:20px 0; background: #f8f8f8; border: 1px solid #e3e3e3;  }
.search-result-msg strong { font-weight: 700; color: #222; }
.cal-tabs { margin-bottom: 15px; text-align: right;  }
.cal-tabs div { border-radius:5px; border: 1px solid #2C3E50; display: inline-flex; vertical-align: middle; overflow: hidden;}
.cal-tabs .btn1 { display: inline-block; vertical-align: middle; padding:0.4em 0; width:70px; text-align: center; font-size:1em; line-height: 1.5;  background: #fff; color: #2C3E50; }
.cal-tabs .btn1.active { background: #2C3E50; border-color:transparent; color: #fff;   }

.full-calendar { position: relative;}
.caution-calendar { padding:25px; background: #f8f8f8; font-size:13px; color: #777; line-height: 1.5; margin:20px 0 40px; border: 1px solid #e3e3e3; }
.caution-calendar h4 { color: #222; }
.head-h3 { display: flex; justify-content: space-between; padding-bottom: 10px; margin-bottom: 15px; border-bottom: 1px solid #ddd; }
.head-h3 .btn-function { margin-top:0; }

.workorder-info  {}
.workorder-info .box { margin-bottom: 50px;  }
.workorder-info .box:after { display: block; content: ''; clear: both; }
.workorder-info .box .car-info { float:left; width:500px; display: flex; align-items: center; }
.workorder-info .box .car-info .img { margin-right:15px; }
.workorder-info .box .car-info .img img { width:200px; }
.workorder-info .box .car-info .info span { display: inline-block; vertical-align: middle; font-size:1rem; color: #666; margin-right:8px; }
.workorder-info .box .car-info .number { font-size:2rem; color: #222; font-weight: 700; margin:5px 0 10px; }
.workorder-info .box .car-info dl:after { display: block; content: ''; clear: both; }
.workorder-info .box .car-info dl { margin-top: 8px;}
.workorder-info .box .car-info dl dt { float:left; width:80px; color: #222;  }
.workorder-info .box .table-box { overflow: hidden; }
.ico-rect { display: inline-block; vertical-align: middle; width:12px; height: 12px; margin:-3px 5px 0; background: #b57676; }

.month-bars { padding-left: 90px; position: relative; border: 1px solid #e3e3e3; margin-bottom: 30px;  }
.month-bars h4{position: absolute;left: 0; top:0; width:90px; height: 100%; border-right:1px solid #e3e3e3; display: flex; justify-content: center; align-items: center; background: #f9f9f9; }
.month-bars .months { display: flex; justify-content: space-between; padding:50px 20px 20px; position: relative; }
.month-bars .months:before { content: ''; position: absolute;left: 0; right:0; bottom:45px; height: 1px; background: #ddd; }
.month-bars .months .article { width:16px; }
.month-bars .months .article .bar { height: 150px; background: #8bb576; position: relative; }
.month-bars .months .article .bar .on { position: absolute;left:0; top:0; right:0; background: #b57676;  cursor: pointer;}
.month-bars .months .article .bar .on:before { content: ''; position: absolute;left: -4px; top:-40px; background: url(../img/common/ico_car.png) no-repeat 0 0; width:25px; height: 35px;display: none; ; }
.month-bars .months .article .bar .hover-layer { display: none; position: absolute; left: 12px; top:0; width:200px; height: 100px; text-align: center; padding:15px 0; border: 1px solid #ddd; background: #fff; z-index:10; box-shadow:10px 10px 10px rgba(0,0,0,0.1); }
.month-bars .months .article .bar .hover-layer h5 { font-size:1.1rem; color: #222; font-weight: 600; }
.month-bars .months .article .bar .hover-layer .len { margin:8px 0; }
.month-bars .months .article .bar .hover-layer a { display: inline-block; vertical-align: middle; padding:0 15px; height: 24px; background: #3270c5; color: #fff; border-radius:24px; line-height: 24px; font-size:0.8rem; }
.month-bars .months .article .bar .on:hover .hover-layer { display: block; }
.month-bars .months .article .bar .on:hover:before { display: block; }
.month-bars .months .article .day { font-size:0.65rem; text-align: center; margin-top:15px;  }


.day-bars-wrap { display: none; }
.day-bars { overflow-x:auto; overflow-y:hidden; border: 1px solid #e3e3e3; }
.day-bars::-webkit-scrollbar { height:10px; }
.day-bars::-webkit-scrollbar-track { background: #f0f0f0; }
.day-bars::-webkit-scrollbar-thumb { background: #ccc; border-radius:10px; }
.day-bars .in { width:1600px; }
.day-bars .times { display: flex; margin-bottom: 30px; }
.day-bars .times div { width:4%; text-align: center; font-size:1rem; line-height: 40px; border-bottom: 1px solid #ddd; }
.day-bars .bars { display: flex; padding-bottom: 15px; position: relative; }
.day-bars .bars:before{ content: ''; position: absolute;left: 0; right:0; bottom:35px; height: 1px; background: #ddd; }
.day-bars .bars .article { width:4%; text-align: center; font-size:0.65rem; }
.day-bars .bars .article .bar-box { position: relative; padding:0 16px; }
.day-bars .bars .article .bar-box .bar { height: 35px; background: #8bb576;  }
.day-bars .bars .article .bar-box .on{ display: none; position: absolute; left: 0; top:-65px; width:220px; height: 70px; padding:15px 0; text-align:center; border: 1px solid #ddd; background: #fff; box-shadow:10px 10px 10px rgba(0,0,0,0.1); z-index:2; font-size:0.9rem;  color: #222; }
.day-bars .bars .article .bar-box .on h5 { font-weight: 700; margin-bottom: 10px; }
.day-bars .bars .article .bar-box .bar:hover .on { display: block; }
.day-bars .bars .article.red .bar-box { padding: 0; }
.day-bars .bars .article.red .bar-box .bar { background: #b57676; }
.day-bars .bars .article.red { margin-left: -16px; }
.day-bars .bars .article .loc { margin-top:10px; }
.setting-map .time.type2 { display: flex; justify-content: space-between; margin-left:-20px; margin-right:-20px;   }
.setting-map .time.type2 div{ width:auto; display: block; }
.setting-map .time.type2 div:nth-child(2) { text-align: right; }

.box-layout.type2 { display: none; border: 0; }
.box-layout.type2 .title { padding-left: 0; }
.box-layout.type2>.title .btn-closed a { display: none; }

.mt0 { margin-top:0 !important; }
.mb5 { margin-bottom: 5px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mt20 { margin-top: 20px !important; }
.mt40 { margin-top: 40px !important; }
.ml20 { margin-left: 20px !important; }
.text-right{ text-align: right;}
.text-right .btn { margin-right:0; }

.number-box .states-value { position: relative}
.number-box .layer-number { display: none;position: absolute;left: 70%; top:-2px; padding:10px 20px; background: #fff; border: 1px solid #ddd; box-shadow:10px 10px 10px rgba(0,0,0,0.1); z-index:2; color: #222; white-space: nowrap; }
.number-box .states-value:hover .layer-number { display: block; }
.ico-tip { display: inline-block; vertical-align: middle; width:16px; height: 16px;text-align: center; line-height: 15px; font-size:0.6rem; color: #fff; background: #e60012;border-radius:100%; font-style: normal; }
.ico-tip-box { position: relative; display: inline-block; vertical-align: middle; }
.ico-tip-box .tip-layer { display: none;position: absolute; right:0; bottom:30px; padding:10px 20px; background: #fff; border: 1px solid #ddd; box-shadow:10px 10px 10px rgba(0,0,0,0.1); z-index:2; color: #222;  }
.ico-tip-box:hover .tip-layer { display: block; }


/* 달력 커스텀 */
.fc-h-event .fc-event-main-frame { flex-direction: column; text-align: center; padding:7px 0; }
.fc-daygrid-block-event .fc-event-time { font-weight: 400; }
	

/************************************************************************************************************************
	Main 
************************************************************************************************************************/
#dashboard h2.tit .pull-right { position: absolute; right:0; top:0;}
.main-msg { padding:15px 10px; border: 1px solid #ed1c24; line-height: 1.6;  font-size:1rem; color: #ed1c24; margin-bottom: 20px;}
.status-graphs { display: flex; }
.status-graphs .item { flex:1; border: 1px solid #ddd; text-align: center; position: relative; cursor: pointer; transition: all 0.5s ease;}
.status-graphs .item:before { content: ''; position: absolute; left: -1px;  top:-1px; right:-1px; bottom:-1px; border: 2px solid #ed1c24; opacity:0;transition: all 0.5s ease; }
.status-graphs .item.active:before { opacity:1;  }
.status-graphs .item.active .tit,
.status-graphs .item.active .num { background: #ed1c24; color: #fff; }
.status-graphs .item.active .num .red { font-weight: 600; color: #fff !important; }
.status-graphs .item .tit { line-height: 40px; border-bottom: 1px solid #ddd; font-size:1.2rem;  background: #f9f9f9; transition: all 0.5s ease;}
.status-graphs .item .num span { transition: all 0.5s ease;}
.status-graphs .item .num { line-height: 40px; border-bottom: 1px solid #ddd; font-size:1.2rem;  background: #f9f9f9; transition: all 0.5s ease;}
.status-graphs .item .graph { padding:15px 10px; position: relative;}
.status-graphs .item .graph canvas {  margin: 0 auto; width:100% !important; height: auto !important;}
.status-graphs .item .graph .per { position: absolute;left: 0; right:0; top:50%; transform: translateY(-50%); text-align: center; font-size:1.5rem; color: #222; font-weight: 700; }
.status-table { margin-top:20px;}
.status-table .table tbody tr { transition: all 0.5s ease;}
.status-table .table tbody tr:hover { background: #f2f2f2; }


.flip-btns { text-align: center;  margin-bottom: 40px; }
.flip-btns .btn-flip { width:100px; height: 35px; line-height: 35px; border-radius:0 0 5px 5px; font-size:1rem; color: #fff; background: #3270c5;  }
.flip-btns .btn-flip:after { content: ''; display: inline-block; vertical-align: middle; width:8px; height: 8px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; transform: rotate(-45deg); margin:-7px 0 0 8px; transition: all 0.5s ease;}
.flip-btns .btn-flip.active:after { transform: rotate(135deg); margin-top:1px;}

.text-left { text-align: left !important; }
.text-center { text-align:  center !important; }
.h3-main { height: 40px; line-height: 40px;   background: #ed1c24; font-size:1.2rem; color: #fff; font-weight: 700; padding:0 20px; position: relative;}
.h3-main select { margin:-5px 0 0 20px; }
.h3-main.type2 { background: #fff; color: #222; }
.h3-main .btn-zoom { position: absolute;	top: 20px;	right: 20px;	width: 21px;	height: 21px;	margin-top: -10px;	background-color: transparent;	background-image: url(../img/common/icon-spr.png);	background-repeat: no-repeat;	background-position: -230px -70px;	font-size: 0;	line-height: 0;}
.carwork-status-box { display: flex;justify-content: space-between; }
.carwork-status-box .car-info-box { width:43%; border: 1px solid #ddd;  }
.carwork-status-box .car-info-box .box {height: calc(100% - 40px);}
.carwork-status-box .car-info-box .box .none { height: 100%;  display: flex; justify-content: center; align-items: center; flex-direction: column; line-height: 1.5; font-size:1rem; text-align: center; }
.car-data { margin:30px 20px; padding-left: 110px; position: relative;}
.car-data .img { position: absolute; top:10px; left: 0;  width:100px; }
.car-data .img img { width:100%; }
.car-data .info {}
.car-data .info h4 { font-size:1.4rem; color: #222; font-weight: 700; margin-bottom: 10px; }
.car-data .info h4 .states-value { vertical-align: middle; margin:-3px 0 0 10px; }
.car-data .info .lst dl:after { display: block; content: ''; clear: both; }
.car-data .info .lst dl  { font-size:1rem; line-height: 1.3; margin-bottom: 3px; }
.car-data .info .lst dl dt { float:left; margin-right:15px; font-weight: 700; color: #222; width:100px;  }
.car-data .info .lst dl dd { overflow: hidden; }
.carwork-status-box .car-info-map { width:55%; border: 1px solid #ddd; }

.car-per { padding:20px; border-top:1px solid #ddd; }
.car-per .h4-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;}
.car-per h4 { font-size:1.3rem; font-weight: 700;  color: #222;  }
.car-per .slider { padding:0 40px; position: relative;}
.car-per .slider .swiper-button-prev,
.car-per .slider .swiper-button-next { width:25px; height: 25px; background: url(../img/main/ico_arr.svg) no-repeat 50% 50%; background-size:35px auto;}
.car-per .slider .swiper-button-prev { left: 0; transform: scaleX(-1); }
.car-per .slider .swiper-button-next { right: 0; }
.car-per .swiper-slide .item { display: flex; justify-content: space-between; align-items: center; }
.car-per .swiper-slide .item .graph { width:130px; margin-right:15px; position: relative;}
.car-per .swiper-slide .item .graph .per { position: absolute;left: 0; top:50%; right:0; transform: translateY(-50%); text-align: center; font-size:1.2rem; color: #ed1c24;font-weight: 600; }
.car-per .swiper-slide .item .info { flex: 1; font-size:1.2rem; color: #222; line-height: 1.6;}
.car-per .swiper-slide .item .info .val { padding-left: 10px; position: relative;}
.car-per .swiper-slide .item .info .val:before {content: ''; position: absolute;left: 0; top:11px; width:3px; height: 3px; border-radius:100%; background: #666; }

.graph-bar { width:130px; }
.graph-bar .tit { text-align: center; display: flex;justify-content: space-around; padding-top:5px; border-top:1px solid #ddd;  }
.graph-bar .tit p { width:35px; font-size:1rem; color: #777; }
.graph-bar .tit p:last-child { color: #000; font-weight: 600;}
.graph-bar .bar { display: flex; justify-content: space-around; height: 100px; align-items: flex-end;position: relative; }
.graph-bar .bar p { width:35px;  background: #d8d8d8;  }
.graph-bar .bar p em { font-size:0.9rem; text-align: center; display: block; padding-top:5px; color: #000; font-style: normal; }
.graph-bar .bar p:last-child { background: #ed1c24;}
.graph-bar .bar p:last-child  em { color: #fff; }

.car-workarea { margin:25px 0 40px; padding:20px; border: 1px solid #e3e3e3; }
.car-workarea .btns { text-align: right; margin-bottom: 20px; }
.car-workarea .slider { position: relative; padding:0 40px; }
.car-workarea .slider:before { content: ''; position: absolute;left: -20px; right:-20px; top:71px; height: 1px; background: #ddd; z-index:-1;}
.car-workarea .slider .swiper-container { padding-top:60px; }
.car-workarea .slider .swiper-button-prev,
.car-workarea .slider .swiper-button-next { width:25px; height: 25px; background: url(../img/main/ico_arr.svg) no-repeat 50% 50%; background-size:35px auto; margin-top:-28px;}
.car-workarea .slider .swiper-button-prev { left: 0; transform: scaleX(-1); }
.car-workarea .slider .swiper-button-next { right: 0; }
.car-workarea .slider .section {text-align: center; }
.car-workarea .slider .section .marker { width:24px; height: 24px; position: relative; margin: 0 auto; position: relative; margin-bottom: 20px; }
.car-workarea .slider .section .marker i { display: inline-block; vertical-align: middle; width:24px; height: 24px; border-radius:100%; background: #64b448;}
.car-workarea .slider .section .marker i.bg-red { background: #e60012; }
.car-workarea .slider .section .marker img { position: absolute;left: 50%; top:50%; transform: translate(-50%,-50%); width:70px;}
.car-workarea .slider .section .marker .ic { position: absolute;left: 50%; top:-55px; transform: translateX(-13px); background: url(../img/common/ico_car.png) no-repeat 0 0; width:25px; height: 35px; }
.car-workarea .slider .section .loc1 { font-size:1rem; color: #999; line-height: 1.5; }
.car-workarea .slider .section .loc2 { font-size:1rem; color: #999; padding-top:15px;  }

.h2-head { display: flex; justify-content: space-between; align-items: center; }
.monyears-box .col-box { display: flex; justify-content: space-between; }
.monyears-box .col {width:calc(50% - 10px); }
.monyears-box .box { padding:0 20px 15px; border: 1px solid #e3e3e3;}
.monyears-box .box .sort {  display: flex;  border-bottom: 1px solid #e3e3e3;margin:0 -20px 30px; padding:15px 20px;  background: #f9f9f9; }
.monyears-box .box .sort p { color: #999; margin-right:10px; }

.monyears-box  .item { display: flex; align-items: center; }
.monyears-box  .item .graph { margin-right:20px; }
.monyears-box  .item .info { flex: 1; font-size:1.2rem; color: #222; line-height: 1.6;}
.monyears-box  .item .info .val { padding-left: 10px; position: relative;}
.monyears-box  .item .info .val:before {content: ''; position: absolute;left: 0; top:11px; width:3px; height: 3px; border-radius:100%; background: #666; }
.monyears-box  .item .graph-bar .bar p { position: relative;}
.monyears-box  .item .graph-bar .bar p em { top:-20px; position: absolute; left: 0; right:0; text-align: center; white-space: nowrap; }
.monyears-box  .item .graph-bar .bar p:last-child em { color: #000; }
.car-detail {margin-top:20px; position: relative;}
.car-detail .btn-detail { position: absolute; right:20px; bottom:20px; white-space: nowrap; }
.car-detail .sort select { margin-right:5px;}
.car-detail .detail-box { display: flex; justify-content: space-between; }
.car-detail .detail-box  > div { width:50%; margin: 0;  }
.car-detail .detail-box .item { position: relative; padding-left: 5%;}
.car-detail .detail-box .item:before { content:''; position: absolute;left: 0; top:-30px; bottom:-15px; width:1px; background: #e3e3e3;}
.car-detail .car-data { padding-left: 180px; }
.car-detail .car-data .img { width:160px; }

@media all and (max-width:1024px) {
	.carwork-status-box .car-info-box { width:48%; }
	.carwork-status-box .car-info-map { width:50%; }
	.car-per .swiper-slide .item .graph { width:100px; }
	.graph-bar { width:100px; }
}

/*
#wrap.full-size #header,
#wrap.full-size #footer { margin-right:0;}
#wrap.full-size2 #footer { margin-right:0;}
#wrap.full-size2 .map-wrap { height: calc(100vh - 123px); }
*/

.map-wrap { height: calc(100vh - 215px); position: relative; margin-left: calc(15% - 10px); margin-right:calc(12% + 61px) ;}
.map-wrap iframe { position: absolute; right: 0; top:0; width:100%; height: 100%;}
.map-wrap .aside { position: absolute;left: 0; top:0; bottom:0; width:350px; background: #fff; z-index:10;}
.map-wrap .aside:before {content: ''; position: absolute;left: 0; top:0; bottom:0; width:1px; background: #e3e3e3;}
.map-wrap .aside h1 { display: flex; align-items: center; padding:0 20px; height: 70px; border-bottom: 2px solid #ed6d00;  }
.map-wrap .aside h1 img { height: 40px; }
.map-wrap .aside .loc-aside { padding:15px;}
.map-wrap .aside .loc-aside .desc1 { font-size:12px; margin-top:5px; margin-bottom: 15px;color: #999;}
.map-wrap .aside .loc-aside .ico-q { display: inline-block; vertical-align: middle;width:18px; height: 18px; margin:-3px 7px 0 0; background: #888; text-align: center; line-height: 18px; font-size:10px; color: #fff;  font-style: normal; border-radius:100%; text-indent: -1px;}
.map-wrap .aside .table tbody th { width:120px;}
.map-wrap .aside .tit1 { font-size:14px; margin-bottom: 10px; }
.map-wrap .aside .scroll-box { height: calc(100% - 50px); overflow: auto; }
.map-wrap .aside .addr-btns { position: absolute; right:10px; bottom:10px; }
.map-set-title { display: flex; justify-content: space-between;  font-size:16px; font-weight: 600; color: #222;  }
.map-set-title input { font-size:16px; font-weight: 600; color: #222; padding-left: 10px; position: relative; border: 0; padding: 0;outline:none; flex: 1; }
.map-set-title .btn { margin-right:0;}
.set-info { display: flex; align-items: center; }
.set-info .img { flex:0 0 110px; margin-right:10px; }
.set-info .img img { max-width:100%; }
.set-info .info { flex: 1; }
.set-info .inp-box { position: relative; display: flex; align-items: center;}
.set-info .inp-box + .inp-box { margin-top:6px;}
.set-info .inp-box .inp1 { width:100%; color: #000; }
.set-info .inp-box .btn-srch { position: absolute; right:0; top:0; width:30px; height: 30px; background: url(../img/common/ico_srch.png) no-repeat 50% 50%; }
.set-info .inp-box .tit { flex: 0 0 60px; font-size:14px; font-weight: 600; color: #222; }
.set-info .inp-box.values .inp1 { text-align: left; padding:0 0 0 5px; }
.set-info .inp-box.values .btn-up { position: absolute; right:0; top:0; width:20px; height: 15px; border-left: 1px solid #e3e3e3; border-bottom: 1px solid #e3e3e3;background: url(../img/common/ico_up.png) no-repeat 50% 50%; outline:none;}
.set-info .inp-box.values .btn-down { position: absolute; right:0; bottom:0; width:20px; height: 15px; border-left: 1px solid #e3e3e3; background: url(../img/common/ico_down.png) no-repeat 50% 50%; outline:none;}
.set-info .inp-box .inp1.none-border { border-color:transparent !important; padding-left: 0; outline:none; }

.switch { position: absolute;left: -9999px; }
.switch + p { display: inline-block; vertical-align: middle; width:60px; height: 30px; border-radius:24px; background: #ccc; position: relative; transition: all 0.5s ease; cursor: pointer;}
.switch + p em { position: absolute;left: 2px; top:2px; bottom:2px; width:28px; border-radius:100%; background: #fff;box-shadow:2px 2px 3px rgba(0,0,0,0.3); transition: all 0.5s ease; display: flex; align-items: center; justify-content: center; }
.switch + p em:after { content: 'OFF'; display: inline;  font-size:11px; font-style: normal; color: #ccc; letter-spacing: -1px;}
.switch:checked + p { background: #e5e5e5; }
.switch:checked + p em { left: 29px; background: #ed1c24; }
.switch:checked + p em:after { content: 'ON';}

.checkbox-day { position: absolute;left: -9999px; }
.checkbox-day + p { display: inline-block; vertical-align: middle; width:25px; height: 25px; text-align: center; line-height: 23px; font-size:12px; background: #fff; border: 1px solid #e3e3e3; color: #888; cursor: pointer; }
.checkbox-day:checked + p { background: #b2b2b2; border-color:#b2b2b2; color: #fff; }
.addrs-tit { font-size:14px; color: #ff0000; margin-bottom: 10px; font-weight: 600;}
.addrs-sorting { max-height: 270px; overflow: auto; }
.addrs-sorting .box { display: flex;   margin-bottom: 10px; padding-left: 25px;  position: relative;}
.addrs-sorting .box:hover { cursor:pointer;}
.addrs-sorting .box:hover:before { content: ''; position: absolute;left: 0; top:0; width:20px; height: 30px; background: url(../img/common/ico_sorting.png) no-repeat 50% 50%; }
.addrs-sorting .box .num { flex: 0 0 30px; height:30px; text-align: center; border-radius:5px; background: #b2b2b2; color:#fff; font-size:15px; margin-right:7px; line-height: 30px;  }
.addrs-sorting .box .addr { width:154px; margin-right:10px; }
.addrs-sorting .box .addr .inp { font-size:11px; padding-left: 5px; }
.addrs-sorting .box .time { flex: 0 0 55px; margin-right:10px; text-align: center; padding: 0; background: #f2f2f2; border-color:#f2f2f2; font-size:12px; }
.addrs-sorting .box .btn-del { flex:0 0 30px; border: 0; background: url(../img/common/btn_del.png) no-repeat 50% 50%; }

.addrs-sorting::-webkit-scrollbar { width:7px; height:7px; }
.addrs-sorting::-webkit-scrollbar-track { background: #f0f0f0; }
.addrs-sorting::-webkit-scrollbar-thumb { background: #ccc; border-radius:10px; }
.addr-btns { text-align: right; margin-top:10px;}
.addr-btns .btn { margin-right:0;}

.addrs-sorting .inp::-webkit-input-placeholder { color: #ccc; }
.addrs-sorting .time::-webkit-input-placeholder { color: #ccc;  }

.dialog-content { }
.dialog-content .top-search { display: flex; justify-content: space-between;  margin-top:10px; }
.dialog-content .top-search input { flex: 1; margin:0 10px;}
.dialog-content .btn-function { margin-top:10px;}
.dialog-content .scroll-table { height: 350px;}
.dialog-content .scroll-table .table tbody { }
.dialog-content .car-img { white-space: nowrap;}
.scroll-table::-webkit-scrollbar { width:7px; height:7px; }
.scroll-table::-webkit-scrollbar-track { background: #f0f0f0; }
.scroll-table::-webkit-scrollbar-thumb { background: #ccc; border-radius:10px; }
.map-preview { height: 400px; border: 1px solid #ccc; }
.map-preview iframe{  width:100%; height: 100%;}
.dialog-content + .btn-bottom { margin:10px 0;}


.btn-sample { position: fixed; left: 50%; top:50%; transform: translate(-50%, -50%); z-index:100;	padding:100px; background: #fff; }
.btn-sample h3 { font-weight: 600; margin-bottom: 10px; color: #000;}

#dashboard .tit2 { font-size:16px; font-weight: 600; margin-bottom: 20px; position: relative;}
#dashboard .tit2 .pull-right { position: absolute; right:0; bottom:-5px;}

.btn-refresh { background: url(../img/common/ico_refresh.png) no-repeat 0 0; width:14px; height: 18px; vertical-align: middle; margin-left: 10px; }

.notice-list { padding-bottom: 50px; margin-top:15px;}
.notice-list ul { border-top:1px solid #ddd;}
.notice-list ul li { border-bottom: 1px solid #ddd; padding:15px 0;}
.notice-list ul li .item { position: relative;}
.notice-list ul li .item .ic { position: absolute;left: 0; top:0; width:70px; text-align: center; }
.notice-list ul li .item { padding:0 90px 0 80px; font-size:13px; line-height: 1.6; }
.notice-list ul li .item .subj { font-size:14px; font-weight: 600; color: #222; }
.notice-list ul li .item .txt {  }
.notice-list ul li .item .date { position: absolute; right:10px; top:50%; transform: translateY(-50%); text-align: center; font-size:13px; line-height: 1.5;  }
.notice-new { display: inline-block; vertical-align: middle;width:18px; height: 18px; margin:-3px 7px 0 0; background: #ed1c24; text-align: center; line-height: 18px; font-size:10px; color: #fff; font-weight: 600; font-style: normal; border-radius:100%; text-indent: -1px;}

.scroll-area { height:350px; overflow: auto; }
.scroll-area .notice-list { margin-top:0;}

#work-position,
#work-position-loc { padding: 0; }
.dialog-content.type2 { display: flex; justify-content: space-between; }
.dialog-content.type2 .col-left { flex:0 0 450px; padding:15px;border-right:1px solid #ddd;}
.dialog-content.type2 .col-right { flex:1; position: relative;}
.dialog-content.type2 .col-right .map ,
.dialog-content.type2 .col-right .map iframe { height: 100%; border: 0; vertical-align: top;}
.dialog-content.type2 .top-search { margin-top:0;}
.dialog-content.type2 .top-search input { min-width:auto; width:100%; flex: 1; }
.dialog-content.type2 .top-search button { min-width:100px; }
.dialog-content.type2 .top-search select { min-width:90px; }
.btn-function + .target-time { border-top:1px solid #ddd; margin-top:10px;}
.target-time { display: flex; justify-content: space-between; align-items: center;  border-bottom: 1px solid #ddd; padding:5px 0;}
.target-time h3 { font-size:14px; font-weight: 600; }
.target-time .inp1 { width:70px; text-align: center; padding: 0; }

.batch-list {}
.batch-list ul { height: 320px; overflow: auto; }
.batch-list li { border-bottom: 1px solid #ddd; padding:10px 0;}
.batch-list li .item { display: flex; align-items: center; }
.batch-list li .item .chk { margin-right:10px;padding-left: 10px; display: none; }
.batch-list li .item .car { flex: 1; display: flex; align-items: center;}
.batch-list li .item .car img {max-width:70px;max-height: 60px;margin-right:10px;}
.batch-list li .item .car .info { font-size:13px; line-height: 1.4; color: #222;}
.batch-list li .item .car .info .t1 { font-size:16px; font-weight: 600;}
.batch-list li .item .status { display: flex; justify-content: center; align-items: center; flex-direction: column; flex: 0 0 70px; text-align: center; }
.batch-list li .item .status .tit{display: inline-block;vertical-align: middle;padding:0 10px;height: 20px;line-height: 20px;border-radius:24px;font-size:11px;color: #fff;background: #b2b2b2;}
.batch-list li .item .status .tit.bg-red { background: #e60012;}
.batch-list li .item .status .tit.bg-gray { background: #777;}
.batch-list li .item .status .tit.bg-green { background: #1b733c;}
.batch-list li .item .status .tit.bg-blue { background: #517cb1;}
.batch-list li .item .status .tit.bg-black { background: #222;}
.batch-list li .item .status .bottom { width:100%;}
.batch-list li .item .status .bottom .vals { text-align: center; font-size:11px; color: #999; margin-top:10px; }
.batch-list li .item .status .bottom .vals span { color: #222; }
.batch-list li .item .status .bar {width:100%;  height: 8px; border-radius:8px; position: relative;overflow: hidden; background: #eee; margin-top:7px; }
.batch-list li .item .status .bar em { position: absolute;left: 0; top:0; bottom:0; border-radius:8px; background: #e60012; }
.batch-list li .item .btns { flex:0 0 65px; margin-left: 10px;}
.batch-list li .item .btns button { width:100%; height: 60px; background: #d7841e; text-align: center; font-size:14px; font-weight: 600; border: 0;color: #fff; border-radius:5px; }
.batch-list li .item .btns .comp { width:100%; height: 60px; background: #999; text-align: center; font-size:14px; font-weight: 600; border: 0;color: #fff; border-radius:5px;  display: flex; justify-content: center; align-items: center; }
.batch-list li .item .btns .bg-blue {background: #517cb1;}
.batch-list li .item .btns .bg-green {background: #1b733c;}
.batch-list .btn-batch { display: none; width:100%; height: 40px; text-align: center; border-radius:5px; background: #d7841e; color: #fff; font-size:15px; font-weight: 600; margin-top:10px;}
.batch-list.active li .item .chk { display: block; }
.batch-list.active li .item .btns { display: none; }
.batch-list.active .btn-batch { display: block; }
#work-position-loc .batch-list ul { height: auto; overflow: visible;}

.map-info { position: absolute;left: 15px; right:15px; bottom:15px; border-radius:10px; background: #fff; z-index:10; text-align: center; padding:15px; font-size:13px; line-height: 1.5; color: #888; }
.map-info strong { color: #222; }
.map-info .t1 { display: flex; align-items: center; justify-content: center; }
.map-info .t1 img { width:15px; margin-right:7px;}

.modal-carinfo .car { flex: 1; display: flex; align-items: center; justify-content: center; margin-bottom: 25px; }
.modal-carinfo .car img {max-width:70px; max-height: 60px; margin-right:10px;  }
.modal-carinfo .car .info { font-size:13px; line-height: 1.4; color: #222;}
.modal-carinfo .car .info .t1 { font-size:16px; font-weight: 600;}

#work-position-loc .target-time{ padding:8px 0;}
.loc-info { padding-left: 28px; margin:20px 0 20px 20px;position: relative; }
.loc-info:before { content: ''; position: absolute;top: 35px; bottom:35px; left: 9px; width:1px; border-left: 2px dashed #ddd; }
.loc-info .start { position: relative;}
.loc-info .start:before { content: ''; position: absolute;left: -28px; top:0; background: url(../img/common/ico_marker1.png) no-repeat 0 0; width:20px; height: 27px;}
.loc-info .start.end:before { background-image: url(../img/common/ico_marker2.png);}
.loc-info .start .tit { font-size:15px; font-weight: 600; color: #222; }
.loc-info .start .addr { margin-top:5px; font-size:13px; color: #777; }
.loc-info .time { font-size:13px; color: #999; padding:30px 0; }

.notice-view .item { padding-left: 70px; position: relative; font-size:13px; color: #777; line-height: 1.5; margin-bottom: 10px;}
.notice-view .item .ic { position: absolute;left: 15px; top:5px; }
.notice-view .item .subj { font-size:15px; font-weight: 700; color: #222; }
.notice-view .text-view { padding:15px; font-size:14px; line-height: 1.6; border-top:1px solid #ddd;}
.notice-view .file { border-top:1px solid #ddd; padding:15px;}
.notice-view .file a { text-decoration: underline; }

.mb10 { margin-bottom: 10px !important }
.mb15 { margin-bottom: 15px !important }

.textarea { width:100%; height: 200px; resize:none;}
.inp-box1 { display: flex; }
.inp-box1 .btn-srch { flex: 0 0 70px; height: 30px; background: #ed6d00; border:0; text-align: center; font-size:13px; color: #fff; margin-left: -1px;}

.chk-box {position: relative; margin-bottom: 15px;}
.chk-box a { position: absolute; right:0; top:0; width:40px; height: 25px; line-height: 23px; border: 1px solid #ccc; background: #f9f9f9; text-align: center; font-size:12px; color: #333;}
.chk-box.type2 { padding-left: 24px}
.chk-box.type2 input { position: absolute;left: 0; top:2px; }
.chk-box.type2 label { font-size:12px; line-height: 1.4; word-break: keep-all;}
.btn-area-submit { width:100%; height: 40px; background: #ed6d00; font-size:13px; font-weight: 600; color: #fff; margin-top:10px;}
.btn-call { width:100%; height: 40px; background: #ed6d00 url(../img/common/ico_tel.png) no-repeat 15px center; font-size:13px; font-weight: 600; color: #fff; margin-top:10px;}
.btn-all { width:100%; height: 40px; background: #0086ed; font-size:13px; font-weight: 600; color: #fff; margin-top:10px;}
.map-wrap2 .btn-box {  display: flex; justify-content: space-between; }
.map-wrap2 .btn-box .btn-call { width:48%; background-position: 10px 50%; padding-left: 10px; }
.map-wrap2 .btn-box .btn-all { width:48%; }


.map-wrap2 { height: calc(100vh - 215px); position: relative; margin-left: 15%; margin-right:calc(12% + 61px) ;}
.map-wrap2 iframe { position: absolute;right:0;  top:0;  height: 100%; width:calc(100% - 350px); }
.map-wrap2 .aside { width:350px; height: 100%; background: #fff; z-index:10;}
.map-wrap2 .aside h1 { display: flex; align-items: center; padding:0 20px; height: 60px; border-bottom: 2px solid #ed6d00;  }
.map-wrap2 .aside h1 img { height: 35px; }
.map-wrap2 .aside h1 strong { font-size:18px; font-weight: 600; color: #222; margin-left: 15px;}
.map-wrap2 .aside .loc-aside { padding:15px; height: calc(100% - 60px); overflow: auto; }
.map-wrap2 .aside .loc-aside .desc1 { font-size:12px; margin-top:5px; margin-bottom: 15px;color: #999;}
.map-wrap2 .aside .loc-aside .ico-q { display: inline-block; vertical-align: middle;width:18px; height: 18px; margin:-3px 7px 0 0; background: #888; text-align: center; line-height: 18px; font-size:10px; color: #fff;  font-style: normal; border-radius:100%; text-indent: -1px;}
.map-wrap2 .aside .loc-aside .car-info1 { display: flex ;align-items: center;font-size:14px; font-weight: 600; color: #222; }
.map-wrap2 .aside .loc-aside .car-info1 img { width:80px; margin-right:10px;  }
.map-wrap2 .aside .loc-aside .car-info1 .info strong { display: block; margin-bottom: 5px;}
.map-wrap2 .aside .loc-aside .desc2 { font-size:14px; line-height: 1.5; padding:15px; border: 1px dashed #ddd; background: #f9f9f9; text-align: center;  margin:15px 0;}
.map-wrap2 .aside .loc-aside .desc2 small { font-size:11px; color: #cf4444; word-break: keep-all;}
.map-wrap2 .aside .table tbody th { width:120px;}
.map-wrap2 .aside .tit1 { font-size:14px; margin-bottom: 10px; }

.etc-tit { font-size:1rem; color: #333; margin-bottom: 10px; position: relative; padding-top:15px; }
.etc-tit .btn { position: absolute; right:0; bottom:0;}
.map-wrap .setting-map { position: absolute; right:0; bottom:0; left:350px; background: #fff; }
.fc .fc-daygrid-day-frame { height: 100px !important; }
.ev-cont {padding:5px; }
.ev-cont dl:after { display: block; content: ''; clear: both; }
.ev-cont dl { font-size:12px; }
.ev-cont dl + dl { margin-top:3px;}
.ev-cont dl dt { float:left; width:60px; font-weight: 600;}

.orange { color: #ed6d00 !important;}

@media all and ( max-width :1024px) {
	.only-pc { display: none; }	
	.full-size2 { width:auto !important; }
	.map-wrap2 { margin-left: 0; margin-right:0; height: auto; }
	.map-wrap2 iframe { height: 240px; position: static;width:100%;margin-bottom: 15px;}
	.map-wrap2 .aside { width:auto; height: auto; }
	
	.map-wrap2 .floating { position: fixed; left: 0; right:0; bottom:0; border-radius:10px 10px 0 0; background: #fff; z-index:100; box-shadow:0 0 10px rgba(0,0,0,0.5); padding:15px; height: 370px;  }
	.map-wrap2 .floating + iframe{  position: fixed;left: 0; top:0; right:0;  height: calc(100vh - 360px); width:100%;}
	.map-wrap2 .floating.h270 { height: 270px; }
	.map-wrap2 .floating.h270 + iframe { height: calc(100% - 270px); }
	
}


@media all and (max-width:1440px) {
	.map-wrap { margin-left: 5%; margin-right:calc(5% + 61px);}
}


.ui-timepicker-standard { padding: 0; border: 1px solid #ddd; z-index:1000 !important}
.ui-timepicker-standard a { color: #666; padding:5px;font-size:11px; text-align: left; }
.ui-widget.ui-widget-content { border: 0; padding: 0; }

.ui-timepicker-standard ::-webkit-scrollbar { height:5px; width:5px;  }
.ui-timepicker-standard ::-webkit-scrollbar-track { background: #f0f0f0; }
.ui-timepicker-standard ::-webkit-scrollbar-thumb { background: #ccc; border-radius:10px; }

table.table .car-img span.img img.user-img {
width: 40px;
height: 40px;
}




/* 202305 */
.table .btn-flip { background: none; font-size:1rem; color: #333; }
.table .btn-flip:after { content: ''; display: inline-block; vertical-align: middle; width: 0;height: 0;border-style: solid;border-width: 0 4px 5px 4px;border-color: transparent transparent #333333 transparent; margin:-3px 0 0 8px; transform: scaleY(-1);}
.table .btn-flip.active:after {  transform: scaleY(1);}
.cols { display:flex; gap:30px; margin-bottom:30px; }
.cols .col { width:50%  }
.cols.col3 .col { width:33.33333%; }

.graph-area { display:flex; gap:20px; }
.graph-area > div { width:50%; }


.ve-info { display: flex; padding-bottom: 25px; border-bottom: 1px solid #ddd; margin-bottom: 25px;  }
.ve-info dl { flex: 1; gap:20px; line-height: 1.6;  }
.ve-info dl + dl { border-left: 1px dashed #eee; padding-left: 15px; }
.ve-info dl dt { color: #222; font-weight: 500; position: relative; margin-bottom: 12px;  }
.ve-info dl dt .btns { position: absolute; right:0; top:0; }
.ve-info dl dt .btns .btn.sm { min-width:4rem; }
.ve-info dl dd strong { display: block; margin-top:20px; color: #222; font-weight: 500; }
.ve-info dl dd textarea { width:100%; height: 80px; resize:none; }

.dialog-content .tit2 { font-size:1.3rem; margin: 10px 0; font-weight:600;}
.top-search.type2  { gap:10px; }
.top-search.type2 input { min-width:140px; margin:0; }
.hr { width:100%; margin:20px 0; height:1px; background:#ddd; padding:0; }

.calcu-total { display:flex; justify-content: space-between; font-size:1.2rem;}
.calcu-total dd { font-weight: 600; }
.calcu-total dl { display:flex; gap:15px;}

.h4 { font-size:16px; font-weight: 400; padding-left: 10px; position: relative; color: #555; margin-bottom: 20px; }
.h4:before{ content: ''; position: absolute;left: 0; top:7px; width:4px; height: 4px; background: #999; }

.flex { display: flex; }
.justify-between { justify-content: space-between; }
.align-center { align-items: center; }
.flex .section { flex: 1; }
.flex.gap { gap:20px; }
.flex.gap2 { gap:10px 15px; }

.flex .h4 { margin-bottom: 0; }
.flex .section .h4 { margin-bottom: 20px; }
.flex-wrap { flex-wrap: wrap; }
.mr10 { margin-right:10px; }

.mt5 { margin-top:5px !important;}
.mt10 { margin-top:10px !important;}
.mt20 { margin-top:20px !important;}
.f11 { font-size:11px !important; }
.f12 { font-size:12px !important; }
.enabled { display: inline-block; vertical-align: middle; padding:3px 10px 3px 28px; line-height:1.3; border: 1px solid #ddd; white-space: nowrap; font-size:13px;  width:90px;  position: relative; text-align: left; }
.enabled:before { content: ''; display: inline-block; vertical-align: middle; background: url(../img/common/ico_chk.png) no-repeat 0 0; width:13px; height: 10px;  opacity:0.4;  position: absolute;left: 10px; top:50%; margin-top:-5px;  }
.enabled.active { border-color:#e60012; }
.enabled.active:before { opacity:1;  }
.opened { display: inline-block; vertical-align: middle; padding:3px 10px 3px 28px; line-height:1.3; border: 1px solid #ddd; white-space: nowrap; font-size:13px; text-align: left;  position: relative; width:130px; }
.opened:before { content: ''; display: inline-block; vertical-align: middle;  margin:-3px 7px 0 0; opacity:0.4; width:12px; height: 12px; border-radius:2px;  background: #e60012; position: absolute;left: 10px; top:15px;   }
.opened.active { border-color:#e60012; }
.opened.active:before { opacity:1; width: 0;height: 0;border-style: solid;border-width: 6.5px 0 6.5px 10px; border-color: transparent transparent transparent #e60012; border-radius:0; background: none;  }
.opened.pause:before { display: none; }
.opened i { display: inline-block; vertical-align: middle; margin:-3px 7px 0 0; opacity:0.4; width:12px; height: 12px; position: absolute;left: 10px; top:15px;  }
.opened i:before { content: ''; display: inline-block; vertical-align: middle; width:4px; height: 12px; border-radius:2px; background: #e60012; }
.opened i:after { content: ''; display: inline-block; vertical-align: middle; width:4px; height: 12px; border-radius:2px; background: #e60012;  margin-left: 3px; }
.opened em { border-radius:10px; font-size:.11rem; font-style: normal; background: #eee;padding:0 5px;}

.btn-unit-popup { cursor: pointer; }
.radio-box { display: flex; gap:20px; }
.radio-box label { width:33.3333%; cursor: pointer;; }
.radio-box input { position:absolute; opacity:0; z-index:-1; display:none;}
.radio-box input + div .tit { font-size:1.1rem; padding-left:20px; position:relative; color:rgba(0,0,0,0.5) }
.radio-box input + div .tit em {position:absolute; left:0; top:2px; width:14px; height:14px; border-radius:100%; border:1px solid #ddd;transition:all 0.5s ease;}
.radio-box input + div .tit em:before {content:''; position:absolute; left:2px; top:2px; right:2px; bottom:2px; background:#000; border-radius:100%; background-color: #000;  transform: scale(0.5); transition:all 0.5s ease; opacity:0;}
.radio-box input + div .txt { margin-top:10px; font-size:1rem; color:#888; opacity:0.5; line-height:1.6; transition: all 0.5s ease; }
.radio-box input:checked + div .tit em { border-color:#000;}
.radio-box input:checked + div .tit em:before { opacity:1; transform: scale(1);}
.radio-box input:checked + div .tit { color:#000; }
.radio-box input:checked + div .txt { opacity:1;  }

.table .detail-box { display:none;  border:1px solid #e3e3e3; }
.table .detail-box > td { padding:2rem !important; } 
.table .detail-box table.table tbody td { border-right:1px solid #e3e3e3; text-align: left;}
.sub-totals { display: flex;justify-content: flex-end; flex-direction: column; align-items: flex-end; }
.sub-totals dl { overflow:hidden; font-size:1.1rem; font-weight:600; color:#000; margin-bottom:12px; white-space: nowrap; }
.sub-totals dl dt { float:left; width:150px; }
.sub-totals dl dd { width:120px; overflow:hidden; text-align: right;}

.btn-common-flip { width:25px; height:25px; display:flex; justify-content: center; align-items: center;}
.btn-common-flip:before { content:''; display:block; width:10px; height:10px; border-left:1px solid #000; border-bottom:1px solid #000; transform:rotate(-45deg); transition:all 0.5s ease;}

.btn-unit-flip.active .btn-common-flip:before { transform: rotate(135deg) translateY(-3px); }
.btn-unit-flip.active + .detail-box { display:table-row; }

.plan-wrap { margin-bottom: 3rem; }
.plan-wrap .plan { margin-bottom: 10px; }
.radio-plan { position: absolute; display: none; }
.radio-plan + div { padding: 15px 0 15px 70px; border: 1px solid #ddd; position: relative; transition: all 0.5s ease;  cursor: pointer; }
.radio-plan + div i { position: absolute; right:20px; top:50%; width:16px; height: 16px; border-radius:100%; border: 1px solid #ddd; transition: all 0.5s ease;margin-top:-8px; }
.radio-plan + div i:before { content: ''; position: absolute;left: 2px; top:2px; right:2px; bottom:2px; border-radius:100%; background: #000; opacity:0; transition: all 0.5s ease; transform: scale(0.5); }
.radio-plan:checked + div { border-color:#000; }
.radio-plan:checked + div i { border-color:#000;}
.radio-plan:checked + div i:before { opacity:1; transform: scale(1); }
.radio-plan:checked + div em { color: #000; }
.radio-plan + div em { position: absolute;left: 5px; top:50%; transform: translateY(-50%) ; font-size:65px; color: #ccc; font-family: 'viewcar-font' !important; font-style: normal;  transition: all 0.5s ease; }
.radio-plan + div dl dt { font-size:1.2rem; color: #000;  font-weight: 600; margin-bottom: 8px; }
.radio-plan + div dl dd { font-size:1rem; color: #666; line-height: 1.5;  }
.radio-plan + div dl dd strong { font-weight: 600; color: #000; }
.disabled-txt { opacity:0.6; }

.box-line { padding:20px; border: 1px solid #ddd;  margin-bottom: 3rem; }
.code-dc { display: flex; padding-left: 20px; position: relative; color: #000; gap:12px;  font-size:0.9rem; }
.code-dc:before { content: ''; position: absolute;left: 5px; top:3px; width:8px; height: 8px; border-left: 1px solid #000; border-bottom: 1px solid #000; }

.total-price2 { display: flex; align-items: flex-end; flex-direction: column;  gap:1rem 3rem; padding: 2rem; background: #f9f9f9;  }
.total-price2 .box1{ display: flex; gap:2rem }
.total-price2 dl { display: flex; align-items: center;  font-size:1.2rem; color: #666; gap:1.5rem; }
.total-price2 dl dt {width:110px; white-space: nowrap; }
.total-price2 dl dd { font-size:1.3rem; color: #000; font-weight: 600; }
.total-price2 .box2 {margin-top:1.2rem;}
.total-price2 .box2 dl { font-size:1rem; display: flex;}
.total-price2 .box2 dl + dl { margin-top:10px;}
.total-price2 .box2 dl dt { width:110px; } 
.total-price2 .box2 dl dd {font-size:1.1rem; flex:1;  }

input[type='checkbox']:disabled + span { opacity:0.5; }
input[type='radio']:disabled + span { opacity:0.5; }

/* 사이드메뉴 OVERRIDE */
#quick-menu .inner { width:160px; right:-100px; }
#quick-menu li .cont { width:100px; top:50%; transform: translateY(-50%); ; }
#quick-menu li .dep2 ul li { margin-bottom:15px; }
#quick-menu li .dep2 ul li a { display:block; font-size:12px; color:#999; font-family: 'viewcar-font' !important; letter-spacing: -1px;text-align: center; transition: all 0.5s ease;}
#quick-menu li .dep2 ul li a:before { display:block; color:#999; font-size:42px; line-height:1; letter-spacing:0; transition: all 0.5s ease;}
#quick-menu li .dep2 ul li a span { display:block; }
#quick-menu li .dep2 ul li a:hover { color:#000; }
#quick-menu li .dep2 ul li a:hover:before { color:#000; }

#BenefitArea.off { pointer-events: none; opacity:0.5; }

.repair-tabs { display: flex; gap:1rem; margin-bottom: 30px;  }
.repair-tabs button { flex: 1; height: 200px; border: 1px solid #ddd; text-align: center; background: #f9f9f9; }
.repair-tabs button i { font-family: 'viewcar-font' !important; font-size:70px; font-style: normal; }
.repair-tabs button strong { display: block; margin:10px 0; font-size:1.2rem; color: #000; }
.repair-tabs button p { font-size:1rem; color: #999;}
.repair-tabs button.active { border-color:#000; background: #fff;  }
.repair-tabs button.active  p { color: #000; }
.repair-item { display: flex; gap:20px; align-items: center; margin-bottom: 20px;}
.repair-item .txt { flex: 1; font-size:1.2rem; line-height: 1.5; }
.repair-item .img { flex:0 0 40%; }
.repair-item .img img { width:100%; }
.unit-wrap .none { padding: 40px; border: 1px solid #eee; background: #f9f9f9; text-align: center; font-size:1.1rem; margin-bottom: 40px; }

/* 20230609 */
#header .btns {	position: absolute;	top: 50%;	right: 5%;	transform: translateY(-50%); }
#header .btn-logout { border: 0; outline:none; background: url(../img/common/ico_logout.png) no-repeat 50% 50%; width:25px; height: 25px; background-size:contain; }

/* 202307 */
.depositc { display: flex; flex-wrap: wrap; gap:5px; width:115px;  margin: 0 auto;}
.depositc li { width:15px; height: 15px;  background: #eee;} 
.depositc li.on { background: #7ca136; }
.ico-deposit { display: inline-block; vertical-align: middle; color: #5a94db;  }
.ico-deposit img { vertical-align: middle; margin:-3px 2px 0 0;}
.ico-deposit.deposit2 { color: #db5a5a;}
.ico-deposit.deposit3 { color: #d59b50;}
.btn-del-common { display: inline-block; vertical-align: middle; width:30px; height: 30px; background: url(../img/common/btn_del.png) no-repeat 50% 50%; }

.btn.icon-report:before {display: inline-block; vertical-align: middle; color: #fff; font-size:28px; line-height: 1; font-family: 'viewcar-font' !important }
.table tr.on { background: #f2f2f2;}