/*	
µ¥½ºÅ©Å¾CSS
// ¼¼·Î¸ðµå ¸ð¹ÙÀÏ µð¹ÙÀ̽º (°¡·Î Çػ󵵰¡ 576px º¸´Ù ÀÛÀº È­¸é¿¡ Àû¿ë)
@media (max-width: 575px) { ... }

// °¡·Î¸ðµå ¸ð¹ÙÀÏ µð¹ÙÀ̽º (°¡·Î Çػ󵵰¡ 768px º¸´Ù ÀÛÀº È­¸é¿¡ Àû¿ë)
@media (max-width: 767px) { ... }

// ÅÂºí¸´ µð¹ÙÀ̽º (°¡·Î Çػ󵵰¡ 992px º¸´Ù ÀÛÀº È­¸é¿¡ Àû¿ë)
@media (max-width: 991px) { ... }

// Å×½ºÅ©Å¾ (°¡·Î Çػ󵵰¡ 1200px º¸´Ù ÀÛÀº È­¸é¿¡ Àû¿ë)
@media (max-width: 1199px) { ... }
*/
	
:root {
	--primary-color: #2eca8b;
	--primary-light: #fcf1e7;
	--secondary-color: #ee2c3c;
	--font-color: #696687;
	--bg-color: #fff;
	--heading-color: #333;
	--border-radius: 6px;
	--border-radius-full: 15px;
	--border-color: transparent;
	--border-color-light: #ddd;
	--iframe-filter: grayscale(0%);
	--bg-grey: #f4f4f4;
	--bg-lightgrey: #f8f9fa;
	--btn-bg: #e2e8f0;
}


