@charset "UTF-8";
/* 
特設サイト追記部分
*/
/*----------------------------------------------------
  全体
----------------------------------------------------*/
body {
	background:none;  /* 一旦、背景画像を消す。 */
}
body::before {
	/*background: url() no-repeat center -15px;*/
	background-size: 100% auto;
	display: block;
    position: fixed;  /* スマホ用にコレで代替。 */
    top: 0;
    left: 0;
    width: 100%;  /* サイズ指定。 */
    height: 100%;  /* サイズ指定。 */
    padding-bottom: 0;
    content: "";
    z-index: -1;
}
*, *:before, *:after {
	box-sizing : border-box;
}

/*------------------------------------------------------------------------------------------clearfix、マージン関連*/
.clearfix {
 *zoom : 1;
}
.clearfix:after {
	content : ' ';
	display : table;
	clear : both;
}
/*----------------------------------------------------
  PCとタブレット・スマホの切り替え
----------------------------------------------------*/
.nonpc {
	display: block;
}
.pc {
	display: none;
}

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ブレークポイント・PC*/
@media screen and (min-width: 768px) {
.nonpc {
	display: none;
}
.pc {
	display: block;
}
}
img {
	vertical-align : bottom;
}
/*------------------------------------------------------------------------------------------a*/
a {
	opacity: 1;
	color : #000;
	text-decoration : none;
	transition: all .0s;
}
a:active, a:hover {
	color : #000;
	outline : 0;
}
@media screen and (min-width: 768px) {
a {
	transition: all .3s;
}
}
/* ====================================================
　c-mainImg
==================================================== */
#c-mainImg {
	width: 100%;
	height: 100%;
	margin: 0 0 7% 0;
	padding:0;/*171107修正*/
	text-align: center;
}
#c-mainImg img {
	width: 100%;
	min-width: 100%;
	height: auto;
	margin: 0 auto;
}


/* ====================================================
　category_block
==================================================== */
#category_block {
	height: auto;
}
#category_block ul {
	font-size: 120%;
	padding: 0 /*2%*/;
	text-align: center;
	letter-spacing: -.40em; /* 文字間を詰めて隙間を削除する */
}
#category_block ul li {
	display: inline-block;
	vertical-align: middle;
	letter-spacing: normal;  /*文字間を通常に戻す */
    margin-right: 17px;
}
#category_block ul li:last-child {
    margin-right: 0;
}
#category_block ul li a {
	text-decoration: none;
	color: #000;
	border: 2px solid #f288c9;
    padding: 5px 9px;
    margin-bottom: 14px;
}
#category_block ul li a:hover,
#category_block ul li.liActive a {
	background: #f4dfec;
	border: 2px solid #e75297;
}

/*----------------------------------------------------
  c-block
----------------------------------------------------*/
.c-block {
	width: 100%;
	padding: 0;
}
/* ====================================================
　リスト設定
==================================================== */
.photo-list {
	width: 100%;
	padding: 5% 4% 0 4%;
}
.c-shopList {
	width: 96%;
	margin: 0 2%;
	display: table; /* or inline-table */
	border-collapse: collapse;/*border: 2px solid #2ab7e0;*/
}

