@charset "utf-8";
/*
	Common Layout CSS _ 15.05.18
*/

/*common*/


.inner {
    max-width: 1400px;
    width: 100%;
    position: relative;
    margin: 0 auto;
}

.pdinner {
    max-width: 1400px;
    padding: 0 3%;
    position: relative;
    margin: 0 auto;
}

.ofh {
    overflow: hidden;
}

.tit_h3 {
    font-size: 28px;
    font-weight: 400;
    color: #323232;
    position: relative;
    letter-spacing: -1px
}

.tit_h3:after {
    content: '';
    width: 60px;
    height: 1px;
    display: block;
    background: #505050;
    margin: 0 auto;
    margin-top: 20px;
}

.tit_h4 {
    font-size: 26px;
    color: #323232;
    font-weight: bold;
    letter-spacing: -1px
}

.tit_h5 {
    color: #323232;
    font-weight: bold;
    font-size: 18px;
}

.tit_h4.noLine:after {
    width: 0;
    height: 0px;
    margin-top: 0px;
}


.mEnter {
    display: block;
}

.mb {
    margin-bottom: 30px !important
}

.pb {
    padding-bottom: 30px;
}

.bmb {
    margin-bottom: 40px !important
}

.mb10 {
    margin-bottom: 10px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}


.tac {
    text-align: center;
}

.tal {
    text-align: left;
}

.tar {
    text-align: right;
}

.mo_only {
    display: block;
}

.move_scroll {
    max-width: 768px;
    overflow-x: auto
}

.line_link {
    display: inline-block;
    color: #ffffff;
    padding-bottom: 5px;
    border-bottom: 3px solid #ffffff;
    font-size: 0.9em
}

.line_btn {
    overflow: hidden;
}

.line_btn li {
    width: 100%;
    margin-bottom: 10px;
}

.line_btn li a {
    display: block;
    border: 1px solid #ffffff;
    padding: 5px;
    text-align: center;
    font-size: 0.8em
}

.line_btn li:last-child {
    margin: 0;
}

.arrow_cir_w:after {
    content: '';
    width: 28px;
    height: 25px;
    background: url(/img/ic_arrow_w.png) no-repeat center center;
    background-size: 100%;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}

.dpib {
    display: inline-block
}

.dpb {
    display: block;
}

.upper {
    text-transform: uppercase
}

.fwb {
    font-weight: 500
}

.fss {
    font-size: 0.9em
}

.Tblack {
    color: #323232
}

.Tred {
    color: #e83428
}

.ylTxt {
    color: #fff94e;
}

.grTxt {
    color: #11ae4b
}

.orgTxt {
    color: #ff4f0a
}

.ppTxt {
    color: #767ba5
}

.upcase {
    text-transform: uppercase
}

.btn_more {
    display: inline-block;
    color: #ffffff;
    background: #2b4771;
    padding: 6px 20px;
    border-radius: 500px
}

@media all and (min-width: 768px) {


    .tit_h4 {
        font-size: 30px;
        letter-spacing: -1px
    }

    .tit_h5 {
        font-size: 20px;
        letter-spacing: -1px
    }


    .mb {
        margin-bottom: 45px !important;
    }

    .pb {
        padding-bottom: 45px;
    }

    .bmb {
        margin-bottom: 60px !important;
    }

    .mo_only {
        display: none;
    }

    .move_scroll {
        max-width: 100%;
    }

    .pdinner {
        padding: 0 3%
    }

    .half {
        width: 47.5%;
        float: left;
    }

    .mr {
        margin-right: 3%;
    }

    .line_btn li {
        width: 47.5%;
        float: left;
        margin-right: 3%;
    }

    .line_btn li:last-child {
        margin: 0
    }

    .line_btn li a {
        padding: 8px
    }

    .mEnter {
        display: inline-block;
    }

    .tEnter {
        display: block;
    }
}

@media all and (min-width: 1200px) {

    body, html {
        font-size: 16px;
    }

    .mEnter {
        display: inline-block;
    }

    .tEnter {
        display: inline-block;
    }

    .pEnter {
        display: block;
    }

    .tit_h3:after {
        margin-top: 25px;
    }

    .tit_h4 {
        font-size: 30px;
    }

    .tit_h5 {
        font-size: 20px;
    }


    .mb {
        margin-bottom: 50px !important
    }

    .pb {
        padding-bottom: 50px;
    }

    .bmb {
        margin-bottom: 80px !important
    }

    .pdinner {
        padding: 0 20px
    }


}

@media all and (min-width: 1400px) {
    /*body, html{font-size:17px;}*/

}

/*owl 컨트롤러 css변경*/
.owl-controls {
    width: 100%;
    margin: 0 auto;
}

/*owl pagenation css변경 */
.page_btn .owl-page span {
    width: 20px !important;
    height: 20px !important;
    background: none !important;
    border: 4px solid #ffffff;
    border-radius: 20px;
    opacity: 0.7
}

.page_btn .owl-page.active span {
    opacity: 1;
}

.page_btn2 .owl-page span {
    width: 5px !important;
    height: 5px !important;
    background: #808080 !important;
    border-radius: 20px;
    position: relative;
    opacity: 1 !important;
    margin: 0 20px !important;
}

.page_btn2 .owl-page.active span:before {
    content: '';
    width: 30px;
    height: 30px;
    position: absolute;
    margin-left: -16px;
    left: 50%;
    margin-top: -16px;
    top: 50%;
    border: 1px solid #808080;
    border-radius: 200px;
}

/*owl navigation css변경*/
.owl-theme .owl-controls {
    position: relative
}

.arrow_btn .owl-buttons {
    position: absolute;
    width: 100%;
    top: -250px;
}

.arrow_btn .owl-buttons div {
    position: absolute;
    font-family: 'FontAwesome';
    text-indent: -999999px;
    background: none !important;
    padding: 0px !important;
    margin: 0px !important;
}

.arrow_btn .owl-buttons div:first-child {
    left: 2%;
}

.arrow_btn .owl-buttons div:last-child {
    right: 2%;
}

.arrow_btn .owl-buttons div.owl-prev:after,
.arrow_btn .owl-buttons div.owl-next:after {
    content: '\f104';
    font-family: 'FontAwesome';
    position: absolute;
    left: 0;
    top: 0;
    text-indent: 0 !important;
    font-size: 3em;
}

