@charset "utf-8";
/* CSS Document */

.doc{font-size:16px;}
.box1, .wrap{width:1400px; max-width:96%; margin: 0 auto; position: relative;}
.box0{padding:0 3em;}
.box2{width:1400px; max-width:96%; margin: 0 auto; position: relative;}

/*header*/
#header,
.h_wrap,
#header .va_wrap{height:85px;}
#header{background-color:#fff; font-size:16px; z-index: 1000; position: fixed; top: 0; left: 0; width:100%; border-bottom:1px solid rgba(255,255,255,.3);}
#header .h_wrap{max-width: 100%; width: 92%;margin: 0 auto; justify-content:center; align-items: center;}
#header .h_wrap .h_logo{z-index:10000; margin-right: 3rem;}
#header .h_wrap .gnb{display: flex; margin-right:2em; position: relative;}
#header .h_wrap .gnb .depth1 {float: none;padding: 0;margin: 0 52px;position: relative;z-index: 10;}

#header .h_wrap .gnb .depth1 > a {
	font-size: 1.2em;
	line-height: inherit;
	font-weight: 600;
	color: #111;
	position: relative;
	z-index: 11;
}

#header .h_wrap .gnb .depth1 > ul {
	background: rgba(255, 255, 255, 0.8); /* 반투명 흰색 배경 */
	min-width: 170px;
	border: 1px solid rgba(221, 221, 221, 0.8); /* 테두리도 투명 설정 */
	border-top: 0;
	margin-top: 0;
	transition: all 0.5s ease; /* 부드럽게 나타나도록 전환 효과 */
	position: absolute;
	top: calc(100% + 10px); /* 상위 메뉴 아래로 위치 */
	left: 50%;
	transform: translateX(-50%) translateY(-10px); /* 초기 상태: 위로 약간 이동 */
	height: 0; /* 기본 상태: 숨김 */
	overflow: hidden; /* 내용 숨김 */
	opacity: 0; /* 기본 상태: 투명 */
	z-index: 5; /* 하위 메뉴가 상위 메뉴 아래에 있도록 설정 */
}

#header .h_wrap .gnb:hover .depth1 > ul {
	height: 330px; /* 내용 높이에 맞게 자동 조정 */
	opacity: 1; /* 보이도록 설정 */
	transform: translateX(-50%) translateY(-3%); /* 아래로 이동하여 보이게 설정 */
	overflow: visible; /* 내용 표시 */
}

#header .h_wrap .gnb .depth1 > ul:after {
	content: "";
	position: absolute;
	left: 0;
	top: -1px;
	width: 100%;
	height: 5px;
	background: rgba(255, 255, 255, 0.2); /* 투명한 흰색 */
	transform: scaleX(0);
	transition: 0.3s;
	z-index: 5;
}

#header .h_wrap .gnb:hover .depth1 > ul:after {
	transform: scaleX(1);
}

#header .h_wrap .gnb .depth1 > ul > .depth2 a {
	display: block;
	text-align: center;
	color: #444;
	border-top: 1px dotted rgba(221, 221, 221, 0.8); /* 투명한 테두리 */
	font-weight: 400;
	font-size: 1em;
	padding: 15px 10px;
	letter-spacing: 0;
}

#header .h_wrap .gnb .depth1 > ul > .depth2 a:hover {
	background: rgba(255, 255, 255, 0.2); /* 반투명 배경 */
}

#header .h_wrap .gnb .depth1.on {
	position: relative;
	z-index: 10;
}

#header .h_wrap .gnb .depth1.on:before {
	display: block;
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	position: absolute;
	top: 25px;
	right: -14px;
	z-index: 11;
}


#header .btn_gnb{width:30px; height: 30px; position: relative; z-index: 10000;}
#header .btn_gnb .a_rd{width:10px; height: 10px; background-color: #555; border-radius: 50%;}
#header .btn_gnb .a_rd.a1{position: absolute; top: 0; left: 0; transition:.3s;}
#header .btn_gnb .a_rd.a2{position: absolute; top: 0; right: 0; background-color:#17469e; transition:.3s;}
#header .btn_gnb .a_rd.a3{position: absolute; bottom: 0; left: 0; transition:.3s; }
#header .btn_gnb .a_rd.a4{position: absolute; bottom: 0; right: 0; transition:.3s; }

