@charset "utf-8";
/* 폰트 설정 */

/* Reset */
html,
body {
	width: 100%;
	height: 100%;
	font-family: 'Nanum', 'NanumB', '굴림';
	color: #5c6167;
	font-size: 14px;
	-webkit-text-size-adjust: none;
}

html {
	overflow-y: scroll
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
form,
fieldset,
p,
button {
	margin: 0;
	padding: 0
}

body,
h1,
h2,
h3,
h4,
input,
button {}

body {
	background: #f0f0f0;
	text-align: center;
	*word-break: break-all;
	-ms-word-break: break-all
}

img,
fieldset,
iframe {
	border: 0 none
}

li {
	list-style: none;
	margin: 0;
}

input,
select,
button {
	vertical-align: middle
}

img {
	vertical-align: top
}

i,
em,
address {
	font-style: normal
}

label,
button {
	cursor: pointer
}

button {
	margin: 0;
	padding: 0
}

a {
	color: #36363b;
	text-decoration: none;
}

a:hover {
	color: #e42635;
	text-decoration: underline;
}

input {
	font-family: 'Nanum';
	font-size: 14px;
}

input.txt_type {
	width: auto;
	height: 24px;
	margin: -1px 0;
	border: 1px solid #dfdfdf;
	padding: 5px 8px 0 8px;
	background-color: #f8f8f8;
	color: #5c6167;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	border-radius: 3px
}

html>

/**/
body input.txt_type {
	margin: 0
}

input.cbr_type {
	position: static !important;
	position: relative;
	margin: -2px 2px 1px 0;
	*margin: 0 4px 1px 0;
	width: 13px;
	height: 13px;
	cursor: pointer
}

input.file_type {
	font-family: 'Nanum', 'Tahoma', 'Geneva', '돋움', 'dotum', 'AppleGothic', sans-serif;
	margin: -1px 0;
	width: auto;
	height: 20px;
	border: 1px solid #ddd;
	padding: 5px 8px 0 8px;
	color: #555;
}

input[type=radio],
input[type=checkbox] {
	vertical-align: middle;
	position: relative;
}

input[type=radio]+label,
input[type=checkbox]+label {
	vertical-align: middle;
	position: relative;
	/*bottom:-4px*/
}

button {
	border: 0;
	width: auto;
	height: auto;
	vertical-align: middle;
	background-color: transparent;
	background-repeat: no-repeat;
	cursor: pointer
}

select {
	width: auto;
	height: 24px;
	vertical-align: middle;
	color: #555;
	font-size: 12px
}

optgroup {
	background-color: #fff;
	color: #555;
	font-weight: bold
}

option {
	display: block !important;
	padding-right: 6px;
	color: #555
}

hr {
	display: none
}

legend {
	/* *width: 0 */
	width: 0
}

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

caption {
	font-weight: bold;
	display: none
}

/* New Elements Type Selector */
section,
nav,
article,
aside,
hgroup,
header,
footer {
	display: block
}

/* Common */
.blind,
legend {
	display: block;
	overflow: hidden;
	position: absolute;
	top: -1000em;
	left: 0
}

:root legend {
	margin-top: -1px;
	font-size: 0;
	line-height: 0
}

.ellipsis {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis
}

.show {
	display: block !important
}

.hide {
	display: none
}

.Nbold {
	font-weight: bold;
}

.clear {
	clear: both
}

.txa_c {
	text-align: center
}

.txa_r {
	text-align: right
}

.txa_l {
	text-align: left
}

/* layout */
#wrap {
	width: 100%;
	min-width: 1150px;
}

#header_Rd {
	position: relative;
	z-index: 10;
	height: 83px;
	width: 100%;
	border-bottom: #f11818 3px solid;
	background: #FFF;
}

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

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

#header_Rd ul.GnbLi li ul li a:hover {
	text-decoration: none;
	background: #f32c2c;
	color: #FFF;
}

.TGNB {
	width: 100%;
	height: 86px;
	display: block;
}

.gnb {
	position: relative;
	width: 1127px;
	margin: 0 auto;
	height: 86px;
	font-weight: bold;
}

.gnb h1.logo {
	position: relative;
	padding: 15px 0px 24px 0;
	float: left;
}

.gnb ul {
	position: relative;
	float: right;
}

.gnb li {
	float: left;
}

.gnb li.topmu {
	position: relative;
  width: 141px;
  padding: 30px 32px 0 32px;
	float: left;
	font-size: 22px;
	font-weight: bold;
  letter-spacing: -1px;
  box-sizing: border-box;
  white-space: nowrap;
}

