body, html{
    font-family: 'Noto Sans KR', sans-serif;
    font-family: 'Noto Sans KR', sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

pre {
font-family: 'Noto Sans KR', sans-serif;
}

#main-bg .svis-wrap{
position:initial;
}

#main-bg .svis-wrap div{
position:initial;
}


section {position:relative;}



pre{
font-size:18px;
color:#828282;
line-height:30px;
font-weight:300;
font-family: "Noto Sans KR", Malgun Gothic,'맑은 고딕',"돋움",Dotum,Verdana,Arial,helvetica,clean,sans-serif;
}



#mCSB_1_container {
width:2800px !important;
}





h3 {
    font-size: 38px;
    font-weight: 300;
    color: #323232;
    letter-spacing: -3px;
    line-height: 1.3;
}

r{font-weight: 500;}
.inner-text {
    font-size: 18px;
    color: #828282;
    line-height: 30px;
    font-weight: 300;
    letter-spacing: -1px;
}


#main-bg {
    width: 100%;
    height: 768px;
    position: relative;
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/a_main_bg.jpg);
    background-size: cover;
    background-repeat:no-repeat;
}



.main-bg-title{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.main-title-warp{
    width: 1300px;
    margin: 0 auto;
}
.main-title-text {
    padding-left: 110px;
    padding-top: 215px;
}
.main-bg-title p {color: #fff;}
.main-bg-title p:nth-child(1){
    font-size: 40px;
    font-weight: 100;
    line-height: 40px;
}
.main-bg-title p:nth-child(2){
    font-size: 76px;
    font-weight: bold;
    line-height: 76px;
    margin: 35px 0 40px 0;
}
.main-bg-title p:nth-child(3){
    font-size: 22px;
    font-weight: 300;
    line-height: 36px;
    opacity: 0.6;
}


.snb-wrap {
    position: absolute !important;
    padding-top:706px;
    left: 50%;
    margin-left: -650px;
    width: 1300px !important;
    height: 60px;
}
.snb-wrap .mo_pageTit {
    display: none;
    position: relative;
    width: 100%;
    height: 50px;
    overflow: hidden;
    padding: 0 3%;
    background: #282e38;
    box-sizing: border-box;
}
.snb-wrap .mo_pageTit a {
    width: 100%;
    display: block;
    font-size: 15px;
    color: #fff;
    font-weight: 500;
    line-height: 50px;
}

.snb-wrap #snb {
    position: relative;
    display: block;
    overflow: hidden;
}
.snb-wrap #snb li:first-child {
    margin-left: 0;
}
.snb-wrap #snb li {
    float: left;
    margin-left: -1px;
}
.wd_6 li {
    width: 12.5%;
}
ul li {
    list-style: none;
    cursor: pointer;
    transition: .3s ease;
}
.snb-wrap #snb li a {
    display: block;
    line-height: 60px;
    text-align: center;
    color: #787878;
    font-size: 16px;
    border: 1px solid #e6e6e6;
    background: #fcfcfc;
}
.snb-wrap #snb li a:hover, .snb-wrap #snb li.active a {
    background: #42c0bf;
    color: #fff;
}


.snb_3th {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
    max-width: 1300px;
    margin: 100px auto 100px;
}
.wd_2 li {
    width: 50%;
}

.snb_3th li {
    float: left;
}
.snb_3th li.active a {
    color: #42c0bf;
    border: 1px solid #42c0bf;
    border-bottom: 1px solid #fff;
}
.snb_3th li a {
    display: block;
    line-height: 60px;
    text-align: center;
    color: #8c8c8c;
    font-size: 18px;
    border-bottom: 1px solid #42c0bf;
    background: #fff;
}















.eyes-title {
    text-align: center;
    padding: 0 0 100px 0;
    position:relative;
}
.eyes-title h3 {
    font-size: 60px;
    color:#333;
    font-weight: 500;
    line-height: 54px;
    padding: 120px 0 40px 0;
}

high {
    color:#42c0bf;
    font-weight: 500;
}

.eyes-title span {
    margin-top: 40px;
    font-size: 20px;
    font-weight: 100;
    color:#828282;
}
.eyes-title-pre{display:none;}





/*Full Slider */

.full-bg-slider {
    width:100%;
    height:622px;
    background:#fff;
}
.full-bg-slider h3 {text-align: left;}
.fullslider-h3{
line-height:52px;
}

.full-inner-wrap{
width: 502px;
    height: 424px;
    padding-top: 104px;
    position: absolute;
    left: 50%;
}

.full-item-box{
width:238px;
height:424px;
background:#fff;
float:left;
text-align:center;
}

.full-item-box:nth-child(2){
width:238px;
height:424px;
background:#fff;
float:right;
text-align:center;
}

