@charset "utf-8";
/* 返礼品一覧のcss */
#maincontent_wrap { margin-bottom: 16rem; }
.itemslist_wrap { text-align: center; }

/*=========================================
		itemslist-head
=========================================*/
#itemslist-head {
    margin-bottom: 3rem;
    background: #EEFBFE;
    padding: 3rem 0;
}

/* 検索条件の表示 */
.conditions p {
    display: inline-block;
    float: left;
    margin: 0 0.5em;
    text-align: left;
}

#itemslist-head .btn a {
    padding: 1rem 5rem;
}
#itemslist-head .btn.slide-parent a {
    text-align: left;
    position: relative;
}
#itemslist-head .btn.slide-parent a::before, 
#itemslist-head .btn.slide-parent a::after {
    content: "";
    width: 1.25em;
    height: 2px;
    background: #333;
    position: absolute;
    right: 2em;
    top: 0;
    bottom: 0;
    margin: auto;
    transition: 0.5s;
}
#itemslist-head .btn.slide-parent a::after {
    transform: rotate(90deg);
}
#itemslist-head .btn.slide-arrow_b a::after {
    transform: rotate(180deg);
}




/* 絞り込み検索 */
#itemslist-head .slide-parent {
    display: inline-block;
    margin-bottom: 5px;
    max-width: 380px;
    width: 90%;
    border-radius: 50px;
}
#itemslist-head .slide-parent a p {
    margin: 0;
}
#itemslist-head .slide-parent span { width: 10px; }
#itemslist-head .slide-parent p {
	display: inline-block;
    color: #141414;
}
#itemslist-head .search-menu {
	margin-top: 2.5rem;
    /*background: #EDEDE8;*/
    padding: 3rem 2rem 2rem;
    border-radius: 5px;
	width: 100%;
}
#itemslist-head .search-menu li input[type="text"] { width: 100%; }
#itemslist-head .search-menu li ul { width: 100%; }
#itemslist-head .search-menu li.kara {
	width: 2em;
    padding: 0 10px;
    vertical-align: middle;
}

#itemslist-head .search-menu li input, 
.search-menu .selectmenu select {
    border: 1px solid #DDDDDD;
    font-size: 16px;
    line-height: 1.6rem;
    padding: 0 1em;
    height: 2.56em;
    border-radius: 2px;
	font-family: "Noto Sans JP";
}
.search-menu .selectmenu select {
    background: url(../img/common/arrow-pull.png) no-repeat 96% 60%, #fff;
}


#itemslist-head .search-menu .btn_wrap { margin-top: 1rem; }
.search-menu .btn_style02 a.circle-arrow {
    max-width: 280px;
    background: #fff;
    margin: 0 auto;
    text-align: left;
    padding: 5px 3em;
}
.search-menu .btn_style02:hover {
    opacity: 1;
}

/*=========================================
		itemslist
=========================================*/
/*商品がないとき*/
.itemslist_wrap #itemslist > p {
    margin: 5em 0;
    font-size: 20px;
    font-weight: 600;
}

.item_orderlist {
    margin: 40px auto;
    max-width: 1100px;
    width: 90%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.item_orderlist .item_orderlist_select {
    display: flex;
    width: 70%;
    align-items: center;
    justify-content: flex-end;
}
.item_orderlist select {
    padding: 10px 30px 10px 10px;
    margin-left: 15px;
    border: 1px solid #e2e2e2;
    font-size: 1.6rem;
    border-radius: 2px;
    letter-spacing: 1.57px;
}
.item_orderlist .sort_order {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-right: 30px;
}
.item_orderlist .pager-select {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
#itemslist .col-4 > .col {
    /*width: calc(25% - 5px);
    margin-left: 5px;*/
    float: left;
	margin-bottom: 2em;
}
#itemslist .col-4 > .col {
    width: calc(25% - 5px);
    margin-left: 5px;
    float: left;
	margin-bottom: 3em;
}
#itemslist .item { 
	position: relative;
	padding: 0.5rem 1rem 1rem;
}
#itemslist .item:hover {
	background: #fff;
	
}
#itemslist .item a {
	opacity: 1;
	filter: alpha(opacity=100);
}
#itemslist .item .img_wrap { 
	
	overflow: hidden;
}
#itemslist .item .item-txt {
	clear: both;
	overflow: hidden;
}
#itemslist .item .price {
    float: none;
    text-align: left;
    margin: 0;
}
@media screen and (max-width: 999px) {
	/*=========================================
			itemslist
	=========================================*/
	#itemslist .item { padding: 0.5rem 0.5rem 1rem; }
	.item_orderlist {
    display: block;
    text-align: left;
}
.item_orderlist .pager-amount {
    margin: 20px 0;
}
.item_orderlist .item_orderlist_select {
    display: block;
    width: 100%;
}
.item_orderlist .item_orderlist_select .overflowhidden {
    margin: 20px 0;
}
.item_orderlist select {
    padding: 5px 30px 5px 6px;
}
}

@media screen and (min-width: 481px) {
	/*=========================================
			itemslist-head
	=========================================*/
	/* 検索条件の表示 */
	.conditions {
    width: calc(100% - 162px);
    text-align: center;
    margin: 0 auto 1em;
    justify-content: center;
    display: block;
}
	

	#itemslist-head .search-menu li { margin-bottom: 1.5rem; }
}
@media screen and (max-width: 999px) {
.conditions {
    display: block;
    width: 90%;
    margin: 0 auto 1em;
}
}
@media screen and (max-width: 480px) {
	/*=========================================
			itemslist-head
	=========================================*/
	/* 絞り込み検索 */

	#itemslist-head .slide-parent {
    margin: 0 auto 1rem;
}
	#itemslist-head .slide-parent a {
    padding: 0.5rem 3.1rem;
}
	#itemslist-head .slide-parent p {
		font-size: 16px;
		font-size: 1.6rem;
	}
	#itemslist-head .search-menu {
		margin-top: 1.5rem;
		padding: 1rem 1rem 2rem;		
	}
	#itemslist-head .search-menu li { padding: 1.5rem 0 0 0; }
	#itemslist-head .search-menu li:first-of-type { margin: 0; }
	#itemslist-head .search-menu .btn_wrap { margin-top: 2rem; }
	
	.itemslist_wrap #itemslist > p {
    margin: 5em 0 0;
    font-size: 4.0vw;
}
	
}