/* 서브 공통 */
html, body{ overflow-x: hidden; }





/* 쇼룸 */
#sub.showroom .sub_visual{ height: 970px; width: 100%; position: relative; }
#sub.showroom .sub_visual .v_slide{ width: 100%; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
#sub.showroom .sub_visual .v_slide .swiper-slide .img{ width: 100%; height: 100%; position: relative; }
#sub.showroom .sub_visual .v_slide .swiper-slide .img img{ display: block; height: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) scale(1.15);
  min-width: 100%; transition: transform 5s, opacity1
}
#sub.showroom .sub_visual .v_slide .swiper-slide.swiper-slide-active .img img{ transform: translate(-50%,-50%) scale(1); }
#sub.showroom .sub_visual .swiper-button-next, #sub.showroom .sub_visual .swiper-button-prev{ width: 51px; height: auto; position: static; margin: 0; }
#sub.showroom .sub_visual .swiper-button-next:after, #sub.showroom .sub_visual .swiper-button-prev:after{ font-size: 0;  }

#sub.showroom .sub_visual .v_title{ position: absolute; left: 0; width: 100%; top: 50%; transform: translate(0,-50%); z-index: 5; display: flex; justify-content: center; align-items:  center; }
#sub.showroom .sub_visual .v_title strong{ display: block; font-size: 100px; font-weight: 500; color:#fff; margin: 0 50px; }
#sub.showroom .sub_visual .swiper-button-next{ transition: transform .6s; }
#sub.showroom .sub_visual .swiper-button-next:hover{ transform: translateX(10px);}
#sub.showroom .sub_visual .swiper-button-next svg #사각형_5816{ transition: stroke .4s, fill .4s; }
#sub.showroom .sub_visual .swiper-button-next:hover svg #사각형_5816{ stroke: #970A2C; fill: #970A2C; }
#sub.showroom .sub_visual .swiper-button-prev{ transition: transform .6s; }
#sub.showroom .sub_visual .swiper-button-prev:hover{ transform: translateX(-10px);}
#sub.showroom .sub_visual .swiper-button-prev svg #사각형_5815{ transition: stroke .4s, fill .4s; }
#sub.showroom .sub_visual .swiper-button-prev:hover svg #사각형_5815{ stroke: #970A2C; fill: #970A2C; }

#sub.showroom .sub_visual .v_slide .swiper-slide .img:after{ content:""; display: block; width: 311px; height: 311px; background: url('/img/sub/showroom_rec.png') center center no-repeat; position:absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
#sub.showroom .sub_visual .v_slide .swiper-slide.slide02 .img:after{ background: url('/img/sub/showroom_rec2.png') center center no-repeat;  }
#sub.showroom .sub_visual .v_slide .swiper-slide.slide03 .img:after{ background: url('/img/sub/showroom_rec3.png') center center no-repeat;  }
#sub.showroom .sub_visual .v_slide .swiper-slide.slide04 .img:after{ background: url('/img/sub/showroom_rec4.png') center center no-repeat;  }

#sub.showroom .scroll{ position: absolute; left: 50%; bottom: 0; transform: translate(-50%,0); z-index: 3; display: flex; cursor: pointer; }
#sub.showroom .scroll i{ transition: transform .4s, opacity .4s; }
#sub.showroom .scroll:hover i{ transform: translateY(10px); opacity: 0; }
#sub.showroom .scroll .watch{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width :100%; text-align: center;z-index: 1; }
#sub.showroom .scroll .watch strong{ color:#970A2C; font-weight: 500; font-size: 20px; width: 100%; display: block; transition: transform .4s, opacity .4s;
  transform: translateY(-10px); opacity: 0;
}
#sub.showroom .scroll:hover .watch strong{ opacity: 1; transform: translateY(0);}
#sub.showroom .scroll .box{ width: 100px; height: 100px; position: relative; overflow: hidden; }
#sub.showroom .scroll .center{ width: 100px; height: 100px; background-color: #fff; display: flex; justify-content: center; align-items: center; }
#sub.showroom .scroll span{ display: block; width: 50%; height: 50%; background-color: #fff; position: absolute; transition: transform .4s, opacity .4s; }

#sub.showroom .scroll span:nth-child(1){ left: 0; top: 0; transform: translate(-100%,0%); opacity: 0; }
#sub.showroom .scroll:hover span:nth-child(1){ transform: translate(0,0); opacity: 1; }
#sub.showroom .scroll span:nth-child(2){ right: 0; top: 0; transform: translate(0,-100%); opacity: 0; }
#sub.showroom .scroll:hover span:nth-child(2){ transform: translate(0,0); opacity: 1; }
#sub.showroom .scroll span:nth-child(3){ right: 0; bottom: 0; transform: translate(100%,0); opacity: 0; }
#sub.showroom .scroll:hover span:nth-child(3){ transform: translate(0,0); opacity: 1; }
#sub.showroom .scroll span:nth-child(4){ left: 0; bottom: 0; transform: translate(0,100%); opacity: 0;  }
#sub.showroom .scroll:hover span:nth-child(4){ transform: translate(0,0); opacity: 1; }

#sub.showroom .con{ position: relative; padding-top: 100px; padding-bottom: 100px; z-index: 1; }
#sub.showroom .s_bg{ position: absolute; left: 50%; top: 0; transform: translate(-50%,0); z-index: -1; }
#sub.showroom .inner{ width: 960px; padding: 0; }
#sub.showroom .inner .video video{ max-width: 960px; width: 100%; margin: 0 auto; }
#sub.showroom .info{ padding: 0 50px; margin-top: 50px; display: flex; flex-wrap: wrap; }
#sub.showroom .info dl{ width: 48%; margin-right: 4%; display: flex; align-items: center; margin-bottom: 20px; }
#sub.showroom .info dl:nth-child(2n+0){ margin-right: 0; }
#sub.showroom .info dl dt{ margin-right: 10px; }
#sub.showroom .info dl dd{ font-size: 18px; font-weight: 200; color:#000000; }

#sub.showroom .s_bg svg #BOX_GR path{ animation: block 3s infinite; }
#sub.showroom .s_bg svg #BOX_GR path:nth-child(2n+0){ animation-delay: .3s; }
#sub.showroom .s_bg svg #BOX_GR path:nth-child(3n+0){ animation-delay: .6s; }

#sub.warehouse .con{ max-width: 1920px; margin: 0 auto; position: relative; z-index: 1; }
#sub.warehouse .con .cate{ width: 1620px; margin: 0 auto; margin-bottom: 60px; }

#sub.warehouse .maps{ position: relative; height: 970px; }
#sub.warehouse .maps svg{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

#sub.warehouse .maps svg #MAP #ILLUST rect{ opacity: 0; animation: block2 3s; animation-fill-mode: forwards; }

#sub.warehouse .maps svg #MAP #ILLUST rect:nth-child(2n+0){ animation-delay: .2s; }
#sub.warehouse .maps svg #MAP #ILLUST rect:nth-child(3n+0){ animation-delay: .4s; }
#sub.warehouse .maps svg #MAP #ILLUST rect:nth-child(4n+0){ animation-delay: .6s; }
#sub.warehouse .maps svg #MAP #ILLUST rect:nth-child(5n+0){ animation-delay: .8s; }




@keyframes block2 {
  100%{
    opacity: 1;
  }
}

#sub.warehouse .maps:after{ content:""; display: block; width: 100%; height: 50%;
background: rgb(255,255,255);
background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);
position: absolute; left: 0; bottom: 0;
}
#sub.warehouse .txt{ width: 100%; position: absolute; left: 0; bottom: 130px;}
#sub.warehouse .txt .inner{ display: flex; align-items: center; }
#sub.warehouse .txt strong{ font-size: 100px; font-weight: 500; color:#000000; margin-right: 215px; display: block; line-height: 1em; }
#sub.warehouse .txt dl{ margin-bottom: 20px; display: flex; align-items: center; }
#sub.warehouse .txt dl:last-child{ margin-bottom: 0; }
#sub.warehouse .txt dl dt{ margin-right: 10px; }
#sub.warehouse .txt dl dt dd{ font-size: 18px; font-weight: 200; color:#000000; }

#sub.warehouse .maps svg #INCHEON{ transform: translate(378px,-4002px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub.warehouse .on .maps svg #INCHEON{ transform: translate(378px,-3982px); opacity: 1; }

#sub.warehouse .maps svg #HANAM{ transform: translate(508px, -3982px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .2s; }
#sub.warehouse .on .maps svg #HANAM{ transform: translate(508px,-3962px); opacity: 1; }

#sub.warehouse .maps svg #COMING_SOON1{ transform: translate(497px, -4094px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .4s; }
#sub.warehouse .on .maps svg #COMING_SOON1{ transform: translate(497px, -4074px); opacity: 1; }

#sub.warehouse .maps svg #COMING_SOON2{ transform: translate(457px,-3771px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .6s; }
#sub.warehouse .on .maps svg #COMING_SOON2{ transform: translate(457px, -3751px); opacity: 1; }

#sub.warehouse .maps svg #COMING_SOON3{ transform: translate(683px,-3711px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .8s; }
#sub.warehouse .on .maps svg #COMING_SOON3{ transform: translate(683px, -3691px); opacity: 1; }

#sub .con01 .cate{ margin-bottom: 80px; }
#sub .con01 .cate ul{ display: flex; }
#sub .con01 .cate ul li{ width: 300px; height: 80px; border: 2px solid #DDDDDD; position: relative; }
#sub .con01 .cate ul li a{ display: block; line-height: 76px; text-align: center; font-size: 24px; font-weight: 600; color: #CCCCCC; }
#sub .con01 .cate ul li:nth-child(2), #sub .con01 .cate ul li:nth-child(3){ margin-left: -2px; }
#sub .con01 .cate ul li.on a{ color:#970A2C;  }
#sub .con01 .cate ul li.on{ border-color: #970A2C; z-index: 1; }

#sub.showroom .con01 .cate ul{ justify-content: center; }

/* 게시판 공통 */
#sub.board .con{ position: relative; z-index: 1; }
#sub.board .con .b_tit{ padding-top: 300px; padding-bottom: 200px; }
#sub.board .con .b_tit strong{ display: inline-block; position: relative; font-size: 100px; font-weight: 500; color:#000000; line-height: 1em; }
#sub.board .con .b_tit strong:after{ content:""; display: block; width: 10px; height: 10px; border: 2px solid #970A2C; position: absolute; right: -12px; top: 5px; box-sizing: border-box;
  animation: block 2.5s infinite;
}
#sub.board .con .cate{ margin-bottom: 20px; }
#sub.board .con .cate ul{ display: flex; }
#sub.board .con .cate ul li{ width: 300px; height: 80px; border: 2px solid #DDDDDD; position: relative; }
#sub.board .con .cate ul li a{ display: block; line-height: 76px; text-align: center; font-size: 30px; font-weight: 600; color: #CCCCCC; }
#sub.board .con .cate ul li:last-child{ margin-left: -2px; }
#sub.board .con .cate ul li.on a{ color:#970A2C;  }
#sub.board .con .cate ul li.on{ border-color: #970A2C; z-index: 1; }
#sub.board .con .wrap{ margin-top: 0; display: flex; justify-content: space-between; }
#sub.board .con .wrap .cate2{ height: 80px; background-color: #F9F9F9; width: 70%; margin-right: 20px; display: flex; align-items: center; padding: 0 50px; }
#sub.board .con .wrap .cate2 ul{ display: flex; align-items: center; }
#sub.board .con .wrap .cate2 ul li{ margin-right: 50px; }
#sub.board .con .wrap .cate2 ul li:last-child{ margin-right: 0; }
#sub.board .con .wrap .cate2 ul li a{ display: block; padding: 3px 8px; color:#999999; font-size: 20px; font-weight: 400; transition: color .3s; }
#sub.board .con .wrap .cate2 ul li a:hover{ color: #970A2C; }
#sub.board .con .wrap .cate2 ul li.on a{ background-color: #970A2C !important; color: #fff !important; }
#sub.board .con .wrap .search{ width: 30%; height: 80px; background-color: #f9f9f9; position: relative; }
#sub.board .con .wrap .search .search_in{ border: none; width: 100%; height: 100%; font-size: 24px; color: #000; background-color: transparent; padding-left: 30px; }
#sub.board .con .wrap .search .search_in::placeholder{ color: #DDDDDD; }
#sub.board .con .wrap .search button{ position: absolute; right: 20px; top: 50%; transform: translate(0,-50%);}

