@media only screen and (max-height: 768px) {
header .container{
	padding-top: 25px;
}
.head-phone a{
	font: normal 18px/20px "ProximaB", sans-serif;
	-webkit-background-size: 15px;
	background-size: 15px;
	padding-left: 28px;
}
.logo img{
	width: 142px;
}
.call-btn{
    width: 142px;
    height: 42px;
    border-radius: 21px;
    font: normal 14px/14px "ProximaB";
    margin-left: 25px;
    border-bottom: 4px solid #d8700c;
}
.site-title{
	font: normal 28px/37px "GEB";
	margin-bottom: 10px;
}
.site-title strong{
	line-height: 37px;
}
.site-desc{
	margin-top: 25px;
	font: normal 20px "ProximaL";
}
.site-btn strong{
	font: normal 23px "ProximaB";
}
.site-btn svg{
	width: 52px;
	margin-left: 26px;
}
.site-btns{
	margin-top: 120px;
}
.site-btns:before{
    width: 650px;
    height: 322px;
    bottom: -50px;
    left: -197px;
}
.site-spec{
	width: 205px;
	height: 127px;
	background-position: -28px -27px;
    bottom: 66px;
    right: 68px;
}
.spec-title{
	font: normal 24px "ProximaB";
}
.spec-title span{
	font-size: 14px;
}
.spec-title img{
	width: 13px;
}
.spec-desc{
	font: normal 14px/23px "ProximaR";
	margin-top: 6px;
}
.list-title{
	font: normal 18px/21px "ProximaB";
}
.list-desc{
	font: normal 13px/21px "ProximaR";
	margin-top: 10px;
}
.site-list{
	margin-top: 30px;
}
.site-list li{
	width: 250px;
	margin-right: 86px;
}
.main-container{
    -ms-align-items: center;
    align-items: center;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 0;
	margin-top: 20px;
}
.main-info{
    max-width: 670px;
}
.slogan{
	font: normal 16px/20px "ProximaR";
	margin-left: 35px;
	margin-top: 8px;
}
.main-video{
	width: 100%;
	position: absolute;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 10;
  position: absolute;
  top: 50%; 
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%; 
  min-height: 100%; 
  width: auto; 
  height: auto;
  z-index: -1000; 
  overflow: hidden;
}
.main-video video{
	min-width: 100%; 
    min-height: 100%; 
    width: auto;
    height: auto;
}
}
@media only screen and (max-width: 1200px) {
.container{
	padding: 0 15px;
	width: 	100%;
}
.main-video{
	transform: translateX(-50%) translateY(-50%);
}
}
@media only screen and (max-width: 1024px) {
.main-video video{
	margin-top: 	0;
}
.main{
	width: 100%;	
}
.screen{
	width: 100%;	
}
.screen{
	overflow: hidden;	
	max-width: 	100%;
	max-height: 100%;
	position: absolute;	
	width: 100%;	
	height: 100%;	
	left: 0;
	top: 0;
}
video{
	position: absolute;	
	display: block;	
	right: 	-100px;
	width: 100%;	
}
.slogan{
margin-top: 3px;
    font-size: 14px;
    max-width: 200px;
    margin-left: 15px;
    line-height: 18px;	
}
.head-phone a{
	font-size: 18px;	
}
.logo img{
	width: 130px;	
}
}


