@charset "utf-8";
/* ===================================================================
CSS information

 file name  : layout.css
 style info : 共通レイアウトのスタイル
=================================================================== */

body{
	background-color:#ffffff;
	background-image:url(../images/common/bg_001.jpg);
	background-position:center top;
	background-repeat:repeat-y;
	min-width:1300px;
}
.inner{
		width:1300px;
		margin:0 auto;
	}
@media screen and (max-width: 800px) {
	body{
		min-width:800px;
	}
	#page{
		width:800px;
		overflow:hidden;
	}
	.inner{
		width:800px;
	}
}
	
.btn_badge img:hover {opacity:0.7;}
	
/* header */
#header{
	width:100%;
	height:50px;
	position:relative;
	z-index: 5;
}
#header p.logo_furyu{
	position:absolute;
	top:15px;
	left:38px;
}
#header p.logo_nintendo3ds{
	position:absolute;
	top:15px;
	right:38px;
}

#header .sns {
	position: absolute;
	top: 45px;
	right: 38px;
}
#header .sns li {
	float: left;
	margin-left: 10px;
}

/* footer */
#footer{
	background-image:url(../images/common/footer_bg_01.png);
	background-position:center top;
	background-repeat:no-repeat;
	text-align:center;
}

#footer .pagetop{
	width:332px;
	margin:0 auto;
	padding:86px 0 74px 0;
	cursor:pointer;
}

#footer_inner{
	background-image:url(../images/common/footer_bg_02.jpg);
	background-position:center top;
	background-repeat:repeat-y;
}

#footer_inner p.spec{
	margin-bottom:20px;
}

#footer_link{
	position:relative;
	height:155px;
}

#footer_link p.banner_birth{
	position:absolute;
	top:10px;
	right:38px;
}
#footer_link p.copyrights{
	position:absolute;
	top:80px;
	left:38px;
}


/*=============================
 top
=============================*/

#top_title{
	background-image:url(../images/top/top_bg_title.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	height:826px;
	overflow:hidden;
}

#h1wrap{
	position:relative;
}
#h1wrap .img-draemon {
	position: absolute;
	top: 0;
	height: 335px;
}
#h1wrap .img-draemon p {
	position: relative;
}
#h1wrap img.draemon{
	position:absolute;
	top:8px;
	left:772px;
	-webkit-transform-origin: -100px -200px;
	-moz-transform-origin: -100px -200px;
	-ms-transform-origin: -100px -200px;
	transform-origin: -100px -200px;
}

/* navigation */
#top_navi{
	width:1300px;
	height:429px;
	position:relative;
}
#top_navi a{
	background-image:url(../images/top/top_navi.png);
	background-repeat:no-repeat;
	text-indent:-9999px;
	display:block;
	position:absolute;
}

#top_navi a.story{
	width:222px;
	height:223px;
	background-position:left top;
	top:-12px;
	left:62px;
}
#top_navi a.character{
	width:222px;
	height:223px;
	background-position:left -223px;
	top:139px;
	left:224px;
}
#top_navi a.adventure{
	width:258px;
	height:256px;
	background-position:left -939px;
	top:-83px;
	left:316px;
}
#top_navi a.paradise{
	width:258px;
	height:261px;
	background-position:left -1195px;
	top:71px;
	left:510px;
}
#top_navi a.minigame{
	width:258px;
	height:256px;
	background-position:left bottom;
	top:-108px;
	left:671px;
}
#top_navi a.movie{
	width:258px;
	height:270px;
	background-position:left -669px;
	top:82px;
	left:788px;
}
#top_navi a.special{
	width:222px;
	height:223px;
	background-position:left -446px;
	top:4px;
	left:1030px;
}

/* navigation: hover時 */
#top_navi a.story:hover{
	background-position:-222px top;
}
#top_navi a.character:hover{
	background-position:-222px -223px;
}
#top_navi a.adventure:hover{
	background-position:-258px -939px;
}
#top_navi a.paradise:hover{
	background-position:-258px -1195px;
}
#top_navi a.minigame:hover{
	background-position:-258px bottom;
}
#top_navi a.movie:hover{
	background-position:-258px -669px;
}
#top_navi a.special:hover{
	background-position:-222px -446px;
}

/* navigation: comming soon */
#top_navi a.adventure.soon{
	background-position:-516px -939px;
	pointer-events:none;
}

#top_navi a.paradise.soon{
	background-position:-516px -934px;
	pointer-events:none;
}
#top_navi a.minigame.soon
{
	background-position:-516px -939px;
	pointer-events:none;
}
#top_navi a.movie.soon{
	width:222px;
	height:223px;
	top:129px;
	left:820px;
	background-position:-444px top;
	pointer-events:none;
}

