﻿@charset "utf-8";

/* content-title 클래스 */
.content-title {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    border: solid #A8A8A8;
    padding: 1px;
    padding-left: 8px;
    border-width: 2px;
}

/* ==================================================
	대시보드 조회
================================================== */
/*제목*/
.top_tit {
	display: flex;
	align-items: center;
	border-bottom: 1px solid #d2d2d2;
	padding-bottom: 10px;
}

.top_tit h3 {
	color: #002F87;
	font-weight: 800;
	font-size: 1.8rem;
	padding-left: 8px;
}

/*뷰*/
.top_view {
	display: flex;
	margin-top: 10px;
	flex-wrap: wrap;
}

.top_view>a {
	padding: 15px 30px;
	display: flex;
	border-radius: 10px;
	border: 1px solid #d2d2d2;
	margin-right: 10px;
	position: relative;
	margin-top: 10px;
}

.top_view>a:hover {
	background: #fff;
}

.top_view>a:hover>h4 {
	color: #3e3e3e;
	font-weight: 700;
}

.top_view>a>button {
    position: absolute;
    top: 12px;
    right: 15px;
}

.top_view>a.on {
	background: #fff;
}

.top_view>a.on>h4 {
	color: #3e3e3e;
	font-weight: 700;
}

.top_view>a>h4 {
	padding-right: 25px;
	color: #8b8b8b;
	font-weight: 400;
}

/*조회하기*/
.view_con {
	/*display: flex;*/
	display: block;
	margin-top: 10px;
	align-items: center;
	border-bottom: 1px solid #d2d2d2;
	padding-bottom: 10px;
}

.view_con .tit {
	margin-right: 15px;
	word-break: keep-all;
}

/* ==================================================
	검색버튼
================================================== */
.field {
	position: relative;
	display: flex;
}

.field.col-auto {
	flex-grow: 1;
}

.field.col-small {
	width: calc(25%);
}

.field.col-medium {
	width: calc(32%);
}

.field.col-data {
	max-width: 500px;
}

.field.col-medium2 {
	width: calc(45%);
}

.field.col-medium3 {
	width: calc(49%);
}

.field.col-large {
	width: 100%;
}

.field input[type="text"] {
	width: 100%;
	height: 35px;
	font-family: 'Pretendard';
	font-size: 1.7rem;
	border-radius: 5px !important;
	padding: 0px 10px 0px 10px !important;
}

.field label.field-title {
	display: flex;
	align-items: center;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 28px;
	padding: 0 16px;
	color: #a3a3a3;
	transition: 0.25s;
}

.field label.field-title span {
	position: relative;
	font-size: 1.6rem;
}

.field input[type="text"][readonly="readonly"],
.field input[type="password"][readonly="readonly"],
.field input[disabled="disabled"],
.field textarea[disabled="disabled"],
.select-wrap input[type="button"]:disabled {
	background-color: #ffffff;
	border: 1px solid #d9d9d9;
	color: #a3a3a3;
	cursor: default;
}

.field input.disabled {
	background-color: #f7f8f8;
	border-color: #dcddde;
}

.field-has-unit .unit {
	display: flex;
	align-items: center;
	position: absolute;
	right: 15px;
	top: 11px;
	height: auto;
	font-style: normal;
	font-size: 1.5rem;
	font-family: 'Pretendard';
}

/* 달력 */
.calendar input {
	padding-right: 16px;
	background: url('../images/common/date_icon.svg') calc(100% - 16px) 50% no-repeat;
}

.field input[type="text"]:active, .field input[type="text"]:hover, .field input[type="text"]:visited {
    background: url(../images/common/date_icon.svg) calc(100% - 16px) 50% no-repeat #fff;
	border: 1px solid #002F87;
}

/* Slect */
#sch_time {
	width: 72px;
	margin-left: 10px;
	font-family: 'Pretendard';
}

select::-ms-expand {
	display: none;
	-webkit-display: none;
	-moz-display: none;
	-o-display: none;
	-ms-display: none;
}