.gnb li a {
	color: #2e2e32;
}

.gnb li.smu a {
	position: relative;
	padding: 31px 17px 0 17px;
	float: left;
	font-size: 16px;
	color: #4b4c51;
	background: #FFF;
	font-weight: bold;
	letter-spacing: -1px
}

/* gnb 전체메뉴 */
.gnbMenuDown {
	width: 100%;
	background: #fff;
	border-bottom: 1px solid #d5d5d5;
	z-index: 3;
	position: relative;
	display: none;
}

.GnbLi {
	position: relative;
	width: 1127px;
	height: 170px;
	margin: 0px auto;
	overflow: hidden;
	background: #fff;
	padding: 30px 0 30px 0;
	z-index: 100;
	font-size: 14px;
}

.GnbLi .subimage {
	float: left;
	width: 290px;
	height: auto;
	text-align: left;
	padding-right: 130px
}

.GnbLi > li {
	width: 142px;
  float: left;
  text-align: center;
}

.GnbLi > li + li {
  border-left: 1px solid #ccc;
}

.GnbLi > li:last-child {
  border-right: 1px solid #ccc;
}

.GnbLi li ul {
  display: inline-block;
	width: auto;
	height: 170px;
}

.GnbLi li span.title {
	text-align: left;
	margin: 0 10px 10px 18px;
	font-size: 18px;
	font-weight: bold;
	display: block;
}

.GnbLi li ul li {
  float: none;
  width: auto;
  margin: 0px 0;
  text-align: left;
}

.GnbLi li ul li a {
	text-decoration: none;
	color: #5c6167;
	margin: 1px 0;
	display: block;
  height: 17px;
  padding: 5px;
}

#container {
	min-height: 100%;
	width: 100%;
}

/* visual */
.area_visual {
	position: relative;
	background: #fff;
	overflow: hidden;
	width: 100%;
	height: 548px;
	border-bottom: 1px solid #c7cbd0;
}

.area_visual .ul_visual li {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 548px;
}

.area_visual .ul_visual li.li {
	display: block;
}

