@charset "UTF-8";

@import url(base.css);

/*--------------------------------------------------------------*/

/*  フォントサイズ早見表
	以下のようにサイズを指定することで各ブラウザでのフォントサイズを揃えることが出来ます。
	左記のパーセントで指定してください。

	77% = 10px	|	122% = 16px	|	167% = 22px	
	85% = 11px	|	129% = 17px	|	174% = 23px 
	92% = 12px	|	136% = 18px	|	182% = 24px 
	100% = 13px	|	144% = 19px	|	189% = 25px 
	107% = 14px	|	152% = 20px	|	197% = 26px 
	114% = 15px	|	159% = 21px	| 	
*/

/* ------------------------------------------------------------ */
/* 基本、レイアウト指定 */
/* ------------------------------------------------------------ */

* html body {     
    background:url(null) fixed;
	background-color:#000;  
}  

body {
	margin:0;
	padding:0;
	font-size:14px;
	*font-size:small;
	*font:x-small;
	font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Helvetica, Arial, sans-serif;
	background:#000;
	color:#fff;
	height:100%; 
}
html {
	overflow-x:hidden;
	height:100%; 
} 

.img_left {
	float:left;
	margin:0 15px 15px 0;
}
.img_right {
	float:right;
	margin:0 0 15px 15px;
}
#sb-site{
	height:100%;
	position: relative;	
	background:#000!important;
}
.wrapper{
	padding-bottom:50px;	
}
.sb-toggle-left {
  position: absolute;
  top: 5px;
  left: 5px;
}

.sb-toggle-right {
  position: absolute;
  top: 5px;
  right: 5px;
}

.main-visual {
  width: 100%;
  background:#000;
}
.mv_slide {
	margin:0 auto;
}
.mv_slide img {
	width:100%;
	max-width:1200px!important;
	margin:auto;
	height:auto;
}

.sb-slidebar {
 /* color: #fafafa;*/
  padding: 0;
}

.sb-slidebar ul {
  padding: 0;
}

.sb-slidebar li {
  list-style: none;
  margin: 16px 0;
}
.sb-slidebar li a {
	color:#fff;
	display:block;
	padding:10px 20px;
	font-size:18px;
}
/* サイドバー */
.sb-slidebar.sb-right {
  -webkit-overflow-scrolling: touch;
}
.sb-right-inner {
  border: none;
  width: 100%;
  height: 100%;
}

/* ------------------------------------------------------------ 
text-transform は、大文字と小文字の変換を指定するプロパティです。
------------------------------------------------------------ */

/* 一文字目を大文字にする */
.text {text-transform:capitalize;}

/* 全ての文字を大文字に変換 */
.text {text-transform:uppercase;}

/* 全ての文字を小文字に変換 */
.text {text-transform:lowercase;}

/* ------------------------------------------------------------ 
縦書きプロパティです。
------------------------------------------------------------ */
.vertical {
    font-family: "游明朝", "ＭＳ 明朝", serif; /* Windows環境しか考えていない */
    height: 16em;
    margin-left: 2em;
    -ms-writing-mode: tb-rl; /* for MS IE8+ */
    -webkit-writing-mode: vertical-rl;
    writing-mode: vertical-rl;
}

/* ------------------------------------------------------------ 
要素に2D変形、または、3D変形を適用
------------------------------------------------------------ */
.vertical {
	-webkit-transition: all .5s;
	transition: all .5s;
}

/* ------------------------------------------------------------ 
角R
------------------------------------------------------------ */
.vertical {
	border-radius: 6px; /* CSS3草案 */ 
	-webkit-border-radius: 6px; /* Safari,Google Chrome用 */ 
	-moz-border-radius: 6px; /* Firefox用 */
}
/* ------------------------------------------------------------ */
/* リンク色 */
/* ------------------------------------------------------------ */
::selection {
    color:rgba(212,164,94,1.00);
    background: rgba(143,96,8,0.2);
}
a:link {
	color:#f1f1f1;
	text-decoration:none;
}
a:visited {
	color:#f1f1f1;
	text-decoration:none;
}
a:hover {
	opacity:0.8;
	text-decoration:none;
}
a:active {
	color:rgba(255,255,255,0.8);
	text-decoration:none;
}
.clearfix:after {
  content: ".";  /* 新しいコンテンツ */
  display: block;
  clear: both;
  height: 0;
  visibility: hidden; /* 非表示に */
}

.clearfix {
  min-height: 1px;
}

* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}
/* ------------------------------------------------------------ */
/* 共通 */
/* ------------------------------------------------------------ */
#wrapper {
}
.content {
  display: block;
  width: 100%;
}
section {
	width:100%;
	max-width:1200px!important;
	margin:auto;
	clear:both;
	overflow:hidden;
	letter-spacing:.1em;
	line-height:1.5;
}
section .inBox {
	width:90%;
	max-width:1196px;
	margin:0 auto;
	padding:100px 0 100px;
	clear:both;
	overflow:hidden;
	font-size:114%;
}
section h2 {
	text-align:center;
	margin:0 0 60px;
	letter-spacing:.2em;
}
section .box h3 {
	font-size:30px;
	font-weight:400;
	margin-bottom:30px;
	letter-spacing:.1em;
}
section.bg {
	color:#000;
	position:relative;
}
section.bg:after {
    content: " ";
    display: block;
    background: rgba(0,0,0,0.5);
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
section.bg .inBox {
	position:relative;
	z-index:2;
}
.btn{
	width:180px;
	height:32px;
	margin:50px auto 0;
	background:rgba(65,0,0,0.8);
	text-align:center;
	line-height:32px;
	transition:all 1s;
	-webkit-transition: all 1s;
	clear:both;
}
.btn{
	font-size:14px;
}
.btn a{
	display:block;
}
.btn:hover{
	opacity:0.8;
	filter:alpha(opacity=80);/*IE8 and lower*/
}
.flL{float:left;}
.flR{float:right;}
.center{text-align:center;}
.txt-r{text-align:right;}
.fontsize120{font-size:120%;}
/* ---- INFORMATION ---- */
#information {
	background: url(../../img/bg_info.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#information .inBox{
	line-height:1.8em;
}
#information h2{
	margin-bottom:70px;	
}
#information dl{
	width:85%;
	margin:auto;
}
#information dt,dd{
	margin-bottom:20px;
}
#information dt{
	width:10%;
	margin-right:5%;
	float:left;
}
#information dd{
	width:80%;
	margin-left:30px;
/*	float:right;*/
}
#information dl a{
	clear:both;
	display:block;
}
#information dd a{
	display:inline;
	font-weight:500;
	color:#888;
/*	border-bottom:1px solid #eee;*/
}
/* ---- PROFILE ---- */
#profile {
	background: url(../../img/bg_prof.png) no-repeat;
    background-position: 0 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
/*
#profile .flR{
	width:518px;
	line-height:2;
	margin-top:20px;	
}
*/
#profile .box h3 {
	line-height:1;
}
#profile .box h3 span{
	font-size:16px;
	margin-left:-.4em;
}
#profile .flR{
	width:90%;
	line-height:2;
	margin:20px auto 0;
	float:none;
}
#profile .box h3 {
	margin:50px 0 25px;
}
#profile .box h3 span{
	margin-left:-.4em;
}
#profile .box img{
	width:25%;
	margin-right:20px;
	height:auto;
	float:left;
}
#profile .box div.clearfix{
	position:relative;
}
#profile .posi{
	position:absolute;
	top:0;
	left:35%;	
}
#top-page #profile .posi .mgT{
	margin-top:15px;
}
#top-page #profile .posi .fontsize120{
	font-size:140%;
}
#profile .box div p{
	line-height:1.4;
	margin:0;	
}
#top-page #profile .mgT{
	margin-top:40px;
}
.kakko{
	margin-left:-.5em;	
}
#top-page #profile .btn{
	margin-top:10px;
	margin-bottom:60px;	
}
#top-page #profile .btn2{
	margin-bottom:0px;	
}
/* ---- WORKS ---- */
#works {
	background: url(../../img/bg_works.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#works .inBox{
	width:80%;	
}
#works .box h3{
/*	line-height:1.5;*/
	margin-top:20px;
}
#works .box h3 span{
	font-size:16px;
	margin-left:.2em;
}
#works dl{
/*	width:90%;*/
	margin:auto;
}
#works dt,dd{
	float:left;
	margin-bottom:20px;
}
#works dt{
	width:4em;
	clear:left;
}
#works dd{
   width : -webkit-calc(90% - 4em) ;
   width : calc(90% - 4em) ;
}
#works .works_Inbox{
	width:90%;
	margin:auto;
}
.youtube{
	position:relative;
	width:100%;
	padding-bottom:56.25%;	
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin:auto;
}
.youtube iframe{
	position:absolute;
	top:0;
	right:0;
	width:100%!important;
	height:100%!important;	
}
#works .box{
	width:94%;
	margin:auto;	
}
/*#workspage section .box ul{
    display: flex;	
    flex-flow:row wrap;
	align-items:center;
	justify-content:space-between;
}*/
/* ---- FLIER ---- */
#flier {
	background: url(../../img/bg_flier.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#flier .box{
	width:88%;
	margin:auto;	
}
#flier ul li{
	text-align:center;
	width:20%;
	float:left;
	box-sizing:border-box;
	margin-right:5%;
	font-size:13px;
}
#flier ul li span{
	font-size:75%;
	margin-right:4px;
}
#flier ul li img{
	width:100%;
	height:auto;
	margin-bottom:5px;
}
#flier ul li:nth-child(4){
	margin-right:0;
}
#flier ul.mgT{
	margin-top:30px;
}
/* ---- GALLERY ---- */
#gallery {
	background: url(../../img/bg_gallery.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#gallery .flL{
	width:50%;
}
#gallery .flR{
	width:45%;
}
#gallery .flL img{
	width:100%;
	height:auto;
}
#gallery h3{
	letter-spacing:0;
	line-height:1.2;
}
#gallery h3 span{
	padding-left:4em;
}
#gallery h3 span.letter{
	letter-spacing:4.5px;
	padding-left:0;
}
/* ---- LESSON ---- */
#lesson {
	background: url(../../img/bg_lesson.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#top-page #lesson{
	line-height:1.5;	
}
#lesson .flL, #lesson .flR{
	width:45%;
}
#lesson .flL img{
	width:100%;
	height:auto;
}
#lesson .box p{
	margin-bottom:20px;
}
#lesson .fontsize120{
	line-height:2.4;
	font-size:129%;
	letter-spacing:1px;
}
/* ------------------------------------------------------------ */
/* サブページ */
/* ------------------------------------------------------------ */
#sub-page section{
  background-color:#000!important;	
}

