.intros .modal-dialog{width: 1180px;}
.intros .modal-content{border: 5px solid #fff; padding: 0;}
.intros .modal-body{height: 700px;}
.intros ~ .modal-backdrop{background-color: rgba(37, 71, 110, 1);}
.intros ~ .modal-backdrop.in{opacity: 0.8;}
.intros .inner{position: absolute; width: 100%; left: 0; bottom: 30px; text-align: center;}
.intros .title{margin-bottom: 10px; font-size: 90px; color: #fff; line-height: 0.8em;}
.intros .title strong{font-weight: 500;}
.intros .desc{margin: 0; font-size: 34px; color: #fff;}
.intros .action{text-align: center; margin-top: 5px;}
.intros .action > div{display: inline-block;}
.intros .action > div + div{margin-left: 15px;}

/*----- modal -----*/
.modal{text-align: center; padding: 0 20px;}
.modal:before{content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -4px;}
.modal-close{opacity: 1; width: 24px; height: 24px; position: absolute; z-index: 110; top: 8px; right: 0; background: url('../image/icon/modal-close.png');
    -webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    -ms-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
}
.modal-close:hover{opacity: 0.6;}
.modal-backdrop{background-color: #000;}
.modal-backdrop.in{opacity: 0.5;}
.modal-dialog{margin: 20px auto; display: inline-block; text-align: left; vertical-align: middle; width: 900px;}
.modal-header{position: relative; padding: 0; margin-bottom: 30px; border: none;}
.modal-header .title{margin: 0; font-size: 40px; font-weight: 500; line-height: 1em;}
.modal-body{padding: 0;}
.modal-content{border:none; padding: 40px 50px 50px 50px; overflow: hidden;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}


@media (max-width: 1600px) {
    .intros .modal-dialog{width: 840px;}
    .intros .modal-body{height: 500px;}
    .intros .title{font-size: 70px;}

}

@media (max-width: 1199px) {
    .intros{}
    .intros .bg-main{height: auto; padding-top: 49%;}
    .intros .link{display: none;}
}

@media (max-width: 991px) {
    .modal-dialog{width: 780px;}
    .modal-content{padding: 25px 30px 30px 30px;}

    .intros .modal-dialog{width: 570px;}
    .intros .modal-body{height: 400px;}
    .intros .title{font-size: 34px;}
    .intros .desc{font-size: 20px;}
    .intros .inner{padding: 0 20px; bottom: 20px;}
    .intros .action{margin: 0 -5px;}
    .intros .action > div{padding: 0 5px; float: left; width: 50%;}
    .intros .action > div + div{margin-left: 0;}
    .intros .action .btn{width: 100%; min-width: inherit;}
}

@media (max-width: 767px) {
    .modal{padding: 0;}
    .intros .modal-dialog{width: 320px;}
    .intros .modal-body{height: 260px;}
    .modal-header{margin-bottom: 15px;}
    .modal-header .title{font-size: 30px;}
    .modal-close{width: 20px; height: 20px; top: 5px; background-size: 16px; background-position: center; background-repeat: no-repeat;}
    .modal-content{padding: 15px 20px 20px 20px;}
}