select {
	background-image: none;
	padding: 0 0 0 10px;
	height: 28px;
	color: #a3a3a3;
	border: 1px solid #d9d9d9;
	border-radius: 3px;
	background-image: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	-o-appearance: none;
	-ms-appearance: none;
	font-size: 1.5rem;
	border-radius: 5px;
	background: #ffffff url("../images/dashboard/arrow01.svg") no-repeat right+10px center;
	font-family: 'Pretendard';
}

select:focus {
	border: 1px solid #3486d9;
	outline: none;
}

/* 모기업,협력사 */
.view_flex {
	display: flex;
	align-items: center;
}

.view_flex .view_list {
	position: relative;
	display: flex;
	align-items: center;
	margin-left: 25px;
}

.view_flex .view_list::before {
	position: absolute;
	content: "";
	top: 8px;
	left: 0px;
	width: 1px;
	height: 20px;
	background: #d8d8d8;
}

.view_flex .view_list h3 {
	padding-right: 10px;
	padding-left: 15px;
	word-break: keep-all;
}

.company input[type="text"] {
    width: 100%;
    height: 35px;
    font-family: 'Pretendard';
    font-size: 1.7rem;
    border-radius: 5px !important;
    padding: 0px 10px 0px 10px !important;
	background: #fff;
	border: 1px solid #d7d7d7;
}

.partner input[type="text"] {
    width: 100%;
    height: 35px;
    font-family: 'Pretendard';
    font-size: 1.7rem;
    border-radius: 5px !important;
    padding: 0px 10px 0px 10px !important;
	background: #fff;
	border: 1px solid #d7d7d7;
}

/* 검색버튼 */
.tsearch {
	width: 100px;
	height: 35px;
	margin-left: 15px;
	color: #fff;
	background: #002F87;
	text-align: center;
	border-radius: 5px;
	font-size: 1.7rem;
	font-family: 'Pretendard';
}


/*컨텐츠*/
.con_flex {
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}

.company_con {
	background: #fff;
	border: 1px solid #e6e6e6;
	box-shadow: 8px 4px 23.3px 0px rgba(0, 0, 0, 0.10);
	flex-basis: 49.5%;
	padding: 15px;
	border-radius: 10px;
}

.partner_con {
	background: #fff;
	border: 1px solid #e6e6e6;
	box-shadow: 8px 4px 23.3px 0px rgba(0, 0, 0, 0.10);
	width: 782.5px;
	height: 340px;
	max-height: 340px;
	padding: 15px;
	border-radius: 10px;
}

