@charset "UTF-8";
/********** 1_제품 **********/
.specialBanner {
  margin: 40px 0 20px;
}
.specialBanner .list li {
  position: relative;
}
.specialBanner .list li a {
  display: flex;
  align-items: center;
}
.specialBanner .list li a .thumb {
  overflow: hidden;
  width: 484px;
  margin-right: 70px;
}
.specialBanner .list li a .thumb img {
  width: 100%;
  border-radius: 14px;
}
.specialBanner .list li a .wrap {
  width: calc(100% - 554px);
}
.specialBanner .list li a .wrap .cate {
  display: inline-block;
  padding: 0 10px;
  border-radius: 10px;
  line-height: 29px;
  font-size: 12px;
  color: #fff;
  background: #111;
}
.specialBanner .list li a .wrap .tit {
  margin: 10px 0 5px;
  font-size: 24px;
}
.specialBanner .list li a .wrap .date {
  font-family: "Roboto";
  color: #666;
}
.specialBanner .controls {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 20;
  font-size: 0;
}
.specialBanner .controls .prev, .specialBanner .controls .next {
  display: inline-block;
  vertical-align: top;
}
.specialBanner .controls .page {
  position: static;
  display: inline-block;
  width: 65px;
  text-align: center;
  font-size: 14px;
  line-height: 30px;
  font-family: "Roboto";
  color: #888;
  vertical-align: top;
}
.specialBanner .controls .page .swiper-pagination-current {
  font-weight: 600;
}

.listHead {
  position: relative;
  padding: 40px 0 45px;
  font-size: 0;
  text-align: right;
}
.listHead .total {
  position: absolute;
  left: 0;
  top: 40px;
  font-size: 20px;
}
.listHead .sort {
  position: relative;
  display: inline-block;
  line-height: 20px;
  text-align: left;
  vertical-align: top;
}
.listHead .sort .tit {
  font-size: 14px;
  line-height: 20px;
}
.listHead .sort .tit a {
  padding-left: 18px;
  background: url(/static/images/icon/ic_sort.svg) no-repeat 0 50%/14px;
}
.listHead .sort .list {
  display: none;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 25px;
  z-index: 10;
  border: 1px solid #ddd;
  border-radius: 14px;
  background: #fff;
}
.listHead .sort .list label {
  display: block;
  white-space: nowrap;
  cursor: pointer;
}
.listHead .sort .list label span {
  display: block;
  padding: 0 14px;
  line-height: 35px;
  font-size: 12px;
  color: #888;
}
.listHead .sort .list label span:before {
  display: none;
}
.listHead .sort .list label input:checked + span {
  color: #111;
  background: #f2f2f2;
}
.listHead .filter {
  display: inline-block;
  line-height: 20px;
  font-size: 12px;
  vertical-align: top;
}
.listHead .filter:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 14px;
  margin: -3px 12px 0;
  vertical-align: middle;
  background: #ccc;
}
.listHead .filter img {
  margin-top: -3px;
  vertical-align: middle;
}

h1 + .listHead {
  padding: 20px 15px 0;
  margin-top: 0;
  border-top: 1px solid #e8e8e8;
}
h1 + .listHead .total {
  top: 20px;
}

.pdtList {
  font-size: 0;
}
.pdtList li {
  position: relative;
  display: inline-block;
  width: 235px;
  margin: 0 0 50px 30px;
  vertical-align: top;
  /*.thumbArea+.pname {margin-top:38px;}*/
}
.pdtList li .ranking {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: 40px;
  height: 40px;
  text-align: center;
  font-family: "Roboto";
  font-size: 16px;
  font-weight: 600;
  line-height: 40px;
  color: #fff;
  background: #111;
}
.pdtList li .thumbArea {
  position: relative;
  padding-top: 100%;
  margin-bottom: 18px;
}
.pdtList li .thumbArea .thumb {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}
.pdtList li .thumbArea .thumb img {
  width: 100%;
  max-width: 1000px;
}
.pdtList li .thumbArea .icon {
  position: absolute;
  left: 10px;
  top: -10px;
  z-index: 1;
  height: 28px;
}
.pdtList li .thumbArea .icon2 {
  position: absolute;
  left: 0;
  top: 0;
  padding: 0 6px;
  line-height: 22px;
  color: #fff !important;
  font-size: 12px;
}
.pdtList li .thumbArea .icon2.colorA {
  background: #FF5A00;
}
.pdtList li .thumbArea .icon2.colorB {
  background: #27993A;
}
.pdtList li .thumbArea .icon2.colorC {
  background: #C433AE;
}
.pdtList li .thumbArea .icon2Area {
  position: absolute;
  left: 0;
  top: 0;
}
.pdtList li .thumbArea .icon2Area .icon2 {
  position: static;
  display: inline-block;
  vertical-align: top;
}
.pdtList li .thumbArea .like {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 1;
  overflow: hidden;
  width: 28px;
  height: 28px;
}
.pdtList li .thumbArea .like img {
  margin-top: -28px;
}
.pdtList li .thumbArea .like.on img {
  margin-top: 0;
}
.pdtList li .thumbArea .btn {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 1;
}
.pdtList li .thumbArea .cart {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 1;
}
.pdtList li .thumbArea .cart img {
  width: 45px;
}
.pdtList li .brand {
  height: 14px;
  font-size: 12px;
  font-weight: 600;
  line-height: 14px;
}
.pdtList li .pname {
  height: 36px;
  margin-top: 8px;
  font-size: 14px;
  line-height: 18px;
}
.pdtList li .original {
  margin-top: 15px;
  font-size: 12px;
  color: #888;
  text-decoration: line-through;
}
.pdtList li .price {
  font-size: 10px;
}
.pdtList li .price strong {
  font-size: 16px;
}
.pdtList li .price strong + strong {
  margin-left: 10px;
}
.pdtList li .notLogin {
  font-weight: 600;
}
.pdtList li .notLogin a {
  padding-right: 14px;
  background: url(/static/images/icon/ic_arrow.svg) no-repeat 100% 50%;
}
.pdtList li .reviewCount {
  margin-top: 10px;
  font-size: 12px;
  line-height: 10px;
  color: #888;
}
.pdtList li .reviewCount span.num {
  margin-right: 6px;
}
.pdtList li .reviewCount:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: -4px 4px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_star4.svg) no-repeat 0 0;
}
.pdtList li .reviewCount + .label {
  padding-top: 10px;
}
.pdtList li .label {
  clear: both;
  padding-top: 5px;
}
.pdtList li .label span {
  display: inline-block;
  padding: 0 5px;
  line-height: 21px;
  border-radius: 2px;
  font-size: 12px;
  color: #f9327b;
  background: #f0f1f4;
}
.pdtList li.soldout .thumbArea .thumb a:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.3);
}
.pdtList li.soldout .price {
  color: #aaa;
}
.pdtList li.soldout .label span {
  color: #fff;
  border-color: #111;
  background: #111;
}
.pdtList li:nth-child(4n+1) {
  margin-left: 0;
}
.pdtList.typeB { /* 한줄형 */ }
.pdtList.typeB li {
  width: 100%;
  min-height: 200px;
  padding: 0 0 0 230px;
  margin: 0;
}
.pdtList.typeB li .thumbArea {
  position: absolute;
  left: 0;
  top: 0;
  margin: 0;
  width: 200px;
  height: 200px;
  padding-top: 0;
}
.pdtList.typeB li .brand {
  height: 26px;
  font-size: 16px;
  line-height: 1em;
}
.pdtList.typeB li .pname {
  height: 60px;
  font-size: 20px;
  line-height: 30px;
}
.pdtList.typeB li .original {
  margin-top: 25px;
  font-size: 16px;
}
.pdtList.typeB li .price {
  font-size: 16px;
}
.pdtList.typeB li .price strong {
  font-size: 24px;
}
.pdtList.typeB li .label span {
  line-height: 21px;
  font-size: 12px;
}
.pdtList.typeC { /* width:1280 * 5개 */ }
.pdtList.typeC li {
  width: 232px;
}
.pdtList.typeC li:nth-child(4n+1) {
  margin-left: 30px;
}
.pdtList.typeC li:nth-child(5n+1) {
  margin-left: 0;
}
.pdtList.typeD { /* width:890 */ }
.pdtList.typeD li {
  width: 200px;
}
.pdtList.typeE { /* width:1280 * 4개 */ }
.pdtList.typeE li {
  width: 290px;
  margin-left: 40px;
}
.pdtList.typeE li:nth-child(4n+1) {
  margin-left: 0;
}

.filterArea h2 {
  margin-top: 50px;
  font-weight: 600;
}
.filterArea h2:first-child {
  margin-top: 40px;
}
.filterArea .reset {
  margin-top: -19px;
  font-size: 14px;
  line-height: 14px;
  text-align: right;
}
.filterArea .reset a {
  color: #888;
  text-decoration: underline;
}
.filterArea .ideaSrmy, .filterArea .reviewSrmy {
  margin-top: 20px;
  border-top: 1px solid #bbb;
}
.filterArea .ideaSrmy li, .filterArea .reviewSrmy li {
  position: relative;
  padding-right: 70px;
  margin-top: 20px;
  font-size: 14px;
}
.filterArea .ideaSrmy li .num, .filterArea .reviewSrmy li .num {
  position: absolute;
  right: 0;
  top: 0;
}
.filterArea .btn {
  margin-top: 20px;
}
.filterArea .btn a {
  width: 100%;
  margin-top: 10px;
}
.filterArea .content dt {
  margin-top: 20px;
  font-size: 14px;
}
.filterArea .content dd p, .filterArea .content dd li {
  margin-top: 15px;
}
.filterArea .content dd p label, .filterArea .content dd li label {
  font-size: 14px;
  color: #888;
}
.filterArea .content dd p label input:checked + span, .filterArea .content dd li label input:checked + span {
  color: #111;
}
.filterArea .content dd + dt {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #ddd;
}
.filterArea .content .priceArea {
  margin-top: 20px;
}
.filterArea .content .priceArea .range {
  height: 20px;
  padding: 9px 10px 0;
}
.filterArea .content .priceArea .range .noUi-target {
  position: relative;
}
.filterArea .content .priceArea .range .noUi-base {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.filterArea .content .priceArea .range .noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}
.filterArea .content .priceArea .range .noUi-handle {
  position: relative;
  z-index: 1;
}
.filterArea .content .priceArea .range .noUi-stacking .noUi-handle {
  z-index: 10;
}
.filterArea .content .priceArea .range .noUi-horizontal {
  height: 2px;
}
.filterArea .content .priceArea .range .noUi-horizontal .noUi-handle {
  width: 20px;
  height: 20px;
  left: -10px;
  top: -10px;
  border: 2px solid #f9327b;
  border-radius: 50%;
  cursor: pointer;
  background: #fff;
}
.filterArea .content .priceArea .range .noUi-background {
  background: #D6D7D9;
}
.filterArea .content .priceArea .range .noUi-connect {
  background: #f9327b;
}
.filterArea .content .priceArea .price {
  overflow: hidden;
  margin-top: 10px;
}
.filterArea .content .priceArea .price .start, .filterArea .content .priceArea .price .end {
  float: left;
  color: #888;
  font-size: 14px;
  line-height: 1em;
}
.filterArea .content .priceArea .price .end {
  float: right;
}

.filterLayer .text {
  margin-bottom: 10px;
  text-align: right;
  font-size: 12px;
  color: #666;
}
.filterLayer dt {
  font-size: 14px;
}
.filterLayer dd {
  margin-top: 7px;
  font-size: 0;
}
.filterLayer dd label {
  display: inline-block;
  margin: 10px 10px 0 0;
}
.filterLayer dd label span {
  padding: 0 14px;
  border: 1px solid #ddd;
  border-radius: 10px;
  line-height: 30px;
  font-size: 14px;
  color: #aaa;
}
.filterLayer dd label span:before {
  display: none;
}
.filterLayer dd label input:checked + span {
  border-color: #f9327b;
  color: #f9327b;
}
.filterLayer dd + dt {
  margin-top: 40px;
}
.filterLayer dd.priceArea {
  margin-top: 20px;
}
.filterLayer dd.priceArea .range {
  height: 20px;
  padding: 9px 10px 0;
}
.filterLayer dd.priceArea .range .noUi-target {
  position: relative;
}
.filterLayer dd.priceArea .range .noUi-base {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.filterLayer dd.priceArea .range .noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}
.filterLayer dd.priceArea .range .noUi-handle {
  position: relative;
  z-index: 1;
}
.filterLayer dd.priceArea .range .noUi-stacking .noUi-handle {
  z-index: 10;
}
.filterLayer dd.priceArea .range .noUi-horizontal {
  height: 2px;
}
.filterLayer dd.priceArea .range .noUi-horizontal .noUi-handle {
  width: 20px;
  height: 20px;
  left: -10px;
  top: -10px;
  border: 2px solid #f9327b;
  border-radius: 50%;
  cursor: pointer;
  background: #fff;
}
.filterLayer dd.priceArea .range .noUi-background {
  background: #D6D7D9;
}
.filterLayer dd.priceArea .range .noUi-connect {
  background: #f9327b;
}
.filterLayer dd.priceArea .price {
  overflow: hidden;
  margin-top: 10px;
}
.filterLayer dd.priceArea .price .start, .filterLayer dd.priceArea .price .end {
  float: left;
  color: #888;
  font-size: 14px;
  line-height: 1em;
}
.filterLayer dd.priceArea .price .end {
  float: right;
}
.filterLayer dd.sort {
  height: 21px;
  margin-top: -21px;
  font-size: 14px;
  line-height: 21px;
  text-align: right;
}
.filterLayer dd.sort span + span:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -3px 10px 0;
  vertical-align: middle;
  background: #ddd;
}
.filterLayer dd.sort a {
  color: #888;
}
.filterLayer dd.sort a.on {
  color: #111;
  font-weight: 600;
}
.filterLayer dd ul {
  margin-top: 20px;
  font-size: 0;
}
.filterLayer dd ul li {
  display: inline-block;
  width: 50%;
  min-height: 40px;
  vertical-align: top;
}
.filterLayer dd ul li label {
  display: inline;
  margin: 0;
}
.filterLayer dd ul li label span {
  position: relative;
  padding: 0 0 0 28px;
  border: none;
  line-height: 20px;
}
.filterLayer dd ul li label span:before {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
}
.filterLayer dd ul li label input:checked ~ span {
  color: #111;
}

.brandAllLayer, .categoryAllLayer {
  width: 1080px;
  padding: 0 55px 20px;
}
.brandAllLayer h1, .categoryAllLayer h1 {
  height: 73px;
  padding-top: 30px;
  margin-bottom: 30px;
  border-bottom: 2px solid #111;
  font-size: 24px !important;
}
.brandAllLayer .text, .categoryAllLayer .text {
  position: absolute;
  top: 35px;
  right: 100px;
  font-size: 12px;
  color: #666;
}
.brandAllLayer .close, .categoryAllLayer .close {
  top: 36px;
  right: 55px;
}
.brandAllLayer .content, .categoryAllLayer .content {
  overflow-y: auto;
  max-height: calc(100% - 197px);
  padding: 0;
}
.brandAllLayer .content .list, .categoryAllLayer .content .list {
  overflow: hidden;
}
.brandAllLayer .content .list li, .categoryAllLayer .content .list li {
  float: left;
  width: 25%;
  padding: 10px 0 10px 20px;
  border-left: 1px solid #ddd;
  color: #888;
  font-size: 14px;
}
.brandAllLayer .content .list li:nth-child(4n+1), .categoryAllLayer .content .list li:nth-child(4n+1) {
  border-left: 0;
  padding-left: 0;
}
.brandAllLayer .content .list li input:checked ~ span, .categoryAllLayer .content .list li input:checked ~ span {
  color: #111;
}
.brandAllLayer .content .list.brandAllList > li, .categoryAllLayer .content .list.brandAllList > li {
  float: none;
  width: 100%;
  padding: 0;
  border-left: 0;
}
.brandAllLayer .content .list.brandAllList > li .tit, .categoryAllLayer .content .list.brandAllList > li .tit {
  margin: 0 0 10px -5px;
  font-size: 34px;
  line-height: 1em;
  color: #111;
}
.brandAllLayer .content .list.brandAllList > li + li, .categoryAllLayer .content .list.brandAllList > li + li {
  margin-top: 30px;
}
.brandAllLayer .content .list.brandAllList > li ul, .categoryAllLayer .content .list.brandAllList > li ul {
  overflow: hidden;
}
.brandAllLayer .btnArea, .categoryAllLayer .btnArea {
  margin: 20px 0 0;
}

/* 제품상세 */
.productDetail #container {
  position: relative;
  padding-right: 390px;
}
.productDetail .floatingMessageLayer {
  display: none;
  position: absolute;
  left: calc(50% - 195px);
  top: 77px;
  z-index: 10;
  padding: 18px 44px;
  border: 1px solid #006FFF;
  border-radius: 14px;
  font-size: 14px;
  background: #EBF4FF url(/static/images/icon/ic_notice3.svg) no-repeat 20px 20px;
  transform: translateX(-50%);
}
.productDetail .floatingMessageLayer span {
  color: #006FFF;
}

.pdtThumb {
  position: relative;
  float: left;
  width: 430px;
  margin: 10px 40px 50px 0;
}
.pdtThumb .thumbArea {
  position: relative;
}
.pdtThumb .thumbArea .slideCont img {
  width: 100%;
  max-width: 1000px;
}
.pdtThumb .thumbArea .icon {
  position: absolute;
  right: 15px;
  top: 10px;
  z-index: 10;
}
.pdtThumb .list {
  position: relative;
  margin: 20px 40px 0;
}
.pdtThumb .list .wrap {
  overflow: hidden;
}
.pdtThumb .list .wrap li {
  position: relative;
  overflow: hidden;
  width: 80px;
  height: 80px;
  border-radius: 14px;
}
.pdtThumb .list .wrap li.swiper-slide-thumb-active:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border: 1px solid #f9327b;
  border-radius: 14px;
}
.pdtThumb .list .wrap .noSwipe {
  display: block;
  text-align: center;
}
.pdtThumb .list .wrap .noSwipe li {
  display: inline-block;
}
.pdtThumb .list .wrap .noSwipe li:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  border: 1px solid #f9327b;
  border-radius: 14px;
}
.pdtThumb .list .prev, .pdtThumb .list .next {
  position: absolute;
  top: calc(50% - 9px);
  width: 9px;
  height: 17px;
  background: url(/static/images/icon/ic_arrow11.svg) no-repeat 0 0;
}
.pdtThumb .list .prev span, .pdtThumb .list .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.pdtThumb .list .prev.swiper-button-disabled, .pdtThumb .list .next.swiper-button-disabled {
  opacity: 0.4;
}
.pdtThumb .list .prev {
  left: -40px;
  transform: rotate(180deg);
}
.pdtThumb .list .next {
  right: -40px;
}
.pdtThumb .timeArea {
  overflow: hidden;
  width: 100%;
  height: 44px;
  padding: 0 20px;
  margin-top: 30px;
  border-radius: 14px;
  background: #111;
}
.pdtThumb .timeArea .time {
  position: relative;
  float: left;
  padding-left: 24px;
  color: #fff;
  font-size: 12px;
  line-height: 44px;
}
.pdtThumb .timeArea .time .fontA {
  font-size: 14px;
}
.pdtThumb .timeArea .time:before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 9px);
  width: 15px;
  height: 15px;
  border: 1px solid #fff;
  border-radius: 50%;
}
.pdtThumb .timeArea .time:after {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 9px);
  width: 17px;
  height: 17px;
  animation: time 4s infinite linear;
  transform-origin: 50% 50%;
  background: url(/static/images/icon/ic_time2.png) no-repeat calc(50% - 1px) calc(50% - 1px)/4px 8px;
}
.pdtThumb .timeArea .num {
  float: right;
  color: #fff;
  font-size: 12px;
  line-height: 44px;
}
.pdtThumb .timeArea .num .fontA {
  font-size: 14px;
}

@keyframes time {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.mainInfo {
  position: relative;
  float: left;
  width: 420px;
  margin: 10px 0 50px;
}
.mainInfo .icon2 {
  display: inline-block;
  padding: 0 8px;
  border-radius: 10px;
  line-height: 31px;
  color: #fff !important;
  font-size: 16px;
}
.mainInfo .icon2.colorA {
  background: #FF5A00;
}
.mainInfo .icon2.colorB {
  background: #27993A;
}
.mainInfo .icon2.colorC {
  background: #C433AE;
}
.mainInfo .brand {
  margin-top: 20px;
  height: 14px;
  font-size: 14px;
  font-weight: 600;
  line-height: 14px;
}
.mainInfo .brand a {
  padding-right: 13px;
  background: url(/static/images/icon/ic_arrow13.svg) no-repeat 100% 50%;
}
.mainInfo .btns {
  float: right;
  margin-top: 11px;
}
.mainInfo .btns a {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 30px;
}
.mainInfo .btns a.on img {
  margin-top: -30px;
}
.mainInfo .brand + .btns {
  margin-top: -23px;
}
.mainInfo .pname {
  clear: both;
  padding-top: 6px;
  font-size: 24px;
  line-height: 26px;
}
.mainInfo .original {
  margin-top: 30px;
}
.mainInfo .original .tit {
  display: inline-block;
  width: 100px;
  font-size: 16px;
  font-weight: 600;
  color: #F9327B;
}
.mainInfo .original .price {
  font-size: 16px;
  color: #888;
  text-decoration: line-through;
}
.mainInfo .oh .price {
  float: left;
  margin: 5px 0;
  font-size: 18px;
}
.mainInfo .oh .price strong {
  font-size: 34px;
}
.mainInfo .oh .price strong.percent {
  display: inline-block;
  width: 100px;
  color: #f9327b;
}
.mainInfo .oh .price .text {
  margin-left: 5px;
  color: #888;
}
.mainInfo .oh .price:last-child {
  margin-bottom: 0;
}
.mainInfo .oh .notLogin {
  height: 27px;
  font-size: 20px;
  font-weight: 600;
}
.mainInfo .oh .notLogin a {
  padding-right: 28px;
  background: url(/static/images/icon/ic_arrow5.svg) no-repeat 100% 50%;
}
.mainInfo .oh .reviewCountSrmy {
  float: right;
  height: 19px;
  margin-top: 14px;
  line-height: 19px;
}
.mainInfo .oh .reviewCountSrmy p {
  display: inline-block;
  font-size: 14px;
}
.mainInfo .oh .reviewCountSrmy .grade:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: -5px 4px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_star3.svg) no-repeat 0 50%/100%;
}
.mainInfo .oh .reviewCountSrmy .grade:after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -4px 6px 0 10px;
  vertical-align: middle;
  background: #888;
}
.mainInfo .oh .reviewCountSrmy .reviewCount {
  text-decoration: underline;
}
.mainInfo .label span {
  display: inline-block;
  padding: 0 5px;
  margin-top: 5px;
  line-height: 21px;
  border-radius: 2px;
  font-size: 12px;
  color: #f9327b;
  background: #f0f1f4;
}
.mainInfo .benefitInfo {
  margin-top: 20px;
}
.mainInfo .benefitInfo h2 {
  margin-bottom: 20px;
  border-radius: 10px;
  text-align: center;
  font-size: 16px !important;
  line-height: 48px;
  background: #eee;
}
.mainInfo .benefitInfo dl {
  position: relative;
  padding-top: 20px;
  border-top: 1px solid #ddd;
}
.mainInfo .benefitInfo dl dt {
  position: absolute;
  left: 0;
  color: #888;
  font-size: 14px;
}
.mainInfo .benefitInfo dl dd {
  position: relative;
  padding-left: 95px;
  margin-bottom: 10px;
  font-size: 14px;
}
.mainInfo .benefitInfo dl dd.coupon {
  font-size: 10px;
}
.mainInfo .benefitInfo dl dd.coupon strong {
  font-size: 16px;
}
.mainInfo .benefitInfo dl dd .down {
  position: absolute;
  right: 0;
  top: -5px;
  height: 32px;
  padding: 0 10px;
  border-radius: 10px;
  color: #fff;
  font-size: 12px;
  line-height: 32px;
  background: #ff309a;
}
.mainInfo .benefitInfo dl dd .down:after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 13px;
  margin: -3px 0 0 6px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_coupon3.svg) no-repeat 0 0/100%;
}
.mainInfo .benefitInfo dl dd:not(.couponArea) a {
  text-decoration: underline;
}
.mainInfo .benefitInfo dl dd + dd {
  margin-top: -15px;
}
.mainInfo .benefitInfo dl dd.couponArea {
  padding-right: 100px;
}
.mainInfo.soldout .pname, .mainInfo.soldout .price, .mainInfo.soldout .price .text {
  color: #aaa;
}

