/* BASIC css start */
/* 추가 작업 */
.btn_posi > div > div:nth-of-type(2) div img{
  filter: brightness(30%);
  transition-duration: .2s;
}
.btn_posi > div > div:nth-of-type(2) div.swiper-slide-thumb-active img{
  filter: brightness(100%);
}





header {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
  z-index: 101;
  max-width: 640px;
  width: 100%;
  background-color: white;
  padding: min(3%, 15px) 0;
}

header h1 {
  padding-left: 15px;
  margin: 0;
}

header a {
  display: block;
  width: 18%;
}

header a img {
  width: 100%;
}


.disc_in .dc_info {
color: #5F0080 !important;
font-weight: 700;
font-size: 15px;
padding-left: 8px;
}



/*sec001 */
  .sec001 .jung{display: none !important;}
  .sec001{box-sizing:border-box; padding: 50px 10px 30px;}
  .sec001 h3{margin:0 0 30px; line-height:1;font-size:17px;font-weight:700;color:#1a1a1a;clear:both; }
  .sec001 h3 a {right:20px; }
  .sec001 .a2{box-sizing:border-box;}
  .sec001 .swiper-scrollbar{height:3px !important;background:#E8E8E8;width:100% !important; left:0 !important;}
  .sec001 .swiper-scrollbar-drag{background:#BFBFBF;height:3px;border-radius:0;}

  .sec001 .swiper-slide{margin-top:0 !important;}
  .sec001 .list_shopping3x ul{width:100%;position:relative; display: flex; justify-content: space-between; flex-wrap: wrap; }
  .sec001 .tab_content li{width:158px;margin-top:0 !important;}
  .sec001 .swiper-scrollbar{height:3px !important;background:#E8E8E8; left:0 !important; width:100% !important; }
  .sec001 .swiper-scrollbar-drag{background:#BFBFBF;height:3px;border-radius:0;}
  
  .list_shopping3x li{width: 49%; padding-bottom: 20px;}
  
  .list_shopping3x .list_shoppingInfo {
        text-align: left;
    }
    
   .list_shopping3x .list_shoppingInfo .subName{
       margin-bottom: 10px;
   }

#overlay_layer {
display: none !important;
}

/* 공통 상품 기본폼 */
.normal_prod_wrap {
font-size: 0;
letter-spacing: 0
}

.normal_item .prod_thumb {
margin-bottom: 20px;
position: relative
}

.normal_item .prod_thumb .thumb_img {
width: 100%
}

.normal_item .prod_thumb .thumb_ov {
background: rgba(255, 255, 255, .75);
position: absolute;
width: 100%;
bottom: 0;
left: 0;
text-align: center;
opacity: 0;
visibility: hidden;
transition: all .35s;
-webkit-transition: all .35s;
-ms-transition: all .35s
}

.normal_item:hover .prod_thumb .thumb_ov {
opacity: 1;
visibility: visible
}

.normal_item .prod_thumb .thumb_ov>* {
height: 12px;
display: inline-block;
vertical-align: top;
padding: 0 17px;
margin: 15px 0
}

.normal_item .prod_thumb .thumb_ov a:last-child {
border-right: none
}

.normal_item .prod_thumb .thumb_ov a img {
margin-top: -2px
}

.normal_item .prod_thumb .prod_icon {
position: absolute;
bottom: 0;
left: 0;
display: block
}

.normal_item .prod_color span,
.normal_item .prod_thumb .prod_icon img {
display: inline-block;
vertical-align: top;
}

.normal_item .normal_price {
font-size: 15px;
font-weight: 600;
padding-right: 8px;
color: #1B1B1B !important;
letter-spacing: 0.02em;
}

.normal_item .consumer_price strike {
color: #9C9C9C;
}

.normal_item .consumer_price1 strike {
color: #9C9C9C;
padding-right: 8px;
}

.normal_item .consumer_price2 {
padding-left: 5px;
}

.normal_item .prod_name,
.normal_item .prod_price {
margin-bottom: 10px;
position: relative;
}

.normal_item .prod_price .sold_out b {
color: red;
display: inline-block;
margin-left: 5px;
font-size: 13px;
line-height: 13px;
margin-top: -2px
}

.normal_item .prod_subname {
width: 320px;
color: #9C9C9C;
margin-bottom: 12px;
word-wrap: break-word;
}

.normal_item .prod_color span {
width: 20px;
height: 3px;
margin-right: 5px;
margin-bottom: 5px;
}

.normal_item .prod_color span.border {
border: 1px solid #e2e2e2 !important;
;
width: 20px;
height: 3px;
box-sizing: border-box
}

.normal_item .prod_thumb a.link_wrap {
vertical-align: top;
}

.normal_item {
width: 31.9%;
vertical-align: top;
font-size: 13px;
margin-bottom: 72px;
}

html .normal_item .prod_thumb .thumb_ov {
background: rgba(0, 0, 0, 0.7);
}

/* swiper */
html,
body {
position: relative;
}

.swiper {
width: 100%;
}

.swiper-slide {
text-align: center;
font-size: 18px;
display: flex;
justify-content: center;
align-items: center;
height: auto;
}

.swiper-horizontal>.swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal {
top: auto !important;
bottom: 0;
background-color: #dfdfdf;
}

.profileSwiper .swiper-pagination-bullet {
background-color: #fff;
}

.weSwiper .swiper-button-prev {
left: 4%;
}

.weSwiper .swiper-button-next {
right: 4%;
}

.profileSwiper .swiper-button-prev {
left: 4%;
}

.profileSwiper .swiper-button-next {
right: 4%;
}

.swiper-button-prev:after {
width: 34px;
height: 69px;
}

.swiper-button-next:after {
width: 34px;
height: 69px;
}


/* 추가 분할 페이지 */

.scrollBox {
overflow: hidden;
}

.positionR {
position: relative;
}

.positionA {
position: absolute;
z-index: 10;
}

#prdBrand {
padding-left: 41.67vw;
position: relative;
}

.cut_lay {
width: auto;
}

.over {
position: relative;
width: 100%;
}

.item-wrap {
height: 100vh;
padding: 0 5.25%;
box-sizing: border-box;
}

.ffw {
display: none;
}

#contentWrapper {
padding-top: 0;
}

.flexBox {
flex-wrap: wrap;
padding-left: 41.67vw;
position: relative;
height: 100vh;
}

.tb-center {
width: 29.3%;
}

.tb-center .info li a {
display: block;
}

.tb-center .info li .thumb a img {
width: 100%;
}

.tb-center:not(:nth-child(3n)) {
margin-right: 2%;
}

.normal_prod_box {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.item-wrap h2{
max-width: 135px;
padding: 50px 0 30px;
}

.item-wrap h2 a{
display: block;
}

.item-wrap h2 a img{
width: 100%;
}

.item-wrap p {
color: #1B1B1B;
letter-spacing: -0.02em;
font-weight: 600;
font-size: 27px;
line-height: 27px;
margin: 0 0 35px;
}

.copy {
cursor: pointer;
}

.overBox img {
display: block;
width: 100%;
object-position: top;
object-fit: cover;
}

[data-title="transform"] {
opacity: 0;
z-index: 10;
transition-duration: 0.5s;
transform: translateY(20px);
}

[data-titCenter="transform"] {
opacity: 0;
left: 50%;
z-index: 10;
transition-duration: 0.5s;
transform: translate(-50%, 20px);
}

[data-title="transform"] {
position: absolute;
}

[data-titCenter="transform"] {
position: absolute;
}

.fadeInCenter {
transform: translate(-50%, 0);
opacity: 1;
}

.fadeIn {
opacity: 1;
transform: translateY(0);
}

.sec1 {
position: relative;
overflow: hidden;
}

.sec1>img:nth-child(n+2) {
position: absolute;
z-index: 20;
}

.sec1>img:nth-child(2) {
width: 5%;
top: 9.76%;
right: 13.25%;
}

.sec1>img:nth-child(3) {
width: 13.375%;
top: 19.78%;
right: 4.375%;
animation: 2s linear 0s infinite normal moveIcon;
}

.sec1>img:nth-child(4) {
width: 18.375%;
top: 38.46%;
left: 5.375%;
animation: 2s linear 0s infinite normal moveIcon;
}

.sec1>img:nth-child(5) {
width: 42%;
top: 86.296%;
left: 50%;
transform: translateX(-50%);
animation: 2s linear 0s infinite normal opacityBtn;
}

.sec1>img:nth-child(6) {
width: 2.125%;
top: 91.4%;
left: 50%;
transform: translateX(-50%);
animation: 2s linear 0s infinite normal moveIcon;
}

@keyframes opacityBtn {
0% {
    opacity: 0.3;
}

50% {
    opacity: 1;
}

100% {
    opacity: 0.3;
}
}

@keyframes moveIcon {
0% {
    transform: translateY(10px);
}

50% {
    transform: translateY(20px);
}

100% {
    transform: translateY(10px);
}
}

#styleLogWrap .sec01Swiper {
pointer-events: none;
position: absolute;
top: 8.08%;
left: 50%;
transform: translateX(-50%);
width: 81.25%;
}

.sec1 .scrollBox span {
margin: 0 auto;
display: block;
width: 1px;
height: 30px;
background-color: #fff;
}

.sec2 {
position: relative;
overflow: hidden;
}

.sec2 .original,
.sec2 .clone {
position: absolute;
width: 230%;
top: 50%;
display: flex;
justify-content: space-around;
}

.sec2 > div > img{
display: block;
padding: 0 1.8%;
width: 100%;
max-width: calc(201px + 3.6%);
box-sizing: border-box;
}

.sec2 .original {
animation: 27s linear 0s infinite normal forwards running rollingleft1;
}

.sec2 .clone {
animation: 27s linear 0s infinite normal none running rollingleft2;
}

.sec2 .instSwiper{
width: 94.875%;
position: absolute;
top: 53.336%;
left: 2.75%;
padding-bottom: 12%;
}

.instSwiper .swiper-pagination-bullet {
width: 12px;
height: 12px;
}

@keyframes rollingleft1 {
0% {
    transform: translateX(0);
}
50% {
    transform: translateX(-100%);
}
50.01%{
    transform: translateX(100%);
}
100%{
    transform: translateX(0);
}
}

@keyframes rollingleft2 {
0% {
    transform: translateX(100%);
}
100% {
    transform: translateX(-100%);
}
}

.sec2_1 img:nth-child(1){
cursor: pointer;
}

.sec2_1 img:not(:last-child){
display: none;
}

.sec2_1 img.fadein{
display: block;
}

.btn_posi{
position: relative;
}

.btn_posi > a{
position: absolute;
top: 41.74%;
width: 22.625%;
max-width: 181px;
}

.contents01 > a {
left: 3.75%;
}

.contents02 > a {
right: 4%;
}

.contents03 > a {
left: 3.75%;
}

.contents04 > a {
right: 4%;
}

.contents05 > a {
left: 3.75%;
}

.contents06 > a {
right: 4%;
}

.btn_posi > div{
position: absolute;
top: 45.836%;
left: 2.875%;
overflow: hidden;
width: 92.875%;
}

.btn_posi > div > div:nth-of-type(1){
position: absolute;
top: 0;
left: 0;
width: 100%;
}

.btn_posi > div > .tapSwiper01{
    width: 81% !important;
}

.btn_posi > div > div:nth-of-type(2){
position: absolute;
top: 51.851%;
left: 50%;
transform: translateX(-50%);
width: 85.638%;
}

.btn_posi > div > .tapSwiper04{
    top: 58.851% !important;
}

.btn_posi > div > div:nth-of-type(2) div img{
    border-radius: 20%;
}

.btn_posi > div > div:nth-of-type(3){
position: absolute;
bottom: 0;
left: 0;
width: 100%;
border-radius: 0 0 30px 30px;
}

.video-container {
position: relative;
height: 0;
padding-bottom: 177.5%;
width: 100%;
}

.sec7 .video-container {
padding-bottom: 56.1%;
}

.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

:root {
--swiper-theme-color: #000 !important;
}
/* BASIC css end */