@charset "utf-8";

/* 

0. default
1. ipad landscape
2. ipad
3. iphone

*/


/* default
-----------------------------------------------------------------------------------------*/
/*+++++++++++++++++++++++++++++++++*/

/* common */

/*+++++++++++++++++++++++++++++++++*/
body {
	font-family: Sans-Serif,"ＭＳ Ｐゴシック","MS PGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",メイリオ,;
	font-size: 12px;
	color: #000;
	line-height: 1.5;
	-webkit-text-size-adjust: none;
}

a {
	color: #000;
	text-decoration: none;
}

a:visited {
	color: #000;
	text-decoration: none;
}

a:hover {
	color: #999;
	text-decoration: none;
}

.outline {
	width: 1200px;
	margin: 0 auto;
	padding-top: 40px;
	position: relative;
}

.main_visual,
.content {
	text-align: center;
	width: 900px;
	margin: 0 auto;
	margin-bottom: 20px;
	height: 530px;
	overflow: hidden;
}

#index .bx-wrapper {
	margin-bottom: 80px!important;
}

.content {
	width: 1040px;
}

.content .bx-wrapper {
	margin: 0 auto;
}

#about .content,
#recruit .content,
#contact .content {
	width: 460px;
	text-align: left;
}

.content h1 {
	border-bottom: 1px solid #000;
	margin-top: 50px;
	margin-bottom: 50px;
}

.main_visual li img {
}

.works_list {
	width: 1040px;
	min-height: 60px;
	margin: 0 auto;
}

.works_list ul {
	padding-top: 20px;
}


/*+++++++++++++++++++++++++++++++++*/

/* menu */

/*+++++++++++++++++++++++++++++++++*/
.menu {
	position: relative;
	width: 1040px;
	height: 100px;
	margin: 0 auto;
}

.menu .title {
	position: absolute;
	top: 0;
	right: 0;
}

.nav {
	float: left;
	margin-left: 60px;
}

.nav.main_menu {
	margin-left: 0;
}

.nav .category_menu {
	float: left;
}

.nav .category_menu.category_menu_right {
	margin-left: 60px;
}

.new a {
	color: #FF0033;
}

.new a span {
	font-size: 9px;
}

.nav_new a {
	color: #FF0033;
}

/*+++++++++++++++++++++++++++++++++*/

/* main*/

/*+++++++++++++++++++++++++++++++++*/
/*
     about
*/
#about .content {
	margin-bottom: 80px;
}

#about th {
	vertical-align: top;
	padding: 5px 30px 5px 0;
	white-space: nowrap;
}

#about td {
	padding: 5px 0;
}

/*
     works　メイン画像部分
*/
.works_main {
}

/*
     works　サブ画像
*/

.works_sub_container {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 999;
	margin-top: -10px;
}

.works_sub {
	float: left;
	margin-right: 10px;
	/*position: absolute;
	top: 0;
	right: 0;
	z-index: 999;
	margin-top: -10px;*/
}

.works_sub li {
	margin-top: 10px;
}

.works_sub a {
}


/*
     works　作品ごとのサムネイル
*/
.pager_outline {
	width: 1040px;
	margin: 0 auto;
	overflow: hidden;
}

#bx_pager {
	margin-left: -10px;
}

#bx_pager li {
	float: left;
	margin-left: 10px;
	margin-bottom: 10px;
}

.works_item {
	position: relative;
}

.works_item p {
	width: 900px;
	height: 530px;
	margin: 0 auto;
}

.works_item p img {
	max-width: 100%;
	max-height: 100%;
}

/*
     map
*/
#map .content {
	margin-bottom: 80px;
	height: 450px;
}

#map .content img {
	padding-top: 60px;
}

#map .content iframe {
	width: 100%;
}

@media screen and (max-width: 1024px) {
	#map .content iframe {
		width: 90%;
	}
}

@media screen and (max-width : 900px) {
}

@media screen and (max-width: 568px) {
	#map .content {
		margin-bottom: 30px;
		height: 400px;
	}

	#map .content iframe {
		width: 90%;
		height: 400px;
	}
}

/*
     contact
*/
.remodal .logo {
	width: 150px;
	height: 30px;
	overflow: hidden;
}

.remodal .logo img {
	display: block;
	position: relative;
	left: -4px;
}

.remodal h2 {
	/*font-size: 16px;
	font-weight: bold;*/
	margin: 15px 0;
}

.remodal hr {
	height: 0;
	border: 0;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #fff;
}

.remodal table {
	margin-top: 30px;
}

.remodal table th,
.remodal table td {
	padding: 10px 0;
}

.remodal table th {
	padding-right: 10px;
	vertical-align: top;
	white-space: nowrap;
}