.area_visual .ul_visual li.li1 {
	background: url("../../assets/images/main/main_visual01.jpg");
	-ms-behavior: url("../../assets/css/backgroundsize.min.htc");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.area_visual .ul_visual li.li2 {
	background: url("../../assets/images/main/main_visual02.jpg");
	-ms-behavior: url("../../assets/css/backgroundsize.min.htc");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.area_visual .ul_visual li.li3 {
	background: url("../../assets/images/main/main_visual03.jpg");
	-ms-behavior: url("../../assets/css/backgroundsize.min.htc");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.area_visual .ul_visual li.li4 {
	background: url("../../assets/images/main/main_visual04.jpg");
	-ms-behavior: url("../../assets/css/backgroundsize.min.htc");
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.area_visual .ul_visual li p {
	display: none;
	position: absolute;
	left: 50%;
	opacity: 0;
	color: #333;
}

.area_visual .ul_visual li p.img_opa {
	opacity: 1;
}

.area_visual .ul_visual li .txt_1 {
	font-size: 36px;
	line-height: 1.25;
	font-weight: bold;
	color: #595a5b;
	text-align: left;
	font-family: 'Nanum', '굴림';
}

.area_visual .ul_visual li .txt_2 {
	font-size: 20px;
	line-height: 26px;
	font-weight: bold;
	color: #595a5b;
	text-align: left;
	font-family: 'Nanum', '굴림';
}

.area_visual .ul_visual li.li1 .txt_1 {
	top: 10%;
	margin-left: -520px;
}

.area_visual .ul_visual li.li1 .txt_2 {
	top: 35%;
	margin-left: -520px;
}

.area_visual .ul_visual li.li2 .txt_1 {
	top: 15%;
	margin-left: -520px;
	color: #fff;
}

.area_visual .ul_visual li.li2 .txt_2 {
	top: 33%;
	margin-left: -520px;
	color: #fff;
}

.area_visual .ul_visual li.li3 .txt_1 {
	top: 10%;
	margin-left: -520px;
	color: #FFF;
}

.area_visual .ul_visual li.li3 .txt_2 {
	top: 35%;
	margin-left: -520px;
	color: #FFF;
}

.area_visual .ul_visual li.li4 .txt_1 {
	top: 13%;
	margin-left: 100px;
}

.area_visual .ul_visual li.li4 .txt_2 {
	top: 30%;
	margin-left: 105px;
}

.area_visual .ul_arrow a,
.area_visual .ul_play li a,
.ul_pos li a,
.ul_pos li span {
	background: url("../../assets/images/main/sp_main.png") no-repeat;
}

.area_visual .ul_arrow a {
	position: absolute;
	top: 40%;
	left: 50%;
	width: 27px;
	margin-top: -27px;
	padding-top: 54px;
}

.area_visual .ul_arrow .li_prev a {
	margin-left: -610px;
	background-position: 0 -40px;
}

.area_visual .ul_arrow .li_next a {
	margin-left: 580px;
	background-position: -50px -40px;
}

.area_visual .ul_play,
.area_visual .ul_pos {
	position: absolute;
	bottom: 23%;
	left: 50%;
}

.area_visual .ul_play li {
	position: absolute;
	bottom: 0;
	left: 0;
}

.area_visual .ul_play li a {
	display: none;
	width: 16px;
	padding-top: 17px;
}

.area_visual .ul_play li.on a {
	display: block;
}

.area_visual .ul_play li.li_start a {
	background-position: -60px -120px;
}

.area_visual .ul_play li.li_stop a {
	background-position: -40px -120px;
}

.ul_pos li {
	float: left;
	width: 16px;
	margin: 0 1px;
}

.ul_pos li a,
.ul_pos li span {
	display: block;
	padding-top: 17px;
	background-position: 0 -120px;
}

.ul_pos li.on a,
.ul_pos li.on span {
	background-position: -20px -120px;
}



#contents_area {
	position: absolute;
	top: 0;
	margin: 510px auto 0;
	width: 100%;
	text-align: center;
	z-index: 100;
	padding-bottom: 50px;
}

/*사업영역*/
#contents_area ul#service {
	position: relative;
	margin: 38px auto 0;
	width: 1150px;
	height: 266px;
}

/* 20230829 */
ul#service li {
  float: left;
  width: 20%;
  height: 266px;
}
ul#service a {
	cursor: pointer;
  position: relative;
	float: left;
  display: block;
  width: 100%;
	height: 266px;
}
ul#service a:hover {
	height: 340px;
}
ul#service span {
	display: block;
	float: left;
	width: 100%;
	height: 100%;
}
ul#service span.it {
	background: url("../../assets/images/main/service_img01.jpg") no-repeat bottom center;
}
ul#service a:hover span.it {
	background-image: url("../../assets/images/main/service_img01_over.jpg");
}
ul#service span.ibm {
	background: url("../../assets/images/main/service_img02.jpg") no-repeat bottom center;
}
ul#service a:hover span.ibm {
	background-image: url("../../assets/images/main/service_img02_over.jpg");
}
ul#service span.lenovo {
	background: url("../../assets/images/main/service_img03.jpg") no-repeat bottom center;
}
ul#service a:hover span.lenovo {
	background-image: url("../../assets/images/main/service_img03_over.jpg");
}
ul#service span.solution {
	background: url("../../assets/images/main/service_img04.jpg") no-repeat bottom center;
}
ul#service a:hover span.solution {
	background-image: url("../../assets/images/main/service_img04_over.jpg");
}
ul#service span.consulting {
	background: url("../../assets/images/main/service_img05.jpg") no-repeat bottom center;
}
ul#service a:hover span.consulting {
	background-image: url("../../assets/images/main/service_img05_over.jpg");
}
/* //20230829 */

#contents_area #serviceArea2 {
	position: relative;
	margin: 0 auto;
	width: 1150px;
}

#contents_area #serviceArea2::after {
	content: '';
	display: block;
	clear: both;
}

/*보도자료*/
.press {
	float: left;
	padding: 30px;
	width: 575px;
	height: 202px;
	background: #dbe1e1;
	color: #2e3740;
	box-sizing: border-box;
}

.press h2.Title {
	float: left;
	font-size: 22px;
	font-weight: bold;
	padding-bottom: 13px;
	text-align: left;
	width: 490px;
}

.press .more {
	float: right;
}

.press dl {
	width: 514px;
	text-align: left;
	clear: both;
}

