@charset "shift_jis";

/*************************/
/* 　 園芸ペット専門店　 */
/*************************/

/************************* 　 PC・スマホ共通　 *************************/
#shop_common{
	margin: 0;
	list-style: none;
	text-align:left;
}
#shop_common a:hover, #shop_common a:hover img{
	opacity: 0.75;
}
/*画像の角丸と線とか装飾*/
#shop_common .toku_daibana ul li img, #shop_common .toku_daibana h4 img, #shop_common .gp_navi li.bot_banner img{
	border-radius: 5px;
	border:solid 1px #ccc;
	box-sizing: border-box;
}
#shop_common .toku{
	border-top:1px #999 dashed;}

/************************* 　 PC開始　 *************************/

@media (min-width: 750px){
#shop_common{ width: 750px;}
	
/*PCのみ表示*/
#shop_common .pc_only{ display: block;}
#shop_common .smp_only{ display: none;}
	
/* ナビゲーション */
#shop_common .gp_navi{
	width:738px;
	height:223px;
	margin:0 6px;
	background:url(../../img/gp_index/gpindex_bot_bk.gif) repeat-x;
	overflow:hidden;}
	
#shop_common .gp_navi li{
	float:left;
	width:246px;
	text-align: center;}
	
#shop_common .gp_navi li.small_bot{
	margin-top:17px}
	
#shop_common .gp_navi li.garden_bot{
	margin-top:21px;
	width:356px;}
	
#shop_common .gp_navi li.garden_bot p{
	padding-left:14px;
	text-align:left;}
	
	
/* カテゴリリスト */
#shop_common .gp_list h4{
	margin:0 4px 0 5px;}
	
#shop_common h3 div.gp_cate{
	width:750px;
	height:35px;
	text-indent:-1000px;
	background:url(../../img/gp_index/gpindex_list_top.gif) 0 bottom no-repeat;
	overflow:hidden;}

#shop_common .gp_list{
	width:748px;
	padding-bottom:16px;
	border-left:1px solid #D9AD03;
	border-right:1px solid #52842C;
	background:url(../../img/gp_index/gpindex_list_bottom.jpg) -1px bottom no-repeat;
	line-height:170%;
	overflow:hidden;}

#shop_common .gp_list_l, #shop_common .gp_list_r{
	width:187px;
	overflow:hidden;
    background: url(../../img/gp_index/gpindex_list_garden_bk2.gif) 0 0 repeat-y;
	float:left;}
	
#shop_common .gp_list_l:first-child{
    background: none;}
	
#shop_common .gp_list_l ul, #shop_common .gp_list_r ul{
	width:178px;
	margin:0 4px 0 5px;}

#shop_common .gp_list_l ul li, #shop_common .gp_list_r ul li{
	float:none;
	width:auto;
	padding-left:10px;}
	
#shop_common .gp_list_l ul li{
	background:url(../../img/gp_index/gpindex_list_pet_ya.gif) 0 5px no-repeat;}
	
#shop_common .gp_list_r ul li{
	background:url(../../img/gp_index/gpindex_list_garden_ya.gif) 0 5px no-repeat;}

#shop_common .gp_list_l ul.list_wan{
	background:url(../../img/gp_index/gpindex_list_wan_bk.jpg) right 0 no-repeat;}
	
#shop_common .gp_list_l ul.list_nyan{
	background:url(../../img/gp_index/gpindex_list_nyan_bk.jpg) right 0 no-repeat;}
	
#shop_common .gp_list_l ul.list_small{
	background:url(../../img/gp_index/gpindex_list_small_bk.jpg) right 0 no-repeat;}
	
#shop_common .gp_list_r ul{
	background:url(../../img/gp_index/gpindex_list_garden_bk.jpg) 120px 0 no-repeat;}

#shop_common .gp_list a:hover{
	background:#D7F2FF;}

/*特集1*/
#shop_common .toku{
	width:750px;
	overflow:hidden;
	margin:25px 0 50px;
	border-top:1px #999 dashed;}
	
#shop_common .toku h3{
	padding-top:25px;} 
	
#shop_common .toku .toku_daibana{
	margin: 10px auto;}
	
#shop_common .toku .toku_daibana h4{
	width:590px;
	float:left;
	margin-top: 10px;}
	
#shop_common .toku .toku_daibana:nth-child(odd) h4{
	float:right;
	margin-bottom: 8px;}

#shop_common .toku .toku_daibana ul{
	width:152px;
	font-size:12px;
	margin: 10px 0 10px;
	float:right;}
	
#shop_common .toku .toku_daibana:nth-child(odd) ul{
	float:left;
	margin: 18px 0 0;}


/* 特集一覧*/
#shop_common #contentslist h3{
	margin-top: 30px;}
	
#shop_common #contentslist li{
	float: left;}
	
#shop_common #contentslist .ul_content {
	width: 750px;
	overflow: hidden;}
	
