@charset "utf-8";
/* CSS Document */
a{
	color:#555555;
}
a:hover{
	text-decoration:none;
}

html{
	scrollbar-track-color:#eeeeee;
	scrollbar-face-color:#ffffff;
	scrollbar-shadow-color:#eeeeee;
	scrollbar-darkshadow-color:#dddddd;
	scrollbar-highlight-color:#eeeeee;
	scrollbar-3dlight-color:#dddddd;
	scrollbar-arrow-color:#000000;
}
body{
	font-size:9pt;
	font-family:"Times New Roman";
	color:#555555;
	background-color:#ffffff;
	text-align:center;
	margin:0px;
	-webkit-text-size-adjust:none;
}
table,th,td{
	margin:auto;
	font-size:9pt;
	border-color:#555555;
}
p{
	text-align:left;
	line-height:2em;
	padding-left:20px;
	padding-right:20px;
	margin-top:0.5em;
	margin-bottom:0.5em;
}
img{
	border-style:none;
}
#body{
	margin:auto;
	width:100%;
	background-color:#eeeeee;
	ackground-image:url(image/bg.gif);
	background-position:top right;
	background-repeat:repeat-y;
	overflow:hidden;
}
#header{
	width:100%;
	height:80px;
	background-color:white;
	background:url(image/header_bg.png) no-repeat center;
	overflow:hidden;
}

#header_melodia{
	width:100%;
	height:100px;
	background-color:white;
	background:url(image/melodia_header.jpg) no-repeat center;
	overflow:hidden;
}


#header_main{
	width:100%;
	background-color:white;
	overflow:hidden;
}

#header_title{
	height:80px;
	width:414px;
	margin:auto;
	background-color:white;
}
#header h1{
	margin-top:90px;
	padding-left:30px;
	font-size:14pt;
}
#header h1 a{
	text-decoration:none;
}
#menu,#menu2{
	width:100%;
	height:30px;
	background-image:url(image/menu_bg.jpg);
	background-position:top left;
	background-repeat:repeat-x;
	font-weight:bold;
	position: relative;
	overflow: hidden;
}
div.menu{
	height:30;
	width:700px;
	margin:0 auto;
	position: relative;
	overflow: hidden;
}
	
#menu ul,#menu2 ul{
	margin:0px;
	padding:0px;
	text-align: center;
	position: relative;
	list-style-type:none;
}

#menu li,#menu2 li{
	float:left;
	width:140px;
	height:30px;
	display: inline-block;
	line-height:30px;
	overflow:hidden;
	position:relative;
	z-index:1;
}
#menu .on,#menu2 .on{
	_background-image:url(image/menu.jpg);
	_background-position:top left;
	_background-repeat:repeat-x;
	overflow:visible;
}
#menu .sbm,#menu2 .sbm2{
	left:-1px;
	background-color:#ffffff;
	opacity:0.7;
	filter:Alpha(Opacity=70);
	position:absolute;
}
.sbm li,.sbm2 li{
	border-left:solid 1px #cccccc;
	border-bottom:solid 1px #cccccc;
}
#menu a,#menu2 a{
/* トップメニューの文字を左寄せにする場合 */
/* text-align:left; */
/* padding-left:10px; */
	text-decoration:none;
	white-space:nowrap;
	border-right:solid 1px #cccccc;
	font-weight:bold;
	display:block;
}
#menu a:hover,#menu2 a:hover{
	background-image:url(image/menu.jpg);
	background-position:top left;
	background-repeat:repeat-x;
}
#menu .sbm a:hover,#menu2 .sbm2 a:hover{
	background-image:url();
	background-color:#eeeeee;
}
#main{
	margin:auto;
	width:950px;
	overflow:hidden;
}
#main ul,#main ol{
	margin-left:0px;
	padding-left:35px;
	padding-right:20px;
}
#main li{
	line-height:2em;
	text-align:left;
}

div.special{
	position:relative;
	width:700px;
	height:500px;
	margin:60px auto;
	padding:15px;
	background:rgba(255,255,255,0.8);
}

div.menu_ex{
	height:59;
	width:950px;
	margin:0 auto;
	position: relative;
	overflow: hidden;
}
ul.menu_ex_ul{
	list-style:none;
	text-align: center;
	padding:0;
	margin:10px 0 5px;
}

ul.menu_ex_ul li{
	display: inline-block;
}

li.menu_ex_btn{
	margin:0 2px 10px;
}

.box_ex1{
	width:950px;
	height:594px;
	margin:auto;
	margin-top:10px;
	margin-bottom:5px;
	background-image:url(image/chr_yuna.jpg);
	background-color:#ffffff;
	overflow:hidden;
}

.box_ex2{
	width:950px;
	height:594px;
	margin:auto;
	margin-top:10px;
	margin-bottom:5px;
	background-image:url(image/chr_ayaka.jpg);
	background-color:#ffffff;
	overflow:hidden;
}

