@charset "utf-8";

/* pointweb.co.kr by GIL */

/* 메인 비주얼 */
.vswrap {width:100%;padding:0 4.3rem;overflow:hidden;}
.visual {width:100%;height:839px;display:table;text-align:center}
.visual.visual1 {background:url("/_public/images/index/visual1.jpg") center top no-repeat;background-size:cover}
.visual.visual2 {background:url("/_public/images/index/visual3.jpg") center top no-repeat;background-size:cover}
.visual.visual3 {background:url("/_public/images/index/visual1.jpg") center top no-repeat;background-size:cover}
.vswrap .owl-controls {top:0}
.vswrap .owl-dots {display:none !important}
.owl-theme .owl-nav .fa {font-size:5.625rem;color:#df7661;opacity:0.7}
.owl-theme .owl-nav:hover .fa {opacity:1}

  /* 메인 비주얼 미디어쿼리 */
@media all and (max-width:1440px) {
.vswrap {margin-top:65px;padding:0 3.5%}
.visual {height:580px}
}
@media all and (max-width:640px) {
.vswrap {margin-top:60px;padding:0 3.5%}
.visual {height:480px}
}

/* 인덱스 공통 */
.mtitlearae {width:100%;display:table;position:relative;margin-bottom:4.8rem}
.main {width:100%;padding:6rem 0}
h2.mtitle {text-align:center;font-weight:bold;color:#000;text-transform:uppercase;font-size:1.667rem;display:table;margin:0 auto}
.main h2.mtitle strong {min-width:184px;font-weight:bold;color:#000;text-transform:uppercase;font-size:1.667rem;display:block;float: left}
.main h2.mtitle:before,
.main h2.mtitle:after {content:"";width:13.5rem;height:1px;background-color:#e2e2e2;display:block;position:relative;top:0.7rem}
.main h2.mtitle:before {float:left;margin-right:1.5rem}
.main h2.mtitle:after {float:right;margin-left:1.5rem}
.main:after {content:"";width:100%;display:table}
  /* 인덱스 공통 미디어쿼리 */
@media all and (max-width:1024px) {
.main {width:100%;padding:4rem 0}
h2.mtitle {font-size:1.533rem}
.mtitlearae {margin-bottom:2rem}
.main h2.mtitle strong {min-width:auto;float:none}
.main h2.mtitle:before,
.main h2.mtitle:after {display:none}
}

/* marea1 */
#ani2 {margin-top:3rem}
.main1 {position:relative;color:#333;text-align:center;font-weight:bold}
.main1 h2.mtitle:before,
.main1 h2.mtitle:after {display:none}
.main1 h2.mtitle {font-size:3.333rem}
.main1 .msubt {font-size:1.867rem;color:#9a9a9a;text-align:center;margin-top:1rem}
.main1 .imgarea {width:100%;position:relative;display:table;min-height:535px}
.main1 .imgarea span {display:block;position:absolute}
.main1 .imgarea .img1 {left:7rem;bottom:3rem}
.main1 .imgarea .img2 {left:0;right:0;margin:0 auto;z-index:1}
.main1 .imgarea .img3 {right:12rem;bottom:2rem}
.main1 .mrlist {width:100%;display:table}
.main1 .mrlist .list {width:33.33%;padding:0 2rem;text-align:center;float:left;padding:3rem 1rem 0 1rem}
.main1 .mrlist .list:nth-of-type(1),
.main1 .mrlist .list:nth-of-type(2),
.main1 .mrlist .list:nth-of-type(3) {padding-bottom:4rem}
.main1 .mrlist strong {color:#333333;font-size:2.133rem;font-weight:500;display:block;margin:1.8rem 0 1.2rem 0}
.main1 .mrlist p {line-height:1.8}
.main1 .mrlist span {width:100%;max-width:72px;display:block;text-align:center;padding-top:4.8rem;margin:0 auto}
.main1 .mrlist .icon1 {background:url("/_public/images/index/marea1_icon1.svg") center top no-repeat;background-size:contain}
.main1 .mrlist .icon2 {background:url("/_public/images/index/marea1_icon2.svg") center top no-repeat;background-size:contain}
.main1 .mrlist .icon3 {background:url("/_public/images/index/marea1_icon3.svg") center top no-repeat;background-size:contain}
.main1 .mrlist .icon4 {background:url("/_public/images/index/marea1_icon4.svg") center top no-repeat;background-size:contain}
.main1 .mrlist .icon5 {background:url("/_public/images/index/marea1_icon5.svg") center top no-repeat;background-size:contain}
.main1 .mrlist .icon6 {background:url("/_public/images/index/marea1_icon6.svg") center top no-repeat;background-size:contain}
  /* marea1 미디어쿼리 */
@media all and (max-width:1024px) {
#ani2 {margin-top:2rem}
.main1 .layout {max-width:100%}
.main1 h2.mtitle {font-size:2.333rem}
.main1 .msubt {font-size:1.400rem}
.main1 .imgarea {min-height:430px;width:93%;margin:0 auto}
.main1 .imgarea span {width:42%}
.main1 .imgarea span img {width: 80%}
.main1 .imgarea .img1 {left:0rem;bottom:0rem}
.main1 .imgarea .img2 {bottom:0}
.main1 .imgarea .img3 {right:0;bottom:0}
.main1 .mrlist .list {width:50%;padding:2rem 5rem 0 5rem}
.main1 .mrlist .list:nth-of-type(1),
.main1 .mrlist .list:nth-of-type(2),
.main1 .mrlist .list:nth-of-type(3) {padding-bottom:0}
.main1 .mrlist strong {font-size:1.667rem;margin-top:1.3rem}
.main1 .mrlist p {line-height: 1.4;text-align:left;}
.main1 .mrlist p br {display:none}
.main1 .mrlist span {max-width:60px;padding-top:3.5rem;}
}
@media all and (max-width:890px) {
.main1 .imgarea {min-height:400px;}
}
@media all and (max-width:768px) {
.main1 .imgarea {min-height:360px;}
.main1 .mrlist .list {padding:2rem 3rem 0 3rem}
}
@media all and (max-width:640px) {
.main1 .imgarea {min-height:295px;}
}
@media all and (max-width:540px) {
.main1 .imgarea {min-height:270px;}
}
@media all and (max-width:414px) {
.main1 .imgarea {min-height:220px;}
.main1 .mrlist .list {padding:2rem 2rem 0 2rem}
}
@media all and (max-width:320px) {
.main1 .imgarea {min-height:200px;}
}

/* main2 */
.main2 .layout {max-width:1790px}
.main2 .box {width:50%;float:left;overflow:hidden;height:564px;border:1px solid #c5c5c5}
.main2 .box img {height:100%}
.main2 .box.fix{border-right:0}
.main2 .box .box2 {height:100%;overflow:hidden}
.main2 .box .box2 .owl-nav {display:none}
.main2 .box .owl-carousel{height:100%}
.main2 .box .owl-carousel img {width:auto;height:100%}

  /* main2 미디어쿼리 */
@media all and (max-width:1440px) {
.main2 .layout {padding:0 3%}
.main2 .box {height:500px}
.main2 .box img {min-height:auto}
}

@media all and (max-width:1024px) {
.main2 .box {width:100%;float:none;height:auto;border:1px solid #c5c5c5;border-width:1px 1px 0 1px}
.main2 .box img {width:100%}
.main2 .box.fix {border-right:1px solid #c5c5c5}
.main2 .box .owl-carousel img {width:100%;height:auto}
}
/*@media all and (max-width:1200px) {
.main2 .box {height:400px}
}
@media all and (max-width:1024px) {
.main2 .box {width:93%;margin:0 auto;float:none;padding:0;text-align:center}
.main2 .box.fix{border-bottom:0;border-right:1px solid #c5c5c5}
.main2 .box img {min-height:auto}
.main2 .box .box2 .owl-carousel .owl-item {text-align:center}
}
@media all and (max-width:640px) {
.main2 .box {height:400px;}
}
@media all and (max-width:447px) {
.main2 .box {height:220px;}
} */

/* main3 best, main4 */
.main.main3 {padding-top:4rem}
.main3 .section {margin:0 auto;padding-bottom:3rem}
.main3 .layout,
.main4 .layout {max-width:1302px}
.main .slider {width:100%}
.main .slick-slide,
.main4 .view {border:1px solid #e1e1e1;border-width:1px 0 1px 1px;max-width:434px}
.main6 .slick-slide{border:0;max-width:216px}
.main .slick-slide:nth-of-type(3n+3),
.main4 .view:nth-of-type(3n+3) {border-right:1px solid #e1e1e1}
.main6 .slick-slide:nth-of-type(3n+3){border-right:0}
.main .slick-slide img,
.main4 .view img {width: 100%;min-width:434px}
.main6 .slick-slide img{width:100%;min-width:216px}
.main .slick-slide {opacity:0.2;float:left;max-height:434px;overflow:hidden;
  -webkit-transition: all ease-in-out .3s;
   -moz-transition: all ease-in-out .3s;
   -o-transition: all ease-in-out .3s;
   -ms-transition: all ease-in-out .3s;
transition: all ease-in-out .3s;}
.main .slick-active,
.main .slick-current {opacity:1}
.main .slick-dots {bottom: -2.5rem}

/* 메인 리스트 호버 효과 */
.main .view {float: left;overflow: hidden;position: relative;text-align: center;cursor: default;cursor: pointer}
.main .view .mask,
.main .view .content {width:100%;height:100%;position: absolute;overflow: hidden;top: 0;left: 0}
.main .view img {display: block;position: relative}
.main .view strong {display:block;text-transform: uppercase;color: #fff;text-align: center;position: relative;font-size:1.467rem;color:#dbdbdb;font-weight:600}
.main .view p {margin:2rem 0 4.4rem 0;font-size:1.067rem;position: relative;color: #dbdbdb;text-align: center;line-height:1.6}
.main .view a.info {display: inline-block;text-decoration: none;padding:1rem 2rem;color: #fff;text-transform: uppercase;border:1px solid #fff;text-align:center;border-radius:30px;letter-spacing:0;font-size:0.800rem;font-weight:600}
.main .view-first img {
  -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.main .view-first .mask {
  padding:7rem 2.5rem 0 2.5rem;
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   background-color: rgba(13,12,12,0.9);
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
}
.main .view-first strong {
   -webkit-transform: translateY(-100px);
   -moz-transform: translateY(-100px);
   -o-transform: translateY(-100px);
   -ms-transform: translateY(-100px);
   transform: translateY(-100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.main .view-first p {
   -webkit-transform: translateY(100px);
   -moz-transform: translateY(100px);
   -o-transform: translateY(100px);
   -ms-transform: translateY(100px);
   transform: translateY(100px);
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s linear;
   -moz-transition: all 0.2s linear;
   -o-transition: all 0.2s linear;
   -ms-transition: all 0.2s linear;
   transition: all 0.2s linear;
}
.main .view-first:hover img {
   -webkit-transform: scale(1.1,1.1);
   -moz-transform: scale(1.1,1.1);
   -o-transform: scale(1.1,1.1);
   -ms-transform: scale(1.1,1.1);
   transform: scale(1.1,1.1);
}
.main .view-first a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
   -webkit-transition: all 0.2s ease-in-out;
   -moz-transition: all 0.2s ease-in-out;
   -o-transition: all 0.2s ease-in-out;
   -ms-transition: all 0.2s ease-in-out;
   transition: all 0.2s ease-in-out;
}
.main .view-first:hover .mask {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
}
.main .view-first:hover strong,
.main .view-first:hover p,
.main .view-first:hover a.info {
   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
   -webkit-transform: translateY(0px);
   -moz-transform: translateY(0px);
   -o-transform: translateY(0px);
   -ms-transform: translateY(0px);
   transform: translateY(0px);
}
.main .view-first:hover p {
   -webkit-transition-delay: 0.1s;
   -moz-transition-delay: 0.1s;
   -o-transition-delay: 0.1s;
   -ms-transition-delay: 0.1s;
   transition-delay: 0.1s;
}
.main .view-first:hover a.info {
   -webkit-transition-delay: 0.2s;
   -moz-transition-delay: 0.2s;
   -o-transition-delay: 0.2s;
   -ms-transition-delay: 0.2s;
   transition-delay: 0.2s;
}
/* main2 미디어쿼리 */
@media all and (max-width:1024px) {
.main.main3 {padding-top:3rem;overflow:hidden}
.main3 .section {padding-bottom:0}
.main3 .slider {height:400px;overflow: hidden;}
.main .slick-slide, .main4 .view {width:100%;max-width:100%}
.main3 .slick-slide {height: 400px;border:1px solid #e1e1e1;overflow:hidden}
.main4 .view {height:250px;position:relative;border:0}
.main4 .view img {position:absolute;left: 50%;top: 50%;transform: translate(-50%, -50%) }
.main3 .layout,
.main4 .layout {max-width:93%}
.main .slick-slide img {height: 450px;}
.main4 .view img {width: 100%;height: auto;}

.main .view-first:hover img {left:0;top:0}
.main3 .view-first .mask {padding:7.5rem 2.5rem 0 2.5rem}
.main4 .view-first .mask {padding:3.5rem 2.5rem 0 2.5rem}
.main .view p {margin-bottom:2rem}
}
@media all and (max-width:859px) {
.main3 .slider {height:350px;}
.main3 .slick-slide {height: 350px;border:none}
.main3 .slick-slide img {height: 350px;width: auto;left: 50%;transform: translateX(-50%);}
.main3 .view-first .mask {padding:6rem 2.5rem 0 2.5rem}
}
@media all and (max-width:759px) {
.main3 .slider {height:348px;}
.main3 .slick-slide {height: 348px;border:none}
.main3 .slick-slide img {height: 348px;width: auto;}
.main4 .view-first .mask {padding:2rem 2.5rem 0 2.5rem}
}
@media all and (max-width:410px) {
.main4 .view-first .mask {padding:1.5rem 2.5rem 0 2.5rem}
}
@media all and (max-width:320px) {
.main4 .view-first .mask {padding:3rem 2.5rem 0 2.5rem}
}

/* main4 Brand */
.main4 {background-color:#fafafa}

/* main5 news */
.main5 .layout {max-width:1410px}
.main.main5 {padding-bottom:0}
.main5 .grid li {width:33.33%;padding:2.2rem}
@media all and (max-width:1200px) {
.main5 .grid li {width: 50%;}
}
@media all and (max-width:640px) {
.main5 .grid li {width: 100%;}
}
/* main6 partner */
.main6 {width:100%;background-color:#fafafa}
.main6.main {padding:0;padding:1.85rem 0}

/* M Gallery */
.mgallery {width:100%;position:relative}
.main6 .slick-slider .slick-track, .main6 .slick-slider .slick-list{min-height:40px}
.main6 .slick-slide{opacity:1 !important}
.main6 .slick-dots{display:none !important}


  /* main6 미디어쿼리 */
@media all and (max-width:1200px) {
.main6.main {padding:1rem 0}
}
@media all and (max-width:1024px) {
.main6.main {padding:1rem 0}
.main6 .slick-slide{width:90%;max-width:90%}
.main6 .slick-slide img {width:100%;height:50px}
}

@media all and (max-width:640px) {
.main6 .slick-slide img {min-width:180px}

}