.contents .con_tit {
	background: #F8F9FD;
	border: 1px solid #dfdfdf;
	border-radius: 5px;
	padding: 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.contents .con_tit>h3 {
	font-size: 2rem;
	color: #002F87;
}

.contents .con_tit>.cname {
	font-size: 2rem;
	font-weight: 500;
	color: #979797;
}

.plan {
	max-width: 800px;
	margin: auto;
	margin-top: 10px;
}

.plan h3 {
	font-size: 2rem;
	font-weight: 500;
	padding-bottom: 10px;
	display: inline-block;
}

.progre {
	margin-top: 15px;
	display: flex;
	justify-content: center;
}

.pro_con {
	width: 70%;
}

.plan .progre:first-child progress {
	width: 100%;
	height: 20px;
	appearance: none;
}

.plan .progre:first-child progress::-webkit-progress-bar {
	background: #f0f0f0;
	border-radius: 50px;
	border: 1px solid #E7E7E7;
	overflow: hidden;
}

.plan .progre:first-child progress::-webkit-progress-value {
	background: #FEB028;
}

.plan .progre:nth-child(2) progress {
	width: 100%;
	height: 20px;
	appearance: none;
}

.plan .progre:nth-child(2) progress::-webkit-progress-bar {
	background: #f0f0f0;
	border-radius: 50px;
	border: 1px solid #E7E7E7;
	overflow: hidden;
}

.plan .progre:nth-child(2) progress::-webkit-progress-value {
	background: #00AE42;
}

.plan .progre:last-child progress {
	width: 100%;
	height: 20px;
	appearance: none;
}

.plan .progre:last-child progress::-webkit-progress-bar {
	background: #f0f0f0;
	border-radius: 50px;
	border: 1px solid #E7E7E7;
	overflow: hidden;
}

.plan .progre:last-child progress::-webkit-progress-value {
	background: #DE0E0E;
}

.plan .progre:first-child label {
	background: url(../images/dashboard/y_label.svg)no-repeat;
    background-size: cover;
    margin-left: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Anton';
    color: #ffffff;
    font-size: 3rem;
    width: 7.5rem;
    height: 7.5rem;
}

.plan .progre:nth-child(2) label {
	background: url(../images/dashboard/g_label.svg)no-repeat;
	background-size: cover;
	margin-left: 15px;
	display: flex;
align-items: center;
    justify-content: center;
	font-family: 'Anton';
	color: #ffffff;
	font-size: 3rem;
    width: 7.5rem;
    height: 7.5rem;
}

.plan .progre:last-child label {
	background: url(../images/dashboard/r_label.svg)no-repeat;
	background-size: cover;
	margin-left: 15px;
	display: flex;
align-items: center;
    justify-content: center;
	font-family: 'Anton';
	color: #ffffff;
	font-size: 3rem;
 width: 7.5rem;
    height: 7.5rem;
}


/*생산진행(협력사)-프로세스*/
.pa_pro {
	padding: 35px 0px 0px 0px;
}

.pa_pro>ul {
	display: grid;
	grid-template-columns: repeat(6,1fr);
	text-align: center;
}

.pa_pro>ul>li {
	position: relative;
}

.pa_pro>ul>li::after {
	position: absolute;
	content: "";
	right: -8px;
	top: 30%;
	background: url(../images/dashboard/next_icon.svg)no-repeat;
	width: 12px;
	height: 15px;
}

.pa_pro>ul>li:last-child::after,
.pa_pro>ul>li:first-child::after {
	content: none;
}

.pa_pro>ul>li>img {
	margin-bottom: 10px;
	width: 8rem;
	height: 8rem;
}

.pa_pro>ul>li>.model {
	color: #afafaf;
}

/*생산진행(협력사)-표*/
.pa_table {
	margin-top: 25px;
	border-top: 2px solid #b9b9b9;
	text-align: center;
	overflow-y: auto;
}

.pa_table tr td {
	padding: 15px;
	width: 200px;
	font-family: 'Anton';
	font-weight: 500;
	color: #b1b1b1;
	font-size: 2.2rem;
	border-bottom: 1px solid #d8d8d8;
	border-right: 1px solid #d8d8d8;
}

.pa_table tr:nth-child(odd) {
	background: #F8F9FD;
}

.pa_table tr td:first-child {
	font-family: 'Pretendard';
	font-size: 1.8rem;
	color: #3e3e3e;
}

.pa_table tr .pro {
	color: #002F87;
}

/* 생산진행(협력사) 스크롤바 */
.pa_table.scrollbar {
	border-radius: 0;
}

.pa_table.scrollbar+.pro_table {
	margin-top: 30px;
}

.pa_table table tr th,
.pa_table table tr td {
	padding: 12.5px 2px;
}

/* 스크롤 바 전체 */
.pa_table::-webkit-scrollbar {
	width: 10px;
	border-radius: 8px;
	height: calc(100% - 40px);
}

/* 스크롤 막대 */
.pa_table::-webkit-scrollbar-thumb {
	width: 4px;
	height: 60%;
	background-color: #A7B4D6;
	border-radius: 8px;
}

/* 스크롤 여백 */
.pa_table::-webkit-scrollbar-track {
	background-color: #DCE0E8;
	border-radius: 8px;
}

/* 스크롤 높이 */
.height200 {
    height: 130px;
}

/*주문이행*/
.m_pro>ul {
	display: grid;
	grid-template-columns: repeat(5,1fr);
	text-align: center;
	padding-top: 70px;
	max-width: 900px;
	margin: auto;
}

.m_pro>ul>li {
	position: relative;
}

.m_pro>ul>li::after {
	position: absolute;
	content: "";
	top: 20%;
	right: 0;
	background: url(../images/dashboard/next_icon.svg)no-repeat;
	width: 12px;
	height: 15px;
}

.m_pro>ul>li:last-child::after {
	content: none;
}

.m_pro>ul>li h3 {
	font-size: 5rem;
	font-family: 'Anton';
	font-weight: normal;
	color: #00AE42;
	padding-bottom: 10px;
}

.m_pro>ul>li>.m_protit {
	display: flex;
	align-items: center;
	justify-content: center;
}

.m_pro>ul>li>.m_protit img {
	width: 3rem;
	height: 3rem;
}

.m_pro>ul>li>.m_protit p {
	font-size: 2rem;
	padding-left: 8px;
	font-weight: 500;
}

/*주문이행-하단 바*/
.pro_bar {
	max-width: 900px;
	height: 18px;
	background: #EAEDF2;
	border: 1px solid #E7E7E7;
	margin: auto;
	border-radius: 50px;
	margin-top: 15px;
}

.pro_bar>ul {
	display: grid;
	grid-template-columns: repeat(5,1fr);
	text-align: center;
}

/*이상알림*/
.partner_con.notice {
	border: 1px solid #DE0E0E;
	box-shadow: 8px 4px 23.3px 0px rgba(222, 14, 14, 0.10);
}

.partner_con.notice>.con_tit>h3 {
	color: #DE0E0E;
}

.partner_con.notice>ul {
	display: grid;
	grid-template-columns: repeat(3,1fr);
	gap: 0;
	text-align: center;
	margin-top: 35px;
}

.partner_con.notice>ul .number {
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 15px;
}

.partner_con.notice>ul .number>p {
	font-size: 4rem;
	font-family: 'Anton';
	padding-left: 10px;
}

.partner_con.notice>ul>li {
	position: relative;
}

.partner_con.notice>ul>li::after {
	position: absolute;
	content: "";
	top: 0;
	right: 0;
	width: 1px;
	height: 100%;
	background: #c0c0c0;
}

.partner_con.notice>ul>li:last-child:after {
	content: none;
}

.partner_con.notice>ul>li>h3 {
	font-size: 2.5rem;
	font-weight: 800;
}

.partner_con.notice>ul>li:first-child {
	color: #DE0E0E;
}

.partner_con.notice>ul>li:nth-child(2) {
	color: #FF7A00;
}

.partner_con.notice>ul>li:last-child {
	color: #002F87;
}

/*이상알림(협력사)-표*/
.no_table {
	margin-top: 25px;
	border-top: 2px solid #b9b9b9;
	overflow-y: auto;
}

.no_table table {
	width: 100%;
}

.no_table .no_icon {
	margin-top: 5px;
}

.no_table img {
	width: 24px;
	height: 24px;
	vertical-align: middle;
}

.no_table tr td {
	padding: 10px;
	border-bottom: 1px solid #d8d8d8;
}

.no_table tr>.no_date {
	text-align: right;
	color: #979797;
	font-size: 1.7rem;
}

.no_table tr.on {
	background: rgba(222, 14, 14, 0.10);
}

/* 이상알림(협력사) 스크롤바 */
.no_table.scrollbar {
	border-radius: 0;
}

.no_table.scrollbar+.notice_table {
	margin-top: 30px;
}

.no_table table tr th,
.no_table table tr td {
	padding: 13px 15px;
}

/* 스크롤 바 전체 */
.no_table::-webkit-scrollbar {
	width: 10px;
	border-radius: 8px;
	height: calc(100% - 40px);
}

/* 스크롤 막대 */
.no_table::-webkit-scrollbar-thumb {
	width: 4px;
	height: 60%;
	background-color: #A7B4D6;
	border-radius: 8px;
}

/* 스크롤 여백 */
.no_table::-webkit-scrollbar-track {
	background-color: #DCE0E8;
	border-radius: 8px;
}

/*모바일 css*/

@media screen and (max-width: 2580px) {

	.con_flex {
		margin-top: 8px;
	}

	.contents .con_tit>h3 {
		font-size: 2rem;
	}

	.contents .con_tit>.cname {
		font-size: 1.8rem;
	}

	/*생산계획 접수(모기업)*/
	.plan {
		max-width: 600px;
	}
	.plan h3 {
		font-size: 2rem;
	}

	/*생산진행(협력사)*/
	.pa_table table tr th, .pa_table table tr td {
		padding: 8px 2px;
	}

	.pa_pro>ul>li>img {
		margin-bottom: 10px;
		width: 7rem;
		height: 7rem;
	}

	.pa_table tr td {
		width: 130px;
		font-size: 2rem;
	}

	.pa_table tr td:first-child {
		font-size: 1.7rem;
	}

	.pa_pro {
		padding: 25px 0px 0px 0px;
	}

	/*생산진행(협력사)*/
	.m_pro>ul>li h3 {
		font-size: 4rem;
	}

	.m_pro>ul>li>.m_protit p {
		font-size: 1.8rem;
	}

	.m_pro>ul {
		max-width: 650px;
    padding-top: 70px;
	}

	.pro_bar {
		max-width: 650px;
	}

	/*이상알림(협력사)*/
	.partner_con.notice>ul>li>h3 {
		font-size: 2.2rem;
	}

	.partner_con.notice>ul .number>p {
		font-size: 3.5rem;
	}

	.partner_con.notice>ul .number>img {
		width: 4rem;
		height: 4rem;
	}

	.no_table table tr th, .no_table table tr td {
		padding: 10px 15px;
	}

	.no_table tr>.no_date {
		font-size: 1.6rem;
	}
}

@media screen and (max-width: 1800px) {
	.view_con .tit {
		margin-right: 8px;
	}

	.view_flex .view_list {
		margin-left: 10px;
	}

	/*뷰 창*/
	.top_view>a {
		padding: 13px 25px;
	}

	/*조회하기*/
	.date {
		width: 210px;
	}

	.view_tit {
		width: 100px;
	}

	.view_list>button p {
		font-size: 1.7rem;
	}

	/*생산계획 접수(모기업)*/
	.plan {
		max-width: 550px;
	}

	.plan h3 {
		font-size: 1.8rem;
	}

	.progre {
		margin-top: 15px;
	}

	/*생산진행(협력사)*/
	.pa_table tr td:first-child {
		font-size: 1.5rem;
	}

	/*주문이행(모기업)*/
	.no_table table tr th, .no_table table tr td {
		font-size: 1.6rem;
	}

	/*이상알림(협력사)*/
	.no_table tr>.no_date {
		font-size: 1.5rem;
	}

	.partner_con.notice>ul>li>h3 {
		font-size: 2rem;
	}

	.partner_con.notice>ul .number>img {
		width: 3.5rem;
		height: 3.5rem;
	}
}

@media screen and (max-width: 2580px) {
	.view_con {
		padding-bottom: 0;
		margin-top: 0px;
	}
	
	.top_view {
		margin-top: 10px;
	}

	.company_con {
		padding: 10px;
	}

	.partner_con {
		padding: 10px;
	}

	.contents .con_tit {
		padding: 8px;
	}

	.plan .progre:first-child label {
		font-size: 2.1rem; 
	}

	.plan .progre:nth-child(2) label {
		font-size: 2.1rem;
	}

	.plan .progre:last-child label {
		font-size: 2.1rem;
	}

	/*주문이행(모기업)*/
	.m_pro>ul>li h3 {
		font-size: 3.2rem;
	}

	.m_pro>ul>li>.m_protit p {
		font-size: 1.7rem;
	}

	/*생산진행(협력사)*/
	.pa_pro>ul>li>p {
		font-size: 1.6rem;
	}

	.pa_table {
		margin-top: 20px;
	}

	/*이상알림(협력사)*/
	.partner_con.notice>ul>li>h3 {
		font-size: 1.8rem;
	}

	.partner_con.notice>ul .number {
		padding-top: 10px;
	}

	.partner_con.notice>ul .number>p {
		font-size: 3rem;
	}

	.no_table {
		margin-top: 20px;
	}
}

@media screen and (max-width: 1400px) {
	.con_flex {
		display: block;
	}

	.partner_con {
		margin-top: 15px;
	}

	select {
		background-image: none;
	}

	/*뷰 창*/
	.top_view>a {
		padding: 10px 20px;
	}

	.top_view>a.on>h4 {
		font-size: 1.6rem;
	}

	.top_view>a>h4 {
		font-size: 1.6rem;
	}

	.top_view>a>button {
		top: 7px;
	}

	/*조회기간*/
	.view_con .tit {
		/*font-size: 1.6rem;*/
	}

	.view_flex .view_list h3 {
		font-size: 1.6rem;
	}

	.field input[type="text"] {
		font-size: 1.5rem;
	}

	.company input[type="text"] {
		font-size: 1.5rem;
	}

	.partner input[type="text"] {
		font-size: 1.5rem;
	}

	.tsearch {
		margin-left: 10px;
		font-size: 1.6rem;
	}

	.sch_hour {
		margin-left: 5px;
	}

	.view_flex .view_list::before {
		content: none;
	}

	.view_flex .view_list {
		margin-left: 0;
	}

	.view_flex .view_list h3 {
		padding-left: 0;
	}

	.view_flex .view_list:last-child>h3 {
		padding-left: 5px;
	}

	.view_flex {
		margin-top: 10px;
	}

	/*생산계획 접수(모기업)*/
	.plan {
		max-width: 800px;
	}

	.plan .progre:first-child label {
		width: 13rem;
	}

	.plan .progre:nth-child(2) label {
		width: 13rem;
	}

	.plan .progre:last-child label {
		width: 13rem;
	}

	/*생산진행(협력사)*/
	.pa_pro>ul>li>img {
		width: 8rem;
		height: 8rem;
	}

	.pa_table tr td {
		width: 200px;
	}

	/*주문이행(모기업)*/
	.m_pro>ul {
		padding-top: 50px;
		max-width: 800px;
	}

	.pro_bar {
		max-width: 800px;
	}

	.m_pro {
		padding-bottom: 50px;
	}
}

@media screen and (max-width: 1000px) {
	.top_tit h3 {
		font-size: 1.8rem;
	}

	.tsearch {
		width: 90px;
	}
}

/* ==================================================
	대시보드 조회
================================================== */
    /*탑 메뉴*/
    div.dark_mode .mode a>p::before {background: #3e3e3e;}
    /*레프트 메뉴*/
    div.dark_mode .lgnb {background: #002F87;}
    div.dark_mode .llist li p.hr_class {font-weight: 800;color: #fff;}
	div.dark_mode #CATE_TEXT {color: #fff !important;}

	div.dark_mode .lmenu_list>button.on {background:#fff; }

    /*하단 메뉴*/
    div.dark_mode .view {border-bottom: 1px solid #ffffff56;    }
    div.dark_mode .ltit>h3 {color: #fff;}
    div.dark_mode .lmenu_list>button.on h3 {color: #002F87;}
    div.dark_mode .view>h3 {color: #fff;}
    div.dark_mode .llist::before {background: #d6d6d643;}
    div.dark_mode .llist:first-child::before {background: #d6d6d643;}
    div.dark_mode .llist li p::before {background: #d6d6d643;}
    div.dark_mode .llist li p {color: #ffffffbc;}
    div.dark_mode .llist a>li:hover {   background: rgba(255, 255, 255, 0.15);}
    div.dark_mode .llist a>li:hover p {color: #fff;font-weight: 500;}
    div.dark_mode .llist li.on {background: rgba(255, 255, 255, 0.15);}
    div.dark_mode .llist li.on p {color: #fff;font-weight: 500;}
    div.dark_mode .llist li.on p::before {background: #ffffff;}
    div.dark_mode .llist li:hover>p {color:#002F87;}
    div.dark_mode .llist li p.hr_class {color:#fff;}
    div.dark_mode .llist li.on #add_tab {color:#fff;}
    div.dark_mode .llist li.on:hover #add_tab {color:#fff;}

    /*하단 로고*/
 div.dark_mode .hyundai_logo {background: url(/h_design/images/common/hyundai_logo_wh.svg) no-repeat;}
div.dark_mode .hyundai_logo::before {border-top: 1px solid #ffffff48;}






