@charset "UTF-8";

/* S: contents - mobile */
@media (max-width: 1023px) {
  .pc-class{display: none;}
  .mo-class{display: block;}
  
  .nodrana .section01 {position:relative; height: 240vw; background:url('/images/brand/nodrana/bs_sec01_bg01_mo.png' ) no-repeat center; background-size:cover;}
  .nodrana .section01 .title-wrap .title span {color: #FFFFFF;}
  .nodrana .section01 .title-wrap .title span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; color: #FFFFFF;}
  .nodrana .section01 .sec01-cnt01 {padding-top: 3vw;}
  .nodrana .section01 .sec01-cnt01 img {width: 65%;}
  .nodrana .section01 .sec01-cnt02 {position:relative; height: 170vw;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub {position: absolute; left: 0; bottom: 0;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub span {line-height: 1.5; font-size: 5vw; color: #FFFFFF;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; font-size: 7vw; color: #FFFFFF;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub span .font-bg {padding: 0px 5px; background-color: #BB2029;}
  
  .nodrana .section02 {position:relative; background-color: #FFFFFF;}
  .nodrana .section02 .title-wrap .title span em {color: #BD1D28;}
  .nodrana .section02 .sec02-cnt span {font-size: 4.5vw;}
  .nodrana .section02 .sec02-cnt .sec02-cnt-box {position: relative; margin-top: 5vw;}
  .nodrana .section02 .sec02-cnt .sec02-cnt-box img {width: 70%; margin-top: 5vw;}
  
  .nodrana .section03 {position:relative; height: 270vw; background:url('/images/brand/nodrana/bs_sec03_bg01_mo.png' ) no-repeat; background-size: cover;}
  .nodrana .section03 .title-point {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; padding: 5px 20px; border-radius: 25px; background-color: #F2E2E3; color: #BD1D28;}
  .nodrana .section03 .title-wrap {margin-top: 30px;}
  .nodrana .section03 .title-wrap .title span em {font-size: 7.26667vw; color: #BD1D28;}
  .nodrana .section03  .sec03-cnt {position: relative; margin-top: -5vw;}
  .nodrana .section03  .sec03-cnt > span {font-family: "NotoSans-Light",Arial,"Helvetica Neue",Helvetica,sans-serif; font-size: 4vw; line-height: 1.5; letter-spacing: 0px;}
  .nodrana .section03  .sec03-cnt > span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub {margin-top: 10vw; padding-top: 10vw; padding-bottom: 3vw; padding-left: 5vw; padding-right: 5vw; border-radius: 20px; background-color: #FFFFFF;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub img {width: 80%}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub .mo-align {margin-top: 6vw; text-align: left;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub span {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; display: block; color: #777777;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub > span {margin-top: 8vw; padding-top: 4vw; padding-left: 1vw; border-top: 2px dotted #C8C8C8; text-align: left; font-size: 3.5vw;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub .text-box {display: flex; margin-top: 3vw; justify-content: flex-start; align-items: center; flex-direction: row; flex-wrap: wrap;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub .text-box span {margin-right: 3vw; margin-bottom: 3vw; padding: 1vw 4vw; border-radius: 25px; font-size: 3.5vw; background-color: #F3F4F6; color: #59595B;}
  
  .nodrana .section04 {position:relative; height: 170vw; background-color: #FFFFFF;}
  .nodrana .section04 .title-wrap .title span em {color: #BD1D28;}
  .nodrana .section04 .sec04-cnt {position: relative;}
  .nodrana .section04 .sec04-cnt > img {width: 40%;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub {display: block;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub > img {width: 100%;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box {padding-top: 25vw;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box-sub {display: flex; justify-content: flex-start; text-align: left; margin-bottom: 5vw;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box .text-box-sub span {display: inline-block; line-height: 1.5; font-size: 5vw; color: #777777;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box .text-box-sub .dot {width: 1.5vw; height: 1.5vw; margin: 3vw 2vw 1vw 0; border-radius: 100%; vertical-align: middle; background-color: #BD1D28;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box .text-box-sub span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; color: #222222;}
  .nodrana .section04 .sec04-cnt > img {position: absolute; left: 61%; top: 29%;}
  
  .product-info .section01 .title-wrap .title span em {font-size: 8vw; color: #BD1D28;}
  .product-info .section01 .product-swiper .swiper-wrapper .swiper-slide.on .active-box {background-color: #BD1D28;}
  .product-info .section02 .product-detail-wrap .title a {background-color: #BD1D28;}
  .product-info .section02 .product-detail-wrap .detail-list .detail-top .txt-box .text-bg {background-color: #888888; color: #FFFFFF;}
  
  .nodrana-qna .section01 {position:relative; background:url('/images/brand/nodrana/qna_sec01_bg01_mo.png' ) no-repeat top; background-size: contain; background-color: #F1F5F8;}
  .nodrana-qna .section01 .title-wrap.mt30 {margin-top: 10vw;}
  .nodrana-qna .section01 .title-wrap .title span em {color: #BD1D28;}
  .nodrana-qna .section01 .title-wrap .title span em.color-black {color: #222222;}
  .nodrana-qna .section01 .qna-info {display: flex; justify-content: center; flex-direction: column; flex-wrap: wrap;}
  .nodrana-qna .section01 .qna-info .qna-info-sub {width: 100%; height: 110vw;}
  .nodrana-qna .section01 .qna-info .qna-info-sub img.mo-class {width: 100%;}
  .nodrana-qna .section01 .qna-info .qna-info-sub span {display: block; font-size: 4.5vw; color: #777777;}
  .nodrana-qna .section01 .qna-info .qna-info-sub span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; color: #222222;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .text-title {margin: 20px 0px; font-size: 6.5vw;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .text-line {width: 20vw; height: 2px; margin-bottom: 20px; background-color: #E5E6EA;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .warning-info {margin-top: 20px;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .warning-info span {font-size: 4vw; color: #BD1D28;}
  .nodrana-qna .section01 .ui-accordion .accordion-item .btn .ico-q {color: #BD1D28;}
  
}

/* S: contents - pc */
@media (min-width: 1024px) {
  .pc-class{display: block;}
  .mo-class{display: none;}
  
  .nodrana .fix-indi button:hover{color:#BD1D28}
  .nodrana .fix-indi button:hover:after{background-color:#BD1D28}
  .nodrana .fix-indi button.on{color:#BD1D28}
  .nodrana .fix-indi button.on:after{background-color:#BD1D28}
  
  /* S: 브랜드 스토리 */
  .nodrana .section01 {position:relative; height: 1150px; background:url('/images/brand/nodrana/bs_sec01_bg01.png' ) no-repeat center; background-size:cover;}
  .nodrana .section01 .title-wrap .title span {font-size: 42px; color: #FFFFFF;}
  .nodrana .section01 .title-wrap .title span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; color: #FFFFFF;}
  .nodrana .section01 .sec01-cnt01 {padding-top: 25px;}
  .nodrana .section01 .sec01-cnt02 {position:relative; height: 810px;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub {position: absolute; left: 16%; bottom: 0;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub span {line-height: 1.5; font-size: 23px; color: #FFFFFF;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; font-size: 32px; color: #FFFFFF;}
  .nodrana .section01 .sec01-cnt02 .sec01-cnt02-sub span .font-bg {padding: 0px 5px; background-color: #BB2029;}

  .nodrana .section02 {position:relative; background-color: #FFFFFF;}
  .nodrana .section02 .title-wrap .title span em {color: #BD1D28;}
  .nodrana .section02 .sec02-cnt span {font-size: 23px;}
  .nodrana .section02 .sec02-cnt .sec02-cnt-box {position: relative;}
  .nodrana .section02 .sec02-cnt .sec02-cnt-box img {width: 32%; margin: 60px 5px;}
  
  .nodrana .section03 {position:relative; height: 980px; background:url('/images/brand/nodrana/bs_sec03_bg01.png' ) no-repeat center; background-size:cover;}
  .nodrana .section03 .title-point {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; padding: 5px 20px; border-radius: 25px; background-color: #F2E2E3; color: #BD1D28;}
  .nodrana .section03 .title-wrap {margin-top: 30px;}
  .nodrana .section03 .title-wrap .title span em {color: #BD1D28;}
  .nodrana .section03  .sec03-cnt {position: relative;}
  .nodrana .section03  .sec03-cnt > span {font-family: "NotoSans-Light",Arial,"Helvetica Neue",Helvetica,sans-serif; line-height: 1.5; font-size: 24px; letter-spacing: 0px;}
  .nodrana .section03  .sec03-cnt > span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub {margin-top: 40px; padding: 50px 120px; border-radius: 20px; background-color: #FFFFFF;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub img {margin-bottom: 30px;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub span {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; display: block; margin-right: 50px; padding: 10px 15px; color: #777777;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub .text-box {display: flex; margin-right: 30px; justify-content: center; align-items: center;}
  .nodrana .section03  .sec03-cnt .sec03-cnt-sub .text-box span {margin: 5px; border-radius: 25px; background-color: #F3F4F6; color: #59595B;}
  
  .nodrana .section04 {position:relative; height: 800px; background-color: #FFFFFF;}
  .nodrana .section04 .title-wrap .title span em {color: #BD1D28;}
  .nodrana .section04 .sec04-cnt {position: relative; margin-top: 60px;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub {display: flex; justify-content: center; margin-bottom: 40px;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box {padding: 70px;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box-sub {display: flex; justify-content: flex-start; text-align: left; margin-bottom: 40px;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box .text-box-sub span {display: inline-block; line-height: 1.5; font-size: 21px; color: #777777;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box .text-box-sub .dot {width: 8px; height: 8px; margin: 12px 20px 9px 0; border-radius: 100%; vertical-align: middle; background-color: #BD1D28;}
  .nodrana .section04 .sec04-cnt .sec04-cnt-sub .text-box .text-box-sub span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; color: #222222;}
  .nodrana .section04 .sec04-cnt > img {position: absolute; left: 44%; bottom: -23%;}
  
  .product-info .section01 .title-wrap .title span em {color: #BD1D28;}
  .product-info .section01 .product-swiper .swiper-wrapper .swiper-slide.on .active-box {background-color: #BD1D28;}
  .product-info .section02 .product-detail-wrap .title a {background-color: #BD1D28;}
  .product-info .section02 .product-detail-wrap .detail-list .detail-top .txt-box .text-bg {background-color: #888888; color: #FFFFFF;}
  
  .nodrana-qna .section01 {position:relative; background:url('/images/brand/nodrana/qna_sec01_bg01.png' ) no-repeat top; background-size: contain; background-color: #F1F5F8;}
  .nodrana-qna .section01 .title-wrap.mt30 {margin-top: 30px;}
  .nodrana-qna .section01 .title-wrap .title span em {color: #BD1D28;}
  .nodrana-qna .section01 .title-wrap .title span em.color-black {color: #222222;}
  .nodrana-qna .section01 .qna-info {display: flex; height: 670px; margin-top: 80px; justify-content: center;}
  .nodrana-qna .section01 .qna-info .qna-info-sub {height: 600px; padding: 0px 50px;}
  .nodrana-qna .section01 .qna-info .qna-info-sub:nth-of-type(2) {border-left: 1px solid #EBEBEE; border-right: 1px solid #EBEBEE;}
  .nodrana-qna .section01 .qna-info .qna-info-sub span {display: block; font-size: 18px; color: #777777;}
  .nodrana-qna .section01 .qna-info .qna-info-sub span em {font-family: "NotoSans-Medium",Arial,"Helvetica Neue",Helvetica,sans-serif; color: #222222;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .text-title {margin: 20px 0px; font-size: 23px;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .text-line {width: 70px; height: 2px; margin-bottom: 20px; background-color: #E5E6EA;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .warning-info {margin-top: 20px;}
  .nodrana-qna .section01 .qna-info .qna-info-sub .warning-info span {font-size: 16px; color: #BD1D28;}
  .nodrana-qna .section01 .ui-accordion .accordion-item .btn .ico-q {color: #BD1D28;}
}