@font-face {
    font-family: 'NanumGothic';
    src: url("/resources/fonts/NanumGothic/NanumGothic.eot");
    src: local("☺"), url("/resources/fonts/NanumGothic/NanumGothic.woff") format("woff");
}
@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
* { padding: 0; margin: 0; }
body {
    background:#fbfbfb;
    font-family: "NanumGothic", "nanumgothic", sans-serif;
}
img {
    border: none;
}
li {list-style: none;}
a {outline: none; text-decoration: none;}
.fullBox0 {
    position:relative;
    margin:0 auto;
    margin-top:10px;
    width:980px;
}

/*Top Header*/
.triangle {
    position:absolute;
    border:18px solid transparent;
    border-top-color:#58AD3E;
    top:90px;
}
.triangleGreenL { left:-8px; }
.triangleGreenR { right:-8px; }

.firstTopBox {
    position: relative;
    margin: 0 auto;
    width: 960px;
    height: 108px;
    background: #F7F6E1;
}
.firstTopBox > a.cableText {
    display: inline-block;
    width: 100%;
    min-width: 960px;
    height: 90px;
    line-height: 90px;
    text-align: left;
}
.firstTopBox > a.cableText > img {
	/* width: 300px; */
    vertical-align: middle;
    padding: 0 0 0 10px;
}
.firstTopBox> table {
	position: absolute;
    top: 0;
    width: 300px;
    color: #fff;
    height: 90px;
    box-sizing: border-box;
    background: #71DA50;
}
.firstTopBox> table td {
    font-weight:bold;
    text-align:center;
}
.firstTopBox> table.counselNumBox_cj {
    left:-18px;
}
.firstTopBox> table.counselNumBox {
    right:-18px;
}
.firstTopBox span.bcTxt {
	font-size:11px; color:#f7f7f7;
	width: 100%;
    position: absolute;
    left: 0;
    bottom: 3px;
}
td.counselNumText_cj, td.counselNumText {
	font-size:18px;
    padding: 0 0 2px 0; vertical-align: bottom;
}
td.siteNum_cj, td.siteNum {
    font-size:32px; vertical-align: top;
}

/*HeaderMain*/
.triangle.triangleGray {
    border:30px solid transparent;
    border-top-color:#ccc;
    left:-20px;
    top:500px;
}
.mainTopBox {
    position:relative;
    width:990px;
    height:390px;
    background:#fff;
    left:-20px;
    border:1px solid #ccc;
}
.mainTopBox .mainTopUl {
    display:inline-block;
    width: 380px;
    height: 380px;
    margin: 5px 10px;
}
.mainTopBox .mainTopUl > li {
    float:left;
    width:180px;
    height:180px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.mainTopBox .mainTopUl > li:nth-child(odd) {
	margin-right: 5px;
}
.mainTopBox .mainTopUl > li:nth-child(even) {
	margin-left: 5px;
}

.mainTopBox .mainTopUl > li > img {
	display: block;
	width:160px;
    margin: 0 auto;
}
.mainTopBox .mainTopUl > li > p {
	display: block;
	width:160px;
    margin: 0 auto;
}
.mainTopBox .mainTopUl > li > p.productsTitle {
    font-family:"NanumGothic", sans-serif;
    height:28px;
    line-height: 28px;
    margin-top: 10px;
    border-bottom:2px solid #71DA50;
    font-size:18px;
    font-weight:bold;
    color:#555;
}
.mainTopBox .mainTopUl > li:hover > p.productsTitle {
    border-bottom:2px solid #E253A9;
}

.mainTopBox .mainTopUl > li > p > .dot {
    position: relative;
    display: inline-block;
    top: -2px;
    width: 4px;
    height: 4px;
    border: 1px solid #cb9a1f;
    background: #EBB325;
}
.mainTopBox .mainTopUl > li > p.productsText {
    margin-top:5px;
    font-size:13px;
    color:#444;
}

.mainTopBox .mainTopImg {
	position: absolute;
    top: 5px;
    right: 10px;
    width: 560px;
    height: 380px;
    line-height: 380px;
}
.mainTopBox .mainTopImg > img {
	width: 100%;
    vertical-align: middle;
}


/*NavBox*/
.navBox {
    margin:0 auto;
    width:960px;
    background: #FFF;
    position: relative;
}
.navBox > .navUl {
    width:100%;
    padding: 5px 0 0 0;
}
.navBox > .navUl > li {
    float:left;
    display: none;
    cursor: pointer;
    box-sizing: border-box;
}
.navBox > .navUl, .navBox > .navUl > li {height: 40px; line-height: 40px; }
.navUl > li > a {
    display: block;
    text-align:center;
    color:#444;
    font-size:14px;
    font-weight:bold;
}
.navBox > .navUl > li.lnbSelect {
	display: block;
}
.navBox > .navUl > li.lnbSelectBlcok {
	background-color: #ebebeb;
}
.navBox > .navUl > li.lnbSelectBlcok, 
.navBox > .navUl > li:hover {
	border-bottom:3px solid #F5C5AA;
    color:#111;
}

/* contentsBox */
.contentsBox {
    position:relative;
    margin:0 auto;
    width:960px;
}
.contentsBox .contentsUl:after {
	content:'';
	clear:both;
}
.contentsBox .contentsUl {
    position:relative;
    display: table;
    margin:0 auto;
    width:960px;
    background:#F7F6E1;
    padding-top:10px;
    padding-bottom:10px;
}
.contentsBox .contentsUl > li {
	width: 25%;
    float:left;
}
.contentsBox .contentsUl > li * {
	display: block;
	margin: 10px auto;
}

/* footerBox */
.footerBox {
    width:100%;
    max-width:960px;
    margin-top:30px;
    padding-top:20px;
    padding-bottom:20px;
}
.footerBox ,.footerBox > p {
    margin:0 auto;
    line-height: 1.5em;
}

.footerBox > p {
	width:960px;
    text-align:left;
    font-size:13px;
    color:#574742;
    
}
.footerBox > p .personalText {
	display: block;
    color: #0057ff;
    font-weight: bold;
    font-size: 13px;
}
.footerBox > p .copyRight {
    color: #A4A4A4;
}
