@charset "utf-8";

html{height:100%;}
body{height:100%;background-color:#fff;}
.pc{display:none;}
.sp{display:block;}

.cd_design{ width:86%;}

#pagetop{ position: fixed;bottom: 0;right: 0; z-index:9999; margin:0; padding:0;}
#right-menu{position:fixed; width:100%; bottom:0; z-index:9999; }
#bnn img{ width:90%; margin-left:5%; margin-bottom:10px;}
#update{ position:relative;width:90%; height:auto; margin:10px auto; padding:1%; background-image:url(../img/update_title.jpg); background-position:center left; border-top:2px solid #6F82CF; border-bottom:2px solid #6F82CF;  background-size:15%; background-repeat:no-repeat;}
#update p {margin-left:16%; color:#1F22A7;}
#update a{color:#03F;}
#contents-wrapper .title{ width:100%;}
#contents-wrapper h4{ font-size:18px; color:#0153ff; font-weight:bold; margin:1% 6%;}
#contents-wrapper p{ font-weight:normal; font-weight:bold; margin:1% 6%; font-size: 116%;}

#songs{ width:80%; font-size:93%; margin:1% auto; background-color:#fff; border-radius:3px; padding:1% 5% ; border:1px solid #bbf0ff; position:relative; overflow:hidden;}
#songs .title {width:70%;}
#songs ul { position:relative; color:#ea6516; clear:both;}


#songs ul li{ position:relative;  display:table-cell; vertical-align:middle; float:left;color:#ea6516; font-size:80%; padding:0.2em 0.5%; }
#songs ul li:first-child{ width:6%; }
#songs ul li:nth-child(2){ width:36%; border-left:1px dotted #ec6941;}
#songs ul li:nth-child(3){ width:50%; border-left:1px dotted #ec6941; }

#songs ul:first-child li{ background-color:#fff45c;}
#songs ul:nth-child(even) li{background-color:#fffbbe;}
#songs ul.top li{background-color:yellow;}

.sound{ display:block; width:80%;; margin:0 auto;}
.sound img{ margin:1%; display:block; float:left; width:14%; }
img.opacity{ opacity: 0.1;}
#spec { width:78%; margin:5%; padding:5%; background-image:url(../img/spec_bg.png); border-radius:3px; border:1px solid #bbf0ff;}

#footer{ width:100%; padding-bottom:1%;}
#footer img{ display:block; margin:0 auto; width:90%;}
.clear{ clear:both;}
ruby rt{font-size:70%;}

#chara img{width:100%;}
.icon-voice1 {width:5%; height:5%; background-color:none; position:absolute; margin-top:3.2%; margin-left:45%;}
.icon-voice2 {width:5%; height:5%; background-color:none; position:absolute; margin-top:3.2%; margin-left:51%;}
.icon-voice3 {width:5%; height:5%; background-color:none; position:absolute; margin-top:3.2%; margin-left:57%;}
.chara1{fill:#5177AF;}
.chara2{fill:#2A4D80;}
.chara3{fill:#627550;}
.chara4{fill:#C0B95D;}
.chara5{fill:#33C3B7;}
.chara6{fill:#B54949;}
.chara7{fill:#F9972E;}
.chara8{fill:#DEBC25;}
.chara9{fill:#8F82BC;}
.chara10{fill:#9A3F5B;}
.chara11{fill:#959595;}
.chara12{fill:#39924E;}









#chara ul li img{width:100%;}

/*応援&twitter*/

#banner li{ margin:1%; display:none;}

#banner ul{margin-left:8%;}
#banner.yoyaku_waku ul{ margin:0 auto;}
ul.ouen li,ul.icon li,ul.yoyaku li{float:left; }
ul.ouen:after,ul.icon:after,ul.yoyaku:after{
	content:"";
	display:block;
	height:0;
	font-size:0;
	clear:both;
	visibility:hidden;}
#banner ul.icon li {width:16%;}
#banner ul.ouen li {width:16%;}
#banner ul.yoyaku li {width:48%;}

#banner ul img{width:100%;}


/*----------------------------------------------------
 smart phone / tabret
----------------------------------------------------*/

@media screen and (min-width: 640px) {
	#banner.yoyaku_waku ul{ margin-left:90px;}
	#banner ul.yoyaku li {width:30%; margin:0.2%;}
	

.sp{display:none;}
.pc{display:block;}
	
body{ background-image:url(../img/bg.jpg); background-position:top center; background-repeat:no-repeat; background-attachment:fixed;}
#pc-nav{ height:68px; width:100%; background-image:url(../img/menu_bg.jpg); box-shadow:2px 2px 10px #03F; z-index:9999; position:fixed;}
#pc-nav ul{width:1000px; height:68px; display:block; margin:0 auto;}
#pc-nav ul li{ float:left; height:68px;}
/*
#pc-nav ul li:nth-child(1){ width:172px; background-image:url(../img/menu1_off.png);}
#pc-nav ul li a{ height:100%; width:100%; background-color:#0B0; text-indent:-9999;}
#pc-nav ul li:nth-child(2){ width:200px; background-image:url(../img/menu2_off.png);}
#pc-nav ul li:nth-child(3){ width:150px; background-image:url(../img/menu3_off.png);}
#pc-nav ul li:nth-child(4){ width:150px; background-image:url(../img/menu4_off.png);}
#pc-nav ul li:nth-child(5){ width: 51px; background-image:url(../img/menu5_off.png);}
#pc-nav ul li:nth-child(6){ width: 49px; background-image:url(../img/menu6_off.png);}
#pc-nav ul li:nth-child(7){ width:228px; background-image:url(../img/menu7_off.png);}
#pc-nav ul li a{ height:68px; width:100%;}
*/
#main-wrapper{width:1280px; height:730px; margin:0 auto; }
#main-wrapper ul{width:1280px; position:absolute; }

#main-wrapper ul li.logo { position:absolute; top:551px; opacity:0; left:121px; width:581px; height:207px; background-image:url(../img/main_logo.png); z-index:6; margin-top:-50px; }
#main-wrapper ul li.copy { opacity:0;position:absolute; top:95px; left:608px; width:534px; height:45px; background-image:url(../img/main_copy.png);z-index:10}
#main-wrapper ul li.chara{
	opacity: 0;
	position: absolute;
	top: 37px;
	left: 140px;
	width: 637px;
	height: 655px;
	background-image: url(../img/main_chara.png);
	margin-top: 50px;
}
#main-wrapper ul li.ds{ opacity:0;position:absolute; top:133px; left:736px; width:419px; height:428px; background-image:url(../img/main_3ds.png);z-index:8; margin-left:-310px}
#main-wrapper ul li.price{opacity:0; position:absolute; top:615px; left:726px; width:415px; height:95px; background-image:url(../img/main_price.png);}

#bnn{position:relative; width:1000px; margin:30px auto 0; }
#bnn ul li{float:left;}
#bnn ul li img{ width:auto; margin:0;}
#bnn ul li:nth-child(odd){ margin-right:20px;}
/*#bnn ul li:nth-child(2){ background-color:green;}*/

#update{ position:relative;width:1000px; height:30px; margin:10px auto; background-image:url(../img/update_bg.jpg); background-size:auto; background-position:center; padding:0; border:none;}
#update p{ display:block; margin-left:100px;color:#1F22A7; padding-top:6px; }

#contents-wrapper{width:1000px; margin:0 auto; background-image:url(../img/contents_bg.png);}
#contents-wrapper h4{ font-size:26px; color:#0153ff; font-weight:bold; margin:1% 6%;}

#songs .title {width:auto;}
#songs ul { width:800px; margin:0 auto;}
.sound { margin-left:245px;}
.sound img{ width:auto; margin:6px;  }
#top-wrapper{ background-origin:}
#footer img{ width:auto;}

#corda3,#banner{padding-top:68px;}

/*コルダ３とは*/
#school ul{width:880px; margin:0 auto;}
#school ul li{ width:420px; height:256px; border:1px solid #bbf0ff; border-radius:5px; background-color:#fff;
float:left; margin-top:10px; padding:5px}

#school ul li p{ margin:12px 23px; font-weight:normal; }
#school ul li.seiso, #school ul li.jinnan{ margin-right:10px;}

.icon-voice1 {
	width: 49px; height:49px; position:absolute;
	margin-top:58px; margin-left:437px;
	
}
.icon-voice2 {
	width: 49px;
	height: 49px;
	position: absolute;
	margin-top: 58px;
	margin-left: 500px;
	left: 478px;
	top: 1809px;
}
.icon-voice3 {
	width: 49px; height:49px;  position:absolute;
	margin-top:58px; margin-left:563px;
	
}



}
	
@media screen and (min-width: 640px)and (max-width:1119px) {	
#main-wrapper{ margin-left:-140px;}

.cd_design{ width:860px;}

}