.fi-img {
width:170px;
height:170px;
border-radius: 100%;
margin: 47px auto 0;
}
.fi-img-01 {
background-image:url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/mo-ac/fi-img01.png);
}
.fi-img-02 {
background-image:url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/mo-ac/fi-img02.png);
}

.full-inner-wrap p {
    font-size: 30px;
    line-height: 38px;
    color: #323232;
    text-align: center;
    padding-top: 35px;
}
.full-inner-wrap pre{
padding-top:25px;
font-size:16px;
line-height:24px;
font-weight:300;
color:#828282;
}





/*Full Slider Mobile*/
/*Mo acordian*/

.ac-active {
    background: #44cdca !important;
    color: #fff !important;
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/mo-ac/mo-ac-downarrow.png)!important;
    background-repeat: no-repeat !important;
    background-position: 97% !important; 
    background-size: 4% !important;
}
.ac-active .mo-ac-wrap ul li {
    
 
}

.mo-acordian{
    display: none;
    width:100%;
    padding:0px 15px;
    
}
.mo-ac-wrap {
    text-align: center;
    position: relative;
    
}
.mo-ac-wrap ul li {
    position: relative;
    background: #333333;
    padding: 10px 0;
    margin-bottom: 2px;
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/mo-ac/mo-ac-uparrow.png);
    background-repeat: no-repeat;
    background-position: 97%;
    background-size: 4%;
}
.mo-acordian h3 {
    display: inline-block;
    font-size: 1rem;
    color: #fff;
    letter-spacing: -1px;
}

.mo-ac-pre {margin:15px 0 25px 0;}
.mo-acordian ul li img {
    position: absolute;
    width: 4%;
    right: 20px;
    top: 35%;
}

.mo-ac-content {
    width: 100%;
    text-align: center;
    background: #f7f9f9;
    padding-bottom: 20px;
}


.ac-title {
    margin-top: 30px;
    font-size: 1rem;
    font-weight: 500;
}
.ac-text {
    margin-top: 1.384rem;
    font-size: 0.923rem;
    color: #828282;
    line-height: 1.307rem;
    margin-bottom: 45px;
}


.mo-ac-con-eye {
    margin: 0 auto;
    width: 120px;
    background: #fff;
    text-align: center;
    padding-top: 34px;
    display: inline-block;
}
.mo-ac-con-eye-img {
    width: 70px;
    height: 70px;
    margin: 0 auto;
    border-radius: 50%;
    background-size: contain;
    background-position: center;
}

.eye-item01{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/mo-ac/fi-img01.png);
}
.eye-item02{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/mo-ac/fi-img02.png);
}

.mo-ac-con-eye p {
    margin-top: 15px;
    font-size: 0.923rem;
}
.mo-ac-con-eye span {
    display: block;
    font-size: 0.615rem;
    line-height: 1rem;
    color: #828282;
    margin-top: 11px;
    padding-bottom: 15px;
}





/*Second Carousel */

.carousel-step {
    height: 790px;
}

.step-ca {
    width: 100%;
    
}
.step-title{
    padding-top: 120px;
    margin: 0 auto;
    text-align: center;
}

.step-title h3 {
    font-size: 42px;
    color: #323232;
    line-height: 42px;
    margin-bottom: 36px;
    line-height: 1.3;
}

.step-title span {
    font-size: 18px;
    color: #828282;
    line-height: 30px;
    letter-spacing: -1px;
    font-weight: 300;
}

.step-title-pre {display:none;}



/*Step mo*/

.step-mo {
    width: 100%;
    display: none;
    text-align: center;
    padding: 30px 10px 50px;
    clear: both;

}

.step-mo .step-item {
    width: 140px;
    display: inline-block;
    margin: 0 auto;
}
.step-mo .step-item img{width:100%}

.step-mo .step-item p {
    font-size: 0.7rem;
    color: #828282;
    line-height: 1rem;
    padding: 10px 0 20px 0;
    letter-spacing: -1px;
}

.step-mo .step-item p r{
    color: #333333;
    font-weight: 500;
    font-size: 1rem;
}

.step-mo .step-item:nth-child(odd){
    margin-right: 40px;
}

.step-mo .step-item:last-child{margin-right: 0;}



/*Carousel dot*/

.carousel-dot {
    width: 100%;
    height: 493px;
    max-width:1920px;
    margin: 100px auto 0;
}


.dot-img-wrap {
    width: 50%;
    height: 100%;
    float: left;
    position: relative;
  /*  background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0411/img/d-img/d_img_01.jpg); */
    transition: .3s;
}


.dot-img-wrap img {
    opacity: 1;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}




.dot-wrap {
    position: absolute;
    padding-top: 130px;
    right: 45px;
    display: table-cell;
    vertical-align: middle;
}

