/* CSS Document */
@charset "UTF-8";

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
	background-color: #ff9;
	color: #000;
	/* [disabled]font-style:italic; */
	/* [disabled]font-weight: bold; */
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}
/* CSSリセットここまで */

/* サイト基本構成 */
body{
	font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
	color: #333333;
	font-size: 12px;
	line-height: 1.2em;
	background-image: url(../img/bg.png);
	background-repeat: repeat-x;
	background-color: #fff4fe;
}

a{
	text-decoration: none;
}

table{
	border: 1px #ffc3e4 solid;
	margin-bottom: 15px;
	font-size: 12px;
}

table td,th{
	border: 1px #ffc3e4 solid;
	padding: 7px 7px 5px 7px;
	background-color: #FFF;
}

table th{
	background-color: #ff65ba;
	font-weight: bold;
	text-align: center;
	color: #FFF;
}

h1{margin-bottom: 0.5em;}

h2{
	margin-bottom: 0.5em;
	font-size: 18px;
	font-weight: normal;
	color: #3e95f7;
}

h3{
	margin-bottom: 0.5em;
	font-size: 14px;
	font-weight: normal;
	color: #3e95f7;
}

strong{color: #ff3fa9;}

p{line-height: 1.5em;}

/* 拡張 */

header {
	width: 100%;
	height: 415px;
	background-image: url(../img/bg_header_bg.jpg);
	background-repeat: no-repeat;
	background-position: center -90px;
	background-size: cover;
	position: absolute;
	z-index: -10;
}

#headertop{
	height: 63px;
	background-image: url(../img/bg_header.png);
	background-position: center top;
	background-repeat: no-repeat;
}

#headerlogo{
	width: 1200px;
	margin: 0 auto;
}

#productlogo{
	width: 315px;
	height: 233px;
	position: relative;
	margin-bottom: -233px;
	top: 10px;
	left: -30px;
	z-index: 10;
}

#brandlogo{
	width: 235px;
	height: 235px;
	position: relative;
	top: -68px;
	left: 1035px;
	margin-bottom: -235px;
}

footer {
	clear: both;
}

#sitemenu {
	margin: 0 auto;
	margin-top: 0px;
	width: 1200px;
	height: 244px;
}

#sitemenu li{
	display: block;
	position: relative;
	width: 0px;
	height: 0px;
}

.mhome{
	top: 35px;
	left: 287px;
}
.mstory{
	top: 89px;
	left: 314px;
}
.mchara{
	top: 71px;
	left: 417px;
}
.mcg{
	top: 33px;
	left: 487px;
}
.mdownload{
	top: 101px;
	left: 524px;;
}
.mproduct{
	top: 33px;
	left: 598px;
}
.msupport{
	top: 26px;
	left: 704px;
}
.mspecial{
	top: 106px;
	left: 671px;
}
.mex{
	top: 60px;
	left: 782px;
}

#maincontents {
	float: left;
	width: 873px;
	height: 758px;
	margin-right: 15px;
	border-radius: 10px;
	border: 1px solid #ffc3e4;
	margin-top: -85px;
}

.topcontentsbg{
	background-image: url(../img/masterup_bg.jpg);
	background-repeat: no-repeat;
}

.productinfotop{width: 300px;}

#subcontents{
	width: 300px;
	float: left;
	margin-top: -145px;
}

.contents{margin-bottom: 15px;}

#container {
	width: 1200px;
	margin: 0 auto;
}
#copyright {
	text-align: right;
	color: #de6fd5;
	padding: 10px 0 10px 0;
}

.offlink{
	filter: alpha(opacity=50);
	-moz-opacity:0.50;
	opacity:0.50;
}


#subcontentsinfo{
	height: 313px;
	background-image: url(../img/side_kousin_bg.jpg);
	background-repeat: no-repeat;
	border-radius: 10px;
	border: 1PX solid #ffc3e4;
	overflow-y: scroll;
}
#subcontentsinfo h1,#subcontentsnews h1{
	font-size: 18px;
	font-weight:normal;
	color: #3e95f7;
	border-bottom: 1px solid #ffc3e4;
	padding-bottom: 3px;
	margin: 5px 10px;
}
#subcontentsinfo p,#subcontentsnews p{
	margin: 10px 10px;
}

