body,div,dl,dt,dd,ul,ol,menu,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,th,td,p{font-size:16px; line-height:100%;}
#header, #gnb, #container, #footer{min-width:960px;}
#header, #gnb article, #footer article{width:960px; margin:0 auto 0;}
#header{position:relative; background:#fff; z-index:3;}
#header .logo, #header .time{float:left;}
#header .logo{width:155px; height:70px; background:url('images/ico_shotonline.jpg') no-repeat; text-indent:-9999em;}
#header .time{padding:30px 0 0 15px; color:#747474; font-size:14px;}
#header article{float:right; margin:26px 0 0;}
#header article ul, #header article ul li, #header .btn-sns{float:left;}
#header article ul{margin:0 15px 0 0;}
#header article ul li{position:relative; padding:0 16px 0 15px; background:url('images/bg_header_bar.jpg') no-repeat 100% 50%; color:#747474;}
#header article ul li a{display:block; height:18px; line-height:18px; color:#747474; font-size:12px;}
#header article ul a.join, #header article ul a.login, #header article ul li a.hello, #header article .menu .logout span{background-image:url('images/bg_login.jpg'); background-repeat:no-repeat;}
#header article ul li a.join{padding:0 0 0 30px; background-position:0 0;}
#header article ul li a.login{padding:0 0 0 25px; color:#1a8743; background-position:0 -18px;}
#header article ul li a.hello{padding:0 15px 0 0; background-position:100% -36px;}
#header article ul li a.hello strong{color:#1a8743;}
#header article .menu{width:240px; position:absolute; left:50%; top:30px; margin:0 0 0 -120px; background:#fff; display:none;}
#header article .menu .name{height:50px; position:relative; background:#212121;}
#header article .menu .name strong{display:block; height:50px; padding:8px 0 0 20px; position:absolute; left:0; right:0; top:-8px; color:#ffd10a; line-height:50px; background:url('images/bg_my.png') no-repeat 50% 0;}
#header article .menu .information{padding:5px 20px 16px; background:#f4f4f4;}
#header article .menu .information dt{padding:13px 0 6px; font-size:14px; color:#999;}
#header article .menu .information dd{position:relative; font-size:18px; color:#1a8743; font-weight:bold; letter-spacing:-1px;}
#header article .menu .information dd span{display:block; position:absolute; right:0; bottom:0; font-size:12px; color:#999; font-weight:normal; text-align:right;}
#header article .menu menu{padding:5px 0;}
#header article .menu menu li{padding:0; float:none; background:none;}
#header article .menu menu li a{padding:0 0 0 20px; height:32px; line-height:32px; letter-spacing:-1px;}
#header article .menu .logout, #header article .menu .logout span{height:40px; padding:0; font-size:12px; color:#999; line-height:40px;}
#header article .menu .logout{text-align:center; background:#f4f4f4;}
#header article .menu .logout span{display:inline-block; padding:0 0 0 28px; font-weight:bold; background-position:0 -54px;}
#header article .menu .close{display:block; width:28px; height:28px; position:absolute; right:12px; top:11px; background:url('images/btn_my_close.jpg') no-repeat 0 0; text-indent:-9999em;}
#gnb{position:relative; background:#1a8743; box-shadow:-1px 5px 20px rgba(0, 0, 0, 0.1); z-index:1;}
#gnb article{position:relative;}
#gnb article menu li{float:left; position:relative;}
#gnb article menu li a{display:block; height:48px; margin:0 20px; color:#fff; font-weight:bold; line-height:50px; border-bottom:2px solid #1a8743;}
#gnb article ul{position:absolute; left:0; right:0; top:48px; display:none; border-top:2px solid #1a8743;}
#gnb article ul li{float:none; background:#1a8743; text-align:center;}
#gnb article ul li a{display:inline-block; height:43px; margin:0; line-height:45px; font-size:13px; color:#fff;}
#gnb article menu li:hover a, #gnb article menu li.selected a{color:#ffd10a; border-bottom:2px solid #ffd10a;}
#gnb article menu li:hover ul{display:block;}
#gnb article menu li:hover li a, #gnb article menu li.selected li a{border-bottom:2px solid #1a8743; color:#fff;}
#gnb article ul li:hover, #gnb article ul li.selected{background:#167339;}
#gnb article ul li:hover a, #gnb article ul li.selected a, #gnb article menu li:hover ul li:hover a, #gnb article menu li:hover ul li.selected a{color:#ffd10a; border-bottom:2px solid #ffd10a;}

