html {
	height : 100%;
}
body {
	height : 100%;
	margin : 0;
	padding : 0;
	color : #234;
	font-size : 0.9em;
	font-family : 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	background: url(../img/bg_main.jpg) no-repeat center center;
	background-size: cover;
}

body a {
	color : #327CCB;
	text-decoration : none;
}
img {
	border : 0;
}
.no-shadow {
	filter : none!important;
	box-shadow : none!important;
	-moz-box-shadow: none!important;
	-webkit-box-shadow: none!important;
}
table {
	table-layout : fixed;
	border : 0;
	border-collapse : collapse;
	font-size : 0.8em;
}
table th {
	text-align : left;
}
table td,table th {
	border : 0;
	padding : 5px;
}
#header, #footer {
	-moz-opacity: 0.7;
	opacity: 0.7;
	filter:alpha(opacity=70);
	width : 100%;
	margin : 0;
	padding : 0;
	background-color : #234;
}

.caution {
	color : red;
}

#header{
	box-shadow: 5px 20px 70px #000;
	-moz-box-shadow: 5px 20px 70px #000;
	-webkit-box-shadow: 5px 20px 70px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}

.lt-ie9 #header, .lt-ie9 #footer {
	filter:none;
}

#header:not(.low_height) #header_title {
	display : inline;
	padding : 12px 0 0 30px;
	color : white;
	font-size : 48px;
	font-family : 'Kelly Slab', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}
#header.low_height {
	height : 35px;
}
#header.low_height #header_title {
	padding : 5px 0 0 30px;
	font-size : 20px;
}

#header #header_title {
	display : inline-block;
	padding : 12px 0 0 30px;
	color : white;
	font-size : 48px;
	font-family : 'Kelly Slab', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

#header #header_comment {
	padding : 1px 0 12px 30px;
	color : white;
	font-size : 12px;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}
#header.low_height #header_comment {
	display : inline;
}

#header_button {
	position : absolute;
	top : 0;
	right : 50px;
}
#header_button div {
	color : #FFFFFF;
	display : inline;
	margin : 0 5px 0 5px;
	padding : 5px 10px 5px 10px;
	text-align : center;
	background-color:rgba(0,0,0, 0.50);
	font-size : 24px;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
#header_button div a {
	color : #FFFFFF;
}
#header.low_height #header_button div {
	font-size : 12px;
	background-color:none;
}

#footer #footer_copy {
	text-align : center;
	padding : 15px 0 15px 0;
	color : white;
	font-size : 8px;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

#footer #social_links {
	position : absolute;
	bottom : 0px;
	right : 30px;
}
#social_links img {
	margin-right : 10px;
}
#main_box {
  width : 90%;
  height : 100px;
  overflow : auto;
  -webkit-overflow-scrolling : touch;
  margin : 0 auto 0 auto;
}
#main_box > * {
	-webkit-transform : translate3d(0,0,0);
}
#menu {
	margin : 50px auto 50px auto;
}
.menu_box {
	filter: alpha(opacity=0);
	-moz-opacity:0;
	opacity:0;
	width : 300px;
	margin-bottom : 24px;
	font-size : 0.8em;
	background : rgba(255,255,255, 0.8);
  	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	box-shadow: 2px 2px 10px #000;
	-moz-box-shadow: 2px 2px 10px #000;
	-webkit-box-shadow: 2px 2px 10px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.lt-ie9 .menu_box {
	filter:none;
	border : 1px solid black;
}
.menu_box .box_header {
	height : 40px;
	color : #FFFFFF;
	padding : 20px 0 0 20px;
	border-bottom : 1px solid #666666;
	font-size : 20px;
	font-family: 'Kelly Slab', sans-serif;
	text-shadow : 1px 1px 5px #000, -1px -1px 5px #000;
    background : rgba(0, 0, 0, 0);
  	-moz-border-radius: 15px 15px 0 0;
	-webkit-border-radius : 15px 15px 0 0;
	border-radius : 15px 15px 0 0;
}
.menu_box .box_contents {
	padding : 5px 12px 5px 12px;
}
.box_detail {
	width : 100%;
	text-align : right;
	font-weight : bold;
	margin-top : 0;
}

#about {
	background: rgba(255,255,255, 0.9) url(../img/bg_about.jpg) no-repeat top left;
}
.lt-ie9 #about {
	background: rgb(255,255,255) url(../img/bg_about.jpg) no-repeat top left;
}