#sub-page #fixed-top{
  padding:10px 0;	
}
#sub-page header{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
  background:rgba(0,0,0,1);
/*	display:none;*/
}
#sub-page header h1 img{
  width:62%;
/*  margin-top:5px;*/
}
#sub-page #nav{	
	padding:16px 0 0;	
}
#sub-page .content{
	padding-top:10px;
}
#sub-page #sb-site{
	padding-top:60px;
}
#sub-page .topBox .inBox{
	padding: 40px 0 0;
}
#sub-page .topBox {
	padding:0;
	background-image:none!important;	
	margin-bottom:-40px;
}
#sub-page .topBox .inBox h2{
	margin-bottom:20px;
	padding-top:40px;
}
#sub-page .inBox{
	padding:50px 0;
}
/*  -- information --  */
#sub-page #information{
	background-image:none;
}
#infopage .infoBox .inBox{
	width:75%;
	margin:auto;
	padding:50px 0 0;
}
.infoBox h3{
	font-size:21px;
	font-weight:500;
	border-bottom:1px solid #eee;
	line-height:2.4;
	margin-bottom:15px;
}
p.date{
	font-size:16px;
}
.infoBox .inBox img{
	margin:15px 0;
}
.boxInner{
	width:90%;
	margin:25px auto;	
}
.boxInner table{
	margin:30px 0 10px -.2em;
}
.boxInner table th{
	width:4em;
/*	text-align:right;*/
}
.boxInner table td{
	padding-left:20px;
}
.boxInner table th, .boxInner table td{
	padding-bottom:12px;
}
.boxInner table br.newline{
	display:none;
}
.infoBox p{
	line-height:1.6;	
}
.boxInner p a{
	color:#777;
}
/*   -- profile --   */
#sub-page #profile{
	background:none;	
}
#profilepage .inBox h3{
	line-height: 1;
	font-size: 30px;
	font-weight: 400;
	margin-bottom: 30px;
	letter-spacing: .1em;
}
#profilepage .inBox h3 span{
	font-size:14px;
	margin-left:.2em;
}
#profilepage .flR {
	margin-top:0;
	float:right;
}
#sub-page #profilepage #profile .flL{
	width: 30%;
}
#profilepage .flL img{
	width:80%;
	height:auto;
	margin-bottom:10px;
}
#sub-page #profilepage #profile .flR{
	width: 65%;
}
#sub-page #profile h4{
	font-size:144%;
	font-weight:400;
	letter-spacing:.1em;
	line-height:1;
	margin-bottom:10px;
}
#sub-page #profile h4 span.fontsize{
	font-size:60%;
	margin-bottom:0;
	line-height:1;
	margin-left:-.5em;
}
#sub-page #profile .inBox .mgT{
	margin-top:50px;	
}
#sub-page #profile .inBox{
	line-height:1.4;
}
#sub-page #profile .prize{
	font-size:85%;
	line-height:1.1;
}
#sub-page .border{
	border-bottom:1px solid #5D0000;
	width:200px;	
	text-align:center;
	padding-top:40px;
	margin:0 0 80px 420px;

}
#ooshima, #shirakawa{
	padding-top:80px;
	margin-top:-80px;
}
/*.red{
	padding:3px 4px;
	background:#4E0000;
}*/
/*   -- works --   */
#workspage .works_Inbox h3 {
	font-size:24px;
	font-weight:400;
	margin-bottom:35px;
	letter-spacing:.1em;
	border-bottom:1px solid #aaa;
	padding-left:.4em;
	box-sizing:border-box;
}
#workspage .works_Inbox h3 span{
	font-size:14px;
	margin-left:.2em;
}
#workspage .box{
	margin-top:50px;
}
#workspage .inBox{
	padding:20px 0;
}
#workspage .works{
	background:none;	
}
.works .inBox{
	width:80%;	
}
.works .box h3{
	margin-top:20px;
}
.works .box h3 span{
	font-size:16px;
	margin-left:.2em;
}
.works dl{
	margin:auto;
}
.works dt,dd{
	float:left;
	margin-bottom:20px;
}
.works dt{
	width:4em;
	clear:left;
}
.works dd{
   width : -webkit-calc(90% - 4em) ;
   width : calc(90% - 4em) ;
}
.works .works_Inbox{
	width:90%;
	margin:auto;
}
.works .box{
	width:94%;
	margin:auto;	
}
#workspage section .box ul li{
	width:20%;
	height:auto;
	overflow:hidden;
	float:left;
	box-sizing:border-box;
}
#workspage section .box ul li:nth-child(4n){
	marign-right:0;
}
#workspage section .box ul li img{
	width:100%;
	height:auto;
}
#workspage table{
	width:100%;
	font-size:100%;
}
#workspage th, #workspage td{
	padding-right:0;
	padding:0 0 24px 20px;
	text-align:left;
	font-weight:500;
	vertical-align:middle;
}
#workspage .works_tb th{
	padding-left:10px;
	line-height:1.2;
}
#workspage .etc th{
	font-size:110%;	
}
#workspage .etc th br{
	display:none;
}
#workspage th div.tb_small{
	font-size:80%;
	margin-top:8px;
}
#workspage th div.tb_small br{
	display:block;
}
#workspage #PerformanceList{
  margin-top:-70px;
  padding-top:70px;	
}
#workspage #ETC{
  margin-top:-70px;
  padding-top:70px;	
}



