
/********************************************************************************

          heder

*********************************************************************************/

/*====================
{{スマホを基本設計にする}}
 - 〜479px：SP縦
 - 480px〜599px：SP横   @media screen and (min-width:480px) and (max-width:599px) {
 - 600px〜959px：タブレット  @media screen and (min-width:600px) and (max-width:959px) {
 - 960px〜1279px：小型PC   @media screen and (min-width:960px) and (max-width:1279px) {
 - 1280px〜：大型PC       @media screen and (min-width:1280px) {

@media screen and (min-width:480px) {　///////タブレット・PC
@media screen and (max-width:480px) {  //////スマホ
====================*/





/* フロート */
.alignleft {
	float: left;
}

.alignright {
	float: right;
}


/************************  タブレット・PC　　*****************************************/
@media screen and (min-width:481px) {
/* heder枠 */
	#sp_header_wrap {
		display: none;
	}
#header_wrap{
	margin: 0px auto;
	padding:0px;
	width:100%;
	background-image:url(../../imgbtn/header_img/header_bg.jpg);
	background-repeat:repeat-x;
	z-index: 100;
	/*height:152px;*/
    color: #333;
	font-size: 14px;
    line-height: 160%;
	background-color:#FFFFFF;
}


#header_wrap h1{
	text-align: left;
	padding-left: 10px;
	color: #666;
	display: block;
	margin-bottom: 3px;
	margin-top:0px;
	width: auto;
	font-weight: normal;
	background-color:#EEEEEE;
}


.header_img {
	background-image: url(../../imgbtn/header_img/top_hitsuji.gif);
	background-repeat: no-repeat;
	background-position: 70px 30px;
}


#header_inner {
	width: 1010px;
	margin-left: auto;
	margin-right: auto;
}


/*---- maker_area ----*/
#header_makerarea {
	margin: 0 auto;
	width: 1008px;
	background-color:#EEEEEE;
	height:28px;
}
	#header_makerarea .alignleft{
	margin-left: 0px;
	width: 630px;
	font-size: 12px;
	text-align: left;
	padding-left: 10px;
	margin-top: 2px;
	float: left;
	}
	#header_makerarea .alignright{
	text-align: right;
	width: 270px;
	height: 26px;
	margin-top: 2px;
	}
	#header_makerarea .alignright ul {
		list-style-type: none;
	}
	#header_makerarea .alignright ul li	{
		display: inline;
		overflow: hidden;
		margin-right:10px;
		float:left;
		font-size: 12px;
	}
	#header_makerarea .alignright ul li.last {
		display:block;
		margin-right:0px;
	}

#header_makerarea h1#header_h1 {
	font-size: 10px;
	font-weight: normal;
	margin-bottom:0px;
}


/*---- rogo_area ----*/
#header_rogoarea {
	margin: 0 auto; /*ワイドBG用*/
	/*background-color:#fff;*/
	/*height:80px;*/
	width:1008px;
}
	#header_rogoarea .alignleft{
	margin-left: 10px;
	width: 160px;
	margin-bottom: 18px;
	padding-top: 8px;
	}
	#header_rogoarea .alignleft img{
		width: 100%;
		height: auto;
	}
	/*#header_rogoarea .alignright{
		width: 768px;
		height:80px;
	}*/
#header_guestarea {
	width: 580px;
	margin-top: 10px;
	margin-right: 10px;
	font-size: 12px;
	text-align: right;
	float: left;
}

/*  ニュース用 */
#header_guestarea_news {
	width: 490px;
	margin-top: 10px;
	margin-right: 10px;
	font-size: 12px;
	text-align: right;
	float: left;
}
/*  スマイリング用 */
#header_guestarea_sumairing {
	width: 440px;
	margin-top: 10px;
	margin-right: 10px;
	font-size: 12px;
	text-align: right;
	float: left;
}
	#header_rogoarea_sumairing .alignleft{
	margin-left: 10px;
	width: 300px;
	margin-bottom: 0;
	padding-top: 18px;
	}
	#header_rogoarea_sumairing .alignleft img{
		width: 100%;
		height: auto;
	}

/* 正月さる用  */
#header_rogoarea2016 {
	margin: 0 auto; /*ワイドBG用*/
	/*background-color:#fff;*/
	/*height:80px;*/
	width:1008px;
}
	#header_rogoarea2016 .alignleft{
	margin-left: 10px;
	width: 160px;
	margin-bottom: 6px;
	padding-top: 8px;
	}
	#header_rogoarea .alignleft img{
		margin-top:5px;
	}
