@charset "utf-8";
/*───────────────────────────────────────────────────────────
	
	header, footer, main 관련 작성 css 파일입니다.

	** 이와 서브페이지 관련 css는 /css/sub.css 에 있습니다.

───────────────────────────────────────────────────────────*/
.pc{display:block;}
.mobile,.tablet{display:none;}


/*───────────────────────────────────────────────────────────
	layout common
───────────────────────────────────────────────────────────*/
#wrap {position:relative;height:100%;width:100%;margin:0;padding:0;} /* #header 와 #container, #footer 전체 감싸는 영역 */
#wrap #header {width:100%;margin:0;padding:0;}
#wrap #container {width:100%;margin:0;padding:0;}
#wrap #footer {width:100%;margin:0;padding:0;}
	/* #container 안의 레이아웃 */
#contents_wrap {width:1200px;margin:0 auto;padding:0;position:relative;z-index:1;box-sizing:border-box;} /* #container 안의 컨텐츠 감싸는 영역 */
#contents_wrap #side_box {width:100%;padding:5.6% 0 0 0;box-sizing:border-box;} /* lnb 감싸는 영역 */
#contents_wrap #contents_box {width:100%;padding:5.6% 0 7.2% 0;box-sizing:border-box;} /* 컨텐츠를 감싸는 영역 */
#contents_wrap #side_box + #contents_box {padding-top:0;} /* lnb와 컨텐츠가 float 일때 사이즈 재설정 */
	/* navigation layout */
#contents_wrap .nav_wrap {box-sizing:border-box;}
	/* #content */
#content {width:100%;margin:0;padding:0;text-align:left;box-sizing:border-box;} /* navigation 을 제외한 컨텐츠 */
#content .sub_content{width:100%;margin:0 auto;background:#fff;box-sizing:border-box;}
#content .sub_content:after {clear:both;content:"";display:block;}
	/* 컨텐츠 전체 가로 사이즈 */
.w_custom {width:1200px;text-align:left;margin:0 auto;padding:0;box-sizing:border-box;}

@media only screen and (max-width:1217px) {
	body.on {height:100%;overflow:hidden;}
	#contents_wrap {width:100%;padding-left:12px !important;padding-right:12px !important;}
	.w_custom{width:100%;padding-left:12px !important;padding-right:12px !important;}
}
@media only screen and (max-width:1200px) {
	
}
@media only screen and (max-width:1023px) {
	#contents_wrap #side_box {padding:4.8% 0 0 0;}
	#contents_wrap #contents_box {padding:4.8% 0 6.4% 0;}
}
@media only screen and (max-width:860px) {
	#contents_wrap #side_box {padding:4.2% 0 0 0;}
	#contents_wrap #contents_box {padding:4.2% 0 6.4% 0;}
}
@media only screen and (max-width:767px) {
	.w_custom {padding-left:4% !important;padding-right:4% !important;}
}
@media only screen and (max-width:640px) {
	#contents_wrap #contents_box {padding:4.2% 0 10.4% 0;}
}
@media only screen and (max-width:479px) {
	#contents_wrap #contents_box {padding:4.2% 0 12% 0;}
}


/*───────────────────────────────────────────────────────────
	sub custom
───────────────────────────────────────────────────────────*/
/*** company/history (연혁) ***/
	/* 연도 */
