@charset "utf-8";

/* 하단 푸터를 항상 아래에 고정시키기 위함 */
html,body { height:100%; }
#wrapper { width:100%; position:relative; min-height:100%; height:auto;}
#contents_wrap { position:relative; width:1000px; margin:0 auto; padding-bottom:270px }
.contents_body { overflow:hidden; width:100%;} 
.top_bg {background:url('../images/top/top_bg.gif') repeat-x;}

/* 상단이미지 */
#sub_img1 { width:100%; background:url('../images/subimg/sub_top_bg_01.gif') repeat-x; }
#sub_img2 { width:100%; background:url('../images/subimg/sub_top_bg_02.gif') repeat-x; }
#sub_img3 { width:100%; background:url('../images/subimg/sub_top_bg_03.gif') repeat-x; }
#sub_img4 { width:100%; background:url('../images/subimg/sub_top_bg_04.gif') repeat-x; }
#sub_img5 { width:100%; background:url('../images/subimg/sub_top_bg_05.gif') repeat-x; }
#sub_img6 { width:100%; background:url('../images/subimg/sub_top_bg_06.gif') repeat-x; }
#sub_img7 { width:100%; background:url('../images/subimg/sub_top_bg_07.gif') repeat-x; }

.sub_img_bg1,
.sub_img_bg2,
.sub_img_bg3,
.sub_img_bg4,
.sub_img_bg5,
.sub_img_bg6,
.sub_img_bg7 { width:1000px; margin:0 auto; }

.sub_img_bg1 img,
.sub_img_bg2 img,
.sub_img_bg3 img,
.sub_img_bg4 img,
.sub_img_bg5 img,
.sub_img_bg6 img,
.sub_img_bg7 img {max-width:100%; width:100%}


/* 서브 왼쪽, 오른쪽 배경 */
.slbg {position:absolute; top:100px; right:50%; width:50%; height:128px; margin-right:500px; z-index:1}
.srbg {position:absolute; top:100px; right:0; width:50%; height:128px; z-index:1}

.slbg_intro {background:url('../images/subimg/sub_lbg_01.jpg') no-repeat 100% 0; }
.srbg_intro {background:url('../images/subimg/sub_rbg_01.jpg') no-repeat 500px 0; }

.slbg_product {background:url('../images/subimg/sub_lbg_02.jpg') no-repeat 100% 0; }
.srbg_product {background:url('../images/subimg/sub_rbg_02.jpg') no-repeat 500px 0; }

.slbg_solution {background:url('../images/subimg/sub_lbg_03.jpg') no-repeat 100% 0; }
.srbg_solution {background:url('../images/subimg/sub_rbg_03.jpg') no-repeat 500px 0; }

.slbg_data {background:url('../images/subimg/sub_lbg_04.jpg') no-repeat 100% 0; }
.srbg_data {background:url('../images/subimg/sub_rbg_04.jpg') no-repeat 500px 0; }

.slbg_support {background:url('../images/subimg/sub_lbg_05.jpg') no-repeat 100% 0; }
.srbg_support {background:url('../images/subimg/sub_rbg_05.jpg') no-repeat 500px 0; }

.slbg_sitemap {background:url('../images/subimg/sub_lbg_06.jpg') no-repeat 100% 0; }
.srbg_sitemap {background:url('../images/subimg/sub_rbg_06.jpg') no-repeat 500px 0; }

.slbg_privacy {background:url('../images/subimg/sub_lbg_07.jpg') no-repeat 100% 0; }
.srbg_privacy {background:url('../images/subimg/sub_rbg_07.jpg') no-repeat 500px 0; }


/* 컨텐츠 타이틀 */
#contents_wrap .con_title {margin:50px 0 30px;}
#contents_wrap .con_title .title h3 {float:left; width:261px; color:#000; font-size:30px}

#contents_wrap .con_title .title h3.tit_p {display:block;}
#contents_wrap .con_title .title h3.tit_m {display:none;}

#contents_wrap .con_title .location {float:right;}
#contents_wrap .con_title .location ul li {display:inline-block; padding:13px 0 0 0; font-size:12px; text-align:right;}
#contents_wrap .con_title .location ul li.home {padding-left:23px; background:url(../images/common/bullet_home.gif) no-repeat 0 16px;}
#contents_wrap .con_title .location ul li span {color:#000; font-weight:bold; font-size:12px;}

