@charset "utf-8";
/* CSS Document */


/*header*/
#header {
	width: 100%;
	margin: 0;
	padding: 0;
	background: rgba(255,255,255,0);/*背景色+透明度*/
}

.headerbar {
	width: 100%;
	background: rgba(0,0,0,0.1);/*背景色+透明度*/
	position: absolute;
	z-index: 1;
}

.headertitle {
	display: flex;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	background: rgba(255,255,255,0);/*背景色+透明度*/
}

.h1-logo {
	width: 400px;
	margin: 0 0 1.0rem 0;
}

.logo {
	width: 100%;
	margin: 1.0rem 0 0 0;
}

.tel-s {
	max-width: 50px;
	height: 50px;
	margin: 1.0rem 0 0 5.0rem;
}



.navtitle {
	display: block;
	width: 70%;
	max-width: 700px;
	margin: 2.75rem 0 0 auto;
}

/*nav*/
.nav {
	display: flex;
	width: 100%;
	max-width: 600px;
	height: 40px;
	margin: 0 0 0 auto;
	padding: 0;
}

ul.menu {
  padding: 0 ;
  margin: 0;
}

ul.menu li {
  float: left; /*メインメニューは横並びに*/
  width: calc(700px/6); /*各メニュー幅*/
  height: 45px; /*サブメニュー高さ*/
  background: rgba(255,255,255,0); /*背景色+透明度*/
  position: relative; /*子要素の基準とするために指定*/
  list-style-type: none;
  box-sizing: border-box;
}

ul.menu li a {
  display: block;
  line-height: 40px;
  font-family: Noto Serif JP; /*文字フォント*/
  font-size: 1.1rem; /*文字サイズ*/
  font-weight: normal; /*文字太さ*/
  color: #ffffff; /*文字色*/
  text-align: center; /*文字位置*/
  text-decoration: none; /*文字装飾*/
}

ul.menu li a:hover {
  background-color: #d296ff; /*マウスオーバー背景色*/
}

ul.menu li ul.sub {
  display: none;
  position: absolute; /*サブメニューを開いた際に、背後の要素の影響を受けないようにする*/
  padding: 0;
  margin: 0;
}
 
ul.menu li:hover ul.sub {
  display: block; 
}
 
ul.menu li ul.sub li:first-child{
  border-top: 0px solid #ffffff; /*最初の要素のみボーダートップを指定*/
}

ul.menu li ul.sub li {
  border: 0px solid #ffffff; /*ボーダーの指定*/
  border-top: none; /*ボーダートップは重なって太くなるので解除*/
}

ul.menu:after { /*Clearfix*/
  height: 0;
  visibility: hidden;
  content: ".";
  display: block;
  clear: both;
}

.nav2 {
	display: flex;
	justify-content: flex-end;
	width: 100%;
	max-width: 700px;
	height: 40px;
	margin: -20px 0 0 auto;
	padding: 0;
}

.tel {
	display: block;
	width: 264px;
	height: 40px;
	margin: -0.25rem 1.0rem 0 0;
	padding: 0;
}

.mail {
	display: block;
	width: 250px;
	height: 40px;
	margin: -0.25rem 1.0rem 0 0;
	padding: 0;
}

.tel2-mail2 {
	width: 95%;
	margin: 0 auto;
	padding: 0;
}

.tel2 {
	display: block;
	width: 100%;
	max-width: 250px;
	margin: 1.5rem auto 0 auto;
	}
	
.mail2 {
	display: block;
	width: 100%;
	max-width: 250px;
	margin: 1.5rem auto 0 auto;
	}

.topphoto {
	width: 100%;
	margin: 0;
}



@media screen and (min-width: 701px) {

	#top-head {
		display: none;
	}

	.topphoto2 {
		display: none;
	}

	.tel2-mail2 {
		display: none;
	}

}


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



}


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

	.nav {
		display: none;
		}

	#slide {
		display: none;
		}

	.headerbar {
		background: rgba(0,0,0,0);/*背景色+透明度*/
		}

	.topphoto {
		display: none;
	}

	.topphoto2 {
		width:100%;;
	}

	.tel,.mail {
		display: none;
		}

}