@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700&family=Noto+Sans+KR:wght@100;300;500;700;900&display=swap');
body {
    background: #FFF;
    color: #737a7f;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 14px;
    font-weight: 300;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans KR', sans-serif;
    color: #000000;
    margin-bottom: 10px;
    font-weight: bold;
    line-height: 35px;
}

p { 
    color: #1b1b1b;
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.8;
}
.row {
    max-width: 1170px;
    margin: auto;
}
img {
   max-width: 100%;
    height: auto;
    vertical-align: middle;
    image-rendering: -webkit-optimize-contrast;
    backface-visibility: hidden;
}
a {
    font-family: 'Noto Sans KR', sans-serif;
}
a:focus,
a:hover {
    text-decoration: none;
}

.clearFix{
    clear:both;
}


.float-ver-parent{

    position: relative;
    max-height: 100%;
}

.float-ver-middle{
    top: 50%;
    transform: translateY(20%);
    vertical-align: middle;
}





.white-space{
white-space: nowrap;
}

.bold600{

    font-weight: 600;  
}
.dan2{

    padding-bottom: 120px;

}
.dan2 img{

    width:50%;
    margin: auto;
    display: block;
}
section .btn {
    background: #4084C5;
    color: #FFF;
    border: none;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
section .btn:hover {
    background: #000000;
    color: #FFF !important;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.form-control{
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    margin-bottom: 30px;
}
.form-control:focus {
    border-color: #333333;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}
::-webkit-input-placeholder {
    color: #999999 !important;
}
::-moz-placeholder {
    color: #999999 !important;
}
:-ms-input-placeholder {
    color: #999999 !important;
}
input:-moz-placeholder {
    color: #999999 !important;
}

.text-left{text-align: left!important;}


#toTop {
    width: 40px;
    height: 40px;
    font-size: 28px;
    color: #4084C5;
    position: fixed;
    right: 10px;
    bottom: 20px;
    text-align: center;
}
#toTop a:focus,
a:hover {
    color: #ffffff;
}

.shr-section-title {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: capitalize;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-section-title span{
    color: #4084C5;
}
.shr-section-title .shr-round{
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.logo-p::before{
    content:"";
    background-image: url("../images/logo-w.webp");
    background-size:150px 30px;
    width:150px;
    height:30px;
    display:inline-block;
    margin-bottom: 3px;
}

.logo-p-a::after{
    content:"";
    background-image: url("../images/logo-w.webp");
    background-size:150px 30px;
    width:150px;
    height:30px;
    display:inline-block;
    margin-bottom: 3px;
}


.logo-p2::before{
    content:"";
    background-image: url("../images/logo-black.webp");
    background-size:150px 30px;
    width:150px;
    height:30px;
    display:inline-block;
    margin-bottom: 3px;
}

.shr-section-title2 {
    color: #000000;
    border-bottom: 1px solid #000000;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: capitalize;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-section-title2 span{
    color: #4084C5;
}
.shr-section-title2 .shr-round{
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #000000;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}



.shr-section-title3 {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: capitalize;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-section-title3 span{
    color: #000000;
}
.shr-section-title3 .shr-round{
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}


.shr-sub-title{
    text-align: center;
    margin-bottom: 60px;
}
.shr-color{
    color: #4084C5;
}
.maint-color{
    color: #FFCF25;
}

/************color start************/
.c-w{
    color: #ffffff!important;
}
.c-b{
    color: #000000!important;
}
.c-y{
    color: #FFCF25!important;
}


/************font size start************/

.dan3title{
    font-size:54px!important;
    line-height: 60px!important;
}
/************header start************/

.shr-header {
    width: 100%;
}

.navbar-board {

    background: #ffffff;
    margin-bottom: 0px;
    min-height: 70px;
    border-bottom: 1px solid #D6D6D6;
}
.navbar-board.roll {
    backdrop-filter: blur(30px);
    margin-bottom: 0px;
    min-height: 70px;
    border: none;

}

.navbar {
    background: transparent;
    margin-bottom: 0px;
    min-height: 70px;
    border: none;
}

.navbar.roll {
    background: transparent;
    backdrop-filter: blur(30px);  
    margin-bottom: 0px;
    min-height: 70px;
    border: none;

}

.navbar-brand > img{
	display: inline-block;
}

.navbar-brand2 > img{
    display: block;
}

.shr-logo{
    width: 125px;
    height: auto;
    margin-top: 35px;
    display: inline-block;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;

}

.shr-logo2{
    width: 125px;
    height: auto;
    margin-top: 35px;
    display: inline-block;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;

}

.navbar>.container .navbar-brand,
.navbar>.container-fluid .navbar-brand {
    margin-left: 0px;
}
.navbar>.container .navbar-brand .img-b{

  }
  
  .navbar>.container .navbar-brand .img-w{
    display: none;
  }
.navbar>.container .navbar-brand2,
.navbar>.container-fluid .navbar-brand2 {
    margin-left: 0px;
}

.navbar-brand {
    padding: 10px 15px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
} 

.navbar-brand2 {
    padding: 10px 15px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    z-index: 1000;
} 

.navbar-default .navbar-nav>.active>a {
    background: transparent;
    color: #4084C5;
    border-bottom: 2px solid #4084C5;
}
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
    background: transparent;
    color: #FFF;
}

.navbar-default .navbar-nav>li>a {
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    text-transform: capitalize;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top:40px;
    margin-bottom: 15px;
    margin-right: 1px;
    margin-left: 1px;
}
.navbar-default .navbar-nav>li>a:hover {
    color: #4084C5;
}
.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover{
    color: #4084C5;
}



.navbar-default .navbar-nav2>.active>a {
    color: #4084C5;
    border-bottom: 2px solid #4084C5;
}
.navbar-default .navbar-nav2>.active>a:focus,
.navbar-default .navbar-nav2>.active>a:hover {
    background: transparent;
    color: #4084C5;
}
.navbar-default .navbar-nav2>li>a {
    font-size: 16px;
    font-weight: 700;
    color: #424242;
    text-transform: none ;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 15px 1px;
    background: transparent;
}
.navbar-default .navbar-nav2>li>a:hover {
    color: #4084C5;
    background: transparent;
}
.navbar-default .navbar-nav2>li>a:focus, .navbar-default .navbar-nav2>li>a:hover{
    color: #4084C5;
}


/*underline*/
.cmn-t-underline {
  position: relative;
  color: #ff3296;
}
.cmn-t-underline:after {
  display: block;
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 0;
  height: 2px;
  background-color: #4084C5;
  content: "";
  transition: width 0.2s;
}
.cmn-t-underline:hover {
  color: #98004a;

}
.cmn-t-underline:hover:after {
  width: 100%;
}
/*end underline*/

/*header style start*/
.top-nav-collapse{
    background: rgba(0, 0, 0, 0.8);
    top: 0;
    position: fixed;
    z-index: 999;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    
}
.top-nav-collapse:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: url(images/bgs/pattern.webp);
    background-repeat: no-repeat;
}
.top-nav-collapse .nav>li>a{
    margin-top: 15px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
.top-nav-collapse .shr-logo{
    margin-top: 10px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}

.top-nav-collapse2{
    background: rgba(255, 255, 255, 80%);
    backdrop-filter: blur(30px);  
    top: 0;
    position: fixed;
    z-index: 999;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    
}
.top-nav-collapse2:before{
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: url(images/bgs/pattern.webp);
    background-repeat: no-repeat;
}
.top-nav-collapse2 .nav>li>a{
    margin-top: 15px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}

.top-nav-collapse2 .shr-logo2{
    margin-top: 10px;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
}
/*header style end*/

/************header end************/


/************board start************/
.listview-title {
    color: #4F5050;
    padding: 7px 16px;
    font-size: 13px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
istview-title{
    color:#4F5050;
    padding:7px 16px;
    font-size:13px;
    font-weight:500;
    display:flex;
    align-items:center;
    justify-content:space-between
}
.listview-title .link{
    color:#A1A1A2;
    font-weight:500;
    font-size:11px;
    display:flex;
    align-items:center
}
.listview-title .link i.bi,.listview-title .link i.icon,.listview-title .link ion-icon{
    font-size:15px;
    margin-right:4px
}
.listview-title.sticky-title{
    background:#F9F9F9;
    position:-webkit-sticky;
    position:-moz-sticky;
    position:-o-sticky;
    position:-ms-sticky;
    position:sticky;
    padding-top:8px;
    padding-bottom:8px;
    z-index:500;
    top:56px;
    font-weight:500;
    color:#141515;
    box-shadow:0px 1px 0 #E1E1E1,0px -1px 0 #E1E1E1
}
.listview-title.sticky-title strong{
    font-size:15px
}
.listview-title .text-small{
    font-size:11px;
    color:#A1A1A2;
    line-height:1.3em
}
.listview{
    display:block;
    padding:0;
    margin:0;
    color:#141515;
    background:#fff;
    border-top:1px solid #E1E1E1;
    border-bottom:1px solid #E1E1E1;
    line-height:1.3em
}
.listview .text-muted{
    font-size:13px;
    color:#A1A1A2 !important
}
.listview>li{
    padding:8px 16px;
    display:block;
    align-items:center;
    justify-content:space-between;
    position:relative;
    min-height:50px
}
.listview>li .item{
    position:relative
}
.listview>li:after{
    content:"";
    display:block;
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background:#E1E1E1
}
.listview>li:last-child:after{
    display:none
}
.listview>li footer,.listview>li header{
    font-size:12px;
    margin:0;
    line-height:1.2em
}
.listview>li footer{
    color:#4F5050;
    margin-top:3px
}
.listview>li header{
    margin-bottom:3px
}
.listview>li.divider-title{
    background:rgba(225,225,225,0.5);
    margin-top:-1px;
    border-top:1px solid #E1E1E1;
    border-bottom:1px solid #E1E1E1;
    padding:12px 16px;
    font-size:13px;
    min-height:auto;
    color:#4F5050
}
.listview>li.divider-title:after{
    display:none
}
.listview.flush{
    border-top:0;
    border-bottom:0
}
.listview.transparent{
    background:transparent
}
.simple-listview>li{
    display:flex
}
.link-listview>li{
    padding:0;
    min-height:auto
}
.link-listview>li a{
    padding:8px 36px 8px 16px;
    min-height:50px;
    display:flex;
    width:100%;
    align-items:center;
    justify-content:space-between;
    color:#141515 !important
}
.link-listview>li a:after{
    background-image:url("data:image/svg+xml,%0A%3Csvg width='10px' height='16px' viewBox='0 0 10 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round'%3E%3Cg id='Listview' transform='translate(-112.000000, -120.000000)' stroke='%23A1A1A2' stroke-width='2.178'%3E%3Cpolyline id='Path' points='114 122 120 128 114 134'%3E%3C/polyline%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:center center;
    width:16px;
    height:16px;
    content:"";
    position:absolute;
    right:12px;
    opacity:0.5;
    top:50%;
    margin-top:-8px
}
.link-listview>li a:active{
    background:rgba(225,225,225,0.3)
}
.multi-level>a:after{
    transform:rotate(90deg)
}
.multi-level ul{
    border:0;
    padding:0;
    height:0;
    overflow:hidden;
    transition:height 0.15s ease-in-out !important
}
.multi-level ul>li{
    border:0 !important
}
.multi-level ul>li:after{
    height:0
}
.multi-level ul>li a,.multi-level ul>li .item{
    padding-left:68px !important
}
.multi-level.active>a:after{
    transform:rotate(-90deg)
}
.multi-level.active ul{
    overflow:auto
}
.mt-2 {
    margin-top: 0.5rem!important;
}
.mb-4 {
    margin-bottom: 16px !important;
}

/************board end************/


/************ history start ************/
.history h2{
    position: relative; 
    font-size: 33px; 
    color: #B5B5B5; 
    line-height: 1;
}
.history h2 span{
    color:#4084C5; 
}    

.history ul { 
    position: relative;
    overflow: hidden;
    list-style: none;
    width: 800px;
    margin: 30px auto;
    padding: 0;
}
.history ul:after {
    content:"";
    z-index: 1;
    position: absolute;
    left: 50%;
    top:0;
    width: 4px;
    margin-left: -2px;
    min-height: 100%;
    background-color: #eee;
  }
.history li {
    font-size: 17px; 
    color:#000; 
    line-height: 29px;  
    z-index: 2;
    position: relative;
    width: 380px;
    padding: 20px;
    float: left;
    margin-bottom: 30px;
    background-color: #eee;
    text-align: left;
    border-radius: 20px;
}

.history li.left {
    float: left;
    clear: left;
  }
  
.history li.right {
    float: right;
    clear: right;
  }

  
 
.history li.highlight {
    float: none;
    clear: both;
    width: auto;
    border: 5px solid #fff;
  }
 
  /* arrow */
  
.history li:before {
    content:"";
    z-index: 1;
    position: absolute;
    top: 14px;
    right: -6px;
    left: -6px;
    width: 20px;
    height: 14px;
    background-color: #eee;
    transform: rotate(45deg);
  }
  
.history li.left:before {
    left: auto;
  }
  
.history li.right + .history li.left:before,
.history li.left + .history li.right:before {
    top: 36px;
  }
  
.history li.highlight:before {
    left: 50%;
    margin-left: -6px;
    right: auto;
    top: -6px;
  }
  
  /* dot */
  
.history li:after {
    content:"";
    z-index: 1;
    position: absolute;
    top: 14px;
    right: -27px;
    left: -27px;
    width: 12px;
    height: 12px;
    border: 3px solid #fff;
    border-radius: 100%;
    background-color: #4084C5;
    transition: .2s;
  }
  
 .history li:hover:after {
    background-color: #4084C5;
    top: 12px;
    right: -29px;
    left: -29px;
    width: 18px;
    height: 18px;
  }
  
 .history li.left:after {
    left: auto;
  }
  
.history li.right + .history  li.left:after,
.history li.left + .history li.right:after {
    top: 36px;
  }
  
.history li.right + .history li.left:hover:after,
.history li.left + .history li.right:hover:after {
    top: 34px;
  }
  
.history li.right:after {
    right: auto;
  }
  
.history li.highlight:after {
    left: 50%;
    margin-left: -7px;
    right: auto;
    top: -24px;
  }
  
.history li.highlight:hover:after {
    margin-left: -9px;
    top: -26px;
  }




/************ history end ************/

.float-v{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    vertical-align: middle;
}

/************hero start************/
.shr-hero-area{
    width: 100%;
    height: 930px;
    padding-bottom: 60px;
    padding-top: 160px;
    position: relative;
}
.shr-hero-area:before{
    content:"";
    position:absolute;
    height:100%;
    width:100%;
    z-index:0;
    left:0;
    top:0;
    background-image:url(../images/bgs/pattern.webp);
    background-repeat:repeat;
}

.shr-hero-area .ico-welcome{
    position: absolute;
    left: -50px;
    top: -40px;
    display : flex;
    justify-content : center;
    align-items : center;  
}
.shr-hero-area .ico-welcome .welcome{
    position: absolute;
   /* left: 20%; */
    top: 25%;
    font-size: 20px;
    font-weight: 700;
    color: #000;
    transform: translate(-50%, 0);
    transform: rotate(-15deg);
    white-space:nowrap;

}
.shr-bg-opacity{
    background: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
}
#hero{
  background: url(../images/bgs/01.webp) center center fixed;
  background-size:cover;
  background-position: center;
}
.shr-hero-area h1{
    font-size: 64px;
    color: #ffffff;
    font-weight: 600;
    padding-top: 20px;
    line-height: 75px;
    text-transform: capitalize;
}
.shr-hero-area p{
    font-size: 18px;
    color: #ffffff;
    line-height: 24px;
    margin-top: 30px;
    margin-bottom: 25px;
}
.shr-hero-area .btn{
    width:190px;
    font-size: 17px;
    font-style: normal;
    font-family: "Montserrat rev=1";
    background: #4084C5;
    border: 1px solid #4084C5;
    letter-spacing: 0px;
    padding: 12px 25px 12px;
    margin-bottom: 50px;
    margin-right: 5px;
    border-radius: 8px 8px;
}
.shr-hero-area .btn:hover{
    background: #ffffff;
    color: #000000 !important;
    border-color: #ffffff;
}
.shr-hero-area .shr-download-btn{
    background: none;
    border: 1px solid #ffffff;
}
.shr-hero-content-img{

}
.shr-hero-content-img img{

}

/************hero end************/



/************welcome start************/
.shr-welcome-area{
    padding: 120px 0 0px;
    height: 100%;
    background-image: url(../images/bgs/02.webp);
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
}
.shr-welcome-content{
    position: relative;
    margin-bottom: 60px;
    text-align: right;
    padding-right: 130px;
}
.shr-welcome-content i{
    font-size: 45px;
    background: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
    background-color: #656565;
    color: #ffffff;
    text-align: center;
    padding-top: 23px;
    width: 90px;
    height: 90px;
    position: absolute;
    right: 0px;
    top: 10px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
.shr-welcome-content:hover i{
    transform: scale(1.1);
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}



/* 단계별 할습소개 */
.dan2 .align{
    position: relative;
    width: 570px;
    height:600px;
    margin:0 auto;

}
.dan2 .align .wel-item{
    width:160px;
    height:160px;
    border-radius: 100%;
}

.dan2 .align .wel-item-main{
    width:230px;
    height:230px;
    border-radius: 100%;
}


.dan2 .align .wel-item p{
    color:#000;
    font-size:24px;
    line-height: 24px;
    letter-spacing: -1px;
    font-weight: 600;
    text-align: center;

}

.dan2 .align .wel-item-main p{
    color:#FFCF25;
    font-size:30px;
    line-height: 32px;
    letter-spacing: -1px;
    font-weight: 600;
    text-align: center;
    height: 5%;
    padding-top: 45%
}

.dan2 .align .wel-item-main img{
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0%);
    top:50px;
}

.dan2 .align .item01{
    background-color: #AFF4C6;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0%) !important;
    top:0px;
    display : flex;
    justify-content : center;
    align-items : center;  
}

.dan2 .align .arrow01 img{
    position: absolute;
    width:50px;
    right: 140px;
    top:90px;
}


.dan2 .align .item02{
    background-color: #EAF4AF;
    position: absolute;
    right: 0px;
    top:120px;
    display : flex;
    justify-content : center;
    align-items : center;  
}

.dan2 .align .arrow02 img{
    position: absolute;
    width:50px;
    right: 50px;
    top:300px;
    transform: rotate(60deg);    
}


.dan2 .align .item03{
    background-color: #F4DDAF;
    position: absolute;
    right: 0px;
    top:360px;
    display : flex;
    justify-content : center;
    align-items : center;  
}

.dan2 .align .arrow03 img{
    position: absolute;
    width:50px;
    right: 150px;
    top:480px;
    transform: rotate(110deg);    
}


.dan2 .align .item04{
    background-color: #F4C0AF;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0%) !important;
    top:440px;
    display : flex;
    justify-content : center;
    align-items : center;  
}

.dan2 .align .arrow04 img{
    position: absolute;
    width:50px;
    left: 155px;
    top:480px;
    transform: rotate(180deg);    
}

.dan2 .align .item05{
    background-color: #F4AFE9;
    position: absolute;
    left: 0px;
    top:360px;
    display : flex;
    justify-content : center;
    align-items : center;  
}

.dan2 .align .arrow05 img{
    position: absolute;
    width:50px;
    left: 50px;
    top:300px;
    transform: rotate(230deg);    
}


.dan2 .align .item06{
    background-color: #BDE3FF;
    position: absolute;
    left: 0px;
    top:120px;
    display : flex;
    justify-content : center;
    align-items : center;    
}


.dan2 .align .arrow06 img{
    position: absolute;
    width:50px;
    left: 130px;
    top:90px;
    transform: rotate(300deg);   
}


.dan2 .align .item07{
    background-color: #4084C5;
    border:8px solid #E6E6E6;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
}


/************welcome end************/



/************features start************/
.shr-features-area{
    width: 100%;
    padding: 120px 0px 20px;
    background: url(../images/bgs/03.webp) center center fixed;
    background-size: cover;
    position: relative;
    overflow: hidden;
}
.shr-features-area:before{
    content:"";
    position:absolute;
    height:100%;
    width:100%;
    z-index:0;
    left:0;
    top:0;
    background-image:url(../images/bgs/pattern.webp);
    background-repeat:repeat;
}
.shr-features-area h2, .shr-features-area p, .shr-features-area h4{
    color: #ffffff;
}
.shr-features-area .shr-sub-title{
 color: #ffffff;
}
.shr-features-area .shr-round{
    background: #ffffff;
}
.shr-left-features-text{
    text-align: right;
    margin-top: 40px;
    margin-bottom: 70px;
}
.shr-left-features-text i{
    font-size: 55px;
    color: #4084C5;
    margin-bottom: 30px;
}
.shr-left-features-text p{
    font-size: 14px;
    font-weight: normal;
}
.shr-features-img{
    width: 318px;
    height: auto;
    margin: 0 auto;
    margin-bottom: 100px;
}
.shr-features-img img{
    
}
.shr-right-features-text{
    text-align: left;
    margin-top: 40px;
    margin-bottom: 70px;
}
.shr-right-features-text i{
    font-size: 55px;
    color: #4084C5;
    margin-bottom: 30px;
}
.shr-right-features-text p{
    font-size: 14px;
    font-weight: normal;
}

/************features end************/



/************pricing start************/
.shr-pricing-area{
    width: 100%;
    padding: 120px 0px 70px;
}
.shr-pricing-area .shr-table-col{
    margin-bottom: 50px;
    text-align: center;
    background-color: rgba(0,0,0,.005);
    border: 1px solid #e4e9ee;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-pricing-area .shr-table-col:hover{
    transform: scale(1.05);
    -moz-transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-table-col .shr-table-heading{
    background-color: #F3F3F3;
    padding: 35px;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-table-col:hover .shr-table-heading{
    background: #4084C5;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-table-col .shr-table-heading i{
    color: #000000;
    font-size: 30px;
    border-bottom: 1px solid #000000;
    margin-bottom: 10px;
}
.shr-table-col .shr-table-heading h2{
    margin-bottom: 0px;
}
.shr-table-col:hover .shr-table-heading i, .shr-table-col:hover .shr-table-heading h2{
    color: #ffffff;
    border-color: #ffffff;
}
.shr-table-col h1{
    color: #4084C5;
    font-size: 55px;
    font-weight: 900;
    margin: 30px 0px;
}
.shr-table-col h1 span{
    font-size: 12px;
}
.shr-table-col .list-group{
    padding: 30px 30px 0px 30px;
}
.shr-table-col .list-group .list-group-item{
    padding: 15px;
    border: none;
    border-top: 1px solid #e4e9ee;
}
.shr-table-col .shr-table-footer{
    background:#F3F3F3;
    padding: 25px; 
    display: block;
    cursor: pointer;
}
.shr-table-col .shr-table-footer a{
    font-size: 15px;
    color: #000000;
    display: block;
    padding: 10px 5px;
    font-weight: 700;
}
.shr-table-col .shr-table-footer:hover a{
    color: #4084C5;
}
/************pricing end************/



/************describe start************/
.shr-describe-area{
    width: 100%;
    padding: 10px 0px 120px;
    background: #ffffff;
}
.shr-describe-area .shr-discribe-col{
    margin-bottom: 0px;
}
.shr-discribe-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-discribe-col p{
    margin-bottom: 50px;
}

.shr-discribe-col p img{

    width:284px;

}

.shr-discribe-col .dan{
   text-align: left!important;
}


.btn_group{

 }
.btn_group img{
    height:85px;
 }



/************describe end************/



/************dan5 start************/
.shr-dan5-area{
    width: 100%;
    padding: 120px 0px 20px;
    background: url(../images/bgs/dan5-bak.webp);
    background-size: cover;
    position: relative;
    overflow: hidden;
}
.shr-describe-area .shr-discribe-col{
    margin-bottom: 0px;
}
.shr-dan5-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-dan5-col p{
    line-height: 30px;
}

.shr-dan5-col p img{

    width:284px;

}

.shr-dan5-col .dan{
   text-align: left!important;
}

/************dan5 end************/


/************dan6 start************/
.shr-dan6-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: #ffffff;
}
.shr-dan6-area .shr-discribe-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;

}

.shr-dan6-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-dan6-col p{
    margin-bottom: 50px;
}

.shr-dan6-col p img{
    width:284px;
}

.shr-dan6-col ul{
    margin-top: 50px;
    margin-bottom: 50px;
}

.shr-dan6-col ul li{
    font-size: 18px;
} 
.shr-dan6-col .dan{
   text-align: left!important;
}


/************dan6 end************/


/************dan7 start************/
.shr-dan7-area{
    width: 100%;
    padding: 150px 0px 120px;
    background: #F6F6F6;
}
.shr-dan7-area .shr-discribe-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;

}

.shr-dan7-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-dan7-col p{
    margin-bottom: 50px;
}

.shr-dan7-col p img{
    width:284px;
}

.shr-dan7-col ul{
    margin-top: 50px;
    margin-bottom: 50px;
}

.shr-dan7-col ul li{
    font-size: 18px;
} 
.shr-dan7-col .dan{
   text-align: left!important;
}


/************dan7 end************/




/************dan8 start************/
.shr-dan8-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: #f1f6fb;
}
.shr-dan8-area .shr-discribe-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;

}

.shr-dan8-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-dan8-col p{
    margin-bottom: 50px;
}

.shr-dan8-col p img{
    width:284px;
}

.shr-dan8-col ul{
    margin-top: 50px;
    margin-bottom: 50px;
}

.shr-dan8-col ul li{
    font-size: 18px;
} 
.shr-dan8-col .dan{
   text-align: left!important;
}


/************dan8 end************/





/************dan9 start************/
.shr-dan9-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: #ffffff;
}
.shr-dan9-area .shr-discribe-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;

}

