@import url("https://fonts.googleapis.com/css?family=Noto+Sans+KR:400,500,700,900|Nanum+Gothic:400,500,700|Righteous:400,500,700|Source+Sans+Pro:300,600");

body {
	line-height: 1;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

	blockquote:before, blockquote:after, q:before, q:after {
		content: '';
		content: none;
	}

*, *:before, *:after {
   box-sizing: inherit;
}
   

/* Basic */
@-ms-viewport {
   width: device-width;
}

html {
   box-sizing: border-box;
}
body {
	-webkit-text-size-adjust: none;   
   -ms-overflow-style: scrollbar;
   background-color: #fff;
   color: #fff;
   font-family: 'Roboto','NanumSquare','Apple SD Gothic Neo', 'Nanum Gothic', 'Noto Sans','sans-serif';
   font-size: 16.5pt;
   font-weight: 300;
   line-height: 1.65;   
}

body.is-preload *, body.is-preload *:before, body.is-preload *:after {
   -moz-animation: none !important;
   -webkit-animation: none !important;
   -ms-animation: none !important;
   animation: none !important;
   -moz-transition: none !important;
   -webkit-transition: none !important;
   -ms-transition: none !important;
   transition: none !important;
}

h1, h2, h3, h4, h5, h6 {
   color: #ffffff;
   font-weight: 700;
   letter-spacing: 0em;
   margin: 0 0 1em 0;
}

h2 {
   font-size: 1.2em;
}

h3 {
   font-size: 0.9em;
}

h4 {
   font-size: 0.7em;
}

h5 {
   font-size: 0.7em;
}

h6 {
   font-size: 0.7em;
}

sup{
   color: #fff;
   font-size: 0.7em;  
   line-height: 0;
   padding-left:3px; 
   font-style:italic;
   letter-spacing:-0.8;
}
code {
   background: transparent;
   border-radius: 5px;
   border: solid 2px rgba(68, 20, 205, 1);
   font-size: 0.9em;
   padding: 0.25em 0.65em;
}
span.logo,
span.logo sup{  
   color: rgb(68, 20, 205);
   font-family: 'Righteous', 'Roboto', sans-serif;   
}
span.logo2,
span.logo2 sup{  
   color: #fff;
   font-weight: normal;
   font-family: 'Righteous', 'Roboto', sans-serif;   
}

span.large-text{
   font-size: 2rem;
   font-weight: bold;   
}

.text-alert{
    color: #fc4f59;
    font-weight: bold;
}

section{
   align-items: center;
   -webkit-scroll-snap-coordinate: 0 0;
	-ms-scroll-snap-coordinate: 0 0;
	scroll-snap-coordinate: 0 0;   
}

input, select, textarea {
   color: #222;
   font-family: 'Roboto','NanumSquare','Apple SD Gothic Neo', 'Nanum Gothic', 'Noto Sans','sans-serif';
   font-size: 16.5pt;
   font-weight: 300;
   line-height: 1.65;
}

@media screen and (max-width: 1680px) {
   body, input, select, textarea {
      font-size: 13pt;
   }
   .container{
      width:80%!important;
   }
}

@media screen and (max-width: 1280px) {
   body, input, select, textarea {
      font-size: 12pt;
   }
   .container{
      width:90%!important;
   }
}

@media screen and (max-width: 980px) {
   body, input, select, textarea {
      font-size: 12pt;
   }
}

@media screen and (max-width: 736px) {
   body, input, select, textarea {
      font-size: 12pt;
  }
  .container{
   width:95%!important;
   }  
  h2 {
   font-size: 1em;
 }
 h3 {
   font-size: 0.8em;
 }	  
}

@media screen and (max-width: 480px) {
   body, input, select, textarea {
      font-size: 12pt;
   }
   .container{
      width:95%!important;
      }    
}


 a {
   -moz-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
   -webkit-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
   -ms-transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
   transition: color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
   text-decoration: none;
}

   a:hover {
      border-bottom-color: transparent;
      color: #ffffff !important;
   }

   a.special:not(.button) {
      text-decoration: none;
      border-bottom: 0;
      display: block;
      font-size: 0.8em;
      font-weight: 700;
      letter-spacing: 0.1em;
      margin: 0 0 2em 0;
   }

      a.special:not(.button):before {
         -moz-osx-font-smoothing: grayscale;
         -webkit-font-smoothing: antialiased;
         font-family: FontAwesome;
         font-style: normal;
         font-weight: normal;
         text-transform: none !important;
      }

      a.special:not(.button):before {
         -moz-transition: background-color 0.2s ease-in-out;
         -webkit-transition: background-color 0.2s ease-in-out;
         -ms-transition: background-color 0.2s ease-in-out;
         transition: background-color 0.2s ease-in-out;
         border-radius: 100%;
         border: solid 2px rgba(255, 255, 255, 0.125);
         content: '\f105';
         display: inline-block;
         font-size: 1.25em;
         height: 2em;
         line-height: 1.65em;
         margin-right: 0.85em;
         text-align: center;
         text-indent: 0.15em;
         vertical-align: middle;
         width: 2em;
      }

      a.special:not(.button):hover:before {
         background-color: rgba(255, 255, 255, 0.025);
      }

      a.special:not(.button):active:before {
         background-color: rgba(255, 255, 255, 0.075);
      }


      a.scrooltop,
      a.scroolbt {
         position: fixed;
         right: 2px;
         bottom: 2rem;
         width: 50px;
         height: 40px;
         display: none;
         background: rgba(33, 150, 243, 0.6);
         border-radius:3px 0 0 3px;
         border:none;
         color:#fff ;
      }
      
      a.scrooltop i,
      a.scroolbt i{
         margin: 7px 12px;
      }      

      a.scrooltop:hover, a.scrooltop:active,
      a.scroolbt:hover, a.scroolbt:active {
         background: rgb(68, 20, 205);
      }

      
      #scm-navy{
         position: fixed;
         padding: 0;   
         right: 2px;
         bottom: 80px;
         width: 100px;
      }

      .scm-navy-ul {
         padding: 0;
         list-style: none;
         position: relative;
         display: none;             
      } 
      
      .scm-navy-ul > li{
         position: relative;
         padding: 14px 0;     
         display: none;  
      }
      
      .scm-navy-ul:before{
         top: 16px;
         bottom: 0;
         right: 13px;
         width: 2px;
         content: '';
         background: #f3f3f3;
         position: absolute;
         margin-left: -12px;
         margin-bottom: 16px;
      }
      
      .scm-navy-ul > li span {
         width: 90%;
         display: block;
         padding-right: 20px;   
         text-align: right;
         position: relative;
         color: #222;
         font-size: 14px;
         line-height: 0.9;
      }
      
      .scm-navy-ul > li .scm-blo {
         top: 16px;
         right: 10px;
         width: 10px;
         height: 10px;
         position: absolute;
         background: rgb(33, 150, 243);
         border-radius: 50% !important;
         margin: 0 0 0 -7px;
         box-shadow: 0 0 0 2px #eee;
         -webkit-font-smoothing: antialiased;
      }
      
      .scm-navy-ul > li .active{
         background: rgb(68, 20, 205);
         border-radius: 0 !important;
      }
      
.btn-floating {
   background: rgb(33, 150, 243);
}  

.btn-u{
   background: rgb(33, 150, 243);
   border-radius: 9999px;
   border-radius: 3px;
   padding: 0 20px;
   margin: 0 3px;
   min-width: 130px;
}
.btn-rounded{
   border-radius: 9999px; 
}
.btn-u-banner {
   background: linear-gradient(110deg, rgba(68, 20, 205, 1) 5%, rgba(33, 150, 243, 1) 80%, rgba(68, 20, 205, 1) 100%);
   border-radius: 9999px; 
}

