@charset "utf-8";

* {
    font-family: 'Noto Sans KR'
}

.menu-button {
    z-index: 10;
    position: relative;
    width: 190px;
    height: 36px;
    line-height: 15px;
    color: #888;
    font-size: .9rem;
    font-family: 'Noto Sans KR', Sans-serif;
    font-weight: 400;
    text-align: left;
    padding: 7px 15px;
    background: url(../../images/down-arrow-icon.png) #201e1e no-repeat center right 15px
}

.nav-box {
    z-index: 9;
    position: absolute;
    overflow: hidden;
    overflow-y: scroll;
    right: 0;
    width: 180px;
    height: 300px;
    bottom: 35px;
    background: #2c2828
}

.nav-box opened>a {
    width: 150px
}

@media screen and (max-width:420px) {
    .nav-box {
        width: 100vw;
        right: 0
    }
}

.nav-box .nav-item {
    display: block;
    color: #fff;
    text-align: left;
    font-size: 14px;
    font-family: 'Noto Sans KR', Sans-serif;
    font-weight: 300;
    width: 100%;
    line-height: 30px;
    transition: all ease-in-out 250ms;
    padding: 7px 15px
}

.nav-box .nav-item:hover {
    background: #fff;
    color: tomato
}

.opened {
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    -moz-transition: all .4s ease
}

.closed {
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    -moz-transition: all .4s ease;
    height: 0;
    width: 148px
}

.section {
    text-align: center
}

#hd {
    position: fixed;
    background: #fff;
    width: 100%;
    z-index: 9;
    left: 0;
    top: 0;
    border-bottom: 1px solid #005cb8
}

.hd-wr {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    height: 80px
}

.hd-wr .logo {
    float: left;
    padding-top: 17.5px
}

.hd-wr .lan {
    right: 214px;
    position: absolute;
    overflow: hidden;
    top: 0
}

.hd-wr .lan a {
    float: left;
    margin: 0 10px;
    line-height: 80px;
    color: #aaa;
    font-weight: 400;
    font-size: .9rem;
    position: relative
}

.hd-wr .lan a.active,
.hd-wr .lan a:hover {
    color: #000
}

.hd-wr .lan a.active:before {
    content: '';
    position: absolute;
    bottom: 25px;
    left: 0;
    width: 20px;
    height: 1px;
    background: #000
}

.hd-wr .lan a:hover:before {
    content: '';
    position: absolute;
    bottom: 25px;
    left: 0;
    width: 20px;
    height: 1px;
    background: #000
}
.hd-wr .lx2{position: absolute;top:0;right: 0;max-height: 80px;}
.hd-wr .lx2 a{display: block;
    width: 100%;
    height: 100%;
    padding: 17px 24px;
    box-sizing: border-box;
    background-color: #005B9E;}
    .hd-wr .lx2 a img{display: block;width: 100%;max-width: 106.5px;}
#menu {
    text-align: center;
    font-family: 'Noto Sans KR'
}

#menu li {
    display: inline-block;
    line-height: 80px;
    color: #000
}

#menu li a {
    text-decoration: none;
    color: #000;
    line-height: 80px;
    padding: 0 30px;
    display: block
}

#menu {
    display: flex;
    top: 0;
    margin: 0 auto 0 280px;
    z-index: 70;
    text-align: center;
    padding: 0
}

#menu li:hover>a {
    color: #005cb8
}

#menu li>a {
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0)
}

#menu li:active:before,
#menu li:focus:before,
#menu li:hover>a:before {
    left: 0;
    right: 0
}

#menu li>a:before {
    content: "";
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: 0;
    background: #005cb8;
    height: 3px;
    -webkit-transition-property: left, right;
    transition-property: left, right;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease
}

#menu-toggle {
    display: none
}

.menu-toggle {
    display: none
}

nav.ham-menu {
    display: none
}

.fp-controlArrow {
    display: none
}

.wr-1280 {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    overflow: hidden
}

.contents {
    height: 575px
}

.sc-tit {
    font-size: 20px;
    color: #666;
    text-align: center;
    font-weight: 500;
    margin-bottom: 50px;
    padding-top: 100px
}

.sc-tit span {
    display: block;
    font-size: 26px;
    color: #222;
    font-weight: 500
}

#section0 .slide {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    font-family: 'Noto Sans KR'
}

#section0 .slide-bg-1 {
    background-image: url(../../images/main_slide1.jpg)
}

#section0 .slide-bg-2 {
    background-image: url(../../images/main_slide2.jpg)
}

#section0 .slide-bg-3 {
    background-image: url(../../images/main_slide3.jpg)
}

#section0 .slide-bg-4 {
    background-image: url(../../images/main_slide4.jpg)
}

#section0 .slide-txt {
    font-size: 2rem;
    font-weight: 500;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    z-index: 3;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    padding-bottom: 100px
}

#section0 .slide-txt h1 {
    font-size: 3rem;
    color: #fff;
    font-weight: 500
}

#section0 .fp-slidesNav.bottom {
    bottom: auto;
    top: 55%;
    margin-left: -67.5px !important
}

#section0 .fp-slidesNav li {
    width: auto;
    margin: 5px
}

#section0 .fp-slidesNav li a {
    width: 15px
}

#section0 .fp-slidesNav li a.active {
    width: 50px
}

#section0 .fp-slidesNav .active span {
    background: #00adef;
    width: 50px;
    border-radius: 50px
}

#section0 .fp-slidesNav span {
    border: 0;
    background: rgba(255, 255, 255, .9);
    width: 13px;
    height: 13px
}

#section0 .fp-slidesNav .active span {
    top: 2px;
    left: 2px
}

.icon-scroll {
    position: absolute;
    top: 85%;
    left: 50%;
    width: .8em;
    height: 3.125em;
    transform: translateX(-50%) scale(2);
    z-index: 99999
}

.icon-arrows::after,
.icon-arrows::before {
    content: ''
}

.icon-arrows span,
.icon-arrows::after,
.icon-arrows::before {
    display: block;
    width: .315em;
    height: .315em;
    border-right: 1px solid rgba(255, 255, 255, .8);
    border-bottom: 1px solid rgba(255, 255, 255, .8);
    margin: 0 0 .125em .315em;
    transform: rotate(45deg);
    animation: mouse-scroll 1s infinite;
    animation-direction: alternate
}

.icon-arrows::before {
    margin-top: .315em;
    animation-delay: .1s
}

.icon-scroll span {
    animation-delay: .2s
}

.icon-arrows::after {
    animation-delay: .3s
}

.icon-scroll .mouse {
    height: 1.375em;
    width: .675em;
    border: 1px solid rgba(255, 255, 255, .8);
    border-radius: 2em;
    margin-left: 1.5px
}

.icon-scroll .wheel {
    position: relative;
    display: block;
    height: .1875em;
    width: .1875em;
    margin: .1875em auto 0;
    background: rgba(255, 255, 255, .8);
    animation: mouse-wheel 1.2s ease infinite;
    border-radius: 50%
}

@keyframes mouse-wheel {
    0% {
        opacity: 1;
        transform: translateY(0)
    }

    100% {
        opacity: 0;
        transform: translateY(.375em)
    }
}

@keyframes mouse-scroll {
    0% {
        opacity: 0
    }

    50% {
        opacity: .5
    }

    100% {
        opacity: 1
    }
}

#section1 {
    background: url(../../images/bg.jpg) no-repeat right bottom;
    background-size: cover;
    font-family: 'Noto Sans KR'
}

#section1 .tabs {
    width: 100%;
    margin: 0 auto;
    height: auto !important
}

#section1 .tabs-nav {
    position: relative
}

#section1 .tabs-nav li {
    display: inline-block;
    z-index: 2;
    position: relative;
    box-shadow: 1px 1px 20px #aaa;
    margin: 0 10px;
    width: 381px;
    height: 526px;
    overflow: hidden
}

#section1 .tabs-nav li:hover img {
    transform: scale(1.2)
}

#section1 .tabs-nav li img {
    display: block;
    transition: all 1s ease;
    width: 100%
}

.view-1 .view-text p {
    width: 70%;
    line-height: 32px
}

.view-2 .view-text p {
    width: 70%;
    line-height: 32px
}

.view-3 .view-text p {
    width: 80%;
    line-height: 32px
}

.view-4 .view-text p {
    width: 80%;
    line-height: 32px
}

.view-text {
    position: absolute;
    top: 40px;
    left: 40px;
    z-index: 2
}

.view-text h1 {
    font-size: 34px;
    line-height: 34px;
    font-weight: 600;
    text-align: left;
    color: #fff;
    margin-bottom: 25px
}

.view-text p {
    font-size: 20px;
    line-height: 20px;
    font-weight: 300;
    text-align: left;
    color: #fff;
    margin-bottom: 14px
}

.view-more {
    width: 40px;
    height: 40px;
    background: url(../../images/view-arr.png) no-repeat;
    margin-top: 16px;
    float: left
}

.overlay2 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    background: url(../../images/sec1-overlay.png) no-repeat 0 0;
    transition: all .3s ease;
    background-size: cover
}

#section1 .tabs-nav li:hover .overlay {
    background: url(../../images/sec1-overlay.png) no-repeat 0 0
}

#section1 .tab-active a {
    cursor: pointer
}

#section1 .tabs-stage {
    clear: both;
    padding: 30px 0;
    position: relative
}

#section1 .tabs-stage h1 {
    font-size: 2.8rem;
    font-weight: 500;
    color: #333;
    line-height: 1.3
}

#section1 .tabs-stage p {
    font-size: 1rem;
    font-weight: 400;
    color: #333;
    margin-top: 50px
}

#section1 .tabs-stage .view-btn {
    display: block;
    width: 120px;
    margin: 50px auto 0;
    letter-spacing: 0;
    font-weight: 400;
    font-size: .9rem;
    color: #666;
    text-align: left;
    background: url(../../images/view-icon.png) no-repeat top 16px right 20px;
    padding: 10px 0;
    cursor: pointer
}

#section1 .popup {
    position: absolute;
    display: none;
    right: 0;
    top: 100%;
    background: #fff;
    z-index: -1;
    width: 100%;
    height: 100%;
    padding-top: 81px;
    transition: all .6s
}

#section1 .popup .close-btn {
    position: absolute;
    top: 150px;
    right: 70px;
    cursor: pointer;
    z-index: 3
}

.view-cont-1-body {
    width: 100%;
    height: 100%;
    background: url(../../images/view-cont-1-bg.png) no-repeat;
    background-size: contain;
    position: relative
}

.view-cont-1-title {
    display: inline-block;
    padding-top: 90px;
    font-size: 26px;
    color: #005cb8;
    line-height: 26px;
    font-weight: 500;
    margin-bottom: 47px
}

.greeting {
    width: 1280px;
    position: relative;
    margin: 0 auto;
    clear: both
}

.greeting div {
    float: left
}

#section1 .view-cont-1-cont {
    text-align: center
}

.view-cont-1-cont {
    display: inline-block;
    z-index: 2;
    position: relative
}

.view-cont-1-cont h1 {
    font-size: 30px;
    text-align: left;
    line-height: 45px;
    color: #222;
    margin-bottom: 40px;
    font-weight: 500
}

.view-cont-1-cont h1 span {
    font-size: 46px;
    line-height: 28px;
    font-weight: 500;
    color: #005cb8
}

.view-cont-1-cont p {
    font-size: 16px;
    line-height: 28px;
    text-align: left;
    color: #666;
    margin-bottom: 40px
}

.view-cont-1-cont p span {
    color: #004890;
    line-height: 28px;
    font-weight: 500
}

.view-cont-1-sign {
    font-size: 16px;
    line-height: 20px;
    float: right !important
}

.view-cont-1-sign img {
    vertical-align: middle;
    margin-left: 20px
}

.view-cont-1-img {
    position: absolute;
    right: 0;
    display: inline-block;
    z-index: 1;
    right: -70px
}

.view-cont-1-title2 h1 {
    font-size: 40px;
    line-height: 52px;
    color: #333;
    font-weight: 500
}

.view-cont-1-title2 h1 span {
    font-size: 46px;
    line-height: 46px;
    color: #005cb8;
    font-weight: 500
}

.view-cont-1-title2 p {
    font-size: 30px;
    line-height: 50px;
    color: #333;
    font-weight: 500
}

.view-cont-1-title2 h3 {
    margin-top: 30px;
    line-height: 26px;
    font-size: 16px;
    color: #666;
    font-weight: 400
}

.view-cont-1-title2 h3 span {
    line-height: 26px;
    font-size: 16px;
    color: #000;
    font-weight: 500
}

.history {
    width: 778px;
    margin: 0 auto;
    margin-top: 50px;
    position: relative;
    display: inline-block
}

.history div {
    position: relative;
    float: left
}

.his-box1 {
    width: 272px;
    overflow: hidden;
    text-align: left
}

.his-box2 {
    width: 253px;
    overflow: hidden;
    text-align: left
}

.his-box3 {
    width: 253px;
    overflow: hidden;
    text-align: left
}

.history div h3 {
    padding-left: 30px;
    font-size: 20px;
    line-height: 30px;
    margin-top: 15px;
    font-weight: 600
}

.history div p {
    padding-left: 30px;
    font-size: 16px;
    color: #222;
    line-height: 26px
}

