@charset "utf-8";
/*
	Copyright(c) 2018 Onlinepowers
	http://www.onlinepowers.com
*/

/* ============================ all ============================ */
.main_wrap .inner {
	margin: auto;
}

.main_wrap #header .inner,
.main_wrap #footer .inner {
	padding-left: 0;
	width: 1000px;
}

.contents {
	padding: 30px 0 80px;
}
.contents:after {
	display: block;
	content: '';
	clear: both;
}

.main_wrap #footer {
	border: 0;
}
.main_wrap #footer .inner {
	border-top: 1px solid #e6e6e6;
}

/* --- conts_left ---*/
.conts_left {
	float: left;
	width: 210px;
}
/* tit_area */
.conts_left .tit_area {
	padding: 28px 18px 20px;
	border: 1px solid #e6e6e6;
}
/* bidding_area */
.conts_left .bidding_area {
	margin-top: 7px;
	padding-top: 13px;
	height: 60px;
	text-align: center;
	background: #a6b6c6;
}
.conts_left .bidding_area .tit {
	font-size: 13px;
	/* font-weight: 500; */
	font-weight: 200;
	color: #fff;
}
.conts_left .bidding_area .time_area {
	margin-top: 5px;
}
.conts_left .bidding_area .time_area span {
	font-size: 14px;
	font-weight: 700;
	font-family: 'Roboto';
	letter-spacing: 0;
	color: #fff;
}


/* --- conts_right ---*/
.conts_right {
	float: right;
	width: 770px;
}





/* -------- tab_wrap02 -------- */
.tab_wrap02 {
	position: relative;
	display: inline-block;
	vertical-align: top;
}
/* --- tab_tit ---*/
.tab_wrap02 .tab_tit {
	padding-bottom: 12px;
	font-size: 0;
	border-bottom: 1px solid #e7e7e7;
}
.tab_wrap02 .tab_tit .tit {
	display: inline-block;
	padding: 0 13px;
	font-size: 15px;
	font-weight: 400;
	color: #737373;
	vertical-align: middle;
	background: url(../../../statics/images/opro/keri/tab_bor02.jpg) no-repeat 0 center;
}
.tab_wrap02 .tab_tit .tit:first-child {
	padding-left: 0;
	background: 0;
}
 .tab_wrap02 .tab_tit .tit a {
	display: block;
 }
/* tab_tit event */
.tab_wrap02 .tab_tit .tit.on,
.tab_wrap02 .tab_tit .tit.on a,
.tab_wrap02 .tab_tit .tit a:focus,
.tab_wrap02 .tab_tit .tit a:active {
	/* font-weight: 500; */
	font-weight: bold;
	color: #121619;
}

/* --- tab_conts ---*/
.tab_wrap02 .tab_conts {
	margin-top: 10px;
	height: 100px;
}
.tab_wrap02 .tab_conts .conts_area {
	display: none;
}
.tab_wrap02 .tab_conts .tab_conts li:after {
	display: block;
	content: '';
	clear: both;
}
.tab_wrap02 .tab_conts li a {
	float: left;
	width: 100%;
	font-size: 13px;
	line-height: 25px;
	font-weight: 200;
	color: #666;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.tab_wrap02 .tab_conts li .date {
	float: right;
	font-size: 13px;
	line-height: 25px;
	font-family: 'Roboto';
	letter-spacing: 0;
	color: #737373;
}
.tab_wrap02 .tab_conts .btn_more {
	position: absolute;
	top: 0;
	right: 0;
	width: 17px;
	height: 17px;
	font-size: 0;
	background: url(../../../statics/images/opro/keri/tab_close.jpg) no-repeat;
}

/* typeA */
.tab_wrap02 .tab_conts.typeA li a {
	width: 70%;
}




/* -------- link_wrap01 -------- */
.link_wrap01 {
	display: inline-block;
	vertical-align: top;
}
.link_wrap01 ul {
	margin-bottom: 3px;
	font-size: 0;
	background: #f3f3f3;
}
.link_wrap01 ul:last-child {
	margin: 0;
}
.link_wrap01 li {
	display: inline-block;
	/* width: 85px; */
	/* width: 95px; */
	width: 109px;
	text-align: center;
	vertical-align: top;
}
.link_wrap01 li a {
	display: block;
	height: 76px;
}
.link_wrap01 .conts {
	display: block;
	font-size: 12px;
	line-height: 14px;
	letter-spacing: -0.6px;
	color: #858585;
	/*font-weight: 200;*/
}



/* -------- sum_wrap01 -------- */
.sum_wrap01 {
	border: 2px solid #4f81ab;
}