#shop_common #contentslist .ul_content li {
	padding: 20px 0 5px 0;
	width: 175px;
	margin-right: 16px;}
	
#shop_common #contentslist .ul_content li:nth-child(4n){
	margin-right: 0px;}
	
#shop_common #contentslist .ul_content dd{
	padding: 10px;}
	
#shop_common #contentslist .ul_content a {
	font-size:12.3px;}

#shop_common #contentslist a:hover p,#shop_common #contentslist .ul_content a:hover p span {
	text-decoration: underline;}
	
#shop_common #contentslist dt a:visited {
	color: #8B008B;}

#shop_common #contentslist a:hover img{
  filter: alpha(opacity=80);
  opacity:0.8;} 

#shop_common #contentslist li:nth-of-type(n+9){
	display:none;}

/* 特集一覧をもっと見る*/
#shop_common #contentslist .more{
	text-align: right;
	font-size: 14px;
	margin:0 auto 30px;}

#shop_common #contentslist .more a {
	color:#FAB454;
	font-weight: bold;}
	
#shop_common #contentslist .more a::before {
    content: "";
    position: relative;
    top: 5px;
    margin-right: 3px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("/image/kaden_shop/more2.jpg");}
}
/************************* 　 PC終了　 *************************/

/************************* 　 スマホ開始　 *************************/
@media (max-width: 749px){
#shop_common {
	width:100%;}
	
#shop_common a, #contentslist a{
	text-decoration: none;}
	
/*スマホのみ表示*/
#shop_common .pc_only{
	display: none;}
	
#shop_common .smp_only{
	display: block;}
	
/* ナビゲーション */
#shop_common .gp_navi{
	width:100%;}
	
#shop_common .gp_navi li{
	float:left;
	width:50%;}
	
#shop_common .gp_navi li.bot_banner{
	width:96%;
	margin: 5% 2%;}
	
#shop_common .gp_navi li.bot_banner img{
	margin-top: 2%;}
	
/*特集1*/
#shop_common .toku{
	width:100%;
	overflow:hidden;
	margin:5% 0;}
	
#shop_common .toku h3{
	padding-top: 10%;
	width: 150%;
	margin-left: -50%;}
	
#shop_common .toku a{
	line-height: 200%;}
	
#shop_common .toku_daibana{
	width:100%;
	overflow:hidden;}
	
#shop_common .toku_daibana h4{
	margin: 4% 0;}
	
#shop_common .toku_daibana ul{
	float:left;
	width:100%;
	margin: 1% 0;
	font-size:12px;}
	
#shop_common .toku_daibana ul li{
	padding-bottom:5px;
	width:49%;
	text-align: center;}
	
#shop_common .toku_daibana ul li{
	float:left;}
	
#shop_common .toku_daibana ul li:nth-child(odd){
	float:right;}
	
/* 特集一覧*/
#contentslist {
	margin:0 auto;
	width:100%;
	text-align:center;
	padding:0 0 40px 0;
    overflow:hidden;}
	
#contentslist li {
	float:left;}
	
#contentslist h3{
	overflow: hidden;}
	
#contentslist h3 img{
	width:150%;
	margin:5% -25%;}
	
#contentslist .ul_content{
	padding:0 2%;
	width:96%;
	text-align:left;
	font-size:0;}
	
#contentslist .ul_content li {
	width:32%;
	text-align:left;
	vertical-align:top;
	display:inline-block;
	float:none;}
	
#contentslist .ul_content li:nth-child(3n+2){
	padding:0 2%;}
	
#contentslist .ul_content li img {
	width:100%;}

#contentslist .ul_content dl {
	line-height:130%;
	font-size:3vw;}

#contentslist a:hover,#contentslist .ul_content a:hover span {
	color: #F93;}

#contentslist a:hover img{
  filter: alpha(opacity=60);
  opacity:0.6;} 

#contentslist .ul_content a span {
	color:#F00;
	font-weight:bold;
	text-decoration:underline;}
	
#contentslist .ul_content p{
	padding:5px 0;
	text-align:left;
	font-weight:normal;}
	
#contentslist .p_top {
	padding-bottom:50px;}

/*すべて見るボタン*/
dl.allr{
	text-align:right;
	padding:0 0 0 2%;}
	
dl.allr img{
	width:80%;
	margin:0 0 0 2%;}
	
dl.allr dt{
	margin:45px 0 10px 0;}
	
dl.allr dd{
	text-align:left;}
	
dl.allr dd ul li{
	margin:0 0 15px 0;
	font-size:110%;}
	
dl.allr dd ul li p{
	font-size:80%;}
	
dl.allr dd a{
	padding:5px 0px 0px 25px;
	background:url(../../img/smp/textlink_arrow.png) no-repeat center left;
	background-size:20px;}

dl.allr2{
	text-align:right;}
	
dl.allr2 img{
	width:80%;
	margin:0 0 2% 0;}

dl.allr2 #contentslist .ul_content dl {
	margin:0;}
}
/************************* 　 スマホ終了　 *************************/