@charset "UTF-8";


body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{
	margin:0;
	padding:0;
	list-style: none;
}
article,nav,header,footer,section,aside {
	display: block;
}
html{
	background-color: #ffffff;
	overflow-x: hidden;
	overflow-y: scroll;
}

body{
	text-align: left;
	font-size: 77%;
	color: #000000;
	background: url(../images/bg_body.png) 0 0 repeat-x;
}
body {
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Arial,Verdana,"ＭＳ Ｐゴシック",sans-serif;
	font-family: 'PT Sans', sans-serif;
}
.mac body{
	font-family: 'PT Sans', sans-serif;
}
dd {
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Arial,Verdana,"ＭＳ Ｐゴシック",sans-serif;
	font-family: 'PT Sans', sans-serif;
}
.mac dd {
	font-family: 'PT Sans', sans-serif;
}
p {
	line-height: 150%;
}
img{
	border:0;
	vertical-align:bottom
}
h1,h2,h3,h4,h5,h6{
}
a {
	color: #000000;
	text-decoration: none;
}
a:hover {
	color: #000000;
	text-decoration: none;
}

nav,section {
	display: block;
}
img {
	border: none;
}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix {
  min-height: 1px;
}

*html .clearfix {
  height: 1px;
  /**//*/
  height: auto;
  overflow: hidden;
  /**/
}
area {
	outline: none;
}



/***header
*******************/
header {
	display: block;
	width: 100%;
	width: 1024px;
	position: fixed;
	top: 0;
	left: 0;
}
header #border {
	display: block;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	background-color: #000;
	z-index: 30;
	
}
header #comingsoon {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20;
}

/***footer
*******************/
footer {
	position: fixed;
	bottom: 0;
	width: 100%;
	min-width: 1024px;
	height: 50px;
	padding-top: 7px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/bg_footer.gif);
	background-position: 5px 0;
}
#top footer {
	background: none;
}

#footer_inner {
	min-width: 1024px;
	width: 100%;
	margin: 0 auto;
	height: 50px;
	background-color: #000;
}
footer #gnavi {
	float: left;
	margin-left: 25px;
}
footer #gnavi ul {
	margin-right: 28px;
	padding-right: 3px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/gnavi_border.png);
	background-repeat: no-repeat;
	background-position-x: 100%;
}
.mac.gecko footer #gnavi ul {
	padding-right: 5px;
	width: 312px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/gnavi_border.png);
	background-position: 100% 0;
	display: block;
}
footer #gnavi li {
	float: left;
}
footer #gnavi li a {
	display: block;
	width: 104px;
	height: 51px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/gnavi_over.png);
	background-position: 0 -51px;
	background-repeat: no-repeat;
}
footer #gnavi .last {
	padding: 0;
	background: none;
}
footer #gnavi .active {
	background-image: url(http://client.oil-production.jp/matf/111115/images/gnavi_bg.png);
}
footer #subnavi {
	float: right;
	padding-top: 20px;
}
footer #subnavi ul {
	margin-right: 28px;
}
footer #subnavi li {
	background-image: url(http://client.oil-production.jp/matf/111115/images/navi_dot.png);
	background-repeat: no-repeat;
	background-position: 100% 0;
	padding-right: 15px;
	float: left;
}
footer #subnavi .last {
	padding: 0;
	background: none;
}
footer #subnavi .copyright {
	margin-left: 10px;
}


#mask {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	display:block;
	opacity: 1;
	background-color: #ffffff;
	background-image: url(../images/bg_under.gif);
	background-repeat: repeat-x;
	background-position: 0 0;
}
#artist_detail #mask {
	background-image: url(../images/bg_artist.gif);
}
#loader {
	position: absolute;
	top: 50%;
	left: 50%;
}

#social {
	position: fixed;
	top: 10px;
	right: 10px;
	z-index: 10;
}

/***container
*******************/
#container {
	min-width: 1000px;
	width: 100%;
	height: 100%;
	font-size: 100%;
	line-height: 200%;
	letter-spacing: -1px;
	line-height: 180%;
	letter-spacing: 0px;
}
.win.ie #container {
	font-size: 110%;
	letter-spacing: 0px;
}

/***contents
*******************/
#contents {
	float: left;
	font-size: 90%;
	min-width: 1000px;
	width: 100%;
}
#contents p {
	line-height: 200%;
	color: #221815;
}
#contents p a {
	text-decoration: underline;
}

