@charset "utf-8";

.marufolk {
	font-family: "Maru Folk Medium";
}
.business-hours {
  font-size: 11px;
	line-height: 1.5;
}
/*********ラージサイズ**********/
@media screen and (min-width: 1200px){

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
  }
body {
	color: #333;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
	line-height: 1.7em;
}
body a {
	color: #333;
	text-decoration: none;
}
body a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
	text-decoration: none;
color: #333;
}
.navigation {
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	width: 100%;
	background-color: #FFFFFF;
	z-index: 2;
}
.flex {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex img{
  align-self: flex-start;
}
.flex_pc {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex_pc img{
  align-self: flex-start;
}
.wapper {
	width: 1200px;
	overflow: hidden;
	margin: 0px auto;
}
.wapper2 {
	width: 1000px;
	overflow: hidden;
	margin: 0px auto;
}
.cont_box {
	width: 100%;
	margin-bottom: 100px;
}
.br_pc {
	display: block;
}
.br_sp {
	display: none;
}
.navbox {
	width: 100%;
}
.navbox1 {
	font-size: 0.85em;
	padding: 10px 0px 0px;
	line-height: 1.5em;
	width: auto;
}
.navbox2   {
	width: 50%;
	max-width: 600px;
}
.navbox2 ul   {
	width: 100%;
	display: flex;
	list-style-type: none;
}
.navbox2 li    {
	background-color: #000;
	text-align: center;
	width: auto;
	flex: 1 1 33%;
	margin: auto 1px;
	display: inline-block;
}
.navbox2 li a {
	color: #FFFFFF;
	padding: 10px;
	display: block;
	text-decoration: none;
}
.nav-tel {
	font-size: x-large;
	font-weight-bold;
	line-height: 1;
	margin-top: 2px;
}
#nav-drawer {
	width: 69%;
	display: block;
	list-style-type: none;
	padding-top: 18px;
}
#nav-content li {
	display: inline-block;
	text-align: center;
	padding: 0px 17px;
	border-right: 1px solid #000000;
	font-size: 0.94em;
	line-height: 1em;
}
#nav-content li a {
	color: #333;
	text-decoration: none;
}	
#nav-content .reset {
	padding-right: 0px;
	border-right-width: 0px;
}
/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}
.mb_20 {
	margin-bottom: -20px;
}

.rogo {
	width: 28%;
	display: block;
}
.rogo img {
	width: 100%;
}
.rogo2 {
	width: 71%;
	display: block;
	margin-bottom: 15px;
}
.main {
	margin-top: 127px;
	position: relative;
	margin-bottom: 80px;
}
.main picture img {
	width: 100%;
}
.maintitel {
	display: block;
	width: 100%;
	color: #FFFFFF;
	text-align: center;
	position: absolute;
	top: 38%;
	left: 0%;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 2.8vw;
	line-height: 1.5em;
}
.titel {
	font-size: 2em;
	display: block;
	text-align: center;
	margin-bottom: 35px;
	font-weight: 500;
}
.img100 {
	width: 100%;
}
.color_red {
	color: #AF2D32;
}

.footer {
	width: 100%;
	padding: 25px 0px;
	background-color: #af2d32;
	display: block;
}
.footer_box {
	width: 40%;
}
.address {
	color: #FFFFFF;
	display: block;
	margin-bottom: 20px;
	line-height: 1.5em;
}
.copyright {
	color: #FFFFFF;
	font-size: 0.8em;
	line-height: 1.1em;
	height: 1.2em;
}
.footer_box2 {
	width: 29.5%;
	padding: 20px;
	background-color: #FFFFFF;
}
.telnum {
	display: block;
	/*
	background-image: url(../../images/icon_tel.png);
	background-size:8% auto;
	background-position: 6% 60%;
	background-repeat: no-repeat;
	text-indent: 20px;
	*/
	/*text-align: center;*/
	font-size: 2em;
	line-height: 1.1em;
	margin-bottom: 12px;
	font-weight: 600;
	letter-spacing: -1px;

}
.mail {
	display: block;
	text-align: center;
	font-size: 1.5em;
	margin-bottom: 20px;
}
.contact {
	margin: 0px auto;
	width: 75%;
	background-color: #000;
	text-align: center;
	font-size: 1.2em;
}
.contact a {
	display: block;
	padding: 15px;
	color: #FFFFFF;
}
.contact a:hover {
	color: #FFFFFF;
}
.ggmap {
position: relative;
padding-bottom: 62%;
padding-top: 30px;
height: 0;
padding-left: 0;
padding-right: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.mail_botan {
	width: 28%;
	margin: 0px auto;
	display: block;
	background-color: #000;
}
.mail_botan a {
	display: block;
	padding: 30px 0px 30px 40px;
	text-align: center;
	color: #FFFFFF;
	font-size: 1.4em;
	line-height: 1.1em;
	background-image: url(../../images/mailicon.png);
	background-repeat: no-repeat;
	background-size: 12% auto;
	background-position: 20% 50%;
}
.mail_botan a:hover {
	color: #FFFFFF;
}

.sp {
	display: none !important;
}
	
	
}