.recommendTab {
  position: relative;
  margin: 70px 0;
}
.recommendTab ul {
  overflow: hidden;
  transition: all 0.2s;
}
.recommendTab ul li {
  float: left;
  overflow: hidden;
  width: calc(25% + 1px);
  height: 48px;
  border: 1px solid #e3e3e3;
  margin-left: -1px;
}
.recommendTab ul li a {
  display: block;
  display: -webkit-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  padding: 0 15px;
  line-height: 47px;
  text-align: center;
  background: #fff;
}
.recommendTab ul li.on {
  border-color: #ef2f7b;
}
.recommendTab ul li.on a {
  color: #fff;
  font-weight: 500;
  font-size: 16px;
  background: #ef2f7b;
}
.recommendTab ul li:nth-child(4) ~ li {
  border-top-width: 0;
}
.recommendTab ul li:nth-child(4n+1) {
  width: 25%;
  margin-left: 0;
}
.recommendTab .control {
  position: absolute;
  right: -37px;
  top: 0;
}
.recommendTab .control img {
  transform: rotate(-90deg);
}
.recommendTab.hidden ul {
  height: 48px !important;
}
.recommendTab.hidden .control img {
  transform: rotate(90deg);
}
.recommendTab.on .control img {
  transform: rotate(-90deg);
}
.recommendTab.fixed ul {
  position: fixed;
  top: 126px;
  z-index: 2;
  width: 1280px;
}

