@charset "UTF-8";
/* Body */
body {
	background-color: #f2f2f2;
	margin: 0px;
}


.bold {font-weight: 600;}

.txtRed{color: #FF0004;}

.txt15{font-size: 15px}
.txt16{font-size: 16px}
.txt17{font-size: 17px}
.txt18{font-size: 18px}
.txt19{font-size: 19px}
.txt20{font-size: 20px}


/* Container */
.container {
	max-width: 1056px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
}

.container h1 { font-weight: 100;
background-color: #f2f2f2;
}

.container h2 { font-size: 2rem;
text-align: center;
margin-bottom: 0.5rem;
}



header {
	max-width: 1056px;
	background-color: #ee827c;
}
.logo {text-align: center;
padding: 1.5rem 0 0;
margin-bottom: -10px
}

.logo img {width: 40%;
margin-left: -35px;
}




/* ハンバーガー・メニュー */
.hamburger-menu-box{
 width: 35px;
 height: 35px;
 display: block;
 float: left;
 margin: 5px 0 0 10px;
}
.hamburger-menu div {
  width: 35px;
  height: 5px;
  background-color: white;
  margin: 6px 0;
}
.hamburger-menu + .sidenavs:target {
  overflow-x: visible; /* ボックスからはみ出る箇所をそのまま表示 */
  width: 100%;
  display:block;
}
.sidenavs:target {
  overflow-x: hidden; /* ボックスからはみ出る箇所を隠す */
  width: 0;
}

/* ハンバーガーメニュー表示時 */
.sidenavs {
  height: 100%;
  width: 0;
  position: fixed; /* 画像の配置を指定 */
  z-index: 1;
  top: 0;
  left: 0;
  background:rgba(0,0,0,0.6);
  overflow-x: hidden; /* 横スクロールを無効にする */
  padding-top: 100px;
  transition: 0.5s; /* アニメーションの時間を0.5秒に指定 */
}
/* ハンバーガーメニュー表示時のリンク */
.sidenavs a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 1.5rem;
  color: #fff;
  display: block;
  transition: 0.3s; /* アニメーションの時間を0.3秒に指定 */
  font-weight:100;
}

.sidenavs a.undeline{border-bottom: 1px dashed #eee;
font-size: 1.25rem;}

/* マウスオーバー後のリンク */
.sidenavs a:hover {
  color: #ee827c;
}


/* クローズボタン */
.sidenavs .close-btn {
  position: absolute; /* 親要素との絶対位置を指定 */
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}


/* 「トップに戻る」ボタン  */
.backtotop {
position: fixed;
right: 10px;
bottom: 50px;
z-index: 1000;
display: none;
}    

.backtotop a {
display: block;
color: #fff;
background-color: #ee827c;
border-radius: 50%;
height: 55px;
width: 55px;
text-decoration: none;
font-size: 12px;
padding-top: 13px;
line-height: 140%;
text-align: center;
}




/* Hero イメージ */
.hero{margin-bottom: 1.5rem;}

.hero img{width: 100%;
height: auto;}



/* アクセス */
.access {margin-bottom: -8px;}
.access_map iframe{width: 100%; margin-bottom: 0px;}



/* お問い合わせ */
.contact{
	background-color: #FFF0EF;
	xbox-sizing: content-box;
	padding: 2rem;
	margin-bottom: 1.5rem;
}


/* お問い合わせ */
.tbl01 {
font-size: 1.125rem;
border-collapse: collapse;
text-align: left;
line-height: 1.5;
border: 1px solid #ccc;
margin-bottom: 2rem;
width: 100%;
}


.tbl01 th {
	width: 40%;
	text-align: center;
	padding: 1rem 0.5rem;
	font-weight: bold;
	vertical-align: middle;
	border-right: 1px solid #ccc;
	border-bottom: 1px dotted #999;
	background-color: #FFD0CD;
}

.tbl01 td {
width: 60%;
padding: 1rem;
vertical-align: middle;
border-right: 1px solid #ccc;
border-bottom: 1px dotted #999;
background-color: #FFFFFF;
}

textarea{font-size:  1.125rem;
width: 100% !important; 
min-width: 300px !important; 
height: 8rem !important; }

