@charset "utf-8";

.sp_header {
background: #FFF;
position: relative;
width: 100%;
height: 48px;
}
.sp_header h1{
display: inline-block;
}
.sp_header h1 {
position: absolute;
z-index: 10;
top:7px;
left:10px;
text-align: left;
width: 110px;
}
.sp_header h1 a:hover {
opacity: 1;
}
#index .sp_header {
display: none;
}


/* hamburger menu */
.hmenu-wrapper{
position:fixed;
top:6px;
right:5px;
z-index: 998;
}
.hmenu{
width: 40px;
height:40px;
position:relative;
cursor:pointer;
display: inline-block;
float:right;
z-index: 999;
}
.hmenu1{
width:27px;
height:2px;
position:absolute;
top:10px;
left:6px;
}
.hmenu2{
width:27px;
height:2px;
position:absolute;
top:17px;
left:6px;
}
.hmenu3{
width:27px;
height:2px;
position:absolute;
top:24px;
left:6px;
}
.hmenu4{
color: #FFF;
display: none;
font-size: .7rem;
font-weight: bold;
position:absolute;
top:37px;
}
.hmenu1,.hmenu2,.hmenu3{
transition: all 0.3s ease-out;
display: inline-block;
background-color: #62abd9;
 }
.hmenuclick1{
top:16px;
transform: rotate(45deg);
}
.hmenuclick2{
opacity:0;
}
.hmenuclick3{
top:16px;
transform: rotate(-45deg);
}

.hmenu-back{
display: none;
position: fixed;
background-color: #FFF;
opacity: .6;
z-index: 997;
width: 100%;
height: 100%;
top:0;
left:0;
}
.hmenu-nav{
display: none;
position:fixed;
top:50px;
background-color: rgba(255,255,255,1);
z-index: 998;
width: 100%;
padding: 0;
}
.hmenu-nav li{
display: block;
box-sizing: border-box;
border-bottom: 1px dotted #62abd9;
}
.hmenu-nav li a{
display: block;
height:100%;
padding: 1.2rem 0;
text-align: center;
transition: background .3s;
}
.hmenu-nav li a:hover{
background-color: #e0eef7;
}
.hmenu-nav p {
padding: 1.5rem 0;
text-align: center;
}
.hmenu-nav p a {
display: inline-block;
margin: 0 .8rem;
}
.index .hmenu-nav li.index,
.about .hmenu-nav li.about,
.rhythm .hmenu-nav li.rhythm,
.awake .hmenu-nav li.awake,
.column .hmenu-nav li.column,
.news .hmenu-nav li.news,
.project .hmenu-nav li.project,
.contact .hmenu-nav li.contact {
background-color: #62abd9;
}
.index .hmenu-nav li.index a,
.about .hmenu-nav li.about a,
.rhythm .hmenu-nav li.rhythm a,
.awake .hmenu-nav li.awake a,
.column .hmenu-nav li.column a,
.news .hmenu-nav li.news a,
.project .hmenu-nav li.project a,
.contact .hmenu-nav li.contact a {
color: #FFF;
}
.opacity20{
opacity: .2;
}



/* facebook like box */
.fb_iframe_widget,
.fb_iframe_widget[style],
.fb_iframe_widget iframe[style],
.fb_iframe_widget span{
width: 100% !important;
}


/* Social Button */
.social-button {
position: relative;
margin: 2rem 0;
}
.footer .footer_menu > span.social-button {
width: 100%;
}
.social-button strong {
width: 100px;
position: absolute;
}
.footer .footer_menu > span.social-button strong.fb {
display: block;
top:0;
left:calc(50% - 65px);
width: 65px;
}
.social-button strong.tw {
display: block;
top:0;
right:calc(50% - 72px);
width: 72px;
}
.social-button:before, .social-button:after {
content: " ";
display: table;
}
.social-button:after {
clear: both;
}
.social-button {
*zoom: 1;
}
.social-button iframe.twitter-share-button {
width: 90px !important;
}
.social-button.tw {
width:72px;
}
.footer span.social-button a {
border-right:none;
}




.footer {
position: relative;
}
.footer-top-btn {
opacity: 0;
display: inline-block;
position: fixed;
z-index: 999;
transition: opacity .3s;
width: 46px;
height: 46px;
text-indent: -9999px;
background: url(https://mezame-project.jp/images/footer-top-btn.svg) no-repeat 50% 50%;
background-size: 40px auto;
}




@media screen and (min-width:768px) {

/* hamburger menu */
.sp_header,
.hmenu-wrapper{
display: none;
}

/* facebook like box */
.box-fb .col8 { width:500px; }


}

@media screen and (min-width:960px) {

.footer-top-wrap p{
max-width:1080px;
}

}