#sub.board .con{ margin-bottom: 100px; }
#sub.board .g_list ul{ display: flex; flex-wrap: wrap; }
#sub.board .g_list ul li{ width: 367px; margin-right: 50px; margin-top: 50px; s}
#sub.board .g_list ul li:nth-child(4n+0){ margin-right: 0; }
#sub.board .g_list ul li .img{ position: relative; }
#sub.board .g_list ul li .img > img{ display: block; width: 100%; transition: transform .4s; }
#sub.board .g_list ul li .img .cover{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: hidden; z-index: 1; }
#sub.board .g_list ul li .img .cover > div{ position:absolute; width: 50%; height: 50%; transition: transform .4s; }
#sub.board .g_list ul li .img .cover > div > img{ display: block; width: 100%; height: 100%;  }
#sub.board .g_list ul li .img .cover > div:nth-child(1){ left: 0; top: 0; transform: translate(-100%,-100%); }
#sub.board .g_list ul li a:hover .img .cover > div:nth-child(1){ transform: translate(0,0); }

#sub.board .g_list ul li .img .cover > div:nth-child(2){ right: 0; top:0; transform: translate(100%,-100%); }
#sub.board .g_list ul li a:hover .img .cover > div:nth-child(2){ transform: translate(0,0); }

#sub.board .g_list ul li .img .cover > div:nth-child(3){ left: 0; bottom: 0; transform: translate(-100%,100%); }
#sub.board .g_list ul li a:hover .img .cover > div:nth-child(3){ transform: translate(0,0); }

#sub.board .g_list ul li .img .cover > div:nth-child(4){ right: 0; bottom: 0; transform: translate(100%,100%); }
#sub.board .g_list ul li a:hover .img .cover > div:nth-child(4){ transform: translate(0,0); }

#sub.board .g_list ul li a:hover .img > img{ transform: scale(.5); }
#sub.board .g_list ul li a .txt{ padding-top: 20px; }
#sub.board .g_list ul li a .txt strong{ display: block; font-size: 24px; font-weight: 600; color:#000000; margin-bottom: 20px; }
#sub.board .g_list ul li a .txt .cates{ font-size: 18px; font-weight: 200; color:#999999; }

#sub.board .g_list2 ul li{ width: 284px; margin-right: 50px; }
#sub.board .g_list2 ul li:nth-child(4n+0){ margin-right: 50px; }
#sub.board .g_list2 ul li:nth-child(5n+0){ margin-right: 0; }
#sub.board .g_list2 ul li .img .cover > div{ position:absolute; width: 50%; height: 100%; transition: transform .4s; }
#sub.board .g_list2 ul li .img .cover > div:nth-child(1){ left: 0; top: 0; transform: translate(-100%,0); }
#sub.board .g_list2 ul li a:hover .img .cover > div:nth-child(1){ transform: translate(0,0); }

#sub.board .g_list2 ul li .img .cover > div:nth-child(2){ right: 0; top:0; transform: translate(100%,0); }
#sub.board .g_list2 ul li a:hover .img .cover > div:nth-child(2){ transform: translate(0,0); }


#sub.board .page{ margin-top: 100px; }
#sub.board .page ul{ display: flex; justify-content: center; align-items: center; }
#sub.board .page ul li{ margin-right: 10px;  width: 40px; height: 40px; }
#sub.board .page ul li:last-child{ margin-right: 0; }
#sub.board .page ul li a{ display: block; width: 100%; height: 100%; text-align: center; line-height: 40px; font-size: 18px; font-weight: 500; color:#CCCCCC; }
#sub.board .page ul li.on a{ background-color: #970A2C; color: #fff; }




#sub.news .con .wrap{ justify-content: flex-end; }
#sub.news .n_list{ margin-top: 50px; }
#sub.news .n_list ul{ border-top: 1px solid #DDDDDD; }
#sub.news .n_list ul li{ border-bottom: 1px solid #ddd; }
#sub.news .n_list ul li a{ display: flex; height: 160px; position: relative; align-items: center; }
#sub.news .n_list ul li a .num{  width: 120px; height: 120px; display: flex; justify-content: center; align-items: center; margin-right: 50px; position: relative; }
#sub.news .n_list ul li a .num:after{ content:""; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; border: 1px solid #000000; transition: transform .4s; }
#sub.news .n_list ul li a:hover .num:after{ transform: scale(.8); }
#sub.news .n_list ul li a .num i{ color: #000000; font-weight: 600; font-size: 24px; }
#sub.news .n_list ul li.notice a .num i{ display: block; width: 20px; height: 20px; background-color: #970A2C; }
#sub.news .n_list ul li a strong{ font-size: 30px; font-weight: 500; color:#000000; display: inline-block; position: relative; }
#sub.news .n_list ul li a strong:after{ content:""; display: block; width: 50px; height: 30px; background: url('/img/sub/list_hover.png') center center no-repeat; position: absolute; right: -75px; top: 50%; transform: translate(0,-50%); opacity: 0; transition: opacity .3s;}
#sub.news .n_list ul li a:hover strong:after{ opacity: 1; }
#sub.news .n_list ul li a .date{ font-size: 20px; font-weight: 200; color:#999999; position: absolute; right: 0; top: 50%; transform: translate(0,-50%);}

#sub.news.view .v_con .v_tit{ border-top: 1px solid #DDDDDD; border-bottom: 1px solid #ddd; padding: 50px; }
#sub.news.view .v_con .v_tit strong{ font-size: 36px; font-weight: 600; color:#000000; display: block; margin-bottom: 20px; }
#sub.news.view .v_con .v_tit p{ font-size: 20px; font-weight: 200; color:#999999; }
#sub.news.view .v_con .v_ct{ padding: 50px; min-height: 400px; border-bottom: 1px solid #ddd; }
#sub.news.view .v_con .v_ct img{ max-width: 100%; }
#sub.news.view .v_con .b_btn{ display: flex; justify-content: flex-end; margin-top: 50px; }
#sub.news.view .v_con .b_btn a{ width: 200px; height: 70px; border: 1px solid #000; font-size: 24px; font-weight: 500; color: #000; line-height: 68px; text-align: center; transition: color .3s, background .3s, border .3s; }
#sub.news.view .v_con .b_btn a:hover{ color: #fff; background-color: #970A2C; border-color: #970A2C; }

/* CONTACT */
#sub.contact .con01 > .inner{ margin-bottom: 50px; }
#sub.contact .con01 .inner > strong{ font-size: 48px; font-weight: 500; color:#000000; display: block; }
#sub.contact .con01 .wrap{ position: relative; }
#sub.contact .con01 .wrap:after{ content:""; display: block; width: 0; height: 1px; background-color: #ddd; position: absolute; left: 0; top: 0; transition: width 1.5s; }
#sub.contact .con01.on .wrap:after{ width: 100%; }
#sub.contact .con01 .wrap:nth-child(3):after{ left: auto; right: 0; }
#sub.contact .con01 .wrap:nth-child(3):before{ content:""; display: block; width: 0; height: 1px; background-color: #ddd; position: absolute; left: 0; bottom: 0; transition: width 1.5s; }
#sub.contact .con01.on .wrap:nth-child(3):before{ width: 100%; }

#sub.contact .con01 .wrap ul{ display: flex; }
#sub.contact .con01 .wrap ul li{ width: 50%; height: 135px; display: flex;  align-items: center; padding: 0 50px; padding-right: 20px; position: relative; }
#sub.contact .con01 .wrap ul li:before{ content:""; display: block; width: 1px; height: 0; background-color: #ddd; position: absolute; left: 0; top: 0; transition: height 1s; transition-delay: 1s; }
#sub.contact .con01.on .wrap ul li:before{ height: 100%; }
#sub.contact .con01 .wrap ul li:last-child:after{  content:""; display: block; width: 1px; height: 0; background-color: #ddd; position: absolute; right: 0; top: 0; transition: height 1s; transition-delay: 1s;  }
#sub.contact .con01.on .wrap ul li:last-child:after{ height: 100%; }
#sub.contact .con01 .wrap ul li dl{ display: flex; }
#sub.contact .con01 .wrap ul li dt{ display: flex; align-items: center; margin-right: 20px; }
#sub.contact .con01 .wrap ul li dt svg{ margin-right: 20px; }
#sub.contact .con01 .wrap ul li dt strong{ font-size: 30px; font-weight: 500; color:#000000; }
#sub.contact .con01 .wrap ul li dd{ font-size: 24px; font-weight: 200; color: #000; }

#sub.contact .con01 .wrap ul li dt svg > g > rect{ animation: block 3s infinite; }
#sub.contact .con01 .wrap ul li dt svg > g > rect#사각형_7639{ animation-delay: .3s; }
#sub.contact .con01 .wrap ul li dt svg > g > rect#사각형_7640{ animation-delay: .6s; }
#sub.contact .con01 .wrap ul li dt svg > g > rect#사각형_7641{ animation-delay: .9s; }


#sub.contact .con01 .wrap:first-child{ margin-top: 50px; }
#sub.contact .con01 .wrap:last-child{ border-bottom: 1px solid #ddd; }

#sub.contact .con01 .bot{ margin-top: 79px; }
#sub.contact .con01 .bot .inner{ position: relative; display: flex; justify-content: space-between; }
#sub.contact .con01 .bot .kakao{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub.contact .con01 .bot.on .kakao{ transform: translateY(0); opacity: 1; }
#sub.contact .con01 .bot .kakao a{ min-width: 400px; height: 80px; display: flex; justify-content: center; align-items: center; background-color: #FFEE00; padding: 0 20px;}
#sub.contact .con01 .bot .kakao a strong{ font-size: 24px; font-weight: 600; color:#3D2426; margin-right: 20px; }
#sub.contact .con01 .bot .sns{ position: relative; }
#sub.contact .con01 .bot .sns .sns_bg{ position: absolute; left: -80px; top: -80px; }
#sub.contact .con01 .bot .sns .wrap2{ display: flex; position: relative; z-index: 1; }
#sub.contact .con01 .bot .sns .wrap2 a{ display: block; margin-right: 80px; opacity: 0; transition: opacity .3s; }
#sub.contact .con01 .bot.on .sns .wrap2 a{ opacity: 1; }
#sub.contact .con01 .bot .sns .wrap2 a svg *{ transition: fill .3s, stroke .3s; }
#sub.contact .con01 .bot .sns .wrap2 a:hover svg rect{ fill: #970A2C; stroke: #970A2C; }
#sub.contact .con01 .bot .sns .wrap2 a:hover svg path{ fill: #fff; }
#sub.contact .con01 .bot .sns .wrap2 a:last-child{ margin-right: 0; }

