/*////////////////////////////////////////////////////////////

 RESET STYLE

////////////////////////////////////////////////////////////*/
html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td,
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
	vertical-align: baseline;
	font-family: inherit;font-weight: inherit;font-style: inherit;
	font-size: 100%;
	padding: 0;margin: 0;
	outline: 0;
	border: 0;
}
:focus {outline: 0;}
body {background: white; line-height: 1; color: black;}
ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {font-weight: normal; text-align: left;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
header, article, footer, article, aside, time ,nav { display: block; }



/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Base Layout

/////////////////////////////////////////////////////////////////////////////////////////////////*/

html, body {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
	font-size:16px; color: #333;
	-webkit-text-size-adjust:none;
}
button,
textarea { font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;}

a { color:#333; text-decoration:none;}

.y-box {
	background-color: #FFC926;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
}
.f-pink { color:#F83E71;}
.f-blue { color:#2692FF;}

.mt20 { margin-top:20px;}

/* Flick Pagination */
.flick-page { position:relative; width:100%; margin:20px auto 0; max-width:600px; font-size:0px; line-height:0;}
.top-flick .flick-page { max-width:650px;}

.page-list { text-align:center; letter-spacing: -.40em;}
.page-list a { margin:0 10px;}
.prev-btn, .next-btn, .on-mark span, .off-mark span {
	width:10px; height:12px; display:inline-block; letter-spacing:normal;
	background: url(../images/newst/flick_mark.gif) no-repeat;
	background-size: 40px 12px;
	-webkit-background-size: 40px 12px;
}
.off-mark span { background-position: 0 0;}
.on-mark span { background-position: -10px 0;}
.prev-btn {
	position:absolute; top:0; left:10px;
	background-position: -20px 0;
}
.next-btn {
	position:absolute; top:0; right:10px;
	background-position: -30px 0;
}


/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Header Layout

/////////////////////////////////////////////////////////////////////////////////////////////////*/

/* ダミーヘッダ */
header.global-header { width:100%; height:48px; position:fixed; top:0; left:0; z-index:999; text-align:center; background-color:#CCC;}
header.global-header h1 { padding-top:15px;}


/*/////////////////////////////////////////////////////////////////////////////////////////////////

 Content Layout

/////////////////////////////////////////////////////////////////////////////////////////////////*/

/*#contents { margin-top:130px;}*/

/* Flick Common */
.view { overflow: hidden; margin: 0 auto; -webkit-transform: translateZ(0);}
.flipsnap { padding:0;}
.flipsnap .item { display:block; float:left;}
.flipsnap .item img { display:block;}

/* Flick Area */
#contents .top-flick.view { width:650px;}
#contents .top-flick .flipsnap { height:217px;}
#contents .top-flick .flipsnap li img { width:650px;}

#contents .sec.series .view { width:600px;}
#contents .sec.series .flipsnap ul { width:600px;}
#contents .sec.series .flipsnap .item { width:96px; padding:0 2px 4px;}
#contents .sec.series .flipsnap img { width:96px; height:96px;}

#contents .sec.trouble .view { width:600px;}
#contents .sec.trouble .flipsnap ul { width:600px;}
#contents .sec.trouble .flipsnap .item { width:96px; padding:0 2px 4px;}
#contents .sec.trouble .flipsnap img { width:96px; height:96px;}

#contents .sec.tec .view { width:600px;}
#contents .sec.tec .flipsnap ul { width:600px;}
#contents .sec.tec .flipsnap .item { width:96px; padding:0 2px 4px;}
#contents .sec.tec .flipsnap img { width:96px; height:96px;}

#contents .sec.rec .view { width:600px;}
#contents .sec.rec .flipsnap ul { width:600px;}
#contents .sec.rec .flipsnap .item { width:96px; padding:0 2px 4px;}
#contents .sec.rec .flipsnap img { width:96px; height:96px;}

#contents .sec.rec2 .view { width:600px;}
#contents .sec.rec2 .flipsnap ul { width:600px;}
#contents .sec.rec2 .flipsnap .item { width:96px; padding:0 2px 4px;}
#contents .sec.rec2 .flipsnap img { width:96px; height:96px;}

#contents header .top-flick { margin-bottom:20px;}
#contents header .head-nav { height:52px; padding:0 20px; background-color:#FAFAF3; border-bottom:#E2E2BA 1px solid; border-top:#E2E2BA 1px solid;}
#contents header .head-nav .input-area { float:right; width:42%; margin-top:8px; position:relative;}
#contents header textarea {
	width:80%; margin-right:2px; position:absolute; top:0; right:0;
	font-size:100%; color: #333; padding:3px 18% 3px 2%;
	border: #E2E2BA 1px solid;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-webkit-appearance: none;
	resize: none;
}
#contents header button.search2 {
	width:auto; font-size:86%; color:#FFF; position:absolute; top:3px; right:3px;
	border: #FB7D9E 1px solid; padding: 2px 8px 1px;
	background: -webkit-gradient(linear, left top, left bottom, from(#FB7093), to(#F83067));
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-webkit-appearance: none;
}

#contents .search_area {height : 30px; padding: 0 5px 0 10px;}
#contents .search_area .input-area {margin:10px 15px 0 10px; position:relative;}
/*
#contents .search_area textarea {
	width:80%; margin-right:2px; position:absolute; top:0; right:0;
	font-size:100%; color: #333; padding:3px 18% 3px 2%;
	border: #E2E2BA 1px solid;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-webkit-appearance: none;
	resize: none;
}
*/
#contents .search_area input.search_area {
	width:90%;
	height:32px;
	margin:0 0 0 -1px;
	font-size:100%;
	color: #333;
	padding:3px 2%;
	border: #E2E2BA 1px solid;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-webkit-appearance: none;
	resize: none;
}
#contents .search_area button.search2 {
	width:auto; font-size:86%; color:#FFF; /*position:absolute; top:3px; right:4px;*/
	border: #FB7D9E 1px solid; padding: 0;
	background: -webkit-gradient(linear, left top, left bottom, from(#FB7093), to(#F83067));
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-webkit-appearance: none;
	line-height:20px;
	height: 32px;
	width: 8%;
	margin: 0 3px 0 0;
	float: right;	
}

#contents header .head-nav .nav-area { float:left;}
#contents header .nav-area li { float:left; margin-right:5px;}
#contents header .nav-area li a { display:block; margin-top:10px; margin-bottom:5px; padding:5px 10px 5px 0; border-right:#EBEBCF 1px solid; }
#contents header .nav-area li:last-child a { border-right:none;}
#contents header .nav-area li h2 { color: #333333; display:inline-block; font-size:79%;}

/* アイコン */
#contents header .nav-area li span {
	width:22px; height:22px; display:inline-block; vertical-align:middle; margin-right:2px;
	background: url(../images/newst/icon1.gif) no-repeat;
	background-size: 88px 22px;
	-webkit-background-size: 88px 22px;
}
#contents header .nav-area .icon1 { background-position: 0 0;}
#contents header .nav-area .icon2 { background-position: -22px 0;}
#contents header .nav-area .icon3 { background-position: -44px 0;}
#contents header .nav-area .icon4 { background-position: -66px 0;}

/* バナー */
#contents .bnr-list { width:656px; margin:20px auto; }
#contents .bnr-list li { float:left; width:150px; margin:0 7px;}
#contents .bnr-list li img { display:block; width:150px;}

#contents .bnr-list2 { text-align:center; background-color:#E8F2F8 ; padding:10px 0 !important;}

/* セクション */
#contents .sec { padding:0 20px; margin-bottom:20px;}
#contents .sec.no-margin { margin-bottom:0;}
/* セクションタイトル */
#contents .sec h2 {
	color:#FFF; font-size:115%; padding:10px 5px 10px 35px; margin-bottom:10px; position:relative;
	background: #62A7CE url(../images/newst/ttl_mark.png) no-repeat 10px center;
	background-size: 16px 18px;
	-webkit-background-size: 16px 18px;
	border-radius: 4px;
	-webkit-border-radius: 4px;
}
#contents .sec h2.no-margin { margin:0;}
#contents .sec h2 .y-box { position:absolute; top:5px; right:5px; font-size:12px; padding:7px 8px;}

/* 商品を探す ｜ 人気コンテンツ */
#contents .sec .search2 {}
#contents .sec .search2 li { float:left; width:33.3%; border-bottom:#D6F0F8 1px dashed; padding:6px 0;}
#contents .sec .search2 li a { display:block; padding:10px 0; border-right:#D6F0F8 1px solid;}
#contents .sec .search2 li:nth-child(3n) a { border-right:none;}
#contents .sec .search2 li h3 { display:inline-block; font-size:100%;}

#contents .sec .search2 li span {
	width:24px; height:24px; display:inline-block; vertical-align:middle; margin-right:6px; margin-left:10px;
	background: url(../images/newst/icon2.gif) no-repeat;
	background-size: 384px 48px;
	-webkit-background-size: 384px 48px;
}

/* 商品を探すアイコン */
#contents .sec .search2.item .icon1  { background-position: 0 0;}
#contents .sec .search2.item .icon2  { background-position: -24px 0;}
#contents .sec .search2.item .icon3  { background-position: -48px 0;}
#contents .sec .search2.item .icon4  { background-position: -72px 0;}
#contents .sec .search2.item .icon5  { background-position: -96px 0;}
#contents .sec .search2.item .icon6  { background-position: -120px 0;}
/* 人気コンテンツアイコン */
#contents .sec .search2.cont .icon1  { background-position: 0 -24px;}
#contents .sec .search2.cont .icon2  { background-position: -24px -24px;}
#contents .sec .search2.cont .icon3  { background-position: -48px -24px;}
#contents .sec .search2.cont .icon4  { background-position: -72px -24px;}
#contents .sec .search2.cont .icon5  { background-position: -96px -24px;}
#contents .sec .search2.cont .icon6  { background-position: -120px -24px;}
#contents .sec .search2.cont .icon7  { background-position: -144px -24px;}
#contents .sec .search2.cont .icon8  { background-position: -168px -24px;}
#contents .sec .search2.cont .icon9  { background-position: -192px -24px;}
#contents .sec .search2.cont .icon10 { background-position: -216px -24px;}
#contents .sec .search2.cont .icon11 { background-position: -240px -24px;}
#contents .sec .search2.cont .icon12 { background-position: -264px -24px;}
#contents .sec .search2.cont .icon13 { background-position: -288px -24px;}
#contents .sec .search2.cont .icon14 { background-position: -312px -24px;}
#contents .sec .search2.cont .icon15 { background-position: -336px -24px;}
#contents .sec .search2.cont .icon16 { background-position: -360px -24px;}

/* カテゴリー */
#contents .search-cd-wrap { overflow:hidden; height:0; margin-top: -6px;}
#contents .search-cd { margin:10px 10px 20px; padding:10px; background-color:#B0D3E6; position:relative;}
#contents .search-cd img { display:block; width:16px; position:absolute; top:-8px; left:50%; margin-left:-8px;}
#contents .search-cd ul {
	background-color:#FFF;
	border-radius: 4px;
	-webkit-border-radius: 4px;
}
#contents .search-cd li { float:left; width:33.3%; border-top:#D6F0F8 1px dashed; padding:6px 0;}
#contents .search-cd li:nth-child(1),
#contents .search-cd li:nth-child(2),
#contents .search-cd li:nth-child(3) { border-top:none;}
#contents .search-cd li a { display:block; padding:10px 0; border-right:#D6F0F8 1px solid;}
#contents .search-cd li:nth-child(3n) a { border-right:none;}
#contents .search-cd li h3 { display:inline-block; font-size:100%;}

#contents .search-cd li span {
	width:24px; height:24px; display:inline-block; vertical-align:middle; margin-right:6px; margin-left:10px;
	background: url(../images/newst/icon8.jpg) no-repeat;
	background-size: 360px 24px;
	-webkit-background-size: 360px 24px;
}
#contents .search-cd .icon1  { background-position: 0 0;}		#contents .search-cd .icon1+h3 { color:#D84D8B;}
#contents .search-cd .icon2  { background-position: -24px 0;}	#contents .search-cd .icon2+h3 { color:#B0A68A;}
#contents .search-cd .icon3  { background-position: -48px 0;}	#contents .search-cd .icon3+h3 { color:#CD337E;}
#contents .search-cd .icon4  { background-position: -72px 0;}	#contents .search-cd .icon4+h3 { color:#D27F83;}
#contents .search-cd .icon5  { background-position: -96px 0;}	#contents .search-cd .icon5+h3 { color:#FFBF00;}
#contents .search-cd .icon6  { background-position: -120px 0;}	#contents .search-cd .icon6+h3 { color:#2778B2;}
#contents .search-cd .icon7  { background-position: -144px 0;}	#contents .search-cd .icon7+h3 { color:#C45D79;}
#contents .search-cd .icon8  { background-position: -168px 0;}	#contents .search-cd .icon8+h3 { color:#7AC5A6;}
#contents .search-cd .icon9  { background-position: -192px 0;}	#contents .search-cd .icon9+h3 { color:#6DBA7F;}
#contents .search-cd .icon10 { background-position: -216px 0;}	#contents .search-cd .icon10+h3 { color:#EBB224;}
#contents .search-cd .icon11 { background-position: -240px 0;}	#contents .search-cd .icon11+h3 { color:#DFAAB7;}
#contents .search-cd .icon12 { background-position: -264px 0;}	#contents .search-cd .icon12+h3 { color:#060607;}
#contents .search-cd .icon13 { background-position: -288px 0;}	#contents .search-cd .icon13+h3 { color:#CD5753;}
#contents .search-cd .icon14 { background-position: -312px 0;}	#contents .search-cd .icon14+h3 { color:#195D98;}
#contents .search-cd .icon15 { background-position: -336px 0;}	#contents .search-cd .icon15+h3 { color:#CA0400;}

