/*============================================================================== / created by: Kang, Mun Bok (mb@hostsmb.com, www.penguinsoft.co.kr) / optimized for : dezignercms.com, easy and professional content management / date modified : 2009/03/02 / date: 2008/08/25 / license : Creative Commons Attribution 2.5 License. / credits: many ideas borrowed from www.styleshout.com and www.solucija.com www.dynamicdrive.com and other sources ==============================================================================*/ /** ------------------------------------------------------------------------- common features import, @ import should be always come first -----------------------------------------------------------------------------*/ /* @import url(http://client.dezignercms.com/designer/css/common.css */ /** -------------------------------------------------------------------------- body & container ------------------------------------------------------------------------------*/ body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li, dl, dt, dd, form, a, fieldset, input, th, td {margin: 0; padding: 0; border: 0; outline: none} /** ------------------------------------------------------------------------- body area for overall properties -----------------------------------------------------------------------------*/ body {margin:0; padding:0; font: 0.9em/1.5em Helvetica, Arial; border-top: 0 solid #046b9d} .clear {clear: both} a {color:#000; text-decoration:none} a:hover {color:#046b9d; text-decoration:none} /** ------------------------------------------------------------------------- alignment of content area, left, center or right -----------------------------------------------------------------------------*/ #container {width:100%; margin:0 auto; float:none} #skipnav {display:none} /** ------------------------------------------------------------------------- north area -----------------------------------------------------------------------------*/ #north {float:none; margin:0; clear:both } #language {display:none; margin:10px 0 0 30px; clear:both} #korea {display:none; background:transparent url(../images/icon/flag_korea.png) no-repeat left; border:0; padding:0 0 0 20px; margin:0 3px 5px 0 } #australia {display:none; background:transparent url(../images/icon/flag_australia.png) no-repeat left; border:0; padding:0 0 0 20px; margin:0 3px 5px 0 } #japan {display:none; background:transparent url(../images/icon/flag_japan.png) no-repeat left; border:0; padding:0 0 0 20px; margin:0 3px 5px 0 } ul#menutop {display:none; float: right; list-style-type: none; margin: 0 0 30px 0 } ul#menutop li { display: block; float: left; font-size: 1em; padding:0 } ul#menutop li a { display: block; margin:0; padding:30px 17px 17px; text-decoration: none; color: #046b9d; border-left: 1px solid #eee; cursor: pointer } ul#menutop li a:hover {display: block; background: #8dc63f; color: #fff; margin: 0; padding:30px 17px 15px 17px } ul#menutop li.clicked a {display: block; background: #046b9d; color: #fff; margin: 0; padding:30px 17px 15px 17px } ul#menutop li span { display: block; font-size: 1.1em; line-height: 1; font-weight:bolder } #north-left {clear:both } #north-left img {float:left; margin:0 0 30px 0} #north-right {width:100%; float:right; clear:right} blockquote { width: 100%; margin: 1em auto 1em auto; text-align: left;text-indent: 1px; background: url(../images/icon/icon_quote.gif); background-position: 0 2px; background-repeat: no-repeat;} blockquote p {font:italic bold 1.3em/1.5em Arial; color:#04859D; margin: 0;display: inline; padding-right: 1px; background: url(../images/icon/icon_quote_end.gif); background-position: bottom right; background-repeat: no-repeat;} /** ------------------------------------------------------------------------- west area ------------------------------------------------------------------------------*/ #west {display:none; margin:0; width:200px; float:left; clear:both} #west p {font: normal 0.95em/1.5em Arial } #west a {color: #000;} #west a:hover {color: #046b9d; text-decoration:underline } #west h2 {color:#fff; background:#046b9d; text-align:center; font-weight:bolder; font-size:1.0em; padding:3px; margin:10px 0 15px 0} #west h3, #west h3 a, #west h3 a:hover {font-weight:bolder; font-size:1.0em; margin:3px 0 15px 0 } ul#menuside {margin:0 0 10px} ul#menuside li {list-style-type:none; line-height:30px; border-bottom:1px dashed #ddd} ul#menuside li a {color:#046b9d; padding:0 0 0 20px } ul#menuside li a:hover {border-left:7px solid #0078F0; padding:0 0 0 20px; font-weight:bolder; color:#046b9d} ul#menuside li.clicked a {border-left:7px solid #046b9d; padding:0 0 0 20px ; font-weight:bolder; color:#046b9d} #latestnews {margin:20px 0; padding:5px 0; border-top:3px solid #046b9d; border-bottom:2px solid #eee} #latestnews h4,#latestnews h4 a,#latestnews h4 a:visited,#latestnews h4 a:hover {font-weight:bolder; font-size:1.0em; padding:5px 0 0 0 } #latestnews p {font: normal 0.93em/1.5em Arial; margin:5px 0; padding:5px 0; border-top:1px dashed #ddd } #latestnews span {color:#999; padding:0 0 0 5px; font-size:0.9em} #download {margin:10px 0; padding:5px 0; border-top:3px solid #046b9d; border-bottom:2px solid #eee} #download h4,#download h4 a,#download h4 a:visited,#download h4 a:hover {font-weight:bolder; font-size:1.0em; margin:3px 0 15px 0 } #download p {background:transparent url(../images/icon/icon_disk.png) no-repeat left; font: normal 0.95em/1.5em Arial; margin:5px 0; padding:5px 0 0 25px; border-top:1px dashed #ddd } /** ------------------------------------------------------------------------- center area ------------------------------------------------------------------------------*/ #center {margin:0; padding:0; width:100%; clear:both} #center a {border-bottom:0px dashed #000} #center a:hover {color: #046b9d; border-bottom:0px dashed #046b9d; text-decoration:none } #center h1 {border-top:4px solid #ddd; margin:0 0 20px 0; padding:20px 0 0 0; color:#0B5E4A } #center p {font:normal 0.95em/2.0em arial; margin:20px 0 0 } /* bullets and numbers ------------------------------------------------------------------------*/ #center ul li {list-style-image: url(../images/bullet/bullets_102.gif);margin:0 0 0 25px; text-indent: 7px; color: #4B4B4B} #center ol li {margin:0 0 0 20px; text-indent: 10px; color: #4B4B4B} /* products related ------------------------------------------------------------------------*/ #pbox {margin:30px 0; padding:10px; width:100%; clear:both } #pbox img {float:left; border:2px solid #ddd; margin:0 20px 20px 0; padding:5px; background:#fff} #pbox a:hover img {float:left; border:2px solid #336699; margin:0 20px 20px 0; padding:5px; background:#eee} #pbox img.view {border:2px solid #ddd; margin:0 20px 20px 0; padding:5px; background:#fff} #pbox h2, #pbox h2 a, #pbox h2 a:hover {margin:15px 0 0 0; font-weight:bolder; font-size:1.2em; color:#046b9d} #pbox h3 {font-size:0.92em; font-weight:normal} #pbox .plist, #pbox .plist a, #pbox .plist a:hover {font-size:1.0em; font-weight:bolder; clear:both} #pbox p {clear:both} #pbox a {color: #046b9d; text-decoration:none} #pbox a:hover {color: #046b9d; text-decoration:underline } /* news related css ------------------------------------------------------------------------*/ #news {margin:15px 0 15px} #news h2 {margin:15px 0 0 0; font-weight:bolder; font-size:1.5em; color:#046b9d} #news h3 {clear:both; font-weight:normal; font-size:1.0em; margin:7px 0 0 0 } #news .newsbody {clear:both} #news .newsdate {font-size:0.85em; color:#999; margin:0 0 30px 0 } #news a {color: #046b9d; text-decoration:none} #news a:hover {color: #046b9d; text-decoration:underline } /* image gallery ------------------------------------------------------------------------*/ #gallery {margin:10px 0; clear:both} #gallery .box {width:170px; height:170px; float:left; text-align: center; margin:5px 10px 35px 10px} #gallery img {width:150px; height:100px; background:#fff; border:3px solid #ddd; display: block; vertical-align:top; padding:5px } #gallery a:hover img {width:150px; height:100px; background:#eee; border:3px solid #336699; display: block; vertical-align:top; padding:5px } #gallery p {width:150px; margin:5px 0 0 0; font-size: 0.95em; color:#3d3d3d; line-height:120%; } /* video gallery ------------------------------------------------------------------------*/ #video {margin:10px 0; clear:both} #video .clip {width:170px; height:170px; float:left; text-align: center; margin:5px 10px 35px 10px} #video img {width:150px; height:100px; background:#fff; border:3px solid #ddd; display: block; vertical-align:top; padding:5px } #video a:hover img {width:150px; height:100px; background:#eee; border:3px solid #336699; display: block; vertical-align:top; padding:5px } #video h2 {margin:5px 0 15px 0; color:#3d3d3d; line-height:150%; } #video h3 {margin:5px 0 0 0; line-height:150%; } #video p {width:150px; margin:5px 0 0 0; font-size: 0.95em; color:#3d3d3d; line-height:120%; } #video .videodate {font-size:0.85em; color:#999; margin:0 0 30px 0 } /* pagination ------------------------------------------------------------------------*/ #pagination {margin:20px 0; clear:both} #navigation p {display:block ; clear:both} /** ------------------------------------------------------------------------- center2 area ------------------------------------------------------------------------------*/ #center2 {background-color:#fff; color:#4A4A4A; clear:both} #center2 a {color: #000;} #center2 a:hover {color: #046b9d; text-decoration:underline } #center2 span {margin:0 0 0 10px; background:#fff} #center2-left {float:left; width:100%; margin:0} #center2-left h1 {font-weight:bolder; font-size:1.2em; padding:10px 0 0 0; margin:10px 0 15px 0; border-top:3px solid #046b9d; } #center2-left h3 {font-weight:bolder; font-size:1.0em; border-top:1px solid #ddd; margin:15px 0 7px 0} #center2-left p {line-height:150%} #center2-center {float:left; width:100%; margin:0} #center2-center h3 {font-weight:bolder; font-size:0.95em; padding:10px 0 0 0; margin:10px 0 15px 0; border-top:3px solid #046b9d; } #center2-center p {font: normal 0.95em/1.5em Arial; margin:5px 0; padding:3px 0; border-bottom:1px dashed #ccc} #center2-right {float:right; width:100%; margin:0} #center2-right h3 {font-weight:bolder; font-size:0.95em; padding:10px 0 0 0; margin:10px 0 5px 0; border-top:3px solid #999; } #center2-right p {font: normal 0.95em/1.5em Arial} #download {margin:10px 0; padding:5px 0; border-bottom:2px solid #eee} #download h4,#download h4 a,#download h4 a:visited,#download h4 a:hover {font-weight:bolder; font-size:1.0em; margin:3px 0 15px 0 } #download p {background:transparent url(../images/icon/icon_disk.png) no-repeat left; font: normal 0.95em/1.5em Arial; margin:5px 0; padding:5px 0 0 25px; border-top:1px dashed #ddd } #download ul li {list-style:none; padding:5px 0 5px 0; color: #4B4B4B; border-bottom:1px dashed #ccc } /** ------------------------------------------------------------------------- south area ------------------------------------------------------------------------------*/ #south {width:100%; height:150px; margin:0 auto; float:none; clear:both; border-top:3px solid #046b9d; font-size:0.85em; text-align:center} #south a:hover {text-decoration:underline} #south1 {color:#000; clear: both; font-weight:bolder; margin:20px 0 0 0} #south2 {color:#000; text-decoration:none}