#sub.contact .con02{ margin-top: 360px; }
#sub.contact .con02 .inner{ margin-bottom: 50px; }
#sub.contact .con02 .inner > strong{ font-size: 48px; font-weight: 500; color:#000000; display: block; }
#sub.contact .con02 .wraps{ position: relative; }
#sub.contact .con02 .qr > .center:hover:before{ transform: translate(-50%,-50%) scale(1.06);}

#sub.contact .con02 .wrap2{ display: block; position: relative; height: 300px; padding: 42px; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; }
#sub.contact .con02 .qr{ display: flex; justify-content: center;  flex-wrap: nowrap; width: 2100px; position: absolute; left: 50%; top: 0; transform: translate(-50%,0); cursor: pointer; }
#sub.contact .con02 .qr > .rec{ width: 300px; position: relative; border-right: 1px solid #ddd; }
#sub.contact .con02 .qr > div:after{ content:""; display: block; padding-bottom: 100%; box-sizing: border-box; margin-top: -1px; }
#sub.contact .con02 .qr > .center:before{ content:""; display: block; width: 300px; height: 298px; background-color: #970A2C; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: -1; transition: transform .4s; }

#sub.contact .con02 .qr .center{ background: url('/img/sub/contact_qr.png') center center no-repeat; background-color: #fff; background-size: 100%; transition: background .4s; position: relative; }
#sub.contact .con02 .wraps:hover .qr .center{ background-size: 110%; }
#sub.contact .con02 .partner{ display: block; width: 300px; height: 42px; background-color: #970A2C; color:#FFFFFF; font-size: 18px; font-weight: 600; line-height: 42px; text-align: center; margin: 0 auto; transition: opacity .4s; }
#sub.contact .con02 .partner.on{ opacity: 0;}
#sub.contact .con02 .qr .hover{ width: 600px; height: 300px; position: absolute; display: flex;  }
#sub.contact .con02 .qr .hover span{ display: block; width: 300px; height: 300px; border-right: 1px solid #ddd; }
#sub.contact .con02 .qr .hover span:first-child{ border-left: 1px solid #ddd; }
#sub.contact .con02 .qr .hover1{ left: 150px; top: 0; transition: transform .4s; }
#sub.contact .con02 .qr .hover2{ right: 150px; top: 0; transition: transform .4s; }
#sub.contact .con02 .qr:hover .hover1{ transform: translateX(-150px); }
#sub.contact .con02 .qr:hover .hover2{ transform: translateX(150px); }

#sub.contact .con02 p{ font-size: 16px; font-weight: 400; color: #999999; margin-top: 30px; text-align: center; }



#sub.p_view .con01{ padding-top: 285px; position: relative; z-index: 1; }
#sub.p_view .con01 .inner > div{ display: flex; align-items: center; }
#sub.p_view .con01 .inner > div > strong{ font-size: 60px; line-height: 1em ;font-weight: 600; color:#000000; margin-right: 30px; }
#sub.p_view .con01 .inner > div .cate{ padding: 3px 8px; background-color: #970A2C; font-size: 20px; color:#FFFFFF; font-weight: 400; opacity: 0; transition: opacity .3s; }
#sub.p_view .con01.on .inner > div .cate{ opacity: 1; }
#sub.p_view .con01 .inner .tag{ margin-top: 20px; overflow: hidden; position: relative; }
#sub.p_view .con01 .inner .tag ul{ display: flex; transform: translateY(100%); transition: transform 1s; transition-delay: .2s; }
#sub.p_view .con01.on .inner .tag ul{ transform: translateY(0);}
#sub.p_view .con01 .inner .tag ul li{ font-size: 24px; font-weight: 200; color:#000000; margin-right: 30px; }
#sub.p_view .con01 .inner .tag ul li:last-child{ margin-right: 0; }
#sub.p_view .con01 .c01_drag{ width: 100%; border: 10px solid #FFFFFF; border-radius: 50px; box-shadow: 0px 0px 50px rgba(0,0,0,0.1); margin-top: 50px;
  transform: translateY(50px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .6s;
}
#sub.p_view .con01.on .c01_drag{ transform: translateY(0); opacity: 1; }

#sub.p_view .con05{ width: 960px; margin: 0 auto; }
#sub.p_view .videos{ position: relative; padding-bottom: 56.25%; height:0; overflow: hidden; }
#sub.p_view .videos iframe{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.twentytwenty-overlay:hover .twentytwenty-after-label{ display: none; opacity: 0; }
.twentytwenty-before-label{ display: none; }
.twentytwenty-after-label{ display: none; }
.twentytwenty-overlay:hover{ background-color: transparent }
.twentytwenty-horizontal .twentytwenty-handle:before{ border-right:2px dashed #fff; background-color: transparent; margin-bottom: 35px; }
.twentytwenty-horizontal .twentytwenty-handle:after{ margin-top: 35px; }
.twentytwenty-horizontal .twentytwenty-handle:after{ border-right:2px dashed #fff; background-color: transparent; }
.twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after{ width: 0; }
.twentytwenty-handle{ width: 96px; height: 70px; margin-left: -48px; border: none; background: url('/img/sub/DRAG.png') center center no-repeat; border-radius: 0; box-shadow: none;
  filter: drop-shadow(0px,0px,20px,rgba(0,0,0,0.2));
}
.twentytwenty-handle span{ display: none; }

#sub.p_view .con02{ border-top: 1px solid #ddd; margin-top: 50px; position: relative; z-index: 1; }
#sub.p_view .con02 ul{ display: flex; flex-wrap: wrap;align-items: flex-start }
#sub.p_view .con02 ul li{ width: 25%; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; position: relative; padding: 50px; padding-right: 15px; height: 170px; }

#sub.p_view .con02 ul li p{ font-size: 18px; font-weight: 200; color:#000000; margin-bottom: 20px; }
#sub.p_view .con02 ul li strong{ display: block; font-size: 24px; font-weight: 700; color:#000000; }
#sub.p_view .con02 ul li:nth-child(1){ border-left: 1px solid #ddd; position: relative; }
#sub.p_view .con02 ul li:nth-child(1):after{ width: 100%; height: 1px; background-color: #ddd; position: absolute; left: -100%; bottom: -1px; content:""; display: block; }
#sub.p_view .con02 ul li:nth-child(4):after{ width: 100%; height: 1px; background-color: #ddd; position: absolute; right: -100%; bottom: -1px; content:""; display: block; }


#sub.p_view .con02 ul li:nth-child(5){ border-left: 1px solid #ddd; position: relative; }
#sub.p_view .con02 ul li:nth-child(5):after{ width: 100%; height: 1px; background-color: #ddd; position: absolute; left: -100%; bottom: -1px; content:""; display: block; }
#sub.p_view .con02 ul li.price{ width: 50%; border: none; padding: 0; padding-top: 35px; padding-left: 35px; position: relative; height: auto; }
#sub.p_view .con02 ul li.price .box{ padding: 44px; position: relative; }
#sub.p_view .con02 ul li.price .box:after{ content:""; display: block; width: 10px; height: 10px; border: 2px solid #970A2C; box-sizing: border-box; position: absolute; left: -5px; top: -5px; }
#sub.p_view .con02 ul li.price .box:before{ content:""; display: block; width: 200%; height: 100%; background-color: #F9F9F9; position: absolute; left: 0; top: 0; z-index: -1 ;}
#sub.p_view .con02 ul li.price .box dl{ display: flex; justify-content: space-between; align-items: center; }
#sub.p_view .con02 ul li.price .box dl:last-child{ margin-bottom: 0; }
#sub.p_view .con02 ul li.price .box dl dt{ font-size: 24px; font-weight: 200; color:#000000; }
#sub.p_view .con02 ul li.price .box dl dd{ font-size: 36px; font-weight: 700; color:#000000; }
#sub.p_view .con02 ul li.price .box dl dd span{ font-size: 24px; font-weight: 200; }

#sub.p_view .con03{ margin-top: 60px; position: relative; z-index: 1; padding-bottom: 216px; }
#sub.p_view .con03 .bgs{ position: absolute; left: 50%; top: 0; transform: translate(-50%,0); z-index: -1; }
#sub.p_view .con03 .bgs svg{  margin: 0 auto; display: block; }

#sub.p_view .con03 .wrap1{ display: flex; justify-content: space-between; padding-top: 108px; }
#sub.p_view .con03 .wrap1 .img02{ margin-top: 432px; }
#sub.p_view .con03 .wrap2{ margin-top: 215px; display: flex; align-items: center; }
#sub.p_view .con03 .wrap2 .img03{ margin-left: 108px; width: 50%; }
#sub.p_view .con03 .wrap2 .txt{ width :50%; display: flex; justify-content: center; }
#sub.p_view .con03 .wrap2 .txt dl{ margin-right: 30px; }
#sub.p_view .con03 .wrap2 .txt dl:last-child{ margin-right: 0; margin-top: 100px; }
#sub.p_view .con03 .wrap2 .txt dt { font-size: 18px; font-weight: 200; color:#999999; margin-bottom: 5px; }
#sub.p_view .con03 .wrap2 .txt dl dd{ line-height: 108px; position: relative; padding-left: 50px; font-size: 36px; font-weight: 600; color: #666666; }
#sub.p_view .con03 .wrap2 .txt dl dd:before{ content:""; display: block; width: 108px; height: 108px; border: 1px solid #DDDDDD; box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: -1; }
#sub.p_view .con03 .wrap1 .img01{ position: relative; }
#sub.p_view .con03 .wrap1 .img01:after{ content:""; display: block; width: 124px; height: 622px; background: url('/img/sub/casaroma_txt.png') center center no-repeat; position: absolute; right: -62px; bottom: -36px; }
#sub.p_view .con03 .wrap1 .img01 img{ clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transition: clip-path 1s, transform 1s; transform: scale(1.1); }
#sub.p_view .con03.on .wrap1 .img01 img{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);transform: scale(1); }

#sub.p_view .con03 .wrap1 .img02 img{ clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transition: clip-path 1s, transform 1s; transform: scale(1.1); transition-delay: .3s; }
#sub.p_view .con03.on .wrap1 .img02 img{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);transform: scale(1); }

#sub.p_view .con03 .wrap2 .img03 img{ clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transition: clip-path 1s, transform 1s; transform: scale(1.1); transition-delay: .6s; }
#sub.p_view .con03.on .wrap2 .img03 img{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);transform: scale(1); }


#sub.p_view .con04{ height: 800px; width: 100%; position: relative; z-index: 1; }
#sub.p_view .con04 .txt{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}
#sub.p_view .con04 .img{ height: 800px; position: absolute; overflow: hidden; margin: 0 auto; width: 100%; }
#sub.p_view .con04 .img img{ display: block; height: 100%; margin: 0 auto; transform: scale(.8); transition: transform 1s; transition-delay: 2s; }
#sub.p_view .con04 .img .wrap{ height: 100%; }
#sub.p_view .con04.on .img img{ animation: img_w 5s; animation-delay: 1.5s; animation-fill-mode: forwards; }
#sub.p_view .con04 .img figure{ clip-path: polygon(37% 5%, 63% 5%, 63% 95%, 37% 95%); transition: clip-path 1s; transition-delay: 2s; }

@keyframes img_w {
  50%{
    transform: scale(1);
    opacity: 1;
  }
  70%{
    transform: scale(1);
    opacity: 1;
  }
  100%{
    opacity: 0;
  }
}


#sub.p_view .con04.on .img figure{ clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%); }

#sub.p_view .con05 img{ display:block; max-width: 100%; margin: 0 auto; }
#sub.p_view .con05{ position: relative; z-index: 1; }
#sub.p_view .con06{ background-color: #fff; padding: 100px 0; position: relative; z-index: 1; }
#sub.p_view .con06 img{ max-width: 100%; display: block; margin: 0 auto; }

#sub.p_view .con07{ padding-top: 100px; position: relative; z-index: 1; }
#sub.p_view .con07 .inner > strong{ display: block; font-size: 30px; font-weight: 500; color:#000000; margin-bottom: 50px; }
#sub.p_view .con07 .rp_slide{ padding-bottom: 50px; border-bottom: 1px solid #ddd; }
#sub.p_view .con07 .rp_slide .swiper-slide a{ display: block; }
#sub.p_view .con07 .rp_slide .img{ position: relative; }
#sub.p_view .con07 .rp_slide .img:after{ display: block; width: 100%; height: 100%; content:""; display: block; position: absolute; left: -4px; top: -4px; border: 4px solid #970A2C; opacity: 0;
  transform: scale(.9); transition: opacity .4s, transform .4s;
}
#sub.p_view .con07 .rp_slide a:hover .img:after{ transform: scale(1); opacity: 1; }
#sub.p_view .con07 .rp_slide .img img{ display: block; max-width: 100%; }
#sub.p_view .con07 .rp_slide .txt{ padding-top: 20px; }
#sub.p_view .con07 .rp_slide .txt strong{ display: block; font-size: 24px; font-weight: 600; color:#000000; margin-bottom: 20px; }
#sub.p_view .con07 .rp_slide .txt p{ font-size: 18px; font-weight: 200; color:#999999 }
#sub.p_view .con07 .rp_slide .swiper-wrapper{ height: auto; }

#sub.p_view .con08{ padding: 100px 0; position: relative; z-index: 1; }
#sub.p_view .con08 .inner{ display: flex; justify-content: space-between; }
#sub.p_view .con08 .prev{ transition: transform .5s; }
#sub.p_view .con08 .prev:hover{ transform: translateX(-10px);}
#sub.p_view .con08 .prev:hover img{ transform: scale(.9);}
#sub.p_view .con08 .next{ transition: transform .5s; }
#sub.p_view .con08 .next:hover{ transform: translateX(10px);}
#sub.p_view .con08 .next:hover img{ transform: scale(.9);}

#sub.p_view .con08 .prev a{ display: block; display: flex; align-items: center; }
#sub.p_view .con08 .prev a strong{ margin: 0 20px; font-size: 24px; font-weight: 500; color: #000; }
#sub.p_view .con08 .inner > div > a > img{ width: 70px; display: block; transition: transform .5s; }

#sub.p_view .con08 .next a{ display: block; display: flex; align-items: center; }
#sub.p_view .con08 .next a strong{ margin: 0 20px; font-size: 24px; font-weight: 500; color: #000; }

#sub.p_view .con08 .list_b a{ display: block; width: 200px; height: 70px; border: 1px solid #000; font-size: 24px; line-height: 68px; text-align: center; font-weight: 500; transition: background .4s, color .4s, border .4s; }
#sub.p_view .con08 .list_b a:hover{ color: #fff; background-color: #970A2C; border-color:#970A2C; }



#sub.brand .con{ position: relative; z-index: 1; }
#sub.brand .con .sub_visual{ width: 100%; height: 485px; background: url('/img/sub/brand_visual.jpg') center top no-repeat; background-attachment: fixed; background-size: auto 485px; position: relative; }
#sub.brand .con .sub_visual .square{ max-width: 1920px; margin: 0 auto; position: relative; }
#sub.brand .con .sub_visual .square span{ display: block; width: 320px; height: 320px; border: 1px solid #fff; position:absolute; }
#sub.brand .con .sub_visual .square span:nth-child(1){ position: absolute; right: 319px; border-top: none; }
#sub.brand .con .sub_visual .square span:nth-child(2){ position: absolute; right: 0; top: 319px; }



#sub.brand .con01{ padding-top: 130px; padding-bottom: 140px; position: relative; max-width: 1920px; margin: 0 auto; z-index: 1; }
#sub.brand .con01 .square span{ display: block; width: 320px; height: 320px; border: 1px solid #DDDDDD; position:absolute; }
#sub.brand .con01 .square span:nth-child(1){ position: absolute; right: 0; top: -166px; }
#sub.brand .con01 .square span:nth-child(2){ position: absolute; right: 319px; top: 153px; }
#sub.brand .con01 .square span:nth-child(3){ width: 50px; height: 50px; position: absolute; right: 638px; top: 472px; }

#sub .clip{ overflow: hidden; }
#sub .clip strong{ transform: translateY(100%); transition: transform 1s; }
#sub .on .clip strong{ transform: translateY(0);}

#sub.brand .con01 strong{ display: inline-block; position: relative; font-size: 100px; font-weight: 500; color:#000000; line-height: 1em; }
#sub.brand .con01 strong:after{ content:""; display: block; width: 10px; height: 10px; border: 2px solid #970A2C; position: absolute; right: -12px; top: 5px; box-sizing: border-box;
  animation: block 2s infinite;
}

