@charset "utf-8";

@media screen and (min-width: 1024px) {
	
.case_list {
    margin-bottom: 40px;
}
.clearfix:after {
    content: " ";
    display: block;
    clear: both;
}
.case_box {
    background-color: #f8f3f0;
    border: solid 1px #e3e3e3;
    float: left;
    margin: 40px 3% 0 0;
    width: 31.2%;
}
.case_box:nth-child(3n) {
    margin-right: 0;
}
.case_box:nth-child(3n+1) {
	clear:both;
}
.case_box section {
    padding: 4%;
}
.case_box img {
    width: 100%;
}
.case_box h3 {
    border-bottom: solid 1px #c9c9c9;
    font-size: 24px;
    padding: 20px 0;
}
.case_box ul {
    margin-top: 20px;
		background-color: #AAA;
}
.case_box li {
    display: inline-block;
    padding: 0 2%;
    margin-right: 3%;
}
.case_txt {
    padding: 25px 0;
}
ul.case_page {
    margin-bottom: 130px;
    text-align: center;
}
.case_page .page-numbers {
    border: solid 1px #d9d9d9;
    display: inline-block;
    margin-right: 2%;
    width:4% !important;
    padding: 20px 0;
    width: 100%;
}
.case_page .current {
    background-color: #eff4e0;
}
.case_page a:hover {
    background-color: #eff4e0;
}
.case_page .page-numbers:last-child {
    margin-right: 0;
}

.case_images {
	margin:30px 0;
}
.case_images li {
	width:32%;
	float: left;
	margin-right:2%;
	margin-bottom:2%;
}
.case_images li:nth-child(3n) {
	margin-right:0;
}
.case_images li:nth-child(3n+1) {
	clear:both;
}
.case_images li img {
	width:100%;
	height:auto;
}

.case_category_list, .case_category_list a {
	color:#FFF;
}

.case_thumb {
	text-align: center;
	overflow: hidden;
	position: relative;
	width:100%;
	height:200px;
}
.case_thumb img {
    position: absolute;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    left: 50%;
    top: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
}

.case_link {
	color:#F30 !important;
}


/* カテゴリリスト */
.category_list {
	margin: 20px 0 20px 20px;
}
.category_list li {
	margin-bottom:10px;
}


.title_B {
    font-size: 18px;
    font-weight: bold;
    padding-bottom: 10px;
    border-bottom: solid #999 2px;
    margin-bottom: 20px;
}

}

@media screen and (max-width: 1023px) {

.container {
	padding:0 10px;
}

.case_list {
    margin-bottom: 40px;
}
.clearfix:after {
    content: " ";
    display: block;
    clear: both;
}
.case_box {
    background-color: #f8f3f0;
    border: solid 1px #e3e3e3;
    margin: 30px 0 0 0;
    width: 100%;
}
.case_box:nth-child(3n) {
    margin-right: 0;
}
.case_box:nth-child(3n+1) {
	clear:both;
}
.case_box section {
    padding: 4%;
}
.case_box img {
    width: 100%;
}
.case_box h3 {
    border-bottom: solid 1px #c9c9c9;
    font-size: 24px;
    padding: 20px 0;
}
.case_box ul {
    margin-top: 20px;
		background-color: #AAA;
}
.case_box li {
    display: inline-block;
    padding: 0 2%;
    margin-right: 3%;
}
.case_txt {
    padding: 25px 0;
}
ul.case_page {
    margin-bottom: 40px;
    text-align: center;
}
.case_page .page-numbers {
    border: solid 1px #d9d9d9;
    display: inline-block;
    margin-right: 2%;
    width:10% !important;
    padding: 10px;
}
.case_page .current {
    background-color: #eff4e0;
}
.case_page a:hover {
    background-color: #eff4e0;
}
.case_page .page-numbers:last-child {
    margin-right: 0;
}

.case_images {
	margin:30px 0;
}
.case_images li {
	width:100%;
	float: none;
	margin-right:0;
	margin-bottom:2%;
}
.case_images li:nth-child(3n) {
	margin-right:0;
}
.case_images li img {
	width:100%;
	height:auto;
}

.case_category_list, .case_category_list a {
	color:#FFF;
}

.case_thumb {
	text-align: center;
	overflow: hidden;
	position: relative;
	width:100%;
	height:200px;
}
.case_thumb img {
    position: absolute;
    width: auto;
    height: auto;
    min-width: 100%;
    min-height: 100%;
    left: 50%;
    top: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0);
}

.case_link {
	color:#F30 !important;
}


/* カテゴリリスト */
.category_list {
	margin: 20px 0 20px 20px;	
}
#category_list .category_list:first-child {
	margin: 0;	
}
.category_list li {
	margin-bottom:10px;
}


.title_B {
	font-size:18px;
	font-weight:bold;
	padding-bottom:10px;
	border-bottom:solid #999 2px;
	margin-bottom:20px;
}



}