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




/* sec1 */
.sec1{
	padding:214px 0 145px;
	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%;height:60vw;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area1{
	width:100%;height:100%;
}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .area1 img{width: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 .area2 img{width:100%;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap{
	overflow:hidden;
	position:relative;
	width:100%;height:100%;
	border-radius:40px;
}
.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:40px;top:5vh;width:calc(100% - 80px);}
.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:83px;height:38px;
	border-radius:10px;
	font-size:16px;color:#fff;text-align:center;font-weight:600;line-height:38px;
}
.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:25px 0 15px;font-size:32px;color:#fff;font-weight:600;}
.sec1 .conwrap .prd_mobile .swiper-slide .slideConWrap .boxwrap .txts .txt{font-size:16px;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:170px auto 0;margin:70px auto 0;}
.sec1 .etfSearch .etfSearchWrap{
	box-sizing:border-box;
	display:flex;align-items:center;justify-content:space-between;
	position:relative;
	width:100%;height:78px;
	padding:8px 8px 8px 28px;
	border:3px solid #000;border-radius:20px;
}
.typing-cursor {
    position: absolute;
    left:0;top: 50%;
    transform: translateY(-50%);
    width:2px;height: 20px;
	margin-left:28px;
    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% - 62px);height:100%;
	padding:0 15px;
	font-size:21px;
	background:0;border:0;outline:0;
}
.sec1 .etfSearch .etfSearchWrap button{
	width:62px;height:62px;
	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:17px;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:36px;color:#000;font-weight:600;line-height:1.3em;text-align:center;
}



.sec2{padding:30px 0 0;position:relative;z-index:10;}
.sec2 .boxwrap{
	padding:120px 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:50px;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{overflow:hidden;position:relative;}
.sec2 .boxwrap .con .list>ul{
	display:inline-block;
	overflow:hidden;overflow-y:hidden; overflow-x:auto;
	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:340px;
	margin:0 22px 22px 0;padding:34px 39px;
	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;
	height:287px;
	padding:0 0 35px;
	border-bottom:1px solid #d2d2d4;
}
.sec2 .boxwrap .con .list>ul>li .toparea .icon{}
.sec2 .boxwrap .con .list>ul>li .toparea .tit{
	margin:20px 0 15px;
	font-size:25px;color:#2c2c2c;font-weight:600;line-height:1.4em;
} 
.sec2 .boxwrap .con .list>ul>li .toparea .prdNum{
	display:flex;align-items:center;justify-content:center;
	box-sizing:border-box;
	width:74px;height:28px;
	border:1px solid #222;border-radius:5px;
	font-size:14px;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:10px;margin-right:10px;
	font-size:16px;color:#222;
}
.sec2 .boxwrap .con .list>ul>li .toparea .tag span:after{
	display:block;content:"";
	width:1px;height:13px;
	background:#ccc;
	position:absolute;right:0;top:3px;
}
.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:14px;color:#222;font-weight:500;}
.sec2 .boxwrap .con .list>ul>li .btmarea .ror{margin:5px 0 0;font-size:46px;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:16px;color:#888;}
.sec2 .boxwrap .con .list>ul>li .btmarea .info dl dd{width:50%;text-align:right;font-size:16px;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{width:calc(100% + 20px);}
.btnMore span{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:160px 0 200px;background:#f3f4f9;}

.sec3 .seminar{
	overflow:hidden;
	display:flex;align-items:center;justify-content:center;
	position:relative;
	width:100%;height:444px;
	margin-bottom:150px;
	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:50px;color:#fff;font-weight:600;}
.sec3 .seminar .con .tit span{display:block;font-size:25px;margin-bottom:20px;}
.sec3 .seminar .con a{
	overflow:hidden;
	display:block;position:relative;
	width:260px;height:66px;
	margin:30px auto 0;padding:0 35px;
	background:#0086d1;
	font-size:17px;color:#fff;font-weight:600;line-height:66px;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:51px;height:51px;
	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;
	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{font-size:50px;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:480px;}
.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:24px;color:#2c2c2c;font-weight:600;line-height:1.4em;
}
.sec3 .list .info1 .swiper-slide .date{margin-top:25px;font-size:18px;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:150px 0 0;}
.sec4 .title{display:flex;align-items:flex-end;justify-content:space-between;}
.sec4 .title h3{font-size:54px;color:#2c2c2c;font-weight:600;}
.sec4 .conwrap{
	display:flex;flex-wrap:wrap;justify-content:space-between;
	margin:45px 0 0;
}
.sec4 .conwrap .boxwrap{
	box-sizing:border-box;
	width:49%;
	padding:49px;
	background:#f3f4f9;
	border-radius:40px;
}
.sec4 .conwrap .boxwrap .tit{
	padding:19px 0 19px 50px;
	font-size:40px;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;
	transition:all 0.4s;
}
.sec4 .conwrap .boxwrap .tit2{
	background:url(/images/page/m11_icon2.png) no-repeat left center;
	transition:all 0.4s;
}
.sec4 .conwrap .boxwrap ul{
	display:flex;flex-wrap:wrap;justify-content:space-between;
	padding:48px 0 0;
}
.sec4 .conwrap .boxwrap ul li{
	position:relative;	
	width:49%;
	margin-bottom:20px;
}
.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{
	box-sizing:border-box;
	overflow : hidden;
	width:73px;height:73px;
	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:21px;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;}


@media(max-width:1240px){
	.sec4 .conwrap{display:block;}
	.sec4 .conwrap .boxwrap{width:100%;}
	.sec4 .conwrap .boxwrap:nth-child(1){margin-bottom:20px;}
}