.recommendPdt {
  clear: both;
  margin-top: 30px;
}
.recommendPdt h2 {
  font-size: 24px !important;
}
.recommendPdt h2 + .more, .recommendPdt .btnInclude + .more {
  height: 25px;
  margin-top: -25px;
  text-align: right;
}
.recommendPdt h2 + .more a, .recommendPdt .btnInclude + .more a {
  padding-right: 24px;
  line-height: 17px;
  background: url(/static/images/icon/ic_arrow10.svg) no-repeat 100% 50%;
}
.recommendPdt .pdtList {
  margin-top: 30px;
}
.recommendPdt .pdtList li.moreList a {
  position: absolute;
  left: calc(50% - 25px);
  top: calc(50% - 35px);
  width: 50px;
  padding-top: 46px;
  text-align: center;
  background: url(/static/images/icon/ic_arrow14.svg) no-repeat 50% 0;
}
.recommendPdt .pdtList.swiper-wrapper li {
  width: 140px;
  margin: 0 10px 50px 0;
}
.recommendPdt .btnInclude {
  position: relative;
}
.recommendPdt .btnInclude h2 {
  display: inline-block;
  vertical-align: top;
}
.recommendPdt .btnInclude .controls {
  position: absolute;
  right: 0;
  top: 0;
}
.recommendPdt .btnInclude .controls .page {
  position: static;
  display: inline-block;
  width: 65px;
  text-align: center;
  font-size: 14px;
  line-height: 30px;
  font-family: "Roboto";
  color: #888;
  vertical-align: top;
}
.recommendPdt .btnInclude .controls .page .swiper-pagination-current {
  font-weight: 500;
  color: #111;
}
.recommendPdt .btnInclude .controls .prev, .recommendPdt .btnInclude .controls .next {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.recommendPdt .btnInclude .controls .prev span, .recommendPdt .btnInclude .controls .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.recommendPdt .btnInclude .controls .prev.swiper-button-disabled, .recommendPdt .btnInclude .controls .next.swiper-button-disabled {
  opacity: 1;
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.recommendPdt .btnInclude .controls .prev.prev:not(.swiper-button-disabled), .recommendPdt .btnInclude .controls .prev.next.swiper-button-disabled, .recommendPdt .btnInclude .controls .next.prev:not(.swiper-button-disabled), .recommendPdt .btnInclude .controls .next.next.swiper-button-disabled {
  transform: rotate(180deg);
}
.recommendPdt .swiper-container .pdtList.typeD li {
  margin-left: 0;
}

.pdtBann {
  overflow: hidden;
}
.pdtBann .list {
  position: relative;
}
.pdtBann .list li img {
  max-width: 1280px;
  width: 100%;
}
.pdtBann .list .page {
  position: absolute;
  left: initial;
  right: 16px;
  bottom: 14px;
  z-index: 20;
  width: 52px;
  border-radius: 11px;
  line-height: 22px;
  color: #fff;
  font-family: "Roboto";
  font-size: 10px;
  text-align: center;
  background: rgba(0, 0, 0, 0.4);
}
.pdtBann .list .page span {
  opacity: 0.7;
}
.pdtBann .list .page .swiper-pagination-current {
  font-weight: 600;
  opacity: 1;
}
.pdtBann .progress {
  overflow: hidden;
  width: 30px;
  height: 4px;
  margin: 15px auto 0;
  font-size: 0;
  line-height: 0;
  border-radius: 2px;
  background: rgba(0, 0, 0, 0.2);
}
.pdtBann .progress span {
  display: inline-block;
  height: 4px;
  background: #111;
}

.pdtDetail {
  padding: 30px 0 40px;
  background: #fff;
}
.pdtDetail h2:not(.editorView h2) {
  margin: 70px 0 20px;
  font-size: 24px;
}
.pdtDetail h2:not(.editorView h2):first-child {
  margin-top: 0;
}
.pdtDetail .pdtBann {
  margin: 0 0 30px;
}
.pdtDetail .pdtBann li + li {
  margin-top: 10px;
}
.pdtDetail .pdtBann + .bannTypeB {
  margin: -20px 0 30px;
}
.pdtDetail .mv {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%;
  margin-bottom: 30px;
  border-radius: 14px;
}
.pdtDetail .mv iframe, .pdtDetail .mv video-js {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.pdtDetail .mv.vertical {
  padding-top: 126.08%;
}
.pdtDetail .mv .play, .pdtDetail .mv .pause {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.pdtDetail .mv .play.pause, .pdtDetail .mv .pause.pause {
  display: none;
}
.pdtDetail .mv .play:before, .pdtDetail .mv .pause:before {
  content: "";
  position: absolute;
  left: calc(50% - 23px);
  top: calc(50% - 23px);
  width: 46px;
  height: 46px;
}
.pdtDetail .mv .play.play:before, .pdtDetail .mv .pause.play:before {
  background: url(/static/images/icon/ic_play.svg) no-repeat 0 0;
}
.pdtDetail .detail {
  overflow: hidden;
  position: relative;
  max-height: 2554px;
  margin: 0 0 30px;
  text-align: center;
}
.pdtDetail .detail .more, .pdtDetail .detail .fold {
  visibility: hidden;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding-top: 100px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, rgb(255, 255, 255) 100px);
}
.pdtDetail .detail .more button, .pdtDetail .detail .fold button {
  width: 620px;
  height: 54px;
  line-height: 52px;
  border-color: #f9327b;
  color: #f9327b !important;
  font-size: 18px;
}
.pdtDetail .detail .fold {
  display: none;
  background: none;
}
.pdtDetail .detail.active .more, .pdtDetail .detail.active .fold {
  visibility: visible;
}
.pdtDetail .detail.show {
  max-height: initial;
  padding-bottom: 104px;
}
.pdtDetail .detail.show .more {
  display: none;
}
.pdtDetail .detail.show .fold {
  display: block;
}
.pdtDetail .dealPdt {
  margin: 120px 0;
}
.pdtDetail .dealPdt .pdtList li h2 {
  height: 50px;
  margin: -50px 0 0 -230px;
  font-size: 20px !important;
  font-weight: 600;
}
.pdtDetail .dealPdt .pdtList li + li {
  margin-top: 100px;
}
.pdtDetail .info a.icoFold {
  display: block;
  height: 56px;
  padding: 0 50px 0 20px;
  line-height: 54px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.pdtDetail .info a.icoFold:before, .pdtDetail .info a.icoFold:after {
  right: 20px;
}
.pdtDetail .info a.icoFold:before {
  right: 23px;
}
.pdtDetail .info a.icoFold.on {
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
}
.pdtDetail .info .content table {
  width: 100%;
  table-layout: fixed;
  border-top: 1px solid #111;
}
.pdtDetail .info .content table th {
  width: 260px;
  height: 56px;
  padding: 16px 20px;
  border-bottom: 1px solid #ddd;
  text-align: left;
  font-weight: 400;
}
.pdtDetail .info .content table td {
  color: #666;
  padding: 16px 0;
  border-bottom: 1px solid #ddd;
}
.pdtDetail .info + .info {
  margin-top: 10px;
}
.pdtDetail .dealInfo h2 {
  margin: 0 0 10px;
  font-weight: 600;
}
.pdtDetail .dealInfo .info {
  position: relative;
}
.pdtDetail .dealInfo .info .list {
  display: none;
  overflow-y: auto;
  position: absolute;
  left: 0;
  top: 56px;
  right: 0;
  z-index: 10;
  max-height: 250px;
  border: 1px solid #111;
  border-radius: 0 0 14px 14px;
  background: #fff;
}
.pdtDetail .dealInfo .info .list li {
  font-size: 14px;
}
.pdtDetail .dealInfo .info .list li a {
  display: block;
  padding: 20px;
}
.pdtDetail .dealInfo .info .list li + li {
  border-top: 1px solid #eee;
}
.pdtDetail .dealInfo .info .subOption {
  position: relative;
  margin-top: 10px;
}
.pdtDetail .dealInfo .info .content {
  display: none;
  padding: 20px;
  border: 1px solid #ddd;
  border-top: 0;
  border-radius: 0 0 14px 14px;
}
.pdtDetail .dealInfo .info .icoFold.over {
  border-color: #111;
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
}
.pdtDetail .info2 {
  border: 1px solid #ddd;
  border-radius: 14px;
}
.pdtDetail .info2 a.icoFold {
  display: block;
  height: 54px;
  padding: 0 50px 0 20px;
  line-height: 54px;
  font-size: 18px;
  font-weight: 600;
}
.pdtDetail .info2 a.icoFold:before, .pdtDetail .info2 a.icoFold:after {
  right: 20px;
}
.pdtDetail .info2 a.icoFold:before {
  right: 23px;
}
.pdtDetail .info2 a.icoFold.on {
  border-color: #111;
  border-radius: 14px 14px 0 0;
}
.pdtDetail .info2 .content {
  display: none;
  padding: 0 20px;
}
.pdtDetail .info2 .content h4 {
  padding-top: 20px;
  font-size: 14px !important;
  color: #888;
}
.pdtDetail .info2 .content h4:first-child {
  padding-top: 0;
}
.pdtDetail .info2 .content ul {
  padding: 10px 0 20px;
}
.pdtDetail .info2 .content ul li {
  font-size: 14px;
}
.pdtDetail .info2 .content > ul > li {
  position: relative;
  padding-left: 10px;
}
.pdtDetail .info2 .content > ul > li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 4px;
  height: 1px;
  background: #111;
}
.pdtDetail .info2 .content > ul > li ul {
  padding: 0;
}
.pdtDetail .info2 .content > ul > li ul li {
  position: relative;
  padding-left: 8px;
}
.pdtDetail .info2 .content > ul > li ul li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: #111;
}
.pdtDetail .info2 .content ul + h4 {
  border-top: 1px solid #ddd;
}
.pdtDetail .info2 + .info2 {
  margin-top: 20px;
}
.pdtDetail .reviewHead .choice {
  position: relative;
}
.pdtDetail .reviewHead .choice .icoFold {
  display: block;
  height: 54px;
  padding: 0 50px 0 20px;
  border: 1px solid #ddd;
  border-radius: 14px;
  line-height: 54px;
}
.pdtDetail .reviewHead .choice .icoFold:before, .pdtDetail .reviewHead .choice .icoFold:after {
  right: 20px;
}
.pdtDetail .reviewHead .choice .icoFold:before {
  right: 23px;
}
.pdtDetail .reviewHead .choice .icoFold.on {
  border-color: #111;
  border-radius: 14px 14px 0 0;
}
.pdtDetail .reviewHead .choice .list {
  display: none;
  overflow-y: auto;
  position: absolute;
  left: 0;
  top: 54px;
  right: 0;
  z-index: 10;
  height: 244px;
  border: 1px solid #111;
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: #fff;
}
.pdtDetail .reviewHead .choice .list li {
  font-size: 14px;
}
.pdtDetail .reviewHead .choice .list li label span {
  display: block;
  padding: 20px;
}
.pdtDetail .reviewHead .choice .list li label span:before {
  display: none;
}
.pdtDetail .reviewHead .choice .list li + li {
  border-top: 1px solid #eee;
}
.pdtDetail .reviewHead .srmy {
  overflow: hidden;
  padding: 30px 40px;
  margin-top: 30px;
  border: 1px solid #e8e8e8;
  border-radius: 14px;
}
.pdtDetail .reviewHead .srmy .gradeArea {
  position: relative;
  float: left;
  width: 50%;
}
.pdtDetail .reviewHead .srmy .gradeArea h3 {
  margin-bottom: 10px;
  font-size: 14px !important;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade {
  float: left;
  margin: 10px 20px 0 0;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em {
  width: 182px;
  height: 30px;
  background-size: 100%;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span {
  height: 30px;
  background-size: 182px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade10 {
  width: 15px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade20 {
  width: 30px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade30 {
  width: 53px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade40 {
  width: 68px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade50 {
  width: 91px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade60 {
  width: 106px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade70 {
  width: 129px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade80 {
  width: 144px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade90 {
  width: 167px;
}
.pdtDetail .reviewHead .srmy .gradeArea .grade em > span.grade100 {
  width: 182px;
}
.pdtDetail .reviewHead .srmy .gradeArea .score {
  margin-bottom: 10px;
  font-size: 24px;
  font-weight: 600;
  color: #ccc;
  line-height: 24px;
}
.pdtDetail .reviewHead .srmy .gradeArea .count {
  font-size: 14px;
  color: #888;
}
.pdtDetail .reviewHead .srmy .gradeArea:before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #ddd;
}
.pdtDetail .reviewHead .srmy .graph {
  float: left;
  width: 50%;
  padding-left: 60px;
}
.pdtDetail .reviewHead .srmy .graph p {
  font-size: 16px;
  line-height: 1em;
}
.pdtDetail .reviewHead .srmy .graph p .score {
  display: inline-block;
  padding-top: 2px;
  color: #888;
  vertical-align: top;
}
.pdtDetail .reviewHead .srmy .graph p .bar {
  display: inline-block;
  width: 252px;
  height: 14px;
  margin: 2px 14px 0;
  border-radius: 7px;
  vertical-align: top;
  background: #f2f2f2;
}
.pdtDetail .reviewHead .srmy .graph p .bar span {
  display: inline-block;
  height: 14px;
  border-radius: 7px;
  background: #f9327b;
  vertical-align: top;
}
.pdtDetail .reviewHead .srmy .graph p .percent {
  display: inline-block;
  vertical-align: top;
  color: #f9327b;
  font-family: "Roboto";
}
.pdtDetail .reviewHead .srmy .graph p + p {
  margin-top: 16px;
}
.pdtDetail .reviewHead .srmy .list {
  float: right;
  width: 300px;
}
.pdtDetail .reviewHead .srmy .list h3 {
  margin-bottom: 20px;
  font-size: 14px !important;
}
.pdtDetail .reviewHead .srmy .list li {
  position: relative;
  padding-right: 100px;
}
.pdtDetail .reviewHead .srmy .list li .q {
  font-size: 14px;
  color: #888;
}
.pdtDetail .reviewHead .srmy .list li .a {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 14px;
}
.pdtDetail .reviewHead .srmy .list li + li {
  margin-top: 15px;
}
.pdtDetail .reviewHead .srmy .list .noData {
  text-align: left;
  color: #ccc;
}
.pdtDetail .bestReviewSrmy {
  position: relative;
  overflow: hidden;
  margin-top: 30px;
}
.pdtDetail .bestReviewSrmy .controls {
  position: absolute;
  right: 0;
  top: 0;
}
.pdtDetail .bestReviewSrmy .controls .page {
  position: static;
  display: inline-block;
  width: 65px;
  text-align: center;
  font-size: 14px;
  line-height: 30px;
  font-family: "Roboto";
  color: #888;
  vertical-align: top;
}
.pdtDetail .bestReviewSrmy .controls .page .swiper-pagination-current {
  font-weight: 500;
  color: #111;
}
.pdtDetail .bestReviewSrmy .controls .prev, .pdtDetail .bestReviewSrmy .controls .next {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.pdtDetail .bestReviewSrmy .controls .prev span, .pdtDetail .bestReviewSrmy .controls .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.pdtDetail .bestReviewSrmy .controls .prev.swiper-button-disabled, .pdtDetail .bestReviewSrmy .controls .next.swiper-button-disabled {
  opacity: 1;
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.pdtDetail .bestReviewSrmy .controls .prev.prev:not(.swiper-button-disabled), .pdtDetail .bestReviewSrmy .controls .prev.next.swiper-button-disabled, .pdtDetail .bestReviewSrmy .controls .next.prev:not(.swiper-button-disabled), .pdtDetail .bestReviewSrmy .controls .next.next.swiper-button-disabled {
  transform: rotate(180deg);
}
.pdtDetail .bestReviewSrmy .list li {
  display: inline-block;
  width: 439px;
  height: 165px;
  padding: 16px 20px;
  margin-right: 12px;
  vertical-align: top;
  white-space: initial;
  background: #f2f2f2;
}
.pdtDetail .bestReviewSrmy .list li .user {
  margin-right: 6px;
  font-size: 12px;
  color: #888;
}
.pdtDetail .bestReviewSrmy .list li .user strong {
  font-size: 14px;
  color: #111;
}
.pdtDetail .bestReviewSrmy .list li .grade {
  height: 15px;
  margin-top: 5px;
}
.pdtDetail .bestReviewSrmy .list li .grade em {
  width: 96px;
  height: 15px;
  line-height: 15px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span {
  height: 15px;
  line-height: 15px;
  background-size: 96px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade10 {
  width: 8px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade20 {
  width: 16px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade30 {
  width: 28px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade40 {
  width: 36px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade50 {
  width: 48px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade60 {
  width: 56px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade70 {
  width: 68px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade80 {
  width: 76px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade90 {
  width: 88px;
}
.pdtDetail .bestReviewSrmy .list li .grade em > span.grade100 {
  width: 96px;
}
.pdtDetail .bestReviewSrmy .list li .cont {
  position: relative;
  height: 74px;
  padding-right: 84px;
  margin-top: 20px;
  font-size: 14px;
  line-height: 18px;
}
.pdtDetail .bestReviewSrmy .list li .cont .thumb {
  position: absolute;
  right: 0;
  top: 0;
  overflow: hidden;
  width: 74px;
  height: 74px;
}
.pdtDetail .bestReviewSrmy .list li .cont .thumb img {
  width: 100%;
}
.pdtDetail .photoReview {
  position: relative;
  margin-top: 30px;
}
.pdtDetail .photoReview .listArea {
  position: relative;
}
.pdtDetail .photoReview .listArea .list {
  overflow: hidden;
}
.pdtDetail .photoReview .listArea .list li {
  overflow: hidden;
  float: left;
  width: 110px;
  height: 110px;
  margin-left: 20px;
  border-radius: 14px;
}
.pdtDetail .photoReview .listArea .list li:first-child {
  margin-left: 0;
}
.pdtDetail .photoReview .listArea .list li.count {
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 24px;
  line-height: 24px;
  text-align: center;
  background: rgba(0, 0, 0, 0.4);
}
.pdtDetail .photoReview .listArea .list li.count span {
  position: absolute;
  top: calc(50% - 12px);
  left: 0;
  right: 0;
  color: #fff;
}
.pdtDetail .photoReview .listArea .list li a {
  display: block;
  width: 110px;
  height: 110px;
}
.pdtDetail .reviewList {
  margin-top: 30px;
}
.pdtDetail .reviewList .listHead {
  position: relative;
  padding: 10px 24px;
  background: #F9F9F9;
}
.pdtDetail .reviewList .listHead .sort {
  position: absolute;
  right: 24px;
  top: 20px;
}

.reviewList .banner {
  padding-top: 40px;
}
.reviewList .tabTypeE {
  margin-top: 40px;
}
.reviewList .tabTypeE + .listHead {
  padding-top: 0;
}
.reviewList .tabTypeE + .listHead .total {
  top: 0;
}
.reviewList .total {
  margin-bottom: 20px;
  font-size: 20px;
}
.reviewList .listHead {
  padding-bottom: 20px;
}
.reviewList .list > li {
  position: relative;
  margin-top: 30px;
  /*.fold {display:none; margin:20px 0 -38px; font-size:14px; line-height:18px;
    a {padding-right:18px; color:#f9327b; background:url(/static/images/icon/ic_arrow6.svg) no-repeat 100% 50%;}
  }*/
}
.reviewList .list > li .icon {
  margin-bottom: 10px;
}
.reviewList .list > li .icon span {
  position: relative;
  display: inline-block;
  padding: 0 10px;
  border-radius: 14px 14px 14px 0;
  line-height: 26px;
  font-size: 12px;
  color: #fff;
  background: #f9327b;
}
.reviewList .list > li .icon span:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  border-left: 6px solid #f9327b;
  border-top: 4px solid #f9327b;
  border-right: 6px solid transparent;
  border-bottom: 4px solid transparent;
}
.reviewList .list > li .user {
  margin-bottom: 10px;
}
.reviewList .list > li .user strong {
  margin-right: 6px;
}
.reviewList .list > li .user strong + span {
  font-size: 14px;
  color: #888;
}
.reviewList .list > li .user strong + span:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -2px 10px 0;
  vertical-align: middle;
  background: #ddd;
}
.reviewList .list > li .lock:before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 18px;
  margin: -4px 8px 0 0;
  vertical-align: middle;
  line-height: 18px;
  background: url(/static/images/icon/ic_lock.svg) no-repeat 0 0;
}
.reviewList .list > li .myBtn {
  height: 25px;
  margin-top: -25px;
  text-align: right;
  line-height: 14px;
}
.reviewList .list > li .myBtn a {
  font-size: 14px;
  color: #aaa;
}
.reviewList .list > li .myBtn a + a:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 8px;
  margin: -2px 10px 0;
  vertical-align: middle;
  background: #ddd;
}
.reviewList .list > li .option {
  margin-bottom: 10px;
  font-size: 12px;
  color: #888;
}
.reviewList .list > li .grade {
  height: 15px;
}
.reviewList .list > li .grade em {
  width: 96px;
  height: 15px;
  line-height: 15px;
}
.reviewList .list > li .grade em > span {
  height: 15px;
  line-height: 15px;
  background-size: 96px;
}
.reviewList .list > li .grade em > span.grade10 {
  width: 8px;
}
.reviewList .list > li .grade em > span.grade20 {
  width: 16px;
}
.reviewList .list > li .grade em > span.grade30 {
  width: 28px;
}
.reviewList .list > li .grade em > span.grade40 {
  width: 36px;
}
.reviewList .list > li .grade em > span.grade50 {
  width: 48px;
}
.reviewList .list > li .grade em > span.grade60 {
  width: 56px;
}
.reviewList .list > li .grade em > span.grade70 {
  width: 68px;
}
.reviewList .list > li .grade em > span.grade80 {
  width: 76px;
}
.reviewList .list > li .grade em > span.grade90 {
  width: 88px;
}
.reviewList .list > li .grade em > span.grade100 {
  width: 96px;
}
.reviewList .list > li .photo {
  margin-top: 20px;
  padding-bottom: 2px;
}
.reviewList .list > li .photo li {
  display: inline-block;
  overflow: hidden;
  width: 110px;
  height: 110px;
  border-radius: 14px;
}
.reviewList .list > li .photo li + li {
  margin-left: 15px;
}
.reviewList .list > li .photo.on {
  padding-bottom: 0;
}
.reviewList .list > li .cont {
  max-height: 110px;
  margin-top: 20px;
}
.reviewList .list > li .cont .wrap {
  font-size: 14px;
  line-height: 22px;
}
.reviewList .list > li .cont.fold {
  position: relative;
  max-height: 130px;
  padding-bottom: 20px;
  cursor: pointer;
}
.reviewList .list > li .cont.fold .wrap {
  display: -webkit-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
.reviewList .list > li .cont.fold:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 13px;
  height: 7px;
  background: url(/static/images/icon/ic_arrow2.svg) no-repeat;
}
.reviewList .list > li .text {
  margin-top: 20px;
  font-size: 14px;
}
.reviewList .list > li .commentArea {
  padding-top: 20px;
}
.reviewList .list > li .commentArea .head {
  text-align: right;
}
.reviewList .list > li .commentArea .head .waiting {
  padding-left: 22px;
  margin-right: 10px;
  font-size: 14px;
  color: #666;
  line-height: 18px;
  background: url(/static/images/icon/ic_waiting.svg) no-repeat 0 50%/18px;
}
.reviewList .list > li .commentArea .head .like, .reviewList .list > li .commentArea .head .count {
  display: inline-block;
  line-height: 18px;
}
.reviewList .list > li .commentArea .head .like a, .reviewList .list > li .commentArea .head .like span, .reviewList .list > li .commentArea .head .count a, .reviewList .list > li .commentArea .head .count span {
  display: inline-block;
  padding-left: 22px;
  font-size: 14px;
  font-weight: 600;
  background: url(/static/images/icon/ic_like4.svg) no-repeat 0 50%/16px;
}
.reviewList .list > li .commentArea .head .like.count a, .reviewList .list > li .commentArea .head .like.count span, .reviewList .list > li .commentArea .head .count.count a, .reviewList .list > li .commentArea .head .count.count span {
  margin-left: 10px;
  background-image: url(/static/images/icon/ic_comment.svg);
  background-size: 18px;
}
.reviewList .list > li .commentArea .head .like.like.on a, .reviewList .list > li .commentArea .head .like.like.on span, .reviewList .list > li .commentArea .head .count.like.on a, .reviewList .list > li .commentArea .head .count.like.on span {
  background-image: url(/static/images/icon/ic_like4_on.svg);
}
.reviewList .list > li .commentArea .comment {
  display: none;
  margin-top: 20px;
  padding: 20px;
  border-radius: 14px;
  font-size: 14px;
  background: #f2f2f2;
}
.reviewList .list > li .commentArea .comment .user strong {
  font-size: 14px;
}
.reviewList .list > li .commentArea .comment .user strong + span {
  font-size: 12px;
}
.reviewList .list > li .commentArea .comment .user strong + span:before {
  display: none;
}
.reviewList .list > li .commentArea .comment:first-child {
  margin-top: 40px;
}
.reviewList .list > li > .pdt {
  padding: 20px;
  margin-top: 20px;
  border-radius: 14px;
  background: #fff;
}
.reviewList .list > li > .pdt .thumb {
  left: 20px;
}
.reviewList .list > li .buyProduct {
  float: left;
  width: calc(50% - 10px);
  margin-top: 20px;
  margin-right: 20px;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.reviewList .list > li .buyProduct > .tit {
  margin-bottom: 10px;
  font-weight: 600;
}
.reviewList .list > li .buyProduct .pdt {
  min-height: 90px;
  padding: 0;
}
.reviewList .list > li .buyProduct .pdt .thumb {
  top: 0;
}
.reviewList .list > li .srmy {
  float: left;
  width: calc(50% - 10px);
  min-height: 166px;
  padding: 10px 20px 20px;
  margin-top: 20px;
  border-radius: 14px;
  border: 1px solid #ddd;
}
.reviewList .list > li .srmy li {
  margin-top: 10px;
  overflow: hidden;
}
.reviewList .list > li .srmy li .q {
  float: left;
  width: 50%;
  font-size: 14px;
  color: #888;
}
.reviewList .list > li .srmy li .a {
  float: left;
  width: 50%;
  font-size: 14px;
  text-align: right;
}
.reviewList .list > li.on .cont {
  max-height: initial;
}
.reviewList .list > li.on .cont .wrap {
  -webkit-line-clamp: initial;
  max-height: initial;
}
.reviewList .list > li.on .cont:after {
  transform: rotate(180deg);
}
.reviewList .list > li.on .commentArea .comment {
  display: block;
}
.reviewList .list > li + li {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #ddd;
}

.pdtBtn {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 30;
  display: table;
  width: 100%;
  height: 84px;
  padding: 15px 10px;
  table-layout: fixed;
  box-shadow: -2px -3px 30px 0 rgba(0, 0, 0, 0.1);
  background: #fff;
}
.pdtBtn span {
  display: table-cell;
  padding: 0 5px;
}
.pdtBtn span a {
  display: inline-block;
  width: 100%;
  padding: 0;
}
.pdtBtn span a.giftBtn {
  border-color: #f9327b;
  color: #f9327b;
  font-size: 14px;
}
.pdtBtn span a.giftBtn:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 16px;
  margin: -4px 4px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_gift.svg) no-repeat 0 0/100%;
}
.pdtBtn span a.routineBtn {
  font-size: 14px;
}
.pdtBtn span a.routineBtn:before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: -4px 4px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_delivery.svg) no-repeat 0 0/100%;
}
.pdtBtn span a.restockBtn {
  font-size: 14px;
}
.pdtBtn span a.restockBtn:before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 17px;
  margin: -4px 4px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_alram.svg) no-repeat 0 0/100%;
}
.pdtBtn span a.orderBtn {
  border-radius: 14px;
  color: #fff;
  font-weight: 600;
  text-align: center;
  background-image: linear-gradient(117deg, #fe9c47 1%, #f9327b 58%, #c433ae 107%);
}
.pdtBtn span.smallBtn {
  width: 100px;
}

.quickOrder {
  position: absolute;
  left: calc(50% + 290px);
  top: 0;
  width: 350px;
  z-index: 1;
  height: 100%;
  min-height: 372px;
  padding: 80px 20px 114px;
  border: 1px solid #ddd;
  border-top: 0;
  border-radius: 0 0 30px 30px;
  background: #fff;
  transition: all 0.2s;
}
.quickOrder .content {
  opacity: 0;
  position: relative;
  padding-bottom: 178px;
  transition: all 0.2s;
}
.quickOrder .content .scr {
  overflow-y: auto;
  height: 100%;
  padding-right: 15px;
  margin-right: -15px;
}
.quickOrder .content .scr .soldout {
  color: #aaa;
}
.quickOrder .content .scr .selArea {
  margin-bottom: 20px;
}
.quickOrder .content .scr .selArea + .selArea {
  margin-top: -10px;
}
.quickOrder .content .scr .optionList {
  padding-right: 8px;
  margin-right: -8px;
}
.quickOrder .content .scr .optionList li {
  position: relative;
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.quickOrder .content .scr .optionList li .tit {
  margin: 0 40px 20px 0;
  font-size: 14px;
  line-height: 22px;
}
.quickOrder .content .scr .optionList li .price {
  position: absolute;
  right: 20px;
  bottom: 20px;
  font-size: 12px;
  line-height: 20px;
}
.quickOrder .content .scr .optionList li .price strong {
  font-size: 20px;
}
.quickOrder .content .scr .optionList li .del {
  position: absolute;
  right: 20px;
  top: 23px;
}
.quickOrder .content .scr .optionList li + li {
  margin-top: 10px;
}
.quickOrder .content .scr .optionList li.soldout *:not(.colorA) {
  color: #aaa;
}
.quickOrder .content .scr .optionList li.soldout .del {
  opacity: 0.4;
}
.quickOrder .content .total {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding-top: 30px;
  border-top: 1px solid #ddd;
  transition: all 0.2s;
}
.quickOrder .content .total .discount {
  position: relative;
  font-size: 12px;
  text-align: right;
}
.quickOrder .content .total .discount .tit {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 14px;
}
.quickOrder .content .total .discount .tit .btn {
  display: inline-block;
  padding: 0 10px;
  margin: -7px 0 0 6px;
  border-radius: 10px;
  line-height: 32px;
  color: #fff;
  font-size: 12px;
  vertical-align: top;
  background: #444;
}
.quickOrder .content .total .discount strong {
  font-size: 16px;
}
.quickOrder .content .total .price {
  position: relative;
  padding-top: 10px;
  margin-top: 20px;
  text-align: right;
}
.quickOrder .content .total .price .tit {
  position: absolute;
  left: 0;
  top: 10px;
}
.quickOrder .content .total .price strong {
  font-size: 20px;
  line-height: 20px;
}
.quickOrder .content .total .cartType {
  overflow: hidden;
  margin-top: 30px;
  text-align: center;
}
.quickOrder .content .total .cartType label:nth-child(1) {
  float: left;
}
.quickOrder .content .total .cartType label:nth-child(3) {
  float: right;
}
.quickOrder .btnArea {
  opacity: 0;
  position: absolute;
  left: 20px;
  top: 500px;
  right: 20px;
  display: table;
  width: calc(100% - 40px);
  table-layout: fixed;
  margin-top: 0;
  transition: all 0.2s;
}
.quickOrder .btnArea .cartBtn {
  display: table;
  width: 100%;
  table-layout: fixed;
}
.quickOrder .btnArea span {
  display: table-cell;
  padding: 0 3px;
}
.quickOrder .btnArea span a {
  display: inline-block;
  width: 100%;
  min-width: 1px;
  padding: 0;
}
.quickOrder .btnArea span a.orderBtn {
  border-radius: 14px;
  color: #fff;
  font-weight: 600;
  background-image: linear-gradient(117deg, #fe9c47 1%, #f9327b 58%, #c433ae 107%);
}
.quickOrder.fix {
  position: fixed;
  top: 126px;
  height: calc(100% - 126px);
  border-bottom: 0;
  border-radius: 0;
}
.quickOrder.fix .content {
  height: 100%;
}
.quickOrder.fix .btnArea {
  top: initial !important;
  bottom: 30px;
}
.quickOrder.fixBottom {
  position: fixed;
  top: 126px;
  height: calc(100% - 474px);
}
.quickOrder.fixBottom .content {
  height: 100%;
}
.quickOrder.fixBottom .btnArea {
  top: initial !important;
  bottom: 30px;
}

/*#header.isTopBanner ~#container {
  .quickOrder {margin-top:100px;
    &.fix {top:179px; height:calc(100% - 179px);}
    &.fixBottom {top:179px; height:calc(100% - 527px);}
  }
}
#wrapper.fix {
  .quickOrder {margin-top:0 !important;}
}*/
.zoomPhotoLayer {
  top: 0;
  overflow: visible !important;
  width: 670px;
  height: 100%;
  max-height: 100%;
  margin-left: -335px;
  border-radius: 0;
  background: #000;
}
.zoomPhotoLayer .close {
  top: 20px;
  right: -40px;
}
.zoomPhotoLayer .close a {
  width: 24px;
  height: 24px;
  background-image: url(/static/images/icon/ic_close3.svg);
  background-size: 100%;
}
.zoomPhotoLayer .thumbArea {
  padding-top: 46px;
}
.zoomPhotoLayer .thumbArea .slideCont {
  text-align: center;
}
.zoomPhotoLayer .thumbArea .slideCont img {
  width: 100%;
  vertical-align: middle;
}
.zoomPhotoLayer .prev, .zoomPhotoLayer .next {
  position: absolute;
  left: -140px;
  top: calc(50% - 47px);
}
.zoomPhotoLayer .prev.next, .zoomPhotoLayer .next.next {
  left: initial;
  right: -140px;
}
.zoomPhotoLayer .prev.swiper-button-disabled, .zoomPhotoLayer .next.swiper-button-disabled {
  opacity: 0.3;
}

.dealDetailLayer {
  width: 890px;
  height: 100%;
  border-radius: 0;
}
.dealDetailLayer .info {
  position: relative;
  margin: 76px 15px 10px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.dealDetailLayer .info a.icoFold {
  display: block;
  height: 54px;
  padding: 0 50px 0 20px;
  line-height: 54px;
  font-weight: 600;
}
.dealDetailLayer .info a.icoFold:before, .dealDetailLayer .info a.icoFold:after {
  right: 20px;
}
.dealDetailLayer .info a.icoFold:before {
  right: 23px;
}
.dealDetailLayer .info .list {
  display: none;
  position: absolute;
  left: -1px;
  top: 54px;
  right: -1px;
  z-index: 10;
  border: 1px solid #111;
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: #fff;
}
.dealDetailLayer .info .list li {
  padding: 20px;
  font-size: 14px;
}
.dealDetailLayer .info .list li + li {
  border-top: 1px solid #eee;
}
.dealDetailLayer .info.on {
  border-color: #111;
  border-radius: 14px 14px 0 0;
}

.shareLayer {
  width: 400px;
  height: 600px;
  border-radius: 0;
  background: none;
}
.shareLayer .content {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  max-height: 100% !important;
  padding: 0;
}
.shareLayer .content .thumb {
  overflow: hidden;
  width: 135px;
  height: 135px;
  border-radius: 10px;
  margin: 0 auto 20px;
}
.shareLayer .content .pname {
  width: 145px;
  margin: 0 auto;
  font-size: 14px;
  line-height: 22px;
  color: #fff;
  text-align: center;
}
.shareLayer .content .share {
  margin: 140px auto 0;
  text-align: center;
  font-size: 0;
}
.shareLayer .content .share li {
  display: inline-block;
  margin: 0 10px;
}
.shareLayer .content .share li a {
  color: #fff;
  font-size: 14px;
}
.shareLayer .content .share li img {
  display: block;
  width: 64px;
  margin: 0 auto 5px;
}
.shareLayer .close {
  top: initial;
  right: initial;
  left: calc(50% - 8px);
  bottom: calc(50% - 260px);
}
.shareLayer .close a {
  background-image: url(/static/images/icon/ic_close3.svg);
}

.popLayer.photoReviewList .close {
  right: 60px;
}
.popLayer.reviewView {
  background: none;
  width: 1324px !important;
  margin-left: -662px !important;
}
.popLayer.reviewView .close {
  right: 180px;
}
.popLayer.reviewView .close a {
  width: 30px;
  height: 30px;
  background-size: 100%;
}

/* 검색 */
.searchArea h2 {
  margin-top: 30px;
  font-weight: 600;
  line-height: 16px;
}
.searchArea h2 + .text {
  height: 16px;
  margin-top: -16px;
  line-height: 16px;
  text-align: right;
  font-size: 14px;
  color: #aaa;
}
.searchArea h2 + .text a {
  color: #aaa;
}
.searchArea .recent {
  overflow: hidden;
  margin-top: 10px;
}
.searchArea .recent li {
  position: relative;
  float: left;
  width: calc(50% - 10px);
  height: 40px;
  padding: 0 20px 0 5px;
  border-bottom: 1px solid #ddd;
  line-height: 39px;
  font-size: 14px;
}
.searchArea .recent li img {
  position: absolute;
  right: 5px;
  top: calc(50% - 5px);
}
.searchArea .recent li:nth-child(2n) {
  float: right;
}
.searchArea .noData {
  margin: 30px 0 40px;
  color: #888;
}
.searchArea .ranking {
  margin-top: 10px;
  column-count: 2;
  column-gap: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #ddd;
}
.searchArea .ranking li {
  position: relative;
  padding-left: 30px;
  line-height: 40px;
}
.searchArea .ranking li span {
  position: absolute;
  left: 0;
  width: 20px;
  text-align: center;
  font-family: "Roboto";
  font-style: italic;
  font-weight: 600;
  color: #888;
}
.searchArea .recommendPdt h2 {
  line-height: 1em;
}

.searchPage h1 {
  width: 1280px;
  height: 130px;
  margin: 0 auto;
  border-bottom: 2px solid #111;
  text-align: center;
  font-size: 34px !important;
  font-weight: 400;
  line-height: 128px;
}
.searchPage .noData {
  margin-top: 140px;
}

.checkBtn {
  position: relative;
  margin-top: -10px;
  margin-bottom: 45px;
  font-size: 0;
}
.checkBtn .wrap {
  overflow: hidden;
  height: 83px;
}
.checkBtn .wrap:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding-top: 31px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, rgb(255, 255, 255) 31px);
}
.checkBtn label {
  display: inline-block;
  margin: 10px 10px 0 0;
}
.checkBtn label input[type=checkbox] + span {
  padding: 0 16px;
  border: 1px solid #ddd;
  border-radius: 10px;
  line-height: 40px;
  font-size: 16px;
  background: #fff;
}
.checkBtn label input[type=checkbox] + span:before {
  display: none;
}
.checkBtn label input:checked + span {
  border-color: #f9327b;
  color: #fff;
  background: #f9327b;
}
.checkBtn + .filterWords {
  margin-top: -20px;
}
.checkBtn .control {
  position: absolute;
  right: -30px;
  top: 41px;
  transition: all 0.2s;
}
.checkBtn .control img {
  width: 30px;
}
.checkBtn.on .wrap {
  height: auto;
}
.checkBtn.on .wrap:after {
  display: none;
}
.checkBtn.on .control {
  transform: rotate(180deg);
}

/* 브랜드 */
.brandInfo {
  text-align: center;
}
.brandInfo .banner {
  margin-bottom: 80px;
}
.brandInfo .logo {
  margin-bottom: 30px;
  vertical-align: middle;
}
.brandInfo .logo img {
  height: 140px;
}
.brandInfo .brand {
  display: inline-block;
  margin-right: 20px;
  font-size: 18px;
  font-weight: 600;
}
.brandInfo .share {
  display: inline-block;
  vertical-align: middle;
}
.brandInfo .text {
  width: 980px;
  padding-top: 30px;
  margin: 0 auto;
  color: #666;
}
.brandInfo .text strong {
  display: block;
  margin-bottom: 30px;
  color: #111;
}
.brandInfo .mvArea {
  padding: 60px 0;
  margin-top: 80px;
  background: #f2f2f2;
}
.brandInfo .mvArea .mv {
  width: 850px;
  margin: 0 auto;
}
.brandInfo .mvArea .mv .wrap {
  position: relative;
  overflow: hidden;
  padding-top: 56.25%;
}
.brandInfo .mvArea .mv .wrap iframe {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.brandIndex .recommendPdt {
  width: 1280px;
  padding-top: 80px;
  margin: 0 auto;
}
.brandIndex .btnMore {
  text-align: center;
  margin: 100px auto;
}
.brandIndex .btnMore a {
  min-width: 250px;
  padding: 0 30px;
}
.brandIndex .brandReview {
  padding: 100px 0 150px;
  margin-bottom: -150px;
  background: #f2f2f2;
}
.brandIndex .brandReview > .wrap {
  width: 1280px;
  margin: 0 auto;
}
.brandIndex .brandReview > .wrap h2 {
  font-size: 28px !important;
  font-weight: 600;
}
.brandIndex .brandReview > .wrap .more {
  margin-top: -24px;
  text-align: right;
}
.brandIndex .brandReview > .wrap .more a {
  padding-right: 24px;
  background: url(/static/images/icon/ic_arrow10.svg) no-repeat 100% 50%;
}
.brandIndex .brandReview > .wrap .reviewList {
  margin-top: 30px;
  border-top: 0;
}
.brandIndex .brandReview > .wrap .reviewList .list > li {
  padding: 20px 30px;
  border-top: 0;
  border-radius: 14px;
  background: #fff;
}

/* 베스트 */
.cateTab {
  margin: 40px 0;
}

/********** 2_주문 **********/
.orderStep {
  height: 40px;
  margin-top: -40px;
  margin-bottom: 30px;
  text-align: right;
}
.orderStep li {
  display: inline-block;
  color: #aaa;
}
.orderStep li:after {
  content: "";
  opacity: 0.4;
  display: inline-block;
  width: 7px;
  height: 13px;
  margin: -3px 14px 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow11.svg) no-repeat 0 0/100%;
}
.orderStep li:last-child:after {
  display: none;
}
.orderStep li.on {
  color: #111;
}
.orderStep li.on:after {
  opacity: 1;
}

#cartCont {
  width: 934px;
}
#cartCont .orderBanner {
  overflow: hidden;
  margin: 5px 0 15px;
  border-radius: 14px;
}
#cartCont .cartHead {
  padding: 5px 0 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #bbb;
}
#cartCont .cartHead .fl button {
  display: inline-block;
  line-height: 30px;
  padding: 0 16px;
  margin: -2px 0 0 10px;
  border: 1px solid #666;
  border-radius: 8px;
  font-size: 12px;
  background: #fff;
}
#cartCont .cartHead .fl button:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 9px;
  margin: -3px 0 0 6px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow.svg) no-repeat;
}
#cartCont .cartHead .del {
  float: right;
  color: #888;
}
#cartCont .cartHead:after {
  content: "";
  display: block;
  clear: both;
}
#cartCont .cartByType h2 {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 600;
}
#cartCont .cartByType .orderPdtList {
  padding: 0 30px;
  border-radius: 14px;
  background: #fff;
}
#cartCont .cartByType .orderPdtList .label {
  padding-bottom: 5px;
}
#cartCont .cartByType .orderPdtList .label span {
  display: inline-block;
  padding: 0 5px;
  line-height: 21px;
  border-radius: 2px;
  font-size: 12px;
  color: #f9327b;
  background: #f0f1f4;
}
#cartCont .cartByType .orderPdtList .total {
  overflow: hidden;
  padding: 20px 0;
  text-align: right;
}
#cartCont .cartByType .orderPdtList .total .text {
  float: left;
  padding-top: 2px;
  font-size: 14px;
}
#cartCont .cartByType .orderPdtList .total .text .link {
  margin-left: 6px;
}
#cartCont .cartByType + .cartByType {
  margin-top: 30px;
}
#cartCont .recommendPdt {
  margin-top: 30px;
  padding: 30px;
  border-radius: 14px;
  background: #fff;
}
#cartCont .recommendPdt .pdtList li {
  margin: 0 7px 0 0;
}
#cartCont .cartBanner {
  margin-top: 20px;
}

