/*common css*/
	*{box-sizing:border-box}
    body,ul,li,h1,h2,h3,p,figure{margin:0;padding:0}
	body{position:relative;background:#131414;color:#fff;font-family:'Marcellus SC', serif, Arial, Tahoma , Geneva, Verdana;font-weight:100}
	li{list-style:none}
	a{text-decoration:none;display:block;cursor:pointer;}
	.left{float:left}
	.right{float:right}
	.clear{clear:both}
	button{background:none;color:#fff;border: none;padding:0;text-align: center;text-decoration: none;display: inline-block;margin:0;cursor: pointer;}
	button:focus {outline:0;}
	.button_color a,.button_color{color:#ffe399 !important}
	.section_name{font-size:40px;font-weight:100}
	.polyline_button a{width:201px;height:50px;background-image:url(/img/common/deco_img.png);background-position:-151px -10px;padding-top:14px;}
	
	.fa{font-size:20px !important;}

	#wrap{position:relative;}
	
	#mob_header{display:none;width:100%;background:rgba(0,0,0,0.6);z-index:999;padding:20px;text-align:center}
	#mob_header li{float:left;margin-right:50px}
	#mob_header li:last-child {margin-right:0px}
	#mob_header li a{color:#fff}
	#mob_header>nav{display:inline-block}
	.mob_header_button a{display:inline-block;margin-right: 40px;}
	.mob_gra_logo{display:none;margin:auto;width:593px;padding-top:350px;}

	#sns .fa{color:#fff;font-size:22px !important;}
	
	.play_steam_icon{vertical-align: -3px;margin-right: 10px;}
	
/*sign_in popup css*/
	#signin_wrap{position:fixed;top: 0;background: rgba(13,23,27,.8);width: 100%;height: 100%;overflow: auto;z-index:9999;}
	#signin_popup{display: inline-block;position:relative;background:#fff;color:#000;border-radius:4px;padding:40px;top:50%;left:50%;text-align:center;margin-left:-293px;margin-top:-123px}
	.sign_desc{margin-top:20px;font-size:14px;font-family: 'Roboto', sans-serif;}
	.popup_close{position:absolute;right:10px;top:10px;cursor:pointer}
	.sign_text{font-size:26px}
	#popup_sign_menu button{color:#000 !important ;margin:30px 20px 0 20px}
	#popup_sign_menu .fa-facebook{color:#446ccc}
	#popup_sign_menu .fa-google-plus{color:#f53e3e}
	

/*main css*/
	#top_header{position:relative;background:#191919;width:100%;height:34px;font-family: 'Roboto', sans-serif;font-size:13px;padding:5px 144px 0 144px;text-align:right}
	#sign_menu,#sns{display:inline-block;vertical-align: middle;}
	#sign_menu button{margin:2px 10px}
	#sign_menu>p{padding:5px 10px 0 0}
	#sns{float:right;margin-top:-5px;margin-right:10px}
	#sns li{float:left;margin-left:20px}

	#sign_after_menu>div{display:inline-block;}
	#sign_after_menu p{float:left;margin-left:10px;padding-top:4px}
	#sign_after_menu p img{vertical-align:middle;}
	#sign_after_menu p a{color:#fff}
	#sign_after_menu span{margin-left:10px; margin-right:15px;}

	#fixed_header{display:none;position:fixed;opacity:0;z-index:9999;width:100%;height:110px;background:rgba(0,0,0,.8);;padding:0 144px;}
	#fixed_header nav{padding-top:36px;}
	#fixed_header nav li{margin:0 3%}
	.gra_logo_fixed{margin-top:12px}
	.fixed_button{position:absolute;right:144px;top:44px;font-size:18px;}
	.fixed_button a{float:left;margin-left:60px}

	section{position:relative;height:1080px}
	header{display:inline-block;width:100%;position:relative;top:70px;}
	header .header_menu {position:absolute;left:50%;margin-left:-360px}
	header .header_menu li a{font-size:20px}
	.header_menu li {float:left;margin:0 40px}
	.header_menu li a{color:#fff;font-size:18px}
	.header_menu li a:before{content:url(/img/main/menu_deco_a.png);width:39px;height:39px;vertical-align:-16px;}
	#header_comm{position:absolute;right:150px;top:-10px}
	
	#main_section{background-image:url(/img/main/main_back.jpg)}
	.gra_logo{position:absolute;left:256px;top:273px}
	.coming_text{position: absolute;left: 50%; top: 810px; margin-left: -128px;}
	.play_button a{width:304px;height:82px;position:absolute;left:548px;top:614px;background:url(/img/common/deco_img.png);background-position:left -145px;font-size:29px;text-align:center;padding-top:20px;}
	.play_button a img{vertical-align:bottom;margin-right:10px}
	#side_button{position:absolute;right:0px;top:0;height:100%;padding:300px 100px 0 0 ;text-align:center;background:url(/img/main/side_button_back.png)repeat-y;}
	#side_button li:after{content:url(/img/main/side_button_line.png)}
	#side_button li:last-child:after{content:none}
	#side_button li a{color:#fff;padding:16px 0 2px 0;}

	@keyframes play{
		from {background-position: 0px -7px; }
		to { background-position: -1662px -7px; }
	}
	#header_comm a{padding-left:50px}
	.trailer{position:absolute;left:626px;top:500px;}
	.trailer_play_button{width:170px;height:44px;background-image:url(/img/common/deco_img.png);background-position:-121px -305px;}
	#trailer_window{display:none;background:rgba(0,0,0,.7);width:100%;height:100%;padding:80px;position:absolute;top:0;z-index:999}
	.x_icon{position:absolute;right:10px;top:10px;cursor:pointer}

	#features_section .slick div{height:1080px;background-position:center;outline:none}
	.feature_1{background-image:url(/img/main/feat_1.jpg)}
	.feature_2{background-image:url(/img/main/feat_2.jpg)}
	.feature_3{background-image:url(/img/main/feat_3.jpg)}
	.feature_4{background-image:url(/img/main/feat_4.jpg)}
	.feature_5{background-image:url(/img/main/feat_5.jpg)}
	#features_section .slick-arrow{position:absolute;z-index:998;top:50%;width:139px;height:139px;background-image:url(/img/common/deco_img.png);text-indent:-9999px}
	#features_section .slick-next{right:60px;background-position:left -383px;}
	#features_section .slick-prev{left:60px;background-position:-139px -383px;}
	#features_section .slick-dots{position:absolute;bottom:160px;left:50%;margin-left:-275px;background-image:url(/img/common/deco_img.png);background-position:23px -635px;background-repeat:no-repeat}
	#features_section .slick-dots li{width:50px;height:50px;float:left;margin:0 30px;background-image:url(/img/common/deco_img.png);background-position:-75px -558px;text-indent:-9999px}
	#features_section .slick-dots .slick-active{background-position:-12px -558px !important}

	#news_section{background-image:url(/img/main/news_back.jpg)}
	.fixed_notice_wrap{margin-bottom:40px;}
	.fixed_notice_div{display:inline-block;width:100%;background-color:rgba(38,38,38,0.24);border-left:4px solid #ffdc85;color:#c0af84;padding:16px 12px 16px 25px;cursor:pointer;}
	.fixed_notice_div:hover .fixed_title{color:#ffdc85;}
	.fixed_title{width:76%;font-size:20px;margin-left:48px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;transition:all 0.3s ease;}
	.fixed_date{font-size:13px;line-height: 27px;}
	.fixed_notice_div>img{padding-top: 4px;}
	#news_wrap{position:relative;width:1348px;margin:0 auto;padding-top:160px}
	#news_wrap h3{margin-bottom:35px}
	.new_box_wrap{width:100%;display:inline-block}
	.new_box{position:relative;float:left;width:31%;height:495px;background:rgba(0,0,0,.8);padding:20px; cursor:pointer;}
	.new_box:nth-child(2){margin:0 40px;}
	.new_box button{position:absolute;left:50%;bottom:30px;margin-left:-74.5px;background-image:url(/img/common/deco_img.png);background-position:right -585px;font-family:'Marcellus SC', serif;font-size:18px;padding:4px 26px}
	.box_content,.box_date,.news_contents,.news_date{font-family: 'Roboto', sans-serif;}
	.box_category{padding:10px 0;color:#8e8e8e;}
	.box_Title{font-size:17px;line-height:17px;}
	.box_content{font-size:13px;padding:10px 0;line-height:20px}
	.box_date{float:right;font-size:11px;padding-top:10px}
	.box_img{position:relative;width:100%;height:184px;overflow:hidden;cursor:pointer;text-align:center}
    .box_img img{height:100%;position:absolute;transform: translate3d(-50%, 0, 0);}
	.box_content_height{max-height:162px;overflow:hidden;text-overflow:ellipsis;}
	#all_news{position:absolute;right:26px;bottom:-95px}
	#all_news a{padding-left:60px}

	#support_section{background-image:url(/img/main/support_back.jpg)}
	#support_section .section_inner{width: 36.45833333333333%;margin-left:48.4375%;padding-top:290px}
	#support_section .section_name{padding:0 0 40px 60px}
	#faq_list_wrap{height:400px;}
	#faq_list_wrap .faq{position:relative;height: 65px;padding-left:60px;cursor:pointer}
	.faq_list{margin:20px 0}
	.q_text{position:absolute;left:20px;top:-20px;width:55px;height:55px;background-image:url(/img/common/deco_img.png);background-position:right top;text-indent:-9999px}
	.a_text{position:absolute;left:20px;top:0px;width:55px;height:55px;background-image:url(/img/common/deco_img.png);background-position:-365px top;text-indent:-9999px}
	.faq_con{position:absolute;z-index:997; font-size: 18px;}
	.answer{display:none;position:relative;padding:30px 0 0px 50px;line-height: 13px;font-size: 15px;margin:0 0 80px 20px;text-indent:20px;color:#e2d9ae}
	#ticket{float:right;}
	#ticket a{padding-left:40px}

	footer{position:absolute;bottom:0;width:100%;background:#1c1c22;padding:30px 144px 30px 144px;font-family: 'Roboto', sans-serif;font-size:13px;}
	#privacy{padding-top:6px;}
	#privacy li{float:left;margin-left: 20px;font-weight:400}
	#privacy li a{color:#fff}
	.ltd img{vertical-align:top}
	
	#characters_sections{background-image: url(/img/main/characters_back.jpg);}
	#characters_wrap_main{position:relative;width:1348px;margin:0 auto;padding-top:200px;}
	#main_character_list_wrap{display: inline-block;margin-top: 20px;}
	#main_character_list_wrap ul{display: inline-block;width:100%;}
	#main_character_list_wrap li{width:10%;float:left;margin:6px;}
	#main_character_list_wrap li a{position:relative}
	#main_character_list_wrap li a > img{vertical-align:top;width:100%;max-width:141px;min-width:60px;}
	#main_character_list_wrap li:hover .main_character_name{opacity:1;-webkit-box-shadow: 0px 0px 13px 0px rgba(214,144,214,0.7);-moz-box-shadow: 0px 0px 13px 0px rgba(214,144,214,0.7);box-shadow: 0px 0px 13px 0px rgba(214,144,214,0.7);}
	#main_character_list_wrap li .main_character_name{opacity:0;position:absolute;width:100%;height:100%;padding:10px;background: rgba(0,0,0,0.6);color:#ffe399;transition:all .6s ease;font-size:20px;overflow:hidden}
	.main_character_new_icon{position:absolute;left:6px;top:6px}
	#all_chracters{float:right;margin:50px 20px 0 0}
	#all_chracters a{padding-left:40px}
	
/*sub css*/
	.sub_page_inner{padding:40px 244px 160px 244px;word-break: break-word;} 
	.sub_page_inner a{cursor:pointer;display:inline-block;word-break: break-all;} 
	.sub_header{position:relative;width:100%;height:110px;background:rgba(0,0,0,.6);padding:0 144px;transition:all .4s ease}
	.sub_header nav{padding-top: 36px;margin-left:0}
	.sub_page_name{font-size:24px;font-weight:100;color:#4c5050;}
	
	.sub_sign_menu{position:absolute; right: 20px; top: 17px;}
	.sub_signin{border:1px solid #797979;border-radius: 2px;padding:4px 14px !important;cursor:pointer}
	.sub_signin_button{display:none;position:absolute;top:40px;background: #292629;z-index:999}
	.sub_signin_button button{margin:10px!important;border-radius:2px;padding:4px 18px}
	.sub_signin_button button img{vertical-align:-4px}
	.face_sub{background:#4867aa}
	.google_sub{background:#da4835}
	.sub_mob_logo{position: absolute;top:10px;z-index: 999;}

/*news_list css*/
	.news_category{display:inline-block;font-size:20px;margin:50px 0}
	.news_category li{float:left;margin-right:50px;color:#90866d}
	.news_category .active{color:#ffe399;}

	.news_list_box{height:160px;padding:20px 0;border-bottom:1px solid #272727;cursor:pointer}
	.news_list_box:last-child{border-bottom:0}
	.news_img{position:relative;width:220px;height:110px;background:#000;overflow: hidden;text-align: center;}
    .news_img img{height:100%;position:absolute;transform: translate3d(-50%, 0, 0);}
	.news_text_box{width:900px;margin-left:60px;height:100px;overflow:hidden}
	.news_title{font-size:22px;margin-bottom:10px}
	.news_contents{color:#a5a5a5;font-weight:300;font-size:15px;line-height:20px}
	.news_date{font-size:13px;float:right;margin:10px 0}
	.news_box_category{clear:both;float:right}

	#search {float:right;width:490px;margin-top:40px;z-index:999;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#a5a5a5;}
	#search h1{font-size:20px;font-weight:300;color:#ffdc85;}
	#search i{font-size:20px;margin-right:20px}
	#search input{float:right;position:absolute;z-index:9;margin:2px;background-color:transparent;border:none;width:430px;height:20px;font-size:20px;font-weight:300;outline:none;color:#bbbbbb}

	.page_number{text-align:right;margin-top:90px}
	.page_number ul{display:inline-block}
	.page_number li{float:left;padding:20px}
	.page_number li a{color:#fff}
	.page_number li .active{color:#d876ff}

/*news_view css*/
	#article_wrap{display:inline-block;width:100%;margin:30px 0 200px 0;color:#b7b7b7}
	#article{position:relative;max-width:1054px;width:73.70689655172414%;}
	.status{font-size:28px;margin-right:20px;}
	.status_update{color:#8795ff;padding:0 4px}
	#staff{font-size:14px;}
	#staff span{display: inline-block;position: relative;top: -10px;vertical-align: top;color:#ffe399 ;margin-right:20px}
	#article h1{font-size:26px;margin-bottom:16px;font-weight:100;color:#fff}
	#article_img img{width:100%}

	#top_title{margin-bottom:50px}
	#article_text{margin-top:30px;margin-bottom:100px;font-size:14px;color: #e2e2e2 ;font-family: 'Roboto', sans-serif;}
	#article_text p{line-height:24px}
	#article_text img {max-width:100%}
	
	#latest_articles{position:relative;max-width:330px;background:#202121;width:22.1551724137931%;}
	#latest_articles li{position:relative;padding:14px}
	#latest_articles li a{border-bottom:1px solid #131414;padding:0 10px 10px 10px; display:block;}
	#latest_articles li a p{color:#b7b7b7;}
	#latest_articles li a:hover p{color:#fff}
	#latest_articles li:last-child a{border:none;margin-bottom:0}
	.lastest{width:257px;color:#fff;font-size:22px;font-weight:500;margin:10px 0 14px 10px}
	.side_title{color:#8a8a8a;font-size:14px;overflow: hidden;text-overflow: ellipsis;margin-bottom:10px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;word-wrap: break-word;}
	.side_date{color:#8a8a8a;font-size:11px;text-align:right}
	.side_category{font-size:11px;position:absolute;bottom:24px}
	
	[contenteditable=true]:empty:before {content: attr(placeholder);display: block;color:#bbbbbb;}	
		
	#article_reply {font-family: 'Roboto', sans-serif;font-size:14px;border-top:1px solid #b7b7b7;padding-top:10px}
	#reply_top{margin-bottom:40px}
	.reply_box,.re_reply_box{min-height:37px;}
	.reply_content{display:inline-block;width:calc(100% - 67px);padding-top: 9px; margin-bottom:20px;}
	#article_reply img {width:37px;height:37px;float:left;margin-right:30px}
	.reply_textarea{min-height:37px;margin-bottom: 10px;float:left;border:1px solid #959595;outline:none;padding:9px;;white-space: pre-wrap;word-wrap: break-word;width:calc(100% - 67px);}
	.reply_id{font-weight:600;color:#fff;margin-right:30px}
	.reply_text {color:#fff}
	.reply_date{color:#b7b7b7;margin-left:10px}
	.reply_button{color:#d3bc7f;font-weight:600;vertical-align:top;margin:0 20px}
	#article_reply button i{color:#b7b7b7;font-size:14px;margin:0 4px}
	.button_box{clear:both}

	.re_reply_box_wrap{border-left:1px solid #fff;margin-left:67px;padding-left:14px}
	.reply_more{color:#d3bc7f;font-weight:600;margin:10px 0}

	#reply_road_more{margin-top:40px;border:1px solid #d3bc7f;width:100%;padding:10px 0 ;color:#d3bc7f;font-weight:600}

	.reply_edit_box{padding-top:0;margin-bottom:10px}
	.reply_edit_box .reply_textarea{width:100%}
	.reply_cancel_button{color:#7da7ff ;}

		
/*support ticket css*/	
	#select_server .inner,#account_info .inner,#submit_ticket .inner{display:none}

	.select_box{clear:both;margin-top:50px;position:relative;color:#d6d6d6}
	.select_box:before{content:'';position:absolute;left:16px;top:30px;height:100%;border-left:2px solid #1f1f1f}
	#submit_ticket{margin-bottom:100px;}
	#submit_ticket:before{border:none}
	.select_box ul{display:flex;flex-wrap:wrap;padding:40px 0}
	.select_box li a{background:#282929;padding:10px 30px;margin-left:20px;color:#fff;border-radius:1px;;transition:all .4s ease;margin-bottom:10px;cursor:pointer}
	.select_box li a:hover{background:#9152a5;}
	.type_active{background:#9152a5 !important}
	.select_box h2{position:relative;font-size:24px;;margin-bottom:30px;font-weight:100}
	.select_after{display:none;position:absolute;left:52px;top:4px;font-size:18px;}
	.select_after b{margin-right:30px;font-weight:400}
	.select_box h2 p:first-child{width:36px;height:36px;background:url(/img/common/deco_img.png);background-position:right -193px;color:#fff;font-size:26px;text-align:center;margin-right:20px}
	.select_box h2 p.active{background:url(/img/common/deco_img.png);background-position:right -156px;}
	.inner{position:relative;margin-left:30px}

	#account_info input{width:50%}
	.submit_ticket_inner{display:none;}
	.type_select{padding:0 !important;margin-top:20px}
	.type_select li a{font-size:14px;color: #fff;border-radius: 1px;font-weight: 300;transition: all .4s ease;cursor: pointer;}
	
	.canyou{display: inline-block;width:173px;height:38px;background-image:url(/img/common/deco_img.png);background-position:right -105px;color:#d3bc7f;margin:30px 10px 10px 0;font-size:16px;padding:8px 0 0 16px;}
	.canyou_des{font-size:15px;margin-left:10px;font-family: 'Roboto', sans-serif;}
	.canyou_des .fa{font-size:10px;vertical-align:text-top;color:#d3bc7f}
		
	input[type=text],.support_textarea{border:none;border-bottom:1px solid #e2e2e2;background:#131414;;margin:10px;font-size:16px;width:100%;color:#fff;font-family: 'Roboto', sans-serif, Arial, Tahoma , Geneva, Verdana;font-weight:400}
	input:focus {border-bottom:1px solid #9152a5}
	.support_textarea:focus{border-bottom:1px solid #9152a5}
	.support_textarea img{max-width: 100%;}
	div.inner{padding:20px 0 30px 60px;font-size:20px;font-weight:300}
	input,.support_textarea:focus{outline:none}
	input:focus::-webkit-input-placeholder { color:transparent; }
	input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
	input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
	input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */
	#insert_image{margin-left:10px;}
	#insert_image a{min-width: 124px; text-align: center; padding:6px 16px;line-height:20px;cursor:pointer;font-size:16px;color:#d3bc7f;border: 1px solid #d3bc7f;display: inline-block;}
	#insert_image label{cursor:pointer;}
	.image_des{font-size:12px;margin:10px;font-family: 'Roboto', sans-serif;}
	#next_button{margin-top:30px}
	#next_button a{display:inline-block;padding:14px 48px;background:#282929;border-radius:1px;color:#fff;transition:all .2s ease-in-out;font-size:14px}
	#submit_button{margin-left:10px;}
	#submit_button a{display:inline-block;padding:14px 48px;background:#9152a5;border-radius:1px;color:#fff;transition:all .2s ease-in-out;font-size:14px}

	.button_text .fa-spinner{font-size: 20px;margin: 0 23.8px;}
		
	.arrow_box {display:none;position: relative;background:#282929;border-radius:1px;margin:20px 0 20px 10px;padding:10px 20px;font-size:13px;font-weight:400;color:#9152a5;font-family: 'Roboto', sans-serif;}
	.arrow_box:after, .arrow_box:before {bottom: 100%;left: 40px;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
	.arrow_box:after {border-color: rgba(136, 183, 213, 0);border-bottom-color: #282929;border-width: 10px;margin-left: -10px;}
	.arrow_box:before {border-width: 13px;margin-left: -13px;}	
	
	.account_arrow_box{width:50%;font-size:16px;color:#e89eff ;}
	.account_arrow_box img{display:block; margin-bottom:10px;max-width:100%}

/*My ticket css*/	
	#ticket_top{display:inline-block;width:100%;background:#322933;color:#fff;;margin-bottom:4px}
	.ticket_box{color:#d2d2d2;margin-bottom:4px;font-family: 'Roboto', sans-serif;border-bottom:1px solid #322933;font-size:14px;}
	.ticket_box ul{cursor:pointer}
	.ticket{padding:10px 20px;border-radius:1px;}
	.ticket li{margin-left:5px;white-space: nowrap;overflow: hidden;}
	.ticket li:first-child{margin-left:0}
	#ticket_top>ul,.ticket_box>ul{display:flex}
	#ticket_top>ul>li,.ticket_box>ul>li{flex:1;height:20px}
	#ticket_top>ul>li:nth-child(3){flex:2}
	.ticket_box>ul>li:nth-child(3){flex:2}
	.ticket_status{display:inline-block;position:relative;top:-6px;width:120px;background:#282929;border-radius:1px;padding:6px 20px;text-align:center}
	.answered{background:#47ab99}
	.inprogress{background:#ecc80a;color:#000}
	.reply_wrap{margin-top:20px;margin-left:10px;}
	.rating_reply{display:flex;width:100%}
	.rating_reply>div{width:100%;background:#816684;;border-radius:1px;flex:1;padding:8px 30px;color:#fff;transition:all .5s ease;}
	.star_wrap li{float:left}
	.star-fill{color:#ffcc00 !important}
	#rating{margin-right:10px}
	.rep_date{font-size:12px;float:right}
	.rep_text{margin-top:10px}
	.textarea{border:none;border-bottom:1px solid #fff;;background:#816684;;margin:10px;font-size:16px;width:100%;}
	.reply_input{display:none}
	.reply_input a{display:inline-block;color:#bbbbbb;margin:10px 30px;}
	.submit{color:#fff !important}

	.ticket_detail{display:none;font-size:14px;margin-top:30px;line-height:20px;}
	.submit_text{border-bottom:1px solid #fff;cursor:pointer}
	.star_wrap li i:hover{color:#ffcc00}
	.date_edt{text-align:right;font-size:14px;}

	.ticket_arrow_box {position: relative;background: #131414;border: 2px solid #2f2f2f;border-radius:2px;margin:20px 0;padding:30px 20px;font-size:14px;}
	.ticket_arrow_box:after, .ticket_arrow_box:before {bottom: 100%;left: 40px;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
	.ticket_arrow_box:after {border-color: rgba(78, 78, 78, 0);border-bottom-color: #131414;border-width: 11px;margin-left: -11px;}
	.ticket_arrow_box:before {border-color: rgba(255, 255, 255, 0);border-bottom-color:#2f2f2f;border-width: 14px;margin-left: -14px;}

	.user_arrow_box {position: relative;background:#2f2f2f;border-radius:2px;margin:20px 0;padding:30px 20px;font-size:14px;}
	.user_arrow_box:after, .user_arrow_box:before {bottom: 100%;left: 40px;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
	.user_arrow_box:after {border-color: rgba(58,62,62, 0);border-bottom-color: #2f2f2f;border-width: 10px;margin-left: -10px;}
	.user_arrow_box:before {border-width: 13px;margin-left: -13px;}

/*founders pack*/	
	#founders_button{position:absolute;right:0px;top:230px;box-shadow:0px 0px 15px #444a5d;;transition:all 1s ease;}
	#founders_button:hover{box-shadow:0px 0px 20px #757f9e;}
	#founders_button img{display:block}
	
/*family name change*/	
	#change_name_button{position:absolute;right:0;top:390px;box-shadow:0px 0px 15px #444a5d ;;transition:all 1s ease;} 
	#change_name_button:hover{box-shadow:0px 0px 20px #757f9e ;}
	#change_name_button img{display:block}	
	
/*github*/	
	#git_button{position:absolute;left:40px;top:770px;}

	@media screen and (max-width:1800px) {
		.sub_page_inner {padding: 40px 7% 160px 7%;}
		#fixed_header{padding:0 40px}
		.fixed_button {right:50px}
	}
	
	@media screen and (max-width:1500px) {
		.sub_header {padding: 0 40px;}
		.gra_logo_fixed{margin-top: 20px;}
		.gra_logo_fixed img{width:280px}
		.fixed_button {right:20px}
		.fixed_button a{margin-left:20px}
		
		/*main css*/
		#header_comm{right: 50px;}
		#news_wrap{padding:180px 20px 0 20px;width:100%;}
		.box_img{max-width:380px;width:100%;}
		.new_box:nth-child(2){margin:0 3%;}
		#support_section {background-position:-200px top;transition:all 1s ease}
		#support_section .section_inner {width: 46.45833333333333%;margin-left: 46.4375%;}
		
		/*news css*/
		.news_text_box {width: 66%;}

		/* character */
		#characters_wrap_main{width:100%;padding:180px 20px 0 20px}	
	}
	@media screen and (max-width:1200px) {
		#sign_after_menu span{display:none}
		#sign_after_menu p {margin-left:10px}
		.sub_mob_logo img{width:180px}
		footer{padding: 30px 20px 30px 20px;}
		#sns .fa{font-size:26px;}
		.sub_header{display:none}
		#mob_header,.mob_gra_logo{display:block}
		#top_header{position:absolute;background:none;z-index:998;top:-48px;right:0;padding:0 20px 0 0}
        .sub_top_header{top:16px!important}
        
		/*main css*/
		section{height:auto;}
		header,.gra_logo,.play_button,.fixed_button {display:none}
		#fixed_header{height:60px;top:0;padding: 0 20px;}
		#fixed_header nav {padding-top: 17px;text-align:center}
		#fixed_header nav ul{display:inline-block}
		#fixed_header nav li {margin: 0 10px;}
		.header_menu li a:before{content:none;}
		.gra_logo_fixed{display:none}
		#mob_header,.mob_gra_logo{display:block}
		.mob_gra_logo,.mob_gra_logo img{max-width:593px;width:100%}
		#main_section {background-image:url(/img/main/mob_main_back.jpg);background-position:center top;height:800px;}
		.trailer{width:0;left:50%;margin-left:-79px;}
		.trailer_play_button{width:159px;height:177px;background-position:-318px -293px;margin:auto}
			
		#news_wrap{padding:60px 20px 140px 20px;}
		#all_news {bottom:40px}
		#news_wrap h3 {margin-bottom: 40px;}

		#support_section {background-image: url(/img/main/mob_support_back.jpg);}
		#support_section .section_inner {min-height:900px;margin-left:0px;width:100%;padding:50px 10px 220px 10px}
		#ticket {margin:30px 20px 30px 0}
		#faq_list_wrap{background: rgba(0,0,0,0.5);border-radius: 4px;padding-top: 20px;}
			
		.coming_text{top:640px;}
		
		#side_button{padding:40px 0 0 0;width:260px;}
        #side_button li a{padding:10px 0 0 0;}
        
		/*news list css*/
		.news_text_box{margin-left: 20px;}
		.news_text_box {width:50%;}
		.news_title {font-size:20px;line-height: 18px;}	
		
		/*news css*/
		#article{width:73.70689655172414%}
		#latest_articles{width:22.1551724137931%}
		
		/*myticket css*/
		.ticket_status {width:100%;padding:6px 0 }

		.feature_1{background-image:url(/img/main/feat_1_mob.jpg)}
		.feature_2{background-image:url(/img/main/feat_2_mob.jpg)}
		.feature_3{background-image:url(/img/main/feat_3_mob.jpg)}
		.feature_4{background-image:url(/img/main/feat_4_mob.jpg)}
		.feature_5{background-image:url(/img/main/feat_5_mob.jpg)}
		
		/*founders pack*/	
		#founders_button{top:30px}
		#founders_button img{width:200px}

		/*family name change*/	
		#change_name_button{top:150px}
		#change_name_button img{width:200px}
		
		/*github*/	
		#git_button{top:700px;left:40px}
		
		/* character */
		#characters_wrap_main{padding:100px 20px 100px 20px}	
	}
	
	@media screen and (max-width:1080px) {
		#top_header{padding:0 20px 0 0;top:-99px;}
		#mob_header{padding:70px 20px 20px 20px;}
		
		#main_character_list_wrap li{width:13%;}
	}
	
	@media screen and (max-width:910px) {
		#sns{clear:both;margin-top:10px}
		
		/*news css*/
		#latest_articles{display:none}
		#article{width:100%}
			
		/*support css*/
		div.inner {padding: 20px 0 30px 30px;}
		#account_info input {width:100%;}
		
		.account_arrow_box{width:100%}	
	}
	
	@media screen and (max-width:820px) {
		#privacy li{margin-bottom:10px}
		
		#main_character_list_wrap li .main_character_name {padding:6px;font-size:14px}
		
		/*news css*/
		.fixed_notice_div {padding: 8px 8px 8px 16px;}
		.news_img{display:none}
		.news_text_box {width:100%;margin-left:0}
		.news_date,.news_box_category,.news_text_box {float:none}
		.news_list_box {height:auto}
		.news_title {font-size:18px;line-height: 17px;}
		.page_number{margin-bottom:60px}
		.news_category li {margin-bottom:20px}
	
	}
	
	@media screen and (max-width:650px) {
		/*main css*/
		#mob_header li {margin-right: 20px;}
		#news_wrap h3{text-align:center}
		.new_box_wrap {display: block; margin: auto;width: 417.88px;}
		.new_box {float:none;height:400px;width:417.88px;margin-bottom: 30px;}
		.new_box:nth-child(2){margin:0 0 30px 0;}
		.box_content_height {max-height:62px}
		#trailer_window {padding:50px 10px}
		#top_button{right:20px;margin-right:0}
		#features_section .slick-next{right:30px;background-position:-419px -494px;}
		#features_section .slick-prev{left:30px;background-position:-353px -494px;}
		#features_section .slick-arrow {width:57px;height:57px;} 
		#features_section .slick-dots {margin-left: -155px;background-position: 0px -692px;}
		#features_section .slick-dots li {margin:0 6px;cursor: pointer;}
		
		#side_button{padding:10px 0 10px 0;width:100%;height:auto;background:rgba(0,0,0,0.8);margin-top:520px;z-index:990}

        .mob_gra_logo{padding-top:100px}
        .trailer {top:320px;}
		
		/*news list css*/
		#search{width: 100%;}
		#search input{width:70%}
			
		/*myticket css*/
		.ticket_status {text-indent:-9999px;width: 22px;padding: 6px 0;margin-left: 10px;}
		
		/*support css*/
		div.inner {padding: 20px 0 30px 0px;margin-left:10px}
		.select_box li a img {margin-top:10px;}
		.select_box:before{display:none}
		div.inner{margin-left:0}
		
		#signin_wrap {padding:0 10px}
		#signin_popup {left:0;top:0;margin-left:0;margin-top:200px}
	}
	@media screen and (max-width:500px) {
		#mob_header {padding: 70px 10px 20px 10px;}
		.sub_mob_logo img {width:160px}
		#sign_menu>p{padding:7px 0}
		#sign_menu .fa{font-size:26px}
		#mob_header li {margin-right:10px;}
		footer {padding: 30px 20px 80px 20px;}
		#sns{margin-top:20px;margin-left:0;float:left}
		#privacy li{margin:0 10px 10px 0}
		.ltd{float:left;margin-top: 10px;}
		#imc{position:absolute;left:50%;margin-left:-66px;bottom:20px}
		
		/*main css*/
		.box_img{max-width:380px;width:100%;height:170px;}
		.box_content_height {max-height: 100px;}
		.new_box,.new_box_wrap {width:100%}
		#news_wrap h3 {margin-bottom:40px}
		.x_icon img{width:40px}

		.faq_con{font-size: 14px;}
		
		#main_section{background-position:center}
    
        .mob_gra_logo{display:none;}
        
        #main_character_list_wrap li{width:21%;margin:2%}
	}

input[type="file"] { 
	position: absolute; 
	width: 1px; 
	height: 1px; 
	padding: 0; 
	margin: -1px; 
	overflow: hidden; 
	clip:rect(0,0,0,0); 
	border: 0; 
}

