@charset "utf-8";
@import url("common.css");
body {font-size:12px; color:#6e6e6e; overflow-x:hidden;}


/* ------------------------------------response layout 공통------------------------------------ */
/* PC */
@media screen and (max-width:1280px) {
	#top_util #util_wrap  {width:98%;}
	#header nav ul li { padding:0 35px; }
	#wrap {width:98%;}	
}

@media screen and (max-width:980px) {		
	#footer #foot_btm h1.bottom_logo {display:none;}
}

/* 태블릿 */
@media screen and (max-width:768px) {	
	#header #m_top_menu {display:block; cursor:pointer; width:35px; height:30px; margin-top:23px;}
	#header h1 {float:none; margin:0 auto;}
	#header nav ul {display:none;}
	
	#footer {float:none; width:100%; margin-top:80px;}
	#footer #foot_menu ul {width:100%; margin-left:0px; height:100%; display:block;}
	#footer #foot_menu ul li {padding:0; text-align:center; overflow:hidden;}
	#footer #foot_menu ul li.fm_01 {width:18%; }
	#footer #foot_menu ul li.fm_02 {width:18%; }
	#footer #foot_menu ul li.fm_03 {width:18%; }
	#footer #foot_menu ul li.fm_04 {width:18%; }
	#footer #foot_menu ul li.fm_05 {width:28%;.width:25%; }	
	
}

/*스마트폰*/
@media screen and (max-width:480px) {
	/* 공통 */
	#top_util #util_wrap  {width:100%;}
	#top_util #util_wrap ul {float:none;}
	#top_util #util_wrap ul li {width:25%; padding:0; text-align:center; box-sizing:border-box;  .width:24.5%;}		
		
	#footer #foot_menu ul li {letter-spacing:-1.5px;}
	#footer #foot_menu ul li.fm_05 {text-align:left;}
	#footer #foot_btm h1.bottom_logo {display:none;}
}

/* ------------------------------------response layout 공통 끝 ------------------------------------ */

.img_mobile {display:none;}

/* 메인 Layout */
#hot_zone {height:auto; backgornd:#60C;}
#hot_zone img {width:100%; }
#hot_zone #main_img {float:left; width:70.9%; background:#fff; }
#hot_zone #right_zone {float:right; width:29.1%; background:#fff; }
#hot_zone #right_zone #new_product {background:#none;}
#hot_zone #right_zone ul {background:#eaeaea;}
#hot_zone #right_zone ul li {float:left; width:50%; .width:49.8%; background: #fff; border-top:1px solid #fff; border-left:1px solid #fff; box-sizing:border-box; } 
/*#hot_zone #right_zone ul li img {height:100%;}*/
#hot_zone #right_zone ul li:first-child {border-left:0;}

#border-red-01 {float:left; width:100%; height:6px; background:#f71a00; display:none;}
#border-red-02 {float:left; width:100%; height:6px; background:#f71a00; }

#container {clear:both; height:auto; }
#container #top_contents {float:left; width:100%; height:160px; border-bottom:1px solid #dedede; border-left:1px solid #dedede; border-right:1px solid #dedede; box-sizing:border-box;}
#container #top_contents div.notice {float:left; width:35.310%; box-sizing:border-box; padding-top:18px; padding-bottom:18px;}
#container #top_contents div.notice dl {width:85%; margin:0 auto;}
#container #top_contents div.notice dl dt {height:38px;}
#container #top_contents div.notice dl dt h3 {float:left; font-weight:600; font-size:17px; font-family:'Nanum Gothic','맑은고딕'; color:#000;}
#container #top_contents div.notice dl dt span {float:right;}
#container #top_contents div.notice dl dd {clear:both;}
#container #top_contents div.notice dl dd ul {}
#container #top_contents div.notice dl dd ul li {height:15px; margin-bottom:4px; padding-left: 13px; background-image: url(../images/main/notice_bullet.gif); background-position: 0 2px; background-repeat: no-repeat;  word-wrap:break-word;
	display:-moz-box;
	display:-webkit-box;
	display:box; 	
	-moz-line-clamp:1;
	-webkit-line-clamp:1;	
	line-clamp:1;
	-moz-box-orient:vertical;
	-webkit-box-orient:vertical;
	box-orient:vertical;
	text-overflow:ellipsis;
	overflow:hidden;
 }