/*  -- flier --  */ 
#sub-page #flier{
	background:none;	
}
/*  -- gallery --  */
#sub-page #gallery{
	background:none;	
}
#galleryBox .flL, #galleryBox .flR{
	width:45%;
}
#galleryBox .flL img{
	width:100%;
	height:auto;
}
#galleryBox h3{
	text-align:center;
	letter-spacing:0;
	line-height:1.2;
}
#galleryBox h3 span{
	padding-left:4em;
}
#galleryBox h3 span.letter{
	letter-spacing:4.5px;
	padding-left:0;
}
#sub-page #galleryBox h3 br{
	display:none;
	text-align:center!important;
}
#sub-page #galleryBox img{
	margin-right:30px;
}
#sub-page section#gallery .box ul li{
	width:20%;
	height:auto;
	overflow:hidden;
	float:left;
	box-sizing:border-box;
}
#sub-page section#gallery .box ul li:nth-child(4n){
	marign-right:0;
}
#sub-page section#gallery .box ul li img{
	width:100%;
	height:auto;
}
/*  -- lesson --  */
#sub-page #lesson{
	background:none;	
}
#sub-page #lesson .box{
/*	float:none;*/
	line-height:1.6;
	margin-bottom:20px;
}
#sub-page #lesson .flR img{
	margin-top:50px;
}
#sub-page #lesson .clear{
	clear:both;
}
#sub-page #lesson .box h3{
	font-size:140%;
	font-weight:400;
	margin-bottom:10px;
	letter-spacing:.1em;
	margin-left:-.5em;
}
#sub-page #lesson h4, #sub-page #lesson th{
	font-weight:400;	
}
#sub-page #lesson h4{
	margin:10px 0;
	font-size:122%;
}
#sub-page #lesson table, #sub-page #lesson h4{
	width:80%;
	margin-left:20px;
}
#sub-page #lesson table th, #sub-page #lesson table td{
	border:1px solid #f5f5f5;
	padding:6px 10px;
	font-size:95%;
	width:50%;
}
#sub-page #lesson .mgT{
	margin-top:20px;
}
#sub-page #lesson .inBox{
	width:70%;
	margin:auto;	
}
.ggmap {
position: relative;
padding-bottom: 40%;
padding-top: 30px;
height: 0;
overflow: hidden;
margin-top:-30px;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#sub-page #lesson .flR{
	width:30%;	
}
#sub-page #lesson .flR img{
	width:100%;
	height:auto;
}
#sub-page #lesson .flL{
	width:65%;
}
#sub-page .videoBox{
	width:320px;
	max-width:320px;
	height:auto;
}
#sub-page #videoBox{
	padding:80px 0 50px;
	margin-top:-80px;
}
#sub-page #Schedule{
	padding-top:80;
	margin-top:-80px;
}
#video{
	margin-left:20px;
}
#sub-page #videoBox ul, #sub-page #videoBox p{
	margin-top:10px;
	margin-left:20px;
}
#sub-page #lesson .mgL{
	margin-left:20px;
}
/* ------------------------------------------------------------ */
/* ヘッダー */
/* ------------------------------------------------------------ */
header {
  position: fixed;
  top: 30px;
  left: 0;
  width: 100%;
/*  max-width:1200px!important;*/
  z-index: 2;
/*  background:rgba(255,255,255,0.84);*/
/*	display:none;*/
}