/* --- sum_header ---*/
.sum_wrap01 .sum_header {
	padding: 13px 0 15px;
	text-align: center;
	background: #edf2f6;
}
.sum_wrap01 .sum_header .tit {
	font-size: 20px;
	/* font-weight: 500; */
	color: #164e7c;
}

/* --- sum_container ---*/
.sum_wrap01 .sum_container {
	padding: 30px 23px;
}
.sum_wrap01 .sum_container .conts_wrap {
	margin-bottom: 30px;
	font-size: 0;
}
.sum_wrap01 .sum_container .conts_wrap:last-child {
	margin: 0;
}

/* conts_area */
.sum_wrap01 .sum_container .conts_area {
	display: inline-block;
	margin-right: 20px;
	vertical-align: top;
}
.sum_wrap01 .sum_container .conts_area:last-child {
	margin: 0;
}
.sum_wrap01 .sum_container .conts_area dd {
	margin-top: 10px;
	margin-bottom: 10px;
	border: 1px solid #e3e3e3;
}
.sum_wrap01 .sum_container .conts_area tr {
	border-bottom: 1px solid #eaeaea;
}
.sum_wrap01 .sum_container .conts_area tr:last-child {
	border-bottom: 0;
}
.sum_wrap01 .sum_container .conts_area th,
.sum_wrap01 .sum_container .conts_area td {
	height: 32px;
	font-size: 13px;
	letter-spacing: -0.25px;
}
.sum_wrap01 .sum_container .conts_area th {
	padding-left: 10px;
	text-align: left;
	background: #fcfcfc;
}
.sum_wrap01 .sum_container .conts_area td {
	padding-left: 18px;
	font-weight: 200;
	color: #888;
}
.sum_wrap01 .sum_container .conts_area tbody td:last-child {
	border-right: 0;
}
.sum_wrap01 .sum_container .conts_area .num {
	color: #888;
}
.sum_wrap01 .sum_container .conts_area .num span {
	margin-right: 5px;
	font-weight: 500;
	color: #fa970d
}
/* cots_area event */
.sum_wrap01 .sum_container .conts_area .num:hover span,
.sum_wrap01 .sum_container .conts_area .num:focus span,
.sum_wrap01 .sum_container .conts_area .num:active span {
	text-decoration: underline;
}


/* typeA */
.sum_wrap01.typeA .sum_container .conts_area {
	width: 350px;
}
.sum_wrap01.typeA .sum_container .conts_area dt {
	font-size: 14px;
	/* font-weight: 500; */
	font-weight: 200;
	letter-spacing: -0.45px;
	color: #515151;
}
.sum_wrap01.typeA .sum_container .conts_area th {
	font-weight: 200;
	color: #555;
	border-right: 1px solid #f3f3f3;
}
.sum_wrap01.typeA .sum_container .conts_area td {
	border-right: 1px solid #eaeaea;
}

/* typeB */
.sum_wrap01.typeB .sum_container .conts_area dt {
	font-size: 15px;
	font-weight: 600;
	letter-spacing: -0.45px;
	color: #3e719c;
}
.sum_wrap01.typeB .sum_container .conts_area .tit {
	padding-top: 10px;
	font-weight: 400;
	color: #666;
	vertical-align: top;
	border-right: 1px solid #f3f3f3;
}
.sum_wrap01.typeB .sum_container .conts_area .sub_tit {
	font-weight: 200;
	color: #808080;
	border-right: 1px solid #f3f3f3;
	background: #fcfcfc;
}






/* ============================ 기본메인 ============================ */
/* -------- section1 -------- */
.main01_wrap .section1 {
	position: relative;
	height: 420px;
	background: #223044 url(../../../statics/images/opro/keri//main_visual01.jpg) no-repeat center top;
}

/* --- conts_wrap01 ---*/
.main01_wrap .conts_wrap01 {
	/* padding-top: 44px; */
	padding-top: 9px;
}
.main01_wrap .conts_wrap01:after {
	display: block;
	content: '';
	clear: both;
}
/* txt_area */
.main01_wrap .conts_wrap01 .txt_area {
	float: left;
	margin-top: 50px;
}
.main01_wrap .conts_wrap01 .txt_area .tit {
	font-size: 36px;
	font-weight: 400;
	color: #fff;
}
.main01_wrap .conts_wrap01 .txt_area .tit span {
	margin-top: 10px;
	display: block;
	font-size: 41px;
	font-weight: 900;
	letter-spacing: -0.3px;
}
.main01_wrap .conts_wrap01 .txt_area .conts {
	margin-top: 12px;
	font-size: 14px;
	font-family: 'Roboto';
	letter-spacing: 0;
	color: #9e9e9e;
	opacity: 0.8;
}