.btn-u-line{
   color: rgb(68, 20, 205);
   border: 2px solid rgba(68, 20, 205, 0.7);
   background: transparent!important;
}
.btn-u-line:hover{
   background: rgb(68, 20, 205);
   color: #fff;
   font-weight: bold;
}

.btn-u:hover, 
.btn-u:focus, 
.btn-u.active,  
.btn-floating:hover, 
.btn-floating:focus,
.open .dropdown-toggle.btn-u {
   background: rgb(68, 20, 205);
}
.btn-u-split .dropdown-toggle {
   border-left: solid 1px rgb(68, 20, 205);
}



#slide-out{
   background-color: #efefef;
}
#slide-out .slide-out-header{
   background-color: #4414CD;
   padding-top: 10px;
}
#slide-out .slide-out-header img{
   
   width:80px;
   height:80px;
   margin-right: 5px;
   display: inline-block;
}
#slide-out .slide-out-header .row{
   margin: 0;
}
#slide-out .slide-out-header i{
   border: 0;  
   color: #fff;    
}
#slide-out li.slide-out-link{
   background-color: #fefefe;
}

#slide-out li.slide-out-link:hover{
   background-color: #fff;
   border-left: solid 7px #4414CD;
   -moz-transition: color 0.2s ease-in-out, border-left-color 0.2s ease-in-out;
   -webkit-transition: color 0.2s ease-in-out, border-left-color 0.2s ease-in-out;
   -ms-transition: color 0.2s ease-in-out, border-left-color 0.2s ease-in-out;
   transition: color 0.2s ease-in-out, border-left-color 0.2s ease-in-out;   
}

#slide-out li.slide-out-link.active{
   background-color: #fefefe;
   border-left: solid 7px #4414CD;
}

#slide-out li a{
   font-weight: bold;
   border-bottom: solid 1px rgba(68, 20, 205, 0.2);   
}


#slide-out li.slide-out-link:hover a{
   color: #4414CD!important; 
}
#slide-out li.slide-out-footer{
   background-color: #efefef;
}
#slide-out li.slide-out-footer a{
   border: none;
   color: #333;
   font-size: 14px;
   line-height: 14px;
}

#slide-out li.slide-out-footer a:hover{
   color: #4414CD!important;
}





#page-wrapper {
   scroll-snap-type: mandatory;
   -webkit-overflow-scrolling: touch;
   -webkit-scroll-snap-type: mandatory;
   -ms-scroll-snap-type: mandatory;
}

/* Header */
#header {
   background-color: rgba(22, 5, 85, 0.98);
   background: linear-gradient(100deg, rgba(22, 5, 85, 0.98) 40%, rgba(22, 5, 85, 0.85) 50% , rgba(22, 5, 85, 0.98) 60%);   
   height: 64px;
   width: 100%;
   left: 0;
   line-height: 1;
   padding: 0.1em 1.25em;
   position: fixed;
   top: 0;
   z-index: 998;
   border-top: solid 2px rgb(68, 20, 205) ;
}
#header ul{
   list-style-type: none;
   margin-left: 0.5rem;	   
}
   #header ul>li {  
      margin-bottom: 0.15em;
      display: block;
      font-size: 1em;	
      font-weight: bold;      
      letter-spacing: 0.1em;	
      margin-right: 1.5em;
      opacity: 1;
      float: left;
      visibility: visible;
   }

   #header ul>li a {
         border: 0;        
         color: #ffffff;         
      }
      #header ul>li a:hover {
         -moz-transition: color 0.3s ease-in-out;
         -webkit-transition: color 0.3s ease-in-out;
         -ms-transition: color 0.3s ease-in-out;
         transition: color 0.3s ease-in-out;
      }

   #header p {
      text-align: center;
      position: absolute;
      top: 0;
      right: 1rem;	   
      padding: 0;
      margin: 0;
   }

      #header p a {
         line-height: 1em;
         font-size: 1em;
         margin-top: 0.5em;		
         border: 0;
         display: inline-block;
         color: #fff;
      }

         #header p a:before {
            float: right;
         }

         #header p a[href="#menu"] {
            text-decoration: none;
            -moz-transition: background-color 0.5s ease-in-out;
            -webkit-transition: background-color 0.5s ease-in-out;
            -ms-transition: background-color 0.5s ease-in-out;
            transition: background-color 0.5s ease-in-out;
            box-shadow: inset 0 0 0 2px rgb(68, 20, 205);
            border-radius: 5px;
            padding: 0.45em 0.5em 0.3em 0.5em;
         }
            #header p a[href="#menu"]:hover {
               color: rgb(68, 20, 205)!important;
            }

            #header p a[href="#menu"]:active {
               color: rgb(68, 20, 205);
            }

   #header.alt {
      background-color: transparent;
      background:none;
   }

      #header.alt ul{
         opacity: 0;
         visibility: hidden;
      }

      #header.alt p a[href="#menu"]{
         box-shadow:none;
      }

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

      #header {
         height: 2.95em;
      }

      #header p a{
         margin-top: 0.8em;	
      }			
         #header p a[href="#menu"] {
            box-shadow: none;
            padding: 0;
         }			

         #header nav {
            top: 0;
            right: 0;
            height: inherit;
            line-height: inherit;
         }

            #header nav a {
               height: inherit;
               line-height: inherit;
            }

               #header nav a[href="#menu"] {
                  box-shadow: none;
                  border-radius: 0;
               }

                  #header nav a[href="#menu"]:hover, #header nav a[href="#menu"]:active {
                     background-color: inherit;
                  }

   }

   @media screen and (max-width: 480px) {
      #header nav a[href="#menu"] {
         width: 4em;
         white-space: nowrap;
         text-indent: 4em;
         position: relative;
      }

         #header nav a[href="#menu"]:before {
            width: inherit;
            position: absolute;
            top: 0;
            left: 0;
            text-indent: 0;
            text-align: right;
            margin-left: 0;
            padding-right: 1.25em;
         }

   }
   
#header.scm-background-trans{
   background: transparent!important;
}


#header ul>li a.active{
   color: rgb(33, 150, 243);
}


.headroom {
   will-change: transform;
   -moz-transition: transform 200ms linear;
   -webkit-transition: transform 200ms linear;
   -ms-transition: transform 200ms linear;  
   transition: transform 200ms linear;   
}
.headroom--pinned {
   transform: translateY(0%);
}
.headroom--unpinned {
   transform: translateY(-100%);
}

/* main Banner */
#banner2 {   
   display: table; 
   padding: 4em 0 1em 0 ;
   background:rgba(22, 5, 85, 1);
   background: linear-gradient(170deg, rgba(22, 5, 85, 1) 30%, rgba(0, 0, 0, 0.5) 50%, rgba(30, 0, 70, 1) 60%), url("../images/bg/5.jpg");
   background-repeat: no-repeat;
   background-size: cover;
   background-attachment: fixed;
   margin-bottom: -1em;
   height: 55vh;
   min-height: 52vh;
   overflow:hidden;
 
}

#banner {
   padding: 4em 0 1em 0 ;
	text-align: center;
	position: relative;
	margin: 0;
   background: url("../images/bg/5.jpg");
   background-repeat: no-repeat;
   background-size: cover;
   background-attachment: fixed;   
   height: 55vh;
   min-height: 52vh;   
}