#subcontentsnews{
	background-image: url(../img/side_news_bg.jpg);
	height: 110px;
	background-repeat:no-repeat;
	border-radius: 10px;
	border: 1PX solid #ffc3e4;

	overflow-y: scroll;
}

#twcontents{
	margin: 15px 0;
}

.storycontentsbg{
	background-image: url(../img/story_bg.jpg);
	background-repeat:no-repeat;
}
#twitterbutton{
	margin: 11px 13px 0 0;
	text-align: right;
}
.othercontentsbg{
	background-image: url(../img/maincontents_bg.jpg);
	background-repeat:no-repeat;
}

#maincontentsin{
	margin: 43px 50px;
}

.maincontentsinscroll{
	height: 610px;
	overflow-y: scroll;
}

.charainfoleft{
	width: 360px;
	float: left;
}

.charainforight{
	width: 300px;
	position: relative;
	float: left;
	z-index: 2;
	top: -60px;
	left: -40px;
}

.charainfobg{
	width: 873px;
	height: 758px;
	background-image: url(../img/chara_bg_photo.png);
	background-repeat:no-repeat;
	background-position: 610px 30px
}

.eventcgsam{margin-left: 5px;}

.eventcgsam img{
	display: block;
	width: 180px;
	float: left;
	margin: 6px;
}



#cgcontents{
	width: 980px;
	height: 550px;
	/* [disabled]background: url(../img/cg/cg_popup_bg.png) no-repeat; */
}

#cgcontents .left{
	width: 810px;
	float: left;
	height: 550px;
}

#cgcontents .left img{
	margin: 10px 0 0 10px;
}

#cgcontents .right{
	width: 170px;
	height: 535px;
	overflow: scroll;
	float: left;
}

#cgcontents ul{
	margin: 20px 0 0 12px;
}

#cgcontents li{
	width: 125px;
	display: block;
	margin: 0 0 15px 0;

	border-radius: 5px;
	box-shadow: 0 0 5px #999;
}

#cgcontents p{
	margin: 0 10px 0 10px;
	color: #ffa05b;
	font-size: 20px;
	line-height: 1.2em;
	font-weight: bold;
}

#cgcontents img{
	display: block;
}

#cgcontents .yazirusi{
	background: url(../img/nextyazirusi.png) no-repeat center;
	height: 16px;

	border-radius: 0;
	box-shadow: none;
}

#productcontentsleft table{width: 345px;}
.productbg{
	height: 758px;
	background-image: url(../img/product_bg.png);
	background-repeat: no-repeat;
	background-position: 425px 45px;
}

.ouenbanner{
	width: 650px;
	margin: 0 auto;
}

.ouenbannerleft{
	width: 350px;
	float: left;
}
.ouenbannerright{
	width: 300px;
	float: left;
}

#charasabun{
	width: 225px;
	height: 45px;
	background-image:url(../img/sabunbutton_bg.png);
	text-align: right;
	padding: 5px;
	margin: 5px;
	background-repeat: no-repeat;
}
.seihuku:hover, .sihuku:hover, .sukumizu:hover{
	filter: alpha(opacity=75);
	-moz-opacity:0.75;
	opacity:0.75;
}
.seihuku, .sihuku, .sukumizu{
	cursor: pointer;
}

.ex{
	width: 650px;
	margin: 0 auto;
}

.info{
	border: dotted 1px #ffc3e4; background-color: #FFF; padding: 5px 8px; border-radius: 5px;
}

.centerlayout{text-align: center;}

.presentinfo{
	text-align: center;
	font-size: 14px;
}

.presentexwaku{
	border: 2px solid #94c7ff;
	border-radius:5px;
	background-color:#FFF;
}

.presentex{
	margin: 5px;
	font-size: 14px;
}

.container{
	padding-bottom: 10px;
	border-bottom: 1px #CCC dotted;
	margin: 10px 0;
}
.naiyotext{width: 100%; height: 5em;}

.fade:hover{
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
}

.voicebutton{
	width: 317px;
	height: 30px;
	background-image: url(../img/voice_bg.png);	
	margin-left: 5px;
}

.voicein{
	padding: 3px 0 0 90px;
}


.dllist{
	width: 300px;
	margin: 5px;
	float: left;
	font-weight: bold;
}
