@charset "utf-8";

@import "css/design.css";   /* 共通 */

/* html5に対応していないブラウザ用 */
header, hgroup, section, footer, aside, nav, article {
	display: block;
}/* ******************************* */

* {
	font-family: "メイリオ" , "ＭＳ Ｐゴシック" , "ＭＳ ゴシック" , "Hiragino Kaku Gothic Pro" , "ヒラギノ角ゴ Pro W3" , "Arial" , "Helvetica" , sans-serif;
	font-size: 13px;
}

/* GENERAL */
body {
	background: url(images/body_bg.gif) center top repeat-y #9D5F46;
	margin: 0;
	padding: 0;
	font-family:'メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	font-size: 80%;
	color: #1F0C00;
}

img{	border: none;}



/*-------------------------------------------*/
/* container */
.container{
	max-width: 1250px;
	margin: 0 auto;
	background: url(images/container_bg.gif) left top repeat-y;
}
/*-------------------------------------------*/
/* header */
header{
	width: 100%;
	height: 130px;
	margin: 0 auto;
	padding: 0;
	border-top: 5px solid #4D2808;
	background: url(images/header_bg.jpg) center top no-repeat;
}

	/*
	logo */
#logo {
	margin: 0 auto;
	padding: 0;
	width: 960px;
	height: 130px;
}

#logo h1 {
	margin: 0;
	padding: 0;
	text-indent: -9999px;
}

#logo h1 a{
	display: block;
	width: 960px;
	height: 130px;
	text-decoration: none;
	text-indent: -9999px;
}

#logo h2{
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}
/*-------------------------------------------*/
/* Background content */
/* ****************** */
section {
	margin: 0 auto;
	width: 960px;
	padding: 0;
	overflow: hidden;
}

		section:after {
		  content : "";
		  display : block;
		  height : 0;
		  clear : both;
		}


/*-------------------------------------------*/
/* pankuzu */
#pankuzu{
	margin: 0 auto 10px;
	padding: 0;
	overflow: hidden;
}
#pankuzu ul{
	margin: 0;
	padding: 0;
	list-style: none;
	display: block;
	float: right;
	font-size: 11px;
}

#pankuzu li{
	display: inline;
	margin: 0;
	list-style: none;
	letter-spacing: 1px;
	line-height: 24px;
}

#pankuzu li a{
	display: block;
	float: left;
	padding: 0 15px 0 5px;
	background: url(images/pankuzu_arrow.gif) right top no-repeat;
	color: #9D5F46;
	text-decoration: none;
}

	#pankuzu li a:hover{
		text-decoration: underline;
	}

	#pankuzu li.this_pages{
		margin-left: 5px;
	}

/*-------------------------------------*/
/* sidebar */
#sidebar{
	width: 210px;
	float: left;
}

	#side_nav{
		width: 210px;
		margin: 45px 0 0;
	}

		#side_nav ul{
			margin: 0;
			padding: 0;
			list-style: none;
		}

			#side_nav ul li{
				margin: 0;
				padding: 0;
				list-style: none;
			}

				#side_nav ul li a{
					margin: 0;
					padding: 0;
					list-style: none;
					display: block;
					background-image: url(images/side_nav.gif);
					background-repeat: no-repeat;
					width: 210px;
					height: 85px;
					text-indent: -9999px;
				}



				/* side_nav_home */
				.side_nav_home{ background-position: left top;}
					.side_nav_home:hover{ background-position: -210px top;}

				.side_nav_concept{ background-position: left -85px;}
					.side_nav_concept:hover{ background-position: -210px -85px;}

				/* side_nav_menu */
				.side_nav_menu{ background-position: left -170px;}
					.side_nav_menu:hover{ background-position: -210px -170px;}

				/* side_nav_info */
				.side_nav_info{ background-position: left -255px;}
					.side_nav_info:hover{ background-position: -210px -255px;}

				/* side_nav_style */
				.side_nav_style{ background-position: left -340px;}
					.side_nav_style:hover{ background-position: -210px -340px;}

				/* side_nav_contact */
				.side_nav_contact{ background-position: left -425px;}
					.side_nav_contact:hover{ background-position: -210px -425px;}


				.active{ background-position-x: -210px;}

/*-------------------------------------*/
/* content */
#content{
	width: 700px;
	margin: 0;
	padding: 0;
	float: right;
}


#content h2{
	display: block;
	width: 700px;
	height: 100px;
	margin: 0;
	padding: 0;
	background-position: left top;
	background-repeat: no-repeat;
	text-indent: -9999px;
}

.title_concept{ background-image: url(images/title_concept.gif);}
.title_menu{ background-image: url(images/title_menu.gif);}
.title_info{ background-image: url(images/title_info.gif);}
.title_style{ background-image: url(images/title_style.gif);}
.title_contact{ background-image: url(images/title_contact.gif);}





#content h3{
	margin-bottom: 20px;
	padding: 0 0 5px;
	background: url(images/contents_h3.gif) left bottom no-repeat;
	font-size: 30px;
	font-weight: normal;
	color: #000;
}

#content h3 span{
	font-size: 14px;
	margin-left: 15px;
}


#content h4{
	clear: both;
	margin-top: 50px;
	padding-left: 10px;
	background: #fff;
	border: solid #9D5F46;
	border-width: 1px 1px 1px 30px;
	font-size: 16px;
	line-height: 30px;
	color: #9D5F46;
}

#content h5{
	border-bottom: 1px dotted #9D5F46;
	font-size: 14px;
}




/* ----------------------------------- */
/* pageback/pagetop */
#pagenav{
	clear: both;
	width: 700px;
	height: 11px;
	margin: 100px 0 30px;
	text-indent: -9999px;
}

#pagenav p{
	margin: 0;
}
.p_top a{
	display: block;
	float: right;
	width: 78px;
	height: 11px;
	background: url(images/p_top.gif) left top no-repeat;
}


