@import url(fonts.css);
@import url(bootstrap.min.css);

body, html{
	margin: 0;
	background: #f4f4f4;
}
html{
	overflow-x: hidden !important;
}
body{
	overflow-x: hidden !important;
	overflow-y: hidden !important;
	width: 100%;
}

#preloader {
	position: absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#fff;
	z-index:1999;
	width: 100%;
	height: 100%;
}

#status {
	width:250px;
	height:250px;
	position:absolute;
	left:50%;
	top:50%;
	background-image:url(../assets/preload.gif); 
	background-repeat:no-repeat;
	background-position:center;
	margin:-125px 0 0 -125px;
}

.nb{
	padding: 0;
}
.mt{
	margin-top: 150px;
}

.navi{
	position: relative;
	min-height:120px;
	height:120px;
	height:auto;
	background: #ffffff;
	margin: 0;
	-webkit-box-shadow: 0 5px 6px -3px #c1c1c1;
	   -moz-box-shadow: 0 5px 6px -3px #c1c1c1;
	        box-shadow: 0 5px 6px -3px #c1c1c1;
	        transition:all ease .3s;
}
.navi a{
	display: inline-block;
	padding: 40px 0px;
	transition:all ease .3s;
}
.navi a img{
	height: auto;
	max-width: 100%;
}



.navbar-brand{
  padding-top:0px !important;
  padding-bottom:0px !important;
}
.navbar{
	transition:all ease .3s;
	background-color: transparent !important;
	border: none !important;
}
.shrink-nav {
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	
	min-height:80px;
	height:80px;
	height:auto;
}
.shrink-nav a{
	padding: 25px 0px;
}
.logo img{
	transition:all ease-in-out .3s;
}
.shrink-logo img {
  max-width:80% !important;
}


.overlayNavi{
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	/*top: 490px;*/
	right: 40px;
	z-index: 900;
}

.shapeNavi h4.shapeNavih4{
	color: #80b539 !important;
	min-width: 150px;
	margin-left: -160px;
}


.shapeNavi{
	width: 25px; 
	height: 50px;
	display: block;
	margin: 5px 0px;
}
.shapeNavi a{
	display: inline-block;
	margin-right: 10px;
	float: right;
	text-align: right;
	vertical-align: middle;
	text-decoration: none;
}
.shapeNavih4{
	display: none;
	font-family: "DPET";
	text-decoration: none;
	font-size: 14px;
	margin-right: 10px;
}

.shapeoverlay{
	width: 1px; height: 50px;
	background: #c6c6c6;
}
.shapeNavi a.nav-active{
	background: #80b539 !important;
}
.gotoTop{
	background: url("../assets/icon_up.svg") no-repeat scroll center center ;
	background-size: 7px 50px;
	right: 47px;
	position: fixed;
	bottom: 0px;
		display: block;
		text-decoration: none;
		margin-bottom: 50px;
		width: 7px;
		height: 50px;
		z-index: 900;
}
.navbtn{
	right: 50px;
	position: fixed;
	top: 95px;
		display: block;
		text-decoration: none;
		margin-bottom: 50px;
		width: 7px;
		height: 50px;
		z-index: 900;
}

section { 
	position: relative;
	height: 100vh; 
	clear: both; }
/*#model{
	width: 100%;
	position: relative;
	margin-left: 50%;
}*/


#model div:hover{
	cursor: grab !important;
}
.clickdrag{
	width: 215px;
	height: 110px;
	display: block;
	position: relative;
	margin: 0 auto;
}
.clickdragm{
	width: 60px;
	height: 600px;
	display: none;
	top: 0px;
	right: -10px;
	position: absolute;
	z-index: 100;
}
#ft{
	position: relative;
	/*bottom: -46px;*/
	margin-top: 76px;
	height: 50px;
	background: #690d5f;
	padding-top: 15px;
}
.ftxt{
	font-family: 'DPET';
	font-size: 14px;
	color: #ffffff;
	/*line-height: 50px;*/
}
#ft .logo img{
	height: 20px;
}