#header_guestarea2016 {
	width: 560px;
	margin-top: 10px;
	margin-right: 10px;
	font-size: 12px;
	text-align: right;
	float: left;
}

#header_guest {
	padding-right:0px;
	padding-bottom:1px;
}
#header_guest span.loginname {
	font-weight:bold;
	color:#D10003;
}


#header_guide {
	font-size: 12px;
	padding-right: 10px;
	width: 290px;
	margin-left: auto;
	;
	margin-top: 0px;
}
#header_guide ul {
	list-style-type: none;
}
#header_guide ul li	{
	overflow: hidden;
	margin-right: 5px;
	float: left;
	font-size: 12px;
}
#header_guide ul li.last {
	display:block;
	margin-right:0px;
}

#header_contact {
	width: 242px;
	float: right;
}
#header_contact img {
	margin-top:15px;
}
#header_telfax {
	font-size:12px;
}
#header_telfax a {
	color:#333333;
	text-decoration:none;
}
#header_telfax span.red {
	color: #CF0003;
	font-weight: bold;
}


/*---- search_area ----*/

#header_wrap_kt_top {
	height:107px;
}


#header_wrap_kt {
	width:100%;
	height:50px;
	background-color:#333333;
}




h2#header_sagasu {
	width: 199px;
	height: 28px;
	margin-top: 6px;
	padding-top: 8px;
	background-color: #CB0003;
	color: #FFFFFF;
	font-size: 16px;
	font-weight: bold;
	text-align: center;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	float: left;
	display: block;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-left: 0px;
	padding-bottom: 0px;
	padding-right: 0px;
}


#header_searcharea{
	margin: 0 auto;/*ワイドBG用*/
	width: 1008px;
	background-color: #373133;
	/*height: 42px;*/
	margin-top: 0px;
}
#header_searcharea div.alignleft{
	width: 335px;
	float: left;
	margin-left: 20px;
	margin-top: 3px;
	margin-bottom:8px;
}
/* LONG版 */
#header_searcharea div.alignleft2 {
	width: 400px;
	float: left;
	margin-left: 5px;
	margin-top: 4px;
	margin-bottom: 0px;
}
/* ↑LONG版↑ */

#header_searcharea .alignright{
	text-align: right;
	width: 260px;
	margin-top: 2px;
}


/*#header_sicon {
	margin-top:6px;
	margin-left:9px;
	float:left;
}*/
#header_sform {
	margin-top: 2px;
	float: left;
}
@media all and (-ms-high-contrast:none){
#header_sform {
	margin-top:4px;
	margin-left:9px;
	float:left;
}
}
#header_sform input#search {
	padding-left:3px;
	padding-top:4px;
	padding-bottom:1px;
	padding-right:3px;
	font-size:15px;
	float: left;
}

/* LONG版 */
#header_sform {
	margin-top: 2px;
	float: left;
}
@media all and (-ms-high-contrast:none){
#header_sform {
	margin-top:4px;
	margin-left:9px;
	float:left;
}
}
#header_sform input#search {
	padding-left:3px;
	padding-top:4px;
	padding-bottom:1px;
	padding-right:3px;
	font-size:15px;
	float: left;
}
/* ↑LONG版↑ */


#header_sbutton {
	background-image: url(../../imgbtn/header_img/header_sbutton3.jpg);
	border: 0px;
	text-indent: -9999px;/*数字表示をブラウザ外に押しやる*/
	width: 60px;
	height: 37px;
	float: left;
	cursor:pointer;
}

.header_minirogo {
width: 100px;
float: left;
color: #FFFFFF;
padding-top: 11px;
margin-left: 0px;
}


.header_login {
	width:140px;
	float:left;
	/*height:32px;
	background-image:url(imgbtn/header_img/header_login.jpg);
	display: block;*/
}
/*#header_login a{
	display: block;
	height:32px;
	width:100px;
}
#header_login a:hover{
	display: block;
	background-image:url(imgbtn/header_img/header_loginr.jpg);
}*/


.header_regist {
width: 80px;
float: left;
color: #FFFFFF;
padding-top: 11px;
margin-left: 10px;
}
.header_regist a {
	text-align: center;
	font-size: 13px;
	color: #C5FEFF;
	display: block;
	padding-top: 4px;
	padding-bottom: 3px;
	border: 1px solid #C5FEFF;
	border-radius: 5px;
}
.header_regist a:hover {
background-color: #888888;
}


.header_newsbox {
	width:300px;
	float:left;
	padding-top:10px;
	background-color:#373133;
}

.header_maker {
	font-size: 10px;
	line-height: 1.2em;
	margin-bottom: 2px;
	display: block;
	color: #787878;
	padding-left: 5px;
}