.p_back a{
	display: block;
	float: left;
	width: 87px;
	height: 11px;
	background: url(images/p_back.gif) right top no-repeat;
}
/*------------------------------------------------- */
/* footer */
footer{
	clear: both;
	width: 700px;
	margin: 0 auto;
	padding: 10px 0 0;
	background: url(images/footer_bg.gif) left top no-repeat;
	border-top: 1px dotted #9D5F46;
	overflow: hidden;
}

.f_nav{
	float: right;
	width: 270px;
	font-size: 11px;
	text-align: right;
	color: #9D5F46;
}

footer ul.outline{
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
	display: block;
	float: left;
	width: 400px;
}

footer ul.outline li{
	margin: 0;
	padding: 0 0 0 8px;
	list-style: none;
	background: url(images/footer_arrow.png) left 5px no-repeat;
	display: inline;
	font-size: 11px;
}

footer ul.outline li.fb_bt{
	display: block;
	background: none;
	margin: 10px 0 0;
	padding: 0;
}


footer address{
	display: block;
	float: left;
	font-style: normal;
	font-size: 11px;
	text-align: right;
}

.f_nav p.fb_bt{
	display: block;
	float: right;
	width: 31px;
	height: 32px;
	margin: 0 0 0 5px;
}



footer p.copyright{
	clear: both;
	margin: 0;
	padding: 0;
	text-align: right;
	color: #C58E7A;
	font-size: 10px;
}


footer a{
	color: #9D5F46;
	text-decoration: none;
}

footer a:hover{
	color: #9D5F46;
	text-decoration: underline;
}





/*-------------------------------------------*/
/* table_a */
table.table_a{
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-collapse: collapse;
	width: 100%;
}


table.table_a th{
	padding: 5px;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	background: #e6f3e7;
	color: #333;
}

table.table_a td{
	padding: 5px;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	vertical-align: top;
}
/*------------------------------------------------- */
/* index */

.top_image{
	width: 600px;
	height: 260px;
	background: url(images/index_img1.gif) center top no-repeat;
	margin: 40px auto 0;
	padding: 320px 0 0;
}

		.top_image ul{
			margin: 0;
			padding: 0;
			list-style: none;
		}

			.top_image li{
				margin: 0;
				padding: 0;
				list-style: none;
				display: inline;
			}


				.top_image ul li a{
					margin: 0;
					padding: 0;
					list-style: none;
					display: block;
					float: left;
					background-image: url(images/index_img2.gif);
					background-repeat: no-repeat;
					width: 200px;
					height: 40px;
					text-indent: -9999px;
				}



				/* top_image_web */
				.top_image_web{ background-position: left top;}
					.top_image_web:hover{ background-position: left -40px;}

				/* top_image_dtp */
				.top_image_dtp{ background-position: -200px top;}
					.top_image_dtp:hover{ background-position: -200px -40px;}

				/* top_image_illust */
				.top_image_illust{ background-position: -400px top;}
					.top_image_illust:hover{ background-position: -400px -40px;}













/*-------------------------------------*/
/* menu setting */
#menu_box{
	width: 700px;
	margin: 30px 0 10px;
	padding: 0;


		/* flex */
		display: flex;/* IE11 */
		display: -webkit-flex;　/* Safari,Google Chrome用 */
		display: -moz-flex;　/* Firefox用 */
		display: -ms-flex;
		
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		
		justify-content: space-between;
		-webkit-justify-content: space-between;
		-moz-justify-content: space-between;
		-ms-justify-content: space-between;
}

	#menu_box ul{
		width: 320px;
		margin: 0;
		padding: 0;
		list-style: none;
		
	}

		#menu_box ul li{
			display: block;
			width: 318px;
			min-height: 220px;
			
			margin: 0 0 15px;
			list-style: none;
		}
		
		

	#menu_box p img{
		width: 319px;
	}

	#menu_box p{
		margin: 0;
	}

	#menu_box span{
		display: block;
		font-size: 12px;
		margin-bottom: 10px;
	}


	#menu_box dl{
		margin: 0;
		padding: 0;
		overflow: hidden;
		
		/* flex */
		display: flex;/* IE11 */
		display: -webkit-flex;　/* Safari,Google Chrome用 */
		display: -moz-flex;　/* Firefox用 */
		display: -ms-flex;
		
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		
		justify-content: space-between;
		-webkit-justify-content: space-between;
		-moz-justify-content: space-between;
		
	}

		#menu_box dt{
			display: block;
			width: 190px;
			height: 30px;
			margin: 0 0 5px;
			padding: 0 0 0 10px;
			background: #000;
			color: #fff;
			line-height: 30px;
		}

			#menu_box dd{
				display: block;
				width: 103px;
				height: 28px;
				margin: 0 0 5px;
				padding: 0 10px 0 0;
				background: #fff;
				border: 1px solid #000;
				color: #000;
				line-height: 30px;
				text-align: right;
				font-weight: bold;
			}