.dot {
    cursor: pointer;
    margin: 20px 0;
    width: 14px;
    height: 14px;
    background:#fff;
    border-radius:50px;
    display: block;
    transition: .3s;
}

.dot-text-wrap{
    display: inline-block;
    width: 50%;
    height: 484px;
    padding: 85px 0 0 80px;
    background: #f7f9f9;
}

.dot-text-wrap h3 {
    font-size: 42px;
    font-weight: 300;
    margin-bottom: 27px;
    line-height: 52px;
text-align:left;
}
.dot-text-wrap high {
    font-weight: 500;
}
.inner-text02 {
    margin-top: 50px;
}


.inner-text02 span {
    font-size: 27px;
    font-weight: medium;
    width: 29px;
    height: auto;
    padding-bottom: 3px;
    color: #1a1a1a;
    border-bottom: 1px solid #1a1a1a;
    line-height: 24px;
}
.inner-text02 p {
    margin-top: 26px;
    font-size: 22px;
    color: #323232;
    line-height: 34px;
}


.dot-bg-01{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/d-img/d_img_10.jpg);
    transition: 0.5s;
}
.dot-bg-02{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/d-img/d_img_20.jpg);
    transition: 0.5s;
}
.dot-bg-03{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/d-img/d_img_30.jpg);
    transition: 0.5s;
}
.dot-bg-04{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/d-img/d_img_40.jpg);
    transition: 0.5s;
}
.dot-bg-05{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0416/img/d-img/d_img_50.jpg);
    transition: 0.5s;
}










/* Dot mobile */

.mo-dot{
    width: 100%;
    height: 490px;
    position: relative;
    display: none;
}

.mo-dot-bg{
    width: 100%;
    height: 270px;
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/d-img/mo/d-img-mo.jpg);
    background-size: 100%;
    background-position: top;
    background-repeat: no-repeat;
}

.mo-dot-inner{
    position: absolute;
    top: 147px;
    text-align: center;
    left: 50%;
    margin-left: -45%;
    width: 90%;
    background: #fff;
    padding-top: 30px;
    -webkit-box-shadow: 3px 10px 29px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: 3px 10px 29px 0px rgba(0,0,0,0.05);
    box-shadow: 3px 10px 29px 0px rgba(0,0,0,0.05);
}

.mo-dot-inner h3 {
    font-size: 1.282rem;
    letter-spacing: -0.15rem;
}
.mo-dot-inner p {
font-size: 0.9rem;
    line-height: 1.307rem;
    color: #828282;
    margin-top: 14px;
}
.mo-dot-inner table {
    margin-top: 28px;
    text-align: left;
    padding-left:14%;
    vertical-align:text-top;
    border-collapse:inherit;
    padding-bottom:34px;
}

.mo-dot-inner table tr td{vertical-align: top;padding-bottom: 10px; font-size:0.769rem;}
.mo-dot-inner table tr td span {
    width: initial;
    height: initial;
    color: #42c0bf;
    font-size: 1.0652rem;
    font-weight: 500;
    line-height: 1.307rem;
    margin-right: 14px;
    border-bottom: 1px solid #42c0bf;
}



/* double contents */

.double-title{margin: 100px 0 60px;}

.double-wrap{*zoom:1;}
.double-wrap:after{display: block; clear: both; content: '';}

.dou-wrap{
     width: 990px;
     margin: 0 auto 40px;
}
.dou-content1,
.dou-content2,
.dou-content3{
     overflow: hidden;
     float: left;
     width: 320px;
     height: 530px;
     border: 1px solid #ebebeb;
}

.dou-content1,
.dou-content2{margin-right: 10px;}


.dou-txt>p{
     text-align: center;
}

.dou-txt>.dou-title{
     padding: 10px 0 10px;
     font-size: 30px;
     font-weight: 500;
     line-height: 1.2;
}

.dou-txt>.sub-title{
     padding-top: 28px;
     color: #ddd;
     font-size: 14px;
     letter-spacing: 2px;
}




/*Sur Information*/

.sur-information {
    width: 100%;
    height: 525px;
}

.info-title {
    padding-top: 120px;
    text-align: center;
}

.sur-infograph {
    padding-top: 50px;
    max-width: 1200px;
    margin:0 auto;
    text-align: center;
}

.info {
    display: inline-block;
    width: 112px;
    height: 220px;
    margin-right:66px;
    float: left;
}

.info:last-child{margin-right:0;}

.info p {
    font-size: 18px;
    color: #323232;
    font-weight: 500;
    line-height: 18px;
    margin: 20px 0 10px 0;
    letter-spacing: -1px;
}
.info span {
    font-size: 17px;
    color: #828282;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: -1px;
}
.info pre {
    font-size: 17px;
    color: #828282;
    font-weight: 300;
    line-height: 24px;
    letter-spacing: -1px;
    font-family: "Noto Sans KR", Malgun Gothic,'맑은 고딕',"돋움",Dotum,Verdana,Arial,helvetica,clean,sans-serif;
}

