@charset "UTF-8";
/*
 * header.css
 */


/* !header
---------------------------------------------------------- */

	#header.sticky {
		display:none;
	}
	#headerIn {
		margin: 0 auto;
		width: 960px;
		text-align: left;
	}
		#headerLogo {
			float:left;
			width:185px;
			margin:0px 0 0 0;
		}
			#headerLogo img{
				width:100%;
				height:auto;
			}
			#header #headerLogo img.logo01,
			#header.sticky #headerLogo img.logo01{display:block;}
			#header #headerLogo img.logo02,
			#header.sticky #headerLogo img.logo02{display:none;}
		#headerNavi {
			float:right;
			margin:11px 0 0 0;
		}
			#headerNavi ul {
				overflow:hidden;
			}
				#headerNavi li {
					float:left;
				    margin: 0 0 0 12px;
				}
				#headerNavi li#hNav01 {    padding-top: 7px;}
				#headerNavi li#hNav02,
				#headerNavi li#hNav03 {
					width: 257px;
				}

								#headerNavi li#hNav03 {display:none;}
				
					#headerNavi li#hNav02 a,
					#headerNavi li#hNav03 a{
						display:block;
						height: 73px;
						margin:1px 0 0 0;
						-webkit-border-radius: 10px;
						-moz-border-radius: 10px;
						border-radius: 10px;
						text-indent:-9999px;
						overflow:hidden;
					}
					#headerNavi li#hNav02 a{
						background: #fc555f url(/takuhaimeiji/common/images/rwd/btn_header01.png) no-repeat 19px 13px;
						-webkit-box-shadow: 0 2px #bc2d36;
						-moz-box-shadow: 0 2px #bc2d36;
						box-shadow: 0 2px #bc2d36;
					}
					#headerNavi li#hNav02 a:hover{
						background-color: #fd777f;
					}


@media screen and (max-width: 959px) {
	#header {
		height:120px;
		border-bottom: 1px solid #dddddd;
		background-color: #FFFFFF;
	}
	#header.sticky {
		display:block;
		position:fixed;
		top:-120px;
		z-index:9999;
		background:#fff;
		-webkit-transition:0.5s top cubic-bezier(.3, .73, .3, .74);
		-moz-transition:0.5s top cubic-bezier(.3, .73, .3, .74);
		transition:0.5s top cubic-bezier(.3, .73, .3, .74);
	}
		#headerIn {
			width: 100%;
			padding:0 30px;
			box-sizing:border-box;
		}
			#headerLogo {
				width:317px;
			}
			#header.sticky #headerLogo img.logo01{display:none;}
			#header.sticky #headerLogo img.logo02{display:block;}
			#headerNavi {
				margin:0;
			}
			#headerNavi {    position: fixed;right: 15px;}
				#headerNavi li {
					margin:0;
				}
				#headerNavi li#hNav01 {
					display:none;
				}
				#headerNavi li#hNav02,
				#headerNavi li#hNav03 {
					display:block;
					width:100px;
				}
					#headerNavi li#hNav02 a,
					#headerNavi li#hNav03 a{
						display:block;
						height:100px;
						margin:0;
						-webkit-border-radius:0;
						-moz-border-radius:0;
						border-radius:0;
					}
				
					#headerNavi li#hNav02 a{
						background: #fc555f url(/takuhaimeiji/common/images/rwd/tb/btn_header01.png) no-repeat 0 0;
						-webkit-box-shadow: inset 0 -2px rgba(0,0,0,.2);
						-moz-box-shadow: inset 0 -2px rgba(0,0,0,.2);
						box-shadow: inset 0 -2px rgba(0,0,0,.2);
					}
					#headerNavi li#hNav03 a{
						background: #444444 url(/takuhaimeiji/common/images/rwd/tb/btn_header02.png) no-repeat 0 0;
						-webkit-box-shadow: inset 0 -2px rgba(0,0,0,.2);
						-moz-box-shadow: inset 0 -2px rgba(0,0,0,.2);
						box-shadow: inset 0 -2px rgba(0,0,0,.2);
					}
					#headerNavi li#hNav03 a:hover{
						background-color: #33b1e5;
					}

}				

@media screen and (max-width: 767px) {
	#header {
	height: 60px;
	border-bottom: 1px solid #dddddd;
	background-color: #FFFFFF;
	}
	#header.sticky {
		top:-60px;
	}
		#headerIn {
			padding:0 15px;
		}
			#headerLogo {
				width:158px;
				margin:0px 0 0 0;
			}
			#headerNavi {    position: absolute;right: 15px;}
				#headerNavi li {}
				#headerNavi li#hNav02,
				#headerNavi li#hNav03 {
					width:50px;
				}
					#headerNavi li#hNav02 a,
					#headerNavi li#hNav03 a{
						height:50px;
					}
				
					#headerNavi li#hNav02 a{
						background-size:50px auto;
					}
					#headerNavi li#hNav03 a{
						background-size:50px auto;
					}
				li#hNav04 {
					display: none;	
				}
}

/*210413*/
#headerNavi li#hNav01 a{color: #007bff; text-decoration: underline;}