#banner:before {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%; 
	content: " ";
	position: absolute;
	background: linear-gradient(175deg, rgba(22, 5, 85, 1) 35%, rgba(0, 0, 0, 0.5) 80%, rgba(30, 0, 70, 0.9) 100%);
}

#banner .inner{
   text-align: left;
   padding:0.5rem;
}

#banner .logo {
   -moz-transition: opacity 2s ease, -moz-transform 1s ease;
   -webkit-transition: opacity 2s ease, -webkit-transform 1s ease;
   -ms-transition: opacity 2s ease, -ms-transform 1s ease;
   transition: opacity 2s ease, transform 1s ease;
   -moz-transform: translateY(0);
   -webkit-transform: translateY(0);
   -ms-transform: translateY(0);
   transform: translateY(0);
   opacity: 1;
   margin: 1em 0 1.3em 0;
}

   #banner .logo .icon {
      border-radius: 100%;
      border: solid 2px rgba(255, 255, 255, 0.125);
      cursor: default;
      display: inline-block;
      font-size: 2em;
      height: 2.25em;
      line-height: 2.25em;
      text-align: center;
      width: 2.25em;
   }

#banner h2 {
   font-family: 'Noto Sans KR', 'Nanum Gothic', 'Noto Sans', sans-serif;
   -moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease, -moz-filter 0.25s ease;
   -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease, -webkit-filter 0.25s ease;
   -ms-transition: opacity 0.5s ease, -ms-transform 0.5s ease, -ms-filter 0.25s ease;
   transition: opacity 0.5s ease, transform 0.5s ease, filter 0.25s ease;
   -moz-transform: translateX(0);
   -webkit-transform: translateX(0);
   -ms-transform: translateX(0);
   transform: translateX(0);
   -moz-transition-delay: 0.65s;
   -webkit-transition-delay: 0.65s;
   -ms-transition-delay: 0.65s;
   transition-delay: 0.65s;
   -moz-filter: blur(0);
   -webkit-filter: blur(0);
   -ms-filter: blur(0);
   filter: blur(0);
   opacity: 1;
   border-bottom: solid 2px rgba(68, 20, 205, 0.8);
   font-size: 1.9em;
   margin-bottom: 0;
   padding-bottom: 0.4em;
   line-height: 1.1;   
}

#banner p {
   -moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease, -moz-filter 0.25s ease;
   -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease, -webkit-filter 0.25s ease;
   -ms-transition: opacity 0.5s ease, -ms-transform 0.5s ease, -ms-filter 0.25s ease;
   transition: opacity 0.5s ease, transform 0.5s ease, filter 0.25s ease;
   -moz-transform: translateX(0);
   -webkit-transform: translateX(0);
   -ms-transform: translateX(0);
   transform: translateX(0);
   -moz-transition-delay: 0.8s;
   -webkit-transition-delay: 0.8s;
   -ms-transition-delay: 0.8s;
   transition-delay: 0.8s;
   -moz-filter: blur(0);
   -webkit-filter: blur(0);
   -ms-filter: blur(0);
   filter: blur(0);
   opacity: 1;
   letter-spacing: 0.1em;
   word-break: keep-all;
}

@media screen and (max-width: 1280px) {
   #banner {
      margin-bottom: -1.3em; 
   }
}

@media screen and (max-width: 980px) {
   #banner .inner {
      padding: 4em 3em 3em 3em ;
      margin-bottom: -0.75em;  
   }
}

@media screen and (max-width: 736px) {
   #banner .inner {
      margin-top: 3rem;
   }

         #banner .logo .icon {
            font-size: 1.5rem;
         }

      #banner h2 {
         font-size: 1.5rem;
      }

      #banner p {
         font-size: 1.5em;
      }				
}

@media screen and (max-width: 480px) {
   #banner{
      padding: 2rem 0 0 0 ;      
      height: 63vh;
   }   
   #banner .inner {
      padding:10px;
      margin-top: 1.5rem;
   }

   #banner h2 {
      font-size: 1.5em;
   }
   #banner p {
      font-size: 0.8em;
   }		   
}



body.is-preload #banner .logo {
   -moz-transform: translateY(0.5em);
   -webkit-transform: translateY(0.5em);
   -ms-transform: translateY(0.5em);
   transform: translateY(0.5em);
   opacity: 0;
}

body.is-preload #banner h2 {
   opacity: 0;
   -moz-transform: translateX(0.25em);
   -webkit-transform: translateX(0.25em);
   -ms-transform: translateX(0.25em);
   transform: translateX(0.25em);
   -moz-filter: blur(2px);
   -webkit-filter: blur(2px);
   -ms-filter: blur(2px);
   filter: blur(2px);
}

body.is-preload #banner p {
   opacity: 0;
   -moz-transform: translateX(0.5em);
   -webkit-transform: translateX(0.5em);
   -ms-transform: translateX(0.5em);
   transform: translateX(0.5em);
   -moz-filter: blur(2px);
   -webkit-filter: blur(2px);
   -ms-filter: blur(2px);
   filter: blur(2px);
}



/* download */
#download{
    text-align: center;	 
    min-height: 20rem;
}
    #download .inner{      
        background: #fff;        
        align-items: center;
        height: 40vh;
        padding-top: 10vh;
    }

   #download .major{
      color: #282828;
      letter-spacing: 0;
      display: block;      
    }
    
    #download .major > h2{
        color: rgb(22, 5, 85);
        margin: 0;
        font-size: 2.5em;	            			        
    }
    #download .major > p{
        font-size: 14pt;	       				        
    }
    #download .content{				
        margin: 0;
        padding-top: 30px;          
    }		

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

	
      #download .major span.logo{  
         display: inline-block;
         padding-top:5px;
      }       
			
   }    

    @media screen and (max-width: 736px) {
      #download .major > h2{
         margin: 0;
         font-size: 1.2rem;	
         line-height: 1.2;				
      }	         
      #download .major span.logo{  
         display: block;
         padding-top:5px;
      }             
      #download .major > p{
         font-size: 0.8em;	
      }	      		
      #download .content{				
         margin: 0;
         color: #160533;				
         font-size: 0.9em;
      }		
   }    
   @media screen and (max-width: 480px) {
    		
      #download .btn-u-banner i{				
         display: none;
      }		
   }  


   #download .download-box { 
      width:100%;
      height:27px;      
      margin-top: 0;
      position:relative;
      top: 0;
      left: 0;  
      overflow: hidden;
   }
    
   #download .download-boxwave {
      background: url(../images/bg/banner.svg) repeat-x; 
      position: absolute;
      width: 6400px;
      height: 30px;
      transform: translate3d(0, 0, 0);
    }
    
    .download-boxwave:nth-of-type(1) {
      top: 0;
      animation: wave 7s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;
      opacity: 1;
    }
    .download-boxwave:nth-of-type(2) {
      top: -2px;
      animation: wave 6s cubic-bezier( 0.3, 0.45, 0.63, 0.53) -.125s infinite, swell 6s ease -1.25s infinite;
      opacity: 0.9;
    }
    .download-boxwave:nth-of-type(3) {
      top: -1px;
      animation: wave 5s cubic-bezier( 0.3, 0.45, 0.63, 0.53) -.15s infinite, swell 5s ease -1.75s infinite;
      opacity: 0.7;
    }

    @keyframes wave {
      0% {
        margin-left: 0;
      }
      100% {
        margin-left: -1600px;
      }
    }
    
    @keyframes swell {
      0%, 100% {
        transform: translate3d(0,-5px,0);
      }
      70% {
        transform: translate3d(0,3px,0);
      }
    }
   


