@import url("common.css");

.visual_flash{position:relative; height:385px;}

#main_container {position:relative; width:980px; margin:0 auto; overflow:visible !important; background:url('/img/main_text_bg.gif') top right no-repeat; *zoom:1;}
#main_container_area{position:relative; min-height:490px; _height:490px;}

	.left_area {float:left; width:245px;}
	.mid_area {float:left; width:245px; background:#d0d0d0;}
	.right_area {float:left; width:490px;}

/* 메인비주얼 */
.clsBannerScreen {position:relative; height: 385px; width:735px; overflow: hidden; float:left; cursor:pointer;}
.clsBannerScreen .images {position:absolute; height: 385px; display:none; }
ul, li {list-style:none; margin:0; padding:0; font-size:10pt; }
.clsBannerButton {position:absolute; top:329px; right:10px; cursor:pointer;}
.clsBannerButton li {width:40px; float:left;padding:2px;}

.main_text {position:relative;float:left; margin-top:80px; margin-left:26px;}
.main_text a {display:block;position:absolute;width:192px;height:80px;right:0;bottom:0;text-indent:100%;white-space:nowrap;overflow:hidden;}

/* 공지사항 */
.notice_area {position:relative; padding:31px 21px; width:203px; height:183px; vertical-align:top;}
	.notice_area h2 {padding-bottom:17px; _padding-bottom:15px;}
	/*.notice_area .more {position:absolute; top:7px; right:0px;}*/
	.notice_area li {padding:3px 0; _padding:2px 0; height:13px; background:url('/img/notice_dott.gif') 2px 9px no-repeat; padding-left:10px;}
	.notice_area li a:link, .notice_area li a:visited {color:#7b7b7b; font-size:0.8em;}
	.notice_area li a:hover {color:#000;}
	/*.notice_area li .date {float:right; width:55px; text-align:right; color:#989898; font-size:11px;}*/

/* 하나스토리 */
.story_area {position:relative;width:245px;height:490px;}

/* 하나투데이 */
.main_today {position:relative;width:490px;height:245px;background:url(/img/main_today.gif) no-repeat;}
.main_today .todaylink {position:absolute;top:23px;right:77px;width:209px;height:32px;}

/* 사회공헌*/
.main_csr {position:relative;}

.networkLink {position:absolute;top:0;right:0;}



/* add main slide custom - 190625 */
.swiper-container-horizontal {
	overflow: hidden;
}
.swiper-wrapper {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
}
.swiper-slide {
	flex-shrink:0;
}
.mainSlide { 
	position:relative; 
	height: 385px;
	width:735px; 
	overflow: hidden; 
	float:left; 
	cursor:pointer; 
}
.mainSlide .slide {

}
.mainSlide .slide .swiper-slide {
	font-size: 0;
}
.mainSlide .slide .swiper-slide a{
	display: block; 
	width: 100%;
	height: 100%;
}	
.mainSlide .slide .slidePrev,
.mainSlide .slide .slideNext {
	position: absolute;
	top: 50%;
	width: 30px;
	height: 68px;
	margin-top: -34px;
	z-index: 10;
	background-color: rgba(255,255,255,.8);
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto;
	background-image: url('/img/icon_swiperLeft.png');
}
.mainSlide .slide .slidePrev{
	left: 0;
	border-radius: 0 5px 5px 0;
}
.mainSlide .slide .slideNext{
	right: 0;
	border-radius: 5px 0 0 5px;
	background-image: url('/img/icon_swiperRight.png');
}
.mainSlide .slide .slidePage {
	position: absolute;
	left: 50%;
	bottom: 20px;
}
.mainSlide .slide .slidePage a { 
	display: inline-block; 
	font-size: 0; 
	width: 8px; 
	height: 8px; 
	margin: 0 4px; 
	border-radius: 8px; 
	border: 1px solid #0074c9; 
	box-sizing: border-box; 
	background-color: #fff; 
}
.mainSlide .slide .slidePage a.swiper-pagination-bullet-active { 
	background-color: #0074c9; 
}
.hirebanner { 
	display: block; 
	position:absolute; 
	bottom:0; 
	right:0; 
}

/* main.css:23 */
.notice_area { position: relative; padding: 26px 21px 0; width: 203px; height: 177px; vertical-align: top; }