/* reset */
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, a, em, img, strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0;padding: 0;}
html {height:100%;}
body {height:100%;color:#444;font:normal 12px/1.4 "돋움", "Dotum", sans-serif;}
dl,ul,ol{list-style:none;}
fieldset, img {border:none;}
hr{display:none;}
input,textarea,select{font-size:12px;}
input {vertical-align:top;}
img {vertical-align:middle;}
table {border-spacing:0;empty-cells:show;}
legend, caption{width:0; height:0; font:0/0 Sans-serif; visibility:hidden; z-index:-1;}
em, address {font-style:normal;}
* html .png24 { tmp:expression(setPng24(this));} /* for IE */

a {text-decoration:none; color:inherit;}
a:active, a:hover, a:visited {color:inherit;text-decoration:underline}
a:focus {outline: 0;}
:link,:visited {text-decoration:none;}

#visualFloatMenu #loginNext a{color: #ffffff}
/*a{color:#575757;text-decoration:none;}*/
/*a:link                        {color: #7c7c7c; text-decoration: none; }*/
/*a:visited                 {color: #7c7c7c; text-decoration: none; }*/
/*a:active                  {color: #7c7c7c; text-decoration: none; }*/
/*a:hover                   {color: #454545; text-decoration: none; }*/
.clear { clear: both; }

/*#content table {color:#444;font:normal 12px/1.4 '돋움', dotum, Arial, sans-serif;}*/
/* Main */

#subWrap {width:100%; height: 100%;}
#subWrap #subHeader {width:100%; height: 80px; background: #fff;}

#headerWrap {width:1000px; height:80px; margin:0 auto; }
#headerWrap #logo {float: left; margin-top: 18px;}
#headerWrap #logo a {width:237px; height: 41px; background: url(../jj_images/common/logo.png) 0 0 no-repeat; text-indent: -10000px; display: block;}

#headerWrap #nav {float: left;}
#headerWrap #nav li {float: left; position: relative; margin-left: 40px; margin-top: 30px;}
#headerWrap #nav li:first-child {margin-left: 90px;}
#headerWrap #nav li>a {height:16px; margin-bottom: 50px; display: block; text-indent: -10000px; background: url(../jj_images/common/navSprite.png) 0 0 no-repeat;}
#headerWrap #nav li.hover>a, #headerWrap #nav li:hover>a{background: url(../jj_images/common/navSpriteHover.png) 0 0 no-repeat;}
#headerWrap #nav li.corner_1>a {width:59px; background-position: 0 0;}
#headerWrap #nav li.corner_5>a {width:74px; background-position: 0 -16px;}
#headerWrap #nav li.corner_15>a {width:101px; background-position: 0 -33px;}
#headerWrap #nav li.corner_18>a {width:65px; background-position: 0 -49px;}
#headerWrap #nav li.corner_26>a {width:74px; background-position: 0 -65px;}
#headerWrap #nav li.corner_30>a {width:65px; background-position: 0 -81px;}

#headerWrap #nav li ul {width: 120px; padding:10px 0px; background: url(../jj_images/common/categoryBg.png) 0 0 repeat-x; background-color: #fff; display: none; position: absolute; top:50px; left:50%; margin-left: -60px; z-index: 100;}
#subWrap #subHeader #headerWrap #nav li ul {background-color: #e9e9e9}
#headerWrap #nav li:hover ul {display: inline-block;}
#headerWrap #nav li ul li {clear: both; margin-top: 2px; width:80px; padding: 5px 20px; margin-left: 0;}
#headerWrap #nav li ul li:hover {background: #c6c6c6;}
#headerWrap #nav li ul li:first-child {margin-left:0; margin-top: 0;}
#headerWrap #nav li ul li a {background: url(../jj_images/common/navSubSprite.png) 0 0 no-repeat; display: block; width:120px; height: 12px; margin:0; padding:0;}
#headerWrap #nav li ul li:hover a {background: url(../jj_images/common/navSubSpriteHover.png) 0 0 no-repeat;}

#headerWrap #nav li.corner_1 ul li.s1 a {background-position: 0 0px;}
#headerWrap #nav li.corner_1 ul li.s2 a {background-position: 0 -23px;}
#headerWrap #nav li.corner_1 ul li.s3 a {background-position: 0 -45px;}

#headerWrap #nav li.corner_5 ul li.s1 a {background-position: -121px 0px;}
#headerWrap #nav li.corner_5 ul li.s2 a {background-position: -121px -23px;}
#headerWrap #nav li.corner_5 ul li.s3 a {background-position: -121px -45px;}
#headerWrap #nav li.corner_5 ul li.s4 a {background-position: -121px -67px;}

#headerWrap #nav li.corner_15 ul li.s1 a {background-position: -243px 0px;}
#headerWrap #nav li.corner_15 ul li.s2 a {background-position: -243px -23px;}
#headerWrap #nav li.corner_15 ul li.s3 a {background-position: -243px -45px;}

#headerWrap #nav li.corner_18 ul li.s1 a {background-position: -357px 0px;}
#headerWrap #nav li.corner_18 ul li.s2 a {background-position: -357px -23px;}
#headerWrap #nav li.corner_18 ul li.s3 a {background-position: -357px -45px;}
#headerWrap #nav li.corner_18 ul li.s4 a {background-position: -357px -67px;}
#headerWrap #nav li.corner_18 ul li.s5 a {background-position: -357px -89px;}
#headerWrap #nav li.corner_18 ul li.s6 a {background-position: -357px -110px;}
#headerWrap #nav li.corner_18 ul li.s7 a {background-position: -357px -132px;}

#headerWrap #nav li.corner_26 ul li{padding: 5px 10px;width:100px;}
#headerWrap #nav li.corner_26 ul li.s1 a {background-position: -469px 0px;}
#headerWrap #nav li.corner_26 ul li.s2 a {background-position: -469px -23px;}
#headerWrap #nav li.corner_26 ul li.s3 a {background-position: -469px -45px;}
#headerWrap #nav li.corner_26 ul li.s4 a {background-position: -469px -67px;}

#headerWrap #nav li.corner_30 ul li.s1 a {background-position: -581px 0px;}
#headerWrap #nav li.corner_30 ul li.s2 a {background-position: -581px -23px;}
#headerWrap #nav li.corner_30 ul li.s3 a {background-position: -581px -45px;}
#headerWrap #nav li.corner_30 ul li.s4 a {background-position: -581px -67px;}

#visualFloatMenu {position: fixed; top:130px; right:0;}
#visualFloatMenu #loginPrev {width:103px; height: 136px; background: url(../jj_images/main/visualFloatMenu.png) 0 0 no-repeat; text-indent: -10000px;}
#visualFloatMenu #loginPrev div a {width:103px; height: 68px; display: block;}
#visualFloatMenu #loginNext {width:90px; height: 212px; background: url(../jj_images/main/visualFloatMenu2.png) 0 0 no-repeat; text-align: center; color:#fff; margin-right: 10px;}
#visualFloatMenu #loginNext #welcome {padding-top: 50px;}
#visualFloatMenu #loginNext #name {display: block; font-weight: bold;}
#visualFloatMenu #loginNext li {margin-top: 40px; font-size: 11px;}
#visualFloatMenu #loginNext li:first-child {margin-top: 30px;}

#topNavWrap {width:100%; background: #45413f; height: 50px;}
#topNavWrap #topNav {width:1000px; margin: 0 auto;}
#topNavWrap #topNav ul {width: 100%; height: 50px;}
#topNavWrap #topNav ul:after {display: block; content:""; clear: both}
#topNavWrap #topNav ul li {height: 50px; background: #45413f; float: left; border-right:1px solid #615d5c; display: block; margin-top: -16px;}
#topNavWrap #topNav ul.m1 li {width:33%;}
#topNavWrap #topNav ul.m2 li {width:24%;}
#topNavWrap #topNav ul.m3 li {width:33%;}
#topNavWrap #topNav ul.m4 li {width:14%;}
#topNavWrap #topNav ul.m5 li {width:24%;}
#topNavWrap #topNav ul.m6 li {width:24%;}
#topNavWrap #topNav ul.m7 li {width:12%;}
#topNavWrap #topNav ul.m8 li {width:33%;}

#topNavWrap #topNav ul li a {width:100%; height: 50px; display: block; text-align: center;}
#topNavWrap #topNav ul li a img {margin-top: 20px}
#topNavWrap #topNav ul li:hover,#topNavWrap #topNav ul li.hover {background: #ce5221; border-right:1px solid #ce5221;}
#topNavWrap #topNav ul li:hover:first-child,#topNavWrap #topNav ul li:first-child.hove {border-left:1px solid #ce5221;}
#topNavWrap #topNav ul li:first-child {border-left:1px solid #615d5c;}

#subContentsWrap {width:1000px; margin: 0 auto;}
#subContentsWrap:after {display: block; content:""; clear: both}
#subContentsWrap #leftNav {width:200px; padding-top:50px; float: left;}
#subContentsWrap #leftNav #title {background: url(../jj_images/common/leftNavTitleBg.png) 0 0 no-repeat; width:170px; height: 63px; padding-top: 55px; display: inline-block;}
#subContentsWrap #leftNav #title span {background: url(../jj_images/common/leftNavTitleSprite.png) 0 0 no-repeat; display: block; width:153px; height: 23px; text-indent: -10000px; float: right;}

#subContentsWrap #leftNav.m1 #title span {background-position: 0 0;}
#subContentsWrap #leftNav.m2 #title span {background-position: 0 -24px;}
#subContentsWrap #leftNav.m3 #title span {background-position: 0 -48px;}
#subContentsWrap #leftNav.m4 #title span {background-position: 0 -72px;}
#subContentsWrap #leftNav.m5 #title span {background-position: 0 -95px;}
#subContentsWrap #leftNav.m6 #title span {background-position: 0 -119px;}

#subContentsWrap #leftNav li {margin:20px 0;}
#subContentsWrap #leftNav .line {width:10px; height: 1px; background: url(../jj_images/common/leftNavLine.png) 0 0 no-repeat;}
#subContentsWrap #leftNav li a {width:140px; height: 32px; background: url(../jj_images/common/leftNavSprite.png) 0 0 no-repeat; display: block; text-indent: -10000px;}

#subContentsWrap #leftNav.m1 li.s1 a {background-position: 0px 0px;}
#subContentsWrap #leftNav.m1 li.s1 a:hover ,#subContentsWrap #leftNav.m1 li.s1 a.hover {background-position: -140px 0px;}
#subContentsWrap #leftNav.m1 li.s2 a {background-position: 0px -73px;}
#subContentsWrap #leftNav.m1 li.s2 a:hover ,#subContentsWrap #leftNav.m1 li.s2 a.hover {background-position: -140px -73px;}
#subContentsWrap #leftNav.m1 li.s3 a {background-position: 0px -146px;}
#subContentsWrap #leftNav.m1 li.s3 a:hover ,#subContentsWrap #leftNav.m1 li.s3 a.hover {background-position: -140px -146px;}

#subContentsWrap #leftNav.m2 li.s1 a {background-position: -300px 0px;}
#subContentsWrap #leftNav.m2 li.s1 a:hover ,#subContentsWrap #leftNav.m2 li.s1 a.hover {background-position: -440px 0px;}
#subContentsWrap #leftNav.m2 li.s2 a {background-position: -300px -73px;}
#subContentsWrap #leftNav.m2 li.s2 a:hover ,#subContentsWrap #leftNav.m2 li.s2 a.hover {background-position: -440px -73px;}
#subContentsWrap #leftNav.m2 li.s3 a {background-position: -300px -146px;}
#subContentsWrap #leftNav.m2 li.s3 a:hover ,#subContentsWrap #leftNav.m2 li.s3 a.hover {background-position: -440px -146px;}
#subContentsWrap #leftNav.m2 li.s4 a {background-position: -300px -219px;}
#subContentsWrap #leftNav.m2 li.s4 a:hover ,#subContentsWrap #leftNav.m2 li.s4 a.hover {background-position: -440px -219px;}

#subContentsWrap #leftNav.m3 li.s1 a {background-position: -600px 0px;}
#subContentsWrap #leftNav.m3 li.s1 a:hover ,#subContentsWrap #leftNav.m3 li.s1 a.hover {background-position: -740px 0px;}
#subContentsWrap #leftNav.m3 li.s2 a {background-position: -600px -73px;}
#subContentsWrap #leftNav.m3 li.s2 a:hover ,#subContentsWrap #leftNav.m3 li.s2 a.hover {background-position: -740px -73px;}
#subContentsWrap #leftNav.m3 li.s3 a {background-position: -600px -146px;}
#subContentsWrap #leftNav.m3 li.s3 a:hover ,#subContentsWrap #leftNav.m3 li.s3 a.hover {background-position: -740px -146px;}

#subContentsWrap #leftNav.m4 li.s1 a {background-position: -900px 0px;}
#subContentsWrap #leftNav.m4 li.s1 a:hover ,#subContentsWrap #leftNav.m4 li.s1 a.hover {background-position: -1040px 0px;}
#subContentsWrap #leftNav.m4 li.s2 a {background-position: -900px -73px;}
#subContentsWrap #leftNav.m4 li.s2 a:hover ,#subContentsWrap #leftNav.m4 li.s2 a.hover {background-position: -1040px -73px;}
#subContentsWrap #leftNav.m4 li.s3 a {background-position: -900px -146px;}
#subContentsWrap #leftNav.m4 li.s3 a:hover ,#subContentsWrap #leftNav.m4 li.s3 a.hover {background-position: -1040px -146px;}
#subContentsWrap #leftNav.m4 li.s4 a {background-position: -900px -219px;}
#subContentsWrap #leftNav.m4 li.s4 a:hover ,#subContentsWrap #leftNav.m4 li.s4 a.hover {background-position: -1040px -219px;}
#subContentsWrap #leftNav.m4 li.s5 a {background-position: -900px -292px;}
#subContentsWrap #leftNav.m4 li.s5 a:hover ,#subContentsWrap #leftNav.m4 li.s5 a.hover {background-position: -1040px -292px;}
#subContentsWrap #leftNav.m4 li.s6 a {background-position: -900px -365px;}
#subContentsWrap #leftNav.m4 li.s6 a:hover ,#subContentsWrap #leftNav.m4 li.s6 a.hover {background-position: -1040px -365px;}
#subContentsWrap #leftNav.m4 li.s7 a {background-position: -900px -438px;}
#subContentsWrap #leftNav.m4 li.s7 a:hover ,#subContentsWrap #leftNav.m4 li.s7 a.hover {background-position: -1040px -438px;}

#subContentsWrap #leftNav.m5 li.s1 a {background-position: -1200px 0px;}
#subContentsWrap #leftNav.m5 li.s1 a:hover ,#subContentsWrap #leftNav.m5 li.s1 a.hover {background-position: -1340px 0px;}
#subContentsWrap #leftNav.m5 li.s2 a {background-position: -1200px -73px;}
#subContentsWrap #leftNav.m5 li.s2 a:hover ,#subContentsWrap #leftNav.m5 li.s2 a.hover {background-position: -1340px -73px;}
#subContentsWrap #leftNav.m5 li.s3 a {background-position: -1200px -146px;}
#subContentsWrap #leftNav.m5 li.s3 a:hover ,#subContentsWrap #leftNav.m5 li.s3 a.hover {background-position: -1340px -146px;}
#subContentsWrap #leftNav.m5 li.s4 a {background-position: -1200px -219px;}
#subContentsWrap #leftNav.m5 li.s4 a:hover ,#subContentsWrap #leftNav.m5 li.s4 a.hover {background-position: -1340px -219px;}


#subContentsWrap #leftNav.m6 li.s1 a {background-position: -1500px 0px;}
#subContentsWrap #leftNav.m6 li.s1 a:hover ,#subContentsWrap #leftNav.m6 li.s1 a.hover {background-position: -1640px 0px;}
#subContentsWrap #leftNav.m6 li.s2 a {background-position: -1500px -73px;}
#subContentsWrap #leftNav.m6 li.s2 a:hover ,#subContentsWrap #leftNav.m6 li.s2 a.hover {background-position: -1640px -73px;}
#subContentsWrap #leftNav.m6 li.s3 a {background-position: -1500px -146px;}
#subContentsWrap #leftNav.m6 li.s3 a:hover ,#subContentsWrap #leftNav.m6 li.s3 a.hover {background-position: -1640px -146px;}
#subContentsWrap #leftNav.m6 li.s4 a {background-position: -1500px -219px;}
#subContentsWrap #leftNav.m6 li.s4 a:hover ,#subContentsWrap #leftNav.m6 li.s4 a.hover {background-position: -1640px -219px;}

#subContentsWrap #leftNav.m7 li.s1 a {background-position: -1800px 0px;}
#subContentsWrap #leftNav.m7 li.s1 a:hover ,#subContentsWrap #leftNav.m7 li.s1 a.hover {background-position: -1940px 0px;}
#subContentsWrap #leftNav.m7 li.s2 a {background-position: -1800px -73px;}
#subContentsWrap #leftNav.m7 li.s2 a:hover ,#subContentsWrap #leftNav.m7 li.s2 a.hover {background-position: -1940px -73px;}
#subContentsWrap #leftNav.m7 li.s3 a {background-position: -1800px -146px;}
#subContentsWrap #leftNav.m7 li.s3 a:hover ,#subContentsWrap #leftNav.m7 li.s3 a.hover {background-position: -1940px -146px;}
#subContentsWrap #leftNav.m7 li.s4 a {background-position: -1800px -219px;}
#subContentsWrap #leftNav.m7 li.s4 a:hover ,#subContentsWrap #leftNav.m7 li.s4 a.hover {background-position: -1940px -219px;}
#subContentsWrap #leftNav.m7 li.s5 a {background-position: -1800px -292px;}
#subContentsWrap #leftNav.m7 li.s5 a:hover ,#subContentsWrap #leftNav.m7 li.s5 a.hover {background-position: -1940px -292px;}
#subContentsWrap #leftNav.m7 li.s6 a {background-position: -1800px -365px;}
#subContentsWrap #leftNav.m7 li.s6 a:hover ,#subContentsWrap #leftNav.m7 li.s6 a.hover {background-position: -1940px -365px;}
#subContentsWrap #leftNav.m7 li.s7 a {background-position: -1800px -438px;}
#subContentsWrap #leftNav.m7 li.s7 a:hover ,#subContentsWrap #leftNav.m7 li.s7 a.hover {background-position: -1940px -438px;}
#subContentsWrap #leftNav.m7 li.s8 a {background-position: -1800px -511px;}
#subContentsWrap #leftNav.m7 li.s8 a:hover ,#subContentsWrap #leftNav.m7 li.s8 a.hover {background-position: -1940px -511px;}

#subContentsWrap #leftNav.m8 li.s1 a {background-position: -2100px 0px;}
#subContentsWrap #leftNav.m8 li.s1 a:hover ,#subContentsWrap #leftNav.m8 li.s1 a.hover {background-position: -2240px 0px;}
#subContentsWrap #leftNav.m8 li.s2 a {background-position: -2100px -73px;}
#subContentsWrap #leftNav.m8 li.s2 a:hover ,#subContentsWrap #leftNav.m8 li.s2 a.hover {background-position: -2240px -73px;}
#subContentsWrap #leftNav.m8 li.s3 a {background-position: -2100px -146px;}
#subContentsWrap #leftNav.m8 li.s3 a:hover ,#subContentsWrap #leftNav.m8 li.s3 a.hover {background-position: -2240px -146px;}
/*#subContentsWrap #leftNav.m8 li.s4 a {background-position: -2100px -219px;}*/
/*#subContentsWrap #leftNav.m8 li.s4 a:hover ,#subContentsWrap #leftNav.m8 li.s3 a.hover {background-position: -2240px -219px;}*/

#subContents {width:770px; float: left;margin-bottom: 50px;}

/* 인터넷 > 현장강의 */
#subVisual {width: 700px; height: 150px; background: url(../jj_images/common/subVisualSample.png) 0 0 no-repeat; position: relative; margin-top: 27px;}
#subVisual #subVisualBtn a{width: 140px; height: 30px; display: block; background: url(../jj_images/common/subVisualBtn.png) 0 0 no-repeat; text-indent: -10000px; position: absolute; top:42px; right:220px;}
/*#contents {width:660px; padding:40px 25px 80px 25px;}*/
/*#sampleCont > ul {width:650px; border-top:3px solid #333;}*/
.thumbnail {width:650px; height: 101px; background:url(../jj_images/common/subContentsSample.png); text-indent: -10000px;position: relative;cursor: pointer}
/*.thumbnail#thumbnail_new {background-position: 0 0;}*/
/*.thumbnail#thumbnail_new {background-position: 0 -103px;}*/
.thumbnail#thumbnail_basic {background-position: 0 -3px;border-top:3px solid #000}
.thumbnail#thumbnail_201606r {background-position: 0 -105px;}
.thumbnail#thumbnail_201606t {background-position: 0 -207px;}
.thumbnail#thumbnail_regular_new {background-position: 0 -309px;}
/*
.thumbnail#thumbnail_premium_new {background-position: 0 -409px;}
.thumbnail#thumbnail_regular {background-position: 0 -511px;}
.thumbnail#thumbnail_premium {display:none}
*/
/*.thumbnail#thumbnail_premium {background-position: 0 -204px;}*/
/*#sampleCont > ul > li div.sampleContBtn {margin: 64px 0 0 325px;}*/
.thumbnail a{position: absolute;top:81px;left:325px;width: 100px; height: 19px; background: url(../jj_images/common/subContentsSampleBtn.png) 0 0 no-repeat; display: block;}

#footer {width:100%; height: 122px; background: #e6e6e6;}
#footerWrap {width:1000px; height: 122px; margin: 0 auto; position: relative;}
#footer #footerLogo {width:167px; height: 55px; background: url(../jj_images/common/footerLogo.png) 0 0 no-repeat; position: absolute; top:35px; left:20px; text-indent: -10000px;}
#footer #footerBtnWrap {position: absolute; top:25px; left:200px; display: inline-block; width:750px;}
#footer #footerBtnWrap li{float: left; margin: 0 30px;}
#footer #footerBtnWrap li.line {width:1px; height: 8px;  margin:3px 0 0 0;background:#7c7c7c}
#footer #footerBtnWrap li.m1 a {width:90px; height: 12px;  display: block;}
#footer #footerBtnWrap li.m2 a {width:90px; height: 12px;  display: block;}
#footer #footerBtnWrap li.m3 a {width:90px; height: 12px;  display: block;}
#footer #footerBtnWrap li.m4 a {width:90px; height: 12px;  display: block;}
#footer #footerBtnWrap li.m5 a {width:90px; height: 12px;  display: block;}
#footer #address {width:683px; height: 42px; position: absolute; top:60px; left:230px;color:#7c7c7c}