.scm-section-promo{
   color: rgb(51, 51, 51);   
   padding: 3em 0 3em 0; 
   /*background-image: linear-gradient(180deg,  rgb(240, 236, 251) 60%, rgb(68, 20, 205) 40%); */
   background-color: #F2F2F7;
   background-image: radial-gradient(at 50% 100%, rgba(68, 20, 205, 0.95), rgb(22, 5, 85)); 
   background-size: 100% 45%;
   background-position-y: 100%;
   background-repeat: no-repeat;     
}

.scm-section-promo .row{
   margin: 0;
}

.scm-section-promo .col{
   align-items: center;
}

.scm-promo {
   border: 1px solid #F0ECFB;
   border-top-left-radius: 100px 70px;   
   border-bottom-right-radius: 100px 70px;      
   text-align: center;
   padding: 20px;
   max-width: 325px; 
   margin: 0 auto;
   background: #ffffff;   
}

   .scm-promo i{
      float: center;
      color: rgb(68, 20, 205);
      text-align: right;
      min-width: 50px;
      font-size: 4em;
      line-height: 1;   
      padding: 3rem;     
   }
   
   .scm-promo-content {    
      overflow: hidden;     
   }
    .scm-promo-content h3 {
        color: rgb(51, 51, 51);
        font-size: 2rem !important;
        margin: 0 0 0.7em 0 !important;
        line-height: 1;
    }
   .scm-promo-content p{
      font-size: 14px;   
      margin: 0;
      padding-bottom: 3rem;   
      word-break: keep-all;
   }


  
@media only screen and (max-width: 992px) {
   .scm-section-promo{
      background-color: rgb(68, 20, 205);
      background-image: radial-gradient(at 50% 100%, rgba(68, 20, 205, 0.95), rgb(22, 5, 85));    
      background-size: 100% 100%;
   }
   .scm-promo {
         border-radius: 70px 10px 30px 10px;     
         text-align: left;
         margin: 1em auto;
         padding: 40px 30px;
         max-width: 550px;          
   }
   .scm-promo i{
      float: left;
      text-align: left;
      font-size: 4em;
      padding: 1rem; 
   }    
   .scm-promo-content {    
      padding: 0 2rem;      
   }   
   .scm-promo-content p{
      font-size: 14px;   
      margin: 0;
      padding-bottom: 1rem;   
   }   
}
@media screen and (max-width: 480px) {
   .scm-promo {
         max-width: 450px;          
   }
   .scm-promo-content {    
      padding: 0;      
   }      
   .scm-promo-content h3{
      font-size: 1.2em !important;
   }
}

.scm-subject-icon {
	left: 50%;
	top: -22px;
	color: #585f69;
	min-width: 45px;
	font-size: 23px;
	background: #fff;
	padding: 10px 5px;
	text-align: center;
	position: relative;
	margin: 0 10px 0 -22px;
   border: 1px solid #efefef;
   border-radius:50% !important;   
}


.discription-box{
   padding: 5rem 0;   
   text-align: center;
   font-size: 16px;
   color: #232323;
   word-break: keep-all;
}
.discription-box h2 {
   margin: 0;
   padding: 0.5rem 0;
   text-align: center;
   font-size: 2.5rem;
   color: #232323;
}
.discription-box span {
   font-size: 2.5rem;
}
.discription-box-bg{
   padding: 5rem 0;   
   text-align: center;
   font-size: 16px;
   color: #232323;
    background-color: #fff; 
    background-image: url(https://s3.amazonaws.com/wordpress-cdn.eadbox.com/2019/02/04180406/Ondas_Tony_Left-01.png),url(https://s3.amazonaws.com/wordpress-cdn.eadbox.com/2019/02/04180346/Ondas_Tony_Right-01.png);
    -webkit-clip-path: polygon(0 10%, 100% 0, 100% 100%, 0 90%);
    clip-path: polygon(0 10%, 100% 0, 100% 100%, 0 90%);
    overflow: auto;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center left, center right;
    height: 100%;
    z-index: 50;
    position: relative; 
}
.discription-small-box{
   padding: 1rem;   
   text-align: center;
   font-size: 1.2rem;
   color: #222;
   word-break: keep-all;
   margin-top: -3rem;
}
.discription-small-box span{
   font-weight: bold;
   color: #4414CD;
}
.discription-small-box h5{
   font-size: 1rem;
   padding: 5px 0px;   
   color: #222;
}

.scm-section-dl {
    position: relative;
    padding: 5rem 0;
}
.scm-section-dl blockquote{
   margin-top:0px;
   border-left: 5px solid #4414CD;
}
.scm-section-dl .title-box {
    margin: 3rem 0 1rem;
    border-bottom: 1px dotted rgba(22, 5, 85, 0.3);
}
.scm-section-dl .title-box h2 {
   color: rgb(22, 5, 85);
   margin: 0 0 -2px 0;
   padding-bottom: 10px;
   font-size: 2rem;
   text-align: left;
   display: inline-block;
   border-bottom: 3px solid rgb(68, 20, 205);
}

.scm-section-dl .inner {
   padding: 1rem 0;
   font-size: 16px;
   color: #232323;
}
.scm-section-dl .contents {
   padding: 0.5rem 2rem;   
   background-color: rgba(225, 225, 225, 0.3);
   border-radius: 10px;
   margin-bottom: 3rem;
}

.scm-collapsible1 .collapsible-header{
   color: #232323;
}
.scm-collapsible1 .collapsible-header img {
    height: 20px;
    padding-right: 20px;
}
.scm-collapsible1 .collapsible-header.active{
   font-size: 18px;
   font-weight: bold;
   background-color: #fff;  
}
.scm-collapsible1 .collapsible-header.active img {
    height: 30px;
    padding-right: 30px;
}


.scm-collapsible1 .collapsible-body {
    padding-left: 70px;
    font-size: 12px;
}

.scm-collapsible1 .collapsible-body img {
   display: block;
   max-width: 400px;
   margin: 10px;
}

.scm-collapsible2{
   border:none!important;
   box-shadow:none!important;
   margin: 0 2%;   
}

.scm-collapsible2>li{
   margin: 10px 0;
   border: solid 2px #efefef;
}

.scm-collapsible2>li>div.right-align{
   margin-bottom: -3rem;
   padding-top:14px;
   margin-right:20px;
   right: 0;
}
.scm-collapsible2 .collapsible-header{
   background: #F2F2F7;   
}
.scm-collapsible2 label span{
   color: #333;   
}
.scm-collapsible2 .collapsible-header blockquote{
   margin-bottom: 0;
   font-weight: bold;
   font-size: 1.2rem;
}
.scm-collapsible2 .collapsible-header p{
   display: inline;
   text-align: left;
   margin: 0 0 0 20px;
   font-weight: 400;
   font-size: 1rem;
   line-height: 2rem;
}
.scm-collapsible2 .collapsible-body {
   padding: 20px 40px ;
}

.scm-collapsible2 .input-field-body{
   margin: 10px;  
}

.scm-scroll{
   height: 200px;
   text-align: left;
   overflow-y: scroll;
   word-wrap: break-word;
}
.scm-scroll p{
   font-size:14px!important;
   color: #777;
}
.scm-scroll p span{
   font-weight: bold;
   color: #333;
}
.scm-section-dl .content-box{
   padding: 0 30px 10px 30px;
}

.scm-tb1 {
   margin: auto;
   display: table;
   border-collapse: collapse;
   border-spacing: 0px;
   font-size: 18px;
}
.scm-tb1 th{
  text-align: center;
  border-radius: 0;
  color: #555;   
  background: #efefef;
  font-weight: bold;
  border-top: 1px solid #777;   
  border-bottom: 1px solid #999;   
  padding:5px;
}
.scm-tb1 td{
   background: #fff;
  border-bottom: 1px solid #999;
  border-radius: 0;
  padding:20px;
}

.scm-tb1 td p{
  font-size: 16px;  
  margin-bottom: 5px;
  text-align: left;
}



.scm-tb2 td{
   padding:10px;
   text-align: left;
 }
 .scm-tb2 td:first-child{
   background-color: #F2F2F7;
 }
 .scm-tb2 td:first-child p{
   text-align: center;
 }
 .scm-tb3 th,
 .scm-tb3 td{
   font-size: 12px;
   text-align: center;
 }
.scm-section-dl .striped{
    padding:10px!important;
    font-size: 14px;
 }
 .scm-section-dl .striped td{
   padding:7px!important;
}
 .scm-section-dl .content-box2{
   font-size: 14px;
   padding: 0 5px 25px 15px;

 }


.scm-section-dl .inner img.bgfull{
   image-rendering: -webkit-optimize-contrast;
   display: block;
   border-radius: 5px;
   max-width: 100%;
   max-height: 100%;
   margin: auto;
}


.scm-section1{
   position: relative; 
   background: #fff;
   letter-spacing: 0;	
   padding:6em 0 5em 0;
}
.scm-tb1 .mslink{
   color: rgb(33, 150, 243);
   font-weight: bold;
   border-bottom: dotted 1px rgb(33, 150, 243);
}
.scm-tb1 .mslink:hover{
   color: rgb(68, 20, 205)  !important;
   border-bottom: dotted 1px rgb(68, 20, 205);
}

.scm-section1 .container{
   position: relative;
}

.scm-section-promo .title-box,
.scm-section1 .title-box{
   color: #333;   
   margin: 5rem 0 5rem 0;
}

.scm-section-promo h2,
.scm-section1 h2{
   color: rgb(22, 5, 85);		
   margin: 0;
   font-size: 3rem;
   font-weight: bold;   
   text-align: center;
}



.scm-section1 p{
   letter-spacing: 0;	
   text-align: center;
   padding: 0;
   margin: 0;
}

.scm-section2{	
   padding:6em 0 3em 0;
}

.scm-section2 .title-box{
   margin: 2rem;
}

.scm-section2 .title-box h2{
   color: rgb(22, 5, 85);		
   margin: 0;	
   font-size: 2.5rem;
   text-align: center;
}

.scm-section2 .inner{
   color: #333;	
   text-align: center;
   padding:2em 0;
   margin: 2em;   
}

.scm-section2 .inner h2{
   font-weight: bold;
   font-size: 2.5rem;   
   color: rgb(33, 150, 243);
   margin: 15px;
}

.scm-section2 .content{
   padding: 0;
   margin: 0;
   color:#333;
   letter-spacing: 0;	
   text-align: center;   
   font-size: 1.2rem;  
}

#scm-company .content{
   word-break: keep-all;
}