@keyframes block {
  50%{
    opacity: 0;
  }
  100%{
    opacity: 1;
  }
}

#sub.brand .br_p{ margin-top: 30px; font-size: 24px; line-height: 36px; color:#000000; }
#sub.brand .br_p span{ font-weight: 600; display: inline-block; position: relative; transition: color .3s; }
#sub.brand ul.cate_info{display: flex;margin-top: 40px;}
#sub.brand ul.cate_info li{font-size: 18px;color: #9A9A9A;}
#sub.brand ul.cate_info li:nth-child(1){margin-right: 50px;}
#sub.brand .br_p span:before{ content:""; display: block; width: 0; height: 25px; background-color: #970A2C; position: absolute; left: 0; top: 50%; transform: translate(0,-50%); transition: width 1s; z-index: -1; }
#sub.brand .on .br_p span:before{ width: 100%; }
#sub.brand .on .br_p span{ color: #fff; }

#sub.brand ul.cate_info {transform: translateY(50px);opacity: 0;transition: 1.2s; transition-delay: 0.4s}
#sub.brand .on ul.cate_info {transform: translateY(0);opacity: 1}
#sub.brand .con02{ margin-top: -22px; height: 970px; max-width: 100%; margin: 0 auto; position: relative; }
#sub.brand .con02 svg{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

#sub.brand .con02 .txt{ position: absolute; width: 100%; text-align: center; top: 66%; left: 0; }

#sub.brand .con02 svg #LIGHT #사각형_7656{ animation: light1 6s infinite; }
#sub.brand .con02 svg #LIGHT #사각형_7657{ animation: light2 6s infinite; }
#sub.brand .con02 svg #LIGHT #사각형_7658{ animation: light3 6s infinite; }
#sub.brand .con02 svg #LIGHT #사각형_7659{ animation: light4 6s infinite; }
#sub.brand .con02 svg #LIGHT #사각형_7660{ animation: light5 6s infinite; }
#sub.brand .con02 svg #LIGHT #사각형_7661{ animation: light6 6s infinite; }


#sub.brand .con07{padding-bottom: 108px}
#sub.brand .con07 .sch{transform: translateY(50px);opacity: 0;transition: 1.2s; transition-delay: 0.2s}
#sub.brand .con07.on .sch{transform: translateY(0);opacity: 1}
#sub.brand .con07 .map_w{transform: translateY(50px);opacity: 0;transition: 1.2s; transition-delay: 0.4s}
#sub.brand .con07.on .map_w{transform: translateY(0);opacity: 1}

@keyframes light1 {
  0%{
    transform: translate(-330px, 1189.5px);
  }
  100%{
    transform: translate(2250px, 1189.5px);
  }
}

@keyframes light2 {
  0%{
    transform: translate(2250px, 1380.5px);
  }
  100%{
    transform: translate(-330px, 1380.5px);
  }
}

@keyframes light3 {
  0%{
    transform: translate(-330px, 1554.5px);
  }
  100%{
    transform: translate(2250px, 1554.5px);
  }
}

@keyframes light4 {
  0%{
    transform: translate(844.5px, 640px) rotate(90deg);
  }
  100%{
    transform: translate(844.5px, 1940px) rotate(90deg);
  }
}

@keyframes light5 {
  0%{
    transform: translate(960.5px, 1940px) rotate(90deg);
  }
  100%{
    transform: translate(960.5px, 640px) rotate(90deg);
  }
}

@keyframes light6 {
  0%{
    transform: translate(1075.5px, 640px) rotate(90deg);
  }
  100%{
    transform: translate(1075.5px, 1940px) rotate(90deg);
  }
}


#sub.brand .con03{ height: 970px; display: flex; justify-content: space-between; align-items: center; max-width: 1920px; margin: 0 auto;  }
#sub.brand .con03 .b_slide{ height: 100%; width: 970px; }
#sub.brand .con03 .b_slide .swiper-slide{ }
#sub.brand .con03 .b_slide .img{ width: 970px; height: 100%; position: relative; opacity: 0; }
#sub.brand .con03 .b_slide .img:after{ content:""; width: 151px; height: 151px; background: url('/img/sub/brand_line.png') center center no-repeat; display: block; position: absolute; right: -150px; top: 384px; }
#sub.brand .con03 .b_slide .img:before{ content:""; display: block; width: 485px; height: 485px; border: 1px solid #ddd; box-sizing: border-box; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
#sub.brand .con03 .b_slide .img img{ display: block; position: absolute; width: 50%; transition: transform 1s, left 1s, top 1s; }
#sub.brand .con03 .b_slide .img img:nth-child(1){ left: 50%; top:0; }
#sub.brand .con03 .b_slide .img img:nth-child(2){ left:0; top: 50%; }

#sub.brand .con03 .b_slide .swiper-slide-active .img{ opacity: 1; }


#sub.brand .con03 .txt{ text-align: right; padding-right: 150px; }
#sub.brand .con03 .swiper-pagination{ margin-bottom: 10px; position: static; text-align: right; }
#sub.brand .con03 .swiper-pagination .swiper-pagination-bullet{ display: block; width: auto; height: auto; background: transparent; font-size: 16px; font-weight: 400; color:#DDDDDD; opacity: 1; margin-top: 10px; transition: color .3s; }
#sub.brand .con03 .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{ color: #000; }
#sub.brand .con03 .swiper-pagination .swiper-pagination-bullet:first-child{ margin-top: 0; }
#sub.brand .con03 .swiper-pagination .swiper-pagination-bullet b{ font-family: 'Montserrat', sans-serif; font-size: 60px; font-weight: 500; display: inline-block; margin-left: 5px; }


#sub.brand .con03 .b_slide .swiper-slide:nth-child(1) .img img:nth-child(1){ transform: translate(0,100%); }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(1) .img img:nth-child(2){ transform: translate(0,-100%); }


#sub.brand .con03 .b_slide .swiper-slide:nth-child(1).swiper-slide-active .img img:nth-child(1){ transform: translate(0,0); }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(1).swiper-slide-active .img img:nth-child(2){ transform: translate(0,0); }


#sub.brand .con03 .b_slide .swiper-slide:nth-child(2).swiper-slide-active .img img:nth-child(1){ transform: translate(-100%,0); }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(2).swiper-slide-active .img img:nth-child(2){ transform: translate(100%,0); }

#sub.brand .con03 .b_slide .swiper-slide:nth-child(3) .img img:nth-child(1){ transform: translate(-100%,0); }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(3) .img img:nth-child(2){ transform: translate(100%,0); }


