.mp-header { background: #F6F8F9; padding: 0 0 15px 0; border-bottom: 1px solid #ddd; }
.mp-title { font: 900 22px/26px "open sans"; text-align: center; padding: 15px 15px 5px 15px; max-width: 345px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;  }
.mp-address { text-align: center; font: 400 13px/17px "open sans"; }

.mp-tabs {  text-align: center; font: 0/0 a; margin: 15px 0 0 0; white-space: nowrap; }
.mp-tab { display: inline-block; background: #fff; vertical-align: top; font: 700 15px/18px "open sans"; padding: 12px 9px; border: 1px solid #ddd; }
.mp-tab:first-child { border-radius: 4px 0 0 4px; }
.mp-tab:last-child { border-radius: 0 4px 4px 0; }
.mp-tab + .mp-tab { margin-left: -1px; }
.mp-tab.active { background:  #ff0000; border-color: #ff0000; color: #fff; position: relative; z-index: 1; }

.mp-phone { display: block; text-align: center; font: 500 23px/23px "open sans"; color: #000; padding: 25px 0; position: relative; }
.mp-phone + .mp-phone { border-top: 1px solid #ddd; }
.mp-phone > span { font-size: 13px; position: absolute; left: 0; right: 0; text-align: center; bottom: 3px; color: #666; }


.mp__show-hint { cursor: pointer; }
.mp__show-hint > span { display: inline-block; border-bottom: 1px dashed; line-height: 13px; }
.mp__autoschool-hint { height: 0; opacity: 0; transition: height 250ms, opacity 250ms; overflow: hidden; background: #edf4ff; border-top: 1px solid #ddd; position: fixed; bottom: 0; left: 0; right: 0; padding: 15px; }
.mp__autoschool-hint > p + p { margin: 15px 0 0 0 }
.mp__autoschool-hint > p:first-child { font-weight: 700; }
.mp__autoschool-close { width: 30px; height: 30px; background: url(i/close-hint.svg) no-repeat 50% 50% / 16px auto; position: absolute; right: 10px; top: 10px; cursor: pointer; }

.mp--hint .mp__autoschool-hint { height: 350px; opacity: 1;}

.mp-recall { padding: 20px 29px 20px 29px; border-bottom: 1px solid #ddd; position: relative; background: #E1F5FE }
.mp-recall-title { font: 400 14px/17px "open sans"; text-align: center; margin: 0 0 8px 0 }
.mp-recall-wrap { position: relative; }
.mp-recall-wrap:before { content: "+375"; position: absolute; left: 37px; top: 0; font: 700 17px/42px "open sans" }
.mp-recall-phone { display: block; font: 600 17px/22px "open sans"; margin: 0 0 10px 0; height: 42px; border-radius: 3px; background: #fff url(i/phone.svg) no-repeat 11px 11px / 16px auto; padding-left: 83px; }
.mp-recall-submit { width: 100%; font: 700 15px/42px "open sans"; height: 42px; background-color: #00A7F7; border-radius: 3px; }
.mp-recall-success { font: 700 17px/22px "open sans"; text-align: center; }

.mp-tab-contents { display: none; min-height: 452px; }

.mp-active-map .mp-tab-map { display: block; }
.mp-active-phones .mp-tab-phones { display: block; }
.mp-active-worktime .mp-tab-worktime { display: block; }

.mp-time { display: block; text-align: center; font: 500 23px/23px "open sans"; color: #000; padding: 20px 0; position: relative  }
.mp-time:before { content: attr(data-week); position: absolute; margin: 0 0 0 -55px; color: #999 }
.mp-time + .mp-time { border-top: 1px solid #ddd; }

.mp-time.active, .mp-time.active:before { color: #009933 }


.mp-tab-map { width: 100%; }






@media screen and (min-width:501px) {
  .mp-header { border-radius: 5px 5px 0 0 }
  .mp-tab { cursor: pointer; }
  .mp-tab:not(.active):hover { background: #f3f3f3; }

  .mp-recall-submit:hover { background-color: #0096E7 }
}

@media screen and (max-width:500px) {
  .mp-phone { -webkit-tap-highlight-color: rgba(0,0,0,0.3) }
  .mp-recall-wrap:before { top: 0; }
}


@media screen and (max-width:350px) {
  .mp-recall { padding-left: 15px; padding-right: 15px; }
}


/* vr */
.vr-mp { max-width: 375px; width: auto; background: #fff; }
.vr-mp ._vr-contents { padding: 0; }


@media screen and (min-width:501px) {
  .vr-mp { border-radius: 5px; height: 590px; }
}

@media screen and (max-width:500px) {
  .vr-mp { max-width: 100%; width: 100%; margin: 0 !important; }
}