@charset "utf-8";
@media print {
    img { display: none !important; }
}
/*--------------------------------

@common

last update 160613
v 1.1

--------------------------------*/
html,body{
	font-size:13px;
	font-family:'Noto Sans JP', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	letter-spacing:1px;
    word-break: break-all;
    word-wrap: break-word;
	height:100%;
	/*文字のアンチエイリアス設定*/
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;/*Firefox*/
	backround-color:#FFF;

}



img {
	-ms-interpolation-mode: bicubic;
	vertical-align:baseline;
}
.relative{
	position:relative;
	}
#wrapper{
	width:100%;
	height:100%;
	min-width:1024px;
	position:relative;
	opacity:0;
	-webkit-opacity:0;
	-moz-opacity:0;
	-webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;
}

#main{

	height:100%;
	background:#FFF;
}

section{
	height:100%;
	}

/*-------------------------------

@contents

-------------------------------*/
#contents{
	position:absolute;
	display:none;
	opacity:0;
	-webkit-opacity:0;
	-moz-opacity:0;
	width:100%;
	min-height:650px;
	overflow:hidden;
}

.activate{
	display:block;
}

.deactivate{
	display:none;
}
/*-------------------------------

@sidebar

-------------------------------*/
#sidebar{
	position:fixed;
	width:260px;
	min-height:100%;
	background-color:#e5004a;
	float:left;
}

/*-------------------------------

@navi

-------------------------------*/
#navi {
	margin:20px 0;
}

#navi li{
	text-align:center;
}

#navi li p img{
	padding:0;
	display:block;
}
#navi li p img:hover{
	background:#fff338;
}

#navi li p{
	cursor:pointer;
}
/*-------------------------------

@sakuhin navi

-------------------------------*/
#sakuhin_navi{
	box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
	padding:0;
	width:100%;
	min-width:964px;
	height:50px;
	border-right:1px solid #E5004A;
	border-bottom:1px solid #E5004A;
	background-color:#FFF;
	z-index:100;
	}
#sakuhin_navi li{
	display:inline-block;
	width:12.5%;
	min-width:120.5px;
	height:50px;
	font-weight:bold;
	color:#989898;
	line-height:50px;
	text-align:center;
	box-sizing:border-box;
	border-right:1px solid #E5004A;
	overflow:hidden;
	}
#sakuhin_navi li p{
	height:100%;	
	}
#sakuhin_navi li p a{
	display:block;
	color:#E5004A;
	width:100%;
	height:100%;
	line-height:50px;
	text-decoration:none;
	box-sizing:border-box;
	}
#sakuhin_navi li:last-child p a{
	line-height:1em;
	padding:12px 0;
	}
#sakuhin_navi li p a:hover{
	color:#fff338;
	background-color: #E5004A;
	}
#sakuhin_navi li .current{
	color:#fff338;
	background-color: #E5004A;
	}

/*-------------------
@preloader
-------------------*/
#preloader {
	width:200px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -100px;
	margin-left:-100px;
}

#preloader-ttl{
	position:absolute;
	display:block;
	top: 0%;
	left: 0%;
	margin-top: 0px;
	margin-left: 0px;
	z-index:3;
}

/*#preloader-txt{
	position:absolute;
	bottom: 0;
	left: 100%;
	margin-top: 0px;
	margin-left: 0px;
	z-index:2;
}*/
#preloader-anime{
	position:absolute;
	z-index:3;
	margin-top:150px;
	margin-left:85px;	
}


#progress-txt {
	display:block;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#e63663;
	z-index:4;
	position:absolute;
	top:142px;
	left:312px;
	width:60px;
}




/*-------------------------------

@flash
-------------------------------*/
#flash-container{
}


/*-------------------------------

@banner

-------------------------------*/
#banner-container{
}


#banner-container li{
}





/*-------------------------------

@SNS

-------------------------------*/
#social-container{
	position: absolute;
	top: 0;
	right: 15px;
	width: 335px;
	z-index: 20;
}

#social-container li{
	display:block;
	float:left;
	height:20px;
	padding:2px;
	display:inline-block;
	text-align:center;
}


#twitter{
}

#facebook-like{
	width:95px;
}

#line-btn{
	width:82px;
}

/*-------------------------------

@flex

-------------------------------*/
.flex{
	display: flex;
	flex-wrap: wrap;
	display: -webkit-flex; /* Safari */
	-webkit-flex-wrap: wrap; /* Safari */
}

.flex-center{
  -webkit-justify-content: center; /* Safari */
  justify-content:         center;
}

/*-------------------------------

@modules

-------------------------------*/
a{
}

a:hover{
}



.inner{
}