.arrow_btn .owl-buttons div.owl-next:after {
    content: '\f105';
    right: 0;
    left: auto;
}

.pop_page_btn {
    position: relative;
}

.pop_page_btn .owl-controls {
    position: absolute;
    bottom: 0px;
    text-align: right !important
}

.pop_page_btn .owl-pagination {
    display: inline-block;
    padding: 1px 10px;
    border-radius: 500px;
    height: 22px;
}

.pop_page_btn .owl-controls .owl-page span {
    width: 10px !important;
    height: 10px !important;
    background: #505050 !important;
    margin: 2px 4px !important
}

.pop_page_btn .owl-controls .active span {
    background: #8c000a !important
}

@media all and (min-width: 1200px) {
    .arrow_btn .owl-buttons div:first-child {
        left: -10%;
    }

    .arrow_btn .owl-buttons div:last-child {
        right: -10%;
    }

    .arrow_btn .owl-buttons div.owl-prev:after,
    .arrow_btn .owl-buttons div.owl-next:after {
        font-size: 50px;
    }
}


/* ==== Slider Image Transition === */
@-webkit-keyframes ProgressDots {
    from {
        width: 0px;
    }
    to {
        width: 100%;
    }
}

@keyframes ProgressDots {
    from {
        width: 0px;
    }
    to {
        width: 100%;
    }
}

@keyframes zoomout {
    0% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1.0);
    }
}

@-webkit-keyframes zoomout {
    0% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1.0);
    }
}

@-webkit-keyframes scaling {
    From {
        -webkit-transform: scale(1.1);
    }
    To {
        -webkit-transform: scale(1.0);
    }
}


/* ==== Slick Slider Css Ruls === */
.slick-slider {
    position: relative;
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: hand
}

.slick-slider .slick-track, .slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block
}

.slick-track:before, .slick-track:after {
    display: table;
    content: ''
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    display: none;
    float: left /* If RTL Make This Right */;
    height: 100%
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto; /*border:1px solid transparent*/
}


/* Arrows */
.slick-arrow {
    position: absolute;
    z-index: 100;
    top: 0;
    display: block;
    width: 50px;
    height: 50px;
    border: 0;
    cursor: pointer;
    background: rgba(0,0,0,0.7);
    text-indent: -999999px;
    /*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/
}

.slick-arrow:before {
    text-indent: 0;
    content: '';
    display: block;
    position: absolute;
    background-size: 100% !important;
    font-weight: normal;
    color: #000000;
    width: 25px;
    height: 25px;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    font-weight: 600
}

.slick-arrow:before {
    background: url(/img/slick_prev2.png) no-repeat center center
}

.slick-next {
    right: 0;
}

.slick-next:before {
    background: url(/img/slick_next2.png) no-repeat center center
}

/* Circle Arrows */
.cir-arrow .slick-arrow {
    position: absolute;
    top: 50%;
    z-index: 100;
    display: block;
    width: 50px;
    height: 50px;
    border: 0;
    cursor: pointer;
    background: none;
    border: 2px solid #ffffff;
    border-radius: 500px;
    text-indent: -999999px;
    /*	-webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);*/
}

.cir-arrow .slick-arrow:before {
    text-indent: 0;
    content: '';
    display: block;
    position: absolute;
    width: 16px;
    height: 16px;
    line-height: 20px;
    background-size: 100% !important;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    font-weight: 600
}

.cir-arrow .slick-arrow:before {
    background: url(/img/slick_prev.png) no-repeat center center
}

.cir-arrow .slick-arrow.slick-next {
    right: 0;
}

.cir-arrow .slick-arrow.slick-next:before {
    background: url(/img/slick_next.png) no-repeat center center
}

/*line-Dots*/
.slick-dots {
    position: absolute;
    bottom: 10%;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    text-align: center;
    z-index: 10
}

.slick-dots li {
    position: relative;
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
    vertical-align: middle;
    transition:0.5s;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 500px;
    padding: 0px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: none;
    border: 0px;
    opacity: 0.5;
    background: rgba(244,244,244,0.5);
}
.slick-dots li.slick-active{
    width: 50px !important ;}

.slick-dots li.slick-active button {
    background: rgba(244,244,244,1);
}


/*pop_dot*/
.pop_dot .slick-dots {
    position: absolute;
    bottom: 10%;
    right: 20px;
    display: inline-block;
    padding: 5px;
    line-height: 100%;
    width: auto;
    background: rgba(0, 0, 0, 0.5);
    text-align: center;
    z-index: 10
}

.pop_dot .slick-dots li {
    position: relative;
    display: inline-block;
    width: 13px;
    height: 13px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer;
    vertical-align: middle;
}

.pop_dot .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 500px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: none;
    background: #ffffff;
    opacity: 0.5
}

.pop_dot .slick-dots li.slick-active button {
    background: #fcc754;
    opacity: 1
}


/*slick_dot*/
.slickdot .slick-dots {
    position: absolute;
    display: inline-block;
    line-height: 100%;
    width: auto;
    text-align: center;
    z-index: 10
}

.slickdot .slick-dots li {
    position: relative;
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 3px;
    padding: 0;
    cursor: pointer;
    vertical-align: middle;
}

.slickdot .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 500px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: none;
    background: #c8c8c8;
    opacity: 1
}

.slickdot .slick-dots li.slick-active button {
    background: #000000;
    opacity: 1
}


/*slick_circle_arrow*/

.slick_circle_arrow button {
    position: absolute;
    top: auto;
    bottom: 10px;
    right: 20px;
    background: none;
    border: 1px solid #ffffff;
    border-radius: 500px;
    border-color: rgba(255, 255, 255, 0.5)
}

.slick_circle_arrow button:before {
    color: #ffffff;
}

.slick_circle_arrow button.slick-prev {
    margin-right: 60px
}


/**/
.wrap {
    max-width: 2000px;
    min-width: 320px;
    width: 100%;
    margin: 0 auto;
    position: relative;
}


.mainvisual {
    position: relative;
    z-index: 0;
    margin: 0 auto;
    padding-top: 60px;
}
.mainvisual .slick-arrow{
    top: 50%;
    margin-top: -25px;
}
.main_info{
    background: #181d61;
    position: absolute;
    bottom: 0;
    z-index: 10;
    width: 100%;
    padding: 20px 10px;
    left: 0;
}
.main_info a{
    color: #fff;
    padding-right: 30px;
    display: inline-block;
    position: relative;
}
.plus{position: absolute;width: 22px;height: 22px;display: block;}

