/*<style type="text/css" media="screen and (max-width: 768px) and (min-width: 400px)">*/
#preloadedImages {
    width: 0px;
    height: 0px;
    display: inline;
    background-image: url("../images/about_btn_sub.jpg");
    background-image: url("../images/works_btn_sub.jpg");
    background-image: url("../images/blog_btn_sub.jpg");
    background-image: url("../images/contact_btn_sub.jpg");
}

/*------------------------------*/
a:link    { color: none;}    
a:visited { color: none;}   
a:hover   { color: none;} 
a:active  { color: none;}   
a img { border: none; }

/*------------------------------*/
html { 
	overflow-y: scroll;

	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    -webkit-text-size-adjust: 100%;
}

body{
	background-color: #000;
	margin: -15px 0px 0px 0px;
}

/*------------------------------*/
.main{
	height: 100%;
	width: 730px;
	margin-left: auto;
	margin-right: auto;
}

#container{  
	width: 730px;
	margin: 0px auto;  
	background-color: #000;
	color: #fff;
} 

#title{
	width: 730px;
	height: 75px;
	margin: 15px auto 0px auto;  
}

#logo{
	width: 150px;
	height: 56px;
	-moz-background-size:contain;
	background-size:contain; 
	background-image: url("../images/logo.png");
    background-repeat:no-repeat;
}

a.logo_sub{
	width: 150px;
	height: 0px;
	padding-top: 56px;
	z-index: 2;

	display: block;
	line-height: 1;
	background: transparent url("../images/dammy.png") 0 0 no-repeat;
	overflow: hidden;
}

#lang_eng{
	width: 70px;
	height: 20px;
	margin: -25px 0px 0px 630px; 
	-moz-background-size:contain;
	background-size:contain; 
	background-image: url("../images/eng_btn.png");
    background-repeat:no-repeat;
}

#lang_jap{
	width: 70px;
	height: 20px;
	margin: -25px 0px 0px 630px; 
	-moz-background-size:contain;
	background-size:contain; 
	background-image: url("../images/jap_btn.png");
    background-repeat:no-repeat;
}

a.lang_sub{
	width: 70px;
	height: 0px;
	padding-top: 20px;
	z-index: 2;

	display: block;
	line-height: 1;
	background: transparent url("../images/dammy.png") 0 0 no-repeat;
	overflow: hidden;
}

/*--------------menu----------------*/

/*--共通部分↓--*/
ul#navigation {
    width:490px;
    overflow:hidden;　/*float解除*/
    zoom:100%;　/*float解除*/

    background-color: #7f7f7f;
    margin:-60px 0px 0px 100px;
}
ul#navigation li {
    float:left; /*次の要素を右側へ回り込ませる*/
    list-style:none; /*リストの●を消す*/
	margin:0px 2px 0px 0px;
}
ul#navigation li a {
    display:block; /*インラインからブロック要素へ変更*/
    height:27px; /*高さ*/
    width:90px; /*横幅*/
}
/*--共通部分↑--*/

ul#navigation a.top {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_top.png") 0 0 no-repeat;
	overflow: hidden;
    
	-moz-background-size:100% auto;
	background-size:100% auto; 
}
ul#navigation li a.top:active {
	background-position:0 -30px;
}

ul#navigation a.blog {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_blog.png") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto;
}
ul#navigation li a.blog:active {
	background-position:0 -30px;
}

ul#navigation a.about {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_about.png") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto;
}
ul#navigation li a.about:active {
	background-position:0 -30px;
}

ul#navigation a.works {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_works.png") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}
ul#navigation li a.works:active {
	background-position:0 -30px;
}

ul#navigation a.contact {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_contact.png") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto;
}
ul#navigation li a.contact:active {
	background-position:0 -28px;
}



/*style.css ダミーメニュー------------------------------*/
ul#navigation a.dammy_top {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_top.png") 0 0 no-repeat;
	overflow: hidden;
	background-position:0px -28px;

	-moz-background-size:100% auto;
	background-size:100% auto;
}

ul#navigation a.dammy_blog {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_blog.png") 0 0 no-repeat;
	overflow: hidden;
	background-position:0px -28px;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}

ul#navigation a.dammy_about {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_about.png") 0 0 no-repeat;
	overflow: hidden;
	background-position:0px -28px;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}

ul#navigation a.dammy_works {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_works.png") 0 0 no-repeat;
	overflow: hidden;
	background-position:0px -28px;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}

ul#navigation a.dammy_contact {
	display: block;
	line-height: 1;
	width: 90px;
	height: 0;
	padding-top: 28px;
	background: transparent url("../images/menu_contact.png") 0 0 no-repeat;
	overflow: hidden;
	background-position:0px -28px;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}
/*style.css ダミーメニュー------------------------------*/
/*--------------menu----------------*/



/*--------------menu2----------------*/

/*--共通部分↓--*/
ul#navigation2 {
	list-style-type: none;
	visibility:collapses;
	display: none;
	height: 0px;
}
ul#navigation2 li {
	list-style-type: none;
	visibility:collapses;
	height: 0px;
}
ul#navigation2 li a {
	list-style-type: none;
	visibility:collapses;
	height: 0px;
}
/*--共通部分↑--*/

ul#navigation2 a.top2 {}

ul#navigation2 a.about2 {}

ul#navigation2 a.works2 {}

ul#navigation2 a.blog2 {}

ul#navigation2 a.contact2 {}
/*--------------menu2----------------*/



#topimg{
	width: 730px;
	height: 366px;
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
	margin: 0px auto 0px auto; 
	background-image: url("../images/top_img/img0.jpg");
}