.info-picto {
    width: 112px;
    height: 112px;
    background: #42c0bf;
    border-radius: 100%;
    background-size:contain;
    background-image: url(../img/picto/e_icon_01.png);
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.08);
    -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.08);
    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.08);
}


/*Eyes Adventage*/

.eyes-adven {
    width: 100%;
    height: 700px;
    background: #f7f9f9;
}

.adven-wrap {
    max-width: 1220px;
    height: 100%;
    margin: 0 auto;
    padding: 120px 0;
}

.adven-text-wrap{
    float: left;
    text-align: left;
    width: 390px;
    padding-left: 40px;
}
.adven-text-title h3{
    line-height: 52px;
    margin-bottom: 35px;
text-align:left;
}


.carousel-adven {
    float: right;
    width: 790px;
    height: 100%;
    padding-left: 75px;
    position: relative;
}
.adven-pre {display:none;}

/* Adven Mobile css */

.adven-text-title h3:nth-child(2){display: none;}
.mo-adven {
    width: 100%;
    padding:30px 0px 0 0px;
    display: none;
}

.mo-ad-item-wrap{
    width: 100%;
    text-align: center;
}
.mo-ad-item{
    width: 98px;
    background: #fff;
    text-align: center;
    display: inline-block;
    margin: 4px;
}
.mo-ad-item .mo-ad-img {
    width: 100%;
    height: 145px;
    overflow: hidden;
}

.mo-ad-item .mo-ad-img img {width:100%;}

.mo-ad-item p {
    font-size: 0.801rem;
    padding: 13px 0 8px 0;
    font-weight: 500;
    line-height: 1rem;
}


.mo-ad-item pre {
    font-size: 0.717rem;
    line-height: 0.974rem;
    color: #828282;
    font-weight: 300;
    font-family: "Noto Sans KR", Malgun Gothic,'맑은 고딕',"돋움",Dotum,Verdana,Arial,helvetica,clean,sans-serif;
    padding-bottom: 13px;
}









/* tab Type */

.tab-type {
    width: 100%;
    background: #fff;
}
.tab-wrap {
    max-width: 1120px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 59px;
}
.tab-title {
    padding: 70px 0 50px 0;
}
.tabs {
    width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}

.tabs li {
  float: left;
  border: 1px solid #d3d6d6;
  background: #ebeded;
    width: 20%;
}

.tabs li a {
  display: block;
  padding: 20px 0;
  font-size: 16px;
  color: #787878;
  text-decoration: none;
}

.tabs li a:hover {
  background: #42c0bf;
    color: #fff;
}

.tabs li.active,
.tabs li.active,
.tabs li.active a{
  background: #42c0bf;
  color: #fff !important;
}

.tab_container {
  background: #f7f9f9;
}

.tab_content {
  padding: 20px;
  font-size: 16px;
}
.tab1-carousel{
    width: 100%;
    padding: 72px 0;
}

.tab-inner-bg {
    position: relative;
    background:#f7f9f9;
    height: 352px;
    width: 100%;
    padding: 72px 0 72px 149px;
    text-align: left;
}

.tab-inner-bg .tab-arrow{
    position: absolute;
    top: 40%;
    cursor: pointer;
}
.arrowLeft {
    left: 70px;
}
.arrowRight {
    right: 70px;
}
.tab-inner-img {
    width: 428px;
    height: 208px;
    background: #e6e6e6;
    display: inline-block;
    float: left;
    border: 1px solid #c0c0c0;
}
.tab-inner-img img {
    width: 100%;
}
.tab-inner-text {
    padding-left: 70px;
    display: inline-block;
    max-width: 350px;
    float: left;
}
.tab-inner-text h2 {
    font-size: 30px;
    font-weight: 500;
    color: #323232;
    line-height: 30px;
    padding-top: 10px;
}
.tab-inner-text pre {
    font-size: 18px;
    color: #787878;
    font-weight: 300;
    line-height: 30px;
    padding-top: 30px;
    letter-spacing: -1px;
}


/*  nana QNA  */

.nana-qna {
    width: 100%;
    padding: 100px 0 0;
}

.qna-wrap {
    max-width: 1237px;
    margin: 0 auto;
    text-align: center;
}
.qna-title {
    padding-bottom: 63px;
}

.qna-carousel {
    position: relative;
    width: 100%;
    height: 485px;
}
.qna-arrow a {
    position: absolute;
    top: 40%;
    cursor: pointer;
}




.qna-ca-wrap {
    width: 50%;
    height: 100%;
    float: left;
}

