@charset "utf-8";
/* CSS Document */
.MainCaseList{display: inline-block;width:100%;margin-bottom: 35px;/*padding: 0px 85px 0px 85px;*/}
.MainCaseList>ul{display:flexbox;display: -webkit-flexbox;display: -mx-flexbox;display: -moz-flexbox;display: flex;display: -webkit-flex;display: -mx-flex;display: -moz-flex;flex:auto; justify-content:space-between;flex-wrap: wrap;}
.MainCaseList>ul>li{  position: relative;overflow: hidden;border-radius: 10px;}


.MainCaseList>ul>li>a>img{width:100%;height:auto;vertical-align:bottom; display:block;-ms-transition: 1s;-moz-transition: 1s;-webkit-transition: 1s;-o-transition: 1s;transition: 1s;}
.MainCaseList>ul>li>a:hover>img{transform: scale(1.3, 1.3);-ms-transform: scale(1.3, 1.3);-moz-transform: scale(1.3, 1.3);-webkit-transform: scale(1.3, 1.3);-o-transform: scale(1.3, 1.3);}

.MainCaseList>ul>li>a>.caseTxt{
    position: absolute;top: 0px;left: 0px;z-index: 999;display: none;padding-top:30px;padding-right: 30px;padding-left: 30px;width:100%;height: 100%;
	-ms-transition: 1s;	-moz-transition: 1s;-webkit-transition: 1s;	-o-transition: 1s;transition: 1s;
}

.MainCaseList>ul>li>a>.caseTxt>.caseTitle{font-size: 26px; line-height: 35px;}
.MainCaseList>ul>.MainCase0>a>.caseTxt>.caseLine{width:80px;height: 2px;background-color:#00E3FF;margin-top: 15px;}
.MainCaseList>ul>.MainCase1>a>.caseTxt>.caseLine{width:80px;height: 2px;background-color:#F0D800;margin-top: 15px;}
.MainCaseList>ul>li>a>.caseTxt>.caseItem{margin-top:10px;font-size:18px;}
.MainCaseList>ul>li>a>.caseTxt>.caseYear{font-size:18px;}


.MainCaseList>ul>li.MainCase0>a>.caseTxt{background-color:rgba(0,16,255,0.75);}
.MainCaseList>ul>li.MainCase1>a>.caseTxt{background-color:rgba(240,109,6,0.75);}

.MainCaseList>ul>li>a{color:#ffffff;}
.MainCaseList>ul>li>a:hover>.caseTxt{display:inline-block;top:0px;}


.caseShowTitle{
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 25px;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #C9C9C9;
}
.caseShowTitle h1{font-size:24px;color:#00A0FF;}
.caseShowTitle a{
    float: right;padding-left: 15px;padding-right: 15px;margin-left:15px;
    border-radius:6px;
    background-color: #F06D06;
    color: #ffffff;
    list-style: 55px;
    text-align: center;
    font-size: 14px;
    display: block;
    text-decoration: none;
}
.caseShowTitle a:hover{
    float: right;padding-left: 15px;padding-right: 15px;
    border-radius:6px;
    background-color: #00A0FF;
    color: #ffffff;
    list-style: 55px;
    text-align: center;
    font-size: 14px;
    display: block;
    text-decoration: none;
}
.mainTxt{margin-left: 15px;margin-right: 15px;}
.PreviousAndNext{margin-left: 15px;margin-right: 15px;}
.PreviousAndNext a{color:#191919;;}



@media screen and (min-width:10px){
	.MainCaseList>ul>li{width:100%;margin-top:25px;}
}
@media screen and (min-width:1200px){
	.MainCaseList>ul>li{width:calc(33.33% - 30px);margin-top:30px;}
}
@media screen and (min-width:1600px){
	.MainCaseList>ul>li{width:calc(33.33% - 30px);margin-top:30px;}
}
@media screen and (min-width:2000px){
	.MainCaseList>ul>li{width:calc(25% - 40px);margin-top:40px;}
}