.remodal table td {
	vertical-align: middle;
}

.remodal table input,
.remodal table textarea {
	border: 1px solid #ccc;
}

.remodal table .full input {
	width: 100%;
}

.remodal table .tel input {
	width: 80px;
}

.remodal table textarea {
	width: 100%;
	height: 100px;
}

.remodal .submit {
	margin-top: 10px;
	text-align: right;
}

.remodal .submit input[type="submit"] {
	/*width: 135px;*/
	height: 20px;
	padding: 2px 4px;
	color: #444;
	background: #efefef;
	border: none;
	text-align: left;
}

.remodal .kome {
	font-size: 11px;
}

.remodal .error {
	color: #FF0000;
}

/*
     recruit
*/
#recruit .content {
	margin-bottom: 80px;
}

#recruit .remodal.recruit .label {
	display: block;
	margin-top: 20px;
}

#recruit .remodal.recruit .input {
	margin-top: 5px;
	color: #666;
}

#recruit .remodal.recruit input[type="text"],
#recruit .remodal.recruit textarea {
	border: 1px solid #ccc;
	width: 100%;
}

#recruit .remodal.recruit .submit {
}

#recruit .recruit_form_title {
	font-size: 18px;
	margin-bottom: 15px;
}

/*
     overseas
*/
#overseas .content {
	/* 1列増えたらwidthの値を+185px */
	width: 400px;
	height: 528px;
	margin-bottom: 80px;
	border: 1px solid #FF0033;
	color:#FF0033;
	text-align: center;
}

#overseas .content p {
	width: 230px;
	margin: 30px auto;
	text-align: left;
}

#overseas .content .staff {
	margin-top: 50px;
	padding-right: 30px;
}

#overseas .content .staff ul {
	float: left;
	width: 125px;
	margin-left: 60px;
	text-align: left;
}






/* ipad landscape
-----------------------------------------------------------------------------------------*/
@media screen and (max-width: 1024px) {
	/*+++++++++++++++++++++++++++++++++*/
	
	/* common */
	
	/*+++++++++++++++++++++++++++++++++*/
	body {
		width: 100%;
	}
	
	.outline {
		width: 100%;
		padding-top: 20px;
	}

	.main_visual,
	.content {
		margin-bottom: 20px;
	}

	.content .bx-wrapper {
		width: 90%;
		margin: 0 auto;
	}

	.main_visual,
	.content {
		width: 100%;
		height: 400px;
	}
	
	#index .bx-wrapper {
		height: 400px;
	}

	#index .bx-wrapper img {
		position: static!important;
		display: block;
		width: 90%;
		height: auto;
		margin: 0 auto;
	}
	
	.bx-wrapper p img {
		position: static!important;
		display: block;
		margin: 0 auto;
		/*height: 100%;
		width: auto;*/
		max-width: 100%;
		max-height: 100%;
	}	
	
	/*+++++++++++++++++++++++++++++++++*/
	
	/* menu */
	
	/*+++++++++++++++++++++++++++++++++*/
	.menu {
		width: 90%;
	}
		
	.works_list {
		width: 100%;
	}
	/*+++++++++++++++++++++++++++++++++*/
	
	/* main*/
	
	/*+++++++++++++++++++++++++++++++++*/
	/*
		 about
	*/
	
	/*
		 works　メイン画像部分
	*/
	
	/*
		 works　サブ画像
	*/	
	.works_sub li img {
	}
	
	/*
		 works　作品ごとのサムネイル
	*/
	.pager_outline {
		width: 90%;
	}
		
	.works_item p {
		width: 100%;
		height: 400px;
	}
		
	/*
		 map
	*/
	#map .content img {
		width: 60%;
		height: auto;
	}
	
	
	/*
		 contact
	*/
	.remodal table th {
		white-space: nowrap;
	}
		
	.remodal table textarea {
		width: 100%;
		height: 100px;
	}
		
	.remodal .kome {
		font-size: 9px;
	}
	
	
	/*
		 overseas
	*/
	#overseas .content {
		/* 1列増えたらwidthの値を+185px */
		width: 400px;
		height: 398px;
		margin-bottom: 90px;
		border: 1px solid #FF0033;
		color:#FF0033;
		text-align: center;
	}
	
	#overseas .content p {
		width: 230px;
		margin: 10px auto;
		text-align: left;
	}
	
	#overseas .content .staff {
		margin-top: 20px;
		padding-right: 30px;
	}
	
	#overseas .content .staff ul {
		float: left;
		width: 125px;
		margin-left: 60px;
		text-align: left;
		font-size: 11px;
	}

}




