@charset "utf-8";
/* CSS Document */
/*webフォントアイコン*/
@font-face {
    font-family: 'LigatureSymbols';
    src: url('font/LigatureSymbols-2.11.eot');
    src: url('font/LigatureSymbols-2.11.eot?#iefix') format('embedded-opentype'),
         url('font/LigatureSymbols-2.11.woff') format('woff'),
         url('font/LigatureSymbols-2.11.ttf') format('truetype'),
         url('font/LigatureSymbols-2.11.svg#LigatureSymbols') format('svg');
    font-weight: normal;
    font-style: normal;
}

.lsf {
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
  padding-right:4px;
  display:inline-block;
}
.lsf-icon:before {
  content:attr(title);
  margin-right:0.3em;
  font-size:130%;
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
}
/*webフォントアイコン*/



*{ margin:0px; padding: 0px; box-sizing:border-box;}
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
html,body {
	margin:0px;
	padding:0px;
	font-family: Lucida Grande,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
	font-size:15px;
	text-align:left;
	color:#333;
	background:url(../images/bg.jpg) center top repeat;
}

ul,ol{ list-style:none;}

img { border-style:none; vertical-align:bottom; padding:0px; max-width:100%;}
figure {margin:40px auto; text-align:center;}

p { line-height:1.6em; margin:0px 0px 15px; padding:0px; text-align:left; }
p:last-child {margin:0px; }
a { color:#326496; text-decoration:underline; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;}
a:hover { color:#c83232;}
.opa {
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
}
.opa:hover {
  opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha(opacity=75)";
}

.left { text-align:left; }
.right { text-align:right; }
.center { text-align:center; }

.clear { clear:both; }	   
.clearfix:after {
	margin:0px;
	padding:0px;
	visibility:hidden;
	content:".";
	display:block;
	line-height:0;
	clear:both;
}

/*ヘッダー*/
#header{ width:1080px; margin:0px auto 120px; padding-top:40px;}

/*コンテンツ*/
#content{ width:1080px; margin:0px auto; padding:1px 0px;}
section{ margin:40px auto 120px;}
.maincontent{ margin:0px auto; padding:0px; width:1080px;}
iframe.shadow{box-shadow:rgba(0, 0, 0, 0.5) 0px 0px 6px 3px; -webkit-box-shadow:(0, 0, 0, 0.5) 0px 0px 6px 3px; -moz-box-shadow:(0, 0, 0, 0.5) 0px 0px 6px 3px;}

#footer{background-color: rgba(0, 0, 0, 0.5); padding:40px 0px 0px;}
#footer ul{ text-align:center; margin-bottom:40px;}
#footer ul li{ display:inline-block; margin:0px 20px;}
p.copyright{ background:#000; color:#fff; text-align:center; padding:10px; font-size:11px;}

.soundcloud iframe{ width:100%;}

#twitter_btn{ margin:0px auto; position:fixed; top:40px; right:40px; width:160px;}

/*動画*/
.movie { max-width:800px; width:100%; margin:0px auto; background:#000; border:10px solid #000;}
#mediaplayer_wrapper{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  background:#000;
  margin:0px auto;
}
#mediaplayer_wrapper object {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}




@media print, screen and (min-width:640px){
/*パララックスのアニメーション*/
.para{ opacity:0;}

.para_on{
  animation-duration: 2s;
  animation-name: fade;
  -moz-animation-duration: 2s;
  -moz-animation-name: fade;
  -webkit-animation-duration: 2s;
  -webkit-animation-name: fade;
  z-index:1;
  opacity:1;
}

.para_on #twitter_btn{
  animation-duration: 1s;
  animation-name: top_in !important;
  -moz-animation-duration: 1s;
  -moz-animation-name: top_in !important;
  -webkit-animation-duration: 1s;
  -webkit-animation-name: top_in !important;
  z-index:1;
  opacity:1;
}

/*下イン*/
@keyframes top_in {
0% { opacity: 0; top:-100px;}
100% { opacity: 1; top:40px;}
}
@-moz-keyframes top_in {
0% { opacity: 0; top:-100px;}
100% { opacity: 1; top:40px;}
}
@-webkit-keyframes top_in {
0% { opacity: 0; top:-100px;}
100% { opacity: 1; top:40px;}
}


/*フェードイン*/
@keyframes fade {
0% { opacity: 0;}
1% { opacity: 0;}
100% { opacity: 1;}
}
@-moz-keyframes fade {
0% { opacity: 0;}
1% { opacity: 0;}
100% { opacity: 1;}
}
@-webkit-keyframes fade {
0% { opacity: 0;}
1% { opacity: 0;}
100% { opacity: 1;}
}



.smp{ display:none !important;}
}
@media screen and (max-width:640px){
.pc{ display:none !important;}
.half{ max-width:75%;}
#twitter_btn{ width:50%; position:static; text-align:center; margin:40px auto;}

/*ヘッダー*/
#header{ width:100%; margin:0px auto; padding:20px 3% 0px;}

/*コンテンツ*/
#content{ width:100%; margin:0px auto; padding:1px 3%;}
section{ margin:20px auto 60px;}
.maincontent{ margin:0px auto; padding:0px; width:100%;}

#footer ul{ text-align:center; margin-bottom:40px;}
#footer ul li{ display:block; margin:20px auto; padding:0px 3%;}
}