/***menu
*******************/
#menu {
	width: 130px;
	float: left;
	position: fixed;
	top: 0;
	left: 150px;
}
#menu li {
	margin-bottom: 20px;
	line-height: 100%;
}

/***main
*******************/
#main {
	float: left;
	width: 100%;
	background: none;
}

#drag {
	position: fixed;
	display: none;
	z-index: 30;
}
.white {
	background-color: #000;
	color: #fff;
	padding: 1px;
}




/***top
*******************/
#top {
	width: 100%;
}
#top #mask {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #FFFFFF;
	z-index: 9800;
	background-size: 100%;
	display:block;
	opacity: 1;
}
#top header nav {
	margin-bottom: 220px;
}
#top #contents {
	width: 100%;
}
#top #main {
	position: relative;
	overflow: hidden;
	height: 590px;
}
#top #main #left_cont {
	position: relative;
	float: left;
	width: 50%;
	height: 490px;
	margin-top: 50px;
}
#top #main #left_cont #freeisnotfree {
	position: absolute;
	margin-bottom: 10px;
	top: 0%;
	left: 12%;
}
#top #main #left_cont #matf {
	position: absolute;
	top: 12%;
	left: 14%;
	display: block;
	width: 445px;
	height: 97px;
	padding: 10px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/bg_about.gif);
	background-repeat: no-repeat;
	background-position: -600px 0;
}
#top #main #left_cont #update {
	position: absolute;
	top: 26%;
	left: 14%;
	display: block;
	width: 108px;
	height: 11px;
	padding: 10px;
	font-size: 350%;
	font-weight: bold;
	line-height: 150%;
}
#top #main #left_cont #message {
	position: absolute;
	top: 51%;
	left: 14%;
	display: block;
	width: 487px;
	height: 128px;
	padding: 10px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/bg_about.gif);
	background-repeat: no-repeat;
	background-position: -600px 0;
}
#top #main #left_cont #message_en {
	position: absolute;
	bottom: 0;
	left: 14%;
	display: block;
	width: 487px;
	height: 70px;
	padding-left: 10px;
	background-image: url(http://client.oil-production.jp/matf/111115/images/bg_about.gif);
	background-repeat: no-repeat;
	background-position: -600px 0;
}
#top #main #left_cont #btn_about {
	position: absolute;
	bottom: 0%;
	left: 15%;
	display: block;
	width: 385px;
	height: 23px;
	background-color: #000;
	background-image: url(http://client.oil-production.jp/matf/111115/images/bg_about.gif);
	background-repeat: no-repeat;
	background-position: -600px 0;
}
#top #main #right_cont {
	float: left;
	width: 49%;
	height: 590px;
}
#top #main #right_cont #logo_matf {
	position: absolute;
	left: 50%;
	top: 15%;
}


#top #news {
	width: 100%;
	min-width: 999px;
	height: 159px;
	margin: 0 auto;
	background-color: #000;
	position: fixed;
	bottom: 0;
	left: 0;
	padding-left: 25px;
	border-bottom: solid 3px #000;
}

#top #articles {
	width: 2000px;
}
#top #news .article {
	float: left;
	width: 290px;
	padding: 20px;
}
#top #news .article .news_thumb {
	float: left;
	width: 124px;
	height: 76px;
	display: block;
	background-repeat: no-repeat;
	background-position: 3px 3px;
}
#top #news .article .news_thumb .news {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2;
}
#top #news .article .news_tag {
	display: block;
	line-height: 100%;
	float: left;
	width: 35px;
	height: 11px;
}
.win.ie #top #news .article .news_tag {
	margin-top: -7px;
}
#top #news .article .news_date {
	display: block;
	line-height: 100%;
	float: left;
	width: 120px;
	padding: 0 5px;
	font-size: 80%;
	font-weight: bold;
	color: #ff0000;
}
#top #news .article .news_title {
	display: block;
	margin-top: 15px;
	color: #ffffff;
	font-weight: bold;
	letter-spacing: 0.07em;
}
.win.ie #top #news .article .news_title {
	display: block;
	font-size: 90%;
}
#top #news .article .news_text {
	font-size: 70%;
	color: #ffffff;
}
.win.ie #top #news .article .news_text {
	font-size: 65%;
}