.press dt.photo {
	float: left;
	width: 148px;
	height: 100px;
	margin-right: 19px;
	background: #FFF;
	overflow: hidden;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

.press dt img {
	vertical-align: middle;
}

.press dt.photo .axis {
	width: 0;
	height: 100%;
	display: inline-block;
	vertical-align: middle;
}

.press dd.semmT {
	font-weight: bold;
	font-size: 16px;
	color: #2e3740;
	width: 346px;
	padding-bottom: 12px;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.press dd.semmT a {
	color: #2e3740;
}

.press dd.con {
	font-size: 14px;
	height: 68px;
	width: 346px;
	overflow: hidden;
	text-overflow: ellipsis;
	-o-text-overflow: ellipsis;
	color: #2e3740;
}

.press dd.con a {
	color: #2e3740;
}

/*인재채용*/
.recruit {
	float: left;
	padding: 30px;
	width: 575px;
	height: 202px;
	background: #fff;
	color: #2e3740;
	box-sizing: border-box;
}

.recruit h2.Title {
	font-size: 22px;
	font-weight: bold;
	padding-bottom: 24px;
	text-align: left;
}

.recruit ul {
	padding: 0;
}

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

.recruit li {
	float: left;
}

.recruit li + li {
  margin-left: 60px;
}

.recruit li a {
  display: block;
}


/*대교CNS 소식*/
#contents_area #serviceArea3 {
	position: relative;
	margin: 0 auto;
	width: 1150px;
}

.News {
	float: left;
	padding: 30px;
	width: 574px;
	height: 202px;
	background: #676a6d;
	box-sizing: border-box;
}

.News h2.Title {
	float: left;
	font-size: 22px;
	width: 490px;
	font-weight: bold;
	margin-bottom: 18px;
	text-align: left;
	color: #f3f4f4;
}

.News .more {
	float: right;
}

.News ul.NewsLi {
	width: 514px;
	display: block;
}

.News ul li {
	background: url("../../assets/images/com/dot.png") no-repeat 0 6px;
	padding: 0 0 5px 8px;
	color: #d8d7d7;
	text-align: left;
}

.News ul li + li {
  margin-top: 3px;
}

.News ul li a {
  overflow: hidden;
  display: block;
  width: 100%;
  color: #d8d7d7;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.News ul li a img {
  margin-right: 5px;
}

/* 20230227 */
#serviceArea2 .viveex {  
    width: 289px;
}
#serviceArea2 .ibm {
    width: 287px;
}
#serviceArea2 .viveex,
#serviceArea2 .ibm {
  float: left;
  height: 202px;
  box-sizing: border-box;
}
#serviceArea2 .viveex a,
#serviceArea2 .viveex img,
#serviceArea2 .ibm a,
#serviceArea2 .ibm img {
  display: block;
}
#serviceArea2 .viveex a + a {
    border-top:1px solid #ececec;
}
/* //20230227 */

ul#Banner {
	width: 574px;
	display: inline;
	float: left;
}

ul#Banner li {
	width: 287px;
	height: 207px;
	display: inline;
	float: left;
}

ul#Banner li a {
	cursor: pointer;
}

ul#Banner span.banner01 {
	background: url("../../assets/images/main/banner01.png") no-repeat;
	width: 287px;
	height: 207px;
	display: block;
	float: left;
}

ul#Banner a:hover span.banner01 {
	background: url("../../assets/images/main/banner01_over.png");
}

ul#Banner span.banner02 {
	background: url("../../assets/images/main/banner02.png") no-repeat;
	width: 287px;
	height: 207px;
	display: block;
	float: left;
}

ul#Banner a:hover span.banner02 {
	background: url("../../assets/images/main/banner02_over.png");
}


#footer {
	position: relative;
	width: 100%;
	background: #313131;
	clear: both;
	margin-top: 490px;
}
.footerArea {
	position: relative;
	width: 1127px;
	margin: 0 auto;
	padding: 40px 0;
	color: #999;
	font-size: 13px;
}
/* 20231122 { */
.footerArea::after {
    content: '';
    display: block;
    clear: both;
}
.footerArea > .__left {
	display: block;
	width: 500px;
    margin-top: -4px;
	margin-left: 23px;
	float: left;
	text-align: left;
}
.footerArea .link-lists {
    margin-bottom: 20px;
}
.footerArea .link-lists > li > a {
    color: #fff;
    font-weight: 700;
}
.footerArea ul.address {
    margin-top: -4px;
	line-height: 1.6;
	font-weight: 600;
}
/* } 20231122 */
#footer .footerArea .f_icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    float: right;
    margin-right: 19px;
    margin-top: 7px;
}
#footer .footerArea .f_icon .__item {
    display: inline-block;
    margin: 0;
}
#footer .footerArea .f_icon .__item + .__item {
    margin-left: 10px;
    margin-left: 18px;
}

#footer .footerArea .f_select {
	border: 1px solid #666;
	width: 155px;
	height: 24px;
	line-height: 24px;
	margin-right: 10px;
	float: right;
	position: relative;
}

