@import url("en_fclty.css");

html {
  -webkit-overflow-scrolling: touch;
}
* {
    margin: 0;
    padding: 0;
}

html,body {
    height: 100%;
    overflow: auto;
    text-align: center;
    margin: 0px auto;
	font-size: 12px;
    color: #000000;
	line-height: 20px;
    background-image:url(../img/index/bg_nl.jpg);	
			letter-spacing: 0.03em;
		line-height:1.8em;
}


div#container {
    position: relative;
    margin: 0px auto;
    width: 850px;
    height: 100%;
    min-height: 100%;
    text-align: left;
    background-image:url(../img/index/bg.jpg);	
		line-height:1.8em;
}

body > #container {
    height: auto;
}

div#contents {
    height: auto;
	width: 850px;
}

#header {
width: 850px;
			height: 37px;
text-align: right;
padding: 5px 0px 0px 0px;
clear:both;
}

#smh-header {
	display:none;
		margin-top: 10px;
}
.pcnone {
	display: none;
}



#main{
clear:both;
width: 750px;
text-align: left;
padding: 124px 0px 40px 0px;
margin-left: 100px;
}

#main h2 {
font-size:150%;
line-height:1.3em;
padding: 50px 0px 20px 0px;
font-weight:normal;
}

#main h3{
			font-size:200%;
		line-height:1.3em;
padding: 0px 0px 20px 0px;
font-weight:normal;
}



/*menu
------------------------------------------------------------*/

#menubox{
    width: 850px;
}


ul#menuPC{
 text-align:center;
	}
ul#menuPC li{
    list-style:none;
    display:inline;
	float: left;
}
ul#menuPC a{
    display:block;
    text-indent:-2500px;
    overflow:hidden;
	    height:81px;
}

a.home{
     background-image:url(../img/index/logo.svg);
	background-size: 181px 75x;
	background-repeat: no-repeat;
	background-position: top left 10px;
	width:232px;
}
a.about{
    background-image:url(../img/en_about/about.png);
	width:70px;
}
a:hover.about{
    background-position:0px -81px;
}

a.method{
    background-image:url(../img/en_about/method.png);
	width:110px;
}
a:hover.method{
    background-position:0px -81px;
}

a.gallery{
    background-image:url(../img/en_about/gallrey.png);
	width:114px;
}
a:hover.gallery{
    background-position:0px -81px;
}

a.faculty{
    background-image:url(../img/en_about/faculty.png);
	width:124px;
}
a:hover.faculty{
    background-position:0px -81px;
}

a.class{
    background-image:url(../img/en_about/class.png);
	width:76px;
}
a:hover.class{
    background-position:0px -81px;
}


a.contact{
    background-image:url(../img/en_about/contact.png);
	width:124px;
}
a:hover.contact{
    background-position:0px -81px;
}


a { text-decoration: underline ; font-size: 12px;}
a:link { color: #000000 }
a:visited { color: #000000 }
a:hover { color:#777777;  }

a.detail { text-decoration: underline ; font-size: 10px; line-height: 14px;
}
a:link { color: #000000 }
a:visited { color: #000000 }
a:hover { color:#777777;  }

a.studio { text-decoration: underline ; font-size: 14px;}
a:link { color: #000000 }
a:visited { color: #000000 }
a:hover { color:#777777;  }


/*over
------------------------------------------------------------*/



#aboutbox{
	position:absolute;
	width:240;
	z-index:1;
	left: 140;
	top: 130px;
	text-align: center;
	visibility: hidden;
}

#aboutbox-smp{
	display: none;
}

#methodbox{
	position:absolute;
	width:170;
	height:50px;
	z-index:1;
	left: 272;
	top: 130px;
	text-align: center;
	visibility: hidden;
}

#methodbox-smp{
	display: none;
}

#gallerybox{
	position:absolute;
	width:90px;
	height:50px;
	z-index:1;
	left: 426px;
	top: 130px;
	text-align: center;
	visibility: hidden;
}

#gallreybox-smp{
	display: none;
}


#fctbox{
	position:absolute;
	width:120px;
	height:50px;
	z-index:1;
	left: 530px;
	top: 130px;
	text-align: center;
			visibility: hidden;
}



#fctbox2-smp{
	display: none;
}

#classbox{
	position:absolute;
	width:180px;
	height:50px;
	z-index:1;
	left: 598px;
	top: 130px;
	text-align: center;
			visibility: hidden;
}



