@charset "utf-8";


/* ページタイトル
****************************************************************/
#pagetitle .wrapper{
	background: url(../../order/img/page_title_image.png) no-repeat right bottom;
	background-size: 30%;
}

.cate_title{
	text-align: center;
	margin: 10px 0;
	position: relative;
	display: inline-block;
	padding-bottom: 5px;
}
.cate_title:after {
	position: absolute;
	bottom: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 1px;
	background-color: #333;
}


ul.order_list {
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: flex-start;
	justify-content: flex-start;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-justify-content: left;
	-moz-justify-content: left;
	justify-content: left;
	margin: 15px 0;
}
ul.order_list li {
	position:relative;
	padding: 0.1em 0.3em 0.3em 1.8em;
	width: 24%;
	margin: 0 1% 5px 0;
	display: block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
ul.order_list li.long {
	width: 49%;
}

ul.order_list li::before {
	position: absolute;
	content: '';
	display: block;
	top: 0.5em;
	left: 0;
	width: 6px;
	height: 6px;
	border-right: 3px solid  #666;
	border-bottom: 3px solid #666;
	transform: rotate(-45deg);
}
ul.order_list li a {
	color: #000;
	text-decoration: none;
}
ul.order_list li a:hover {
	color: #16ae9e;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

@media screen and (max-width: 979px) {
/*tablet*/
}

@media screen and (max-width: 768px){
/*smart phone*/
ul.order_list li {
	width: 49%;
}

}


@media screen and (max-width: 620px) {
/*sp*/

}
@media screen and (max-width: 480px){
ul.order_list li,
ul.order_list li.long {
	width: 98%;
	margin: 0 auto 7px auto;
}
}