.scm-title{
   padding: 4rem 0 0;
   margin: 0;
   background: linear-gradient(180deg, rgba(30, 0, 70, 0.7) 10%, rgba(0, 0, 0, 0.5) 100%), url("../images/bg/2.png");		
   background-repeat: no-repeat;
   background-size: cover;
   background-attachment: fixed;
   width: 100%;
   overflow:hidden;   
}
.scm-title-bg2{
   background: linear-gradient(180deg, rgba(30, 0, 70, 0.7) 10%, rgba(0, 0, 0, 0.5) 100%), url("../images/bg/3.png");
   background-repeat: no-repeat;      
   background-size: cover;     
}

.scm-title-bg3{
   background: linear-gradient(180deg, rgba(30, 0, 70, 0.7) 10%, rgba(0, 0, 0, 0.5) 100%), url("../images/bg/3.jpg");
   background-repeat: no-repeat;      
   background-size: cover;
   background-position: center center;
}
.scm-title-bg4{
   background: linear-gradient(180deg, rgba(30, 0, 70, 0.7) 10%, rgba(0, 0, 0, 0.5) 100%), url("../images/bg/1.png"); 
   background-repeat: no-repeat;   
   background-size: cover;  
   background-position: center top;   
}


.scm-title .title-header{
   border-bottom: solid 1px rgba(255, 255, 255, 0.2);
}

.scm-title .title-header h2{
   color: #fff;   
   margin: 5rem 0 7rem;
   text-align:center;
   font-size: 2.5rem;
}
.scm-title .inner{
   background-color: transparent;
   padding: 0 2rem;
   max-width: 800px;
   margin: 0 auto;
}


#scm-section-dl.tabs{
   background-color: transparent!important;
   margin: 0 auto!important;
}   
#scm-section-dl.tabs .tab3{
   max-width: 250px;
   min-width: 250px;
}
#scm-section-dl.tabs .tab a{
   color: #fff;
   font-size: 16px;
   font-weight: bold;
   border: 0px!important;  
   padding: 2px 0; 
}

#scm-section-dl.tabs .indicator{
   height: 0px;
}

#scm-section-dl.tabs .tab a.active{
   background-color: rgb(33, 150, 243)!important;
}
#scm-section-dl.tabs .tab a:hover{
   color: rgb(30, 0, 70)!important;  
   background-color: #FEFEFE!important;
   -o-transition: .3s;
   -ms-transition: .3s;
   -moz-transition: .3s;
   -webkit-transition: .3s;
   transition: .3s;
}
#scm-section-dl .tab.disabled a,
#scm-section-dl .tab.disabled a:hover,
#scm-section-dl .tab.disabled a.active{
  color: rgba(255, 255, 255, 0.7)!important;  
  background-color: transparent!important;  
}



.scm-inner{    
   background-color: #fff;
   margin-top: 10px;
   color:#555;
   padding:30px;
   border-radius: 10px;
   word-break: keep-all;
}

.scm-goodsflow{
   background: #fff;
   padding-top: 1.5rem;
}

.scm-goodsflow-title{
   color:rgb(33, 150, 243);
   font-size: 3rem;
   font-weight: bold;
   padding: 20px 0;
}

.scm-goodsflow-title i{
   position: relative;
   top: -1rem;
   font-size: 1.5rem;
}

.scm-goodsflow-title2{   
   color:rgb(30, 0, 70);
   font-size: 2rem;
   font-weight: bold;
   margin: 3rem 0;
   text-align: center;
}

.scm-goodsflow-title2 div{   
   display: block;
}

.scm-use {
   height: 100%;
   padding: 2.5rem 0;
}