/***about
*******************/
#about {
	width: 100%;
}
#about #contents #nav {
	position: absolute;
	display: block;
	width: 100%;
	min-width: 1024px;
	text-align: right;
	z-index: 10;
}
.win.ie #about #contents #nav {
	top:0;
	left:0;
}
#about #contents #nav #logo_matf {
	margin-left: 20px;
	margin-top: 15px;
	float: left;
	width: 123px;
	height: 75px;
	display: block;
}
#about #contents #nav #breadlist {
	float: left;
	margin-top: 55px;
	margin-left: 15px;
	text-align: left;
	font-size: 110%;
	font-weight: bold;
	width: 250px;
}
#about #contents #nav #breadlist li {
	float: left;
	padding-right: 5px;
}
#about #contents #nav #contentnavi {
	float: right;
	margin-top: 35px;
	margin-right: 2px;
	width: 460px;
}
#about #contents #nav #contentnavi li {
	float: left;
	padding: 0 18px 0 7px;
	background-image: url(../images/navi_about_sepa.png);
	background-repeat: no-repeat;
	background-position: 100% 100%;
	cursor: pointer;
}
#about #contents #nav #contentnavi .last {
	background: none;
}
/**selector**/
#about #main {
	overflow: hidden;
	width: 100%;
	height: 580px;
	padding-left: 0px;
	cursor: move;
	position: relative;
	top: 110px;
}
.win.ie #about #main {
	font-size: 90%;
	height: 570px;
}
#about #main #about_matf {
	width: 5200px;
}

#about #main #articles {
	width: 5200px;
}
#about #main #about_matf #object_matf {
	display: block;
	width: 248px;
	height: 248px;
	float: left;
	margin-right: 20px;
}
#about #main #about_matf dl {
	float: left;
	margin-left: 40px;
	display: block;
}
#about #main #about_matf .nonmargin {
	margin-left: 0;
}
#about #main #about_matf dt {
	display: block;
	height: 17px;
	margin-bottom: 15px;
}
#about #main #about_matf dd .first {
	width: 322px;
	display: block;
	float: left;
	margin-right: 20px;
}
#about #main #about_matf dd .second {
	width: 322px;
	display: block;
	float: left;
	margin-right: 20px;
}
#about #main li {
	display: block;
	float: left;
	padding-top: 180px;
}
#about #main #articles #about00 {
	width: 346px;
	padding-top: 0;
}
#about #main #about00 #freeisnotfree {
	margin-bottom: 12px;
	margin-top: 20px;
	margin-left: 45px;
}
#about #main #about00 #matf {
	margin-bottom: 18px;
	margin-left: 65px;
	width: 817px;
	height: 44px;
}
#about #main #about00 #message {
	margin-bottom: 37px;
	margin-left: 65px;
	width: 1880px;
	height: 18px;
}
#about #main #about_matf #about00 #object_about {
	display: block;
	width: 248px;
	height: 248px;
	float: left;
	margin-top: 33px;
	margin-left: 65px;
}
#about #main #about_matf dd .small {
	font-size: 70%;
	margin: 0;
	padding: 0;
	display: block;
	line-height: 180%;
}




/***artist
*******************/
#artist {
	width: 100%;
}
#artist #contents #nav {
	position: absolute;
	display: block;
	width: 100%;
	min-width: 1024px;
	text-align: right;
	z-index: 10;
}
.win.ie #artist #contents #nav {
	top:0;
	left:0;
}
#artist #contents #nav #logo_matf {
	margin-left: 20px;
	margin-top: 15px;
	float: left;
	width: 123px;
	height: 75px;
	display: block;
}
#artist #contents #nav #breadlist {
	float: left;
	margin-top: 55px;
	margin-left: 15px;
	text-align: left;
	font-size: 110%;
	font-weight: bold;
}
#artist #contents #nav #breadlist li {
	float: left;
	padding-right: 5px;
}
#artist #contents #nav #contentnavi {
	float: right;
	margin-top: 35px;
	margin-right: 2px;
}
#artist #contents #nav #contentnavi li {
	float: left;
	padding: 0 18px 0 7px;
	background-image: url(../images/navi_about_sepa.png);
	background-repeat: no-repeat;
	background-position: 100% 100%;
	cursor: pointer;
}
#artist #contents #nav #contentnavi .last {
	background: none;
}
/**selector**/
#artist #main {
	overflow: hidden;
	width: 100%;
	height: 580px;
	padding-left: 0px;
	cursor: move;
	position: relative;
	top: 110px;
}
.win.ie #artist #main {
	font-size: 90%;
	height: 570px;
}
#artist #main #about_matf {
	width: 1200px;
}