input[type="text"]{
font-size:  1.125rem;
width: 45%;
min-width: 300px;
height: 2rem;
}

input[name="tel_1"],input[name="tel_2"],input[name="tel_3"]{
font-size:  1.125rem;
width: 21%;
xmin-width: 100px;
height: 2rem;
}

 /* 送信ボタンをゆっくり透過 */
form input[type="image"]:hover{
opacity: 0.7;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-webkit-transition: 0.3s ease-in-out; /* 以下、hover時ゆっくり透過 */
-moz-transition: 0.3s ease-in-out;
-o-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
text-decoration: none;
}


/*フッター*/
#footer h2{
}

.footer {padding: 1rem 1rem;
	margin-bottom: 1.5rem;
}
.linkBtn{display: flex;
justify-content: space-between;
margin-bottom: 3rem;
text-align: center;
}

.linkBtn a img {max-width: 95%; height: auto; margin-bottom: 1rem; }

.footerLogo {max-width: 100%; height: auto; margin-bottom: 1rem;}

.txt_footer{font-size: 1rem;}

.hi_light{background-color: #fff3c2;
display: inline-block; 
padding: 0.2rem 1rem; 
border-radius: 1rem;}


/* スマホサイトのみ電話発信 */
@media screen and (min-width: 751px){
  .telLink {
    pointer-events: none;
  }
}
}







/* Small Desktops */
@media (min-width: 768px) and (max-width: 1096px) {
.logo img {width: 40%;}

}


/* Small Tablets */
@media (min-width: 321px)and (max-width: 767px) {
.logo img {width: 50%;}

.hero, .access, .contact {margin-bottom: 0.5rem;}

.access {margin-bottom: -8px;}
.access_map iframe{width: 100%; height: 500px;}

.container h2 { font-size: 1.5rem; margin-bottom: 0.2rem}

/* お問い合わせ */
.contact{
	padding: 2rem 1rem;
	margin-bottom: 1.5rem;
}

.tbl01{width: 100%;} /* サイズ微調整 */

.tbl01 th{width: 100%;display:block;border-right: none;padding: 0.15rem;}

.tbl01 td{width: 100%;display:block;border-right: none;text-align: center;}
.tbl01 tr:last-child td{border-bottom: none;} /* 最後の行のボーダーを表示しない */

textarea{font-size:  1.125rem;
width: 100% !important; 
min-width: 200px !important; 
height: 10rem !important; }

input[type="text"]{
font-size:  1.125rem;
width: 100% !important; 
min-width: 200px !important; 
height: 3rem;
}

form input[type="image"]{width: 80%;}

.linkBtn{display: block;
margin-bottom: 3rem;
text-align: center}

.linkBtn a img{width: 100%; height: auto; margin-bottom: 1rem;}

}






/* Mobile */
@media (max-width: 320px) {
.logo {padding: 0.5rem 0 0.75rem;
}
.logo img {width: 60%;}



/* ハンバーガーメニュー表示時 */
.sidenavs {
  padding-top: 4rem;
}

.hero, .access, .contact {margin-bottom: 0.5rem;}

.access {margin-bottom: -8px;}
.access_map iframe{width: 100%; height: 400px;}

.container h2 { font-size: 0.9375rem; margin: 0 0 0.2rem}


/* お問い合わせ */
.contact{
	padding: 1rem 0.5rem;
	margin-bottom: 1.5rem;
}

.tbl01{width: 100%;} /* サイズ微調整 */

.tbl01 th{width: 100%;display:block;border-right: none;padding: 0.15rem;}

.tbl01 td{width: 100%;display:block;border-right: none;text-align: center;}
.tbl01 tr:last-child td{border-bottom: none;} /* 最後の行のボーダーを表示しない */

textarea{font-size:  1.125rem;
width: 100% !important; 
min-width: 200px !important; 
height: 10rem !important; }

input[type="text"]{
font-size:  1.125rem;
width: 100% !important; 
min-width: 200px !important; 
height: 3rem;
}

form input[type="image"]{width: 80%;}

.linkBtn{display: block;
margin-bottom: 3rem;
text-align: center}

.linkBtn a img{width: 100%; height: auto; margin-bottom: 1rem;}


.txt_footer{font-size: 0.8125rem;}

}