.mainttl{
	font-family: 'DPT';
	font-size: 48px;
	line-height: 60px;
	color: #690d5f;
	padding-bottom: 15px;
}
.secttl{
	font-family: 'DPET';
	font-size: 36px;
	color: #80b539;
	padding-bottom: 15px;
}

.maintxt{
	font-family: 'DPL';
	font-size: 18px;
	line-height: 24px;
	color: #575757;
}
.maintxt2{
	font-family: 'DPL';
	font-size: 18px;
	color: #575757;
}

.square-button {
    display: inline-block;
    padding: 15px 20px 17px;
    position: relative;
    overflow: hidden;
    color: #FFF;
    text-decoration: none;
    border: 1px solid #FFF;
    background: #80b539;
    font: 18px DPET, Arial, sans-serif;
    z-index: 1
}

.square-button:after {
    content: '';
    height: 0;
    width: 0;
    position: absolute;
    top: 0;
    left: 0;
    border-style: solid;
    border-width: 0;
    border-color: #690d5f transparent transparent;
    -webkit-transition: 250ms ease-out;
    transition: 250ms ease-out;
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    z-index: -1
}

.square-button:hover {
    color: #FFF;
    text-decoration: none;
    border: 1px solid #FFF;
}

.square-button:hover:after {
    border-width: 330px 330px 0 0
}

.valign {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}
.vtxt{
	margin-top: -30%;
}
.getapp{
	display: inline-block;
	float: left;
	padding-left: 15px;
	margin-top: -2px;
}
.getapp a{
	display: inline-block;
	margin-top: 5px;
}

.mc{
	position:relative;
	text-align: right;
	z-index: 2;
}

.round_animate_wrap {
    position: absolute;
    right: -80px;
    top: 55px;
    padding: 5px;
    overflow: hidden;
    z-index: 0;
}

.round_animate {
  width: 600px;
  height: 600px;
  position: relative;
  margin: 40px auto; }
  
  .round_animate .shape_1 {
    border: 1px solid #cccccc;
    border-radius: 50%;
    position: absolute;
    width: 100%;
    height: 100%;
    transform: rotate(23deg);
    animation: shape_1 35s linear infinite; }
  .round_animate .shape_1 span {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background-color: #80b539;
      position: absolute;
      left: 50%; }
  .round_animate .shape_1 span.r_1 {
        top: -4px;
        margin-left: -4px; }
  .round_animate .shape_1 span.r_2 {
        margin-left: -222px;
        top: 90px; }
  .round_animate .shape_1 span.r_3 {
        margin-left: -202px;
        top: 520px; }
  .round_animate .shape_1 span.r_4 {
        margin-left: 275px;
        top: 405px; }
        
  .round_animate .shape_2 {
    border: 1px solid #cccccc;
    width: 500px;
    top: 50px;
    height: 500px;
    left: 50px;
    border-radius: 50%;
    position: absolute;
    transform: rotate(-41deg);
    animation: shape_2 25s linear infinite; }
  .round_animate .shape_2 span {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background-color: #80b539;
      position: absolute;
      left: 50%; }
  .round_animate .shape_2 span.r_1 {
        top: -3px;
        margin-left: -3px; }
  .round_animate .shape_2 span.r_2 {
        margin-left: -198px;
        top: 90px; }
  .round_animate .shape_2 span.r_3 {
        margin-left: -202px;
        top: 398px; }
  .round_animate .shape_2 span.r_4 {
        margin-left: 237px;
        top: 315px; }


/* Safari 4.0 - 8.0 */
@-webkit-keyframes shape_1 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
/* Standard syntax */
@keyframes shape_1 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
/* Safari 4.0 - 8.0 */
@-webkit-keyframes shape_2 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
/* Standard syntax */
@keyframes shape_2 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
/* Safari 4.0 - 8.0 */
@-webkit-keyframes shape_3 {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
    
    
    
    
.featuresNavi svg{
	height: 500px;
	position: relative;
	left: -50px;
	top: 0px;
	z-index: 1000 !important;
	/*position: absolute;
	height: 100% !important;*/
}   

.featuresNavi svg path#dpot1:hover, 
.featuresNavi svg path#dpot2:hover, 
.featuresNavi svg path#dpot3:hover, 
.featuresNavi svg path#dpot4:hover, 
.featuresNavi svg path#dpot5:hover{
	cursor: pointer;
} 
.dotContent2,   
.dotContent3,
.dotContent4,
.dotContent5{
	display: none;
}    