/* calendar_area */
.main01_wrap .conts_wrap01 .calendar_area {
	float: right;
}
.main01_wrap .calendar_area {
	width: 255px;
	padding: 18px 5px 5px;
	text-align: center;
	background:  #fff;
}
.main01_wrap .calendar_area .tit_area {
	padding-bottom: 18px;
	border-bottom: 1px solid #eee;
}
.main01_wrap .calendar_area .tit {
	font-size: 18px;
	/* font-weight: 500; */
	font-weight: bold;
	letter-spacing: -0.75px;
	color: #666;
}
.main01_wrap .calendar_area .cal_control {
	margin-top: 12px;
}
.main01_wrap .calendar_area .cal_control .arrow,
.main01_wrap .calendar_area .cal_control .date {
	display: inline-block;
	vertical-align: middle;
}
.main01_wrap .calendar_area .cal_control .date {
	margin: 0 14px;
	font-size: 18px;
	font-weight: 500;
	font-family: 'Roboto';
	letter-spacing: -0.75px;
	color: #333;
}

.main01_wrap .calendar_area .conts_area th,
.main01_wrap .calendar_area .conts_area td {
	font-size: 12px;
	font-family: 'Roboto';
	letter-spacing: 0;
	color: #333;
}
.main01_wrap .calendar_area .conts_area th {
	padding: 17px 0 8px;
	font-weight: 700;
}
.main01_wrap .calendar_area .conts_area td {
	height: 35px;
}
.main01_wrap .calendar_area .conts_area td:first-child {
	color: #c63d3d;
}
.main01_wrap .calendar_area .conts_area .on {
	background: #e7ecf1;
}


/* --- conts_wrap02 ---*/
.main01_wrap .conts_wrap02:after {
	display: block;
	content: '';
	clear: both;
}
/* login_area */
.main01_wrap .login_area {
	float: left;
	margin-right: 1px;
	padding: 20px 0 19px 68px;
	width: 744px;
	height: 74px;
	background: #a6b6c6;
}
.main01_wrap .login_area input {
	width: 320px;
	height: 34px;
	font-size: 12px;
	border: 0;
}
.main01_wrap .login_area .btn_wrap {
	display: inline-block;
	margin-left: 30px;
}

/* bidding_area */
.main01_wrap .bidding_area {
	float: left;
	width: 255px;
	padding-top: 18px;
	height: 74px;
	text-align: center;
	background: #93a5b8;
}
.main01_wrap .bidding_area .tit {
	font-size: 14px;
	/* font-weight: 500; */
	font-weight: 200;
	color: #fff;
}
.main01_wrap .bidding_area .time_area {
	margin-top: 7px;
}
.main01_wrap .bidding_area .time_area span {
	display: inline-block;
	font-size: 18px;
	font-weight: 700;
	font-family: 'Roboto';
	letter-spacing: 0;
	color: #fff;
}
.main01_wrap .bidding_area .time {
	margin-left: 5px;
}



/* -------- section2 -------- */
.main01_wrap .section2 {
	padding-top: 30px;
}

/* --- tab_wrap01 ---*/
/* tab_tit */
.tab_wrap01 .tab_tit:after {
	display: block;
	content: '';
	clear: both;
}
.tab_wrap01 .tab_tit li {
	float: left;
	/* width: 14.28%; */
	width: 25%;
}
.tab_wrap01 .tab_tit a {
	display: block;
	height: 42px;
	font-size: 14px;
	line-height: 40px;
	/* font-weight: 500; */
	font-weight: 200;
	color: #777;
	text-align: center;
	border-left: 1px solid #e1e1e1;
	border-bottom: 2px solid #4f81ab;
	background: #f7f7f7;
}
.tab_wrap01 .tab_tit li:first-child a {
	border-left: 0;
}
/* tab_tit event */
.tab_wrap01 .tab_tit li a.on,
.tab_wrap01 .tab_tit li a:focus,
.tab_wrap01 .tab_tit li a:active {
	font-size: 15px;
	line-height: 38px;
	color: #006199;
	border: 2px solid #4f81ab;
	border-bottom-color: #fff;
	background: #fff;
	font-weight: 200;
}