#sub.brand .con03 .b_slide .swiper-slide:nth-child(3).swiper-slide-active .img img:nth-child(1){ transform: translate(-100%,100%);  }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(3).swiper-slide-active .img img:nth-child(2){ transform: translate(100%,-100%); }

#sub.brand .con03 .b_slide .swiper-slide:nth-child(4) .img img:nth-child(1){ transform: translate(-100%,100%); }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(4) .img img:nth-child(2){ transform: translate(100%,-100%); }


#sub.brand .con03 .b_slide .swiper-slide:nth-child(4).swiper-slide-active .img img:nth-child(1){ transform: translate(0,100%); }
#sub.brand .con03 .b_slide .swiper-slide:nth-child(4).swiper-slide-active .img img:nth-child(2){ transform: translate(0%,-100%); }

#sub.brand .con04{ display: flex; justify-content: space-between; max-width: 1920px; margin: 0 auto; align-items: center; }
#sub.brand .con04 .img{ position: relative; }
#sub.brand .con04 .img img{ clip-path:  polygon(0 0, 0 0, 0 100%, 0 100%); transition: clip-path 1s; }
#sub.brand .con04.on .img img{ clip-path:  polygon(0 0, 100% 0, 100% 100%, 0 100%); }
#sub.brand .con04 .img svg{ position: absolute; left: -324px; }
#sub.brand .con04 .img > img{ display: block; }
#sub.brand .con04 .txt{ padding-left: 150px; }
#sub.brand .con04 .txt strong{ display: block; font-size: 60px; font-weight: 500; color:#000000;}
#sub.brand .con04 .img svg{ z-index: 1; }
#sub.brand .con04 .img svg *{ transition: fill .3s; }
#sub.brand .con04 .img svg #COLOR_1:hover rect{ fill : #EEDCE0; }
#sub.brand .con04 .img svg #COLOR_1:hover text{ fill : #970A2C; }

#sub.brand .con04 .img svg #COLOR_2:hover rect{ fill : #FFF9E6; }
#sub.brand .con04 .img svg #COLOR_2:hover text{ fill : #FBBA00; }

#sub.brand .con04 .img svg #COLOR_3:hover rect{ fill : #F9F9F9; }
#sub.brand .con04 .img svg #COLOR_3:hover text{ fill : #999999; }

#sub.brand .con05{ margin: 0 auto; max-width: 1920px; position: relative; height: 970px; }
#sub.brand .con05 .txt{ position: absolute; width: 50%; left: 50%; top: 50%; transform: translate(0,-50%); text-align: center; }
#sub.brand .con05 .txt strong{ display: block; font-size: 60px; font-weight: 500; color:#000000; }

#sub.brand .con05 svg{ position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);}

#sub.brand .con05 svg #ITALY{ transform: translate(-6px, -12px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub.brand .con05.on svg #ITALY{ transform: translate(-6px, 2px); opacity: 1; }

#sub.brand .con05 svg #ITALY{ transform: translate(-6px, -12px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub.brand .con05.on svg #ITALY{ transform: translate(-6px, 2px); opacity: 1; }

#sub.brand .con05 svg #KOREA{ transform: translate(-2px, -4px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .2s; }
#sub.brand .con05.on svg #KOREA{ transform: translate(-2px, 14px); opacity: 1; }

#sub.brand .con05 svg #CHINA{ transform: translate(9px, -26px); opacity: 0; transition: transform 1s, opacity 1s; transition-delay: .4s; }
#sub.brand .con05.on svg #CHINA{ transform: translate(9px, -6px); opacity: 1; }


#sub.brand .sch{margin-bottom: 42px;}
#sub.brand .sch ul{display: flex}
#sub.brand .sch ul li:nth-child(1),
#sub.brand .sch ul li:nth-child(2){width: 27.16%;margin-right: 1.2355%}
#sub.brand .sch ul li:nth-child(3){width: 43.209%}
#sub.brand .sch ul li div{position: relative}
#sub.brand .sch ul li div button{position: absolute;right: 0;top: 0}
#sub.brand .sch ul li select{display: block;width: 100%;background: #F9F9F9;border: none;height: 80px;padding-left: 30px;color: #999999;font-size: 20px;font-weight: 500}
#sub.brand .sch ul li input{display: block;width: 100%;background: #F9F9F9;border: none;height: 80px;padding-left: 30px;color: #999999;font-size: 20px;font-weight: 500}
#sub.brand .con07 .map_w{display: flex}
#sub.brand .con07 .map_w > div{width: 50%}
#sub.brand .con07 .map_w > div.map{;text-align: center;padding-top: 115px;padding-bottom: 100px;position: relative}
#sub.brand .con07 .map_w > div.map .line_v{position: absolute;left: 50%;background: url(/img/sub/map_line02.png); height: 100%;width: 1px;top: 0}
#sub.brand .con07 .map_w > div.map .line_h{position: absolute;left: 0%;background: url(/img/sub/map_line01.png);width: 100%;height: 1px;top: 0}

#sub.brand .con07 .map_w > div.map .line_h:after{content: '';display: block;width: 200px;height: 1px;position: absolute;top: -1px;left: -200px;background: linear-gradient(to left, rgba(151,10,44,0), rgba(151,10,44,1), rgba(151,10,44,0));animation: scr 2s infinite linear}
#sub.brand .con07 .map_w > div.map .line_v:after{content: '';display: block;width:1px ;height: 200px;position: absolute;left: -1px;top: -200px;background: linear-gradient(to top, rgba(151,10,44,0), rgba(151,10,44,1), rgba(151,10,44,0));animation: scr2 4s infinite linear}
@keyframes scr{
	0%{left: -200px}
	100%{left: 100%}
}

@keyframes scr2{
	0%{top: -200px}
	100%{top: 100%}
}

#sub.brand .con07 .map_w > div.map .line_h02:after{animation-delay: 0.2s}
#sub.brand .con07 .map_w > div.map .line_v02:after{animation-delay: 0.4s}
#sub.brand .con07 .map_w > div.map .line_h03:after{animation-delay: 1.2s}
#sub.brand .con07 .map_w > div.map .line_h04:after{animation-delay: 0.3s}
#sub.brand .con07 .map_w > div.map .line_h05:after{animation-delay: 0.8s}
#sub.brand .con07 .map_w > div.map .line_h06:after{animation-delay: 1s}
#sub.brand .con07 .map_w > div.map{overflow: hidden}
#sub.brand .con07 .map_w > div.map .line_h01{top: 8%}
#sub.brand .con07 .map_w > div.map .line_h02{top: 24.4%}
#sub.brand .con07 .map_w > div.map .line_h03{top:41.2%}
#sub.brand .con07 .map_w > div.map .line_h04{top: 58.2%}
#sub.brand .con07 .map_w > div.map .line_h05{top: 75.4%}
#sub.brand .con07 .map_w > div.map .line_h06{top: 93%}
#sub.brand .con07 .map_w > div.map .line_v01{margin-left: -95px}
#sub.brand .con07 .map_w > div.map .line_v02{margin-left: 95px}
#sub.brand .con07 .map_w > div.map .in{display: inline-block;position: relative}
#sub.brand .con07 .map_w > div.map .in .pin ul li{position: absolute}
#sub.brand .con07 .map_w > div.map .in .pin ul li a{display: block;width: 100%;height: 100%;background: #000;opacity: 0}

#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(1){left: 23%;top: 17%;width: 9%;height: 5%;z-index: 2}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(2){left: 17%;top: 5%;width: 30%;height: 27%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(3){left: 42%;top: 0%;width: 38%;height: 29%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(4){left: 7%;top: 30%;width: 34%;height: 19%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(5){left: 34%;top: 26%;width: 30%;height: 22%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(6){left: 15%;top: 46%;width: 32%;height: 15%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(7){left: 13%;top: 59%;width: 32%;height: 19%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(8){left: 49%;top: 28%;width: 35%;height: 27%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(9){left: 42%;top: 53%;width: 41%;height: 15%;}
#sub.brand .con07 .map_w > div.map .in .pin ul li:nth-child(10){left: 8%;top: 93%;width: 19%;height: 7%;}

#sub.brand .con07 .map_w > div.map .in .base{position: relative}
#sub.brand .con07 .map_w > div.map .in .base ul li{position: absolute;top: 0;left: 0;opacity: 0;transition: 0.4s}
#sub.brand .con07 .map_w > div.map .in .base ul li.on{opacity: 1}
#sub.brand .con07 .list{padding-top: 100px;padding-left: 70px;}
#sub.brand .con07 .list > ul{height: 784px;overflow-y: scroll;padding-right: 16px;}
#sub.brand .con07 .list > ul::-webkit-scrollbar {width: 5px;background-color: #F6F6F6;height: 0}
#sub.brand .con07 .list > ul::-webkit-scrollbar-thumb {background-color: #970A2C;border-radius: 2.5px;}
#sub.brand .con07 .list > ul > li {position: relative;margin-bottom: 20px;}
#sub.brand .con07 .list > ul > li > a{display: block;position: relative;width: 100%;height: 248px;border: 1px solid #DDDDDD;padding: 50px;box-sizing: border-box;transition: 0.7s}
#sub.brand .con07 .list > ul > li:hover > a{border-color: #970A2C}
#sub.brand .con07 .list > ul > li > a .tit{display: flex;align-items: center;margin-bottom: 25px;}
#sub.brand .con07 .list > ul > li > a .tit strong{color: #000000;font-size: 26px;margin-right: 15px}
#sub.brand .con07 .list > ul > li > a .tit span{color: #6D6D6D;font-size: 18px;margin-right: 15px;margin-right: 10px;}
#sub.brand .con07 .list > ul > li > a ul li{font-size: 18px;color: #000000;line-height: 36px;font-weight: 500;position: relative;padding-left: 100px}
#sub.brand .con07 .list > ul > li > a ul li span{position: absolute;left: 0;color: #970A2C;}
#sub.brand .con07 .list > ul > li .copy{position: absolute;right: 0;bottom: 0}
#sub.brand .con07 .list > ul > li .copy a{display: block;width: 60px;height: 60px;overflow: hidden;background: #970A2C;transition: 0.7s}
#sub.brand .con07 .list > ul > li .copy a:hover{width: 220px;}
#sub.brand .con07 .list > ul > li .copy a span{white-space: nowrap;font-size: 18px;font-weight: 500;color: #FFFFFF;padding-left: 30px;display: block;line-height: 60px;transition: 0.7s; opacity: 0}
#sub.brand .con07 .list > ul > li .copy a:hover span{opacity: 1}
#sub.brand .con07 .list > ul > li .copy a i{position: absolute;right: 0;bottom: 0}
/*  */


#map_pop{position: fixed;top: 0;left: 0;width: 100%;height: 100%;display: flex;z-index: 9999;align-items: center;justify-content: center;background: rgba(0,0,0,0.5);z-index: 999999;display: none}
#map_pop.on{display: flex}
#map_pop .wrap{position: relative;}
#map_pop .wrap .map > img{ opacity: 0; }
#map_pop .wrap button{position: absolute;top: 0;right: 0; z-index: 10; }
#map_pop .txt{background: #fff;padding: 45px;}
#map_pop .txt .tit{display: flex;align-items: center;margin-bottom: 25px;}
#map_pop .txt .tit strong{color: #000000;font-size: 26px;margin-right: 15px}
#map_pop .txt .tit span{color: #6D6D6D;font-size: 18px;margin-right: 15px;margin-right: 10px;}
#map_pop .txt ul li{font-size: 18px;color: #000000;line-height: 36px;font-weight: 500;position: relative;padding-left: 100px}
#map_pop .txt ul li span{position: absolute;left: 0;color: #970A2C;}
@media (min-width: 1920px){
  #sub.brand .con .sub_visual{ background-size: 100% auto; }
}