/* #bgvid { 
 	position: relative;
   	top: 48%;
   	left: 50%;
	min-width: 100%;
   	min-height: 100%;
   	width: auto;
   	height: auto;
   	transform: translateX(-50%) translateY(-52%);
   	transition: 1s opacity;
   	background-size: cover;
   	
 }*/ 
section#mvideo{
	margin: 0 auto;
	text-align: center;
}
#bgvid {
  position: relative;
  height: auto;
  width: 90%;
}


 @-webkit-keyframes pulse {
     0%, 8% {
         -webkit-transform: scale(1);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1.1);
         opacity: 1
     }
 
     30% {
         -webkit-transform: scale(1.3);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2)
     }
 }
 
 @keyframes pulse {
     0%, 8% {
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1.1);
         transform: scale(1.1);
         opacity: 1
     }
 
     30% {
         -webkit-transform: scale(1.3);
         transform: scale(1.3);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2);
         transform: scale(2)
     }
 }
 
 @-webkit-keyframes pulse2 {
     0%, 8% {
         -webkit-transform: scale(1);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1.1);
         opacity: 1
     }
 
     30% {
         -webkit-transform: scale(1.3);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2)
     }
 }
 
 @keyframes pulse2 {
     0%, 8% {
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1.1);
         transform: scale(1.1);
         opacity: 1
     }
 
     30% {
         -webkit-transform: scale(1.3);
         transform: scale(1.3);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2);
         transform: scale(2)
     }
 }
 
 @-webkit-keyframes pulse3 {
     0%, 8% {
         -webkit-transform: scale(1);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1.4);
         opacity: 1
     }
 
     30% {
         -webkit-transform: scale(1.5);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2)
     }
 }
 
 @keyframes pulse3 {
     0%, 8% {
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1.4);
         transform: scale(1.4);
         opacity: 1
     }
 
     30% {
         -webkit-transform: scale(1.5);
         transform: scale(1.5);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2);
         transform: scale(2)
     }
 }
 
 @-webkit-keyframes pulse4 {
     0% {
         -webkit-transform: scale(0);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1);
         opacity: 1
     }
 
     50% {
         -webkit-transform: scale(1.4);
         opacity: 1
     }
 
     60% {
         -webkit-transform: scale(1.5);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2)
     }
 }
 
 @keyframes pulse4 {
     0% {
         -webkit-transform: scale(0);
         transform: scale(0);
         opacity: 0
     }
 
     15% {
         -webkit-transform: scale(1);
         transform: scale(1);
         opacity: 1
     }
 
     50% {
         -webkit-transform: scale(1.4);
         transform: scale(1.4);
         opacity: 1
     }
 
     60% {
         -webkit-transform: scale(1.5);
         transform: scale(1.5);
         opacity: 1
     }
 
     100% {
         opacity: 0;
         -webkit-transform: scale(2);
         transform: scale(2)
     }
 }
 
 .pulse_holder {
     display: block;
     position: absolute;
     top: 30%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     width: 288px;
     height: 288px
 }
 
 .pulse_holder.pulse_holder_hide .pulse_rays1, .pulse_holder.pulse_holder_hide .pulse_rays2,
 .pulse_holder.pulse_holder_hide .pulse_rays3, .pulse_holder.pulse_holder_hide .pulse_rays4 {
     -webkit-animation: none;
     animation: none
 }
 
 .pulse_holder .pulse_rays1 {
     margin: 0 auto;
     border-radius: 50%;
     width: 120px;
     height: 120px;
     position: absolute;
     top: 84px;
     right: 84px;
     border: 1px solid rgba(128, 181, 57, .6);
     opacity: .1;
     -webkit-animation: pulse 4s linear infinite;
     animation: pulse 4s linear infinite
 }
 
 .pulse_holder .pulse_rays2 {
     margin: 0 auto;
     border-radius: 50%;
     width: 168px;
     height: 168px;
     position: absolute;
     top: 60px;
     right: 60px;
     background-color: rgba(255, 255, 255, .03);
     border: 1px solid rgba(128, 181, 57, .3);
     opacity: .1;
     -webkit-animation: pulse2 4s linear infinite;
     animation: pulse2 4s linear infinite
 }
 
 .pulse_holder .pulse_rays3 {
     margin: 0 auto;
     border-radius: 50%;
     width: 288px;
     height: 288px;
     position: absolute;
     top: 0;
     right: 0;
     background-color: rgba(255, 255, 255, .03);
     border: 1px solid rgba(128, 181, 57, .2);
     opacity: .1;
     -webkit-animation: pulse3 4s linear infinite;
     animation: pulse3 4s linear infinite
 }
 
 .pulse_holder .pulse_rays4 {
     margin: 0 auto;
     border-radius: 50%;
     width: 750px;
     height: 750px;
     position: absolute;
     top: -225px;
     right: -225px;
     background-color: rgba(255, 255, 255, .05);
     opacity: .1;
     -webkit-animation: pulse4 4s linear infinite;
     animation: pulse4 4s linear infinite
 }
 
 .pulse_holder .play-btn {
     cursor: pointer;
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     color: #80b539;
     text-transform: uppercase;
     font-family: "DPL";
     font-size: 14px;
     line-height: 23px;
     display: block;
     padding-left: 29px;
     letter-spacing: 1px
 }
 
 .pulse_holder .play-btn img {
     position: absolute;
     top: 50%;
     left: 0;
     -webkit-transform: translateY(-50%);
     transform: translateY(-50%)
 }   
   
