*{margin: 0;padding: 0;-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;}
.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden}
.clearfix{*zoom:1}
ul{list-style-type:none;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,i,b{margin:0;padding:0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
table{border-collapse:collapse;border-spacing:0}
audio,canvas,video { display: inline-block;*display: inline;*zoom: 1;}
fieldset,img{border:0}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
q:before,q:after{content:''}
abbr,acronym{border:0;font-variant:normal}
sup{vertical-align:text-top}
sub{vertical-align:text-bottom}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}
input,textarea,select{*font-size:100%}
img{border:0; vertical-align:top;}
/*body{ font-size:24px;font-family:"Microsoft yahei"; margin:0; width:100%; height:100%; background-color: #100f37;}*/
body{ margin:0; width:100%; height:100%; background-color: #081929;}
body{ font: 14px/1.75 -apple-system, "Helvetica Neue", Helvetica, Arial, sans-serif;}
html { width: 100%; height: 100%; min-height: 11rem;}
a { -webkit-tap-highlight-color:rgba(0,0,0,0); text-decoration:none;}
.fl_left { float:left;}
.wrapper { width: 7.5rem; height: 100%; position: relative;}
/*foot*/
.foot{font-size: 12px;text-align: center;padding: 20px 0;background: #000;color: #fff;}
.foot a{color: #fff;text-decoration: none;}
/*sprite*/
.spr { background-image: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/spr.png); background-repeat: no-repeat; background-size: 10.53rem 5.11rem; }

.spr.catalog { width:1.84rem; height:3.95rem; background-position:54.54545% 8.62069%; }
.spr.catalog_close { width:0.32rem; height:1.35rem; background-position:99.02057% 2.65957%; }
.spr.catalog_next { width:0.4rem; height:0.4rem; background-position:67.12734% 84.28875%; }
.spr.catalog_next.swiper-button-disabled { width:0.4rem; height:0.4rem; background-position:72.06318% 84.28875%; }
.spr.catalog_open { width:0.32rem; height:1.35rem; background-position:96.47405% 83.24468%; }
.spr.catalog_prev { width:0.4rem; height:0.4rem; background-position:76.99901% 84.28875%; }
.spr.catalog_prev.swiper-button-disabled { width:0.4rem; height:0.4rem; background-position:81.93485% 84.28875%; }
.spr.comm_btn_bg.hover { width:2.45rem; height:0.64rem; background-position:82.67327% 55.7047%; }
.spr.comm_btn_bg { width:2.45rem; height:0.64rem; background-position:82.67327% 72.25951%; }
.spr.comm_btn_l.hover { width:0.42rem; height:0.08rem; background-position:46.88427% 87.07753%; }
.spr.comm_btn_l { width:0.42rem; height:0.08rem; background-position:52.0277% 87.07753%; }
.spr.comm_btn_r.hover { width:0.42rem; height:0.08rem; background-position:57.17112% 87.07753%; }
.spr.comm_btn_r { width:0.42rem; height:0.08rem; background-position:62.11672% 82.50497%; }
.spr.icon2 { width:0.14rem; height:0.15rem; background-position:66.89124% 96.57258%; }
.spr.icon_collection.done { width:0.91rem; height:0.91rem; background-position:91.89189% 94.52381%; }
.spr.icon_collection { width:0.91rem; height:0.91rem; background-position:94.59459% 2.38095%; }
.spr.icon_like.done { width:0.91rem; height:0.91rem; background-position:94.59459% 26.42857%; }
.spr.icon_like { width:0.91rem; height:0.91rem; background-position:95.94595% 50.47619%; }
.spr.ind_btn { width:1.55rem; height:0.52rem; background-position:80.06682% 97.38562%; }
.spr.ind_tab_btn.cur { width:1.75rem; height:0.45rem; background-position:1.13895% 97.85408%; }
.spr.ind_tab_btn { width:1.75rem; height:0.45rem; background-position:22.20957% 97.85408%; }
.spr.index_list { width:2.32rem; height:2.29rem; background-position:81.36419% 3.5461%; }
.spr.login_tips_em { width:1.02rem; height:0.15rem; background-position:58.56993% 96.57258%; }
.spr.more_em { width:0.16rem; height:0.17rem; background-position:64.51302% 96.96356%; }
.spr.page1_line1 { width:1.44rem; height:0.13rem; background-position:52.14521% 83.33333%; }
.spr.page1_line2 { width:1.44rem; height:0.13rem; background-position:61.27613% 91.56627%; }
.spr.page2_upload { width:1.67rem; height:0.44rem; background-position:42.88939% 97.64454%; }
.spr.works_layer1 { width:2.22rem; height:4.36rem; background-position:1.20337% 13.33333%; }
.spr.works_layer2 { width:2.22rem; height:4.36rem; background-position:29.12154% 13.33333%; }

.comm_header { background: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/comm_header.jpg) no-repeat center top; background-size: 100% 100%; width: 100%; height: .78rem; border-bottom: 0.02rem solid #3a5e90;}
.header_logo { background: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/header_logo.png) no-repeat 0 0; background-size: 100% 100%; width: 3rem; height: .78rem; float: left;}
.header_logo a { display: block; float: left; height: .78rem;}
.header_link1 { width: 1.35rem;}
.header_link2 { width: 1.4rem;}
.header_login { float: right; margin-right: 0; width: 4rem; height: 100%; color: #2a537c; font-size: .24rem; line-height: .3rem;}
.login_before { text-align: right; padding-top: .24rem;}
.header_login a { color: #2a537c;}
.header_login a:hover { color: #ec4828;}
.login_after { float: right; width: 1.3rem; height: .78rem; position: relative;z-index: 99;}
.login_btn { width: 1.3rem; height: .78rem; padding-top: .16rem; text-align: center; cursor: pointer; overflow: hidden; color: #2a537c; font-weight: bold;}
.login_btn span { transform: scale(0.6); display: block; position: relative; top: -0.04rem; letter-spacing: 0.04rem; width: 180%; margin-left: -40%; font-weight: normal;}
.login_tips { width: 1.02rem; height: auto; position: absolute; left: 50%; margin-left: -0.51rem; top: .78rem; background-color: #29456b; padding: .1rem 0 .06rem 0; display: none;}
.login_tips a { display: block; line-height: .38rem; width: 100%; text-align: center; color: #70a1d2; font-size: .2rem;}
.login_tips i { display: block; border-top: 1px solid #486588; border-bottom: 1px solid #20385b; width: .78rem; height: 0; margin: 0 auto;}
.login_tips_em { position: absolute; top: -0.1rem; left: 0;}
.login_tips_show .login_tips { display: block;}
/*index*/
.index_cont { background: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/bg1.jpg) #081929 no-repeat center top; background-size: 7.5rem 19.2rem; width: 100%; height: auto; min-height: 100%; overflow: hidden; padding-top: .8rem;}
.main { width: 100%; height: auto; margin: 0 auto; position: relative; z-index: 2;}
.index_tab_btns { width: 100%; height: auto; overflow: hidden; padding-bottom: .68rem; padding-left: .14rem; text-align: center;}
.index_tab_btns a { float: left; color: #6fa1d2; line-height: .45rem; margin-right: .08rem; position: relative; z-index: 2; font-size: .22rem;}
.index_tab_btns a.cur { color: #deeeff;}
.index_item { width: 100%; height: auto;}
.index_item_top { width: 100%; height: auto; padding-bottom: .54rem; position: relative;}
.partT{display: flex;justify-content: space-around;}
.cartoon_pic { position: relative; width: auto; height: 4.5rem; overflow: hidden; border: 1px solid #3c81c7; }
.cartoon_pic img { display: block; width: auto; height: 100%;}
.cartoon_pic span { width: 1.2rem; height: .25rem; line-height: .25rem; position: absolute; left: -0.34rem; top: .12rem; color: #ffe4df; font-size: .18rem; background-color: #ae5e4e; text-align: center; transform: rotate(-45deg);}
.cartoon_info {  width: 3.3rem; height: auto;}
.cartoon_info_itme1 { width: 100%; height: auto; padding-bottom: .2rem;}
.cartoon_info_itme1 h5 { width: 120%; height: .38rem; line-height: .38rem; margin-top: -0.08rem; color: #deeeff; font-size: .26rem; margin-bottom: .32rem;}
.cartoon_info_itme1 h5 span { font-weight: bold; margin-right: .2rem; float: left;}
.cartoon_info_itme1 h5 i { float: left; margin-top: .13rem;}
.cartoon_info_itme1 p { width: 100%; color: #deeeff; font-size: .2rem; line-height: .36rem; margin-bottom: .18rem;}
.cartoon_info_itme1 p b { color: #70a1d2; font-weight: bold;}
.comm_btn_box { text-align: center; font-size: 0;}
.comm_btn_box a { display: inline-block; vertical-align: top; text-align: center; position: relative; width: 2.45rem; height: .64rem;}
.cartoon_info_itme2 { width: 6rem; height: 1.02rem; text-align: left;}
.cartoon_info_itme2 a { margin-right: .16rem;}
.comm_btn_box a em { display: inline-block; vertical-align: top; position: relative; z-index: 2; margin-top: .24rem;}
.comm_btn_box a span { display: inline-block; vertical-align: top; position: relative; z-index: 2; padding: 0 .2rem; line-height: .55rem; color: #6391bf; font-size: .22rem;}
.comm_btn_box a em.comm_btn_bg { position: absolute; z-index: 1; left: 0; top: 0; margin-top: 0;}
.comm_btn_box a.hover span { color: #fff3f1;}
.cartoon_info_itme2 a span { line-height: .47rem;}
.cartoon_info_itme3 { width: 100%; height: auto; overflow: hidden; position: relative; margin: .2rem 0 0 0;}
.cartoon_info_itme3 ul { width: 140%; margin-left: -20%; font-size: 0; text-align: center;}
.cartoon_info_itme3 li { display: inline-block; vertical-align: top;  margin: 0 .72rem; font-size: .2rem;}
.cartoon_info_itme3:after { content: ""; background: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/cartoon_info_line.png) no-repeat 0 0; background-size: 100% 100%; width: 0.03rem; height: 2.43rem; position: absolute; left: 50%; margin-left: -0.1rem; top: 0;}
.index_list h5 { padding-top: .3rem; line-height: .26rem; color: #deeeff; text-align: center;}
.index_list a { display: block; margin: .12rem auto;}
.index_list p { line-height: .26rem; color: #70a1d2; text-align: center;}
.index_works { width: 100%; height: auto; padding-bottom: .68rem;}
.index_works_title { width: 100%; height: .94rem; line-height: .6rem; position: relative; width: 120%; margin-left: -10%; font-size: 0; text-align: center;}
.index_works_title p,.index_works_title em { display: inline-block; vertical-align: top; color: #deeeff; font-size: .3rem; font-weight: bold;}
.index_works_title em.page1_line1,.index_works_title em.page1_line2 { margin: 0.22rem .2rem 0;}
.index_works_cont { width: 100%; height: auto; overflow: hidden;}
.index_works_cont ul { width: 120%; padding-left: .15rem;}
.index_works_cont li { float: left; margin: 0 .2rem .5rem 0; width: 2.22rem; height: auto; position: relative; border: 1px solid #3c81c7; overflow: hidden;}
.index_works_cont li.highlight:after { content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 5; pointer-events: none; box-shadow: inset 0 0 .3rem #3f88d2; -webkit-animation: xing 2s linear infinite; animation: xing 2s linear infinite;}
@-webkit-keyframes xing {  
   0% { box-shadow: inset 0 0 30px #3f88d2;}
   50% { box-shadow: inset 0 0 60px #5cb8ff;}
   100% { box-shadow: inset 0 0 30px #3f88d2;}
}
@keyframes xing {  
   0% { box-shadow: inset 0 0 30px #3f88d2;}
   50% { box-shadow: inset 0 0 60px #5cb8ff;}
   100% { box-shadow: inset 0 0 30px #3f88d2;}
} 
.index_works_cont li a { position: relative; display: block; width: 2.22rem; height: auto; overflow: hidden;}
.index_works_cont li img { display: block; width: 2.22rem; height: auto;}
.index_works_cont li span { width: 1rem; height: .25rem; line-height: .25rem; position: absolute; z-index: 3; left: -0.23rem; top: 0.12rem; color: #ffe4df; font-size: .18rem; background-color: #ae5e4e; text-align: center; transform: rotate(-45deg);}
.index_works_cont li h5 { position: absolute; z-index: 3; left: .08rem; bottom: .44rem; width: 2.16rem; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; color: #deeeff; font-size: .22rem; line-height: .32rem; text-align: left; font-weight: bold;}
.index_works_cont li p { position: absolute; z-index: 3; left: .08rem; bottom: .12rem; width: 2.16rem; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; color: #75a7d9; font-size: .2rem; line-height: .3rem; text-align: left;}
.works_layer1,.works_layer2 { position: absolute; left: 0; bottom: 0; pointer-events: none;}
.works_layer2 { display: none;}
.index_works_cont li:hover .works_layer1 { display: none;}
.index_works_cont li:hover .works_layer2 { display: block;}
.index_more { width: 100%; height: auto;}
.btn-load-more-end{display: none;}
.index_more .btn-load-more { display: block; background-color: #1e3751; border-top: 1px solid #274d72; width: 100%; height: .79rem; line-height: .79rem; text-align: center; color: #deeeff; font-size: .2rem;}
.index_more a em { display: inline-block; vertical-align: top; position: relative; margin: 0.28rem 0.07rem 0;}
/*page1*/
.page1_cont { background: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/bg2.jpg) #081929 no-repeat center top; background-size: 7.5rem 10rem; width: 100%; height: auto; min-height: 100%; overflow: hidden;}
.page1_title { padding: .64rem 0 0; width: 100%; height: 1.58rem; line-height: .6rem; position: relative; width: 120%; margin-left: -10%; font-size: 0; text-align: center;}
.page1_title a,.page1_title span,.page1_title em { display: inline-block; vertical-align: top; color: #deeeff; font-size: .3rem; font-weight: bold;}
.page1_title em.page1_line1,.page1_title em.page1_line2 { margin: 0.22rem .2rem 0;}
.page1_title em.icon2 { margin: .24rem .08rem 0;}
.page1_title a:active { color: #fff;}
.page1_cartoon { width: 6.48rem; height: auto; margin: 0 auto; padding-bottom: .5rem;}
.page1_cartoon img { display: block; width: 100%; height: auto;}
.cartoon_lists { width: 100%; height: 1.12rem; text-align: center;}
.cartoon_lists a { margin: 0 .32rem;}
.catalog { position: fixed; left: 0; top: 50%; margin-top: -1.98rem; z-index: 99; transition: all .3s;width: 3.8rem;background: url('https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/bg_nav.png') no-repeat center 0;background-size: cover;height: 5.8rem;}
.catalog_top { width: 100%; height: 1.2rem;}
.catalog_roll { width: 3.8rem; height: 4rem; margin: 0 auto; overflow: hidden;}
.catalog_roll li { width: 100%; height: .46rem; line-height: .46rem;}
.catalog_roll li a { display: block; width: 100%; height: 100%; color: #70a1d2; font-size: .2rem; text-align: center;}
.catalog_roll li.cur a { color: #e5f2ff;}
.catalog_roll li:hover a { color: #e5f2ff;}
.catalog_prev,.catalog_next { position: absolute; left: 50%; margin-left: -.2rem; z-index: 10;}
.catalog_prev { top: .9rem;}
.catalog_next { top: 5.3rem;}
.catalog_btns { position: absolute; left: 3.8rem; top: 50%; margin-top: -0.67rem; width: .32rem; height: 1.35rem;}
.catalog_open { display: block;}
.catalog_close { display: none;}
.togg { margin-left: -3.8rem;}
/*pgae2*/
.page2_cont { background: url(https://game.gtimg.cn/images/dnf/cp/a20210413mhmob/bg3.jpg) #081929 no-repeat center top; background-size: 7.5rem 12rem; width: 100%; height: auto; min-height: 100%; overflow: hidden;}
.page2_title { padding: .64rem 0 0; width: 100%; height: 1.58rem; line-height: .6rem; position: relative; width: 120%; margin-left: -10%; font-size: 0; text-align: center;}
.page2_title p,.page2_title em { display: inline-block; vertical-align: top; color: #deeeff; font-size: .3rem; font-weight: bold;}
.page2_title em.page1_line1,.page2_title em.page1_line2 { margin: 0.22rem .2rem 0;}
.page2_btn_upload { width: 1.65rem; height: .44rem; line-height: .37rem; position: absolute; top: .2rem; right: 1.42rem; text-align: center;}
.page2_btn_upload span { position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; color: #6391bf; font-size: .2rem;}
.page2_btn_upload em { position: absolute; left: 0; top: 0; z-index: 1;}
.content{color: #fff;}