.his-box-title1 {
    width: 272px;
    height: 47px;
    background: url(../../images/his-img1.png) no-repeat
}

.his-box-title1 span {
    line-height: 47px;
    display: block;
    text-align: left;
    color: #fff;
    padding-left: 25px
}

.his-box1 h3 {
    color: #00aff2;
    padding-left: 25px
}

.his-box1 p {
    padding-left: 25px
}

.his-box-title2 {
    width: 253px;
    height: 47px;
    background: url(../../images/his-img2.png) no-repeat
}

.his-box-title2 span {
    line-height: 47px;
    display: block;
    text-align: left;
    color: #fff;
    padding-left: 30px
}

.his-box2 h3 {
    color: #0085d5
}

.his-box-title3 {
    width: 253px;
    height: 47px;
    background: url(../../images/his-img3.png) no-repeat
}

.his-box-title3 span {
    line-height: 47px;
    display: block;
    text-align: left;
    color: #fff;
    padding-left: 30px
}

.his-box3 h3 {
    color: #005cb8
}

.policy {
    display: inline-block;
    padding: 50px 250px 120px 250px;
    background: url(../../images/policy-bg.png) center no-repeat
}

.policy-box {
    float: left;
    width: 31.3%;
    margin-left: 1%;
    margin-right: 1%
}

.policy-box div {
    height: 100px;
    display: block;
    position: relative
}

.policy-box div img {
    position: absolute;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.policy-box h1 {
    font-size: 20px;
    line-height: 26px;
    font-weight: 600;
    color: #000;
    margin-top: 20px
}

.policy-box h1 span {
    color: #005cb8;
    line-height: 26px
}

.policy-box p {
    font-size: 16px;
    line-height: 26px;
    margin-top: 10px;
    color: #666
}

.certi {
    display: inline-block;
    margin-top: 50px;
    padding: 0 0 150px 0;
    background: url(../../images/policy-bg.png) center no-repeat
}

.certi-box {
    width: 240px;
    float: left;
    margin: 0 10px
}

.certi-box p {
    color: #333;
    font-size: 16px
}

#section2 {
    background: url(../../images/business-bg.jpg) no-repeat center center;
    background-size: cover;
    font-family: 'Noto Sans KR'
}

#section2 .tabs {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto
}

#section2 .tabs-nav {
    position: relative;
    clear: both
}

#section2 .tabs-nav:before {
    content: '';
    width: 200px;
    height: 1px;
    background: #dce8f3;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -100px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 1
}

#section2 .tabs-nav li {
    display: inline-block;
    margin: 0 30px;
    border-radius: 100%;
    z-index: 2;
    position: relative
}

#section2 .tabs-nav li .hover {
    display: none
}

#section2 .tab-active a .hover,
#section2 .tabs-nav li a:hover .hover {
    display: block
}

#section2 .tab-active a .none,
#section2 .tabs-nav li a:hover .none {
    display: none
}

#section2 .tab-active a {
    background: #fff;
    border-bottom-color: transparent;
    color: #2db34a;
    cursor: pointer
}

#section2 .tabs-stage {
    clear: both;
    padding: 30px 0 0;
    position: relative
}

#section2 .tabs-stage #tab-5 a {
    display: inline-block;
    margin: 40px 10px 0
}

#section2 .tabs-stage #tab-5 a img {
    width: 100%
}

#section2 .tabs-stage #tab-5 a:nth-child(2) {
    margin-top: 0
}

#section2 .tabs-stage #tab-5 a:nth-child(4) {
    margin-top: 80px
}

#section2 .tabs-stage #tab-5 a:hover {
    margin-top: 20px;
    transition: all .6s
}

#section2 .tabs-stage #tab-5 a:nth-child(2):hover {
    margin-top: -20px;
    transition: all .6s
}

#section2 .tabs-stage #tab-5 a:nth-child(4):hover {
    margin-top: 60px;
    transition: all .6s
}

#section2 .tabs-stage #tab-6 a {
    display: inline-block;
    text-align: center
}

#section2 .tabs-stage #tab-6 a:hover {
    margin-top: -20px;
    transition: all .6s
}

li.tab-active .border-sic2 {
    width: 150px;
    height: 150px;
    border: 1px solid #005cb8;
    background: #fff;
    box-sizing: border-box;
    border-radius: 50%
}

li.tab-active .border-sic2 span {
    width: 140px;
    height: 140px;
    margin: 4px;
    background: #005cb8;
    border-radius: 50%
}

li.tab-active .border-sic2 img {
    padding-top: 30px
}

li.tab-active .border-sic2 p {
    color: #fff;
    line-height: 50px;
    font-size: 18px;
    font-weight: 400
}

.t-img-1 {
    background: url(../../images/sec2-img1-2.png) no-repeat;
    width: 39px;
    height: 38px;
    text-align: center;
    margin: 0 auto;
    margin-top: 30px
}

.t-img-2 {
    background: url(../../images/sec2-img2-2.png) no-repeat;
    width: 38px;
    height: 43px;
    text-align: center;
    margin: 0 auto;
    margin-top: 30px
}

li.tab-active .t-img-1 {
    background: url(../../images/sec2-img1.png) no-repeat
}

li.tab-active .t-img-2 {
    background: url(../../images/sec2-img2.png) no-repeat
}

.border-sic2 {
    width: 150px;
    height: 150px;
    border: 1px solid #dce8f3;
    background: #fff;
    box-sizing: border-box;
    border-radius: 50%
}

.border-sic2 span {
    width: 140px;
    height: 140px;
    margin: 4px;
    background: #dce8f3;
    border-radius: 50%
}

.border-sic2 img {
    padding-top: 30px
}

.border-sic2 p {
    color: #4d6b88;
    line-height: 50px;
    font-size: 18px;
    font-weight: 400
}

#section3 {
    width: 100%;
    height: auto;
    font-family: 'Noto Sans KR'
}

#section3 .cont-slider {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    height: auto !important
}

#section3 .bx-wrapper .bx-pager {
    text-align: center;
    position: inherit;
    padding-top: 40px
}

#section3 .bx-wrapper .bx-controls-auto {
    bottom: 0;
    left: 50%;
    margin-left: 90px
}

#section3 .bx-wrapper .bx-pager.bx-default-pager a {
    border-radius: 20px;
    background: #bbb;
    width: 12px;
    height: 12px
}

#section3 .bx-wrapper .bx-pager.bx-default-pager a.active {
    width: 40px;
    background: #00adef
}

#section3 .bx-wrapper .bx-controls-direction a {
    display: none
}

#section3 .sc-tit {
    padding-top: 170px
}

#section3 .slide2 .fp-tableCell {
    display: block;
    height: auto !important
}

#section3 .fp-slidesNav li {
    width: auto;
    margin: 0 5px
}

#section3 .fp-slidesNav li a {
    width: 12px
}

#section3 .fp-slidesNav li a.active {
    width: 50px
}

#section3 .fp-slidesNav .active span {
    background: #00adef;
    width: 50px;
    border-radius: 50px
}

#section3 .fp-slidesNav span {
    border: 0;
    background: #bbb;
    width: 12px;
    height: 12px
}

#section3 .fp-slidesNav .active span {
    top: 2px;
    left: 2px
}

#section3 .fp-slidesNav {
    top: auto;
    margin-left: -70px;
    position: relative;
    padding-top: 50px;
    width: auto
}

.slide-control {
    display: inline-block;
    position: absolute;
    padding-top: 50px;
    z-index: 10;
    left: 50%;
    opacity: 1;
    top: auto;
    margin-top: 2px;
    margin-left: 40px;
    transform: translate(-50%, 0)
}

.start {
    display: block;
    text-indent: -9999px;
    width: 10px;
    height: 11px;
    float: left;
    cursor: pointer;
    outline: 0;
    background: url(../../images/controls.png) -86px -11px no-repeat;
    margin: 0 3px
}

.start.active {
    background-position: -86px 0
}

.stop {
    display: block;
    text-indent: -9999px;
    width: 9px;
    height: 11px;
    cursor: pointer;
    float: left;
    margin-left: 5px;
    outline: 0;
    background: url(../../images/controls.png) -86px -44px no-repeat;
    margin: 0 3px
}

.stop.active {
    background-position: -86px -33px
}

.slide-box {
    width: 100%;
    clear: both;
    margin-left: 1px
}

.slide-box div {
    float: left
}

.box-1 {
    display: inline-block;
    height: 460px;
    position: relative;
    width: 640px
}

.box-1 img {
    width: 100%;
    display: block
}

.sli-img1 {
    background: url(../../images/sec3-img1.png) no-repeat;
    background-size: cover
}

.sli-img2 {
    background: url(../../images/sec3-img2.png) no-repeat;
    background-size: cover
}

.sli-img3 {
    background: url(../../images/sec3-img3.png) no-repeat;
    background-size: cover
}

.sli-img4 {
    background: url(../../images/sec3-img4.png) no-repeat;
    background-size: cover
}

.sli-img5 {
    background: url(../../images/sec3-img5.png) no-repeat;
    background-size: cover
}

.sli-img6 {
    background: url(../../images/sec3-img6.png) no-repeat;
    background-size: cover
}

.b-text {
    width: 100%;
    left: 0;
    bottom: 0;
    position: absolute;
    background: rgba(0, 92, 184, .9);
    letter-spacing: -.9px
}

.b-text h1 {
    font-size: 36px;
    line-height: 30px;
    font-weight: 500;
    padding: 40px 30px 0 40px;
    text-align: left;
    color: #fff
}

.b-text p {
    font-size: 18px;
    line-height: 18px;
    font-weight: 500;
    padding: 20px 30px 40px 40px;
    text-align: left;
    color: #fff
}

.box-2 {
    width: 314px;
    height: 460px;
    background: #f7f7f7;
    margin-left: 5px
}

.box-2-miniimg {
    width: 100%;
    height: 244px;
    position: relative;
    display: inline-block
}

.box-2-miniimg img {
    position: absolute;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.box-2-line {
    width: 40px;
    height: 1px;
    background: #005cb8;
    margin: 0 auto;
    margin-top: 244px;
    display: block
}

.box-2-text {
    width: 100%;
    text-align: center;
    margin-top: 50px
}

.box-2-text h1 {
    font-size: 22px;
    line-height: 22px;
    margin-bottom: 25px;
    color: #0d0d11
}

.box-2-text h1 span {
    color: #005cb8;
    line-height: 22px
}

.box-2-text p {
    font-size: 16px;
    line-height: 28px;
    color: #505050;
    width: 96%;
    margin-left: 2%;
    margin-right: 2%
}

.box-2-text p span {
    color: #000;
    line-height: 28px;
    font-weight: 400
}

#section4 .root_daum_roughmap .border1,
#section4 .root_daum_roughmap .border2,
#section4 .root_daum_roughmap .border3,
#section4 .root_daum_roughmap .border4 {
    display: none
}

#section4 .address {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    overflow: hidden;
    height: 150px;
    line-height: 150px;
    background: #3a3c3e;
    color: #fff;
    z-index: 6
}

.loex-t {
    float: left;
    font-size: 36px;
    line-height: 150px
}

#section4 .root_daum_roughmap .wrap_controllers {
    position: absolute;
    top: 0;
    width: 100%
}

.mid-adr {
    width: 1280px;
    margin: 0 auto
}

.mid-adr-box {
    float: right
}

.mid-adr-box ul {
    float: left;
    padding-left: 50px
}

.mid-adr-box ul li {
    float: left;
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    height: 100%;
    line-height: 150px
}

.mid-adr-box ul li:nth-child(2) {
    color: #bcbcbc;
    padding-left: 10px;
    box-sizing: border-box;
    font-weight: 400
}

#section4 .map-location {
    position: absolute;
    background: rgba(0, 92, 185, .9);
    width: 640px;
    margin-right: 40px;
    height: 378px;
    left: -640px;
    top: 50%;
    transform: translate(0, -30%);
    z-index: 3;
    cursor: pointer;
    transition: all .6s
}

.map-menu {
    width: 84%;
    margin: 5% 8%;
    display: inline-block
}

.map-menu li {
    display: block;
    width: 48%;
    float: left;
    margin-left: 1%;
    margin-bottom: 1%;
    border: 1px solid #fff;
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    height: 40px;
    line-height: 40px
}

.map-menu li.active {
    color: #005cb9;
    background: #fff
}

.map-info {
    left: 635px;
    position: absolute;
    width: 40px;
    height: 378px;
    background: url(../../images/map-img2.png) no-repeat
}

.map-active {
    left: 635px;
    display: none;
    position: absolute;
    width: 40px;
    height: 378px;
    background: url(../../images/map-img.png) no-repeat
}

.map-on {
    left: 0 !important;
    background: rgba(0, 92, 185, .9)
}

.conte {
    text-align: left;
    margin: 0 8%
}

.conte p {
    font-size: 16px;
    line-height: 26px;
    color: #fff;
    font-weight: 300
}

.conte p span {
    font-size: 16px;
    line-height: 26px;
    color: #00adef
}

#section5 {
    background: url(../../images/dongwon-bg.jpg) no-repeat top center;
    background-size: cover;
    font-family: 'Noto Sans KR'
}

#section5 .footer {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 50px 0;
    background: #2c2828;
    color: #fff
}

#section5 .footer .ft-logo {
    float: left;
    padding-right: 50px
}