#top_navi a.special.soon{
	background-position:-444px top;
	pointer-events:none;
}

/* new */
#top_navi a span.new{
	background-image:url(../images/common/icon_new.png);
	width:71px;
	height:54px;
	position:absolute;
}

#top_navi a.story span.new{
	top:18px;
	left:4px;
}
#top_navi a.character span.new{
	top:10px;
	left:122px;
}
#top_navi a.adventure span.new{
	top:92px;
	left:-16px;
}
#top_navi a.paradise span.new{
	top:115px;
	left:3px;
}
#top_navi a.minigame span.new{
	top:100px;
	left:9px;
}
#top_navi a.movie span.new{
	top:93px;
	left:26px;
}
#top_navi a.special span.new{
	top:22px;
	left:128px;
}

.js-anime {
	opacity: 0;
}

@media screen and (max-width: 800px) {
	#h1wrap h1{
		background-image:url(../images/top/top_h1_sp.png);
		background-position:center center;
		width:800px;
		height:348px;
	}
	#h1wrap h1 img,#h1wrap img{
		display:none;
	}
	
	#top_navi{
		width:800px;
	}
	#top_navi a.story{
		top:-55px;
		left:-7px;
	}
	#top_navi a.character{
		top:-23px;
		left:184px;
	}
	#top_navi a.adventure{
		top:163px;
		left:16px;
	}
	#top_navi a.paradise{
		top:195px;
		left:269px;
	}
	#top_navi a.minigame{
		top:178px;
		left:537px;
	}
	#top_navi a.movie{
		top:-32px;
		left:363px;
	}
	#top_navi a.special{
		top:-46px;
		left:586px;
	}
	
	#top_navi a.movie.soon{
		left: 399px;
    	top: 15px;
	}
	.js-anime {
		opacity: 1;
	}
}

#top #contents{
	background-image:url(../images/top/top_bg_contents.png);
	background-position:center top;
	background-repeat:no-repeat;
	min-height:350px;
}

#top #contents ul{
	width:798px;
	margin:0 auto;
}
#top #contents li{
	float:left;
}

#top #contents li a:hover { opacity: 0.8;}


/*=============================
 下層ページ共通
=============================*/
#in_title{
	background-image:url(../images/common/in_bg_title.png);
	background-position:center top;
	background-repeat:no-repeat;
	height:555px;
	position:relative;
}

#in_title h1{
	width:530px;
	height:139px;
	position:absolute;
	top:15px;
	left:0;
	right:0;
	margin:auto;
	z-index:3;
}
/* 下層グローバルナビ */
#in_gnavi{
	background-image:url(../images/common/gnavi_base.png);
	background-position:center top;
	background-repeat:no-repeat;
	height:405px;
	margin:auto;
	position:absolute;
	top:0;
	left:0;
	right:0;
}
#in_gnavi .in_gnavi_wrap{
	width:800px;
	margin:170px auto 0 auto;
	position:relative;
}
#in_gnavi a{
	background-image:url(../images/common/in_gnavi_btn.png);
	display:block;
	position:absolute;
	text-indent:-9999px;
}
#in_gnavi a.story{
	width:203px;
	height:80px;
	background-position:left top;
	left:0px;
	top:0px;
}
#in_gnavi a.character{
	width:202px;
	height:80px;
	background-position:-203px top;
	left:203px;
	top:0px;
}
#in_gnavi a.movie{
	width:199px;
	height:80px;
	background-position:-404px top;
	left:404px;
	top:0px;
}
#in_gnavi a.special{
	width:199px;
	height:80px;
	background-position:right top;
	left:602px;
	top:0px;
}
#in_gnavi a.adventure{
	width:251px;
	height:100px;
	background-position:-10px -111px;
	left:10px;
	top:111px;
}
#in_gnavi a.paradise{
	width:251px;
	height:100px;
	background-position:-281px -111px;
	left:281px;
	top:111px;
}
#in_gnavi a.minigame{
	width:250px;
	height:100px;
	background-position:-551px -111px;
	left:551px;
	top:111px;
}
/* 下層グローバルナビ：hover時 */
#in_gnavi a.story:hover{
	background-position:left -286px;
}
#in_gnavi a.character:hover{
	background-position:-203px -286px;
}
#in_gnavi a.movie:hover{
	background-position:-404px -286px;
}
#in_gnavi a.special:hover{
	background-position:right -286px;
}
#in_gnavi a.adventure:hover{
	background-position:-10px -397px;
}
#in_gnavi a.paradise:hover{
	background-position:-281px -397px;
}
#in_gnavi a.minigame:hover{
	background-position:-551px -397px;
}

