@charset "UTF-8";
/*=======================================
■トップページの指定
=======================================*/
#contents {
	padding-top: 20px;
	position: relative;
	z-index: 5;
}
#globalNav {
	margin-top: 0px;
}
#circle01 {
	top: 300px;
	right: -200px;
}
#circle02 {
	top: -150px;
	left: -200px;
}
#circle03 {
	top: 900px;
	left: -200px;
}
.sectionBox {
	background-color: rgba(255, 255,255, 0.4);
	box-shadow:rgba(255, 0, 133, 0.2) 0px 0px 3px 1px;
	-webkit-box-shadow:rgba(255, 0, 133, 0.2) 0px 0px 3px 1px;
	-moz-box-shadow:rgba(255, 0, 133, 0.2) 0px 0px 3px 1px;
	border-radius: 6px; /* CSS3草案 */
	-webkit-border-radius: 6px; /* Safari,Google Chrome用 */
	-moz-border-radius: 6px; /* Firefox用 */
	border: 1px solid #FFF;
	margin-bottom: 30px;
	margin-top: 10px;
	margin-right: 50px;
	margin-left: 50px;
	overflow: hidden;
	text-align: center;
	position: relative;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 30px;
	padding-left: 10px;
}
.sectionBox p {
	padding-top: 15px;
	padding-bottom: 15px;
}
.downloadBtn {
	text-align: center;
}
h3 {
	text-align: center;
	padding-top: 20px;
}
h4 {
	text-align: center;
	padding-top: 20px;
}
h5 {
	background-color: #ffbfd3;
	padding-bottom: 5px;
	width: 960px;
}
#wpatch h4 {
	text-align: center;
	padding-top: 0px;
}
/*=======================================
■ストーリー
=======================================*/
#storyArea {
	position: relative;
	padding-top: 150px;
}
#storyArea #bg01 {
	position: absolute;
	top: 0px;
	left: 0px;
}
#storyArea #bg02 {
	position: absolute;
	top: 0px;
	left: 0px;
}
#text01 {
	position: relative;
	margin-bottom: 80px;
	z-index: 2;
}
#text02 {
	margin-bottom: 15px;
}
#text03 {
	margin-bottom:  15px;
}
#text04 {
	margin-bottom:  15px;
}
#text05 {
	margin-bottom: 0px;
}
#text06 {
	margin-bottom: 15px;
}
#text07 {
	margin-bottom: 25px;
}
#text08 {
	margin-bottom: 20px;
}
/*=======================================
■キャラクター
=======================================*/