/*********ミディアムサイズ1**********/
@media screen and (min-width:1025px) and (max-width:1199px) {

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
  }
body {
	color: #333;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 16px;
	line-height: 1.7em;
}
body a {
	color: #333;
	text-decoration: none;
}
body a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
	text-decoration: none;
color: #333;
}
.navigation {
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	width: 100%;
	background-color: #FFFFFF;
	z-index: 2;
}
.flex {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex img{
  align-self: flex-start;
}
.flex_pc {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex_pc img{
  align-self: flex-start;
}
#nav-drawer {
	width: 72%;
	display: block;
	list-style-type: none;
	padding-top: 9px;
}
#nav-content li {
	display: inline-block;
	text-align: center;
	padding: 0px 11px;
	border-right: 1px solid #000000;
	font-size: 0.89em;
	line-height: 1em;
}
#nav-content li a {
	color: #333;
	text-decoration: none;
}	
#nav-content .reset {
	padding-right: 0px;
	border-right-width: 0px;
}
/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}
.wapper {
	width: 1000px;
	overflow: hidden;
	margin: 0px auto;
}
.wapper2 {
	width: 1000px;
	overflow: hidden;
	margin: 0px auto;
}
.cont_box {
	width: 100%;
	margin-bottom: 80px;
}
.br_pc {
	display: block;
}
.br_sp {
	display: none;
}
.navbox {
	width: 100%;
}
.navbox1 {
	font-size: 0.85em;
	padding: 10px 0px 0px;
	line-height: 1.5em;
	width: auto;
}
.navbox2   {
	width: 50%;
	max-width: 500px;
}
.navbox2 ul   {
	width: 100%;
	display: flex;
	list-style-type: none;
}
.navbox2 li    {
	background-color: #000;
	text-align: center;
	width: auto;
	flex: 1 1 33%;
	margin: auto 1px;
	display: inline-block;
}
.navbox2 li a {
	color: #FFFFFF;
	padding: 10px;
	display: block;
	text-decoration: none;
}
.nav-tel {
	line-height: 1 !important;
	margin-top: 2px;
}
.mb_20 {
	margin-bottom: -20px;
}

.rogo {
	width: 25%;
	display: block;
}
.rogo img {
	width: 100%;
}
.rogo2 {
	width: 64%;
	display: block;
	margin-bottom: 15px;
}
.main {
	margin-top: 123px;
	position: relative;
	margin-bottom: 65px;
}
.main picture img {
	width: 100%;
}
.maintitel {
	display: block;
	width: 100%;
	color: #FFFFFF;
	text-align: center;
	position: absolute;
	top: 38%;
	left: 0%;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 3vw;
	line-height: 1.5em;
}
.titel {
	font-size: 1.8em;
	display: block;
	text-align: center;
	margin-bottom: 30px;
	font-weight: 500;
}
.img100 {
	width: 100%;
}
.color_red {
	color: #AF2D32;
}

.footer {
	width: 100%;
	padding: 25px 0px;
	background-color: #af2d32;
	display: block;
}
.footer_box {
	width: 40%;
}
.address {
	color: #FFFFFF;
	display: block;
	margin-bottom: 20px;
	font-size: 0.97em;
	line-height: 1.5em;
}
.copyright {
	color: #FFFFFF;
	font-size: 0.8em;
	line-height: 1.1em;
	height: 1.2em;
}
.footer_box2 {
	width: 29.5%;
	padding: 20px 20px 15px;
	background-color: #FFFFFF;
}
.telnum {
	display: block;
	/*
	background-image: url(../../images/icon_tel.png);
	background-size:8% auto;
	background-position: 7% 60%;
	background-repeat: no-repeat;
	text-indent: 20px;
	*/
	text-align: center;
	font-size: 1.7em;
	line-height: 1.1em;
	margin-bottom: 13px;
	font-weight: 600;
	letter-spacing: -1px;
}
.shop_info {
	font-size: 0.93em;
	line-height: 1.5em;
}