.efficiency{
	position: absolute;
	right: -200px !important;
	top: 250px;
	z-index: 1000;
	opacity: 0;
}  
.efficiency img{
	display: inline-block;
	margin-right: -8px;
    position: relative;
    right: -5px;
    z-index: 5;
    -webkit-animation: slide 1.5s infinite;
    -webkit-animation-delay: 3s;
    animation: slide 1.5s infinite;
}

@-webkit-keyframes slide {
    100% { right: 0; }
}

@keyframes slide {
    100% { right: 0; }
}    
.efficiency span{
	position: relative;
	display: inline-block;
	vertical-align: top;
	/*color: #690d5f;*/
	color: #000000;
	font-family: "DPET";
	font-size: 12px;
	padding: 10px;
	background: #ffffff;
	border-left: 2px solid #80b539;
	text-transform: uppercase;
	z-index: 10;
}  
.click{ cursor:pointer;}  
div.pulseDot {
 	position: absolute !important;
 	width: 48px !important;
 	height: 48px !important;
 	z-index: 20 !important;
 	box-sizing: border-box;
	border: none;
}
 div.pulseDot a {
 	cursor: pointer;
 	position: absolute !important;
 	width: 48px;
 	height: 48px;
 	background: white;
 	border-radius: 50%;
 	box-sizing: border-box;
 	vertical-align: middle;
 	text-align: center;
 	line-height: 48px;
 	text-align: center;
    animation: pulseDot 2s infinite;
    z-index: 100;
 }
  .pulseDot a:hover{
  	border: 1px solid #80b539;
  }
  
 svg#greenLineLeft{
 	position: relative;
 	top: -27px;
 	left: -245px;	
 }
 svg#greenLine{
 	position: relative;
 	top: -20px;
 	left: 15px;
 }
 svg#greenLineR{
 	position: relative;
 	top: -50px;
 	left: 15px;
 }
 .alignmentL{
 	position: relative;
 	top: -95px;
 	left: -243px;
 }
 .alignment{
 	position: relative;
 	top: -95px;
 	left: 65px;
 }
 
 .alignmentR{
	position: relative;
	top: -160px;
	/*left: 180px;*/
	left: 260px;	
 }
 .alignmentRr{
 	position: relative;
 		top: -95px;
 		left: 110px;
 }
 
 @-webkit-keyframes pulseDot {
   0% {
     -webkit-box-shadow: 0 0 0 0 rgba(128, 181, 57, 0.4);
   }
   70% {
       -webkit-box-shadow: 0 0 0 10px rgba(128, 181, 57, 0);
   }
   100% {
       -webkit-box-shadow: 0 0 0 0 rgba(128, 181, 57, 0);
   }
 }
 @keyframes pulseDot {
   0% {
     -moz-box-shadow: 0 0 0 0 rgba(128, 181, 57, 0.4);
     box-shadow: 0 0 0 0 rgba(128, 181, 57, 0.4);
   }
   70% {
       -moz-box-shadow: 0 0 0 10px rgba(128, 181, 57, 0);
       box-shadow: 0 0 0 10px rgba(128, 181, 57, 0);
   }
   100% {
       -moz-box-shadow: 0 0 0 0 rgba(128, 181, 57, 0);
       box-shadow: 0 0 0 0 rgba(128, 181, 57, 0);
   }
 } 