.plus:before, .plus:after{content:'';height:2px;width:22px;display:block;background:#fff;position:absolute;top: 10px;left:0px;}
.plus:after{height:22px;width:2px;top:0;left: 10px;}
.main_info a .plus{
    right: 4px;
    top: -1px;
    transform: scale(0.8);
}
.main_info .mark{position: absolute;top: 19px;right: 0px;width: 100px;right: 10px;}

.mainvisual:after {
    clear: both;
    display: block;
    content: '';
}

.visuslider .main {
    height: 625px;
    position: relative;
}

.visuslider .inner {
    height: 100%
}

.visuslider .main .txt {
    color: #ffffff;
    width: 100%;
    position: relative;
    position: absolute;
    height: 250px;
    top: 73px;
    /* bottom: 10%; */
    margin: auto;
    text-align: center;
    padding: 0 5%;
    z-index: 3;
}


.visuslider .main:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 20%;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%)
}

.visuslider .main .txt h2 span {
    display: block;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 20px;
    letter-spacing: 0
}

.visuslider .main .txt h2 {
    font-size: 1.1em;
    font-weight: 500;
    /*text-shadow:0px 5px 10px #323232*/
    margin-bottom: 0px;
    font-family: 'Montserrat';
    letter-spacing: 1px;
}

.visuslider .main .txt p {
    margin-bottom: 0px;
}
.visuslider .main .txt p.t1{
    font-size: 45px;
    font-weight: 600;
}
.visuslider .main .txt1 p.t1{
    font-size: 33px;
    font-weight: 600;
    line-height:1.2;
}
.visuslider .main .txt p em{font-style:italic;}
.visuslider .main .txt p.t2{
    font-size: 20px;
    font-weight: 300;
    letter-spacing: 0.5px;
}
.visuslider .main .txt1 p.t2{
    font-size: 18px;
}
.visuslider .main .txt p b {
    display: block
}

.visuslider .main:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background-size: cover !Important;
}

.visuslider .main.slick-active:before {
    /*transform: scale(1);
    transition: transform 2s;
    animation: zoomout 2s ease-in-out infinite alternate;
    -webkit-animation: zoomout 2s ease-in-out infinite alternate;
    animation-iteration-count: 1;
    -webkit-animation-iteration-count: 1;*/
}

.visuslider .main01:before {
    background: url(/img/main_vs01.jpg) no-repeat center center;
}

.visuslider .main02:before {
    background: url(/img/main_vs02.jpg) no-repeat center center;
}

.visuslider .main03:before {
    background: url(/img/main_vs03.jpg) no-repeat center center;
}

.visuslider .main04 {
    background: url(/img/main04.jpg) no-repeat center center;
}

.visuslider .main05 {
    background: url(/img/main05.jpg) no-repeat center center;
}

.visuslider .main06 {
    background: url(/img/main06.jpg) no-repeat center center;
}

.visuslider .main07 {
    background: url(/img/main07.jpg) no-repeat center center;
}

.visuslider .slick-dots {
    top: 205px;
    display: none !important;
}

.visuslider .slick-dots li {
    width: 12px;
    height: 13px;
    margin: 0 4px;
}

.visuslider .slick-dots li button {
    margin: 0 auto;
    opacity: 1
}

.mainvisual h1.tit {
    height: 0;
    opacity: 0
}

.visuslider .main_info {
    position: absolute;
    left: 0px;
    bottom: 0%;
    right: 0px;
    padding: 20px 10px;
    color: #ffffff;
    border-top: 1px solid #ffffff;
    border-color: rgba(255, 255, 255, 0.3)
}

.visuslider .main_info p {
    overflow: hidden;
    position: relative
}

.visuslider .main_info p .tit {
    display: block;
    font-size: 1.1em;
    font-weight: 500
}


.visuslider .main .txt,
.visuslider .main .txt h2,
.visuslider .main .txt p {
    /* transform: translateX(-50px); */
    /* opacity: 0; */
    /* transition: opacity 0s 3s, transform 0s 3s; */
}

.visuslider .main .txt p {
    /* transform: translateX(-50px);
 }

 .visuslider .main.slick-active .txt,
 .visuslider .main.slick-active .txt h2,
 .visuslider .main.slick-active .txt p {
     /* transform: translateX(0); */
    /* opacity: 1; */
    /* transition: opacity 2s, transform 2s; */
}

.visuslider .main.slick-active .txt p.t1 {
    transition-delay: 0.3s;
    transform: translateX(0px);
}
.visuslider .main.slick-active .txt p.t2 {
    transition-delay: 0.6s;
    transform: translateX(0px);
}
.visuslider .main.reset-animation {
    transform: translateX(-50px);
    opacity: 0;
    transition: all 0s;
}



.visuslider .main .product_img{
    width: 200px;
    position: absolute;
    top: 253px;
    left: 50%;
    margin-left: -100px;
    /* transform: translateY(50px); */
    /* opacity: 0; */
    /* transition: opacity 0s 3s, transform 0s 3s; */
    filter: drop-shadow(0px 0px 46px rgba(244,244,244,0.53));
}

.visuslider .main.slick-active .product_img {
    opacity:1;
    transition-delay: 0.3s;
    transform: translateY(0px);
    transition: opacity 2s, transform 2s;
}