/* 下層グローバルナビ：Coming Soon */
#in_gnavi a.soon{
	background-position:left bottom;
	pointer-events:none;
}
#in_gnavi a.movie.soon{
	left: 445px;
  top: -6px;
}
#in_gnavi a.special.soon{
	left: 645px;
  top: -6px;
}
#in_gnavi a.adventure.soon{
	left: 83px;
  top: 96px;
}
#in_gnavi a.paradise.soon{
	left: 350px;
  top: 96px;
}
#in_gnavi a.minigame.soon{
	left: 619px;
  top: 96px;
}

/* 下層グローバルナビ：NEWアイコン */
#in_gnavi a span.new{
	background-image:url(../images/common/icon_new.png);
	width:71px;
	height:54px;
	position:absolute;
	pointer-events:none;
}

#in_gnavi a.story span.new{
	left:0;
	top:-47px;
}
#in_gnavi a.character span.new{
	left: 116px;
	top: -35px;
}
#in_gnavi a.movie span.new{
	left: 11px;
  top: -37px;
}
#in_gnavi a.special span.new{
	left: 11px;
  top: -37px;
}
#in_gnavi a.adventure span.new{
	left: 138px;
  top: -26px;
}
#in_gnavi a.paradise span.new{
	left: 89px;
  top: -27px;
}
#in_gnavi a.minigame span.new{
	left: 126px;
  top: -28px;
}


/* 下層グローバルナビ：キャラクタ */
img.nobita{
	pointer-events:none;
	position:absolute;
	top:-44px;
	left:54px;
}
img.shizuka{
	pointer-events:none;
	position:absolute;
	top:-36px;
	left:221px;
}
img.gian{
	pointer-events:none;
	position:absolute;
	top:-72px;
	left:497px;
}
img.suneo{
	pointer-events:none;
	position:absolute;
	top:-30px;
	left:713px;
}
img.gri{
	pointer-events:none;
	position:absolute;
	top:84px;
	left:1px;
}
img.pega{
	pointer-events:none;
	position:absolute;
	top:96px;
	left:492px;
}

/*=============================
 story
=============================*/
.inner.story{
	background-image:url(../images/story/story_bg_001.png);
	background-position:center top;
	background-repeat:no-repeat;
	height:1152px;
	text-align:center;
	padding:91px 0 0 0;
}

h2.story{
	width:445px;
	height:101px;
	position:absolute;
	margin:auto;
	top:454px;
	left:0;
	right:0;	
}

.inner.story p.title{
	margin:0 auto 36px auto;
}
.inner.story img.story_chara{
	margin: 18px 0 0 -30px;
}

@media screen and (max-width: 800px) {
	.inner.story img.story_chara{
		margin: 18px 0 0 -90px;
	}
}

/*=============================
 character
=============================*/
.inner.character{
	text-align:center;
	padding:0 0 0 0;
}
h2.character{
	width:498px;
	height:101px;
	position:absolute;
	margin:auto;
	top:454px;
	left:0;
	right:0;	
}
.inner.character img{
	margin:0;
}
@media screen and (max-width: 800px) {
	.inner.character img{
		margin: 0 0 0 -51px;
	}
}


/*

#page {
	background: url(../images/bg.jpg) no-repeat top center;
	width: 100%;
	min-width: 1100px;
}

#header,
#contents,
#footer {
	width: 1100px;
	margin: 0 auto;
}

#header {
	position: relative;
	height: 650px;
}
#header h1 {
	position: absolute;
	top: 30px;
	left: 20px;
}
#header .logo_furyu {
	position: absolute;
	top: 13px;
	left: 0;
}
#header .logo_nintendo3ds {
	position: absolute;
	top: 13px;
	right: 0;
}
#header .sns {
	position: absolute;
	top: 10px;
	right: 200px;
}
#header .sns li {
	float: left;
	margin-left: 10px;
}


#contents img {
	padding-left: 83px;
}

#footer {
	position: relative;
	height: 220px;
}
#footer .banner {
	position: absolute;
	top: -45px;
	left: 116px;
}
#footer .banner_birth {
	position: absolute;
	right: 0;
	top: 40px;
}

.nonborder {
  border:none;
  outline:none;
}
*/


