@charset "utf-8";
/* CSS Document */
.container {
height:auto;
background:url(http://static.nexon.co.jp/heroes/landing/bg02.jpg) no-repeat center top;
}
/*frame////////////////////////////////////////////////////////////*/
.container{
min-width:960px;	
}
.header{
height:550px;
position:relative;
margin:0 auto;
overflow:hidden;
}
.section {
overflow:hidden;
}
.article {
width:950px;
margin:0 auto;
}

/*visual////////////////////////////////////////////////////////////*/

.main-visual{
position:relative;
overflow:hidden;
width:100%;
height:550px;
}
.main-visual{
position:relative;
overflow:hidden;
width:100%;
height:550px;
}

.visual-container{
position:absolute;
left:0%;
width:100%;
}
.visual-container > div{
position:absolute;
width:100%;
min-width:960px;
height:488px;
background-color:#000;
}
.main01{
left:0%;
background:url(http://static.nexon.co.jp/heroes/landing/visual_female.jpg) no-repeat center top;
background-size:100% auto;
}
.main02{
left:100%;
background:url(http://static.nexon.co.jp/heroes/landing/visual_male.jpg) no-repeat center top;
background-size:100% auto;
}
.main03{
left:200%;
background:url(http://static.nexon.co.jp/heroes/landing/visual_monster.jpg) no-repeat center top;
background-size:100% auto;
}
.main04{
left:300%;
background:url(http://static.nexon.co.jp/heroes/landing/visual_view.jpg) no-repeat center top;
background-size:100% auto;
}

.on-cnt{
position:absolute;
width:100%;
min-width:960px;
height:550px;
margin:0 auto;
bottom:0px;
left:0px;
}
.on-cnt{
position:relative;
width:950px;
height:550px;
margin:0 auto;
}
.on-cnt .logo{
float:none;
position:absolute;
width:280px;
height:66px;
top:12px;
left:-8px;
background:url(http://static.nexon.co.jp/heroes/landing/lp08_logo.png) no-repeat center top;
overflow:hidden;
z-index:100;
}
.on-cnt .catch{
float:none;
position:absolute;
width:552px;
height:123px;
top:268px;
left:-20px;
background:url(http://static.nexon.co.jp/heroes/landing/lp08_catch.png) no-repeat center top;
overflow:hidden;
z-index:100;
}
.regist{
position:absolute;
width:100%;
height:100%;
/*height:329px; */
top:0;
left:0;
overflow:hidden;
z-index:80;
text-align:center;
}
.regist2{
position:absolute;
top:91px;
left:810px;
overflow:hidden;
z-index:80;
text-align:center;
}
.flow{
float:none;
position:absolute;
width:950px;
height:126px;
margin-left:-476px;
top:424px;
left:50%;
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_flow.jpg) no-repeat center top;
overflow:hidden;
z-index:1000;
}
.flow .free-regist{
float:left;
width:374px;
height:125px;
}
.flow .free-regist a{
display:block;
width:374px;
height:125px;
}
.flow .free-regist a:hover{
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_flow.jpg) no-repeat 0 -126px;
}

.flow .free-download{
float:left;
width:388px;
height:125px;
margin:0 0 0 -68px;
}
.flow .free-download a{
display:block;
width:388px;
height:125px;
}
.flow .free-download a:hover{
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_flow.jpg) no-repeat -306px -252px;
}

.flow .game-start{
float:left;
width:323px;
height:125px;
margin:0 0 0 -68px;
}
.flow .game-start a{
display:block;
width:323px;
height:125px;
}
.flow .game-start a:hover{
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_flow.jpg) no-repeat -626px -378px;
}

/*contents////////////////////////////////////////////////////////////*/
.contents{
height:780px;
}
.cnt01 .detail, .cnt02 .detail, .cnt03 .detail, .cnt04 .detail {
position:absolute;
left:-9999px;
}

/*movie-btn-set////////////////////////////////////////////////////////////*/
.movie {
width:950px;
margin:0;
overflow:hidden;　/*float解除*/
zoom:100%;　/*float解除*/
}
.movie .character {
width:auto;
margin:56px 0 0 0;
overflow:hidden;　/*float解除*/
zoom:100%;　/*float解除*/
}
.movie .character li {
float:left;
list-style:none;
margin:0 0 0 5px;
}
.movie .character li a {
display:block; 
height:94px; 
width:152px;
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_movie.png) no-repeat center top;
}

.movie .character a.vella {background-position:0px 0px;width:152px;}
.movie .character li a.vella:hover {background-position:0 -94px;}

.movie .character a.evy {background-position:-157px 0px;width:152px;}
.movie .character li a.evy:hover {background-position:-157px -94px;}

.movie .character a.fiona {background-position:-314px 0px;width:152px;}
.movie .character li a.fiona:hover {background-position:-314px -94px;}

.movie .character a.lethita {background-position:-471px 0px;width:153px;}
.movie .character li a.lethita:hover {background-position:-471px -94px;}

.movie .character a.kay {background-position:-629px 0px;width:153px;}
.movie .character li a.kay:hover {background-position:-629px -94px;}

.movie .character a.kalok {background-position:-787px 0px;width:153px;}
.movie .character li a.kalok:hover {background-position:-787px -94px;}


/*footer-btn-set////////////////////////////////////////////////////////////*/

.footer-btn-set{
width:auto;
height:;
}

.btn-regist{
width:524px;
height:113px;
margin:6px auto 0;
}
.btn-regist a{
display:block;
height:0px;
padding-top:113px;
overflow:hidden;
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_regist.png) no-repeat 24px top;
}
.btn-regist a:hover{
background-position:24px -113px;
}

.btn-regist + p{
display:none;	
}

.btn-to-site{
width:476px;
height:52px;
margin:45px auto 0;
}
.btn-to-site a{
display:block;
height:0px;
padding-top:52px;
overflow:hidden;
background:url(http://static.nexon.co.jp/heroes/landing/lp08_btn_sitetop.png) no-repeat left top;
}
.btn-to-site a:hover{
background-position:left -52px;
}

/*foot////////////////////////////////////////////////////////////*/
.footer {
clear:both;
width:100%;
padding:20px 0 0 0;
margin:30px auto 0;
border-top:solid 1px #cbcbcb;
}
.footer .company {
font-size:10px;
display:inline;
padding:0 7px;
border-right:1px solid #464646;
}
.footer .company-l {
font-size:10px;
display:inline;
margin: 0px;
padding:0 0 0 7px;
}
.footer a:link, .footer a:visited {
color:#464646;
text-decoration:underline;
}
.footer a:hover {
color:#464646;
text-decoration:none;
}
.footer .copyright-cnt {
height:83px;
text-align: center;
line-height: normal;
padding:0 0 30px;
margin:13px auto 0;
background:url(http://static.nexon.co.jp/heroes/teaser/foot_logo.gif) no-repeat center 50px;
}
.footer .copyright-cnt a:link, .footer .copyright-cnt a:visited {
color:#464646;
text-decoration:underline;
}
.footer .copyright-cnt a:active, .footer .copyright-cnt a:hover {
color:#464646;
text-decoration:none;
}
.footer .copyright-cnt p {
color:#55585e;
font-size:10px;
text-align:center;
line-height:normal;
padding:0 0 4px;
}
.fooert .eng {
font-family:Arial;
}
.footer ul {
line-height:11px;
text-align:center;
padding:0px;
margin: 0px;
}