#header .btn_gnb:hover .a_rd.a1,
#header .btn_gnb.a_on .a_rd.a1,
#header .btn_gnb:hover .a_rd.a4,
#header .btn_gnb.a_on .a_rd.a4{display:none;}
#header .btn_gnb:hover .a_rd.a2,
#header .btn_gnb.a_on .a_rd.a2,
#header .btn_gnb:hover .a_rd.a3,
#header .btn_gnb.a_on .a_rd.a3{width:30px; border-radius: 50px;}

.pc_all_menu .gnb_all > li.depth1{margin-bottom: 6em}

/*footer*/
#pt_footer{margin-top:1em; padding: 20px 0; background-color: #121212; font-size:14px;}
#pt_footer .f_cont_01{width:330px}
#pt_footer .f_cont_02{width:calc(100% - 330px);}

#pt_footer .f_logo{margin-right: 110px;}

#pt_footer .f_menu{margin-left: -40px;}
#pt_footer .f_menu > li{margin-left: 40px; position: relative;}
#pt_footer .f_menu > li:before{content:''; width:3px; height: 3px; border-radius: 50%; background-color: #fff; position: absolute; top: 50%; transform: translateY(-50%); left: -20px;}
#pt_footer .f_menu > li:first-child:before{display:none;}
#pt_footer .f_menu > li a{color:#fff; opacity: .8; position: relative; font-size:1em;}
#pt_footer .f_menu > li a:hover{opacity: 1;}

#pt_footer .f_info{margin-top:25px;}
#pt_footer .f_info > li{font-size: .938em; color:#fff; font-weight: 200; margin-right:60px; margin-bottom: 5px; letter-spacing:0px; opacity: .5;}
#pt_footer .f_info > li .st{font-weight:500; margin-right:10px;}
#pt_footer .f_copy{color:#fff; opacity: .3; font-size:.875em; margin-top:30px; text-transform: uppercase; font-weight: 100; letter-spacing: .5px;}



