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

/*-- Lois CRAYON --*/

#contents-left {
	width: 145px;
	float: left;
}

#contents-right {
	width: 585px;
	float: right;
}

.contents-midashi {
	width: 580px;
	padding-top: 5px;
}

.box-largeimage {
	width: 580px;
	height: 280px;
	margin-top: 40px;
}

.box-simple {
	width: 580px;
	height: 280px;
	margin-top: 20px;
}

.box-thumbnails {
	height: 77px;
	width: 580px;
	display: block;
}

.box-thumbnails ul{
    list-style:none;
    width:100%;
    margin: 0px;
}

.box-thumbnails ul li{
    list-style:none;
    float: left;
    margin: 0px 5px 0 0 ;
}

.box-thumbnails ul li a{
    display: block;
    height: 77px;
}

.box-thumbnails a.fam1{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/1set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam1 {
    background-position:0px -77px;
}

.box-thumbnails a.fam2{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/2set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam2 {
    background-position:0px -77px;
}

.box-thumbnails a.fam3{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/3set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam3 {
    background-position:0px -77px;
}

.box-thumbnails a.fam4{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/4set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam4 {
    background-position:0px -77px;
}

.box-thumbnails a.fam5{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/5set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam5 {
    background-position:0px -77px;
}

.box-thumbnails a.fam6{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/6set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam6 {
    background-position:0px -77px;
}

.box-thumbnails a.fam7{
	display:block;
	width:77px;
	background:url(../images/loiscrayon/family/7set.jpg) no-repeat;
	height:77px;
    text-indent:-200px;
    overflow:hidden;
}

.box-thumbnails a:hover.fam7 {
    background-position:0px -77px;
}

ul#page-navi{
    list-style:none;
    width:100%;
}

ul#page-navi li{
    list-style:none;
    margin-top: 10px;
    *margin-top: 0px;
    *margin-bottom: 10px;
}

#page-navi {
	display: block;
}

#page-navi a.family0{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/family-set.jpg) no-repeat;
	height:17px;
    text-indent:-200px;
    overflow:hidden;
}

#page-navi a:hover.family0 {
    background-position:0px -17px;
}

#page-navi a.family1{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/family-set.jpg) no-repeat;
	background-position: 0px -17px;
	height:17px;
    text-indent:-200px;
    overflow:hidden;
}

#page-navi a.music0{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music-set.jpg) no-repeat;
	height:17px;
    text-indent:-200px;
    overflow:hidden;
}

#page-navi a:hover.music0 {
    background-position:0px -17px;
}

#page-navi a.music1{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music-set.jpg) no-repeat;
	background-position: 0px -17px;
	height:17px;
    text-indent:-200px;
    overflow:hidden;
}

.company-navi {
	width: 100px;
}

/*-- music --*/

.box-detail {
	width: 466px;
	height: 455px;
	float:right;
	margin-top: 20px;
}

.box-covers {
	width: 55px;
	height: 450px;
	float: left;
	display: block;
	margin-top: 20px;
}

.box-covers ul{
    list-style:none;
    width:100%;
    margin: 0px;
}

.box-covers ul li{
    list-style:none;
    float: left;
    margin: 0px 0 5px 0 ;
}

.box-covers ul li a{
    display: block;
    height: 55px;
}

.box-covers a.cov1{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/1s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov1 {
    background-position:0px -55px;
}

.box-covers a.cov2{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/2s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov2 {
    background-position:0px -55px;
}

.box-covers a.cov3{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/3s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov3 {
    background-position:0px -55px;
}

.box-covers a.cov4{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/4s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov4 {
    background-position:0px -55px;
}

.box-covers a.cov5{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/5s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov5 {
    background-position:0px -55px;
}

.box-covers a.cov6{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/6s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov6 {
    background-position:0px -55px;
}

.box-covers a.cov7{
	display:block;
	width:55px;
	background:url(../images/loiscrayon/music/7s.jpg) no-repeat;
	height:55px;
    text-indent:-200px;
    overflow:hidden;
}

.box-covers a:hover.cov7 {
    background-position:0px -55px;
}