.section02{
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
}
.section02 .svc{
    background: url(/img/main_bg1.png) no-repeat center;
    background-size: cover;
    color: #fff;
    /* height: 140px; */
    padding: 30px 20px;
}
.section02 .svc .tlt{
    font-size: 1.8em;
    font-weight: bold;
}
.section02 .txt{
    letter-spacing: -0.1px;
}
.section02 .cs_row{
}
.section02 .half{
    width: 100%;
    float: none;
    text-align: left;
    padding: 40px 30px;
}
.section02 .notice{
    background: #282828;
    position:relative;
}
.section02 .notice .plus{
    top: 42px;
    right: 30px;
}
.section02 .notice li{
    border-bottom: 1px solid rgba(244,244,244,0.3);
    padding: 10px 0;
    color: #fff;
}
.section02 .notice li:after{
    display:block;
    clear:both;
    content:"";
}
.section02 .notice li a{color:#fff;display: inline-block;width: calc(100% - 90px);overflow: hidden;white-space: nowrap;text-overflow: ellipsis;float: left;letter-spacing: -0.2px;}
.section02 .notice li span{color:#fff;display: inline-block;float: right;letter-spacing: 1px;}
.section02 .contact{
    background: url(/img/main_bg2.png) no-repeat center;
    background-size: cover;
    color: #fff;
}
.section02 .cs_row .tlt{
    font-family: 'Montserrat';
    color: #fff;
    font-size: 24px;
    font-weight: 600;
}
.section02 .contact .num{
    font-family: 'Montserrat';
    font-weight: 600;
    font-size: 40px;
    margin-top: 10px;
    margin-bottom: 15px;
}
.section02 .contact .info{}
.section02 .contact .info li{
    line-height: 1.5;
    letter-spacing: 0.5px;
}
.section02 .contact .info li b{
    font-family: 'Montserrat';
    font-size: 14px;
    font-weight: 600;
    display: inline-block;
    width: 67px;
}
.section02 .contact .btn_box{
    margin-top: 15px;
}
.section02 .contact .btn_box li{
    display: inline-block;
}
.section02 .contact .btn_box li a{
    width: 124px;
    border: 1px solid #fff;
    display: block;
    text-align: center;
    height: 40px;
    line-height: 40px;
    margin-right: 6px;
}
.section01{
    padding-top: 30px;
    padding-bottom: 30px;
    /* background: url(/img/main_bg3.png) repeat; */
}
.p-vd{
    display: block;
    margin-bottom: 20px;
    text-align: center;
}
.main_tlt{
    font-family: 'Montserrat';
    text-transform: uppercase;
    text-align: center;
    font-size: 30px;
    font-weight: bold;
}
.main_txt{
    text-align: center;
    font-weight: 400;
    color: #666666;
    margin-bottom: 30px;
}
.slider_wrap{}
.product_nav{
    text-align: center;
    display: none;
}
.product_nav .nav{
    display: inline-block;
    font-weight: 500;
    color: #979797;
    padding: 0 10px;
}
.product_nav .nav{cursor:pointer;}
.product_nav .nav:focus{outline:none;}
.product_nav .nav.slick-current{color:#171c61;}
.product_slider{}
.product_slider .item{}
.inner_slider .slick-arrow{background:none; background:#000;}
.inner_slider .slick-arrow:before{
    background: url(/img/slick_prev2.png) no-repeat center center}
.inner_slider .slick-next:before{
    background: url(/img/slick_next2.png) no-repeat center center}
.inner_slider .slick-prev{
    left: 0px;
    top: 125px;
}
.inner_slider .slick-next{
    right: 0px;
    top: 125px;}
.inner_slider .pd{
    text-align: center;
    padding: 0 20px;
}
.inner_slider .pd:active{border:none; outline: none}
.inner_slider .pd:focus{border:none; outline: none}
.inner_slider .pd img{width:300px;}
.inner_slider .pd .pd_tlt{
    font-weight: bold;
    color: #717171;
    text-align: center;
}
.inner_slider .pd .pd_tlt span{
    font-size: 15px;
    display: block;
    /* font-family: 'Montserrat'; */
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 800;
    color: #1e1e1e;
    letter-spacing: -1px;
}
.inner_slider .pd .pd_txt{
    text-align: center;
    font-size: 14px;
}
.inner_slider .pd a{
    display: none;
    width: 53px;
    height: 53px;
    border: 2px solid #ccc;
    font-size: 0px;
    border-radius: 50%;
    position: relative;
    /* left: 50%; */
    /* margin-left: -26.5px; */
    /* bottom: 28px; */
}
.plus.more:before, .plus.more:after{
    background: #343434;
    top: 24px;
    left: 13px;
}
.plus.more:after{
    left: 23px;
    top: 14px;
}
.inner_slider .pd.slick-center a{display: inline-block;}

@media all and (min-width: 768px) {
    .visuslider .main {
    }

    .visuslider .slick-dots {
        top: 205px;
        display: block !important;
    }

    .visuslider .slick-dots li {
    }

    .visuslider .main .txt {
        top: 65px;
    }

    .visuslider .main .txt p {
        font-size: 1.2em
    }
    .visuslider .main .txt p.t1{
        font-size: 55px;
    }
    .visuslider .main .txt p.t1 br{display:none;}
    .visuslider .main .txt p.t2{font-size: 28px;}
    .visuslider .main .txt p b {
        display: inline
    }

    .visuslider .main .txt h2 {
    }

    .visuslider .main_info {
        width: 50%;
        left: 50%;
        border-top: 0;
        padding: 30px;
        font-size: 1.1em
    }

    .visuslider .main_info:before {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
        background: #2cadae;
        background: linear-gradient(90deg, #2cadae 0%, #62db92 100%);
        opacity: 0.9
    }

    .section02{
        /* margin-top: -60px; */
    }
    .section02 .svc{
        padding: 50px 20px;
    }
    .section02 .svc .tlt{
        font-size: 33px;
    }
    .section02 .tlt{
    }
    .section02 .cs_row .tlt{
        margin-bottom: 10px;
        font-size: 30px;
    }
    .section02 .txt{}
    .section02 .notice .plus{
        top: 61px;
        right: 49px;
    }
    .section02 .cs_row{}
    .section02 .cs_row:after{
        display:block;
        clear:both;
        content:"";
    }
    .section02 .half{
        width: 50%;
        float: left;
        height: 320px;
        padding: 58px 50px;
    }
    .section02 .notice{}
    .section02 .contact{}
    .section02 .contact .tlt{}
    .section02 .contact .num{
        margin-top: 20px;
    }
    .section02 .contact .info{}
    .section02 .contact .info li{}
    .section02 .contact .info li b{}
    .section02 .contact .btn_box{}
    .section02 .contact .btn_box li{}
    .section02 .contact .btn_box li a{}
    .section01{
        padding-top: 50px;
        padding-bottom: 100px;
        /* background: url(/img/main_bg3.png) repeat-x bottom; */
        height: 1077px;
        overflow: hidden;
        position: relative;
    }
    .p-vd{
    right: 50%;
    margin-right: -700px;
    text-align: right;
}
        .p-vd img{
    max-width: 351px;
    }
      #p-vd iframe{height:560px;}
    .main_tlt{
        font-family: 'Montserrat';
        text-transform: uppercase;
        text-align: center;
        font-size: 40px;
        font-weight: bold;
    }
    .main_txt{
        font-size: 17px;
        margin-bottom: 50px;
    }
    .product_nav{
        margin-bottom: 0px;
    }
    .product_nav .slick-track{
        text-align: center;
        width: 100% !important;
    }
    .product_nav .nav{
        padding: 0 20px;
        width: auto !important;
        display: inline-block;
        float: none;
    }
    .product_slider{}
    .product_slider .item{}
    .inner_slider .slick-track{
        /* padding-top: 34px; */
        height: 657px;
    }
    .inner_slider .pd{
        /* width: 348px; */
        opacity: 0.5;
        transition: 0.5s;
        /* padding-bottom: 100px; */
        position: relative;
        padding-top: 66px;
        transform: scale(0.6);
        padding: 0 0px;
    }
    .inner_slider .pd.slick-center{/* width:680px; */opacity: 1;padding-top: 0px;transform: scale(0.8);height: auto;}
    .inner_slider .pd img{width: auto;}
    .inner_slider .pd.slick-center img{width:auto;}
    .inner_slider .pd .pd_tlt{
        font-size: 17px;
        margin-top: 15px;
    }
    .inner_slider .pd.slick-center .pd_tlt{font-size: 26px;}
    .inner_slider .pd .pd_tlt span{
        font-size: 20px;
        margin-bottom: -5px;
    }
    .inner_slider .pd .pd_txt{
        font-size: 21px;
        margin-top: 5px;
        opacity:0; transition:0.3s;
    }
    .inner_slider .pd .pd_tlt{opacity: 0; transition:0.3s;}
    .inner_slider .pd.slick-center .pd_txt{opacity: 1;}
    .inner_slider .pd.slick-center .pd_tlt{opacity: 1;}
    .inner_slider .pd.slick-current.slick-active  .pd_tlt span{
        font-size: 37px;
    }
    .inner_slider .pd.slick-current.slick-active  .pd_txt{}
    .inner_slider .pd a{}
    .inner_slider .slick-next:before{
        background: url(/img/slick_next.png) no-repeat center center}.product_slider .item{}
    .inner_slider .slick-arrow{background:none; background:none;}
    .inner_slider .slick-arrow:before{
        background: url(/img/slick_prev.png) no-repeat center center}
    .inner_slider .slick-next:before{
        background: url(/img/slick_next.png) no-repeat center center}
    .inner_slider .slick-prev{
        left: 50%;
        margin-left: -318px;
        top: 220px;
    }
    .inner_slider .slick-next{
        right: 50%;
        margin-right: -318px;
        top: 220px;
    }


}

@media all and (min-width: 1200px) {
    .visusliderWrap{
        max-width: 1400px;
        margin: 0 auto;
        position: relative;
    }
    .mainvisual{
        padding-top: 130px;
    }
    .main_info{
        width: 50%;
        height: 84px;
        padding: 32px 40px;
    }
    .mainvisual .slick-arrow{
        top: auto;
        bottom: 0px;
        width: 84px;
        height: 84px;
        right: 85px;
    }
    .mainvisual .slick-next{
        right: 0px;
    }
    .main_info a{font-size: 17px;padding-right: 45px;}

    .visuslider .main {
        min-height: 600px;
        max-height: 600px;
    }
    .visuslider .main .txt{text-align:left;top: 233px;}
    .main_info a .plus{
        transform: scale(1);
        top: 1px;
        right: 0px;
    }
    .main_info .mark{
        width: auto;
        right: 40px;
        top: 24px;
    }
    .visuslider .main .product_img{
        width: 344px;
        top: 70px;
        right: 130px;
        left: auto;
    }
    .visuslider .main03 .product_img{
        right: 185px;
        top: 100px;
    }
    .visuslider .main .txt h2 {
        font-size: 16px;
    }
    .visuslider .main .txt p.t1{
        font-size: 61px;
    }
    .visuslider .main .txt h2 span {
        font-size: 20px
    }

    .visuslider .main_info {
        padding: 40px;
        font-size: 1.2em
    }

    .visuslider .main_info p .tit {
        font-size: 1.1em;
        display: inline;
        padding-right: 20px;
    }

    .visuslider .main .txt:after {
        width: 150px;
        height: 55px
    }

    .visuslider .slick-dots {
        text-align: left;
        top: 394px;
        left: 67px;
    }

    .visuslider .slick-dots li {
        /* margin: 30px auto */
    }

    .section02{
        /* margin-top: -130px; */
    }
    .section02 .svc{
        height: 200px;
        padding: 58px 20px;
    }
    .section02 .svc .tlt{
        font-size: 40px;
        margin-bottom: 2px;
    }
    .section02 .tlt{}
    .section02 .txt{
        font-size: 17px;
    }
    .section02 .cs_row{}
    .section02 .half{
        height: 400px;
    }
    .section02 .notice{
        padding: 65px;
    }
    .section02 .cs_row .tlt{font-size:36px;}
    .section02 .notice .plus{
        top: 85px;
        right: 80px;
    }
    .section02 .notice .list{border-top: 1px solid rgba(244,244,244,0.3);margin-top: 40px;}
    .section02 .notice li{
        padding: 20px 0;
    }
    .section02 .notice li a{font-size:17px;}
    .section02 .contact{
        padding: 65px;
    }
    .section02 .contact .tlt{
        margin-bottom: 42px;
    }
    .section02 .contact .num{
        font-size: 55px;
        margin-bottom: 30px;
    }
    .section02 .contact .info{
        width: 341px;
    }
    .section02 .contact .info:after{
        display:block;
        clear:both;
        content:"";
    }
    .section02 .contact .info li{
        float: left;
        width: 50%;
    }
    .section02 .contact .info li b{
        display: block;
        font-size: 17px;
    }
    .section02 .contact .btn_box{
        margin-top: 30px;
    }
    .section02 .contact .btn_box li{}
    .section02 .contact .btn_box li a{
        width: 183px;
        height: 58px;
        line-height: 54px;
        font-size: 17px;
        font-weight: 400;
        border: 2px solid #fff;
    }
    .slider_wrap{
        max-width: 1400px;
        margin: 0 auto;
    }
    .section01{
        padding-top: 70px;
        padding-bottom: 130px;
        height: 1150px;
    }
    .p-vd{
    top: -20px;
    right: 50%;
    margin-right: -700px;
    position: absolute;
    z-index: 988;
}
    .product_nav{
        display: block;
    }
    .product_nav .nav{
        font-size: 16px;
        position:relative;
    }
    .product_nav .nav:after{
        display:block;
        clear:both;
        content:"";
        width:1px;
        height:12px;
        background: #444;
        position: absolute;
        top: 8px;
        right: 0px;
    }
    .product_nav .nav:last-child:after{display:none;}
    .product_slider{}
    .product_slider .item{}
    .inner_slider .slick-track{
        height: 798px;
        /* padding-top: 50px; */
    }
    .inner_slider .pd{
        /* width: 348px; */
        opacity: 0.5;
        padding-top: 85px;
    }
    .inner_slider .pd.slick-center{/* width:680px; */opacity: 1;}
    .inner_slider .pd img{/* width:300px; */}
    .inner_slider .pd.slick-center img{width:auto;}
    .inner_slider .pd .pd_tlt{
        font-size: 17px;
    }
    .inner_slider .pd .pd_tlt span{
        font-size: 20px;
        margin-bottom: -5px;
    }
    .inner_slider .pd .pd_txt{
        font-size: 20px;
        margin-top: 2px;
    }
    .inner_slider .pd.slick-current.slick-active  .pd_tlt span{
        font-size: 35px;
    }
    .inner_slider .pd.slick-current.slick-active  .pd_txt{}
    .inner_slider .pd a{}

}

@media all and (min-width: 1400px) {
    .visuslider .main_info {
        padding: 50px
    }
}


/*공통*/
#footer{
    /* padding-top: 20px; */
    padding-bottom: 30px;
}
#footer .pdinner{
    border-top: 1px solid #ccc;
    padding-top: 20px;
}
#footer .pdinner:after{
    display:block;
    clear:both;
    content:"";
}

#footer .logo{
    display: none;
}
#footer .copy{
    letter-spacing: 0.2px;
    color: #222;
    font-weight: 300;
    margin-top: 10px;
    font-size: 14px;
    /* text-align: center; */
}
#footer .foot_li{
    /* text-align: center; */
    margin-top: 10px;
}
#footer .foot_li li{display:inline-block;font-size: 14px;margin-right: 10px;padding-right: 10px;position: relative;}
#footer .foot_li li a{
    color: #222;
}
#footer .foot_li li:after{
    display:block;
    clear:both;
    content:"";
    width:1px;
    height:10px;
    background: #444;
    position: absolute;
    top: 5px;
    right: -2px;
}
#footer .foot_li li:last-child:after{display:none;}
.foot_info{margin-top:10px;}
.foot_info .row{}
.foot_info .row span{
    color: #222;
    font-size: 14px;
    display: inline-block;
    margin-right: 10px;
    letter-spacing: -0.1px;
}


