@charset "utf-8";
.pcbr{display:none;}
.tbbr{display:none;}
.mbbr{display:block;}
.dn{display:none;}
#contents{transition:all 0.4s;}
.innerwrap{max-width:1760px;width:100%;box-sizing:border-box;padding:0 10px;margin:0 auto;}




/* sec1 */
.sec1{
	padding:190px 0 60px;
	background:#f3f4f9;
}
.sec1 .conwrap{display:flex;flex-wrap:wrap;justify-content:space-between;position:relative;}
.sec1 .conwrap .prd{display:none;}
.sec1 .conwrap .prd + .ctr{display:none;}
.sec1 .conwrap .prd_mobile{
	box-sizing:border-box;
	width:100%;
	margin:0;
}
.sec1 .conwrap .prd_mobile .swiper-slide{display:flex;justify-content:space-between;width:100%;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap{
	display:flex;flex-wrap:wrap;justify-content:space-between;align-content:space-between;
	width:100%;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area1{
	width:100%;height:100%;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area2{
	display:flex;flex-wrap:wrap;align-content:space-between;justify-content:space-between;
	width:100%;height:100%;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap{
	overflow:hidden;
	position:relative;
	width:100%;height:100%;
	border-radius:20px;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area2 .boxwrap:nth-child(1){width:100%;height:53.6%}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area2 .boxwrap:nth-child(2){width:100%;height:42.6%;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .bg{width:100%;height:100%;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .bg video,
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .bg iframe{width:100%;height:100%;object-fit:cover;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts{
	position:absolute;left:20px;top:2.5vh;width:calc(100% - 40px);
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area1 .boxwrap .txts{display:none;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .cate{}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .cate span{
	display:block;
	width:63px;height:24px;
	border-radius:5px;
	font-size:14px;color:#fff;text-align:center;font-weight:600;line-height:24px;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .cate span.best{background:#23c4a7;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .cate span.new{background:#424bd4;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .tit{
	margin:2vh 0 1.5vh;font-size:5vw;color:#fff;font-weight:600;word-break:break-all;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .txt{font-size:2.2vw;color:#fff;line-height:1.7em;}

.sec1 .conwrap .ctr{
	position:absolute;left:0;top:100%;
	display:flex;align-items:center;justify-content:center;
	width:100%;
	margin:29px 0 0;
	display:none;
}
.sec1 .conwrap .ctr .prd_prev{}
.sec1 .conwrap .ctr .prd_next{}
.sec1 .conwrap .ctr .prdPaging{display:block;position:static;margin:0 35px;}
.sec1 .conwrap .ctr .prdPaging span{
	display:inline-block;position:relative;
	width:10px;height:10px;
	margin:0 7px;
	background:#c9cbd0;
	opacity:1;
}
.sec1 .conwrap .ctr .prdPaging span.swiper-pagination-bullet-active{
	overflow:hidden;
	width:55px;
	border-radius:10px;
}
.sec1 .conwrap .ctr .prdPaging span:after{
	display:block;content:"";
	width:100%;height:100%;
	background:#000;
	position:absolute;left:0;top:0;
	transform-origin:left;
	transform:scaleX(0);
}
.sec1 .conwrap .ctr .prdPaging span.swiper-pagination-bullet-active:after{transform:scaleX(1);transition:all 6s;}
.sec1 .conwrap .banner{
	box-sizing:border-box;
	width:26.875%;
	padding-left:30px;
	border-left:1px solid #c7c7c9;
}

.sec1 .etfSearch{max-width:900px;width:100%;margin:40px auto 0;}
.sec1 .etfSearch .etfSearchWrap{
	box-sizing:border-box;
	display:flex;align-items:center;justify-content:space-between;
	position:relative;
	width:100%;height:68px;
	padding:8px 8px 8px 15px;
	border:3px solid #000;border-radius:20px;
}
.typing-cursor {
    position: absolute;
    left:0;top: 50%;
    transform: translateY(-50%);
    width:2px;height: 20px;
	margin-left:15px;
    background: #333;
    animation: blink 0.7s infinite;
    display: none; /* 초기에는 숨김 */
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
.sec1 .etfSearch .etfSearchWrap input{
	box-sizing:border-box;
	width:calc(100% - 52px);height:100%;
	padding:0 15px;
	font-size:16px;
	background:0;border:0;outline:0;
}
.sec1 .etfSearch .etfSearchWrap button{
	width:52px;height:52px;
	background:#000;
	border:0;
	border-radius:15px;
}
.sec1 .etfSearch .tag{display:flex;flex-wrap:wrap;justify-content:center;margin-top:10px;}
.sec1 .etfSearch .tag a{
	display:flex;align-items:center;
	padding:6px 12px 6px 6px;margin:0 8px 8px 0;
	border:1px solid #ddd;border-radius:20px;
	background:#e9e9ee;
	font-size:14px;color:#000;font-weight:500;
}
.sec1 .etfSearch .tag a img{
	overflow:hidden;
	border-radius:10px;
	height:42px;margin-right:9px;
}
.sec1 .etfSearch .tag a:hover{border:1px solid #0081c8;background:#daf2ff;color:#0081c8;}




/*  */
.sec1 .prd_mobile  ~ .etfSearch{display:block;}
.sec1 .etfSearch .tit{
	margin-bottom:35px;
	font-size:30px;color:#000;font-weight:600;line-height:1.3em;text-align:center;
}




.sec2{position:relative;z-index:10;}
.sec2 .boxwrap{
	padding:60px 0;
	border-bottom:1px solid #2a2a2a;
}
.sec2 .boxwrap:nth-child(2){border:0;}
.sec2 .boxwrap .title{display:flex;align-items:center;justify-content:space-between;width:100%;}
.sec2 .boxwrap .title h3{font-size:32px;color:#2c2c2c;font-weight:600;}
.sec2 .boxwrap .title .tag{margin:40px 0 0;}
.sec2 .boxwrap .title .tag span{
	display:inline-flex;align-items:center;justify-content:center;
	height:49px;
	padding:0 20px;margin:0 15px 15px 0;
	border-radius:25px;
	background:#e5e6eb;
	font-size:19px;color:#222;text-align:center;
}
.sec2 .boxwrap .title .tag span:first-child{background:#222;color:#fff;}
.sec2 .boxwrap .con{width:100%;margin-top:40px;}
.sec2 .boxwrap .con .list{
	position:relative;
	overflow:hidden;overflow-y:hidden; overflow-x:auto;
}
.sec2 .boxwrap .con .list>ul{
	width:100%;
	white-space:nowrap;
	box-sizing:border-box;
}
.sub_tab ul::-webkit-scrollbar{display: none;}
.sec2 .boxwrap .con .list>ul>li{
	box-sizing:border-box;
	display:inline-block;
	width:190px;
	margin:0 5px 0 0;padding:20px 25px;
	white-space:normal;
	border:1px solid #d2d2d2;border-radius:30px;
}
.sec2 .boxwrap .con .list>ul>li:nth-child(4n){margin-right:0;}
.sec2 .boxwrap .con .list>ul>li .toparea{
	box-sizing:border-box;
	min-height:264px;
	padding:0 0 20px;
	border-bottom:1px solid #d2d2d4;
}
.sec2 .boxwrap .con .list>ul>li .toparea .icon{}
.sec2 .boxwrap .con .list>ul>li .toparea .icon img{height:60px;}
.sec2 .boxwrap .con .list>ul>li .toparea .tit{
	margin:20px 0 15px;
	font-size:3vw;color:#2c2c2c;font-weight:600;line-height:1.4em;
	word-break:break-word;
} 
.sec2 .boxwrap .con .list>ul>li .toparea .prdNum{
	display:flex;align-items:center;justify-content:center;
	box-sizing:border-box;
	width:54px;height:20px;
	border:1px solid #222;border-radius:5px;
	font-size:11px;color:#222;font-weight:600;text-align:center;
}
.sec2 .boxwrap .con .list>ul>li .toparea .tag{display:flex;flex-wrap:wrap;margin:15px 0 0;}
.sec2 .boxwrap .con .list>ul>li .toparea .tag span{
	position:relative;
	padding-right:6px;margin-right:6px;
	font-size:11px;color:#222;
}
.sec2 .boxwrap .con .list>ul>li .toparea .tag span:after{
	display:block;content:"";
	width:1px;height:8px;
	background:#ccc;
	position:absolute;right:0;top:2px;
}
.sec2 .boxwrap .con .list>ul>li .toparea .tag span:last-child:after{display:none;}
.sec2 .boxwrap .con .list>ul>li .btmarea{padding:20px 0 0;}
.sec2 .boxwrap .con .list>ul>li .btmarea .rorTitle{font-size:12px;color:#222;font-weight:500;}
.sec2 .boxwrap .con .list>ul>li .btmarea .ror{margin:5px 0 0;font-size:6vw;color:#e13d3b;font-weight:500;line-height:1.2em;}
.sec2 .boxwrap .con .list>ul>li .btmarea .ror span{font-size:24px;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info{}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl dt{width:50%;font-size:11px;color:#888;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl dd{width:50%;text-align:right;font-size:11px;color:#888;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl:first-child dt{color:#222;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl:first-child dd{color:#222;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl:last-child{margin:0;}
.sec2 .boxwrap .con>a{
	display:flex;align-items:center;justify-content:center;
	width:100%;height:60px;
	margin:22px 0 0;
	background:#313132;
	border-radius:20px;
	font-size:17px;color:#fff;font-weight:500;text-align:center;
}
.sec2 .boxwrap .con>a i{
	display:inline-block;
	width:13px;height:13px;
	margin:0 0 0 10px;
	background:url(/images/main/icon_link.png) no-repeat;
}




.btnMore{
	display:flex;align-items:center;
	position:relative;
	font-size:17px;color:#222;font-weight:600;
}
.btnMore:after{
	display:block;content:"";
	position:absolute;right:0;top:0;
	width:45px;height:45px;
	border-radius:45px;
	background:#e1e1e1;
	transition:all 0.6s;
}
.btnMore:hover:after{}
.btnMore span{display:none;position:relative;z-index:10;}
.btnMore i{
	display:inline-block;
	position:relative;z-index:10;
	width:45px;height:45px;
	margin:0 0 0 20px;
	background:url(/images/main/arr2.png) no-repeat center;
}




.sec3{padding:60px 0;background:#f3f4f9;}

.sec3 .seminar{
	overflow:hidden;
	display:flex;align-items:center;justify-content:center;
	position:relative;
	width:100%;height:444px;
	margin-bottom:60px;
	border-radius:40px;
}
.sec3 .seminar .bg{
	position:absolute;left:0;top:0;
	width:100%;height:100%;
	background:url(/images/main/sec2_seminar_bg.jpg) no-repeat;
}
.sec3 .seminar .con{position:relative;z-index:10;text-align:center;}
.sec3 .seminar .con .tit{font-size:24px;color:#fff;font-weight:600;padding:0 5%;}
.sec3 .seminar .con .tit span{display:block;font-size:20px;margin-bottom:20px;}
.sec3 .seminar .con a{
	overflow:hidden;
	display:block;position:relative;
	width:260px;height:56px;
	margin:30px auto 0;padding:0 35px;
	background:#0086d1;
	font-size:17px;color:#fff;font-weight:600;line-height:56px;text-align:left;
	border-radius:33px;
}
.sec3 .seminar .con a span{position:relative;z-index:10;}
.sec3 .seminar .con a i{
	display:block;
	position:relative;
	width:41px;height:41px;
	position:absolute;right:10px;top:8px;
	border-radius:50%;
}
.sec3 .seminar .con a i div{
	width:100%;height:100%;
	background:url(/images/main/arr1.png) no-repeat center;
	background-size:90%;
	position:absolute;right:0;top:0;z-index:2;
}
.sec3 .seminar .con a i:before{
	display:block;content:"";
	width:100%;height:100%;
	background:#fff;
	position:absolute;left:0;top:0;z-index:1;
	border-radius:50%;
}
.sec3 .seminar .con a:hover{color:#333;transition:all 0.4s 0.6s;}
.sec3 .seminar .con a:hover i:before{animation:btnScaleUp 1s ease;animation-fill-mode:forwards;}
.sec3 .seminar .con a:not(:hover){color:#fff;}
.sec3 .seminar .con a:not(:hover) i:before{animation: btnScaleDown 1s ease forwards;}

@keyframes btnScaleUp{
	0%{transform:scale(1);}
	50%{transform:scale(1.5);}
	100%{transform:scale(10);}
}
@keyframes btnScaleDown {
    0% { transform: scale(10); }
    50% { transform: scale(1.5); }
    100% { transform: scale(1); }
}

.sec3 .title{display:flex;align-items:flex-end;justify-content:space-between;}
.sec3 .title h3{padding-right:50px;font-size:32px;color:#2c2c2c;font-weight:600;}
.sec3 .title a{
	display:flex;align-items:center;justify-content:space-between;
	font-size:17px;color:#222;font-weight:600;
}
.sec3 .title a i{
	display:inline-block;
	width:45px;height:45px;
	margin:0 0 0 20px;
	background:#e1e1e1 url(/images/main/arr2.png) no-repeat;
	border-radius:50%;
}
.sec3 .list{
	box-sizing:border-box;
	width:100%;
	margin:40px 0 0;padding-left:4%;
}
.sec3 .list .info1{}
.sec3 .list .info1 .swiper-slide{width:320px;}
.sec3 .list .info1 .swiper-slide .thumb{}
.sec3 .list .info1 .swiper-slide .cate{height:27px;margin:30px 0 20px;}
.sec3 .list .info1 .swiper-slide .tit{
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;	
	font-size:20px;color:#2c2c2c;font-weight:600;line-height:1.4em;
}
.sec3 .list .info1 .swiper-slide .date{margin-top:25px;font-size:14px;color:#737373;}
.sec3 .list .info1 .swiper-scrollbar{
	position:static;
	width:92%;
	margin:80px 0 0;
	height:3px;
	background:#c7c7c9;border-radius:0;
}
.sec3 .list .info1 .swiper-scrollbar .swiper-scrollbar-drag{z-index:10;background:#000;}




.sec4{padding:100px 0 0;}
.sec4 .title{display:flex;align-items:flex-end;justify-content:space-between;}
.sec4 .title h3{font-size:32px;color:#2c2c2c;font-weight:600;}
.sec4 .conwrap{margin:45px 0 0;}
.sec4 .conwrap .boxwrap{
	box-sizing:border-box;
	width:100%;
	padding:30px;
	background:#f3f4f9;
	border-radius:40px;
}
.sec4 .conwrap .boxwrap:nth-child(1){margin-bottom:10px;}
.sec4 .conwrap .boxwrap .tit{
	padding:19px 0 19px 50px;
	font-size:24px;color:#2c2c2c;font-weight:600;
	border-bottom:1px solid #d2d2d4;
}
.sec4 .conwrap .boxwrap .tit1{
	background:url(/images/page/m11_icon1.png) no-repeat left center;
	background-size:auto 32px;
	transition:all 0.4s;
}
.sec4 .conwrap .boxwrap .tit2{
	background:url(/images/page/m11_icon2.png) no-repeat left center;
	background-size:auto 32px;
	transition:all 0.4s;
}
.sec4 .conwrap .boxwrap ul{
	display:flex;flex-wrap:wrap;justify-content:space-between;
	padding:25px 0 0;
}
.sec4 .conwrap .boxwrap ul li{
	position:relative;	
	width:100%;
	margin-bottom:12px;
}
.sec4 .conwrap .boxwrap ul li:last-child{margin-bottom:0;}
.sec4 .conwrap .boxwrap ul li a{
	display:flex;align-items:center;
}
.sec4 .conwrap .boxwrap ul li .icon{
	overflow : hidden;
	box-sizing:border-box;
	width:60px;height:60px;
	border:1px solid #ddd;border-radius:20px;
}
.sec4 .conwrap .boxwrap ul li .icon img{width:100%;}
.sec4 .conwrap .boxwrap ul li .tit{
	box-sizing:border-box;
	width:calc(100% - 73px);
	font-size:14px;color:#333;
	border:0;padding:0 0 0 19px;font-weight:400;
}
.sec4 .conwrap .boxwrap ul li .tit strong{font-weight:600;}
.sec4 .conwrap .boxwrap ul li .tit>div{overflow: hidden;text-overflow: ellipsis;}