.pulseDotCnt4{
	width: 450px !important;
}
.pulseDotCnt{
	width: 250px;
}	
.tdtitle{

	font-family: 'DPT';
	font-size: 21px;
	line-height: 32px;
	color: #690d5f;
	padding-bottom: 10px;	
}
.tddesc{
	font-family: 'DPL';
	font-size: 13px;
	line-height: 18px;
	color: #575757;
	padding-bottom: 10px;
	width: 220px;	
}




/* Overlay style */
.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	/*background: rgba(105,13,95,0.9);*/
	
	background: rgba(105,13,95,0.9);
	background: -moz-linear-gradient(-135deg, #92278f 25%, #690a66 100%);
	background: -webkit-linear-gradient(-135deg, #92278f 25%, #690a66 100%);
	background: linear-gradient(-135deg, #92278f 25%, #690a66 100%);
	
	z-index: 2000;
}


.overlay .overlay-close {
	width: 80px;
	height: 80px;
	position: absolute;
	right: 20px;
	top: 20px;
	overflow: hidden;
	border: none;
	background: url(../assets/cross.png) no-repeat center center;
	text-indent: 200%;
	color: transparent;
	outline: none;
	z-index: 100;
}

.overlay nav {
	text-align: center;
	position: relative;
	top: 50%;
	height: 60%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.overlay ul {
	list-style: none;
	padding: 0;
	/*margin: 0 auto;*/
	text-align: left;
	display: inline-block;
	height: 100%;
	position: relative;
}

.overlay ul li {
	display: block;
	height: 20%;
	height: calc(100% / 5);
	min-height: 54px;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.overlay ul li a {
	font-size: 52px;
	line-height: 80px;
	font-weight: 300;
	font-family: "DPET";
	display: block;
	color: #fff;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.overlay ul li a:hover,
.overlay ul li a:focus {
	color: #f0f0f0;
	text-decoration: none;
}

.overlay-cornershape {
	background: transparent;
	visibility: hidden;
	-webkit-transition: visibility 0s 0.5s;
	transition: visibility 0s 0.5s;
}

.overlay-cornershape.open {
	visibility: visible;
	-webkit-transition: none;
	transition: none;
}

.overlay-cornershape svg {
	position: absolute;
	top: 0;
	left: 0;
}

.overlay-cornershape .overlay-path {
	fill: rgba(105,13,95,0.9);
}

.overlay-cornershape nav,
.overlay-cornershape .overlay-close {
	opacity: 0;
	-webkit-transition: opacity 0.4s 0.4s;
	transition: opacity 0.4s 0.4s;
}

.overlay-cornershape.open nav,
.overlay-cornershape.open .overlay-close {
	opacity: 1;
	-webkit-transition-delay: 0.4s;
	transition-delay: 0.4s;
}

.overlay-cornershape.close nav,
.overlay-cornershape.close .overlay-close {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}
/*

@media screen and (max-height: 30.5em) {
	.overlay nav {
		height: 70%;
		font-size: 34px;
	}
	.overlay ul li {
		min-height: 34px;
	}
}*/



@media (min-width:1920px) { }
@media screen and (max-width: 1440px) { }
@media screen and (max-width: 1279px){

	.navi{
		height: auto !important;
		min-height: 70px;
	}
	.navi a{
		padding: 20px;
	}
	.shrink-logo img{
		max-width: 100% !important;
	}
	.shrink-nav {
		min-height:70px;
		height:70px;
		height:auto;
	}
	.shrink-nav a{
		padding: 20px;
	}
	.logo img{
		transition: none !important;
	}
	
	
	.overlay .overlay-close {
		width: 20px;
		height: 20px;
	}
	.overlay ul{
		display: block;
		text-align: center;
		margin: 0 auto;
	}
	.overlay ul li {
		height: 36px;
		min-height: 36px;
	}
	
	.overlay ul li a {
		font-size: 22px;
	}
	
	.overlayNavi {
		position: fixed;
	    bottom: 0;
	    width: 100%;
	    height: 40px;
	    text-align: center;
	    display: table;
	    margin: 0 auto;
	    right: 0px;
	    left: auto !important;
	    top: auto !important;
	    transform: translateY(0%);
	    background: #fff;
	    z-index: 900;
	}     
	.shapeoverlay{
		height: 25px;
		background: #ffffff !important;
	} 
	.shapeNavi a.nav-active{
		background: #ffffff !important;
	}
	.shapeNavi a.nav-active h4{
		color: #690d5f !important;
	}
	.shapeNavi {
	    display: inline-block;
	    height: 25px;
	    margin: 8px 10px 0px 5px;
	}  
	.shapeNavi span{
		display: none;
	}
	.shapeNavih4{
		display: inline;
	}
	.shapeNavi h4.shapeNavih4{
		margin-left: 8px;
	}
	.gotoTop{
	  	display: none;
	}
	.gotoTopm{
	  	background: url("../assets/icon_upm.svg") no-repeat scroll center center ;
	  	right: 10px;
	  	position: fixed;
	  	bottom: 15px;
	  	display: block;
	  	text-decoration: none;
	  	margin-bottom: -5px;
	  	width: 25px;
	  	height: 25px;
	  	line-height: 40px;
	  	z-index: 1000;
	}
	.navbtn{
		left: 10px;
		position: fixed;
		bottom: 15px;
		top: 100%;
		margin-top: -35px;
		z-index: 1000;
	}
	.navbtn a img:first-child{
		display: none;
	}
	section:last-of-type{
		margin-bottom: 0px;
		height: auto !important;
	}
	.round_animate_wrap{
		top: 35px;
	}
	.mainttl{
		font-size: 36px;
		line-height: 48px;
	}
	.secttl{
		font-size: 22px;
	}
	
	.maintxt{
		font-size: 16px;
		line-height: 20px;
	}
	.maintxt2{;
		font-size: 16px;
	}
	
	.square-button {
	    padding: 15px 20px 17px;
	    font: 18px DPET, Arial, sans-serif;
	}
	.mc img{
		max-width: 100%;
		height: auto;
	}
	#features .dotContent1 img, #features .dotContent2 img, #features .dotContent3 img, #features .dotContent4 img, #features .dotContent5 img, #app .mc img{
		max-width: 60% !important;
		background-size: 75% !important;
	}

	
	#bgvid{
		min-width: auto !important;
		min-height: auto !important;
		width: 100%    !important;
		height: auto   !important;
		top: 0%; left: 0%;
		transform: translateX(0%) translateY(0%); 
	}
	.pulse_holder {
	    display: block;
	    position: absolute;
	    top: 25%;
	    left: 50%;
	    -webkit-transform: translate(-50%, -50%);
	    transform: translate(-50%, -50%);
	    width: 288px;
	    height: 288px;
	}
	.efficiency{
		right: -10px !important;
		top: 125px;
	}
	.efficiency span{
		font-size: 10px;
	}
	#ft { bottom: 40px; }
	.ftxt span{
		padding-left: 10px !important;
	}
	#ft a{
		padding-right: 12px;
	}

 }

@media screen and (max-width: 767px) { 

	.navi{
		height: auto !important;
		min-height: 70px;
	}
	.navi a{
		padding: 20px;
	}
	.shrink-logo img{
		max-width: 100% !important;
	}
	.shrink-nav {
		min-height:70px;
		height:70px;
		height:auto;
	}
	.shrink-nav a{
		padding: 20px;
	}
	.logo img{
		transition: none !important;
	}
	
	
	.overlay .overlay-close {
		width: 20px;
		height: 20px;
	}
	.overlay ul{
		display: block;
		text-align: center;
		margin: 0 auto;
	}
	.overlay ul li {
		height: 36px;
		min-height: 36px;
	}
	
	.overlay ul li a {
		font-size: 22px;
	}
	
	.overlayNavi {
		position: fixed;
	    bottom: 0;
	    width: 100%;
	    height: 40px;
	    text-align: center;
	    display: table;
	    margin: 0 auto;
	    right: 0px;
	    left: auto !important;
	    top: auto !important;
	    transform: translateY(0%);
	    background: #fff;
	    z-index: 900;
	}     
	.shapeoverlay{
		height: 25px;
		background: #ffffff !important;
	} 
	.shapeNavi a.nav-active{
		background: #ffffff !important;
	}
	.shapeNavi a.nav-active h4{
		color: #690d5f !important;
	}
	.shapeNavi {
	    display: inline-block;
	    height: 25px;
	    margin: 8px 10px 0px 5px;
	}  
	.shapeNavi span{
		display: none;
	}
	.shapeNavih4{
		display: inline;
	}
	.shapeNavi h4.shapeNavih4{
		margin-left: 8px;
	}
	.gotoTop{
	  	display: none;
	}
	.gotoTopm{
	  	background: url("../assets/icon_upm.svg") no-repeat scroll center center ;
	  	right: 10px;
	  	position: fixed;
	  	bottom: 15px;
	  	display: block;
	  	text-decoration: none;
	  	margin-bottom: -5px;
	  	width: 25px;
	  	height: 25px;
	  	line-height: 40px;
	  	z-index: 1000;
	}
	.navbtn{
		left: 10px;
		position: fixed;
		bottom: 15px;
		top: 100%;
		margin-top: -35px;
		z-index: 1000;
	}
	.navbtn a img:first-child{
		display: none;
	}
	section{
		height: auto !important;
		margin-bottom: 100px;
		min-height: 100% !important;
	}
	section:last-of-type{
		margin-bottom: 0px;
	}
	.valign {
	  display: block;
	}
	.featuresNavi svg{
		height: 400px;
		left: 0px;margin-bottom: 30px
	}
	.valignm div:nth-child(1) { z-index:10;}
	.valignm div:nth-child(2n+3) { position: absolute; top: 10px; z-index: 1; margin-bottom: 30px;
	}
	
	.vtxt{
		margin-top: 0px;
	}
	.round_animate_wrap{
		display: none;
	}
	
	.mainttl{
		font-size: 36px;
		line-height: 48px;
	}
	.secttl{
		font-size: 22px;
	}
	
	.maintxt{
		font-size: 16px;
		line-height: 20px;
	}
	.maintxt2{;
		font-size: 16px;
	}
	
	.square-button {
	    padding: 15px 20px 17px;
	    font: 18px DPET, Arial, sans-serif;
	}
	
	#app .getapp span.maintxt{
		font-size: 12px;
	}
	#app img{
		width: 70px;
	}
	.dotContent1 img, .dotContent2 img, .dotContent3 img, .dotContent4 img, .dotContent5 img{
		max-width: 60%;
		background-size: 80% !important;
	}
	
	#bgvid{
		min-width: auto !important;
		min-height: auto !important;
		width: 100%    !important;
		height: auto   !important;
		top: 0%; left: 0%;
		transform: translateX(0%) translateY(0%); 
	}
	.pulse_holder {
	    display: block;
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    -webkit-transform: translate(-50%, -50%);
	    transform: translate(-50%, -50%);
	    width: 288px;
	    height: 288px;
	}
	.pulse_holder .pulse_rays3, .pulse_holder .pulse_rays4{
		display: none;
	}
	#outro .mc img{
		max-width: 100%;
		height: auto;
	}
	.efficiency{
		right: -10px !important;
		top: 125px;
	}
	.efficiency span{
		font-size: 10px;
	}
	#ft { bottom: 40px; }
	.ftxt span{
		padding-left: 10px !important;
	}
	#ft a{
		padding-right: 12px;
	}
	.tdtitle{
		font-size: 12px;
		line-height:14px;
	}
	.tddesc{
		font-size: 8px;
		line-height: 10px;	
	}
	section#preview{
		margin-bottom: 0xp !important;
	}
	section#app{
		/*margin-top: -250px;*/
		padding-top: 50px;
		margin-bottom: 100px !important;
		z-index: 800;
	}
	.clickdragm{
		display: block;
	}
}
@media screen and (max-width: 368px) {
	.shapeNavi{
		margin: 8px 10px 0px 0px;
	}
	.efficiency{
		right: -30px !important;
		top: 90px;
	}
}