.qna-ca-img{
    position: absolute;
    z-index: 10;
    left: 20%;
    width: 323px;
    height: 430px;
    background: #fff;
    -webkit-box-shadow: 11px 11px 16px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 11px 11px 16px 0px rgba(0,0,0,0.1);
    box-shadow: 11px 11px 16px 0px rgba(0,0,0,0.1);
    transition: .3s;
}
.qna-ca-bgbox {
    position: absolute;
    left: 15%;
    bottom: 0;
    width: 352px;
    height: 428px;
    border: 10px solid #d7d7d7;
}

.qna-text h3 {
    font-size: 30px;
    font-weight: 300;
    line-height: 42px;
text-align:left;
}
.qna-text h {
    font-weight: 500;
}
.qna-text p {
    margin-top: 38px;
    font-size: 18px;
    color: #787878;
    line-height: 30px;
}

.qna-left {left: 0; }
.qna-right {right: 0; visibility:visible !important}

.qna-carousel .slider-wrap {margin-top: 0;padding: 0;height:100%}
.qna-slider ul li:hover .content01{background:#fff !important;}
.qna-slider{height:100%}
.qna-slider ul, .qna-slider li {height:100%;}
.qna-slider .content01{width: 100%; cursor: default;}
.qna-slider .con-img {
    width: 50%;
    height: 100%;
    background: none;
    margin-bottom: 0;
    float: left;
    z-index: 0;
    position: relative;
}
.qna-slider .con-img img {
    position: absolute;
    left: 260px;
    top: 0;
    z-index: 100;
    -webkit-box-shadow: 11px 11px 16px 1px rgba(0,0,0,0.1);
-moz-box-shadow: 11px 11px 16px 1px rgba(0,0,0,0.1);
box-shadow: 11px 11px 16px 1px rgba(0,0,0,0.1);
}
.qna-bgbox{
    position: absolute;
    bottom: 0;
    left: 35%;
    width: 352px;
    height: 428px;
    border: 10px solid #d7d7d7;
}

.qna-slider ul li span{
    height: 100%;
}
.qna-text {
    width: 50%;
    text-align:left;
    float: right;
    height: 100%;
    text-align: left;
    padding: 90px 0 0 89px;
}

.qna-carousel .slider-arrow {
    top: 35% !important;
background:none;
width:initial;
height:initial;
}

/*mobile*/

.qna-mo {
    width:340px;
    margin:0 auto;
    position: relative;
    height: 100%;
    padding: 0 20px;
    display: none;
    padding:0;
}
.qna-mo-wrap{
    margin:0 auto;
}

.qna-mo-con01 {
    width: 100%;
    height: 250px;
}

/*.qna-mo-con01>.qna-mo-imgwrap{margin-top: 20px;}*/

.qna-mo-imgwrap{
    width: 45%;
    height: 100%;
    float: left;
    position: relative;
/*    margin-top: 40px; */
}


.qna-mo-img {
    width: 131px;
    height: 187px;
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/qna/h_img_01.jpg);
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    -webkit-box-shadow: 11px 11px 16px 1px rgba(0,0,0,0.1);
    -moz-box-shadow: 11px 11px 16px 1px rgba(0,0,0,0.1);
    box-shadow: 11px 11px 16px 1px rgba(0,0,0,0.1);
}
.qna-mo-border{
    width: 140px;
    height: 190px;
    border: 5px solid #d7d7d7;
    position: absolute;
    top:5%;
    right: 3%;
}

.qna-mo-textwrap{
    width: 55%;
    padding-left: 20px;
    height: 100%;
    float: left;
    position: relative;
    text-align: left;
}
.qna-mo-textwrap:nth-child(2){float:right;}

.qna-mo-textwrap h2 {
    font-weight: 300;
    font-size: 0.923rem;
    margin-bottom:17px;
}
.qna-mo-textwrap p {
    margin-top: 30px;
    font-size: 0.93rem;
    color: #787878;
}

.qna-mo-con02 {
    width: 100%;
height:205px;
}

.qna-mo-con02 .qna-mo-textwrap{
    padding-right:30px;
    padding-left: 0;
}

.qna-mo-con02 .qna-mo-img{
    left: 0;
}
.qna-mo-con02 .qna-mo-border {
    right: 0;
    left: 3%;
}
.qna-mo-con02 .qna-mo-img{
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub07_0503/img/qna/h_img_02.jpg);
}








/* NANA SYSTEM */

.sys-wrap{
    max-width: 1240px;
    margin: 0 auto;
    text-align: center;
}
.sys-title{
    padding: 120px 0 70px 0;
}
.sys-content{
    width: 100%;
    height: 328px;
    background: #f7f9f9;
    margin-bottom: 20px;
    position: relative;
    background-repeat: no-repeat;
    background-size: contain;
    text-align: left;   
}
.sys01 {
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/i_bg_01.jpg);
}
.sys02 {
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/i_bg_02.jpg);
}
.sys03 {
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/i_bg_03.jpg);
}
.sys04 {
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/i_bg_04.jpg);
}
.sys05 {
    background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/i_bg_05.jpg);
}

