﻿@charset "utf-8";
/**
* OLYM Cascading Style Sheets
* File Name : sub.css
* Description : 한국트로닉스 서브 스타일시트
* Author : Web business Team / Jessica
* Email : design@olymcompnay.com
* Date : 2012.03.22
* Update : 2012.03.23
* Copyright(c) 2012 OLYM Communications. All Rights Reserved.
*/
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Bold.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}

html, body { height: 100%; }
body { font-size:0.75em; font-family:"돋움", "돋움체"; line-height:1.2em; background:url(/project/design/com/bg_sub.gif) center top repeat-y;  }
#wrap { width:100%;}
#header { width:100%; position: absolute; z-index:200; left:0; top:0;min-height:100px; background:#fff;}
/* margin으로 container 높이100% 만듬 */
#container { width:100%; padding-top:125px;}
/* padding으로 contents-box 원래높이 지정 */
#contents_box {position:relative; margin:0 auto; width:990px; min-height:700px;}
/* IE Hack */

*html #container { height: 100%; }
#spot { width:100%; height:129px; background:url(/project/design/com/bg_icon.jpg) center top no-repeat;}
#snb { position:relative; width:266px; float:left; min-height:700px;}
#snb h2 {font-family: 'Pretendard'; font-weight:bold; letter-spacing:-0.05em; font-size:25px; color:#232425; line-height:1em; margin:30px 0 30px 20px;}
#snb h2 span {color:#075696}
#snb ul { width:220px;}
#snb ul > li > a { font-family: 'Pretendard'; display:block; padding:10px 10px 10px 20px; font-weight:bold; color:#666; text-decoration:none; border-top:1px solid #ddd;}
#snb ul > li > a:hover, #snb ul > li > a.on { background-color:#77808b; color:#fff;}

#contents { width:703px; position:relative; float:left; margin-left:20px; padding-bottom:60px;}
#footer { width:100%; position:relative; height:124px; border-top:solid 2px #424242; background:url(/project/design/com/bg_footer.gif) center top repeat-y;}

/* Footer */
.footer_box { width:990px; margin:0 auto; height:124px; position:relative;}
.footer_box .btn_footer{padding:29px 0 0 25px;}
.footer_box .btn_footer li {float:left; padding:0 27px 14px 0;}
.footer_box address {clear:both; padding:0 0 5px 25px;}
.footer_box .copyright { padding-left:25px;}
.footer_box .btn_top { position:absolute; top:61px; right:29px; }
.footer_box .footer_right { position:absolute; right:28px; top:20px;}
.footer_box .footer_right li { float:left; padding-left:10px;}
.footer_box .select {padding-top:5px;}

/* stle */
.stle { float:left; width:715px; height:75px; position:relative; font-size:11px; line-height:1.2em; letter-spacing:-0.1em; }
.stle h2 { float:left; padding:31px 0 0 27px; }
.stle ul { float:right; padding:33px 8px 0 0; }
.stle .home { font-family:Tahoma, Geneva, sans-serif; letter-spacing:0; }
.stle li { float:left; color:#828282; }
.stle_over { font-weight:bold; }

/*snb_bot*/
.snb_bot { width:226px; higth:300px; border-top:solid 1px #d8d8d8;margin-right:19px;}
.snb_bot .vod { background:url(/project/design/com/img_vod.gif) left top no-repeat; width:203px; height:58px; position:relative; margin:34px 0 33px 10px; }
.snb_bot .vod h3 { padding:0 0 9px 81px;}
.snb_bot .vod p { padding-left:81px;}
.snb_bot .btn { position:absolute; top:-14px; left:190px;}
.stock { width:225px; height:188px; }



/* SPOT */
.spot_box { width:990px; margin:0 auto;}
.spot_box ul { margin:32px 0 0 20px; float:left;}
.spot_box li { float:left; position:relative; width:195px; margin:0 23px 0 23px;}
.spot_box h3 { padding-bottom:4px;}
.spot_box .btn_go {padding-top:7px; display:block;}
.spot_box li .icon_img { position:absolute; top:2px; right:0;}


/*#lnb { height:125px; line-height: 0; overflow: hidden; background:url(/project/design/com/bg_gnb.jpg) center top no-repeat;  }
#lnb_snb {left:0; top:30px; width: 100%; height:0px; overflow: hidden; position: absolute; z-index: 9000; background:#ffffff; position:absolute; z-index:100; background:#fff url(/project/design/lnb/bg_snb_wrap.gif) center bottom repeat-x;}*/


#lnb { height:125px; line-height: 0; overflow: hidden; background:url(/project/design/com/bg_gnb.gif) left top repeat-x;  }

#lnb_box { margin-left:270px; position:absolute; top:56px; z-index:3000;}
#lnb_box li {float: left; height:47px; width:120px; } 
#lnb_box > li > a {color:#333; font-family: 'Pretendard'; font-size:16px; font-weight:700; line-height:45px; display:block; text-align:center; position:relative; transition: all ease 0.3s; }
#lnb_box > li > a:before { content:""; width:1px; height:12px; background:rgba(0,0,0,0.2); display:block; position:absolute; top:17px; left:0;}
#lnb_box > li:first-child > a:before { display:none;}
#lnb_box > li > a:hover {color:#005aa0;text-decoration:none;}

#lnb_snb {left:0; top:30px; width: 100%; height:0px; overflow: hidden; position: absolute; z-index: 9000; background:#fff url(/project/design/lnb/bg_snb_wrap.gif) center bottom repeat-x; position:absolute; z-index:100;}


.snb_wrap { width:990px; margin:0 auto;}
.snb_wrap div {	height:233px; float: left; padding-top:73px;	width:120px;}
.snb_wrap div ul li a {display:block; padding:5px 0 5px 10px; line-height:1em; color:#888; font-family: 'Pretendard'; font-size:12px; font-weight:500;transition: all ease 0.3s;}
.snb_wrap div ul li a:hover {background:#025cb9; color:#fff; text-decoration:none;}
.snb_wrap .snb01 {	margin-left:270px;} /*270*/

