@charset "utf-8";
/* All **********************************************************************/
.gb-subTop{position:relative;background:url(img/interface/TEST08.png) no-repeat center bottom;min-height:500px;color:#FFF;z-index:0}
.gb-subTop h1{position: absolute;margin-top: 13px;left: 50%;margin-left: -80px;display: inline-block;*display: inline;z-index: 1000;background: url(../assets/img/TEST4.png) no-repeat top center;background-size: 100%;width: 132px;height: 132px;z-index: 999;}
.gb-subTop h1>a{display:inline-block;zoom:1;*display:inline;width:132px;height:132px}

.gb-subTop h2{margin-top:140px;text-shadow:0 0 5px #000, 0 0 5px #000;/* For IE 8 */*text-shadow:none;*filter:none;color:#FFF}
.gb-subTop p{color:#FFF}

.after_login p.search{position:relative;display:inline-block;zoom:1;*display:inline;background:#FFF;width:90%;padding:4px 2% 6px;height:43px;border:3px solid #999;border-radius:30px;overflow:hidden;*margin-top:3px}
.after_login p.search .txt{float:left;border:0;width:180px;height:16px;font-size:16px;font-size:1.6rem;margin:-5px 0;padding:20px 0}
.after_login p.search .btn{ position:absolute;top:0;right:-2px;width:100px;height:60px;color:#FFF;background:#999;font-family:Impact,Charcoal,sans-serif;font-size:22px;font-size:2.2rem;text-transform:uppercase;margin:-5px 0}


/* Sub Default */
.sub_area{padding:0!important;margin:0!important;text-align:left;display:inline-block;zoom:1;*display:inline;width:100%}
.sub_area>div>*{margin:0 2%;width:96%;padding-bottom:40px}
h3{font-family:Impact, Charcoal, sans-serif;font-size:48px;font-size:4.8rem;text-transform:uppercase;padding:70px 0 40px;border-bottom:none}
h3>em{color:#C00}

.sub_area h4{clear:both;display:inline-block;zoom:1;*display:inline;font-size:20px;font-size:2.0rem;padding-top:50px;color:#960}
.sub_area h4 img{vertical-align:-2px}
.sub_area h5{font-size:16px;font-size:1.6rem;margin-bottom:10px;letter-spacing:-0.05em}
.small{font-size:.8em;font-weight:normal;color:#666}

.sub_area a{color:#666}
.sub_area a:hover{color:#C30}

.tabmenu ul{margin-top:20px}
.tabmenu li{background:#FFF;border:1px solid #666;border-radius:5px;margin-right:10px;margin-bottom:10px}
.tabmenu li:hover,.tabmenu li.on{background:#C00;border:1px solid #C00;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease}
.tabmenu li a:hover,.tabmenu li.on, .tabmenu li.on a{color:#FFF}
.tabmenu li a{display:block;padding:7px 10px 5px; color:#333}

.tabmenu li.on{position:relative;background:#C00;border:1px solid #c00}
.tabmenu li.on:after, .tabmenu li.on:before{top:100%;left:50%;border:solid transparent;content:"";height:0;width:0;position:absolute;pointer-events:none}
.tabmenu li.on:after{border-color:rgba(204, 0, 0, 0);border-top-color:#C00;border-width:10px;margin-left:-10px}
.tabmenu li.on:before{border-color:rgba(204, 0, 0, 0);border-top-color:#c00;border-width:11px;margin-left:-11px}

.tabSub ul{padding:20px 0 10px;text-align:center;border-bottom:1px dashed #CCC;border-top:1px dashed #CCC}
.tabSub li{background:#e4e4e4;border:1px solid #666;border-radius:5px;margin-right:10px;margin-bottom:10px}
.tabSub a{padding:7px 10px 5px;display:block}
.tabSub li:hover,.tabSub li.on{background:#e4e4e4;border:2px solid #C00;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease}
.tabSub li a:hover,.tabSub li.on a{color:#C00}
.tabSub li.on{position:relative;background:#e4e4e4;border:2px solid #C00;font-weight:bold}

.content{display:inline-block;zoom:1;*display:inline;width:100%;padding-bottom:40px}
.content:after{content:"";display:block;clear:both} /* float? ???? ?? */

/* Ranking */
.ranking_top3,.clan_top3{display:none}
.ranking,.clan{position:relative}
.rank_search{position:inherit}

.ranking ul{padding:40px 0 20px;height:20px}
.ranking li{float:left;margin-right:10px}
.ranking li:after{content:"|";color:#CCC;padding-left:5px}
.ranking li:last-child:after{content:""}
.ranking li.on a{color:#C00}

.myInfo_tab{position:relative}
.myInfo_tab ul{padding:40px 0 20px}
.myInfo_tab li{float:left;margin-right:10px}
.myInfo_tab li:after{content:"|";color:#CCC;padding-left:5px}
.myInfo_tab li:last-child:after{content:""}
.myInfo_tab li.on a{color:#C00}

.myInfo_tab .small_btn{margin:0;padding:40px 0 20px;position:absolute;top:0;right:0}

.classic_server{padding:20px 0;font-size:28px;font-size:2.8rem}
.classic_server a{float:left;margin-right:10px}
.classic_server a:after{content:"|";color:#CCC;padding-left:5px}
.classic_server a:last-child:after{content:""}
.classic_server a.on{color:#C00}

#divCountryList select{min-width:250px;width:30%;height:40px;font-size:1em;margin-bottom:10px}


/* Basic Table */
.basic_tb{margin:20px 0;display:inline;font-size:0.7em}
.ranking table,.basic_tb table{width:100%}
.basic_tb table{border-top:2px solid #960;border-bottom:2px solid #960}
.ranking table th,.basic_tb table th{background:url(img/tableBG_th.jpg) repeat center top;border-bottom:2px solid #960;text-align:center;padding:15px 10px 12px}
.ranking table td, .basic_tb table td{text-align:center;padding:10px;border-bottom:1px solid #EDEDED}

.ranking .rank img, #spRTotal img{vertical-align:4px;margin:0 0 0 4px}
.basic_tb table td{padding:0 10px; height:40px}
table td.rank1 img,table td.rank2 img,table td.rank3 img,table td.rank4 img,table td.rank5 img,
table td.rank6 img,table td.rank7 img,table td.rank8 img,table td.rank9 img,table td.rank10 img{margin-left:60px}
table td.rank1{background:url(img/ranking_top10.gif) no-repeat center 2px}
table td.rank2{background:url(img/ranking_top10.gif) no-repeat center -36px}
table td.rank3{background:url(img/ranking_top10.gif) no-repeat center -74px}
table td.rank4{background:url(img/ranking_top10.gif) no-repeat center -112px}
table td.rank5{background:url(img/ranking_top10.gif) no-repeat center -148px}
table td.rank6{background:url(img/ranking_top10.gif) no-repeat center -184px}
table td.rank7{background:url(img/ranking_top10.gif) no-repeat center -220px}
table td.rank8{background:url(img/ranking_top10.gif) no-repeat center -254px}
table td.rank9{background:url(img/ranking_top10.gif) no-repeat center -292px}
table td.rank10{background:url(img/ranking_top10.gif) no-repeat center -328px}

.basic_tb input[type=text], .basic_tb input[type=password]{border:1px solid #999;min-width:120px;width:90%;max-width:670px;height:18px;padding:3px 5px;margin:5px 0}
.basic_tb textarea{min-width:120px;width:90%;max-width:680px;padding:3px 5px;height:100px;margin:5px 0}
.basic_tb table th{border-bottom:1px solid #EDEDED}
.basic_tb table caption{font-size:18px;font-size:1.8rem;text-align:left;padding:10px 0 10px 20px;font-weight:bold}

.basic_tb li{display:inline-block;zoom:1;*display:inline;margin-right:10px; padding:10px 5px}
.basic_tb li span{font-weight:bold; color:#333}
.basic_tb li:after{content:"|";color:#CCC;padding-left:5px}
.basic_tb li:last-child:after{content:""}

.like_btn i{background:url(img/btn_like.gif) no-repeat -37px 0;display:inline-block;zoom:1;*display:inline;width:25px;height:30px; cursor:pointer}
.like_btn .like i{background:url(img/btn_like.gif) no-repeat 0 6px}

.mobile_tb>table{width:100%;min-width:280px}

.comment_area{background:#f0f0f0;padding:20px 10px}
.comment_area textarea{width:95%}
.comment_area ul.list{position:relative;border-bottom:1px solid #CCC; min-height:50px;}
.comment_area ul.list>li{margin-right:20px; min-width:200px; vertical-align:top}
.comment_area ul.list>li.date{color:#999; font-size:11px; font-size:1.1rem}
.comment_area ul.list>li.btn_close{ position:absolute; top:10px; right:10px;float:right;color:#999;font-size:11px;font-size:1.1rem;cursor:pointer; min-width:10px; margin-right:0}
.comment_area img, .basic_tb img{vertical-align:-2px}
.comment{max-width:700px;height:60px;
	-webkit-box-orient:vertical;word-break:break-all;
	-webkit-line-clamp:3;/* text line */
    line-height:1.2em;height:3.6em;/* line-height 1.2em * 5 = 6em */
	overflow:hidden;text-overflow:ellipsis;-o-text-overow:ellipsis;
	-moz-binding:url(/js/ellipsis.xml#ellipsis)undefinedundefinedundefined}


/* Ranking */
.ranking .rank{width:inherit}
.ranking .name, .basic_tb .left{text-align:left}
.ranking .mobile, .basic_tb .mobile{display:none}

.interRank{display:none}

.myInfo{width:100%;margin-top:80px;*margin-top:60px;background:#efefef url(img/myInfo_bg.jpg) no-repeat center top}
.myInfo h4{background:#960 url(img/myInfo_titleBG.jpg) no-repeat left top;text-align:center;padding:15px 0 12px;color:#FFF;width:100%}
.myInfo h5{color:#960}
.myInfo p{text-align:center;padding:0 10px 12px}
.myInfo p.name{padding:25px 10px 12px}
.myInfo ul{padding-left:5%}
.myInfo li{display:inline-block;zoom:1;*display:inline;width:40%;margin-right:5%;margin-bottom:10px;vertical-align:top}

.ranking_tb_page{text-align:center;padding-top:10px}
.ranking_tb_page>li{display:inline-block;zoom:1;*display:inline;float:inherit!important;padding:10px 2px;margin:0!important;background:none!important;width:inherit!important;*width:30px!important;border:0!important}
.ranking_tb_page>li:after{content:none;padding:0px!important}
.ranking_tb_page>li a{display:inline-block;padding:5px 7px;border:1px solid #999}
.ranking_tb_page>li a:hover ,.ranking_tb_page>li.on a{background:#cc0000;border:0px;border:1px solid #cc0000;color:#fff}

.rank_search, .guild_search{clear:both;position:inherit;min-width:280px;width:100%}
.rank_search input[type=text], .guild_search input[type=text]{float:left;border:1px solid #CCC;border-radius:5px;background:#FFF;height:29px;width:68%;margin-right:20px;padding:5px 2%;font-size:18px;font-size:1.8rem;margin-bottom:20px;outline:none;}
.rank_search input[type=button], .guild_search input[type=button]{float:inherit;border-radius:5px;background:#333 url(img/mrg_search.gif) no-repeat 50% 50%;width:48px;height:40px;margin-bottom:20px;cursor:pointer;margin-right: 35px;outline:none;}
.rank_search a, .guild_search a{display:block;text-align:center;color:#666;width:200px}

.guild_search{position:relative;margin-top:30px}

.guild_search select{width:70%;height:40px;font-size:1em;margin-bottom:10px}
.guild_search input[type=text]{width:66%}
.guild_search input[type=button]{position:absolute;right:0;bottom:0}

.guild_search:after{content:"";display:block;clear:both}


/* Clan */
.clan>ul{padding:40px 0 50px;text-align:center;width:100%;position:relative;clear:both}
.clan>ul>li{position:relative;display:inline-block;zoom:1;*display:inline;min-width:280px;width:96%;max-width:300px;margin-right:2.5%;margin-bottom:30px;padding:30px 2% 20px;vertical-align:top;border-right:1px solid #999;border-bottom:3px solid #999;
	background:#efefef url(img/clanList_bg.jpg) no-repeat center top;cursor:pointer;text-align:left}

.clan>ul>li>span.clan_rank{display:inline-block;zoom:1;*display:inline;width:50px;text-align:center;position:absolute;top:26px;left:25px;color:#960;font-size:26px;font-size:2.6rem;font-weight:bold;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clan>ul>li>span.clan_member{display:inline-block;zoom:1;*display:inline;width:40px;text-align:left;position:absolute;top:35px;right:0}
.clan>ul>li>h5{color:#960;text-align:center;font-size:20px;font-size:2rem}
.clan>ul>li>p{font-size:13px;font-size:1.3rem;text-align:center}

.clan_top3 li{margin-left:1%}

.clan_view>ul>li{width:95%;background:#efefef url(img/clanView_bg.jpg) no-repeat left top;cursor:inherit;max-width:inherit;*position:relative}
.clan_view h6{font-size:16px;font-size:1.6rem;text-align:left;margin-top:20px}
.clan_view .pre{background:#FFF;border:#CCC solid 1px;padding:2px;text-align:left;font-size:14px;font-size:1.4rem;line-height:24px;
margin-bottom:10px;height:120px;width:100%;overflow:auto;overflow:auto \9;}

#ulGuildList h5{margin-bottom:30px}
#ulGuildList p{margin-bottom:10px;overflow:hidden;text-overflow:ellipsis;-o-text-overow:ellipsis;-moz-binding:url(/js/ellipsis.xml#ellipsis)undefinedundefinedundefined;word-wrap:break-word;}

#ulGuildList .pre{font-size:13px;background:#FFF;border:#CCC solid 1px;padding:2px;height:150px;overflow:hidden;*position:relative;text-align: center;}

#ulGuildList a{overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;
	text-align:left;color:#8d8d8d;position:relative;-webkit-line-clamp:10;/* text line */
    line-height:1.2em;height:11.8em/* line-height 1.2em * 3 = 3.6em */;max-height:150px;*position:relative}

.text_overflow{overflow:hidden;text-overflow:ellipsis;
-o-text-overow:ellipsis;-moz-binding:url(/js/ellipsis.xml#ellipsis)undefinedundefinedundefined;display:-webkit-box;-webkit-box-orient:vertical;word-wrap:break-word}


/* Download */
.download li{display:inline-block;zoom:1;*display:inline;padding:10px 1%;text-align:center}
.artwork_img li{display:inline-block;zoom:1;*display:inline;padding:10px 1%;text-align:center;vertical-align:top; min-height:160px; max-width:160px;}
.artwork_img li img, .music_list li>img{width:100%;max-width:157px;border:2px solid #CCC}
.artwork_img li div{margin-top:10px}

.music_list li{display:inline-block;zoom:1;*display:inline;width:17.7%;min-width:190px;padding:10px 1%;text-align:center;vertical-align:top}

/* itemShop */
.item_table>ul{width:102%;margin:20px 0 40px;margin-right:-3%;overflow:hidden}
.item_table>ul>li{display:inline-block;zoom:1;*display:inline;min-height:100px;min-width:280px;width:98%;border-bottom:1px solid #ccc;padding:10px 0 5px;vertical-align:top}
.item_table .item_img{float:left;vertical-align:top;display:inline-block;zoom:1;*display:inline;margin-right: 5px;margin-left: 5px}
.item_table>ul>li div{float:none;vertical-align:top;display:inline;zoom:1;*display:inline;}
.item_table>ul>li ul{margin:5px 0 10px}
.item_table>ul>li li{font-size:13px;font-size:1.3rem;color:#999}
.item_table h5{color:#960;display:block;}

.mobile_table .item_img{width:45%;height:140px;margin-top:10px}
.mobile_table>ul>li div{width:53%}
.mobile_table>ul>li div h5{margin-top:5px}

/* GameInfo */
#gameInfo{background:#fdcf94;text-align:left;}
#scenario{background:#6f6f6f;text-align:left;color:#FFF}
#gameInfo>div,#scenario>div{padding:0 1%;width:98%}

#gameInfo h4{color:#930;font-size:22px;font-size:2.2rem;margin-top:20px}
#scenario h4{color:#FC0;font-size:22px;font-size:2.2rem;margin-top:20px}

.beginner>div{border-bottom:1px solid #CCC}
.beginner h4{margin-bottom:40px}
.beginner p{margin-bottom:20px}
.beginner p>img{margin-bottom:10px}
.beginner strong{color:#960;font-weight:bold}

.a_list li{list-style:lower-alpha;margin-bottom:20px;margin-left:30px}
.o_list li{list-style:disc;margin-bottom:20px;margin-left:20px}
.n_list li{list-style:decimal;margin-bottom:20px;margin-left:20px}

.gameinfo_level{border:2px solid #CCC;padding:20px;margin:40px 0} 
.gameinfo_level li{display:inline-block;zoom:1;*display:inline;margin-right:5%;line-height: 15px;} 

/* mobile */
#mobileInfo h3{color:#333;font-size:1.25em;margin:40px 0 10px}
#mobileInfo h4{color:#333;font-size:1em;margin:20px 0 5px}

#mobileInfo ol{width:102%;margin:20px 0 40px;margin-right:-3%;overflow:hidden}
#mobileInfo ol>li{display:inline-block;zoom:1;*display:inline;min-height:100px;min-width:280px;width:98%;border-right:1px solid #eee;padding:20px 0;margin-left:0 !important;margin-bottom:0 !important}
#mobileInfo .item_img{float:left;vertical-align:top;display:inline-block;zoom:1;*display:inline;width:40%;height:100px}
#mobileInfo ol>li ul{float:left;vertical-align:top;display:inline-block;zoom:1;*display:inline;width:60%}
#mobileInfo ol>li li{font-size:13px;font-size:1.3rem;color:#999}

.attr{display:inline-block;zoom:1;*display:inline;width:60%}
.attr>li{background:none;display:block;width:100%;height:20px}
.attr>li:hover{ background:none}

.attr>li em{border-top:ridge #63C 15px;display:inline-block;zoom:1;*display:inline;width:inherit;height:0;margin:0;padding:0;width:15px;margin-right:1px}
.attr>li>span{display:inline-block;zoom:1;*display:inline;width:30%;height:17px;background:url(img/movil_icon.png) no-repeat;padding-left:10%}
.attr>li.attr1 em{border-color:#63C}
.attr>li.attr1>span{background-position:0 0}
.attr>li.attr2 em{border-color:#36C}
.attr>li.attr2>span{background-position:0 -24px;border-color:#36C}
.attr>li.attr3 em{border-color:#C00}
.attr>li.attr3>span{background-position:0 -48px;border-color:#C00}
.attr>li.attr4 em{border-color:#090}
.attr>li.attr4>span{background-position:0 -72px;border-color:#090}
.attr>li.attr5 em{border-color:#990}
.attr>li.attr5>span{background-position:0 -96px;border-color:#990}

/* my Gunbound */
.guildTit .gulidName{padding-bottom:0;width:100%;font-weight:bold}
.guildTit .gulidName>span{ padding:10px; background:#e4e4e4}
.guildTit .basic_btn{padding-bottom:0;width:100%;text-align:right}
.guildTit:after{content:"";display:block;clear:both} 

/* basic Btn */
.basic_btn{padding:20px 0 40px;font-family:Impact,Charcoal,sans-serif;font-size:18px;font-size:1.8rem;letter-spacing:normal}
.basic_btn a{display:block;color:#FFF;background:#960;border-radius:5px;padding:7px 5% 5px;margin-right:10px;margin-bottom:10px;word-break:break-all;text-align:center}
.basic_btn a:hover,.basic_btn a.on{color:#FFF;background:#C00;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease}

.basic_btn a.red{color:#FFF;background:#C00}
.basic_btn a.red:hover{color:#FFF;background:#960}

.basic_btn a.green{color:#FFF;background:#060}
.basic_btn a.green:hover{color:#FFF;background:#330}

.basic_btn a.gray{color:#333;background:#999}
.basic_btn a.gray:hover{color:#333;background:#999}

.small_btn{padding:5px 0}
.small_btn a{display:inline-block;zoom:1;*display:inline;width:23%;color:#666;font-size:12px;font-size:1.2rem;letter-spacing:-0.05em;background:#e4e4e4;border:1px solid #CCC;border-radius:3px;padding:3px 5% 4px;margin-bottom:5px;word-break:break-all;text-align:center}
.small_btn a:hover,.small_btn a.on{color:#FFF;background:#C00;-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;-ms-transition:all 0.5s ease;-o-transition:all 0.5s ease;transition:all 0.5s ease}


.copy a{display:inline-block;zoom:1;*display:inline;background:#f4f4f4;border:1px solid #CCC;padding:7px 1% 5px;word-break:break-all}
.copy span{display:inline-block;zoom:1;*display:inline;background:#C00;border:1px solid #C00;padding:7px 1% 5px;color:#FFF;text-transform:uppercase}


/* Modal Window */
.mw_layer{visibility:hidden;position:fixed;_position:absolute;top:0;left:0;width:100%!important;height:100%!important;z-index:9997}
.mw_layer .bg{position:absolute;top:0;left:0;width:100%;height:100%;background:#000;opacity:.8;filter:alpha(opacity=80);z-index:9998}

.mw_layer .fg{position:absolute;overflow-y:scroll;top:50%;left:50%;background:#FFF;border:2px solid #CCC;padding:20px;width:280px;height:600px;margin:-320px 0 0 -160px;z-index:9999}
.mw_layer .fg h3{font-family:Titillium Web,Verdana, Geneva, sans-serif;font-size:24px;font-size:2.4rem;margin:0;padding:0;text-transform:none}
.mw_layer .fg p{font-size:16px;font-size:1.6rem}
.close{display:inline-block;position:absolute;top:0;right:0;color:#FFF;margin:0;font-size:2em;width:20px;height:20px;background:#333;padding:0;text-align:center}

.mw_layer .fg input{border:1px solid #999; padding:3px 5px}

.item_sub{position:absolute;overflow-y:scroll;top:50%;left:50%;background:#FFF;border:2px solid #CCC;padding:20px;width:280px!important;height:600px!important;margin:-320px 0 0 -160px;z-index:9999}
.item_sub h4{padding-top:20px}
.item_sub h5{margin-top:20px}



/* Tablet & Desktop **********************************************************************/
@media all and (min-width:768px){
/* btn */
.basic_btn a{display:inline-block;zoom:1;*display:inline}

.gb-subTop{min-height:500px;padding:0}
.gb-subTop h1{margin-left: -65px;width: 132px;height: 132px;margin-top: 30px}
.gb-subTop h1>a{width:132px;height:132px}

.gb-subTop h2{margin-top:170px;text-align:center}
.gb-subTop p{text-align:center}

.start-area{position:relative;margin-top:0;height:130px;z-index:1;visibility:visible;/* Permalink - use to edit and share this gradient:http://colorzilla.com/gradient-editor/#feffff+0,a8a8a8+100 */
	background:rgb(237,232,231);/* Old browsers */
	background:-moz-linear-gradient(top,rgba(252,252,252,1) 0%,rgba(237,232,231,1) 100%);/* FF3.6+ */
	background:-webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(252,252,252,1)),color-stop(100%,rgba(237,232,231,1)));/* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top,rgba(252,252,252,1) 0%,rgba(237,232,231,1) 100%);/* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top,rgba(252,252,252,1) 0%,rgba(237,232,231,1) 100%);/* Opera 11.10+ */
	background:-ms-linear-gradient(top,rgba(252,252,252,1) 0%,rgba(237,232,231,1) 100%);/* IE10+ */
	background:linear-gradient(to bottom,rgba(252,252,252,1) 0%,rgba(237,232,231,1) 100%);/* W3C */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc',endColorstr='#ede8e7',GradientType=0) /* IE6-9 */}

.start-area>div{position:relative}
.before_login,.after_login{display:none}

.before_login .btn_gameStart{display:block;position:absolute;right:0;top:-20px;z-index:5;zoom:1;cursor:pointer} 
.before_login p{float:left;min-width:780px;height:95px;margin-top:25px;padding-top:10px;text-align:left;background:url(img/sub_startBG.jpg) no-repeat right bottom}

.after_login{display:block}
.after_login{text-align:center;padding-top:40px;padding-bottom:40px}
.after_login a{display:inline-block;zoom:1;*display:inline;font-family:Impact,Charcoal,sans-serif;text-transform:uppercase;font-size:2.2rem;font-size:22px;line-height:1em;text-align:center;overflow:hidden;z-index:1;color:#333;background:#FFF;width:130px;padding:14px 2% 6px;border:3px solid #333;border-radius:30px}
.after_login a:hover{color:#999}
.after_login p{float:left;float:left;min-width:460px;height:75px;padding-bottom:15px;text-align:left;background:url(img/sub_startBG.jpg) no-repeat right bottom}

.after_login p.search{float:right;position:relative;display:inline-block;zoom:1;*display:inline;background:#FFF;border:3px solid #999;border-radius:30px;overflow:hidden;width:300px;min-width:260px;padding:4px 2% 6px;height:43px;*margin-top:3px}
.after_login p.search .txt{float:left;border:0;width:180px;height:16px;font-size:16px;font-size:1.6rem;margin:-5px 0;padding:20px 0}
.after_login p.search .btn{position:absolute;top:0;right:-2px;width:100px;height:60px;color:#FFF;background:#999;font-family:Impact,Charcoal,sans-serif;font-size:22px;font-size:2.2rem;text-transform:uppercase;margin:-5px 0}

.start-fixed{_position:absolute;position:fixed;top:0;left:0;z-index:999;zoom:1;width:100%}
.start-fixed>div{min-width:998px;max-width:1120px;margin:0 auto}
.start-fixed .btn_gameStart{top:0} 

.start-area:after{content:"";display:block;clear:both}

/* Sub Layout */
.sub_area>div{border-left:1px solid #CCC;border-right:1px solid #CCC}
.out_time{float:right;margin-top:50px}

/* Ranking */
.sub_area h3{background:url(img/sub_titleBG01.jpg) no-repeat right bottom;border-bottom:1px solid #CCC}
.tabmenu li, .tabSub li{display:inline-block;zoom:1;*display:inline;vertical-align:top;}

.ranking_top3{display:block;padding-top:40px}
.ranking_top3 ul{text-align:center}
.ranking_top3 li{display:inline-block;zoom:1;*display:inline;min-width:240px;width:20%;height:100px;padding:172px 5% 0 0;margin-left:5%;text-align:center;border-right:1px solid #DDD;
	background:url(img/ranking_top3_BG.jpg) no-repeat center top}
.ranking_top3 li:last-child{border-right:0}
.ranking_top3 li img{vertical-align:-1px;margin-right:3px}
.ranking_top3 li p{margin-bottom:10px}
.ranking_top3 li p:first-child{color:#FFF;margin-bottom:20px;font-weight:bold}
.ranking_top3 li.rank1{background-position:0 0}
.ranking_top3 li.rank2{background-position:-374px 0}
.ranking_top3 li.rank3{background-position:-732px 0}

.interRank{display:block;padding-top:40px;padding-bottom:20px}
.interRank>div{display:inline-block;zoom:1;*display:inline;min-width:100px;width:14%;height:200px;padding:20px 5% 0 0;margin-left:5%;text-align:center;border-right:1px solid #DDD}
.interRank>div.interRank4{border-right:0}
.interRank>div h4{padding-top:0}
.interRank>div li{padding-bottom:5px}

.ranking .mobile{display:table-cell}
.myInfo_tab{position:relative}
.myInfo_tab ul{display:inline-block;zoom:1;*display:inline}
.myInfo_tab .basic_btn{display:inline-block;zoom:1;*display:inline;float:right;padding-top:30px}

.rank_search{position:absolute;float:right;margin-left:50%;width:50%;top:30px}
.rank_search input[type=text]{float:right;width:40%}
.rank_search input[type=button]{float:right}
.rank_search:after{content:"";display:block;clear:both}

.guild_search{margin-left:50%;width:50%;top:30px}

.guild_search select{width:40%; float:left; margin-right:10px}
.guild_search input[type=text]{width:40%}
.guild_search input[type=button]{float:right}

.classic_server{margin-right:200px}

.comment_area ul.list{position:relative;clear:both;border-bottom:1px solid #CCC;min-height:50px;padding:10px 0 20px}
.comment_area ul.list>li{display:inline-block;zoom:1;*display:inline; margin-right:20px; min-width:200px; vertical-align:top}
.comment_area ul.list>li.date{ position:absolute;left:0;top:40px;color:#999; font-size:11px; font-size:1.1rem}
.comment_area ul.list>li.btn_close{float:right;color:#999;font-size:11px;font-size:1.1rem;cursor:pointer; min-width:10px; margin-right:0}
.comment_area img, .basic_tb img{vertical-align:-2px}
.comment{max-width:700px;height:60px;
	-webkit-box-orient:vertical;word-break:break-all;
	-webkit-line-clamp:3;/* text line */
    line-height:1.2em;height:3.6em;/* line-height 1.2em * 5 = 6em */
	overflow:hidden;text-overflow:ellipsis;-o-text-overow:ellipsis;
	-moz-binding:url(/js/ellipsis.xml#ellipsis)undefinedundefinedundefined}


/* Clan */
.clan_top3{display:block}
.clan_top3 ul{text-align:center}
.clan_top3 li{display:inline-block;zoom:1;*display:inline;min-width:240px;width:20%;height:100px;padding:195px 5% 0 0;margin-left:3%;text-align:center;border-right:1px solid #DDD;
	background:url(img/clan_top3_BG.jpg) no-repeat center top}
.clan_top3 li:last-child{border-right:0}
.clan_top3 li img{vertical-align:-1px;margin-right:3px}
.clan_top3 li p{margin-bottom:10px}
.clan_top3 li p:first-child{margin-bottom:20px;font-weight:bold}
.clan_top3 li.rank1{background-position:0 0}
.clan_top3 li.rank2{background-position:-374px 0}
.clan_top3 li.rank3{background-position:-732px 0}

.clan>ul>li{min-width:280px;width:25%;margin-right:2.5%;padding:30px 2% 20px;min-height:290px}
.clan_view>ul>li{width:95.5%;max-width:1035px;height:auto}

.clan_view .pre {min-height:300px;}

/* Download */
.download li{display:inline-block;zoom:1;*display:inline}
.artwork_img li{display:inline-block;zoom:1;*display:inline;width:22.3%}
.artwork_img li .basic_btn{width:100%}


/* itemShop */
.item_table>ul>li{width:29.65%;border-right:1px solid #ccc;border-left:1px solid #ccc;border-top: solid 1px #ccc;margin-bottom: 5px;margin-right: 2px}
#mobileInfo ol>li{width:29.65%;border-right:1px solid #d7d7d7;margin-right:3%}

/* my Gunbound */
.guildTit .gulidName{display:inline-block;zoom:1;*display:inline;float:left;width:20%;max-width:363px; margin-top:30px}
.guildTit .basic_btn{display:inline-block;zoom:1;*display:inline;float:right;width:50%;max-width:540px}

/* Modal Window */
.mw_layer .fg{width:630px;height:500px;margin:-270px 0 0 -335px}
.item_sub{width:630px!important;height:500px!important;margin:-270px 0 0 -335px}


.basic_tb{display:flex;font-size:1em}
.mobile_tb>table{float:left;width:50%;*width:49%;min-width:280px}
.ranking .mobile, .basic_tb .mobile{display:table-cell}

}

/* Tablet **********************************************************************/
@media all and (min-width:800px) and (max-width:1024px){

/* Ranking */	
.ranking{float:left;width:67%}
.myInfo{float:right;min-width:230px;width:25%}

.artwork_img li{display:inline-block;zoom:1;*display:inline;width:22.3%}

/* itemShop */
.item_table>ul>li{width:46.65%}
#mobileInfo ol>li{width:46.65%}

/* GameInfo */
#gameInfo{width:100%;max-width:none;background:url(img/AboutGB_Introduction.jpg) no-repeat center top;height:900px}
#scenario{width:100%;max-width:none;background:url(img/AboutGB_Scenario.jpg) no-repeat center top;height:1325px}

#gameInfo>div,#scenario>div{max-width:1120px;margin:0 auto;z-index:1}
#gameInfo h3,#scenario h3{padding-top:130px}
#gameInfo .text{width:40%;margin-left:40%;margin-bottom:40px}
#scenario .text{width:56%;margin-left:40%;margin-bottom:40px}
#scenario .sub_title{margin-top:160px}
#scenario .vs{margin-bottom:40px}
#scenario .vs li{display:inline-block;zoom:1;*display:inline;width:30%;margin-left:15%;text-align:center;vertical-align:top}


.comment_area textarea{width:70%}
.comment_area .basic_btn{display:inline-block;width:200px;vertical-align:top;margin:0 0 0 20px;padding:0}
.comment_area .basic_btn a{ width:100%; height:20px; padding:30px 10px}

}
/* Deasktop **********************************************************************/
@media all and (min-width:1024px){
.sub_area{display:block}

/* Ranking */	
.ranking{float:left;width:70%}
.myInfo{float:right;min-width:280px;width:27%}

/* download */
.artwork_img li{display:inline-block;zoom:1;*display:inline;width:14.3%}

/* itemShop */
.item_table>ul>li{width:29.9%;width:29.5% \0;height:140px}
#mobileInfo ol>li{width:29.9%;width:29.5% \0;}

.item_table50>ul>li{width:46%}
.item_table50 .item_img{width:45%}

/* GameInfo */
#gameInfo{width:100%;max-width:none;background:url(img/AboutGB_Introduction.jpg) no-repeat center top;height:900px}
#scenario{width:100%;max-width:none;background:url(img/AboutGB_Scenario.jpg) no-repeat center top;height:1325px}

#gameInfo>div,#scenario>div{max-width:1120px;margin:0 auto;z-index:1}
#gameInfo h3,#scenario h3{padding-top:130px}
#gameInfo .text{width:40%;margin-left:40%;margin-bottom:40px}
#scenario .text{width:56%;margin-left:40%;margin-bottom:40px}
#scenario .sub_title{margin-top:160px}
#scenario .vs{margin-bottom:40px}
#scenario .vs li{display:inline-block;zoom:1;*display:inline;width:30%;margin-left:15%;text-align:center;vertical-align:top}
.beginner .item_table>ul>li{width:43%;width:29.5% \0;padding-left:1%;margin-right:1%;margin-bottom:20px;border-bottom:0px solid #eee;border-right:1px solid #eee;vertical-align:top}

.comment_area textarea{width:70%}
.comment_area .basic_btn{display:inline-block;width:200px;vertical-align:top;margin:0 0 0 20px;padding:0}
.comment_area .basic_btn a{ width:100%; height:20px; padding:30px 10px}
}