.scm-use .scm-use-circle {
   background: #F2F2F7;
   height: 160px;
   width: 160px;
   border-radius: 50%;
   border: 10px solid #F0ECFB;   
   font-size: 3rem;
   margin: auto;
 }

 
 .scm-use .scm-use-circle i{
   line-height: 140px;
   flex:top;
   position: relative;
 }
 
 .scm-use .scm-use-circle1 {
   border-color: #efefef rgba(110, 127, 243, 0.1) #efefef #efefef ;   
 }

 .scm-use .scm-use-circle2 {
   border-color: #efefef rgba(110, 127, 243, 0.25) rgba(110, 127, 243, 0.25) #efefef;   
 }

 .scm-use .scm-use-circle3 {
   border-color: #efefef rgba(110, 127, 243, 0.4) rgba(110, 127, 243, 0.4) rgba(110, 127, 243, 0.4);   
 }

 .scm-use .scm-use-circle4 {
   border-color:rgba(110, 127, 243, 0.5);   
 }
 
 .scm-use-bg{
   position: relative;
   padding: 1rem;
   border-radius: 10px;
   text-align: center;
   margin-top:5rem;
   margin-bottom:1rem;
   z-index: 0;
}
.scm-use-bg:before{
   content: '';
   display: block;
   width: 100%;
   height: 100%;
   z-index: -1;
   border-radius: 10px; 
   position:absolute;left: 0;top: 0;right: 0; bottom: 0;     
   /*
   background: url(../images/bg/i-scm.svg) center right fixed repeat;
   filter: blur(1px);   

   background-image: linear-gradient(145deg, rgba(68, 20, 205, 0.4) 0%, rgba(33, 150, 243, 0.6) 20%, rgba(68, 20, 205, 0.6) 50%, rgba(33, 150, 243, 0.3) 100%) , url("../images/bg/i-scm.svg");
   background-position:50% 50%;  
   background-size:cover; position: absolute;left: 0;top: 0;right: 0; bottom: 0;
   */
   background-size: contain;
   background-attachment: fixed ;
   background-repeat: no-repeat;
   background-position: 100% 50%;  
   background-image: linear-gradient(145deg, rgba(68, 20, 205, 0.4) 0%, rgba(33, 150, 243, 0.8) 30%, rgba(68, 20, 205, 0.6) 50%, rgba(33, 150, 243, 0.3) 100%), url("../images/bg/i-scm.svg");		
}

.scm-use-bg .inner{
   background-color:rgba(255,255,255,0.9) ;
   border-radius: 10px;
   padding: 2rem;
   font-size: 0.9rem;
   font-weight: bold;
   z-index: 1;   
   margin: 0;
}

.scm-use-bg .row.inner h2{
   margin: 1.5rem;
   color: #222;  
}

.scm-use-bg .inner p{
   color: #222;  
   margin-top: 1rem;
}

.scm-use-bg .row h2{
   margin: 2rem;
   color: #fff;  
   font-size: 2.5rem;
}

 .scm-use .scm-use-content{
   font-size: 1.5rem;
   color: rgb(30, 0, 70);
   font-weight: bold;
}

.scm-use .scm-use-content h2{
   font-size: 20px;
   padding-top:15px;
   padding-bottom:5px;
   color:rgb(68, 20, 205) ;
}
.scm-use .scm-use-content h2:before,
.scm-use .scm-use-content h2::before{
   content: ' ';
}
.scm-use .scm-use-content h2:after,
.scm-use .scm-use-content h2::after{
   content: ' .';
}

.scm-use .scm-use-content span{
   color: rgb(30, 0, 70);   
}

.scm-use-contact{
   max-width: 450px;
   margin:10px auto;
   border-radius: 10px!important;
}   
.scm-use-contact i{
   display: contents;
}  
.scm-use-contact span{
   display: inline-block;
   padding-left:15px;
   font-weight: bold;
} 

.scm-use-contact a{
  color: rgb(33, 150, 243);
  border-bottom: dotted 1px rgb(33, 150, 243);
  font-size: 1rem;
}
.scm-use-contact a:hover{
  color: #fff!important;
  border-bottom: dotted 2px rgb(68, 20, 205);
}

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

   .scm-use{
      padding: 1em;
      margin: 1em auto;
      max-width: 450px;
   }

   .scm-use .scm-use-circle{
      float: left;
      font-size: 4em;      
    } 
   
   .scm-use .scm-use-content{
      padding-top: 1em;
      height: 160px;
      font-size: 2rem;
   }
 
   .scm-use-bg .inner h2{
      font-size: 2rem;
   }
   .scm-use-bg .inner{
      margin: 0 1rem;
   }   
}


@media screen and (max-width: 480px) {
   .scm-use .scm-use-circle {
      height: 100px;
      width: 100px;  
      font-size: 1.8rem;
    }
    .scm-use .scm-use-circle i{
      line-height: 85px;
    }    
    .scm-use .scm-use-content{
      height: 100px;
      font-size: 1.5rem;      
   }    
      
}

 
.parallax-container {   
   height: 300px;
   padding-top: 40px;
}
.parallax-container .inner{   
   padding: 5px;
}
.parallax-container blockquote{   
   margin-top: 30px;
   margin-bottom: -10px;
   font-size: 1.6rem;
   border-left: solid 5px rgb(33, 150, 243)!important;   
}

.parallax-container em{ 
   font-size: 14px;
}

.parallax-container span{ 
   font-weight:bold;
}

.parallax-container a{
   font-weight:bold;
}

.parallax-container .parallax img{
   -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
   filter: grayscale(100%);   

}

.parallax-container .parallax:before {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%; 
	content: " ";
   position: absolute;
}


@media screen and (max-width: 480px) {
 
   .parallax-container {   
      height: 350px;
   }
   
   .parallax-container blockquote{   
      margin: 45px 0;
      font-size: 1.2rem; 
      word-break: keep-all;
   }
   
}



.scm-gf{
   padding-top: 2em; 
 }


.scm-gf .scm-gf-circle {
   background-color: #F2F2F7;
   height: 160px;
   width: 160px;
   border-radius: 50% 0 50% 50%;
   box-shadow: inset 0 0 0 1px #F0ECFB;
   margin: auto;
 }

 .scm-gf .scm-gf-circle i{
   line-height: 1.5em;
   padding-top:0.7em;
   color: #555;
   transition:  all 1s;
 }

 .scm-gf:hover .scm-gf-circle i{ 
   color: rgb(68, 20, 205);
 }

.scm-gf .scm-gf-content{
   padding: 2rem 0;
   font-size: 1rem;
   font-weight: bold;
   color: #666;   
}

.scm-gf .scm-gf-content h3{
   display: block;
   color: rgb(51, 51, 51);        
   font-size: 1.8em !important;
   margin: 0 0 0.7em 0!important;   
   color: rgb(30, 0, 70);
}


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

   .scm-gf{
      padding: 1em;
      margin: 1em auto;
      max-width: 550px;
   }

   .scm-gf .scm-gf-circle {
      float: left;
      font-size: 4em;      
    } 
   
   .scm-gf .scm-gf-content{
      height: 160px;
      font-size: 1.2rem;
   }
 
}

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

   .scm-gf{
      padding: 0.3em;
   }
   .scm-gf .scm-gf-content{
      font-size: 1rem;
   }
   .scm-gf .scm-gf-circle {
      height: 100px;
      width: 100px;
    }
   
    .scm-gf .scm-gf-circle i{
      line-height: 1rem;
    }

}

/*Thumbnails
------------------------------------*/

.card{
   -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 2px 0 rgba(0,0,0,0.12), 0 1px 1px -1px rgba(0,0,0,0.2);
   box-shadow: 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 2px 0 rgba(0,0,0,0.12), 0 1px 1px -1px rgba(0,0,0,0.2);
   border-radius: 16px;
}



