@charset 'utf-8';
/*	Cascading Style Sheets: style.css 5.2	*/


.sidr ul li a.sidr-class-H_REQUEST { background-color: #B1D885;}

#PAGE p	{ width:900px; float:left; margin:0px 0px 0px 30px; text-align:center;}
#PAGE div.CONTACT	{ width:900px; float:left; margin:40px 0px 30px 30px; text-align:left; }
#PAGE div.CONTACT dl.FM	{ width:900px; height:auto; float:left; clear:both; margin:0px; padding:0px 0px 0px 0px; border-bottom:1px dotted #ccc; background:#eee; }
#PAGE div.CONTACT dl.FM dt	{ width:160px; float:left; border:none; margin:0px; padding:5px 0px; line-height:1.2em; }
#PAGE div.CONTACT dl.FM dt em	{ width:auto; float:right; padding:3px 7px; background:#f39800; color:#fff; font-style:normal; font-size:10px; line-height:1.2em; }
#PAGE div.CONTACT dl.FM dt img	{ margin:3px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dt strong	{ float:left; border:none; margin:0px 0px 0px 10px; color:#000; font-size:12px; font-weight:normal; }
#PAGE div.CONTACT dl.FM dd	{ width:690px; float:right; border:none; margin:0px; padding:5px 0px; background:#fff; font-size:12px; }
#PAGE div.CONTACT dl.FM dd input	{ width:100px; float:left; display:inline; margin:0px 0px 0px 5px; padding:0px; background:#fff; font-size:12px; }
#PAGE div.CONTACT dl.FM dd input.RADIO	{ width:auto; margin:0px 5px 0px 10px; }
#PAGE div.CONTACT dl.FM dd input.CHECK	{ width:auto; margin:0px 5px 0px 0px; }
#PAGE div.CONTACT dl.FM dd input.PD	{ width:250px; margin:0px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dd select	{ float:left; display:inline; margin:0px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dd textarea	{ width:500px; height:100px; float:left; display:inline; margin:0px 0px 0px 10px; padding:0px; background:#fff; font-size:12px; }
#PAGE div.CONTACT dl.FM dd span	{ float:left; display:inline; margin:0px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dd span.BAITAI	{ width:140px; margin-bottom:3px; line-height:1.2em; }
#PAGE div.CONTACT dl.FM dd span.NOTE	{ width:auto; float:left; display:inline; clear:none; color:#f39800; margin:5px 0px 0px 10px; line-height:1.2em; }

#PAGE div.CONTACT form h1	{ width:auto; float:left; margin:40px 0px 0px 0px; color:#666; font-weight:bold; font-size:13px; letter-spacing:0em; }
#PAGE div.CONTACT form a.PRIVACY_NOTE	{ width:auto; float:left; margin:30px 0px 0px 0px; color:#0af; }
#PAGE div.CONTACT p.FORM_ALART a:hover	{ text-decoration:underline; }
#PAGE div.CONTACT p.FORM_ALART a:active	{ text-decoration:underline; }

#PAGE div.CONTACT p.FORM_EX	{ width:900px; float:left; display:both; margin:0px 0px 0px 0px; }
#PAGE div.CONTACT div.FORM_CONFIRM	{ width:858px; float:left; display:both; margin:10px 0px 0px 0px; padding:20px; background:#fff; border:1px solid #ccc; }
#PAGE div.CONTACT div.FORM_CONFIRM strong	{ font-weight:bold; font-size:14px; }
#PAGE div.CONTACT div.FORM_CONFIRM hr	{ margin:10px 0px; background:none; border-bottom:1px dotted #ccc; }
#PAGE div.CONTACT div.FORM_CONFIRM em	{ font-style:normal; font-weight:bold; color:#f39800; }
#PAGE div.CONTACT p.FORM_ALART	{ width:860px; float:left; display:both; margin:10px 0px 0px 0px; }
#PAGE div.CONTACT p.FORM_ALART a	{ color:#0af; }
#PAGE div.CONTACT p.FORM_ALART a:hover	{ text-decoration:underline; }
#PAGE div.CONTACT p.FORM_ALART a:active	{ text-decoration:underline; }

#PAGE div.CONTACT_SEND	{ width:820px; float:left; padding-bottom:30px; }
#PAGE div.CONTACT_SEND h1	{ width:820px; float:left; display:inline; margin:50px 0px 0px 0px; }
#PAGE div.CONTACT_SEND p	{ width:820px; float:left; display:inline; margin:20px 0px 0px 0px; }
#PAGE div.CONTACT_SEND div.FORM_CONFIRM	{ margin:20px 0px 0px 85px; }

#PAGE div.CONTACT form input.SENDBUTTON	{ width:440px; height:44px; float:left; display:inline; clear:both; margin:30px 0px 0px 230px; padding:0px; background:#f39800; cursor:pointer; color:#fff; font-size:16px; line-height:40px; letter-spacing:0.2em; border:none; }
#PAGE div.CONTACT form input.SENDBUTTON:hover	{ filter:alpha(opacity=85); -moz-opacity:0.85; -khtml-opacity:0.85; opacity:0.85; }
#PAGE div.CONTACT form input.SENDBUTTON:active	{ filter:alpha(opacity=85); -moz-opacity:0.85; -khtml-opacity:0.85; opacity:0.85; }
p.SP { display:none; }

#PAGE div.CONTACT form input.SENDBUTTON_SP	{ display:none; }

div#PAGE .PRIVACY_NOTE { float:left; border:0px solid #666666; clear:both; font-size:10px; height:200px; background:none; line-height:1.8em; margin:5px auto; overflow-x:hidden; overflow-y:scroll; padding:20px; text-align:left; }
div#PAGE .P_MARK { background:rgba(0, 0, 0, 0) url("../../img/pmark.png") no-repeat scroll 0 0; float:right; margin:0px 0 0 750px; width:200px; }
div#PAGE .P_MARK p { font-size:10px; line-height:1.5em; margin:10px 0 10px 70px; text-align:left; width:130px; }


/*ボタン*/
.BUTTONS{display: flex;justify-content: center;margin-bottom: 70px;}
.btn{position: relative;overflow: hidden;text-decoration: none;display: inline-block;border: 2px solid #555;text-align: centeroutline: nonetransition: ease .2s;width: 275px;text-align: center;margin: 10px;padding: 10px 0;box-shadow: 2px 2px 4px #ccc;}
.btn span {position: relative;z-index: 3;color:#333;font-size: 19px;letter-spacing: 2px;}
.btn:hover span{color:#fff;}
.bgskew::before {content: '';position: absolute;top: 0;left: -130%;background:#333;width:120%;height: 100%;transform: skewX(-25deg);}
.bgskew:hover::before {animation: skewanime .5s forwards;}
@keyframes skewanime {100% {left:-10%;}}
.BUTTONS small{font-size: 13px;}


/*フォーム*/
.contents{width: 1000px;margin: 0 auto;margin-bottom: 100px;}

/*PC・SP*/
.pc{display: block;}
.sp{display: none;}
#footer {padding: 40px 0 40px 0;text-align: center;font-size: 1.3rem;background: #f3f3f1;}



@media screen and (max-width: 640px){
#PAGE p	{ width:100%; float:left; margin:10px 0px 0px 0; line-height: 22px;text-align: justify;}
#PAGE p br	{ display:none; }
#PAGE div.CONTACT	{ width:100%; float:left; margin:20px 0px 30px 0; text-align:left; }
#PAGE div.CONTACT dl.FM	{ width:100%; height:auto; float:left; clear:both; margin:0px; padding:0px 0px 0px 0px; border-bottom:1px dotted #ccc; background:#eee; }
#PAGE div.CONTACT dl.FM dt	{ width:100%; float:left; border:none; margin:0px; padding:5px 0px; line-height:1.2em; }
#PAGE div.CONTACT dl.FM dt em	{ width:auto; float:right; margin:0px 20px 0px 0px; padding:3px 7px; background:#f39800; color:#fff; font-style:normal; font-size:10px; line-height:1.2em; }
#PAGE div.CONTACT dl.FM dt img	{ margin:3px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dt strong	{ float:left; border:none; margin:0px 0px 0px 10px; color:#000; font-size:12px; font-weight:normal; }
#PAGE div.CONTACT dl.FM dd	{ width:100%; float:right; border:none; margin:0px; padding:5px 0px 15px 0px; background:#fff; font-size:12px; }
#PAGE div.CONTACT dl.FM dd input	{ width:100px; float:left; display:inline; margin:0px 0px 5px 5px; padding:0px; background:#fff; font-size:12px; line-height:2em; }
#PAGE div.CONTACT dl.FM dd input.RADIO	{ width:auto; margin:0px 5px 0px 2%; }
#PAGE div.CONTACT dl.FM dd input.CHECK	{ width:auto; margin:0px 5px 0px 0px; }
#PAGE div.CONTACT dl.FM dd input.PD	{ width:250px; margin:0px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dd select	{ float:left; display:inline; margin:0px 0px 0px 10px; }
#PAGE div.CONTACT dl.FM dd textarea	{ width:95%; height:100px; float:left; display:inline; margin:0px 0px 0px 2%; padding:0px; background:#fff; font-size:12px; }
#PAGE div.CONTACT dl.FM dd span	{ float:left; display:inline; margin:0px 0px 0px 10px; line-height:2em; }
#PAGE div.CONTACT dl.FM dd span.BAITAI	{ width:140px; margin-bottom:3px; line-height:1.2em; }
#PAGE div.CONTACT dl.FM dd span.NOTE	{ width:auto; float:left; display:inline; clear:none; color:#f39800; margin:5px 0px 0px 10px; line-height:1.2em; }

#PAGE div.CONTACT form h1	{ width:auto; float:left; margin:40px 0px 0px 0px; color:#666; font-weight:bold; font-size:13px; letter-spacing:0em; }
#PAGE div.CONTACT form a.PRIVACY_NOTE	{ width:auto; float:left; margin:30px 0px 0px 0px; color:#0af; line-height:1.2em; }
#PAGE div.CONTACT p.FORM_ALART a:hover	{ text-decoration:underline; }
#PAGE div.CONTACT p.FORM_ALART a:active	{ text-decoration:underline; }

#PAGE div.CONTACT p.FORM_EX	{ width:860px; float:left; display:both; margin:0px 0px 0px 0px; }
#PAGE div.CONTACT div.FORM_CONFIRM	{ width:94%; float:left; display:both; margin:10px 0px 0px 0px; padding:2.5%; border:1px solid #ccc; }
#PAGE div.CONTACT div.FORM_CONFIRM strong	{ font-weight:bold; font-size:14px; }
#PAGE div.CONTACT div.FORM_CONFIRM hr	{ margin:10px 0px; background:none; border-bottom:1px dotted #ccc; }
#PAGE div.CONTACT div.FORM_CONFIRM em	{ font-style:normal; font-weight:bold; color:#f39800; }
#PAGE div.CONTACT p.FORM_ALART	{ width:100%; float:left; display:both; margin:10px 0px 0px 0px; }
#PAGE div.CONTACT p.FORM_ALART a	{ color:#0af; }
#PAGE div.CONTACT p.FORM_ALART a:hover	{ text-decoration:underline; }
#PAGE div.CONTACT p.FORM_ALART a:active	{ text-decoration:underline; }

#PAGE div.CONTACT_SEND	{ width:820px; float:left; padding-bottom:30px; }
#PAGE div.CONTACT_SEND h1	{ width:820px; float:left; display:inline; margin:50px 0px 0px 0px; }
#PAGE div.CONTACT_SEND p	{ width:820px; float:left; display:inline; margin:20px 0px 0px 0px; }
#PAGE div.CONTACT_SEND div.FORM_CONFIRM	{ margin:20px 0px 0px 85px; }

#PAGE div.CONTACT form input.SENDBUTTON	{ width:100%; height:44px; float:left; display:inline; clear:both; margin:30px 0px 0px 0px; padding:0px; background:#f39800; cursor:pointer; color:#fff; font-size:16px; line-height:40px; letter-spacing:0.2em; border:none; -webkit-appearance:none; }
#PAGE div.CONTACT form input.SENDBUTTON:hover	{ filter:alpha(opacity=85); -moz-opacity:0.85; -khtml-opacity:0.85; opacity:0.85; }
#PAGE div.CONTACT form input.SENDBUTTON:active	{ filter:alpha(opacity=85); -moz-opacity:0.85; -khtml-opacity:0.85; opacity:0.85; }

#PAGE div.CONTACT form input.SENDBUTTON_SP	{ display:block; }

div#PAGE .PRIVACY_NOTE { width:89%; height:auto; padding:5%; }

.image{display: none;}
  

/*PC・SP*/
.pc{display: none;}
.sp{display: block;}
#footer span.pc{display: none;}
#footer span.sp{display: block;}
#footer strong a{display: flex;justify-content: center;align-items: center;}
#footer strong a img{height: 24px;}

}


/*フォームPC*/
.contents{width: 1000px;margin: 0 auto;margin-bottom: 100px;}
.memo { width: 90%; margin: 15px auto 5px auto;}

/* 日時予約 ( reserve ） */

/* .reserve { padding: 40px;} */
.reserve input { color: #666666;}
.reserve_flex { display: flex;}
  
.tab { display: flex; flex-wrap: wrap; width: 90%; margin: auto;}
.tab li a { display: block; background: #aeb6bf; color: #fff; margin-right: 5px; padding: 10px 20px;}
.tab li.tab_week a { display: block; background: #575757; color: #fff; margin-right: 5px; padding: 0;}
.tab li.active a { background: #1696af; color: #ffffff;}
.tab_week.list,.tab li.tab_week.list a { background-color: #a42d2d;}
.area { background: #fff; padding: 0; width: 90%; margin: auto;}
  
.tab_week { width: 100%; height: 50px; background-color: #575757; color: #fff; font-size: 1.2em; margin: 0; display: flex; justify-content: center; align-items: center; }
.tab_week i { margin: 5px; }
.tab_week p { margin: 0 40px; font-weight: bold; font-size: 1.1em; }


  
.angle { display: flex; flex-direction: column; }
.angle span { font-size: 0.6em; }
.week { flex-grow: 1; border: 1px solid #666; }
.week p { color: #515d6a; background-color: #dddddd; padding: 5px 0; text-align: center; border-bottom: 1px solid #666; font-weight: 300; }
.newReserve { position: relative; }
.newReserve a { color: #1696af; background: #fff188; border-radius: 5px; width: 8em; text-align: center; position: absolute; top: 54px; right: 6%; font-size: 1.6rem; line-height: 3.2rem; }

.time { width: auto; height: 35px; color: #000; border: 1px solid #aaa; font-size: 0.9em; vertical-align: baseline; text-align: center; line-height: 35px;}
th.time { height: 37px; }
.hour_box { height: 35px; border: 1px solid #aaa; position: relative; }
.reserve_form { display: block; background-color: #eee; border: 1px solid #f5f5f5; border-radius: 5px; padding: 10px; width: 500px; }


.reserve_flex>span { line-height: 2.5em; }
.reservation_area { margin: 0; padding: 0; text-align: center; height: 100%; line-height: 35px;}
.reservation_area.reservable a { color: #d93131;}
.reservation_area.reservable:hover { background-color: rgb(236, 172, 172); }
.reservation_area.no_reservable { color: #888; background-color: #ddd; }
.reservation_area.delete { display: flex; justify-content: space-around; background-color: rgb(236, 172, 172); border: solid 2px #d93131;}
.reservation_area.delete a { width: 50%; display: block; text-align: center; }
.reservation_area.delete a:nth-of-type(2n){ border-left: solid 2px #d93131; }
.reservation_area.delete a:hover { color: rgb(214, 66, 66);}
  
.reserve_table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.reserve_table tbody { display: flex; justify-content: space-between; }
.reserve_table th.week { padding: 0; border: 1px solid #aaa; background-color: #fff; line-height: 35px;}
.reserve_table th.week.saturday { background-color: #ebf4ff; }
.reserve_table th.week.sunday { background-color: #fff4f4; }
.reserve_table th.week.today { background-color: #f4ed54; }
.reserve_table th.week.zoom { color: #fff; background: #2d8cff; }
.time_clm { display: flex; flex-direction: column; width: 11%; background: #ddd;}
.week_clm { display: flex; flex-direction: column; width: 16%; position: relative; }

@media screen and (max-width: 640px){
   /*フォームSP*/
  .contents{ width: 100vw;}

  .tab_week p { font-size: 1em; margin: 0 10px;}
  .tab li.tab_week a { margin: 0 5px;}
  .reservation_area { font-size: 1em;}
  .reservation_area.delete { font-size: 0.85em;}
  .reserve_table th.week { font-size: 0.8em;}
  .reservation_area.delete a {line-height: 1.2;}
  }