.box_ex3{
	width:950px;
	height:594px;
	margin:auto;
	margin-top:10px;
	margin-bottom:5px;
	background-image:url(image/chr_shusei.jpg);
	background-color:#ffffff;
	overflow:hidden;
}

.box_ex4{
	width:950px;
	height:594px;
	margin:auto;
	margin-top:10px;
	margin-bottom:5px;
	background-image:url(image/chr_toru.jpg);
	background-color:#ffffff;
	overflow:hidden;
}

.box_ex5{
	width:950px;
	height:693px;
	margin:auto;
	margin-top:10px;
	margin-bottom:5px;
	background-image:url(image/special.jpg);
	background-color:#ffffff;
	overflow:hidden;
}

.box1,.box2,.box3,.box4{
	width:950px;
	margin:auto;
	margin-top:10px;
	margin-bottom:5px;
	background-color:#ffffff;
	overflow:hidden;
}
.box2{
	float:left;
	width:650px;
	background-color:#FFF;
	background-position:top right;
	background-repeat:repeat-y;
}
.box3{
	float:right;
	width:290px;
	background-color:#FFF;
	background-position:top right;
	background-repeat:repeat-y;
}
.box4{
	background-image:url(image/box4.gif);
	background-position:top right;
	background-repeat:repeat-y;
	font-size:8pt;
}
#body h2,#body h3,#body h4,#body h5{
	margin:auto;
	margin-top:0px;
	margin-bottom:0px;
	font-size:9pt;
	height:30px;
	line-height:30px;
	background-image:url(image/h.jpg);
	background-position:top left;
	background-repeat:repeat-x;
	overflow:hidden;
}
#body h3,#body h5{
	text-indent:10px;
	text-align:left;
}

#body h6{
	font-size:12px;
	font-family:"Times New Roman";
	color:#888888;
	margin:30px 10px 30px 10px;
	border-left:7px solid #888888;
	border-bottom:1px solid #888888;
	padding-left:5px;
	text-align:left;
}
#body .box4 h2,#body .box4 h3,#body .box4 h4,#body .box4 h5{
	font-size:8pt;
}
#body .box4 table,#body .box4 th,#body .box4 td{
	font-size:8pt;
}
.left1{
	width:650px;
	overflow:hidden;
}
.left2,.center1,.right2{
	width:290px;
	overflow:hidden;
}
.left3,.center2,.center3,.right3{
	width:215px;
	overflow:hidden;
}
.left1,.left2,.left3,.center1,.center2,.center3{
	float:left;
}
.right1,.right2,.right3{
	float:right;
}
.center1,.center2,.center3{
	margin-left:10px;
}

.box1 p{
	text-align:center;
}

#footer{
	clear:both;
	width:100%;
	height:150px;
	background-image:url(image/footer.jpg);
	background-position:top left;
	background-repeat:repeat-x;
	overflow:hidden;
}
.sbox{
	height:150px;
	overflow:auto;
	border:solid 1px #dddddd;
	-webkit-overflow-scrolling:touch;
}
.cbox{
	border:solid 1px #dddddd;
	background-color:#f5f5f5;
}
.right{
	text-align:right;
}
.center{
	text-align:center;
}
.f_left{
	float:left;
}
.f_right{
	float:right;
}
.clear{
	clear:both;
}
.large1{
	font-size:120%;
}
.large2{
	font-size:150%;
}
.small1{
	font-size:80%;
}
.small2{
	font-size:60%;
}
.table,.table th,.table td{
	border-style:solid;
	border-width: 1px;
}
.table img{
	vertical-align:bottom;
}
.hr {
	border-style:solid;
	border-width:1px 0px 0px 0px;
	margin:auto;
	margin-top:0.5em;
	margin-bottom:0.5em;
}
.up{
	clear:both;
	text-align:right;
	padding-right:10px;
}
#copy{
	font-size:8pt;
	color:#aaaaaa;
	width:100%;
	height:20px;
	background-color:#ffffff;
	overflow:hidden;
}
#copy p{
	float:right;
	width:50px;
	height:20px;
	margin:0px;
	padding:0px;
	text-align:right;
	overflow:hidden;
}
#copy a{
	color:#aaaaaa;
	text-decoration:none;
	background-image:url(image/copy.jpg);
	background-repeat:no-repeat;
	background-position:top left;
	padding-left:80px;
	display:block;
}

/*----------------------------
    スライドの設定
----------------------------*/
#slide {
	width: 950px;
	height: 400px;
	position: relative;
	margin: 0 auto;
	border: none;
}
	
#slide #list li {
	position: absolute;
	top: 0;
	left: 0;
}

#slide #navi {
	position: absolute;
	bottom: -40px;
	left: 0;
	font-size: 12px;
}
	
#slide #navi li {
	float: left;
	margin-right: 10px;
}
		