#section5 .footer .info {
    float: left;
    text-align: left
}

#section5 .footer .info p {
    font-size: .9rem;
    font-weight: 400;
    color: #6a6a6a;
    font-weight: 500
}

#section5 .footer .info p span {
    color: #6a6a6a;
    margin-left: 10px
}

#section5 .brochure {
    text-align: left;
    margin-left: 50%;
    margin-bottom: 150px
}

#section5 .brochure p {
    font-size: 1rem;
    color: #505050;
    padding-bottom: 10px
}

#section5 .brochure h1 {
    font-size: 2.4rem;
    color: #000;
    font-weight: 200
}

#section5 .brochure h1 img {
    vertical-align: middle;
    padding-bottom: 8px;
    margin-right: 10px
}

#section5 .download-btn {
    overflow: hidden
}

#section5 .download-btn a {
    float: left;
    display: inline-block;
    padding: 7px 130px 7px 20px;
    margin-top: 30px;
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 0;
    border: 1px solid #000;
    background: url(../../images/download-icon.png) no-repeat center right 20px;
    color: #000
}

#section5 .download-btn a span {
    color: #005cb8;
    font-weight: 400
}

#section5 .download-btn a:hover {
    transition: all .6s;
    background: url(../../images/download-icon-on.png) #005cb8 no-repeat center right 20px;
    border-color: #005cb8;
    color: #fff
}

#section5 .download-btn a:hover span {
    transition: all .6s;
    color: #fff
}

#section5 .right-box {
    float: right;
    position: relative
}

#section5 .right-box a img {
    padding-top: 2px;
    float: right
}

#section5 .right-box .video-go {
    display: inline-block;
    padding: 7px 15px;
    color: #888;
    font-size: .9rem;
    width: 180px;
    overflow: hidden;
    text-align: left;
    background: url(../../images/video-icon2.png) red no-repeat center right 15px;
    color: #fff
}

#section5 .right-box .family-site {
    background: #201e1e;
    background: url(../../images/down-arrow-icon.png) #201e1e no-repeat center right 15px;
    position: relative;
    z-index: 5
}

#section5 .right-box .family-site2 {
    background: #201e1e;
    display: none;
    background: url(../../images/down-arrow-icon.png) #201e1e no-repeat center right 15px;
    position: relative;
    z-index: 5
}

#section5 .right-box .video-go:hover {
    opacity: .8
}

#section5 .wr-1280 {
    overflow: inherit
}

.fam {
    position: relative
}

.family {
    position: absolute;
    right: 0;
    bottom: -525px;
    opacity: 1;
    display: block;
    background: #201e1e;
    z-index: -1;
    border-bottom: 1px solid #666;
    width: 210px;
    transition: all .6s
}

.family a {
    display: block;
    text-align: center;
    color: #aaa;
    font-size: 14px;
    line-height: 28px;
    font-weight: 300
}

.family a:hover {
    color: #ddd !important
}

#section5 .popup {
    position: absolute;
    display: none;
    right: 0;
    top: 100%;
    background: #fff;
    z-index: -1;
    width: 100%;
    height: 100%;
    padding-top: 81px;
    transition: all .6s
}

.view-cont-5 {
    display: none;
    z-index: 11
}

.view-cont-5 h1 {
    font-size: 30px;
    margin-top: 50px
}

.ft-pop {
    height: 60%;
    overflow-y: scroll;
    text-align: left;
    width: 1280px;
    margin: 0 auto;
    margin-top: 5%
}

#section5 .popup .close-btn {
    position: absolute;
    top: 150px;
    right: 17%;
    cursor: pointer;
    z-index: 3
}

.footer-pop {
    position: relative;
    padding-left: 10px;
    color: #aaa
}

.footer-pop:hover {
    color: #ccc;
    cursor: pointer
}

.footer-pop:before {
    content: '';
    width: 1px;
    height: 15px;
    position: absolute;
    background: #777;
    margin-top: 3px;
    left: 0
}

.jd-mana{
	position: relative;
    padding-left: 10px;
	color: #6a6a6a;
}

.jd-mana:hover {
    color: #ccc;
    cursor: pointer
}

.jd-mana:before {
    content: '';
    width: 1px;
    height: 15px;
    position: absolute;
    background: #777;
    margin-top: 3px;
    left: 0
}

.wrap_controllers {
    width: 100%;
    overflow: hidden;
    padding: 7px 0;
    border: 1px solid #dfdfdf;
    border-color: rgba(0, 0, 0, .1);
    border-radius: 0 0 2px 2px;
    box-sizing: border-box;
    background-color: #f9f9f9
}

.wrap_controllers a {
    height: 15px;
    padding-top: 1px;
    line-height: 24px;
    font-size: 13px;
    font-weight: 400;
    color: #000
}

.wrap_btn_roadview {
    float: right
}

.tit_controllers {
    float: left
}

.wrap_btn_roadview {
    margin-right: 3%
}

span.txt_bar {
    width: 1px;
    padding: 0;
    margin: 0 8px 0 9px;
    height: 11px;
    vertical-align: top;
    position: relative;
    top: 6px;
    border-left: 1px solid #d0d0d0
}

.languages {
    position: relative;
    margin: 33px 100px 0 25px;
    font-size: 14px;
    display: block;
    float: left;
    color: #fff;
    width: 80px;
    z-index: 9999;
    border-bottom: 1px solid #ddd
}

.language a {
    color: #fff
}

.languages .icon {
    margin: 0 5px
}

.languages .stripe {
    margin-bottom: 10px;
    width: 60px;
    height: 3px;
    display: block;
    float: left
}

.languages .dropdown {
    position: absolute;
    top: -46px;
    display: none
}

#header .languages .language a:visited,
.languages .language a:link {
    padding-bottom: 20px;
    color: #333;
    text-decoration: none;
    border: none
}

.dropdown-menu {
    padding: 5px 0;
    width: 80px;
    float: left;
    color: #333;
    text-align: center;
    margin-bottom: 1px;
    text-decoration: none;
    border: none;
    background: #fff
}

.dropdown-menu:hover {
    color: #040404
}

.side_menu {
    height: 90px;
    position: absolute;
    display: block;
    z-index: 99;
    width: 100%
}

.side_menu button {
    margin: 22px 30px 0 30px;
    right: 0
}

.btn_search_close {
    display: none
}

.btn_open_nav {
    display: block;
    position: absolute;
    width: 100%;
    height: 90px;
    background: #081969
}

.languages .language a:after {
    display: block;
    position: absolute;
    content: '';
    top: 50%;
    margin-top: -2px;
    right: 15px;
    width: 8px;
    height: 5px;
    background: url(../../images/lang-off.png) no-repeat center
}

.active a:after {
    background: url(../../images/lang-on.png) no-repeat center
}

.page {
    margin: 0 auto
}

#home-news {
    font-size: 60px;
    text-align: center;
    text-transform: uppercase;
    color: #464646;
    height: 70px;
    line-height: 70px;
    position: relative
}

.home_header {
    opacity: 0;
    width: 100%;
    z-index: 99;
    color: #fff;
    text-shadow: 1px 1px 8px #000
}

.home_header_on {
    z-index: 100
}

.home_header strong {
    color: #fff
}

.home_header span {
    font-weight: 700
}

.home_header span,
.home_header strong {
    position: relative;
    line-height: 60px
}

.home_header_on :nth-child(1) {
    top: 0;
    -webkit-transition: top .6s ease-in-out;
    -moz-transition: top .6s ease-in-out;
    transition: top .6s ease-in-out
}

.home_header_on :nth-child(2) {
    top: 0;
    -webkit-transition: top .6s ease-in-out .15s;
    -moz-transition: top .6s ease-in-out .15s;
    transition: top .6s ease-in-out .15s
}

.home_header_on :nth-child(3) {
    top: 0;
    -webkit-transition: top .6s ease-in-out .3s;
    -moz-transition: top .6s ease-in-out .3s;
    transition: top .6s ease-in-out .3s
}

.home_header_out :nth-child(1) {
    top: 70px;
    -webkit-transition: top .6s ease-in-out;
    -webkit-transition: top .6s ease-in-out;
    -moz-transition: top .6s ease-in-out
}

.home_header_out :nth-child(2) {
    top: 70px;
    -webkit-transition: top .6s ease-in-out .15s;
    -moz-transition: top .6s ease-in-out .15s;
    transition: top .6s ease-in-out .15s
}

.home_header_out :nth-child(3) {
    top: 70px;
    -webkit-transition: top .6s ease-in-out .3s;
    -moz-transition: top .6s ease-in-out .3s;
    transition: top .6s ease-in-out .3s
}

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

    .cont-slider,
    .cont-slider * {
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box
    }

    .cont-slider .sec-slider li {
        padding: 0 30px
    }

    .cont-slider .sec-slider li .slide-box>div {
        margin: 0 0 0 1%;
        overflow: hidden;
        height: 425px
    }

    .cont-slider .sec-slider li .slide-box .box-1 {
        width: 37%;
        margin-left: 0
    }

    .cont-slider .sec-slider li .slide-box .box-2 {
        width: 20%
    }

    .box-2-miniimg {
        height: 150px
    }

    .box-2-miniimg img {
        width: 35%
    }

    .box-2-line {
        margin-top: 150px
    }

    #section2 .tabs {
        width: 90%
    }

    .hd-wr .logo {
        margin-left: 7px;
        padding-top: 15px
    }
}

@media screen and (max-width:1280px) {
    body {
        padding-top: 80px
    }

    .icon-scroll {
        display: none
    }

    .hd-wr .lan {
        margin-right: 50px;
        right:0;
    }

    .cont-slider .sec-slider li {
        padding: 0 20px
    }

    .box-2-miniimg {
        height: 170px
    }

    .box-2-line {
        margin-top: 170px
    }

    .box-2-miniimg img {
        width: auto
    }

    .box-2-text h1 {
        margin-bottom: 15px
    }

    .sc-tit {
        padding-top: 50px
    }

    label.menu-toggle {
        margin: 10px 10px 0 0;
        cursor: pointer;
        display: inline-block;
        position: fixed;
        top: 22px;
        right: 0;
        z-index: 99;
        transition: -webkit-transform .3s ease;
        transition: transform .3s ease;
        transition: transform .3s ease, -webkit-transform .3s ease
    }
    .hd-wr .lx2{display:none;}

    .line {
        display: block;
        width: 25px;
        height: 3px;
        background: #454545;
        border-radius: 6px;
        transition: -webkit-transform .3s ease;
        transition: transform .3s ease;
        transition: transform .3s ease, -webkit-transform .3s ease
    }

    .line+.line {
        margin-top: 5px
    }

    .overlay {
        display: block;
        position: fixed;
        top: 80px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
        pointer-events: none;
        background: rgba(0, 0, 0, .5);
        opacity: 0;
        transition: opacity .3s ease
    }

    .page {
        position: relative;
        padding: 50px;
        transition: -webkit-transform .3s ease;
        transition: transform .3s ease;
        transition: transform .3s ease, -webkit-transform .3s ease;
        z-index: 1
    }

    nav.ham-menu {
        position: fixed;
        display: block;
        top: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        transition: all .3s ease;
        z-index: 5
    }

    nav.ham-menu:after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        z-index: 3;
        opacity: 0;
        pointer-events: none
    }

    nav.ham-menu ul {
        padding: 0;
        list-style: none;
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
        background: #fff
    }

    nav.ham-menu li {
        display: block;
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
        transition: -webkit-transform .3s ease;
        transition: transform .3s ease;
        transition: transform .3s ease, -webkit-transform .3s ease
    }

    nav.ham-menu li p {
        color: #454545;
        line-height: 50px;
        padding-left: 15px;
        text-align: center;
        font-size: 16px;
        display: block
    }

    ul.sub {
        border-bottom: none
    }

    nav.ham-menu li:nth-child(n+1) {
        transition-delay: .1s
    }

    nav.ham-menu li:nth-child(n+2) {
        transition-delay: .13s
    }

    nav.ham-menu li:nth-child(n+3) {
        transition-delay: .16s
    }

    nav.ham-menu li:nth-child(n+4) {
        transition-delay: .19s
    }

    nav.ham-menu li:nth-child(n+5) {
        transition-delay: .22s
    }

    nav.ham-menu li:nth-child(n+6) {
        transition-delay: .25s
    }

    nav.ham-menu li:nth-child(n+7) {
        transition-delay: .28s
    }

    nav li:nth-child(n+8) {
        transition-delay: .31s
    }

    nav li:nth-child(n+9) {
        transition-delay: .34s
    }

    nav li:nth-child(n+10) {
        transition-delay: .37s
    }

    nav li:nth-child(n+11) {
        transition-delay: .4s
    }

    nav li:nth-child(n+12) {
        transition-delay: .36s
    }

    nav li:nth-child(n+13) {
        transition-delay: .39s
    }

    nav li:nth-child(n+14) {
        transition-delay: .42s
    }

    nav li:nth-child(n+15) {
        transition-delay: .45s
    }

    nav li:nth-child(n+16) {
        transition-delay: .48s
    }

    nav li:nth-child(n+17) {
        transition-delay: .51s
    }

    nav li:nth-child(n+18) {
        transition-delay: .54s
    }

    nav li:nth-child(n+19) {
        transition-delay: .57s
    }

    nav li:nth-child(n+20) {
        transition-delay: .6s
    }

    nav li:hover:before {
        -webkit-transform: scale(1.1, 1);
        transform: scale(1.1, 1)
    }

    nav li a {
        display: block;
        text-align: center;
        position: relative;
        color: #364347;
        cusror: pointer;
        text-decoration: none;
        z-index: 2;
        line-height: 40px;
        margin: 5px
    }

    #menu-toggle {
        position: fixed;
        left: -99999999px
    }

    #menu-toggle:checked~.menu-toggle {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    #menu-toggle:checked~.menu-toggle .line-1 {
        -webkit-transform: translateY(10px) rotate(45deg) scale(1.3, 1);
        transform: translateY(10px) rotate(45deg) scale(1.3, 1);
        -webkit-transform-origin: 50%;
        transform-origin: 50%
    }

    #menu-toggle:checked~.menu-toggle .line-2 {
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    #menu-toggle:checked~.menu-toggle .line-3 {
        -webkit-transform: translateY(-10px) rotate(-45deg) scale(1.3, 1);
        transform: translateY(-10px) rotate(-45deg) scale(1.3, 1);
        -webkit-transform-origin: 50%;
        transform-origin: 50%;
        margin-top: 9px
    }

    #menu-toggle:checked~nav {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    #menu-toggle:checked~nav:after {
        opacity: 1
    }

    #menu-toggle:checked~nav ul li {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    #menu-toggle:checked~.overlay {
        opacity: 1;
        pointer-events: all
    }

    #menu-toggle:checked~.page {
        -webkit-transform: translateX(-300px);
        transform: translateX(-300px)
    }

    .ham-menu {
        width: 70%;
        overflow: hidden;
        clear: both;
        z-index: 96px;
        margin-top: 80px;
        -webkit-transition: all .4s ease;
        transition: all .4s ease;
        -moz-transition: all .4s ease
    }

    .ham-menu li {
        width: 100%;
        border-top: 1px solid #eaeaea
    }

    .ham-menu li:first-child {
        border-top: none
    }

    .ham-menu li {
        color: #454545;
        line-height: 50px;
        text-align: center;
        font-size: 16px;
        display: block
    }

    .ham-menu li a:hover {
        color: #fff;
        font-weight: 400;
        cursor: pointer;
        background: #005cb9
    }

    .ham-menu li ul {
        display: none;
        position: relative
    }

    .ham-menu li ul li {
        width: 100%;
        background: #485bab;
        font-weight: 400
    }

    .ham-menu li ul li:hover {
        background: #283979
    }

    .ham-menu ul li ul li a {
        color: #f9f9f9;
        line-height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 14px;
        padding-left: 20px;
        height: 50px;
        display: block;
        font-weight: 400;
        border-top: 1px solid #000
    }

    .ham-menu ul li ul li a:first-child {
        border-top: none
    }

    .ham-menu li ul li a:hover {
        color: #fff;
        font-weight: 400
    }

    .t-img-1 {
        display: none
    }

    .t-img-2 {
        display: none
    }

    #section2 .tabs-stage #tab-5 a:nth-child(4) {
        margin-top: 0
    }

    #section3 .sc-tit {
        padding-top: 40px
    }
}