.sub_history.history1 .history_box .his_year .year strong {background:#0fbfd8;}
/* 원 */.sub_history.history1 .history_box .his_year .year::before {background-color:#0fbfd8;}
/* 삼각형 */.sub_history.history1 .history_box .his_year .year strong::after {border-bottom:12px solid #0fbfd8;border-color:#0fbfd8 !important;}

/*** company/history2 (연혁2) ***/
	/* 연도 */
.sub_history.history2 .history_box .his_year .year strong {color:#4aabe6;}
.sub_history.history2 .history_box .his_year .year strong::before {background:#4aabe6;}
.sub_history.history2 .history_box .his_year .year strong::after {border-color:#4aabe6;}

/*** company/history3 (연혁3) ***/
	/* 연도 */
.sub_history.history3 .history_box table.history span {color:#49abe6;}

/*** company/work (조직도1번) ***/
.sub_chart.chart1 .chart .chart_box h3 + h3 {background:#0fbfd8;}


/*───────────────────────────────────────────────────────────

	 HEADER | outline/header.html, outline/nav.html

───────────────────────────────────────────────────────────*/
.skip_nav {position:relative;z-index:9999;}
.skip_nav a {display:block;height:1px;width:1px;margin-bottom:-1px;overflow:hidden;font-size:12px;color:#fff;font-weight:bold;white-space:nowrap;text-align:center;}
.skip_nav a:focus, .skip_nav a:active {height:auto;width:100%;padding:0;margin-bottom:0;position:absolute;left:0;top:0;}

#header {position:relative;/*position:fixed; left:0; top:0; z-index:1000*/ height:80px; width:100%; transition:0.3s;}
#header.down01 {opacity:0;}
#header.down02 {display:none;}
#header .hd_content {position:relative;z-index:100;width:100%;height:100%;background-color:#ffffff;}
#header h1.hd_logo {float:left;margin:23px 0 0 20px;font-size:0px;}
#header h1.hd_logo a img {height:34px;}
#header .btn_mMenu {position: absolute;overflow:hidden;width: 24px;height: 34px;right: 10px;top: 50%;margin-top: -17px;}
#header ul.hd_gnb {float:right;padding-right:20px;}
#header ul.hd_gnb > li {float:left;font-size:0px;text-align:center;line-height:80px;}
#header ul.hd_gnb > li > a {font-size:12px;color:#888888;}
#header ul.hd_gnb > li:after {display:inline-block;width:15px;font-size:12px;color:#888888;content:'|';}
#header ul.hd_gnb > li:last-of-type:after {display:none;}
#header ul.hd_lnb {float:right;padding-right:34px;}
#header ul.hd_lnb > li {float:left;margin:0 46px;line-height:80px;}
#header ul.hd_lnb > li > a {display:block;font-size:14px;color:#333333;font-weight:700;}
#header ul.hd_lnb > li:hover a {color:#0fbfd8;}
#header ul.hd_lnb > li > .hd_all_sub {display:none;}


.menu-trigger, .menu-trigger2 {width:100%;line-height:18px;padding: 0;box-sizing:border-box;margin:0;display:inline-block;position:relative;}
.menu-trigger span, .menu-trigger2 span {transition:0.3s;position:absolute;left: 0px;width:24px;height:2px;background-color: #3d3d3d;}
.menu-trigger, .menu-trigger span, .menu-trigger2, .menu-trigger2 span {display: inline-block;transition: all .4s;box-sizing: border-box;}
.menu-trigger span:nth-of-type(1) {top: 0;}
.menu-trigger span:nth-of-type(2) {top: 6px;}
.menu-trigger span:nth-of-type(3) {top: 12px;}
.menu-trigger.active-1 .menu-trigger2.active-1 {}
.menu-trigger.active-1 span:nth-of-type(1){-webkit-transform: translateY (8px) rotate (-45deg);transform: translateY(5px) rotate(-45deg);}
.menu-trigger.active-1 span:nth-of-type(2){opacity:0;}
.menu-trigger.active-1 span:nth-of-type(3){-webkit-transform: translateY(-8px) rotate(45deg);transform: translateY(-7px) rotate(45deg);}

.menu-trigger2 span{height: 2px;width: 48px;}
.menu-trigger2.active-1 span:nth-of-type(1){-webkit-transform: translateY (8px) rotate (-45deg);transform: translateY(8px) rotate(-45deg);}
.menu-trigger2.active-1 span:nth-of-type(2){opacity:0;}
.menu-trigger2.active-1 span:nth-of-type(3){-webkit-transform: translateY(8px) rotate(45deg);transform: translateY(8px) rotate(45deg);}


#header .btn_mMenu,
#aside {display:none;}

.aside_bg {left:0px;top:0px;width:100%;height:100%;background: transparent;opacity:0;transition:0.8s;z-index: 2;position:fixed;}
.aside_bg.on {opacity:1;}

	@media only screen and (max-width:1217px) {
		.tablet {display:block;}
		.pc, .mobile {display:none;}

		#header {height:60px;}
		#header h1.hd_logo {float:left;margin:17px 0 0 13px;font-size:0px;}
		#header h1.hd_logo a img {height:26px;}
		#header ul.hd_gnb {padding-right:7px;}
		#header ul.hd_gnb > li {line-height:60px;}
		#header ul.hd_gnb > li > a,
		#header ul.hd_gnb > li:after {font-size:12px;}
		#header ul.hd_lnb {padding-right:20px;}
		#header ul.hd_lnb > li {margin:0 15px;line-height:60px;}
		#header ul.hd_lnb > li > a {font-size:12px;}
	}

	@media only screen and (max-width: 767px) {
		.pc, .tablet {display:block;}
		#header .btn_mMenu, 
		#aside{display:block;}

		#header {height:60px;border-bottom:1px solid #c7c9c9;}
		#header h1.hd_logo {float:left;margin:18px 0 0 7px;font-size:0px;}
		#header h1.hd_logo a img {height:26px;}

		#header div.hd_cate_btn {float:right;width:24px;height:24px;margin:19px 7px 0 0;background:url("../images/skin/hd_cate.png") no-repeat center center;background-size:100% auto;cursor:pointer;}
		#header div.hd_cate_btn.on {background-image:url("../images/skin/hd_cate_close.png");}
		#header div.hd_menu {display:none;}
		
		#aside {top: 61px;right: -300px;width: 300px;height: calc(100% - 61px);box-sizing:border-box;box-sizing:border-box;display:block;position:fixed;background:#fff;z-index: 999;border-left: 1px solid #c7c9c9;transition: 0.5s;}
		#aside.on {right: 0%;}
		#aside .aside_box {width:100%;height:100%;margin:0;padding:0;overflow-y:auto;position:relative;z-index:1;box-sizing:border-box;}
		#aside .aside_box .hd_gnb{width: 100%;padding: 22px 26px;border-bottom: 1px solid #0fbfd8;box-sizing: border-box;overflow: hidden;}
		#aside .aside_box .hd_gnb li{width: 110px;height: 44px;line-height: 44px;display: inline-block;vertical-align: middle;}
		#aside .aside_box .hd_gnb li a{border-color: #0fbfd8;background: #0fbfd8;color: #ffffff;display: block;width: 100%;height: 100%;box-sizing: border-box;font-size: 14px;line-height: 42px;text-align: center;}
		#aside .aside_box .hd_gnb li + li{float: right;}
		#aside .aside_box .hd_gnb li + li a{border: 1px solid #888888;color: #888888;background: #fff;}
		#aside .aside_box .hd_gnb li + li + li{display:none;}
		#aside .menu_top {height:80px;padding:0 20px;background:#d80000;}
		#aside .menu_top .btn_mMenuClose {float:left;width:36px;height:36px;margin-top: 30px;cursor:pointer;font-size:0px;}
		#aside .menu_top .menu_gnb {float:right;}
		#aside .menu_top .menu_gnb li {float:left;margin-left: 42px;}
		#aside .menu_top .menu_gnb li a {display:block;font-size:20px;color:#ffffff;font-weight:300;line-height:80px;}
		#aside .menu_sch {padding:10px 20px 28px;}
		#aside .menu_sch form {display:block;position:relative;height: 60px;border-bottom:1px solid #d80000;font-size:0px;}
		#aside .menu_sch form #search {width:100%;height: 60px;padding:0 10px;border:0 none;box-sizing:border-box;font-size:25px;font-weight:300;}
		#aside .menu_sch form button {position:absolute;top:0;right:0;width:33px;height:100%;}
		#aside .menu_sch form button img {width:100%;}

		#aside ul.slidemenu {width: 100%;padding: 10px 0 0 0;}
		#aside ul.slidemenu > li {margin: 3px 0 3px 0;}
		#aside ul.slidemenu > li + li {}
		#aside ul.slidemenu > li.now > ul {display:block;}
		#aside ul.slidemenu > li > a {display:block;position: relative;height: 44px;font-size: 14px;color: #333333;line-height: 44px;font-weight: 600;box-sizing: border-box;width: 100%;}
		#aside ul.slidemenu > li > a.dep1_a{padding:0 34px;}
		#aside ul.slidemenu > li > a span{width: 100%;background: url("../images/skin/hd_cate_arr.png") no-repeat 89%;background-size: 16px auto;box-sizing: border-box;display: block;height: 44px;font-size: 14px;color: #333333;line-height: 44px;font-weight: 600;padding: 0 34px;}
		#aside ul.slidemenu > li > a .menu_arr{display:none;}
		#aside ul.slidemenu > li > a.now {}
		#aside ul.slidemenu > li > a.now span{background: url('../images/skin/hd_cate_arr_on.png') no-repeat 89% #0fbfd8;background-size: 16px auto;color: #fff;}

		#aside ul.slidemenu > li > a.now .menu_arr{background:#fff url("../images/skin/side_arr_ov.gif") no-repeat 94% center;width:17px;height:17px;background-size:100% auto;}
		#aside ul.slidemenu > li > a.now > ul {display:block;}
		#aside ul.slidemenu > li > ul {padding: 10px 0 0 50px;display:none;}
		#aside ul.slidemenu > li > ul > li {}
		#aside ul.slidemenu > li > ul > li a {display: block;font-size: 12px;color: #888888;line-height: 250%;}
		#aside ul.slidemenu > li > ul > li a:hover, 
		#aside ul.slidemenu li dl dd a.on {font-weight:500;}


	}




/*───────────────────────────────────────────────────────────

	 FOOTER | outline/footer.html

───────────────────────────────────────────────────────────*/
#footer {background:#333333; height:210px;text-align:center;}
#footer p.ft_logo {padding-top:60px;}
#footer p.ft_logo img {height:22px;}
#footer p.ft_copy {padding-top:35px;font-size:16px; color:#888888; font-weight:700;line-height:100%;}

	@media only screen and (max-width:1217px) {

		#footer {height:150px;}
		#footer p.ft_logo {padding-top:28px;}
		#footer p.ft_logo img {height:43px;}
		#footer p.ft_copy {padding-top:26px;font-size:12px;}

		
	}
	@media only screen and (max-width:1217px) {
		#footer {height:150px;}
		#footer p.ft_logo {padding-top:28px;}
		#footer p.ft_logo img {height:43px;}
		#footer p.ft_copy {padding-top:26px;font-size:12px;}
	}

	@media only screen and (max-width:767px) {
		#footer {height:110px;}
		#footer p.ft_logo {padding-top:26px;}
		#footer p.ft_logo img {height:28px;}
		#footer p.ft_copy {padding-top:20px;font-size:12px;}
	}





/*───────────────────────────────────────────────────────────

	 SIDE_BOX | outline/left_bbs.html｜outline/left_goods.html｜outline/left_member.html｜outline/left_service.html

───────────────────────────────────────────────────────────*/

#side_box {padding-bottom:1.8%;}
#side_box .sub_menu {width:100%;padding:0;margin:0;z-index:2;text-align:center;vertical-align:top;}
#side_box .sub_menu dl {position:relative;display:inline-block;margin:0 auto;z-index:3;font-size:0;text-align:center;vertical-align:top;padding:0;}
#side_box .sub_menu dt,
#side_box .sub_menu dd {display:inline-block;margin:0;padding:0;}
#side_box .sub_menu dt {display:none;}
#side_box .sub_menu dd {line-height:31px;height:32px;padding:0 12px;border-bottom:1px #ccc solid;position:relative;z-index:1;box-sizing:border-box;vertical-align:top;}
#side_box .sub_menu dd + dd {}
#side_box .sub_menu dd a,
#side_box .sub_menu dd strong {height:31px;line-height:31px;font-size:15px;font-weight:600;padding:0 2px;color:#888;display:inline-block;box-sizing:border-box;vertical-align:top;}
#side_box .sub_menu dd:hover a,
#side_box .sub_menu dd.on a,
#side_box .sub_menu dd strong {border-color:#333;color:#0fbfd8;position:relative;}
#side_box .sub_menu dd:hover a:before,
#side_box .sub_menu dd.on a:before, 
#side_box .sub_menu dd strong:before {bottom:-1px;width:100%;height:2px;background:#0fbfd8;left:50%;transform:translateX(-50%);position:absolute;content:"";display:block;}

	@media only screen and (max-width:1200px) {

	}
	@media only screen and (max-width:1023px) {
		
	}
	@media only screen and (max-width:860px) {
		#side_box .sub_menu dd {line-height:29px;height:30px;padding:0 8px;}
		#side_box .sub_menu dd a,
		#side_box .sub_menu dd strong {height:29px;line-height:29px;font-size:14px;padding:0 2px;}
	}
	@media only screen and (max-width:767px) {

	}
	@media only screen and (max-width:640px) {
		#side_box .sub_menu dd {line-height:27px;height:28px;padding:0 8px;}
		#side_box .sub_menu dd a,
		#side_box .sub_menu dd strong {height:27px;line-height:27px;font-size:14px;padding:0 2px;}
	}
	@media only screen and (max-width:479px) {
		#side_box {display:none;}
	}





/*───────────────────────────────────────────────────────────

	 INDEX | index.html

───────────────────────────────────────────────────────────*/
.main_visual {width:100%;min-width:1200px;margin:0;}
.main_visual .slick-list{width:100%;}
.main_visual .slick-slide {overflow:hidden;position:relative;text-align:center; height:868px;}
.main_visual .slick-slide a {display:inline-block;height:100%;width:1920px; max-width:1920px; margin:0 auto;text-align:Center;transform:translateX(-50%);position:absolute;left:50%;top:0;outline:0;}
.main_visual .slick-slide img {display:inline-block;height:auto; width:100%; max-width:1920px;}

.main_visual .slick-arrow {display:inline-block; position:absolute; top:50%; margin-top:-40px; font-size:0px; width:80px; height:80px; z-index:10;}
.main_visual .slick-arrow.slick-prev {left:60px; background:url("../images/skin/visual_arr_prev.png") no-repeat;}
.main_visual .slick-arrow.slick-next {right:60px; background:url("../images/skin/visual_arr_next.png") no-repeat;}
.main_visual .slick-arrow.slick-prev:hover {background:url("../images/skin/visual_arr_prev_ov.png") no-repeat;}
.main_visual .slick-arrow.slick-next:hover {background:url("../images/skin/visual_arr_next_ov.png") no-repeat;}
.main_visual .slick-dots {position:absolute;z-index:10;left:50%;bottom:123px;transform:translateX(-50%);font-size:0px;}

.main_visual .slick-dots li {display:inline-block;margin:0 5px;}
.main_visual .slick-dots li button {width:21px;height:4px;background:#dddddd;font-size:0px;}
.main_visual .slick-dots li.slick-active button {width:56px;background:#0fbfd8;}
.main_visual .auto_control {display:none; position:absolute; right:20px; bottom:20px; font-size:0px;}
.main_visual .auto_control a {display:inline-block; width:auto; height:auto; font-size:25px; font-weight:bold; margin-left:10px; text-shadow:#ffffff 0px 0px 5px;}
.main_visual .auto_control a.on {color:#fff; text-shadow:#000 0px 0px 5px;}

.main_title {position:relative;padding:100px 0 30px;text-align:center;}
.main_title:after {display:block;position:absolute;left:50%;bottom:0;margin-left:-30px;width:60px;height:2px;background:#0fbfd8;content:'';}
.main_title .bld {font-size:40px;color:#333333;font-weight:700;}
.main_title .desc {padding-top:15px;font-size:16px;color:#888888;line-height:170%;}

.main_btn {display:inline-block;width:50.698113%;height:23.0263157%;border:2px solid #888888;box-sizing:border-box;text-align:center;line-height:23.0263157%;}
.main_btn span {display:inline-block;font-size:1vw;color:#888888;line-height:56px;}
.main_btn.point {border-color:#0fbfd8;}
.main_btn.point span {color:#0fbfd8;}
.more_btn {width:200px; height:60px;}

.main_about {}
.main_about .main_about_cont {}
.main_about .main_about_cont .pic {float:right;width:50%;height:628px;background:url("../images/skin/main_about_bg.jpg") no-repeat center center;background-size:cover;}
.main_about .main_about_cont .text {float:left;width:50%;height:628px;background:#f8f8f8;text-align:center;}
.main_about .main_about_cont .text .align {display:inline-block;text-align:left; max-width:500px;}
.main_about .main_about_cont .text .align .sec_title {position:relative;padding:106px 0 18px;font-size:28px;color:#333333;line-height:100%;}
.main_about .main_about_cont .text .align .sec_title:after {display:block;position:absolute;left:0;bottom:0;width:72px;height:4px;background:#0fbfd8;content:'';}
.main_about .main_about_cont .text .align .sec_desc {padding:30px 0 40px;font-size:16px;color:#333333;line-height:170%;}
.main_about .main_about_cont .text .align .sec_desc2 {padding:0 0 40px;font-size:25px;color:#333333;line-height:120%;}
.main_about .main_about_cont .text .align .sec_desc2 strong {font-weight:700; font-size:28px;}
.main_about .main_about_cont .text .align .sec_btn {}
.main_about .main_about_cont .text .align .sec_btn a:hover {background:#0fbfd8;}
.main_about .main_about_cont .text .align .sec_btn a:hover span {color:#ffffff;}

.main_bbs {padding:0 0 150px;}
.main_bbs .main_tab {padding:40px 0 80px;font-size:0px;text-align:center;}
.main_bbs .main_tab div {display:inline-block;margin:0 40px;background:none;border:0 none;font-size:20px;color:#888888;line-height:40px;font-weight:400;cursor:pointer;}
.main_bbs .main_tab div.on {color:#333333;font-weight:700;}

.main_bbs .main_bbs_list {}
.main_bbs .main_bbs_list .list {display:none;}
.main_bbs .main_bbs_list .list.on {display:block;}
.main_bbs .main_bbs_list .list > ul > li {float:left;width:25%;position:relative;}
.main_bbs .main_bbs_list .list > ul > li:nth-of-type(4n + 1) {clear:both;}
.main_bbs .main_bbs_list .list > ul > li > a {display:block;position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;}
.main_bbs .main_bbs_list .list > ul > li .pic {position:relative;z-index:1;width:100%; padding-bottom:95%; overflow:hidden;}
.main_bbs .main_bbs_list .list > ul > li .pic img {  width: auto; height: auto;min-width: 100%; min-height: 100%;max-width: initial;max-height: initial;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.main_bbs .main_bbs_list .list > ul > li .bg {display:none;position:absolute;z-index:2;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);}
.main_bbs .main_bbs_list .list > ul > li .cont {display:none;position:absolute;z-index:3;bottom:0;right:0;padding:7px 20px 3px 20px;margin:0 12.5% 12.5% 0;border-right:4px solid #ffffff;box-sizing:border-box;width:87.5%}
.main_bbs .main_bbs_list .list > ul > li .cont .title {font-size:24px;color:#ffffff;font-weight:700;line-height:32px;white-space: nowrap;overflow:hidden;text-overflow: ellipsis;}
.main_bbs .main_bbs_list .list > ul > li .cont .cate {padding-top:15px;font-size:14px;color:#888888;font-weight:700;white-space: nowrap;overflow:hidden;text-overflow: ellipsis;}
.main_bbs .main_bbs_list .list > ul > li:hover .bg,
.main_bbs .main_bbs_list .list > ul > li:hover .cont {display:block;}
.main_bbs .main_bbs_list .more {display:none;padding:50px 0 0 0;text-align:center;}
.main_bbs .main_bbs_list .more.on {display:block;}

.main_why {position:relative; height:150px; padding-bottom:25%;background:url("../images/skin/main_why_bg.jpg") no-repeat center center fixed;background-size:cover;text-align:center;}
.main_why_box{position:absolute; width:50%; left:50%; top:50%; transform:translate(-50%, -50%);  }
.main_why .bld {font-size:160px;color:#ffffff;font-weight:700;line-height:110%;}
.main_why .sub {padding-top:33px;font-size:40px;color:#0fbfd8;font-weight:700;line-height:100%;}
.main_why .desc {padding-top:25px;font-size:20px;color:#ffffff;line-height:180%;}

.main_benefit {padding:100px 0 100px;}
.main_benefit ul {margin:0 auto;font-size:0px;text-align:center;}
.main_benefit ul li {display:inline-block;position:relative;width:20%;}
.main_benefit ul li:after {display:block;position:absolute;top:50%;right:0;margin-top:-61px;width:1px;height:123px;background:#dddddd;content:'';}
.main_benefit ul li:last-of-type:after {display:none;}
.main_benefit ul li .pic {height:109px;background:no-repeat center center;background-size:auto 100%;}
.main_benefit ul li.li01 .pic {background-image:url("../images/skin/main_char_ico01.png");}
.main_benefit ul li.li02 .pic {background-image:url("../images/skin/main_char_ico02.png");}
.main_benefit ul li.li03 .pic {background-image:url("../images/skin/main_char_ico03.png");}
.main_benefit ul li.li04 .pic {background-image:url("../images/skin/main_char_ico04.png");}
.main_benefit ul li .text {padding-top:35px;font-size:20px;color:#333333;line-height:100%;}
.main_benefit ul li .text span {font-size:20px; color:#0fbfd8;}

.main_progress {padding:0 0 232px;text-align:center;}
.main_progress .prgs_title {font-size:40px;color:#333333;letter-spacing:-0.05em;}
.main_progress .prgs_cont {height:280px;margin:60px 0 65px;background:#f5f5f5;}
.main_progress .prgs_cont .align {height:100%;padding:0 100px;font-size:0px;}
.main_progress .prgs_cont .align > li {display:inline-block;position:relative;width:20%;height:100%;}
.main_progress .prgs_cont .align > li:after {display:block;position:absolute;top:0;right:0;margin-right:-6px;width:12px;height:100%;background:url("../images/skin/main_portfolio_arr.png") no-repeat right center;background-size:100% auto;content:'';}
.main_progress .prgs_cont .align > li:last-of-type:after {display:none;}
.main_progress .prgs_cont .align > li .title {padding-top:97px;font-size:24px;color:#333333;}
.main_progress .prgs_cont .align > li .desc {padding-top:17px;font-size:16px;color:#888888;}
.main_progress .prgs_btn {font-size:0px;}
.main_progress .prgs_btn a {margin:0 20px;}

.main_value {background:#0fbfd8;height:280px;text-align:center;}
.main_value .align {width:1200px;margin:0 auto;font-size:0px;}
.main_value .align > li {display:inline-block;width:33.33%;height:100%;background:no-repeat center 44px;background-size:auto 36px;color:#ffffff;}
.main_value .align > li.li01 {background-image:url("../images/skin/main_info_ico01.png");}
.main_value .align > li.li02 {background-image:url("../images/skin/main_info_ico02.png");}
.main_value .align > li.li03 {background-image:url("../images/skin/main_info_ico03.png");}
.main_value .align > li .bld {padding-top:118px;font-size:51px;font-weight:700;}
.main_value .align > li .bld span {font-size:20px;}
.main_value .align > li .sml {padding-top:33px;font-size:15px;}

.main_btm {height:607px;}
.main_btm .main_info {float:left;width:50%;}
.main_btm .main_info .align {width:90%;height:100%;margin:0 auto;padding-top:5%;}
.main_btm .main_info .sec_title {height:130px;font-size:28px;color:#333333;font-weight:700;line-height:131px;}
.main_btm .main_info ul {}
.main_btm .main_info ul li {padding:20px;border-top:1px solid #dddddd;box-sizing:border-box;font-size:0px;}
.main_btm .main_info ul li .cate {display:inline-block;vertical-align:top;width:25%;padding-left:27px;background:no-repeat left center;background-size:16px 16px;box-sizing:border-box;font-size:16px;color:#333333;font-weight:700;line-height:16px;}
.main_btm .main_info ul li .cont {display:inline-block;vertical-align:top;width:75%;font-size:14px;color:#888888;line-height:150%;}
.main_btm .main_info ul li .cont a {color:#888888;font-size:14px;}
.main_btm .main_info ul li.li01 .cate {background-image:url("../images/skin/main_loc_ico01.png");}
.main_btm .main_info ul li.li02 .cate {background-image:url("../images/skin/main_loc_ico02.png");}
.main_btm .main_info ul li.li03 .cate {background-image:url("../images/skin/main_loc_ico03.png");}
.main_btm .main_info ul li.li04 .cate {background-image:url("../images/skin/main_loc_ico04.png");}
.main_btm .main_map {float:left;width:50%;height:100%;background:#f0ede5;}


	@media only screen and (max-width:1550px){

		.main_progress {padding:0 0 85px;}
		.main_progress .prgs_title {font-size:25px;}
		.main_progress .prgs_cont {height:140px;margin:30px 0 38px;}
		.main_progress .prgs_cont .align {height:100%;padding:0 0;}
		.main_progress .prgs_cont .align > li:after {margin-right:-4px;width:8px;}
		.main_progress .prgs_cont .align > li .title {padding-top:35px;font-size:16px;}
		.main_progress .prgs_cont .align > li .desc {padding-top:25px;font-size:12px;}

	}

	@media only screen and (max-width:1480px) {
		.slick-arrow{display:none !important;}
	}

	@media only screen and (max-width:1217px) {
		.main_visual {min-width:100%; height:auto;}
		.main_visual .slick-slide {height:auto;}
		.main_visual .slick-slide a {width:100%;max-width:100%;transform:translateX(0%);position:static;left:0%;top:0;}
		.main_visual .slick-slide img {max-width:100%;}
		.main_visual .slick-dots {position:absolute;z-index:10;left:50%;bottom:15px;transform:translateX(-50%);font-size:0px;}

		#content .main_title .desc {padding-top:15px;}

		.main_bbs {padding:0 0 165px;}
		.main_bbs .main_tab {padding:30px 0 25px;}
		.main_bbs .main_tab div {margin:0 23px;}
		.main_bbs .main_bbs_list .list > ul > li {width:50%;}
		.main_bbs .main_bbs_list .list > ul > li:nth-of-type(2n + 1) {clear:both;}
		.main_bbs .main_bbs_list .list > ul > li > a {height:auto;}
		.main_bbs .main_bbs_list .list > ul > li .pic {position:relative;top:0;left:0;width:100%;padding-bottom:70%;transform:none;}
		.main_bbs .main_bbs_list .list > ul > li .cont {display:block;position:relative;top:0;right:0;width:100%;height:100px;padding:0 0 0 0;margin:0 0 0 0;text-align:center;}
		.main_bbs .main_bbs_list .list > ul > li .cont .title {padding-top:15px;font-size:20px;color:#333333;line-height:130%;}
		.main_bbs .main_bbs_list .list > ul > li .cont .title br {display:none;}
		.main_bbs .main_bbs_list .list > ul > li .cont .cate {padding:0 0 0 0;font-size:12px;}
		.main_bbs .main_bbs_list .list > ul > li:hover .bg {display:none;}

		.main_why {height:150px;background:url("../images/skin/main_why_bg.jpg") no-repeat center center;background-size:200%;}
		.main_why .bld {font-size:100px;line-height:110%;}
		.main_why .sub {padding-top:15px;font-size:25px;line-height:100%;}
		.main_why .desc {padding-top:10px;font-size:16px;line-height:180%;}

		.main_benefit {padding:100px 0 100px;}
		.main_benefit ul {width:auto;padding:0 20px;margin:0 auto;font-size:0px;text-align:center;}
		.main_benefit ul li {display:inline-block;position:relative;width:25%;}
		.main_benefit ul li:after {margin-top:-30px;height:60px;}
		.main_benefit ul li .pic {height:55px;}
		.main_benefit ul li .text {padding-top:15px;font-size:16px;}

		.main_value {height:140px;padding:4% 0;}
		.main_value .align {width:auto;padding:0 20px;}
		.main_value .align > li {background-position:center 14px;}
		.main_value .align > li .bld {padding-top:60px;font-size:40px;font-weight:700;}
		.main_value .align > li .bld span {font-size:20px;}
		.main_value .align > li .sml {padding-top:10px;font-size:12px;}

		.main_btm {height:450px;}
		.main_btm .main_info {width:100%;}
		.main_btm .main_info .align {width:95%;}
		.main_btm .main_info .sec_title {height:65px;font-size:20px;line-height:66px;}
		.main_btm .main_info ul {}
		.main_btm .main_info ul li .cate {padding-left:20px;background-size:15px auto;box-sizing:border-box;font-size:16px;line-height:55px;}
		.main_btm .main_info ul li .cont {font-size:14px;line-height:180%;}
		.main_btm .main_info ul li .cont a {color:#888888;}
		.main_btm .main_info ul li.li04 .cont {margin:0 0 0 0;line-height:55px;}
		.main_btm .main_map {float:left;width:100%;height:100%;background:#f0ede5;}

		.main_btn { display: inline-block; width: 250px; height: 56px; border-width: 1px; line-height: 54px;}
		.main_btn span { font-size: 16px; line-height: 54px;}
		.main_btn span span { display: none;}
		.main_benefit ul li .text span {color: #0fbfd8; font-size:16px;}

	}

	@media only screen and (max-width:1023px) {
		.main_about {}
		.main_about .main_about_cont .pic {float:none;width:100%;height:500px;}
		.main_about .main_about_cont .text {float:none;width:100%;height:650px;}
		.main_about .main_about_cont .text .align {text-align:center; width:90%;max-width:100%;}
		.main_about .main_about_cont .text .align .sec_title {display:inline-block;padding:100px 0 4px;font-size:40px;}
		.main_about .main_about_cont .text .align .sec_title:after {width:110px;height:2px;}
		.main_about .main_about_cont .text .align .sec_desc {padding:32px 0 52px;}
		.main_about .main_about_cont .text .align .sec_desc2 {padding:0 0 18px;font-size:30px;}
		.main_about .main_about_cont .text .align .sec_desc2 strong{font-size:30px; }
		.main_about .main_about_cont .text .align .sec_btn {padding:45px 0 0 0;}
	}

	@media only screen and (max-width:767px) {
		.mobile { display: block;}
		.pc, .tablet {display:none;}

		.main_btn {display:inline-block;width:250px;height:56px;border-width:1px;line-height:54px;}
		.main_btn span {font-size:16px;line-height:54px;}
		.main_btn span span {display:none;}

		#content .main_visual .slick-arrow {display:none;}
		#content .main_visual .slick-dots {bottom:15px;}

		#content .main_title {position:relative;padding:80px 0 20px;text-align:center;}
		#content .main_title .bld {font-size:26px;}
		#content .main_title .desc {padding-top:15px;font-size:16px;}

		.main_btn {display:block;width:calc(100% - 14px);margin:0 auto;height:56px;border-width:1px;line-height:54px;}
		.main_btn span {font-size:14px;line-height:54px;}

		.main_bbs {padding:0 0 80px;}
		.main_bbs .main_tab {display:none;}
		.main_bbs .main_bbs_list {padding:60px 2% 0;}
		.main_bbs .main_bbs_list .list > ul > li {width:100%;}
		.main_bbs .main_bbs_list .list > ul > li:nth-of-type(1n) {clear:both;}
		.main_bbs .main_bbs_list .list > ul > li > a {height:auto;}
		.main_bbs .main_bbs_list .list > ul > li .pic {position:relative;top:0;left:0;width:100%;padding-bottom:80%;transform:none;}
		.main_bbs .main_bbs_list .list > ul > li .cont {display:block;position:relative;top:0;right:0;width:100%;height:160px;padding:0 0 0 0;margin:0 0 0 0;text-align:center;}
		.main_bbs .main_bbs_list .list > ul > li .cont .title {padding-top:27px;font-size:14px;line-height:130%;color:#333333;}
		.main_bbs .main_bbs_list .list > ul > li .cont .title br {display:none;}
		.main_bbs .main_bbs_list .list > ul > li .cont .cate {padding:20px 0 10px 0;font-size:16px;color:#333333;}
		.main_bbs .main_bbs_list .list > ul > li .cont:after {display:inline-block;padding:12px 0 0 0;border-bottom:1px solid #54d2e2;font-size:12px;color:#54d2e2;content:'VIEW PROJECTS';}
		.main_bbs .main_bbs_list .list > ul > li:hover .bg {display:none;}

		.main_about {}
		.main_about .main_about_cont .pic {float:none;width:100%;height:315px;}
		.main_about .main_about_cont .text {float:none;width:100%;height:650px;}
		.main_about .main_about_cont .text .align {text-align:center; width:80%;}
		.main_about .main_about_cont .text .align .sec_title {display:inline-block;padding:70px 0 4px;font-size:40px;}
		.main_about .main_about_cont .text .align .sec_title:after {width:110px;height:2px;}
		.main_about .main_about_cont .text .align .sec_desc {padding:32px 0 52px; font-size:16px;}
		.main_about .main_about_cont .text .align .sec_desc2 {padding:0 0 18px;font-size:30px;}
		.main_about .main_about_cont .text .align .sec_desc2 strong{font-size:30px; }
		.main_about .main_about_cont .text .align .sec_btn {padding:45px 0 0 0;}


		.main_why {height:350px;}
		.main_why_box{width:100%;}
		.main_why .bld {font-size:50px;line-height:110%;}
		.main_why .sub {padding-top:38px;font-size:25px;line-height:100%;}
		.main_why .desc {padding-top:25px;font-size:14px;line-height:180%;}

		.main_benefit {padding:100px 0 100px;}
		.main_benefit ul {width:auto;padding:0 0;margin:0 auto;font-size:0px;text-align:center;}
		.main_benefit ul li {display:inline-block;position:relative;width:50%;}
		.main_benefit ul li:after {display:none;}
		.main_benefit ul li:nth-of-type(3),
		.main_benefit ul li:nth-of-type(4) {margin-top:55px;}
		.main_benefit ul li .pic {height:55px;}
		.main_benefit ul li .text {padding-top:15px;font-size:16px;}

		.main_progress {padding:0 0 45px;}
		.main_progress .prgs_title {font-size:25px; word-break:break-all;}
		.main_progress .prgs_cont {height:auto;margin:50px 0 40px;}
		.main_progress .prgs_cont .align {height:100%;padding:30px 0 0 0;}
		.main_progress .prgs_cont .align > li {width:100%;height:145px;}
		.main_progress .prgs_cont .align > li:after {width:100%;height:12px;top:auto;right:auto;bottom:0;left:0;background:url() no-repeat center center;background-size:auto 12px;}
		.main_progress .prgs_cont .align > li .title {padding-top:25px;font-size:20px;}
		.main_progress .prgs_cont .align > li .desc {padding-top:5px;font-size:14px;}
		.main_progress .prgs_btn a {margin:0 auto;}
		.main_progress .prgs_btn a.point {margin-top:10px;}

		.main_value {height:auto;padding:40px 0;}
		.main_value .align {width:auto;padding:0 0;}
		.main_value .align > li {width:100%;height:auto;margin:30px 0;background-position:center 14px;}
		.main_value .align > li .bld {padding-top:60px;font-size:40px;font-weight:700;}
		.main_value .align > li .bld span {font-size:20px;}
		.main_value .align > li .sml {padding-top:10px;font-size:12px;}

		.main_btm {padding-top:50px;height:auto;}
		.main_btm .main_info {width:100%;height:auto;}
		.main_btm .main_info .align {width:100%;padding:0 2%;box-sizing:border-box;}
		.main_btm .main_info .sec_title {height:62px;font-size:20px;line-height:62px;text-align:center;}
		.main_btm .main_info ul {}
		.main_btm .main_info ul li {text-align:center;}
		.main_btm .main_info ul li .cate {width:auto;height:42px;padding-left:20px;background-size:16px auto;box-sizing:border-box;font-size:20px;line-height:42px;}
		.main_btm .main_info ul li .cont {width:100%;margin-top:3px;font-size:14px;line-height:180%;}
		.main_btm .main_info ul li .cont a {color:#888888;}
		.main_btm .main_info ul li.li04 .cont {margin:0 0 0 0;line-height:26px;}
		.main_btm .main_map {width:100%;height:305px;}

	}



	@media only screen and (max-width:640px){

		.main_about {}
		.main_about .main_about_cont .pic {float:none;width:100%;height:250px;background-position:left center;}
		.main_about .main_about_cont .text {float:none;width:100%;height:510px;}
		.main_about .main_about_cont .text .align {width:80%; text-align:center;}
		.main_about .main_about_cont .text .align .sec_title {display:inline-block;padding:40px 0 10px;font-size:30px;}
		.main_about .main_about_cont .text .align .sec_title:after {width:70px;height:2px;}
		.main_about .main_about_cont .text .align .sec_desc {padding:22px 0 40px;font-size:14px;}
		.main_about .main_about_cont .text .align .sec_desc2 {padding:0 0 16px;font-size:18px;}
		.main_about .main_about_cont .text .align .sec_desc2 strong {font-weight:700; font-size:18px !important;}
		.main_about .main_about_cont .text .align .sec_btn {padding:40px 0 0 0;}
		.main_benefit {padding:50px 0 50px;}
		.main_why {padding-bottom:0;}
	}