/* 서브탭버튼(모바일에서 1줄에 2개씩) */
#tab_box {clear:both; margin:20px 0 0;}
#tab_box .tab {float:left; margin:0 3px 3px 0; height:28px; border:1px solid #c3cad1; font-size:15px; font-weight:bold; text-align:center; color:#444; background:#fff; line-height:30px; overflow:hidden;} 
#tab_box .tab {width:19.5%;}
#tab_box .tab:hover, 
#tab_box .tab_on:link, 
#tab_box .tab_on:hover, 
#tab_box .tab_on:visited {border:1px solid #a4abb3; background:#a4abb3; color:#fff;} 
#tab_box .tab_last {clear:both;}

/* 탭버튼 */
#tab_box2 {clear:both; overflow:hidden; background:url('../images/common/tab_box_bg.gif') repeat-x left bottom }
#tab_box2 .tab {float:left; margin:0 2px 0 0; height:33px; line-height:33px; border:1px solid #e1e1e1; border-bottom:none; background:#fafafa; 
font-size:13px; font-weight:bold; text-align:center; color:#727272; }
#tab_box2 .tab:first-child {border-left:2px solid #e1e1e1;}
#tab_box2 .tab_on:first-child {border-left:2px solid #8d959e;}
#tab_box2 .tab {width:140px;}
#tab_box2 .tab_on {height:34px; border:2px solid #8d959e; border-bottom:none; background:#fff; color:#748292}


/* ============================================================================================================================================================== */

@media screen and (max-width:1000px) {
	
#contents_wrap  {width:95%; padding-bottom:300px;}

/* 상단이미지 */
#sub_img1, #sub_img2, #sub_img3, #sub_img4, #sub_img5 { background:none; }
.sub_img_bg1,
.sub_img_bg2,
.sub_img_bg3,
.sub_img_bg4,
.sub_img_bg5,
.sub_img_bg6,
.sub_img_bg7,
.sub_img_bg8 {width:100%;}

/* 서브배경 */
.slbg, .srbg {display:none;}

/* 서브탭버튼 */
#tab_box .tab {width:24.4%;}
#tab_box2 {background:none;}
#tab_box2 .tab {width:19.5%; margin:0 2px 2px 0; height:34px; line-height:34px; border-bottom:1px solid #e1e1e1; }
#tab_box2 .tab:first-child {border-left:1px solid #e1e1e1;}
#tab_box2 .tab_on:first-child {border-left:1px solid #8d959e;}
#tab_box2 .tab_on {border:1px solid #8d959e;}

#tab_box .t_none {margin:0 0 3px 0;}
#tab_box .m_none {margin:0 3px 3px 0;}

/* 컨텐츠 타이틀 */
#contents_wrap  .con_title {margin:40px 0 30px;}
#contents_wrap  .con_title .title h3 {float:left; width:261px;}

}

/* ============================================================================================================================================================== */

@media screen and (max-width:900px) {
#tab_box2 .tab {width:19.4%;}
}


/* ============================================================================================================================================================== */

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

#contents_wrap  {padding-bottom:350px;}

/* 서브탭버튼 */
#tab_box .tab {width:32.4%;}
#tab_box2 .tab {width:24.2%;}
#tab_box .t_none {margin:0 3px 3px 0;}
#tab_box .m_none {width:32.6%;margin:0 0 3px 0;}
}


/* ============================================================================================================================================================== */

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

/* 서브탭버튼 */
#tab_box .tab {width:48.6%;}
#tab_box2 .tab {width:48.5%;}
#tab_box .t_none {margin:0 3px 3px 0;}
#tab_box .m_none {margin:0 3px 3px 0;}

/* 컨텐츠 타이틀 */
#contents_wrap  .con_title {margin:20px 0;}
#contents_wrap .con_title .location ul li.location_tit,
#contents_wrap .con_title .location ul li.home {display:none;}
#contents_wrap .con_title .location ul li.head_pro_cate {}

/* 컨텐츠 타이틀(pc/mobile 이미지) */
#contents_wrap  .con_title .title h3.tit_p {display:none;}
#contents_wrap  .con_title .title h3.tit_m {display:block;}

}

/* ============================================================================================================================================================== */

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

/* 서브탭버튼 */
/*#tab_box .tab {width:99.5%;}*/
#tab_box .tab {width:48%; font-size:14px}
#tab_box2 .tab {width:48.5%;}
}

/* ============================================================================================================================================================== */

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

/* 서브탭버튼 */
#tab_box .tab {width:99.5%;}
#tab_box2 .tab {width:99%;}
}