.shr-dan9-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-dan9-col p{
    margin-bottom: 50px;
}

.shr-dan9-col p img{
    width:284px;
}

.shr-dan9-col ul{
    margin-top: 50px;
    margin-bottom: 50px;
}

.shr-dan9-col ul li{
    font-size: 18px;
} 
.shr-dan9-col .dan{
   text-align: left!important;
}


/************dan9 end************/

/************dan10 start************/
.shr-dan10-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: #4084C5;
}
.shr-dan10-area .shr-discribe-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;

}


.shr-dan10-area .shr-discribe-col .btn_group{
text-align: center;
}

.shr-dan10-col h1{
    font-size: 45px;
    line-height: 55px;
}
.shr-dan10-col p{
    margin-bottom: 50px;
}

.shr-dan10-col p img{
    width:284px;
}

.shr-dan10-col ul{
    margin-top: 50px;
    margin-bottom: 50px;
}

.shr-dan10-col ul li{
    font-size: 18px;
} 

.shr-dan10-col .dan{
   text-align: left!important;
}
.shr-dan10-area .btn{
    width:190px;
    font-size: 17px;
    font-style: normal;
    font-family: "Montserrat rev=1";
    background: #000000;
    border: 1px solid #000000;
    letter-spacing: 0px;
    padding: 12px 25px 12px;
    margin-bottom: 20px;
    margin-right: 5px;
    border-radius: 8px 8px;
}
.shr-dan10-area .btn:hover{
    background: #ffffff;
    color: #000000 !important;
    border-color: #000000;
}
.shr-dan10-area .shr-download-btn{
    background: none;
    border: 1px solid #000000;
}