.mail {
	display: block;
	text-align: center;
	font-size: 1.3em;
	margin-bottom: 15px;
}
.contact {
	margin: 0px auto;
	width: 84%;
	background-color: #000;
	text-align: center;
	font-size: 1.1em;
}
.contact a {
	display: block;
	padding: 12px;
	color: #FFFFFF;
}
.contact a:hover {
	color: #FFFFFF;
}
.ggmap {
position: relative;
padding-bottom: 62%;
padding-top: 30px;
height: 0;
padding-left: 0;
padding-right: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.mail_botan {
	width: 28%;
	margin: 0px auto;
	display: block;
	background-color: #000;
}
.mail_botan a {
	display: block;
	padding: 30px 0px 30px 40px;
	text-align: center;
	color: #FFFFFF;
	font-size: 1.4em;
	line-height: 1.1em;
	background-image: url(../../images/mailicon.png);
	background-repeat: no-repeat;
	background-size: 12% auto;
	background-position: 20% 50%;
}
.mail_botan a:hover {
	color: #FFFFFF;
}

.sp {
	display: none !important;
}		
}




/*********ミディアムサイズ2**********/
@media screen and (min-width:768px) and (max-width:1024px)  {

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
  }
body {
	color: #333;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 1.72vw;
	line-height: 1.7em;
}
body a {
	color: #333;
	text-decoration: none;
}
body a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
	text-decoration: none;
color: #333;
}
.navigation {
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	width: 100%;
	background-color: #FFFFFF;
	z-index: 2;
}
.flex {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex img{
  align-self: flex-start;
}
.flex_pc {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex_pc img{
  align-self: flex-start;
}
#nav-drawer {
	width: 73%;
	display: block;
	list-style-type: none;
	padding-top: 6px;
}
#nav-content li {
	display: inline-block;
	text-align: center;
	padding: 0px 7px;
	border-right: 1px solid #000000;
	font-size: 0.86em;
	line-height: 1em;
}
#nav-content li a {
	color: #333;
	text-decoration: none;
}	
#nav-content .reset {
	padding-right: 0px;
	border-right-width: 0px;
}
/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}		
.wapper {
	width: 98%;
	overflow: hidden;
	margin: 0px auto;
}
.wapper2 {
	width: 98%;
	overflow: hidden;
	margin: 0px auto;
}
.cont_box {
	width: 100%;
	margin-bottom: 60px;
}
.br_pc {
	display: block;
}
.br_sp {
	display: none;
}
.navbox {
	width: 100%;
}
.navbox1 {
	font-size: 0.82em;
	padding: 10px 0px 0px;
	line-height: 1.5em;
	width: auto;
}
.navbox2 {
	width: 50%;
	max-width: 500px;
}
.navbox2 ul {
	width: 100%;
	display: flex;
	list-style-type: none;
}
.navbox2 li {
	background-color: #000;
	text-align: center;
	width: auto;
	flex: 1 1 33%;
	margin: auto 1px;
	display: inline-block;
}
.navbox2 li a {
	color: #FFFFFF;
	padding: 10px;
	display: block;
	text-decoration: none;
}
.mb_20 {
	margin-bottom: -20px;
}

.rogo {
	width: 25%;
	display: block;
}
.rogo img {
	width: 100%;
}
.rogo2 {
	width: 64%;
	display: block;
	margin-bottom: 15px;
}
.main {
	margin-top: 123px;
	position: relative;
	margin-bottom: 50px;
}
.main picture img {
	width: 100%;
}
.maintitel {
	display: block;
	width: 100%;
	color: #FFFFFF;
	text-align: center;
	position: absolute;
	top: 38%;
	left: 0%;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 3.2vw;
	line-height: 1.5em;
}
.titel {
	font-size: 1.8em;
	display: block;
	text-align: center;
	margin-bottom: 20px;
	font-weight: 500;
}
.img100 {
	width: 100%;
}
.color_red {
	color: #AF2D32;
}