/* Portrait */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
video{
	right: 	-700px;	
}
.screen{
	overflow: hidden;	
	max-width: 	100%;
	max-height: 100%;
	position: absolute;	
	width: 100%;	
	height: 100%;	
	left: 0;
	top: 0;
}
.main-info{
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.site-title, .site-title strong{
	font-size: 60px;
	line-height: 74px;
}
.site-desc{
	font-size: 41px;
	line-height: 52px;
	margin-top: 40px;
}
.main-container{
	-ms-align-items: flex-start;
	align-items: flex-start;
	margin-top: 180px;
}
.slogan{
	position: absolute;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	max-width: unset;
	width: auto;
	text-align: center;
	top: 125px;
	font-size: 20px;
}
.slogan br{
	display: none;
}
.main-video{
	display: none;
}
.main{
	background-image: url(../images/cover_ipad.webp);
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: left top;
}
.site-spec{
	width: 100%;
    position: static;
    margin-top: 200px;
}
.site-btn{
	margin: 0 auto;
	margin-top: 100px;
}
.site-btns:before{
    margin: 0 auto;
    left: 0;
}
.spec-title{
	font-size: 21px;
}
.spec-title strong{
	font-size: 36px;
}
.spec-title svg{
	width: 20px;
}
.spec-desc{
	font-size: 21px;
	line-height: 33px;
}
.site-list li{
	width: 334px;
	margin-right: 0;
}
.site-list{
	justify-content: space-between;
}
.list-title{
	font-size: 29px;
	text-align: left;
}
.list-desc{
	font-size: 21px;
	line-height: 32px;
	text-align: left;
	max-width: unset;
}
.container{
	padding-left: 48px;
	padding-right: 48px;
}
.site-btns:after{
width: 73px;
    height: 157px;
    background-image: url(../images/ipad_pro_portrait_arrow.png);
    background-repeat: no-repeat;
    bottom: 144px;
    right: 195px;
}
}




/* Landscape */
@media only screen 
  and (min-width: 1024px) 
  and (max-height: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1.5) {
.screen{
	overflow: hidden;	
	max-width: 	100%;
	max-height: 100%;
	position: absolute;	
	width: 100%;	
	height: 100%;	
	left: 0;
	top: 0;
}
video{
	position: absolute;	
	display: block;	
	right: 	-200px;
	width: 100%;	
}

.main-video video{
	right: -400px;
}
}
@media only screen and (max-width: 1023px) {
.main-video video	{
	margin-top: 0;
}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 
.screen{
	overflow: hidden;	
	max-width: 	100%;
	max-height: 100%;
	position: absolute;	
	width: 100%;	
	height: 100%;	
	left: 0;
	top: 0;
}
.main-info{
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}
.site-title, .site-title strong{
	font-size: 40px;
	line-height: 56px;
}
.site-desc{
	font-size: 29px;
	line-height: 52px;
	margin-top: 10px;
}
.main-container{
	-ms-align-items: flex-start;
	align-items: flex-start;
	margin-top: 140px;
}
.slogan{
	position: absolute;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	max-width: unset;
	width: auto;
	text-align: center;
	top: 105px;
	font-size: 18px;
}
.slogan br{
	display: none;
}
.main-video{
	display: none;
}
.main{
	background-image: url(../images/cover_ipad.webp);
	-webkit-background-size: cover;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: left top;
}
.site-spec{
	width: 100%;
    position: static;
    margin-top: 70px;
}
.site-btn{
	margin: 0 auto;
	margin-top: 90px;
}
.site-btns:before{
    margin: 0 auto;
    left: 0;
}
.spec-title{
	font-size: 36px;
}
.spec-title strong{
	font-size: 21px;
}
.spec-title svg{
	width: 20px;
}
.spec-desc{
	font-size: 21px;
	line-height: 33px;
}
.site-list li{
	width: 240px;
	margin-right: 0;
}
.site-list{
	justify-content: space-between;
	margin-top: 35px;
}
.list-title{
	font-size: 18px;
	line-height: 26px;
	text-align: left;
}
.list-desc{
	font-size: 14px;
	line-height: 21px;
	text-align: left;
	margin-top: 4px;
	max-width: unset;
}
.container{
	padding-left: 48px;
	padding-right: 48px;
}
.site-btns:after{
width: 73px;
    height: 157px;
    background-image: url(../images/ipad_pro_portrait_arrow.png);
    background-repeat: no-repeat;
    bottom: 124px;
    right: 110px;
}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
.main-video video {
    right: -350px;
}
}
@media only screen and (max-width: 900px) {
.screen{
	position: relative;	
}
.main{
	height: auto!important;
	background-image: url(../images/cover_mobile.webp);
	-webkit-background-size: cover;
	background-size: cover;	
}
.main-video{
	display: none;	
}
.site-title, .site-title strong{
	font-size: 22px;	
	line-height: 34px;	
	text-align: center;	
}
.site-desc{
	font-size: 16px;	
	text-align: center;	
}
.site-spec{
	font-size: 11px;	
}
.site-spec strong{
	font-size: 18px;	
}
.site-spec img{
	width: 10px;	
}
.spec-desc{
	font-size: 11px;	
	line-height: 17px;	
}
.site-btn{
	font-size: 10px;	
	height: 66px;	
	width: 289px;	
	background-image: url(../images/btn_mobile.png);
}
.site-btn strong{
	font-size: 16px;	
}
.site-btn svg{
	width: 35px;	
}
.site-btns:before{
    width: 320px;
    height: 211px;
    bottom: -59px;
    left: -14px;
    background-image: url(../images/btn_m.png);
    background-repeat: no-repeat;
}
.site-btns:after{
	width: 70px;	
	height: 97px;	
	background-image: url(../images/arrow_mobile.png);
}
.site-list{
	display: none;	
}
.site-spec{
	position: static;	
	width: 100%;	
	margin-bottom: 45px;	
}
header{
	position: static;	
}
.slogan{
	display: none;	
}
.head-phone{
	display: none;	
}
.call-btn{
	width: 97px;
	height: 33px;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;	
	font-size: 10px;		
}
.site-btns{
	margin-top: 40px;	
}
.logo img{
	width: 119px;	
}
.main-container{
	min-height: auto;
	height: 	calc(100vh - 81px);
}
.main-info{
	max-width: 	380px;
	margin-left: auto;
	margin-right: auto;	
}
.screen{
	width: auto;	
	height: auto;	
	overflow: unset;
	max-width: 	unset;
	max-height: unset;
}
body{
	width: auto;	
	height: auto;overflow: unset;
}
.fancybox-slide>div{
    padding: 20px;
}
.fancybox-close-small{
    right: 2px;
    top: -35px;
}
.modal-wrap{
    text-align: center;
}
.slogan{
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	max-width: unset;
	width: auto;
	text-align: center;
	top: 75px;
	display: block;
	font-size: 13px;
	margin-bottom: 15px;
}
.site-btns{
	margin-top: 20px;
}
.main-info{
	max-width: 292px;
	margin-left: auto;
	margin-right: auto;
}
.site-btns:after{
	bottom: 120px;
}
.main-container{
	height: auto;
	min-height: calc(100vh - 81px);
}
header .slogan{
	display: none;
}
.mobile{
	display: block;
}
.main-container{
	min-height: calc(100vh - 140px)!important;
}
.site-btn{
	display: block;
	text-align: center;
}
.site-btn .text, .site-btn svg{
	display: inline-block;
}
.site-btn .text{
	margin-top: 15px;
}
.site-btn svg{
	position: relative;
	top: 5px;
}
}

}




