﻿@charset "UTF-8";

/*汎用設定*/

html {
  overflow-y:scroll;
}

body
{
	color: #333;
	font-family: 'Lucida Grande','Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
	font-size: 14px;
	line-height: 1.6em;
	line-break: strict;
	word-break: break-all;
	text-align: justify;
	text-justify: distribute;
	background: url(../images/common/bg.jpg) no-repeat center top fixed;
	background-size: cover;
	padding-top: 100px;
}
a:link
{
	text-decoration: none;
	color: #F69;
}
a:visited
{
	text-decoration: none;
	color: #F69;
}
a:hover
{
	text-decoration: underline;
	color: #F60;
}
img
{
	border: none;
}
p
{
	margin-bottom: 0.8em;
}

/*エリア指定*/

#header-base
{
	width: 100%;
	height: 142px;
	background: url(../images/common/header-bg.png) repeat-x;
	position: fixed;
	z-index: 999;
	top: 0;
	left: 0;
}
#header
{
	width: 1000px;
	height: 142px;
	margin: 0 auto;
	position: relative;
}
#header #logo
{
	position: absolute;
	top:  0px;
	left: 0px;
}
#header #yuzulogo
{
	position: absolute;
	top:  7px;
	right: 0px;
}
#header #social
{
	position: absolute;
	top: 18px;
	left: 833px;
}
#header #social ul
{
	list-style: none;
}
#header #social ul li
{
	float: right;
	margin-left: 10px;
}

/*ナビゲーション*/

#navi01 a
{
	position: absolute;
	top: 55px;
	left: 404px;
	width: 74px;
	height: 45px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/common/navi01a.png) no-repeat;
}
#navi01 a:hover
{
	background: url(../images/common/navi01b.png) no-repeat;
	border-bottom: 3px solid #BC3500;
	box-sizing: border-box;
}
#navi02 a
{
	position: absolute;
	top: 55px;
	left: 494px;
	width: 110px;
	height: 45px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/common/navi02a.png) no-repeat;
}
#navi02 a:hover
{
	background: url(../images/common/navi02b.png) no-repeat;
	border-bottom: 3px solid #BC3500;
	box-sizing: border-box;
}
#navi03 a
{
	position: absolute;
	top: 55px;
	left: 620px;
	width: 74px;
	height: 45px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/common/navi03a.png) no-repeat;
}
#navi03 a:hover
{
	background: url(../images/common/navi03b.png) no-repeat;
	border-bottom: 3px solid #BC3500;
	box-sizing: border-box;
}
#navi04 a
{
	position: absolute;
	top: 55px;
	left: 710px;
	width: 101px;
	height: 45px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/common/navi04a.png) no-repeat;
}
#navi04 a:hover
{
	background: url(../images/common/navi04b.png) no-repeat;
	border-bottom: 3px solid #BC3500;
	box-sizing: border-box;
}
#navi05 a
{
	position: absolute;
	top: 55px;
	left: 827px;
	width: 65px;
	height: 45px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/common/navi05a.png) no-repeat;
}
#navi05 a:hover
{
	background: url(../images/common/navi05b.png) no-repeat;
	border-bottom: 3px solid #BC3500;
	box-sizing: border-box;
}
#navi06 a
{
	position: absolute;
	top: 55px;
	left: 908px;
	width: 92px;
	height: 45px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	background: url(../images/common/navi06a.png) no-repeat;
}
#navi06 a:hover
{
	background: url(../images/common/navi06b.png) no-repeat;
	border-bottom: 3px solid #BC3500;
	box-sizing: border-box;
}

/*コンテンツ*/

#wrap
{
	width: 1000px;
	margin: 20px auto;
	padding: 20px;
	background: rgba(255,255,255,0.6);
	box-sizing: border-box;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px; 
	-o-border-radius: 5px; 
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 4px rgba(0,0,0,.5); 
	-moz-box-shadow: 0 1px 4px rgba(0,0,0,.5); 
	-o-box-shadow: 0 1px 4px rgba(0,0,0,.5); 
	box-shadow: 0 1px 4px rgba(0,0,0,.5);
}
#top-banner
{
	list-style: none;
}
#top-banner li
{
	margin-bottom: 10px;
}
#top-banner li img
{
	max-width: 960px;
}
#top-banner li:last-child
{
	margin-bottom: 0;
}