#artist #main #articles {
	width: 1200px;
}
#artist #main #about_matf #object_matf {
	display: block;
	width: 248px;
	height: 248px;
	float: left;
	margin-right: 20px;
}
#artist #main #about_matf dl {
	float: left;
	margin-left: 40px;
	display: block;
}
#artist #main #about_matf .nonmargin {
	margin-left: 0;
}
#artist #main #about_matf dt {
	display: block;
	height: 17px;
	margin-bottom: 15px;
}
#artist #main #about_matf dd .first {
	width: 322px;
	display: block;
	float: left;
	margin-right: 20px;
}
#artist #main #about_matf dd .second {
	width: 322px;
	display: block;
	float: left;
	margin-right: 20px;
}
#artist #main #articles li {
	display: block;
	float: left;
	padding-top: 180px;
	width: 300px;
}
#artist #main #articles li .artist_img {
	display: block;
	width: 256px;
	height: 165px;
	background-image: url(../images/artist/index_img_frame.gif);
	padding: 2px;
}
#artist #main #articles li .artist_date {
	color: #ff0000;
	display: block;
	font-size: 100%;
	font-weight: bold;
	line-height: 100%;
	margin: 15px 0 3px;
}
#artist #main #articles li .artist_name {
	display: block;
	font-size: 130%;
	font-weight: bold;
}
#artist #main #articles li .artist_description {
	display: block;
	width: 260px;
	font-size: 90%;
	line-height: 180%;
}

#artist #main #articles #artist00 {
	width: 346px;
	padding-top: 0;
}
#artist #main #artist00 #freeisnotfree {
	margin-bottom: 12px;
	margin-top: 20px;
	margin-left: 45px;
}
#artist #main #artist00 #matf {
	margin-bottom: 73px;
	margin-left: 65px;
	width: 817px;
	height: 44px;
}
#artist #container #container_inner #contents #main #main_drag #about_matf #articles #artist00 #object_artist {
	display: block;
	width: 249px;
	height: 248px;
	float: left;
	margin-top: 13px;
	margin-left: 65px;
}
#artist #main #about_matf dd .small {
	font-size: 70%;
	margin: 0;
	padding: 0;
	display: block;
	line-height: 180%;
}





/***artist_entry
*******************/
#artist_entry {
	width: 100%;
}
#artist_entry #drag {
	display: block;
}
#artist_entry #contents #nav {
	position: absolute;
	display: block;
	width: 100%;
	min-width: 1024px;
	text-align: right;
	z-index: 10;
}
.win.ie #artist_entry #contents #nav {
	top:0;
	left:0;
}
#artist_entry #contents #nav #logo_matf {
	margin-left: 20px;
	margin-top: 15px;
	float: left;
	width: 123px;
	height: 75px;
	display: block;
}
#artist_entry #contents #nav #breadlist {
	float: left;
	margin-top: 55px;
	margin-left: 15px;
	text-align: left;
	font-size: 110%;
	font-weight: bold;
}
#artist_entry #contents #nav #breadlist li {
	float: left;
	padding-right: 5px;
}
#artist_entry #contents #nav #contentnavi {
	float: right;
	margin-top: 35px;
	margin-right: 2px;
}
#artist_entry #contents #nav #contentnavi li {
	float: left;
	padding: 0 18px 0 7px;
	background-image: url(../images/navi_about_sepa.png);
	background-repeat: no-repeat;
	background-position: 100% 100%;
}
#artist_entry #contents #nav #contentnavi .contentnavis {
	cursor: pointer;
}
#artist_entry #contents #nav #contentnavi .last {
	background: none;
}
/**selector**/
#artist_entry #main {
	overflow: hidden;
	width: 100%;
	height: 590px;
	padding-left: 0px;
	cursor: move;
	position: relative;
	top: 110px;
}
.win.ie #artist_entry #main {
	font-size: 90%;
	height: 570px;
}
#artist_entry #main #artist_matf {
	width: 2500px;
	position: relative;
}

#artist_entry #main #artist_matf #articles {
	width: 2500px;
}
#artist_entry #main #artist_matf #articles li {
	display: block;
	float: left;
	padding-top: 180px;
	padding-left: 40px;
}

#artist_entry #main #artist_matf #articles li dl {
	float: left;
	display: block;
}
#artist_entry #main #artist_matf #articles li .nonmargin {
	margin-left: 0;
}
#artist_entry #main #artist_matf #articles li dt {
	display: block;
	height: 17px;
	margin-bottom: 15px;
}
#artist_entry #main #artist_matf #articles li dd .first {
	width: 370px;
	display: block;
	float: left;
	margin-right: 20px;
}