header::after {
  content: "";
  clear: both;
  display: block;
}
header h1 {
	float:left;
	margin:0 0 0 40px;
}
#nav{	
	padding:37px 0 0;
	margin-right:20px;	
}
#nav li {
	float:right;
	margin:0 25px;
/*	padding:37px 0 0;*/
}
#nav li a {
	display:block;
	position:relative;
}
/* ------------------------------------------------------------ */
/* コンテンツ */
/* ------------------------------------------------------------ */
#content {
}
.content {
	background-color:#000;
}
/* ------------------------------------------------------------ */
/* フッター */
/* ------------------------------------------------------------ */
footer {
	background:rgba(0,0,0,1.00);
	color:#fff;
	text-align:center;
	padding:20px 0;
	z-index:9999;
	margin-top:-3px;
	position: absolute;/*wrapperの基準の絶対配置*/
    bottom: 0; /*一番下に配置*/
	width:100%;
}
footer .txt-r{
	font-size:12px;
	margin-bottom:5px;
}
footer p{
	margin-bottom:-10px;
}
footer .copy{
	font-size:12px;
}
/* デフォルト：980px以上用（PC用）の記述 */
@media screen and (min-width: 1024px) {
	.sp {
		display:none;
	}
	.sp2 {
		display:none;
	}
	.underconstruction{
	padding:200px 0;
	text-align:center;	
	}
#sub-page .topBox {
	padding-bottom:40px;
}
}
@media screen and (max-width: 1150px) {
    /* 1150px以下用（タブレット用）の記述 */
#nav li {
	float:right;
	margin:0 15px;
/*	padding:37px 0 0;*/
}
#nav li img{
	width:95%;
}	
}
@media screen and (max-width: 1023px) {
    /* 1023px以下用（タブレット用）の記述 */
.pc {
	display:none;
}
.sp2 {
		display:none;
	}

/*ボタン*/
#button {
	position:absolute;
	right: 15px;
    top: 15px;
    width: 35px;
    height: 25px;
    outline: none;
    border: none;
    background: none;
    cursor: pointer;
	z-index: 999;
}
#button span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	position: absolute;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #fff;
	border-radius: 3px;
}
#button span:nth-of-type(1) {
	top: 0;
}
#button span:nth-of-type(2) {
	top: 11px;
}
#button span:nth-of-type(3) {
	bottom: 0;
}
div.btnBox.active {
    position: absolute;
    background: #fff;
    padding: 6% 0 0;
    width: 100%;
	/*min-height:15px;*/
}