.sys-righttext {
    padding: 85px 0 0 770px;
}

.sys-content h2 {
    font-size: 26px;
    font-weight: 500;
    line-height: 26px;
    color: #323232;
}
.sys-righttext pre {
    margin-top:26px;
}
.sys-lefttext pre {
    margin-top:26px;
}


.sys-lefttext {
    padding: 85px 0 0 110px;
}

.sys-mo-title{
    display: none;
}



/*scroll section*/
#scroll-sec{
    margin-top: 120px;
    width: 100%;
    height: 600px;
    background-color: #f7f9f9;
}

.sc-text{
    width: 40%;
    height: 600px;
    background: #61c6c4;
    float: left;
    padding-left: 335px;
}
.sc-text-wrap{
    padding-top: 157px;
    color: #fff;
}
.sc-text h3 {
    color: #fff;
    line-height: 52px;
    text-align:left;
}

.sc-text-web {display:block;}
.sc-text-mo {display:none;}

.sc-text p {
    margin-top: 38px;
    font-weight: 300;
    font-size: 18px;
    line-height: 30px;
}

.sc-con-item {*zoom:5;}

.sc-con-item {
    width: 400px;
    background: none;
    padding-top: 79px;
}
.sc-con-item .sc-title {
    font-weight: bold;
    font-size: 57px;
    color: rgba(50,50,50,0.15);
    padding: 0 !important;
    margin: 0;
    line-height: 47px;
    margin-bottom: 34px;
}
.sc-con-item .sc-subtitle{
    font-size: 22px;
    font-weight:400;
    line-height: 32px;
    color: #323232;
    
    padding: 0;
    margin: 0 0 39px 0;
}

.sc-con-item .sc-con-img{
    width:100%;
    height: 242px;
    background-color: #ecc7b5;
}
.sc-con-item .sc-con-img img {
    width: 100% !important;
    height: 100% !important;
}
#motion-scroll{
    float: left;
    height: 100%;
    width: 60%;
}

#content-1 ul li {
    margin-right: 30px;
}
#content-1 ul li:first-child{
    margin-left: 60px;
}

#scroll-action{height:100%}


#scroll-action .mCSB_scrollTools_horizontal {
    display: block !important;
    width: 278px !important;
    height: 65px;
    /* margin: 0 auto !important; */
    margin-left: 410px;
}
.mCSB_scrollTools .mCSB_draggerContainer {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    height: auto;
}
#scroll-action .mCSB_dragger {
    width: 18px !important;
}
#scroll-action .mCSB_dragger_bar {
    width: 18px !important;
    height: 18px !important;
    margin-top: 0px !important;
    border-radius: 50% !important;
    background-color: #61c6c4 !important;
}
#scroll-action .mCSB_draggerRail {
    margin: 8px 0;
    background-color: #e0e3e6;
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.35) inset;
}

#scroll-action .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail{
    height: 2px;
}


/* NANA Video */

.nana-video {
    width: 100%;
    padding:120px 0 150px 0;
}

.video-title {
    text-align: center;
    margin: 0 auto;
}

.video-title p {
    font-size: 18px;
    line-height: 30px;
    font-weight: 300;
    color: #828282;
    margin-top: 36px;
}
.video-wrap {
    width: 1237px;
    height: 563px;
    margin: 0 auto;
    margin-top: 60px;
}
.video-carousel .slider-arrow {
    top: 240px !important;
    position: absolute;
}
.video-slider{text-align: center;}
.video-carousel .slider-arrow .video-left {
    left: 0;
}
.video-carousel .video-right{
    right: 0;
}

.video-content {
    width: 1000px;
    height: 100%;
    margin: 0 auto;
}

.video-carousel .slider-arrow {background:none; width:initial; height:initial;}

.video-slider ul {height:100%}
.video-slider ul li {height:100%}
.video-carousel{height:100%}
.video-carousel .slider-wrap {height:100%}
.video-carousel .video-slider {height:100%;}
.video-title pre {display:none;}

.video-banner{display:none;}

.slide-hidden{
    opacity: 0;
    top: -100px;
    transition: .8s ease;
}

.slide-show {
    opacity: 1;
    top: 0;
    transition:  .8s ease;
}











@media (max-width: 1300px){
    .snb-wrap {
        position: relative;
        top: 0;
        left: 0;
        margin-left: 0;
        width: 100%;
        height: auto;
    }

    .snb-wrap .mo_pageTit {
        display: none;
        position: relative;
    }
    .snb-wrap #snb {
        border: none;
        display: none;
    }
    .snb_3th {
        margin: 80px auto;
        width: 96%;
    }
}