#slide #navi li a {
	display: block;
	border: 1px solid #ccc;
	padding: 0 10px;
	line-height: 30px;
	background: #eee;
	color: #000;
	text-decoration: none;
}
	
#slide #navi li a.current,
#slide #navi li a:hover {
	background: #999;
}
/*----------------------------
    Aboutコンテンツ
----------------------------*/
.about_box1{
	border:none;
	width:600px;
	text-align:center;
	margin:0 auto;
}
.about_box1 img.logo{
	float:left;
	display:inline;
	margin:0 30px 0px 0px;
}
.logo_box{
	padding:30px 0 20px;
}
	
.clear{
	clear:both;
	margin:0 10px 0;
}

.about_box2{
	width:410px;
	margin-top:10px;
	margin-left:60px;
	float:left;	
}

.about_box3{
	width:410px;
	margin-top:10px;
	margin-right:60px;
	float:right;
}

.about_box2 img.icon{
	float:left;
	display:inline;
	border:1px solid #CCC;
}

.about_box3 img.icon{
	float:left;
	display:inline;
	border:1px solid #CCC;
}
.about_box4{
	border:none;
	width:600px;
	text-align:center;
	margin:0 auto;
}

.about_box4 p{
	text-align:left;
}

.sns_btn{
	text-align:right;
	padding:0 20px;
}

/*----------------------------
    Link
----------------------------*/
article.link{
	border : 0;
}

/*----------------------------
    Link
----------------------------*/
.product_box1{
	margin:0 0 20px;
}
	
/*----------------------------
    infomation
----------------------------*/
dl#news{
    width:290px;
}
 
dl#news dt{
    clear:left;
    float:left;
    margin:0;
    padding:10px 0 10px 0.5em;
    width:7em;
    line-height:1.5em;
}
 
dl#news dd{
    margin:0;
    padding:10px 0.5em 10px 7em;
    border-bottom:1px solid #CCC;
    line-height:1.5em;
}
 
dl#news a{
    padding: 5px 20px 5px 0;
    color:#399CCD;
    text-decoration:underline;
}
 
dl#news a:hover{
    text-decoration:none;
}

/*----------------------------
    mail form
----------------------------*/

#contact{
	text-align: left;
	position:relative;
	margin:15px;
	padding : 10px 20px 10px 20px;
	width:500px;
	min-height:200px;
	z-index:100;
	border:1px solid #383838;
	background : #EFEFEF none repeat scroll 0% 0%;
}
div.contact_bottom{
	margin:0px 10px;
}
/** inputs and textarea**/
input:not([type="submit"]),
textarea{
	display:block;
	width:500px;
	padding:4px 8px;
	border:1px dashed #DBDBDB;
	color:#3F3F3F;
	font-family:'Droid Sans',Tahoma,Arial,Verdana sans-serif;
	font-size:12px;
	border-radius:2px;
	transition:background 0.2s linear,
	box-shadow 0.6s linear;
}
input:not([type="submit"]):active,
textarea:active,
input:not([type="submit"]):focus,
textarea:focus{
	background:#F7F7F7;
	border:dashed 1px #969696;
	box-shadow:2px 2px 7px #E8E8E8 inset;
}
input:not([type="submit"]){
	height: 15px;
}
textarea{
	min-height:150px;
	resize:vertical
;
}
/* placeholder */
::-webkit-input-placeholder  {
	color:#BABABA;
	font-style:italic;
}
input:-moz-placeholder,
textarea:-moz-placeholder{
	color:#BABABA ;
	font-style:italic;
}



/* colors */

.darkblue{
	color:#00008b;
}
.blue{
	color:#0000ff;
}
.cyan{
	color:#00ffff;
}
.skyblue{
	color:#87ceeb;
}
.lime{
	color:#00ff00;
}
.greenyellow{
	color:#adff2f;
}
.green{
	color:#008000;
}
.darkolivegreen{
	color:#556b2f;
}
.olive{
	color:#808000;
}
.darkkhaki{
	color:#bdb76b;
}
.red{
	color:#ff0000;
}
.tomato{
	color:#ff6347;
}
.brown{
	color:#a52a2a;
}
.maroon{
	color:#800000;
}
.saddlebrown{
	color:#8b4513;
}
.yellow{
	color:#ffff00;
}
.gold{
	color:#ffd700;
}
.orange{
	color:#ffa500;
}
.darkgoldenrod{
	color:#b8860b;
}
.magenta{
	color:#ff00ff;
}
.purple{
	color:#800080;
}
.blueviolet{
	color:#8a2be2;
}
.violet{
	color:#ee82ee;
}
.thistle{
	color:#d8bfd8;
}
.pink{
	color:#ffc0cb;
}
.mistyrose{
	color:#ffe4e1;
}
.tan{
	color:#d2b48c;
}
.wheat{
	color:#f5deb3;
}
.silver{
	color:#c0c0c0;
}
.gray{
	color:#808080;
}
.black{
	color:#000000;
}
.white{
	color:#ffffff;
}