.quickTotal {
  position: absolute;
  right: 0;
  top: 135px;
  width: 306px;
}
.quickTotal h2 {
  font-size: 20px !important;
}
.quickTotal .orderPdtList {
  padding: 20px;
  border-radius: 14px;
  background: #fff;
}
.quickTotal .orderPdtList .list {
  overflow-y: auto;
  max-height: 240px;
  margin-top: 20px;
  margin-right: -15px;
  padding-right: 15px;
}
.quickTotal .orderPdtList .list .pdt {
  min-height: 90px;
}
.quickTotal .orderPdtList .list .pdt .thumb {
  width: 50px;
  height: 50px;
}
.quickTotal .orderPdtList .list .pdt .content {
  padding-left: 65px;
}
.quickTotal .orderPdtList .list .pdt .content .tit {
  font-size: 14px;
}
.quickTotal .orderPdtList .list .pdt .content .option {
  font-size: 12px;
}
.quickTotal .orderPdtList .list .pdt .content .price {
  font-size: 12px;
}
.quickTotal .orderPdtList .list .pdt .content .price .num {
  font-size: 14px;
}
.quickTotal .orderPdtList .list .pdt + .pdt {
  border-top: 1px solid #ccc;
}
.quickTotal .orderPdtList .list .pdt:first-child {
  min-height: 70px;
  padding-top: 0;
}
.quickTotal .orderPdtList .list .pdt:first-child .thumb {
  top: 0;
}
.quickTotal .orderPdtList ~ .orderSrmyArea {
  margin-top: 10px;
}
.quickTotal .orderSrmyArea {
  padding: 20px;
  border-radius: 14px;
  background: #fff;
}
.quickTotal .orderSrmyArea .content dl {
  position: relative;
  padding-top: 20px;
}
.quickTotal .orderSrmyArea .content dl dt {
  position: absolute;
  left: 0;
  font-size: 14px;
}
.quickTotal .orderSrmyArea .content dl dd {
  margin-bottom: 15px;
  text-align: right;
}
.quickTotal .orderSrmyArea .content dl dd.price {
  font-size: 14px;
}
.quickTotal .orderSrmyArea .content dl dd .num {
  font-size: 18px;
}
.quickTotal .orderSrmyArea .content dl dd .btnTypeF {
  height: 26px;
  padding: 0 10px;
  margin-top: 4px;
  font-size: 12px;
  line-height: 24px;
}
.quickTotal .orderSrmyArea .content dl dt.total {
  padding-top: 33px;
  font-size: 16px;
}
.quickTotal .orderSrmyArea .content dl dd.total {
  padding-top: 30px;
  border-top: 1px solid #111;
  font-size: 16px;
}
.quickTotal .orderSrmyArea .content dl dd.total .num {
  font-size: 28px;
  font-weight: 600;
}
.quickTotal .orderSrmyArea .content dl dd.total:last-child {
  margin-bottom: 0;
}
.quickTotal .orderSrmyArea .content .txt {
  margin-top: 10px;
  text-align: right;
  font-size: 12px;
  color: #888;
  line-height: 1em;
}
.quickTotal .orderSrmyArea ~ .cautionArea {
  margin-top: 30px;
}
.quickTotal .finalArea {
  padding: 20px;
  margin-top: 10px;
  border-radius: 14px;
  background: #fff;
}
.quickTotal .finalArea .agree {
  margin-bottom: 20px;
}
.quickTotal .finalArea .agree .tit {
  position: relative;
  font-size: 14px;
}
.quickTotal .finalArea .agree .tit .icoFold {
  position: absolute;
  right: 10px;
  top: 3px;
  width: 15px;
  height: 15px;
  padding-right: 0;
}
.quickTotal .finalArea .agree .tit .icoFold:before, .quickTotal .finalArea .agree .tit .icoFold:after {
  width: 8px;
}
.quickTotal .finalArea .agree .tit .icoFold:before {
  right: 3px;
}
.quickTotal .finalArea .agree .tit .go {
  position: absolute;
  right: 0;
  top: 20px;
  font-size: 12px;
  color: #888;
  text-decoration: underline;
}
.quickTotal .finalArea .agree .cont {
  padding-top: 5px;
}
.quickTotal .finalArea .agree .cont p {
  position: relative;
  padding-right: 30px;
  margin-top: 10px;
  font-size: 14px;
  color: #666;
}
.quickTotal .finalArea .agree .cont p label span {
  position: relative;
  padding-left: 30px;
}
.quickTotal .finalArea .agree .cont p label span:before {
  position: absolute;
  left: 0;
  top: 0;
}
.quickTotal .finalArea .agree .cont p a {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 12px;
  color: #888;
  text-decoration: underline;
}
.quickTotal .btnArea {
  margin-top: 10px;
}
.quickTotal .btnArea > a, .quickTotal .btnArea > span {
  width: 100%;
}
.quickTotal .btnArea .disabled {
  border-color: #bbb;
  background-color: #bbb;
}
.quickTotal.fix {
  position: fixed;
  top: 146px;
  left: calc(50% + 334px);
}
.quickTotal.fixBottom {
  position: absolute;
  top: initial !important;
  bottom: 30px;
}

/*#header.isTopBanner ~#container {
  .quickTotal {
    &.fix {top:204px;}
  }
}*/
#wrapper.fix .quickOrder {
  margin-top: 0 !important;
}

.optionModifyLayer {
  width: 480px;
}
.optionModifyLayer h1 {
  text-align: center;
}
.optionModifyLayer .content {
  overflow-y: hidden;
  height: 400px;
}
.optionModifyLayer .content .selArea {
  margin-top: 15px;
}
.optionModifyLayer .content .selArea .list {
  z-index: 100;
}

/* 주문서 */
.cartWrap {
  padding: 30px;
  border-radius: 14px;
  background: #fff;
}
.cartWrap ~ .cautionArea {
  width: 934px;
}
.cartWrap ~ .quickTotal {
  top: 70px;
}
.cartWrap ~ .quickTotal.fix {
  position: fixed;
  top: 104px;
  left: calc(50% + 334px);
}
.cartWrap ~ .quickTotal.fixBottom {
  top: initial !important;
  bottom: 30px;
}
.cartWrap ~ .footBtn {
  margin-top: 15px;
}
.cartWrap ~ .footBtn a.btnTypeE {
  height: 32px;
  line-height: 30px;
  padding: 0 20px;
  border-radius: 10px;
}
.cartWrap h2.typeA {
  height: 55px;
  margin-top: 65px;
  border-bottom: 1px solid #ccc;
  font-size: 24px !important;
}
.cartWrap h2.typeA:first-child {
  margin-top: 0;
}
.cartWrap h2.typeA ~ .btns {
  height: 54px;
  margin-top: -54px;
  text-align: right;
}
.cartWrap h2.typeA ~ .btns .btn {
  display: inline-block;
  padding: 0 10px;
  border-radius: 10px;
  line-height: 32px;
  color: #fff;
  font-size: 12px;
  background: #f9327b;
}
.cartWrap span > h2.typeA:first-child {
  margin-top: 65px;
}
.cartWrap .ordererSrmy {
  height: 50px;
  margin-top: -50px;
  text-align: right;
}
.cartWrap .ordererSrmy p {
  display: inline-block;
  vertical-align: top;
}
.cartWrap .ordererSrmy p + p:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -2px 10px 0 6px;
  vertical-align: middle;
  background: #ddd;
}
.cartWrap .ordererSrmy .icoFold {
  display: inline-block;
}
.cartWrap .ordererSrmy .icoFold span {
  overflow: hidden;
  display: block;
  width: 20px;
  text-indent: 100%;
  white-space: nowrap;
}
.cartWrap .fieldArea {
  margin-top: 20px;
}
.cartWrap .fieldArea .field + .field {
  margin-top: 20px;
}
.cartWrap .fieldArea .field[style$="none;"] + .field {
  margin-top: 10px;
}
.cartWrap .noDelivery {
  position: relative;
  padding: 25px 20px 25px 30px;
  margin-top: 20px;
  border-radius: 14px;
  font-size: 14px;
  line-height: 48px;
  color: #aaa;
  background: #f2f2f2;
}
.cartWrap .noDelivery strong {
  margin-right: 20px;
  font-size: 16px;
  color: #111;
}
.cartWrap .noDelivery a {
  position: absolute;
  right: 20px;
  top: 25px;
  width: 170px;
}
.cartWrap .noRoutine {
  position: relative;
  padding: 25px 20px 25px 30px;
  margin: 20px 0;
  border-radius: 14px;
  font-weight: 500;
  line-height: 48px;
  background: #f2f2f2;
}
.cartWrap .noRoutine a {
  position: absolute;
  right: 20px;
  top: 25px;
  width: 170px;
}
.cartWrap .routineSrmy {
  position: relative;
  padding: 30px 20px;
  margin: 20px 0;
  border-radius: 14px;
  color: #666;
  text-align: center;
  background: #f2f2f2;
}
.cartWrap .routineSrmy .btn {
  position: absolute;
  right: 0;
  top: -64px;
}
.cartWrap .routineSrmy .btn a {
  color: #f9327b;
  font-size: 14px;
  line-height: 15px;
  text-decoration: underline;
}
.cartWrap .routineSrmy .num {
  margin-left: 10px;
}
.cartWrap .routineSrmy p:not(.btn) {
  display: inline-block;
  margin-left: 20px;
  font-size: 18px;
}
.cartWrap .routineSrmy p:not(.btn) > span {
  position: relative;
}
.cartWrap .routineSrmy p:not(.btn) > span:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  opacity: 0.5;
  height: 10px;
  border-radius: 4px;
  background: #f9327b;
}
.cartWrap .addrArea {
  position: relative;
  padding-top: 1px;
  padding-left: 180px;
  margin-top: 20px;
}
.cartWrap .addrArea h3 {
  position: absolute;
  left: 0;
  padding-top: 3px;
  color: #666;
}
.cartWrap .addrArea .btn {
  position: relative;
  height: 64px;
  margin-top: -64px;
  text-align: right;
}
.cartWrap .addrArea .btn a {
  color: #f9327b;
  font-size: 14px;
  text-decoration: underline;
}
.cartWrap .addrArea .name {
  margin-top: 10px;
  font-size: 14px;
}
.cartWrap .addrArea .name .num:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -2px 10px 0;
  vertical-align: middle;
  background: #ddd;
}
.cartWrap .addrArea .name .default {
  display: inline-block;
  margin-left: 20px;
}
.cartWrap .addrArea .name .default em {
  display: inline-block;
  padding: 0 10px;
  border-radius: 13px;
  font-size: 12px;
  color: #666;
  line-height: 26px;
  background: #eee;
}
.cartWrap .addrArea .addr {
  margin-top: 15px;
  line-height: 26px;
}
.cartWrap .addrArea .addrSel {
  margin-top: 15px;
}
.cartWrap .addrArea .addrSel select {
  display: block;
}
.cartWrap .addrArea .addrSel textarea {
  display: block;
  width: 100%;
  height: 100px;
  margin-top: 10px;
}
.cartWrap .addrArea.dn + .caution {
  margin-left: 0;
}
.cartWrap .benefit {
  width: 520px;
  margin-top: 20px;
}
.cartWrap .benefit > li {
  position: relative;
  margin-bottom: 30px;
}
.cartWrap .benefit > li .tit {
  position: absolute;
  left: 0;
  padding-top: 3px;
  color: #666;
}
.cartWrap .benefit > li .tit.withFieldType {
  padding-top: 12px;
}
.cartWrap .benefit > li .tit.block {
  position: static;
  margin-bottom: 30px;
}
.cartWrap .benefit > li .tit.includeDetailBtn {
  padding-right: 30px;
}
.cartWrap .benefit > li .tit.includeDetailBtn a {
  position: absolute;
  right: 0;
  top: 12px;
  font-size: 14px;
  color: #888;
  text-decoration: underline;
}
.cartWrap .benefit > li .cont {
  position: relative;
  padding-left: 180px;
}
.cartWrap .benefit > li .cont .btns {
  position: absolute;
  right: 0;
  top: 0;
}
.cartWrap .benefit > li .cont .btn {
  display: inline-block;
  padding: 0 10px;
  margin-left: 12px;
  border-radius: 10px;
  line-height: 32px;
  color: #fff;
  font-size: 12px;
  background: #666;
}
.cartWrap .benefit > li .cont .btn.typeB {
  background: #f9327b;
}
.cartWrap .benefit > li .cont .btn + .btn {
  margin-left: 2px;
}
.cartWrap .benefit > li .cont .txt {
  margin-top: 6px;
  font-size: 14px;
  color: #888;
}
.cartWrap .benefit > li .cont .txt + .txt {
  margin-top: 2px;
}
.cartWrap .benefit > li .cont .pointSet {
  position: relative;
  overflow: hidden;
  padding-right: 100px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.cartWrap .benefit > li .cont .pointSet .fontA {
  position: relative;
  display: block;
  line-height: 46px;
  text-align: left;
}
.cartWrap .benefit > li .cont .pointSet .fontA input {
  width: calc(100% - 25px);
  height: 46px;
  padding: 0;
  border: 0;
  vertical-align: top;
}
.cartWrap .benefit > li .cont .pointSet .fontA input:not(.ar) {
  width: 100%;
  padding-left: 15px;
}
.cartWrap .benefit > li .cont .pointSet a {
  position: absolute;
  right: 0;
  top: 0;
  width: 80px;
  height: 46px;
  font-size: 14px;
  text-align: center;
  line-height: 46px;
  background: #ddd;
}
.cartWrap .benefit > li .cont .pointSet.cancel {
  overflow: visible;
  background: #ddd;
}
.cartWrap .benefit > li .cont .pointSet.cancel input {
  background: #ddd;
}
.cartWrap .benefit > li .cont .pointSet.cancel a {
  right: -1px;
  top: -1px;
  width: 81px;
  height: 48px;
  line-height: 48px;
  border-radius: 0 14px 14px 0;
  color: #fff;
  background: #111;
}
.cartWrap .benefit > li .pwd {
  position: relative;
  overflow: hidden;
  padding-right: 80px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.cartWrap .benefit > li .pwd input {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 46px;
  padding: 12px 20px;
  border: 0;
  line-height: 22px;
  background: none;
}
.cartWrap .benefit > li .pwd span {
  position: absolute;
  left: 20px;
  top: 12px;
  line-height: 22px;
  color: #aaa;
}
.cartWrap .benefit > li .pwd input:focus + span, .cartWrap .benefit > li .pwd input.isVal + span {
  display: none;
}
.cartWrap .benefit > li .pwd a {
  position: absolute;
  right: 0;
  top: 0;
  width: 80px;
  height: 46px;
  font-size: 14px;
  text-align: center;
  line-height: 46px;
  background: #ddd;
}
.cartWrap .benefit > li .btnTypeC.sizeA {
  width: 100%;
}
.cartWrap .benefit > li .caution {
  margin-top: 10px;
}
.cartWrap .benefit.uplusMembership {
  text-align: left;
}
.cartWrap .benefit.uplusMembership .labelWrap input[type=number] {
  width: 100%;
}
.cartWrap .benefit.uplusMembership .cardNum {
  overflow: hidden;
  width: calc(100% + 8px);
  margin-right: -8px;
  margin-bottom: 20px;
}
.cartWrap .benefit.uplusMembership .cardNum input[type=number] {
  float: left;
  width: calc(25% - 8px);
  margin-right: 8px;
}
.cartWrap .benefit.uplusMembership .formTypeA {
  margin-bottom: 20px;
}
.cartWrap .benefit.uplusMembership .formTypeA th {
  width: 80px;
}
.cartWrap .benefit.uplusMembership .foot {
  overflow: hidden;
  text-align: right;
}
.cartWrap .benefit.uplusMembership .foot label {
  float: left;
  line-height: 48px;
}
.cartWrap .benefit.uplusMembership .foot .btnTypeC {
  width: 140px;
  margin-left: 20px;
}
.cartWrap .benefit.uplusMembership .caution {
  margin: 15px 0 0;
}
.cartWrap .routineDiscount {
  position: relative;
  margin-bottom: 30px;
}
.cartWrap .routineDiscount dt {
  position: absolute;
  left: 0;
  color: #888;
}
.cartWrap .routineDiscount dd {
  margin-bottom: 15px;
  text-align: right;
  font-size: 14px;
}
.cartWrap h3.typeA {
  position: relative;
  width: 520px;
  margin-bottom: 10px;
  color: #111;
  font-size: 18px;
}
.cartWrap h3.typeA a {
  position: absolute;
  right: 0;
  top: -10px;
  width: 140px;
}
.cartWrap .total {
  position: relative;
  text-align: right;
}
.cartWrap .total .tit {
  position: absolute;
  left: 0;
  padding-top: 3px;
  font-weight: 500;
}
.cartWrap .total .cont {
  padding-left: 100px;
  font-size: 20px;
}
.cartWrap .caution {
  margin: 15px 0 0 180px;
}
.cartWrap .caution + h3 {
  margin-top: 30px;
}
.cartWrap .caution:only-child {
  margin: 15px 0 0;
}
.cartWrap .cashReceipt ul li {
  display: inline-block;
  margin: 15px 30px 0 0;
}
.cartWrap .cashReceipt .fieldArea {
  margin-top: 10px;
}
.cartWrap .payBenefit {
  padding: 15px 20px;
  margin-top: 20px;
  border-radius: 10px;
  font-size: 14px;
  color: #111;
  background: #f2f2f2;
}
.cartWrap .payBenefit .tit {
  margin-bottom: 3px;
  font-size: 15px;
  color: #111;
}
.cartWrap .payBenefit .tit .label {
  display: inline-block;
  padding: 0 10px;
  margin-right: 2px;
  border-radius: 6px;
  line-height: 22px;
  font-size: 12px;
  color: #fff;
  vertical-align: top;
  background: #f9327b;
}
.cartWrap .paymentType {
  margin: 10px -5px 0;
}
.cartWrap .paymentType li {
  position: relative;
  float: left;
  width: 33.3%;
  padding: 0 5px;
  margin-top: 10px;
}
.cartWrap .paymentType li label {
  overflow: hidden;
  display: table;
  width: 100%;
}
.cartWrap .paymentType li label input {
  position: absolute;
  left: -100px;
  top: -100px;
}
.cartWrap .paymentType li label span {
  display: table-cell;
  width: 100%;
  height: 48px;
  padding: 0;
  border: 1px solid #ddd;
  border-radius: 10px;
  color: #888;
  font-size: 14px;
  vertical-align: middle;
  text-align: center;
  background: #fff;
}
.cartWrap .paymentType li label span:before {
  display: none;
}
.cartWrap .paymentType li label span .fontA {
  font-size: 16px;
}
.cartWrap .paymentType li label input:checked + span {
  border-color: #111;
  color: #fff;
  background: #111;
}
.cartWrap .paymentType li .balloonLabel {
  position: absolute;
  left: 16px;
  top: -10px;
  line-height: 26px;
  padding: 0 8px;
  border-radius: 14px 14px 14px 0;
  font-size: 12px;
  font-weight: 400;
}
.cartWrap .paymentType li .balloonLabel:before {
  bottom: -6px;
  border-left-width: 10px;
  border-top-width: 6px;
  border-right-width: 10px;
  border-bottom-width: 6px;
}
.cartWrap .paymentType:after {
  content: "";
  display: block;
  clear: both;
}
.cartWrap .save {
  margin: 20px 0;
  font-size: 14px;
  color: #888;
}
.cartWrap .orderSrmyArea {
  padding: 0 15px;
  margin: 30px -15px 0;
  border-top: 10px solid #f2f2f2;
}
.cartWrap .orderSrmyArea h2 {
  padding: 30px 0 20px;
  font-size: 20px !important;
}

/* 선물하기 */
.letterArea .letter {
  overflow: hidden;
  text-align: center;
}
.letterArea .letter > h2 {
  padding: 20px 0;
  text-align: center;
  font-size: 18px !important;
  font-weight: 600;
}
.letterArea .letter img {
  border-radius: 14px;
}
.letterArea .letter .form {
  padding: 30px 20px;
  text-align: left;
  background: #fff;
}
.letterArea .letter .form .tit {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3em;
}
.letterArea .letter .form .textarea {
  position: relative;
  height: 80px;
  margin-top: 10px;
}
.letterArea .letter .form .textarea textarea {
  width: 100%;
  height: 80px;
  height: 80px;
  padding: 0;
  font-size: 14px;
  line-height: 40px;
  border: 0;
  border-radius: 0;
  background: none;
}
.letterArea .letter .form .textarea:before, .letterArea .letter .form .textarea:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 40px;
  height: 1px;
  background: #e8e8e8;
}
.letterArea .letter .form .textarea:after {
  top: 100%;
}
.letterArea .letter .form .byte {
  margin-top: 15px;
  text-align: right;
  font-size: 12px;
  line-height: 1em;
  font-family: "Roboto";
  color: #aaa;
}
.letterArea .letter .giftList {
  position: relative;
  padding: 0 20px 10px;
  margin: 0 15px 30px;
  border-radius: 30px;
  text-align: left;
  background: #fff;
}
.letterArea .letter .giftList .message {
  position: absolute;
  right: 15px;
  top: -17px;
  padding: 0 20px;
  border-radius: 14px;
  font-size: 12px;
  line-height: 34px;
  color: #fff;
  background: #111;
}
.letterArea .letter .giftList .pdt + .pdt {
  border-top: 1px solid #ddd;
}
.letterArea .letter .giftList .btnTypeJ {
  position: absolute;
  right: 0;
  bottom: 15px;
  padding: 0 15px;
  height: 32px;
  line-height: 30px;
  border-radius: 10px;
}
.letterArea .list {
  position: relative;
  margin: 10px 0;
  padding: 0 30px;
  text-align: center;
  font-size: 0;
}
.letterArea .list .slideCont {
  overflow: hidden;
}
.letterArea .list .slideCont li {
  overflow: hidden;
  display: inline-block;
  width: 16.6666666667%;
  height: 44px;
}
.letterArea .list .slideCont li img {
  width: 44px;
}
.letterArea .list .slideCont li.on img {
  margin-top: -44px;
}
.letterArea .list .prev {
  position: absolute;
  left: 16px;
  top: calc(50% - 4px);
  cursor: pointer;
}
.letterArea .list .next {
  position: absolute;
  right: 16px;
  top: calc(50% - 4px);
  cursor: pointer;
}
.letterArea .list.noSwipe .slideCont {
  width: 100%;
  margin: 0;
}
.letterArea .list.noSwipe .slideCont .swiper-wrapper {
  display: block !important;
}
.letterArea .list.noSwipe .slideCont .swiper-wrapper li {
  margin: 0 3px;
}
.letterArea .list.noSwipe .prev, .letterArea .list.noSwipe .next {
  display: none;
}

.cardArea {
  margin-top: 20px;
}
.cardArea .letterArea {
  float: left;
  width: 408px;
}
.cardArea .toGiftArea {
  float: right;
  width: 407px;
}
.cardArea .toGiftArea h3 {
  font-size: 20px;
}
.cardArea .toGiftArea .wrap {
  display: block;
  overflow-y: auto;
  max-height: 317px;
  margin-top: 10px;
  margin-right: -5px;
  padding-right: 5px;
  padding-bottom: 1px;
}
.cardArea .toGiftArea .toGift {
  position: relative;
}
.cardArea .toGiftArea .toGift .fieldArea {
  margin-top: 0;
}
.cardArea .toGiftArea .toGift .fieldArea .field {
  padding-left: 0;
}
.cardArea .toGiftArea .toGift .fieldArea .field .tit {
  position: static;
  margin-bottom: 10px;
}
.cardArea .toGiftArea .toGift .fieldArea .field .btnTypeJ.sizeA {
  height: 32px;
  line-height: 30px;
  padding: 0 14px;
  margin-left: 10px;
  border-radius: 10px;
}
.cardArea .toGiftArea .toGift .fieldArea .field + .field {
  margin-top: 10px;
}
.cardArea .toGiftArea .toGift .del {
  position: absolute;
  right: 5px;
  top: 15px;
  z-index: 1;
}
.cardArea .toGiftArea .toGift + .toGift {
  padding-top: 15px;
  margin-top: 20px;
  border-top: 1px solid #ddd;
}
.cardArea .toGiftArea .btnTypeC {
  width: 100%;
  margin-top: 20px;
}
.cardArea .toGiftArea .caution {
  margin-left: 0;
}
.cardArea:after {
  content: "";
  display: block;
  clear: both;
}

.giftResult {
  padding: 20px 0;
  text-align: center;
}
.giftResult .text {
  font-size: 16px;
  color: #f9327b;
}
.giftResult .date {
  display: inline-block;
  width: 260px;
  margin-top: 10px;
  border-radius: 14px;
  line-height: 34px;
  font-size: 12px;
  background: #eee;
}

/* 주문완료 */
.orderComplete {
  margin-top: 40px;
  padding: 100px 30px 60px;
  border-radius: 14px;
  background: #fff;
}
.orderComplete .text {
  text-align: center;
  font-size: 28px;
}
.orderComplete .text:before {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  margin: 0 auto 15px;
  background: url(/static/images/icon/ic_confirm.svg) no-repeat 0 0;
}
.orderComplete .orderNo {
  margin-top: 20px;
  text-align: center;
}
.orderComplete .btnArea {
  text-align: center;
}
.orderComplete .btnArea a {
  margin: 0 3px;
}
.orderComplete .detail {
  margin-top: 30px;
}
.orderComplete .detail h2 {
  padding-bottom: 20px;
  margin-top: 60px;
  border-bottom: 1px solid #bbb;
  font-size: 24px !important;
}
.orderComplete .detail dl {
  position: relative;
  margin-top: 20px;
}
.orderComplete .detail dl dt {
  position: absolute;
  left: 0;
  color: #666;
}
.orderComplete .detail dl dd {
  padding-left: 150px;
  margin-bottom: 20px;
}
.orderComplete .detail dl dd .phone:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -2px 10px 0;
  vertical-align: middle;
  background: #6b6b6b;
}
.orderComplete .detail dl dd .price {
  font-size: 28px;
}
.orderComplete .detail dl dd:last-child {
  margin-bottom: 0;
}