@media (max-width: 1000px){
    .snb_3th {
    margin: 0 auto;
    width: 100%;
    }
    .snb_3th li {
    width: 50% !important;
    }
}

@media (max-width: 1000px){
    .snb_3th li.active a {
        background: #42c0bf;
        color: #fff;
        border-bottom: 1px solid #42c0bf;
    }

}

@media (max-width: 768px){
     pre {
     font-size:0.76rem;
     color:#828282;
     font-weight:300;
     line-height:1.128rem;
     font-family: "Noto Sans KR", Malgun Gothic,'맑은 고딕',"돋움",Dotum,Verdana,Arial,helvetica,clean,sans-serif;
     letter-spacing: -1px;
     }



    .mo_pageTit{display: none;}
    
    .snb_3th li a {
    border: 1px solid #42c0bf;
    margin-right: -1px;
    font-size: 12px;
    }
    .main-title-text{
        text-align: center;
        padding: 60% 0 0 0;
    }
    #main-bg {
        background-image:url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/mo-main-bg.jpg);
        height:557px;
        background-position: 78% 60px;
        background-size:cover;
        
    }
    
    .main-title-warp {
        width: 100%;
    }
    .main-bg-title p:nth-child(1) {
        font-size: 1.49rem;
        line-height:1.49rem;
    }
    .main-bg-title p:nth-child(2){
        font-size: 3.8rem;
        margin: 10px 0 10px 0;
    }
    .main-bg-title p:nth-child(3){
        font-size:1.312em;
        line-height:1.5em;
    }


    .eyes-title h3 {
        font-size:1.53rem; 
        line-height:1.76rem;
        padding:0 0 19px 0;
        letter-spacing: -2px;
     }

     .snb_3th li a{
        font-size:0.869rem;
       }

.eyes-title span{display:none;}
.eyes-title-pre {display:block;}

.full-bg-slider {display:none;}





/* double contents */

.double-title{margin: 100px 0 30px;}
.double-title>h3{
     font-size: 1.276rem;
     letter-spacing: -2px;   
}

.dou-wrap{
     width: 320px;
     margin: 0 auto 40px;
}

.dou-content1,
.dou-content2,
.dou-content3{
     float: none;
     width: 320px;
     height: 460px;
     border: 1px solid #ebebeb;
}

.dou-content1,
.dou-content2,
.dou-content3{
     margin: 0 0 20px 0;
}

.dou-img{
     width: 320px;
}

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

.dou-txt>.dou-title{
     padding: 10px 0 10px;
     font-size: 20px;
     line-height: 1.2;
     text-align: center;
}

.dou-txt>p:nth-child(3){
     font-size: 14px;
     line-height: 1.2;
     text-align: center;
}


 

/**Full Silder**/

.mo-acordian{
        display: block;
    }
.eyes-title {
        padding: 60px 0 40px ;
    }



/**Step**/

.step-mo {display: block;}
.step-title {padding-top:60px;}
.step-title h3 {
        font-size: 1.276rem;
        margin-bottom:20px;
        letter-spacing: -2px;
    }
    .step-title span {
        display: none;
    }
    .step-title-pre {display:block;}
    .carousel-step .slider-wrap{display: none;}
    
    .carousel-step{height: initial;}
    

/**Dot**/
    .carousel-dot{display: none;}
    .mo-dot{display: block;}

/**Info**/