.scm-thumbnail .thumbnail-title{
   background: rgb(33, 150, 243);
   position: absolute;
   right: 0;
   bottom: 0;
   padding: 5px 20px 5px 20px;
   font-size: 2rem;
   border-radius: 16px 0 0 2px;    
   color: white;
   display: inline-block;
   font-size: 1.8rem;
   font-weight: bold;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;   
}
.scm-thumbnail:hover .thumbnail-title{
   background: rgb(68, 20, 205);   
   bottom: 0;
   padding: 5px 20px 5px 20px;
   font-size: 2rem;
   border-radius: 16px 0 0 2px;      
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.scm-thumbnail .card-content{
   padding: 15px 20px 15px 20px;
}

.scm-thumbnail .card-content p{
   font-size: 1rem;
   color: #282828;
   height: 4em;
   text-decoration: none;
   text-align: left;
   word-break: keep-all;
}
.scm-thumbnail:hover .card-content p{
	color: #222;
}
.scm-thumbnail .card-image{
   cursor: default;
}
.scm-thumbnail .card-image .thumbnail-img {
	position: relative;
   margin-bottom: 11px;
   border-radius: 2px 2px 0 0;
}


.scm-thumbnail .card-image img {
   overflow: hidden;
	position: relative;
   -webkit-transition: all 0.8s ease-in-out;
   -moz-transition: all 0.8s ease-in-out;
   -o-transition: all 0.8s ease-in-out;
   -ms-transition: all 0.8s ease-in-out;
   transition: all 0.8s ease-in-out;
   border-radius: 15px 15px 0 0 ;
}
.scm-thumbnail:hover .card-image img {
   -webkit-transform: scale(1.2) rotate(1deg);
   -moz-transform: scale(1.2) rotate(1deg);
   -o-transform: scale(1.2) rotate(1deg);
   -ms-transform: scale(1.2) rotate(1deg);
   transform: scale(1.2) rotate(1deg);
   border-radius: 15px 15px 0 0 ;
}


.scm-thumbnail .card-reveal img{
   width: 100%;
}



/* gradient */
.scm-gradient {
   position: relative;
   width: 100%;
   padding: 60px 0 80px 0;
   justify-content: center;
   flex-direction: column;
   align-items: center;
   background:rgba(22, 5, 85, 1);
   background: url("../images/bg/6.jpg") 50% 0 no-repeat fixed;
   background-size: cover;  
   z-index: 0;
}

.scm-gradient:before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   background-image: radial-gradient(at 50% 170%, rgba(98, 0, 234, 0.95) 5%,rgb(30, 0, 70),rgb(22, 5, 85));
   opacity: .85; 
   z-index: -1;
 }

.scm-gradient .title-box{
   margin: 2rem 0 2rem 0;
   color:#fff; 
}

.scm-gradient h2{
   margin: 0;
   padding-bottom: 10px;
   font-size: 3rem;
   font-weight: 400;
   border-bottom: solid 2px rgba(68, 20, 205, 0.5);   
}

.scm-gradient p{
   letter-spacing: 0;
   padding: 0;
   margin: 0;
}






.scm-gradient-svg-top {
   position: absolute;
   top: -5px;
   right: 0px;
   height: 50px; 
}

.scm-gradient-svg-bottom {
   background: url(../images/bg/scm-section1.svg); 
   position: absolute;
   bottom: 0;
   left: 0;
   fill:#fff;
   width: 70%;
   height: 65px;
}


/*Our-clients*/
#owl-client{
   padding-bottom: 3em;
}


#owl-client .our-clients-inner{
   margin-top:10px;   
   background-color: rgb(33, 150, 243);
   color: #fff;    
   text-align: center;
   height: 100%;   
 }

 #owl-client .our-clients-inner:hover{
   margin-top:0px;   
   border-top: 10px solid rgb(33, 150, 243);
   -moz-transition: border-color 0.2s ease-in-out;
   -webkit-transition: border-color 0.2s ease-in-out;
   -ms-transition: border-color 0.2s ease-in-out;
   transition: border-color 0.2s ease-in-out; 
 }
 #owl-client .our-clients-back{
   font-size: 1em;
   padding: 10px 0;   
}

.scm-gradient2 {
   position: relative;
   width: 100%;
   padding: 60px 0 80px 0;
   justify-content: center;
   flex-direction: column;
   align-items: center;
   /*background-image: linear-gradient(175deg, rgb(22, 5, 85) 20%, rgb(59, 0, 109) 60% , rgb(30, 0, 70));*/
   background-image: radial-gradient(at 10% 150%, rgba(98, 0, 234, 0.85) 5%,rgb(30, 0, 70),rgb(22, 5, 85));
}

.scm-gradient2 .title-box{
   margin: 2rem 0 2rem 0;
}

.scm-gradient2 h2{
   margin: 0;
   padding-bottom: 10px;
   font-size: 3rem;
   font-weight: 400;   
   border-bottom: solid 2px rgba(68, 20, 205, 0.5); 
   text-align: right;
}

.scm-gradient2 p{
   letter-spacing: 0;	
   padding: 0;
   margin: 0;
   text-align: right;
}



.scm-gradient2-svg-top {
   background: url(../images/bg/box-top.svg); 
   position: absolute;
   margin-top: -149px;
   top:0;
   right: 0;
   width: 990px;
   height: 150px;
}

.scm-gradient2-svg-bottom {
   position: absolute;
   bottom: 0;
   right: 0;
   width: 450px;
   height: 65px;
}

.scm-gradient2 .content-box{
   color:#222;
}

.scm-gradient2 .content-box h3{
   color:#222;
   text-align: left;      
   font-size: 1em;
}

.scm-gradient2 .content-box p{
   color:#222;
   text-align: left; 
   font-size: 1em;   
}


@media screen and (max-width: 736px) {
   .scm-gradient2 .container .row{
      margin-right: 1rem;
   } 
}
 
@media screen and (max-width: 480px) {
   .scm-gradient .title-box h2,
   .scm-gradient2 .title-box h2,
   .scm-section1 .title-box h2{
       font-size: 2rem;
   }
   .scm-gradient2 .row .col{
       padding: 0;
   }
}

/*Pricing*/
.no-space-pricing [class^="col-"],
.no-space-pricing [class*=" col-"] {
	padding: 0;
}
.pricing {
	position:relative;
   border-radius:5px;  
   margin-top:5px;   
   margin-bottom:15px;
   background: #F2F2F7;
   -webkit-transition:all 300ms;
   -moz-transition:all 300ms;
   -o-transition:all 300ms;
   transition:all 300ms;
}
.pricing:hover {
   background: #fff;
	-webkit-transform: scale(1.04);
   -moz-transform: scale(1.04);
	-o-transform: scale(1.04);
   transform: scale(1.04);

}
.pricing:hover h4 {   
	color:rgb(68, 20, 205);
}
.pricing-head {
   text-align:center;
   background:rgb(33, 150, 243);     
}
.pricing h3,
.pricing h4 {
	margin:0;
	line-height:normal;
   font-weight:bold !important;
   font-family: 'Righteous', 'Roboto',  sans-serif;
}
.pricing-head h3 {
	color:#fafafa;
	padding:20px;
	font-size:2.5rem;
}
.pricing-head h4 {
   background: #fff;   
	color: #777;
	padding:5px 0;
	font-size:70px;
	text-shadow:0 1px 0 #222;
	border-bottom:solid 1px rgb(33, 150, 243);
}
.pricing-head h3 span, 
.pricing-head h4 span {
	display:block;
	margin-top:5px;
   font-size:12px;
   font-weight: 200;
}
.pricing-head h4 i {
	top:-8px;
	font-size:28px;
	font-style:normal;
	position:relative;
}
.pricing-head h4 span {
	top:-10px;
	font-size:16px;
	font-style:normal;
	position:relative;
}
.pricing p {
	padding-top: 10px;
	font-size: 12px;
}	
/*Pricing Content*/
.pricing-content  {
   margin-bottom: 0px;
}
.pricing-content li {
	color:#666;
	font-size:14px;
   padding:7px 15px;
   border-bottom:solid 1px rgb(33, 150, 243);
}
.pricing-content li i {
   color:rgb(33, 150, 243);
   padding-right: 6px;
   vertical-align:middle;
}