@media all and (min-width:1281px) and (max-width:1620px) {
    #section1 .tabs-nav li {
        margin: 0 1% 1% 1%;
        width: 23%;
        float: left;
        height: 50%
    }

    #section1 .fp-tableCell {
        height: auto !important
    }

    .policy {
        display: inline-block;
        width: 70%;
        padding: 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .policy-box {
        float: left;
        display: inline-block;
        padding: 0;
        width: 31.3%;
        margin-left: 1%;
        margin-right: 1%;
        margin-top: 5%;
        margin-bottom: 5%
    }

    .policy-box div {
        height: 100px;
        display: block;
        position: relative
    }

    .policy-box div img {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .policy-box h1 {
        font-size: 16px;
        line-height: 26px;
        font-weight: 600;
        color: #000;
        margin-top: 20px
    }

    .policy-box h1 span {
        color: #005cb8;
        line-height: 26px
    }

    .policy-box p {
        font-size: 14px;
        line-height: 26px;
        margin-top: 10px;
        color: #666
    }

    .certi {
        display: inline-block;
        margin-top: 50px;
        padding: 0 0 150px 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .certi-box {
        width: 18%;
        float: left;
        margin: 0 1%
    }

    .certi-box img {
        width: 100%
    }

    #section3 {
        width: 100%
    }

    #section4 .map-location {
        position: absolute;
        background: rgba(0, 92, 185, .9);
        width: 640px;
        margin-right: 40px;
        height: 378px;
        left: -640px;
        top: 50%;
        transform: translate(0, -35%);
        z-index: 3;
        cursor: pointer;
        transition: all .6s
    }

    .map-menu {
        width: 84%;
        margin: 5% 8%;
        display: inline-block
    }

    .map-info {
        left: 635px;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img2.png) no-repeat
    }

    .map-active {
        left: 635px;
        display: none;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img.png) no-repeat
    }

    .map-on {
        left: 0 !important;
        background: rgba(0, 92, 185, .9)
    }
}

@media all and (min-width:1024px) and (max-width:1280px) {
    #home-news {
        font-size: 56px;
        line-height: 30px
    }

    #menu {
        display: none
    }

    #section0 {
        position: relative
    }

    .sc-tit span {
        font-size: 15px
    }

    #section1 .tabs {
        height: 70%
    }

    #section1 {
        height: 60% !important
    }

    #section1 .fp-tableCell {
        height: auto !important
    }

    #section1 .tabs-nav li {
        margin: 0 1% 1% 1%;
        width: 23%;
        float: left;
        height: 50%
    }

    .view-text {
        top: 20px;
        left: 20px
    }

    .view-text h1 {
        font-size: 20px;
        line-height: 34px;
        font-weight: 600;
        text-align: left;
        color: #fff;
        margin-bottom: 15px
    }

    .view-text p {
        font-size: 13px;
        line-height: 20px;
        font-weight: 300;
        text-align: left;
        color: #fff;
        margin-bottom: 5px
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1-body {
        background: 0 0;
        height: 85%;
        overflow-y: scroll;
        border-top: 1px solid #eaeaea;
        border-bottom: 1px solid #eaeaea
    }

    #section1 .popup .close-btn {
        right: 20px
    }

    #section1 .popup .close-btn img {
        width: 50%
    }

    #section1 .popup {
        height: 85%
    }

    .greeting {
        width: 98%;
        margin-left: 1%;
        margin-right: 1%;
        height: 60%
    }

    .view-cont-1-cont {
        width: 100%
    }

    .view-cont-1-cont {
        display: inline-block;
        text-align: left;
        z-index: 2;
        position: relative
    }

    .view-cont-1-cont h1 {
        font-size: 16px;
        font-weight: 500;
        line-height: 45px;
        text-align: center;
        color: #222;
        margin-bottom: 40px;
        margin-top: 10px
    }

    .view-cont-1-cont h1 span {
        font-size: 26px;
        line-height: 28px;
        font-weight: 500;
        color: #005cb8
    }

    .view-cont-1-cont p {
        font-size: 14px;
        line-height: 28px;
        color: #666;
        text-align: center;
        margin-bottom: 40px
    }

    .view-cont-1-sign {
        font-size: 14px;
        line-height: 20px;
        float: right !important
    }

    .view-cont-1-sign img {
        vertical-align: middle;
        margin-left: 20px
    }

    .view-cont-1-img {
        position: relative;
        width: 100%;
        right: 0;
        display: inline-block;
        z-index: 1;
        right: 0
    }

    .view-cont-1-img img {
        max-width: 100%
    }

    .view-cont-1-title2 h1 {
        font-size: 20px;
        line-height: 52px;
        color: #333;
        font-weight: 400
    }

    .view-cont-1-title2 h1 span {
        font-size: 26px;
        line-height: 46px;
        color: #005cb8;
        font-weight: 500
    }

    .view-cont-1-title2 p {
        font-size: 16px;
        line-height: 50px;
        color: #333
    }

    .view-cont-1-title2 h3 {
        margin-top: 30px;
        line-height: 26px;
        font-size: 14px;
        color: #666
    }

    .view-cont-1-title2 h3 span {
        line-height: 26px;
        font-size: 16px;
        color: #000
    }

    .history {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: inline-block
    }

    .history div {
        position: relative;
        float: left
    }

    .his-box1 {
        width: 48%;
        margin-left: 1%;
        margin-right: 1%;
        overflow: hidden;
        text-align: left
    }

    .his-box2 {
        width: 48%;
        overflow: hidden;
        text-align: left;
        margin-bottom: 15px
    }

    .his-box3 {
        width: 48%;
        overflow: hidden;
        text-align: left
    }

    .history div h3 {
        padding-left: 30px;
        font-size: 20px;
        line-height: 30px;
        margin-top: 15px;
        font-weight: 600
    }

    .history div p {
        padding-left: 30px;
        font-size: 16px;
        color: #222;
        line-height: 26px
    }

    .his-box-title1 {
        width: 100%;
        height: 47px;
        background: #00aff2;
        border-radius: 10px
    }

    .his-box-title1 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 25px
    }

    .his-box1 h3 {
        color: #00aff2;
        padding-left: 25px
    }

    .his-box1 p {
        padding-left: 25px
    }

    .his-box-title2 {
        width: 100%;
        height: 47px;
        background: #0085d5;
        border-radius: 10px
    }

    .his-box-title2 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box2 h3 {
        color: #0085d5
    }

    .his-box-title3 {
        width: 100%;
        height: 47px;
        background: #005cb8;
        border-radius: 10px
    }

    .his-box-title3 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box3 h3 {
        color: #005cb8
    }

    .policy {
        display: inline-block;
        width: 100%;
        padding: 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .policy-box {
        float: left;
        display: inline-block;
        padding: 0;
        width: 31.3%;
        margin-left: 1%;
        margin-right: 1%;
        margin-top: 5%;
        margin-bottom: 5%
    }

    .policy-box div {
        height: 100px;
        display: block;
        position: relative
    }

    .policy-box div img {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .policy-box h1 {
        font-size: 16px;
        line-height: 26px;
        font-weight: 600;
        color: #000;
        margin-top: 20px
    }

    .policy-box h1 span {
        color: #005cb8;
        line-height: 26px
    }

    .policy-box p {
        font-size: 14px;
        line-height: 26px;
        margin-top: 10px;
        color: #666
    }

    .certi {
        display: inline-block;
        margin-top: 50px;
        padding: 0 0 150px 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .certi-box {
        width: 18%;
        float: left;
        margin: 0 1%
    }

    .certi-box img {
        width: 100%
    }

    #section2 .contents {
        height: 80%
    }

    #section2 {
        height: 60% !important
    }

    #section2 .fp-tableCell {
        height: 60% !important
    }

    #section2 .tabs-nav {
        width: 100%
    }

    #section2 .tabs-nav:before {
        display: none
    }

    #section2 .tabs-nav li {
        margin: 0 1px;
        width: 24%
    }

    li.tab-active .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 p {
        color: #fff;
        line-height: 30px
    }

    li.tab-active .border-sic2 img {
        display: none
    }

    .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 p {
        color: #4d6b88;
        line-height: 30px
    }

    .border-sic2 img {
        display: none
    }

    #section2 .tabs-stage #tab-5 a {
        width: 23%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-5 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-5 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a {
        width: 31.3%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-6 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-5 a:nth-child(4) {
        margin-top: 0
    }

    #section3 .contents {
        height: auto;
        margin-top: 80px
    }

    .box-1 {
        width: 100%
    }

    .box-2 {
        width: 31.3%;
        margin-left: 1%;
        margin-right: 1%;
        height: 50%;
        margin-top: 1%
    }

    .box-2-line {
        display: block
    }

    .box-2 div {
        float: left
    }

    .box-2-miniimg {
        width: 100%
    }

    .box-2-text {
        width: 96%;
        min-height: 200px
    }

    .box-2-text h1 {
        font-size: 16px
    }

    .box-2-text p {
        font-size: 13px
    }

    .b-text {
        width: 100%;
        left: 0;
        bottom: 0;
        position: absolute;
        background: rgba(0, 92, 184, .9);
        letter-spacing: -.9px
    }

    .b-text h1 {
        font-size: 34px;
        line-height: 30px;
        font-weight: 500;
        padding: 40px 30px 0 40px;
        text-align: left;
        color: #fff
    }

    .b-text p {
        font-size: 18px;
        line-height: 18px;
        font-weight: 500;
        padding: 20px 30px 40px 40px;
        text-align: left;
        color: #fff
    }

    #section3 .bx-wrapper .bx-pager {
        top: -80px;
        left: 50%;
        transform: translate(-60%);
        bottom: auto;
        position: absolute
    }

    #section3 .bx-wrapper .bx-controls-auto {
        bottom: auto;
        left: 68%;
        transform: translate(-20%);
        position: absolute;
        margin-lefT: 0;
        top: -40px
    }

    #section4 {
        height: 400px
    }

    #section4 .map-location {
        position: absolute;
        background: rgba(0, 92, 185, .9);
        width: 640px;
        margin-right: 40px;
        height: 378px;
        left: -640px;
        top: 50%;
        transform: translate(0, -45%);
        z-index: 3;
        cursor: pointer;
        transition: all .6s
    }

    .map-menu {
        width: 84%;
        margin: 5% 8%;
        display: inline-block
    }

    .map-info {
        left: 635px;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img2.png) no-repeat
    }

    .map-active {
        left: 635px;
        display: none;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img.png) no-repeat
    }

    .map-on {
        left: 0 !important;
        background: rgba(0, 92, 185, .9)
    }

    .mid-adr-box ul {
        margin-left: 30px
    }

    .conte p {
        font-size: 13px
    }

    .conte p span {
        font-size: 13px
    }

    .mid-adr {
        width: 100%
    }

    .loex-t {
        width: 30%;
        font-size: 24px;
        line-height: 150px
    }

    .mid-adr-box {
        width: 70%
    }

    .mid-adr-box ul {
        height: 75px;
        width: 100%
    }

    .mid-adr-box ul li {
        line-height: 75px;
        font-size: 18px
    }

    .mid-adr-box ul:nth-child(1) li {
        line-height: 25px;
        padding-top: 50px
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(1) {
        line-height: 25px
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(2) {
        width: 70%;
        padding-left: 35px;
        line-height: 25px;
        text-align: left
    }

    #section5 .brochure {
        margin-left: 1%;
        margin-right: 1%;
        margin-bottom: 30%;
        float: right
    }

    .family-body {
        width: 100%;
        height: 100%
    }

    #section5 .footer .ft-logo {
        margin-left: 20px
    }

    #section5 .footer .info p {
        margin-left: -30px
    }

    .right-box {
        margin-top: 20px;
        display: inline-block
    }

    #section5 .popup {
        position: absolute;
        display: none;
        right: 0;
        top: 100%;
        background: #fff;
        z-index: -1;
        width: 100%;
        height: 100%;
        padding-top: 81px;
        transition: all .6s
    }

    .view-cont-5 {
        display: none;
        z-index: 11
    }

    .view-cont-5 h1 {
        font-size: 30px;
        margin-top: 15%
    }

    .ft-pop {
        height: 60%;
        overflow-y: scroll;
        text-align: left;
        width: 96%;
        margin: 0 auto;
        margin-top: 5%;
        margin-left: 2%;
        margin-right: 2%
    }

    #section5 .popup .close-btn {
        position: absolute;
        top: 25%;
        right: 5%;
        cursor: pointer;
        z-index: 3
    }

    #section5 .popup .close-btn img {
        width: 70%
    }

    #section3 {
        height: auto !important
    }

    .sec-slider {
        width: 100%;
        margin: 0 auto
    }

    #section3 .fp-slidesNav {
        top: 120px;
        margin: 0 auto;
        margin-left: -30px;
        transform: translate(-50%);
        position: absolute;
        padding-top: 0
    }

    .slide-control {
        top: 120px;
        margin-left: 75px;
        transform: translate(-50%);
        padding-top: 0
    }
}

