@charset "utf-8";

/*=======================================================
    .cateSec-wrap 
=========================================================*/
.cateSec-wrap{position:absolute;left:0; top:0; width:224px; z-index:7001}
.cateSec-wrap .ov{position:absolute; left:0; top:0; width:100%;height:400px;background:#0070b8; overflow:visible}
.cateSec-wrap .ov .cate-slider-ovclick{}
.cateSec-wrap .ov.over .cate-slider-ovclick{z-index:49}

.cateSec-wrap .cate-menu{}
.cateSec-wrap .cate-menu a{display:block;}
.cateSec-wrap .cate-menu .d1 {z-index:44;}
.cateSec-wrap .cate-menu .d1.on{z-index:51}

.cateSec-wrap .cate-menu .d1a{display:block; line-height:50px; padding:0 25px 0 27px; font-size:17px; color:#fff; position:relative;z-index:5;}
/* .cateSec-wrap .cate-menu .d1a:before{position:absolute;z-index:49;width:100%;height:calc(100% + 1px);left:0;top:-1px;background:rgba(0,0,0,0.7); display:block;opacity:0;content:""; z-index:5;} */
.cateSec-wrap .cate-menu .d1a:before{position:absolute;z-index:49;width:100%;height:calc(100% + 1px);left:0;top:0px;background:rgba(0,0,0,0.7); display:block;opacity:0;content:""; z-index:5;}
.cateSec-wrap .cate-menu.over .d1a:before{ display:block;opacity:1; -webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
.cateSec-wrap .cate-menu.over .d1.on .d1a:before{display:block;opacity:0;}
.cateSec-wrap .cate-menu .d1a:after{width:100%;height:1px; background:rgba(255,255,255,0.2); display:block; content:""; position:absolute; left:0; top:-1px; z-index:-1;}
.cateSec-wrap .cate-menu .d1.on .d1a{background:#fff; color:#111;font-weight:800}

.cateSec-wrap .cate-menu .d2_wrap {position:absolute;top:0;left:-9999em; width:976px;padding:0; background:#fbfbfb;height:100%;z-index:5; min-height:400px; max-height:400px;}
.cateSec-wrap .cate-menu .d1.on .d2_wrap{left:224px;}
.cateSec-wrap .cate-menu .d2_wrap:after{display:block; content:"";clear:both}
/* .cateSec-wrap .cate-menu .d2_wrap ul{padding:5px 0;box-sizing:border-box;} */
.cateSec-wrap .cate-menu .d2_wrap ul{padding:15px 0;box-sizing:border-box;}
.cateSec-wrap .cate-menu .d2_wrap .d2 {position:relative;display:block;}
.cateSec-wrap .cate-menu .d2_wrap .d2:first-child {}
/* .cateSec-wrap .cate-menu .d2_wrap .d2 > a {line-height:28px; font-size:15px;padding:0 20px;  color:#434343;display:block;font-weight:400;} */
.cateSec-wrap .cate-menu .d2_wrap .d2 > a {line-height:28px; font-size:15px;padding:0 14px;  color:#434343;display:block;font-weight:400; 
	text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;
}


.cateSec-wrap .cate-menu .d2_wrap .d2.over > a, .cateSec-wrap .cate-menu .d2_wrap .d2.over > a:hover {background:#939292; color:#fff;text-decoration:none ;font-weight:700}
.cateSec-wrap .cate-menu .d2_wrap .d2 > a:hover{font-weight:700;text-decoration:underline;color:#111}

/* .cateSec-wrap .cate-menu .d2_wrap.c01 ul{height:400px;float:left; width:162px;box-sizing:border-box; } */
.cateSec-wrap .cate-menu .d2_wrap.c01 ul{height:385px;float:left; width:162px;box-sizing:border-box; }
.cateSec-wrap .cate-menu .d2_wrap.c01 ul:nth-child(n+2){border-left:1px solid #dedede;}

.cateSec-wrap .cate-menu .d2_wrap.c02 ul{height:400px;float:left; width:302px;box-sizing:border-box; padding:10px 0 ;border-right:1px solid #dedede}
.cateSec-wrap .cate-menu .d2_wrap.c02 .d2 > a {line-height:42px; font-size:18px;}
.cateSec-wrap .cate-menu .d2_wrap.c02 .prd{position:absolute;right:0;width:674px; top:0;height:400px;}
.cateSec-wrap .cate-menu .d2_wrap.c02 .prd .img{}
.cateSec-wrap .cate-menu .d2_wrap.c02 .prd .img img{width:100%}
.cateSec-wrap .cate-menu .d2_wrap.c02 .prd .txt{position:absolute; left:0; bottom:0; width:100%;box-sizing:border-box;padding:25px 37px}
.cateSec-wrap .cate-menu .d2_wrap.c02 .prd .btxt{font-size:22px; color:#111; font-weight:800; line-height:1.2em;}
.cateSec-wrap .cate-menu .d2_wrap.c02 .prd .stxt{margin-top:5px;font-size:18px; color:#434343; font-weight:300; line-height:1.2em;}


.cateSec-wrap .cate-menu .d2_wrap.c01 .slimScrollDiv{height:400px;float:left; width:162px !Important;box-sizing:border-box; padding:5px 0;}
.cateSec-wrap .cate-menu .d2_wrap.c01 .slimScrollDiv:nth-child(n+2){border-left:1px solid #dedede;}
.cateSec-wrap .cate-menu .d2_wrap.c01 .slimScrollDiv ul{height:auto; float:none; width:auto;}
.cateSec-wrap .cate-menu .d2_wrap.c01 .slimScrollDiv ul:nth-child(n+2){border-left:0;}

.cateSec-wrap .cate-menu .d2_wrap.c02 .slimScrollDiv{height:400px;float:left; width:302px !Important;box-sizing:border-box; padding:5px 0;}
.cateSec-wrap .cate-menu .d2_wrap.c02 .slimScrollDiv ul{height:auto; float:none; width:auto;}

.cateSec-wrap .cate-menu .d3_wrap {display:none;position:absolute;top:5px;right:-145px;min-width:150px;padding:7px 0;border:1px solid #ddd; background:#fbfbfb;}
.cateSec-wrap .cate-menu .d3_wrap li {display:block;}
.cateSec-wrap .cate-menu .d3_wrap li:first-child {}
.cateSec-wrap .cate-menu .d3_wrap li a {line-height:27px;padding:0 0 0 15px;color:#555;}
.cateSec-wrap .cate-menu .d3_wrap li a:hover, .cateSec-wrap .cate-menu .d3_wrap li.on a {background:#f4f4f4; color:#111;}

.cateSec-wrap .cate-banner{background:#fff;height:160px; overflow:hidden;}
.cateSec-wrap .cate-slide a{display:block;}
.cateSec-wrap .cate-slide a img{width:100%;height:160px;object-fit:cover;}

/* .fix .cateSec-wrap .cate-menu .depth-bg{top:60px;height:calc(100% - 60px);} */


/*=======================================================
    .msec-visual .visual-slide
=========================================================*/
.msec-visual{position:relative;overflow:hidden}
.msec-visual .div-cont{padding-left:0px; box-sizing:border-box; position:relative; }
.visual-slide{position:relative;height:400px;}
.visual-slide .owl-stage-outer{}
.visual-slide .owl-stage-outer:after{display:block;content:"";clear:both;}

.visual-slide .item {position:relative; height:400px;}
.visual-slide .item:after{display:block; content:"";position:absolute; left:0; top:0; z-index:123;background:rgba(0,0,0,0.3);width:100%;height:100%; opacity:1;-webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
.visual-slide .active .item:after{opacity:0}

.visual-slide .item .img{}
.visual-slide .item .img img{width:100%;}
.visual-slide .item .txt{position:absolute; left:0; top:0; box-sizing:Border-box; width:100%;height:100%;padding:100px 75px; z-index:5;}
.visual-slide .item .btxt{font-size:17px; font-weight:800; color:#848484; text-transform:uppercase; line-height:1.1em;}
.visual-slide .item .stxt{margin-top:7px;font-size:40px; font-family:'NanumSquare';font-weight:700; color:#111; line-height:1.1em; font-weight:300;}
.visual-slide .item .stxt span{font-weight:800;}
.visual-slide .item .ctxt{margin-top:10px;font-size:17px; font-weight:400; color:#434343; line-height:1.4em; font-weight:400;}

.visual-slide .owl-prev{cursor:pointer;position:absolute;text-indent:-9999em;width:32px;height:54px; left:17px; top:50%;margin-top:-27px;background:url(../_Img/Main/visual-prev.png) no-repeat left center; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.visual-slide .owl-next{cursor:pointer;position:absolute;text-indent:-9999em;width:32px;height:54px; right:17px; top:50%;margin-top:-27px;background:url(../_Img/Main/visual-next.png) no-repeat right center; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.visual-slide .owl-prev:hover{left:10px; width:40px;}
.visual-slide .owl-next:hover{right:10px; width:40px;}

.visual-ctrl{position:absolute; right:30px; bottom:30px; font-size:0;}
.visual-ctrl .play{width:40px;height:40px;border-radius:100%; background:rgba(0,0,0,0.25) url(../_Img/Main/visual-play.png) no-repeat center center; display:inline-block;vertical-align:top;}
.visual-ctrl .stop{width:40px;height:40px;border-radius:100%; background:rgba(0,0,0,0.25) url(../_Img/Main/visual-stop.png) no-repeat center center; display:inline-block;vertical-align:top;}
.visual-ctrl .count{margin-left:5px;background:rgba(0,0,0,0.25); border-top-left-radius:40px;border-bottom-left-radius:40px; font-size:16px; color:#fff; font-weight:700; display:inline-block;vertical-align:top; line-height:40px; padding:0 20px;}
.visual-ctrl .more{margin-left:1px;width:40px;height:40px; background:rgba(0,0,0,0.25) url(../_Img/Main/visual-more.png) no-repeat center center; display:inline-block;vertical-align:top;border-top-right-radius:40px;border-bottom-right-radius:40px; }

.visual-slide .item .btxt{opacity:0;-webkit-transform: translateY(30%); -moz-transform: translateY(30%);-ms-transform: translateY(30%); -o-transform:  translateY(30%);transform: translateY(30%);-webkit-transition: opacity 0.4s ease-out, transform 0.4s ease-out;;-moz-transition:opacity 0.4s ease-out, transform 0.4s ease-out;;-o-transition: opacity 0.4s ease-out, transform 0.4s ease-out;;transition: opacity 0.4s ease-out, transform 0.4s ease-out;}
.visual-slide .item .stxt{opacity:0;-webkit-transform: translateY(30%); -moz-transform: translateY(30%);-ms-transform: translateY(30%); -o-transform:  translateY(30%);transform: translateY(30%);-webkit-transition: opacity 0.4s ease-out, transform 0.4s ease-out;;-moz-transition:opacity 0.4s ease-out, transform 0.4s ease-out;;-o-transition: opacity 0.4s ease-out, transform 0.4s ease-out;;transition: opacity 0.4s ease-out, transform 0.4s ease-out;}
.visual-slide .item .ctxt{opacity:0;-webkit-transform: translateY(30%); -moz-transform: translateY(30%);-ms-transform: translateY(30%); -o-transform:  translateY(30%);transform: translateY(30%);-webkit-transition: opacity 0.4s ease-out, transform 0.4s ease-out;;-moz-transition:opacity 0.4s ease-out, transform 0.4s ease-out;;-o-transition: opacity 0.4s ease-out, transform 0.4s ease-out;;transition: opacity 0.4s ease-out, transform 0.4s ease-out;}

.visual-slide .active .item .btxt{transition-delay: 0.3s; opacity:1;-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform:  translateY(0);transform: translateY(0);}
.visual-slide .active .item .stxt{transition-delay: 0.6s; opacity:1;-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform:  translateY(0);transform: translateY(0);}
.visual-slide .active .item .ctxt{transition-delay: 0.9s; opacity:1;-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform:  translateY(0);transform: translateY(0);}



/*=======================================================
  .msec-cont 
=========================================================*/
.msec-cont{padding-bottom:90px; position:relative;}


/*=======================================================
  .mquick 
=========================================================*/
.mquick{padding:70px 0}
.mquick h3{margin-bottom:15px;font-size:30px;line-height:1.1em; color:#030303;letter-spacing:-0.03em; font-weight:700;font-family:'NanumSquare';}
.mquick ul{margin:0 -0.5%}
.mquick ul:after{display:block; content:"";clear:both}
.mquick li{float:left;width:11.5%; margin:0 0.5%}
.mquick li a{display:block;}
.mquick li a:hover .ico{background:#0070b8;box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2)  ; -webkit-box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2)  ; -moz-box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2)  ; }
.mquick li .ico{text-align:center;background:#4098d0; border-radius:100%; width:140px;height:140px; margin:0 auto; overflow:hidden;-webkit-transition: background 0.3s ease-out, box-shadow 0.3s ease-out;-moz-transition: background 0.3s ease-out, box-shadow 0.3s ease-out;-o-transition: background 0.3s ease-out, box-shadow 0.3s ease-out;transition: background 0.3s ease-out;, box-shadow 0.3s ease-out}
.mquick li .ico img{width:100%;}
.mquick li .txt{text-align:center; font-size:20px; color:#434343; line-height:1.2em; font-weight:700;letter-spacing:-0.03em; margin-top:5px;font-family:'NanumSquare';}


/*=======================================================
  .mlist 
=========================================================*/
.mlist{padding:70px 0;position:relative;}
.mlist:after{width:20000px; height:100%; position:absolute; left:50%;top:0;margin-left:-10000px; display:block;content:"";z-index:-1;background:#f3f3f3;}
.mlist h3{margin-bottom:15px;font-size:30px;line-height:1.1em; color:#030303;letter-spacing:-0.03em; font-weight:700;font-family:'NanumSquare';}
.mlist .all-btn{position:absolute; right:0; top:74px; height:25px; font-size:17px; font-weight:700; color:#434343; line-height:25px; padding-right:30px;}
.mlist .all-btn:after{position:absolute; right:0; top:0; width:25px;height:25px;background:url(../_Img/Main/many-more.png) no-repeat right center; display:block;content:"";-webkit-transition: transform 0.3s ease-out;-moz-transition: transform 0.3s ease-out;-o-transition: transform 0.3s ease-out;transition: transform 0.3s ease-out;}
.mlist .all-btn:hover:after{transform: scale(1,1) rotate(90deg)skew(0,0) translate(0,0); -webkit-transform: scale(1,1) rotate(90deg)skew(0,0) translate(0,0); -moz-transform: scale(1,1) rotate(90deg)skew(0,0) translate(0,0); }

.mlist .mlist-slide{position:relative;}
.mlist .mlist-slide .owl-stage-outer:after{display:block; content:"";clear:both;}

.mlist .mlist-slide .active .item .img:after{opacity:0;}
/* .mlist .mlist-slide .img{position:relative;min-height:230px;box-sizing:border-box;} */
.mlist .mlist-slide .img{position:relative; max-width:230px; min-height:230px;box-sizing:border-box;}
.mlist .mlist-slide .img img{height:230px; width:100%;object-fit:cover;-webkit-transition: transform 0.5s ease-out;-moz-transition: transform 0.5s ease-out;-o-transition: transform 0.5s ease-out;transition: transform 0.5s ease-out;}
.mlist .mlist-slide .img span{display:block;overflow:hidden;}
.mlist .mlist-slide .img:after{display:block; content:"";position:absolute; left:0; top:0; z-index:123;background:rgba(0,0,0,0.3);width:100%;height:100%; opacity:1;-webkit-transition: opacity 0s ease-out;-moz-transition: opacity 0s ease-out;-o-transition: opacity 0s ease-out;transition: opacity0s ease-out;}

.mlist .mlist-slide .active .item .txt{opacity:1;-webkit-transform: translateY(0); -moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform:  translateY(0);transform: translateY(0);}
.mlist .mlist-slide .txt{padding-top:20px;opacity:0;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;-webkit-transform: translateY(5%); -moz-transform: translateY(5%);-ms-transform: translateY(5%); -o-transform:  translateY(5%);transform: translateY(5%);}
.mlist .mlist-slide .vc{position:relative; width:100%;}
.mlist .mlist-slide .btxt{font-size:16px; color:#434343; line-height:1.2em;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing:-0.03em; font-weight:400; }
.mlist .mlist-slide .stxt{margin-top:7px;font-size:16px; color:#434343; line-height:1.3em; font-weight:400; -webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
/* .mlist .mlist-slide .stxt span{font-size:22px; font-family: 'Exo', sans-serif; font-weight:700;color:#010101} */
.mlist .mlist-slide .stxt span{font-size:16px; font-family: 'Exo', sans-serif; font-weight:700;color:#010101}

/* .mlist .mlist-slide .more{opacity:0;background:#0070b8; z-index:54; line-height:24px; height:24px;color:#fff; font-size:15px; border-radius:24px; padding:0 12px;box-sizing:border-box;display:block; position:absolute; left:0; bottom:2px;-webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;} */
.mlist .mlist-slide .more{opacity:0;background:#0070b8; z-index:54; line-height:24px; height:24px;color:#fff; font-size:15px; border-radius:24px; padding:0 12px;box-sizing:border-box;display:block; position:absolute; left:0; bottom:-2px;-webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
.mlist .mlist-slide .owl-prev{cursor:pointer;position:absolute;text-indent:-9999em;width:50px;height:50px; left:-25px; top:90px;background:url(../_Img/Main/many-prev.png) no-repeat left center; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.mlist .mlist-slide .owl-next{cursor:pointer;position:absolute;text-indent:-9999em;width:50px;height:50px; right:-25px; top:90px;background:url(../_Img/Main/many-next.png) no-repeat right center; -webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
/* .mlist .mlist-slide .item:hover .more{opacity:1}
.mlist .mlist-slide .item:hover .stxt{opacity:0} */
.mlist .mlist-slide .item:hover .img img{transform:scale(1.05, 1.05); -webkit-transform:scale(1.05, 1.05); -moz-transform:scale(1.05, 1.05); -ms-transform:scale(1.05, 1.05);}

.mlist .mlist-slide .item.over .more{opacity:1}
.mlist .mlist-slide .item.over .stxt{opacity:0}

/*=======================================================
    .wlist 
=========================================================*/
.wlist{}
.wlist ul{margin:0 -0.5%}
.wlist ul:after{display:block; content:"";clear:both}
.wlist li{float:left;width:24%;margin:0 0.5%}
.wlist li:nth-child(n+3){margin-top:1%}
.wlist li a{position:relative;display:block;min-height:230px;border:1px solid #dedede;-webkit-transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;-moz-transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;-o-transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;}
.wlist li a:hover{box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15) ; -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15)  ;	-moz-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); -webkit-transform: translateY(-3%); -moz-transform: translateY(-3%);-ms-transform: translateY(-3%); -o-transform:  translateY(-3%);transform: translateY(-3%);}
.wlist li .img{}
.wlist li .img img{width:100%;}
.wlist li .txt{position:absolute; left:0; bottom:0; width:100%;box-sizing:border-box; padding:20px 27px;}
.wlist li .txt .btxt{font-size:20px; font-weight:800; color:#000; line-height:1.2em;font-family:'NanumSquare';}
.wlist li .txt .stxt{font-size:15px; font-weight:300; color:#434343; line-height:1.35em; margin-top:5px;}



/*=======================================================
    .vlist 
=========================================================*/
.vlist{position:relative; padding-left:244px; min-height:325px;}
.vlist .info{position:absolute; left:0; top:0; width:224px; min-height:325px;box-sizing:border-box; padding:30px 22px;}
.vlist .info.c01{background:url(../_Img/Main/item-bg01.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c02{background:url(../_Img/Main/item-bg02.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c03{background:url(../_Img/Main/item-bg03.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c04{background:url(../_Img/Main/item-bg04.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c05{background:url(../_Img/Main/item-bg05.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c06{background:url(../_Img/Main/item-bg06.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c07{background:url(../_Img/Main/item-bg07.jpg) no-repeat center center; background-size:cover;}
.vlist .info.c08{background:url(../_Img/Main/item-bg08.jpg) no-repeat center center; background-size:cover;}

.vlist .info h3{font-size:28px ;font-weight:800;color:#fff; line-height:1.2em;letter-spacing:-0.065em;white-space:pre;font-family:'NanumSquare';}
.vlist .info h3 span{font-family: 'Exo', sans-serif;font-size:26px;line-height:1.2em; letter-spacing:-0.01em;font-weight:700; color:rgba(255,255,255,0.7); display:block;}
.vlist .info ul{margin-top:15px;}
.vlist .info li{}
.vlist .info li:nth-child(n+2){margin-top:9px;}
.vlist .info li a{line-height:1.2em; font-weight:300;color:#fff;font-size:16px;}
.vlist .info li a:hover{font-weight:400; text-decoration:underline}
.vlist .info .more{display:block; margin-top:20px;position:relative;font-size:16px; font-weight:600;color:#fff; line-height:20px;}
.vlist .info .more:after{width:12px;height:16px; position:absolute; right:5px; top:50%;margin-top:-8px; display:block;content:"";background:url(../_Img/Main/item-more.png) no-repeat center center;-webkit-transition: all 0.3s ease-out;-moz-transition: all 0.3s ease-out;-o-transition: all 0.3s ease-out;transition: all 0.3s ease-out;}
.vlist .info .more:hover:after{right:0;}

.vlist .list{}
.vlist .list ul{margin:0 -1%}
.vlist .list ul:after{display:block; content:"";clear:both;}
.vlist .list li{float:left; width:23%;margin:0 1% ;}
.vlist .list li .vc{position:Relative; min-height:325px;}
.vlist .list li .img{position:relative;border:1px solid #efefef;background:#efefef;box-sizing:border-box; min-height:230px;-webkit-transition: box-shadow 0.3s ease-out;-moz-transition: box-shadow 0.3s ease-out;-o-transition: box-shadow 0.3s ease-out;transition: box-shadow 0.3s ease-out;}
.vlist .list li .img img{height:230px; width:100%;object-fit:cover;-webkit-transition: transform 0.5s ease-out;-moz-transition: transform 0.5s ease-out;-o-transition: transform 0.5s ease-out;transition: transform 0.5s ease-out;}
.vlist .list li .img span{display:block;overflow:hidden;}
.vlist .list li .txt{padding-top:20px;}
.vlist .list li .btxt{font-size:16px; color:#434343; line-height:1.2em;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing:-0.03em; font-weight:400; }
.vlist .list li .stxt{margin-top:7px;font-size:16px; color:#434343; line-height:1.3em; font-weight:400; -webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}
/* .vlist .list li .stxt span{font-size:22px; font-family: 'Exo', sans-serif; font-weight:700;color:#010101} */
.vlist .list li .stxt span{font-size:16px; font-family: 'Exo', sans-serif; font-weight:700;color:#010101}

.vlist .list li .more{opacity:0;background:#0070b8; z-index:54; line-height:24px; height:24px; color:#fff; font-size:15px; border-radius:24px; padding:0 12px;box-sizing:border-box;display:block; position:absolute; left:0; bottom:25px;-webkit-transition: opacity 0.3s ease-out;-moz-transition: opacity 0.3s ease-out;-o-transition: opacity 0.3s ease-out;transition: opacity 0.3s ease-out;}

.vlist .list li .img:before{width:0;height:1px; background:#111;position:absolute; left:-1px; top:-1px; z-index:3; display:block; content:"";-webkit-transition: width 0.4s ease-out;-moz-transition: width 0.4s ease-out;-o-transition: width 0.4s ease-out;transition: width 0.4s ease-out;}
.vlist .list li .img:after{width:0;height:1px;background:#111; position:absolute; right:-1px; bottom:-1px;z-index:3; display:block; content:"";-webkit-transition: width 0.4s ease-out;-moz-transition: width 0.4s ease-out;-o-transition: width 0.4s ease-out;transition: width 0.4s ease-out;}

.vlist .list li .img p:before{width:1px;height:0;background:#111;position:absolute; right:-1px; top:-1px; z-index:3;display:block; content:"";-webkit-transition: height 0.4s ease-out;-moz-transition: height 0.4s ease-out;-o-transition: height 0.4s ease-out;transition: height 0.4s ease-out;}
.vlist .list li .img p:after{width:1px;height:0;background:#111; position:absolute; left:-1px; bottom:-1px;z-index:3;display:block; content:"";-webkit-transition: height 0.4s ease-out;-moz-transition: height 0.4s ease-out;-o-transition: height 0.4s ease-out;transition: height 0.4s ease-out;}

.vlist .list li:hover .img:before{width:calc(100% + 2px);}
.vlist .list li:hover .img:after{width:calc(100% + 2px);}

.vlist .list li:hover .img p:before{height:calc(100% + 2px);}
.vlist .list li:hover .img p:after{height:calc(100% + 2px);}

.vlist .list li:hover .img img{transform:scale(1.05, 1.05); -webkit-transform:scale(1.05, 1.05); -moz-transform:scale(1.05, 1.05); -ms-transform:scale(1.05, 1.05);}
.vlist .list li:hover .img{}
/* .vlist .list li:hover .more{opacity:1}
.vlist .list li:hover .stxt{opacity:0} */

.vlist .list li.over .more{opacity:1}
.vlist .list li.over .stxt{opacity:0}