/* SNS系アイコン */
#contents .sec .sns { width:100%; text-align:center; margin-top:20px; letter-spacing: -.40em;}
#contents .sec .sns p { display:inline-block; margin:0 20px; letter-spacing:normal;}
#contents .sec .sns a {
	width: 28px; height: 28px; display: inline-block;
	background: url(../images/newst/icon5.png) no-repeat;
	background-size: 140px 28px;
	-webkit-background-size: 140px 28px;
	text-indent: -9999px;
	overflow: hidden;
}
#contents .sec .sns a.icon1 { background-position: 0 0;}
#contents .sec .sns a.icon2 { background-position: -28px 0;}
#contents .sec .sns a.icon3 { background-position: -56px 0;}
#contents .sec .sns a.icon4 { background-position: -84px 0;}
#contents .sec .sns a.icon5 { background-position: -112px 0;}

/* 注目ワード */
#contents .sec .key2 {
	display:inline-block; font-size:86%; padding:5px 8px; margin:5px 5px 5px 0;
	background-color:#F3F1E4;
	border-radius: 4px;
	-webkit-border-radius: 4px;
}

/* 売れ筋ランキング */
#contents .sec.rank-area .flick-page { display:none;}
#contents .sec.rank-area ul { width:600px; margin:0 auto;}
#contents .sec.rank-area li { float:left; width:96px; padding:0 2px; padding-bottom:35px; position:relative;}
#contents .sec.rank-area li p.rank { font-weight:bold; text-align:center; letter-spacing:0.1em; margin-bottom:2px;}
#contents .sec.rank-area li p.rank span.num { font-size:129%;}
#contents .sec.rank-area li p.rank span.icon {
	width:16px; height:8px; display:inline-block; margin-right:1px;
	background: url(../images/newst/icon3.gif) no-repeat;
	background-size: 64px 8px;
	-webkit-background-size: 64px 8px;
}
#contents .sec.rank-area .rank1 { color:#FDA01F;}
#contents .sec.rank-area .rank2 { color:#AAAAAA;}
#contents .sec.rank-area .rank3 { color:#B65B34;}
#contents .sec.rank-area .rank-out { color:#4389BC;}
#contents .sec.rank-area li p.rank1 span.icon { background-position: 0 0;}
#contents .sec.rank-area li p.rank2 span.icon { background-position: -16px 0;}
#contents .sec.rank-area li p.rank3 span.icon { background-position: -32px 0;}
#contents .sec.rank-area li p.rank-out span.icon { background-position: -48px 0;}

