
@charset "utf-8";
/* CSS Document */
.mg{width: 100%;height: 965px; background: url("../images/magang-bg.jpg");}
.mgmaintop{height:200px;color:#ffffff;text-align: center;background-image: -webkit-linear-gradient(top, #fd6c04, #ff0000);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-family: "Microsoft Yahei";font-weight: bold;font-size: 62px;line-height: 80px;letter-spacing: 15px;margin-top:-1px;}
.mgmaintop:hover{text-shadow: -3px -1px #0000002b;background-image: -webkit-linear-gradient(top, #ff0000, #fd6c04);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-top:-1px;}
.mgmain{width: 80%;margin: 0 auto;padding-top: 20px;}
.mgmain-left{width: 73%;float: left;}
.mgmain-left video{}
.mgmain-right{width: 22%;float: right;}

.mgmain-right .contit{font-family: "PingHei","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif";font-weight: 600;font-size: 68px;line-height: 80px;/* margin:10px 0; */text-align: justify;/* letter-spacing: 4px; */width: 100%;display: inline-block;position: relative;height: 80px;}
.mgmain-right .contit:after{ content: ''; display: inline-block;width: 100%;}
.mgmain-right-1 .contit{background-image:-webkit-linear-gradient(left,#FD6C01,#FD6C09);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.mgmain-right-2 .contit{background-image:-webkit-linear-gradient(left,#FD6C15,#FD6C21);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.mgmain-right-3 .contit{background-image:-webkit-linear-gradient(left,#FF0100,#FF0300);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.mgmain-right-4 .contit{background-image:-webkit-linear-gradient(left,#FF0500,#FF0900);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}


.mgmain-right span{font-family: "PingHei","Helvetica Neue","Helvetica","Arial","Verdana","sans-serif";font-weight: 600;font-size: 68px;line-height: 80px;/* margin:10px 0; */text-align:right;letter-spacing: 4px;width: 100%;}
.mgmain-right-1 span{background-image:-webkit-linear-gradient(left,#FD6C01,#FD6C09);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.mgmain-right-2 span{background-image:-webkit-linear-gradient(left,#FD6C15,#FD6C21);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.mgmain-right-3 span{background-image:-webkit-linear-gradient(left,#FF0100,#FF0300);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.mgmain-right-4 span{background-image:-webkit-linear-gradient(left,#FF0500,#FF0900);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}

.mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 178px;}
.mgmain-right .con1,.mgmain-right .con2{color: #c7c7c7;font-size: 24px;line-height: 30px;margin-top: -65px;}
.mgmain-right .con1{float:left;margin-left: 5px;}

.mgmain-right-1 .con1,.mgmain-right-1 .con2{font-size: 30px;line-height: 30px;}
.mgmain-right-2 .con1,.mgmain-right-2 .con2{font-size: 30px;line-height: 30px;}
.mgmain-right .con2{float: right;}
/*.mgmain-right-4 .con1{float:left;}
.mgmain-right-4 .con2{float: right;margin-right: 55px;}*/
/*.p1{width: 90%;margin: 0 auto;color: #ffffff; font-family:"微软雅黑";font-size: 16px; z-index: 999;float: left;}*/




.vjs-polyzor-skin .vjs-icon-play,
.video-js .vjs-big-play-button,
.video-js .vjs-play-control {font-family: VideoJS;font-weight: normal;font-style: normal;}
.vjs-polyzor-skin .vjs-icon-play:before,
.video-js .vjs-big-play-button:before,
.video-js .vjs-play-control:before {content: "";}
.vjs-polyzor-skin {font-size: 10px;color: #ffffff;}
.vjs-polyzor-skin .vjs-control-bar,
.vjs-polyzor-skin .vjs-big-play-button,
.vjs-polyzor-skin .vjs-menu-button .vjs-menu-content {background-color: #2B333F;background-color: rgba(43, 51, 63, 0.7);}

@keyframes vjs-big-play-button {
    0% {
        transform: scale(1);
    }
    25% {
        transform: scale(1.2);
    }
    50% {
        transform: scale(1);
    }
    75% {
        transform: scale(1.2);
    }
}
.vjs-big-play-button {
    -webkit-animation-name: vjs-big-play-button;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 2s;
}

.vjs-polyzor-skin .vjs-big-play-button {
    font-size: 6em;
    line-height: 1;
    height: 1em;
    width: 1em;
    color: #fd6c16;
    background: none !important;
    border: 0;
    /*-webkit-transition: all .3s ease !important;
    transition: all .3s ease !important;*/
    left: 50%;
    top: 50%;
    margin-left: -0.5em;
    margin-top: -0.5em;
    position: absolute;
}
.vjs-polyzor-skin .vjs-big-play-button:hover {
    color: #fff;
    /*-webkit-transform: scale(1.5);
    -ms-transform: scale(1.5);
    transform: scale(1.5);*/
}
.vjs-polyzor-skin .vjs-control-bar {
    padding: 0 5px;
    height: 4em !important;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.vjs-polyzor-skin .vjs-progress-control {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0 !important;
    width: 100% !important;
    height: auto !important;
    /*-webkit-transform: translate(0, -100%);
    -ms-transform: translate(0, -100%);
    transform: translate(0, -100%);*/
}
.vjs-polyzor-skin .vjs-progress-holder {
    height: 0.5em !important;
    margin: 0;
}
.vjs-polyzor-skin .vjs-progress-holder .vjs-load-progress,
.vjs-polyzor-skin .vjs-progress-holder .vjs-play-progress {
    -webkit-transition: width 400ms ease;
    transition: width 400ms ease;
    height: 100% !important;
}
.vjs-polyzor-skin .vjs-progress-holder .vjs-play-progress:before {
    font-size: 1em;
    color: #fcfaff;
    top: -55%;
}
.vjs-polyzor-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
    visibility: visible;
    opacity: 1;
    background: none;
    -webkit-transition: all 1s;
    transition: all 1s;
}
.vjs-polyzor-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar .vjs-control,
.vjs-polyzor-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar .vjs-time-control {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 1s;
    transition: all 1s;
}
.vjs-polyzor-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar .vjs-progress-control {
    visibility: visible;
    opacity: 1;
    top: 100%;
    -webkit-transition: all .8s !important;
    transition: all .8s !important;
    -webkit-transform: translate(0, -100%);
    -ms-transform: translate(0, -100%);
    transform: translate(0, -100%);
}
.vjs-polyzor-skin.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar .vjs-progress-control .vjs-play-progress.vjs-slider-bar:before {
    content: '';
}
.vjs-polyzor-skin .vjs-control {
    height: auto;
    width: auto;
    padding: 0 5px;
}
.vjs-polyzor-skin .vjs-control:before {
    font-size: 3em;
    line-height: 1 !important;
}
.vjs-polyzor-skin .vjs-control:before {
    line-height: 1;
    position: relative;
}
.video-js .vjs-control:focus:before,
.video-js .vjs-control:hover:before,
.video-js .vjs-control:focus {
    text-shadow: 0 0 1em #ffffff;
}
.vjs-polyzor-skin .vjs-play-control {
    position: absolute;
    width: auto;
    height: 100%;
    top: 50%;
    left: 50%;
    -webkit-transition: 300ms;
    transition: 300ms;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.vjs-polyzor-skin .vjs-play-control:before {
    position: relative;
    line-height: 1 !important;
    font-size: 25px;
    font-size: 2.85714em !important;
}
.vjs-polyzor-skin .vjs-volume-menu-button {
    position: relative;
    height: 2.3em;
    width: 2.3em;
    overflow: hidden;
}
.vjs-polyzor-skin .vjs-volume-menu-button:before {
    text-align: left;
    font-size: 2.3em !important;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    text-shadow: none !important;
}
.vjs-polyzor-skin .vjs-volume-menu-button .vjs-menu {
    position: relative;
    width: 100%;
    left: 2em;
}
.vjs-polyzor-skin .vjs-volume-menu-button .vjs-menu-content {
    position: absolute;
    height: 2.3em;
    padding: 0 5px !important;
}
.vjs-polyzor-skin .vjs-volume-menu-button .vjs-menu-content .vjs-volume-bar {
    margin: 0 !important;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.vjs-polyzor-skin .vjs-volume-level {
    color: #fcfaff;
}
.vjs-polyzor-skin .vjs-vol-0 {
    color: red;
}
.vjs-polyzor-skin .vjs-remaining-time {
    margin-right: auto;
}
.vjs-polyzor-skin .vjs-time-control {
    color: #fff;
}
.vjs-polyzor-skin .vjs-live-control {
    position: absolute;
    width: auto;
    line-height: 1;
    height: auto;
    top: -30px;
    right: 0;
}
.vjs-polyzor-skin .vjs-live-control:before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    left: 0;
    top: 50%;
    background: red;
    border-radius: 100%;-webkit-border-radius: 100%; -moz-border-radius: 100%; -o-border-radius: 100%;
    -webkit-transform: translate(-100%, -50%);
    -ms-transform: translate(-100%, -50%);
    transform: translate(-100%, -50%);
}

.vjs-polyzor-skin .vjs-playback-rate {}
.vjs-current-time,.vjs-time-divider {display: block !important;}
.vjs-polyzor-skin .vjs-progress-control:hover .vjs-mouse-display:after {background: rgba(38, 166, 154, 0.7);}
.video-js .vjs-volume-level,
.video-js .vjs-play-progress,
.video-js .vjs-slider-bar {background: #ffffff;}
.video-js .vjs-load-progress {background: #bfc7d3;background: rgba(115, 133, 159, 0.5);}
.video-js .vjs-load-progress div {background: white;background: rgba(115, 133, 159, 0.75);}



@media screen and (max-width:1930px) {
	.mg{height: 968px;}
    .mgmain-right{width: 21%;}
	.mgmain-right .contit{font-weight: 600;font-size: 64px;line-height: 80px;}
	
    .mgmain-right span{font-weight: 600;font-size: 64px;line-height: 80px;}
	
    .mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 178px;}
    .mgmain-right .con1,.mgmain-right .con2{font-size: 20px;line-height: 30px;}
    .mgmain-right .con1{margin-left: 15px;}
}

@media screen and (max-width:1919px) {
	.mg{height: 968px;}
    .mgmain-right{width: 21%;}
	.mgmain-right .contit{font-weight: 600;font-size: 64px;line-height: 80px;}
	
    .mgmain-right span{font-weight: 600;font-size: 64px;line-height: 80px;}
	
    .mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 178px;}
    .mgmain-right .con1,.mgmain-right .con2{font-size: 20px;line-height: 30px;}
    .mgmain-right .con1{margin-left: 15px;}
}


@media screen and (max-width:1854px) {
    .my-player-dimensions{width: 100% !important;height: 640px;}
    .mgmain-left video{width: 100% !important;}
    .mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 170px;}
    .mgmain-right .con1,.mgmain-right .con2{font-size: 12px;}
    .video-js .vjs-big-play-button {/* margin: 295px 520px; */}
}

@media screen and (max-width:1850px) {
	.mgmain-right .contit{font-size: 62px;line-height: 75px;}
    .mgmain-right span{font-size: 62px;line-height: 75px;}
}

@media screen and (max-width:1825px) {
	.mg{height: 970px;}
    .mgmain-right .contit{font-size: 50px;line-height: 75px;}
    .mgmain-right span{font-size: 50px;line-height: 75px;}
    .mgmain-right {width: 18%;}
}
@media screen and (max-width:1747px) {
	..mgmain-right-1, .mgmain-right-2, .mgmain-right-3, .mgmain-right-4{margin-top: 5px;}
    .mgmain-right .contit{font-size: 45px;line-height: 75px;}
    .mgmain-right span{font-size: 45px;line-height: 75px;}
    .mgmain-right {width: 16%;}
}
@media screen and (max-width:1709px) {
    .mgmain-right .contit{font-size: 40px;line-height: 75px;}
    .mgmain-right span{font-size: 40px;line-height: 75px;}
    .mgmain-right {width: 15%;}
}
@media screen and (max-width:1679px) {
    .mgmain-right .contit{font-size: 37px;line-height: 75px;}

    .mgmain-right span{font-size: 37px;line-height: 75px;}
    .mgmain-right {width: 14.5%;}
}
@media screen and (max-width:1660px) {
    .mgmain{padding-top: 50px;}
    .mgmain-right {width: 13%;}
    .my-player-dimensions{width: 100% !important;height: 640px;}
    .mgmain-left video{width: 100% !important;}
	
    .mgmain-right .contit{font-size: 35px;line-height: 60px;}
	
    .mgmain-right span{font-size: 35px;line-height: 60px;}
    .mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 150px;margin-top: 20px;}
    .mgmain-right .con1,.mgmain-right .con2{font-size: 12px;margin-left: 0;}
    .video-js .vjs-big-play-button {/* margin: 295px 520px; */}
}
@media screen and (max-width:1656px) {
    .mg{width: 100%;height:  calc(80vw * 1080 / 1920 + 233px);}
    .mgmain-right {width: 12%;}
    .example_video_1-dimensions{width: 100% !important;height: calc(80vw * 1080 / 1920) !important;}
    .mgmain-left {width: 100%;float: left;}
    .mgmain-right{display: none;}
}
@media screen and (max-width:1634px) {
    .mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 160px;}
    .mgmain-right .contit {font-size: 30px;line-height: 40px;}
    .mgmain-right span {font-size: 30px;line-height: 40px;}
}
@media screen and (max-width:1441px) {
    /*.mg{width: 100%;height: 106vh;}
    .mgmain-right{display: none;}*/
    
}
@media screen and (max-width: 1280px) {
	.bigimg video{margin-bottom:30px !important;}
	.mgmaintop{font-size: 50px;height:80px;}
    .mgmaintop:hover{font-size: 50px;height:80px;}
	
}

@media screen and (max-width:1224px) {
    .mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 170px;}
}

@media screen and (max-width:1070px) {
	.bigimg video{margin-bottom:20px !important;}
	.mgmaintop{font-size: 45px;height:70px;}
    .mgmaintop:hover{font-size: 45px;height:70px;}
}

@media screen and (max-width:1024px) {

	.bigimg video{margin-bottom:20px !important;}
    .mg{width: 100%;height:  calc(80vw * 1080 / 1920 + 40px);margin-top:-1px;}
		
	.mgmaintop{height:70px;font-size: 38px;}
    .mgmaintop:hover{font-size: 38px;height:70px;}
	
	.mgmain-left{width: 100%;float: left;}
	.mgmain-right{width: 100%;float: right;margin-top: 30px;}
	/*.mg{height: 970px;}*/
	.mgmain {padding-top: 30px;}
	.my-player-dimensions {height: 400px;}
	.video-js .vjs-big-play-button {margin: -30px -30px;}
	.mgmain-right-1,.mgmain-right-2{width: 100%;float: left;}
	.mgmain-right-3,.mgmain-right-4{width: 100%;float: right;}
	.mgmain-right .contit{font-size: 45px;line-height: 50px;text-align: start;}
	.mgmain-right span{font-size: 45px;line-height: 50px;text-align: start;}
	.mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 92px;}
	.mgmain-right .con1,.mgmain-right .con2{font-size: 14px;line-height: 14px;}
	.mgmain-right .con1{float:left;margin-left: 0;}
	.mgmain-right .con2{margin-right: 3px;}
	.mgmain-right-4 .con1{float:left;}
	.mgmain-right-4 .con2{margin-right: 3px;}
	
	.video-js{width: 100% !important;height: 520px;}
}

@media screen and (max-width:880px) {
	.mgmaintop{font-size: 30px;height:80px;}
    .mgmaintop:hover{font-size: 30px;height:80px;}
}

@media screen and (max-width:768px) {
	
	.mgmaintop{font-size: 20px;height:80px;letter-spacing: 5px;}
    .mgmaintop:hover{font-size: 20px;height:80px;letter-spacing: 5px;}
	/*.mg{height: 290px;}*/
	.mgmain {width: 90%;padding-top: 10px;}
	.mgmain-left{width: 100%;}
	.video-js {/*height: 210px;*/}
	.video-js .vjs-big-play-button {font-size: 2em; margin: -10px -10px;}
	.mgmain-right{width: 100%;margin-top: 20px;}
	.mgmain-right .contit{font-size: 30px;line-height: 40px;text-align: start;}
	.mgmain-right span{font-size: 30px;line-height: 40px;text-align: start;}
	.mgmain-right-1,.mgmain-right-2,.mgmain-right-3,.mgmain-right-4{height: 68px;}
	.mgmain-right .con1,.mgmain-right .con2{font-size: 13px;line-height: 13px;margin-left: 0;}

    .video-js{width: 100% !important;height: 280px;}
}
@media screen and (max-width:585px) {
	.mgmaintop{font-size: 15px;height:80px;}
    .mgmaintop:hover{font-size: 15px;height:80px;}
	/*.mg{height: 290px;}*/
}



@media screen and (max-width: 400px) {
    .vjs-polyzor-skin .vjs-play-control {
        display: inline-block;
        position: relative;
        height: 100%;
        top: 0 !important;
        left: 0 !important;
        -webkit-transform: translate(0, 0) !important;
        -ms-transform: translate(0, 0) !important;
        transform: translate(0, 0) !important;
        margin-right: 5px;
    }
    .vjs-polyzor-skin .vjs-play-control:before {
        position: relative;
        line-height: 1 !important;
        font-size: 2.85714em !important;
    }
}

@media screen and (max-width:414px) {
	/*.mg{height: 290px;}*/
	.my-player-dimensions {height: 210px;}
	.video-js .vjs-big-play-button {/*margin: 83px 142px;*/}
	.mgmain-right{margin-top: 10px;}

}
@media screen and (max-width:375px) {
	/*.mg{height: 290px;}*/
	.my-player-dimensions {height: 200px;}
	.video-js .vjs-big-play-button {/*margin: 73px 125px;*/}
}
@media screen and (max-width:320px) {
	/*.mg{height: 290px;}*/
	.my-player-dimensions {height: 170px;}
	.video-js .vjs-big-play-button {/*margin: 60px 100px;*/}
}