/* ----------------------------Menü ------------------------------------- */


/* #sn_menu_background {background:rgba(252,252,252,0.9); width:48vw; border-left:1vw solid transparent; border-right:1vw solid transparent; */ 

#sn_menu_background {background:rgba(252,252,252,0.9); width:32vw; border-left:1vw solid transparent; border-right:1vw solid transparent; 
	height:100vh; min-width:295px; position:fixed; left:0; top:-100%; opacity:0; transition: top 0s 2s, opacity 0.5s 1s; 
	z-index:100005; box-shadow:0 0 20px rgba(0,0,0,0.4);}
	
#sn_menu_outer {display:block; font:700 20px/40px 'Open Sans Condensed', sans-serif; color:#888; width:50vw; 
	border-left:1vw solid transparent; border-right:1vw solid transparent; height:100vh; min-width:295px; 
	opacity:0; position:fixed; left:0; top:-100vh; transition: 0.5s 0.75s; z-index:100010; overflow:hidden; 
	overflow-y:auto; -webkit-overflow-scrolling: touch;}

/* #sn_menu_vertical {width:1px; height:100vh; display:inline-block; vertical-align:middle;} */
#sn_menu_vertical {width:1px; height:100vh; display:inline-block; vertical-align:top;}

#sn_menu_outer #sn_menu p {position:relative; padding:0; margin:0;}
#sn_menu_outer #sn_menu p label {display:block; line-height:39px; text-transform:uppercase; margin-left:-15px;}
#sn_menu_outer #sn_menu p label:hover {color:#000;}

#sn_menu_outer #sn_menu p label:last-child {display:none; position:absolute; left:0; top:0; width:100%; height:40px; background:rgba(0,0,0,0);}
#sn_menu_outer #sn_menu p label span {display:inline-block; width:0; height:0; border:5px solid transparent; border-top-color:#888; margin:0 4px 0 0;}

#sn_menu_outer #sn_menu p a {line-height:39px; color:#444; text-decoration:none;}
#sn_menu_outer #sn_menu p a:hover {color:#000;}

#sn_menu_outer #sn_menu div p {height:0; overflow:hidden; opacity:0; transition:0.75s;}

#sn_menu_ip input[id*="sn_menu"] {display:none;}

#sn_menu_outer div {padding:0; margin:0; list-style:none;}
#sn_menu_outer #sn_menu {width:90%; display:inline-block; vertical-align:middle; overflow:hidden}

#sn_menu_outer #sn_menu {width:90%; max-width:400px; margin:0 auto; overflow:hidden; overflow-y:auto;}
#sn_menu_outer #sn_menu > p {text-indent:15px; border-bottom:1px solid rgba(0,0,0,0.1);}
#sn_menu_outer #sn_menu div p {text-indent:30px;}
#sn_menu_outer #sn_menu div div p {text-indent:45px;}
#sn_menu_outer #sn_menu div div div p {text-indent:60px;}

#sn_menu_toggle {padding:0; margin:0; position:fixed; left:0; top:0; height:38px; width:80px; text-align:center; color:#000; z-index:100020; 
	background:transparent; transition: 0.5s; background 0.5s 0.5s;}
	
#sn_menu_toggle label {display:block; width:80px; height:38px; position:absolute; left:0; top:0;}
#sn_menu_toggle label:nth-of-type(1) span {display:block; width:30px; height:12px; position:absolute; top:10px; left:22px; 
	border-top:4px solid #000; border-bottom:4px solid #000;}
	
#sn_menu_toggle label:nth-of-type(1) span::after {content:""; display:block; width:30px; height:4px; position:absolute; top:4px; left:0; background:#000;}
#sn_menu_toggle label:nth-of-type(2) {display:none;}
#sn_menu_toggle label:nth-of-type(2) span {display:block; width:50px; height:50px; position:absolute;}
#sn_menu_toggle label:nth-of-type(2) span::before {content:""; display:block; width:30px; height:4px; position:absolute; top:22px; 
	left:24px; background:#c00; transform:rotate(45deg); transform-origin:center center;}
	
#sn_menu_toggle label:nth-of-type(2) span::after {content:""; display:block; width:30px; height:4px; position:absolute; top:22px; 
	left:24px; background:#c00; transform:rotate(-45deg); transform-origin:center center;}

#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_background {top:0; opacity:1; transition: opacity 0.5s, top 0s;}

#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_outer {top:0; opacity:1; transition: 0.5s 0.5s;}

/* #sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle {background:transparent; transition: 0.5s; left:50%; margin-left:-70px;} */
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle {background:transparent; transition: 0.5s; left:34%; margin-left:-70px;}
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle label {display:none;}
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle label:last-child {display:block;}
@media only screen and (max-width: 590px) {

	#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle {left:230px; margin-left:0;}
}

