@charset "utf-8";

/*menu*/
#menu{
	font-size:0;
	width:100%;
	border-top:5px solid #d4d1bc;
	background-color:#f8f6e9;
	background-image:url(/~/media/cojp/product/pro-embroidery/navi/img/g_navi/line);
	background-repeat: repeat-x;
	background-position:bottom;
	/* float:left; */
	z-index: 90;
}
#menu .g_navi{
	padding:0 !important;
}
.g_navi{
	max-width: 1020px;
	margin:0 auto;
	text-align:center;
	overflow:hidden;
}
#menu .spg_navi{
	display:none;
}
#menu .g_navi div{
	display:inline;
	zoom:1;
	vertical-align:top;
}

#menu .g_navi div a img{width:calc((100% / 6) - 0.1px);}

#menu a,
.sp_top a {
	color: #1f1800;
}

/*sub_menu*/
#sb_menu{
	width:100%;
	float:left;
	background-color:#cee9ff;
	border-bottom: 1px dashed #c3d0d9;
}
#sb_menu .sb{
	width:1020px;
	margin:0px auto;
	padding:10px 19px 10px;
	text-align:center;
	overflow:hidden;
}
#sb_menu .sb .sb1{
	margin-right:18px;
	float:left;
}
#sb_menu .sb .sb2{
	margin-right:18px;
	float:left;
}
#sb_menu .sb .sb3{
	margin-right:18px;
	float:left;
}
#sb_menu .sb .sb4{
	float:left;
}
/*sp*/
#sb_menu .sp_sb{
	display:none;
}

.sp_top{
	display:none;
	width:100%;
	/* float:left; */
	/*margin-bottom: 65px;*/
	background-color: #e6f4ff;
	border-bottom: 1px dashed #c3d0d9;
}
.sp_top .spg_pan{
	width:100%;
	/* float:left; */
	margin:0 auto;
	text-align:center;
	overflow:hidden;
	background-color:#e8e5d2;
}
.sp_top .spg_pan .spg_pan_txt{
	margin: 8px 30px 0;
	float:left;
}
.sp_top .spg_pan .spg_pan_txt p{
	font-size:12px;
}
.sp_top .spg_pan .spg_pan_yazi{
	float:left;
}
.sp_top .spg_pan .spg_pan_yazi img{
	width:60%;
}
.sp_top .spg_pan .spg_pan_txt2{
	float:left;
	margin:8px 0px 0px 15px;
}
.sp_top .spg_pan .spg_pan_txt2 p{
	font-size:12px;
}
#pc-side-nav {
	display: none;
}
#pc-side-nav.sidebar {
	top: 0;
	left: 0;
	width: 100%;
	height:100%;
	z-index: 2;
	position: fixed;
	visibility:hidden;
}
#pc-side-nav.sidebar img{
	position:absolute;
	top:15%;
	right:0;
	z-index:50;
	visibility:visible;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000;
}
.fixed1{
    position: fixed;
    top: 79px;
    width: 100%;
    z-index: 10000;
}