@media screen and (max-width:1024px) {
    .cont-slider .sec-slider li {
        padding: 40px
    }

    .cont-slider .sec-slider li .slide-box>div {
        width: 49% !important;
        margin-left: 0;
        margin-bottom: 2%
    }

    .cont-slider .sec-slider li .slide-box>div:nth-child(2n) {
        margin-left: 2%
    }

    .box-2-miniimg {
        height: 200px
    }

    .b-text h1 {
        font-size: 25px !important
    }

    .b-text p {
        font-size: 14px !important
    }
}

@media screen and (max-width:767px) {
    .cont-slider .sec-slider li .slide-box>div {
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 10px
    }

    .cont-slider .sec-slider li .slide-box>div.box-2 {
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 10px;
        height: auto
    }

    .cont-slider .sec-slider li .slide-box>div:nth-child(2n) {
        margin-left: 0
    }

    .box-2-text {
        margin-top: 30px
    }
}

@media all and (min-width:767px) and (max-width:1023px) {
    #home-news {
        font-size: 46px;
        line-height: 30px
    }

    #menu {
        display: none
    }

    #section0 {
        position: relative
    }

    .sc-tit span {
        font-size: 15px
    }

    #section1 .tabs {
        height: 60%
    }

    #section1 {
        height: 60% !important
    }

    #section1 .fp-tableCell {
        height: 60% !important
    }

    #section1 .tabs-nav li {
        width: 40%;
        margin-bottom: 5%;
        height: 50%
    }

    .view-text {
        top: 20px;
        left: 20px
    }

    .view-text h1 {
        font-size: 20px;
        line-height: 34px;
        font-weight: 600;
        text-align: left;
        color: #fff;
        margin-bottom: 15px
    }

    .view-text p {
        font-size: 13px;
        line-height: 20px;
        font-weight: 300;
        text-align: left;
        color: #fff;
        margin-bottom: 5px
    }

    .view-3 .view-text p {
        width: 90%
    }

    #section1 .popup {
        height: 92%
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1-body {
        background: 0 0;
        height: 85%;
        overflow-y: scroll;
        border-top: 1px solid #eaeaea;
        border-bottom: 1px solid #eaeaea
    }

    #section1 .popup .close-btn {
        right: 20px
    }

    #section1 .popup .close-btn img {
        width: 50%
    }

    .greeting {
        width: 98%;
        margin-left: 1%;
        margin-right: 1%;
        height: 70%
    }

    .view-cont-1-cont {
        width: 100%
    }

    #section1 .view-cont-1-cont {
        width: 96%;
        margin-left: 2%;
        margin-right: 2%
    }

    .view-cont-1-cont {
        display: inline-block;
        text-align: left;
        z-index: 2;
        position: relative
    }

    .view-cont-1-cont h1 {
        font-size: 16px;
        font-weight: 500;
        line-height: 45px;
        text-align: center;
        color: #222;
        margin-bottom: 40px;
        margin-top: 10px
    }

    .view-cont-1-cont h1 span {
        font-size: 26px;
        line-height: 28px;
        font-weight: 500;
        color: #005cb8
    }

    .view-cont-1-cont p {
        font-size: 14px;
        line-height: 28px;
        color: #666;
        text-align: center;
        margin-bottom: 40px
    }

    .view-cont-1-sign {
        font-size: 14px;
        line-height: 20px;
        float: right !important
    }

    .view-cont-1-sign img {
        vertical-align: middle;
        margin-left: 20px
    }

    .view-cont-1-img {
        position: relative;
        width: 100%;
        right: 0;
        display: inline-block;
        z-index: 1;
        right: 0
    }

    .view-cont-1-img img {
        width: 100%
    }

    .view-cont-1-title2 h1 {
        font-size: 20px;
        line-height: 52px;
        color: #333;
        font-weight: 400
    }

    .view-cont-1-title2 h1 span {
        font-size: 26px;
        line-height: 46px;
        color: #005cb8;
        font-weight: 500
    }

    .view-cont-1-title2 p {
        font-size: 16px;
        line-height: 50px;
        color: #333
    }

    .view-cont-1-title2 h3 {
        margin-top: 30px;
        line-height: 26px;
        font-size: 14px;
        color: #666
    }

    .view-cont-1-title2 h3 span {
        line-height: 26px;
        font-size: 16px;
        color: #000
    }

    .history {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: inline-block
    }

    .history div {
        position: relative;
        float: left
    }

    .his-box1 {
        width: 48%;
        margin-left: 1%;
        margin-right: 1%;
        overflow: hidden;
        text-align: left
    }

    .his-box2 {
        width: 48%;
        overflow: hidden;
        text-align: left;
        margin-bottom: 15px
    }

    .his-box3 {
        width: 48%;
        overflow: hidden;
        text-align: left
    }

    .history div h3 {
        padding-left: 30px;
        font-size: 20px;
        line-height: 30px;
        margin-top: 15px;
        font-weight: 600
    }

    .history div p {
        padding-left: 30px;
        font-size: 16px;
        color: #222;
        line-height: 26px
    }

    .his-box-title1 {
        width: 100%;
        height: 47px;
        background: #00aff2;
        border-radius: 10px
    }

    .his-box-title1 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 25px
    }

    .his-box1 h3 {
        color: #00aff2;
        padding-left: 25px
    }

    .his-box1 p {
        padding-left: 25px
    }

    .his-box-title2 {
        width: 100%;
        height: 47px;
        background: #0085d5;
        border-radius: 10px
    }

    .his-box-title2 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box2 h3 {
        color: #0085d5
    }

    .his-box-title3 {
        width: 100%;
        height: 47px;
        background: #005cb8;
        border-radius: 10px
    }

    .his-box-title3 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box3 h3 {
        color: #005cb8
    }

    .policy {
        display: inline-block;
        width: 100%;
        padding: 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .policy-box {
        float: left;
        display: inline-block;
        padding: 0;
        width: 31.3%;
        margin-left: 1%;
        margin-right: 1%;
        margin-top: 5%;
        margin-bottom: 5%
    }

    .policy-box div {
        height: 100px;
        display: block;
        position: relative
    }

    .policy-box div img {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .policy-box h1 {
        font-size: 16px;
        line-height: 26px;
        font-weight: 600;
        color: #000;
        margin-top: 20px
    }

    .policy-box h1 span {
        color: #005cb8;
        line-height: 26px
    }

    .policy-box p {
        font-size: 14px;
        line-height: 26px;
        margin-top: 10px;
        color: #666
    }

    .certi {
        display: inline-block;
        margin-top: 50px;
        padding: 0 0 150px 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .certi-box {
        width: 48%;
        float: left;
        margin: 0 1%;
        margin-bottom: 5%
    }

    #section2 .contents {
        height: 80%
    }

    #section2 {
        height: 60% !important
    }

    #section2 .fp-tableCell {
        height: 60% !important
    }

    #section2 .tabs-nav {
        width: 100%
    }

    #section2 .tabs-nav:before {
        display: none
    }

    #section2 .tabs-nav li {
        margin: 0 1px;
        width: 24%
    }

    li.tab-active .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 p {
        color: #fff;
        line-height: 30px
    }

    li.tab-active .border-sic2 img {
        display: none
    }

    .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 p {
        color: #4d6b88;
        line-height: 30px
    }

    .border-sic2 img {
        display: none
    }

    #section2 .tabs-stage #tab-5 a {
        width: 23%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-5 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-5 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a {
        width: 31.3%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-6 a img {
        width: 180px
    }

    #section2 .tabs-stage #tab-6 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section3 .contents {
        height: auto;
        margin-top: 80px
    }

    .box-1 {
        width: 100%
    }

    .box-2 {
        width: 31.3%;
        margin-left: 1%;
        margin-right: 1%;
        height: 50%;
        margin-top: 1%
    }

    .box-2-line {
        display: block
    }

    .box-2 div {
        float: left
    }

    .box-2-miniimg {
        width: 100%
    }

    .box-2-text {
        width: 96%;
        min-height: 200px
    }

    .box-2-text h1 {
        font-size: 16px
    }

    .box-2-text p {
        font-size: 13px
    }

    .b-text {
        width: 100%;
        left: 0;
        bottom: 0;
        position: absolute;
        background: rgba(0, 92, 184, .9);
        letter-spacing: -.9px
    }

    .b-text h1 {
        font-size: 32px;
        line-height: 30px;
        font-weight: 500;
        padding: 40px 30px 0 40px;
        text-align: left;
        color: #fff
    }

    .b-text p {
        font-size: 17px;
        line-height: 18px;
        font-weight: 500;
        padding: 20px 30px 40px 40px;
        text-align: left;
        color: #fff
    }

    #section3 .bx-wrapper .bx-pager {
        top: -80px;
        left: 50%;
        transform: translate(-60%);
        bottom: auto;
        position: absolute
    }

    #section3 .bx-wrapper .bx-controls-auto {
        bottom: auto;
        left: 68%;
        transform: translate(-20%);
        position: absolute;
        margin-lefT: 0;
        top: -40px
    }

    #section4 {
        height: 400px
    }

    #section4 .map-location {
        position: absolute;
        background: rgba(0, 92, 185, .9);
        width: 640px;
        margin-right: 40px;
        height: 378px;
        left: -640px;
        top: 50%;
        transform: translate(0, -45%);
        z-index: 3;
        cursor: pointer;
        transition: all .6s
    }

    .map-menu {
        width: 84%;
        margin: 5% 8%;
        display: inline-block
    }

    .map-info {
        left: 635px;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img2.png) no-repeat
    }

    .map-active {
        left: 635px;
        display: none;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img.png) no-repeat
    }

    .map-on {
        left: 0 !important;
        background: rgba(0, 92, 185, .9)
    }

    .mid-adr-box ul {
        margin-left: 30px
    }

    .conte p {
        font-size: 13px
    }

    .conte p span {
        font-size: 13px
    }

    .mid-adr {
        width: 100%
    }

    .loex-t {
        width: 30%;
        font-size: 24px;
        line-height: 150px
    }

    .mid-adr-box {
        width: 70%
    }

    .mid-adr-box ul {
        height: 75px;
        width: 100%
    }

    .mid-adr-box ul li {
        line-height: 75px;
        font-size: 18px
    }

    .mid-adr-box ul:nth-child(1) li {
        line-height: 25px;
        padding-top: 50px
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(1) {
        line-height: 25px
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(2) {
        width: 70%;
        padding-left: 35px;
        line-height: 25px;
        text-align: left
    }

    #section5 .brochure {
        margin-left: 1%;
        margin-right: 1%;
        margin-bottom: 30%;
        float: right
    }

    .family-body {
        width: 100%;
        height: 100%
    }

    #section5 .footer {
        width: 94%;
        padding-left: 3%;
        padding-right: 3%
    }

    #section5 .footer .info {
        padding-left: 0
    }

    .right-box {
        margin-top: 20px;
        float: left !important;
        display: inline-block
    }

    #section5 .popup {
        position: absolute;
        display: none;
        right: 0;
        top: 100%;
        background: #fff;
        z-index: -1;
        width: 100%;
        height: 100%;
        padding-top: 81px;
        transition: all .6s
    }

    .view-cont-5 {
        display: none;
        z-index: 11
    }

    .view-cont-5 h1 {
        font-size: 26px;
        margin-top: 15%
    }

    .ft-pop {
        height: 60%;
        overflow-y: scroll;
        text-align: left;
        width: 96%;
        margin: 0 auto;
        margin-top: 5%;
        margin-left: 2%;
        margin-right: 2%
    }

    #section5 .popup .close-btn {
        position: absolute;
        top: 22%;
        right: 5%;
        cursor: pointer;
        z-index: 3
    }

    #section5 .popup .close-btn img {
        width: 70%
    }

    #section3 {
        height: auto !important
    }

    .sec-slider {
        width: 100%;
        margin: 0 auto
    }

    #section3 .fp-slidesNav {
        top: 150px;
        margin: 0 auto;
        margin-left: -30px;
        transform: translate(-50%);
        position: absolute;
        padding-top: 0
    }

    .slide-control {
        top: 150px;
        margin-left: 75px;
        transform: translate(-50%);
        padding-top: 0
    }
}

