.subVisual {position:relative;}
.subVisual .bg {width:100%; height:340px; text-align:center; background-repeat:no-repeat; background-size:cover; background-position:center;  display:flex; flex-direction:column; justify-content:center; align-items:center; background-color:#000;}    
.subVisual .bg h1 {font-size:50px; font-weight:500; color:#fff; }
.subVisual >ul {width:1500px; margin:-35px auto 0 auto; position:relative; z-index:6; display:flex; flex-direction:row;}
.subVisual >ul >li {width:25%; text-align:center; position:relative; }
.subVisual >ul >li:first-child a {border-top-left-radius:10px; border-bottom-left-radius:10px;}
.subVisual >ul >li:last-child a {border-top-right-radius:10px; border-bottom-right-radius:10px;}
.subVisual >ul >li >a {width:calc(100% - 10px); padding:0 5px; height:70px; line-height:1.1; display:flex; flex-direction:row; justify-content:center; align-items:center; background-color:#f6f6f6; font-size:18px; font-weight:500; color:#333;}
.subVisual >ul >li.active >a {background-color:var(--color02); color:#fff;}
.subVisual >ul >li:hover >a,
.subVisual >ul >li.active:hover >a{background-color:#333; color:#fff;}
.subVisual >ul >li {position:relative;}
.subVisual >ul >li:not(:last-child)::after {content:''; width:1px; height:100%; background-color:#333; opacity:0.2; position:absolute; top:50%; transform:translateY(-50%); right:0;}
.subVisual >ul >li i {margin-left:5px;}

.sub .sec .inner {width:1400px; margin:0 auto;}
.sub .tabBtn {padding-top:100px; display:flex; flex-direction:row; align-items:center; justify-content:center; margin-bottom:0px;}
.sub .tabBtn li {cursor:pointer;}
.sub .tabBtn li.active {}
.sub .tabBtn li p {}
.sub .tabBox .box {display:none;}
.sub .tabBox .box.on {display:block;}