@media only screen and (min-width: 1900px) {
.main-video video{
	position: relative;
	right: 0;
}
}
@media only screen and (min-width: 1200px) {
.main,video{
	min-height: auto!important;
}
}

@media only screen 
  and (max-width: 900px) 
  and (orientation: landscape) {
.main-container{
	padding-bottom: 20px;
 }
.site-btns:after {
    bottom: 131px;
}
.main-info{
	margin-left: 0;
	margin-right: 0;
}
.site-title, .site-desc, .slogan{
	text-align: left;
}
.main {
    height: auto!important;
    background-image: url(../images/cover.webp);
    -webkit-background-size: cover;
    background-size: cover;
    background-position: -300px 0;
}
.main-container{
	min-height: calc(100vh - 81px)!important;
}
body, .main, .screen{
	height: unset!important;
	overflow: unset!important;
}

}
@media only screen and (min-width: 1300px) {
.main-video video{
	height: auto!important;
	min-height: 100vh!important;
}
}
@media only screen and (min-width: 1400px) {
.main-video video{
	right: -200px;
}
}
@media only screen and (min-width: 1650px) {
.main-video video{
	right: -100px;
}
}
@media only screen and (min-width: 1700px) {
.main-video video{
	right: -50px;
}
}
@media only screen and (min-width: 1750px) {
.main-video video{
	right: 0;
}
}
@media only screen and (min-width: 901px) {
.site-btn{
	display: block;
	text-align: center;
}
.site-btn .text, .site-btn svg{
	display: inline-block;
}
.site-btn .text{
	margin-top: 20px;
}
.site-btn svg{
	position: relative;
	top: 10px;
}
}