꾸벅. 부탁드립니다

 

아래 소스는 레이아웃 소스입니다. 여기서...  좌측메뉴 width를  201pxdptj  130으로 수정하는게 목표입니다

제가 해본것들 :  아래 소스중 빨간색 부분을 130으로 줄이고, content부분을 770에서 830으로 변경했습니다.

 

이래저래 수정을 해봐도 레이아웃이 틀어지더라구요.

그래서,,   

 

제가 수정을 어디어디를 더 해야하는지...  알려주시면 정말 감사하겠습니다.

맨 아래 레이아웃 전체 소스도 첩부했습니다.

 

* Site Layout - Column Left */
#columnLeft { position:relative; width:201px; float:left;}
#columnLeft .mask { width:201px; height:5px; background:#ffffff; display:block; clear:both;}

#lnbWrap {margin:0px 0 0 0; padding:0;}
#lnbWrap img {display: block;}
#lnbWrap .sub_title  { background:url(../images/default/lnb_bg_t.gif) no-repeat; height:46px; }
#lnbWrap .sub_title h1 { margin:0; padding:16px 0 0 20px; width:160px; font-weight:bold; font-family:Tahoma; font-size:13px; color:#545452; }
#lnb {padding:0 15px; width:170px; background:url(../images/default/lnb_bg.gif) repeat-y; font-size:.9em;}
#lnb li {list-style:none;}
#lnb li a {font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; position:relative; z-index:99; display:block;  padding:5px 10px 5px 15px; width:143px; border-bottom:1px solid #eeeeee; background:url(../images/default/smBul.gif) 5px 9px no-repeat; color:#333; text-decoration:none;}
#lnb li a:hover,
#lnb li a:focus {background-color:#fff; color:#6066F2;}
#lnb li.on a {background:#fff url(../images/default/smBulon.gif) 5px 9px no-repeat; color:#6066F2; font-weight:bold; letter-spacing:-1px;}
#lnb li.on a:hover,
#lnb li.on a:focus {color:#6066F2;}
#lnb li ul {display:block; position:relative; padding:0; width:170px;}
#lnb li.on ul {display:block;}
#lnb li ul li {position:relative; top:0;}
#lnb li ul li a {font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; width:136px; background:#F7F7F7 url(../images/default/submenulist.gif ) 12px 11px no-repeat !important; padding:5px 10px 5px 22px; color:#333 !important; font-weight:normal !important; letter-spacing:normal !important;}
#lnb li ul li a:hover,
#lnb li ul li a:focus {color:#6066F2 !important;}
#lnb li.on ul li.on a {color:#6066F2 !important; font-weight:bold !important;}

 

/* Site Layout - Column Right */
#columnRight { width:770px; float:right; overflow:hidden;}
#visualArea { width:770px; height:200px; background:#f5f5f5; margin-bottom:2.5em; position:relative; left:-15px; margin-right:-15px;}
#content { width:100%; overflow:hidden;}

 

 

@charset "utf-8";
/*
NHN UIT Lab. WebStandardization Team (http://html.nhndesign.com/)
Jeong, Chan Myeong 070601~070630
*/

/* Default Skin - Start */
#selectLang { margin:0; padding:0; }
#gnb { margin:0; padding:0; }
#lnb { margin:0; padding:0; }
#lnb ul { margin:0; padding:0; }