#updates {
	background: rgba(255,255,255, 0.9) url(../img/bg_updates.jpg) no-repeat top left;
}
.lt-ie9 #updates {
	background: rgb(255,255,255) url(../img/bg_updates.jpg) no-repeat top left;
}
#updates_list {
	height : 120px;
	overflow : auto;
	-webkit-overflow-scrolling : touch;
	margin : 12px;
}
#main_box dl {
	margin : 0;
	padding : 0;
}
#main_box dt {
	font-weight : bold;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	padding-left : 15px;
	background : url(../img/list_header1.gif) no-repeat center left;
}
#main_box dd {
	margin : 0 0 0.8em 20px;
}

#music {
	background: rgba(255,255,255, 0.9) url(../img/bg_music.jpg) no-repeat top left;
}
.lt-ie9 #music {
	background: rgb(255,255,255) url(../img/bg_music.jpg) no-repeat top left;
}
.music_table {
	font-size : 1em;
}
.music_table td {
	padding : 0 10px 0 0;
}
.music_image, .notes_image {
	width : 120px;
	margin-right : 1.5em;
}
.music_image img, .notes_image img {
	margin : 5px;
	width : 100px;
	max-height : 100px;
	box-shadow: 2px 2px 5px #000;
	-moz-box-shadow: 2px 2px 5px #000;
	-webkit-box-shadow: 2px 2px 5px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.lt-ie9 .music_image img {
	filter : none;
	border : 1px solid black;
}
.ms_credit, .nt_credit {
	font-size : 6px;
}

hr {
    border: 0;
    height: 1px;
    background: #333;
    background-image: -webkit-linear-gradient(left, #eee, #666, #eee);
    background-image:    -moz-linear-gradient(left, #eee, #666, #eee);
    background-image:     -ms-linear-gradient(left, #eee, #666, #eee);
    background-image:      -o-linear-gradient(left, #eee, #666, #eee);
}

#notes {
	width : 300px;
	background: rgba(255,255,255, 0.9) url(../img/bg_notes.jpg) no-repeat top left;
}
.lt-ie9 #notes {
	width : 300px;
	background: rgb(255,255,255) url(../img/bg_notes.jpg) no-repeat top left;
}
.nt_image {
	margin : 5px 15px 0 0;
	float : left;
}
.nt_description {
	margin-top : 5px;
	overflow : auto;
	zoom : 1;
}
.nt_image img {
	width : 50px;
	height : 50px;
}
.nt_dates {
	margin-top : 1em;
	font-size : 0.6em;
	color : #666;
	text-align : right;
}
#notes_contents h1 {
	font-weight : bold;
	font-size : 1.5em;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	padding-left : 15px;
	background : url(../img/list_header1.gif) no-repeat center left;
}
#notes_contents h2 {
	color : #307EA9;
	font-weight : bold;
	font-size : 1.2em;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	padding-left : 15px;
	margin-top : 0.7em;
	background : url(../img/list_header3.gif) no-repeat center left;
}
#notes_contents h3 {
	font-weight : bold;
	font-size : 1em;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	margin-top : 0.7em;
}
#notes_contents div.notes_paragraph {
	margin-left : 40px;
}
.notes_paragraph ul li {
	margin-bottom : 0.7em;
}
.notes_paragraph table {
	border-collapse : collapse;
	border : 1px solid #234;
}
.notes_paragraph th {
	background-color : #234;
	color : #FFF;
}
.notes_paragraph td {
	border : 1px solid #234;
}
#notes_contents img {
	margin : 5px;
	box-shadow: 2px 2px 5px #000;
	-moz-box-shadow: 2px 2px 5px #000;
	-webkit-box-shadow: 2px 2px 5px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.lt-ie9 #notes_contents img {
	filter : none;
}
.notes_image_desc {
	font-size : 0.6em;
	margin : 15px;
}
.notes_liner h3 {
	color : #307EA9;
	font-size : 1.3em;
	font-weight : bold;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	padding-left : 15px;
	background : url(../img/list_header3.gif) no-repeat center left;
}
.notes_liner_jacket {
	margin-right : 25px!important;
	float : left;
}
.notes_liner_detail {
	width : 350px;
	padding-left : 25px;
	display : inline-block;
}
.notes_liner_detail dd{
	width : auto;
	border : 0!important;
	margin : 0!important;
	padding : 0 0 0 40px!important;
}
#liner_notes_slides {
	position : relative;
	margin : 0 auto 3em auto;
}
#liner_notes_slides img {
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	filter:none;
}
#jmslide {
	position : relative;
	width : 700px;
	height : 400px;
}
.step {
	position : relative;
    width: 700px;
    height: 400px;
    display: block;
	z-index : 100;
	-webkit-transition:  opacity 1s;
	-moz-transition:  opacity 1s;
	-o-transition:  opacity 1s;
    transition: opacity 1s;
}
.step:not(.active) {
	opacity: 0;
	z-index : -100;
}
.step h3.title{
	color : white;
    text-shadow: 2px 2px 2px rgba(0,0,0,0.2);
	font-weight : bold;
	font-size : 24px!important;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	padding : 15px;
	margin-top : 0!important;
	background: -moz-linear-gradient(left,  rgba(0,0,0,0.4) 25%, rgba(0,0,0,0) 75%);
	background: -webkit-gradient(linear, left top, right top, color-stop(25%,rgba(0,0,0,0.4)), color-stop(75%,rgba(0,0,0,0)));
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0.4) 25%,rgba(0,0,0,0) 75%);
	background: -o-linear-gradient(left,  rgba(0,0,0,0.4) 25%,rgba(0,0,0,0) 75%);
	background: -ms-linear-gradient(left,  rgba(0,0,0,0.4) 25%,rgba(0,0,0,0) 75%);
	background: linear-gradient(to right,  rgba(0,0,0,0.4) 25%,rgba(0,0,0,0) 75%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66000000', endColorstr='#00000000',GradientType=1 );
	-webkit-transition:  all 1s ease-in-out 1s;
	-moz-transition:  all 1s ease-in-out 1s;
	-o-transition:  all 1s ease-in-out 1s;
	transition: all 1s ease-in-out 1s;
}
.step:not(.active) h3.title{
    opacity: 0;
    padding-left: 50px;
}