.sur-information{height:inherit;padding-bottom:40px;}
    .sur-infograph{padding-top:22px;width:280px;}
    .info-title{padding-top:10px;}
    .sur-information .info-title h3 {
        font-size: 1.282rem;
        letter-spacing: -2px;
    }
    
    .info-picto {
        width: 52px;
        height: 52px;
        margin: 0 auto;
        background-position: center;
    }
    .info-wrap .info{
        margin: 0;
        float: none;
        width: 90px;
        height:110px;
        overflow:hidden;
    }
    
    .info span {font-size:0.666rem;line-height:1rem;}
    .info pre {color:#828282;font-weight:300; letter-spaceing:-1px; line-height:0.813rem; font-size:0.666rem;margin-top: 5px;}
    .info-wrap .info p {
        font-size: 0.769rem;
        margin:10px 0 0 0;
        line-height: 0.769rem;
    }
    
    

    /* Adven Mobile */

    .mo-adven {display: block;}
    .carousel-adven {display: none;}
    .adven-text-wrap{
        float: none;
        padding: 0;
        text-align: center;
        width: initial;
    }
    .adven-text-title h3 {
    font-size: 1.2823rem;
    line-height: 1.59rem;
    margin-bottom: 13px;
    }
    .adven-text-title h3:nth-child(1){display: none;}
    .adven-text-title h3:nth-child(2){display: block; text-align:center; letter-spacing: -2px;}
    .adven-wrap {padding: 40px 0;height: initial;}
    .eyes-adven{height: initial;}
    .adven-text-wrap .inner-text {
    display:none;
     }
     .adven-pre {display:block;}

     .mo-ad-item-wrap>.mo-ad-item2:after{width: 98px;}



/*    qna*/
.nana-qna{padding:60px 0 30px;}
.qna-mo-wrap{height:100%;}
    .qna-mo{display: block;}
    .qna-title {padding-bottom:24px;}
    .qna-title h3 {font-size: 1.282rem;}
    .qna-carousel{display: none;}
    .qna-wrap {padding: 0 10px;}




/*System Mobile*/
/*    system*/
.sys-title{padding: 30px 0 27px 0;}
    .sys-wrap{padding: 20px 20px;}
    .sys-title h3:first-child {
        display: none;
    }
    .sys-mo-title{
        display: block;
        font-size: 1.282rem;
        line-height: 1.59rem;
        letter-spacing: -2px;
    }
    .sys-content{
        height: 170px;
        background-size: cover;
        background-position: 70%;
        margin-bottom:10px;
    }
    
    .sys01{background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/mo-sys01.jpg) !important; }
    .sys02{background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/mo-sys02.jpg) !important; }
    .sys03{background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/mo-sys03.jpg) !important; }
    .sys04{background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/mo-sys04.jpg) !important; }
    .sys05{background-image: url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/system/mo-sys05.jpg) !important; }



    .sys-content h2{
        font-size: 1.25rem;
    }
    .sys-content p{
        font-size: 0.92rem;
    }
    .sys-righttext{
        float:right;
        padding:0 10px 0 0 ;
    }
.sys-lefttext{padding:0;}
    .sys-content h2{
        font-size: 0.871rem;
        margin-top:21px;
    }
    .sys-content .sys-righttext p{
        font-size: 0.9rem;
        line-height: 1.5rem;
        margin-top: 19px;
    }
    .sys-lefttext{
        float: left;
        padding: 10px 0 0 20px;
    }
    .sys-content .sys-lefttext p{
        line-height: 1.5rem;
        margin-top: 19px;
    }


.sys-wrap pre {
    margin-top:10px;
    font-size:0.666rem;
}


/** Scroll Sec**/

#scroll-sec {margin-top:-20px; height:450px;}
.sc-text{width:100%;height:initial;text-align:center;padding-left:0;}
.sc-text-wrap{padding-top:0; padding:32px 0;}
.sc-text-web{display:none;}
.sc-text-mo{display:block;font-size:1.282rem; line-height:1.59rem !important; text-align:center !important;}


.sc-text h3 {letter-spacing: -2px;}

.sc-text p {margin-top:13px; font-size:0.769rem;line-height:1.128rem; letter-spacing: -0.5px}

#motion-scroll{
    float: left;
    height: 250px;
    width: 100%;
}

.mCSB_container {*zoom:2;}



.sc-con-item{    
    width: 133px;
    background: none;
    padding-top: 26px;
}
.sc-con-item .sc-title {
    font-weight: bold;
    font-size: 1.64rem;
    color: rgba(50,50,50,0.15);
    padding: 0 !important;
    margin: 0;
    line-height: 1.64rem;
    margin-bottom: 14px;
}
.sc-con-item .sc-subtitle {
    width: 140px;
    font-size: 0.717rem;
    line-height: 0.974rem;
    color: #323232;
    font-weight: 300;
    padding: 0;
    margin: 0 0 14px 0;
}
.sc-con-item .sc-con-img{
    width: 100%;
    height: 80px;
    background-color: #ecc7b5;
}

#scroll-action .mCSB_scrollTools_horizontal{
margin:0 auto;
height:30px;
}

.mCSB_scrollTools.mCSB_scrollTools_horizontal{
top:230px;
}



/** Video Sec **/
.nana-video{padding:20px 0 50px;}
.video-title h3{
font-size: 1.281rem;
margin-bottom:14px;
}

.video-title p {display:none;}
.video-title pre {display:block; margin-bottom:20px;}
.video-wrap {display:none;}
.video-banner{display:block;}

.video-ba-box {
width:90%;
height:100px;
margin: 0 auto;
    background-size: 100%;
    margin-bottom: 10px;
}

.video-item01 {
background-image:url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/banner/k_img_01.jpg);
background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.video-item02{
background-image:url(/img_up/shop_pds/nanaprs/design/img/sub15_0402/img/banner/k_img_02.jpg);
background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}








}





@media (max-width:788px){
 #mCSB_1_container {
 width:1080px !important;
 }
}