/* ipad tate
-----------------------------------------------------------------------------------------*/
@media screen and (max-width : 900px) {
	/*+++++++++++++++++++++++++++++++++*/
	
	/* common*/
	
	/*+++++++++++++++++++++++++++++++++*/
	body {
		width: 100%;
		font-size: 10px;
	}

	.main_visual,
	.content {
		text-align: center;
		width: 100%;
		height: 400px;
		margin: 0 auto;
		margin-bottom: 30px;
		overflow: hidden;
	}
	
	#index .bx-wrapper {
		height: 400px;
	}

	.works_item p {
		width: 80%;
		height: 400px;
		margin: 0 auto;
	}

	.bx-wrapper p img {
		position: static!important;
		display: block;
		margin: 0 auto;
		/*width: 90%;
		height: auto;*/
		max-width: 100%;
		max-height: 100%;
	}	

	#index .bx-wrapper {

		height: 400px;
	}

	#about .content,
	#recruit .content,
	#contact .content {
		width: 90%;
		text-align: left;
	}

	.works_list {
		width: 100%;
	}

	/*+++++++++++++++++++++++++++++++++*/
	
	/* main*/
	
	/*+++++++++++++++++++++++++++++++++*/
	/*
		 about
	*/
	
	/*
		 works　メイン画像部分
	*/
	
	/*
		 works　サブ画像
	*/	
	.works_sub li img {
		height: 20px!important;
		width: auto!important;
	}
	
	/*
		 works　作品ごとのサムネイル
	*/
	/*
		 overseas
	*/
	#overseas .content {
		width: 400px;
		height: 398px;
		margin-bottom: 90px;
		border: 1px solid #FF0033;
		color:#FF0033;
		text-align: center;
		font-size: 9px;
	}

	.new a span {
		font-size: 8px;
	}


}

/* smart phone
-----------------------------------------------------------------------------------------*/
@media screen and (max-width : 568px) {
	/*+++++++++++++++++++++++++++++++++*/
	
	/* common*/
	
	/*+++++++++++++++++++++++++++++++++*/
	body {
		width: 100%;
		font-size: 9px;
	}


	.main_visual,
	.content {
		text-align: center;
		width: 100%;
		height: 300px;
		margin: 0 auto;
		margin-bottom: 30px;
		overflow: hidden;
	}
	
	#index .bx-wrapper {
		height: 300px;
	}

	.works_item {
		width: 100%;
	}
	
	.works_item p {
		width: 85%;
		height: 300px;
		margin: 0;
	}

	.bx-wrapper p img {
		position: static!important;
		display: block;
		margin: 0 auto;
		/*width: 80%;
		height: auto;*/
		max-width: 100%;
		max-height: 100%;
	}	

	.works_sub_container {
		margin-top: -5px;
	}
	
	.works_sub {
		margin-right: 5px;
	}
	
	.works_sub li {
		margin-top: 5px;
	}

	.works_sub li img {
		height: 20px;
		width: auto;
	}

	#index .bx-wrapper {
		height: 300px;
	}

	#about .content,
	#recruit .content,
	#contact .content {
		width: 90%;
		text-align: left;
	}

	.content h1 {
		border-bottom: 1px solid #000;
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.works_list {
		width: 100%;
	}

	/*+++++++++++++++++++++++++++++++++*/
	
	/* menu */
	
	/*+++++++++++++++++++++++++++++++++*/
	.menu .title {
		position: static;
		clear: left;
		text-align: center;
	}

	.menu .title img {
		padding: 15px 0;
	}

	.nav {
		margin-left: 30px;
	}
	
	.nav .category_menu.category_menu_right {
		margin-left: 30px;
	}


	/*+++++++++++++++++++++++++++++++++*/
	
	/* main*/
	
	/*+++++++++++++++++++++++++++++++++*/
	/*
		 works　作品ごとのサムネイル
	*/
	.pager_outline img {
		height: 20px!important;
		width: auto!important;
	}

	/*
		 overseas
	*/
	#overseas .content {
		width: 90%;
		height: 298;
		margin-bottom: 90px;
		border: 1px solid #FF0033;
		color:#FF0033;
		text-align: center;
		font-size: 9px;
	}

	#overseas .content p {
		width: auto;
		margin: 10px auto;
		text-align: center;
	}
	
	#overseas .content .staff {
		margin-top: 20px;
		padding-right: 0;
	}
	
	#overseas .content .staff ul {
		float: left;
		width: 100px;
		margin-left: 30px;
		text-align: left;
	}

	.remodal table .tel input {
		width: 30px;
	}

	.new a span {
		font-size: 7px;
	}

}


/* PC
-----------------------------------------------------------------------------------------*/
@media screen and (min-width : 1024px){
/* 最小幅 1024px 以上の指定 */
}