/*Pricing Footer*/
.pricing-footer {
   font-size: 14px;
	color:#555;
   height: 80px;
	line-height:40px;
	text-align:center;
   padding:20px;   
}


.scm-color-blue{
   color: rgb(33, 150, 243)
}

.title-box-line{
   width: 4%;
   position: relative;
   margin: 2rem auto;
}
.title-box-line hr{
   border-top-width:5px;
   border-color: rgb(68, 20, 205);
   -moz-border-image: -moz-linear-gradient(left, rgb(30, 0, 70) 50%, rgb(68, 20, 205) 550% );
   -webkit-border-image: -webkit-linear-gradient(left, rgb(30, 0, 70) 50%, rgb(68, 20, 205) 55%);
   border-image: linear-gradient(to right, rgb(30, 0, 70) 50%, rgb(68, 20, 205) 55%  );
   border-image-slice: 3;   
}




/* label color */
label,
.input-field label,
.input-field [type="checkbox"]+label{
   color: #222;
   font-size: 1.2rem;
   font-weight: 700;
 }
 .select-wrapper + label {
   color: #222;
   font-size: 1rem;
   font-weight: 700;
 }
 /* valid color */
 .input-field input[type=text].valid {
   border-bottom: 1px solid #4414CD;
   box-shadow: 0 1px 0 0  #4414CD;
 }
 /* invalid color */
 .input-field input[type=text].invalid {
   border-bottom: 1px solid #000;
   box-shadow: 0 1px 0 0 #000;
 }


 .input-field input[type=text] readonly{
   background: rgba(110, 127, 243, 0.3);
 }

/* Highlight */
 *::selection {
   background: rgba(110, 127, 243, 0.3);
 }


 .page-footer{
   padding-top: 20px;
   color: #777;
   background-color: #252525;
   border-top: 3px solid #333;   
   font-size: 0.8rem;
   font-weight: bold;   
   line-height: 1.5;
   text-decoration: none;
 }
 .page-footer .row {
   margin-bottom: 0px;
 }
 .page-footer .row div{
   display: inline-block;
   word-break: keep-all;
 } 
 .page-footer .row .col {
   margin: 0;
   padding-bottom: 20px;
 }
 .page-footer h2 {
   margin: 0;
   line-height: 24px;
   padding-bottom: 3px;
   color: #efefef;
 }
 .page-footer p {
   margin: 0;
 }

 .page-footer a{
   color: rgba(33, 150, 243, 0.7);
   border-bottom: dotted 1px rgb(33, 150, 243);
}
.page-footer a:hover{
   color: rgb(33, 150, 243)  !important;
   border-bottom: dotted 2px rgb(68, 20, 205);
}

.page-footer-talk{  
   padding: 0;
   margin: 0;
}
.page-footer-talk ul{   
   list-style: none;
   padding: 0;
   margin-left: 4px;
}
.page-footer-talk li{
   padding: 0;
   margin: 0;
   display:inline;
}      
.page-footer-talk a{
   border:0!important;            
}
.page-footer-talk img{
   width: 30px;
   height: 30px;
   border-radius:999px;    
   opacity: 0.9;   
}
.page-footer-talk li:hover img{
   opacity: 1;
}
.page-footer .footer-copyright {
   color: #444;    
   overflow: hidden;
   min-height: 50px;
   padding: 10px 0px;
   background-color: #222;
   border-top: solid 1px #292929; 
 }
 .page-footer .footer-copyright .row .col{
   margin: 0;
   padding: 2px 0;
 }

.page-footer .footer-copyright img{
   display: inline-block;
   height: 10px;
   -webkit-filter: brightness(500%);
   filter: brightness(500%);
   padding-right: 10px;
 }

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

   .page-footer .footer-copyright .row .col{
      text-align: left;
    }

}

.div-agree {
    color: #333;
    font-weight: 700;
    padding: 30px 50px;
    font-size:14px;
}

    .div-agree h2 {
        font-size: 14pt;
        margin-bottom: 1.2rem;
        color:#777;

    }

    .div-agree h4 {
        display: block;
        color: #222;
        font-size: 12pt !important;
        font-weight: 700;
        margin-top: 30px;
    }

    .div-agree pre {
        white-space: pre-wrap;
        font-weight: 400;
        font-size: 10pt;
        font-family: 'Roboto','Malgun Gothic', 'NanumSquare','Apple SD Gothic Neo', 'Nanum Gothic', 'Noto Sans','sans-serif';
        margin-top: 0;
        margin-bottom: 50px;
        max-width: 98%;
        padding-left:10px;
    }

    .div-agree:after {
        content: "";
        display: block;
        height: 50px;
        width: 100%;
    }
.scm-tb-price {
    width: 70%;
    border-top: 2px solid #999;
}
    .scm-tb-price th {
        text-align: center;
        border-radius: 0;
        color: #555;
        background: #efefef;
        font-weight: bold;       
        border-bottom: 1px solid #999;
        padding: 10px 5px;
        font-size: 14px;
    }
.scm-tb-price td {
    background: #fff;
    border-bottom: 1px solid #eee;
    text-align: center;
    border-radius: 0;
    padding: 20px;
    font-size: 12px;
}

    .scm-tb-price td p {
        font-size: 12px;
        margin-bottom: 5px;
        text-align: left;
    }

#GoogleMap_map {
    width: 90%;
    height: 85%;
    float: left;
}


/* Unchecked styles */
[type="radio"]:not(:checked) + span:before,
[type="radio"]:not(:checked) + span:after,
[type="radio"]:checked + span:before,
[type="radio"]:checked + span:after,
[type="radio"].with-gap:checked + span:before,
[type="radio"].with-gap:checked + span:after {
    display: none;
}


.pay-inner label,
.pay-inner .input-field label,
.pay-inner .input-field [type="checkbox"]+label{
   color: #666;
 }

.pay-price-box {
   color: #222;
   width: 100%;
   font-size: 2rem;
   text-align: center;
   display: inline-block;
}

#pay-price {
   color: rgb(68, 20, 205);
   display: inline-block;
   font-weight: bold;
   height: 64px;
   margin-top: 20px;
   padding-left: 20px;
}

.box-radio-input input[type="radio"]:not(:checked) + span,
.box-radio-input input[type="radio"]:checked + span {
    -webkit-transition: none;
    transition: none;
}

.box-radio-input input[type="radio"] + span {
    text-align: center;
    width: 50%;
    float: left;
    padding: .5em 1em;
    height: 46px;
    cursor: pointer;
    font-size: 16px;
    color: rgb(68, 20, 205);
    font-weight: bold;
    background-color: #FCF3EF;
    border: 1px solid #efefef;
    margin-right: -1px;
    margin-top: 2rem;   
}


.box-radio-input input[type="radio"]:checked + span:before {
    content: "\2714";
    display: inline;
    position: relative;
    padding-right: 5px;
    font-size: 22px;
    line-height: 20px;
}

.box-radio-input input[type="radio"]:checked + span {
    background: rgb(68, 20, 205);
    color: #fff;
}

.scm-error {
    color: #222;
    padding: 10% 0;
    text-align: center;
}