@charset "UTF-8";
/*--------------------------------
news/case
---------------------------------*/

/* news */
.sys section{background: #fff}
.sys section p{font-size: 1.4rem}
.side{padding:50px 20px}
.side-news-list{margin-bottom: 20px; padding: 10px 0;}
.side-news-list li{padding: 10px 0;border-bottom: 1px dotted #ccc;font-size: 1.4rem}
.side-news-list li a{display: flex; flex-direction: column-reverse;color: #000;text-decoration: none;line-height: 1.6}
.side-news-list li a span{text-align: right;color: #999999;padding-top: 5px}
.imgArea01{padding-bottom: 15px;text-align: center}
section p time{font-size: 1.2rem}
.flex-img01 div{text-align: center}
.imgLeft div,
.imgRight div{margin-bottom: 15px}
.pager2 .pagination li{width: 140px}
.pager2 .pagination{display: flex;  justify-content: space-between;}
.imgLeft,.imgRight{text-align: center}
.imgLeft div,.imgRight div{text-align: left}

/* case */
.case-list li {padding: 20px 0 40px}
.case-list li a{color: #000;text-decoration: none}
.case-list li a span{display: block; text-align: right;font-size: 1.2rem}
.case-list li a div{position: relative;}
.case-list li a h3{padding-bottom: 5px; line-height: 1.4}
.case-list-text{display: flex;justify-content: space-between}
.next01{position: relative;display: inline-block; padding:5px 22px 5px 10px;color: #333; border: 1px solid #333;}
.next01::after{content: "";display: block;position: absolute;right: 10px;top: 14px; width: 0;height: 0;border-style: solid;border-color: transparent transparent transparent #333;border-width: 4px 0px 4px 6.93px;}
.side-case-list{margin-bottom: 20px; padding: 10px 0;}
.side-case-list li{padding: 10px 0;border-bottom: 1px dotted #ccc;font-size: 1.4rem}
.side-case-list li a{display: flex; color: #000;text-decoration: none;line-height: 1.6}
.side-case-list li a span{text-align: right}
.side-case-list li div img{width: 100px; height: 60px;margin-right: 15px; object-fit: cover;}
.side-case-text{display: flex; flex-flow: column-reverse;width:calc(100% - 115px);}
.side-case-text span{font-size: 1.2rem}
.case-img-wrap{ margin-bottom: 10px;line-height: 1 }
.case-img-wrap img{width: 100%; height: auto}

/* recruit */
/* .job-list{margin-bottom: 10px;}
.job-img{height: 150px;} */
@media screen and (max-width: 767px){
}

@media screen and (min-width: 768px){
	.flex-img01{display: flex;justify-content: space-between}
.flex-img01 img{width: 95%; height: auto	}
.imgLeft img{ float: left;width: 50%; height: auto;margin: 0 15px 15px 0}
.imgRight img{ float: right;width: 50%; height: auto;margin: 0 0 15px 15px}
.case-list{display: flex; justify-content: space-between;flex-wrap: wrap}
.case-list li{width: 47%;	}
.case-list li a div img{overflow: hidden;max-height:180px;width: 100%;height: 180px; object-fit: cover;}


}

@media screen and (min-width: 961px){
.sys section p{font-size: 1.6rem}
.wrap01{display: flex;max-width: 1200px;width: 100%;}
.wrap01 section{width: 70%;margin-right: 50px;padding: 50px 0 50px 50px;}
.wrap01 .side{width: 30%;margin-right: 50px;}
.wrap01 section h2{margin-bottom: 20px}
.news-list li{padding: 15px 0;font-size: 1.6rem}
.news-list li a{display: flex}
.news-list li a span{width: 130px}
.news-list li a div{width: calc(100% - 130px);}
.case-img-wrap img{max-height:180px;object-fit: cover}
	.case-img-wrap{ overflow: hidden;max-height:180px;}

}

@media screen and (min-width: 1024px) {

}

@media screen and (min-width: 1200px){


}

@media screen and (min-width: 1260px){

}