@media (max-width: 1640px){
  #sub.showroom .cate{ padding-left:20px; padding-right: 20px; }
  #sub.warehouse .con .cate{ width: 100%; padding-left: 20px; padding-right: 20px; }
  .inner{ width: 100%; padding: 0 20px; }
  #sub.brand .con03 .txt{ padding-right: 40px; }
  #sub.brand .con04 .txt{ padding-left: 40px; }
  #sub.brand .con03 .b_slide .img{ width: 800px; }
  #sub.brand .con03{ height: 800px; }
  #sub.brand .con03 .b_slide .img:after{ display: none; }
  #sub.brand .con03 .b_slide .img:before{ width: 380px; height: 380px; }
  #sub.brand .con04{ height: 800px; }
  #sub.brand .con04 .img > img{ height: 100%; }
  #sub.brand .con04 .img svg{ height: 100%; width: auto; left: -267px; }
  #sub.brand .con04 .txt strong{ font-size: 40px; }
  #sub.brand .con01 strong{ font-size: 60px; }
  #sub.brand .con05 .txt strong{ font-size: 40px; }
  #sub.brand .con05{ height: 800px; }
  #sub.brand .con05 svg{ height: 100%; width: auto; }
  #sub.brand .con02{ height: 800px;  }
  #sub.brand .con02 svg{ height: 100%; width: auto; }
  #sub.brand .con03 .b_slide{ width: 800px; }
  #sub.warehouse .txt strong{ margin-right: 0; }
  #sub.warehouse .txt .inner{ justify-content: space-between; }
  #sub.board .g_list ul li{ width: 23%; margin-right: 2.666666%; }
  #sub.board .g_list ul li:nth-child(5n+0){ margin-right: 2.666666%; }
  #sub.board .g_list ul li:nth-child(4n+0){ margin-right: 0; }
  #sub.p_view .con03 .wrap1 .img01{ width: 41.5%; }
  #sub.p_view .con03 .wrap1 .img01 img{ width: 100%; display: block; }
  #sub.p_view .con03 .wrap1 .img02{ width: 48.5%; margin-top: 27%; }
  #sub.p_view .con03 .wrap1 .img02 img{ width: 100%; display: block; }
  #sub.p_view .con03 .wrap2 .img03{ width: auto; width: 38.5%; margin-left: 5%; }
  #sub.p_view .con03 .wrap2 .img03 img{ width: 100%; display: block; }
  #sub.p_view .con03 .bgs{ height: 100%; }
  #sub.p_view .con03 .bgs svg{ height: 100%; width: auto; }
  #sub.p_view .con03 .wrap1 .img01:after{ display: none; }
  #sub.p_view .con04 .txt{ width: 100%; }
  #sub.p_view .con04 .txt svg{ width: 90%; margin: 0 auto; height: auto; display: block; }
  #sub.p_view .con04 .img figure{width: 100%; height: 100%; position: relative; }
  #sub.p_view .con04 .img .wrap{ position: relative; width: 100%; }
  #sub.p_view .con04.on .img img{  transform: translate(-50%,-50%) scale(1); }
  #sub.p_view .con04 .img img{ position:absolute; left: 50%; top: 50%; transform: translate(-50%,-50%) scale(.8); transition: transform 1.5s; transition-delay: .5s; }
  #sub.p_view .con04 .img{ height: 600px; }

  @keyframes img_w {
    50%{
      transform: translate(-50%,-50%) scale(1);
      opacity: 1;
    }
    70%{
      transform: translate(-50%,-50%) scale(1);
      opacity: 1;
    }
    100%{
      transform: translate(-50%,-50%) scale(.8);
      opacity: 0;
    }
  }

  #sub.p_view .con04{ height: 600px; }
  #sub.contact .con01 .wrap ul li dt strong{ font-size: 22px; }
  #sub.contact .con01 .wrap ul li dd{ font-size: 18px; }
	#sub.brand .con07 .map_w > div.map .in .base{max-width: 90%;margin: 0 auto}
	#sub.brand .con07 .map_w > div.map .in .base img{max-width: 100%}
}

@media (max-width: 1480px){
  #sub.brand .con03 .swiper-pagination .swiper-pagination-bullet b{ font-size: 40px;}
}

@media (max-width: 1380px){
  #sub.brand .con03{ height: 700px; }
  #sub.brand .con03 .b_slide .img{ width: 700px; }
  #sub.brand .con04{ height: 700px; }
  #sub.brand .con05{ height: 700px; }
  #sub.brand .con02{ height: 700px;  }
  #sub.brand .con03 .b_slide{ width: 700px; }
  #sub.brand .con04 .img svg{ left: -234px; }
  #sub.brand .con01 .square span{ width: 200px; height: 200px; }
  #sub.brand .con .sub_visual .square span{ width: 200px; height: 200px; }
  #sub.brand .con .sub_visual .square span:nth-child(1){ right: 199px; }
  #sub.brand .con .sub_visual .square span:nth-child(2){ top: 199px; }
  #sub.brand .con01 .square span:nth-child(1){ display: none; }
  #sub.brand .con01 .square span:nth-child(2){ right: 199px; top:-87px; }
  #sub.brand .con01 .square span:nth-child(3){ right: 398px; top: 112px;  }
  #sub.brand .br_p{ font-size: 20px; line-height: 32px; }
  #sub.brand .con01{ padding-bottom: 80px; }
  #sub.warehouse .txt strong{ font-size: 60px; }
  #sub.warehouse .txt dl dd{ font-size: 14px; }
  #sub.warehouse .txt dl dt svg{ width: 20px; height: auto; }
	#map_pop .wrap{width: 90%}
	#map_pop img{max-width: 100%}
}

@media (max-width: 1280px){
  #sub.contact .con01 > .inner{ margin-bottom: 20px; }
  #sub.contact .con02 .inner{ margin-bottom: 20px; }
  #sub.contact .con01 .inner > strong{ font-size: 30px; }
  #sub.contact .con02 .inner > strong{ font-size: 30px; }
  #sub.contact .con01 .bot .sns .wrap2 a{ margin-right: 60px; }
  #sub.contact .con01 .bot .sns .sns_bg{ left: -60px; top: -60px; }
  #sub.contact .con01 .bot .sns .wrap2 a svg{ width: 60px; height: auto; }
  #sub.contact .con01 .bot .sns .sns_bg svg{ height: 240px; width: auto; }
  #sub.contact .con01 .bot .kakao a{ height: 60px; width: 300px; }
  #sub.contact .con01 .bot .kakao a strong{ font-size: 20px; margin-right: 10px; }
  #sub.contact .con01 .bot .kakao a i svg{ width: 30px; height: auto; }
  #sub.contact .con01 .bot{ margin-top: 59px; }
  #sub.contact .con02{ margin-top: 160px; }
	#sub.brand .con07 .map_w{display: block}
	#sub.brand .con07 .map_w > div{width: 100%}
	#sub.brand .con07 .list{padding-left: 0;padding-top: 40px;}
}

@media (max-width: 1200px){
  #sub.brand .con04 .txt strong{ font-size: 30px; }
  #sub.brand .con05 .txt strong{ font-size: 30px; }
  #sub.brand .br_p{ margin-top: 20px; }
}

