@charset "utf-8";
*{word-break:keep-all;}
.wrap{min-width:280px;}
.sect.sect1 .sect_inner{max-width:1288px;margin:0 auto;padding:128px 44px 72px;}
.sect.sect2 .sect_inner{max-width:100%;margin:0 auto;padding:128px 0 100px;}
.sect.sect1 .sect_inner{max-width:1288px;margin:0 auto;padding:115px 44px 75px;}
.main .sect3 .sect_inner{max-width:100%;padding-right:0;padding-left:0;margin:0 auto;}
.sect .tit_wrap strong{display:block;margin:0;padding:0;font-family:'Noto Sans KR';font-size:60px;font-weight:700;color:#222;line-height:70px;text-align:center;}
.sect.sect2 .tit_h4 br.m_br:nth-child(2){display:inline-block;}
.sect.sect2 .tit_wrap img{display:block;margin:0 auto;}
.sect.sect2 .tit_h4 strong{display:inline-block;}
.sect.sect3 .tit_h2{margin:9px 0 0;padding:0;font-size:150px;line-height:125px;}
.sect.sect3 .sect_inner{max-width:100%;}
.tit_h4{margin:20px 0 0;padding:1px 0 6px;font-family:'Noto Sans KR';font-weight:700;font-size:40px;color:#222;line-height:60px;text-align:center;word-break:keep-all;}
.tit_h4 .m_br{display:none;}
.sect.sect_subPage .sect_inner{max-width:1288px;margin:0 auto;}
.sect_subPage .sect_inner{padding:128px 44px 128px;}

.m_br{display:none !important;}
.p_br{display:block !important;}
.t_br{display:none !important;}
.vision_boxs_wrap {display:flex;align-items:center;padding-top:60px}
.vision_boxs_wrap .box_inner {display: flex;flex-flow: row nowrap;justify-content: center;align-items: stretch;column-gap: 24px;}
.vision_boxs_wrap .box_inner > div {width:384px; height:250px; background-color:#ccc; border-radius:15px; background-color: #ccc;border-radius: 15px;color: #fff;font-size: 30px;text-align: center;font-weight: 600;padding-top: 153px;}

/* header */
.header{position:fixed;left:0;right:0;min-height:80px;margin:0;padding:0;z-index:30001;}
.header.scrolled::before{opacity:1;}
.header .header_inner{display:inline-block;width:100%;;padding:0;margin:0 auto;background-color:rgba(34,34,34,0.7);text-align:center;}
.header.scrolled .header_inner{background-color:rgba(34,34,34,1);}
.header .utp_logo {position:absolute;left:44px;top:9px;}
.utp_logo a{display:inline-block;padding:8px 0 6px 0;border-radius: 12px;background-color: #fff;border: 1px solid #fff;width:123px;height:60px; color:#c50a0a;text-align:center;
	line-height:21px;}
.utp_logo a span{display:block;font-size:18px;font-style:italic;color:#000}
.menu_top{display:inline-block;vertical-align:top;}
.menu_top .menu_top_inner{display:inline-block;}

.header .menu_mobile{display:none;}
.logo_sidebar_wrap{display:none;}

.gnb_wrap ul.gnb{display:flex;flex-flow:row wrap;justify-content:flex-start;align-items:center;column-gap:48px;}
.gnb_wrap ul.gnb > li{padding:0;display:inline-block;min-width:190px;flex:1;text-align:center;vertical-align:top;cursor:pointer;}
.gnb_wrap ul.gnb > li > a{position:relative;display:block;height:80px;padding:0;font-size:25px;font-weight:600;color:#fff;line-height:75px;text-align:center;vertical-align:top;}
.gnb_wrap ul.gnb > li:hover > a,
.gnb_wrap ul.gnb > li> a.active{position:relative;background-color:#000;}
.gnb_wrap ul.gnb > li.on > a{color:#fff;background-color:#000;}
.gnb_wrap ul.gnb > li.on > a::after{opacity:1;}

.gnb_wrap{display:block;flex:1;text-align:center;}
.gnb_wrap ul.gnb > li .gsnb_wrap{display:none;position:absolute;top:75px;left:0;right:0;width:calc(100% - 88px);height:auto;margin:0 auto;padding:0;border-radius:16px;background-color:#000;overflow:hidden;z-index:5;}
.gnb_wrap ul.gnb > li .gsnb_wrap{text-align:center;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul{display:inline-flex;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul > li{display:flex;flex-flow:column wrap;justify-content:flex-start;align-items:flex-start;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul > li:last-child{border-right:1px solid #212121;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul > li{padding:32px 0 49px;border-left:1px solid #212121;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul > li a{display:block;width:175px;padding:9px 20px;font-weight:700;font-size:22px;color:#fff;line-height:normal;text-align:left;}

.gnb_wrap ul.gnb > li .gsnb_wrap ul.gsnb_sub{display:block;padding:19px 0 0;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul.gsnb_sub > li{display:block;width:175px;padding:0;text-align:left;border:none;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul.gsnb_sub > li a{display:block;margin:0;padding:0 20px;font-size:18px;font-weight:400;color:#fff;line-height:35px;letter-spacing:-0.025em;}

.header .right > .inner{display:flex;align-items:center;justify-content:flex-end;column-gap:8px;height:75px;margin:0;padding:0;text-align:center;}

.sect_inner{max-width:1440px;padding:100px 50px;margin:0 auto;}

.sect_top{position:relative;width:100%;height:100vh;overflow:hidden;}
.sect_top .mp4_wrap{height:100vh;}
.sect_top video{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;object-fit:cover;}

.main .sect_top{display:flex;justify-content:center;align-items:center;padding-top:80px;background:linear-gradient(#00000045, #00000045), url(../img/visual_bg1.png) no-repeat center / cover;}
.main .sect_top .sect_top_inner{margin:0 auto;}
.top_txt_wrap{padding:0;}
.top_txt_wrap .mo_br{display:none;}
.top_txt_wrap .tit_h2{font-size:69px;line-height:1;font-weight:600;color:#fff;letter-spacing:-1px;text-align:center;overflow: hidden;}
.top_txt_wrap .tit_h2 .txt_motion{display:none;vertical-align:top;width:750px;height:90px;padding:0 10px 17px;margin-right:8px;text-align:center;border-bottom:4px solid #fff;}
.top_txt_wrap .tit_h2 .txt_motion:first-child{display:inline-block;}
.top_txt_wrap .desc p{margin-top:30px; font-size:31px;line-height:1;font-weight:500;color:#ffff;letter-spacing:-1px;text-align:center;}
.top_txt_wrap .bt_wrap{margin:40px 0 0 0;}
.top_txt_wrap .bt_wrap .bt_viewAi{display:inline-block;height:59px;padding:0 20px 0 25px;border-radius:20px;background-color:#8C8C8C99;}
.top_txt_wrap .bt_wrap .bt_viewAi span{font-size:22px;font-weight:600;color:#fff;line-height:59px;}

/* Typing Cursor */
.top_txt_wrap .tit_h2 .txt_motion .cursor {
	display: inline-block;
	margin-left: 2px;
	font-weight: 300;
	color: rgba(255, 255, 255, 0.4);
	animation: blink 0.8s infinite;
	vertical-align: top;
}
@keyframes blink {
	0%, 100% { opacity: 1; }
	50% { opacity: 0; }
}
/* width */
::-webkit-scrollbar{
	width:6px;
}

/* Track */
::-webkit-scrollbar-track{
	box-shadow:inset 0 0 5px #ccc;
	border-radius:6px;
}

/* Handle */
::-webkit-scrollbar-thumb{
	background:#ccc;
	border-radius:6px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover{
	background:#ddd;
}

/* tit */
.tit_subPage_h3{font-size:48px;font-weight:600;color:#000;line-height:49px;text-align:center;}
.dsc_subPage_wrap p{margin:16px 0 0;padding:1px 0 2px;font-size:24px;font-weight:400;color:#000;line-height:35px;text-align:center;}
.bt_subPage_wrap{margin:30px 0 0;}

.dimmed{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40002;background-color:#000;opacity:0.45;}

.bg_pointf{background-color:#ffffff !important;}
.bg_point1{background-color:#f4f9ff !important;}
.txt_point1{color: #c50a0a;}

/* title */
.tit_h3{margin-bottom:20px;font-size:50px;line-height:normal;font-weight:600;letter-spacing:-2px;color:#000;text-align: center;}
.sub_tit{display:block;margin-bottom:12px;font-size:25px;line-height:normal;font-weight:500;letter-spacing:-1px;color:#111111;text-align:center;}
.tit_h2{font-size:40px;line-height:1;font-weight:700;letter-spacing:-2px;color:#111111;text-align: center;}


/* section4 */
.main .sect1 .sect_inner{padding-right:0;padding-left:0;}
.portfolioBx_wrap{display:grid;grid-template-columns:100%;grid-template-rows:auto;gap:2px 0;align-items:stretch;height:auto;padding:80px 0 0;overflow:visible;}
.portfolioBx_wrap .portfolioBx{display:flex;align-items:stretch;height:212px;transition:height .6s cubic-bezier(0.4, 0, 0.2, 1);border-radius:8px;}
.portfolioBx_wrap .portfolioBx:hover{height:400px;}
.portfolioBx_wrap .portfolioBx > .portfolioBx_inner{flex:1;display:flex;align-items:flex-end;min-width:0;object-fit:cover;}
.portfolioBx_wrap .portfolioBx.box1 .portfolioBx_inner{background:linear-gradient(#00000054, #00000054), url("../img/box_bg1.png") no-repeat center / cover;}
.portfolioBx_wrap .portfolioBx.box2 .portfolioBx_inner{background:linear-gradient(#00000054, #00000054), url("../img/box_bg2.png") no-repeat center / cover;}
.portfolioBx_wrap .portfolioBx.box3 .portfolioBx_inner{background:linear-gradient(#00000054, #00000054), url("../img/box_bg3.png") no-repeat center / cover;}
.portfolioBx_wrap .portfolioBx.box4 .portfolioBx_inner{background:linear-gradient(#00000054, #00000054), url("../img/box_bg4.png") no-repeat center / cover;}

.portfolioBx_wrap .portfolioBx{overflow: hidden;}
.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl{flex:1;max-height:235px;padding:100px 37px 60px;overflow:hidden;transition:max-height 1s ease;}
.portfolioBx_wrap .portfolioBx .portfolioBx_tit > span{display:block;font-size:16px;line-height:25px;font-weight:400;color:#ffffff;letter-spacing:-0.02em;}
.portfolioBx_wrap .portfolioBx .portfolioBx_tit > p{font-size:48px;line-height:1;font-weight:700;color:#ffffff;letter-spacing:-0.025em;margin-top:2px;}
.portfolioBx_wrap .portfolioBx .portfolioBx_detail{width:100%;margin-top:40px;opacity:0;transition: visibility 0.4s ease, opacity 0.4s ease;white-space:nowrap;}
.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl dt{white-space:nowrap;}

.portfolioBx_wrap .portfolioBx .portfolioBx_detail > p{width:100%;font-size:16px;line-height:25px;font-weight:400;color:#ffffff;letter-spacing:-0.02em;border-top: 3px solid #fff;
    display: inline-block;
    width: auto;
    padding-top: 14px;
}
.portfolioBx_wrap .portfolioBx .portfolioBx_tit > span{white-space:nowrap;}
.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul{display:flex;flex-flow:row nowrap;gap:10px;margin-top:10px;}
.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li{display:flex;align-items:center;height:32px;padding:0 14px;font-size:12px;line-height:1;font-weight:400;color:#ffffff;letter-spacing:-0.02em;white-space:nowrap;border-radius:16px;border:1px solid #ffffff;transition:background-color 0.3s ease, color 0.3s ease;}
.portfolioBx_wrap .portfolioBx:hover  > .portfolioBx_inner dl{max-height:100%;}
.portfolioBx_wrap .portfolioBx:hover .portfolioBx_detail{opacity:1;visibility:visible;;}
.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li:hover{background-color:#ffffff;color:#222222;}
.portfolioBx_wrap .portfolioBx{position:relative;}
.portfolioBx_wrap .portfolioBx .portfolioBx_link{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;}
.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li{position:relative;z-index:2;}
.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li .portfolioBx_tag{position:absolute;top:0;left:0;width:100%;height:100%;}
.portfolioBx_wrap .portfolioBx .box{opacity: 0;transform: translateX(50px);transition:opacity .6s ease,transform .6s cubic-bezier(0.4, 0, 0.2, 1);color:#fff;position: absolute;top: 200px;right: 60px;
}

.portfolioBx_wrap .portfolioBx:hover .box {
  opacity: 1;
  transform: translateX(0);
  font-size:20px;
}
.portfolioBx_wrap .portfolioBx .box li{position:relative;padding-left:10px;line-height:33px;}
.portfolioBx_wrap .portfolioBx .box li::after{display: block;content: "";position: absolute;top:15px;left: 0;width:4px;height:4px;background-color:#fff;border-radius:100%;}

.jsdisplay {display: block !important;}

.newswrap {position: relative; margin: 60px auto 0 auto; padding:0 30px;max-width: 100%;}
.newswrap .tit_wrap{font-size: 20px;color:#111;line-height: 30px;margin:30px auto 0 auto; max-width: 1288px;}
.newswrap .tit_wrap span{font-weight: 600;}
.newswrap .imag-area{position: relative;text-align: left;margin:0 auto; max-width: 1288px;}
.newswrap .more {position: absolute;right:30px;bottom:61px}
.newswrap .more a{display: block; position: relative; border: 1px solid #111; padding: 20px; color: #111;font-size: 18px;font-weight: 500; padding-right: 40px;}
.newswrap .more a::after {content:"";    width: 30px;  height: 30px; background-image: url(../img/bt_gotoTop2.jpg); background-size: 30px auto;position:absolute;top:19px;right:10px;background-repeat: no-repeat; transform: rotate(90deg);}
.newswrap .imag-area img {display: inline-block;width:38%;}
.newswrap .imag-area img + img {margin-left:20px}
/* logo_com_banks */
.logo_com_banks{padding:60px 30px 54px;}
.logo_com_banks > .line{display:block;max-width:1288px;margin:0 auto;padding:20px 2px 15px 2px;background:linear-gradient(#fff, #fff) padding-box,linear-gradient(90deg, #215DDA 0%, #159CD8 36.54%, #02FFD5 100%) border-box;border:1px solid transparent;border-radius:13px;box-shadow: 10px 10px 30px 0px #215DDA1A;}
.logo_com_banks > .line .logo_com_inner{position:relative;}
.logo_com_banks > .line .logo_row{margin:8px 0 0;overflow:hidden;width:100%;position:relative;height:56px;}
.logo_com_banks > .line .animate_left{position:absolute;top:0;left:0;width:100%;display:flex;justify-content:center;animation:marqueeToLeft 40s linear infinite;}
.logo_com_banks > .line .animate_right{position:absolute;top:0;right:0;width:100%;display:flex;justify-content:center;animation:marqueeToRight 40s linear infinite;}

.logo_com_banks > .line .logo_row:first-child{margin-top:0;}
.logo_com_banks > .line .logo_row ul{display:flex;justify-content:flex-start;align-items:flex-start;gap:20px;padding:0 0 0 20px;}
.logo_com_banks > .line .logo_row ul li{height:56px;background-color:#fff;margin:0 10px;line-height:56px;cursor:default}
.logo_com_banks > .line .logo_row ul li img{width:100px;max-height:100%;vertical-align:middle;cursor:default}
/* slide animate */
@keyframes marqueeToLeft{
	0%{left:0;}
	100%{left:-100%;}
}
@keyframes marqueeToRight{
	0%{right:0;}
	100%{right:-100%;}
}
@keyframes marquee{
	0%{transform:translate(0,0);}
	100%{transform:translate(-100%,0);}
}

.timeline_right .imag-area {margin: 20px 0 0 40px;}
.timeline_right  .imag-area img {width:350px;display:inline-block;}
.timeline_right  .imag-area img + img {margin-left: 20px;}

/* footer */
.footer{width:100%;background-color:#222;}
.footer_inner{position:relative;margin:0 auto;padding:30px 44px}
.footer .foot_top{display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;column-gap:62px;}

.footer .logo a{display:block;padding:6px 0 12px;margin-top:6px;border-radius: 12px;width:123px;height:64px; color:#000;text-align:center;line-height:25px;}
.footer .logo a span{display:block;font-size:20px;}
.footer .foot_top .footer_logo a img{height:19px;}
.footer .foot_top .footer_menu ul{display:inline-flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;column-gap:63px;}
.footer .foot_top .footer_menu li a{display:inline-block;}
.footer .foot_top .footer_menu li a span{font-size:18px;font-weight:700;color:#222;line-height:48px;}
.footer .footer_copy{margin:41px 0 0;}
.footer .cnt_info{display:inline-block;margin:0;}
.footer .cnt_info p{display:inline-block;position:relative;font-size:16px;font-weight:400;color:#aaa;line-height:26px;font-size: 14px;}
.footer .cnt_info p + p {margin-left:8px;}
.footer .cnt_info p span {padding-right:12px;}
.footer .cnt_info p span::after {content:"";width:1px;height:15px;position:absolute;top:7px;right:0;background-color:#aaa;}
.footer .cnt_info p.ad {display: block;margin-left:0}
.footer .cnt_info p.noline span::after{display:none;}
.footer .cnt_info p span .mo_br{display:contents;}
.footer .cnt_info a{position:relative;color:#aaa;}
.footer .cnt_info a::after{display: block;content: "";position:absolute;bottom:-1px;left:0;right:0;width:100%;height:1px;background-color:#aaa;}
.footer p.copy_right{display: block;border-top:1px solid #aaa;margin:25px 0 0;padding:10px 0 0 0;font-size:12px;font-weight:400;color:#fff;line-height:26px;text-transform:uppercase;color:#aaa}
.footer .footer_isms{position:absolute;right:44px;bottom:50px;}
.footer .footer_isms dl{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;flex-flow:nowrap/*row wrap*/;justify-content:flex-start;align-items:center;column-gap:11px;}
.footer .footer_isms dl dt img{width:50px;}
.footer .footer_isms dl dd p{margin:0;padding:0;font-size:14px;font-weight:400;color:#fff;line-height:22px;}
@media (min-width: 768px) {
  .footer .cnt_info .noline a{pointer-events: none;cursor: default;     color: inherit;        text-decoration: none; }
  .footer .cnt_info .noline a::after{display: none;}
}

/* btn_totop_wrap */
.btn_totop_wrap{position:fixed;right:44px;z-index:3000;bottom:-56px;}
.btn_totop_wrap ul{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;flex-flow:column nowrap;justify-content:center;align-items:center;gap:7px;}
.btn_totop_wrap ul li a{position:relative;display:block;width:84px;height:84px;border: 1px solid #c5c5c5;border-radius:100%;background-repeat:no-repeat;background-color:#fff;overflow:hidden;}

.btn_totop_wrap ul li .btn_gotoTop{width:56px;height:56px;background-image:url("../img/bt_gotoTop2.jpg");background-size:56px auto;}

.sub_title_top{width:100%;height:400px;background-repeat:no-repeat;background-position:bottom;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-image:url("../img/sub_bg_b.png");}
.sub_title_top .subsub_title_inner{width:100%;margin:0 auto;}
.sub_title_top .vh_center{display:table;width:100%;height:400px;padding:96px 0 0;text-align:center;vertical-align:middle;}
.sub_title_top .vh_center .banner_tit{display:table-cell;vertical-align:middle;}
.sub_title_top .banner_tit h2{padding:1px 0 9px;font-size:68px;font-weight:700;color:#222;line-height:80px;position:relative;display: inline-block;padding-right:28px}
.sub_title_top .banner_tit h2::after{display: block;content: "";position: absolute;bottom:14px;right: 0;width:18px;height:18px;background-color:#c50a0a;border-radius:100%;}
.sub_title_top .visual1{background-image:url("../img/.png");}

.sub_page_wrap .sect_inner{padding:128px 44px 128px; max-width:1288px;margin:0 auto;}
.tit_sub_page_top_txt {color:#333;font-size:48px;font-weight:400;text-align:center;}
.location_wrap {display: block;margin-top:80px;}
.location_wrap::after{content:"";display:block;clear:both;}
.location_wrap .ad {width:100%;margin-bottom:50px;font-size:20px;}
.location_wrap .ad::after{content:"";display:block;clear:both;}
.location_wrap .ad .txt1{font-size:32px;font-weight:bold;text-align:center;}
.location_wrap .ad .txt1 span{position:relative;display:inline;    padding-left: 24px;}
.location_wrap .ad .txt1 span::after {display: block;content: "";position:absolute;top:20px;left: 0;width: 10px;height: 10px;background-color: #c50a0a;border-radius: 100%;}
.location_wrap .ad .txt2{margin-top:24px;    text-align: center;font-size: 23px;}
.location_wrap .ad .txt2 span, .location_wrap .ad .txt3 span{display:inline-block}
.location_wrap .ad .txt2 .info, .location_wrap .ad .txt3 .info{margin-top:10px}
.location_wrap .ad .txt2 .tit, .location_wrap .ad .txt3 .tit{color:#c50a0a;font-weight:500;}
.map-container {width:100%;aspect-ratio: 16 / 9;margin: 0 auto;}
.map-container iframe {width: 100%;height: 100%;border:0;}
.viseon_top_visual {height:300px;color:#fff;font-weight:500;font-size:50px;text-align:center;padding-top: 110px;margin:80px 0 100px 0;
	background-repeat:no-repeat;background-position:center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-image:url("../img/visoin_top.png");
}
.viseon_area{height:300px;margin-top:80px;}
.viseon_area+.viseon_area{margin-top:95px;}
.viseon_area .img{width:53% !important;max-width:510px;float:left;height:300px !important;border-radius:0 19%;display: block !important;}
.viseon_area .img img{width:100%;height:300px;border-radius:0 19% !important;}
.viseon_area .txt_area{position:relative;width:46%;max-width:500px;float:left;padding-top:50px;margin-left:110px;}
.viseon_area.right .txt_area{margin:0 110px 0 0;}
.viseon_area::after{content:"";display:block;clear:both;}
.viseon_area .txt_area dt{position:relative;margin-bottom:20px;font-size:25px;font-weight:bold;}
.viseon_area .txt_area dd{font-size:20px;font-weight:400;}
.viseon_area.right .txt_area {text-align:right;}
.viseon_area .txt_area dt::after{display: block;content: "";position:absolute;top:12px;left:-35px;width:15px;height:15px;background-color: #c50a0a;}
.viseon_area .txt_area dt::before{display: block;content: "";position:absolute;top:18px;left:-171px;width:136px;height:1px;background-color: #000;}
.viseon_area.right.viseon_area .txt_area dt::after {right:-25px;left: auto;}
.viseon_area.right.viseon_area .txt_area dt::before {right:-171px;left: auto;}
.viseon_area.right.viseon_area .txt_area dt::after {right:-35px;left: auto;}
.viseon_area.right .img{border-radius:19% 0;}
.ceo_area{text-align:left;}
.ceo_area::after{content:"";display:block;clear:both;}
.ceo_area .img{float:left;width:500px;height:500px;background-color:#ccc;}
.ceo_area .cont_txt{float:left;width:520px;margin-left:100px;font-size:20px;}
.ceo_area .cont_txt p+p{margin-top:20px}
.ceo_area .cont_txt .sign{text-align:right;margin-top:100px;font-weight:400;font-size:30px;}
.history_area{position: relative;width: 100%;box-sizing: border-box;margin-top:120px;}
.history_area .con{font-size:15px;padding-top:11px;}
.history_area .timeline_progress {left:354px;position: absolute;top: 0;width: 1px;height: 100%;background: #ddd;}
.history_area .timeline_progress_bar {position: absolute;position: fixed;top: 0;left: 37px;display: none;width: 1px;height: 50vh;background: linear-gradient(180deg, #6248ff, #0e7dff 51%, #00df9b);}
.history_area .timeline {position: relative;display: grid;grid-template-columns: 255px 100px auto;padding-bottom: 75px;}
.history_area .timeline .timeline_left {text-align: right;color:#000;}
.history_area .timeline .timeline_date {margin-bottom: 10px;padding-left: 40px;box-sizing: border-box;line-height: 22px;font-size:70px;font-style:italic;font-weight: 700;margin-bottom: 0;padding-left: 0;line-height: 36px;}
.history_area .timeline .timeline_center {position: absolute;top: 0;position: inherit;top: inherit;justify-content: center;display: flex;left:50px}
.history_area .timeline .time_circle {width: 20px;height: 20px;background-size: 20px;background-image:url("../img/icon_circle.png");}
.history_area .timeline .timeline_right {margin-top: -7px}
.history_area .timeline .timeline_txt {padding-left:45px}
.history_area .timeline .timeline_txt p  {margin-top:4px;padding-left: 40px;line-height:30px;font-size:19px;color:rgba(34,34,34,0.7);}
.history_area .timeline .timeline_txt p:first-child {margin-top: 0;}
.history_area .timeline .timeline_txt p.point {position:relative;font-size: 25px;padding-left:68px;color:#333;font-weight:500;margin:40px 0 20px 0;}
.history_area .timeline .timeline_txt p.point::before {content: '';position: absolute;left: 44px;top:10px;/*transform: translateY(-50%) rotate(45deg);*/width:10px;height:10px;background-color: #c50a0a;}
.history_area .timeline .timeline_txt p.point.gap {margin-top:50px}
.history_area .timeline .timeline_txt p.point1{color:#c50a0a;font-size:27px;font-weight:500;}
.history_area .timeline.last {padding-bottom: 0;background: #fff;}
.history_area .timeline.last .timeline_center {background: #fff}
.content .bg_gray .history_area .timeline.last .timeline_center {background: #f7f7f8}
.tab_wrap {position:relative;}
.tab-menu {list-style: none;margin:0;}
.tab-menu::after{content:"";display:block;clear:both;}
.tab-button {display:block;float:left;position:relative;width:25%;padding: 18px 0;cursor:pointer;border:none;outline:none;font-size:25px;transition: 0.3s;border-bottom:1px solid #ccc;border-right:1px solid #ccc;}
.tab-button.active {position:relative;font-weight:bold;color:#c50a0a;border-bottom:0;}
.tab-button.active::before{display: block;content: "";position:absolute;bottom:-1px;left:0;right:0;width:100%;height:3px;background-color:#c50a0a;}
.tab-button.last{border-right:0;}
.tab-content {display: none;padding:40px 0 0 0;border-top: none;opacity: 0;transform: translateY(10px);transition: opacity 0.4s ease, transform 0.4s ease;}
.tab-content.show {opacity: 1;transform: translateY(0);}
.sect_inner.pd0{padding-top:0;}
.business_wrap .top_area{padding:40px;margin-bottom:50px;background-color:#e2ecf7;position: relative;overflow: hidden;color:#000}
.business_wrap .top_area .img img{
  position: absolute;
  width: 350px;
  height:233px;
  right: 3px;
  top: 50%;
  transform: translate(100px, -50%);
  opacity: 0;
  animation: slideIn 0.8s ease-out 1s forwards;
}

@keyframes slideIn {
  from {
    transform: translate(100px, -50%);
    opacity: 0;
  }
  to {
    transform: translate(0, -50%);
    opacity: 1;
  }
}
.business_wrap .top_area h3{position: relative;display:inline-block;padding-bottom:4px;font-size:28px;font-weight:500; z-index: 1;}
.business_wrap .top_area h3::after {display:block;animation: redPen 0.7s ease-out 1s forwards;  content: "";position: absolute;z-index: -1;left: -2px;right: -2px;top: 51%;height: 15px;/*background: rgba(255, 220, 0, 0.5);*/background:rgb(237 255 0 / 50%);;transform: rotate(-1deg);border-radius: 2px;}

@keyframes redPen {
	to{transform: scaleX(1);}
}
.business_wrap .top_area .tx1{margin:22px 0 13px 0;font-size:19px;color:#222;font-weight:500;}
.business_wrap .top_area .tx2{margin:25px 330px 0 0;font-size: 17px;color: #333;;border-top: 1px solid #ccc;padding:20px 0 0 0;line-height: 27px;}
.business_wrap .top_area .list li{position:relative;padding-left:10px;font-size:17px;line-height:25px;color:#333}
.business_wrap .top_area .list li::after{display: block;content: "";position: absolute;top:11px;left: 0;width: 3px;height: 3px;background-color:#6f6969;}
.business_wrap .top_area .list li+li{margin-top:10px}
.con_txt_wrap{word-break: keep-all;font-size:17px;color:#000}
.con_txt_wrap .tx1{line-height:27px;font-size:19px;}
.con_txt_wrap .tx2{padding:45px 0 35px 0;font-size:40px;font-weight:500;text-align:center;}
.con_txt_wrap .list2{display:flex;justify-content:space-between;align-items:center;column-gap:15px;}
.con_txt_wrap .list2 li{width:calc(100% / 3);position:relative;padding-left:10px;line-height:25px;border:1px solid #f5f5f5;border-radius:20px;background-color:#f5f5f5;padding:35px 27px 30px 30px;text-align:center;}
.con_txt_wrap .list2 .tit{padding-bottom:18px;font-size:24px;font-weight:500;border-bottom:1px solid #ccc;}
.con_txt_wrap .list2 .pen{position: relative;z-index: 1;display:inline-block;}
.con_txt_wrap .list2 .pen::after {animation: Pen 0.7s ease-out 1s forwards;  content: "";position: absolute;z-index: -1;left: -2px;right: -2px;top: 51%;height: 15px;background:rgb(9 224 196 / 28%);;transform: rotate(-1deg);border-radius: 2px;}

@keyframes Pen {to{transform: scaleX(1);}}
.con_txt_wrap .list2.gap .tit{min-height: 66px; vertical-align: middle;line-height: 30px;}
.con_txt_wrap .list2.gap li {min-height: 66px;height: 225px;}
.con_txt_wrap .list2.gap1 li {height: 225px;}
.con_txt_wrap .list2.gap2 li {height: 196px;}
.con_txt_wrap .list2 .txt{position:relative;line-height:25px;margin-top:13px;color:#333;text-align: left;}
.intro_area{position:relative;;font-size:20px;width:100%;height:500px;
	background-repeat:no-repeat;background-position:center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;
	background-image:linear-gradient(#a1979754),url("../img/visoin_top2.png");}
.intro_area .txt_wrap{  max-width: 1440px;padding: 210px 50px 0 50px;margin: 0 auto;}
.intro_area::after{content:"";display:block;clear:both;}
.intro_area .txt_left,.intro_area .txt_right{float:left;}
.intro_area .txt+.txt{margin-top:30px}
.intro_area .txt_left{font-size:115px;width:22%;color: #c50a0a;line-height: 80px;font-weight:600;}
.intro_area .txt_right{width:78%; color: #000;}
.tit_sub_page_top_txt2{margin-top:100px;font-size: 74px;font-weight: 500;text-align:center;}
.viseon_top_txt{margin-bottom: 60px;line-height: 66px;font-size: 44px;text-align:center;}
.line_br{display:block;}
/****************************************************************************************************

Tablet
****************************************************************************************************/
@media only screen and (max-width:159px){
	.line_br{display: inline-block;}
}
@media only screen and (max-width:1253px){
	.timeline_right .imag-area img { width:45%;}
}
@media only screen and (max-width:1225px){
	.line_br{display: inline-block;}
}
@media only screen and (max-width:1213px){
	.con_txt_wrap .list2 li{padding-top:30px; height: 210px;}
	.con_txt_wrap .list2.gap1 li{height: 213px;}
	.con_txt_wrap .list2.gap2 li { height: 210px;}
}
@media only screen and (min-width: 1024px) and (max-width: 1291px) {
	/*.history_area .inner_wrap, .history_area .timeline .timeline_left, .history_area .timeline .timeline_date{text-align:center;}
	.history_area .timeline{display: block;padding-bottom:100px}
	.history_area .timeline .time_circle, .history_area .timeline_progress, .history_area .timeline .timeline_txt p.point::before{display:none;}
	.history_area .timeline .timeline_right{margin-top:50px;}
	.history_area .timeline .timeline_txt p+p{margin-top:10px;}
	.history_area .timeline .timeline_txt p.point{margin-top:30px;padding-left:0;}
	.history_area .timeline .timeline_txt p.point.gap{margin-top:50px;}*/
	.tab-button{font-size:21px}
	/*.history_area .timeline .timeline_txt,
	.history_area .timeline .timeline_txt p.point1{padding-left:0;}*/
	.business_wrap .top_area .tx2{font-size:16px;}
	.business_wrap .top_area .img img{width: 280px;height: 209px;}
	.business_wrap .top_area .tx2{margin: 25px 260px 0 0;}
}
@media only screen and (min-width: 1024px) and (max-width: 1269px) {
	.intro_area .txt_left{font-size:90px !important;}
}
@media only screen and (min-width: 1024px) and (max-width: 1213px) {
	.viseon_area .img{width:45% !important}
	.viseon_area .txt_area{width:40%}
	.con_txt_wrap .list2 .tit{padding-bottom:15px;font-size:20px}
}
@media only screen and (min-width: 1024px) and (max-width: 1174px) {
	.txt_motion_lst .last{display:inline-block;margin-top:20px}
}
@media only screen and (min-width: 1024px) and (max-width: 1102px) {
	.header_inner::after{content:"";display:block;clear:both;}
	.utp_logo{float:left;position:unset !important;margin:9px;}
	.menu_top{float:left;}
	.gnb_wrap ul.gnb{column-gap:30px !important;}
	.intro_area .txt_right .txt {font-size:17px;}
	.con_txt_wrap .list2 .txt{font-size:17px;}
	.con_txt_wrap .list2 li{height:210px !important; padding: 30px 20px 0 20px;}
	.con_txt_wrap .list2.gap1 li {height:230px !important}
	.con_txt_wrap .list2.gap2 li {height:207px !important}
}
@media only screen and (max-width:1023px){
	.main .sect_inner{width:100%;padding:80px 40px 70px 40px !important;}
	.p_br.ta ,.ta{display:block !important}
	/* .header */
	.header{height:64px;min-height:64px;margin:37px 56px 0;padding:0;margin:0;border-radius:10px;z-index:40003;}
	.header::before{height:122px;}
	.header .header_inner{height:64px;justify-content:space-between;align-items:center;padding:0 16px;border-radius:0;}
	.header .utp_logo a{width:97px;;height:45px;padding:0;font-size: 10px;line-height:25px;}
	.header .utp_logo a h1 span{font-size:15px;line-height:14px;}
	.sub_title_top{height:300px}
	.sub_title_top .banner_tit h2{font-size: 60px;}
	.sub_title_top .vh_center{padding-top:64px;height:300px}
	.viseon_top_txt{padding: 0 10px;}
	.intro_area .txt_wrap{padding-top:130px;}
	.intro_area{height:400px}
	.viseon_top_visual{height:270px;font-size: 42px;}
	/* .menu_top */
	.menu_top{position:fixed;top:0;right:0;bottom:0;display:none;z-index:40003;}
	.menu_top .menu_top_inner{position:fixed;top:0;right:0;bottom:0;display:block;width:300px;padding:0;background-color:#fff;z-index:40003;}

	/* .menu_mobile */
	.header .menu_mobile{display:block;position:absolute;top:0;right:20px}
	.header .menu_mobile .btn_mMobile{display:block;padding:24px;}
	.header .menu_mobile .btn_mMobile span{display:block;width:24px;height:2px;margin-top:5px;background-color:#fff;}
	.header .menu_mobile .btn_mMobile span:first-child{margin-top:0;}

	.logo_top_wrap{display:flex;justify-content:space-between;align-items:center;height:64px;padding:0 8px 0 13px;}
	.logo_top_wrap .memu_log_top a{display: block;width: 50px;height: 50px;background-image:url("../img/favicon.png");background-repeat:no-repeat;background-position:center;background-size:50px;}
	.logo_top_wrap .logo_sidebar a{display:block;width:42px;height:54px;}
	.btn_sidebarClose{right: 0;bottom: 0;z-index: 30000;-position: absolute;display:block;width:50px;height:50px;background-image:url("../img/ic_close.png");background-repeat:no-repeat;background-position:center;background-size:25px;}

	/* .gnb_wrap */
	.gnb_wrap{width:100%;height:calc(100vh - 215px);padding-bottom:24px;border-top:1px solid #e2ecf7;overflow-y:auto;overflow-x:hidden;}
	.gnb_wrap{height:calc(100vh - 166px);padding-bottom:0;}

	.gnb_wrap ul.gnb{flex-flow:column wrap;align-items:normal;}
	.gnb_wrap ul.gnb > li{border-bottom:1px solid #e2ecf7;}
	.gnb_wrap ul.gnb > li > a{width:100%;height:60px;padding:0 24px;font-size:23px;color:#121212;line-height:60px;text-align:left;}
	.gnb_wrap ul.gnb > li > a::after{content:"";display:block;position:absolute;right:0;top:0;transform: rotate(-90deg);width:64px;height:60px;background-image:url("../img/ic_arrow.png");background-repeat:no-repeat;background-position:0 -60px;background-color:transparent;opacity:1;}
	.gnb_wrap ul.gnb > li> a.active{background-color:#e2ecf7;}
	.gnb_wrap ul.gnb > li:hover > a{background-color:#e2ecf7;}
	.gnb_wrap ul.gnb > li.active:hover{color:#000;background-color:#fff;}
	.gnb_wrap ul.gnb > li.active > a{color:#000;background-color:#fff;}
	.gnb_wrap ul.gnb > li.active .gsnb_wrap{width:300px;border-top:1px solid #e2ecf7;}

	.header .right{position:fixed;top:auto;right:0;bottom:0;height:auto;border-top:1px solid #e2ecf7;}
	.header .right > .inner{flex-flow:initial;flex-wrap:wrap;justify-content:flex-start;align-items:flex-start;column-gap:4px;row-gap:4px;width:300px;height:auto;padding:20px;}
	
	.top_txt_wrap .mo_br{display:block;}
	.top_txt_wrap .tit_h2{font-size:65px;}
	.top_txt_wrap .tit_h2 .txt_motion{height:81px;margin-right:0;margin-bottom:30px;padding: 0 10px 13px;width:700px;border-bottom:3px solid #fff;}
	.top_txt_wrap .desc p{line-height:50px;}
	.top_txt_wrap .bt_wrap{text-align:center;margin:30px 0 0;}
	.top_txt_wrap .bt_wrap .bt_viewAi{height:56px;padding:0 20px 0 23px;}
	.top_txt_wrap .bt_wrap .bt_viewAi span{font-size:20px;line-height:56px;}

	/* portfolioBx_wrap */
	.portfolioBx_wrap{display:grid;grid-template-columns:100%;grid-template-rows:auto;gap:2px 0;padding:60px 0 0;height:auto;overflow:visible;}

	.portfolioBx_wrap .portfolioBx{display:flex;align-items:stretch;overflow:hidden;}
	.portfolioBx_wrap .portfolioBx:hover{height:350px;}
	.portfolioBx_wrap .portfolioBx .box{top:134px}
	.portfolioBx_wrap .portfolioBx:hover .box{font-size:18px;}
	.portfolioBx_wrap:has(.portfolioBx:nth-child(1):is(:hover, .active)){grid-template-columns:100%;}
	.portfolioBx_wrap:has(.portfolioBx:nth-child(2):is(:hover, .active)){grid-template-columns:100%;}
	.portfolioBx_wrap:has(.portfolioBx:nth-child(3):is(:hover, .active)){grid-template-columns:100%;}
	.portfolioBx_wrap:has(.portfolioBx:nth-child(4):is(:hover, .active)){grid-template-columns:100%;}

	.portfolioBx_wrap .portfolioBx .portfolioBx_detail{margin-top:30px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > span{font-size:12px;line-height:17px;}
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner{max-height:100%;overflow:hidden;transition:height .6s ease;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > p{font-size:34px;}

	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl{flex:1;height:212px;max-height:100%;padding:86px 26px 42px;transition:height 0.6s ease;}
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl,
	.portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{transition:height 0.5s ease;padding:0 26px 42px;}
	
	.portfolioBx_wrap .portfolioBx.active .portfolioBx_detail,.portfolioBx_wrap .portfolioBx:hover .portfolioBx_detail{opacity:1;visibility:visible;overflow:visible;}

	.intro_area .txt_left {font-size:100px;}
	.intro_area .txt_right{width: 71%;color: #000;font-size: 18px; margin-left: 45px;}
	.viseon_top_txt {line-height:59px;font-size:39px;}
	.viseon_top_txt .txt_point1 {font-weight:500;}
	.viseon_area .img {width:40% !important;height:260px !important;}
	.viseon_area .img img{height:260px;}
	.tab-button {font-size:20px;}
	.con_txt_wrap .list2 .tit{font-size:18px;}
	.con_txt_wrap .list2 .txt{font-size:15px;margin-top:16px;padding-bottom:0;line-height: 23px;}
	.con_txt_wrap .list2 li {padding: 27px 27px 27px 30px;height:auto;}
	.newswrap {padding:0}
	.newswrap .more{right:0}
	.logo_com_banks {padding: 60px 0 54px;}
	/* footer */
	.footer_inner{padding:40px 40px 37px;}
	.footer .foot_top{column-gap:32px;}
	.footer .foot_top .footer_menu ul{column-gap:45px;}
	.footer .foot_top .utp_logo a{width: 97px;height: 45px;padding: 0;font-size: 10px;line-height: 25px;}
	.footer .foot_top .utp_logo a h1 span{font-size: 15px;line-height: 14px;}
	.footer .footer_copy{margin:27px 0 0;}
	.footer .footer_copy .cnt_info p{font-size:13px;line-height:21px;}
	.footer .footer_copy .cnt_info p.copy_right{margin:18px 0 0;font-size:13px;line-height:21px;}

	/* btn_totop_wrap */
	.btn_totop_wrap{right:22px;bottom:-40px;}
	.btn_totop_wrap ul{gap:8px;}
	.btn_totop_wrap ul li span{display:none;}
	.btn_totop_wrap ul li .btn_gotoTop{width:40px;height:40px;border-radius:10px;background-size:40px auto;}

	/* portfolioBx_wrap swiper */
	.portfolioBx_wrap .swiperStyle1 .swiper-slide{max-width:264px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide{height:162px;padding:18px 18px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide dl dt .silde_label{width:64px;height:30px;font-size:12px;line-height:28px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide dl dd h4{margin:17px 0 0;font-size:22px;line-height:34px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide dl dd p{margin:0;font-size:14px;line-height:20px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide .com_img img{width:54px;height:54px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide .slide_btn{right:18px;bottom:18px;width:32px;height:32px;border-radius:8px;background-size:12px auto;}
	.portfolioBx_wrap .swiperStyle1 .swiper-button{max-width:122px;height:48px;}
	.portfolioBx_wrap .swiperStyle1 .swiper-button-prev, .portfolioBx_wrap .swiperStyle1 .swiper-button-next{width:48px;height:48px;border-radius:12px;}
	.portfolioBx_wrap .swiperStyle1 .swiper-button-next::after{width:48px;height:48px;background-position:-48px;}
	.portfolioBx_wrap .swiperStyle1 .swiper-button-prev::after{width:48px;height:48px;background-position:0;}
	.newswrap .more a{padding:15px 40px 15px 15px;}
	.newswrap .more a::after{top:14px}
}
@media screen and (min-width: 708px) and (max-width: 1022px) {
    .portfolioBx_wrap .portfolioBx:hover .box {right: 20px;}
	.viseon_top_visual{padding-top:74px;}
	.viseon_top_visual .line{display: block;}
	.p_br{display: inline-block !important;}
}
@media screen and (min-width: 767px) and (max-width: 813px) {
	.footer .foot_top {
        flex-flow: column wrap;
        align-items: flex-start;
        row-gap: 30px;
        column-gap: 0;
    }
}
@media screen and (min-width: 768px) and (max-width: 880px) {
	.viseon_area .img{width:37%;height:247px}
	.viseon_area .img img{height:247px}
	.viseon_area .txt_area{margin-left:80px;padding-top: 40px;width:40%}
	.intro_area .txt_left{font-size: 88px;}
	.intro_area .txt_right{font-size: 16px;}
	.viseon_top_txt{font-size: 34px;}
	.viseon_area .txt_area dd{font-size:18px;}
}
@media only screen and (max-width:1087px) {
	.con_txt_wrap .list2 .tit{font-size: 18px;}
	.con_txt_wrap .list2 .txt {font-size: 15px;}
	.con_txt_wrap .list2 li { height: 184px   !important;padding: 25px 20px 0 20px;}
	.con_txt_wrap .list2.gap1 li { height: 210px  !important}
}
@media only screen and (max-width:960px){
	.history_area{padding: 0 57px;margin-top:80px;}
	.history_area .timeline{display: block;}
	.history_area .timeline .timeline_left{text-align:left;}
	.history_area .timeline .timeline_right{margin-top:0}
	.history_area .timeline .timeline_txt p.point1,
	.history_area .timeline .timeline_txt p.point,
	.history_area .timeline .timeline_txt p,
	.history_area .timeline .timeline_txt{padding-left:0}
	.history_area .timeline .timeline_left{padding-left:80px}
	.history_area .timeline .timeline_right{padding-left:80px}
	.history_area .timeline_progress{left:67px;}
	.history_area .timeline .timeline_date{font-size: 50px;font-style:normal;margin-top:-3px;display: inline-block;}
	.history_area .timeline .timeline_center{left:0;justify-content:left;position:absolute;display: block;top:0}
	.history_area .timeline .timeline_txt p.point1{font-size: 24px;margin-top: 30px;}
	.history_area .timeline .timeline_txt p.point{font-size: 23px;margin: 30px 0 20px 0; padding-left: 20px;}
	.history_area .timeline .timeline_txt p.point::before{left:0;top: 7px;width: 8px;height: 8px;}
	.history_area .timeline .timeline_txt p{font-size: 18px;line-height: 23px;}
	.newswrap .more a{font-size:16px; padding: 13px 35px 13px 10px;}
	.newswrap .more a::after{top:13px;right: 6px; width: 25px;height: 25px; background-size: 25px auto;}
	.newswrap .tit_wrap {font-size: 18px;}
	.timeline_right .imag-area { margin: 20px 0 0 0;}
	.timeline_right .imag-area img + img {margin-left: 15px;}
	.logo_com_banks {padding: 60px 0 10px;}
}
@media only screen and (max-width:953px) {
	.con_txt_wrap .list2 li{height: 200px !important}
	.con_txt_wrap .list2.gap1 li{height: 220px !important}
}
@media only screen and (max-width:920px) {
	.con_txt_wrap .list2 li{height: 200px !important}
	.con_txt_wrap .list2.gap1 li{height: 220px !important}
	.tab_wrap {padding-top:50px}
	.tab-menu button{border-color: #000; width: 50%; margin: 0;display: inline-block; text-align: center;
    background-color: #fff;color: #000 !important;font-weight: 500; height:55px;padding: 0 18px;border: 2px solid #edeff3;
	background: #edeff3;box-sizing: border-box;line-height: 25px;font-size:20px;}
	.tab-menu button.active{color: #000;font-weight: 500;border: 2px solid #000; font-weight: 700;}
	.tab-button.active::before{display: none;}
	.tab_wrap .tab-content {transition: none;}
	.business_wrap .top_area .img img{width: 300px;height: 206px;right: 3px;top: 155px;}
	#tab1 .business_wrap .top_area .img img {top: 140px;}
	#tab2 .business_wrap .top_area .img img {top: 144px;}
	.business_wrap .top_area .tx2{margin: 25px 0 0 0;}
	.con_txt_wrap .list2{display: block;}
	.con_txt_wrap .list2 li {width: 100% ;height: auto !important; padding-bottom: 23px;}
	.con_txt_wrap .list2.gap1 li {height: auto !important;}
	.con_txt_wrap .list2 li + li {margin-top:20px;}
	.con_txt_wrap .list2 .tit {font-size: 20px;}
	.con_txt_wrap .list2 .txt{font-size: 16px;padding: 0 15px;} 
}
@media only screen and (max-width:830px) {
	.business_wrap .top_area .img img {width: 250px;height: 192px;}

}
@media only screen and (max-width:866px) {
	.newswrap .more{bottom: -135px;}
	.newswrap .imag-area .img {display: flex;justify-content: space-between;width: 100%;}
	.newswrap .imag-area .img img {width: calc(50% - 5px); object-fit: cover;}
	.sect2 .sect_inner {padding: 80px 40px 130px 40px !important;}
}

/****************************************************************************************************

mobile phone
****************************************************************************************************/

@media only screen and (max-width:767px){
	.mo_br{display:none;}
	.sect_inner{padding:50px 20px 80px 20px !important;}
	.main .sect_inner{padding:40px 20px;}
	.main .sect_top {padding-top:35px;}
	.header{margin:0;}
	.header::before{height:84px;}
	.business_wrap .top_area .img img {top:165px;}
	#tab2 .business_wrap .top_area .img img { top:162px; }
	.business_wrap .top_area .list li+li {margin-top: 0;}
	.business_wrap .top_area .tx1 { margin: 14px 0 13px 0;}
	.business_wrap .top_area .tx2 {line-height: 22px;}
	.business_wrap .top_area .img img{width: 150px;height: 140px;right: 26px;}
	.sect_inner {padding: 40px 20px 80px 20px !important;}
	.business_wrap .top_area h3{font-size:22px;}
	.business_wrap .top_area .tx1{font-size:16px;}
	.business_wrap .top_area .list li{font-size:15px;}
	.business_wrap .top_area .tx2{font-size:15px;}
	.con_txt_wrap .list2 .txt{font-size: 15px; font-weight: 500;}
	.business_wrap .top_area .tx2 { border-top: 2px solid #ccc;}
	.business_wrap .top_area{margin-bottom: 0;}
	.con_txt_wrap .list2 .tit{font-weight: 700;    border-bottom: 2px solid #ccc;}

	.sect_top_inner{padding:0 20px}
	.top_txt_wrap{padding:0;}
	.top_txt_wrap .tit_h2{font-size:44px;}
	.top_txt_wrap .desc{margin-top:23px;}
	.top_txt_wrap .desc p{font-size:21px;line-height:normal;font-weight:400;letter-spacing:0;}
	.top_txt_wrap .bt_wrap{margin-top:23px;}
	.sub_title_top .vh_center{padding-top:64px;}
	.sub_title_top,.sub_title_top .vh_center{height:300px;}
	.sub_title_top .banner_tit h2{font-size:50px;}
	.sub_title_top .banner_tit h2::after{width:10px;height:10px;bottom: 28px;right: 12px;}
	.tit_sub_page_top_txt{font-size:40px;}
	.header .menu_mobile {right:0}

	/* title */
	.tit_h3{font-size:44px;letter-spacing:-1px;}
	.sub_tit{font-size:22px;font-weight:500;line-height:normal;letter-spacing:0;}
	.header .utp_logo {left:18px}

	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > span{font-size:16px;line-height:normal;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > p{font-size:48px;margin-top:7px;font-weight: 700 !important;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail{transition:transform 0.3s ease, opacity 0.3s ease, visibility 0.3s ease;margin-top: 16px; padding: 0 30px 0 0;}
	.portfolioBx:hover > .portfolioBx_inner dl,
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl{padding:66px 26px 42px !important;}
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl dt{transition:transform 0.3s ease;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail > p{font-size:20px;line-height:30px;margin-top:0;white-space:wrap;overflow:inherit;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul{flex-flow:row wrap;gap:15px 10px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li{min-height:42px;padding:0 20px;border-radius:29px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li span{display:block;font-size:16px;line-height:41px;}
	.portfolioBx_wrap .portfolioBx:hover{height:auto}
	.portfolioBx_wrap .portfolioBx .box {display:none;}
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl,
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl dt, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl dt,
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl dd, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl dd,
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{transition:none;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail, .portfolioBx_wrap .portfolioBx:hover .portfolioBx_detail{opacity:1;}

	.intro_area{height:auto;}
	.intro_area .txt_wrap {padding: 140px 50px 60px 50px;}
	.intro_area .txt_left {float:none;font-size:80px;display: block;width: 100%;text-align:center;}
	.intro_area .txt_right{font-size:18px;width:100%;float:none;margin:38px 0 0 0;text-align: center;font-weight: 500;}
	.intro_area .txt+.txt{margin-top:30px}
	.viseon_top_txt  .txt_point1 {font-weight:700;}
	.viseon_top_txt {font-size:30px;line-height: 40px;margin-bottom:40px;padding: 0 10px;font-weight: 500;text-align: left;}
	.viseon_top_visual{height:250px}
	.viseon_top_visual.mtype {padding-top:10%;margin:40px 0 50px 0;font-size: 40px;}
	.viseon_top_visual.mtype .line{display: block;}
	.p_br {display: inline !important;}
	.viseon_area{margin-top:40px}
	.viseon_area, .viseon_area.right{height: auto;text-align: center;padding: 0 55px;}
	.viseon_area.right .txt_area{text-align: center;}
	.viseon_area .img { height:220px;width:100%;display:block;text-align: center;float:none;display:none !important;}
    .viseon_area .img img { height:100%;width: 60%;border-radius:initial}
	.viseon_area .txt_area{margin-left:0;padding-top:0;width:100%;float:none;max-width: 100%;}
	.viseon_area .txt_area dt{padding-left:20px;display: inline-block;font-size: 24px;font-weight:600;}
	.viseon_area .txt_area dd{font-size:17px;}
	.viseon_area .txt_area dt::before{left:-155px;width: 121px;display:none;}
	.viseon_area .txt_area dt::after{left:0;width:10px;height:10px;top:13px;border-radius: 100%;}
	.viseon_area.right.viseon_area .txt_area dt::after{left:0}
	.viseon_area+.viseon_area{margin-top:50px;}

	.location_wrap{margin-top:40px}
	.location_wrap .ad .txt1 span{font-size:25px;}
	.location_wrap .ad .txt1 span::after{top:14px}
	.location_wrap .ad .txt2{font-size:22px;}
	.location_wrap .ad .txt2 .info{font-size:17px;display: block;}

	.history_area .timeline .timeline_date{font-size:30px;margin-top:-8px}
	.history_area .timeline .timeline_txt p.point1{font-size:20px;font-weight: 700;}
	.history_area .timeline .timeline_txt p.point{font-size:20px;}
	.history_area .timeline .timeline_txt p{font-size:20px;color: #333;}
	.logo_com_banks{padding: 40px 0 0;}

	.history_area .timeline .timeline_txt p + p{margin-top:10px}

	/* footer */
	.footer_inner{padding:41px 18px 31px;}
	.footer .foot_top{flex-flow:column wrap;align-items:flex-start;row-gap:30px;column-gap:0;}
	.footer .foot_top .footer_logo a{width:107px;height:18px;background-size:107px auto;}
	.footer .foot_top .footer_menu ul{column-gap:20px;}
	.footer .foot_top .footer_menu li a span{font-size:15px;line-height:22px;}
	.footer .footer_copy{margin:22px 0 0;}
	.footer .footer_copy .cnt_info p{line-height:20px;}
	.footer .footer_copy .cnt_info p span .mo_br{display:block;}
	.footer .footer_copy .cnt_info p.copy_right{margin:22px 0 0;line-height:20px;}
	.footer .footer_isms{position:static;margin:25px 0 0;}
	.footer .footer_isms dl{column-gap:14px;}
	.footer .footer_isms dl dt img{width:29px;}
	.footer .footer_isms dl dd p{font-size:11px;line-height:16px;}

	.sect.sect1 .sect_inner{padding:48px 18px 48px !important;}
	.sect.sect2 .sect_inner{padding: 48px 18px 90px 18px !important;}
	.sect.sect3 .sect_inner{padding:48px 18px 60px !important;}
	.sect .tit_wrap strong{font-size:30px;line-height:45px;}
	.sect.sect2 .subtit_wrap .tit_h4 .m_br{display:inline-block;}
	.sect.sect3 .tit_h2{margin:0;font-size:60px;line-height:48px;}
	.tit_h4{margin:8px 0 0;padding:1px 0 6px;font-size:28px;line-height:40px;}
	.tab_wrap {padding-top: 0;}

	.portfolioBx_wrap{margin:-20px 0 0;}
	.portfolioBx_wrap .swiper{height:256px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide{width:100%;height:170px;padding:23px 21px 21px 23px;border-radius:18px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide dl dd h4{padding:0 0 2px;font-size:24px;line-height:36px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide dl dd p{margin:3px 0 0;padding:0 0 1px;line-height:21px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide .com_img{top:19px;right:19px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide .com_img img{width:60px;height:60px;}
	.portfolioBx_wrap .swiper .slide_cnt .bx_slide .slide_btn{right:20px;bottom:21px;width:34px;height:34px;}

	.sect.sect2 .vision_boxs_wrap .box_inner {display:block;}
	.tit_wrap .tit_h3 {font-size: 30px;}
	.footer .foot_top .utp_logo a{width: 97px;height: 45px;padding: 0;font-size: 10px;line-height: 25px;}
	.footer .foot_top .utp_logo a h1 span{font-size: 15px;line-height: 14px;}
	.footer .footer_copy{margin:27px 0 0;}

	.sub_tit{font-size:18px} 
	.tit_h3{font-size:28px;}
	.webcashAi_business .desc_wrap p{font-size:16px;}
	.sect_inner .sub_tit {margin-bottom: 0;}

	.portfolioBx_wrap .portfolioBx {margin-bottom:10px}
	.portfolioBx_wrap .portfolioBx.box4 {margin-bottom:0px}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > span{font-size:14px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > p{font-size:26px;font-weight: 500;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail > p{font-size:16px;border-top: 0;padding-top:0;line-height: 22px;font-weight: 500;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li{min-height:40px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail ul li span{font-size:14px;}
	.newswrap {margin: 40px 0 40px 0}
	.newswrap .more{bottom: -170px;}
	.newswrap .tit_wrap {font-size: 16px;}
	.newswrap .imag-area img + img{ margin-left:10px}
}
@media only screen and (max-width:630px){
	.footer .cnt_info p{display: block;}
	.footer .cnt_info p span::after {display: none;}
	.footer .cnt_info p + p{margin-left:0}
}
@media only screen and (max-width:600px){
	.viseon_area{padding:0 20px;}
	.viseon_area.right{padding:0 20px;}
	.history_area{padding: 0 20px 0 65px;}
	.history_area .timeline_progress{left:72px}
	.history_area .timeline .timeline_date{font-size:27px;margin-top:-9px}
	.history_area .timeline .timeline_txt p.point1{font-size:18px;margin-top:20px;}
	.history_area .timeline .timeline_txt p.point{font-size:17px;margin: 20px 0 10px 0;}
	.history_area .timeline .timeline_txt p{font-size:16px}
	.history_area .timeline .timeline_txt p.point::before{left: 0; top: 8px;width: 7px; height: 7px;}
	.history_area .timeline .timeline_txt p.point{padding-left: 14px;}        
	.history_area .timeline .time_circle{width: 15px; height: 15px; background-size: 15px;}
	.history_area .timeline .timeline_left {padding-left: 53px;}
	.history_area .timeline .timeline_right {padding-left: 53px;}
	.tab-menu button{font-size:18px; line-height: 26px;}
	.con_txt_wrap .tx2{font-size:35px}
	.business_wrap .top_area h3 {font-size: 20px;font-weight:700;}
	.con_txt_wrap .list2 .tit {font-size: 19px;}
	.business_wrap .top_area .img img { width: 140px; height: 130px;}
}
@media only screen and (max-width:540px){
	.business_wrap .top_area .img{display: none;}
	.business_wrap .top_area {padding: 40px 20px;}
	.business_wrap .top_area .tx1,
	.business_wrap .list {padding:0 15px}
	.business_wrap .top_area .tx2{padding:20px 15px 0 15px}
	.tit_wrap {text-align: center;}
	.sub_title_top .banner_tit h2 {font-size: 46px;}
	.newswrap .tit_wrap {text-align:left}
}
@media only screen and (max-width:494px){
		.tab-menu button {height:70px}
}
@media only screen and (max-width:470px){
	.sub_title_top, .sub_title_top .vh_center{height:260px}
	.viseon_area{padding:0 10px;}
	.viseon_area.right{padding:0 10px;}
	.top_txt_wrap .tit_h2 {font-size: 39px;}
	.top_txt_wrap .tit_h2 .txt_motion{height:65px;padding: 0 2px 13px; margin-bottom: 22px;}
	.sub_title_top .banner_tit h2 { font-size: 40px;}
	.portfolioBx_wrap .portfolioBx{height:140px !important}
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl{padding: 26px 0 20px 15px !important;}
	.portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{height:212px;padding: 26px 0 20px 15px !important;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > p{font-size: 20px;font-weight: 500;}
	.history_area {padding: 0 20px 0 45px;}
	.history_area .timeline_progress{left:52px}
	.history_area {padding: 0 0 0 20px;}
	.history_area .timeline_progress{left:27px}
	.history_area .timeline .timeline_left{padding-left:40px;}
	.history_area .timeline .timeline_right{padding-left:40px;}
	.logo_com_banks{padding: 40px 0 0;}
	.logo_com_banks > .line{padding: 12px 2px 12px 2px;}
}
@media only screen and (max-width:450px){
	.tab-menu button {font-size: 17px;}
}
@media only screen and (max-width:430px){
	.top_txt_wrap .tit_h2 {font-size: 36px;}
	.top_txt_wrap .tit_h2 .txt_motion{height:63px;padding: 0 2px 13px; margin-bottom: 20px;}
	.top_txt_wrap .desc p {font-size: 20px;}
}
@media only screen and (max-width:395px){
	    .newswrap .more {
        bottom: -190px;
    }
}
@media only screen and (max-width:360px){
	.sub_title_top, .sub_title_top .vh_center {height: 240px;}
	.sub_title_top .banner_tit h2 {font-size: 36px;}

	.top_txt_wrap .tit_h2 {font-size: 32px;}
	.top_txt_wrap .tit_h2 .txt_motion{height:63px;padding: 0 2px 13px; margin-bottom: 18px;}
	.top_txt_wrap .desc p {font-size: 20px;}
	.top_txt_wrap .tit_h2 {font-size: 34px;}
	.top_txt_wrap .tit_h2 .txt_motion{height:55px}
	.tit_h3{white-space:normal;}
	.top_txt_wrap .tit_h2 .txt_motion{margin-bottom:20px}
	.top_txt_wrap .desc p{font-size: 18px;}
	.tit_wrap .tit_h3{font-size:25px;}
	.sub_tit{font-size:15px !important;}
	.portfolioBx_wrap .portfolioBx{height:150px}
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner dl{height:100%;padding:30px 26px 42px !important}
	.portfolioBx_wrap .portfolioBx .portfolioBx_tit > p{font-size: 19px !important; font-weight: 500;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail > p{font-size: 13px;}
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl,
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl dt, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl dt,
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl dd, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl dd,
	.portfolioBx_wrap .portfolioBx > .portfolioBx_inner, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{transition:none !important;}
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{padding: 86px 26px 42px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail, .portfolioBx_wrap .portfolioBx:hover .portfolioBx_detail{opacity:1;}
	.portfolioBx_wrap .portfolioBx, .portfolioBx_wrap .portfolioBx:hover{height: 150px;}
 	.portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{padding: 30px 26px 42px !important;}
	.portfolioBx_wrap .portfolioBx.active > .portfolioBx_inner dl, .portfolioBx_wrap .portfolioBx:hover > .portfolioBx_inner dl{padding: 86px 26px 42px;}
	.portfolioBx_wrap .portfolioBx .portfolioBx_detail, .portfolioBx_wrap .portfolioBx:hover .portfolioBx_detail{opacity:1;}
	.logo_com_banks {padding: 30px 0 30px 0;}
	.logo_com_banks > .line{padding: 10px 2px 10px 2px;}
	/* .menu_top */
	.menu_top{position:fixed;top:0;right:0;bottom:0;left:0;display:none;background-color:rgba(0,0,0,0.4);z-index:4500;}
	.menu_top .menu_top_inner{left:60px;width:inherit;}
	.gnb_wrap ul.gnb > li.active .gsnb_wrap{width:auto;}
	.header .right{position:absolute;right:0;left:0;}
	.header .right > .inner{width:auto;}

	.header .irbookdownload a.bt_download{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
	.header .webcash a.bt_webcash{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
	.header .wepeople a.bt_wepeople{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
}

@media only screen and (max-width:359px){
	.sub_title_top, .sub_title_top .vh_center { height: 250px;}
	.ly_pop_privacy .ly_pop_content{height:calc(100vh - 198px);}

}

@media only screen and (max-width:337px){
	.sub_title_top .banner_tit h2 {font-size: 32px;}
	.ly_pop_privacy .ly_pop_content{height:calc(100vh - 175px);}
}
@media only screen and (max-width:329px){
	.newswrap .imag-area img + img {margin-left:18px;}
	.newswrap .more a {font-size: 13px;}
}

@keyframes bgRotate{
	100%{transform:rotate(1turn);}
}
/* Keyframes for fade in/out loop */
@keyframes fadeLoop{
	0%   {opacity:0.3;}
	25%  {opacity:1;}
	75%  {opacity:1;}
	100% {opacity:0.3;}
}


.gnb_wrap ul.gnb{column-gap:0;}
.gnb_wrap ul.gnb > li .gsnb_wrap ul > li a.gsnb_tit{font-size:18px;min-height:72px;}

/* .gsnb_sub */
.gnb_wrap ul.gnb > li .gsnb_wrap ul.gsnb_sub > li a{font-weight:500;}

.pc_br_none{display:none !important;}

/* .gsnb_sub */
.gnb_wrap ul.gnb > li .gsnb_wrap ul.gsnb_sub > li a{font-weight:400;}