#top-display{
	position: relative;
  	padding: 0 0 50px;
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

#top-display li{
	font-family: 'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
}

.viewmore {
    width: 200px;
    margin: 20px auto 30px;
}

.viewmore:hover{
	opacity: 0.5;
}

.viewmore p{
    padding: 5px 20px 5px;
    text-align: center;
    font-size: 12px;
    border: 1px solid #dcdcdc;
  	color:#464e54;  
}

/* 共通 end*/

.title-box{
	width:100%;
}

.title-box h2{
  	display: inline;
 	letter-spacing: -1px;
	padding-left: 50px;
}

.viewall{
	float:right;
  	font-size: 15px;
  	text-align: right;
  	padding: 0px 5% 0px 0;
}

#free-space > div,
.news-title, .news-date,
.seller-name, .recommend-soldout, .recommend-price,
.product-list-name, .product-list-price{
  font-family: -apple-system,BlinkMacSystemFont,San Fransisco,Segoe UI,Helvetica Neue,Helvetica,Arial,"游ゴシック Medium",Yu Gothic Medium,"游ゴシック体",YuGothic,Yu Gothic,"メイリオ",Meiryo,MS PGothic,sans-serif;
  
}

/* top sns */
#top-sns-list {
  padding: 5px;
}

#top-sns-list ul {
  	float: right;
	list-style-type: none ;
  	padding: 0;
  	margin: 0;
}

#top-sns-list ul li{
  display: inline-block;
}

#top-sns-list img{
  width: 25px;
  height: 25px;
}


/* information start*/
#free-space > div{
	font-size: 12px;
   padding: 15px 0 15px 20px;
  letter-spacing: 1px;
}

/* information end*/

/* トップ画像 start*/
#picture-slider{	
	min-width:800px;
  	overflow: hidden;
  	margin-bottom:70px;
}

#picture-slider .bx-viewport{
  background: transparent: !important;
  border:none;
  -webkit-box-shadow:none;
  box-shadow: none;
  overflow: visible !important;
  height: 533px !important;
}

#picture-slider .bx-wrapper,
#picture-slider .bx-controls{
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
}

/* トップ画像 end*/

/* ニュース start*/
#blog-top ul{
	margin: 1% 5%;
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

#blog-top img{
  	border: 1px solid black;
}

#blog-top p{
  	font-size:13px;
  	margin:0;
}

.news-title{
  	padding-top:8px;
	font-weight: bold;
}

.news-date{
	font-size: 9px;
}
/* ニュース end*/

/* おすすめ start*/
#recommend ul{
  margin: 1% 1%;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

#recommend p{
	margin: 0px;
}

#recommend img{
  margin: 0px auto 10px;
}

.seller-name,
.recommend-name,
.product-list-name{
	font-weight: bold;
  	text-align: left;
}

.recommend-price,
.product-list-price{
	text-align:left;
}
/* おすすめ end*/

/* instagram */
#instagram-item ul {
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

#instagram-item ul  p.product-list-name > a{
	font-size:13px;
}
/* instagram end*/


/* サイズ別 css */
/* 全てのデバイスサイズに適用 */
@media (min-width: 980px) {
  /* デバイスサイズ 980px以下に適用 */
  #top-display li{
    min-height: 360px;
}
  
}
@media (max-width: 768px) {
  /* デバイスサイズ 768px以下に適用 */
  #top-display{
  	padding: 0;
  }
  
  #picture-slider{	
	min-width:100%;
   height: 250px;
  	margin-bottom:70px;
 }

#picture-slider > div{
  	width: 100%;
  	padding: 0;
  	margin: 0;
	list-style-type: none;
}

#slider{
  width: 100%;
  max-width: 100%;
  height: auto;
}

#picture-slider img{
  width:100%;
  display:block;
  margin: 0 auto;
}

#slider div{
  width:100%;
  max-width: 100%;
  height: auto;
}

#picture-slider .bx-wrapper,
#picture-slider .bx-viewport{
  border:none;
  -webkit-box-shadow:none;
    box-shadow: none;
}

#picture-slider .bx-wrapper,
#picture-slider .bx-controls{
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
}
  
  .title-box h2 {
   	padding-left: 15px;
    font-size: 20px;
  }
  
  .viewall {
  	font-size: 13px;
  }
  
#blog-top ul li{
  	margin-bottom:10px;
}

#recommend ul li {
  padding: 10px;
  margin-bottom:5px;  
} 
  
#instagram-item ul li{
  padding: 10px;
  margin: 0;
}
  
}


@media (max-width: 480px) {
  /* デバイスサイズ 480px以下に適用 */
}