html{ overflow-y:scroll; width:100%; height:100%;}
body{  -webkit-text-size-adjust:none;}
body ::selection { color:#FFF; background-color:#005ab2; text-shadow:none;}
body ::-moz-selection { color:#FFF; background-color:#005ab2; text-shadow:none;}

.scroll_top{ position:fixed; z-index:150; right:0; bottom:-100px; width:100px; height:100px; background:rgba(0,0,0,0.5); opacity:0; transition:all .5s; cursor:pointer;}
	.scroll_top i{ display:block; text-align:center; line-height:100px; font-size:30px; color:#FFF;}
	.scroll_top.on{ bottom:0; opacity:1;}
@media(max-width:1200px){
	.scroll_top{ width:80px; height:80px;}
	.scroll_top i{ line-height:80px; font-size:25px;}
}
@media(max-width:767px){
	.scroll_top{ width:60px; height:60px;}
	.scroll_top i{ line-height:60px; font-size:20px;}
}


header{ position:absolute; z-index:100; top:0; right:0; left:0; padding:0 100px 0 80px; height:100px;}
	header .logo{ display:block; float:left; margin:30px 0 0 0;}
	header .logo img{ display:block;}
	header .menu{ float:right; margin:20px 0 0 0;}
	header .menu > li{ position:relative; float:left; margin:0 0 0 50px;}
	header .menu > li:first-child{ margin:0;}
	header .menu > li > a{ display:block; position:relative; z-index:10; line-height:60px; font-size:18px; color:#FFF; transition:all .5s; cursor:pointer;}
	header .menu > li span{ display:none; position:absolute; bottom:0; left:10%; margin:0 0 0 -5px; width:100%; height:3px; background:#ffbe30;}
	header .menu > li:hover > a{ opacity:0.5;}
	header .menu > li.on > a{ opacity:1; color:#ffbe30;}
	header .menu > li.on > a span{ display:block;}
	header .menu > li ul{ display:none; position:absolute; top:60px; left:0; padding:5px 0; width:300px;}
	header .menu > li ul li{}
	header .menu > li ul li a{ display:block; line-height:30px; font-size:16px; color:#FFF;}
	header .menu > li ul li a:hover{ opacity:0.5;}
	header .menu > li ul li.on a{ opacity:1; color:#ffbe30;}
	header .menu > li:hover ul{ display:block;}
@media(max-width:1200px){
	header{ padding:0 130px 0 50px; height:80px;}
	header .logo{ margin:22.5px 0 0 0;}
	header .logo img{ width:auto; height:35px;}
	header .menu{ margin:15px 0 0 0;}
	header .menu li{ margin:0 0 0 40px;}
	header .menu li a{ line-height:50px; font-size:16px;}
	header .menu li a span{ margin:0 0 0 -3px; width:6px; height:6px;}
}
@media(max-width:1000px){
	header .menu{ display:none;}
}
@media(max-width:767px){
	header{ padding:0 60px 0 15px; height:60px;}
	header .logo{ margin:15px 0 0 0;}
	header .logo img{ height:30px;}
}


.gnb_btn_close{ display:none; position:fixed; z-index:310; top:0; right:0; width:100px; height:100px; cursor:pointer;}
	.gnb_btn{ display:none; position:fixed; z-index:300; top:0; right:0; width:100px; height:100px; background:#ffbe30; transition:all .5s !important; cursor:pointer;}
	.gnb_btn #nav-icon1{ margin:41px auto;}
	.gnb_btn #nav-icon1 span{ background:#000;}
	.gnb_btn #nav-icon1.open span{ background:#FFF !important;}
	.gnb_btn.open{ background:#ee2c3c;}
@media(max-width:1200px){
	.gnb_btn_close{ width:80px; height:80px;}
	.gnb_btn{ display:none; width:80px; height:80px;}
	.gnb_btn #nav-icon1{ margin:31px auto;}
}
@media(max-width:767px){
	.gnb_btn_close{ width:60px; height:60px;}
	.gnb_btn{ display:block; width:60px; height:60px;}
	.gnb_btn #nav-icon1{ margin:21px auto;}
}


.gnb{ position:fixed; z-index:200; top:0; right:-100%; left:100%; bottom:0; background:#153a7d; opacity:0; transition:opacity 1s;}
	.gnb .logo{ display:inline-block; margin:50px 0 0 50%; padding:0 0 0 10px; opacity:0;}
	.gnb .logo img{ display:block;}
	.gnb .menu{ margin:50px 0 0 50%;}
	.gnb .menu li{ margin:0;}
	.gnb .menu li:first-child{ margin:0;}
	.gnb .menu li > a{ display:inline-block; position:relative; line-height:60px; font-size:30px; font-weight:800; color:#FFF; cursor:pointer;}
	.gnb .menu li > a span{ display:none; position:absolute; top:50%; left:-20px; margin:-5px 0 0 0; width:10px; height:10px; background:#ffbe30;}
	.gnb .menu li > a:hover{ opacity:0.5;}
	.gnb .menu li.on > a{ opacity:1; color:#ffbe30;}
	.gnb .menu li.on > a span{ display:block;}
	.gnb .menu li:nth-child(1){ padding:0 0 0 30px; opacity:0;}
	.gnb .menu li:nth-child(2){ padding:0 0 0 50px; opacity:0;}
	.gnb .menu li:nth-child(3){ padding:0 0 0 70px; opacity:0;}
	.gnb .menu li:nth-child(4){ padding:0 0 0 90px; opacity:0;}
	.gnb .menu li:nth-child(5){ padding:0 0 0 110px; opacity:0;}
	.gnb .menu li:nth-child(6){ padding:0 0 0 130px; opacity:0;}
	
	.gnb .menu > li ul{ display:none; padding:5px 0;}
	.gnb .menu > li ul li{}
	.gnb .menu > li ul li a{ display:block; line-height:25px; font-size:15px; color:#FFF;}
	.gnb .menu > li ul li a:hover{ opacity:0.5;}
	.gnb .menu > li ul li.on a{ opacity:1; color:#ffbe30;}
	.gnb .menu > li:hover ul{ display:block;}
	.gnb .menu > li:nth-child(3).on ul{ display:block;}
	
	.gnb .tel{ margin:50px 0 0 50%; padding:0 0 0 150px; line-height:20px; font-size:18px; font-weight:800; color:#FFF; opacity:0;}
	.gnb .tel br{ display:none;}
	.gnb .txt{ margin:10px 0 0 50%; padding:0 0 0 170px; line-height:20px; font-size:15px; color:rgba(255,255,255,0.8); opacity:0;}
	.gnb .txt br{ display:none;}
	.gnb .copy{ margin:30px 0 0 50%; padding:0 0 0 190px; line-height:15px; font-size:13px; color:rgba(255,255,255,0.5); opacity:0;}
	.gnb .copy br{ display:none;}
	
	.gnb.open{ display:block; right:0; left:0; opacity:1;}
	.gnb.open .logo{ padding:0; opacity:1; transition:all .5s;}
	.gnb.open .menu li:nth-child(1){ padding:0; opacity:1; transition:all .6s;}
	.gnb.open .menu li:nth-child(2){ padding:0; opacity:1; transition:all .7s;}
	.gnb.open .menu li:nth-child(3){ padding:0; opacity:1; transition:all .8s;}
	.gnb.open .menu li:nth-child(4){ padding:0; opacity:1; transition:all .9s;}
	.gnb.open .menu li:nth-child(5){ padding:0; opacity:1; transition:all 1s;}
	.gnb.open .menu li:nth-child(6){ padding:0; opacity:1; transition:all 1.1s;}
	.gnb.open .tel{ padding:0; opacity:1; transition:all 1.2s;}
	.gnb.open .txt{ padding:0; opacity:1; transition:all 1.3s;}
	.gnb.open .copy{ padding:0; opacity:1; transition:all 1.4s;}
@media(max-width:1200px){
	.gnb .logo{ margin:50px 0 0 40%;}
	.gnb .menu{ margin:30px 0 0 40%;}
	.gnb .tel{ margin:30px 0 0 40%;}
	.gnb .txt{ margin:10px 0 0 40%;}
	.gnb .copy{ margin:30px 0 0 40%;}
}
@media(max-width:767px){
	.gnb .logo{ margin:50px 0 0 25%;}
	.gnb .logo img{ width:auto; height:30px;}
	.gnb .menu{ margin:25px 0 0 25%;}
	.gnb .menu > li > a{ line-height:45px; font-size:22px;}
	.gnb .menu > li > a span{ margin:-4px 0 0 0; width:8px; height:8px;}
	.gnb .tel{ margin:25px 0 0 25%; font-size:16px;}
	.gnb .tel br{ display:block;}
	.gnb .txt{ margin:10px 0 0 25%; line-height:20px; font-size:12px;}
	.gnb .txt br{ display:block;}
	.gnb .copy{ margin:30px 0 0 25%; line-height:15px; font-size:10px;}
	.gnb .copy br{ display:block;}
	.gnb.open{ right:-50%; left:-20%; opacity:1;}
}


footer{ position:relative; z-index:10; padding:0 80px; background:#212529;}
	footer .top{ margin:0 auto; padding:150px 0; max-width:1200px; border-bottom:1px solid rgba(0,0,0,0.1);}
	footer .top .tit{ float:left; line-height:60px; font-size:50px; font-weight:800; color:#000;}
	footer .top .btn{ float:right; width:200px; height:60px; border:1px solid rgba(0,0,0,0.7); text-align:center; line-height:60px; font-size:20px; font-weight:700; color:#000; transition:all .5s;}
	footer .top .btn:hover{ border-color:#000; background:#000; color:#FFF;}
	
	footer .bottom{ margin:0 auto; padding:80px 0 70px 0; max-width:1200px;}
	footer .bottom .logo{ display:inline-block;}
	footer .bottom .logo img{ display:block;}
	footer .bottom .tel{ margin:20px 0 0 0; line-height:20px; font-size:18px; font-weight:800; color:#fff;}
	footer .bottom .txt{ margin:10px 0 0 0; line-height:15px; font-size:15px; color:rgba(213,213,213,0.8);}
	footer .bottom .txt br{ display:none;}
	footer .bottom .copy{ margin:30px 0 0 0; line-height:15px; font-size:13px; color:rgba(200,200,200,200.5);}
	footer .bottom .btn{ position:relative; top:-150px; float:right; width:200px; height:60px; border:1px solid rgba(213,213,213,0.7); text-align:center; line-height:60px; font-size:20px; font-weight:700; color:#EEE; transition:all .5s;}
	footer .bottom .btn:hover{ border-color:#333; background:#000; color:#FFF;}
	
	footer.subf .top{ max-width:1000px;}
	footer.subf .bottom{ max-width:1000px;}
@media(max-width:1200px){
	footer{ padding:0 50px;}
}
@media(max-width:1000px){
	footer .top .tit{ float:inherit; text-align:center;}
	footer .top .btn{ float:inherit; margin:50px auto 0 auto;}
	footer .bottom{ text-align:center;}
	footer .bottom .btn{ float:inherit; margin:50px auto 0 auto;}
}
@media(max-width:767px){
	footer{ padding:0 15px;}
	footer .top{ padding:60px 0;}
	footer .top .tit{ line-height:25px; font-size:25px;}
	footer .top .btn{ margin:30px auto 0 auto; width:160px; height:50px; line-height:50px; font-size:16px;}
	footer .bottom{ padding:40px 0 80px 0;}
	footer .bottom .logo img{ width:auto; height:30px;}
	footer .bottom .tel{ font-size:15px;}
	footer .bottom .txt{ line-height:20px; font-size:14px;}
	footer .bottom .txt br{ display:block;}
	footer .bottom .copy{ margin:20px 0 0 0; font-size:10px;}
	footer .bottom .btn{ position:relative; top:0px; margin:30px auto 0 auto; width:160px; height:50px; line-height:50px; font-size:16px;}
}


.visual{ overflow:hidden; position:relative; z-index:10; margin:-300px 0 0 0; padding:0 80px; 
		background: url("../../images/sub_bg.jpg") no-repeat 0px 0px;
    	background-size: cover;
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
   	 	-o-background-size: cover;
   		-ms-background-size: cover;


}
	.visual .row{ margin:0 auto; max-width:1000px; padding:300px 0 0 0; height:600px;}
	.visual .tit{ text-align:left; line-height:50px; font-size:30px; font-weight:800; color:#FFF;}
	.visual .txt1{ margin:5px 0 0 0; text-align:left; line-height:50px; font-size:50px; font-weight:600; color:#FFF;}
	.visual .txt2{ margin:10px 0 0 0; text-align:left; line-height:20px; font-size:20px; font-style:italic;  color:#FFF;}
@media(max-width:1200px){
	.visual{ padding:0 50px;}
	.visual .row{ padding:280px 0 0 0; height:550px;}
}
@media(max-width:767px){
	.visual{ padding:0 15px; margin:0 0 0 0;}
	.visual .row{ padding:0 0 0 0; height:250px;}
	.visual .tit{ line-height:20px; font-size:30px;}
	.visual .txt1{ margin:20px 0 0 0; font-size:20px;}
	.visual .txt2{ margin:0px 0 0 0; font-size:15px;}
}

.main_company{ overflow:hidden; position:relative; z-index:10; padding:100px 80px 0px 80px;}
	.main_company .row{ margin:0 auto; max-width:1200px; min-height:500px;}
	.main_company .row_box { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
	.main_company .title{ display:inline-block; position:relative; line-height:50px; font-size:50px; font-weight:800; color:#FFF; text-transform:uppercase;}
	.main_company .title span{ position:absolute; right:-150px; bottom:8px; width:100px; height:1px; background:rgba(255,255,255,0.5);}
@media(max-width:767px)
{
	.main_company { padding:100px 15px 50px 15px;}
	.main_company .row{ margin:0 auto; max-width:1200px; min-height:650px;}
	.main_company .row_box { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }
	.main_company .title{ line-height:35px; font-size:35px;}
	.main_company .title span{ right:-100px; width:80px;}
}





.main_work{ overflow:hidden; position:relative; z-index:10; padding:100px 0px; background:#F8F9FA}
	.main_work .row{ margin:0 auto; max-width:1200px;}
	.main_work .title{ display:inline-block; position:relative; line-height:50px; font-size:46px; font-weight:800; color:#153a7d; text-transform:uppercase;}
	.main_work .title span{ position:absolute; right:-150px; bottom:8px; width:100px; height:1px; background:#005ab2;}
	.main_work .row_box { padding:50px 0 0 0; display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px;  max-width:1200px;   margin:0 auto;}
	
@media(max-width:1200px){
	.main_work{ padding:200px 50px 200px 50px;}
}
@media(max-width:767px){
	.main_work{ padding:100px 15px 100px 15px;}
	.main_work .title{ line-height:35px; font-size:35px;}
	.main_work .title span{ right:-100px; width:80px;}
}











	
.main_business{ overflow:hidden; position:relative; z-index:10; padding:200px 80px 200px 80px;}
	.main_business .row{ margin:0 auto; max-width:1200px; min-height:600px;}
	.main_business .title{ display:inline-block; position:relative; line-height:50px; font-size:50px; font-weight:800; color:#FFF; text-transform:uppercase;}
	.main_business .title span{ position:absolute; right:-150px; bottom:8px; width:100px; height:1px; background:rgba(255,255,255,0.5);}
	.main_business .list{ margin:0 0 0 33.333%;}
	.main_business .list ul{ margin:0 -25px;}
	.main_business .list ul li{ float:left; margin:100px 0 0 0; width:50%;}
	.main_business .list ul li a{ display:block; margin:0 25px;}
	.main_business .list ul li a img{ display:block;}
	.main_business .list ul li a .tit{ margin:20px 0 0 0; line-height:20px; font-size:20px; font-weight:800; color:#FFF; text-transform:uppercase;}
	.main_business .list ul li a .txt{ margin:15px 0 0 0; line-height:20px; font-size:15px; color:rgba(255,255,255,0.8);}
@media(max-width:1200px){
	.main_business{ padding:200px 50px 200px 50px;}
	.main_business .list{ margin:0 0 0 15%;}
	.main_business .list ul li a .txt br{ display:none;}
}
@media(max-width:1000px){
	.main_business .list{ margin:0;}
}
@media(max-width:767px){
	.main_business{ padding:200px 15px 200px 15px;}
	.main_business .title{ line-height:35px; font-size:35px;}
	.main_business .title span{ right:-100px; width:80px;}
	.main_business .list ul{ margin:0 -15px;}
	.main_business .list ul li{ margin:60px 0 0 0; width:100%;}
	.main_business .list ul li a{ margin:0 15px;}
	.main_business .list ul li a img{ width:auto; height:60px;}
	.main_business .list ul li a .txt br{ display:block;}
}

	


.main_work2{ overflow:hidden; position:relative; z-index:10; padding:200px 80px 200px 80px;}
	.main_work2 .row{ margin:0 auto; max-width:1200px;}
	.main_work2 .title{ display:inline-block; position:relative; line-height:50px; font-size:50px; font-weight:800; color:#005ab2; text-transform:uppercase;}
	.main_work2 .title span{ position:absolute; right:-150px; bottom:8px; width:100px; height:1px; background:#005ab2;}
	.main_work2 .list{ overflow:visible; margin:0 auto; padding:100px 0 80px 0; max-width:1200px;}
	.main_work2 .list .rolling{ margin:0 !important;}
	.main_work2 .list .rolling .slick-list{ margin:0 -800px 0 0;}
	.main_work2 .list .rolling .slide{}
	.main_work2 .list .rolling .slide a{ display:block; overflow:hidden; position:relative; margin:0 10px 0 0; cursor:pointer; transition:all .5s;}
	.main_work2 .list .rolling .slide a img{ display:block; width:495px; height:auto; transition:all .5s;}
	.main_work2 .list .rolling .slide a .tit{ margin:15px 0 0 0; line-height:20px; font-size:20px; font-weight:700; color:#005ab2; text-transform:uppercase; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; transition:all .5s;}
	.main_work2 .list .rolling .slide a .more{ position:absolute; z-index:10; top:0; right:0; bottom:0; left:0; background:#ffed8e;}
	.main_work2 .list .rolling .slide a .more i{ display:block; position:absolute; top:50%; left:50%; margin:-40px 0 0 -40px; width:80px; height:80px; text-align:center; line-height:80px; font-size:80px; color:#005ab2;}
	
	.main_work2 .list .rolling .slide:hover{ position:relative; z-index:10;}
	.main_work2 .list .rolling .slide a:hover .tit{}
	.main_work2 .list .rolling .slide a:hover img{ transform:translate(0,-10px) rotate(-1deg) scale(1.1);}
	.main_work2 .list .rolling .slide a:hover img.off{ transform:translate(0,0) rotate(0deg) scale(1);}
	
	.main_work2 .list .rolling .slick-prev{ top:inherit; left:0; bottom:-90px; margin:0; width:auto; height:auto; text-align:left;}
	.main_work2 .list .rolling .slick-prev:before{ display:none;}
	.main_work2 .list .rolling .slick-prev i{ display:block; width:50px; line-height:50px; font-size:50px; color:#005ab2;}
	.main_work2 .list .rolling .slick-next{ top:inherit; left:100px; bottom:-90px; margin:0; width:auto; height:auto; text-align:right;}
	.main_work2 .list .rolling .slick-next:before{ display:none;}
	.main_work2 .list .rolling .slick-next i{ display:block; width:50px; line-height:50px; font-size:50px; color:#005ab2;}
	
	.main_work2 .bg{ display:none; position:absolute; z-index:10; top:50px; right:50%; bottom:50px; left:0; margin:0 600px 0 0; background:#2e3754; transition:all .5s;}
	.main_work2.color .bg{ background:#ffed8e;}
@media(max-width:1200px){
	.main_work2{ padding:200px 50px 200px 50px;}
}
@media(max-width:767px){
	.main_work2 .list .rolling .slide a .tit{ max-width:250px;}
	.main_work2{ padding:200px 15px 200px 15px;}
	.main_work2 .title{ line-height:35px; font-size:35px;}
	.main_work2 .title span{ right:-100px; width:80px;}
	.main_work2 .list{ padding:60px 0 30px 0;}
	.main_work2 .list .rolling .slide a img{ width:250px; height:auto;}
	.main_work2 .list .rolling .slide a .tit{ margin:10px 0 0 0; font-size:16px;}
	
	.main_work2 .list .rolling .slick-prev{ bottom:-50px; text-align:left;}
	.main_work2 .list .rolling .slick-prev i{ font-size:30px;}
	.main_work2 .list .rolling .slick-next{ bottom:-50px; text-align:right;}
	.main_work2 .list .rolling .slick-next i{ font-size:30px;}
}
	
	
.main_news{ overflow:hidden; position:relative; z-index:10; padding:200px 80px 200px 80px;}
	.main_news .row{ margin:0 auto; max-width:1200px; min-height:600px;}
	.main_news .title{ display:inline-block; position:relative; line-height:50px; font-size:50px; font-weight:800; color:#FFF; text-transform:uppercase; transition:all .5s;}
	.main_news .title span{ position:absolute; right:-150px; bottom:8px; width:100px; height:1px; background:#FFF; transition:all .5s;}
	.main_news .list{ margin:0 0 0 33.333%; padding:100px 0 0 0;}
	.main_news .list ul{ margin:-80px -25px 0 -25px;}
	.main_news .list ul li{ float:left; margin:80px 0 0 0; width:50%;}
	.main_news .list ul li a{ display:block; position:relative; margin:0 25px; padding:0 0 0 20px;}
	.main_news .list ul li a img{ display:inline-block; margin:0 0 0 -20px;}
	.main_news .list ul li a .tit{ margin:15px 0 0 0; height:50px; line-height:25px; font-size:20px; color:#FFF; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;}
	.main_news .list ul li a .date{ margin:30px 0 0 0; line-height:15px; font-size:15px; color:rgba(255,255,255,0.5);}
@media(max-width:1200px){
	.main_news{ padding:200px 50px 200px 50px;}
	.main_news .list{ margin:0 0 0 15%;}
}
@media(max-width:767px){
	.main_news{ padding:200px 15px 200px 15px;}
	.main_news .title{ line-height:35px; font-size:35px;}
	.main_news .title span{ right:-100px; width:80px;}
	.main_news .list{ margin:0; padding:60px 0 0 0;}
	.main_news .list ul{ margin:-60px -15px 0 -15px;}
	.main_news .list ul li{ margin:60px 0 0 0;}
	.main_news .list ul li a{ margin:0 15px; padding:0 0 0 20px;}
	.main_news .list ul li a img{ width:auto; height:25px;}
	.main_news .list ul li a .tit{ margin:10px 0 0 0; font-size:18px;}
	.main_news .list ul li a .date{ margin:15px 0 0 0; font-size:13px;}
}


.work_fixed{ display:none; position:fixed; z-index:500; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,0.8);}
	.work_fixed .xi-angle-right{ display:block; position:fixed; top:50%; right:0; margin:-50px 0 0 0; width:100px; height:100px; background:rgba(0,0,0,0.5); text-align:center; line-height:100px; font-size:30px; color:#FFF; cursor:pointer;}
	.work_fixed .xi-angle-left{ display:block; position:fixed; top:50%; left:0; margin:-50px 0 0 0; width:100px; height:100px; background:rgba(0,0,0,0.5); text-align:center; line-height:100px; font-size:30px; color:#FFF; cursor:pointer;}
	.work_fixed .xi-close{ display:block; position:fixed; top:0; right:0; width:100px; height:100px; background:rgba(0,0,0,0.5); text-align:center; line-height:100px; font-size:30px; color:#FFF; cursor:pointer;}
	.work_fixed .row{ position:absolute; top:0; bottom:0; left:50%; margin:0 0 0 -500px; width:1000px;}
	.work_fixed .row .box{ display:block; position:absolute; top:50%; left:50%; width:100%; height:auto; transform:translate(-50%,-50%);}
	.work_fixed .row img{ display:block; width:100%;}
	.work_fixed .row p{ margin:20px 0 0 0; line-height:30px; font-size:25px; color:#FFF;}
	.work_fixed.on{ display:block;}
@media(max-width:1200px){
	.work_fixed .xi-angle-right{ margin:-40px 0 0 0; width:80px; height:80px; line-height:80px;}
	.work_fixed .xi-angle-left{ margin:-40px 0 0 0; width:80px; height:80px; line-height:80px;}
	.work_fixed .xi-close{ width:80px; height:80px; line-height:80px;}
	.work_fixed .row{ margin:0 0 0 -400px; width:800px;}
}
@media(max-width:1000px){
	.work_fixed .row{ margin:0 0 0 -250px; width:500px;}
}
@media(max-width:767px){
	.work_fixed .xi-angle-right{ margin:-30px 0 0 0; width:60px; height:60px; line-height:60px; font-size:20px;}
	.work_fixed .xi-angle-left{ margin:-30px 0 0 0; width:60px; height:60px; line-height:60px; font-size:20px;}
	.work_fixed .xi-close{ width:60px; height:60px; line-height:60px; font-size:20px;}
	.work_fixed .row{ margin:0 0 0 -170px; width:340px;}
	.work_fixed .row p{ margin:10px 0 0 0; line-height:20px; font-size:18px;}
}
	

.main_bgcolor{ position:fixed; z-index:1; top:0; right:0; bottom:0; left:0; background:#160d38; background-image: url("../../images/main_bg.jpg"); transition:all .5s;}
	.main_bgcolor.mb_color{ background:#2e3754;}
	.main_bgcolor.mb_color.mw_color{ background:#ffed8e;}
	.main_bgcolor.mb_color.mw_color.mn_color{ background:#2e3754;}
	.main_bgcolor.mb_color.mw_color.mn_color.mx_color{ background:#ff6600; background-image: url("../../images/main_bg.jpg"); }
	
canvas{ position:fixed; z-index:2; top:0; right:0; bottom:0; left:0; opacity:0.15;}


.sub_visual{ overflow:hidden; position:relative; z-index:10; margin:-200px 0 0 0; padding:0 80px; 
		background: url("../../images/sub_bg.jpg") no-repeat 0px 0px;
    	background-size: cover;
    	-webkit-background-size: cover;
    	-moz-background-size: cover;
   	 	-o-background-size: cover;
   		-ms-background-size: cover;}
	.sub_visual .row{ margin:0 auto; max-width:1000px; padding:300px 0 0 0; height:600px;}
	.sub_visual .tit{ text-align:left; line-height:50px; font-size:30px; font-weight:800; color:#FFF;}
	.sub_visual .txt1{ margin:5px 0 0 0; text-align:left; line-height:50px; font-size:50px; font-weight:600; color:#FFF;}
	.sub_visual .txt2{ margin:10px 0 0 0; text-align:left; line-height:20px; font-size:20px; font-style:italic;  color:#FFF;}
@media(max-width:1200px){
	.sub_visual{ padding:0 50px;}
	.sub_visual .row{ padding:280px 0 0 0; height:550px;}
}
@media(max-width:767px){
	.sub_visual{ padding:0 15px;}
	.sub_visual .row{ padding:260px 0 0 0; height:450px;}
	.sub_visual .tit{ line-height:20px; font-size:30px;}
	.sub_visual .txt1{ margin:20px 0 0 0; font-size:20px;}
	.sub_visual .txt2{ margin:0px 0 0 0; font-size:15px;}
}


.sub{ padding:50px 80px 80px 80px;}
	.sub > .row{ margin:0 auto; max-width:1000px;}
@media(max-width:1200px){
	.sub{ padding:30px 60px 60px 60px;}
}
@media(max-width:767px){
	.sub{ padding:20px 15px 50px 15px;}
}


.guide{ margin:0 auto; max-width:1000px; height:20px; text-align:right;}
	.guide ul{ display:inline-block; vertical-align:top; height:20px;}
	.guide ul li{ float:left;}
	.guide ul li a{ line-height:20px; font-size:15px; color:#333;}
	.guide ul li i{ display:block; margin:0 15px; line-height:20px; font-size:18px; color:#CCC;}
	.guide ul li i.xi-home-o{ margin:0; font-size:20px; color:#333;}



.sub_title{ margin:50px auto 0 auto; max-width:1200px; line-height:40px; font-size:40px; font-weight:800; color:#333;}
@media(max-width:1200px){
	.sub_title{ margin:40px auto 0 auto; line-height:35px; font-size:35px;}
}
@media(max-width:767px){
	.sub_title{ margin:30px auto 0 auto; line-height:30px; font-size:30px;}
}


.sub_line{ border-top:1px solid #e5e5e5;}


.height_20{ height:20px;}
	.height_30{ height:30px;}
	.height_50{ height:50px;}
	.height_80{ height:80px;}
@media(max-width:1200px){
	.height_20{ height:15px;}
	.height_30{ height:25px;}
	.height_50{ height:45px;}
}
@media(max-width:767px){
	.height_20{ height:20px;}
	.height_30{ height:30px;}
	.height_50{ height:50px;}
	.height_80{ height:80px;}
}	
	
	
.about_txt01{ overflow:hidden; margin:-20px 0 0 0;}
	.about_txt01 li{ float:left; margin:20px 0 0 0; width:50%;}
	.about_txt01 li font{ display:block; margin:10px 0; line-height:20px; font-size:20px; font-weight:800; color:#ee2c3c;}
	.about_txt01 li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:1000px){
	.about_txt01 li{ width:100%;}
}

.about_txt02{ margin:70px 0 0 0;}
	.about_txt02 .top{ position:relative;}
	.about_txt02 .top ul{ overflow:hidden; position:relative; z-index:10;}
	.about_txt02 .top ul li{ float:left; width:100%;}
	.about_txt02 .top ul li a{ display:block; margin:0 auto; width:130px; height:130px; border-radius:50%; border:5px solid #0F0; background:#FFF; text-align:center; line-height:120px; font-size:18px; font-weight:700; color:#333;}
	.about_txt02 .top .line{ position:absolute; top:50%; right:50%; bottom:-50%; border-left:1px solid #DDD;}
	
	.about_txt02 .middle{ position:relative;}
	.about_txt02 .middle ul{ overflow:hidden; position:relative; z-index:10;}
	.about_txt02 .middle ul li{ float:left; width:50%;}
	.about_txt02 .middle ul li a{ display:block; margin:0 auto; width:130px; height:130px; border-radius:50%; background:#FFF; text-align:center; line-height:120px; font-size:18px; font-weight:700; color:#333;}
	.about_txt02 .middle ul li:nth-child(1) a{ border:5px solid #F90;}
	.about_txt02 .middle ul li:nth-child(2) a{ border:5px solid #09F;}
	.about_txt02 .middle .line{ position:absolute; top:50%; right:25%; left:25%; border-top:1px solid #DDD;}
	
	.about_txt02 .bottom{ position:relative;}
	.about_txt02 .bottom ul{ overflow:hidden; position:relative; z-index:10;}
	.about_txt02 .bottom ul li{ float:left; width:25%;}
	.about_txt02 .bottom ul li a{ display:block; position:relative; z-index:10; margin:20px auto 0 auto; width:140px; height:50px; background:#FFF; text-align:center; line-height:46px; font-size:16px; color:#333;}
	.about_txt02 .bottom ul li p{ display:block; margin:-1px auto 0 auto; width:140px; height:30px; border:1px solid #DDD; background:#FFF; text-align:center; line-height:26px; font-size:13px; color:#666;}
	.about_txt02 .bottom ul li:nth-child(1) a{ border:2px solid #F90;}
	.about_txt02 .bottom ul li:nth-child(2) a{ border:2px solid #FC3;}
	.about_txt02 .bottom .line_1{ position:absolute; top:0; left:25%; height:40px; border-left:1px solid #DDD;}
	.about_txt02 .bottom .line_2{ position:absolute; top:40px; left:12.5%; right:62.5%; border-top:1px solid #DDD;}
	.about_txt02 .bottom .line_3{ position:absolute; top:20px; left:12.5%; bottom:50%; border-left:1px solid #DDD;}
	.about_txt02 .bottom .line_4{ position:absolute; top:20px; left:37.5%; bottom:0; border-left:1px solid #DDD;}
	
	.about_txt02 .row_box { }
	
@media(max-width:767px){
	.about_txt02 .bottom ul{ margin:20px 0 0 0;}
	.about_txt02 .bottom ul li{ width:50%;}
	.about_txt02 .bottom .line_1{ top:-20px;}
	.about_txt02 .bottom .line_2{ top:0; left:25%; right:25%;}
	.about_txt02 .bottom .line_3{ top:0; left:25%;}
	.about_txt02 .bottom .line_4{ top:0; left:75%;}
}



.about_txt03{ overflow:hidden; margin:-20px 0 0 0;}
	.about_txt03 span{ display:block; float:left; margin:20px 0 0 0; padding:30px 0 0 0; width:30%; border-top:1px solid #DDD; line-height:30px; font-size:30px; font-weight:800; color:#ee2c3c;}
	.about_txt03 ul{ float:left; margin:20px 0 0 0; padding:20px 0 0 0; width:70%; border-top:1px solid #DDD;}
	.about_txt03 ul li{ padding:0 0 0 100px;}
	.about_txt03 ul li font{ display:block; float:left; margin:0 0 0 -100px; line-height:20px; font-size:16px; color:#666;}
	.about_txt03 ul li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:1200px){
	.about_txt03 span{ font-size:25px;}
}
@media(max-width:767px){
	.about_txt03{ margin:-10px 0 0 0;}
	.about_txt03 span{ float:inherit; margin:0; padding:20px 0 0 0; width:100%;}
	.about_txt03 ul{ float:inherit; margin:15px 0 0 0; padding:0 0 20px 0; width:100%; border:0;}
	.about_txt03 ul li{ padding:0 0 0 80px;}
	.about_txt03 ul li font{ margin:0 0 0 -80px; font-size:14px;}
	.about_txt03 ul li p{ font-size:14px; letter-spacing:-1;}
}

.about_txt04{ overflow:hidden; margin:0 -5px;}
	.about_txt04 li{ float:left; width:33.333%;}
	.about_txt04 li a{ display:block; margin:0 5px;}
	.about_txt04 li a img{ display:block; width:100%; height:auto;}
	.about_txt04 li a p{ margin:10px 0 0 0; line-height:20px; font-size:16px; color:#333;}
@media(max-width:767px){
	.about_txt04{ margin-top:-20px;}
	.about_txt04 li{ margin:20px 0 0 0; width:100%;}
}


.about_txt05{ overflow:hidden; margin:0 -5px;}
	.about_txt05 li{ float:left; width:20%; padding:5px;}
	.about_txt05 li a{ display:block; }
	.about_txt05 li a img{ display:block; }
	
	.about_txt05 li .li-box:hover {  
		transition: .3s;
		box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.1);
	}
	.about_txt05 li.li-box {
		padding: 2px;
		position: relative;
		z-index: 1;
		box-shadow: 0 25px 98px 0 rgba(0, 0, 0, 0.03);
		background-color: var(--bg-color);
	}	
	
	
@media(max-width:767px){
	.about_txt05{ margin-top:-20px;}
	.about_txt05 li{ margin:20px 0 0 0; width:50%;}
}

	
.business01_txt03{ overflow:hidden; margin:-20px 0 0 0;}
	.business01_txt03 li{ float:left; margin:20px 0 0 0; width:33.333%;}
	.business01_txt03 li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:1000px){
	.business01_txt03 li{ width:50%;}
}
@media(max-width:767px){
	.business01_txt03 li{ width:100%;}
}

.business01_txt032{ overflow:hidden; margin:-20px 0 0 0;}
	.business01_txt032 li{ float:left; margin:20px 0 0 0; width:50%;}
	.business01_txt032 li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:1000px){
	.business01_txt032 li{ width:100%;}
}

.business01_txt033{ overflow:hidden; margin:-20px 0 0 0;}
	.business01_txt033 li{ float:left; margin:20px 0 0 0; width:33.333%;}
	.business01_txt033 li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:767px){
	.business01_txt033 li{ width:100%;}
}

.business02_img{ overflow:hidden; margin:-20px -5px 0 -5px;}
	.business02_img li{ float:left; margin:20px 0 0 0; width:33.333%;}
	.business02_img li a{ overflow:hidden; display:block; position:relative; margin:0 5px; cursor:pointer;}
	.business02_img li a img{ display:block; width:100%; transition:all .5s;}	
	.business02_img li a .bg{ position:absolute; z-index:10; top:0; right:0; bottom:0; left:0; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.5));}
	.business02_img li a .bg .tit{ position:absolute; left:20px; bottom:20px; line-height:20px; font-size:16px; color:#FFF; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; overflow:hidden; transition:all .5s;}
	.business02_img li a:hover .bg .tit{ transform:translate(0,-5px) rotate(-2deg) scale(1.1);}
	.business02_img li a:hover img{ transform:translate(0,0) rotate(5deg) scale(1.2);}
@media(max-width:1000px){
	.business02_img li{ width:100%;}
}
	
.business03_txt{ overflow:hidden; margin:-20px 0 0 0;}
	.business03_txt li{ float:left; margin:20px 0 0 0; width:33.333%;}
	.business03_txt li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:1200px){
	.business03_txt li{ width:50%;}
}
@media(max-width:767px){
	.business03_txt li{ width:100%;}
}	
	
.business04_txt02{ overflow:hidden; margin:-20px 0 0 0;}
	.business04_txt02 li{ float:left; margin:20px 0 0 0; width:50%;}
	.business04_txt02 li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:767px){
	.business04_txt02 li{ width:100%;}
}

.business04_txt03{ overflow:hidden; margin:-20px 0 0 0;}
	.business04_txt03 li{ float:left; margin:20px 0 0 0; width:33.333%;}
	.business04_txt03 li p{ margin:10px 0; line-height:20px; font-size:16px; color:#666;}
@media(max-width:1000px){
	.business04_txt03 li{ width:50%;}
}
@media(max-width:767px){
	.business04_txt03 li{ width:100%;}
}
.business04_txt {overflow:hidden; margin:-20px 0 0 0;}
	.business04_txt li{ float:left; margin:20px 0 0 0; width:50%;}
	.business04_txt li font{ display:block; margin:10px 0; line-height:20px; font-size:20px; font-weight:800; color:#F60;}
	.business04_txt li p{ margin:20px 30px 20px 0px; line-height:25px; color:#666;}
@media(max-width:1000px){
	.business04_txt li{ width:100%;}
}

	
.sub_portfolio{}
	.sub_portfolio ul{ overflow:hidden; margin:-10px -5px 0 -5px;}
	.sub_portfolio ul li{ float:left; margin-top:10px; width:50%;}
	.sub_portfolio ul li a{ overflow:hidden; display:block; position:relative; margin:0 5px; cursor:pointer;}
	.sub_portfolio ul li a .bg{ position:absolute; z-index:10; top:0; right:0; bottom:0; left:0; background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.5));}
	.sub_portfolio ul li a .bg .tit{ position:absolute; left:20px; bottom:20px; line-height:20px; font-size:18px; color:#FFF; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; overflow:hidden; transition:all .5s;}
	.sub_portfolio ul li a img{ display:block; width:100%; transition:all .5s;}
	.sub_portfolio ul li a:hover .bg .tit{ transform:translate(0,-5px) rotate(-2deg) scale(1.1);}
	.sub_portfolio ul li a:hover img{ transform:translate(0,0) rotate(5deg) scale(1.2);}
@media(max-width:767px){
	.sub_portfolio ul li{ width:100%;}
	.sub_portfolio ul li a .bg .tit{ font-size:16px;}
}
	
	
	
	
.portfolio_detail{ line-height:25px; font-size:16px; color:#666;}
	.portfolio_detail img{ display:block; margin:15px 0; max-width:100% !important; height:auto !important;}
	.portfolio_detail iframe{ display:block; margin:15px 0; max-width:100% !important;}
@media(max-width:767px){
	.portfolio_detail iframe{ height:200px !important;}
}


	
.sub_contact{}
	.sub_contact .title{ line-height:20px; font-size:20px; font-weight:700; color:#333;}
	.sub_contact .row{}
	.sub_contact .row ul{ margin:-10px -5px 0 -5px;}
	.sub_contact .row ul li{ float:left; margin:10px 0 0 0; width:50%;}
	.sub_contact .row ul li a{ margin:0 5px;}
	.sub_contact .board{ margin:10px 0 0 0; padding:9px 14px 9px 149px; border:1px solid #DDD;}
	.sub_contact .board .tit{ float:left; margin:5px 0 0 -135px; line-height:30px; font-size:18px; font-weight:700; color:#333;}
	.sub_contact .board ul{ float:left; margin:0 0 0 20px;}
	.sub_contact .board ul li{ float:left; margin:0 30px 0 0;}
	.sub_contact .board ul li .check{ overflow:hidden; margin:5px 0; line-height:30px; font-size:15px; color:#666; cursor:pointer;}
	.sub_contact .board ul li .check i{ display:block; float:left; margin:0 5px 0 0; width:30px; height:30px; border:1px solid #DDD; background:#f5f5f5; text-align:center; line-height:28px; color:#f5f5f5;}
	.sub_contact .board ul li .check.on i{ border-color:#005ab2; background:#005ab2; color:#FFF;}
	.sub_contact input{ display:block; padding:0 14px; width:100%; height:60px; border:1px solid #DDD; border-radius:0; background:#f5f5f5; line-height:60px; font-size:16px; color:#333; outline:none; -webkit-appearance:none;}
	.sub_contact textarea{ display:block; padding:14px; width:100%; max-width:100%; min-width:100%; height:150px; max-height:150px; min-height:150px; border:1px solid #DDD; border-radius:0; background:#f5f5f5; line-height:25px; font-size:16px; color:#333; outline:none; -webkit-appearance:none;}
	.sub_contact select{ display:block; float:left; margin:0 10px 0 0; padding:4px 14px; width:150px; height:30px; border-radius:0; border:1px solid #DDD; background:url(../../images/select_icon.png) no-repeat center right 10px #f5f5f5; background-size:15px auto; line-height:20px; font-size:16px; color:#333; outline:none; -webkit-appearance:none;}
	.sub_contact select::-ms-expand{ display:none;}
	.sub_contact .board .check_tit{ float:left; margin:5px 0 0 -135px; line-height:30px; font-size:15px; color:#666; cursor:pointer;}
	.sub_contact .board .check_tit i{ display:block; float:left; margin:0 5px 0 0; width:30px; height:30px; border:1px solid #DDD; background:#f5f5f5; text-align:center; line-height:28px; color:#f5f5f5;}
	.sub_contact .board .check_tit.on i{ border-color:#333; background:#333; color:#ffff00;}
	.sub_contact .board .date{ position:relative; float:left; line-height:30px; font-size:15px; color:#666; cursor:pointer;}
	.sub_contact .board .date i{ display:block; position:absolute; z-index:1; top:0; right:0; width:30px; height:30px; text-align:center; line-height:30px; font-size:24px; color:#666;}
	.sub_contact .board .date input{ width:150px; height:30px; line-height:30px; font-size:15px;}
	.sub_contact .board > input{ float:left; margin:5px 10px 5px 0; width:50%; height:30px; line-height:30px; font-size:15px;}
	.sub_contact .board select{ margin:5px 10px 5px 0;}
	.sub_contact .board .btn{ float:left; padding:0 20px; height:30px; background:#333; line-height:30px; font-size:15px; font-weight:700; color:#ffff00; cursor:pointer;}
	.sub_contact .check_ok{ margin:20px 0 0 0; line-height:30px; font-size:15px; color:#666; cursor:pointer;}
	.sub_contact .check_ok i{ display:block; float:left; margin:0 5px 0 0; width:30px; height:30px; border:1px solid #DDD; background:#f5f5f5; text-align:center; line-height:28px; color:#f5f5f5;}
	.sub_contact .check_ok.on i{ border-color:#005ab2; background:#005ab2; color:#FFF;}
	.sub_contact .button{ margin:0 auto; width:200px; height:60px; border:1px solid #999; text-align:center; line-height:60px; font-size:18px; font-weight:700; color:#333; cursor:pointer; transition:all .5s !important;}
	.sub_contact .button:hover{ border-color:#005ab2; background:#005ab2; color:#FFF;}
@media(max-width:1025px){
	.sub_contact .board{ height:auto;}
}
@media(max-width:767px){
	.sub_contact .row ul li{ width:100% !important;}
	.sub_contact .board{ padding:9px 14px;}
	.sub_contact .board .tit{ float:inherit; margin:10px 0 10px 0; line-height:20px; font-size:18px;}
	.sub_contact .board ul{ float:inherit; margin:0;}
	.sub_contact .board ul li{ margin:0 20px 0 0;}
	.sub_contact .board ul li.yuyan{ margin:0; width:100%;}
	.sub_contact input{ padding:0 14px; height:40px; line-height:40px; font-size:15px;}
	.sub_contact textarea{ padding:9px 14px; height:100px; max-height:100px; min-height:100px; font-size:15px;}
	.sub_contact select{ display:block; float:left; margin:0 10px 0 0; padding:4px 14px; width:150px; height:30px; border-radius:0; border:1px solid #DDD; background:url(../../images/select_icon.png) no-repeat center right 10px #f5f5f5; background-size:15px auto; line-height:20px; font-size:15px; color:#333; outline:none; -webkit-appearance:none;}
	.sub_contact .board .check_tit{ float:inherit; margin:5px 0;}
	.sub_contact .board > input{ margin:5px 0 5px 0; width:100%;}
	.sub_contact .board select{ margin:5px 0 5px 0; width:100%;}
	.sub_contact .board .btn{ float:inherit; margin:10px 0 10px 0; width:100%; height:40px; text-align:center; line-height:40px;}
	.sub_contact .button{ width:100%; height:50px; line-height:50px;}
}
	
	
	
.board_search{}
	.board_search .row{ margin:0 auto; padding:15px 20px; max-width:1200px; height:65px; background:#f9f9f9;}
	.board_search .tit{ float:left; line-height:35px; font-size:16px; color:#666;}
	.board_search .tit font{ font-weight:800; color:#000;}
	.board_search .wrap{ position:relative; float:right; padding:0 80px; width:350px;}
	.board_search select{ display:block; position:absolute; top:0; left:0; margin:0; padding:0 35px 0 10px; width:81px; height:35px; border-radius:0; border:1px solid #e5e5e5; background:url(../../images/select_icon.png) no-repeat center right 10px rgba(255,255,255,1); background-size:15px auto; line-height:20px; font-size:14px; color:#333; outline:none; -webkit-appearance:none;}
	.board_search select::-ms-expand{ display:none;}
	.board_search input{ display:block; float:left; padding:0 10px; width:100%; height:35px; border-radius:0; border:1px solid #e5e5e5; background:#FFF; line-height:33px; font-size:14px; color:#333; outline:none; -webkit-appearance:none;}
	.board_search .btn{ position:absolute; z-index:10; top:0; right:0; width:81px; height:35px; background:#333; text-align:center; cursor:pointer;}
	.board_search .btn *{ display:inline-block; vertical-align:top;}
	.board_search .btn p{ line-height:35px; font-size:14px; color:#FFF;}
	.board_search .btn i{ margin:0 0 0 5px; line-height:35px; font-size:14px; color:#FFF;}
	.board_search .btn:hover{ background:#333;}
@media(max-width:1200px){
	.board_search{}
}
@media(max-width:767px){
	.board_search{}
	.board_search .row{ padding:10px 15px; height:55px;}
	.board_search .tit{ font-size:14px;}
	.board_search .wrap{ padding:0 60px 0 70px; width:75%;}
	.board_search select{ padding:0 30px 0 10px; width:71px; background:url(../../images/select_icon.png) no-repeat center right 10px rgba(255,255,255,1); background-size:15px auto; line-height:20px; font-size:14px; color:#333; outline:none; -webkit-appearance:none;}
	.board_search input{ padding:0 10px;}
	.board_search .btn{ width:61px; height:35px;}
	.board_search .btn p{ line-height:35px; font-size:12px;}
	.board_search .btn i{ margin:0 0 0 3px;}
}


.board_page{ height:40px;}
	.board_page .row{ margin:0 auto; position:relative; max-width:1200px;}
	.board_page .btn_L{ position:absolute; top:0; left:0;}
	.board_page .btn_L ul{ overflow:hidden; padding:0 5px; border:1px solid #e5e5e5;}
	.board_page .btn_L ul li{ float:left;}
	.board_page .btn_L ul li i{ padding:0 10px; height:38px; background:#FFF; line-height:38px; font-size:15px; color:#666; cursor:pointer;}
	
	.board_page .btn_R{ position:absolute; top:0; right:0;}
	.board_page .btn_R ul{ overflow:hidden; padding:0 5px; border:1px solid #e5e5e5;}
	.board_page .btn_R ul li{ float:left;}
	.board_page .btn_R ul li i{ padding:0 10px; height:38px; background:#FFF; line-height:38px; text-align:center; font-size:15px; color:#666; cursor:pointer;}
	
	.board_page .page{ text-align:center;}
	.board_page .page ul{ display:inline-block; height:40px;}
	.board_page .page ul li{ float:left;}
	.board_page .page ul li p{ padding:0 5px; width:40px; height:40px; line-height:40px; text-align:center; font-size:15px; color:#999; cursor:pointer;}
	.board_page .page ul li p.on{ margin:0 5px; width:40px; background:#333; font-weight:bold; color:#FFF;}
@media(max-width:1200px){
}
@media(max-width:767px){
	.board_page{ height:35px;}
	.board_page .btn_L ul li i{ padding:0 5px; height:33px; line-height:33px; font-size:13px;}
	.board_page .btn_R ul li i{ padding:0 5px; height:33px; line-height:33px; font-size:13px;}
	.board_page .page ul{ height:35px;}
	.board_page .page ul li p{ height:35px; line-height:35px; font-size:13px;}
	.board_page .page ul li p.on{ width:35px;}
}


.board_info{}
	.board_info .row{ margin:0 auto; padding:15px 20px; max-width:1200px; height:65px; background:#f9f9f9;}
	.board_info .tit{ float:left; line-height:35px; font-size:16px; color:#666;}
	.board_info .tit font{ font-weight:800; color:#000;}
	.board_info .wrap{ position:relative; float:right; width:250px;}
	.board_info .wrap select{ display:block; float:right; margin:0; padding:0 35px 0 15px; width:120px; height:35px; border-radius:0; border:1px solid #e5e5e5; background:url(../../images/select_icon.png) no-repeat center right 15px rgba(255,255,255,1); background-size:15px auto; line-height:20px; font-size:14px; color:#333; outline:none; -webkit-appearance:none;}
	.board_info .wrap select::-ms-expand{ display:none;}
	.board_info .wrap .btn{ float:right; margin:0 0 0 10px; width:120px; height:35px; background:#333; text-align:center; line-height:35px; font-size:15px; font-weight:800; color:#FFF;}
@media(max-width:1200px){
	.board_info{}
}
@media(max-width:767px){
	.board_info{}
	.board_info .row{ padding:10px 15px; height:55px;}
	.board_info .tit{ font-size:14px;}
	.board_info .wrap{ width:210px;}
	.board_info .wrap select{ padding:0 35px 0 10px; width:100px; background:url(../../images/select_icon.png) no-repeat center right 10px rgba(255,255,255,1); background-size:15px auto;}
	.board_info .wrap .btn{ width:100px;}
}



.board_02{}
	.board_02 .row{ margin:0 auto; max-width:1200px; border-top:1px solid #ededed;}
	.board_02 .row .body:nth-child(even){ background:#f9f9f9;}
	.board_02 .head{ position:relative; padding:0 30% 0 10%; height:60px; border-bottom:2px solid #333;}
	.board_02 .head p{ text-align:center; line-height:60px; font-size:18px; font-weight:800; color:#333;}
	.board_02 .head .number{ position:absolute; top:0; left:0; width:10%;}
	.board_02 .head .date{ position:absolute; top:0; right:15%; width:15%;}
	.board_02 .head .click{ position:absolute; top:0; right:0%; width:15%;}
	
	.board_02 .body{ position:relative; margin:0; padding:0 30% 0 10%; border-bottom:1px solid #ededed;}
	.board_02 .body p{ text-align:center; line-height:70px; font-size:16px; color:#666;}
	.board_02 .body p font{ display:none;}
	.board_02 .body .tit{ padding:0 10px; text-align:left; line-height:70px; font-size:16px; color:#333; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; transition:none;}
	.board_02 .body .tit span{ display:block; float:left; max-width:85%; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
	.board_02 .body .tit font{ display:block; float:left; margin:0 0 0 5px; font-size:13px; color:#F00; text-transform:uppercase;}
	.board_02 .body .tit i{ display:block; float:left; margin:0 0 0 3px; line-height:57px; font-size:18px;}
	.board_02 .body .number{ position:absolute; top:0; left:0; width:10%;}
	.board_02 .body .date{ position:absolute; top:0; right:15%; width:15%;}
	.board_02 .body .click{ position:absolute; top:0; right:0%; width:15%;}
	
	.board_02 .body:hover{ background:#f8fafc;}
	.board_02 .body:hover .tit{ color:#333; text-decoration:underline !important;}
	.board_02 .body:hover .tit span{ color:#333; text-decoration:underline !important;}
	.board_02 .body:hover .tit i{ color:#333;}
@media(max-width:1200px){
	.board_02{}
}
@media(max-width:767px){
	.board_02{}
	.board_02 .head{ display:none;}
	.board_02 .body{ overflow:hidden; padding:20px 15px 20px 60px;}
	.board_02 .body p{ text-align:left; line-height:15px; font-size:11px; color:#999;}
	.board_02 .body p font{ display:block; float:left;}
	.board_02 .body .tit{ float:left; padding:0 0 5px 0; width:100%; line-height:20px; font-size:14px;}
	.board_02 .body .tit span{ max-width:75%; font-size:15px;}
	.board_02 .body .tit font{ font-size:10px;}
	.board_02 .body .tit i{ line-height:18px;}
	.board_02 .body .number{ position:absolute; top:50%; left:10px; margin:-20px 0 0 0; width:40px; height:40px; background:#333; text-align:center; line-height:40px; font-size:14px; font-weight:700; color:#FFF;}
	.board_02 .body .date{ position:static; float:left; margin:0 10px 0 0; width:auto;}
	.board_02 .body .click{ position:static; float:left; margin:0 10px 0 0; width:auto;}
	.board_02 .body .mode{ position:absolute; top:15px; right:0;}
	.board_02 .body .mode span{ width:100%; height:40px; text-align:center; line-height:40px; font-size:13px; letter-spacing:-1.5px;}
}

	
.board_btn_01{}
	.board_btn_01 a{ margin:0 auto; width:220px; height:60px; border:1px solid #999; text-align:center; cursor:pointer; transition:all .5s;}
	.board_btn_01 a *{ display:inline-block; vertical-align:top; margin:0 5px; line-height:58px; font-size:18px; font-weight:700;}
	.board_btn_01 a i{ color:#666; transition:all .5s;}
	.board_btn_01 a p{ color:#666; transition:all .5s;}
	.board_btn_01 a:hover{ border-color:#333; background:#333;}
	.board_btn_01 a:hover i{ color:#FFF;}
	.board_btn_01 a:hover p{ color:#FFF;}
@media(max-width:1200px){
	.board_btn_01{}
}
@media(max-width:767px){
	.board_btn_01{}
	.board_btn_01 a{ width:auto; height:50px;}
	.board_btn_01 a *{ line-height:50px; font-size:16px;}
}



.board_view{}
	.board_view .box{ overflow:hidden; margin:0 auto; max-width:1200px; border-top:1px solid #ededed;}	
	.board_view .box .top{ padding:25px 50px;}
	.board_view .box .top p{ line-height:25px; font-size:22px; font-weight:800; color:#333;}
	.board_view .box .info{ overflow:hidden; padding:0 50px; border-top:2px solid #333; border-bottom:1px solid #ededed; background:#f8fafc;}
	.board_view .box .info ul{ float:left; margin:10px 0;}
	.board_view .box .info ul li{ float:left; margin:0 20px 0 0; height:35px; line-height:35px; font-size:16px; color:#666;}
	.board_view .box .info ul li p{ float:left; color:#666;}
	.board_view .box .info ul li span{ display:block; margin:0; padding:0 10px; height:35px; border:1px solid #DDD; background:#FFF; line-height:34px; font-size:15px; color:#666;}
	.board_view .box .info ul li span.on{ border-color:#3d3f42; background:#3d3f42; color:#FFF;}
	.board_view .box .bottom{ padding:50px; line-height:30px !important; font-size:16px !important; color:#666 !important;}
	.board_view .box .bottom iframe{ width:100% !important; height:500px !important;}
	.board_view .box .bottom img{ display:block; margin:0 0 20px 0; max-width:100% !important; height:auto !important;}
	
	.board_view .box .bottom .qa_box{ overflow:hidden; margin:0 -65px;}
	.board_view .box .bottom .qa_box li{ float:left; width:50%;}
	.board_view .box .bottom .qa_box li .wrap{ margin:0 15px;}
	.board_view .box .bottom .q_tit{ padding:0 50px; height:50px; border:1px solid #ededed; border-bottom:0; background:#f8fafc; line-height:48px; font-size:16px; color:#333;}
	.board_view .box .bottom .q{ padding:50px; border:1px solid #ededed;}
	.board_view .box .bottom .a_tit{ padding:0 50px; height:50px; background:#333; line-height:48px; font-size:16px; color:#FFF;}
	.board_view .box .bottom .a{ padding:50px; border:1px solid #333;}
	
	.board_view .box .bottom .like{ margin:50px 0 0 0; height:50px; border:2px solid #CCC; border-radius:30px; text-align:center; cursor:pointer;}
	.board_view .box .bottom .like *{ display:inline-block; vertical-align:top;}
	.board_view .box .bottom .like i{ line-height:46px; font-size:20px; color:#333;}
	.board_view .box .bottom .like p{ line-height:46px; font-size:18px; color:#333;}
	.board_view .box .bottom .like font{ line-height:46px; font-size:20px; font-family:HDR; color:#333;}
	
	.board_view .box .bottom .like.on{ border-color:#e5004f; background:#e5004f;}
	.board_view .box .bottom .like.on i{ color:#FFF !important;}
	.board_view .box .bottom .like.on p{ color:#FFF !important;}
	.board_view .box .bottom .like.on font{ color:#FFF !important;}
	
	.board_view .box .list{ border-top:1px solid #ededed;}
	.board_view .box .list li{ border-bottom:1px solid #ededed;}
	.board_view .box .list li a{ overflow:hidden; padding:0 50px 0 150px;}
	.board_view .box .list li a .left{ float:left; margin:0 0 0 -100px; width:100px; line-height:60px; font-size:15px; color:#666;}
	.board_view .box .list li a .left i{ margin:0 5px 0 0; color:#666;}
	.board_view .box .list li a .tit{ float:left; margin:15px 0; padding:0 0 0 40px; width:100%; border-left:1px solid #ededed;}
	.board_view .box .list li a .tit span{ display:block; float:left; max-width:90%; line-height:30px; font-size:15px; color:#666; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
	.board_view .box .list li a .tit font{ display:block; float:left; margin:0 0 0 3px; line-height:30px; font-size:13px; color:#F00; text-transform:uppercase;}
	.board_view .box .list li a:hover{ background:#f8fafc;}
	.board_view .box .list li a:hover .tit span{ color:#333; text-decoration:underline !important;}
@media(max-width:1200px){
	.board_view{}
}
@media(max-width:1036px){
	.board_view .box .top{ padding:25px 30px;}
	.board_view .box .info{ padding:0 30px;}
	.board_view .box .bottom{ padding:30px;}
	
	.board_view .box .bottom .qa_box{ margin:0 -40px;}
	.board_view .box .bottom .qa_box li .wrap{ margin:0 10px;}
	.board_view .box .bottom .q_tit{ padding:0 30px;}
	.board_view .box .bottom .q{ padding:30px;}
	.board_view .box .bottom .a_tit{ padding:0 30px;}
	.board_view .box .bottom .a{ padding:30px;}
	
	.board_view .box .bottom .like{ margin:30px 0 0 0;}
	
	.board_view .box .list li a{ padding:0 50px 0 130px;}
}
@media(max-width:767px){
	.board_view{}
	.board_view .box .top{ padding:15px 20px;}
	.board_view .box .top p{ line-height:20px; font-size:16px;}
	.board_view .box .info{ padding:0 0 0 20px;}
	.board_view .box .info ul{ margin:5px 0;}
	.board_view .box .info ul li{ margin:0 15px 0 0; height:30px; line-height:30px; font-size:14px;}
	.board_view .box .info ul li span{ margin:2.5px 0; padding:0 8px; height:25px; line-height:23px; font-size:13px;}
	.board_view .box .bottom{ padding:30px 20px; line-height:20px !important; font-size:14px !important;}
	.board_view .box .bottom iframe{ width:100% !important; height:200px !important;}
	.board_view .box .bottom img{ margin:0 0 10px 0;}
	
	.board_view .box .bottom .qa_box{ margin:0 -20px;}
	.board_view .box .bottom .qa_box li{ width:100%;}
	.board_view .box .bottom .qa_box li .wrap{ margin:0;}
	.board_view .box .bottom .q_tit{ padding:0 20px; height:40px; line-height:38px; font-size:14px;}
	.board_view .box .bottom .q{ padding:20px;}
	.board_view .box .bottom .a_tit{ margin:20px 0 0 0; padding:0 20px; height:40px; line-height:38px; font-size:14px;}
	.board_view .box .bottom .a{ padding:20px;}
	
	.board_view .box .bottom .like{ height:40px;}
	.board_view .box .bottom .like i{ line-height:36px; font-size:18px;}
	.board_view .box .bottom .like p{ line-height:36px; font-size:15px;}
	.board_view .box .bottom .like font{ line-height:36px; font-size:18px;}
	
	.board_view .box .list li a{ padding:0 20px 0 90px;}
	.board_view .box .list li a .left{ margin:0 0 0 -70px; width:70px; line-height:40px; font-size:13px;}
	.board_view .box .list li a .tit{ margin:10px 0; padding:0 0 0 15px;}
	.board_view .box .list li a .tit span{ max-width:85%; line-height:20px; font-size:13px;}
	.board_view .box .list li a .tit font{ line-height:20px; font-size:10px;}
}




.board_write{}
	.board_write ul{ margin:-15px -7.5px 0 -7.5px;}
	.board_write ul li{ float:left; margin:15px 0 0 0; width:100%;}
	.board_write ul li a{ margin:0 7.5px;}
	
	.board_write input{ display:block; padding:0 15px; width:100%; height:50px; border:1px solid #DDD; border-radius:0; background:#FFF; line-height:50px; font-size:15px; color:#333; outline:none; -webkit-appearance:none;}
	.board_write textarea{ display:block; padding:15px; width:100%; max-width:100%; min-width:100%; height:200px; max-height:200px; min-height:200px; border:1px solid #DDD; border-radius:0; background:#f5f5f5; line-height:25px; font-size:15px; color:#333; outline:none; -webkit-appearance:none;}
	.board_write select{ display:block; margin:0; padding:0 35px 0 15px; width:100%; height:50px; border-radius:0; border:1px solid #DDD; background:url(../../images/select_icon.png) no-repeat center right 10px #FFF; background-size:15px auto; line-height:50px; font-size:15px; color:#666; outline:none; -webkit-appearance:none;}
	.board_write select::-ms-expand{ display:none;}
	
	.board_write .number{ position:relative; padding:0 150px 0 0;}
	.board_write .number input{ background:#f5f5f5;}
	.board_write .number span{ display:block; position:absolute; top:0; right:0; width:151px; height:50px; border:1px solid #DDD; background:#FFF; text-align:center; line-height:50px; font-size:15px; color:#17b73f;}
@media(max-width:767px){
	.board_write ul{ margin:-10px -5px 0 -5px;}
	.board_write ul li{ margin:10px 0 0 0; width:100% !important;}
	.board_write ul li a{ margin:0 5px;}
	
	.board_write input{ padding:0 10px; height:40px; line-height:40px; font-size:15px;}
	.board_write textarea{ padding:10px; height:100px; max-height:100px; min-height:100px; font-size:15px;}
	.board_write select{ height:40px; line-height:35px; font-size:15px;}
	
	.board_write .number{ padding:0 120px 0 0;}
	.board_write .number span{ width:121px; height:40px; line-height:40px; font-size:15px;}
}


.board_menu{  position: sticky;
z-index: 1;
top: 0px;}
    .board_menu ul {overflow:hidden; padding:1px 0 0 1px;}
    .board_menu ul li {float:left; width:25%;}
    .board_menu ul li a {display: block; height: 32px; height:70px; line-height:68px; font-size: 18px; text-align:center; padding: 0 15px; text-decoration: none; border:1px solid #e5e5e5; color: #333; background-color: #fff; cursor:pointer; margin:-1px 0 0 -1px;}
    .board_menu ul li a p{ text-align:center; line-height:68px; font-size:18px; font-weight:700; cursor:pointer;}
    .board_menu ul li a:hover, .board_menu ul li a:focus { position: relative; color: #ee2c3c; border-color: ##ee2c3c;}
    .board_menu ul li a.on { position: relative; background: #ee2c3c; border-color: #ee2c3c; color: #fff; }
    .board_menu ul li.on a p{ color:#FFF;}

@media(max-width:1200px){
	.board_menu ul{ padding:1px 0 0 1px;}
	.board_menu ul li{ width:50%;}
	.board_menu ul li a{ margin:-1px 0 0 -1px;}
	.board_menu ul li a p{ font-size:16px;}
}
@media(max-width:767px){
	.board_menu{ display:block;}
	.board_menu ul li{ width:100%;}
	.board_menu ul li a{ height:50px;}
	.board_menu ul li a p{ padding-top:10px; line-height:15px; font-size:15px;}
}
	
	
	
	
.privacy{}
	.privacy .tit{ margin:50px 0 10px 0; line-height:25px; font-size:20px; font-weight:700; color:#333;}
	.privacy .tit02{ margin:0 0 90px 0; line-height:25px; font-size:18px; font-weight:400; color:#666;}
	.privacy .txt{ line-height:25px; font-size:16px; font-weight:400; color:#666;}
	.privacy .txt02{ overflow:hidden; padding:0 0 0 30px;}
	.privacy .txt02 li{ list-style:decimal-leading-zero; margin:5px 0 0 0; line-height:25px; font-size:16px; color:#666;}
	.privacy .txt02 li:first-child{ margin:0;}
@media(max-width:767px){
	.privacy .tit{ line-height:25px; font-size:20px;}
	.privacy .tit02{ margin:0 0 50px 0; line-height:25px; font-size:18px;}
	.privacy .txt{ line-height:25px; font-size:15px;}
	.privacy .txt02 li{ font-size:15px;}
	.privacy .box{ padding:30px !important;}
}

.col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; }
.col-md-3, .col-lg-3, .col-lg-6 { position: relative; width: 100%; padding: 8px; }  
.col-md-3 { flex: 0 0 100%; max-width: 100%; }
.col-lg-6 { flex: 0 0 100%; max-width: 100%; }
.img-position { position: absolute; display:block; padding:15px; left: 0%; top: 15%; border: solid #fff; border-width: 5px 5px 5px 0px; }

@media (min-width: 1200px) {
	.col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; }
	.col-md-3, .col-lg-3, .col-lg-6 { position: relative; width: 100%; padding: 15px; } 
	.col-md-3 { flex: 0 0 25%; max-width: 25%; }
	.col-lg-6 { flex: 0 0 100%; max-width: 100%; }
}
@media (min-width: 768px) {
	.col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; }
	.col-md-3, .col-lg-3, .col-lg-6 { position: relative; width: 100%; padding: 15px; } 
	.col-md-3 { flex: 0 0 25%; max-width: 25%; }
	.col-lg-6 { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; }
	.img-position { position: absolute; left: 30%; top: 15%; border: solid #fff; border-width: 5px 5px 5px 0px; }
}
	

mt-4, .my-4 { margin-top: 1.5rem !important; }

.area-box:hover {  
	background: var(--secondary-color); 
	transition: .3s;
	box-shadow: 0 25px 98px 0 rgba(0, 0, 0, 0.1);
}
.area-box {
	padding: 25px 30px;
	position: relative;
	z-index: 1;
	border-radius: var(--border-radius-full);
	box-shadow: 0 25px 98px 0 rgba(0, 0, 0, 0.03);
	background-color: var(--bg-color);
}

h4 a.title-head {
	font-size: 22px;
	font-weight: 600;
	display: block;
	color: var(--heading-color);
}  

h4 a.title-head:hover {
	color: var(--primary-color);
}

.area-box:hover h4 a.title-head {
	color: #fff;
}

.area-box:hover p {
	color: #ddd;
}

.grids-feature i.fa, i.fas {
	background: var(--primary-color);
	font-size: 26px;
	border-radius: 54% 46% 71% 29% / 72% 61% 39% 28%;
	width: 65px;
	height: 65px;
	line-height: 65px;
	color: #fff;
	text-align: center;
	margin: 30px 0;
}
.fa, .fas {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.about-left h3 { text-transform: capitalize; line-height: 40px; font-size: 36px; font-weight: 600; letter-spacing: 0px; color: #153a7d;}
.about-left span.fa { color: #30c39e; font-size: 40px; margin-bottom: 15px; }
.img-border { }


.pt-lg-3, .py-lg-3 { padding-top: 1rem !important; }
.mb-4, .my-4 { margin-bottom: 1.5rem !important; }
.mt-5, .my-5 { margin-top: 3rem !important; }

.mp{ margin: 0; line-height: 1.5; color: #707579; font-size: 16px; letter-spacing: .2px; }

.img-fluid { max-width: 100%; height: auto; }
.d-flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; }
.ml-auto, .mx-auto { margin-left: auto !important; }
img { vertical-align: middle; border-style: none; }

.position-relative { position: relative !important; }
.position-absolute { position: absolute !important; }
.position-fixed { position: fixed !important; }

.img-border {
}
.ml-auto, .mx-auto {
    margin-left: auto !important;
}
.d-flex {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}
.img-fluid {
    max-width: 100%;
    height: auto;
}
img {
    vertical-align: middle;
    border-style: none;
}