/************dan10 end************/




/************dan11 start************/
.shr-dan11-area{
    width: 100%;
    padding: 20px 0px 20px;
    background: #ffffff;
}
.shr-dan11-area .shr-discribe-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
    text-align: center;

}


/************dan11 end************/



/************company start************/
.shr-company-area{
    width: 100%;
    padding: 420px 0px 20px;
    background: url(../images/company01-img.webp) center center;
    background-size: cover;
    position: relative;
    overflow: hidden;
}

.shr-company-area:before{
    content:"";
    position:absolute;
    height:100%;
    width:100%;
    z-index:0;
    left:0;
    top:0;
    background-image:url(../images/bgs/pattern.webp);
    background-repeat:repeat;
}


.shr-company-area .shr-company-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
    text-align: center;

}

.company_img{
text-align: center;
}

.shr-company-title {
    color: #000000;
    border-bottom: 1px solid #000000;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-company-title .shr-round {
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #000000;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.shr-company2-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: #ffffff;
}

.shr-company2-title {
    color: #000000;
    border-bottom: 1px solid #000000;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-company2-title .shr-round {
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #000000;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}
/************company2 end************/



/************tec start************/

.shr-tec-area{
    width: 100%;
    padding: 0px 0px 120px;
    background: #ffffff;
}

.shr-tec-title {
    color: #000000;
    border-bottom: 1px solid #000000;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-tec-title .shr-round {
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #000000;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.shr-tec-area:before{
    content:"";
    position:absolute;
    height:100%;
    width:100%;
    z-index:0;
    left:0;
    top:0;
    background-image:url(../images/bgs/pattern.webp);
    background-repeat:repeat;
}


.shr-tec-area .shr-tec-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
    text-align: center;

}