#contents .sec.rank-area li a.img { display:block; padding:8px; border:#CCC 1px solid;}
#contents .sec.rank-area li img { display:block; width:80px; height:80px;}

#contents .sec.rank-area li .item-data { padding:4px; font-size:72%; line-height:1.2em;}
#contents .sec.rank-area li .item-data span { display:block; color:#FF4D4D; margin-top:4px;}

#contents .sec.rank-area li .icon-list { position:absolute; bottom:0; left:0; width:100px; text-align:center; letter-spacing: -.40em;}
#contents .sec.rank-area li .icon-list p { display:inline-block;}
#contents .sec.rank-area li .icon-list a {
	width: 30px; height: 30px; display: inline-block; letter-spacing:normal; margin-right:15px;
	background: url(../images/newst/icon4.gif) no-repeat;
	background-size: 60px 30px;
	-webkit-background-size: 60px 30px;
	text-indent: -9999px;
	overflow: hidden;
}
#contents .sec.rank-area li .icon-list p:last-child a { margin:0;}
#contents .sec.rank-area li .icon-list a.icon1 { background-position: 0 0;}
#contents .sec.rank-area li .icon-list a.icon2 { background-position: -30px 0;}

/* 投稿された体験談 */
#contents .sec.stories li { position:relative; padding-bottom:10px; margin-bottom:10px; height:82px; border-bottom:#D6F0F8 1px dashed;}
#contents .sec.stories li:last-child { border-bottom:none;}
#contents .sec.stories li img { position:absolute; top:0; left:0; display:block; width:82px;}
#contents .sec.stories li div { padding-left:90px;}
#contents .sec.stories li h3,#contents .sec.stories li p{ font-size:86%; line-height:1.4em; margin-bottom:4px;}
#contents .sec.stories li h3.ttl { color:#32ACD3;}
#contents .sec.stories li p.story { font-size:80%;}
#contents .sec.stories li p.story span { display:block;}
#contents .sec.stories li a {
	display:inline-block; color:#FDA01F; font-size:86%; padding:5px 8px;
	border:#FDA01F 1px solid;
	background-color:#F8F7F3;
	border-radius: 4px;
	-webkit-border-radius: 4px;
}