#footer .footerArea .f_select_btn a {
	background: url("../../assets/images/com/bg_select_arr_down.png") no-repeat 120px 10px;
	padding: 0px 20px 0px 10px;
	height: 24px;
	color: #999;
	font-size: 13px;
	display: block;
}

#footer .footerArea .f_select_btn a.on {
	background: url("../../assets/images/com/bg_select_arr_up.png") no-repeat 120px 10px;
	font-weight: bold;
}

#footer .footerArea .f_select_btn a:hover {
	text-decoration: none;
}

#footer .footerArea .layer {
	display: none;
	background: #313131;
	border: 1px solid #666666;
	color: #b9b9b9;
	width: 155px;
	height: 180px;
	right: -1px;
	bottom: 24px;
	position: absolute;
	z-index: 500;
	-ms-overflow-y: scroll;
	text-align: left;
	overflow: scroll;
	overflow-x: hidden;
	scrollbar-face-color: #666666;
	scrollbar-base-color: #666666;
	scrollbar-highlight-color: #666666;
	scrollbar-shadow-color: #666666;
	scrollbar-3dlight-color: #666666;
	scrollbar-darkshadow-color: #666666;
	scrollbar-arrow-color: #505050;
	scrollbar-track-color: #313131;
}
#footer .footerArea .on.layer {
	display: block;
	z-index: 500;
}
#footer .footerArea .layer strong {
	color: #999;
	font-size: 14px;
	font-weight: bold;
}
#footer .footerArea .layer li {
	padding: 5px 10px;
	width: 130px;
	line-height: normal;
	float: left;
}
#footer .footerArea .layer li a {
	color: #999;
}
#footer .footerArea .f_sns {
	position: absolute;
    top: 81px;
    right: 10px;
	display: flex;
	gap: 0 18px;
}
#footer .footerArea .f_sns a {
	width: 50px;
	height: 40px;
	background: url(../images/main/footer_sns.png) no-repeat 0 0;
}
#footer .footerArea .f_sns a.s_blog {
	background-position: 0 0;	
}
#footer .footerArea .f_sns a.s_instagram {
	background-position: -68px 0;		
}
#footer .footerArea .f_sns a.s_facebook {
	background-position: -136px 0;			
}
#footer .footerArea .f_sns a.s_linkedin {
	background-position: -204px 0;	
}
#footer .footerArea .f_sns a.s_youtube {
	background-position: -272px 0;		
}

/*text color */
.red {
	color: #e42635;
}

/* 간격 */
.pt30 {
	padding-top: 30px
}

.pt100 {
	padding-top: 100px
}

.mt18 {
	margin-top: 18px
}

.mt30 {
	margin-top: 30px
}

.mt50 {
	margin-top: 30px
}

.mt60 {
	margin-top: 60px
}

.mt100 {
	margin-top: 100px;
}

.mb30 {
	margin-bottom: 30px
}

.mb60 {
	margin-bottom: 60px
}

.mb100 {
	margin-bottom: 100px;
}

/* KCSP 인증 준비를 위한 회사 사이트 개발 요청건 : 슬라이드 추가 */
.slider.ibm{overflow: hidden;position: relative;}
.slider.ibm .swiper-pagination{width:287px;text-align:right;padding-right:8px;box-sizing: border-box;bottom:5px}
.slider.ibm .swiper-pagination-bullet{margin:0 3px!important;background:#f0f0f0;}
.slider.ibm .swiper-pagination-bullet-active{background:re#fff;}

/* popup { */
.popup { position: absolute; top: 50%; left: 50%; z-index: 1000; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); -webkit-box-shadow: 0 8px 16px rgba(0,0,0,0.2); box-shadow: 0 8px 16px rgba(0,0,0,0.2); } 
.popup .popup-body a { display: block; } 
.popup .popup-footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: end; padding: 10px 15px; background-color: #fff; } 
.popup-footer .checkbox input { -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; } 
.popup-footer input[type="checkbox"] + label { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 13px; color: #666666; letter-spacing: -0.025em; } 
.popup-footer input[type="checkbox"] + label::before { content: ""; display: inline-block; width: 20px; height: 20px; background-color: #fff; border: 1px solid #d7d7d7; margin-right: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; } 
.popup-footer input[type="checkbox"]:checked + label::before { background: url(../images/popup/i_check.png) no-repeat center; } 
.popup-footer .close { width: 20px; height: 20px; background: url(../images/popup/i_close.png) no-repeat center; margin-left: 15px; } 
/* } popup */