/*--------------------------------------------
MENU
---------------------------------------------*/
@media screen and (max-width:1249px){
	#menu_box p img{
		width : 100%;
		height : auto;
	}
}
@media screen and (max-width: 768px){
	#menu_box{
		width : 100%;
		margin : calc( 30 * 100vw / 750 ) 0 calc( 10 * 100vw / 750 );
	}
	#menu_box ul{
		width : 100%;
		margin-left : auto;
		margin-right : auto;
	}
	#menu_box ul li{
		width : calc( 560 * 100% / 640 );
		height : auto;
		float : none;
		margin : 0 auto 0;
		padding : calc( 20 * 100vw / 750 ) calc( 20 * 100% / 640 ) calc( 10 * 100vw / 750 );
		border-radius : calc( 16 * 100vw / 750 );
	}
	#menu_box ul li.second{
		margin : 0 auto 0;
	}
	#menu_box ul li + li , #menu_box ul li + li.second{
		margin-top : calc( 48 * 100vw / 750 );
	}
	#menu_box span{
		font-size : calc( 26 * 100vw / 750 );
		margin-bottom : calc( 16 * 100vw / 750 );
	}
	#menu_box dt{
		width : calc( 190 * 100% / 319 );
		height : calc( 52 * 100vw / 750 );
		margin : 0 0 calc( 5 * 100vw / 750 );
		padding : 0 0 0 calc( 10 * 100vw / 750 );
		line-height : 1;
		font-size : calc( 26 * 100vw / 750 );
		display : flex;
		align-items : center;
	}
	#menu_box dd{
		width : calc( ( 113 * 100% / 319 ) - 2px );
		height : calc( ( 52 * 100vw / 750 ) - 2px );
		margin : 0 0 calc( 5 * 100vw / 750 );
		padding : 0;
		padding-right : calc( 16 * 100vw / 750 );
		line-height : 1;
		font-size : calc( 26 * 100vw / 750 );
		display : flex;
		align-items : center;
		justify-content : flex-end;
		white-space : nowrap;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#menu_box{
		width : 100%;
		margin : calc( 30 * 100vw / 1250 ) 0 calc( 10 * 100vw / 1250 );
	}
	#menu_box ul{
		width : 100%;
	}
	#menu_box ul li{
		width : calc( 319 * 100% / 700 );
		height : calc( 188 * 100vw / 1250 );
		margin : 0 calc( 15 * 100% / 700 ) calc( 15 * 100% / 700 ) 0;
		padding : calc( 10 * 100vw / 1250 ) calc( 10 * 100% / 700 ) calc( 5 * 100vw / 1250 );
		border-radius : calc( 10 * 100vw / 1250 );
	}
	#menu_box span{
		font-size : calc( 12 * 100vw / 1250 );
		margin-bottom : calc( 10 * 100vw / 1250 );
	}
	#menu_box dt{
		width : calc( 190 * 100% / 319 );
		height : calc( 30 * 100vw / 1250 );
		margin : 0 0 calc( 5 * 100vw / 1250 );
		padding : 0 0 0 calc( 10 * 100vw / 1250 );
		line-height : 1;
		font-size : calc( 13 * 100vw / 1250 );
		display : flex;
		align-items : center;
	}
	#menu_box dd{
		width : calc( 103 * 100% / 319 );
		height : calc( ( 30 * 100vw / 1250 ) - 2px );
		margin : 0 0 calc( 5 * 100vw / 1250 );
		padding : 0 calc( 10 * 100% / 269 ) 0 0;
		line-height : 1;
		font-size : calc( 13 * 100vw / 1250 );
		display : flex;
		align-items : center;
		justify-content : flex-end;
	}
}





/*-------------------------------------*/
/* info setting */

.staff_box{
	width: 700px;
	height: 230px;
	background: #fff;
	margin: 0 0 50px;
}

	.staff_box p{
		margin: 0;
	}

	.staff_box img{
		display: block;
		float: left;
		width: 230px;
		height: 230px;
		margin: 0 20px 0 0;
	}

	.staff_box ul{
		display: block;
		float: right;
		width: 430px;
		margin: 30px 20px 0 0;
		padding: 0;
		list-style: none;
	}

		.staff_box ul li{
			margin-left: 0;
			padding-left: 0;
			list-style: none;
		}


		.staff_name{
			margin: 20px 0 0;
			font-size: 25px;
			font-weight: bold;
		}


/*
access */
#access{
	margin: 0 auto 50px;
	width: 700px;
	overflow: hidden;
}

	#access ul{
		display: block;
		float: right;
		width: 370px;
		margin: 0;
		padding: 0;
		list-style: none;
	}

		#access ul li{
			margin: 0;
			padding: 0;
			list-style: none;
		}

		#access ul li.tel{
			font-size: 200%;
			font-weight: bold;
			line-height: 100%;
			color: #9D5F46;
			margin: 10px 0 20px;
		}

		#access ul li.li_icon_a{
			background: url(images/arrow_a.gif) left 1px no-repeat;
			padding: 0 0 10px 22px;
			margin: 0 0 10px;
			border-bottom: 1px dotted #000;
		}
/*
access_img */
.access_img{
	float: left;
	width: 300px;
}

.access_img p{
	margin: 0 0 10px;
}


/*
calendar */
#calendar{
	margin: 0 auto 50px;
	width: 700px;
	overflow: hidden;
}

			#calendar iframe{
				width: 680px;
				height: 300px;
				margin: 0 0 10px;
				padding: 8px;
				background: #fff;
				border: 1px solid #9D5F46;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				border-radius: 5px;
			}
/*
gmap */
#gmap dl{
	display: block;
	clear: both;
	width: 700px;
	height: 360px;
	margin: 0;
	padding: 0;
}

	#gmap dt{
		width: 680px;
		height: 300px;
		margin: 0 0 10px;
		padding: 8px;
		border: 1px solid #9D5F46;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
	}

		#gmap dt iframe{
			margin: 0;
			padding: 0;
			width: 680px;
			height: 300px;
			border: 0;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
		}

		#gmap dd{
			margin: 0;
			padding: 0;
		}



/*
photo_box */
#photo_box{
	width: 700px;
	margin: 30px 0 10px;
	padding: 0;
}

	#photo_box ul{
		width: 700px;
		margin: 0;
		padding: 0;
		list-style: none;
		


		/* flex */
		display: flex;/* IE11 */
		display: -webkit-flex;　/* Safari,Google Chrome用 */
		display: -moz-flex;　/* Firefox用 */
		display: -ms-flex;
		
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		
		justify-content: space-between;
		-webkit-justify-content: space-between;
		-moz-justify-content: space-between;
		-ms-justify-content: space-between;
		
	}

		#photo_box ul li{
			display: block;
			width: 50%;
			min-height: 220px;
			
			margin: 0 0 15px;
			list-style: none;
		}
		
		
		#photo_box ul li img{
			width: 100%;
			max-width: 320px;
			height: auto;
		}
		
		