.sb-active #button span:nth-of-type(1) {
	-webkit-transform: translateY(10px) rotate(-45deg);
	transform: translateY(10px) rotate(-45deg);
}
.sb-active #button span:nth-of-type(2) {
	opacity: 0;
}
.sb-active #button span:nth-of-type(3) {
	-webkit-transform: translateY(-12px) rotate(45deg);
	transform: translateY(-12px) rotate(45deg);
}
/* 共通 */
section .inBox {
	padding:50px 0;
}
section h2 {
    font-size: 24px;
    text-align: center;
    margin: 0 0 20px;
    letter-spacing: .2em;
}
/* ヘッダー */
header h1 {
	font-size:24px;
	float:left;
	margin:0 0 0 15px;
	line-height:50px;
}
/**/
#profile .box img{
	width:32%;
	margin-right:20px;
	height:auto;
	float:left;
}
/* サブ */
/*profile*/
#sub-page .border{
	border-bottom:1px solid #5D0000;
	width:200px;	
	text-align:center;
	padding-top:40px;
	margin:20px auto 70px;

}
#workspage .works_tb br{
	display:none;
}
#workspage div.tb_small br{
	display:block;
}
#workspage .etc th br{
	display:block;
}
/*gallery*/
#sub-page #galleryBox h3 {
	font-size:175%;
	margin-bottom:10px;
}
}
@media screen and (max-width: 767px) {
/* 767px以下用（タブレット／スマートフォン用）の記述 */
#fixed-top{
paading:0 0 10px;	
}
.main-visual {
padding-top:106px;
}
footer .copy{
/*	text-align:right!important;*/
	margin-right:1em;
}
footer .txt-r{
	margin-right:0;
}
.pc {
	display:none;
}
.pc2 {
	display:none;
}
.sp2 {
	display:block;
}
/* ---- PROFILE ---- */
#profile {
	background: url(../../img/bg_prof.png) no-repeat;
    background-position: 0 50%;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;	
}
#profile .posi{
	position:absolute;
	top:0;
	left:38%;	
}
#top-page #profile .btn{
	margin-top:20px;
	margin-bottom:60px;	
}
/* ---- WORKS ---- */
#works .inBox{
	width:90%;	
}
#works dl{
	margin:auto;
}
#works dt,dd{
/*	float:none;*/
	margin-bottom:20px;
	line-height:1.2;
}
#works dt{
	width:4em;
	margin-bottom:5px;
}
#works dt span{
	margin-left:0;
	display:none;
}
#works dd{
   width : -webkit-calc(100% - 4em) ;
   width : calc(100% - 4em) ;
}
#gallery .box h3 {
	font-size:150%;
}
#gallery .flL, #gallery .flR, #lesson .flL, #lesson .flR{
	width:80%;
	float:none;
	margin:40px auto;
}
/*   ---- サブ ----   */
#sub-page .topBox .inBox img{
	width:100%;
	height:auto;
	max-width:250px;	
}
#infopage .inBox img{
	width:100%;
	height:auto;
	max-width:300px;	
}
#sub-page #profilepage #profile .flR, #sub-page #profilepage #profile .flL{
	width: 96%;
	float:none;
	margin:auto;
}
#profilepage .flL{
	text-align:center;
}
#profilepage .flL img{
	width:55%;
	heiht:auto;
	float:none;
	margin:30px 0 15px;
}
#sub-page #profilepage #profile .flR{
	margin-top:20px;
}
#sub-page .border{
	border-bottom:1px solid #5D0000;
	width:80%;	
	text-align:center;
	padding-top:40px;
	margin:30px auto -10px;
}
/*#workspage table{
	width:100%;
	font-size:100%;
}*/
#workspage .works_tb{
	width:96%;
	margin:auto;
}
#workspage th, #workspage td{
	padding:0;
}
#workspage .etc th{
	font-size:130%;	
}
#workspage td{
	display:list-item;
	list-style:none;
	padding-left:10px;
	font-size:94%;
	line-height:1.2;
}
#workspage th{
	display:block;
	margin-top:40px;
	margin-bottom:10px;
	font-size:130%;
	line-height:1.2;
}
#workspage .works_tb tr{
	padding-bottom:20px;
}
#workspage .works_tb .nomg{
	margin-top:-10px;
}
#workspage .works_tb br{
	display:none;
}
#workspage .etc th br{
	display:none;
}
#workspage .works_tb div.tb_small{
	font-size:75%;
	line-height:1.2;
	padding-bottom:0;
}
#workspage div.tb_small span{
	font-size:80%;
}
/*----      flier      ----*/
#top_flier h2 {
	width:30%;
	margin:0 auto 30px;		
}
#top_flier h2 img{
	width:100%;
	height:auto;
}
#sub-page #galleryBox{
	width:98%;
	margin:auto;	
}
#sub-page #galleryBox img{
	width:100%;
	float:none;
	margin-righe:0;
	margin:auto auto 30px;
}
#sub-page #galleryBox h3 br{
	display:block;
}
#sub-page #lesson table{
	width:80%;	
}
#sub-page #lesson .inBox{
	width:90%;
}
#sub-page #lesson .flR{
	width:80%;	
}
#sub-page #lesson .flL{
	width:96%;

}
#sub-page .videoBox{
	width:100%;
	height:auto;
}
#sub-page #lesson .flR img{
	margin-top:0;
}
}
@media screen and (max-width: 479px) {
    /* 479px以下用（スマートフォン用）の記述 */
.underconstruction{
	padding:100px 0;
	text-align:center;
	font-size:14px;	
}	
/* PC/SP view */
.pcview{display:none!important;}
.sp2{
	display:block;	
}

body{
	font-size:14px;	
}
header{
	position:fixed;
	top:20px;
	left:0;	
}
#top-page #button{
	position: absolute;
	right: 15px;
	top: 15px;	
	width: 30px;
	height: 25px;
}
#logo{
	width:80%;
	height:auto;	
}
#top-page section h2 img{
	width:100%;
	height:auto;
}

