@charset "utf-8";

/** ss3LineBtn
────────────────────────────────────────────────── */
.ss3LineBtn{ 
width: 40px;height:40px;
cursor:pointer;
z-index:99;
position:relative;
/*margin:0 auto 0 auto;
top: 0px;
*/
}
.ss3LineBtn .ss3lbline1{ top:6px; } 
.ss3LineBtn .ss3lbline2{ top:18px; } 
.ss3LineBtn .ss3lbline3{ top:30px; } 
.ss3LineBtn .ss3lbline1,.ss3lbline2,.ss3lbline3{ width:40px;height:4px; background-color:#5A5A5A; position:absolute;transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out; }
.ss3LineBtn .menuclick1{ top:18px;width:40px;-moz-transform: rotate(215deg);-webkit-transform: rotate(215deg);-o-transform: rotate(215deg);-ms-transform: rotate(215deg);transform: rotate(215deg); }
.ss3LineBtn .menuclick2{ opacity:0; }
.ss3LineBtn .menuclick3{ width:40px;top:18px;-moz-transform: rotate(-215deg);-webkit-transform: rotate(-215deg);-o-transform: rotate(-215deg);-ms-transform: rotate(-215deg);transform: rotate(-215deg); }
#menuTitleOpen{ width: 40px;margin:10px auto;text-align:center; }
#menuTitleClose{ width: 40px;margin:10px auto;text-align:center;display:none; }


@media print,screen and (min-width : 501px) {
}
@media screen and (max-width : 500px) {


/** 縦からのスライド
────────────────────────────────────────────────── */

.verticalSlide{
  display:none;
  background-color:rgba(255,255,255,0.9);
/* 
  position: fixed;
  top:0px;left:0;right:0;bottom:0;
  overflow-y: auto;
  z-index:99;
  
*/}

/** 左からのスライド
────────────────────────────────────────────────── */
.lateralSlideRight {
  position: fixed;right:0;top:0;z-index: 99;overflow: hidden;
  -moz-transform: translateX(340px);-ms-transform: translateX(340px);-webkit-transform: translateX(340px);transform: translateX(340px);
  -moz-transition: -moz-transform 200ms ease;-o-transition: -o-transform 200ms ease;-webkit-transition: -webkit-transform 200ms ease;transition: transform 200ms ease;
  width: 320px;height: 100%;min-width:320px;
  box-shadow: 1px 1px 4px #8C8C8C;
	background-color:#FFF;
}
.lateralSlideRight.open { -moz-transform: translateX(0);-ms-transform: translateX(0);-webkit-transform: translateX(0);transform: translateX(0); }
.lateralSlideRight #menu-scroll {
  box-sizing: border-box;position: relative;
  width: 340px;height: 100%;
  overflow-y: scroll;
}

/** 右からのスライド
────────────────────────────────────────────────── */
.lateralSlideLeft {
  position: fixed;left:0;top:0;z-index: 99;overflow: hidden;
  -moz-transform: translateX(0px);-ms-transform: translateX(340px);-webkit-transform: translateX(340px);transform: translateX(-340px);
  -moz-transition: -moz-transform 200ms ease;-o-transition: -o-transform 200ms ease;-webkit-transition: -webkit-transform 200ms ease;transition: transform 200ms ease;
  width: 320px;height: 100%;min-width:320px;
  box-shadow: 1px 1px 4px #8C8C8C;
	background-color:#FFF;
}
.lateralSlideLeft.open { -moz-transform: translateX(0);-ms-transform: translateX(0);-webkit-transform: translateX(0);transform: translateX(0); }
.lateralSlideLeft #menu-scroll {
  box-sizing: border-box;position: relative;
  width: 320px;height: 100%;
  overflow-y: scroll;
}



}