#header_mylist {
	width: 92px;
	height: 23px;
	margin-top: 8px;
	margin-right: 5px;
	padding-top: 5px;
	background-color: #CB0003;
	color: #FFFFFF;
	text-align: center;
	font-size: 13px;
	float: left;
	border-radius: 4px;
}
/*.heder_login_b {
	padding-top:8px;
	margin-left:20px;
}*/

.heder_login_b {
width: 120px;
margin-left: auto;
margin-right: auto;
padding-top: 11px;
}


.heder_login_b a {
	text-align: center;
	font-size: 13px;
	color: #C5FEFF;
	display: block;
	padding-top: 4px;
	padding-bottom: 3px;
	border: 1px solid #C5FEFF;
	border-radius: 5px;
	margin-left:0px;
}
.heder_login_b a:hover {
background-color: #888888;
}



#header_fb {
	width:25px;
	float:right;
	margin-left:5px;
	margin-right:5px;
}
#header_tw {
	width:25px;
	float:right;
	margin-left:0px;
	margin-right:0px;
}
#header_mm {
	width:132px;
	float:right;
	margin-left:5px;
}


#header_reco {
	width: 100px;
	float: left;
	padding-top: 11px;
	margin-left: 15px;
}

#header_reco a {
	text-align: center;
	font-size: 13px;
	color: #FFFFFF;
	display: block;
	padding-top: 4px;
	padding-bottom: 3px;
	border: 1px solid #FFFFFF;
	border-radius: 5px;
	margin-left: 0px;
}
#header_reco a:hover {
background-color: #888888;
}


/*#header_reco a {
	width: 120px;
	height: 35px;
	display:block;
	background-image: url(/imgbtn/header_img/header_reco_b2.png);
	background-position: left top;
	background-repeat: no-repeat;
	color:#FFFFFF;
	padding-left:95px;
	padding-top:4px;
	text-align:center;
}*/

#header_reco2 {
	width: 140px;
	float: left;
	margin-top: 5px;
	margin-left: 214px;
}
#header_reco2 a {
	width: 45px;
	height: 24px;
	display:block;
	background-image: url(/imgbtn/header_img/header_reco_b.png);
	background-position: left top;
	background-repeat: no-repeat;
	color:#FFFFFF;
	padding-left:95px;
	padding-top:4px;
	text-align:center;
}


#header_shiryobox {
	width:240px;
	float:right;
	/*background-color:#FF5F00;*/
	margin-top:4px;
	margin-right:10px;
}
#header_shiryo_count {
	width: 90px;
	height: 35px;
	padding-top: 3px;
	padding-bottom: 3px;
	background-image: url(../../imgbtn/header_img/header_ordercount.png);
	background-position: left 3px;
	background-repeat: no-repeat;
	float: left;
}

span#header_cart_count {
	width: 50px;
	margin-left: 38px;
	font-size: 24px;
	text-align: center;
	display: block;
	font-weight: bold;
	color: #FB5500;
}

#header_shiryo_b {
	width:130px;
	height:40px;
	float:right;
	margin:0px;
	padding:0px;
}
#header_shiryo_b img {
	margin:0px;
	padding:0px;
}



.fixed{
  position: fixed;
  top: 25px;
  z-index: 9999;
}
.cb-header {
	z-index:99999 !important;
}


/****************************************

          Clearfix

*****************************************/

/*#container:after,*/
#header .menu > ul:after,
#header ul.menu:after,
.clearfix:after {
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	content: " ";
	font-size: 0;
}

/* clearfix for ie7 */
/*#container,*/
#header .menu > ul,
#header ul.menu,
.clearfix {
	display: inline-block;
}

/*#container,*/
#header .menu > ul,
#header ul.menu,
.clearfix {
	display: block;
}


/****************************************

         ニュース用

*****************************************/


#header_rogoarea .news_logo {
	margin-left: 10px;
	width: 250px;
	margin-bottom: 18px;
	padding-top: 8px;
}

#header_rogoarea .news_logo img{
		margin-top:5px;
}
input.header_news_search {
	width: 275px;
	float: left;
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
	padding-bottom: 5px;
	font-size: 17px;
	border-bottom-left-radius: 3px;
	border-top-left-radius: 3px;
	border: none;
}
.news_sh1 {
	padding-top:1px;
}
#header_searcharea div.news_sh2 {
	margin-bottom:7px;
}

#header_nsbutton {
	background-image: url(../../imgbtn/header_img/header_nsbutton.png);
	border: 0px;
	text-indent: -9999px;/*数字表示をブラウザ外に押しやる*/
	width: 100px;
	height: 29px;
	float: left;
	background-color:#373133;
}

	
/************************  タブレット・PC　ここまで　*****************************************/
	
}   /*     @media screen and (min-width:481px)     */
	