/********** 3_회원 **********/
/* 로그인 */
.loginArea .text {
  margin: 40px 0 20px;
  font-size: 22px;
  text-align: center;
}
.loginArea .text2 {
  text-align: center;
  font-size: 15px;
}
.loginArea .benefit {
  overflow: hidden;
  width: 375px;
  margin: 20px auto 0;
}
.loginArea .benefit li {
  position: relative;
  float: left;
  width: 33.33%;
  text-align: center;
  font-size: 12px;
  line-height: 16px;
}
.loginArea .benefit li strong {
  color: #f22c79;
}
.loginArea .benefit li:before {
  content: "";
  display: block;
  width: 100%;
  height: 48px;
  margin-bottom: 15px;
  background: url(/static/images/icon/ic_member1.png) no-repeat 50% 100%;
}
.loginArea .benefit li:nth-child(2):before {
  margin-left: 9px;
  background-image: url(/static/images/icon/ic_member2.png);
}
.loginArea .benefit li:nth-child(3):before {
  margin-left: 9px;
  background-image: url(/static/images/icon/ic_member3.png);
}
.loginArea .benefit li + li:after {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  width: 1px;
  height: 80px;
  background: #dadada;
}
.loginArea .loginWrap {
  width: 345px;
  margin: 20px auto 30px;
}
.loginArea .loginWrap .tabTypeA {
  width: calc(100% + 30px);
  margin: 0 -15px 30px;
}
.loginArea .loginWrap .loginBox label {
  display: block;
  margin: 10px 0 6px;
  font-size: 14px;
  color: #666;
}
.loginArea .loginWrap .loginBox p {
  position: relative;
  padding-right: 35px;
  border-radius: 14px;
  background: #f2f2f2;
}
.loginArea .loginWrap .loginBox p input {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 48px;
  padding: 12px 20px;
  border: 0;
  line-height: 24px;
  background: none;
}
.loginArea .loginWrap .loginBox p span {
  position: absolute;
  left: 20px;
  top: 12px;
  line-height: 24px;
  color: #888;
}
.loginArea .loginWrap .loginBox p input:focus + span, .loginArea .loginWrap .loginBox p input.isVal + span {
  display: none;
}
.loginArea .loginWrap .loginBox p .del {
  display: none;
  position: absolute;
  right: 15px;
  top: calc(50% - 9px);
}
.loginArea .loginWrap .loginBox p + p {
  margin-top: 10px;
}
.loginArea .loginWrap .save {
  margin: 10px 0 30px;
}
.loginArea .loginWrap .save label {
  color: #888;
  font-size: 14px;
}
.loginArea .loginWrap .btns {
  margin-top: 20px;
}
.loginArea .loginWrap .btns a.sizeB {
  width: 100%;
}
.loginArea .loginWrap .btns a.sizeB img {
  margin-top: -4px;
  vertical-align: middle;
}
.loginArea .loginWrap .btns a + a {
  margin-top: 10px;
}
.loginArea .loginWrap .btns a.btnTypeE {
  border-color: #c3c3c3;
  background-color: #fafafa;
}
.loginArea .loginWrap .btns .social {
  margin-top: 10px;
  text-align: center;
}
.loginArea .easyLogin {
  margin-top: 30px;
  text-align: center;
}
.loginArea .easyLogin h2 {
  position: relative;
  margin-bottom: 20px;
  color: #888;
  text-align: center;
}
.loginArea .easyLogin h2 span {
  position: relative;
  display: inline-block;
  padding: 0 7px;
  background: #fff;
}
.loginArea .easyLogin h2:before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  right: 0;
  height: 1px;
  background: #ddd;
}
.loginArea .easyLogin ul {
  font-size: 0;
}
.loginArea .easyLogin ul li {
  display: inline-block;
}
.loginArea .easyLogin ul li + li {
  margin-left: 21px;
}
.loginArea .find {
  margin-top: 30px;
  text-align: center;
  font-size: 0;
}
.loginArea .find li {
  position: relative;
  display: inline-block;
  margin: 0 10px;
}
.loginArea .find li a {
  color: #888;
  font-size: 14px;
  line-height: 1em;
  text-decoration: underline;
}
.loginArea .find li .message {
  position: absolute;
  right: 0;
  top: 32px;
  padding: 0 10px;
  border-radius: 14px 0 14px 14px;
  line-height: 34px;
  font-size: 12px;
  color: #f9327b;
  background: #eee;
  white-space: nowrap;
}
.loginArea .find li .message:before {
  content: "";
  position: absolute;
  right: 0;
  top: -4px;
  border: 4px solid #eee;
  border-top-color: transparent;
  border-left-color: transparent;
}
.loginArea .bann {
  overflow: hidden;
  margin-top: 25px;
  border-radius: 14px;
}
.loginArea .text3 {
  padding: 20px 0 0 8px;
  margin: 35px -15px 0;
  border-top: 1px solid #ddd;
  font-size: 14px;
  text-indent: -8px;
  text-align: left;
  color: #666;
}
.loginArea .text3 + .text3 {
  padding-top: 0;
  margin-top: 10px;
  border-top: 0;
}

/* 회원가입 */
.joinGate .text {
  margin: 50px 0 20px;
  font-size: 22px;
  text-align: center;
}
.joinGate .text2 {
  color: #888;
  text-align: center;
}
.joinGate .benefit {
  overflow: hidden;
  width: 375px;
  margin: 20px auto 0;
}
.joinGate .benefit li {
  position: relative;
  float: left;
  width: 33.33%;
  text-align: center;
  font-size: 12px;
  line-height: 16px;
}
.joinGate .benefit li strong {
  color: #f22c79;
}
.joinGate .benefit li:before {
  content: "";
  display: block;
  width: 100%;
  height: 48px;
  margin-bottom: 15px;
  background: url(/static/images/icon/ic_member1.png) no-repeat 50% 100%;
}
.joinGate .benefit li:nth-child(2):before {
  margin-left: 9px;
  background-image: url(/static/images/icon/ic_member2.png);
}
.joinGate .benefit li:nth-child(3):before {
  margin-left: 9px;
  background-image: url(/static/images/icon/ic_member3.png);
}
.joinGate .benefit li + li:after {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  width: 1px;
  height: 80px;
  background: #dadada;
}
.joinGate .btns {
  width: 345px;
  margin: 60px auto 0;
}
.joinGate .btns a {
  width: 100%;
  margin-top: 10px;
  border-radius: 14px;
}
.joinGate .btns a.btnTypeE {
  border-color: #c3c3c3;
  background-color: #fafafa;
}
.joinGate .btns a.btnTypeE img {
  margin-top: -4px;
  vertical-align: middle;
}
.joinGate .bann {
  overflow: hidden;
  width: 345px;
  margin: 20px auto 0;
  border-radius: 14px;
}

/* 회원인증 */
.identify {
  margin-bottom: 40px;
}
.identify .text {
  margin: 70px 0 30px;
  font-size: 28px;
  text-align: center;
}
.identify .form {
  overflow: hidden;
  width: 720px;
  margin: 0 auto;
}
.identify .form .fl, .identify .form .fr {
  position: relative;
  width: 345px;
  height: 214px;
  padding: 30px 20px;
  border-radius: 30px;
  border: 1px solid #ddd;
  font-size: 14px;
}
.identify .form .fl a, .identify .form .fr a {
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 30px;
}
.identify + .cautionArea {
  width: 720px;
  margin: 0 auto;
}

/********** 4_마이페이지 **********/
/* 인덱스 */
.mypageIndex {
  position: relative;
  padding: 32px 40px 0;
  margin-top: 40px;
  border: 1px solid #FF7D46;
  border-radius: 32px;
  background: #fff;
}
.mypageIndex h2 {
  position: relative;
}
.mypageIndex h2 .grade {
  position: relative;
  display: inline-block;
  margin-right: 10px;
  vertical-align: middle;
}
.mypageIndex h2 .grade a {
  display: inline-block;
  padding: 0 12px;
  border-radius: 13px;
  line-height: 25px;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
  background: #FF437A;
}
.mypageIndex h2 .grade .benefitLayer {
  display: none;
  position: absolute;
  left: calc(100% - 20px);
  top: 50px;
  z-index: 2;
}
.mypageIndex h2 .grade .benefitLayer .wrap {
  position: relative;
  min-width: 375px;
  padding: 24px;
  border: 1px solid #ddd;
  border-radius: 32px;
  box-shadow: 3px 3px 20px 0 rgba(0, 0, 0, 0.1);
  background: #fff;
}
.mypageIndex h2 .grade .benefitLayer .wrap h3 {
  margin-bottom: 16px;
  font-size: 18px !important;
  font-weight: 600;
}
.mypageIndex h2 .grade .benefitLayer .wrap .close {
  position: absolute;
  right: 24px;
  top: 24px;
}
.mypageIndex h2 .grade .benefitLayer .wrap .close a {
  overflow: hidden;
  display: block;
  width: 24px;
  height: 24px;
  padding: 3px;
  background: url(/static/images/icon/ic_close2.svg) no-repeat 50% 50%/18px;
}
.mypageIndex h2 .grade .benefitLayer .wrap .close a span {
  display: block;
  white-space: nowrap;
  text-indent: 100%;
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul {
  padding: 16px 24px;
  border-radius: 16px;
  background: #F8F8F8;
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 64px;
  padding: 16px 0 16px 42px;
  text-align: left;
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li:before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 16px);
  width: 32px;
  height: 32px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li.coupon:before {
  background-image: url(/static/images/icon/ic_coupon2.svg);
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li.gift:before {
  background-image: url(/static/images/icon/ic_gift5.svg);
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li.point:before {
  background-image: url(/static/images/icon/ic_point.svg);
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li p {
  font-size: 14px;
  line-height: 1.2em;
}
.mypageIndex h2 .grade .benefitLayer .wrap .benefitCont ul li + li {
  padding-top: 17px;
  border-top: 1px solid #ddd;
}
.mypageIndex h2 .grade .benefitLayer .wrap:before {
  content: "";
  position: absolute;
  left: -1px;
  top: -16px;
  height: 28px;
  border-style: solid;
  border-width: 15px 0 0 35px;
  border-color: transparent transparent transparent #ddd;
}
.mypageIndex h2 .grade .benefitLayer .wrap:after {
  content: "";
  position: absolute;
  left: 0;
  top: -15px;
  height: 27px;
  border-style: solid;
  border-width: 15px 0 0 34px;
  border-color: transparent transparent transparent #fff;
}
.mypageIndex h2 .name {
  display: inline-block;
  font-size: 24px;
  line-height: 25px;
  vertical-align: middle;
}
.mypageIndex h2 .name img {
  margin: -5px 2px 0 0;
  vertical-align: middle;
}
.mypageIndex .btns {
  position: absolute;
  right: 40px;
  top: 32px;
}
.mypageIndex .btns .benefit, .mypageIndex .btns .down {
  display: inline-block;
}
.mypageIndex .btns .benefit a, .mypageIndex .btns .down a {
  position: relative;
  width: 100%;
  line-height: 30px;
  padding: 0 16px;
  border-color: #aaa;
  border-radius: 8px;
  font-size: 12px;
}
.mypageIndex .btns .benefit a.hasCoupon:before, .mypageIndex .btns .down a.hasCoupon:before {
  content: "";
  position: absolute;
  right: -2px;
  top: -2px;
  width: 8px;
  height: 8px;
  border: 1px solid #fff;
  border-radius: 50%;
  background: #EF407D;
}
.mypageIndex .btns .benefit.benefit a:after, .mypageIndex .btns .down.benefit a:after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 11px;
  margin: -4px 0 0 6px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow21.svg) no-repeat 0 0;
}
.mypageIndex .btns .benefit + p, .mypageIndex .btns .down + p {
  margin-left: 11px;
}
.mypageIndex .srmy {
  overflow: hidden;
  display: table;
  width: 100%;
  margin: 24px 0;
}
.mypageIndex .srmy li {
  position: relative;
  display: table-cell;
  height: 38px;
  text-align: center;
}
.mypageIndex .srmy li a {
  overflow: hidden;
  position: relative;
  display: block;
  padding: 0 24px 0 60px;
}
.mypageIndex .srmy li a .tit {
  float: left;
  font-size: 16px;
  line-height: 38px;
}
.mypageIndex .srmy li a .num {
  float: right;
  margin-top: -3px;
  font-size: 14px;
  line-height: 38px;
}
.mypageIndex .srmy li a .num strong {
  font-size: 28px;
  color: #EF407D;
  font-weight: 700;
}
.mypageIndex .srmy li a .go {
  float: right;
  position: relative;
  padding-right: 3px;
  margin-top: 12px;
  font-size: 12px;
  line-height: 1em;
}
.mypageIndex .srmy li a .go:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  height: 1px;
  background: #111;
}
.mypageIndex .srmy li a .go .icoGo {
  padding-right: 10px;
}
.mypageIndex .srmy li a .go .icoGo:before, .mypageIndex .srmy li a .go .icoGo:after {
  margin-top: 0;
  background: #111;
}
.mypageIndex .srmy li a:before {
  content: "";
  position: absolute;
  left: 24px;
  top: 5px;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.mypageIndex .srmy li.myorder a:before {
  background-image: url(/static/images/icon/ic_myorder.svg);
  background-size: 16px;
}
.mypageIndex .srmy li.coupon a:before {
  background-image: url(/static/images/icon/ic_coupon2.svg);
  background-size: 22px;
}
.mypageIndex .srmy li.point a:before {
  background-image: url(/static/images/icon/ic_point.svg);
  background-size: 24px;
}
.mypageIndex .srmy li.family a:before {
  background-image: url(/static/images/icon/ic_family.svg);
  background-size: 24px;
}
.mypageIndex .srmy li + li:before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 16px);
  width: 1px;
  height: 32px;
  background: #ddd;
}
.mypageIndex .srmy li:first-child a {
  padding-left: 36px;
}
.mypageIndex .srmy li:first-child a:before {
  left: 0;
}
.mypageIndex .srmy li:last-child a {
  padding-right: 0;
}
.mypageIndex .goReview {
  border-top: 1px solid #ddd;
  text-align: center;
}
.mypageIndex .goReview a:after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 12px;
  margin: -1px 0 0 10px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow.svg) no-repeat 0 0/100%;
}
.mypageIndex .goReview a p {
  display: inline-block;
  line-height: 48px;
  font-size: 14px;
}
.mypageIndex .goReview a p + p {
  margin-left: 4px;
}

.mypageBanner {
  border-radius: 14px;
  margin: 30px 0;
}

.mypageIndex ~ .recommendPdt {
  padding: 40px;
  margin-top: 30px;
  border-radius: 14px;
  background: #fff;
}
.mypageIndex ~ .recommendPdt .pdtList {
  margin-top: 8px;
}
.mypageIndex ~ .recommendPdt .pdtList li {
  margin-bottom: 0;
}

/*.mypagePreview {
  h2 {margin:40px 0 20px; font-size:28px !important; font-weight:500;}
  .more {height:52px; margin-top:-52px; text-align:right;
    a {padding-right:24px; background:url(/static/images/icon/ic_arrow10.svg) no-repeat 100% 50%;}
  }
  .bbsListArea .pdtList {
    li {width:220px; margin:50px 0 30px 30px;}
    li:nth-child(4n+1) {margin-left:0;}
  }
}
.mypageBanner~.mypagePreview h2 {margin-top:0;}*/
/* 주문내역 */
.orderStatus {
  padding: 40px 130px;
  border-radius: 14px;
  background: #fff;
}
.orderStatus ol {
  position: relative;
  text-align: justify;
}
.orderStatus ol li {
  position: relative;
  display: inline-block;
  text-align: center;
}
.orderStatus ol li .num {
  display: block;
  width: 116px;
  height: 116px;
  margin: 0 auto 10px;
  border-radius: 50%;
  font-size: 36px;
  color: #666;
  line-height: 116px;
  background: #f2f2f2;
}
.orderStatus ol li a {
  font-size: 14px;
  color: #666;
}
.orderStatus ol li.on .num {
  color: #f9327b;
}
.orderStatus ol li.on a {
  color: #f9327b;
}
.orderStatus ol:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 58px;
  border-top: 2px dotted #f2f2f2;
}
.orderStatus ol:after {
  content: "";
  display: inline-block;
  width: 100%;
}
.orderStatus ol + .other {
  margin-top: 40px;
}
.orderStatus .other {
  overflow: hidden;
  height: 60px;
  border-radius: 14px;
  background: #f2f2f2;
}
.orderStatus .other p {
  float: left;
  position: relative;
  width: 50%;
  padding: 0 30px;
  font-size: 14px;
  line-height: 60px;
}
.orderStatus .other p .num {
  position: absolute;
  right: 30px;
  top: 0;
  font-size: 18px;
}
.orderStatus .other p .colorA {
  font-weight: 600;
}
.orderStatus .other p + p:before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 16px);
  width: 1px;
  height: 32px;
  background: #ddd;
}

.myOrderList > .text {
  height: 58px;
  margin-top: -58px;
}
.myOrderList .wrap {
  padding: 0 30px;
  border-radius: 14px;
  background: #fff;
}
.myOrderList .wrap .bbsList tr:last-child td {
  border-bottom: 0;
}

.orderHead {
  position: relative;
  margin-top: 20px;
}
.orderHead h2 {
  margin-bottom: 10px;
  font-size: 20px !important;
  color: #f9327b;
}
.orderHead .date {
  display: inline-block;
  font-size: 18px;
}
.orderHead .date .orderNo {
  color: #888;
}
.orderHead .date .orderNo a {
  color: #888;
}
.orderHead .date .orderNo a:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 11px;
  margin: -4px 5px 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow13.svg) no-repeat;
}
.orderHead .date .orderNo:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -2px 10px 0 6px;
  vertical-align: middle;
  background: #aaa;
}
.orderHead .btn {
  position: absolute;
  right: 0;
  bottom: 0;
}
.orderHead .btn a {
  padding: 0 12px;
  border-radius: 10px;
  line-height: 30px;
  font-size: 12px;
}

h1 + .orderHead {
  margin-top: 0;
}

.orderPdtDetail + .orderHead {
  margin-top: 60px;
}

.orderPdtDetail {
  margin-top: 10px;
}
.orderPdtDetail > h2, .orderPdtDetail > h3 {
  margin-bottom: 10px;
}
.orderPdtDetail .wrap {
  padding: 0 30px;
  border-radius: 14px;
  background: #fff;
}
.orderPdtDetail .wrap .bbsList tr:last-child td {
  border-bottom: 0;
}
.orderPdtDetail .caution {
  padding-bottom: 30px;
  margin-top: 0;
}
.orderPdtDetail + .orderPdtDetail {
  margin-top: 30px;
}
.orderPdtDetail ~ .btnArea {
  margin-top: 30px;
}
.orderPdtDetail ~ .btnArea button {
  width: 100%;
  font-size: 18px;
}

h1 + .orderPdtDetail {
  margin-top: 0;
}

.ordererDetail {
  position: relative;
  padding: 30px 30px 10px;
  margin-top: 30px;
  border-radius: 14px;
  background: #fff;
}
.ordererDetail h2 {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #ddd;
  font-size: 18px !important;
  line-height: 1em;
}
.ordererDetail .btn {
  position: absolute;
  right: 30px;
  top: 40px;
  font-size: 14px;
  line-height: 1em;
}
.ordererDetail .btn a {
  color: #f9327b;
  text-decoration: underline;
}
.ordererDetail .btn a + a {
  margin-left: 10px;
}
.ordererDetail dl {
  position: relative;
}
.ordererDetail dl dt {
  position: absolute;
  left: 0;
  color: #666;
}
.ordererDetail dl dd {
  min-height: 24px;
  padding-left: 180px;
  margin-bottom: 20px;
}
.ordererDetail dl dd .default {
  position: relative;
  top: -1px;
  font-size: 12px;
}
.ordererDetail dl dd .btnTypeF {
  height: 26px;
  padding: 0 10px;
  margin: -4px 0 0 20px;
  font-size: 12px;
  line-height: 24px;
  vertical-align: middle;
}
.ordererDetail .paymentTotal dl > div {
  position: relative;
  width: 400px;
}
.ordererDetail .paymentTotal dl > div dd {
  text-align: right;
}
.ordererDetail .paymentTotal dl > div dd.total strong {
  font-size: 28px;
}
.ordererDetail .paymentTotal dl .btnTypeF {
  height: 32px;
  padding: 0 10px;
  border-radius: 10px;
  margin: -6px 0 0 10px;
  line-height: 30px;
  font-size: 14px;
}
.ordererDetail .paymentTotal dl:after {
  content: "";
  display: block;
  clear: both;
}
.ordererDetail .caution {
  margin-top: 0;
  margin-bottom: 20px;
}

.routineDetail {
  padding: 30px 30px 0;
  margin-top: 30px;
  border-radius: 14px;
  background: #fff;
}
.routineDetail h2 {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #ddd;
  font-size: 18px !important;
  line-height: 1em;
}
.routineDetail dl {
  position: relative;
  margin-bottom: 30px;
}
.routineDetail dl dt {
  position: absolute;
  left: 0;
  color: #666;
}
.routineDetail dl dd {
  padding-left: 180px;
  margin-bottom: 20px;
}
.routineDetail dl dd .sizeA {
  height: 32px;
  line-height: 30px;
  padding: 0 15px;
}
.routineDetail .bbsList tr:last-child td {
  border-bottom: 0;
}