/*=============================
 movie
=============================*/
.inner.movie {
	background-image:url(../images/movie/bg_movie.png);
	background-position:center top;
	background-repeat:no-repeat;
	height:590px;
	text-align:center;
	padding:91px 0 0 0;
}

h2.movie {
	width:445px;
	height:101px;
	position:absolute;
	margin:auto;
	top:465px;
	left:0;
	right:0;	
}
.inner.movie ul {font-size:0;}
.inner.movie ul li {
	display:inline-block;
	margin:90px 0 0 0;
	width:399px;}
	.inner.movie ul li a:hover { opacity: 0.8;}
	
/*=============================
 adventure
=============================*/
.inner.adventure{
	text-align:center;
	padding:0 0 0 0;
}
.inner.adventure .minigame {
	background:url(/doraemon2016/images/adventure/img_01.png) center no-repeat;
	position:relative;
	height:413px;
}
	.inner.adventure .minigame .btn_minigame {
		position: absolute;
		top: 111px;
		right: 300px;
	}
@media screen and (max-width: 800px) {
	.inner.adventure .minigame .btn_minigame {
		right: 50px;
	}
}
.inner.adventure .pazzle {
	background-image:url(../images/adventure/img_03.png);
	background-position:center top;
	background-repeat:no-repeat;
	height:522px;
	text-align:center;
	padding: 163px 0 0;
}
.inner.adventure .etc_badge {
	background:url(/doraemon2016/images/adventure/img_04.png) center no-repeat;	
	height:284px;
}
	.inner.adventure .etc_badge .btn_badge {
		padding: 40px 0 0 0;
		widht: 747px;
		height: 180px;
		margin:auto;
	}
	
@media screen and (max-width: 800px) {
	.inner.adventure img{
		margin: 0 0 0 -51px;
	}
}
@media screen and (max-width: 800px) {
	.inner .etc_badge .btn_badge img {
		margin: 0 0 0 0px;
	}
}
@media screen and (max-width: 800px) {
	.inner .video img {
		margin: 0 0 0 0px;
	}
}

/*=============================
 paradise
=============================*/
.inner.paradise{
	background-image:url(../images/paradise/bg_paradise.png);
	background-position:center top;
	background-repeat:no-repeat;
	height:1032px;
	text-align:center;
	padding:91px 0 0 0;
}

h2.paradise{
	width:626px;
	height:101px;
	position:absolute;
	margin:auto;
	top:454px;
	left:0;
	right:0;	
}

.inner.paradise ul {	position: relative; width: 800px; margin: auto;}
.inner.paradise ul li {position:absolute;}
.inner.paradise ul li a:hover {opacity:0.7;}
.inner.paradise ul li.btn01 {	top: 320px; left: 124px;}
.inner.paradise ul li.btn02 {	top: 228px; left: 310px;}
.inner.paradise ul li.btn03 {	top: 305px; left: 544px;}
.inner.paradise ul li.btn04 {	top: 512px; left: 110px;}
.inner.paradise ul li.btn05 {	top: 407px; left: 357px;}
.inner.paradise ul li.btn06 {	top: 490px; left: 644px;}


.inner.paradise ul li.btn07 {top: 790px;	left: 28px;}

/*=============================
 badge
=============================*/
.inner.badge{
	text-align:center;
	padding:0 0 0 0;
}
h2.badge{
	width:659px;
	height:101px;
	position:absolute;
	margin:auto;
	top:454px;
	left:0;
	right:0;	
}


/*=============================
 minigame
=============================*/
.inner.minigame{
	text-align:center;
	padding:0 0 0 0;
}
h2.minigame{
	width:598px;
	height:101px;
	position:absolute;
	margin:auto;
	top:454px;
	left:0;
	right:0;	
}
.inner.minigame img{
	margin:0;
}
@media screen and (max-width: 800px) {
	.inner.minigame img{
		margin: 0 0 0 -51px;
	}
}


.inner.minigame .etc_badge {
	background:url(../images/minigame/minigame_img_006.png) center no-repeat;	
	height:291px;
}
	.inner.minigame .btn_badge {
		padding: 18px 0 0 0;
		widht: 747px;
		height: 180px;
		margin:auto;
	}


/*=============================
 special
=============================*/
.inner.special{
	text-align:center;
	padding:0 0 0 0;
}
h2.special{
	width:626px;
	height:101px;
	position:absolute;
	margin:auto;
	top:454px;
	left:0;
	right:0;	
}
.inner.special img{
	margin:0;
}
@media screen and (max-width: 800px) {
	.inner.special img{
		margin: 0 0 0 -51px;
	}
}