@media all and (min-width: 768px) {

}

@media all and (min-width: 1200px) {
    #footer{
        /* padding-top: 60px; */
        padding-bottom: 70px;
    }
    #footer .pdinner{padding-top:40px;}
    #footer .logo{display:block;}
    #footer .left{
        float: left;
    }
    #footer .right{
        float: right;
    }
    #footer .foot_li{
        margin-top: -5px;
        text-align: right;
    }
    #footer .foot_li li{
        margin-right: 0px;
        padding-right: 0px;
        margin-left: 10px;
        padding-left: 10px;
    }
    #footer .foot_li li:after{
        right: -13px;
    }
    #footer .copy{
        margin-top: 20px;
    }
    .foot_info .row{
        text-align: right;
    }
    .foot_info .row span{
        margin-right: 0px;
        margin-left: 10px;
    }
}






/*서브레이아웃*/
body.subWrap #header {
    box-shadow: none;
}

#sub_visual {
    position: relative;
    padding: 86px 0 32px;
    background: url(/img/sub_visual05.jpg) no-repeat center center;
    background-size: cover !important;
}

#sub_visual:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 100%;
    z-index: 0;
    background: linear-gradient(180deg, rgba(81, 100, 108, 0.4) 0%, rgba(0, 0, 0, 0) 100%)
}