/************tec end************/



/************business start************/

.shr-business-area{
    width: 100%;
    padding: 0px 0px 120px;
    background: #ffffff;
}

.shr-business-title {
    color: #000000;
    border-bottom: 1px solid #000000;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-business-title .shr-round {
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #000000;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.shr-business-area:before{
    content:"";
    position:absolute;
    height:100%;
    width:100%;
    z-index:0;
    left:0;
    top:0;
    background-image:url(../images/bgs/pattern.webp);
    background-repeat:repeat;
}


.shr-business-area .shr-business-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
    text-align: center;

}



/************business end************/


/************team start************/
.shr-team-area{
    width: 100%;
    padding: 120px 0px 70px;
    background: url(../images/bgs/04.webp) center center fixed;
    background-size: cover;
    position: relative;
}

.shr-team-area:before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
}

.shr-team-area h2{
    color: #ffffff;
}
.shr-team-area .shr-round{
    background: #ffffff;
}
.shr-team-area .shr-sub-title{
    color: #ffffff;
}
.shr-team-col{
    margin-bottom: 50px;
}
.shr-team-col .ih-item.square{
    width: 100%;
    height: auto;
    border: none;
    box-shadow: none;
}
.shr-team-col .ih-item.square.effect6 .info h3 {
    background: rgba(17, 17, 17, 0.5);
}
.shr-team-col .shr-social-link{
    margin-top: 20px;
    padding-bottom: 20px;
    border-bottom: 2px solid #ffffff;
}
.shr-team-col .shr-social-link i{
    width: 35px;
    height: 35px;
    font-size: 17px;
    padding-top: 8px;
    text-align: center;
    color: #ffffff;
    background: #4084C5;
    border: 1px solid #4084C5;
    margin-left: 5px;
    margin-right: 5px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-team-col .shr-social-link i:hover{
    background: none;
    color: #4084C5;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
/************team end************/



/************counter start************/
.shr-counter-area{
    width: 100%;
    padding: 120px 0px 70px;
    text-align: center;
    background: #f1f1f1;
}
.shr-counter-area .shr-count-col{
    margin-bottom: 50px;
}
.shr-count-col i{
    font-size: 45px;
    background: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
    background-color: #656565;
    color: #ffffff;
    text-align: center;
    line-height: 110px;
    margin-bottom: 30px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}
.shr-count-col h3{
    margin-bottom: 25px;
}
.shr-count-col span{
    font-size: 60px;
    line-height: 45px;
    font-weight: 900;
    color: #4084C5;
}
/************counter end************/



/************news start************/
.shr-news-area{
    width: 100%;
    padding: 120px 0px 70px;
}
.shr-news-col{
    margin-bottom: 50px;
    background: #f1f1f1;
    padding: 30px;
}
.shr-news-content{
    position: relative;
    padding-left: 140px;
}
.shr-news-content .shr-awesome{
    width: 100px;
    height: 100px;
    position: absolute;
    left: 0px;
    top: 10px;
    font-size: 50px;
    color: #4084C5;
    padding-top: 20px;
    border: 2px solid #333333;
    text-align: center;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-news-col:hover .shr-news-content .shr-awesome{
    -webkit-transform: rotateZ(360deg);
    -ms-transform: rotateZ(360deg);
    -moz-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-news-content h3{
    text-transform: uppercase;
}
.shr-news-info{
    margin: 10px 0px;
}
.shr-news-info ul{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
.shr-news-info ul li{
    float: left;
    margin-right: 20px;
}
.shr-news-info ul li i{
    color: #4084C5;
    margin-left: 5px;
}
/************news end************/



/************twitter start************/
.shr-twitter-area{
    width: 100%;
    padding: 30px 0px;
    background: #4084C5;
    position: relative;
}
.shr-twitter-area i{
    width: 60px;
    height: 60px;
    background: #4084C5;
    font-size: 38px;
    color: #ffffff;
    text-align: center;
    position: absolute;
    left: 50%;
    top: -60px;
    margin-left: -30px;
    padding-top: 10px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
}
/************twitter end************/



/************subscribe start************/
.shr-subscribe-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: url(../images/bgs/03.webp) center center fixed;
    background-size: cover;
    position: relative;
}
.shr-subscribe-area:before{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    background: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
}
.shr-subscribe-area h2{
    color: #ffffff;
}
.shr-subscribe-area .shr-round{
    background: #ffffff ;
}
.shr-subscribe-area .shr-sub-title{
    color: #ffffff;
}
.shr-subscribe-area .navbar-form .form-group{
}
.shr-subscribe-area .form-control{
    margin-bottom: 0px;
    border: none;
    box-shadow: none;
}
.shr-subscribe-area .navbar-form .form-group .btn{
    color: #ffffff;
    border: 1px solid #4084C5;
}
.shr-subscribe-area .navbar-form .form-group .btn:hover{
    background: #84ae39;
}
/************subscribe end************/



/************contact start************/
.shr-contact-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: url(../images/bgs/05.webp);
    background-size: cover;
    background-repeat: no-repeat;
}
.shr-contact-area .shr-sub-title{
    color: #000000;
}
.shr-contact-area .form-control{
    background: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
    background-color: #f7f7f7;
    border: 1px solid #d1d1d1;
    border-radius: 5px;
    color: #000000;
    margin-bottom: 5px;
    min-height: 50px;
    resize: none;
}
.shr-contact-area .form-control:focus{
    background: url(../images/bgs/pattern.webp) !important;
    background-repeat: repeat;
    background: #000000;
}
.shr-contact-area .btn{
    background: #4084C5;
    padding-top: 16px;
    padding-bottom: 16px;
}


.ico_google::before {
    content:"";
    display: inline-block;
    width: 28px;
    height: 28px;
    background: url(../images/ico-google.webp) no-repeat;    
    background-position: left;
    vertical-align: middle;
    margin-right: 10px;    
}

.ico_apple::before {
    content:"";
    display: inline-block;
    width: 28px;
    height: 28px;
    background: url(../images/ico-apple.webp) no-repeat;    
    background-position: left;
    vertical-align: middle;
    margin-right: 10px;
}

.ico_apple:hover:before {
    content:"";
    display: inline-block;
    width: 28px;
    height: 28px;
    background: url(../images/ico-apple-on.webp) no-repeat;    
    background-position: left;
    vertical-align: middle;
    margin-right: 10px;
}


/************contact end************/

/************* sns ************/
.main_pricing {
	padding-top: 100px;
}
.main_pricing {
	overflow: hidden;
	width: 100%;
}

.pricing_top_border {
	height: 4px;
	width: 100%;
	background-color: #ff6863;
}

.pricing_item {
	position: relative;
    background: #FFFFFF;
    border: 1px solid;
	border-color: #f1f1f1;  
    border-radius: 20px  20px;
}

.pricing_head {
	background-color: #f7f7f7;
    border-radius: 20px  20px 0px 0px;
}

.pricing_head p{
	padding: 0px 20px;
    font-weight: bold;
}

.pricing_price_border {
	background-color: #4084C5;
	padding: 2px;
	border-radius: 50%;
	margin: 0 auto;
	width: 134px;
	height: 134px;
	position: absolute;
	top: 18.6%;
	left: 25%;
	right: 25%;
    text-align: center;
}

.pricing_price_border .pricing_price01 {
	background-color: #4084C5;
    background: url(../images/sns01.webp) center center fixed;
    background-size:cover;
    background-position: center;    
	border: 2px solid;
	border-color: #fff;
	width: 130px;
	height: 130px;
	border-radius: 50%;
	padding-top: 23%;
}

.pricing_price_border .pricing_price02 {
	background-color: #4084C5;
    background: url(../images/sns02.webp) center center fixed;
    background-size:cover;
    background-position: center;    
	border: 2px solid;
	border-color: #fff;
	width: 130px;
	height: 130px;
	border-radius: 50%;
	padding-top: 23%;
}

.pricing_price_border .pricing_price03 {
	background-color: #4084C5;
    background: url(../images/sns03.webp) center center fixed;
    background-size:cover;
    background-position: center;    
	border: 2px solid;
	border-color: #fff;
	width: 130px;
	height: 130px;
	border-radius: 50%;
	padding-top: 23%;
}

.pricing_price_border .pricing_price04 {
	background-color: #4084C5;
    background: url(../images/sns04.webp) center center fixed;
    background-size:cover;
    background-position: center;    
	border: 2px solid;
	border-color: #fff;
	width: 130px;
	height: 130px;
	border-radius: 50%;
	padding-top: 23%;
}
.pricing_price_border .title {
	color: #4084C5;
    font-size: :12px!important;
    padding-top:10px;
}

.pricing_price_border .pricing_price h3 {
	margin-bottom: 5px;
	font-size: 2.822rem;
	font-weight: 600;
	font-family: 'Montserrat', sans-serif;
}

.pricing_price_border .pricing_price p {
	font-size: 0.929rem;
}

.pricing_body {
	overflow: hidden;
}

.pricing_body .title {
	color: #000000;
    font-size: 1.822rem;
    padding-top:10px;
    font-weight: 600;
    line-height: 2.3rem;
}
.pricing_body ul {
	width: 55%;
	margin: 0 auto;
}

.pricing_body ul li {
	line-height: 3rem;
}

.pricing_body ul li i {
	margin-right: 10px;
}
.p-bottom-100 {
    padding-bottom: 100px;
}
.p-bottom-40 {
    padding-bottom: 40px;
}
.p-bottom-30 {
    padding-bottom: 30px;
}
.p-top-30 {
    padding-top: 30px;
}

.p-top-90 {
    padding-top: 90px;
}

.p-top-110 {
    padding-top: 110px;
}
.p-bottom-60 {
    padding-bottom: 2rem;
}

.p20{padding:20px 20px;}

.p40{padding:40px 40px;}


/************* canko study ************/

.shr-cankostudy-area{
    width: 100%;
    padding: 0px 0px 120px;
    background: #ffffff;
}

.shr-cankostudy-title {
    color: #000000;
    border-bottom: 1px solid #000000;
    padding-bottom: 20px;
    margin-bottom: 30px;
    display: inline-block;
    font-weight: 700;
    font-size: 44px;
    line-height: 58px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    position: relative;
}
.shr-cankostudy-title .shr-round {
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -4px;
    width: 10px;
    height: 10px;
    background: #000000;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}

.shr-cankostudy-area:before{
    content:"";
    position:absolute;
    height:100%;
    width:100%;
    z-index:0;
    left:0;
    top:0;
    background-image:url(../images/bgs/pattern.webp);
    background-repeat:repeat;
}


.shr-cankostudy-area .shr-cankostudy-col{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0px;
    text-align: center;

}

.cankostudy_item {
	position: relative;
    width: 100%;
    max-width: 100%;
    min-height: 100%;
    line-height: 2.3rem;
    padding: 20px 20px;
    background: #FFFFFF;
    box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.05);
    border-radius: 20px;

}
.cankostudy_item .title{
font-size: 1.822rem;
font-weight: 600;
color: #000000;
}  

.cankostudy_item .title span{
    color: #4084C5;
}  

.cankostudy_img img{
    border-radius: 20px;
    border: 1px solid;
	border-color: #e6e6e6;   
}





/************* study ************/
.shr-study-area{
    width: 100%;
    padding: 120px 0px 120px;
    background: #ffffff;
}
.main_study {
	padding-top: 100px;
}
.main_study {
	overflow: hidden;
	width: 100%;
}

.study_top_border {
	height: 4px;
	width: 100%;
	background-color: #ff6863;
}

.study_item {
	position: relative;
	box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
    border-radius: 20px  20px;
    line-height: 2.3rem;
    padding: 20px 20px;
}
.study_item .title{
font-size: 1.822rem;
font-weight: 600;
color: #000000;
}  

.study_item .title span{
    color: #4084C5;
}    
 
.study_head {
	background-color: #f7f7f7;
    border-radius: 20px  20px 0px 0px;
}

.study_head p{
	padding: 0px 20px;
    font-weight: bold;
}

.study_price_border {
	background-color: #4084C5;
    background: url(../images/study01.webp) center center fixed;
    background-size:cover;
    background-position: center;    
    border: 2px solid;
	border-color: #4084C5;    
	padding: 2px;
	border-radius: 20px;
	margin: 0 auto;
	width: 90%;
	height: 40%;
	position: absolute;
	top: 45%;
	left: 50%;
    transform: translate(-50%, -50%);    
    text-align: center;
}


.study_price_border02{
	background-color: #4084C5;
    background: url(../images/study02.webp) center center fixed;
    background-size:cover;
    background-position: center;    
	border: 2px solid;
	border-color: #4084C5;    
	padding: 2px;
	border-radius: 20px;
	margin: 0 auto;
	width: 90%;
	height: 40%;
	position: absolute;
	top: 45%;
	left: 50%;
    transform: translate(-50%, -50%);    
    text-align: center;
}

.study_price_border03{
	background-color: #4084C5;
    background: url(../images/study03.webp) center center fixed;
    background-size:cover;
    background-position: center;    
	border: 2px solid;
	border-color: #4084C5;    
	padding: 2px;
	border-radius: 20px;
	margin: 0 auto;
	width: 90%;
	height: 40%;
	position: absolute;
	top: 45%;
	left: 50%;
    transform: translate(-50%, -50%);    
    text-align: center;
}


.study_price_border .title {
	color: #4084C5;
    font-size: :12px!important;
    padding-top:10px;
}

.study_price_border .pricing_price h3 {
	margin-bottom: 5px;
	font-size: 2.822rem;
	font-weight: 600;
	font-family: 'Montserrat', sans-serif;
}

.study_price_border .pricing_price p {
	font-size: 0.929rem;
}

.study_body {
	overflow: hidden;
    font-size: 14px;
    line-height: 1.42857143;
    
}

.study_body .title {
	color: #000000;
    font-size: 1.822rem;
    padding-top:10px;
    font-weight: 600;
    line-height: 2.3rem;
}
.study_body ul {
	width: 55%;
	margin: 0 auto;
}

.study_body ul li {
	line-height: 3rem;
}

.study_body ul li i {
	margin-right: 10px;
}






/************* company ************/

.main_company {
	padding-top: 100px;
}
.main_company {
	overflow: hidden;
	width: 100%;
}

.company_top_border {
	height: 4px;
	width: 100%;
}

.company_item {
	position: relative;
    line-height: 2.3rem;
    padding: 20px 20px;
}
.company_item .title{
font-size: 1.822rem;
font-weight: 600;
color: #000000;
}  

.company_item .title span{
    color: #4084C5;
}    
 

.tec_item {
	position: relative;
    line-height: 2.3rem;
    padding: 20px 20px;
    background: #F6F6F6;
    width: 100%;
}
.tec_item .title{
font-size: 1.822rem;
font-weight: 600;
color: #000000;
}  

.tec_item .title span{
    color: #4084C5;
}    


.business_item {
	position: relative;
    width: 100%;
    max-width: 100%;
    min-height: 100%;
    line-height: 2.3rem;
    padding: 20px 20px;
    background: #FFFFFF;
    box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.05);
    border-radius: 20px;

}
.business_item .title{
font-size: 1.822rem;
font-weight: 600;
color: #000000;
}  

.business_item .title span{
    color: #4084C5;
}  

.business_img img{
    border-radius: 20px;
}


.company_head {
	background-color: #f7f7f7;
    border-radius: 20px  20px 0px 0px;
}

.company_head p{
	padding: 0px 20px;
    font-weight: bold;
}

.company_img img{
    border: 1px solid;
    border-color: #ececec;
	border-radius: 20px;
}

.tec_img img{
    border: 1px solid;
    border-color: #ececec;
}

.business_img img{
    border-radius: 20px;
}

.company_price_border .title {
	color: #4084C5;
    font-size: :12px!important;
    padding-top:10px;
}

.company_price_border .pricing_price h3 {
	margin-bottom: 5px;
	font-size: 2.822rem;
	font-weight: 600;
	font-family: 'Montserrat', sans-serif;
}

.company_price_border .pricing_price p {
	font-size: 0.929rem;
}

.company_body {
	overflow: hidden;
    font-size: 14px;
    line-height: 1.42857143;
    
}

.company_body .title {
	color: #000000;
    font-size: 1.822rem;
    padding-top:10px;
    font-weight: 600;
    line-height: 2.3rem;
}
.company_body ul {
	width: 55%;
	margin: 0 auto;
}

.company_body ul li {
	line-height: 3rem;
}

.company_body ul li i {
	margin-right: 10px;
}



/* Quetions */

dl.questions {
    background: #16A085;
    color: rgb(0, 0, 0);
}

dl.questions dt {
    background: #ffffff url('../images/arrow-up.svg') right center no-repeat;
    background-size: 15px;
    background-origin: content-box;
    cursor: pointer;
    padding: 20px 30px 20px 30px;
    border-bottom: 1px solid #D6D6D6;
}

dl.questions dd {
    padding: 15px;
    color:#555555;
    background: #F0F1F3;
}

dl.questions .expanded_img {
  background: #ffffff url('../images/arrow-down.svg') right center no-repeat;
  background-size: 15px;
  background-origin: content-box;
  cursor: pointer;
}


/************footer start************/
.shr-footer-area{
    width: 100%;
    padding: 100px 0px 20px;
    background-image: url(../images/bgs/pattern.webp);
    background-repeat: repeat;
    background-color: rgba(0,0,0,.8);
}
.shr-footer-btn{
    margin-bottom: 50px;
}
.shr-footer-btn .btn{
    font-size: 20px;
    font-weight: 300;
    padding: 20px 20px 20px 20px;
    color: #fff;
    border-color: rgba(0,0,0,.1);
    background-color: rgba(0, 0, 0, 0.35);
    border-radius: 0px;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-footer-btn .btn:hover{
    background: #070707;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-footer-btn i{
    font-size: 30px;
    margin-left: 10px;
    margin-right: 10px;
}

.shr-footer-area ul{
    list-style: none;
}

.shr-footer-area li{
vertical-align: top;
font-size: 14px;
color: ##C5C5C5;
padding-right: 18px;
display: inline-block;
text-align: left;
}
.shr-footer-area li a:hover{
    color: #ffffff;
}
.shr-footer-area li a{
    color: #C5C5C5;
}
.shr-socila-grup{
    border-top: 1px solid rgba(0,0,0,.3);
    padding-top: 50px;
    padding-bottom: 10px;
}
.shr-socila-grup i{
    width: 70px;
    height: 70px;
    font-size: 20px;
    line-height: 70px;
    color: #ffffff;
    margin: 5px;
    text-align: center;
    border-color: rgba(0,0,0,.1);
    background-color: rgba(0, 0, 0, 0.35);
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    transition: all 350ms ease-in-out 0s;
    -moz-transition: all 350ms ease-in-out 0s;
    -webkit-transition: all 350ms ease-in-out 0s;
    -o-transition: all 350ms ease-in-out 0s;
    -ms-transition: all 350ms ease-in-out 0s;
}
.shr-socila-grup i:hover{
    background: #4084C5;
}
.shr-copyright-text{
    color: #797979;
}
.shr-copyright-text a{
    color: #797979;
}
.shr-copyright-text a:hover{
    color: #ffffff;
}

.separator_small {
    width: 280px;
    height: 1px;
    margin: 20px 0px;
    background: #3d3d3d;
}
/************footer end************/


/************ETC************/
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
    background: transparent!important;
    color: #4084C5!important;
}

.nav>li>a:focus,.nav>li>a:hover{
    text-decoration:none;
    background-color:transparent!important;
}

.ico-korea::before {
    content: "";
    background-image: url(../images/ico-korea.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-englash::before {
    content: "";
    background-image: url(../images/ico-englash.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-china::before {
    content: "";
    background-image: url(../images/ico-china.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-japan::before {
    content: "";
    background-image: url(../images/ico-japan.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-italy::before {
    content: "";
    background-image: url(../images/ico-italy.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-france::before {
    content: "";
    background-image: url(../images/ico-france.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-thailand::before {
    content: "";
    background-image: url(../images/ico-thailand.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-germany::before {
    content: "";
    background-image: url(../images/ico-germany.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-vietnam::before {
    content: "";
    background-image: url(../images/ico-vietnam.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}
.ico-indonesia::before {
    content: "";
    background-image: url(../images/ico-indonesia.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

.ico-spein::before {
    content: "";
    background-image: url(../images/ico-spein.webp);
    background-size: 22px 17px;
    width: 22px;
    height: 17px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

.Video-area{
    padding: 60px 0 60px;
    height: 100%;
    background-image: url(../images/bgs/video-bak.webp);
    background-size: cover;
    background-position: center;
    position: relative;
    overflow: hidden;
}

.Video_Container {
        position:relative;
        height:0;
        padding-bottom:56.25%;
        overflow:hidden
    }
        
.Video_Container iframe {
         position:absolute;
         width:100%;
         height:100%;
         top:0%;
         left:0%;
        }


        .block-7 {
            font-size: 24px;
            margin-bottom: 30px;
            padding: 30px;
            color: #000;
            -webkit-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03);
            -moz-box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03);
            box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.03);
            background: #fff;
        }
        
        .block-7 .heading {
            font-size: 24px;
            line-height: 1;
            margin: 0;
            padding: 0;
            margin-bottom: 10px;
            display: inline-block;
            text-transform: uppercase;
        }
        
        .block-7 .heading-2 {
            font-size: 16px;
        }
        
        .block-7 .price {
            margin: 0;
            padding: 0;
            display: block;
        }
        
        .block-7 .price sup {
            font-size: 35px;
            top: -.5.2em;
            color: #2f89fc;
        }
        
        .block-7 .price .sup2 {
            font-size: 25px;
            color: #FF3A44;
        }
        
        .block-7 .price .number {
            font-size: 60px;
            font-weight: 500;
            color: #2f89fc;
        }
        
        .block-7 .price .number-black {
            font-size: 60px;
            font-weight: 500;
            color: #000000;
        }
        
        .block-7 .price .number2 {
            font-size: 20px;
            font-weight: 300;
            text-decoration:line-through;
            color: #a7a7a7;
        }
        
        .block-7 .excerpt {
            margin-bottom: 20px;
            color: #000;
        }
        
        .block-7 .blu {
            color: #2f89fc;
        }
        .block-7 .red {
            color: rgb(252, 47, 47);
        }
        .block-7 .label2 {
            text-transform: uppercase;
        }
        
        .block-7 .pricing-text {
            margin-bottom: 0;
        }
        .block-7 .line {
            border : 1px dashed #000;
        }
        .block-7 .pricing-text,
        .block-7 .pricing-text li {
            padding: 0;
            margin: 0;
        }
        
        .block-7 .pricing-text li {
            list-style: none;
            font-weight: 400;
            margin-bottom: 15px;
            color: #000;
        }
        
        .block-7 .pricing-text li strong {
            color: #000;
        }
        
        .d-block {
            display: block !important;
        }