/************************  以下スマホ　*****************************************/

@media screen and (max-width:480px) {

	#header_wrap, #header_wrap_kt_top, #header_wrap_kt {
		display: none;
	}
	
	#sp_header_wrap {
		width: 100%;
	}
	
	#sp_header_logo_Box {
		width: 88%;
		padding-top: 5px;
    zoom: 1; /* float解除 for IE6/7  */
}
	#sp_header_logo_Box:after, #sp_header_logo_Box:before {
		content: "";
		clear: both;
		display: block;
	}

	#sp_header_logo {
		width: 40%;
		float: left;
		padding-left: 2%;
		margin-bottom: 15px;
	}	
	#sp_header_logo a img {
		height: 40px;
		width: auto;
		display: block;
	}

	/* スマイリング用  */
	#sp_header_logosr_Box {
		width: 70%;
		padding-top: 5px;
    zoom: 1; /* float解除 for IE6/7  */
}
	#sp_header_logosr_Box:after, #sp_header_logosr_Box:before {
		content: "";
		clear: both;
		display: block;
	}

	#sp_header_logosr {
		width: 40%;
		float: left;
		padding-left: 2%;
		margin-bottom: 15px;
	}	
	#sp_header_logosr a img {
		height: 40px;
		width: auto;
		display: block;
	}
	
@media print, screen and (max-width: 480px) {
	#sp_header_logosr {
		width: 88%;
		float: left;
		padding-left: 2%;
		margin-bottom: 15px;
	}	
}
	
	/* スマイリング用 end */
	
	
	
	
	#sp_header_Box {
		width: 94%;
		margin-left: auto;
		margin-right: auto;
		padding-top: 5px;
    zoom: 1; /* float解除 for IE6/7  */
}
#sp_header_Box:after, #sp_header_Box:before {
    content: "";
    clear: both;
    display: block;
}
	#sp_headerSearch_Box {
		width: 100%;
	}
	#sp_headerSearch_Box input[type="text"] {
		padding: 6px;
		font-size: 16px;
		width: 74%;
		margin-right: 1%;
	}
	
	#sp_headerSearch_Box input.headerSearchSubmit {
		width: 17%;
		padding-left: 10px;
		padding-right: 10px;
		padding-top: 6px;
		padding-bottom: 6px;
		border: none;
		background-color: #DB0003;
		font-size: 14px;
		color: #FFFFFF;
	}
	
	
/*******************      ************************/	
	
	.dl-menu.dl-subview li.dl-subviewopen > #kana > li.kana a {
	width: 16%;
	margin-left: 1%;
	margin-right: 1%;
	padding-top: 2%;
	padding-right: 0.5%;
	padding-left: 0.5%;
	padding-bottom: 2%;
		margin-bottom: 3%;
	display: block;
	float: left;
	border: 1px solid #FFFFFF;
	text-align: center;
	}
	
	.dl-menu.dl-subview li.dl-subviewopen > #kana > li.mTop a {
		margin-top: 4%;		
	}
	
	
	
	.dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 5%;
    zoom: 1; /* float解除 for IE6/7  */
}
.dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap:after, .dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap:before {
    content: "";
    clear: both;
    display: block;
}
	
	.dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap li a {
		display: block;;
		float: left;
		width: 100%;
		border-bottom: 1px solid #FFFFFF;
		text-align: center;
		padding-left: 0px;
		padding-right: 0px;
		padding-top: 4%;
		padding-bottom: 4%;	
	}
	
	ul#blockLinkWrap li:nth-child(2n+1) a {
		border-right: 1px solid #FFFFFF;
	}
	ul#blockLinkWrap li:nth-child(-n+2) a {
		border-top: 1px solid #FFFFFF;
	}
	
	
	
	.dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap2 {
		width: 96%;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 10%;
    zoom: 1; /* float解除 for IE6/7  */
}
.dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap2:after, .dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap2:before {
    content: "";
    clear: both;
    display: block;
}	
	
	.dl-menuwrapper .dl-menu.dl-menuopen > li ul#blockLinkWrap2 li a {
		display: block;;
		float: left;
		width: 29.5%;
		border: 1px solid #FFFFFF;
		text-align: center;
		margin-left: 1.5%;
		margin-right: 1.5%;
		margin-bottom: 5%;
		padding-left: 0px;
		padding-right: 0px;
		padding-top: 4%;
		padding-bottom: 4%;	
	}	
	
	
	
}  