/* tab_conts */
.tab_wrap01 .tab_conts {
	margin-top: -2px;
	position: relative;
	padding: 20px 46px 11px 42px;
	height: 253px;
	border: 2px solid #4f81ab;
	border-top: 0;
}
.tab_wrap01 .tab_conts .sub_tab_tit:after {
	display: block;
	content: '';
	clear: both;
}
.tab_wrap01 .tab_conts .sub_tab_tit li {
	float: left;
}
.tab_wrap01 .tab_conts .sub_tab_tit a {
	display: block;
	padding: 0 12px;
	font-size: 13px;
	letter-spacing: -0.45px;
	color: #737373;
	background: url(/statics/images/opro/login/tab_bor.jpg) no-repeat 0 center;
}
.tab_wrap01 .tab_conts .sub_tab_tit li:first-child a {
	/* padding-left: 0;
	background: none; */
}

.tab_wrap01 .tab_conts .sub_tab_conts {
	margin-top: 10px;
}

.tab_wrap01 .tab_conts .sub_tab_conts table {
	border-collapse: collapse;
}

.tab_wrap01 .tab_conts .conts_area {
	/* display: none; */
}
.tab_wrap01 .tab_conts .conts_area tr {
	border-bottom: 1px dashed #eaeaea;
}
.tab_wrap01 .tab_conts .conts_area tr:last-child {
	border: 0;
}
.tab_wrap01 .tab_conts .conts_area td,
.tab_wrap01 .tab_conts .conts_area td a {
	height: 32px;
	font-size: 13px;
	color: #737373;
}
.tab_wrap01 .tab_conts .conts_area .conts01 {
	padding-left: 4px;
	letter-spacing: -0.25px;
	font-family: 'Roboto';
	color: #555;
}
.tab_wrap01 .tab_conts .conts_area .link a {
	display: block;
	width: 100%;
	line-height: 30px;
	letter-spacing: -0.25px;
	color: #555;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.tab_wrap01 .tab_conts .conts_area .conts03 {
	letter-spacing: 0;
	font-family: 'Roboto';
	text-align: center;
}
.tab_wrap01 .tab_conts .conts_area .conts03 .time {
	margin-left: 6px;
}
.tab_wrap01 .tab_conts .conts_area .conts04 {
	font-weight: 300;
	text-align: right;
}

/* tab_conts event */
.tab_wrap01 .tab_conts .sub_tab_tit a.on,
.tab_wrap01 .tab_conts .sub_tab_tit a:focus,
.tab_wrap01 .tab_conts .sub_tab_tit a:active {
	/* font-weight: 500; */
	font-weight: 200;
	color: #333;
}



/* -------- section3 -------- */
.main01_wrap .section3 {
	padding: 20px 0 30px;
	font-size: 0;
}

/* --- tab_wrap02 ---*/
.main01_wrap .tab_wrap02 {
	margin: 12px 42px 0 0;
	width: 260px;
}

/* --- link_wrap01 ---*/
.main01_wrap .link_wrap01 li {
	/* width: 79px; */
	width: 99px;
}





/* ============================ 로그인후 메인 ============================ */
/* -------- conts_left -------- */
.main02_wrap .conts_left .tit_area .tit {
	padding-left: 17px;
	font-size: 15px;
	/* font-weight: 500; */
	font-weight: 200;
	color: #555;
	background: url(../../../statics/images/opro/keri/tit_icon01.png) no-repeat 0 1px;
}
.main02_wrap .conts_left .tit_area .btn_wrap {
	margin-top: 13px;
}


/* -------- conts_right -------- */
/* --- link_wrap ---*/
.main02_wrap .link_wrap {
	margin-top: 30px;
}
.main02_wrap .link_wrap .link_area {
	font-size: 0;
}
/* tab_wrap02 */
.main02_wrap .tab_wrap02 {
	margin-right: 44px;
	width: 363px;
}
.main02_wrap .tab_wrap02:last-child {
	margin: 0;
}

/* link_wrap01 */
.main02_wrap .link_wrap01 {
	margin-top: 23px;
}



/* ============================ 구매담당자로그인 메인 ============================ */
/* -------- sum_wrap01 -------- */
.main03_wrap .sum_wrap01 .should {
	width: 216px;
}
.main03_wrap .sum_wrap01 .proceeding {
	width: 680px;
	font-size: 0;
}
.main03_wrap .sum_wrap01 .proceeding dd {
	display: inline-block;
	margin-right: 4px;
	width: 338px;
}
.main03_wrap .sum_wrap01 .proceeding dd:last-child {
	margin: 0;
}
.main03_wrap .sum_wrap01 .proceeding dd:last-child tr:first-child {
	border-bottom: 0;
}