#sub_visual.sub01 {
    background: url(/img/sub_visual01.jpg) no-repeat center center;
}

#sub_visual.sub02 {
    background: url(/img/sub_visual02.jpg) no-repeat center center;
}

#sub_visual.sub03 {
    background: url(/img/sub_visual03.jpg) no-repeat center center;
}

#sub_visual.sub04 {
    background: url(/img/sub_visual04.jpg) no-repeat center center;
}

#sub_visual.sub05 {
    background: url(/img/sub_visual05.jpg) no-repeat center center;
}

#sub_visual.sub10 {
    background: url(/img/sub_visual01.jpg) no-repeat center center;
}


#sub_visual {
    text-align: center;
}

#sub_visual .tit_h2 {
    color: #ffffff;
    font-weight: 700;
    font-size: 2em;
    margin-bottom: -1px;
}

#sub_visual .tit_h2 span {
    display: block;
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0;
    text-transform: uppercase;
    position: relative;
}

#sub_visual .tit_h2 b {
    display: block;
    line-height: 1.2
}

#sub_visual p {
    color: #ffffff;
    font-size: 0.9em
}

@media all and (min-width: 768px) {
    #sub_visual .tit_h2 {
        font-size: 2.3em;
    }

    #sub_visual p {
        font-size: 1em
    }

    #sub_visual .tit_h2 span:after {
        position: absolute;
        right: 0;
        top: 0;
        margin: 0
    }
}

@media all and (min-width: 1200px) {
    body.subWrap #header {
        border-bottom: 0px;
        background: #fff;
    }

    #sub_visual {
        margin-top: 0px
    }

    #sub_visual .tit_h2 {
        font-size: 2.8em;
    }


}


.subwrap {
    background: #ffffff;
    max-width: 1400px;
    margin: 0 auto;
    padding: 40px 3%;
    min-height: 400px;
}

.sub_con {
    margin: 0 auto;
    position: relative;
    min-height: 200px;
}

.sub_con:after {
    content: '';
    clear: both;
    display: block
}

.sub_con .con {
    padding: 0 3% 30px
}

.conh3 {
    font-size: 1.4em;
    font-weight: 500;
    color: #000000;
    text-align: center;
    position: relative
}

/*.conh3:after{content:''; display:block; width:40px; height:1px; background:#323232; position:absolute; bottom:0; left:0; right:0; margin:auto}*/


.path {
    display: block;
}

.path li {
    font-size: 12px;
    display: inline-block;
    vertical-align: top;
    color: #ffffff
}