#contactbox{
	position:absolute;
	width:200px;
	height:115px;
	z-index:1;
	left: 690;
	top: 130px;
	text-align: center;
		visibility: hidden;

}


/*menu smp click
------------------------------------------------------------*/
.menu .btn-1 {
    margin-left: 16px;
    color: #ffffff;
    display: block;
    font-size: 12px;
    font-weight: 300;
    line-height: 24px;
	margin-bottom: 14px;
	text-decoration: underline;
}

.menu .spm-1 a {
	margin-left: 60px;
	margin-bottom: 2px;
	font-size: 10px;
}

.menu .spm-1 a:first-child {
	margin-top: -6px;
}

.spm-1 {
	margin-bottom: 20px;
}



/*etc
------------------------------------------------------------*/

img,
fieldset {
	border:0;
}


.ttl16 {
	font-size: 16px;
}

.ttl14 {
	font-size: 14px;
}




.textgray {
	font-size: 12px;
	color: #604B3B;
}
a.textgray { text-decoration: underline ; font-size: 12px;}
a.textgray:link { color: #604B3B; }
a.textgray:visited { color: #604B3B; }
a.textgray:hover { color:#8f8070;  }

.txtred {
	font-size: 12px;
	color: #C00;
}
.txt10 {
	font-size: 10px;
}



.txtfff {
	color:#FFF; 
}

.cmps {
	font-size:105%;
	text-align: center;
	font-weight:bold;
	padding: 5px;
}

.txt10height12 {
	font-size: 10px;
	line-height:14px;
}


.txt12height14 {
	font-size: 12px;
	line-height:14px;
	margin-bottom:8px;
}

h1 {
    margin: 0px auto;
	font-size:16px;
	margin:40px 0 30px;
	padding-bottom:5px;
	border-bottom:#666 solid 1px;
	font-weight:normal;}



/*footer
------------------------------------------------------------*/

#footer {
	width: 100%;
    height: 50px;
    color: #FFFFFF;
    	font-size: 10px;
	line-height: 15px;
    text-align: center;
    bottom: 0;
    background-image:url(../img/index/bg_f.jpg);
}

#footer p{
    padding: 10px 0;
}

#fleft {
	text-align: left;
	float: left;
	padding-left: 30px;
	width: 40%;
}

#fright {
	text-align: right;
	float: right;
	padding-right: 30px;
}




/*ƒXƒ}ƒz
------------------------------------------------------------*/
@media only screen and (max-width: 480px){
	
html,body {
		height: auto;
	}
	
img {
		max-width: 100%;
		height: auto;
	}
	
.smp-displaynone {
		display: none;
	}
.pcnone {
	display:block;
}
	
#smh-header {
	display:block;
	margin-top: 10px;
}

#header, #menubox, #aboutbox, #fctbox, #fctbox2, #classbox, #cmbox, #cmbox2, #blogbox {display: none;}

div#container {
		height: auto;
		width: 100%;
}
div#contents {
		height: auto;
		width: 90%;
		margin: 0 auto;
		padding-bottom: 0px;
	}

	
#main {
		max-width: 100%;
    text-align: left;
    margin-left: 0px;
	padding: 50px 0px 0px 0px;
}
#main h3{
			font-size:160%;
}
#aboutbox-smp{
	display: block;
	text-align: left;
	line-height: 30px;
}
#fctbox2-smp{
	display: block;
	text-align: left;
	line-height: 30px;
}
#cmbox2-smp{
		display: block;
	text-align: left;
	line-height: 30px;
}
/*footer-------------------------------------------------------*/

#footer {
    height: auto;
    background-image: url(../img/index/bg_f.jpg);
    margin-top: 50px;
    padding-bottom: 20px;
		position:static;
}
	
#fleft {
		text-align: center;
    float: none;
    padding-left: 0;
    width: 100%;
}
	
#fright {
    text-align: center;
    float: none;
    padding-right: 0;
}
	
}