.receiverDetail {
  margin-top: 30px;
}
.receiverDetail h2 {
  font-size: 18px !important;
  line-height: 1em;
}
.receiverDetail .giftLimit {
  margin-top: 20px;
}
.receiverDetail .giftLimit .tit {
  float: left;
  color: #888;
}
.receiverDetail .giftLimit .tit strong {
  color: #111;
}
.receiverDetail .giftLimit .btnTypeF {
  float: right;
}
.receiverDetail .giftLimit:after {
  content: "";
  display: block;
  clear: both;
}
.receiverDetail .wrap {
  padding: 0 30px;
  margin-top: 20px;
  border-radius: 14px;
  background: #fff;
}
.receiverDetail .wrap .bbsList tr:last-child td {
  border-bottom: 0;
}

/* 교환반품 */
.returnPdtList {
  margin-top: 30px;
}
.returnPdtList .bbsListArea {
  margin-top: 20px;
}
.returnPdtList .bbsListArea .bbsList td select {
  width: 42px;
  height: 28px;
  padding-left: 5px;
  margin-left: 4px;
  border-radius: 6px;
  background-position-x: calc(100% - 5px);
}

.returnInfo {
  padding: 30px;
  margin-top: 100px;
  border-radius: 14px;
  background: #fff;
}
.returnInfo h2 {
  padding: 60px 0 15px;
  margin-bottom: 20px;
  border-bottom: 1px solid #bbb;
  font-size: 18px !important;
}
.returnInfo h2:first-child {
  padding-top: 0;
}
.returnInfo .type p {
  display: inline-block;
  margin-right: 100px;
}

.returnAddrDetail {
  position: relative;
  padding: 30px;
  margin-top: 40px;
  border-radius: 14px;
  background: #fff;
}
.returnAddrDetail h2 {
  padding: 60px 0 15px;
  margin-bottom: 20px;
  border-bottom: 1px solid #bbb;
  font-size: 18px !important;
}
.returnAddrDetail h2:first-child {
  padding-top: 0;
}
.returnAddrDetail .btn {
  position: absolute;
  right: 30px;
  top: 30px;
}
.returnAddrDetail .btn a {
  text-decoration: underline;
  color: #f9327b;
  font-size: 14px;
}
.returnAddrDetail dl {
  position: relative;
}
.returnAddrDetail dl dt {
  position: absolute;
  left: 0;
  color: #666;
}
.returnAddrDetail dl dd {
  padding-left: 180px;
  min-height: 24px;
  margin-bottom: 20px;
}
.returnAddrDetail dl dd.price {
  font-size: 14px;
}
.returnAddrDetail dl dd .num {
  font-size: 18px;
}
.returnAddrDetail dl dt.total {
  padding-top: 43px;
  font-size: 16px;
}
.returnAddrDetail dl dd.total {
  padding-top: 30px;
  margin-top: 30px;
  border-top: 1px solid #ddd;
  font-size: 16px;
}
.returnAddrDetail dl dd.total .num {
  font-size: 28px;
  font-weight: 600;
}
.returnAddrDetail .fieldArea p:not(.tit) + p {
  margin-top: 10px;
}
.returnAddrDetail .cautionArea:first-child {
  margin-top: 0;
}
.returnAddrDetail .cautionArea h3 {
  font-size: 15px !important;
}
.returnAddrDetail .cautionArea .adminText {
  font-size: 14px;
}

/* 배송지 */
.addressList {
  padding-top: 12px;
}
.addressList li {
  position: relative;
  padding: 20px 20px 20px 0;
  border-radius: 14px;
  border: 1px solid #eee;
}
.addressList li .default {
  position: absolute;
  left: 55px;
  top: -12px;
  padding: 0 8px;
  border-radius: 14px 14px 14px 0;
  line-height: 24px;
  font-size: 10px;
  color: #fff;
  background: #f9327b;
}
.addressList li .default:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  border-left: 6px solid #f9327b;
  border-top: 4px solid #f9327b;
  border-right: 6px solid transparent;
  border-bottom: 4px solid transparent;
}
.addressList li label {
  position: relative;
  display: inline-block;
  padding-left: 55px;
}
.addressList li .rdo {
  position: absolute;
  left: 10px;
  top: 50%;
  margin-top: -10px;
}
.addressList li .tit {
  margin-right: 70px;
  font-size: 14px;
  font-weight: 600;
}
.addressList li .addr {
  margin-top: 5px;
  font-size: 14px;
}
.addressList li .name {
  margin-top: 5px;
  font-size: 14px;
}
.addressList li .name .num {
  color: #888;
}
.addressList li .name .num:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 8px;
  margin: -2px 10px 0;
  vertical-align: middle;
  background: #ddd;
}
.addressList li .btn {
  position: absolute;
  right: 20px;
  top: 15px;
}
.addressList li .btn a {
  display: inline-block;
  color: #888;
  font-size: 12px;
}
.addressList li .btn a + a:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 8px;
  margin: -2px 8px 0;
  vertical-align: middle;
  background: #ddd;
}
.addressList li.checked {
  border-color: #f9327b;
  box-shadow: 3px 3px 20px 0 rgba(0, 0, 0, 0.1);
}
.addressList li + li {
  margin-top: 20px;
}

/* 나의포인트 */
.myPointHead {
  position: relative;
  display: table;
  width: 100%;
  padding: 30px 40px;
  margin: 40px 0 30px;
  border-radius: 14px;
  background: #fff;
  table-layout: fixed;
}
.myPointHead .head {
  display: table-cell;
}
.myPointHead .head h2 {
  font-size: 24px;
}
.myPointHead .head h2 .colorA {
  display: block;
  margin-bottom: 15px;
  font-size: 14px;
  line-height: 1em;
}
.myPointHead .head .num {
  margin-top: 30px;
  font-size: 18px;
  line-height: 1em;
}
.myPointHead .head .num strong {
  font-size: 28px;
}
.myPointHead .cont {
  display: table-cell;
  position: relative;
  padding: 0 0 40px 30px;
  border-left: 1px solid #ddd;
}
.myPointHead .cont dl {
  position: relative;
}
.myPointHead .cont dl dt {
  position: absolute;
  left: 0;
}
.myPointHead .cont dl dd {
  margin-bottom: 20px;
  text-align: right;
  font-size: 18px;
}
.myPointHead .cont .caution {
  position: absolute;
  right: 0;
  bottom: 6px;
}
.myPointHead .cont .btnTypeE {
  position: absolute;
  left: 30px;
  bottom: 0;
  height: 32px;
  padding: 0 10px;
  line-height: 30px;
  font-size: 14px;
}

/* 나의쿠폰 */
.myCouponHead .head h3 {
  margin: 45px 0 5px;
  font-weight: 600;
}
.myCouponHead .head input[type=text] {
  width: 240px;
  margin-right: 6px;
}
.myCouponHead .cont {
  padding-bottom: 0;
}

.myCouponBanner {
  margin-bottom: 30px;
  border-radius: 14px;
}

.myCouponList .tabTypeE {
  margin-top: 30px;
}
.myCouponList .tabTypeE li {
  margin: 0 8px 0 0;
}
.myCouponList .tabTypeE li a, .myCouponList .tabTypeE li button {
  padding: 0 8px;
  line-height: 30px;
  border-radius: 8px;
  color: #888;
}
.myCouponList .tabTypeE li.on button {
  border-color: #F9327B;
  font-weight: 400;
  color: #fff;
  background: #f9327b;
}
.myCouponList .all {
  margin-top: 20px;
  font-size: 14px;
}
.myCouponList .allBtn {
  height: 50px;
  margin-top: -50px;
  text-align: right;
}
.myCouponList .allBtn a {
  height: 38px;
  padding: 0 15px;
  line-height: 36px;
  font-size: 14px;
}
.myCouponList .allBtn a:after {
  content: "";
  display: inline-block;
  width: 25px;
  height: 18px;
  margin: -4px 0 0 5px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_coupon.svg) no-repeat 0 0/100%;
}
.myCouponList .couponList {
  margin-top: 30px;
}
.myCouponList .couponList li:before, .myCouponList .couponList li:after {
  background: #f2f2f2;
}

.noCoupon, .noGift {
  margin-top: 80px;
  font-weight: 500;
  font-size: 14px;
}
.noCoupon:before, .noGift:before {
  content: "";
  display: block;
  width: 43px;
  height: 32px;
  margin: 0 auto 25px;
  background: url(/static/images/icon/ic_coupon5.svg) no-repeat;
}
.noCoupon .btn, .noGift .btn {
  display: block;
  margin-top: 16px;
  font-size: 12px;
}
.noCoupon .btn:after, .noGift .btn:after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 9px;
  margin: -3px 0 0 4px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow.svg) no-repeat;
}
.noCoupon.noGift:before, .noGift.noGift:before {
  width: 37px;
  height: 34px;
  background: url(/static/images/icon/ic_gift3.svg);
}

.couponList {
  font-size: 0;
}
.couponList li {
  position: relative;
  display: inline-block;
  width: 330px;
  padding-right: 70px;
  margin-left: 20px;
  border: 1px solid #bbb;
  border-radius: 14px;
  vertical-align: top;
  background: #fff;
}
.couponList li .wrap {
  padding: 25px 5px 25px 20px;
}
.couponList li .wrap .benefit {
  font-size: 24px;
  font-weight: 600;
}
.couponList li .wrap .benefit b {
  position: relative;
  bottom: -2px;
  font-size: 39px;
}
.couponList li .wrap .benefit .label {
  display: inline-block;
  padding: 0 8px;
  margin: -2px 0 0 4px;
  border-radius: 10px;
  line-height: 20px;
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  vertical-align: middle;
  background: #EF407D;
}
.couponList li .wrap .tit {
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 500;
  line-height: 24px;
}
.couponList li .wrap .cont {
  min-height: 18px;
  font-size: 14px;
}
.couponList li .wrap .date {
  font-size: 14px;
}
.couponList li .wrap .btn {
  display: inline-block;
  margin: 10px 20px 0 0;
  font-size: 12px;
  font-weight: 500;
}
.couponList li .wrap .btn .icoGo {
  padding-right: 10px;
}
.couponList li .wrap .btn .icoGo:before, .couponList li .wrap .btn .icoGo:after {
  margin-top: 0;
}
.couponList li .down {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  display: grid;
  width: 70px;
}
.couponList li .down a, .couponList li .down span {
  display: grid;
  border-radius: 0 13px 13px 0;
  text-align: center;
  color: #666;
  font-size: 12px;
  line-height: 16px;
  align-content: center;
}
.couponList li .down span:before {
  content: "";
  position: absolute;
  left: 0;
  top: 24px;
  bottom: 24px;
  width: 1px;
  border-left: 1px dashed #bbb;
}
.couponList li .down a {
  color: #fff;
  background: #222;
}
.couponList li .down a:before {
  content: "";
  display: block;
  width: 15px;
  height: 22px;
  margin: 0 auto 3px;
  background: url(/static/images/icon/ic_down.svg) no-repeat 0 0;
}
.couponList li:nth-child(3n+1) {
  margin-left: 0;
}
.couponList li:nth-child(3) ~ li {
  margin-top: 20px;
}
.couponList li:before {
  content: "";
  position: absolute;
  right: 59px;
  top: -1px;
  z-index: 1;
  width: 22px;
  height: 11px;
  border-radius: 0 0 11px 11px;
  border: 1px solid #bbb;
  border-top: 0;
  background: #fff;
}
.couponList li:after {
  content: "";
  position: absolute;
  right: 59px;
  bottom: -1px;
  z-index: 1;
  width: 22px;
  height: 11px;
  border-radius: 11px 11px 0 0;
  border: 1px solid #bbb;
  border-bottom: 0;
  background: #fff;
}
.couponList li.gift, .couponList li.default {
  border-color: #FF437A;
}
.couponList li.gift:before, .couponList li.gift:after, .couponList li.default:before, .couponList li.default:after {
  border-color: #FF437A;
}
.couponList li.gift .down a, .couponList li.default .down a {
  background: linear-gradient(147deg, #FF437A calc(100% - 68px), #FF7D46 100%);
}
.couponList li.gift .down a:before, .couponList li.default .down a:before {
  width: 37px;
  height: 37px;
  background-image: url(/static/images/icon/ic_gift2.svg);
}
.couponList li.default .down span {
  background: linear-gradient(147deg, #FF437A calc(100% - 68px), #FF7D46 100%);
}
.couponList li.default .down span:before {
  position: static;
  display: block;
  width: 37px;
  height: 37px;
  margin: 0 auto;
  border-left-width: 0;
  background-image: url(/static/images/icon/ic_gift2.svg);
}
.couponList li.message {
  border-color: #FF437A;
}
.couponList li.message:before, .couponList li.message:after {
  border-color: #FF437A;
}
.couponList li.message .down a {
  background: #FF437A;
}
.couponList li.message .down a:before {
  width: 37px;
  height: 37px;
  background-image: url(/static/images/icon/ic_message2.svg);
}
.couponList li.return .down a {
  background: #e8e8e8;
  color: #222;
}
.couponList li.return .down a:before {
  width: 37px;
  height: 37px;
  background-image: url(/static/images/icon/ic_gift4.svg);
}
.couponList:after {
  content: "";
  display: block;
  clear: both;
}

.applyCateLayer {
  width: 380px;
}
.applyCateLayer h1 {
  padding-left: 20px;
}
.applyCateLayer .content {
  min-height: 450px;
}
.applyCateLayer .info {
  position: relative;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.applyCateLayer .info a.icoFold {
  display: block;
  height: 54px;
  padding: 0 50px 0 20px;
  line-height: 54px;
  font-weight: 600;
}
.applyCateLayer .info a.icoFold:before, .applyCateLayer .info a.icoFold:after {
  right: 20px;
}
.applyCateLayer .info a.icoFold:before {
  right: 23px;
}
.applyCateLayer .info .list {
  display: none;
  position: absolute;
  left: -1px;
  top: 54px;
  right: -1px;
  z-index: 100;
  overflow-y: auto;
  max-height: 254px;
  border: 1px solid #111;
  border-top: 0;
  border-radius: 0 0 14px 14px;
  background: #fff;
}
.applyCateLayer .info .list li {
  font-size: 14px;
}
.applyCateLayer .info .list li a {
  display: block;
  padding: 20px;
}
.applyCateLayer .info .list li + li {
  border-top: 1px solid #eee;
}
.applyCateLayer .info.on {
  border-color: #111;
  border-radius: 14px 14px 0 0;
}

.applyProductLayer {
  min-height: 1px;
  padding-bottom: 30px;
}
.applyProductLayer .text {
  text-align: center;
}
.applyProductLayer .text2 {
  margin-top: 15px;
  text-align: center;
  font-size: 14px;
  color: #888;
}

.onesFamily {
  width: 600px;
  padding: 60px 30px 40px;
  text-align: center;
}
.onesFamily .close {
  right: 20px;
  top: 30px;
}
.onesFamily .close a {
  width: 20px;
  height: 20px;
  background-image: url(/static/images/icon/ic_close5.svg);
}
.onesFamily .text {
  margin-bottom: 20px;
  font-size: 24px;
  font-weight: 600;
}
.onesFamily .text2 {
  font-size: 16px;
}
.onesFamily .btnArea {
  margin-top: 20px;
}
.onesFamily .btnArea button {
  width: calc(50% - 5px);
  padding: 0;
  border-radius: 16px;
  vertical-align: top;
}
.onesFamily .btnArea button + button {
  margin-left: 5px;
}
.onesFamily .text3 {
  margin: 20px 0 0 10px;
  font-size: 12px;
  color: #888;
  text-align: left;
}

/* 쿠폰선물하기 */
.couponGift #container {
  padding-top: 30px;
}
.couponGift #container div.fr {
  width: 782px;
}
.couponGift #container div.fr .toGiftArea {
  float: none;
  width: 100%;
  min-height: 310px;
  margin-bottom: 20px;
}
.couponGift #container .giftCouponInfo {
  float: left;
}
.couponGift #container .giftCouponInfo .couponList .benefit {
  width: auto;
  margin-top: 0;
}
.couponGift #container .agree {
  float: right;
  width: 402px;
}
.couponGift #container .agree .tit {
  font-size: 14px;
}
.couponGift #container .agree .cont p {
  position: relative;
  padding-right: 30px;
  margin-top: 20px;
  font-size: 14px;
  color: #666;
}
.couponGift #container .agree .cont p label span {
  position: relative;
  padding-left: 30px;
}
.couponGift #container .agree .cont p label span:before {
  position: absolute;
  left: 0;
  top: 0;
}
.couponGift #container .agree .cont p a {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 12px;
  color: #888;
  text-decoration: underline;
}
.couponGift #container .agree .btn {
  margin-top: 20px;
}
.couponGift #container .agree .btn a {
  width: 100%;
}

.couponGiftComplete {
  overflow: hidden;
  width: 690px;
  margin: 60px auto;
}
.couponGiftComplete .couponList {
  float: left;
}
.couponGiftComplete .detail {
  float: right;
  width: 330px;
  margin-top: 0;
}
.couponGiftComplete .detail h2 {
  margin-top: 14px;
  padding-bottom: 12px;
  font-size: 20px !important;
  line-height: 1em;
}
.couponGiftComplete .detail dl {
  margin-top: 12px;
}
.couponGiftComplete .detail dl dt {
  clear: both;
  float: left;
  position: static;
  margin-right: 10px;
  font-size: 14px;
  font-weight: 500;
}
.couponGiftComplete .detail dl dd {
  float: left;
  padding-left: 0;
  margin-bottom: 8px;
  font-size: 14px;
}

/* 나의리뷰 */
.myReview {
  padding-top: 20px;
}
.myReview .text {
  margin-bottom: 20px;
  color: #666;
}
.myReview .bbsList .btns {
  position: relative;
  display: inline-block;
}
.myReview .bbsList .btns .message {
  position: absolute;
  right: 0;
  top: 38px;
  padding: 0 10px;
  border-radius: 14px 0 14px 14px;
  font-size: 12px;
  font-weight: 300;
  color: #fff;
  line-height: 34px;
  white-space: nowrap;
  background: #f9327b;
}
.myReview .bbsList .btns .message:before {
  content: "";
  position: absolute;
  right: 0;
  top: -4px;
  border-left: 6px solid transparent;
  border-top: 4px solid transparent;
  border-right: 6px solid #f9327b;
  border-bottom: 4px solid #f9327b;
}
.myReview .noData a {
  margin-bottom: 15px;
}
.myReview .reviewList .list > li {
  padding: 20px 30px;
  margin-top: 0;
  border-top: 0;
  border-radius: 14px;
  background: #fff;
}
.myReview .reviewList .list > li + li {
  margin-top: 30px;
}
.myReview .reviewList .list > li .commentArea .head {
  padding-bottom: 18px;
  border-bottom: 1px solid #ddd;
}

/* 나의알림함 */
.alarmList li {
  position: relative;
  padding: 20px;
  margin-top: 20px;
  border: 1px solid #ddd;
  border-radius: 30px;
}
.alarmList li .tit {
  margin-bottom: 15px;
  font-weight: 600;
}
.alarmList li .routineNum {
  position: absolute;
  right: 20px;
  top: 22px;
  font-size: 14px;
}
.alarmList li dl {
  position: relative;
}
.alarmList li dl dt {
  position: absolute;
  left: 0;
  font-size: 14px;
  color: #888;
}
.alarmList li dl dd {
  padding-left: 80px;
  margin-bottom: 4px;
  text-align: right;
  font-size: 14px;
}
.alarmList li .text {
  font-size: 14px;
}
.alarmList li .info {
  margin-top: 15px;
  font-size: 14px;
  color: #666;
}
.alarmList li .info span + span:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 10px;
  margin: -2px 8px 0 4px;
  vertical-align: middle;
  background: #ddd;
}

/* 임직원설정 */
.memberCheck {
  padding: 30px;
  margin-top: 40px;
  border-radius: 14px;
  background: #fff;
}
.memberCheck h2 {
  margin: 60px 0 10px;
}
.memberCheck h2:first-child {
  margin-top: 0;
}
.memberCheck .type li {
  display: inline-block;
  width: 150px;
  margin-right: 10px;
}
.memberCheck .type li a {
  display: block;
  border-radius: 14px;
  line-height: 48px;
  font-size: 14px;
  color: #aaa;
  text-align: center;
  background: #e8e8e8;
}
.memberCheck .type li.on a {
  color: #fff;
  font-weight: 500;
  background: #111;
}
.memberCheck .type li.on a:before {
  content: "";
  display: inline-block;
  width: 13px;
  height: 9px;
  margin: -2px 8px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_check4.svg) no-repeat 0 0;
}
.memberCheck .fieldArea {
  margin-top: 30px;
}
.memberCheck .fieldArea .field {
  padding-left: 0;
}
.memberCheck .fieldArea .field .tit {
  position: static;
  margin: 30px 0 10px;
}
.memberCheck .fieldArea .field input, .memberCheck .fieldArea .field select {
  max-width: 480px;
}
.memberCheck .fieldArea .field select + select {
  margin-left: 6px;
}
.memberCheck .fieldArea .field .email, .memberCheck .fieldArea .field .phone, .memberCheck .fieldArea .field .pin {
  width: 480px;
}
.memberCheck .agree .adminText {
  margin-bottom: 30px;
}

.memberCheckComplete {
  padding: 110px 0;
  text-align: center;
  border-radius: 14px;
  background: #fff;
}
.memberCheckComplete .text {
  margin-bottom: 40px;
  font-size: 24px;
}
.memberCheckComplete .text3 {
  margin-top: 20px;
  font-size: 14px;
  color: #666;
}

/* 패밀리설정 */
.familyCheck {
  padding: 110px 0;
  margin-top: 40px;
  border-radius: 14px;
  background: #fff;
}
.familyCheck .wrap {
  width: 475px;
  margin: 0 auto;
}
.familyCheck .wrap .text {
  font-size: 24px;
}
.familyCheck .wrap .fieldArea {
  margin: 30px auto 0;
}
.familyCheck .wrap .fieldArea .field {
  padding-left: 0;
}
.familyCheck .wrap .fieldArea .field .tit {
  position: static;
  margin-bottom: 10px;
}
.familyCheck .wrap .fieldArea label {
  display: inline-block;
  margin-top: 10px;
  font-size: 14px;
}
.familyCheck .wrap .text2 {
  margin-left: 28px;
  font-size: 14px;
}

.familyInvite {
  padding: 110px 0;
  border-radius: 14px;
  background: #fff;
}
.familyInvite .wrap {
  width: 405px;
  margin: 0 auto;
}
.familyInvite .wrap .text {
  font-size: 24px;
}
.familyInvite .wrap .invite {
  padding: 30px 100px;
  margin-top: 30px;
  border: 1px solid #ddd;
  border-radius: 30px;
  text-align: center;
}
.familyInvite .wrap .invite .tit {
  margin-bottom: 20px;
  font-weight: 600;
}
.familyInvite .wrap .invite a {
  width: 100%;
}

.myFamilyBanner {
  margin-bottom: 30px;
  border-radius: 14px;
}