#container #top_contents div.notice dl dd ul li a {color:#6b6b6b;}
#container #top_contents div.business {float:left; width:35.470%; border-left:1px solid #dedede; box-sizing:border-box; padding-top:18px; padding-bottom:30px;}
#container #top_contents div.business dl {width:85%; margin:0 auto;}
#container #top_contents div.business dl dt {height:38px;}
#container #top_contents div.business dl dt h3 {float:left; font-weight:600; font-size:17px; font-family:'Nanum Gothic','맑은고딕'; color:#000;}
#container #top_contents div.business dl dd {clear:both; width:100%;}
#container #top_contents div.business dl dd .this_img {float:left; margin-right:20px;}
#container #top_contents div.business dl dd p {line-height:21px; color:#5b5b5b; word-wrap:break-word; height:80px; }
#container #top_contents div.product {float:left; width:28.160%; border-left:1px solid #dedede; box-sizing:border-box; padding-top:18px; padding-bottom:30px;}
#container #top_contents div.product dl {width:85%; margin:0 auto;}
#container #top_contents div.product dl dt {height:38px;}
#container #top_contents div.product dl dt h3 {float:left; font-weight:600; font-size:17px; font-family:'Nanum Gothic','맑은고딕'; color:#000;}
#container #top_contents div.product dl dt span {float:right;}
#container #top_contents div.product dl dd {clear:both;}
#container #top_contents div.product dl dd .this_img {float:left; margin-right:20px;}
#container #top_contents div.product dl dd p {line-height:18px; color:#5b5b5b; word-wrap:break-word; height:80px; }
#container #top_contents div.product dl dd p strong {color:#f71a00; }

#container #bottom_contents {float:left; width:100%; height:114px; border-left:1px solid #dedede; border-right:1px solid #dedede; box-sizing:border-box; }
#container #bottom_contents ul.quick_menu {float:left; width:70.835%; height:100%; }
#container #bottom_contents ul.quick_menu li {float:left; width:25%; .width:24.885%; height:100%; background:#fafafa; text-align:center; border-right:1px solid #dedede; box-sizing:border-box;}
#container #bottom_contents ul.quick_menu li.quick_01 { background-image: url(../images/main/quick_menu_01.gif); background-repeat: no-repeat; background-position: center top; }
#container #bottom_contents ul.quick_menu li.quick_02 { background-image: url(../images/main/quick_menu_02.gif); background-repeat: no-repeat; background-position: center top; }
#container #bottom_contents ul.quick_menu li.quick_03 { background-image: url(../images/main/quick_menu_03.gif); background-repeat: no-repeat; background-position: center top; }
#container #bottom_contents ul.quick_menu li.quick_04 { background-image: url(../images/main/quick_menu_04.gif); background-repeat: no-repeat; background-position: center top; }
#container #bottom_contents ul.quick_menu li a {padding-top:85px; font-size:14px; font-family:'Nanum Gothic','맑은고딕'; color:#000; display:block; height:100%;}
#container #bottom_contents div.cscenter { float:left; width:29.166%; height:100%; color:#fff; background-color: #d92611; background-image: url(../images/main/center_icon.gif); background-repeat: no-repeat; background-position: 20px center;}
#container #bottom_contents div.cscenter #cs_wrap { width:98%; padding-top:30px;}
#container #bottom_contents div.cscenter .tel {margin-left:80px; font-size:32px; font-family:'Nanum Gothic','맑은고딕'; letter-spacing:-1px; letter-spacing:-2px;}
#container #bottom_contents div.cscenter .tel a {color:#fff;}
#container #bottom_contents div.cscenter .pen {margin-left:80px; letter-spacing:-1px;}



/* ------------------------------------ 메인 response layout------------------------------------ */
/* PC */
@media screen and (max-width:1280px) {

#container #bottom_contents ul.quick_menu li.quick_04 {.width:24%;}
}