/*--------------------------------------------
INFO
---------------------------------------------*/
@media screen and (max-width: 768px){
/*
photo_box */
#photo_box{
	width: 100%;
	margin: 30px 0 10px;
	padding: 0;
}

	#photo_box ul{
		width: 100%;
	}

		#photo_box ul li{
			display: block;
			width: 48%;
			min-height: 220px;
			
			margin: 0 0 15px;
			list-style: none;
			font-size : calc( 22 * 100vw / 750 );
		}
		
		
		#photo_box ul li img{
			width: 100%;
			max-width: 100%;
			height: auto;
		}
	
}



@media screen and (max-width: 768px){
	#access{
		margin-bottom : calc( 50 * 100vw / 750 );
		width : 100%;
	}
	#access ul{
		width : 100%;
		margin-top : 0;
		box-sizing : border-box;
		padding-left : calc( 20 * 100% / 710 );
		padding-right : calc( 20 * 100% / 710 );
		margin-top : calc( 10 * 100vw / 750 );
	}
	#access ul li{
		font-size : calc( 22 * 100vw / 750 );
	}
	#access ul li.tel{
		margin-top : calc( 10 * 100vw / 750 );
		margin-bottom : calc( 20 * 100vw / 750 );
		font-size : calc( 26 * 100vw / 750 );
	}
	#access ul li.li_icon_a{
		background-position-y : calc( 1 * 100vw / 750 );
		padding-left : calc( 22 * 100vw / 750 );
		padding-right : calc( 10 * 100vw / 750 );
		margin-bottom : calc( 10 * 100vw / 750 );
		background-size : auto calc( 18 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#access{
		margin-bottom : calc( 50 * 100vw / 1250 );
		width : 100%;
	}
	#access ul{
		width : calc( 370 * 100% / 700 );
		margin-top : 0;
	}
	#access ul li{
		font-size : calc( 13 * 100vw / 1250 );
	}
	#access ul li.tel{
		margin-top : calc( 10 * 100vw / 1250 );
		margin-bottom : calc( 20 * 100vw / 1250 );
		font-size : calc( 26 * 100vw / 1250 );
	}
	#access ul li.li_icon_a{
		background-position-y : calc( 1 * 100vw / 1250 );
		padding-left : calc( 22 * 100vw / 1250 );
		padding-right : calc( 10 * 100vw / 1250 );
		margin-bottom : calc( 10 * 100vw / 1250 );
		background-size : auto calc( 18 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	.access_img{
		float : none;
		width : 100%;
		box-sizing : border-box;
		display : flex;
		justify-content : space-between;
		padding-left : calc( 20 * 100% / 710 );
		padding-right : calc( 20 * 100% / 710 );
	}
	.access_img p{
		width : calc( 300 * 100% / 670 );
	}
	.access_img img{
		width : 100%;
		height : auto;
	}
	.access_img p{
		margin-bottom : calc( 10 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.access_img{
		width : calc( 300 * 100% / 700 );
	}
	.access_img img{
		width : 100%;
		height : auto;
	}
	.access_img p{
		margin-bottom : calc( 10 * 100vw / 1250 );
	}
}
@media screen and (max-width:1249px){
	#calendar{
		position : relative;
		width : 100%;
		margin-bottom : calc( 50 * 100vw / 1250 );
	}
	#calendar > iframe{
		box-sizing : border-box;
		width : 100%;
		height : 100%;
		position : absolute;
		top : 0;
		left : 0;
		right : 0;
		bottom : 0;
		margin : auto;
	}
}
@media screen and (max-width: 768px){
	#calendar{
		min-height : 300px;
	}
	#calendar iframe{
		margin-bottom : 0;
		padding : calc( 8 * 100vw / 750 );
		border-radius : calc( 5 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#calendar{
		height : calc( 300 * 100vw / 1250 );
	}
	#calendar iframe{
		margin-bottom : 0;
		padding : calc( 8 * 100vw / 1250 );
		border-radius : calc( 5 * 100vw / 750 );
	}
}
@media screen and (max-width:1249px){
	#gmap dt{
		position : relative;
		width : 100%;
		margin-bottom : calc( 50 * 100vw / 1250 );
	}
	#gmap dt > iframe{
		box-sizing : border-box;
		width : 100%;
		height : 100%;
		position : absolute;
		top : 0;
		left : 0;
		right : 0;
		bottom : 0;
		margin : auto;
	}
}
@media screen and (max-width: 768px){
	#gmap dl{
		height : auto;
		width : 100%;
		height : calc( 360 * 100vw / 750 );
	}
	#gmap dt{
		position : relative;
		width : 100%;
		box-sizing : border-box;
		margin-bottom : calc( 10 * 100vw / 750 );
		padding : 0;
		margin-bottom : calc( 10 * 100vw / 750 );
		height : calc( 300 * 100vw / 750 );
	}
	#gmap dt > iframe{
		margin-bottom : 0;
		border-radius : calc( 5 * 100vw / 750 );
		width : calc( 680 * 100% / 700 );
		height : calc( 280 * 100vw / 750 );
		top : calc( 10 * 100vw / 750 );
		margin-top : 0;
		margin-bottom : 0;
	}
	#gmap a.icon_a{
		padding-bottom : 0;
		margin-bottom : calc( 10 * 100vw / 750 );
		padding-left : calc( 22 * 100vw / 750 );
		background-size : auto calc( 18 * 100vw / 750 );
		background-position-y : center;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#gmap dl{
		height : auto;
		width : 100%;
		height : calc( 360 * 100vw / 1250 );
	}
	#gmap dt{
		position : relative;
		width : 100%;
		box-sizing : border-box;
		margin-bottom : calc( 10 * 100vw / 1250 );
		padding : 0;
		margin-bottom : calc( 10 * 100vw / 1250 );
		height : calc( 300 * 100vw / 1250 );
	}
	#gmap dt > iframe{
		margin-bottom : 0;
		border-radius : calc( 5 * 100vw / 1250 );
		width : calc( 680 * 100% / 700 );
		height : calc( 280 * 100vw / 1250 );
		top : calc( 10 * 100vw / 1250 );
		margin-top : 0;
		margin-bottom : 0;
	}
	#gmap a.icon_a{
		padding-bottom : 0;
		margin-bottom : calc( 10 * 100vw / 1250 );
		padding-left : calc( 22 * 100vw / 1250 );
		background-size : auto calc( 18 * 100vw / 1250 );
		background-position-y : center;
	}
}
@media screen and (max-width:1249px){
	.staff_box{
		overflow : hidden;
		display : flex;
		justify-content : space-between;
	}
	.staff_box img , .staff_box ul{
		float : none;
	}
	.staff_box img{
		width : 100%;
		height : auto;
	}
}
@media screen and (max-width: 768px){
	.staff_box{
		width : 100%;
		margin-bottom : calc( 50 * 100vw / 750 );
		height : auto;
	}
	.staff_box p{
		width : calc( 230 * 100% / 710 );
		height : auto;
		margin-right : calc( 20 * 100vw / 750 );
	}
	.staff_box ul{
		width : calc( 430 * 100% / 710 );
		height : auto;
		margin-right : calc( 20 * 100vw / 750 );
		margin-top : 0;
		display : flex;
		flex-direction : column;
		justify-content : center;
		height : auto;
	}
	.staff_box li{
		font-size : calc( 13 * 100vw / 750 );
	}
	.staff_box .staff_name{
		margin-top : calc( 10 * 100vw / 750 );
		font-size : calc( 25 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.staff_box{
		width : 100%;
		height : auto;
		margin-bottom : calc( 50 * 100vw / 1250 );
	}
	.staff_box p{
		width : calc( 230 * 100% / 700 );
		height : auto;
		margin-right : calc( 20 * 100vw / 1250 );
	}
	.staff_box ul{
		width : calc( 430 * 100% / 700 );
		margin-right : calc( 20 * 100vw / 1250 );
		height : auto;
		margin-top : 0;
	}
	.staff_box li{
		font-size : calc( 13 * 100vw / 1250 );
	}
	.staff_box .staff_name{
		margin-top : calc( 10 * 100vw / 1250 );
		font-size : calc( 25 * 100vw / 1250 );
	}
}
@media screen and (max-width:1249px){
	.banner01 img{
		width : 100%;
		height : auto;
	}
}
@media screen and (max-width: 768px){
	#gallery{
		width : 100%!important;
		margin-top : calc( 10 * 100vw / 750 )!important;
		margin-bottom : calc( 30 * 100vw / 750 )!important;
	}
	#gallery li{
		margin-bottom : calc( 5 * 100% / 710 )!important;
		margin-right : calc( 5 * 100% / 710 )!important;
		width : calc( 95 * 100% / 700 )!important;
		height : calc( 95 * 100vw / 750 )!important;
	}
	#gallery li:nth-child(7n+7){
		margin-right : 0 !important;
	}
	#gallery li , #gallery li a{
		overflow : hidden;
	}
	#gallery li > img , #gallery li a > img{
		width : 100%;
		height : 100%;
		object-fit : cover;
		font-family : "object-fit: cover;";
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#gallery{
		width : 100%!important;
		margin-top : calc( 10 * 100vw / 1250 )!important;
		margin-bottom : calc( 30 * 100vw / 1250 )!important;
	}
	#gallery li{
		margin-bottom : calc( 5 * 100% / 700 )!important;
		margin-right : calc( 5 * 100% / 700 )!important;
		width : calc( 95 * 100% / 700 )!important;
		height : calc( 95 * 100vw / 1250 )!important;
	}
	#gallery li:nth-child(7n+7){
		margin-right : 0 !important;
	}
	#gallery li , #gallery li a{
		overflow : hidden;
	}
	#gallery li > img , #gallery li a > img{
		width : 100%;
		height : 100%;
		object-fit : cover;
		font-family : "object-fit: cover;";
	}
	
	
	
}