.myFamily {
  padding: 30px;
  border-radius: 14px;
  background: #fff;
}
.myFamily h2 {
  margin-bottom: 30px;
  font-size: 18px !important;
  line-height: 1em;
}
.myFamily .total {
  color: #666;
}
.myFamily .total b {
  color: #111;
}
.myFamily .inviteBtn {
  margin-top: -32px;
  text-align: right;
}
.myFamily .inviteBtn button {
  height: 32px;
  line-height: 30px;
  padding: 0 8px;
  border-radius: 8px;
}
.myFamily .list {
  overflow: hidden;
  margin-top: -20px;
}
.myFamily .list li {
  position: relative;
  float: left;
  width: calc(50% - 15px);
  height: 203px;
  padding: 20px 20px 0;
  margin-top: 30px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.myFamily .list li .tit {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 600;
}
.myFamily .list li .tit .colorA {
  position: relative;
  top: -2px;
  margin-left: 6px;
  font-size: 12px;
  font-weight: 400;
}
.myFamily .list li .btn {
  position: absolute;
  right: 20px;
  top: 24px;
}
.myFamily .list li .btn a {
  text-decoration: underline;
  color: #f9327b;
  font-size: 14px;
}
.myFamily .list li dl {
  position: relative;
}
.myFamily .list li dl dt {
  position: absolute;
  left: 0;
  font-size: 14px;
  color: #666;
}
.myFamily .list li dl dd {
  min-height: 21px;
  margin-bottom: 20px;
  text-align: right;
  font-family: "Roboto";
}
.myFamily .list li dl dd:last-child {
  margin-bottom: 0;
}
.myFamily .list li:nth-child(2n) {
  float: right;
}
.myFamily .list li.noData {
  float: none;
  width: 100%;
  padding: 0 !important;
  margin: 50px 0 !important;
}

/* 좋아요 */
.myWishArea {
  padding: 0 30px;
  border-radius: 14px;
  background: #fff;
}
.myWishArea .pdtList li {
  width: 220px;
}

/* 마케팅수신동의설정 */
.marketingAgree {
  padding: 40px 30px;
  border-radius: 14px;
  background: #fff;
}
.marketingAgree .all {
  padding-bottom: 20px;
  border-bottom: 2px solid #111;
  font-size: 16px;
  font-weight: 600;
}
.marketingAgree h2 {
  margin-top: 20px;
  font-size: 16px !important;
  font-weight: 600;
}
.marketingAgree .agreeBox > li {
  margin-top: 16px;
}
.marketingAgree .agreeBox > li > p {
  position: relative;
  padding-right: 50px;
  line-height: 20px;
}
.marketingAgree .agreeBox > li > p label {
  font-size: 14px;
}
.marketingAgree .agreeBox > li > p a {
  position: absolute;
  right: 0;
  top: 0;
  font-size: 12px;
  color: #888;
  text-decoration: underline;
}
.marketingAgree .agreeBox > li ul {
  display: flex;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #ddd;
}
.marketingAgree .agreeBox > li ul li {
  position: relative;
  margin-right: 30px;
  font-size: 12px;
  color: #444;
}
.marketingAgree .agreeBox > li ul li .balloonLayer {
  position: absolute;
  left: 10px;
  top: calc(100% + 8px);
  padding: 0 10px;
  border-radius: 0 12px 12px 12px;
  line-height: 24px;
  color: #fff;
  font-size: 10px;
  white-space: nowrap;
  background: #FF437A;
}
.marketingAgree .agreeBox > li ul li .balloonLayer:before {
  content: "";
  position: absolute;
  left: 0;
  top: -4px;
  border-style: solid;
  border-width: 4px 0 0 7px;
  border-color: transparent transparent transparent #FF437A;
}
.marketingAgree .cautionArea {
  padding-top: 16px;
  border-top: 2px solid #111;
}
.marketingAgree ~ .btnArea button {
  width: 300px;
}

.marketingLayer {
  padding: 76px 20px 24px;
  text-align: center;
}
.marketingLayer .text {
  font-size: 14px;
}
.marketingLayer .btnArea {
  margin-top: 30px;
}

/********** 5_고객센터 **********/
.customerIndex #contArea {
  padding-top: 40px;
}
.customerIndex h2 {
  margin: 40px 0 15px;
  font-size: 24px !important;
}
.customerIndex h2 + .more {
  margin: -36px 0 15px;
  text-align: right;
  line-height: 16px;
}
.customerIndex h2 + .more a:after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 17px;
  margin: -2px 0 0 10px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow10.svg) no-repeat 0 0;
}
.customerIndex .control {
  margin: -45px 0 15px;
  text-align: right;
}
.customerIndex .control .prev, .customerIndex .control .next {
  overflow: hidden;
  position: relative;
  width: 30px;
  height: 30px;
}
.customerIndex .control .prev:before, .customerIndex .control .next:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.customerIndex .control .prev.prev:before, .customerIndex .control .next.prev:before {
  transform: rotate(180deg);
}
.customerIndex .control .swiper-button-disabled {
  cursor: default;
}
.customerIndex .control .swiper-button-disabled:before {
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.customerIndex .control .swiper-button-disabled.prev:before {
  transform: rotate(0);
}
.customerIndex .control .swiper-button-disabled.next:before {
  transform: rotate(180deg);
}
.customerIndex .quick {
  overflow: hidden;
  padding: 30px 0;
  border-radius: 14px;
  background: #fff;
}
.customerIndex .quick .faq {
  float: left;
  width: 750px;
  padding: 10px 50px 0;
}
.customerIndex .quick .faq h2 {
  margin: 0 0 20px;
  font-weight: 600;
}
.customerIndex .quick .faq .searchForm {
  position: relative;
  right: initial;
  top: initial;
}
.customerIndex .quick .service {
  float: left;
  width: 280px;
  height: 160px;
  padding: 15px 0 0 25px;
  border-left: 1px solid #e8e8e8;
}
.customerIndex .quick .service h2 {
  margin: 0 0 25px 25px;
  font-size: 18px !important;
  font-weight: 400;
}
.customerIndex .quick .service ul {
  overflow: hidden;
  width: 210px;
  text-align: center;
}
.customerIndex .quick .service ul li {
  float: left;
  width: 50%;
  font-size: 14px;
}
.customerIndex .quick .service ul li span {
  display: block;
  width: 52px;
  height: 52px;
  margin: 0 auto 10px;
  border-radius: 15px;
  text-align: center;
  line-height: 52px;
  background: #f2f2f2;
}
.customerIndex .quick .service ul li span img {
  vertical-align: middle;
}

.faqList h2 {
  margin-bottom: 20px;
  font-size: 20px !important;
  font-weight: 600;
}
.faqList .boardList .tit strong {
  position: relative;
  top: -2px;
}

.frequent h2 {
  margin-bottom: 20px;
  font-size: 24px !important;
}
.frequent .control {
  margin: -45px 0 15px;
  text-align: right;
}
.frequent .control .prev, .frequent .control .next {
  overflow: hidden;
  position: relative;
  width: 30px;
  height: 30px;
}
.frequent .control .prev:before, .frequent .control .next:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 30px;
  height: 30px;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.frequent .control .prev.prev:before, .frequent .control .next.prev:before {
  transform: rotate(180deg);
}
.frequent .control .swiper-button-disabled {
  cursor: default;
}
.frequent .control .swiper-button-disabled:before {
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.frequent .control .swiper-button-disabled.prev:before {
  transform: rotate(0);
}
.frequent .control .swiper-button-disabled.next:before {
  transform: rotate(180deg);
}
.frequent .list li {
  width: 250px;
  min-height: 200px;
  padding: 30px 20px;
  margin-right: 20px;
  border-radius: 14px;
  background: #fff;
}
.frequent .list li .cate {
  margin-bottom: 40px;
  color: #f9327b;
}
.btnQna {
  position: absolute;
  right: 0;
  top: 30px;
  padding: 0 30px;
}
.btnQna:before {
  content: "";
  display: inline-block;
  width: 21px;
  height: 18px;
  margin: -2px 8px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_qna.svg) no-repeat 0 0;
}

.noSearch + .frequent {
  margin-top: 40px;
}

.boardArea {
  border-radius: 14px;
  background: #fff;
}

.boardList {
  width: 100%;
  table-layout: fixed;
}
.boardList thead {
  background: url(/static/images/common/line_bbbbbb.gif) no-repeat 50% 100%;
}
.boardList thead th {
  height: 70px;
  font-size: 14px;
  font-weight: 600;
  line-height: 70px;
}
.boardList thead th:first-child {
  padding-left: 30px;
}
.boardList thead th:last-child {
  padding-right: 30px;
}
.boardList tbody tr {
  position: relative;
  background: url(/static/images/common/line_dddddd.gif) no-repeat 50% 0;
}
.boardList tbody tr th {
  height: 65px;
  font-weight: 400;
}
.boardList tbody tr td {
  height: 65px;
  text-align: center;
  font-size: 14px;
}
.boardList tbody tr th:first-child, .boardList tbody tr td:first-child {
  padding-left: 30px;
}
.boardList tbody tr td:last-child {
  padding-right: 30px;
}
.boardList tbody tr .tit {
  padding-left: 50px;
  text-align: left;
  font-size: 16px;
}
.boardList tbody tr.impor {
  background-color: #fff2f7;
}
.boardList tbody tr.impor .label {
  display: inline-block;
  width: 34px;
  border-radius: 5px;
  text-align: center;
  line-height: 22px;
  color: #fff;
  font-family: "Assistant", "Noto";
  font-size: 12px;
  background: #f9327b;
}
.boardList tbody tr:first-child {
  background-image: none;
}

.boardView {
  padding: 20px 30px 0;
  border-radius: 14px;
  background: #fff;
}
.boardView .head {
  position: relative;
  padding: 0 90px 20px 0;
  border-bottom: 1px solid #bbb;
}
.boardView .head .tit {
  line-height: 22px;
  font-weight: 600;
}
.boardView .head .tit.impor {
  position: relative;
  padding-left: 42px;
}
.boardView .head .tit.impor .label {
  position: absolute;
  left: 0;
  top: 0;
  width: 34px;
  border-radius: 5px;
  text-align: center;
  line-height: 22px;
  color: #fff;
  font-weight: 400;
  font-size: 12px;
  background: #f9327b;
}
.boardView .head .num {
  position: absolute;
  right: 0;
  top: 0;
  line-height: 22px;
  font-size: 14px;
}
.boardView .content {
  padding: 30px 15px;
  font-size: 14px;
  line-height: 24px;
}
.boardView .prnt {
  position: relative;
}
.boardView .prnt dt {
  position: absolute;
  left: 0;
  padding: 20px 0 0 30px;
  font-size: 14px;
}
.boardView .prnt dt:before {
  content: "";
  display: inline-block;
  width: 11px;
  height: 6px;
  margin: -4px 8px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_arrow4.svg) no-repeat 0 0;
}
.boardView .prnt dt.prev:before {
  transform: rotate(180deg);
}
.boardView .prnt dd {
  position: relative;
  height: 60px;
  padding: 20px 90px 0 190px;
  border-top: 1px solid #bbb;
  font-size: 14px;
}
.boardView .prnt dd a {
  height: 20px;
  display: block;
  display: -webkit-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.boardView .prnt dd .num {
  position: absolute;
  right: 0;
  top: 20px;
}
.boardView.qnaView .head .type {
  margin-top: 10px;
}
.boardView.qnaView .head .type p {
  display: inline-block;
  font-size: 14px;
  color: #888;
}
.boardView.qnaView .head .type p + p:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 12px;
  margin: -2px 8px 0 0;
  vertical-align: middle;
  background: #ddd;
}
.boardView.qnaView .head .status {
  position: absolute;
  right: 0;
  bottom: 20px;
  font-size: 14px;
  color: #888;
}
.boardView.qnaView .content .wrap {
  position: relative;
  padding-left: 20px;
}
.boardView.qnaView .content .wrap .tit {
  position: absolute;
  left: 0;
  top: 0;
}
.boardView.qnaView .content .photo {
  margin-top: 20px;
  padding-bottom: 2px;
}
.boardView.qnaView .content .photo li {
  display: inline-block;
  overflow: hidden;
  width: 110px;
  height: 110px;
  border-radius: 14px;
}
.boardView.qnaView .content .photo li + li {
  margin-left: 15px;
}
.boardView.qnaView .content .photo.on {
  padding-bottom: 0;
}
.boardView.qnaView .comment {
  padding: 0 15px 20px;
}
.boardView.qnaView .comment .user {
  overflow: hidden;
  margin-bottom: 10px;
  font-size: 14px;
}
.boardView.qnaView .comment .user strong {
  float: left;
}
.boardView.qnaView .comment .user .fontA {
  float: right;
}
.boardView.qnaView .comment .wrap {
  position: relative;
  padding-left: 20px;
}
.boardView.qnaView .comment .wrap .tit {
  position: absolute;
  left: 0;
  top: 0;
}
.boardView + .boardView {
  margin-top: 20px;
}

.formArea {
  padding: 30px;
  border-radius: 14px;
  background: #fff;
}
.formArea .text.ar {
  font-size: 12px;
  line-height: 1em;
  color: #666;
}
.formArea h2 {
  margin-bottom: 15px;
  font-size: 18px !important;
}

.subField {
  position: relative;
  overflow: hidden;
  display: inline-block;
  border: 1px solid #ddd;
  border-radius: 14px;
  vertical-align: top;
}
.subField input {
  position: relative;
  z-index: 1;
  height: 46px;
  padding: 12px 20px;
  border: 0;
  line-height: 22px;
  background: none;
}
.subField span {
  position: absolute;
  left: 20px;
  top: 12px;
  line-height: 22px;
  color: #aaa;
}
.subField input:focus + span, .subField input.isVal + span {
  display: none;
}
.subField + a {
  padding: 0 20px;
  margin-left: 6px;
  vertical-align: top;
}

/********** 6_기획행사 **********/
.specialList .tabTypeE {
  margin-top: 40px;
}
.specialList .pdtListWrap:after {
  content: "";
  display: block;
  clear: both;
}
.specialList .pdtListArea {
  position: relative;
  float: left;
  width: 625px !important;
  margin-right: 30px;
  background: #fff;
}
.specialList .pdtListArea .bann {
  position: relative;
  overflow: hidden;
  border-radius: 14px;
}
.specialList .pdtListArea .bann img {
  width: 100%;
}
.specialList .pdtListArea .bann .date {
  position: absolute;
  right: 20px;
  bottom: 20px;
  border-radius: 19px;
  line-height: 38px;
  padding: 0 12px;
  color: #fff;
  font-size: 16px;
  background: rgba(0, 0, 0, 0.4);
}
.specialList .pdtListArea .pdtList li {
  width: 200px;
  margin: 20px 12px 50px 0;
}
.specialList .pdtListArea:before {
  content: "";
  position: absolute;
  right: -16px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #ddd;
}
.specialList .pdtListArea:nth-child(2n) {
  margin-right: 0;
}
.specialList .pdtListArea:nth-child(2n):before {
  content: "";
  position: absolute;
  left: -15px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #ddd;
}
.specialList .pdtListArea:nth-child(2) ~ li {
  margin-top: 60px;
}
.specialList .controls {
  text-align: center;
}
.specialList .controls .page {
  position: static;
  display: inline-block;
  width: 65px;
  text-align: center;
  font-size: 14px;
  line-height: 30px;
  font-family: "Roboto";
  color: #888;
  vertical-align: top;
}
.specialList .controls .page .swiper-pagination-current {
  font-weight: 500;
  color: #111;
}
.specialList .controls .prev, .specialList .controls .next {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.specialList .controls .prev span, .specialList .controls .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.specialList .controls .prev.swiper-button-disabled, .specialList .controls .next.swiper-button-disabled {
  opacity: 1;
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.specialList .controls .prev.prev:not(.swiper-button-disabled), .specialList .controls .prev.next.swiper-button-disabled, .specialList .controls .next.prev:not(.swiper-button-disabled), .specialList .controls .next.next.swiper-button-disabled {
  transform: rotate(180deg);
}

.specialPdtList .tabTypeE {
  margin-top: 40px;
}
.specialPdtList .list {
  margin-top: 40px;
  font-size: 0;
}
.specialPdtList .list li {
  display: inline-block;
  width: calc(50% - 15px);
  margin-top: 30px;
  vertical-align: top;
}
.specialPdtList .list li .thumb {
  position: relative;
  height: 354px;
}
.specialPdtList .list li .thumb a {
  display: block;
  overflow: hidden;
  height: 354px;
  border-radius: 14px;
}
.specialPdtList .list li .cate {
  position: absolute;
  left: 20px;
  top: 20px;
  padding: 0 10px;
  border-radius: 10px;
  line-height: 29px;
  font-size: 12px;
  color: #fff;
  background: #111;
}
.specialPdtList .list li .tit {
  margin: 20px 0 5px;
  font-size: 20px;
}
.specialPdtList .list li .date {
  font-family: "Roboto";
  font-size: 16px;
  color: #666;
}
.specialPdtList .list li:nth-child(2n) {
  margin-left: 30px;
}

.specialView .head {
  position: relative;
  margin: 40px 0 30px;
}
.specialView .head .cate {
  display: inline-block;
  padding: 0 10px;
  border-radius: 14px;
  line-height: 34px;
  font-size: 14px;
  color: #fff;
  background: #111;
}
.specialView .head .tit {
  margin: 10px 0;
  font-size: 24px;
}
.specialView .head .date {
  color: #666;
}
.specialView .head .btn {
  position: absolute;
  right: 0;
  top: 0;
}
.specialView .head dl {
  overflow: hidden;
  border-radius: 14px;
  padding: 20px 20px 14px;
  margin-top: 30px;
  background: #f2f2f2;
}
.specialView .head dl div {
  float: left;
  position: relative;
  width: 340px;
}
.specialView .head dl dt {
  position: absolute;
  left: 20px;
  color: #666;
}
.specialView .head dl dd {
  padding-left: 130px;
  margin-bottom: 6px;
  color: #666;
}
.specialView .head .message {
  position: absolute;
  right: 20px;
  top: -32px;
  padding: 0 20px;
  border-radius: 20px 20px 0 20px;
  line-height: 58px;
  color: #fff;
  background: #111;
}
.specialView .head .message.user:before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin: -2px 8px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_user2.svg) no-repeat 0 0;
}
.specialView .head .message:after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -7px;
  border-left: 12px solid #transparent;
  border-top: 7px solid #111;
  border-right: 12px solid #111;
  border-bottom: 7px solid transparent;
}
.specialView .head .message span {
  position: relative;
}
.specialView .head .message span strong {
  font-size: 16px;
}
.specialView .head .message span:before {
  content: "";
  position: absolute;
  left: -1px;
  bottom: 0;
  right: -1px;
  height: 6px;
  background: #f9327b;
  transform: skew(347deg);
}
.specialView .head .message span em {
  position: relative;
  z-index: 1;
}
.specialView .couponArea {
  margin: 40px 0;
}
.specialView .couponArea h2 {
  margin-bottom: 20px;
  font-size: 20px !important;
}
.specialView .cautionArea {
  margin-top: 80px;
}
.specialView .cautionArea .adminText {
  font-size: 14px;
  line-height: 25px;
}
.specialView .btnArea {
  margin-top: 60px;
}
.specialView ~ .recommendPdt {
  margin-top: 0;
  padding-top: 80px;
}

.editorView .marker {
  background: #ff0;
}

.checkUser {
  padding: 40px 0;
  margin-top: 40px;
  border-radius: 30px;
  text-align: center;
  background: #f2f2f2;
}
.checkUser .text {
  font-size: 18px;
}
.checkUser .text2 {
  margin-top: 10px;
  font-size: 12px;
  color: #666;
}
.checkUser .btnTypeA {
  width: 200px;
  margin-top: 20px;
}

.commentArea {
  padding-top: 60px;
}
.commentArea h2 {
  margin-bottom: 20px;
  font-size: 20px !important;
  line-height: 20px;
}
.commentArea h2 strong {
  position: relative;
  top: -2px;
  font-size: 16px;
  line-height: 20px;
}
.commentArea .myComment {
  height: 40px;
  margin-top: -40px;
  text-align: right;
  font-size: 14px;
}
.commentArea .form {
  position: relative;
  padding: 20px 20px 58px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.commentArea .form textarea {
  display: block;
  width: 100%;
  height: 80px;
  margin-bottom: 5px;
  padding: 0;
  border: 0;
}
.commentArea .form .btnTypeA {
  position: absolute;
  right: 20px;
  bottom: 20px;
  width: 60px;
  height: 38px;
  padding: 0;
  text-align: center;
  line-height: 36px;
}
.commentArea .commentList li {
  position: relative;
  padding: 30px 0;
  border-bottom: 1px solid #ddd;
}
.commentArea .commentList li .user {
  font-size: 14px;
  color: #888;
}
.commentArea .commentList li .user strong {
  margin-right: 12px;
  font-size: 18px;
  color: #111;
}
.commentArea .commentList li .myBtn {
  position: absolute;
  right: 0;
  top: 30px;
}
.commentArea .commentList li .myBtn a {
  font-size: 14px;
  color: #aaa;
}
.commentArea .commentList li .myBtn a + a:before {
  content: "";
  display: inline-block;
  width: 1px;
  height: 8px;
  margin: -2px 10px 0;
  vertical-align: middle;
  background: #ddd;
}
.commentArea .commentList li .cont {
  display: -webkit-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  max-height: 72px;
  margin-top: 15px;
  line-height: 24px;
  cursor: pointer;
}
.commentArea .commentList li .fold {
  display: none;
  margin-top: 20px;
  font-size: 14px;
  line-height: 18px;
}
.commentArea .commentList li .fold a {
  padding-right: 18px;
  color: #f9327b;
  background: url(/static/images/icon/ic_arrow6.svg) no-repeat 100% 50%;
}
.commentArea .commentList li .modifyArea {
  display: none;
  padding: 10px 5px 10px 0;
  margin-top: 20px;
  border: 1px solid #ddd;
  border-radius: 14px;
}
.commentArea .commentList li .modifyArea textarea {
  display: block;
  width: 100%;
  height: 110px;
  border: 0;
  margin-bottom: 10px;
}
.commentArea .commentList li .modifyArea .btns {
  margin-right: 5px;
  text-align: right;
}
.commentArea .commentList li .modifyArea .btns a {
  width: 52px;
  margin-left: 2px;
  border-radius: 10px;
  line-height: 32px;
  font-size: 12px;
}
.commentArea .commentList li.on .cont {
  -webkit-line-clamp: initial;
  max-height: initial;
}
.commentArea .commentList li.on .fold, .commentArea .commentList li.on .commentArea .comment {
  display: block;
}
.commentArea .noData {
  padding: 40px 0 80px !important;
  border-bottom: 1px solid #ddd !important;
}
.commentArea + .recommendPdt {
  margin-top: 100px;
}

/********** 7_리뷰&아이디어 **********/
.filterWords p {
  display: inline-block;
  height: 34px;
  padding: 0 14px;
  border: 1px solid #ddd;
  border-radius: 14px;
  font-size: 14px;
  line-height: 32px;
}
.filterWords p img {
  margin: -2px 0 0 9px;
  vertical-align: middle;
}
.filterWords p + p {
  margin-left: 6px;
}

.filterWords + .pdtList {
  margin-top: 20px;
}

/********** 8_이벤트 **********/
.eventList {
  overflow: hidden;
  margin-top: 40px;
}
.eventList li {
  overflow: hidden;
  float: left;
  border-radius: 30px;
}
.eventList li:nth-child(2n) {
  margin-left: 40px;
}
.eventList li:nth-child(2) ~ li {
  margin-top: 24px;
}

.deepLink {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  text-align: center;
  transform: translateY(-50%);
}
.deepLink .text {
  margin-top: 120px;
  color: #95989A;
}

/********** 0_메인 **********/
.swiperWrap {
  position: relative;
  overflow: hidden;
  padding: 0 100px 0 38px;
}
.swiperWrap .prev {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 20;
  width: 38px;
  background: #fff;
}
.swiperWrap .prev img {
  position: absolute;
  left: 0;
  top: calc(50% - 10px);
  width: 10px;
  transform: rotate(180deg);
  cursor: pointer;
}
.swiperWrap .next {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 20;
  width: 38px;
  background: #fff;
}
.swiperWrap .next img {
  position: absolute;
  right: 0;
  top: calc(50% - 10px);
  width: 10px;
  cursor: pointer;
}
.swiperWrap:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 19;
  width: 100px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0, rgb(255, 255, 255) 50%);
}