/*ムービー*/

#movie
{
	padding: 0px 0px 0px 50px;
}

#movie_title
{
	padding: 20px 0px 0px 10px;
}


/*ページタイトル*/

#page-title-wrap
{
	width: 100%;
	background: #480400;
}
h2
{
	margin: 0 auto;
	padding: o;
	width: 1000px;
}

/*文字装飾*/

h3
{
	margin-bottom: 20px;
}

/*キャラクター*/

#charaselect
{
	background: url(../images/chara/line.png) bottom no-repeat;
	margin-bottom: 20px;
	padding-bottom: 23px;
	box-sizing: border-box;
}
#charaselect ul
{
	display: table;
	table-layout: fixed;
	width: 100%;
}
#charaselect li
{
	display: table-cell;
	text-align: center;
	list-style: none;
}
#sub-chara-wrap
{
	width: 980px;
	margin-right: -20px;
	overflow: hidden;
}

#chara01
{
	width: 960px;
	height: 700px;
	background: url(../images/chara/chara01/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
}
#chara02
{
	width: 960px;
	height: 700px;
	background: url(../images/chara/chara02/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
}
#chara03
{
	width: 960px;
	height: 700px;
	background: url(../images/chara/chara03/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
}
#chara04
{
	width: 960px;
	height: 700px;
	background: url(../images/chara/chara04/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
}
#chara05
{
	width: 470px;
	height: 700px;
	background: url(../images/chara/chara05/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
	margin-right: 20px;
	float: left;
}
#chara06
{
	width: 470px;
	height: 700px;
	background: url(../images/chara/chara06/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
	margin-right: 20px;
	float: left;
}
#chara07
{
	width: 470px;
	height: 700px;
	background: url(../images/chara/chara07/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
	margin-right: 20px;
	float: left;
}
#chara08
{
	width: 470px;
	height: 700px;
	background: url(../images/chara/chara08/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
	margin-right: 20px;
	float: left;
}
#chara09
{
	width: 470px;
	height: 700px;
	background: url(../images/chara/chara09/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
	margin-right: 20px;
	float: left;
}
#chara10
{
	width: 470px;
	height: 700px;
	background: url(../images/chara/chara10/base.jpg) no-repeat;
	position: relative;
	margin-bottom: 20px;
	margin-right: 20px;
	float: left;
}
.charatext
{
	position: absolute;
	bottom: 240px;
	left: 125px;
	width: 545px;
	-webkit-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	-moz-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	color: #fff;
}
.charatext2
{
	position: absolute;
	bottom: 240px;
	left: 125px;
	width: 325px;
	-webkit-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	-moz-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	color: #fff;
}
.charatext3
{
	position: absolute;
	bottom: 240px;
	left: 20px;
	width: 325px;
	-webkit-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	-moz-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	color: #fff;
}
.charatext4
{
	position: absolute;
	bottom: 20px;
	left: 125px;
	width: 325px;
	-webkit-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	-moz-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	color: #fff;
}
.charatext5
{
	position: absolute;
	bottom: 20px;
	left: 20px;
	width: 325px;
	-webkit-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	-moz-text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	text-shadow: 1px 1px 1px #000,-1px 1px 1px #000,1px -1px 1px #000,-1px -1px 1px #000;
	color: #fff;
}
.thumbnail01
{
	position: absolute;
	top: 495px;
	left: 20px;
	z-index: 50;
}
.thumbnail02
{
	position: absolute;
	top: 495px;
	left: 185px;
	z-index: 50;
}
.thumbnail03
{
	position: absolute;
	top: 495px;
	left: 350px;
	z-index: 50;
}
.thumbnail04
{
	position: absolute;
	top: 495px;
	left: 515px;
	z-index: 50;
}
.thumbnail05
{
	position: absolute;
	top: 590px;
	left: 20px;
	z-index: 50;
}
.thumbnail06
{
	position: absolute;
	top: 590px;
	left: 185px;
	z-index: 50;
}
.thumbnail07
{
	position: absolute;
	top: 590px;
	left: 350px;
	z-index: 50;
}
.thumbnail08
{
	position: absolute;
	top: 590px;
	left: 515px;
	z-index: 50;
}
.thumbnail01b
{
	position: absolute;
	top: 495px;
	left: 125px;
	z-index: 50;
}
.thumbnail02b
{
	position: absolute;
	top: 495px;
	left: 290px;
	z-index: 50;
}
.thumbnail03b
{
	position: absolute;
	top: 590px;
	left: 125px;
	z-index: 50;
}
.thumbnail04b
{
	position: absolute;
	top: 590px;
	left: 290px;
	z-index: 50;
}
.thumbnail01c
{
	position: absolute;
	top: 495px;
	left: 20px;
	z-index: 50;
}
.thumbnail02c
{
	position: absolute;
	top: 495px;
	left: 185px;
	z-index: 50;
}
.thumbnail03c
{
	position: absolute;
	top: 590px;
	left: 20px;
	z-index: 50;
}
.thumbnail04c
{
	position: absolute;
	top: 590px;
	left: 185px;
	z-index: 50;
}
.thumbnail01 img,
.thumbnail02 img,
.thumbnail03 img,
.thumbnail04 img,
.thumbnail05 img,
.thumbnail06 img,
.thumbnail07 img,
.thumbnail08 img,
.thumbnail01b img,
.thumbnail02b img,
.thumbnail03b img,
.thumbnail04b img,
.thumbnail01c img,
.thumbnail02c img,
.thumbnail03c img,
.thumbnail04c img
{
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px; 
	-o-border-radius: 5px; 
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 4px rgba(0,0,0,.5); 
	-moz-box-shadow: 0 1px 4px rgba(0,0,0,.5); 
	-o-box-shadow: 0 1px 4px rgba(0,0,0,.5); 
	box-shadow: 0 1px 4px rgba(0,0,0,.5);
}
.chara-cos-right
{
	position: absolute;
	top: 0px;
	right: 0px;
}
.chara_gallery_navi
{
	position: absolute;
	top: 3px;
	right: 10px;
	margin: 0;
	padding: 0;
	z-index: 50;
	overflow: hidden;
}
.chara_gallery_navi li{
	float:left;
	background:none;
	padding:0;
	margin:0 0 0 5px;
	list-style: none;
}
.chara_gallery_photo{
	width:960px;
	height:700px;
}
.chara_gallery_photo img{
	position:absolute;
}



/*リスト*/

.shop_list
{
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
}
.shop_list dl
{
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
}
.shop_list dt
{
	color: #F60;
	border-top: 1px #F60 solid;
	border-bottom: 1px #F60 solid;
	padding: 0px 0px 0px 100px;
	width: 700px;
	text-align: left;
}
.shop_list dd
{
	margin: 0px;
	padding: 0px 0px 0px 150px;
	color: #930;
	width: 700px;
	text-align: left;
}

.shop_list dd a
{

	color: #930;

}


.shop_list_book table
{
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
	border-collapse: collapse;
}

.shop_list_book td
{
	padding: 4px;
	background-color: #fff;
	border: 1px solid #ccc;
	vertical-align: middle;
}
.shop_list_book th
{
	text-align: center;
	vertical-align: middle;
	padding: 4px;
	background-color: #fafafa;
	border: 1px solid #ccc;
}


.shop_list_spec
{
	text-align: center;
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
}

.shop_list_spec table
{
	font-size: 12px;
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
	border-collapse: collapse;
}

.shop_list_spec td
{
	color: #515151;
	text-align: left;
	padding: 4px;
	background-color: #fff;
	border: 1px solid #ccc;
	vertical-align: middle;
}
.shop_list_spec th
{
	color: #515151;
	width: 130px;
	text-align: left;
	vertical-align: middle;
	padding: 4px;
	background-color: #fafafa;
	border: 1px solid #ccc;
}


/*ダウンロード*/

.dl_ban
{
	text-align: center;
}

.dl_ban img
{
	border-radius: 5px;
	box-shadow: 0px 0px 3px #acacac;
	border: 3px #ffffff solid;
	overflow: hidden;
}




/*特典*/

.bottan
{
text-align: center;
}

.solo
{
text-align: left;
margin: 0px 10px 0px 12px;
}

.solo2
{
text-align: left;
}

.solo2 a
{
margin: 0px 380px 0px 18px;
}

.solo3
{
text-align: left;
}

.solo3 a
{
margin: 0px 380px 0px 18px;
}

.solo4
{
width: 1000px;
text-align: left;
}

.solo4 a
{
margin: 0px 380px 0px 18px;
}

.solocamp
{
font-size: 14px;
text-align: left;
padding: 0px 0px 0px 90px;
margin: 0px;
}
.solocamp ul
{
font-size: 14px;
text-align: left;
padding: 0px 0px 0px 30px;
margin: 0px;
}

.bottan img
{
	border-radius: 5px;
	box-shadow: 0px 0px 3px #acacac;
	border: 3px #ffffff solid;
	overflow: hidden;
	margin: 0px 5px 0px 5px;
}

.bottan textarea
{
	border-radius: 5px;
	box-shadow: 0px 0px 3px #acacac;
	border: 2px #ffffff solid;
	overflow: hidden;
	margin: 0px 2px 0px 2px;
}

.sq textarea
{
	border-radius: 5px;
	box-shadow: 0px 0px 3px #acacac;
	border: 3px #ffffff solid;
	overflow: hidden;
	margin: 0px 8px 0px 8px;
}

.shop_list
{
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
}
.shop_list dl
{
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
}
.shop_list dt
{
	color: #F60;
	border-top: 1px #F60 solid;
	border-bottom: 1px #F60 solid;
	padding: 0px 0px 0px 100px;
	width: 700px;
	text-align: left;
}
.shop_list dd
{
	margin: 0px;
	padding: 0px 0px 0px 150px;
	color: #930;
	width: 700px;
	text-align: left;
}



.shop_list_book table
{
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
	border-collapse: collapse;
}

.shop_list_book td
{
	padding: 4px;
	background-color: #fff;
	border: 1px solid #ccc;
	vertical-align: middle;
}
.shop_list_book th
{
	text-align: center;
	vertical-align: middle;
	padding: 4px;
	background-color: #fafafa;
	border: 1px solid #ccc;
}


.shop_list_spec
{
	text-align: center;
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
}

.shop_list_spec table
{
	font-size: 12px;
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
	width: 800px;
	margin: 0px auto 0px auto;
	padding-right: 10px;
	border-collapse: collapse;
}

.shop_list_spec td
{
	color: #515151;
	text-align: left;
	padding: 4px;
	background-color: #fff;
	border: 1px solid #ccc;
	vertical-align: middle;
}
.shop_list_spec th
{
	color: #515151;
	width: 130px;
	text-align: left;
	vertical-align: middle;
	padding: 4px;
	background-color: #fafafa;
	border: 1px solid #ccc;
}



/*フッター*/

#footer
{
	width: 100%;
	background: #7F653F;
	padding: 20px;
	box-sizing: border-box;
	color: #fff;
	text-align: center;
	font-size: 0.8em;
}

/*トップへ戻る*/

#page-top
{
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 1000;
	background: url(../images/common/returntop.png) no-repeat;
	width: 110px;
	height: 110px;
	text-indent: -9999px;
	cursor: pointer;
}

/* liScroll styles */

#newsticker
{
	width: 960px;
	height: 40px;
	position: relative;
}

.tickercontainer { /* the outer div with the black border */
background: none; 
width: 825px; 
margin: 0; 
padding: 0;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
}
ul.newsticker { /* that's your list */
position: relative;
left: 800px;
list-style-type: none;
margin: 0;
padding: 0;
}
ul.newsticker li {
float: left; /* important: display inline gives incorrect results when you check for elem's width */
margin: 0;
padding: 0;
background: none;
margin-right: 40px;
}
ul.newsticker a {
padding: 0;
margin: 0;
} 
#newsticker .archive a
{
	position: absolute;
	display: block;
	overflow: hidden;
	top: -3px;
	right: 0;
	border: 1px solid #BC3500;
	text-align: center;
	padding: 0.1em 0.5em;
	box-sizing: border-box;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px; 
	-o-border-radius: 5px; 
	border-radius: 5px;
	background: #fff;
}