@media screen and (max-width:980px) {
	#container #bottom_contents div.cscenter { background-image: none;}
	#container #bottom_contents div.cscenter #cs_wrap { width:98%; padding-top:30px;}
	#container #bottom_contents div.cscenter .tel {margin-left:0; text-align:center;}
	#container #bottom_contents div.cscenter .pen {margin-left:0; text-align:center;}
	#hot_zone #right_zone ul {.float:left;}
	#hot_zone #right_zone ul li {.width:49.5%;}
	#container #bottom_contents ul.quick_menu li.quick_04 {.width:24%;}
	
}
/* 태블릿 */
@media screen and (max-width:768px) {
	
	#border-red-01 {float:left; width:100%; height:6px; background:#f71a00; display:block;}
	#border-red-02 {float:left; width:100%; height:6px; background:#f71a00; display:none;}
	
	#hot_zone #main_img {width:100%;}
	#hot_zone #right_zone {clear:both; width:100%;  .float:left;}
	#hot_zone #right_zone #new_product {float:left; width:45.8%; }
	#hot_zone #right_zone ul {float:left; width:54.201%; .width:53%;}
	#hot_zone #right_zone ul li {border-top:0; border-left:1px solid #e4e4e3; }
	#hot_zone #right_zone ul li:first-child {border-top:0; border-left:1px solid #e4e4e3;}	
	
	#container {clear:both; display:inline-block;}
	#container:after {content:""; clear:both; display:block;}
	#container {*zoom:1;}
	#container #top_contents {height:auto;}
	#container #top_contents div.notice {width:45.7%;}
	#container #top_contents div.notice dl {width:90%;}
	#container #top_contents div.business {width:27.1%; }
	#container #top_contents div.business dl dd {position:relative;}
	#container #top_contents div.business dl dd p {display:none;}
	#container #top_contents div.business dl dd a {display:block; width:100%; height:70px; text-align:center;}
	#container #top_contents div.business dl dd a img {position:absolute; top:0px; left:50%; margin-left:-42.5px; }
	#container #top_contents div.product {width:27.1%; padding-bottom:30px; .float:left; .width:26%;}	
	#container #top_contents div.product dl dd {position:relative;}
	#container #top_contents div.product dl dd p {display:none;}	
	#container #top_contents div.product dl dd a {display:block; width:100%; height:70px; text-align:center;}
	#container #top_contents div.product dl dd a img {position:absolute; top:0px; left:50%; margin-left:-41px; }
	#container #bottom_contents ul.quick_menu {float:left; width:100%;}
	#container #bottom_contents div.cscenter {float:left; width:100%; height:80px; padding:0; margin:0; background:#3769bd; border-top:3px solid #224a8e; }
	#container #bottom_contents div.cscenter #cs_wrap { width:98%; padding-top:10px;}
	#container #bottom_contents ul.quick_menu li {width:22.9%;}
	#container #bottom_contents ul.quick_menu li.quick_03 {width:27.1%; .width:26%;}
	#container #bottom_contents ul.quick_menu li.quick_04 {width:27.1%; .width:26%; border-right:none;}
	
}

/*스마트폰*/
@media screen and (max-width:480px) {	
	.img_pc {display:none;}
	.img_mobile {display:block;}
	
	#hot_zone #right_zone #new_product {width:100%; height:auto; overflow:hidden;}
	#hot_zone #right_zone ul {width:100%;}
	#hot_zone #right_zone ul li {float:left; width:50%; .width:49.5%;}
	
	#container #top_contents div.notice {width:100%; border-bottom:1px solid #dedede;}
	#container #top_contents div.notice dl {width:92%;}
	#container #top_contents div.business {width:50%; border-left:none; border-right:1px solid #dedede;}
	#container #top_contents div.product {width:50%; border-left:none; .width:49.5%;}
	#container #bottom_contents ul.quick_menu li {float:left; width:25%; box-sizing:border-box; font-size:11px;}
	#container #bottom_contents ul.quick_menu li.quick_03 {width:25%; .width:26%; font-size:11px;}
	#container #bottom_contents ul.quick_menu li.quick_04 {width:25%; .width:23%; letter-spacing:-1px; font-size:11px;}
	
}

@media screen and (max-width:360px) {
	#container #bottom_contents ul.quick_menu li a {font-size:12px;}
}

/* 팝업레이어 그누용 */
#hd_pop {z-index:1000;position:relative;margin:0 auto;width:970px;height:0}
#hd_pop h2 {position:absolute;font-size:0;line-height:0;overflow:hidden}
.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff}
.hd_pops_con {}
.hd_pops_footer {padding:10px 0;background:#000;color:#fff;text-align:right}
.hd_pops_footer button {margin-right:5px;padding:5px 10px;border:0;background:#393939;color:#fff}
/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}