.step div{
	color : white;
    text-shadow: 2px 2px 2px rgba(0,0,0,0.5);
    font-size: 20px;
    font-weight: normal;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
    position: relative;
    margin: 0;
}
.step div.description {
	position : absolute;
	bottom : 0px;
	width : 660px;
	height : auto;
	padding : 30px 20px 40px 20px;
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.45) 15%, rgba(0,0,0,0.45) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(15%,rgba(0,0,0,0.45)), color-stop(100%,rgba(0,0,0,0.45)));
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.45) 15%,rgba(0,0,0,0.45) 100%);
	background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.45) 15%,rgba(0,0,0,0.45) 100%);
	background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.45) 15%,rgba(0,0,0,0.45) 100%);
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.45) 15%,rgba(0,0,0,0.45) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#73000000',GradientType=0 );
	opacity : 1;
	-webkit-transition:  all 1s ease-in-out 1.5s;
	-moz-transition:  all 1s ease-in-out 1.5s;
	-o-transition:  all 1s ease-in-out 1.5s;
	transition: all 1s ease-in-out 1.5s;
	z-index : 99;
}
.step:not(.active) div.description{
    opacity: 0;
}
.step div.description span span{
	opacity : 0;
}
.step div#all_list {
	position : relative;
	width : 620px;
	height : 270px;
	margin : auto;
	padding : 15px;
	background : rgba(0,0,0,0.45);
  	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	opacity : 1;
	-webkit-transition:  all 0.5s ease-in-out 2s;
	-moz-transition:  all 0.5s ease-in-out 2s;
	-o-transition:  all 0.5s ease-in-out 2s;
	transition: all 0.5s ease-in-out 2s;
	box-shadow: 2px 2px 5px #000;
	-moz-box-shadow: 2px 2px 5px #000;
	-webkit-box-shadow: 2px 2px 5px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
	z-index : 50;
}
.lt-ie9 .step div#all_list {
	filter : none;
}
.step:not(.active) div#all_list{
	opacity : 0;
}
.step div#all_list a{
	color : #AADDFF;
}
.step img.background {
	position : absolute;
	top : 0;
	left : 0;
	margin : 0!important;
	z-index : -100;
}
#liner_notes_slides #controller {
	margin-left : auto;
	margin-right : auto;
	padding-top : 5px;
	position : relative;
	top : -7px;
	text-align : center;
	background-color : black;
	width: 640px;
	z-index : 100;
}
#liner_notes_slides #controller img {
	position:relative;
	opacity : 0.7;
}
#liner_notes_slides #controller .description {
	position : absolute;
	right : 10px;
	color : white;
	font-size : 9px;
	top : 5px;
}
#liner_notes_slides #controller .description span {
	opacity : 0;
}

#works {
	width : 430px;
	background: rgba(255,255,255, 0.9) url(../img/bg_works.jpg) no-repeat top right;
}
.lt-ie9 #works {
	width : 430px;
	background: rgb(255,255,255) url(../img/bg_works.jpg) no-repeat top right;
}

.wk_jacket {
	margin : 5px 15px 0 0;
	float : left;
}
.wk_jacket_detail {
	margin : 5px 30px 0 0;
	float : left;
}
.wk_jacket img, .wk_jacket_detail img, .nt_image img {
	box-shadow: 2px 2px 5px #000;
	-moz-box-shadow: 2px 2px 5px #000;
	-webkit-box-shadow: 2px 2px 5px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.lt-ie9 .wk_jacket img, .lt-ie9 .wk_jacket_detail img, .lt-ie9 .nt_image img {
	filter:none;
	border : 1px solid black;
}

.wk_detail {
	margin-top : 5px;
	overflow : auto;
	zoom : 1;
}
.wk_maker {
	margin-top : 0.5em;
}
#works dd {
	margin-bottom : 2em;
}