/*-------------------------------------*/
/* other setting */

/*
icon_a */
a.icon_a{
	background: url(images/arrow_a.gif) left 1px no-repeat;
	padding: 0 0 10px 22px;
}


a.icon_a {
	color: #1F0C00;
	text-decoration: underline;
}

	a.icon_a:hover{
		text-decoration: none;
	}

ul.icon_a{
	margin: 0;
	padding: 0;
	list-style: none;
}

	ul.icon_a li{
		background: url(images/arrow_a.gif) left 1px no-repeat;
		padding: 0 0 10px 22px;
		margin: 0 0 10px;
		border-bottom: 1px dotted #000;
	}


/*
font_a */
.font_a{
	font-size: 30px;
	font-weight: bold;
	color: #9D5F46;
}

/* line＠ボタン */
.line-btn {
	background-color: #4CB234;
	text-align: center;
	width: 300px;
	height: 50px;
	line-height: 50px;
	margin: 0 0 30px;
}

.line-btn a {
	display: block;
	background: url(../images/btn_arw.png) no-repeat 97% center;
	color: #fff;
	font-size: 1.0rem;
	font-weight: bold;
	text-decoration: none;
}

.line-btn2 {
	border: 1px solid #333;
	text-align: center;
	width: 250px;
	height: 40px;
	line-height: 40px;
	margin: 0;
}

.line-btn2 a {
	display: block;
	font-size: 0.8rem;
	font-weight: bold;
	text-decoration: none;
}

@media screen and (max-width: 768px){
.line-btn {
	width: 80%;
	height: 50px;
}
}



/*-------------------------------------------
COMMON
-------------------------------------------*/