/*レスポンシブ*/
@media screen and (max-width : 640px){
	/*mnenu*/
	#menu{
		font-size:0;
		width:100%;
		float:left;
		background-image:none;
		z-index: 90;
	}
	#menu .g_navi{
		display:none;
	}
	#menu .spg_navi{
		display:block;
		width:100%;
		float:left;
		margin:0 auto;
		/*text-align:center;*/
		overflow:hidden;
	}
	#menu .spg_navi .spg_navi_title{
		margin: 10px 0 0 10px;
		float:left;
		width:200px;
	}
	#menu .spg_navi .spg_navi_title .spg_navi_txt{
		float:left;
		/*margin-right:20px;*/
	}
	#menu .spg_navi .spg_navi_title .spg_navi_txt img{
		width:75%;
	}
	/*#menu .spg_navi .spg_navi_title .spg_navi_txt p{
		font-size:30px;
	}*/
	#menu .spg_navi .spg_navi_title .spg_navi_icon{
		margin-top: 10px;
		float:left;
	}
	
	#menu .spg_navi .spg_navi_btn{
		display:none;
		width:100%;
		min-width:320px;
		/*float:left;*/
		margin:0 auto;
		/*text-align:center;*/
		overflow:hidden;
		background-color:#f8f6e9;
		z-index: 100;
		
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main1{
		width:100%;
		border-top: 1px dashed #c3d0d9;
		border-bottom: 1px dashed #c3d0d9;
		text-align:left;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main1 img{
		margin:15px 0px 15px 50px;
		height:15px;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main2{
		width:100%;
		border-bottom: 1px dashed #c3d0d9;
		text-align:left;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main2 img{
		margin:15px 0px 15px 50px;
		height:15px;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main3{
		width:100%;
		border-bottom: 1px dashed #c3d0d9;
		text-align:left;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main3 img{
		margin:15px 0px 15px 50px;
		height:15px;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main4{
		width:100%;
		border-bottom: 1px dashed #c3d0d9;
		text-align:left;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main4 img{
		margin:15px 0px 15px 50px;
		height:15px;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main5{
		width:100%;
		border-bottom: 1px dashed #c3d0d9;
		text-align:left;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main5 img{
		margin:15px 0px 15px 50px;
		height:15px;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main6{
		width:100%;
		border-bottom: 1px dashed #c3d0d9;
		text-align:left;
	}
	#menu .spg_navi .spg_navi_btn .spg_navi_main6 img{
		margin:15px 0px 15px 50px;
		height:15px;
	}

	#panel-btn{
  		display: inline-block;
		position: relative;
		width: 48px;
		height: 48px;
		background-color: #bcbaa8;
		float:right;
	}
	#panel-btn:hover{
  		background: #bcbaa8;
	}
	#panel-btn-icon{
 	 	display: block;
		position: absolute;
		top: 45%;
		left: 33%;
		width: 30px;
		height: 2px;
		margin: -1px 0 0 -7px;
		background: #ffffff;
		transition: .2s;
	}
	#panel-btn-icon:before, #panel-btn-icon:after{
  		display: block;
  		content: "";
  		position: absolute;
  		top: 50%;
 		left: 0;
  		width: 30px;
  		height: 2px;
  		background: #ffffff;
 		transition: .3s;
	}
	#panel-btn-icon:before{
  		margin-top: -10px;
	}
	#panel-btn-icon:after{
 		 margin-top: 8px;
	}
	#panel-btn .close{
  		background: transparent;
	}
	#panel-btn .close:before, #panel-btn .close:after{
  		margin-top: 0;
	}
	#panel-btn .close:before{
  		transform: rotate(-45deg);
  		-webkit-transform: rotate(-45deg);
	}
	#panel-btn .close:after{
  		transform: rotate(-135deg);
  		-webkit-transform: rotate(-135deg);
	}

	.sp_top {
		display: block;
	}


	#pc-side-nav.sidebar {
		display:none;
		top: 0;
		left: 0;
		/*width: 100%;
		height:100%;*/
		z-index: 2;
		position: fixed;
		visibility:hidden;
	}
	#pc-side-nav.sidebar a {
		opacity: 0.8;
	}
	#pc-side-nav.sidebar img{
		position:absolute;
		/*top:70%;*/
		top:55%;
		right:0;
		z-index:1;
		visibility:visible;
		width:50px;
	}
	
	.fixed {
    	position: fixed;
    	top: 0;
   	 	width: 100%;
   	 	z-index: 100;
	}
	.fixed1{
    	position: fixed;
   		top: 600px;
   	 	width: 100%;
   	 	z-index: 99;
	}
	.fixed2{
		position: fixed;
   		top: 58px;
   	 	width: 100%;
   	 	z-index: 99;
	}
	
	/*footer*/
	#footer .footer_txt{
		width: 640px;
		margin: 20px auto;
		text-align: center;
		overflow: hidden;
	}

}