.main #header .fixWrap {
  border-bottom: 0;
  box-shadow: 0;
}
.main .head {
  position: relative;
  overflow: hidden;
  padding: 100px 0 26px;
  margin-bottom: 25px;
  border-bottom: 1px solid #eee;
}
.main .head h2 {
  font-size: 30px;
  font-weight: 600;
  text-align: center;
}
.main .head .srmy {
  float: left;
  margin: 11px 0 0 10px;
  color: #aaa;
}
.main .head .more {
  position: absolute;
  right: 0;
  top: 112px;
  text-align: right;
}
.main .head .more a {
  padding-right: 24px;
  background: url(/static/images/icon/ic_arrow10.svg) no-repeat 100% 50%;
}
.main .pdtBann {
  margin-top: 100px;
}
.main #container {
  width: 100%;
}
.main #container .wrap {
  position: relative;
  width: 1280px;
  margin: 0 auto;
}
.main .timeDeal {
  position: relative;
  /*.list {
    li {width:410px; margin:0;
      .time {font-size:14px; line-height:15px;
        &:before {width:15px; height:15px;}
      }
      .stock {font-size:12px;}
      .product {min-height:125px; padding-left:140px; margin-top:30px;
        .thumb {width:125px; height:125px;}
        .brand {font-size:12px;}
        .pname {margin-top:0; font-size:14px;}
        .price {left:140px;
          .original {font-size:12px;}
          .percent {font-size:16px;}
          .discount {font-size:10px;
            strong {font-size:16px;}
          }
        }
        .notLogin {font-size:16px;}
      }
      &+li {margin-left:25px;}
    }
  }*/
}
.main .timeDeal .time {
  position: absolute;
  left: 0;
  top: 106px;
  font-size: 32px;
  line-height: 1em;
}
.main .timeDeal .time:before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 28px;
  margin: -6px 10px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_time3.svg) no-repeat 0 0/100%;
}
.main .timeDeal .pdtList li {
  width: 232px;
  margin: 0;
}
.main .timeDeal .pdtList li + li {
  margin-left: 24px;
}

.visualBann {
  position: relative;
  opacity: 0;
  transition: all 0.1s ease-in-out;
}
.visualBann .list li {
  overflow: hidden;
  width: 1280px;
  height: 520px;
  margin: 0 auto;
  border-radius: 30px;
}
.visualBann .list li img {
  width: 1280px;
  height: 520px;
}
.visualBann .list li.swiper-slide-prev, .visualBann .list li.swiper-slide-next {
  opacity: 0.3;
}
.visualBann .controls {
  position: absolute;
  left: calc(50% + 380px);
  bottom: 7px;
  z-index: 50;
  width: 230px;
  text-align: right;
}
.visualBann .controls .page {
  display: inline-block;
  width: 56px;
  font-family: "Roboto";
  line-height: 30px;
  vertical-align: top;
  text-align: center;
}
.visualBann .controls .page .swiper-pagination-current {
  margin-right: -4px;
  font-weight: 500;
}
.visualBann .controls .page .swiper-pagination-total {
  margin-left: -4px;
  opacity: 0.7;
}
.visualBann .controls .prev, .visualBann .controls .next {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  vertical-align: top;
}
.visualBann .controls .pause, .visualBann .controls .more, .visualBann .controls .resume {
  display: inline-block;
  overflow: hidden;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  vertical-align: top;
  text-align: center;
  background: rgba(0, 0, 0, 0.3);
}
.visualBann .controls .pause a, .visualBann .controls .more a, .visualBann .controls .resume a {
  display: block;
  padding-top: 10px;
}
.visualBann.on {
  opacity: 1;
}

.pdtCateMainArea {
  position: relative;
  z-index: 20;
  width: 160px;
  height: 520px;
  margin-top: -520px;
  font-size: 0;
}
.pdtCateMainArea .pdtCateMain {
  display: inline-block;
  width: 160px;
  border: 1px solid #F9327B;
  border-radius: 0 0 14px 14px;
  vertical-align: top;
  background: #fff;
}
.pdtCateMainArea .pdtCateMain ul {
  overflow: hidden;
  height: 518px;
}
.pdtCateMainArea .pdtCateMain ul li a {
  display: block;
  line-height: 36px;
  padding-left: 20px;
  font-size: 14px;
}
.pdtCateMainArea .pdtCateMain ul li a:hover {
  font-weight: 600;
  color: #F9327B;
  background: #f8f8f8;
}
.pdtCateMainArea .pdtCateMain ul li.on a {
  font-weight: 600;
  color: #F9327B;
  background: #f8f8f8;
}
.pdtCateMainArea .pdtCateMain ul li:last-child {
  overflow: hidden;
  border-radius: 0 0 14px 14px;
}
.pdtCateMainArea .pdtCateMain.on {
  border-radius: 0 0 0 14px;
}
.pdtCateMainArea .mainTreeNav {
  display: none;
  overflow: hidden;
  min-width: 160px;
  height: 520px;
  border: 1px solid #ddd;
  border-left: 0;
  border-radius: 0 0 14px 0;
  vertical-align: top;
  background: #fff;
}
.pdtCateMainArea .mainTreeNav li {
  white-space: nowrap;
}
.pdtCateMainArea .mainTreeNav li a {
  display: block;
  line-height: 36px;
  padding: 0 20px;
  font-size: 14px;
  color: #888;
}
.pdtCateMainArea .mainTreeNav li a:hover {
  color: #111;
  background: #f8f8f8;
}
.pdtCateMainArea .mainTreeNav.on {
  display: inline-block;
}
.pdtCateMainArea.on {
  width: auto;
}

.cateList {
  margin-top: 60px;
}
.cateList .list {
  font-size: 0;
  text-align: center;
}
.cateList .list li {
  display: inline-block;
  width: auto;
  margin-right: 24px;
  text-align: center;
}
.cateList .list li span {
  position: relative;
  overflow: hidden;
  display: block;
  width: 120px;
  height: 120px;
  margin-bottom: 10px;
}
.cateList .list li span img {
  width: 120px;
}
.cateList .list li a:hover span:after, .cateList .list li a:focus span:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 116px;
  height: 116px;
  border-radius: 14px;
  border: 2px solid #f9327b;
}
.cateList .list li:last-child {
  margin-right: 0;
}
.cateList .prev img, .cateList .next img {
  top: 45px;
}

.cateList ~ .pdtBann {
  margin-top: 50px;
}
.cateList ~ .pdtBann .list {
  overflow: hidden;
  border-radius: 10px;
}
.cateList ~ .pdtBann .list img {
  height: 100px;
}
.cateList ~ .pdtBann .list .page {
  border-radius: 8px;
}

.timeDeal .list li {
  float: left;
  position: relative;
  width: calc(50% - 15px);
  padding: 40px;
  margin: 40px 15px 0 0;
  border-radius: 40px;
  background: #fff;
  box-shadow: 0 4px 30px 0 rgba(0, 0, 0, 0.1);
}
.timeDeal .list li:nth-child(2n) {
  margin-left: 15px;
  margin-right: 0;
}
.timeDeal .list li.soldout {
  position: relative;
}
.timeDeal .list li.soldout:after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  border-radius: 40px;
  background: rgba(0, 0, 0, 0.3) url(/static/images/icon/ic_soldout2.png) no-repeat 50% 50%/250px;
}
.timeDeal .list .time {
  font-size: 20px;
  line-height: 22px;
}
.timeDeal .list .time:before {
  content: "";
  display: inline-block;
  width: 22px;
  height: 22px;
  margin: -2px 6px 0 0;
  vertical-align: middle;
  background: url(/static/images/icon/ic_time3.svg) no-repeat 0 0/100%;
}
.timeDeal .list .stock {
  position: absolute;
  right: 40px;
  top: 40px;
  font-size: 18px;
  color: #888;
}
.timeDeal .list .product {
  position: relative;
  min-height: 205px;
  padding-left: 230px;
  margin-top: 40px;
}
.timeDeal .list .product .thumb {
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  width: 200px;
  height: 200px;
}
.timeDeal .list .product .cate {
  font-size: 12px;
  font-weight: 600;
}
.timeDeal .list .product .pname {
  margin-top: 5px;
  font-size: 18px;
}
.timeDeal .list .product .price {
  position: absolute;
  left: 230px;
  bottom: 0;
}
.timeDeal .list .product .price .original {
  color: #aaa;
  font-size: 14px;
  text-decoration: line-through;
}
.timeDeal .list .product .price .percent {
  display: inline-block;
  font-size: 24px;
  font-weight: 600;
  color: #f9327b;
}
.timeDeal .list .product .price .discount {
  display: inline-block;
  font-size: 14px;
}
.timeDeal .list .product .price .discount strong {
  font-size: 24px;
}
.timeDeal .list .product .price .notLogin {
  font-weight: 600;
  font-size: 18px;
}
.timeDeal .list .product .price .notLogin a {
  padding-right: 14px;
  background: url(/static/images/icon/ic_arrow.svg) no-repeat 100% 50%;
}
.timeDeal .list .product .price .label {
  clear: both;
  padding-top: 5px;
}
.timeDeal .list .product .price .label span {
  display: inline-block;
  padding: 0 5px;
  line-height: 21px;
  border-radius: 2px;
  font-size: 12px;
  color: #f9327b;
  background: #f0f1f4;
}
.timeDeal .list:after {
  content: "";
  display: block;
  clear: both;
}

.main .specialList {
  overflow: hidden;
  position: relative;
}
.main .specialList .head {
  border-bottom: 0;
  padding-bottom: 0;
}
.main .specialList .pdtListArea {
  margin-right: 30px;
  margin-top: 0;
}
.main .specialList .pdtListArea .pdtList li:nth-child(3n) {
  margin-right: 0;
}
.main .specialList .pdtListArea:before {
  display: none;
}
.main .specialList:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 170px;
  bottom: 75px;
  width: 1px;
  background: #ddd;
}

.eventBanner {
  position: relative;
  overflow: hidden;
}
.eventBanner .list {
  overflow: hidden;
}
.eventBanner .list li {
  float: left;
  overflow: hidden;
  width: 620px;
  height: 252px;
  border-radius: 40px;
  margin-right: 40px;
}
.eventBanner .list li img {
  min-width: 620px;
  min-height: 252px;
}
.eventBanner .list:first-child {
  margin-top: 60px;
}
.eventBanner .controls {
  position: absolute;
  right: 0;
  top: 107px;
}
.eventBanner .controls .prev, .eventBanner .controls .next {
  width: 30px;
  height: 30px;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.eventBanner .controls .prev span, .eventBanner .controls .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.eventBanner .controls .prev.prev, .eventBanner .controls .next.prev {
  transform: rotate(180deg);
}
.eventBanner .controls .prev.swiper-button-disabled, .eventBanner .controls .next.swiper-button-disabled {
  opacity: 1;
  background-image: url(/static/images/icon/ic_next2.svg);
}
.eventBanner.typeB {
  margin-top: 20px;
}
.eventBanner.typeB .controls {
  top: 0;
}

.movieArea {
  overflow: hidden;
}
.movieArea li {
  float: left;
  width: 386px;
}
.movieArea li .mv {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%;
  border-radius: 14px;
}
.movieArea li .mv iframe, .movieArea li .mv video-js {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.movieArea li .mv.vertical {
  padding-top: 126.08%;
}
.movieArea li .mv .play, .movieArea li .mv .pause {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}
.movieArea li .mv .play.pause, .movieArea li .mv .pause.pause {
  display: none;
}
.movieArea li .mv .play:before, .movieArea li .mv .pause:before {
  content: "";
  position: absolute;
  left: calc(50% - 23px);
  top: calc(50% - 23px);
  width: 46px;
  height: 46px;
}
.movieArea li .mv .play.play:before, .movieArea li .mv .pause.play:before {
  background: url(/static/images/icon/ic_play.svg) no-repeat 0 0;
}
.movieArea li .tit {
  margin-top: 20px;
  font-size: 18px;
}
.movieArea li .text {
  margin-top: 5px;
  font-size: 14px;
  color: #888;
}
.movieArea li + li {
  margin-left: 61px;
}

.monthlyBest .monthlyPdtListArea {
  overflow: hidden;
}
.monthlyBest .pdtList {
  margin: 48px 0 50px;
}
.monthlyBest .pdtList li {
  margin-bottom: 40px;
}
.monthlyBest .pdtList li:nth-child(5n) {
  margin-right: 0;
}
.monthlyBest .controls {
  text-align: center;
}
.monthlyBest .controls .page {
  position: static;
  display: inline-block;
  width: 65px;
  text-align: center;
  font-size: 14px;
  line-height: 30px;
  font-family: "Roboto";
  color: #888;
  vertical-align: top;
}
.monthlyBest .controls .page .swiper-pagination-current {
  font-weight: 500;
  color: #111;
}
.monthlyBest .controls .prev, .monthlyBest .controls .next {
  width: 30px;
  height: 30px;
  vertical-align: middle;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.monthlyBest .controls .prev span, .monthlyBest .controls .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.monthlyBest .controls .prev.swiper-button-disabled, .monthlyBest .controls .next.swiper-button-disabled {
  opacity: 1;
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.monthlyBest .controls .prev.prev:not(.swiper-button-disabled), .monthlyBest .controls .prev.next.swiper-button-disabled, .monthlyBest .controls .next.prev:not(.swiper-button-disabled), .monthlyBest .controls .next.next.swiper-button-disabled {
  transform: rotate(180deg);
}
.monthlyBest .prevBtn, .monthlyBest .nextBtn {
  display: none;
  position: fixed;
  left: calc(50% - 710px);
  top: calc(50% - 23px);
  z-index: 10;
}
.monthlyBest .prevBtn img, .monthlyBest .nextBtn img {
  width: 25px;
}
.monthlyBest .prevBtn.prevBtn img, .monthlyBest .nextBtn.prevBtn img {
  transform: rotate(180deg);
}
.monthlyBest .prevBtn.swiper-button-disabled button, .monthlyBest .nextBtn.swiper-button-disabled button {
  display: none;
}
.monthlyBest .prevBtn.nextBtn, .monthlyBest .nextBtn.nextBtn {
  left: initial;
  right: calc(50% - 710px);
}

.todayBest .todayPdtListArea {
  overflow: hidden;
}
.todayBest .moreBtn {
  text-align: center;
}
.todayBest .moreBtn a {
  width: 330px;
}

.newList {
  overflow: hidden;
  /*.list {overflow:hidden;
    li {float:left; width:298px; white-space:normal;
      .thumb {overflow:hidden; height:350px; border-radius:30px;
        img {width:298px; height:350px;}
      }
      .tit {margin-top:15px; font-size:18px;}
      &+li {margin-left:29px;}
    }
  }*/
}
.newList .pdtList.typeC li {
  width: 232px;
  margin: 0 30px 50px 0;
}
.newList .moreBtn {
  text-align: center;
}
.newList .moreBtn button {
  width: 330px;
}
.newList .moreBtn button .swiper-pagination-current {
  margin-left: 24px;
  font-weight: 600;
}

.bestDeal {
  position: relative;
  padding: 50px 0 100px;
  margin: 150px 0 50px;
  background-color: #f2f2f2;
  background-position: 50% 0;
}
.bestDeal .swiper-container {
  padding-top: 10px;
  margin-top: -10px;
}
.bestDeal .swiper-container .pdtList li {
  margin-left: 0;
  margin-right: 40px;
}
.bestDeal > .label {
  position: absolute;
  left: 15px;
  top: -35px;
}
.bestDeal > .label p {
  position: relative;
  display: inline-block;
  padding: 0 20px;
  border-radius: 20px 20px 20px 0;
  line-height: 54px;
  font-weight: 600;
  color: #fff;
  background: #111;
}
.bestDeal > .label p span {
  position: relative;
}
.bestDeal > .label p span:before {
  content: "";
  position: absolute;
  left: -3px;
  bottom: 2px;
  right: -3px;
  height: 6px;
  background: #f9327b;
  transform: skew(343deg);
}
.bestDeal > .label p em {
  position: relative;
}
.bestDeal > .label p:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -11px;
  border-left: 18px solid #111;
  border-top: 11px solid #111;
  border-right: 18px solid transparent;
  border-bottom: 11px solid transparent;
}
.bestDeal .controls {
  position: absolute;
  right: 0;
  top: 107px;
}
.bestDeal .controls .prev, .bestDeal .controls .next {
  width: 30px;
  height: 30px;
  background: url(/static/images/icon/ic_next3.svg) no-repeat 0 0;
}
.bestDeal .controls .prev span, .bestDeal .controls .next span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 100%;
}
.bestDeal .controls .prev.swiper-button-disabled, .bestDeal .controls .next.swiper-button-disabled {
  opacity: 1;
  background-image: url(/static/images/icon/ic_prev3.svg);
}
.bestDeal .controls .prev.prev:not(.swiper-button-disabled), .bestDeal .controls .prev.next.swiper-button-disabled, .bestDeal .controls .next.prev:not(.swiper-button-disabled), .bestDeal .controls .next.next.swiper-button-disabled {
  transform: rotate(180deg);
}

.bestReview .list li .commentArea .head {
  padding: 0;
}
.bestReview .list li:first-child {
  margin-top: 0;
}

.brandList {
  position: relative;
  padding: 60px 0;
  margin-top: 100px;
  background: #f9f9f9;
}
.brandList .head {
  padding: 0;
}
.brandList .list li {
  display: inline-block;
  width: 130px;
  margin-right: 23px;
  text-align: center;
  font-size: 14px;
  vertical-align: top;
}
.brandList .list li span {
  display: inline-block;
  overflow: hidden;
  width: 130px;
  height: 130px;
  margin-bottom: 20px;
  border-radius: 50%;
}
.brandList .list li:last-child {
  margin-right: 0;
}
.brandList .swiperWrap {
  padding-right: 38px;
}
.brandList .swiperWrap:after {
  display: none;
}
.brandList .swiperWrap .prev, .brandList .swiperWrap .next {
  width: 34px;
  background: #f9f9f9;
}
.brandList .swiperWrap .prev img, .brandList .swiperWrap .next img {
  top: 55px;
}

.mainSrmyArea {
  overflow: hidden;
  position: relative;
}
.mainSrmyArea .mainSrmy {
  float: left;
  width: 624px;
  overflow: hidden;
}
.mainSrmyArea .mainSrmy .head {
  padding-bottom: 0;
}
.mainSrmyArea .mainSrmy .head h2 {
  margin-right: 80px;
  text-align: left;
}
.mainSrmyArea .mainSrmy .pdtList li {
  float: left;
  width: 200px;
  margin: 0 12px 50px 0;
}
.mainSrmyArea .mainSrmy .moreBtn {
  text-align: center;
}
.mainSrmyArea .mainSrmy .moreBtn button {
  width: 330px;
}
.mainSrmyArea .mainSrmy .moreBtn button .swiper-pagination-current {
  margin-left: 24px;
  font-weight: 600;
}
.mainSrmyArea .mainSrmy + .mainSrmy {
  float: right;
}
.mainSrmyArea:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 170px;
  bottom: 93px;
  width: 1px;
  background: #ddd;
}

.mainLayer {
  top: 50%;
  bottom: initial;
  overflow: hidden;
  width: 860px;
  min-height: 1px;
  border-radius: 30px;
}
.mainLayer .list {
  position: relative;
  height: 584px;
}
.mainLayer .list li {
  text-align: center;
}
.mainLayer .list .page {
  position: absolute;
  left: initial;
  right: 0;
  bottom: 0;
  z-index: 50;
  width: 46px;
  height: 22px;
  padding-left: 5px;
  text-align: center;
  border-radius: 14px 0 0 0;
  background: rgba(0, 0, 0, 0.4);
  font-family: "Roboto";
  font-size: 10px;
  line-height: 22px;
  color: rgba(255, 255, 255, 0.4);
}
.mainLayer .list .page .swiper-pagination-current {
  font-weight: 500;
  color: #fff;
}
.mainLayer .btns {
  overflow: hidden;
}
.mainLayer .btns a {
  position: relative;
  float: left;
  width: 50%;
  line-height: 54px;
  font-size: 14px;
  text-align: center;
}
.mainLayer .btns a + a:before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 5px);
  width: 1px;
  height: 10px;
  background: #ddd;
}

.mainFloatingLayer {
  overflow: visible;
  width: 480px;
  min-height: 1px;
}
.mainFloatingLayer .thumb {
  overflow: hidden;
  border-radius: 30px 30px 0 0;
}
.mainFloatingLayer .btns {
  overflow: hidden;
  border-top: 1px solid #f0f0f0;
}
.mainFloatingLayer .btns a {
  position: relative;
  float: left;
  width: 50%;
  line-height: 54px;
  font-size: 14px;
  text-align: center;
}
.mainFloatingLayer .btns a + a:before {
  content: "";
  position: absolute;
  left: 0;
  top: calc(50% - 5px);
  width: 1px;
  height: 10px;
  background: #ddd;
}

.morePopupLayer {
  width: 970px;
}
.morePopupLayer h1 {
  height: 85px;
  padding-top: 27px;
  margin-left: 30px;
  text-align: left;
  font-size: 24px !important;
}
.morePopupLayer .close {
  top: 38px;
  right: 30px;
}
.morePopupLayer .content {
  max-height: calc(100% - 85px);
  padding: 0;
}

.marketingCouponLayer {
  bottom: initial;
  overflow: visible;
  width: 550px;
  padding-top: 38px;
  border-radius: 0;
  background: none;
}
.marketingCouponLayer .close {
  position: absolute;
  right: 7px;
  top: 0;
  overflow: hidden;
  width: 22px;
  height: 22px;
  text-indent: 100%;
  white-space: nowrap;
  background: url(/static/images/icon/ic_close3.svg) no-repeat 0 0/100%;
}
.marketingCouponLayer .content {
  overflow: hidden;
  min-height: 1px;
  padding: 60px 0 0;
  border-radius: 30px;
  background: #F2F2F2;
}
.marketingCouponLayer .text {
  font-size: 36px;
  text-align: center;
}
.marketingCouponLayer .coupon {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: flex-end;
  width: 360px;
  height: 200px;
  margin: 40px auto;
  padding: 0 0 24px 24px;
  background: url(/static/images/common/bg_coupon2.svg) no-repeat 0 0/100%;
}
.marketingCouponLayer .coupon .tit {
  font-size: 18px;
  color: #fff;
}
.marketingCouponLayer .coupon .cont {
  font-size: 36px;
  font-weight: 600;
  color: #fff;
}
.marketingCouponLayer .coupon .cont b {
  font-size: 50px;
}
.marketingCouponLayer .text2 {
  width: 241px;
  margin: 0 auto;
  font-size: 14px;
  color: #888;
  text-align: center;
}
.marketingCouponLayer .foot {
  margin-top: 40px;
}
.marketingCouponLayer .foot button {
  position: relative;
  width: 100%;
  height: 54px;
  border-radius: 0;
  line-height: 54px;
}
.marketingCouponLayer.hidden {
  opacity: 0 !important;
}
.marketingCouponLayer.hasPosition {
  top: initial;
  margin-top: initial !important;
}

.firstCouponLayer {
  overflow: hidden;
}

/*# sourceMappingURL=content.css.map */