#sn_menu_ip input[class*="01"]:checked ~ #sn_menu_outer #sn_menu .sn_menu01 + div > p,
#sn_menu_ip input[class*="02"]:checked ~ #sn_menu_outer #sn_menu .sn_menu02 + div > p,
#sn_menu_ip input[class*="03"]:checked ~ #sn_menu_outer #sn_menu .sn_menu03 + div > p,
#sn_menu_ip input[class*="04"]:checked ~ #sn_menu_outer #sn_menu .sn_menu04 + div > p,
#sn_menu_ip input[class*="05"]:checked ~ #sn_menu_outer #sn_menu .sn_menu05 + div > p,
#sn_menu_ip input[class*="06"]:checked ~ #sn_menu_outer #sn_menu .sn_menu06 + div > p,
#sn_menu_ip input[class*="07"]:checked ~ #sn_menu_outer #sn_menu .sn_menu07 + div > p,
#sn_menu_ip input[class*="08"]:checked ~ #sn_menu_outer #sn_menu .sn_menu08 + div > p,
#sn_menu_ip input[class*="09"]:checked ~ #sn_menu_outer #sn_menu .sn_menu09 + div > p,
#sn_menu_ip input[class*="10"]:checked ~ #sn_menu_outer #sn_menu .sn_menu10 + div > p,
#sn_menu_ip input[class*="11"]:checked ~ #sn_menu_outer #sn_menu .sn_menu11 + div > p {height:40px; opacity:1; border-bottom:1px solid rgba(0,0,0,0.05);}

#sn_menu_ip #sn_menu01:checked ~ #sn_menu_outer #sn_menu .sn_menu01 > label:last-child,
#sn_menu_ip #sn_menu02:checked ~ #sn_menu_outer #sn_menu .sn_menu02 > label:last-child,
#sn_menu_ip #sn_menu03:checked ~ #sn_menu_outer #sn_menu .sn_menu03 > label:last-child,
#sn_menu_ip #sn_menu04:checked ~ #sn_menu_outer #sn_menu .sn_menu04 > label:last-child,
#sn_menu_ip #sn_menu05:checked ~ #sn_menu_outer #sn_menu .sn_menu05 > label:last-child,
#sn_menu_ip #sn_menu06:checked ~ #sn_menu_outer #sn_menu .sn_menu06 > label:last-child,
#sn_menu_ip #sn_menu07:checked ~ #sn_menu_outer #sn_menu .sn_menu07 > label:last-child,
#sn_menu_ip #sn_menu08:checked ~ #sn_menu_outer #sn_menu .sn_menu08 > label:last-child,
#sn_menu_ip #sn_menu09:checked ~ #sn_menu_outer #sn_menu .sn_menu09 > label:last-child,
#sn_menu_ip #sn_menu10:checked ~ #sn_menu_outer #sn_menu .sn_menu10 > label:last-child,
#sn_menu_ip #sn_menu11:checked ~ #sn_menu_outer #sn_menu .sn_menu11 > label:last-child {display:block;}

#sn_menu_ip input[class*="01"]:checked ~ #sn_menu_outer #sn_menu .sn_menu01 > label,
#sn_menu_ip input[class*="02"]:checked ~ #sn_menu_outer #sn_menu .sn_menu02 > label,
#sn_menu_ip input[class*="03"]:checked ~ #sn_menu_outer #sn_menu .sn_menu03 > label,
#sn_menu_ip input[class*="04"]:checked ~ #sn_menu_outer #sn_menu .sn_menu04 > label,
#sn_menu_ip input[class*="05"]:checked ~ #sn_menu_outer #sn_menu .sn_menu05 > label,
#sn_menu_ip input[class*="06"]:checked ~ #sn_menu_outer #sn_menu .sn_menu06 > label,
#sn_menu_ip input[class*="07"]:checked ~ #sn_menu_outer #sn_menu .sn_menu07 > label,
#sn_menu_ip input[class*="08"]:checked ~ #sn_menu_outer #sn_menu .sn_menu08 > label,
#sn_menu_ip input[class*="09"]:checked ~ #sn_menu_outer #sn_menu .sn_menu09 > label,
#sn_menu_ip input[class*="10"]:checked ~ #sn_menu_outer #sn_menu .sn_menu10 > label,
#sn_menu_ip input[class*="11"]:checked ~ #sn_menu_outer #sn_menu .sn_menu11 > label {color:#c00;}

#sn_menu_ip input[class*="01"]:checked ~ #sn_menu_outer #sn_menu .sn_menu01 > label span,
#sn_menu_ip input[class*="02"]:checked ~ #sn_menu_outer #sn_menu .sn_menu02 > label span,
#sn_menu_ip input[class*="03"]:checked ~ #sn_menu_outer #sn_menu .sn_menu03 > label span,
#sn_menu_ip input[class*="04"]:checked ~ #sn_menu_outer #sn_menu .sn_menu04 > label span,
#sn_menu_ip input[class*="05"]:checked ~ #sn_menu_outer #sn_menu .sn_menu05 > label span,
#sn_menu_ip input[class*="06"]:checked ~ #sn_menu_outer #sn_menu .sn_menu06 > label span,
#sn_menu_ip input[class*="07"]:checked ~ #sn_menu_outer #sn_menu .sn_menu07 > label span,
#sn_menu_ip input[class*="08"]:checked ~ #sn_menu_outer #sn_menu .sn_menu08 > label span,
#sn_menu_ip input[class*="09"]:checked ~ #sn_menu_outer #sn_menu .sn_menu09 > label span,
#sn_menu_ip input[class*="10"]:checked ~ #sn_menu_outer #sn_menu .sn_menu10 > label span,
#sn_menu_ip input[class*="11"]:checked ~ #sn_menu_outer #sn_menu .sn_menu11 > label span {border-top-color:#c00;}
