/* Flexible Slide-to-top Accordion Style*/
/* 共通*/
.st-accordion{
width:100%;
position:fixed;
z-index:999;
top:0;
left:0;
}
.st-accordion ul li{
overflow: hidden;
}
/* ヘッダーメニューアイコン動き*/
.st-accordion ul li > a span.st-menu{
position:fixed;
top: 20px;
right: 5%;
display: block;
width: 20px;
height: 20px;
cursor: pointer;
z-index: 999;
}
.st-accordion ul li > a span.st-menu span {
position: absolute;
top: 50%;
left: 0;
background: #000;
display: block;
width: 100%;
height: 1px;
margin-top: -2px;
font-size: 0px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-transition: background-color 0.3s;
-moz-transition:  background-color 0.3s;
-o-transition:  background-color 0.3s;
transition:  background-color 0.3s;
}
.st-accordion ul li.st-open > a span.st-menu span {
background-color: transparent;
}
.st-accordion ul li > a span.st-menu span:before,
.st-accordion ul li > a span.st-menu span:after {
position: absolute;
left: 0;
width: 100%;
height: 100%;
content: '';
background: #000;
-webkit-transition: -webkit-transform 0.3s;
transition: transform 0.3s;
}
.st-accordion ul li.st-open > a span.st-menu span:before,
.st-accordion ul li.st-open > a span.st-menu span:after{
background: #000;
}
.st-accordion ul li > a span.st-menu span:before{
top:-5px;
}
.st-accordion ul li > a span.st-menu span:after{
bottom:-5px;
}
.st-accordion ul li > a span.st-menu span:before {
-webkit-transform: translateY(-250%);
transform: translateY(-250%);
}
.st-accordion ul li > a span.st-menu span:after {
-webkit-transform: translateY(250%);
transform: translateY(250%);
}
.st-accordion ul li.st-open > a span.st-menu span:before {
-webkit-transform: translateY(0) rotate(45deg);
transform: translateY(0) rotate(45deg);
top:0;
}
.st-accordion ul li.st-open > a span.st-menu span:after {
-webkit-transform: translateY(0) rotate(-45deg);
transform: translateY(0) rotate(-45deg);
bottom:0;
}
/* ヘッダーメニュー*/
.st-content{
display:none;
width:100%;
position:absolute;
top:0;
left:0;
background:#fff;
z-index:998;
}
@media screen and (max-width:640px){
.st-content{
font-size:10pt;
}
}
.st-content .logo .icon-logo{
display:inline-block;
margin-left:5%;
font-size:25px;
margin-top:13px;
margin-bottom:7px;
}
.st-content .hours{
margin-bottom:10px;
font-size:87.5%;
margin-left:5%;
}
@media screen and (max-width:640px){
.st-content .hours{
letter-spacing:-0.025em;
font-size:7pt;
}
}
.st-content ul.menu{
width:100%;
margin:0 auto;
border-top:1px solid #ccc;
}
.st-content ul.menu li{
line-height:45px;
height:45px;
width:100%;
text-align:center;
border-bottom:1px solid #ccc;
}
.st-content ul.menu li:last-child{
border:none;
}
.st-content ul.menu  li a{
display:block;
width:100%;
-webkit-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-o-transition: all 0.6s ease;
transition: all  0.6s ease;
}
.st-content ul.menu  li:last-child a{
border-bottom:none;
}
.st-content ul.menu  li a:hover,
.st-content ul.menu  li a.hover{
background:#eaeaea;
text-decoration:none;
}
.st-content ul.link{
width:100%;
margin:0 auto;
}
.st-content ul.link li{
display:inline;
width:50%;
float:left;
height:50px;
line-height:50px;
text-align:center;
}
.st-content ul.link li a{
display:block;
border-right:1px solid #fff;
background:rgba(90,70,80,1);
opacity:1;
}
.st-content ul.link li a:hover{
background:rgba(90,70,80,0.7);
}
.st-content .sns{
font-size:20px;
text-align:center;
padding:10px 0 20px;
}
@media screen and (max-width:640px){
.st-content .sns{
padding:5px 0 10px;
}
}
.st-content .sns a{
margin:0 0.5em;
}
.st-content .sns a .icon{
opacity:1;
}
.st-content .sns a:hover .icon{
opacity:0.7;
}