/* grid */
.grid {
	margin: 0 0 0 -20px;
	overflow: hidden;
	background-color: transparent;
}
[class*='col-'] {
	float: left;
	padding-left: 20px;
	padding-bottom: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.col-1-2 {
	width : 50%;
}
/*----------------------------------------------------
  link_box
----------------------------------------------------*/
.link_box {
	position: relative;
	width: 100%;
	margin: 0px auto;
	overflow: hidden;
}
.photo {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.photo:before {
    content:"";
    display: block;
    padding-top: 100%;
}

.photo p{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
.photo .contain {
    position: absolute;
    display: inline-block;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.link_box .secTxt {
	padding: 10px 0 0 0;
	/*min-height: auto;*/
}

.link_box .secTxt .category_txt{
	color: #606060;
	font-size : 85%;
	line-height : 1.3;
	vertical-align: middle;
	display: table-cell;
	text-align: left;
	padding: 3px 0 10px 0;
	/*height: 5.0em;/*ショップ名が長くなった時高さを設定*/
	/*min-height: 2em;*/
	display: block;
}

.link_box .secTxt .lead {
	width: 100%;
	font-size : 100%;
	line-height: 1.7;
	text-align: left;
	overflow: hidden;
  width: 100%;
  height: 60px;
}
.link_box a:hover {
	text-decoration: none;
}
.link_box a {
	display: block;
	height: 100%;
}
.link_box a .photo .contain {
	width: 100%;
	height: 100%;
}
.link_box a:hover .photo .contain {
}

/* new表記*/
.photo-list a {
	display : block;
	position : relative;
	overflow : hidden;
}
.photo-list a.new:after {
	content : 'NEW';
	display : inline-block;
	position : absolute;
	top : 5px;
	left : -37px;
	background : #e60000;
	color : #fff;
	font-size : 85%;
	font-weight : bold;
	line-height : 1;
	padding : 6px 40px 4px;
	-ms-transform : rotate(-45deg);
	transform : rotate(-45deg);
	transition : none;
}
/*----------------------------------------------------
  ページネーション
----------------------------------------------------*/
div.center {
	text-align: center;
}
.pagination {
	*zoom : 1;
	text-align : center;
	margin: 30px 0 51px 0;
	padding: 0;
	letter-spacing: -0.4em;
	font-size: 0;/*safariで余白が詰まってしまうため調整*/
}
.pagination:after {
	content : ' ';
	display : table;
	clear : both;
}
.pagination li {
	display: inline-block;
	margin-left: -1px;
	letter-spacing:normal;
	font-size: 14px;/*safariで余白が詰まってしまうため調整*/
	background : #fff;
}
.pagination li a {
	display: inline-block;
	color: #929292;
	float: left;
	width: 3.0em;
	padding: 7px 0;
	transition: background-color .3s;
	border: 1px solid #b3b3b3;
}
.pagination li.pager-current a {
	border : 1px solid #e75297;
	background : #e75297;
	color : #fff;
	position : relative;
}
.pagination li.pager-prev,.pagination .pager-next{
	background : none;	
}
.pagination li.pager-prev a {
	position : relative;
	text-indent : -999px;
	overflow : hidden;
	border : none;
}
.pagination li.pager-prev a:after {
	content : '';
	display : block;
	position : absolute;
	left : 10px;
	top : 50%;
	margin-top : -6px;
	width : 10px;
	height : 10px;
	border-top : 1px solid #929292;
	border-right : 1px solid #929292;
	-ms-transform : rotate(225deg);
	    transform : rotate(225deg);
}
.pagination .pager-next a {
	position : relative;
	text-indent : -999px;
	overflow : hidden;
	border : none;
}
.pagination li.pager-next a:after {
	content : '';
	display : block;
	position : absolute;
	right : 10px;
	top : 50%;
	margin-top : -6px;
	width : 10px;
	height : 10px;
	border-top : 1px solid #929292;
	border-right : 1px solid #929292;
	-ms-transform : rotate(45deg);
	    transform : rotate(45deg);
	background : none;
}

/*----------------------------------------------------
  バナー
----------------------------------------------------*/
.btnBox {
	width: 100%;
	padding: 0 4%;/*171106追記*/
	margin: 0 0 0 0;
	text-align: center;
	color: #fff;
	font-size: 120%;
    margin: 0 auto;
}
.btnBox li{
	margin:20px 0;
}
.btnBox img {
	width: 100%;
	min-width: 100%;
	height: auto;
	margin: 0 auto;
}

/* ====================================================
　以下ブレークポイント設定
==================================================== */
/*----------------------------------------------------ブレークポイント・タブレットサイズ以上*/
@media screen and (min-width: 768px) {
    body {
        /*background: url() no-repeat center top fixed;*/
    }
    body::before {
        background:none;
    }
    #l-content_w100 {
        max-width : 100%;
        margin-top: 89px;
    }
    #c-mainImg {
        width: 100%;
        height: 100%;
        margin: 0 0 50px 0;
        padding:0;/*171107修正*/
        text-align: center;
    }
    
    
    #category_block ul {
		width: 1080px;
		margin : 0 auto;
		/*font-size: 0;*//*safariで余白が詰まってしまうため調整*/
        padding: 0;
	}

    .photo-list {
        width: 1080px;
        margin: 0 auto 0 auto;
        padding: 50px 0 0 0;
    }
    .c-shopList {
        width: auto;
        margin: 0 -16px 0 0;
    }
    .c-shopList li {
        width: 258px;
        margin: 0 16px 40px 0;
    }

        /* grid */
    .grid {
        margin: 0 auto 0 -20px;
        overflow: hidden;
        background-color: transparent;
    }
    [class*='col-'] {
        float: left;
        padding-left: 20px;
        padding-bottom: 20px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }
    .col-1-2 {
        width : 25%;
    }

    .link_box a {
        display: block;
        height: 100%;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }
    .link_box a .photo .contain {
        width: 100%;
        height: 100%;
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
        transform: translateZ(0px);
        -moz-transform: translateZ(0px);
        -webkit-transform: translateZ(0px);
        -o-transform: translateZ(0px);
        -ms-transform: translateZ(0px);
    }
    .link_box a:hover .photo .contain {
        -webkit-transform: scale(1.08);
        -moz-transform: scale(1.08);
        -o-transform: scale(1.08);
        -ms-transform: scale(1.08);
        transform: scale(1.08);
    }
    ul.pagination {
        margin: 30px 0 80px 0;
    }
    .btnBox {
        max-width: 1080px;
        width: auto;
        margin: 0 auto;
        text-align: center;
        color: #fff;
        font-size: 120%;
        padding: 0;
    }
    .btnBox ul {
        display: table;
    }
    .btnBox ul li {
        display: inline-block;
        margin-right: 5%;
    }
    .btnBox ul li:last-child {
        margin-right: 0;
    }
}
#l-content_w100 {
    margin-top: 116px;
}
@media screen and (min-width:768px) and (max-width: 1199px) {
    .photo-list {
        width: 90%;
    }
    .btnBox {
        max-width: 90%;
    }
    #category_block ul {
    	width: 90%;
    }
    #l-content_w100 {
        margin-top: 58px;
    }
}

#sub_hash_tag {
    margin-top: -50px;
    padding-top: 50px;
}
@media screen and (min-width: 1200px) {
    #l-content_w100 {
        margin-top: 75px;
    }
    #sub_hash_tag {
        margin-top: -90px;
        padding-top: 90px;
    }
}

@media screen and (max-width: 767px) {
	#category_block ul {
        text-align: left;
        padding: 0 20px;
        font-size: 95%;
	}
	#category_block ul li {
		margin-right: 15px;
	}
}