@media screen and (max-width: 760px) {

	#contents header .head-nav .input-area { width:34%;}

}

@media screen and (max-width: 680px) {
	
	html, body { font-size:15px;}
	
	.flick-page { margin-top:15px;}
	#contents .sec.rank-area .flick-page { display:block;}
	
	#contents .top-flick.view { width:300px;}
	#contents .top-flick .flipsnap { height:100px;}
	#contents .top-flick .flipsnap li img { width:300px;}
	
	#contents .sec.series .view { width:300px;}
	#contents .sec.trouble .view { width:300px;}
	#contents .sec.tec .view { width:300px;}
	#contents .sec.rec .view { width:300px;}
	#contents .sec.rec2 .view { width:300px;}

	#contents .sec.rank-area .view { width:300px;}
	#contents .sec.rank-area .flipsnap .item { width:96px; padding:0 2px; padding-bottom:35px; position:relative;}
	
	#contents header .head-nav { height:auto; padding:5px 0; }
	#contents header .head-nav .input-area { width:95%; float:none; height:30px; margin:0 auto;}
	#contents header textarea { margin-right:0; position:absolute; top:0; right:inherit; left:0;}
	#contents header button.search2 { position:absolute; top:6px; right:-1px;}
	
	#contents header .head-nav .nav-area { clear:both; float:none;}
	#contents header .nav-area li { float:left; width:25%; margin-top:5px; margin-right:0; text-align:center;}
	#contents header .nav-area li a { margin-top:5px; margin-bottom:0px; padding:5px 0 10px; border-right:#EBEBCF 1px solid;}
	#contents header .nav-area li:last-child a { border-right:none;}
	#contents header .nav-area li h2 { display:block; padding-top:5px;}
	
	#contents .bnr-list { width:308px; margin:10px auto; }
	#contents .bnr-list li { float:left; width:150px; margin:2px;}
	
	#contents .sec { padding:0 8px;}
	#contents .sec .search2 li { width:50%; padding:6px 0; height: 21px;}
	#contents .sec .search2 li a { padding:2px 0;}
	#contents .sec .search2 li:nth-child(3n) a { border-right:#D6F0F8 1px solid;}
	#contents .sec .search2 li:nth-child(2n) a { border-right:none;}
	
	#contents .search-cd { margin:10px 0 20px;}
	#contents .search-cd img { position:absolute; top:-8px; left:25%;}
	#contents .search-cd li { width:50%; padding:6px 0;}
	#contents .search-cd li:nth-child(3) { border-top:#D6F0F8 1px dashed;}
	#contents .search-cd li a { padding:2px 0;}
	#contents .search-cd li:nth-child(3n) a { border-right:#D6F0F8 1px solid;}
	#contents .search-cd li:nth-child(2n) a { border-right:none;}
	
	#contents .sec .sns p { margin:0 10px;}
	
	#contents .sec.stories li { height:auto;}
	#contents .sec.stories li a { display:block; text-align:center;}

	#contents .search_area .input-area {margin:10px 0;}
	
	#contents .search_area input.search_area {
		width:80%;
	}
	#contents .search_area button.search2 {
		width: 17%;
	}
		
}

/* 移行期間暫定対応：新ヘッダーの際には削除*/
#head h1{font-size: 9px;}


/*/////////////////////////////////////////////////////////////////////////////////////////////////

 clerfix

/////////////////////////////////////////////////////////////////////////////////////////////////*/

.clearfix:after{
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
} /*IE7?O_uEU*/

.clearfix{display:inline-block;} /*IE7MacIE5*/

/*Hides from IE-mac\*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/*End hide from IE-mac*/ /*IE6?O*/


#tab {
width: 315px;
}
#tab:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}
#tab img {
float: left;
}