@media (max-width: 1080px){
  #sub.brand .con03{ height: 600px; }
  #sub.brand .con03 .b_slide .img{ width: 600px; }
  #sub.brand .con04{ height: 600px; }
  #sub.brand .con05{ height: 600px; }
  #sub.brand .con02{ height: 600px;  }
  #sub.brand .con03 .b_slide{ width: 600px; }
  #sub.brand .con04 .img svg{ left: -202px; }
  #sub.brand .con04 .img{ transform: translateX(100px);}
  #sub.brand .con03 .b_slide .img:before{ width: 300px; height: 300px; }
  #sub.brand .con03 .swiper-pagination .swiper-pagination-bullet{ font-size: 14px; }
  #sub.brand .con03 .swiper-pagination .swiper-pagination-bullet b{ font-size: 30px; }
  #sub.showroom .sub_visual{ height: 800px; }
  #sub.showroom .sub_visual .v_title strong{ font-size: 60px; margin: 0 30px; }
  #sub.showroom .sub_visual .v_slide .swiper-slide .img:after{ width: 200px; height: 200px; background-size: 100% 100% !important; }
  #sub.showroom .sub_visual .swiper-button-next, #sub.showroom .sub_visual .swiper-button-prev{ width: auto; }
  #sub.showroom .sub_visual .swiper-button-next svg, #sub.showroom .sub_visual .swiper-button-prev svg{ width: 35px; height: auto; }
  #sub.showroom .scroll .box{ width: 50px; height: 50px;  }
  #sub.showroom .scroll .center{ width: 50px; height: 50px;  }
  #sub.showroom .scroll i img{ width: 18px; }
  #sub.showroom .scroll .watch strong{ font-size: 14px; }
  #sub.showroom .info dl dd{ font-size: 14px; }
  #sub.showroom .info{ padding: 0; }
  #sub.board .con .b_tit{ padding-top: 200px; padding-bottom: 80px; }
  #sub.board .con .b_tit strong{ font-size: 60px; }
  #sub.board .con .b_tit strong:after{ width: 6px; height: 6px;  }
  #sub.board .con .cate ul li{ width : 50%; height: 60px; }
  #sub.board .con .cate ul li a{ line-height: 56px; font-size: 20px; }
  #sub.board .con .wrap .cate2{ height: 60px; padding: 0 20px; width: 60%; }
  #sub.board .con .wrap .cate2 ul li a{ font-size: 14px; }
  #sub.board .con .wrap .search{ height: 60px; width: 40%; }
  #sub.board .con .wrap .search .search_in{ font-size: 16px; padding-left: 20px; }
  #sub.board .con .wrap .search button svg{ width: 24px; height: auto; }
  #sub.board .con .wrap .cate2 ul li{ margin-right: 20px; }
  #sub.board .g_list ul li{ margin-top: 30px; width: 48%; margin-right: 4%; }
  #sub.board .g_list ul li:nth-child(4n+0){ margin-right: 4%; }
  #sub.board .g_list ul li:nth-child(2n+0){ margin-right: 0; }
  #sub.board .g_list ul li a .txt strong{ font-size: 18px; margin-bottom: 10px ;}
  #sub.board .page{ margin-top: 50px; }
  #sub.board .page ul li a{ font-size: 14px; line-height: 30px; }
  #sub.board .page ul li a svg{ width: 30px; height: auto; }
  #sub.board .page ul li{ width: 30px; height: 30px; margin-right: 5px; }
  #sub.board .g_list ul li a .txt .cates{ font-size: 14px; }
  #sub.board .con{ margin-bottom: 60px ;}
  #sub.p_view .con01 .inner > div > strong{ font-size: 40px; margin-right: 15px; }
  #sub.p_view .con01 .inner > div .cate{ font-size: 16px; }
  #sub.p_view .con01 .inner .tag ul li{ font-size: 18px; margin-right: 12px; }
  #sub.p_view .con01{ padding-top: 200px; }
  #sub.p_view .con01 .c01_drag{ border-radius: 30px; border-width: 6px; }
  .twentytwenty-handle{ width: 60px; height: 44px; background-size: 100%; margin-left: -30px; }
  #sub.p_view .con02 ul li{ padding: 30px; padding-left: 20px; padding-right: 15px; }
  #sub.p_view .con02 ul li p{ font-size: 14px; margin-bottom: 10px; }
  #sub.p_view .con02 ul li{ height: 108px; }
  #sub.p_view .con02 ul li strong{ font-size: 18px; }
  #sub.p_view .con02 ul li.price .box{ padding: 30px; }
  #sub.p_view .con02 ul li.price .box dl dt{ font-size: 18px; }
  #sub.p_view .con02 ul li.price .box dl dd span{ font-size: 14px; }
  #sub.p_view .con02 ul li.price .box dl dd{ font-size: 24px; }
  #sub.p_view .con02 ul li.price{ padding-top: 20px; padding-left: 20px; }
  #sub.p_view .con03 .wrap2 .txt{ width: auto; }
  #sub.p_view .con03 .wrap2{ justify-content: space-between; }
  #sub.p_view .con03 .wrap2 .txt dt{ font-size: 14px; }
  #sub.p_view .con03 .wrap2 .txt dl dd{ font-size: 24px; line-height: 80px; padding-left: 30px; }
  #sub.p_view .con03 .wrap2 .txt dl dd:before{ width: 80px; height: 80px; }
  #sub.p_view .con07{ padding-top: 60px; }
  #sub.p_view .con07 .inner > strong{ margin-bottom: 20px; font-size: 24px; }
  #sub.p_view .con07 .rp_slide .txt strong{ font-size: 18px; margin-bottom: 10px; }
  #sub.p_view .con07 .rp_slide .txt p{ font-size: 14px; }
  #sub.p_view .con07 .rp_slide{ padding-bottom: 30px ;}
  #sub.p_view .con08 .prev a svg{ width: 24px;height: auto; }
  #sub.p_view .con08 .next a svg{ width: 24px;height: auto; }
  #sub.p_view .con08 .prev a strong{ font-size: 18px; margin: 0 10px; }
  #sub.p_view .con08 .inner > div > a > img{ width: 40px; }
  #sub.p_view .con08 .next a strong{ font-size: 18px; margin: 0 10px; }
  #sub.p_view .con08 .list_b a{ height: 50px; width: 140px; font-size: 18px; line-height: 48px; }
  #sub.p_view .con08{ padding-top: 40px; padding-bottom: 60px; }
  #sub.p_view .con03 .wrap2{ margin-top: 10%; }
  #sub.p_view .con03 .wrap2{ display: block; }
  #sub.p_view .con03 .wrap2 .img03{ width: 60%; }
  #sub.p_view .con03 .wrap1{ padding-top: 50px; }
  #sub.p_view .con03 .wrap2 .txt{ justify-content: flex-end; margin-top: 5%; }
  #sub.p_view .con03 .wrap2 .txt dl dd{ font-size: 18px; line-height: 60px;  }
  #sub.p_view .con03 .wrap2 .txt dl dd:before{ width: 60px; height: 60px; }
  #sub.p_view .con03 .wrap2 .txt dl{ margin-top: 18px; }
  #sub.p_view .con03 .wrap1 .img01{ width: 46.5%; }
  #sub.p_view .con03 .wrap1 .img02{  margin-top: 38%; }
  #sub.p_view .con04 .img{ height: 400px; }
  #sub.p_view .con04{ height: 400px; }
  #sub.p_view .con08 .list_b{ margin-top: 60px; }
  #sub.p_view .con08 .prev a strong{ font-size: 14px; }
  #sub.p_view .con08 .next a strong{ font-size: 14px; }
  #sub.p_view .con08 .inner > div > a > img{ width: 30px; }
  #sub.p_view .con08 .prev a svg{ width: 18px; }
  #sub.p_view .con08 .list_b a{ width: 110px; height: 44px; line-height: 42px; font-size: 16px; }
  #sub.p_view .con08 .next a svg{ width: 18px; }
  #sub.board .con .wrap .search{ height: 50px; width: 100%; }
  #sub.news .n_list ul li a .num{ width: 80px; height: 80px; }
  #sub.news .n_list ul li a .num i{ font-size: 18px; }
  #sub.news .n_list ul li a strong{ font-size: 20px; }
  #sub.news .n_list ul li a{ height: 120px;  }
  #sub.news .n_list ul li a .num{ margin-right: 20px; }
  #sub.news .n_list ul li a .date{ font-size: 14px; }
  #sub.news .n_list ul li a strong:after{ width: 30px; height: 18px; background-size: 100% 100%; right: -42px;  }
  #sub.news.view .v_con .v_tit strong{ font-size: 24px; line-height: 36px; margin-bottom: 10px; }
  #sub.news.view .v_con .v_tit{ padding: 25px 0; }
  #sub.news.view .v_con .v_tit p{ font-size: 16px; }
  #sub.news.view .v_con .v_ct{ padding: 25px 0; }
  #sub.news.view .v_con .b_btn{ margin-top: 30px; }
  #sub.news.view .v_con .b_btn a{ width: 160px; height: 50px; line-height: 48px; font-size: 18px; }
  #sub.contact .con01 .wrap ul li{ width: 100%; height: 80px; padding-left: 20px; border-bottom: 1px solid #eee; }
  #sub.contact .con01 .wrap ul li:last-child{ border-bottom: none; }
  #sub.contact .con01 .wrap ul li dt strong{ font-size: 18px; }
  #sub.contact .con01 .wrap ul li dd{ font-size: 14px; }
  #sub.contact .con01 .wrap ul li dt svg{ margin-right: 10px; width: 18px; height: auto; }
  #sub.contact .con01 .wrap ul li dl{ align-items: center; }
  #sub.contact .con02 .qr > .center:before{ width: 200px; height: 198px; }
  #sub.contact .con01 .wrap ul li:after{
    content: "";
    display: block;
    width: 1px;
    height: 0;
    background-color: #ddd;
    position: absolute;
    right: 0;
    top: 0;
    transition: height 1s;
    transition-delay: 1s;
  }
  #sub.contact .con01.on .wrap ul li:after{ height: 100%; }
  #sub.contact .con01 .wrap:nth-child(3) ul li:last-child{ border-bottom: none; }
  #sub.contact .con01 .wrap ul{ flex-direction: column; }
  #sub.contact .con01 .wrap:nth-child(3){  border-top: none; }
  #sub.contact .con02 .qr > .rec{ width: 200px; }
  #sub.contact .con02 .qr .hover{ width: 400px; height: 200px; }
  #sub.contact .con02 .wrap2{ height: 200px; }
  #sub.contact .con02 .wraps:before{ width: 200px; height: 200px; }
  #sub.contact .con02 .partner{ width : 200px; font-size: 14px; }
  #sub.contact .con02 .qr .hover span{ width: 200px; height :200px; }
  #sub.contact .con02 .qr .hover1{ left: 100px; }
  #sub.contact .con02 .qr{ width: 1400px; }
  #sub.contact .con02 p{ font-size: 14px; }
  #sub.board .g_list2 ul li:nth-child(5n+0){ margin-right: 4%; }
  #sub.board .g_list2 ul li:nth-child(2n+0){ margin-right: 0; }
	#map_pop .txt{padding: 25px;}
	#map_pop .txt .tit strong{font-size: 15px;}
	#map_pop .txt .tit span{font-size: 12px;}
	#map_pop .txt .tit i{width: 20px;;}
	#map_pop .txt ul li{font-size: 13px;line-height: 1.7;word-break: keep-all;padding-left: 60px;}
	#map_pop .txt .tit{margin-bottom: 12px;}
	#map_pop .wrap button svg{width: 35px;height: auto}
	#sub.brand .con07 .map_w > div.map{padding: 40px 0;}
	#sub.brand .con07 .map_w > div.map .line{opacity: 0.3}
	#sub.brand .con07 .list > ul > li > a .tit strong{font-size: 16px}
	#sub.brand .con07 .list > ul > li > a .tit span{font-size: 13px;}
	#sub.brand .con07 .list > ul > li > a ul li{font-size: 13px;line-height: 1.7;padding-left: 60px;}
	#sub.brand .con07 .list > ul > li > a .tit{margin-bottom: 15px;}
	#sub.brand .con07 .list > ul > li > a{padding: 30px;height: auto}
	#sub.brand .con07 .list > ul > li .copy a{width: 35px;height: 35px}
	#sub.brand .con07 .list > ul > li:hover .copy a{width: 35px;height: 35px}
	#sub.brand .con07 .list > ul > li .copy img{width: 35px;}
	#sub.brand .con07 .list > ul{height: 395px}
}

@media (max-width: 980px){
  #sub.showroom .inner{ width: 100%; padding: 0 20px; }
  #sub.p_view .con05{ width: 100%; padding: 0 20px;  }
	#sub.brand .con07{padding-bottom: 20px}
}


@media (max-width: 880px){
  #sub.brand .con03{ height: 500px; }
  #sub.brand .con03 .b_slide .img{ width: 500px; }
  #sub.brand .con04{ height: 500px; }
  #sub.brand .con05{ height: 500px; }
  #sub.brand .con02{ height: 500px;  }
  #sub.brand .con03 .b_slide{ width: 500px; }
  #sub.brand .con04 .img svg{ left: -167px; }
  #sub.brand .con03 .txt{ padding-right: 20px; }
  #sub.brand .con04 .txt{ padding-left: 20px; }
  #sub.brand .con .sub_visual{ height: 300px; background-size: auto 300px; }
  #sub.brand .con01{ padding-top: 70px; }
  #sub.brand .con .sub_visual .square{ display: none; }
  #sub.brand .con01 .square{ display: none; }
  #sub.brand .con01 strong{ font-size: 40px; }
  #sub.brand .br_p{ font-size: 18px; line-height: 28px; }
  #sub.warehouse .maps{ height: 100vh; }
  #sub.warehouse .maps svg{ height: 100%; width: auto; }
  #sub.warehouse .txt .inner{ display: block; }
  #sub.warehouse .txt dl{margin-bottom: 10px; }
  #sub.warehouse .txt .right{ margin-top: 20px; }
  #sub.warehouse .txt{ bottom: 60px; }
  #sub .con01 .cate ul li a{ line-height: 56px; font-size: 18px; }
  #sub .con01 .cate ul li{ height: 60px; }
  #sub.warehouse .con .cate{ margin-bottom: 30px; }
	#sub.brand .sch ul li select, #sub.brand .sch ul li input{height: 40px;font-size: 13px;}
	#sub.brand .sch ul li button svg{width: 40px;height: auto}
  #sub.brand ul.cate_info li{ font-size: 12px; margin-right: 0; }
  #sub.brand ul.cate_info{ flex-flow: column; gap: 4px; margin-top: 15px; }
  #sub.board .con .cate ul{ flex-wrap: wrap;}
  #sub.board .con .cate ul li:nth-child(2) ~ li{ margin-top: -2px; }
  #sub.board .con .cate ul li:nth-child(2n+0){ margin-left: -2px;}
}