/*--------------topimg----------------*/
#img1{
	width: 730px;
	height: 366px;
	background-image: url("../images/top_img/img1.jpg");
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
}

#img2{
	width: 730px;
	height: 366px;
	background-image: url("../images/top_img/img2.jpg");
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
}

#img3{
	width: 730px;
	height: 366px;
	background-image: url("../images/top_img/img3.jpg");
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
}

#img4{
	width: 730px;
	height: 366px;
	background-image: url("../images/top_img/img4.jpg");
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
}
/*--------------topimg----------------*/



/*--------------box----------------*/
#box{
	width: 600px;
	height: 150px;
	margin: 50px auto 50px auto;
}

/*----共通部分----*/
ul#box_sub {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

ul#box_sub li {
	float: left;
	width: 150px;
	margin: 0px 0px;
	/*text-align: center;*/
}

ul#box_sub li a {
    display:block;
	width: 150px;
	height: 150px;
}

/*----共通部分----*/

ul#box_sub a.about {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/about_btn.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}
ul#box_sub li a.about:active {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/about_btn_sub.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}

ul#box_sub a.works {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/works_btn.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}
ul#box_sub li a.works:active {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/works_btn_sub.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}

ul#box_sub a.blog {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/blog_btn.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}
ul#box_sub li a.blog:active {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/blog_btn_sub.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}

ul#box_sub a.contact2 {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/contact_btn.jpg") 0 0 no-repeat;
	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}
ul#box_sub li a.contact2:active {
	display: block;
	line-height: 1;
	width: 150px;
	height: 0;
	padding-top: 150px;
	background: transparent url("../images/contact_btn_sub.jpg") 0 0 no-repeat;	overflow: hidden;

	-moz-background-size:100% auto;
	background-size:100% auto; 
}


/*--------------box----------------*/

#footer{
	width: 730px;
	height: 150px;
	margin: 0px auto -10px auto;
}

#contact{
	width: 175px;
	height: 120px;
	margin: 0px 0px 0px 50px;
}

#copyright{
	font-family: "Times New Roman";
	color: #fff;
	text-align: center;
	line-height:40px;
	padding-top:100px;
	font-style:normal;
	font-weight: bold;
	color:#3a3a3a;
}
/*-------------about-------------*/

#about-box{
	width:612px;
	height:100%;/*-------------星空-------------*/
	margin: 100px auto 0px auto;
	background-image:url("../images/star_m.png");
	border: 1px #000 solid;
}

#about-img{
	width:612px;
	height:312px;
	margin-top: 0px;/*-------------星空-------------*/
	background-image:url("../images/about_img.jpg");
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
}

.about-memo{
	width:370px;
	background-image:url("../images/dammy.png");
	margin:50px auto auto auto;/*-------------星空-------------*/
	position: relative;
	z-index: 2;
	padding: 20px 15px 20px 15px;
	line-height: 2;
	text-align:left;
	/*border: 1px #ff0000 solid;*/
}


.profile{
	width:400px;
	margin: -100px auto 0px auto;*//*-------------星空-------------*/
                   text-align: left;
}

.profile b{
	font-size:17px;
	color:#7f7f7f;
}
.profile th{
	width: 40%;
	font-size:15px;
	padding: 5px 0px 5px 50px;
	color:#7f7f7f;
}
.profile td{
	width: 60%;
	font-size:15px;
	padding: 5px 0px 5px 10px;
	color:#fff;
}

/*-------------about-------------*/



/*-------------works-------------*/
#works-box{
	width: 730px;
	margin: 0px auto 0px auto; 
	background-image: url("../images/star_m.png");
}
#works-img{
	width: 730px;
	height: 413px;
	position: relative;  
	margin-bottom:0px;
	margin-left:auto;
	margin-right:auto;
	background-image: url("../images/works_img.jpg");
    
	-moz-background-size:contain;
	background-size:contain; 
}
.works-icon{
	width: 150px;
	height: 150px;
}

.creation{
	height:160px;
    width:500px;
	margin: 30px 0px 0px 50px;
	background-image:url("../images/back.png");
}
.creation tr{
	background-image:url("../images/back.png");
}
.creation th{
	width:35%;
}
.creation td{
	width:65%;
	padding-left: 20px;
	text-align: left;
    vertical-align: top;
	font-size:12px;
	line-height:20px;
	/*background-color:#181818;*/
    background-color:#000;
}
.creation h3{
	font-size:17px;
	line-height:1;
}
.creation a{
	color:#ffde58;
	font-size:12px;
	line-height:12px;
	text-decoration:none;
}
.creation h2{
	color:#fff;
	font-size:25px;
	line-height:30px;
	text-align: left;
	padding: 10px 0px 10px 0px;
	margin:0px;
}

#client{
	color:#8a8a8a;
	font-size:12px;
}

#client_sub{
	color:#8a8a8a;
	font-size:12px;
	text-decoration:underline
}
/*-------------works-------------*/


/*------------contact------------*/
#contact-box{
	width: 730px;
	height: 550px;
	margin: 0px auto 0px auto; 
	background-image: url("../images/star_m.png");
	border: 1px #000 solid;
}
#contact-img{
	width: 730px;
	height: 450px;
    background-repeat:no-repeat;
	-moz-background-size:contain;
	background-size:contain; 
	position: absolute;  
	margin-top: 140px;
	background-image: url("../images/contact_img.jpg");
}

.adress{
	position: relative; 
	margin:70px auto auto 470px;
	padding:30px 10px 30px 20px ;
	background-image: url("../images/back.png");
	text-align: left;
	line-height:1.5;
}
/*------------contact------------*/