#gnb article .download{display:block; width:160px; height:50px; position:absolute; right:0; top:0; background:#ffd10a; text-align:center;}
#gnb article .download span{display:inline-block; height:50px; padding:0 0 0 20px; color:#1a8743; line-height:50px; font-weight:bold; letter-spacing:-1px; background:url('images/bg_download.png') no-repeat 0 50%;}
#footer{position:relative; padding:80px 0 0; background:#222; z-index:2;}
#footer article{position:relative;}
#footer article menu{padding:0 0 70px;}
#footer article menu li{float:left; margin:0 30px 0 0;}
#footer article menu li a{color:#636772; letter-spacing:-1px;}
#footer article address{height:124px; overflow:hidden;}
#footer article address p{float:left; height:39px;}
#footer article address p strong{display:block; height:15px; background-image:url('images/bg_copyright.jpg'); background-repeat:no-repeat; text-indent:-9999em;}
#footer article address p.webzen{width:430px;}
#footer article address p.webzen strong{width:120px; background-position:0 0;}
#footer article address p.webzenonnet{width:470px; padding:0 0 0 59px; border-left:1px solid #373634;}
#footer article address p.webzenonnet strong{width:207px; background-position:0 -15px;}
#footer article address p span{display:block; padding:10px 0 0; color:#636772;}
#footer article .language{width:150px; position:absolute; right:0; top:-10px; border-bottom:1px solid #666; letter-spacing:-1px;}
#footer article .language a.selected{display:block; height:30px; background:url('images/bg_language.png') no-repeat 100% 50%; line-height:30px; color:#bbb;}
#footer article .language ul{padding:10px 0 20px; position:absolute; left:0; right:0; bottom:30px; background:#fff; border:1px solid #222; display:none;}
#footer article .language li{padding:10px 20px 0;}
#footer article .language li a{color:#747474;}
#footer article .language li:hover a, #footer article .language li.selected a{color:#373737; text-decoration:underline;}

.category{background:#f4f4f4;}
.category{height:60px; position:relative; background:#f4f4f4;}
.category ul{height:37px; padding:23px 0 0 5px; overflow:hidden;}
.category ul li{float:left; margin:0 0 0 25px;}
.category ul li a{color:#747474;}
.category ul li.selected a{color:#1a8743; font-weight:bold; text-decoration:underline;}
.category .search, .category .close{width:56px; height:60px; position:absolute; right:10px; top:0; background-image:url('images/bg_category_search.jpg'); background-repeat:no-repeat; background-position:0 0; text-indent:-9999em;}
.category fieldset{height:20px; padding:20px 80px 20px 30px; position:absolute; left:0; right:0; top:0; background:#f4f4f4; display:none;}
.category fieldset input{width:100%; height:20px; background:#f4f4f4; color:#1a8743;}
.category fieldset .search{right:61px; background-position:0 -60px;}
.category fieldset .close{width:51px; background-position:100% 100%;}

.selectbox, .selectbox .selected{display:block;}
.selectbox{height:32px; position:relative; border:1px solid #c8c8c8;}
.selectbox .selected{min-width:45px; height:32px; padding:0 45px 0 20px; line-height:32px; font-size:14px; color:#999; background:url('images/bg_selectbox.png') no-repeat 100% 50%;}
.selectbox select{position:absolute; left:0; top:0; width:100%; height:100%; opacity:0;}
.selectbox-h38{height:38px;}
.selectbox-h38 .selected{height:38px; line-height:38px; color:#747474;}

.radio{position:relative; display:inline-block; height:18px;}
.radio label{display:block; height:18px; line-height:18px; padding:0 0 0 28px; color:#747474; cursor:pointer; background:url('images/bg_radio.png') 0 0 no-repeat;}
.radio label.checked{background-image:url('images/bg_radio_checked.png');}
.radio input{position:absolute; left:-9999px;}

.checkbox{position:relative; display:inline-block; height:16px;}
.checkbox label{display:block; height:16px; line-height:16px; font-size:14px; padding:0 0 0 26px; color:#999; cursor:pointer; background:url('images/bg_checkbox.png') 0 0 no-repeat;}
.checkbox label.checked{background-image:url('images/bg_checkbox_checked.png');}
.checkbox input{position:absolute; left:-9999px;}

.file{position:relative; display:inline-block;}

.btn-top{position:fixed; right:20px; bottom:20px; z-index:4; opacity:0; transition: all .4s;}