a:link { color: #FFF; }
a:visited { color: #FFF; }
a:hover { color: #FFF; }
a:active { color: #FFF; }
p{ margin-left:1em;}
body {
	font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
	color: #FFFFFF;
	background-image: url("images/bg2.gif");
	margin: 0 auto;

}
.header_grp{
    margin: 0 auto;
	width:1200px;
	background-color:#CC0000;
	overflow: hidden;
	box-sizing: border-box;
	padding:16px;
}
/* clearfix */
.header_grp:before,
.header_grp:after {
    content: "";
    display: table;
}
.header_grp:after {
    clear: both;
}
.title{
	height:90px;
	padding:16px 8px 8px 8px;
	float: left;
	background-color:#C00;
	border:5px #FFF dotted;
	font-weight:bold;
	font-size:30px;
	line-height:24px;
	box-sizing: border-box;
	overflow: hidden;
}
.title:hover{
	background-color:#A00;
}
.cm_top{
	background-color:#900;
	width:728px;
	height:90px;
	float: right;
}
.top_image{
    background-image: url("images/top2.jpg");
	width:1200px;
	height:600px;
	margin:0 auto;
	padding-top:120px;
	padding-left:50px;
	box-sizing: border-box;
}
.copy{
	font-size:60px;
	font-weight:bold;
	text-shadow: 2px 4px 3px rgba(0,0,0,0.8);
	margin:0;
}
.copy2{
	font-size:25px;
}
.nav{
    padding: 0;
    margin: 0;
    width: 1200px;
	margin:0 auto;
	overflow: hidden;
}
/* clearfix */
.nav:before,
.nav:after {
    content: "";
    display: table;
}
.nav:after {
    clear: both;
}
.nav_item {
	padding:70px 0;
	margin: 0;
	float: left;
	width: 25%;
	background-color:#333333;
	text-align: center;
	font-size:2.5em;
	box-sizing:border-box;
	border:5px #333 dotted;
	position: relative;
}
.nav_item:hover {
	background-color:#CC0000;
	border:5px #FFF dotted;
}
.cont{
	background-image:url(images/bg5.gif);
	width:1200px;
	color: #333333;
	margin:0 auto;
	padding:20px;
	box-sizing: border-box;
	overflow: hidden;
}
.cont_onsei{
	background-image:url(images/bg5.gif);
	width:auto;
	max-width:900px;
	color: #333333;
	margin:0 auto;
	padding:20px;
	box-sizing: border-box;
	overflow: hidden;
}
/* clearfix */
.cont:before,
.cont:after {
    content: "";
    display: table;
}
.cont:after {
    clear: both;
}
.cont a:link { color: #f00; }
.cont a:visited { color: #f00; }
.cont a:hover { color: #f00; }
.cont a:active { color: #f00; }
.cont_onsei a:link { color: #f00; }
.cont_onsei a:visited { color: #500; }
.cont_onsei a:hover { color: #f55; }
.cont_onsei a:active { color: #f00; }

.left_grp{
float: left;
}

.info{
	background-color:#FFFFFF;
	width:840px;
	border:1px #CCC solid;
	box-sizing:border-box;
	padding-left:2em;
	padding-right:2em;
	padding-bottom:2em;
	margin-bottom:20px;
}
.info_onsei{
	background-color:#FFFFFF;
	width:auto;
	border:1px #CCC solid;
	box-sizing:border-box;
	padding-left:2em;
	padding-right:2em;
	padding-bottom:2em;
	margin-bottom:20px;
}
.info_bgm{
	background-color:#FFFFFF;
	border:1px #CCC solid;
	box-sizing:border-box;
	padding-left:2em;
	padding-right:2em;
	padding-bottom:2em;
}
.cm2{
	width:300px;
	height:600px;
	background-color:#FFF;
	float: right;
	margin-top:20px;
}

h1{
	font-size:1.5em;
	border-bottom:2px #C00 solid;
	padding-top:1em;
	display:inline-block;
	padding-left:0.5em;
	padding-right:0.5em;
}
h2{
	background-color:#333;
	color:#CCCCCC;
	margin-top:32px;
	padding:16px;
	font-size: 16px;
}
.nav_bottom{
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    margin: 0;
    width: 1200px;
	margin:0 auto;
	overflow: hidden;
	background-color:#333333;
	text-align: center;
}
.footer_grp{
	background-color:#CC0000;
	width:1200px;
	margin:0 auto;
	padding:16px;
	box-sizing: border-box;
	overflow: hidden;
}
.copyright{
	float: left;
}
.cm3{
	background-color:#900;
	width:728px;
	height:90px;
	float: right;
}
.sort table{
	border-collapse:collapse;
	border:1px #999 solid;
}
.sort th{
	padding: 0.5em;
	background-color: #CCC;
	border-left:1px #999 solid;
	border-right:1px #999 solid;
}
.sort td{
	padding:0.5em;
	border-left:1px #999 solid;
	border-right:1px #999 solid;
}
.sort_button{
	width:100%;
	cursor: pointer;
}
.sort_top table{
	border-collapse:collapse;
	border:1px #CCC solid;
	width:300px;
	float: right;
}
.sort_top th{
	padding: 0.5em;
	background-color: #333;
	border-left:1px #CCC solid;
	border-right:1px #CCC solid;
	color:#FFF;
}
.sort_top td{
	padding:0.5em;
	border-left:1px #CCC solid;
	border-right:1px #CCC solid;
	background-color:#FFFFFF;
}
.label{
	padding-right:1em;
	display:inline-block;
	cursor: pointer;
}
.musiclist table {
	border-collapse:collapse;
	border:0px;
}
.musiclist   th {
	padding: 0.5em;
	background-color: #CCC;
	text-align: left;
}
.musiclist   td {
	border-width: 1px 0px;
	border-color: #999999;
	border-style: solid;
	padding: 0.5em;
}
.category {
	background-color:#333;
	color:#FFF;
	text-align:center;
	font-weight: bold;
}
.mp3 {
	background-color: #fff;
	padding:0.25em;
	margin:1px;
	color: #666666;
	display: inline-block;
	text-align: center;
	border: 1px #fff solid;
	width: 3em;
}
.mp3:hover {
	text-decoration: underline;
}

.width70 {
	width:70%;
}
.width30 {
	width:30%;
}

.new{
	color:#F00;
	font-weight:bold;
	font-size:0.75em;
	margin: 1px;
}

.bgm_tag{
	color: #666666;
	background-color: #eee;
	font-weight:bold;
	font-size:0.75em;
	margin: 1px;
	display: inline-block;
	text-align: center;
	border: 1px #666666 solid;
	width: 6em;
}
.bgm_tag:hover {
	color: #eee;
	background-color: #999999;
	border: 1px #999999 solid;
}

.loop_tag{
	color: #669966;
	background-color: #eeffee;
	font-weight:bold;
	font-size:0.75em;
	margin: 1px;
	display: inline-block;
	text-align: center;
	border: 1px #669966 solid;
	width: 6em;
}

.sougo{
	color:#FFF;
	background-color:#0C0;
	border: 1px green solid;
	margin-left: 0.5em;
	font-size:small;

}
.sort_cate{
	color:#333;
	display:inline-block;
	font-size:small;
}
.order_cont{
	width:100%;
}
.order1{
	float:left;
	padding-right:1em;
}
.order1_box{
	background-color:#EEE;
	padding:1em;
}
.order2{
	float:right;
	padding-left:1em;
}
.order2_box{
	background-color:#DDD;
	padding:1em;
}
.clear {
    clear: both;
}
.demo{
	background-color:#333333;
	padding:1em;
	text-align:center;
	color:#FFFFFF;
}
.bold{
font-weight:bold;
}

.bgm_bana{
	margin-left: 1em;
	border: 10px double #333;
	box-sizing:border-box;
}

.album_title{
	font-weight:bold;
	color: #C00;
	font-size:1.5em;
}
.pay{
	border: 1px #333 solid;
	border-collapse: collapse;
	margin-left: 1em;
}
.pay th{
	border: 1px #333 solid;
	background-color: #333;
	color: #FFF;
}
.pay tr{
	border: 1px #333 solid;
	background-color: #FFF;
}
.pay td{
	border: 1px #333 solid;
	padding: 0.5em;
}
.redzone{
background-color: #FDD;
font-weight: bold;
}

.works_box{
	margin-bottom: 2em;
	margin-top: 2em;
	margin-left: 1em;
	border:1px #eee solid;
	box-sizing:border-box;
	padding:1em;
	background-color: #eee;
}
