@charset "utf-8";

/* common */
.main{padding-top:457px}
.main .news_area .tab_menu li, .main .cash_area .cash_wrap li{background:url("../common/spr_blt_main.png") no-repeat}
.main .content_main{font-weight:lighter}
.main .tab_menu{position:relative}
.main .tab_menu .tab_bar{position:absolute;left:0;bottom:0;height:2px;background:#415958}
.main .tab_menu li a{display:inline-block;*zoom:1;color:#666;font-size:18px;padding-bottom:5px}
.main .tab_menu li a:hover, .main .tab_menu .on a{color:#415958;font-weight:normal}
.main .figure_job{width:20px;height:20px}
.main .time.icon{background:url("../common/blt_time.png") 0 50% no-repeat}

/* banner */ 
.main .banner_head{height:537px}
.main .banner_wrap li a{height:457px}
.main .banner_nav{top:420px}
.main .banner_nav li{margin-right:7px}
.main .banner_nav a{width:41px;background:url("../common/spr_btn_main.png") no-repeat}
.main .banner_nav .on a{background-position:0 -15px}

/* 아스소식 */
.main .news_area{height:314px;padding:61px 0 66px}
.main .news_area .tab_menu{font-size:0;text-align:center;margin-bottom:52px}
.main .news_area .tab_menu li{display:inline-block;*display:inline;*zoom:1;padding:0 20px}
.main .news_area .tab_menu li.all{background:none}
.main .news_area .tab_content ul{*zoom:1;margin-right:-20px}
.main .news_area .tab_content ul:after{content:"";display:block;clear:both}
.main .news_area .tab_content li{position:relative;float:left;width:220px;height:186px;background:#F8F8F8;text-align:center;padding-top:53px;margin-right:20px}
.main .news_area .tab_content li span{display:block}
.main .news_area .tab_content li .category a{color:#42b4f9;font-size:18px}
.main .news_area .tab_content li .icon{position:absolute;top:-38px;left:50%;width:75px;height:75px;background:url("../common/spr_icon_news_210513.png") no-repeat;margin-left:-37px}
.main .news_area .tab_content li .icon.update{background-position:-75px 0}
.main .news_area .tab_content li .icon.event{background-position:-150px 0}
.main .news_area .tab_content li .icon.story{background-position:-225px 0}
.main .news_area .tab_content li .icon.cont{background-position:-300px 0}
.main .news_area .tab_content li .icon.tests_m{background:url("../common/tests_m_ic.png") no-repeat;}
.main .news_area .tab_content li .title{display:block;height:69px;overflow:hidden;font-size:18px;line-height:23px;word-break:keep-all;padding:23px 20px 0;margin-bottom:18px}
.main .news_area .tab_content li .title:hover{color:#0d0d0d}
.main .news_area .tab_content li .time{border-top:2px solid #ECECEC;color:#999;font-size:14px;padding-top:12px;margin:0 30px}
/* 커뮤니티 */
.main .commu_area{background:#F2FAFF;padding:54px 0 79px}
.main .commu_area h2{text-align:center;font-size:40px;color:#44495d;margin-bottom:13px}
.main .commu_area h2 span{display:inline-block;*zoom:1;vertical-align:middle}
.main .commu_area h2 .icon{width:19px;height:19px;background:url("../common/blt_h2_commu.png") no-repeat;margin:0 0 3px 16px}
.main .commu_area ul{overflow:hidden;margin-right:-20px}
.main .commu_area li{position:relative;float:left;background:#fff;width:280px;height:289px;padding-top:60px;margin:23px 20px 0 0}
.main .commu_area .category{position:absolute;top:0;left:0;width:100%;height:77px;font-weight:normal;text-align:center;line-height:60px;font-size:18px;color:#fff;background:url("../common/bg_commu.png") no-repeat}
.main .commu_area li .feed{display:block;height:190px;text-align:center;padding:33px 30px 0}
.main .commu_area li .title{display:block;height:44px;overflow:hidden;color:#4c4c4c;font-size:18px;line-height:22px;word-wrap:break-word;margin-bottom:27px}
.main .commu_area li .feed:hover .title{color:#333}
.main .commu_area li .feed p{max-height:85px;overflow:hidden;color:#808080;font-size:14px;line-height:17px;word-wrap:break-word}
.main .commu_area li .feed:hover p{color:#4d4d4d}
.main .commu_area li .text_info{position:relative;border-top:2px solid #E1E1E1;margin:0 30px;padding-top:15px}
.main .commu_area .text_info span{vertical-align:middle;line-height:20px}
.main .commu_area .text_info .server{width:35px;height:19px;font-size:10px;text-align:center;margin-right:7px}
.main .commu_area .text_info .server.test{background:#F1F1F1;color:#84827a}
.main .commu_area .text_info .server.juen{background:#F6EDFA;color:#c079e3}
.main .commu_area .text_info .server.baspo{background:#E3F3FF;color:#8bbdda}
.main .commu_area .text_info .nick{font-size:14px;color:#666;margin-left:4px}
.main .commu_area .text_info .time{position:absolute;top:15px;right:0;font-size:14px;color:#9e9488}
.main .commu_area .list_img .title{height:22px;text-overflow:ellipsis;white-space:nowrap;margin-bottom:10px}
.main .commu_area .list_img .feed p{max-height:135px}
.main .commu_area .list_img p img{display:block;width:220px;height:135px;margin:0 auto}

/* 캐시 아이템 */
.main .cash_area{height:304px;background:#466185;padding-top:66px}
.main .cash_area .title_wrap{position:absolute;top:1px;left:0}
.main .cash_area .title_wrap .btn_cash{display:block;width:153px;height:30px;border:1px solid #7E91AA;color:#d5f0ff;font-size:18px;line-height:32px;padding:0 10px 0 13px}
.main .cash_area .title_wrap .btn_cash:hover{color:#fff}
.main .cash_area .title_wrap .btn_cash span{display:block;background:url("../common/blt_btn_cash.png") 100% 9px no-repeat}
.main .cash_area h2{color:#fff;font-size:70px;margin-bottom:58px}
.main .cash_area h2 span{display:block;color:#ffd451}
.main .cash_area .cash_wrap{overflow:hidden;margin-left:263px}
.main .cash_area .cash_wrap ul{overflow:hidden;margin:0 -32px}
.main .cash_area .cash_wrap li{float:left;background-position:0 -268px}
.main .cash_area .cash_wrap li a{display:block;width:238px;text-align:center}
.main .cash_area li .cash_item{position:relative;width:173px;margin:0 auto}
.main .cash_area li .figure_item{position:relative;height:143px;overflow:hidden;background:#fff;border-radius:100%;padding-top:30px}
.main .cash_area li .figure_item img{display:block;width:85px;margin:0 auto}
.main .cash_area li .figure_item .price{position:absolute;bottom:0;left:0;width:100%;height:54px;line-height:53px;letter-spacing:-1px;font-family:'UniversLTStd', sans-serif;font-size:30px;background:#D5F0FF;color:#4ba5dc}
.main .cash_area li .cash_item .badge{position:absolute;right:0;top:123px;width:47px;height:47px;line-height:51px;font-weight:lighter;font-size:16px;color:#763528;border-radius:100%}
.main .cash_area li .cash_item .badge.new{background:#F6B900}
.main .cash_area li .cash_item .badge.hot{background:#FF7800}
.main .cash_area li dt{font-size:18px;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:break-word;padding:0 10px;margin:16px 0 13px}
.main .cash_area li a:hover dt{color:#fff9d2}
.main .cash_area li dd{font-size:16px;color:#e3ddb1}

/* 하단 영역 */
.main .bottom_wrap{padding:75px 0 58px}
.main .bottom_wrap .container{overflow:hidden}
.main .bottom_wrap .bottom_left{float:left;width:590px;height:565px;border-right:1px solid #F1F1F1;margin-right:44px}
.main .bottom_wrap .bottom_left h2{font-size:40px;color:#44495d}

/* 랭킹 */
.main .ranking_area{padding-right:44px}
.main .ranking_area .title_wrap{overflow:hidden;margin-bottom:21px}
.main .ranking_area h2, .main .ranking_area .tab_menu{float:left}
.main .ranking_area h2{margin-right:37px}
.main .ranking_area .tab_menu{padding-top:15px}
.main .ranking_area .tab_menu ul{overflow:hidden}
.main .ranking_area .tab_menu li{float:left;padding:0 5px;margin-right:9px}
.main .ranking_area table{width:100%;border-top:1px solid #F1F1F1}
.main .ranking_area table td{height:82px;border-bottom:1px solid #f1f1f1}
.main .ranking_area .td_rank{width:101px;padding-left:10px}
.main .ranking_area .td_nick{width:357px;color:#d08924;font-size:25px;line-height:1.1;font-weight:normal}
.main .ranking_area .td_job{font-size:0}
.main .ranking_area .td_job span{vertical-align:middle}
.main .ranking_area .td_job .figure_job{display:inline-block;*zoom:1;margin-right:7px}
.main .ranking_area .td_job .job{font-size:14px;color:#666}

/* 서버 현황 */
.main .state_area{overflow:hidden;margin-top:45px}
.main .state_area h2, .main .state_area dl, .main .state_area dt, .main .state_area dd{float:left}
.main .state_area h2{margin-right:21px;padding-top:3px}
.main .state_area dl{width:124px;height:41px;line-height:44px;overflow:hidden;background:url("../common/spr_bg_state.png") no-repeat;padding:1px 0;margin-right:8px}
.main .state_area dt{width:70px;font-size:18px;padding-left:15px}
.main .state_area dd{width:35px;text-align:center;color:#516563}
.main .state_area dl.constr{background-position:-136px 0}
.main .state_area .constr dd{color:#9e9488}

/* 공감 댓글 */
.main .comment_area{float:right;width:545px;height:564px;border-bottom:1px solid #F1F1F1}
.main .comment_area .title_wrap{position:relative;background:#F8F8F8;min-height:96px;padding:20px 30px 30px 25px}
.main .comment_area h2{height:31px;font-size:26px;background:url("../common/blt_h2_comment.png") no-repeat;padding:1px 0 0 57px;margin-bottom:20px}
.main .comment_area .title_wrap p{width:380px;line-height:21px;word-break:keep-all;color:#666;font-size:18px}
.main .comment_area .title_wrap .btn_comment{position:absolute;top:30px;right:30px;display:block;width:99px;height:86px;line-height:86px;background:#466385;color:#fff;font-size:18px;text-align:center}
.main .comment_area .title_wrap .btn_comment:hover{background:#2b2d35}
.main .comment_area .comment_wrap{position:relative;height:406px;overflow:hidden;background:url("../common/bg_comment.png") 44px 3px no-repeat;padding:11px 0 0 77px}
.main .comment_area li{position:relative;height:62px;border-bottom:1px solid #F1F1F1;padding:8px 0 0 10px;margin-bottom:13px}
.main .comment_area li .comment_job{position:absolute;top:0;left:-62px;border:3px solid #F1F1F1;border-radius:100%;background:#fff;padding:17px}
.main .comment_area li .figure_job{display:block}
.main .comment_area .text_info span{vertical-align:top;line-height:14px}
.main .comment_area .text_info .time{font-size:14px;color:#9e9488}
.main .comment_area .text_info .server{width:33px;height:13px;background:#6C6C6C;font-size:10px;text-align:center;color:#e4e4e4;font-weight:normal;margin:0 3px 0 15px}
.main .comment_area .text_info .nickname{color:#76716c;font-size:12px;font-weight:normal}
.main .comment_area li p{overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;white-space:nowrap;font-size:16px;color:#666;margin-top:8px;padding-left:2px}