/* Site Layout - Body Wrap */
* {margin:0; padding:0;}
body {background:#fff;}
#bodyWrap {position:relative; width:980px; margin:0 auto; padding:0; border:0; }

/* 메뉴바 */
#header {position:relative; width:980px; height:135px; background:url(../images/default/bgHeader.gif) repeat-x center bottom; margin-bottom:10px; z-index:99;}
#header .menuz {position:relative; height:135px; background:url(../images/default/menuz.gif) 0 100% no-repeat; }
#header .menuy {position:relative; height:135px; background:url(../images/default/menuy.gif) 100% 100% no-repeat; }

/* 상단메뉴 */
#language { position:absolute; border-top:2px solid #DEDEDE; top:0px; right:0; height:20px; overflow:hidden; white-space:nowrap; padding-right:60px; }
#language li { float:left; list-style:none; background:url(../images/default/bgGnbVr2.gif) no-repeat right center; padding-left:2px; position:relative; left:0px; white-space:nowrap;}
#language li a { display:block; float:left; padding:4px 6px 0px 6px; height:18px; color:#61646E; white-space:nowrap; text-decoration:none; font:12px tahoma;}
#language li a:hover,
#language li a:focus { color:#61646E; text-decoration:underline;}

/* 더보기 위치 */
#ejqhrl {position:absolute; width:100px; height:100%; white-space:nowrap; top:6px; right:0px;}
#ejqhrl a {color:#61646E; float:right; text-decoration:none; font:12px tahoma;}

/* 공지 자리 */
#gongzi {position:absolute; top:107px; right:8px; width:229px; height:26px; overflow:hidden; white-space:nowrap; background:url(../images/default/gongg.gif) no-repeat;}
#gongzi li { float:left; list-style:none; background:url(../images/default/bgGnbVr3.gif) no-repeat left center; position:relative; left:-2px; white-space:nowrap;}
#gongzi li a { display:block; float:left; padding:6px 8px 0 8px; height:18px; color:#61646E; white-space:nowrap; text-decoration:none; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#gongzi li a:hover,
#gongzi li a:focus { color:#61646E; text-decoration:underline;}

/* 2차 메뉴 */
#gnb {position:absolute; top:66px; left:0px; height:36px; overflow:hidden; white-space:nowrap; margin-bottom:10px;}
#gnb li {background:url(../images/default/bgGnbn.gif) 100% 100% no-repeat; display:inline; list-style:none; float:left; position:relative; left:0px; white-space:nowrap;}
#gnb li a {display:block; float:left; padding:13px 15px 0px 15px; height:19px;  white-space:nowrap; text-decoration:none; color:#676767; padding-bottom:0px;  letter-spacing:-1px; }
#gnb li a:hover,
#gnb li a:focus {color:#444;}
#gnb li.on { background:url(../images/default/bgGnbOn.gif) 100% 100% no-repeat;}
#gnb li.on a {font-weight:bold; color:#fff; padding-bottom:4px; background:url(../images/default/bgGnbOn2.gif) 0 100% no-repeat; letter-spacing:-0px;}
#gnb li.on a:hover {font-weight:bold; color:#fff; }

#gnb2 {position:absolute; top:105px; left:0px; height:20px; padding:0 10px; white-space:nowrap; }
#gnb2 li { float:left; list-style:none; background:url(../images/default/bgGnb2Vr.gif) no-repeat left center; padding-bottom:0px; position:relative; left:1px; white-space:nowrap;}
#gnb2 li a {display:block; float:left; padding:7px 8px 0px 8px; height:17px; color:#fff; font-size:12px; white-space:nowrap; text-decoration:none; font:12px  Dotum, Gulim, AppleGothic, Sans-serif; letter-spacing:-1px;}
#gnb2 li a:hover,
#gnb2 li a:focus {color:#fff;}
#gnb2 li.on {background:url(../images/default/bgGnbn4.gif) 100% 100% no-repeat;}
#gnb2 li.on a {font-weight:bold; color:#fff;  background:url(../images/default/bgGnbn3.gif) 0 100% no-repeat; letter-spacing:-1px;}
#gnb2 li.on a:hover {font-weight:bold; color:#fff;}

#isSearch { position:absolute; top:74px; right:10px; width:250px; text-align:right;}
#isSearch .searchOrder { display:none;}
#isSearch .checked { position:absolute; left:0; top:0; text-align:left; display:block; padding:5px 0 0 5px; width:64px; height:14px; background:url(../images/default/bgSearchTerm.gif) no-repeat; font:11px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; color:#ffffff; line-height:normal;}
*:first-child+html #isSearch .checked { top:1px; }
#isSearch .inputText { vertical-align:middle; position:relative; top:0; _top:-1px; left:1px; padding:3px 3px 2px 3px; width:175px; height:13px; color:#666; border:1px solid #9FACDB; background-color:#fff; }
#isSearch .inputText:hover,
#isSearch .inputText:focus { border:1px solid #9FACDB; background-color:#fff; }
*:first-child+html body#default #isSearch .inputText { position:relative; top:-1px;}
#isSearch .submit { vertical-align:middle; _position:relative; _top:-1px;}
*:first-child+html body#default #isSearch .submit { position:relative; top:-1px;}

/* Site Layout - Content Body */
#contentBody { position:relative; width:980px; padding-bottom:30px; overflow:hidden; /*background:url(../images/default/bgContentBody.gif) repeat-y left top; */ }

/* Site Layout - Column Left */
#columnLeft { position:relative; width:201px; float:left;}
#columnLeft .mask { width:201px; height:5px; background:#ffffff; display:block; clear:both;}

#lnbWrap {margin:0px 0 0 0; padding:0;}
#lnbWrap img {display: block;}
#lnbWrap .sub_title  { background:url(../images/default/lnb_bg_t.gif) no-repeat; height:46px; }
#lnbWrap .sub_title h1 { margin:0; padding:16px 0 0 20px; width:160px; font-weight:bold; font-family:Tahoma; font-size:13px; color:#545452; }
#lnb {padding:0 15px; width:170px; background:url(../images/default/lnb_bg.gif) repeat-y; font-size:.9em;}
#lnb li {list-style:none;}
#lnb li a {font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; position:relative; z-index:99; display:block;  padding:5px 10px 5px 15px; width:143px; border-bottom:1px solid #eeeeee; background:url(../images/default/smBul.gif) 5px 9px no-repeat; color:#333; text-decoration:none;}
#lnb li a:hover,
#lnb li a:focus {background-color:#fff; color:#6066F2;}
#lnb li.on a {background:#fff url(../images/default/smBulon.gif) 5px 9px no-repeat; color:#6066F2; font-weight:bold; letter-spacing:-1px;}
#lnb li.on a:hover,
#lnb li.on a:focus {color:#6066F2;}
#lnb li ul {display:block; position:relative; padding:0; width:170px;}
#lnb li.on ul {display:block;}
#lnb li ul li {position:relative; top:0;}
#lnb li ul li a {font:12px "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif; width:136px; background:#F7F7F7 url(../images/default/submenulist.gif ) 12px 11px no-repeat !important; padding:5px 10px 5px 22px; color:#333 !important; font-weight:normal !important; letter-spacing:normal !important;}
#lnb li ul li a:hover,
#lnb li ul li a:focus {color:#6066F2 !important;}
#lnb li.on ul li.on a {color:#6066F2 !important; font-weight:bold !important;}

/* Site Layout - Column Right */
#columnRight { width:770px; float:right; overflow:hidden;}
#visualArea { width:770px; height:200px; background:#f5f5f5; margin-bottom:2.5em; position:relative; left:-15px; margin-right:-15px;}
#content { width:100%; overflow:hidden;}

/* Site Layout - Footer */
#footer { margin:0; padding:0; height:25px; background-color:#FAFAFA; border-top:2px solid #636870; border-bottom:1px solid #EBEBEB; text-align:center; padding:7px 0 0px; clear:both;}
#footer li { display:inline; padding:0 .6em 0 1em; background:url(../images/default/vrType1.gif) no-repeat left center;}
#footer li a { text-decoration:none; color:#636870; font:.9em "돋움", Dotum, "굴림", Gulim, AppleGothic, Sans-serif;}
#footercoolla {color:#888; font:10px tahoma; font-weight:bold; height:20px; border-bottom:1px solid #EBEBEB; text-align:center; padding:7px 0 0px;}
#footercoolla a {font:10px tahoma; font-weight:bold; text-decoration:none; color:#6066F2;}
/* Default Skin - End */

/*더보기 메뉴*/
#svcmore {position:absolute;  white-space:nowrap; *width:70px; width:90px; top:15px; right:0px; z-index:100; background:#FFFFFF;border:1px solid #B8B8B8; font-weight:normal}
#svcmore li { float:left; list-style:none; background:url(../images/default/bulletD0.gif) no-repeat left center; width:100%; padding-left:2px; overflow:hidden; position:relative; left:5px; white-space:nowrap;}
#svcmore li a { display:block; float:left; padding:4px 6px 0px 6px; height:18px; color:#61646E; white-space:nowrap; text-decoration:none; font:12px tahoma;}
#svcmore li a:hover,
#svcmore li a:focus { color:#61646E; text-decoration:underline;}