.footer {
	width: 100%;
	padding: 25px 0px;
	background-color: #af2d32;
	display: block;
}
.footer_box {
	width: 40%;
}
.address {
	color: #FFFFFF;
	display: block;
	margin-bottom: 20px;
	font-size: 0.9em;
	line-height: 1.5em;
}
.copyright {
	color: #FFFFFF;
	font-size: 0.7em;
	line-height: 1.1em;
	height: 1.2em;
}
.footer_box2 {
	width: 29.5%;
	padding: 15px 15px 12px;
	background-color: #FFFFFF;
}
.telnum {
	display: block;
	/*
	background-image: url(../../images/icon_tel.png);
	background-size:8% auto;
	background-position: 7% 60%;
	background-repeat: no-repeat;
	text-indent: 20px;
	*/
	text-align: center;
	font-size: 1.75em;
	line-height: 1.1em;
	margin-bottom: 13px;
	font-weight: 600;
	letter-spacing: -1px;
}
.shop_info {
	font-size: 0.85em;
	line-height: 1.7em;
}

.mail {
	display: block;
	text-align: center;
	font-size: 1.2em;
	margin-bottom: 10px;
}
.contact {
	margin: 0px auto;
	width: 95%;
	background-color: #000;
	text-align: center;
	font-size: 1.1em;
}
.contact a {
	display: block;
	padding: 12px;
	color: #FFFFFF;
}
.contact a:hover {
	color: #FFFFFF;
}
.ggmap {
position: relative;
padding-bottom: 62%;
padding-top: 30px;
height: 0;
padding-left: 0;
padding-right: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.mail_botan {
	width: 28%;
	margin: 0px auto;
	display: block;
	background-color: #000;
}
.mail_botan a {
	display: block;
	padding: 30px 0px 30px 40px;
	text-align: center;
	color: #FFFFFF;
	font-size: 1.4em;
	line-height: 1.1em;
	background-image: url(../../images/mailicon.png);
	background-repeat: no-repeat;
	background-size: 12% auto;
	background-position: 20% 50%;
}
.mail_botan a:hover {
	color: #FFFFFF;
}

.sp {
	display: none !important;
}	
	
}





/*********スマホサイズ**********/
@media screen and (max-width:767px){


* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
  }
body {
	color: #333;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 4.2vw;
	line-height: 1.7em;
}
body a {
	color: #333;
	text-decoration: none;
}
body a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
	text-decoration: none;
