?/*
 Theme Name:   be Child
 Theme URI:    
 Description:  
 Author:       
 Author URI:   
 Template:     be_tcd076
 Version:      1.8.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         
 Text Domain:  
*/

* {margin: 0; padding: 0;}

#cat_out {
	margin: 50px 0 0 0;
}

@-webkit-keyframes moveUp {
	0% { }
	100% { -webkit-transform: translateY(0); opacity: 1; }
}
@keyframes moveUp {
	0% { }
	100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; }
}



.kanren {
	margin-bottom: 30px;
}
.kanren h3 {
	background: #333;
	color: #fff;
	padding: 10px;
	margin-bottom: 10px;
}
.kanren ul {}
.kanren li {
	padding: 5px;
}


@media (max-width: 991px) {

/* プロジェクトリスト */
#work_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0 10px;
}
#work_list li {width:49.5%;}

#work_list .image img {
max-width: 100%;
height: auto;
width /***/:auto;
}

#work_list .title {
	display: block;
	padding: 10px;
	font-size:12px;
	line-height: 170%;
	color: #333;
}


/* ソートボタンと記事一覧 */
#work_list li.active {
  -webkit-transform: translateY(50px); transform: translateY(50px);
  -webkit-animation: moveUp 0.65s ease forwards 0.5s; animation: moveUp 0.65s ease forwards 0.5s;
}
#work_cat_sort {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 50px;
}
#work_cat_sort li {
	width: 50%;
	border:1px solid #ccc;
	border-bottom:none;
}
#work_cat_sort li a { font-size:12px; display:block; background:#fff; color:#333; text-decoration:none; text-align:center; height:40px; line-height:40px; }

#work_cat_sort li:nth-child(even) { border-left:none; }
#work_cat_sort li:nth-last-child(-n+2) {border-bottom: 1px solid #ccc;}

#work_cat_sort li a.active,
#work_cat_sort li a:hover,
#work_cat_sort li.current-cat a { color:#fff; background:#db3545; }

}




@media (min-width: 991px) {




/* プロジェクトリスト */
#work_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#work_list:after{
  content:"";
  display:block;
  width: 33%;
  height:0;
}
#work_list li { width:33%; overflow:hidden; line-height: 180%; }
#work_list .image { display:block; }

#work_list .image:before {
 ?width:33.333%; height:100%; display:block; content:''; background:rgba(0,0,0,0.5); position:absolute; z-index:2;
  opacity:0; -webkit-transition: opacity 0.6s; transition: opacity 0.6s;
}
#work_list li:hover .image:before { opacity:1; }

#work_list .title {display:block; padding: 15px 10px;}

#work_list .image img {
	display: block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    width: -webkit-calc(100% + 30px);
    width: -moz-calc(100% + 30px);
    width: calc(100% + 30px);
    height: auto;
    -webkit-transform: translate3d(-15px, 0, 0);
    -webkit-transition-property: opacity, translate3d;
    -webkit-transition: 0.5s;
    -moz-transform: translate3d(-15px, 0, 0);
    -moz-transition-property: opacity, translate3d;
    -moz-transition: 0.5s;
    -ms-transform: translate3d(-15px, 0, 0);
    -ms-transition-property: opacity, translate3d;
    -ms-transition: 0.5s;
    -o-transform: translate3d(-15px, 0, 0);
    -o-transition-property: opacity, translate3d;
    -o-transition: 0.5s;
    transform: translate3d(-15px, 0, 0);
    transition-property: opacity, translate3d;
    transition: 0.5s;
}
#work_list .image:hover img {
  opacity: 0.9;
  -webkit-transform: translate3d(-30px, 0, 0);
  -moz-transform: translate3d(-30px, 0, 0);
  -ms-transform: translate3d(-30px, 0, 0);
  -o-transform: translate3d(-30px, 0, 0);
  transform: translate3d(-30px, 0, 0);
}

/* ソートボタンと記事一覧 */
#work_list li.active {
  -webkit-transform: translateY(50px); transform: translateY(50px);
  -webkit-animation: moveUp 0.65s ease forwards 0.5s; animation: moveUp 0.65s ease forwards 0.5s;
}
#work_cat_sort {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 50px;
}
#work_cat_sort li {
	width: 16.666%; border:1px solid #ccc; border-right:none;
  -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box;
}
#work_cat_sort li a { font-size:12px; display:block; background:#fff; color:#333; text-decoration:none; text-align:center; height:40px; line-height:40px; }
#work_cat_sort li:nth-child(6n), #work_cat_sort li:last-child { border-right:1px solid #ccc; }
#work_cat_sort li:nth-child(n+7) {border-top: none;}
#work_cat_sort li a.active, #work_cat_sort li a:hover, #work_cat_sort li.current-cat a { color:#fff; background:#db3545; }
#work_cat_sort .current-cat + li:nth-child(7n) { border-color: #ccc!important; }

}