/* -------- conts_wrap -------- */
.main03_wrap .contents .conts_wrap {
	margin-top: 30px;
	font-size: 0;
}
.main03_wrap .conts_wrap .link_wrap,
.main03_wrap .conts_wrap .calendar_wrap {
	display: inline-block;
	vertical-align: top;
}

/* --- link_wrap ---*/
.main03_wrap .conts_wrap .link_wrap {
	margin-right: 23px;
}
.main03_wrap .conts_wrap .tab_wrap02 {
	margin-right: 39px;
	width: 363px;
}
.main03_wrap .conts_wrap .tab_wrap02:last-child {
	margin: 0;
}
.main03_wrap .conts_wrap .link_wrap01 {
	margin-top: 23px;
}


/* --- calendar_wrap ---*/
.main03_wrap .calendar_wrap {
	width: 212px;
}
/* cal_header */
.main03_wrap .calendar_wrap .cal_header:after {
	display: block;
	content: '';
	clear: both;
}
.main03_wrap .calendar_wrap .tit {
	float: left;
	font-size: 15px;
	font-weight: 500;
	color: #1a1a1a;
}
.main03_wrap .calendar_wrap .cal_control {
	float: right;
	margin-top: 5px;
}
.main03_wrap .calendar_wrap .cal_control a,
.main03_wrap .calendar_wrap .cal_control .date {
	display: inline-block;
	vertical-align: middle;
}
.main03_wrap .calendar_wrap .cal_control .date {
	margin: 0 7px;
	font-size: 12px;
	font-weight: 500;
	font-family: 'Roboto';
	color: #666;
}
/* cal_container */
.main03_wrap .calendar_wrap .cal_container {
	margin-top: 9px;
	border: 1px solid #a9b6c5;
}
.main03_wrap .calendar_wrap thead tr {
	border-bottom: 1px solid #d4d8dc;
}
.main03_wrap .calendar_wrap th,
.main03_wrap .calendar_wrap td {
	font-family: 'Roboto';
	letter-spacing: 0;
	color: #333;
}
.main03_wrap .calendar_wrap th {
	height: 28px;
	font-size: 10px;
	font-weight: 700;
}
.main03_wrap .calendar_wrap tbody tr {
	border-bottom: 1px solid #f3f3f3;
}
.main03_wrap .calendar_wrap tbody tr:last-child {
	border: 0;
}
.main03_wrap .calendar_wrap td {
	position: relative;
	padding-top: 5px;
	height: 25px;
	font-size: 9px;
	font-weight: 500;
	text-align: center;
	vertical-align: top;
}
.main03_wrap .calendar_wrap td.on {
	background: #e7ecf1;
}
.main03_wrap .cal_icon_area {
	position: absolute;
	left: 0;
	bottom: 2px;
	width: 100%;
	text-align:  center;
}
.main03_wrap .cal_icon_area span {
	display: inline-block;
	width: 5px;
	height: 5px;
}
.main03_wrap .cal_icon_area .cal_icon01 {
	background: url(../../../statics/images/opro/keri/cal_icon01.jpg) no-repeat;
}
.main03_wrap .cal_icon_area .cal_icon02 {
	background: url(../../../statics/images/opro/keri/cal_icon02.jpg) no-repeat;
}
.main03_wrap .cal_icon_area .cal_icon03 {
	background: url(../../../statics/images/opro/keri/cal_icon03.jpg) no-repeat;
}
.main03_wrap .cal_icon_area .cal_icon04 {
	background: url(../../../statics/images/opro/keri/cal_icon04.jpg) no-repeat;
}
.main03_wrap .cal_icon_area .cal_icon05 {
	background: url(../../../statics/images/opro/keri/cal_icon05.jpg) no-repeat;
}
.main03_wrap .cal_icon_area .cal_icon06 {
	background: url(../../../statics/images/opro/keri/cal_icon06.jpg) no-repeat;
}
/* cal_footer */
.main03_wrap .calendar_wrap .cal_footer {
	padding: 10px 0 0 25px;
	border: 1px solid #a5b3c3;
	border-top: 0;
}
.main03_wrap .calendar_wrap .cal_footer ul:after {
	display: block;
	content: '';
	clear: both;
}
.main03_wrap .calendar_wrap .cal_footer li {
	float: left;
	margin-bottom: 10px;
	width: 58px;
	font-size: 11px;
	font-weight: 300;
	color: #858585;
}
.main03_wrap .calendar_wrap .cal_footer li img {
	margin: 0 4px 2px 0;
}



.screen_out {overflow:hidden; position:absolute; width:0; height:0; line-height:0; text-indent:-9999px; } /* 대체텍스트가 아닌 접근성을 위한 숨김텍스트를 제공할때 */