.qk_list{position:fixed; bottom:.7em; right:.7em; z-index: 100;}
.qk_list .qk_btn{ display:block; width:2em; height: 2em; line-height: 2.1em; border-radius: 50%; text-align: center; box-shadow: 0 3px 0 rgb(0 0 0 / 15%); font-size: 1.85em; margin-top: 5px;}
.qk_list .qk_btn.kakao_btn{background:#ffcf3d; color:#512929!important;}
.qk_list .qk_btn.wechat_btn{background:#3bb51c; color:#fff!important;}
.qk_list .qk_btn.whatsapp_btn{background:#fff; color:#25d366!important; border:2px solid #25d366; box-sizing: border-box; line-height: 1.9em;}
.qk_list .qk_btn.face_btn{background:#124db7; color:#fff!important;}
.qk_list .qk_btn.ins_btn{background:linear-gradient(120deg, #574dc0, #b23086, #f09336); color:#fff!important;}
.qk_list .qk_btn.yout_btn{background:#d92121; color:#fff!important;}
.qk_list .qk_btn.top_btn{background:#333; color:#fff!important;}
/*=================================================================SUB=================================================================*/


/*서브공통*/
.container_title{font-weight:700; font-size:2.5em; padding-top:45px;}
.container_title:before{width:1px; height: 2px; margin-left:0; visibility: hidden; transition: .8s; transition-timing-function: ease-in-out; transform:translateX(-50%); transform-origin: left top;}
.load .container_title:before{width:40px; visibility: visible;}
.root_daum_roughmap .wrap_controllers{display:none;}
.map_con{border-radius: 50px 0 50px 0; overflow: hidden;}

.txt_box .ti{font-size:1.875em;font-weight: 700; margin-bottom: 1em}
.txt_box .tt{font-size:1.25em;color:#333; line-height: 1.6}
.txt_box .tt span{font-weight: 700}


#sub_visual{height:340px; margin-top:80px; position: relative;}
#sub_visual .sub_v_line{ position: absolute; top: 1.7em; left:1.7em; width:calc(100% - 3.4em); height: calc(100% - 3.4em); opacity: .6;}
#sub_visual .line_01{background-color: #fff; width:0%; height: 1px; position: absolute; top: 0; left:0; transition: .8s;}
#sub_visual .line_02{background-color: #fff; width:1px; height:0%; position: absolute; top: 0; right:0; transition: .8s; transition-delay: .8s;}
#sub_visual .line_03{background-color: #fff; width:0%; height: 1px; position: absolute; bottom: 0; right:0; transition: .8s;}
#sub_visual .line_04{background-color: #fff; width:1px; height:0%; position: absolute; bottom: 0; left:0; transition: .8s; transition-delay: .8s;}

.load #sub_visual .line_01{width:100%;}
.load #sub_visual .line_02{height:100%;}
.load #sub_visual .line_03{width:100%;}
.load #sub_visual .line_04{height:100%;}

#sub_visual h2{padding:0; font-weight: 700; font-size: 3.5em;}
#sub_visual h2:after{display:none;}

.sub .tab_idx{ margin:-10px 0 3em -10px;}
.sub .tab_idx > li{flex:1 16.66%;}
.sub .tab_idx.st_w2 > li{flex:1 25%;}
.sub .tab_idx > li > a{ padding:0 .5em; height:4em; border:1px solid #ddd; margin:10px 0 0 10px; color:#666; transition:.3s; border-radius: 10px;}
.sub .tab_idx > li > a .va{font-size:1.125em; font-weight:500}
.sub .tab_idx > li > a:hover{border-color:#2fae3b; color:#177c3b;}
.sub .tab_idx > li.on > a{ background-color:#2fae3b; border-color:#2fae3b; color:#fff;}

/*게시판 스킨 수정*/
#bo_list_total{font-size:17px;}
#bo_list_total .total_icon{border: 1px solid #ddd; border-radius: 50%;  width: 2em; line-height:2em !important; height: 2em; text-align: center; font-size: 1.25em; margin-right: 7px; box-shadow: 1px 1px 4px rgb(0 0 0 / 15%);}
#bo_list_total .c_point{font-weight: 500;}

#sub_visual.sub10{background-image:url("../img/sub/sub01_top.jpg");}
#sub_visual.sub20{background-image:url("../img/sub/sub02_top.jpg");}
#sub_visual.sub30{background-image:url("../img/sub/sub03_top.jpg");}
#sub_visual.sub40{background-image:url("../img/sub/sub04_top.jpg");}
#sub_visual.sub50{background-image:url("../img/sub/sub05_top.jpg");}
#sub_visual.sub60{background-image:url("../img/sub/sub06_top.jpg");}

/* 게시판 css */
.bo_txt{font-size: 1.125em;padding:2em; background:#f2f2f2; margin-bottom: 4em}
.bo_txt_ti{font-size: 1.25em;font-weight: 700;}


/*비밀번호*/
.mbskin.pw_st{max-width: 96%; width:380px; margin:30px auto 0;}
.mbskin.pw_st .mbskin_tt{font-size:1.825em; font-weight: 600; margin-bottom: 30px; color:#555;}
.mbskin.pw_st .mbskin_in{}
.mbskin.pw_st .mbskin_in fieldset{padding:0!important;}
.mbskin.pw_st .mbskin_in .input_st{font-size:1.125em;}
.mbskin.pw_st .mbskin_in .in{position:relative;}
.mbskin.pw_st .mbskin_in .in .input_st{padding:1em 1em 1em 3.5em !important;}
.mbskin.pw_st .mbskin_in .in .xi{position: absolute;left: 0; top: 50%; width: 3em; line-height: 3em; margin-top: -1.5em; text-align: center; color: #666; font-size:1.375em;}

/*개인정보처리방침*/
.agree_box{ border:1px solid #ddd; background:#f9f9f9; border-radius:5px; font-size:.95em;}
.agree_box .in_con{  padding:2em; border:1px solid #ededed; margin:1em; background:#fff;}
.agree_box .in_con .agree_wrap{color:#333;}
.agree_box .in_con .agree_wrap span{ display: block;}

/*inc*/
.page_tt{font-size:1.75em; margin-bottom: 15px; color:#111;}
.page_stt{font-size:1.45em;}
.page_tx{font-size:1.068em; line-height: 1.7; color:#333;}
.dot_list > li{position:relative; padding-left: 15px; margin-bottom: 10px;}
.dot_list > li:last-child{margin-bottom: 0px;}
.dot_list > li:before{content:''; width:4px; height: 4px; background-color: #17469e; border-radius: 50%; position:absolute; top: 11px; left: 0;}
.bg_box{padding:80px 0; background-color: #f9f9f9; margin-top:80px;}

/*인사말*/
.int_content{margin-top: 6em}
.int_content .cont{margin-bottom: 10em}
.int_content .cont .int_gr{width: 50%;}
.int_content .cont .img_box{border-radius: 25px; overflow: hidden; }
.int_content .cont .img_box01{margin-left: 6em;}
.int_content .cont .img_box02{margin-right: 6em;}
.int_content .cont .img_box02 .int_img{height: 900px;}
.int_content .cont .int_img{width: 100%; height: 700px;transition: .3s}
.int_content .cont .int_img:hover{transform: scale(1.1,1.1)}

/* 경영이념 및 비전 */
.vision_content .cont .txt_box{margin-bottom:2em; text-align: center}
.vision_content .cont .txt_box .ti{margin-bottom:0em}
.vision_content .cont .item_list{ margin: auto; text-align: center}
.vision_content .cont .item_list > li{width:33.33%}
.vision_content .cont .item_list > li .in{margin:20px; }
.vision_content .cont .item_list > li .in .img_box{width: 100%;height: 250px; transition: .3s; margin-bottom: 20px;border-radius: 25px;overflow: hidden;}
.vision_content .cont .item_list > li .in .img_box .img_it{transition: .3s; height: 250px}
.vision_content .cont .item_list > li .in .img_box:hover .img_it{transform: scale(1.1,1.1)}
.vision_content .cont .item_list > li .in .ti{font-size:1.5em;color:#333; line-height: 1.6; font-weight: 700}
.vision_content .cont .item_list > li .in .tt{font-size:1.25em;color:#333; line-height: 1.6;}

/*연혁*/
.history_wrap{ position:relative; overflow:hidden; padding:2em 0}
.history_wrap:before,
.history_wrap .lineAni{ content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#ddd}
.history_wrap .lineAni{ height:0; background:#3690df; transition:.3s}
.history_wrap .lineAni:before,
.history_wrap:after{ content:""; position:absolute; left:50%; top:0; margin-left:-.5em; width:1em; height:1em; background:#fff; border:.25em solid #3690df; border-radius:100%; box-sizing:border-box}
.history_wrap:after{ top:auto; bottom:0}
.history_wrap .history > li{ margin-top:2em}
.history_wrap .history > li:first-child{ margin-top:0}
.history_wrap .history > li .year_tt{ margin-bottom: .5em;}
.history_wrap .history > li .year_tt .wrap_in{ position:relative; overflow:hidden;}
.history_wrap .history > li .year_tt .tt{ display:inline-block; position:relative; padding:0 .5em; font-size:3em; font-weight:700; letter-spacing:-3px; color:#17469e; }
.history_wrap .history > li .year_tt .tt:before{ content:""; position:absolute; right:100%; top:50%; margin-top:3px; width:100%; border-top:2px dotted #aaa}
.history_wrap .history > li .year_tt .tt:after{ content:"'"; font-weight:400; font-style:italic}    
.history_wrap .history > li .list{ width:50%; margin-top:1em}
.history_wrap .history > li .list > li{ margin-top:.5em}
.history_wrap .history > li .list > li:first-child{ margin-top:0}
.history_wrap .history > li .list .wrap_in{ padding:0 2em}
.history_wrap .history > li .list .wrap_in .detail > li .tt:after{ display: block; clear: both; content: '';}
.history_wrap .history > li .list .ynm{ color: #999; font-weight: 600; font-size: 1.125em; margin-right: 13px; float: left;}
.history_wrap .history > li .list .tx{float: left; width: calc(100% - 70px);}
.history_wrap .history > li .list .detail{ width: 100%;}
.history_wrap .history > li .list .detail > li{ margin-top:.5em}
.history_wrap .history > li .list .detail > li:first-child{ margin-top:0}
.history_wrap .history > li .list .detail .tt{ position:relative; padding:0 1.5em; margin-top:.125em; color:#333; font-size: 1.068em;}
.history_wrap .history > li .list .detail .tt:before{ content:""; position:absolute; left:0; top:.7em; width:.75em; border-top:2px solid #ddd}
.history_wrap .history > li:nth-child(2n) .year_tt{ justify-content:flex-end; text-align:right}
.history_wrap .history > li:nth-child(2n) .year_tt .tt:before{ right:auto; left:100%}
.history_wrap .history > li:nth-child(2n) .list{ order:-1}
.history_wrap .history > li:nth-child(2n) .list > li > .flex{ justify-content:flex-end}
.history_wrap .history > li:nth-child(2n) .list .detail{ order:-1}
.history_wrap .history > li:nth-child(2n) .list .detail .tt{ text-align:right}
.history_wrap .history > li:nth-child(2n) .list .detail .tt:before{ left:auto; right:0}
.history_wrap .history > li:nth-child(2n) .list .ynm{ float: right; margin-left: 13px; margin-right: 0;}
.history_wrap .history > li:nth-child(2n) .list .tx{ float: right;}


/*오시는 길*/
.location_box{ margin: 0 auto; padding: 0 1em;}
.location_box .map_tw{padding-bottom:1em; font-size:1.5em;}
.location_box .map_tw .xi{ width: 44px; height: 44px; background: #17469e; border-radius: 50%; line-height: 44px; margin-right: 10px; font-size:.938em; color:#fff;}
.location_box .map_view{ border-top:3px solid #17469e; box-shadow: 0 0.25em 0.5em rgba(0,0,0,.2); transition: .3s;  padding: 1em; border-radius: 0 0 1em 1em;}
.location_box .map_view .tt {padding-bottom:10px; font-size:1.125em; color:#333; letter-spacing:-2px; vertical-align:middle;}
.location_box .map_view .xi {vertical-align:middle; font-size:1.125em; padding-right:5px;}
.location_box .map_view .map_cont .root_daum_roughmap .wrap_controllers{display:none;}
.location_box .info_list{margin-top:1em;}
.location_box .info_list > li { padding:2.5em 0; border-bottom:1px dotted #ddd;}
.location_box .info_list > li h3 { float:left; font-size:1.375em; font-weight:500; position: relative; padding-top:7px;}
.location_box .info_list > li h3:before{content:''; width:25px; height: 2px; background: #17469e; position: absolute; top:0; left: 0;}
.location_box .info_list > li h3 .xi { font-size:1.125em; margin-right: 5px;}
.location_box .info_list > li .info { margin:0 0 0 240px;}
.location_box .info_list > li .info .in_tbox{border: 1px solid #ddd; padding: 1.5em; background-color: #f9f9f9; color:#333; border-radius: 15px;}
.location_box .info_list > li .info .in_tbox .fwB{margin-right:8px;}


/* ESG 경영방침 */
.esg_content{position: relative;}
.esg_content .cont{}
.esg_content .cont .img_box{height: 400px; overflow: hidden}
.esg_content .cont .img_box .img_it{height: 400px}
.esg_content .cont .item_box{background: #fff;margin-top:-10em; border-radius: 25px; padding: 20px;}
.esg_content .cont .item_box .esg_list{margin-right: -2em}
.esg_content .cont .item_box .esg_list > li{width: 33.33%}
.esg_content .cont .item_box .esg_list li:last-child .in{border: 0}
.esg_content .cont .item_box .esg_list .in{margin-right: 2em;border-right: 1px dashed #ddd; padding: 50px 30px;margin-top: 10px;min-height: 350px;transition: .3s}
.esg_content .cont .item_box .esg_list .in .xi{font-size: 3em; color: #17469e; margin-bottom: 20px;}
.esg_content .cont .item_box .esg_list .in .txt_box .ti{font-size:1.5em;}
.esg_content .cont .item_box .esg_list .in .txt_box .ti span{font-size:0.75em;font-weight:400;color:#222;}
.esg_content .cont .item_box .esg_list .in .txt_box .tt{font-size:1.125em; color:#333; position: relative;margin-left: 15px;}
.esg_content .cont .item_box .esg_list .in .txt_box .tt::after{display: block; content: ''; width: 10px; height: 1px;background:#bbb; position: absolute;top: 15px; left: -15px;}


/*=================================================================MAIN=================================================================*/


/*메인 비주얼*/
.mainSlider{position:relative}
.mainSlider .swiper-container{width:calc(100% - 90px); border-radius:25px;height:calc(100vh - 110px); margin-top:85px;}
.mainSlider .el{ height:100vh; position:relative; overflow:hidden}
/* .mainSlider .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:contain; transform:scale(1.2,1.2); transition-delay:1s} */
.mainSlider .el .bg{ position:absolute; left:0; top:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover; transform:scale(1,1); transition-delay:1s;}
.mainSlider .slogan{ position:absolute; top:40%; left:50%; transform: translate(-50%, -55%); color:#fff;}
.mainSlider .slogan .t1{ font-size:4em; display:block; transform:translateY(1em); font-weight: 800; opacity:1; margin-bottom: 5px; line-height: 1.3;}
/*.mainSlider .slogan .t1 .t1_st{ color: transparent; -webkit-text-stroke: 1px #fff;}*/
.mainSlider .slogan .t3{ font-size:1.25em; font-weight: 200; transform:translateY(1em); opacity:0; line-height: 1.5; margin-top:30px;}
/* .mainSlider .el.swiper-slide-active .bg{ transform:none; transition:5s; transition-delay:0;} */
.mainSlider .el.swiper-slide-active .slogan .t1{ opacity:1; transition: none;}
.mainSlider .el.swiper-slide-active .slogan .t3{ opacity:1; transition: none;}

.mainSlider .mainSlider-control{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; width:1600px; max-width:90%;}
.mainSlider .mainSlider-control > li{ border:1px solid #fff; opacity: .6;}
.mainSlider .mainSlider-control > li:hover{ opacity: 1; border-color: #fff;}

.mainSlider .scroll_wrap{position: absolute; bottom: 0; left:50%; transform: translateX(-50%); z-index: 10;}
.mainSlider .scroll_wrap .mainSlide_scroll{ color: #fff; text-align: center; font-weight: 100; letter-spacing: 2px; font-size:.938em;}
.mainSlider .scroll_wrap .mainSlide_scroll_bar{ width: 2px; height: 45px; background: rgba(255, 255, 255, 0.4); overflow: hidden; margin: 8px auto 0;}
.mainSlider .scroll_wrap .scroll_bar {width: 100%; height: 25px; background: #fff; opacity: .5; animation: box-ani 2s linear infinite backwards;}

@keyframes box-ani { 
0% { transform: translate(0, -100%);} 
100% {transform: translate(0, 300%);}
}


/*main_inc*/
.main_tit{ margin-bottom: 35px;}
.main_tit .in_tt{ font-size:3.875em; color:#222; font-weight: 800; line-height: 1;}
.main_tit .in_tt:after{content:'.'; font-size:1.125em; color:#17469e;}
.main_tit .in_tx{color:#fff; font-size:1.125em; margin-top:30px; line-height: 1.8;}
.main_tit .in_more{margin-top:60px; display: block; transition: .4s;}
.main_tit .in_more:hover{padding-left:30px;}

.arr_st .in-btn{width:75px; height: 75px; line-height: 75px; border-radius: 50%; border:1px solid #ddd; text-align: center; cursor: pointer; }
.arr_st .in-btn:hover{border-color:#17469e;}
.arr_st .in-btn img{vertical-align:-3px;}
.arr_st .in-btn .st1{}
.arr_st .in-btn .st2{display:none;}
.arr_st .in-btn:hover .st1{display:none;}
.arr_st .in-btn:hover .st2{display:inline-block;}
.arr_st .in-pagen{width:100%; height: 4px; position: relative; background: #ddd;}
.arr_st .in-pagen .swiper-pagination-progressbar-fill{background-color:#17469e;}

.arr_st.arr_co{position: relative}
.arr_st.arr_co .pr_n{display: none}
.arr_st.arr_co .in-prev:hover .pr_n{display: inline-block}
.arr_st.arr_co .in-prev:hover .pr_g{display: none}
.arr_st.arr_co .in-next:hover .pr_n{display: inline-block}
.arr_st.arr_co .in-next:hover .pr_g{display: none}
.arr_st.arr_co .line{width:1px; height: 20px; background: #ddd; margin: 0 20px;}
.arr_st.arr_co .in-btn{border: 0; width: auto;}


.main_abo{padding:150px 0 100px;}
.main_abo .about_list .in_itembox{width:calc(100% - 90px);margin: 0 auto; border-radius:25px;height:600px; overflow: hidden; position: relative}

.main_abo .about_list .in{width: 100%; height: 600px;border-radius: 25px; overflow: hidden;}
/*.main_abo .about_list .in .box1{max-width: 100%;}*/
.main_abo .about_list .in a{width:100%; height: 100%}
.main_abo .about_list .in .text_box{color: #fff}
.main_abo .about_list .in .text_box .t_num{font-size: 48px; font-weight: 800; position: relative}
.main_abo .about_list .in .text_box .t_num:before{display: block; content: ''; width: 56px; height: 2px; background: #fff; position: absolute; bottom: 0; left: 0}
.main_abo .about_list .in .text_box .t_ti{font-size: 46px; margin: 20px 0 30px;font-weight: 800}
.main_abo .about_list .in .text_box .t_tt{font-size: 18px; margin-bottom: 3em; line-height: 1.8; font-weight: 200; letter-spacing: 0.1px;}
.main_abo .about_list .in .ab_btn{width: 75px;height: 75px;line-height: 75px;border-radius: 50%;border: 1px solid #ddd;text-align: center;cursor: pointer;transition: 0.3s}
.main_abo .about_list .in:hover .ab_btn{background: #fff;}
.main_abo .about_list .in .ab_btn img{vertical-align:-3px}
.in.in_item{position: absolute; top:600px; left: 0}
.main_abo .about_list .in .ab_btn .arr_w{display: inline-block}
.main_abo .about_list .in .ab_btn .arr_n{display: none}
.main_abo .about_list .in:hover .ab_btn .arr_w{display: none}
.main_abo .about_list .in:hover .ab_btn .arr_n{display: inline-block}


.main_com{padding:90px 0;}
.main_com .in_w50{width:50%;}


.main_pro{padding-top: 150px;}
.main_pro .wrap_idx{margin-top: 60px}
.main_pro .pro_bg{width:calc(100% - 90px);margin: 0 auto; border-radius:25px;height:550px; overflow: hidden}
.main_pro .text_box{color: #fff}
.main_pro .text_box .ti{font-size:2.875em; font-weight: 800}
.main_pro .ti{font-size:2.875em; font-weight: 800;color: #fff; position: absolute; top: -2.6em;}
.main_pro .tab_idx{width: 800px;margin-top: 1.5em; margin-bottom: 1.5em;}
.main_pro .tab_idx .tab-btn{font-size: 1.125em;}
.main_pro .tab_idx .tab-btn.on{font-weight: 700; position: relative}
.main_pro .tab_idx .tab-btn a .va{color: #fff}
.main_pro .tab_idx .tab-btn.on:before{display: block; content: ''; width: 100%; height: 2px; background: #fff; position: absolute; bottom: -10px; left: 0;}

.main_pro .idx{margin-top: 50px;}
.main_pro .idx .in{height: 235px; border: 1px solid rgba(255,255,255,.7);border-radius: 15px;transition: 0.3s}
.main_pro .idx .in:hover{background: #17469e; border-color: #17469e}
.main_pro .idx .in a{display: block;width: 100%; height: 100%;padding: 50px 35px;color: #fff;}
.main_pro .idx .in .pr_ti{font-size:1.187em;font-weight:200;}
.main_pro .idx .in .xi{font-size:2.06em; }
.main_pro .pro_control{margin: 20px 0;}
.main_pro .pro_list > li{width: 20%}
.main_pro .pro_list .in{margin-right:30px;}


.main_not{padding:110px 0 0;}
.main_not .cus_slide{width:calc(100% - 90px); margin: 0 auto}
.main_not .cus_slide .in{border-radius: 25px; height: 440px;}
.main_not .cus_slide .cus_pagen{margin-top: 67px;}
.main_not .cus_slide .in .in_tt{font-size:1.25em;padding: 25px 0 15px}
.main_not .cus_slide .new_icon_st{font-size:1em; font-weight: 500; color: #17469e }


.con_idx > .idx{position: absolute;left: 0;top: 0;width: 100%;visibility: hidden;opacity: 0;}
.con_idx > .idx.on{position: relative; visibility: visible; opacity: 1}