@media all and (min-width:601px) and (max-width:767px) {
    #home-news {
        font-size: 36px;
        line-height: 30px
    }

    #menu {
        display: none
    }

    #section0 {
        position: relative
    }

    .sc-tit span {
        font-size: 15px
    }

    #section1 .tabs-nav li {
        margin: 0 1% 1% 1%;
        width: 48%;
        float: left;
        height: 50%
    }

    .view-text {
        top: 20px;
        left: 20px
    }

    .view-text h1 {
        font-size: 20px;
        line-height: 34px;
        font-weight: 600;
        text-align: left;
        color: #fff;
        margin-bottom: 15px
    }

    .view-text p {
        font-size: 13px;
        line-height: 20px;
        font-weight: 300;
        text-align: left;
        color: #fff;
        margin-bottom: 5px
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1-body {
        background: 0 0;
        height: 85%;
        overflow-y: scroll;
        border-top: 1px solid #eaeaea;
        border-bottom: 1px solid #eaeaea
    }

    #section1 .popup .close-btn {
        right: 20px
    }

    #section1 .popup .close-btn img {
        width: 50%
    }

    .greeting {
        width: 98%;
        margin-left: 1%;
        margin-right: 1%;
        height: 70%
    }

    .view-cont-1-cont {
        width: 100%
    }

    .view-cont-1-cont {
        display: inline-block;
        text-align: left;
        z-index: 2;
        position: relative
    }

    .view-cont-1-cont h1 {
        font-size: 16px;
        font-weight: 500;
        line-height: 45px;
        text-align: center;
        color: #222;
        margin-bottom: 40px;
        margin-top: 10px
    }

    .view-cont-1-cont h1 span {
        font-size: 26px;
        line-height: 28px;
        font-weight: 500;
        color: #005cb8
    }

    .view-cont-1-cont p {
        font-size: 14px;
        line-height: 28px;
        color: #666;
        text-align: center;
        margin-bottom: 40px
    }

    .view-cont-1-sign {
        font-size: 14px;
        line-height: 20px;
        float: right !important
    }

    .view-cont-1-sign img {
        vertical-align: middle;
        margin-left: 20px
    }

    .view-cont-1-img {
        position: relative;
        width: 100%;
        right: 0;
        display: inline-block;
        z-index: 1;
        right: 0
    }

    .view-cont-1-img img {
        width: 100%
    }

    .view-cont-1-title2 h1 {
        font-size: 20px;
        line-height: 52px;
        color: #333;
        font-weight: 400
    }

    .view-cont-1-title2 h1 span {
        font-size: 26px;
        line-height: 46px;
        color: #005cb8;
        font-weight: 500
    }

    .view-cont-1-title2 p {
        font-size: 16px;
        line-height: 50px;
        color: #333
    }

    .view-cont-1-title2 h3 {
        margin-top: 30px;
        line-height: 26px;
        font-size: 14px;
        color: #666
    }

    .view-cont-1-title2 h3 span {
        line-height: 26px;
        font-size: 16px;
        color: #000
    }

    .history {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: inline-block
    }

    .history div {
        position: relative;
        float: left
    }

    .his-box1 {
        width: 48%;
        margin-left: 1%;
        margin-right: 1%;
        overflow: hidden;
        text-align: left
    }

    .his-box2 {
        width: 48%;
        overflow: hidden;
        text-align: left;
        margin-bottom: 15px
    }

    .his-box3 {
        width: 48%;
        overflow: hidden;
        text-align: left
    }

    .history div h3 {
        padding-left: 30px;
        font-size: 20px;
        line-height: 30px;
        margin-top: 15px;
        font-weight: 600
    }

    .history div p {
        padding-left: 30px;
        font-size: 16px;
        color: #222;
        line-height: 26px
    }

    .his-box-title1 {
        width: 100%;
        height: 47px;
        background: #00aff2;
        border-radius: 10px
    }

    .his-box-title1 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 25px
    }

    .his-box1 h3 {
        color: #00aff2;
        padding-left: 25px
    }

    .his-box1 p {
        padding-left: 25px
    }

    .his-box-title2 {
        width: 100%;
        height: 47px;
        background: #0085d5;
        border-radius: 10px
    }

    .his-box-title2 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box2 h3 {
        color: #0085d5
    }

    .his-box-title3 {
        width: 100%;
        height: 47px;
        background: #005cb8;
        border-radius: 10px
    }

    .his-box-title3 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box3 h3 {
        color: #005cb8
    }

    .policy {
        display: inline-block;
        width: 100%;
        padding: 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .policy-box {
        float: left;
        display: inline-block;
        padding: 0;
        width: 48%
    }

    .policy-box div {
        height: 100px;
        display: block;
        position: relative
    }

    .policy-box div img {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .policy-box h1 {
        font-size: 16px;
        line-height: 26px;
        font-weight: 600;
        color: #000;
        margin-top: 20px
    }

    .policy-box h1 span {
        color: #005cb8;
        line-height: 26px
    }

    .policy-box p {
        font-size: 14px;
        line-height: 26px;
        margin-top: 10px;
        color: #666
    }

    .certi {
        display: inline-block;
        margin-top: 50px;
        padding: 0 0 150px 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .certi-box {
        width: 36%;
        float: left;
        margin: 0 7%;
        margin-bottom: 7%
    }

    #section2 .contents {
        height: 80%
    }

    #section2 {
        height: 60% !important
    }

    #section2 .fp-tableCell {
        height: 60% !important
    }

    #section2 .tabs-nav {
        width: 100%
    }

    #section2 .tabs-nav:before {
        display: none
    }

    #section2 .tabs-nav li {
        margin: 0 1px;
        width: 24%
    }

    li.tab-active .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 p {
        color: #fff;
        line-height: 30px
    }

    li.tab-active .border-sic2 img {
        display: none
    }

    .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 p {
        color: #4d6b88;
        line-height: 30px
    }

    .border-sic2 img {
        display: none
    }

    #section2 .tabs-stage #tab-5 a {
        width: 40%;
        margin: 0 5% 5% 5%;
        float: left
    }

    #section2 .tabs-stage #tab-5 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-5 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a {
        width: 31.3%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-6 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section3 .contents {
        height: auto;
        margin-top: 80px
    }

    .box-1 {
        width: 100%
    }

    .box-2 {
        width: 100%;
        height: 50%;
        margin-top: 1%
    }

    .box-2-line {
        display: none
    }

    .box-2 div {
        float: left
    }

    .box-2-miniimg {
        width: 30%
    }

    .box-2-miniimg img {
        width: 40%
    }

    .box-2-text {
        width: 70%
    }

    .box-2-text h1 {
        font-size: 16px
    }

    .box-2-text p {
        font-size: 13px
    }

    .b-text {
        width: 100%;
        left: 0;
        bottom: 0;
        position: absolute;
        background: rgba(0, 92, 184, .9);
        letter-spacing: -.9px
    }

    .b-text h1 {
        font-size: 30px;
        line-height: 30px;
        font-weight: 500;
        padding: 30px 30px 0 40px;
        text-align: left;
        color: #fff
    }

    .b-text p {
        font-size: 16px;
        line-height: 18px;
        font-weight: 500;
        padding: 20px 30px 30px 40px;
        text-align: left;
        color: #fff
    }

    #section3 .bx-wrapper .bx-pager {
        top: -80px;
        left: 50%;
        transform: translate(-60%);
        bottom: auto;
        position: absolute
    }

    #section3 .bx-wrapper .bx-controls-auto {
        left: 68%;
        transform: translate(-20%);
        bottom: auto;
        position: absolute;
        margin-lefT: 0;
        top: -40px
    }

    #section4 {
        height: 400px
    }

    #section4 .map-location {
        position: absolute;
        background: rgba(0, 92, 185, .9);
        width: 500px;
        margin-right: 40px;
        height: 378px;
        left: -500px;
        top: 50%;
        transform: translate(0, -45%);
        z-index: 3;
        cursor: pointer;
        transition: all .6s
    }

    .map-menu {
        width: 84%;
        margin: 5% 8%;
        display: inline-block
    }

    .map-info {
        left: 495px;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img2.png) no-repeat
    }

    .map-active {
        left: 495px;
        display: none;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img.png) no-repeat
    }

    .map-on {
        left: 0 !important;
        background: rgba(0, 92, 185, .9)
    }

    .mid-adr-box ul {
        margin-left: 30px
    }

    .conte p {
        font-size: 13px
    }

    .conte p span {
        font-size: 13px
    }

    .mid-adr {
        width: 100%
    }

    .loex-t {
        width: 30%;
        font-size: 20px;
        line-height: 150px
    }

    .mid-adr-box {
        width: 70%
    }

    .mid-adr-box ul {
        height: 75px;
        width: 100%
    }

    .mid-adr-box ul li {
        line-height: 70px;
        font-size: 14px
    }

    .mid-adr-box ul:nth-child(1) li {
        line-height: 25px;
        padding-top: 50px
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(1) {
        line-height: 25px
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(2) {
        width: 70%;
        padding-left: 35px;
        line-height: 25px;
        text-align: left
    }

    #section5 .brochure {
        margin-left: 1%;
        margin-right: 1%;
        margin-bottom: 40%
    }

    .family-body {
        width: 100%;
        height: 100%
    }

    #section5 .footer {
        width: 94%;
        padding-left: 3%;
        padding-right: 3%
    }

    #section5 .footer .info {
        padding-left: 0
    }

    .right-box {
        margin-top: 20px;
        float: left !important;
        display: inline-block
    }

    #section5 .popup {
        position: absolute;
        display: none;
        right: 0;
        top: 100%;
        background: #fff;
        z-index: -1;
        width: 100%;
        height: 100%;
        padding-top: 81px;
        transition: all .6s
    }

    .view-cont-5 {
        display: none;
        z-index: 11
    }

    .view-cont-5 h1 {
        font-size: 20px;
        margin-top: 15%
    }

    .ft-pop {
        height: 60%;
        overflow-y: scroll;
        text-align: left;
        width: 96%;
        margin: 0 auto;
        margin-top: 5%;
        margin-left: 2%;
        margin-right: 2%
    }

    #section5 .popup .close-btn {
        position: absolute;
        top: 130px;
        right: 1%;
        cursor: pointer;
        z-index: 3
    }

    #section5 .popup .close-btn img {
        width: 50%
    }

    #section3 {
        height: auto !important
    }

    .sec-slider {
        width: 100%;
        margin: 0 auto
    }

    #section3 .fp-slidesNav {
        top: 150px;
        margin: 0 auto;
        margin-left: -30px;
        transform: translate(-50%);
        position: absolute;
        padding-top: 0
    }

    .slide-control {
        top: 150px;
        margin-left: 75px;
        transform: translate(-50%);
        padding-top: 0
    }
}