#profile {
	background: rgba(255,255,255, 0.9) url(../img/bg_profile.jpg) no-repeat top left;
}
.lt-ie9 #profile {
	background: rgb(255,255,255) url(../img/bg_profile.jpg) no-repeat top left;
}

#readme {
	width : 300px;
	background: rgba(255,255,255, 0.9) url(../img/bg_readme.jpg) no-repeat top left;
}
.lt-ie9 #readme {
	width : 400px;
	background: rgb(255,255,255) url(../img/bg_readme.jpg) no-repeat top left;
}
#readme dt, #readme dd {
	display : none;
}

#twitter {
	width : 300px;
	height : 36em;
	background: rgba(255,255,255, 0.9) url(../img/bg_twitter.jpg) no-repeat top right;
}
.lt-ie9 #twitter {
	width : 300px;
	height : 400px;
	background: rgb(255,255,255) url(../img/bg_twitter.jpg) no-repeat top right;
}

#twitter ul {
	margin : 0;
	padding : 0;
}
#twitter li {
	list-style : none;
}
.tw_user_profile_image {
	float : left;
	margin-right : 0.8em;
}
.tw_user_profile_image img {
	border : 1px solid black;
}
.tw_name {
	display : inline;
	font-weight : bold;
}
.tw_screen_name {
	display : inline;
}
.tw_text {
	margin : 0.5em 0 0.5em 0;
	overflow : auto;
	zoom : 1;
}
.tw_footer {
	text-align : right;
}
.tw_created_at {
	display : inline;
}
.tw_source {
	display : inline;
}
.tw_retweeted {
	background : url(../img/arrow-retweet-icon.png) no-repeat center right;
	padding-right : 20px;
	text-align : right;
	font-size : 7px;
	color : #999;
}

#contents {
	display : none;
	width : 70%;
	max-width : 1024px;
	margin : 20px auto 20px auto;
	padding : 30px;
	-webkit-overflow-scrolling : touch;
	background-color : rgba(255,255,255, 0.9);
  	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	box-shadow: 2px 2px 10px #000;
	-moz-box-shadow: 2px 2px 10px #000;
	-webkit-box-shadow: 2px 2px 10px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.lt-ie9 #contents {
	background-color : rgb(255,255,255);
	filter : none;
}

#contents_main {
	overflow : auto;
	height : 100px;
}
#contents_header {
	padding-left : 30px;
	font-size : 24px;
	font-style : oblique;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	background : url(../img/list_header2.png) no-repeat center left;
}
#contents_breadcrumb_list {
	text-align : right;
	font-size : 0.7em;
	border-bottom : 1px solid #000;
}
#contents_navi {
	text-align : right;
}
#contents_navi ul {
	margin : 0;
	padding : 0;
}
#contents_navi .navi li {
	display : inline;
	font-size : 0.7em;
	margin : 0 0 12px 1em;
	padding-left : 10px;
	background : url(../img/list_header4.gif) no-repeat center left;
}
#quick_jump {
	position : absolute;
	z-index : 99;
	width : 250px;
	padding : 5px;
	font-size : 0.9em;
	text-align : left;
	-webkit-overflow-scrolling : touch;
	background-color : rgba(255,255,255, 0.9);
  	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	border-radius: 15px;
	box-shadow: 2px 2px 10px #000;
	-moz-box-shadow: 2px 2px 10px #000;
	-webkit-box-shadow: 2px 2px 10px #000;
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='2', MakeShadow='true', ShadowOpacity='0.5');
}
.lt-ie9 #quick_jump {
	background-color : rgb(255,255,255);
	filter : none;
}
#contents dl {
	margin : 0;
	padding : 0;
}
#contents dt {
	color : #307EA9;
	font-size : 1.3em;
	font-weight : bold;
	font-family : 'Marmelad', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	padding-left : 15px;
	background : url(../img/list_header1.gif) no-repeat center left;
}
#contents dt span {
	float : right;
}
#contents dd {
	border-top : 1px solid #307EA9;
	padding-top : 0.5em;
	margin : 0.5em 0 2.3em 20px;
}
#contents dl dd dl {
	margin-top : 0.5em;
}
#contents dl dd dl dt {
	font-size : 1.1em;
	background : url(../img/list_header3.gif) no-repeat center left;
}
#contents dl dd dl dd {
	margin : 0 0 1em 1em;
	border : 0;
}
