/* CSS Document */
@charset “UTF-8”;

/*************************************************Googleマテリアルアイコン設定*および初期化**********************/
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 32px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
  
  display: inline-flex;
  vertical-align: bottom;
}
dl
,dt
,dd
,li
,ul
{
    margin: 0; padding: 0;
}

/*************************************************テキストカラー・リンクテキストカラー************************/

body{
	color:#333333;/*通常のテキストカラー*/
        background-color : #c9ce8a;
        }
body.whiteBG{
	margin:20px auto;
	text-align:center;
        background-color : white;
        }
body.whiteBG p.button{
	display:block;
	width:300px;
	padding:10px;
	margin:0 auto;
	text-align:center;
        background-color : #999;
	color:white;
        }
a{
	color:#3399ff;/*通常のリンクテキストカラー*/
	text-decoration:underline;/*マウスが乗った時下線を表示（つけない場合は underline を none へ）*/
	}
a:hover{
	color:#336699;/*マウスが乗った時の通常のリンクテキストカラー*/
	text-decoration:underline;/*マウスが乗った時下線を表示（つけない場合は underline を none へ）*/	
	}

#menu a,#copy a,body.whiteBG a{
	color:white;/*通常のリンクテキストカラー*/
	text-decoration:none;/*マウスが乗った時下線を表示（つけない場合は underline を none へ）*/
}
#menu a:hover,#copy a:hover,body.whiteBG a:hover{
	color:#ccc;/*マウスが乗った時の通常のリンクテキストカラー*/
	text-decoration:underline;/*マウスが乗った時下線を表示（つけない場合は underline を none へ）*/	
	}
#copy {
	color:#ccc;
	}
/*************************************************フォントサイズと書体******************************************/
body {
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
	font-size:10px;
	}
#container{font-size:1.4em; line-height:1.8em;}
img{ border:0;}
#menu{
	font-family: arial, sans-serif;
	font-weight:bold;
	font-size:16px;}
h2{
	margin-bottom:10px;
	padding-bottom:5px;
	border-bottom: dotted 3px #ccc;
}
h3{
	font-size:1.1em;
	line-height: 1.2em;
	padding-left: 12px;
	border-left: solid 8px #ccc;}


/*************************************************リストを表へ*************************************************/
.address dt{float:left; width:4.5em;}
.order dt{float:left; width:180px;}
ul.bmenu li{float:left; width:150px;padding:10px;list-style: none;font-size:0.9em;}
/*************************************************　TOP構造　***********************************************/
body{margin:0; padding:0;}
#container{
	width:750px;
	margin:0 auto;
	 background-color : #fff;
	}
#logo{text-align:right;}
#banner{
	width:750px;
	background-color : #ccc;
	}
#banner img{
	vertical-align:top;
	margin:0;
	padding:0;
	}
#menu{
	padding:5px;
	background-color : #666;
	margin-bottom:20px;
	margin-top:0;
		}
#menu li{
	display: inline-block;
	padding: 0 16px;
 	vertical-align: bottom;
	}

#left{
	margin-left:50px;
	margin-right:80px;
	width:350px;
	float:left;
	}
.intro{margin-bottom:30px;}
.intro img{margin:10px 0;}
.intro hr{border-top: dotted 3px #ccc;}

.order dd{
	margin-left:200px;
	border-bottom: dotted 1px #ccc;
	padding: 5px 0;
}
.block1{
	width:310px;
	height:100px;
	font-size:16px;
	font-weight:bold;
	background:url(../img/block-menu.jpg) no-repeat;
	padding:10px 20px;
	display:block;
	margin:0 0 10px 0;
}
.block1:hover{
	background:url(../img/block-menuOn.jpg) no-repeat;
	}
.block1 a{
	display:block;
	width:310px;
	height:100px;}
.block2{
	width:310px;
	height:100px;
	font-size:16px;
	font-weight:bold;
	background:url(../img/block-mail.jpg) no-repeat;
	padding:10px 20px;
	display:block;
	margin-bottom:10px;
}
.block2:hover{
	background:url(../img/block-mailOn.jpg) no-repeat;
	}
.block2 a{
	display:block;
	width:310px;
	height:100px;}
.block3{
	width:310px;
	height:100px;
	font-size:16px;
	font-weight:bold;
	background:url(../img/block-about.jpg) no-repeat;
	padding:10px 20px;
	display:block;
	margin-bottom:10px;
}
.block3:hover{
	background:url(../img/block-aboutOn.jpg) no-repeat;
	}
.block3 a{
	display:block;
	width:310px;
	height:100px;}

.print{margin: 20px 0 0;}

#right{
	width:250px;	
	float:left;}

#copy{
  float:clear;
	width:750px;
	text-align:center;
	display: block;
	clear: both;
	background-color : #666;
	padding:5px 0;
}
/*************************************************　他ページ構造　***********************************************/
#onepage{margin:10px 30px;}
.order dd{
	margin-left:200px;
	border-bottom: dotted 1px #ccc;
	padding: 5px 0;
}
.order dt{
	font-weight:bold;
	text-align:right;
	background-color:#ccffff;
	padding:5px;
	background-image:
	 repeating-linear-gradient(-45deg,#fff, #fff 3px,transparent 0, transparent 6px);
}
.googlemap{
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.googlemap iframe{
position: absolute;
left: 0;
top: 0;
height: 100%
}
ul.bmenu{
	text-align:center;}
	
/*************************************************スマホ対応*************************************************/	

/* Mobile */
@media screen and (min-width: 321px)and (max-width: 767px){
#container{
	width:400px;
	margin:0 auto;
	}
#banner{
	width:400px;
	}
#banner img{
	width:400px;
	}
#left{
	width:400px;
	margin:0 20px;
	float:none;
}
	.intro{width:350px;}
#right{
	width:400px;
	margin:0 30px;
	float:none;
}
#copy{
  float:none;
	width:400px;
}
.order dt{float:left; width:120px;}
.order dd{
	margin-left:120px;
	border-bottom: dotted 1px #ccc;
	padding: 5px 0;
}
#menu li{
	display: inline-block;
	padding: 0 8px;
 	vertical-align: bottom;
	}
}