@media screen and (max-width: 767px) and (orientation: portrait) {
  .pulseDotCnt{
  	position: absolute !important;
  	top: 0px;
  	margin-top: 0px !important;
  }
  .alignmentL{
  	top: 0px !important;
  	left: -80px !important;
  	right: 0px !important;
  	width: 80px;
  }
  .alignmentR{
  	top: -50px !important;
  	left: 100px !important;
  	width: 80px;
  }
  .alignment, .alignmentRr{
  	top: 0px !important;
  	right: -80px !important;
  	left: 60px !important;
  	width: 70px;
  }
	.pulseDotCnt svg{
		display: none;
	}
	
	div.pulseDot a {
		width: 38px;
		height: 38px;
	}
	.pulseDotCnt0{
		top: -20px !important;
		left:-15px !important;
	}
	.pulseDotCnt1{
		top: 40px !important;
		left: 20px !important;
	}
	.pulseDotCnt2{
		top:  10px !important;
		left: 20px !important;
	}
	.pulseDotCnt3{
		left: -20px !important;
	}
	.pulseDotCnt4{
		left: 8px !important;
		top: 12px !important;
		
	}
	.pulseDotCnt5{
		left: 8px !important;
		top: -15px !important;
	}
}


@media screen and (min-width: 1279px) and (max-height: 800px) { 
	.mt{
		margin-top: 130px;
	}
	.round_animate_wrap{
		position: absolute;
		right: -30px;
		top: 0px;
		padding: 5px;
		overflow: hidden;
		z-index: 0;	
	}
	
	.hadj img{
		height: auto;
		max-width: 100%;
	}
	.mc{
		text-align: center;
	}
	.hadjmk img{
		height: auto;
		max-width: 65%;
		background-size: 75% !important;
	}
	.efficiency span{
		width: 70%;
	}
	section#outro{
		height: auto!important;
	} 
	.tdtitle {
	    font-size: 16px;
	    line-height: 32px;
	}
	.tddesc {
	    font-size: 12px;
	    line-height: 15px;
	}
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .alignmentL,  .alignmentRr, .alignment{
     	top: -155px !important;
     }
    
     .alignment{
     	position: relative;
     	left: 65px;
     }
     
     .alignmentR{
    	position: relative;
    	top: -200px;
    	left: 260px;	
     }
     .alignmentRr{
     		left: 110px;
     }
     
     .pulseDotCnt{
     	position: relative;
     	top: -50px !important;
     }
}

 @media screen and (max-width: 361px), (-webkit-device-pixel-ratio: 3), (orientation: portrait) {
		
		.efficiency{
			right: -25px !important;
			top: 105px;
		}
    }