@media (max-width: 750px){
  #sub.brand .con03{ height: auto; display: block; padding-bottom: 60px; padding-top: 60px; }
  #sub.brand .con03 .b_slide{ width: 400px; height: 400px; margin: 0 auto; }
  #sub.brand .con03 .b_slide .img{ width: 400px; }
  #sub.brand .con03 .txt{ text-align: center; padding-top: 30px; }
  #sub.brand .con03 .swiper-pagination{ text-align: center; }
  #sub.brand .con03 .txt{ padding-right: 0; }
  #sub.brand .con04{ align-items: flex-start; }
  #sub.p_view .con02 ul li{ width: 50%; }
  #sub.p_view .con02 ul li:nth-child(3){ border-left: 1px solid #ddd; }
  #sub.p_view .con02 ul li:nth-child(2):after{
    width: 100%;
    height: 1px;
    background-color: #ddd;
    position: absolute;
    right: -100%;
    bottom: -1px;
    content: "";
    display: block;
  }
  #sub.p_view .con02 ul li:nth-child(6):after{
    width: 100%;
    height: 1px;
    background-color: #ddd;
    position: absolute;
    right: -100%;
    bottom: -1px;
    content: "";
    display: block;
  }
  #sub.p_view .con02 ul li:nth-child(3):after{
      width: 100%;
      height: 1px;
      background-color: #ddd;
      position: absolute;
      left: -100%;
      bottom: -1px;
      content: "";
      display: block;
  }
  #sub.p_view .con02 ul li.price{ padding-left: 0; }
  #sub.p_view .con02 ul li.price{ width: 100%; }
}

@media (max-width: 640px){
  #sub.brand .con02{ height: 400px; }
  #sub.brand .br_p{ font-size: 14px; line-height: 22px; margin-top: 10px; }
  #sub.brand .con01 strong{ font-size: 30px; }
  #sub.brand .con04 .txt strong{ font-size: 20px; }
  #sub.brand .con03 .swiper-pagination .swiper-pagination-bullet b{ font-size: 20px; }
  #sub.brand .br_p span:before{ height: 20px; }
  #sub.brand .con05 .txt strong{ font-size: 20px; }
  #sub.brand .con05 .txt{transform: translate(-50%,-50%);}
  #sub.brand .con05 .txt{ padding-right: 20px; width: 100%; text-align: right; }
  #sub.brand .con05 svg{ left: 65%; }
  #sub.showroom .sub_visual{ height: 700px; }
  #sub.showroom .sub_visual .v_title strong{ font-size: 30px; margin: 0 15px;  }
  #sub.showroom .sub_visual .v_slide .swiper-slide .img:after{ width :120px; height: 120px; }
  #sub.showroom .s_bg { display: none; }
  #sub.showroom .con{ padding-top: 50px; padding-bottom: 60px; }
  #sub.showroom .info{ flex-wrap: nowrap; flex-direction: column; margin-top: 20px; }
  #sub.showroom .info dl{ margin-bottom: 10px; }
  #sub.showroom .info dl{ width: 100%; margin-right: 0; }
  #sub.showroom .info dl dt svg{ width: 24px; height: auto; }
  #sub.warehouse .txt strong{ font-size: 30px; }
  #sub.board .con .b_tit strong{ font-size: 40px; }
  #sub.board .con .b_tit{ padding-bottom: 40px ;}
  #sub.board .con .cate{ margin-bottom: 8px; }
  #sub.board .con .cate ul li{ height: 48px; }
  #sub.board .con .cate ul li a{ line-height: 46px; font-size: 16px; }
  #sub.board .con .wrap .cate2{ height: 48px; width: 100%; margin-bottom: 8px; }
  #sub.board .con .wrap{ flex-direction: column; }
  #sub.board .con .wrap .search{ width: 100%; height: 48px; }
  #sub.board .g_list ul li a .txt{ padding-top: 10px; }
  #sub.board .g_list ul li a .txt strong{ font-size: 16px ;margin-bottom: 8px; }
  #sub.board .g_list ul li a .txt .cates{ font-size: 12px; }
  #sub.news .n_list ul li a .num{ width: 40px; height: 40px; margin-right: 10px; }
  #sub.news .n_list ul li.notice a .num i{ width: 14px; height: 14px; }
  #sub.news .n_list ul li a .num i{ font-size:14px; }
  #sub.news .n_list ul li a strong{ font-size: 16px; }
  #sub.news .n_list ul li a{ height: 80px; }
  #sub.news .n_list ul li a strong:after{ display: none; }
  #sub.news.view .v_con .v_tit p{ font-size: 14px; }
  #sub.news.view .v_con .v_tit{ padding: 15px 0; }
  #sub.news.view .v_con .v_ct{ padding: 15px 0; min-height: 300px; }
  #sub.news.view .v_con .v_tit strong{ font-size: 18px; line-height: 28px; margin-bottom: 5px; }
  #sub.news.view .v_con .b_btn a{ width: 110px; height: 44px; font-size: 16px; line-height: 42px; }
  #sub.contact .con01 .wrap ul li dl{ flex-direction: column; justify-content: flex-start; align-items: flex-start; }
  #sub.contact .con01 .wrap ul li dl dt{ margin-bottom: 5px; }
  #sub.contact .con01 .wrap ul li dt strong{ font-size: 16px; }
  #sub.contact .con01 .wrap ul li dd{ font-size: 13px; }
  #sub.contact .con01 .bot .kakao a{ height: 42px; width: 150px; }
  #sub.contact .con01 .bot .kakao a strong{ font-size: 14px ; margin-right: 5px; }
  #sub.contact .con01 .bot .kakao a i svg{ width: 24px; }
  #sub.contact .con01 .bot .sns .wrap2 a svg{ width: 42px; }
  #sub.contact .con01 .bot .sns .wrap2 a{ margin-right: 42px; }
  #sub.contact .con01 .bot .sns .sns_bg svg{ height: 168px; }
  #sub.contact .con01 .bot .sns .sns_bg{ left: -42px; top: -42px; }
  #sub.contact .con01 .bot{ margin-top: 41px; }
  #sub.contact .con01 .inner > strong{font-size: 18px; }
  #sub.contact .con02 .inner > strong{font-size: 18px; }
  #sub.contact .con02{ margin-top: 80px; }
  #sub.brand .con01 strong:after{ width:6px; height: 6px; right: -8px; top: 1px;}
	#sub.brand .sch ul li:nth-child(1), #sub.brand .sch ul li:nth-child(2){margin-right: 0;margin-bottom: 10px;width: 100%}
	#sub.brand .sch ul{flex-wrap: wrap}
	#sub.brand .sch ul li:nth-child(3){width: 100%}
	#sub.brand .sch{margin-bottom: 20px;}
}

@media (max-width: 540px){
  #sub.brand .con03 .b_slide{ width: 300px; height: 300px; }
  #sub.brand .con03 .b_slide .img:before{ width: 160px; height: 160px; }
  #sub.brand .con03 .b_slide .img{ width: 300px; }
  #sub.brand .con01{padding-top: 50px; padding-bottom: 60px; }
  #sub.brand .con04{ height: 300px; }
  #sub.brand .con04 .img{ transform: translateX(40px); }
  #sub.brand .con04 .img svg{ left: -100px; }
  #sub.brand .con05 .txt{ top: 70%; z-index: 1; }
  #sub.brand .con05 svg{ left: 78%; }
    #sub.brand .con05{height: 400px; }
    #sub.brand .con01 strong{ font-size: 22px; }
    #sub.showroom .sub_visual{ height: 600px; }
    #sub.showroom .sub_visual .v_title strong{ font-size: 22px; }
    #sub.warehouse .txt dl dt{ margin-right: 5px; }
    #sub.warehouse .maps svg{ height: auto; width: 300%; }
    #sub.warehouse .txt strong{ font-size: 22px; }
    #sub.board .con .b_tit{ padding-top: 150px; }
    #sub.board .con .b_tit strong{ font-size: 22px; }
    #sub.board .con .wrap .search .search_in{ font-size: 14px; padding-left: 12px; }
    #sub.p_view .con01 .inner > div > strong{ font-size: 24px; margin-right: 8px; }
    #sub.p_view .con01 .inner > div .cate{ font-size: 12px; }
    #sub.p_view .con01 .inner .tag{ margin-top: 10px; }
    #sub.p_view .con01 .inner .tag ul li{ font-size: 14px; margin-right: 8px; }
    #sub.p_view .con01 .c01_drag{ margin-top: 20px; }
    #sub.p_view .con02 ul li strong{ font-size: 14px; }
    #sub.p_view .con02 ul li p{ font-size: 12px; margin-bottom: 2px; }
    #sub.p_view .con02 ul li{ padding: 15px 10px; height: 66px; }
    #sub.p_view .con02 ul li.price .box dl dt{ font-size: 14px; }
    #sub.p_view .con02 ul li.price .box dl dd{ font-size: 18px; }
    #sub.p_view .con02 ul li.price .box dl{ }
    #sub.p_view .con03 .wrap2 .txt dl{ margin-right: 20px; }
    #sub.p_view .con07 .rp_slide .txt strong{ font-size: 16px; margin-bottom: 5px; }
    #sub.p_view .con07 .rp_slide .txt p{ font-size: 12px; }
    #sub.p_view .con07 .rp_slide .txt{ padding-top: 10px; }
    #sub.news .n_list ul li a{ flex-direction: column; align-items: flex-start; }
    #sub.news .n_list ul li a{ height: auto; padding: 10px 0; text-align: left; }
    #sub.news .n_list ul li a .num{ width: 30px; height: 30px; margin-bottom: 10px; }
    #sub.news .n_list ul li a .date{ margin-top: 8px; font-size: 12px; }
    #sub.news .n_list{ margin-top: 10px; }
    #sub.board .page{ margin-top: 30px;}
    #sub.news .n_list ul li a .date{ display: block; transform: translate(0,0); position: static; }
    #sub .con01 .cate ul li a{ line-height: 44px; font-size: 15px; }
    #sub .con01 .cate ul li{ height: 48px; }
	#sub.brand .con07 .list{padding-top: 0}
    #sub .con01 .cate{ margin-bottom: 30px; }
    #sub.board .con .cate ul li a { font-size: 14px; }
    #sub.board .con .wrap .cate2 ul li{ margin-right: 8px; }
    #sub.board .con .wrap .cate2 ul li a{ font-size: 12px; }
    #sub .con01 .cate ul li a{font-size: 13.5px}
}



@media (max-width: 300px){
  #sub.brand .br_p{ word-break: keep-all; }
  #sub.brand .br_p br{ display: none; }
  #sub.brand .br_p{ font-size: 13px; line-height: 22px; }
  .inner{ padding: 0 10px; }
  #sub.brand .con02{ height: 300px; }
  #sub.brand .con01{ padding-bottom: 20px; }
  #sub.brand .con03 .txt{ padding-left: 10px; padding-right: 10px; }
  #sub.brand .con04 .txt{ padding-left: 10px; }
  #sub.brand .con04 .txt strong{ font-size: 16px; }
  #sub.brand .con04{ height: 200px; }
  #sub.brand .con05{ height: 300px; }
  #sub.brand .con04 .img svg{ left: -66px; }
  #sub.showroom .info dl dd{ font-size: 12px; word-break: keep-all; }
  #sub.showroom .con{ padding-top: 40px; padding-bottom: 20px; }
  #sub.showroom .inner{padding: 0 10px; }
  #sub.warehouse .txt dl dd{ font-size: 12px; line-height: 18px; word-break: keep-all; }
  #sub.p_view .con01{ padding-top: 150px; }
  #sub.p_view .con08 .inner .prev{ display: none; }
  #sub.p_view .con08 .inner .next{ display: none; }
  #sub.p_view .con08 .list_b{ margin-top: 0; }
  #sub.p_view .con08{ padding-top: 20px; }
  #sub.p_view .con08 .inner{ justify-content: center; }
  #sub .con01 .cate ul li a{ line-height: 36px; font-size: 11px; }
  #sub .con01 .cate ul li{ height: 40px; }
  #sub.brand .con03 .b_slide .img{ width: 280px; }
}





















/*  */