@charset "utf-8";
/* CSS Document */
.banner{ border:0px #00ff00 solid; width:100%; height:0; position:relative; overflow:hidden; margin-top:110px; padding-bottom:47%;}
.banner .image{ border:0px #00ffff solid; width:100%; position:absolute;}
.banner .image:hover{ width:106%; transition:.999s;}

/*
.con{ width:100%; display:table; margin:10px 0; }
.con .oc{ width:33%; height:0; padding-bottom:23%; display:table-cell; overflow:hidden; text-align:center; vertical-align:middle; position:relative; }
.con .oc.image01{ background:url(../image/MDM.png) no-repeat center; background-size:624px 289px; transition:.3s;}
.con .oc.image02{ background:url(../image/Apple_Business_Manager.png) no-repeat center; background-size:624px 289px; transition:.3s;}
.con .oc.image03{ background:url(../image/MFM.png) no-repeat center; background-size:624px 289px; transition:.3s;}
.con .oc.image01:hover,.con .oc.image02:hover,.con .oc.image03:hover{ background-size:735px 340px; transition:1s;}
.con .oc .text_blcok{ text-align:center; position:absolute; top:50%; left:0; right:0; margin:-36px auto 0 auto;}
.con .oc .text_blcok p{ font-size:35px; font-weight:bold; color:#fff; text-shadow:0 3px 2px rgba(0,0,0,.5); padding-bottom:20px;}
.con .oc .text_blcok span{ font-size:17px; color:#fff; text-shadow:0 3px 2px rgba(0,0,0,.4); margin:0 5px;}
*/

.con{ width:100%; display:table; margin:10px 0;}
.con .oc{ width:33%; height:0; padding-bottom:23%; display:table-cell; overflow:hidden; text-align:center; vertical-align:middle; position:relative;}
.con .oc.image01{ background:url(../image/MDM.png) no-repeat center; background-size:642px 442px; transition:.3s;}
.con .oc.image02{ background:url(../image/Apple_Business_Manager.png) no-repeat center; background-size:642px 442px; transition:.3s;}
.con .oc.image03{ background:url(../image/MFM.png) no-repeat center; background-size:642px 442px; transition:.3s;}
/*.con .oc.image01:hover,.con .oc.image02:hover,.con .oc.image03:hover{ background-size:1284px 884px;    filter: brightness(1.5); transition:.3s;}*/
.con .oc .text_blcok{ text-align:center; position:absolute; top:50%; left:0; right:0; margin:-36px auto 0 auto;}
.con .oc .text_blcok p{ font-size:35px; font-weight:bold; color:#fff; text-shadow:0 3px 2px rgba(0,0,0,.5); padding-bottom:20px;}
.con .oc .text_blcok span{ font-size:17px; color:#fff; text-shadow:0 3px 2px rgba(0,0,0,.4); margin:0 5px;}

@media screen and (max-width:1023px) and ( min-width:768px){
.banner{ margin-top:55px;}
.con{ margin:5px 0;}
.con .oc .text_blcok{ margin: -29px auto 0 auto;}
.con .oc .text_blcok p{ font-size:29px; padding-bottom:13px;}
.con .oc .text_blcok span{ font-size:15px;}
}

@media screen and ( max-width:767px) {
.banner{ margin-top:55px;}
.banner .image{ width:100%;}

.con{ margin:0; display:block; padding:5px 5px 0 5px;}
.con .oc{ width:100%; display:block; margin-bottom:5px; padding-bottom:40%;}
.con .oc .text_blcok{ margin: -29px auto 0 auto;}
.con .oc .text_blcok p{ font-size:29px; padding-bottom:13px;}
.con .oc .text_blcok span{ font-size:15px;}
}