#button{
	position: absolute;
	right: 15px;
	top: 18px;	
	width: 30px;
	height: 25px;
}
#top-page .btn{
	font-size:12px;
}
/* ---- INFORMATION ---- */
#information {
	background: url(../../img/SP/SP_bg_info.png) repeat;
    background-position: 50% 100%;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#information {
	font-size:12px;
	background-position:50% 80%;
}
#information h2{
	width:65%;
	margin:0 auto 30px;	
}
#information .inBox{
	line-height:1.8em;
}
#information dl{
	width:94%;
	margin:auto;
}
#information dt, #information dd{
	float:none;
}
#information dt{
	width:100%;
	margin-bottom:5px!important;
}
#information dd{
	width:100%;
	margin-left:0;
	margin-bottom:20px;
}
/* ---- PROFILE ---- */
#profile h2{
	width:48%;
	margin:0 auto 30px;	
}
#profile .flR{
	width:90%;
	line-height:2;
	margin:20px auto 0;
	float:none;
}
#profile .box h3 {
	line-height:1;
	font-size:120%;
	margin:50px 0 25px;
}
#profile .box h3 span{
	font-size:14px;
	margin-left:-.4em;
}
#profile .btn{
	margin-top:25px;
}
#profile .posi p br{
	display:block;
}
#profile .posi .small{
	font-size:90%;	
}
#top-page #profile .posi p{
	line-height:1.2;
}
#top-page #profile .posi .fontsize120{
	font-size:120%;
}
#top-page #profile .btn{
	margin-top:30px;
	margin-bottom:50px;	
}
/* ---- WORKS ---- */
#works {
	background: url(../../img/SP/SP_bg_works.png) repeat;
    background-position: 80% 50%;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	font-size:12px;			
}
#works h2{
	width:35%;
	margin:0 auto 30px;	
}
#works .inBox{
	width:96%;	
}
#works .box h3{
/*	line-height:1.5;*/
	font-size:26px;
	margin-top:20px;
}
#works .box h3 span{
	font-size:14px;
	margin-left:.2em;
}

#works .works_Inbox{
	width:96%;
	margin:auto;
}
.youtube{
	position:relative;
	width:100%;
	padding-bottom:56.25%;	
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin:auto;
}
.youtube iframe{
	position:absolute;
	top:0;
	right:0;
	width:100%!important;
	height:100%!important;	
}
#works .box{
	width:94%;
	margin:auto;	
}