color: #333;
}
.navigation {
	position: -webkit-fixed;
	position: fixed;
	top: 0;
	width: 100%;
	height: 8%;
	padding-top: 5px;
	background-color: #FFFFFF;
	z-index: 2;
}
.flex {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex img{
  align-self: flex-start;
}
.flex_pc {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex_pc img{
  align-self: flex-start;
}
.flex_sp {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between; /*均等に間隔をあける*/
}
.flex_sp img{
  align-self: flex-start;
}
.wapper {
	width: 94%;
	overflow: hidden;
	margin: 0px auto;
}
.wapper2 {
	width: 94%;
	overflow: hidden;
	margin: 0px auto;
}
.cont_box {
	width: 100%;
	margin-bottom: 50px;
}
.br_pc {
	display: none;
}
.br_sp {
	display: block;

}
.navbox {
	width: 100%;
	height: 47px;
}
.navbox1 {
	font-size: 0.85em;
	padding: 10px 0px 0px;
	line-height: 1.5em;
	width: 50%;
}
.navbox2   {
	width: 40%;
}
.navbox2 ul   {
	width: 100%;
	display: flex;
	list-style-type: none;
}
.navbox2 li    {
	background-color: #000;
	text-align: center;
	width: auto;
	flex: 1 1 33%;
	margin: auto 1px;
	display: inline-block;
}
.navbox2 li a {
	color: #FFFFFF;
	padding: 10px;
	display: block;
	text-decoration: none;
}
.mb_20 {
	margin-bottom: -20px;
}

.rogo {
	width: 63%;
	display: block;
	margin-top: 5px;

}
.rogo img {
	width: 100%;
}
.rogo2 {
	width: 76%;
	display: block;
	margin: 0px auto 15px;
}
.main {
	margin-top: 16%;
	position: relative;
	margin-bottom: 30px;
}
.main picture img {
	width: 100%;
}
.maintitel {
	display: block;
	width: 100%;
	color: #FFFFFF;
	text-align: center;
	position: absolute;
	top: 35%;
	left: 0%;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 1.7em;
	line-height: 1.1em;
}
.titel {
	font-size: 1.4em;
	line-height: 1.5em;
	display: block;
	text-align: center;
	margin-bottom: 13px;
	font-weight: 500;
}
.img100 {
	width: 100%;
}
.color_red {
	color: #AF2D32;
}

.footer {
	width: 100%;
	padding: 17px 0px;
	background-color: #af2d32;
	display: block;
}
.footer_box {
	width: 100%;
	margin: 25px 0px 0px;
	order: 2;
}
.address {
	color: #FFFFFF;
	display: block;
	text-align: center;
	margin-bottom: 25px;
	font-size: 1.1em;
	line-height: 1.5em;
}
.copyright {
	color: #FFFFFF;
	text-align: center;
	font-size: 0.75em;
	line-height: 1.1em;
	height: 1.2em;
}
.footer_box2 {
	width: 100%;
	order: 1;
	padding: 20px;
	background-color: #FFFFFF;
	text-align: center;
	margin-bottom: 5px;
}
.telnum {
	display: block;
	/*
	background-image: url(../../images/icon_tel.png);
	background-size:8% auto;
	background-position: 6% 60%;
	background-repeat: no-repeat;
	text-indent: 20px;
	*/
	text-align: center;
	font-size: 2.3em;
	line-height: 1.1em;
	margin-bottom: 12px;
	font-weight: 600;
	letter-spacing: -1px;

}
.mail {
	display: block;
	text-align: center;
	font-size: 1.5em;
	margin-bottom: 20px;
}
.contact {
	margin: 0px auto;
	width: 100%;
	background-color: #000;
	text-align: center;
	font-size: 1.2em;
}
.contact a {
	display: block;
	padding: 20px;
	color: #FFFFFF;
}
.contact a:hover {
	color: #FFFFFF;
}
.ggmap {
position: relative;
padding-bottom: 60%;
padding-top: 30px;
height: 0;
overflow: hidden;
margin-top: 30px;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.mail_botan {
	width: 100%;
	margin: 0px auto;
	display: block;
	background-color: #000;
}
.mail_botan a {
	display: block;
	padding: 20px 0px 20px 40px;
	text-align: center;
	color: #FFFFFF;
	font-size: 1.4em;
	line-height: 1.1em;
	background-image: url(../../images/mailicon.png);
	background-repeat: no-repeat;
	background-size: 11% auto;
	background-position: 23% 50%;
}
.mail_botan a:hover {
	color: #FFFFFF;
}
.footer_box4 {
	color: #FFFFFF;
	display: block;
	text-align: center;
	font-size: 1.2em;
	width: 100%;
	margin-bottom: 20px;
}

	
	
/*バーガーメニュー*/	
#nav-drawer {
position: relative;
top: 0px;
}

/*チェックボックス等は非表示に*/
.nav-unshown {
  display:none;
}

/*アイコンのスペース*/
#nav-open {
  display: inline-block;
  width: 30px;
  height: 22px;
  vertical-align: middle;
  padding-top: 15%;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span, #nav-open span:before, #nav-open span:after {
  position: absolute;
  height: 0.7vw;/*線の太さ*/
  width: 30px;/*長さ*/
  border-radius: 3px;
  background: #444;
  display: block;
  content: '';
  cursor: pointer;
}
#nav-open span:before {
  bottom: -8px;
}
#nav-open span:after {
  bottom: -16px;
}
.menu2 {
	font-size: 0.6em;
	font-weight: 500;
	text-align: center;
	display: block;
	padding-top: 13px;
}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  right: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 9999;/*最前面に*/
	width: 70%;/*右側に隙間を作る（閉じるカバーを表示）*/
	max-width: 330px;/*縦幅（調整してください）*/
	background: #fff;/*背景色*/
	opacity: 1;
	transition: .3s ease-in-out;/*滑らかに表示*/
	-webkit-transform: translateX(105%);
	transform: translateX(105%);/*左に隠しておく*/
	list-style: none;
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close {
  display: block;/*カバーを表示*/
  opacity: .5;
}

#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（スライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}
/*ここからメニュー文字、枠余白の調整（スタイル名は都度変更）*/

#nav-content li {
	display: block;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #666;
}	
#nav-content li a {
	font-size: 1em;
	display: block;
	padding: 12px 7%;
}
#nav-content li a:hover {
	color: #FFF;
	background-color: skyblue;
}
.burgertitel {
	font-size: 1em;
	display: block;
	padding: 5px 7%;
	color: #fff;
	background-color: #333333;
}

/*バーガーメニュー*/	
	
.reset {
	border-bottom-width: 0px;
	border-bottom-style: none !important;
}
.margin_reset {
	margin-bottom: 0px;
}
.telnum_sp a {
	color: #FFFFFF;
}
.telnum_sp a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
  -ms-filter: "alpha(opacity=50)";
	text-decoration: none;
color: #fff;
}
.pc {
	display: none !important;
}

}