@media screen and (max-width:1249px){
	img{
		height : 100%;
		width : auto;
	}
}
@media print,screen and (min-width: 769px){
	.is-sp{
		display : none;
	}
}
@media screen and (max-width: 768px){
	.is-up{
		display : none;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	*{
		font-size : calc( 13 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	*{
		font-size : calc( 26 * 100vw / 750 );
	}
}

/*-------------------------------------------
CONTAINER
-------------------------------------------*/
@media screen and (max-width: 768px){
	body{
		background : none;
		background-color : #f0ede3;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	body{
		background : none;
		position : relative;
	}
	body:before , body:after{
		content : "";
		display : block;
		position : absolute;
		top : 0;
		z-index : -1;
		height : 100%;
	}
	body:before{
		width : calc( 325 * 100% / 1250 );
		left : 0;
		background-color : #9d5f46;
	}
	body:after{
		width : calc( 925 * 100% / 1250 );
		right : 0;
		background-color : #f0ede3;
	}
}
@media screen and (max-width:1249px){
	.container{
		overflow : hidden;
		background : none;
	}
}
@media screen and (max-width: 768px){
	.container{
		width : 100%;
	}
}
@media screen and (max-width:1249px){
	.container{
		width : 100%;
	}
}
/*-------------------------------------------
header
-------------------------------------------*/
@media screen and (max-width: 768px){
	header{
		position : relative;
		height : calc( 100 * 100vw / 750 );
		background : url("./images/bg_header_sp.png") 0 0 / contain no-repeat;
		border-top : 0;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	header{
		height : calc( 130 * 100vw / 1250 );
		margin : 0 auto;
		border-top-width : calc( 5 * 100vw / 1250 );
		background-size : contain;
	}
}
@media screen and (max-width: 768px){
	#logo{
		width : 100%;
		height : 100%;
	}
	#logo h1{
		width : 100%;
		height : 100%;
	}
	#logo h1 a{
		width : 100%;
		height : 100%;
	}
	#logo h2{
		display : none;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#logo{
		width : calc( 960 * 100% / 1250 );
		height : 100%;
	}
	#logo h1{
		width : 100%;
		height : 100%;
	}
	#logo h1 a{
		width : 100%;
		height : 100%;
	}
}
@media screen and (max-width: 768px){
	section{
		width : 100%;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	section{
		width : calc( 960 * 100% / 1250 );
	}
}
/*-------------------------------------------
MENUBTN
-------------------------------------------*/
@media screen and (max-width: 768px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
	@media screen and (max-width: 768px){
		body.is-open #sidebar{
			max-height : 100vh;
		}
	}
	@media screen and (max-width: 768px){
		body.is-open #drawerPanel{
			position : fixed;
			z-index : -1;
			width : 100%;
		}
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
		transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(2){
		transform : rotate(-45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(3){
		transform : rotate(45deg);
	}
	body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
		transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
	}
	@media screen and (max-width: 768px) and (-ms-high-contrast:none){
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #header #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
	#menuBtn{
		z-index : 11;
		position : absolute;
	}
	#menuBtn > span:nth-of-type(1){
		width : 100%;
		height : 100%;
		position : relative;
		display : block;
	}
	#menuBtn span span{
		display : block;
		position : absolute;
		left : 0;
		transition : all .4s;
		width : 100%;
	}
	#menuBtn span span:nth-of-type(1){
		top : 0;
	}
	#menuBtn span span:nth-of-type(4){
		bottom : 0;
	}
}
#menuBtn{
	z-index : 11;
	position : absolute;
	outline : 0;
	border : 0;
	background : none;
}
#menuBtn > span:nth-of-type(1){
	width : 100%;
	height : 100%;
	position : relative;
	display : block;
}
#menuBtn span span{
	display : block;
	position : absolute;
	left : 0;
	transition : all .4s;
	width : 100%;
}
#menuBtn span span:nth-of-type(1){
	top : 0;
}
#menuBtn span span:nth-of-type(4){
	bottom : 0;
}
@media screen and (max-width: 768px){
	#menuBtn{
		top : 50%;
		transform : translateY(-50%);
		right : calc( 30 * 100% / 750 );
		width : calc( 60 * 100vw / 750 );
		height : calc( 56 * 100vw / 750 );
		padding-bottom : calc( 20 * 100vw / 750 );
		padding-left : 0;
		padding-right : 0;
		padding-top : 0;
		box-sizing : border-box;
	}
	#menuBtn:after{
		position : absolute;
		left : 0;
		bottom : 0;
		content : "MENU";
		font-family : Arial;
		font-size : calc( 28 * 100vw / 750 );
		line-height : 1;
		width : 100%;
		text-align : center;
		display : block;
		width : 200%;
		transform : scale(.5) translateX(-50%) translateY(100%);
		height : calc( 56 * 100vw / 750 );
		color : #fff;
	}
	#menuBtn span span{
		background-color : #fff;
		height : calc( 8 * 100vw / 750 );
	}
	#menuBtn span span:nth-of-type(2) , #menuBtn span span:nth-of-type(3){
		top : calc( 14 * 100vw / 750 );
	}
}
body.is-open #menuBtn:after{
	content : none;
}
/*-------------------------------------------
PANKUZU
-------------------------------------------*/
@media screen and (max-width: 768px){
	#pankuzu{
		margin-bottom : calc( 10 * 1.5 * 100vw / 750 );
	}
	#pankuzu ul{
		font-size : calc( 11 * 1.5 * 100vw / 750 );
	}
	#pankuzu li{
		line-height : 2.18;
	}
	#pankuzu li .this_pages{
		padding-left : calc( 5 * 1.5 * 100vw / 750 );
	}
	#pankuzu li a{
		padding-right : calc( 15 * 1.5 * 100vw / 750 );
		padding-left : calc( 5 * 1.5 * 100vw / 750 );
		background-position-y : center;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#pankuzu{
		margin-bottom : calc( 10 * 100vw / 1250 );
	}
	#pankuzu ul{
		font-size : calc( 11 * 100vw / 1250 );
	}
	#pankuzu li{
		line-height : 2.18;
	}
	#pankuzu li .this_pages{
		padding-left : calc( 5 * 100vw / 1250 );
	}
	#pankuzu li a{
		padding-right : calc( 15 * 100vw / 1250 );
		padding-left : calc( 5 * 100vw / 1250 );
		background-position-y : center;
	}
}
/*-------------------------------------------
SIDEBAR
-------------------------------------------*/
@media screen and (max-width: 768px){
	#sidebar{
		position : fixed;
		left : 0;
		width : 100%;
		z-index : 10;
		transition : max-height .5s ease-in;
		max-height : 0;
		overflow : hidden;
		overflow-y : scroll;
		background-color : rgba(118, 63, 25, .9);
		top : calc( 100 * 100vw / 750 );
		height : calc( 100vh - calc( 100 * 100vw / 750 ) );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#sidebar{
		width : calc( 210 * 100% / 960 );
	}
}
@media screen and (max-width: 768px){
	#side_nav{
		width : 100%;
		margin : 0;
		padding-top : calc( 34 * 100vw / 750 );
	}
	#side_nav ul li a{
		background : none;
		text-indent : 0;
		color : #fff;
		width : 100%;
		height : calc( 70 * 100vw / 750 );
		display : flex;
		align-items : center;
		font-size : calc( 24 * 100vw / 750 );
		padding-left : calc( 30 * 100% / 750 );
		text-decoration : none;
		border-bottom : 1px solid #fff;
	}
	#side_nav ul li a:before{
		content : "";
		display : block;
		flex-shrink : 0;
		background : url("./images/icon_nav.svg") 0 0 / contain no-repeat;
		margin-right : calc( 10 * 100vw / 750 );
		width : calc( 10 * 100vw / 750 );
		height : calc( 14 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#side_nav{
		width : 100%;
		margin-top : calc( 45 * 100vw / 1250 );
	}
	#side_nav ul li a{
		width : 100%;
		height : calc( 85 * 100vw / 1250 );
		background-size : auto calc( 510 * 100vw / 1250 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.side_nav_home:hover{
		background-position : 100% top;
	}
	.side_nav_concept{
		background-position : left calc( -85 * 100vw / 1250 );
	}
	.side_nav_concept:hover{
		background-position : 100% calc( -85 * 100vw / 1250 );
	}
	.side_nav_menu{
		background-position : left calc( -170 * 100vw / 1250 );
	}
	.side_nav_menu:hover{
		background-position : 100% calc( -170 * 100vw / 1250 );
	}
	.side_nav_info{
		background-position : left calc( -255 * 100vw / 1250 );
	}
	.side_nav_info:hover{
		background-position : 100% calc( -255 * 100vw / 1250 );
	}
	.side_nav_style{
		background-position : left calc( -340 * 100vw / 1250 );
	}
	.side_nav_style:hover{
		background-position : 100% calc( -340 * 100vw / 1250 );
	}
	.side_nav_contact{
		background-position : left calc( -425 * 100vw / 1250 );
	}
	.side_nav_contact:hover{
		background-position : 100% calc( -425 * 100vw / 1250 );
	}
	.active{
		background-position-x : 100%;
	}
}
/*-------------------------------------------
CONTENT
-------------------------------------------*/
@media screen and (max-width: 768px){
	#content{
		width : 100%;
	}
	#content > .wrap{
		padding-left : calc( 20 * 100% / 750 );
		padding-right : calc( 20 * 100% / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#content{
		width : calc( 700 * 100% / 960 );
	}
}
@media screen and (max-width:1249px){
	#content h2{
		width : 100%;
		background-size : contain;
	}
}
@media screen and (max-width: 768px){
	#content h2{
		height : calc( 100 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#content h2{
		height : calc( 100 * 100vw / 1250 );
	}
}
@media screen and (max-width:1249px){
	#content h3{
		background-size : 100% auto;
	}
}
@media screen and (max-width: 768px){
	#content h3{
		margin-bottom : calc( 20 * 100vw / 750 );
		padding-bottom : calc( 5 * 100vw / 750 );
		font-size : calc( 30 * 100vw / 750 );
	}
	#content h3 span{
		font-size : calc( 14 * 100vw / 750 );
		margin-left : calc( 15 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#content h3{
		margin-bottom : calc( 20 * 100vw / 1250 );
		padding-bottom : calc( 5 * 100vw / 1250 );
		font-size : calc( 30 * 100vw / 1250 );
	}
	#content h3 span{
		font-size : calc( 14 * 100vw / 1250 );
		margin-left : calc( 15 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	#content h4{
		margin-top : calc( 50 * 100vw / 750 );
		padding-left : calc( 10 * 100vw / 750 );
		border-left-width : calc( 30 * 100vw / 750 );
		font-size : calc( 20 * 100vw / 750 );
		line-height : 1;
		display : flex;
		align-items : center;
		height : calc( 48 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#content h4{
		margin-top : calc( 50 * 100vw / 1250 );
		padding-left : calc( 10 * 100vw / 1250 );
		border-left-width : calc( 30 * 100vw / 1250 );
		font-size : calc( 20 * 100vw / 1250 );
		line-height : 1;
		display : flex;
		align-items : center;
		height : calc( 48 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	#content h5{
		font-size : calc( 28 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#content h5{
		font-size : calc( 14 * 100vw / 1250 );
	}
}
/*--------------------------------------------
FOOTER
---------------------------------------------*/
@media screen and (max-width: 768px){
	footer{
		box-sizing : border-box;
		position : relative;
		background-color : #9d5f46;
		color : #fff;
		width : 100%;
		border-top : 0;
		margin-top : calc( 182 * 100vw / 750 );
		padding-left : calc( 20 * 100% / 750 );
		padding-right : calc( 20 * 100% / 750 );
		padding-top : calc( ( 28 - 2.5 ) * 100vw / 750 );
		padding-bottom : calc( ( 28 - 2.5 ) * 100vw / 750 );
	}
	footer a{
		color : #fff;
	}
}
@media print,screen and (min-width: 769px){
	footer{
		width : 100%;
		padding-top : calc( 10 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	.f_nav{
		float : none;
		width : 100%;
		color : #fff;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.f_nav{
		width : 100%;
		font-size : calc( 11 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	footer address{
		font-size : calc( 21 * 100vw / 750 );
		line-height : 1.24;
		text-align : left;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	footer address{
		font-size : calc( 11 * 1.5 * 100vw / 1250 );
		float : right;
	}
}
@media screen and (max-width: 768px){
	footer ul.outline{
		display : none;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	footer ul.outline{
		margin-bottom : calc( 20 * 100vw / 1250 );
		width : 100%;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	footer ul.outline li{
		padding-bottom : calc( 8 * 100vw / 1250 );
		background-position-y : calc( 5 * 100vw / 1250 );
	}
	footer ul.outline li a{
		font-size : calc( 11 * 1.5 * 100vw / 1250 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	footer ul.outline li.fb_bt{
		margin-top : calc( 10 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	.f_nav p.fb_bt{
		position : absolute;
	}.f_nav p.fb_bt{
		right : calc( 20 * 100% / 750 );
		top : calc( 30 * 100vw / 750 );
		width : auto;
		height : auto;
		margin : 0;
	}
	.f_nav p.fb_bt:before{
		content : "";
		display : block;
		position : absolute;
		top : 0;
		left : 0;
		width : 100%;
		height : 100%;
		background : url("./images/facebook_sp.svg") 0 0 / contain no-repeat;
	}
	.f_nav p.fb_bt img{
		height : calc( 80 * 100vw / 750 );
		opacity : 0;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.f_nav p.fb_bt{
		position : relative;
		top : 50%;
		width : calc( 31 * 100vw / 1250 );
		margin-left : calc( 5 * 100vw / 1250 );
		height : auto;
	}
	.f_nav p.fb_bt img{
		height : calc( 32 * 100vw / 1250 );
		vertical-align : middle;
	}
}
@media screen and (max-width: 768px){
	footer p.copyright{
		font-size : calc( 21 * 100vw / 750 );
		line-height : 1.24;
		text-align : left;
		color : #fff;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	footer p.copyright{
		font-size : calc( 10 * 1.5 * 100vw / 1250 );
		padding-bottom : calc( 64 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	.b2{
		font-size : calc( 26 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.b2{
		font-size : calc( 26 * 100vw / 1250 );
	}
}
/*--------------------------------------------
PAGENAVI
---------------------------------------------*/
@media screen and (max-width:1249px){
	#pagenav{
		width : 100%;
	}
}
@media screen and (max-width: 768px){
	#pagenav{
		height : calc( 11 * 1.5 * 100vw / 750 );
		margin-top : calc( 100 * 100vw / 750);
		margin-bottom : calc( 30 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#pagenav{
		height : calc( 11 * 1.5 * 100vw / 1250 );
		margin-top : calc( 100 * 100vw / 1250 );
		margin-bottom : calc( 30 * 100vw / 1250 );
	}
}
@media screen and (max-width:1249px){
	.p_top a{
		background-size : contain;
	}
}
@media screen and (max-width: 768px){
	.p_top a{
		width : calc( 78 * 1.5 * 100vw / 750 );
		height : calc( 11 * 1.5 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.p_top a{
		width : calc( 78 * 1.5 * 100vw / 1250 );
		height : calc( 11 * 1.5 * 100vw / 1250 );
	}
}
@media screen and (max-width:1249px){
	.p_back a{
		background-size : contain;
	}
}
@media screen and (max-width: 768px){
	.p_back a{
		width : calc( 87 * 1.5 * 100vw / 750 );
		height : calc( 11 * 1.5 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.p_back a{
		width : calc( 87 * 1.5 * 100vw / 1250 );
		height : calc( 11 * 1.5 * 100vw / 1250 );
	}
}
@media screen and (max-width:1249px){
	.t_center img{
		width : 100%;
		height : auto;
	}
}
/*--------------------------------------------
HOME
---------------------------------------------*/
@media screen and (max-width: 768px){
	#index_img{
		margin : 0;
		background : none;
		padding : 0;
		width : 100%;
	}
	#index_img img{
		width : 100%;
		height : auto;
	}
	#index_img .cs-buttons a{
		border : 0!important;
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	#index_img{
		margin-top : calc( 50 * 100vw / 1250 );
		margin-bottom : calc( 80 * 100vw / 1250 );
		padding : calc( 5 * 100vw / 1250 );
		width : calc( 690 * 100% / 700 );
		background-size : 100% auto;
	}
	#index_img img{
		width : 100%;
		height : auto;
	}
}
@media screen and (max-width: 768px){
	#homeNav{
		margin-top : calc( 50 * 100vw / 750 );
		padding-left : calc( 20 * 100% / 750 );
		padding-right : calc( 20 * 100% / 750 );
	}
	#homeNav ul , #homeNav li{
		margin : 0;
		padding : 0;
		list-style-type : none;
	}
	#homeNav li{
		width : 100%;
		height : calc( 80 * 100vw / 750 );
	}
	#homeNav li + li{
		margin-top : calc( 20 * 100vw / 750 );
	}
	#homeNav a{
		width : 100%;
		height : 100%;
		display : flex;
		align-items : center;
		background : url("./images/index/bg_homenav.svg") 0 0 / contain no-repeat;
		text-decoration : none;
		color : #000;
		font-size : calc( 36 * 100vw / 750 );
		padding-left : calc( 100 * 100% / 710 );
	}
}
/*--------------------------------------------
DESOGM
---------------------------------------------*/
@media screen and (min-width: 769px) and (max-width:1249px){
	.mb10{
		margin-bottom : calc( 10 * 100vw / 1250 );
	}
}
@media screen and (max-width: 768px){
	.font_a{
		font-size : calc( 30 * 100vw / 750 );
	}
}
@media screen and (min-width: 769px) and (max-width:1249px){
	.font_a{
		font-size : calc( 30 * 100vw / 1250 );
	}
}