/* ---- FLIER ---- */
#flier {
	background: url(../../img/SP/SP_bg_flier.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
#flier h2{
	width:35%;
	margin:0 auto 30px;	
}
#flier .box{
	width:96%;
	margin:auto;	
}
#flier ul li{
	text-align:center;
	width:48%;
	float:left;
	margin-right:0;
	margin-bottom:20px;
	font-size:14px;
}
#flier ul li:nth-child(2n){
	margin-left:4%;
}
#flier ul li img{
	width:100%;
	height:auto;
	margin-bottom:5px;
}
#flier ul.mgT{
	margin-top:30px;
}
/* ---- GALLERY ---- */
#gallery {
	background: url(../../img/SP/SP_bg_gallery.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	font-size:12px;	
	background-position:20% 80%;		
}
#gallery h2{
	width:48%;
	margin:0 auto 30px;	
}
#gallery .flL, #gallery .flR{
	width:96%;
	line-height:2;
	margin:20px auto 0;
	float:none;
}
#gallery .box img{
	width:100%;
	height:auto;
}
#gallery .box h3 {
	line-height:1;
	font-size:150%;
	margin:50px 0 25px;
	letter-spacing:0;
}
#gallery .box br {
}
/* ---- LESSON ---- */
#lesson {
	background: url(../../img/SP/SP_bg_lesson.png) no-repeat;
    background-position: 50% 50%;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	font-size:12px;	
	background-position:20% 80%;		
}
#lesson h2{
	width:48%;
	margin:0 auto 30px;	
}
#lesson .flL, #lesson .flR{
	width:96%;
	line-height:2;
	margin:20px auto 0;
	float:none;
}
#lesson .box img{
	width:100%;
	height:auto;
}
#lesson .btn{
	margin-top:20px;	
	box-shadow: 4px 4px 4px 0px rgba(0,0,0,0.2);
}
/* ------------------------------------------------------------ */
/* サブページ */
/* ------------------------------------------------------------ */
#sub-page .topBox .inBox{
	padding: 50px 0 10px;
}
#sub-page .topBox .inBox h2{
	padding-top:0px;
}
/*  -- information --  */
#infopage .infoBox .inBox{
	width:90%;
	margin:auto;
	padding:20px 0 25px;
}
#infopage h2 {
	width:65%;
	margin:0 auto 30px;		
}
#infopage h2 img{
	width:100%;
	height:auto;
}
.infoBox h3{
	font-weight:500;
	border-bottom:1px solid #eee;
	margin-bottom:15px;
	line-height:1.2;
	padding:10px 0;	
	font-size:114%;
}
p.date{
	font-size:16px;
}
.infoBox .inBox img{
	width:100%;
	height:auto;
}
.boxInner{
	width:100%;
}
.boxInner table td{
	padding-left:5px;
}
.boxInner table th, .boxInner table td{
	padding-bottom:12px;
	font-size:96%;
}
.boxInner table br.newline{
	display:block;
}
#infopage .inBox img{
	width:100%;
	height:auto;
	max-width:500px;	
}
/*  --profile--  */
#top_profile{
	background: url(../../img/SP/SP_bg_prof.png) no-repeat;
    background-attachment: 640px auto;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	font-size:12px;	
	background-position:50% 51%;		
}
#top_profile h2{
	width:48%;
	margin:0 auto 30px;	
}
#top_profile img{
	width:100%;
	height:auto;
}
#profilepage .inBox h3{
	font-size:26px;
	margin-top:20px;
	font-weight:500;
}
#profilepage .inBox h3 span{
	font-size:14px;
	margin-left:.2em;
}
#sub-page #profilepage #profile .flR, #sub-page #profilepage #profile .flL{
	width: 96%;
	float:none;
	margin:auto;
}
#profilepage .flL img{
	width:68%;
	heiht:auto;
	float:none;
	margin-bottom:20px;
}
#sub-page #profilepage #profile .flR{
	margin-top:20px;
}
/*  -- works --  */
#top_works h2{
	width:35%;
	margin:0 auto 30px;	
}
#top_works h2 img{
	width:100%;
	height:auto;
}
#top_works {
	background: url(../../img/SP/SP_bg_works.png) no-repeat;
    background-attachment: 640px auto;
	background-position:20% 80%;		
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;		
}
.works h2{
	width:35%;
	margin:0 auto 30px;	
}
.works .inBox{
	width:96%;	
}
.works .box h3{
/*	line-height:1.5;*/
	font-size:26px;
	margin-top:20px;
}
.works .box h3 span{
	font-size:14px;
	margin-left:.2em;
}
.works .works_Inbox{
	width:96%;
	margin:auto;
}
.youtube{
	position:relative;
	width:100%;
	padding-bottom:56.25%;	
	padding-top:30px;
	height:0;
	overflow:hidden;
	margin:auto;
}
.youtube iframe{
	position:absolute;
	top:0;
	right:0;
	width:100%!important;
	height:100%!important;	
}
.works .box{
	width:94%;
	margin:auto;	
}
#workspage section .box ul li{
	width:50%;
	height:auto;
}
#workspage .etc th br{
	display:block;
}
#workspage .works_tb div.tb_small{
	font-size:70%;
	line-height:1.2;
	padding-bottom:0px;
}
/*  -- flier --  */
#top_flier {
	background: url(../../img/SP/SP_bg_flier.png) no-repeat;
    background-attachment: 640px auto;
	background-position:50% 70%;		
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;	
}
#flier ul.mgT{
	margin-top:0;
}
#top_flier h2 {
	width:35%;
	margin:0 auto 30px;		
}
#top_flier h2 img{
	width:100%;
	height:auto;
}
/*  -- gallery --  */
#top_gallery {
	background: url(../../img/SP/SP_bg_gallery.png) no-repeat;
    background-attachment: 640px auto;
	background-position:50% 60%;		
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;		
}
#top_gallery h2{
	width:48%;
	margin:0 auto 30px;	
}
.works .box{
	width:94%;
	margin:auto;	
}
#gallerypage section#gallery .box ul li{
	width:50%;
	height:auto;
}
#sub-page #galleryBox h3 {
	font-size:120%;
	margin-bottom:10px;
}
/*  -- lesson --  */
#top_lesson {
	background: url(../../img/SP/SP_bg_lesson.png) no-repeat;
    background-attachment: 640px auto;
	background-position:0% 84%;		
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-size: cover;		
}
#top_lesson h2{
	width:48%;
	margin:0 auto 30px;	
}
#sub-page #lesson .inBox{
	padding:20px 0;
}
#sub-page #lesson .box h3{
	font-size:136%;
	font-weight:400;
	margin-bottom:10px;
	letter-spacing:.1em;
}
#sub-page #lesson h4{
	margin:10px 0;
	font-size:122%;
}
#sub-page #lesson table{
	width:96%;
	margin:auto;	
}
#sub-page #lesson .flR{
	width:96%;	
}
#sub-page #video{
	margin:auto;	
}
#sub-page .videoBox{
	width:100%;
	margin-left:0;
	margin:auto;
}
#sub-page .videoBox img{
	width:100%;
	height:auto;
	margin:auto;
}
#sub-page #video, #sub-page #videoBox ul, #sub-page #videoBox p{
	margin-left:0;
}
#sub-page #lesson .mgL{
	margin-left:0;
}
}