/*****artist00***********/
#artist_entry #main #artist_matf #articles #artist00 {
	width: 630px;
	padding-top: 0;
	z-index: 1000;
}
#artist_entry #main #artist_matf #articles #img_artist {
	display: block;
	width: 525px;
	height: 341px;
	float: left;
	margin-left: 65px;
	padding: 3px;
	background-image: url(../images/artist/bg_img_artist.gif);
	background-repeat: no-repeat;
}

#artist_entry #main #artist_matf #articles #artist00 #freeisnotfree {
	margin-bottom: 21px;
	margin-top: 20px;
	margin-left: 45px;
}
#artist_entry #main #artist_matf #articles #artist00 #ttl_artist {
	margin-bottom: 30px;
	margin-left: 65px;
	width: 817px;
	height: 44px;
}
#artist_entry #main #artist_matf #articles #profile {
	z-index: -1;
}

/*****playlist***********/
#artist_entry #main #artist_matf #articles #playlist {
	width: 800px;
	margin-top: -55px;
}
#artist_entry #main #artist_matf #articles #playlist #flash {
	display: block;
	float: left;
	margin-right: 45px;
}
#artist_entry #main #artist_matf #articles #playlist #tracks {
	display: block;
	float: left;
	margin-top: 65px;
	width: 303px;
}
#artist_entry #main #artist_matf #articles #playlist #tracks #tag_tracks {
	display: block;
	width: 45px;
	float: left;
}
#artist_entry #main #artist_matf #articles #playlist #tracks #btn_buy {
	display: block;
	width: 33px;
	float: right;
}
#artist_entry #main #artist_matf #articles #playlist #tracks #tracklists {
	width: 303px;
	border-top: solid 1px #000;
	margin-top: 10px;
}
#artist_entry #main #artist_matf #articles #playlist #tracks #tracklists li {
	border-bottom: solid 1px #000;
	width: 100%;
	height: 25px;
	margin: 0;
	padding: 0;
}


/*****disconnect***********/
#artist_entry #main #artist_matf #articles #disconnect {
	padding-top: 90px;
	width: 985px;
}
#artist_entry #main #artist_matf #articles #disconnect dd {
	width: 985px;
}
#artist_entry #main #artist_matf #articles #disconnect dd #videoframe {
	width: 502px;
	height: 370px;
	display: block;
	float: left;
	margin-right: 20px;
	cursor: pointer;
	margin-top: 3px;
}
#artist_entry #main #artist_matf #articles #disconnect dd .videolist_box_list {
	width: 304px;
	display: block;
	float: left;
	margin-right: 0;
	margin-top: -10px;
}
#artist_entry #main #artist_matf #articles #disconnect  #label_videolist {
	margin-bottom: 9px;
	display: block;
}
#artist_entry #main #artist_matf #articles #disconnect .videolist_box {
	display: block;
	width: 304px;
	height: 26px;
	border-bottom: solid 1px #000000;
}
#artist_entry #main #artist_matf #articles #disconnect .videolist_box .icon_videoplayer {
	display: block;
	width: 29px;
	float: left;
	background-image: url(../images/artist/icon_videoplayer_off.png);
	background-position: 9px 7px;
	background-repeat: no-repeat;
}
#artist_entry #main #artist_matf #articles #disconnect .selected .icon_videoplayer {
	background-image: url(../images/artist/icon_videoplayer_on.png);
	background-position: 9px 7px;
	background-repeat: no-repeat;
}
#artist_entry #main #artist_matf #articles #disconnect .videolist_box .ttl_videoplayer {
	display: block;
	width: 236px;
	float: left;
	color: #000;
}
#artist_entry #main #artist_matf #articles #disconnect .selected .ttl_videoplayer {
	color: #ffffff;
}
#artist_entry #main #artist_matf #articles #disconnect .videolist_box .buy_videoplayer {
	display: block;
	width: 39px;
	float: left;
	background-image: url(../images/artist/btn_buy.png);
	background-position: 3px 6px;
	background-repeat: no-repeat;
}
#artist_entry #main #artist_matf #articles #disconnect .selected {
	background-color: #000000;
}


#artist_entry #main #artist_matf #followus {
	position: absolute;
	top: 50px;
	right: 240px;
}
.win.ie #artist_entry #main #artist_matf #followus {
	position: absolute;
	top: 50px;
	right: 145px;
}