@media all and (min-width:481px) and (max-width:600px) {
    #home-news {
        font-size: 26px;
        line-height: 30px
    }

    #menu {
        display: none
    }

    #section0 {
        position: relative
    }

    .sc-tit span {
        font-size: 15px
    }

    #section1 .tabs-nav li {
        margin: 0 1% 1% 1%;
        width: 48%;
        float: left;
        height: 50%
    }

    .view-1 .view-text p {
        width: 70%;
        line-height: 20px
    }

    .view-2 .view-text p {
        width: 70%;
        line-height: 40px
    }

    .view-3 .view-text p {
        width: 80%;
        line-height: 40px
    }

    .view-4 .view-text p {
        width: 80%;
        line-height: 40px
    }

    .view-text {
        top: 20px;
        left: 20px
    }

    .view-text h1 {
        font-size: 20px;
        line-height: 34px;
        font-weight: 600;
        text-align: left;
        color: #fff;
        margin-bottom: 15px
    }

    .view-text p {
        font-size: 13px;
        font-weight: 300;
        text-align: left;
        color: #fff;
        margin-bottom: 5px
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1-body {
        background: 0 0;
        height: 85%;
        overflow-y: scroll;
        border-top: 1px solid #eaeaea;
        border-bottom: 1px solid #eaeaea
    }

    #section1 .popup .close-btn {
        right: 20px
    }

    #section1 .popup .close-btn img {
        width: 50%
    }

    .greeting {
        width: 98%;
        margin-left: 1%;
        margin-right: 1%;
        text-align: center
    }

    .view-cont-1-cont {
        width: 100%
    }

    .view-cont-1-cont {
        display: inline-block;
        text-align: left;
        z-index: 2;
        position: relative
    }

    .view-cont-1-cont h1 {
        font-size: 16px;
        font-weight: 500;
        line-height: 45px;
        text-align: center;
        color: #222;
        margin-bottom: 40px;
        margin-top: 10px
    }

    .view-cont-1-cont h1 span {
        font-size: 26px;
        line-height: 28px;
        font-weight: 500;
        color: #005cb8
    }

    .view-cont-1-cont p {
        font-size: 14px;
        line-height: 28px;
        color: #666;
        text-align: center;
        margin-bottom: 40px
    }

    .view-cont-1-sign {
        font-size: 14px;
        line-height: 20px;
        float: right !important
    }

    .view-cont-1-sign img {
        vertical-align: middle;
        margin-left: 20px
    }

    .view-cont-1-img {
        position: relative;
        width: 100%;
        right: 0;
        display: inline-block;
        z-index: 1;
        right: 0
    }

    .view-cont-1-img img {
        width: 100%
    }

    .view-cont-1-title2 h1 {
        font-size: 20px;
        line-height: 52px;
        color: #333;
        font-weight: 400
    }

    .view-cont-1-title2 h1 span {
        font-size: 26px;
        line-height: 46px;
        color: #005cb8;
        font-weight: 500
    }

    .view-cont-1-title2 p {
        font-size: 16px;
        line-height: 50px;
        color: #333
    }

    .view-cont-1-title2 h3 {
        margin-top: 30px;
        line-height: 26px;
        font-size: 14px;
        color: #666
    }

    .view-cont-1-title2 h3 span {
        line-height: 26px;
        font-size: 16px;
        color: #000
    }

    .history {
        width: 100%;
        margin: 0 auto;
        position: relative;
        display: inline-block
    }

    .history div {
        position: relative;
        float: left
    }

    .his-box1 {
        width: 48%;
        margin-left: 1%;
        margin-right: 1%;
        overflow: hidden;
        text-align: left
    }

    .his-box2 {
        width: 48%;
        overflow: hidden;
        text-align: left;
        margin-bottom: 15px
    }

    .his-box3 {
        width: 48%;
        overflow: hidden;
        text-align: left
    }

    .history div h3 {
        padding-left: 30px;
        font-size: 20px;
        line-height: 30px;
        margin-top: 15px;
        font-weight: 600
    }

    .history div p {
        padding-left: 30px;
        font-size: 16px;
        color: #222;
        line-height: 26px
    }

    .his-box-title1 {
        width: 100%;
        height: 47px;
        background: #00aff2;
        border-radius: 10px
    }

    .his-box-title1 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 25px
    }

    .his-box1 h3 {
        color: #00aff2;
        padding-left: 25px
    }

    .his-box1 p {
        padding-left: 25px
    }

    .his-box-title2 {
        width: 100%;
        height: 47px;
        background: #0085d5;
        border-radius: 10px
    }

    .his-box-title2 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box2 h3 {
        color: #0085d5
    }

    .his-box-title3 {
        width: 100%;
        height: 47px;
        background: #005cb8;
        border-radius: 10px
    }

    .his-box-title3 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box3 h3 {
        color: #005cb8
    }

    .policy {
        display: inline-block;
        width: 100%;
        padding: 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .policy-box {
        float: left;
        display: inline-block;
        padding: 0;
        width: 48%
    }

    .policy-box div {
        height: 100px;
        display: block;
        position: relative
    }

    .policy-box div img {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .policy-box h1 {
        font-size: 16px;
        line-height: 26px;
        font-weight: 600;
        color: #000;
        margin-top: 20px
    }

    .policy-box h1 span {
        color: #005cb8;
        line-height: 26px
    }

    .policy-box p {
        font-size: 14px;
        line-height: 26px;
        margin-top: 10px;
        color: #666
    }

    .certi {
        display: inline-block;
        margin-top: 50px;
        padding: 0 0 150px 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .certi-box {
        width: 48%;
        float: left;
        margin: 0 1%
    }

    .certi-box img {
        width: 100%
    }

    #section2 .tabs-nav {
        width: 100%
    }

    #section2 .tabs-nav:before {
        display: none
    }

    #section2 .tabs-nav li {
        margin: 0 1px;
        width: 48%
    }

    li.tab-active .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 p {
        color: #fff;
        line-height: 30px
    }

    li.tab-active .border-sic2 img {
        display: none
    }

    .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 p {
        color: #4d6b88;
        line-height: 30px
    }

    .border-sic2 img {
        display: none
    }

    #section2 .tabs-stage #tab-5 a {
        width: 48%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-5 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-5 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a {
        width: 31.3%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-6 p img {
        width: 45%
    }

    #section2 .tabs-stage #tab-6 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section3 .contents {
        height: auto;
        margin-top: 80px
    }

    .box-1 {
        width: 100%
    }

    .box-2 {
        width: 100%;
        height: 50%;
        margin-top: 1%
    }

    .box-2-line {
        display: none
    }

    .box-2 div {
        float: left
    }

    .box-2-miniimg {
        width: 30%
    }

    .box-2-miniimg img {
        width: 40%
    }

    .box-2-text {
        width: 70%
    }

    .box-2-text h1 {
        font-size: 16px
    }

    .box-2-text p {
        font-size: 13px
    }

    .b-text {
        width: 100%;
        left: 0;
        bottom: 0;
        position: absolute;
        background: rgba(0, 92, 184, .9);
        letter-spacing: -.9px
    }

    .b-text h1 {
        font-size: 28px;
        line-height: 30px;
        font-weight: 500;
        padding: 30px 30px 0 40px;
        text-align: left;
        color: #fff
    }

    .b-text p {
        font-size: 16px;
        line-height: 18px;
        font-weight: 500;
        padding: 20px 30px 30px 40px;
        text-align: left;
        color: #fff
    }

    #section3 .bx-wrapper .bx-pager {
        top: -80px;
        left: 50%;
        transform: translate(-60%);
        position: absolute;
        bottom: auto
    }

    #section3 .bx-wrapper .bx-controls-auto {
        bottom: auto;
        left: 70%;
        transform: translate(-50%);
        position: absolute;
        margin-lefT: 0;
        top: -40px;
        bottom: auto
    }

    #section4 {
        height: 400px
    }

    #section4 .map-location {
        position: absolute;
        background: rgba(0, 92, 185, .9);
        width: 400px;
        margin-right: 40px;
        height: 378px;
        left: -400px;
        top: 50%;
        transform: translate(0, -45%);
        z-index: 3;
        cursor: pointer;
        transition: all .6s
    }

    .map-menu {
        width: 84%;
        margin: 5% 8%;
        display: inline-block
    }

    .map-info {
        left: 395px;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img2.png) no-repeat
    }

    .map-active {
        left: 395px;
        display: none;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img.png) no-repeat
    }

    .map-on {
        left: 0 !important;
        background: rgba(0, 92, 185, .9)
    }

    .conte p {
        font-size: 13px
    }

    .conte p span {
        font-size: 13px
    }

    .mid-adr-box {
        width: 100%
    }

    .mid-adr {
        width: 96%;
        margin-left: 2%;
        margin-right: 2%;
        padding: 20px 0;
        overflow: hidden
    }

    .loex-t {
        width: 100%;
        font-size: 16px;
        line-height: 40px;
        padding: 0;
        text-align: left
    }

    .mid-adr-box ul {
        padding-left: 0;
        width: 100%
    }

    .mid-adr-box ul li {
        line-height: 25px;
        font-size: 13px;
        text-align: left
    }

    .mid-adr-box ul li:nth-child(1) {
        width: 20%;
        line-height: 25px;
        padding-top: 0
    }

    .mid-adr-box ul li:nth-child(2) {
        width: 80%;
        line-height: 25px;
        padding-top: 0
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(2) {
        width: 80%;
        margin-top: 3px;
        line-height: 25px;
        text-align: left
    }

    #section5 .brochure {
        margin-left: 1%;
        margin-right: 1%;
        text-align: center;
        margin-bottom: 50%
    }

    #section5 .download-btn {
        margin-left: 22%
    }

    .family-body {
        width: 100%;
        height: 100%
    }

    #section5 .footer {
        width: 94%;
        padding-left: 3%;
        padding-right: 3%
    }

    #section5 .footer .info {
        padding-left: 0
    }

    .right-box {
        margin-top: 20px;
        float: left !important;
        display: inline-block
    }

    #section5 .popup {
        position: absolute;
        display: none;
        right: 0;
        top: 100%;
        background: #fff;
        z-index: -1;
        width: 100%;
        height: 100%;
        padding-top: 81px;
        transition: all .6s
    }

    .view-cont-5 {
        display: none;
        z-index: 11
    }

    .view-cont-5 h1 {
        font-size: 20px;
        margin-top: 15%
    }

    .ft-pop {
        height: 60%;
        overflow-y: scroll;
        text-align: left;
        width: 96%;
        margin: 0 auto;
        margin-top: 5%;
        margin-left: 2%;
        margin-right: 2%
    }

    #section5 .popup .close-btn {
        position: absolute;
        top: 130px;
        right: 1%;
        cursor: pointer;
        z-index: 3
    }

    #section5 .popup .close-btn img {
        width: 50%
    }

    #section3 {
        height: auto !important
    }

    .sec-slider {
        width: 100%;
        margin: 0 auto
    }

    #section3 .fp-slidesNav {
        top: 150px;
        margin: 0 auto;
        margin-left: -30px;
        transform: translate(-50%);
        position: absolute;
        padding-top: 0
    }

    .slide-control {
        top: 150px;
        margin-left: 75px;
        transform: translate(-50%);
        padding-top: 0
    }
}

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

    .home_header span,
    .home_header strong {
        line-height: 34px
    }

    #section4 .contents {
        height: 575px
    }

    #section1 .sc-tit {
        padding-top: 40px
    }

    #section3 .sc-tit {
        padding-top: 40px
    }

    .fp-tableCell {
        display: block;
        height: auto !important
    }

    .fp-slidesNav {
        top: 70%
    }

    #section0 .fp-slidesNav.bottom {
        top: 70%
    }

    #home-news {
        font-size: 26px;
        line-height: 30px
    }

    #menu {
        display: none
    }

    #section0 {
        position: relative
    }

    .sc-tit {
        font-size: 15px
    }

    .sc-tit span {
        font-size: 18px;
        margin-top: 15px;
        width: 90%;
        margin-left: 5%;
        margin-right: 5%
    }

    #section1 {
        height: 85% !important
    }

    #section1 .fp-tableCell {
        height: 85% !important;
        padding-bottom: 40px
    }

    #section1 .tabs-nav li {
        margin: 0 1% 2% 1%;
        width: 48%;
        float: left;
        height: 50%
    }

    .view-1 .view-text p {
        width: 80%;
        line-height: 20px
    }

    .view-2 .view-text p {
        width: 80%;
        line-height: 20px
    }

    .view-3 .view-text p {
        width: 100%;
        line-height: 20px
    }

    .view-4 .view-text p {
        width: 100%;
        line-height: 20px
    }

    .view-text {
        top: 20px;
        left: 10px
    }

    .view-text h1 {
        font-size: 20px;
        line-height: 34px;
        font-weight: 600;
        text-align: left;
        color: #fff;
        margin-bottom: 15px
    }

    .view-text p {
        font-size: 12px;
        font-weight: 300;
        text-align: left;
        color: #fff;
        margin-bottom: 5px
    }

    .view-cont-1 {
        position: fixed
    }

    .view-cont-1-body {
        background: 0 0;
        height: 85%;
        overflow-y: scroll;
        border-top: 1px solid #eaeaea;
        border-bottom: 1px solid #eaeaea
    }

    #section1 .popup .close-btn {
        right: 20px
    }

    #section1 .popup .close-btn img {
        width: 50%
    }

    #section1 .popup {
        height: 90%
    }

    .greeting {
        width: 98%;
        margin-left: 1%;
        margin-right: 1%
    }

    .view-cont-1-cont {
        width: 100%
    }

    .view-cont-1-title {
        border-bottom: 3px solid #005cb8;
        line-height: 50px
    }

    .view-cont-1-cont {
        display: inline-block;
        z-index: 2;
        position: relative
    }

    .view-cont-1-cont h1 {
        font-size: 16px;
        font-weight: 500;
        line-height: 45px;
        color: #222;
        margin-bottom: 40px;
        margin-top: 10px;
        text-align: center
    }

    .view-cont-1-cont h1 span {
        font-size: 26px;
        line-height: 28px;
        font-weight: 500;
        color: #005cb8
    }

    .view-cont-1-cont p {
        font-size: 14px;
        line-height: 28px;
        color: #666;
        margin-bottom: 40px;
        text-align: center
    }

    .view-cont-1-sign {
        font-size: 14px;
        line-height: 20px;
        float: right !important
    }

    .view-cont-1-sign img {
        vertical-align: middle;
        margin-left: 20px
    }

    .view-cont-1-img {
        position: relative;
        width: 100%;
        right: 0;
        display: inline-block;
        z-index: 1;
        right: 0
    }

    .view-cont-1-img img {
        width: 100%
    }

    #section1 .tabs-nav:before {
        display: none
    }

    .view-cont-1-title2 h1 {
        font-size: 20px;
        line-height: 52px;
        color: #333;
        font-weight: 400
    }

    .view-cont-1-title2 h1 span {
        font-size: 26px;
        line-height: 46px;
        color: #005cb8;
        font-weight: 500
    }

    .view-cont-1-title2 p {
        font-size: 16px;
        line-height: 50px;
        color: #333
    }

    .view-cont-1-title2 h3 {
        margin-top: 30px;
        line-height: 26px;
        font-size: 14px;
        color: #666
    }

    .view-cont-1-title2 h3 span {
        line-height: 26px;
        font-size: 16px;
        color: #000
    }

    .history {
        width: 98%;
        margin: 0 auto;
        position: relative;
        display: inline-block
    }

    .history div {
        position: relative;
        float: left
    }

    .his-box1 {
        width: 100%;
        margin-left: 1%;
        margin-right: 1%;
        overflow: hidden;
        text-align: left;
        margin-bottom: 20px
    }

    .his-box2 {
        width: 100%;
        overflow: hidden;
        text-align: left;
        margin-bottom: 20px
    }

    .his-box3 {
        width: 100%;
        overflow: hidden;
        text-align: left
    }

    .history div h3 {
        padding-left: 30px;
        font-size: 18px;
        line-height: 30px;
        margin-top: 15px;
        font-weight: 600
    }

    .history div p {
        padding-left: 30px;
        font-size: 14px;
        color: #222;
        line-height: 26px
    }

    .his-box-title1 {
        width: 100%;
        height: 47px;
        background: #00aff2;
        border-radius: 10px
    }

    .his-box-title1 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 25px
    }

    .his-box1 h3 {
        color: #00aff2;
        padding-left: 25px
    }

    .his-box1 p {
        padding-left: 25px
    }

    .his-box-title2 {
        width: 100%;
        height: 47px;
        background: #0085d5;
        border-radius: 10px
    }

    .his-box-title2 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box2 h3 {
        color: #0085d5
    }

    .his-box-title3 {
        width: 100%;
        height: 47px;
        background: #005cb8;
        border-radius: 10px
    }

    .his-box-title3 span {
        line-height: 47px;
        display: block;
        text-align: left;
        color: #fff;
        padding-left: 30px
    }

    .his-box3 h3 {
        color: #005cb8
    }

    .policy {
        display: inline-block;
        width: 100%;
        padding: 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .policy-box {
        float: left;
        display: inline-block;
        padding: 0;
        width: 98%;
        margin-top: 20px
    }

    .policy-box div {
        height: 100px;
        display: block;
        position: relative
    }

    .policy-box div img {
        position: absolute;
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        margin: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
    }

    .policy-box h1 {
        font-size: 16px;
        line-height: 26px;
        font-weight: 600;
        color: #000;
        margin-top: 20px
    }

    .policy-box h1 span {
        color: #005cb8;
        line-height: 26px
    }

    .policy-box p {
        font-size: 14px;
        line-height: 26px;
        margin-top: 10px;
        color: #666
    }

    .certi {
        display: inline-block;
        margin-top: 50px;
        padding: 0 0 150px 0;
        background: url(../../images/policy-bg.png) center no-repeat
    }

    .certi-box {
        width: 48%;
        float: left;
        margin: 0 1%
    }

    .certi-box img {
        width: 100%
    }

    #section2 .tabs-nav {
        width: 100%
    }

    #section2 .tabs-nav:before {
        display: none
    }

    #section2 .tabs-nav li {
        margin: 0 1px;
        width: 48%
    }

    li.tab-active .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    li.tab-active .border-sic2 p {
        color: #fff;
        line-height: 30px
    }

    li.tab-active .border-sic2 img {
        display: none
    }

    .border-sic2 {
        width: 100%;
        height: 40px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 span {
        width: 95%;
        height: 30px;
        margin: 4px;
        border-radius: 30px 30px 30px 30px
    }

    .border-sic2 p {
        color: #4d6b88;
        line-height: 30px
    }

    .border-sic2 img {
        display: none
    }

    #section2 .tabs-stage #tab-5 a {
        width: 48%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-5 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-5 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a {
        width: 31.3%;
        margin: 0 1% 1% 1%;
        float: left
    }

    #section2 .tabs-stage #tab-6 a:hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 a:nth-child(2n):hover {
        margin-top: 0
    }

    #section2 .tabs-stage #tab-6 p img {
        max-width: 100%
    }

    #section3 .contents {
        height: auto;
        margin-top: 80px
    }

    .box-1 {
        width: 100%
    }

    .box-2 {
        width: 98%;
        height: 50%;
        margin-top: 1%;
        margin-left: 1%;
        margin-right: 1%
    }

    .box-2-line {
        display: none
    }

    .box-2 div {
        float: left
    }

    .box-2-miniimg {
        width: 30%;
        height: 150px
    }

    .box-2-miniimg img {
        width: 40%
    }

    .box-2-text {
        width: 70%;
        margin-top: 10px
    }

    .box-2-text h1 {
        font-size: 16px;
        text-align: left;
        margin-bottom: 5px;
        margin-top: 10px
    }

    .box-2-text p {
        font-size: 13px;
        margin-bottom: 10px;
        text-align: left;
        margin-left: 0
    }

    .b-text {
        width: 100%;
        left: 0;
        bottom: 0;
        position: absolute;
        background: rgba(0, 92, 184, .9);
        letter-spacing: -.9px
    }

    .b-text h1 {
        font-size: 20px;
        line-height: 30px;
        font-weight: 500;
        padding: 20px 30px 0 30px;
        text-align: left;
        color: #fff
    }

    .b-text p {
        font-size: 13px;
        line-height: 18px;
        font-weight: 500;
        padding: 10px 30px 20px 30px;
        text-align: left;
        color: #fff
    }

    #section3 .bx-wrapper .bx-pager {
        top: -80px;
        bottom: auto;
        left: 40%;
        transform: translate(-40%);
        position: absolute
    }

    #section3 .bx-wrapper .bx-controls-auto {
        bottom: auto;
        left: 70%;
        transform: translate(-20%);
        position: absolute;
        margin-lefT: 0;
        top: -40px
    }

    #section4 {
        height: 400px
    }

    #section4 .map-location {
        position: absolute;
        background: rgba(0, 92, 185, .9);
        width: 300px;
        margin-right: 40px;
        height: 378px;
        left: -300px;
        top: 50%;
        transform: translate(0, -45%);
        z-index: 3;
        cursor: pointer;
        transition: all .6s
    }

    .map-menu {
        width: 84%;
        margin: 5% 8%;
        display: inline-block
    }

    .map-menu li {
        display: block;
        width: 48%;
        float: left;
        margin-left: 1%;
        margin-bottom: 1%;
        border: 1px solid #fff;
        color: #fff;
        font-size: 16px;
        font-weight: 300;
        height: 40px;
        line-height: 40px
    }

    .map-menu li.active {
        color: #005cb9;
        background: #fff
    }

    .map-info {
        left: 295px;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img2.png) no-repeat
    }

    .map-active {
        left: 295px;
        display: none;
        position: absolute;
        width: 40px;
        height: 378px;
        background: url(../../images/map-img.png) no-repeat
    }

    .map-on {
        left: 0 !important;
        background: rgba(0, 92, 185, .9)
    }

    .mid-adr-box {
        width: 100%
    }

    .mid-adr {
        width: 96%;
        margin-left: 2%;
        margin-right: 2%;
        padding: 20px 0;
        overflow: hidden
    }

    .loex-t {
        width: 100%;
        font-size: 16px;
        line-height: 40px;
        padding: 0;
        text-align: left
    }

    .mid-adr-box ul {
        padding-left: 0;
        width: 100%
    }

    .mid-adr-box ul li {
        line-height: 25px;
        font-size: 13px;
        text-align: left
    }

    .mid-adr-box ul li:nth-child(1) {
        width: 20%;
        line-height: 25px;
        padding-top: 0
    }

    .mid-adr-box ul li:nth-child(2) {
        width: 80%;
        line-height: 25px;
        padding-top: 0
    }

    .mid-adr-box ul:nth-child(2) li:nth-child(2) {
        width: 80%;
        margin-top: 3px;
        line-height: 25px;
        text-align: left
    }

    .wrap_btn_roadview {
        margin-right: 5%
    }

    .conte p {
        font-size: 13px
    }

    .conte p span {
        font-size: 13px
    }

    #section5 .right-box .video-go {
        width: 46%;
        margin-left: 0;
        padding: 5px 10px;
        background: url(../../images/video-icon2.png) red no-repeat center right 10px
    }

    .opened {
        width: 45%
    }

    #section5 .brochure {
        margin-left: 1%;
        margin-right: 1%;
        text-align: center;
        padding: 150px 0;
        margin-bottom: 0
    }

    #section5 .download-btn {
        margin: 0 auto;
        text-align: center;
        display: table;
        margin-top: 30px
    }

    #section5 .brochure h1 {
        font-size: 1.5rem
    }

    #section5 .brochure h1 img {
        width: 60%
    }

    #section5 .download-btn a {
        float: none;
        margin: 0 auto;
        position: relative;
        display: table-cell
    }

    #section5 .download-btn a span {
        color: #005cb8;
        font-weight: 400
    }

    #section4 .root_daum_roughmap {
        width: 100% !important
    }

    .menu-button {
        right: 0;
        width: 45%
    }

    .nav-box {
        right: 0
    }

    .family {
        position: absolute;
        right: 0;
        opacity: 1;
        height: 300px;
        display: none;
        overflow: hidden;
        margin-bottom: 30px;
        display: block;
        background: #201e1e;
        z-index: -1;
        border-bottom: 1px solid #666;
        width: 210px;
        transition: all .6s
    }

    .family a {
        display: block;
        text-align: center;
        color: #aaa;
        font-size: 14px;
        line-height: 28px;
        font-weight: 300
    }

    .fbody {
        overflow-y: scroll;
        position: relative
    }

    .family a:hover {
        color: #ddd !important
    }

    #section5 .footer {
        width: 94%;
        padding-left: 3%;
        padding-right: 3%
    }

    #section5 .footer .info {
        padding-left: 0
    }

    .right-box {
        margin-top: 20px;
        width: 100%;
        float: left !important;
        display: inline-block
    }

    #section4 .sc-tit {
        margin-top: 0
    }

    #section5 .popup {
        position: absolute;
        display: none;
        right: 0;
        top: 100%;
        background: #fff;
        z-index: -1;
        width: 100%;
        height: 100%;
        padding-top: 81px;
        transition: all .6s
    }

    .view-cont-5 {
        display: none;
        z-index: 11
    }

    .view-cont-5 h1 {
        font-size: 20px;
        margin-top: 15%
    }

    .ft-pop {
        height: 60%;
        overflow-y: scroll;
        text-align: left;
        width: 96%;
        margin: 0 auto;
        margin-top: 5%;
        margin-left: 2%;
        margin-right: 2%
    }

    #section5 .popup .close-btn {
        position: absolute;
        top: 130px;
        right: 1%;
        cursor: pointer;
        z-index: 3
    }

    #section5 .popup .close-btn img {
        width: 50%
    }

    #section3 {
        height: auto !important
    }

    .sec-slider {
        width: 100%;
        margin: 0 auto
    }

    #section3 .fp-slidesNav {
        top: 180px;
        margin: 0 auto;
        margin-left: -30px;
        transform: translate(-50%);
        position: absolute;
        padding-top: 0
    }

    .slide-control {
        top: 180px;
        margin-left: 75px;
        transform: translate(-50%);
        padding-top: 0
    }
}

/* 250520 */
.newPop {
    z-index: 999999;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    box-sizing: border-box;
}
.newPop .lpop-body img {
    vertical-align: top;
}
.newPop .lpop-foot {
    width: 100%;
    height: 50px;
    background-color: #015cb9;
    color: #fff;
    display: flex;
    justify-content: end;
    align-items: center;
    box-sizing: border-box;
    padding-right: 20px;
}
.newPop .lpop-foot input {
    width: unset;
}
.newPop .lpop-foot label {
    padding-left: 7px;
}
.newPop .new-close {
    padding: 5px 7px;
    color: #fff;
    border: 1px solid #fff;
    margin-left: 10px;
    background: #015cb9;
}
@media screen and (max-width: 1280px) {
    .newPop { width: 100%; padding: 0 10px; top: 8%;}
    .newPop .lpop-body img { width: 100%; height: 100%; object-fit: cover;}
}
@media screen and (max-width: 580px) {
    .newPop { width: 100%; padding: 0 10px; top: 5%;}
    .newPop .lpop-foot label { font-size: 12px;}
    .newPop .new-close { font-size: 12px;}
    .newPop .lpop-foot {height: 40px;line-height: 40px;}
}