.path li:before {
    content: '\f105';
    font-family: 'FontAwesome';
    display: inline-block;
    padding: 0px 10px
}

.path li:first-child:before {
    display: none;
}


.sub_title {
    padding: 20px 3%;
    border-bottom: 1px solid #e6e6e6;
    margin-bottom: 30px;
    position: relative;
    overflow: hidden
}

.sub_title ul {
    position: absolute;
    height: 30px;
    right: 3%;
    top: 0;
    bottom: 0;
    margin: auto;
}

.sub_title ul li {
    text-align: center;
    background: #15126e;
    border-radius: 500px;
    width: 30px;
    height: 30px;
    padding: 8px;
}

.sub_title ul li img {
}

.sub_title h3 {
    font-weight: 500;
    font-size: 1.4em;
    color: #000000
}

@media all and (min-width: 1200px) {
    .sub_title ul {
        right: 20px
    }

    .path li {
        font-size: 16px;
    }
}

/*레프트2차메뉴*/
#sidemenu {
    display: none;
    float: left; /*position:fixed;*/
    width: 260px;
    z-index: 10;
    top: auto;
}

/*기준*/
#sidemenu h2 {
    display: block;
    font-size: 1.5em;
    text-align: center;
    line-height: 1.2;
    color: #fff;
    min-height: 100px;
    padding: 42px 0; /*background:rgba(90,19,40,0.8);*/
    background: #004c7f;
    position: relative;
}

#sidemenu h2 span {
    display: block;
    font-size: 15px;
    margin-bottom: 10px;
    letter-spacing: 0;
}

#sidemenu .snblist {
    border: 1px solid #e6e6e6;
    border-width: 0 1px 1px;
    background: #ffffff
}

#sidemenu .snblist li > a {
    position: relative;
    display: block;
    padding: 17px 20px;
    font-weight: 400;
    border-bottom: 1px solid #e6e6e6;
    color: #323232;
    font-size: 1.05em
}

#sidemenu .snblist li:last-child > a {
    border-bottom: 0px;
}

#sidemenu .snblist li a[target='_blank']:after {
    font-family: 'FontAwesome';
    font-size: 11px;
    display: inline-block;
    content: "\f08e";
    margin: 0 0 2px 5px;
    vertical-align: middle;
}

#sidemenu .snblist li a:hover {
    text-indent: 5px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    color: #303030;
    transition: 0.3s
}

#sidemenu .snblist li a.active {
    color: #004c7f;
    font-weight: 500
}

#sidemenu .snblist li a.active:after {
    position: absolute;
    top: 43%;
    right: 10px;
    width: 7px;
    height: 7px;
    border-radius: 80px;
    background: #004c7f;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
    font-family: FontAwesome;
    content: "";
    font-style: normal;
    color: #808080
}

#sidemenu .snblist li a:hover i:after {
    right: 7px;
}

#sidemenu .snblist li.active a:hover i:after {
    right: 7px;
}


#sidemenu .snblist li a i:after {
    background: rgba(255, 255, 255, 0)
}

#sidemenu .snblist li a:hover i:after {
    -webkit-transform: translateY(-50%) translateX(20%);
    -moz-transform: translateY(-50%) translateX(20%);
    -ms-transform: translateY(-50%) translateX(20%);
    -o-transform: translateY(-50%) translateX(20%);
    transform: translateY(0) translateX(20%);
    color: #fff;
    background: rgba(255, 255, 255, 1);
}

#sidemenu .snblist li.select a:hover i:after {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    color: #fff;
    background: rgba(255, 255, 255, 1);
}


#sidemenu .snblist .sub {
    background: #f8f8f8;
    padding: 10px 0px;
    border-bottom: 1px solid #e6e6e6
}

#sidemenu .snblist .sub li.select a {
    color: #006fba
}

#sidemenu .snblist .sub li a {
    padding: 8px 20px;
    border-bottom: 0px
}

@media all and (min-width: 768px) {

    .subwrap {
        background-size: 30% !important;
        padding: 40px 3%;
    }

    #sub_visual {
        padding: 120px 0px 67px;
    }

    .conh3 {
        font-size: 1.8em
    }

}

@media all and (min-width: 1200px) {
    #sidemenu {
        display: block
    }

    #sub_visual {
        padding: 90px 0px 92px;
        max-width: 1400px;
        margin: 0 auto;
        margin-top: 130px;
    }


    .subwrap {
        margin: 0 auto;
        position: relative;
        padding: 90px 20px;
    }

    .subwrap:after {
        content: '';
        display: block;
        clear: both;
    }

    .conh3 {
        font-size: 2.4em;
    }
}


/*서브탭*/
.tabmenu {
    position: relative;
}

.tabmenu .dropbtn {
    line-height: 45px;
    border: 2px solid #767ba5;
    width: 100%;
    text-align: left;
    display: block;
    height: auto;
    position: relative;
    padding: 0 25px 0 10px;
    cursor: pointer;
    color: #2b4771;
    font-weight: 500
}

