@charset "UTF-8";
/* CSS Document */

/* PC用 -------------------- */
.btmenu { display: none; }

/* タブレット用 -------------------- */
@media screen and (max-width:1080px) {
.toggle { display:none; }

#slideMenu { pointer-events:auto; opacity: 0;}

/* TOGGLE */
.toggle { width:47px; height:49px; border-radius:2px; background-color:#111; cursor:pointer; display:none; pointer-events:all; position:fixed; top:52px; right:40px; z-index: 1111; pointer-events:auto;}
.toggle .in { padding:10px 6px; box-sizing: border-box; }

.toggle span { display:block; width:35px; height:2px; }
.toggle span.t1 { background:#003cf2;}
.toggle span.t2 { margin:6px 0; background:#fff; }
.toggle span.t3 { background:#ff020f;}
.toggle { display:block; }
.toggle .btmenu{ font-size: 11px;}

.toggle, .toggle span { transition:all 0.4s cubic-bezier(0.42, 0.02, 0.33, 1.05);}
.open .toggle span.t2 { opacity:0; background:#FFF;}
.open .toggle {}
.open .toggle span.t1 { transform: translate(0px, 8px) rotate(135deg); background:#FFF;}
.open .toggle span.t3 { transform: translate(0px, -8px) rotate(-135deg); background:#FFF;}

#slideMenu { width:100%; height:100%; padding: 0 40px; display:block; overflow-x:hidden; background-color:rgba(0,0,0,0.90); box-sizing:border-box; position:relative; position:fixed; top:0; left:0; z-index:1000; pointer-events:none;}

.btmenu { display: block; }


@media screen and (max-width:680px){
/* header --------------------*/
.toggle { width:47px; height:48px; top:20px; right:19px;}
.toggle .in { padding:10px 6px;}
.toggle span { width:35px;}
.toggle span.t2 { margin:4px 0; }
.open .toggle span.t1 { transform: translate(0px, 6px) rotate(135deg); }
.open .toggle span.t3 { transform: translate(0px, -6px) rotate(-135deg); }
.toggle .btmenu{ font-size: 11px;}

#slideMenu {}

.btmenu { display: block; }

}