#charaBtn {
	position: absolute;
	top: 0px;
	right: 0px;
	z-index: 10;
}
#subCharaBtn {
	position: absolute;
	top: 90px;
	right: 0px;
}
#charaBtn li {
	position: relative;
	float: left;
}
#charaArea {
	background-image: url(../chara/images/chara_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
	height: 1000px;
	width: 1200px;
	position: relative;
	margin-top: 40px;
}
#tachie {
	position: absolute;
	top: 0px;
	left: 0px;
}
#tachieWhite {
	position: absolute;
	top: 0px;
	left: 0px;
}
#tachieWhite2 {
	position: absolute;
	top: 0px;
	left: 0px;
	opacity:1;
}
#name {
	position: absolute;
	top: 70px;
	left: 600px;
}
#cv {
	position: absolute;
	top: 180px;
	left: 600px;
}
#word {
	position: absolute;
	top: 0px;
	left: 50px;
}
#prof {
	position: absolute;
	top: 250px;
	left: 600px;
}
#class {
	position: absolute;
	top: 24px;
	left: 962px;
}
#name2 {
	position: absolute;
	top: 101px;
	left: 1030px;
}
#character footer {
	margin-top: -80px;
}
#etc {
	position: absolute;
	top: 779px;
	left: 658px;
}
#visualBtn {
	margin-left: 170px;
}
#etc li {
	position: relative;
	float: left;
	z-index: 1000;
}
#specArea {
	background-image: url(../spec/spec.jpg);
	background-repeat: no-repeat;
	height: 972px;
	width: 1193px;
}
#gallery .list {
	background-image: url(../gallery/images/list_bg.png);
	background-repeat: repeat-y;
	z-index: 5000;
	position: relative;
}
#gallery .list:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0;
	clear: both;
	visibility:hidden;
}
#gallery_list li {
	margin: 0px;
	height: 250px;
}
/*====================================================
スペシャル
====================================================*/
#special .list {
	background-image: url(../special/images/list_bg.png);
	background-repeat: repeat-y;
}
/*フェードリスト*/
.fade_list {
	width: 1200px;
	text-align: left;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: 50px;
	height: 700px;
}
.fade_list li {
	margin: 0 auto;
	text-align: left;
	float: left;
	display: none;
}
#special_list li {
	margin: 0px;
	width: 340px;
	height: 330px;
}
#special_list li {
	position: relative;
}
#special_list li .new {
	position: absolute;
	left: -3px;
	top: -3px;
	display: inline;
}
.newMark2 {
	position:absolute;
	left: 30px;
	top: 30px;
	display: block;
	z-index: 1000;
}
/*店舗特典*/
.shopPanel {
	position: relative;
	padding-bottom: 15px;
}
.shopBtn {
	position: absolute;
	right: 45px;
	top:-6px;
}
.bigBtn {
	position: absolute;
	right: 200px;
	top:-6px;
}
.panel2 .shopPanel {
	position: relative;
	padding-bottom: 25px;
	float: left;
	margin-left: 7px;
}
.panel2 .shopBtn {
	position: absolute;
	right: 15px;
	top:-6px;
}
.panel2 .bigBtn {
	position: absolute;
	right: 170px;
	top:-6px;
}
/*====================================================
応援バナー
====================================================*/
.subNav {
	width: 1000px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 10px;
	overflow: hidden;
}
.subNav li {
	float: left;
}
.banner_list {
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 30px;
	border-collapse: separate;
	overflow: hidden;
}
.banner_list img {
	border: 2px solid #FFF;
	box-shadow:rgba(255, 0, 133, 0.4) 0px 0px 4px 1px;
	-webkit-box-shadow:rgba(255, 0, 133, 0.4) 0px 0px 4px 1px;
	-moz-box-shadow:rgba(255, 0, 133, 0.4) 0px 0px 4px 1px;
	border-radius: 2px; /* CSS3草案 */
	-webkit-border-radius: 2px; /* Safari,Google Chrome用 */
	-moz-border-radius: 2px; /* Firefox用 */
	vertical-align: bottom;
}
.banner_list td {
	padding: 5px;
}
.banner_list textarea {
	border:0;
	padding:10px;
	margin:50 0 10px;
	font-size: 12px;
	border: 2px solid #FFF;
	box-shadow:rgba(255, 0, 133, 0.4) 0px 0px 4px 1px;
	-webkit-box-shadow:rgba(255, 0, 133, 0.4) 0px 0px 4px 1px;
	-moz-box-shadow:rgba(255, 0, 133, 0.4) 0px 0px 4px 1px;
	border-radius: 2px; /* CSS3草案 */
	-webkit-border-radius: 2px; /* Safari,Google Chrome用 */
	-moz-border-radius: 2px; /* Firefox用 */
	background-color: #FFF;
	color: #816549;
}
.banner_list textarea:focus {
	border: 2px solid #F7E1E4;
}
#banner_list {
	width: 700px;
}
/*バナーサイズ450×100の設定*/
#b130_450_list textarea {
	height: 90px;
	width: 110px;
}
/*バナーサイズ200×200の設定*/
#b200_200_list textarea {
	height: 50px;
	width: 180px;
}
/*バナーサイズ720×120の設定*/
#b720_120_list textarea {
	height: 100px;
	width: 180px;
}
/*====================================================
四コマ
====================================================*/
#yonkomaMenu {
	float: left;
	margin-top: 15px;
	margin-left: 15px;
}
#yonkomaArea {
	float: right;
	background-image: url(../manga/images/manga_bg.png);
	background-repeat: no-repeat;
	height: 1200px;
	width: 550px;
	padding-top: 50px;
	padding-left: 25px;
	padding-bottom: 50px;
	margin-right: 15px;
}
/*====================================================
キャラクター表示
====================================================*/
ul#tachieBtn {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1000;
	background-image: url(../chara/images/tachie_title.png);
	background-repeat: no-repeat;
	background-position: center top;
}
#tachieBtn li {
	float:left;
	cursor:pointer;
	margin-top: 20px;
	background-image: url(../chara/images/tachie_btn_off.png);
	height: 58px;
	width: 84px;
	background-repeat: no-repeat;
}
#tachieBtn li.active {
	background-image: url(../chara/images/tachie_btn_on.png);
}
#tachieBtn li:hover {
	background-image: url(../chara/images/tachie_btn_active.png);
}
/* image-box-base */
#image-box-base {
	position:relative;
	top:0;
	left:0;
	display:block;
	width:868px;
	height:1000px;
	padding:0;
	margin:0;
	overflow:hidden;
}
/* image-box */
#image-box {
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:868px;
	height:1000px;
	padding:0;
	margin:0;
}
#image-box img {
	width:100%;
	height:100%;
}
#top-box {
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:868px;
	height:1000px;
	padding:0;
	margin:0;
}
#top-box .slice_bk {
	position:absolute;
	background-position: 0 0;
	top:0;
	left:0;
	overflow:hidden;
}
#top-box .slice_bk img {
	position:absolute;
	top:0;
	left:0;
}
/* loading */
#image-box-base #loading {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url("/main/images/loading.gif") no-repeat center center;
	background-color:transparent;
}
/*====================================================
ダブルパッチ
====================================================*/
.attention .downloadList {
	font-size: 12px;
	text-align: left;
	margin-top: -10px;
}
#wpatch .downloadList th {
	text-align: center;
}
#wpatch #otome_movie {
	position: absolute;
	left: 40px;
	top: 655px;
}
#wpatch #patchGallery {
	position: absolute;
	left: 40px;
	top: 440px;
}
.textArea {
	border:0;
	padding:3px;
	font-size:16px;
	font-family:Arial, sans-serif;
	border:solid 1px #ccc;
	width:200px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.mailBtn{
	cursor:pointer;
	font-weight: bold;
	color: #FFF;
}
/*====================================================
色紙
====================================================*/
#shikishiList {
	margin-right: auto;
	margin-left: auto;
	width: 990px;
}
#shikishiList li {
	float: left;
	padding: 5px;
}
/*=======================================
■ダウンロード
=======================================*/
.downloadList {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	border: 1px solid #ffbfd3;
}
.downloadList tr {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ffbfd3;
}
.downloadList .title {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #ffbfd3;
}
.downloadList th {
	width: 200px;
	padding: 5px;
	background-color: #fff0f2;
}
.downloadList td {
	padding: 5px;
}
.downloadLink {
	border: 1px solid #F976A7;
	padding: 4px 20px;
	border-radius: 4px; /* CSS3草案 */
	-webkit-border-radius: 4px; /* Safari,Google Chrome用 */
	-moz-border-radius: 4px; /* Firefox用 */
	font-size: 12px;
	background-color: #FB609F;
 filter: progid:DXImageTransform.Microsoft .gradient(GradientType=0, startColorstr='#F976A7', endColorstr='#E04998');
	background: -moz-linear-gradient(top, #F976A7 0%, #E04998);
	background: -webkit-gradient(linear, left top, left bottom, from(#F976A7), to(#E04998));
	background: linear-gradient(to bottom, #F976A7, #E04998);/* IE10+, W3C */
}
.downloadList td a:link {
	color: #FFFFFF;
	text-decoration: none;
	font-weight: bold;
}
.downloadList td a:visited {
	color: #FFFFFF;
	text-decoration: none;
}
.downloadList td a:hover {
	color: #FDE2E7;
	text-decoration: none;
}
.downloadList td a:active {
	color: #FFFFFF;
	text-decoration: none;
}