.tabmenu .dropbtn:after {
    font-family: 'FontAwesome';
    content: '\f107';
    position: absolute;
    right: 10px;
    color: #2b4771;
    font-size: 16px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.tabmenu .tabmenu_li ul {
    background: #f8f8f8
}

.tabmenu .tabmenu_li ul li {
    border: 1px solid #e6e6e6;
    border-top: 0px;
}

.tabmenu .tabmenu_li {
    display: none;
    position: absolute;
    z-index: 100;
    background: #ffffff;
    box-sizing: content-box;
    width: 100%;
    top: 49px;
    left: 0;
    right: 0;
}

.tabmenu .tabmenu_li ul li a {
    display: block;
    padding: 0px 10px;
    line-height: 40px;
    color: #323232;
}

.tabmenu .tabmenu_li ul li.active {
    background: #767ba5;
    border-color: #767ba5
}

.tabmenu .tabmenu_li ul li.active a {
    font-weight: 500;
    color: #ffffff
}

.tabmenu .tabmenu_li a:hover {
    font-weight: 500;
}

.tabmenu .tabmenu_li.show {
    display: block;
}

@media all and (min-width: 768px) {
    .tabmenu .tabmenu_li {
        display: block !important;
        position: relative;
        top: 0;
    }

    .tabmenu .tabmenu_li ul {
        background: none;
        text-align: center;
    }

    .tabmenu .tabmenu_li ul:after {
        content: '';
        display: block;
        clear: both
    }

    .tabmenu .tabmenu_li ul li {
        display: inline-block;
        margin: 0 10px;
        border: 0px;
        border-top: 3px solid #e6e6e6
    }

    .tabmenu .tabmenu_li ul li a {
        line-height: 50px;
        font-size: 1.1em;
        font-weight: 500;
        padding: 0 20px;
    }

    .tabmenu .tabmenu_li ul li.active {
        border-color: #2b4771;
        background: none
    }

    .tabmenu .tabmenu_li ul li.active a {
        color: #2b4771;
        font-weight: 600
    }

    .tabmenu .dropbtn {
        display: none
    }
}

@media all and (min-width: 1200px) {
    .tabmenu .tabmenu_li ul li a {
        line-height: 60px;
        font-size: 1.3em
    }
}






/*흰색패스*/
#sub_drop{position:relative;z-index:100;border-bottom: 1px solid #ccc;border-right: 1px solid #ccc;}
#sub_drop .home a{display:block;line-height:45px;padding:0 20px;border-left: 1px solid #ccc;}
#sub_drop .home{min-width:46px !Important}
#sub_drop .home img{display:inline-block; vertical-align:middle}
#sub_drop .dropdown{float:left;border-right: 1px solid #ccc;position:relative;z-index:101;}
#sub_drop .dropdown.deph02{min-width:35%}
#sub_drop .dropbtn {background:#ffffff;  width:100%; text-align:left; display:inline-block; height:auto; position:relative; line-height:45px; padding:0 25px 0 10px; cursor:pointer; color:#000000;}
#sub_drop .dropbtn:after{font-family:'FontAwesome'; content:'\f107'; position:absolute; right:10px; color:#000000; font-size:14px; top:0; bottom:0; margin:auto;}

#sub_drop .dropdown ul{}
#sub_drop .dropdown ul li{padding:5px 10px; }
#sub_drop .dropmenu {display: none;position: absolute;z-index: 5;background:#ffffff;border:1px solid #dcdcdc;box-sizing:content-box;left:-1px;width:100%;}
#sub_drop .dropmenu a{display:block; line-height:30px; color:#000000; }
#sub_drop .dropmenu a:hover {color:#1c3f95; font-weight:600;}
#sub_drop .dropdown .show {display:block;}

#sub_drop:after{display:block; content:''; clear:both;}

@media all and (min-width:768px) {
    #sub_drop .dropbtn{padding:0 25px 0 20px}
    #sub_drop .dropdown ul li{padding:5px 20px; }
    #sub_drop .dropdown{min-width:200px}
    #sub_drop .dropdown.deph02{min-width:300px}
    #sub_drop .dropmenu a{line-height:40px;}
    #sub_drop .home a{line-height:60px;}
    #sub_drop .dropbtn {line-height:60px}
    #sub_drop .dropbtn:after{right:15px}

}





/*텍스트효과*/

.motion01 {
    animation-name: sub_tt;
    animation-duration: 1000ms;
    animation-fill-mode: both;
    animation-delay: 200ms;
    animation-timing-fonction: ease-out;
}

.motion02 {
    animation-name: sub_tt;
    animation-duration: 1000ms;
    animation-fill-mode: both;
    animation-delay: 200ms;
    animation-timing-fonction: ease-out;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes sub_tt {
    0% {
        top: 30px;
        opacity: 0;
    }
    100% {
        top: 0;
        opacity: 1;
    }
}

/* Standard syntax */
@keyframes sub_tt {
    0% {
        top: 30px;
        opacity: 0;
    }
    100% {
        top: 0px;
        opacity: 1;
    }
}

/* Chrome, Safari, Opera */
@-webkit-keyframes sub_tt {
    0% {
        top: 30px;
        opacity: 0;
    }
    100% {
        top: 0;
        opacity: 0;
    }
}

/* Standard syntax */
@keyframes sub_tt {
    0% {
        top: 30px;
        opacity: 0;
    }
    100% {
        top: 0px;
        opacity: 1;
    }
}


@-webkit-keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    10% {
        -webkit-transform: scale(.91);
        transform: scale(.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    17% {
        -webkit-transform: scale(.98);
        transform: scale(.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    33% {
        -webkit-transform: scale(.87);
        transform: scale(.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    10% {
        -webkit-transform: scale(.91);
        transform: scale(.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    17% {
        -webkit-transform: scale(.98);
        transform: scale(.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
    33% {
        -webkit-transform: scale(.87);
        transform: scale(.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in
    }
    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out
    }
}

@-webkit-keyframes jello-vertical {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    30% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    40% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    50% {
        -webkit-transform: scale3d(.85, 1.15, 1);
        transform: scale3d(.85, 1.15, 1)
    }
    65% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    75% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@keyframes jello-vertical {
    0% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
    30% {
        -webkit-transform: scale3d(.75, 1.25, 1);
        transform: scale3d(.75, 1.25, 1)
    }
    40% {
        -webkit-transform: scale3d(1.25, .75, 1);
        transform: scale3d(1.25, .75, 1)
    }
    50% {
        -webkit-transform: scale3d(.85, 1.15, 1);
        transform: scale3d(.85, 1.15, 1)
    }
    65% {
        -webkit-transform: scale3d(1.05, .95, 1);
        transform: scale3d(1.05, .95, 1)
    }
    75% {
        -webkit-transform: scale3d(.95, 1.05, 1);
        transform: scale3d(.95, 1.05, 1)
    }
    100% {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1)
    }
}

@-webkit-keyframes text-pop-up-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        text-shadow: none
    }
    100% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }
}

@keyframes text-pop-up-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        text-shadow: none
    }
    100% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
    }
}

@media all and (max-width: 1200px) {
    #layerPopup0 {
        top: 100px !Important;
        left: 0 !Important;
    }

    #layerPopup1 {
        top: 435px !Important;
        left: 0 !Important;
    }

    #layerPopup2 {
        top: 770px !Important;
        left: 0 !Important;
    }

    #layerPopup3 {
        top: 1105px !Important;
        left: 0 !Important;
    }

    #layerPopup4 {
        top: 1440px !Important;
        left: 0 !Important;
    }

    #layerPopup5 {
        top: 1775px !Important;
        left: 0 !Important;
    }
}



.sub-txt{
    text-align: center;
    margin-bottom: 50px;
    font-size: 2em;
    font-weight: 600;
}