@charset "UTF-8";


/*********layout*********/
html,body {margin:0; padding:0; width:100%; height:100%;}
.w_1400 {position:relative; width:1200px; margin:0 auto;}
img {-webkit-perspective:1;}


/* header */
#header {position:fixed; top:0; left:0; width:100%; z-index:100; height:100px; background:rgba(255, 255, 255, 0.6);}
#header h1.logo {position:absolute; left:3%; top:32px;}
#header h1.logo img {height:32px;}
#header .m_cate {display:block; position:fixed; right:4%; top:25px;}
#header .m_cate button {text-indent:-9999px; width:50px; height:50px; background:url("../images/quick_category.png") no-repeat center center / 30px 30px;}
#header .m_cate_close {display:none; position:fixed; right:4%; top:25px;}
#header .m_cate_close.on {display:block;}
#header .m_cate_close button {text-indent:-9999px; width:50px; height:50px; background:url("../images/quick_close.png") no-repeat center center / 30px 30px;}
#header #menu {width:100%; height:100%; overflow-y:scroll; overflow-x:hidden; position:fixed; top:-100%; left:0; z-index:9999; background:rgba(255, 255, 255, 1); transition:0.4s;}
#header #menu ul {padding-top:10%;}
#header #menu li {line-height:60px; text-align:center;}
#header #menu li a {transition:0.3s; color:#000; display:inline-block; width:100%; height:60px; font-size:20px; font-weight:300; opacity:0.7;}
#header #menu li a:hover {opacity:1; font-weight:600;}

/* footet */
#footet {position:relative; padding:60px 0; text-align:center;}
#footet .foot_sns {color:#ccc;}
#footet .foot_sns img {/*width:36px; height:36px;*/}
#footet .foot_sns a {color:#999; font-style:italic;}
#footet .foot_sns a:hover {color:#666; }
#footet address {padding-top:20px; font-size:13px; line-height:22px; color:#aaa; font-weight:400;}



/* container */
#main {padding-top:100px;}
.pc_only {display:inline-block;}
.m_only {display:none;}
.main_tit {padding:40px 0; display:inline-block; font-size:26px; color:#666; font-weight:400;}
.main_slide {}
.main_slide .swiper-slide {position:relative; width:100%; height:100%; overflow:hidden; /*background:#000;*/}
.main_slide .swiper-slide h4 img {width:100%; transition:all 0.2s linear;}
.main_slide .swiper-slide:hover h4 img {opacity:1; transform: scale(1.05);}
.main_slide .swiper-slide p {transition:0.3s; opacity:0; position:absolute; left:0; top:48%; right:0; bottom:0; font-size:16px; text-align:center; vertical-align:middle; color:#fff;}
.main_slide .swiper-slide:hover p {opacity:1;}
:root {--swiper-navigation-size:30px;}
.main_slide .swiper-button-next, .swiper-button-prev {color:#fff;}
.main_slide .swiper-button-prev, .swiper-rtl .swiper-button-next {left:2%; opacity:0.5;}
.main_slide .swiper-button-next, .swiper-rtl .swiper-button-prev {right:2%; opacity:0.5;}
.main_slide .swiper-pagination-bullet-active {background:#fff;}


#sub {padding-top:100px; padding-bottom:0px; font-size:14px; color:#666; line-height:26px;}
.about_cont {}
.about_cont ul {}
.about_cont ul li {border:1px solid #eee; border-radius:10px; display:flex; align-items:center; padding:20px; margin-bottom:16px;}
.about_cont ul li h4 {font-size:15px; font-weight:600; background:#fafafa; width:16%; text-align:center; padding:40px 0; border-radius:10px;}
.about_cont ul li div {padding-left:40px;}
.process_cont ul {}
.process_cont ul li {border:1px solid #eee; border-radius:10px; padding:28px 40px; margin-bottom:16px;}
.process_cont ul li:nth-child(2n) {background:#fafafa;}
.process_cont ul li h4 {font-size:15px; font-weight:600; padding-bottom:8px;}
.process_cont ul li p {}
.port_list {}
.port_list .gall_img {background:#000; height:auto !important; max-height:auto !important;}
.port_list .gall_img img {width:100%; transition:all 0.2s linear;}
.port_list .gall_img:hover img {opacity:0.8; transform: scale(1.05);}
.port_list .gall_img p {transition:0.3s; opacity:0; position:absolute; left:0; top:48%; right:0; bottom:0; font-size:16px; text-align:center; vertical-align:middle; color:#fff;}
.port_list .gall_img:hover p {opacity:1;}
dl.list_bullet {}
dl.list_bullet dd {position:relative; padding-left:10px;}
dl.list_bullet dd:after {content:"-"; position:absolute; left:0; top:0;}
.btn_consulting {border:1px solid #eee; border-radius:10px; padding:20px; margin-bottom:24px;}
.btn_consulting p {padding-bottom:12px;}
.btn_consulting a {display:inline-block; transition:0.3s; font-size:14px; font-weight:600; background:#666; padding:10px 24px; color:#fff; border-radius:6px;}
.btn_consulting a:hover {background:#444;}
.contact_cont {display:flex; gap:40px;}
.contact_cont .contact_img {width:40%;}
.contact_cont .contact_img img {width:100%;}
.contact_cont .contact_text {width:60%;}
.contact_cont .contact_text h2 {font-size:14px; font-weight:400; padding-top:24px;}

#bo_v_top {height:0;}
#bo_btn_top {margin:0;}
#bo_gall .gall_box {margin-bottom:40px;}



/*** PC 축소 ***/
@media screen and (max-width:1340px) {
	.w_1400 {width:100%; padding-left:5%; padding-right:5%; margin:0;}
	#header h1.logo {left:5%;}
}



/*** 태블릿가로버전 ***/
@media screen and (max-width:1220px) {
}



/*** 태블릿세로버전 ***/
@media screen and (max-width:1023px) {
	#sub {font-size:13px; line-height:24px; word-break:keep-all;}
	.main_tit {font-size:20px; padding:30px 0;}
	.about_cont ul li {padding:12px; margin-bottom:12px;}
	.about_cont ul li h4 {width:18%;}
	.about_cont ul li div {padding-left:4%; width:78%;}
	.process_cont ul li {padding:28px 34px;}
}



/*** 모바일버전 ***/
@media screen and (max-width:767px) {
	:root {--swiper-navigation-size:20px;}
	.pc_only {display:none;}
	.m_only {display:inline-block;}

	#header {height:80px;}
	#header h1.logo {top:27px;}
	#header h1.logo img {height:26px;}
	#header .m_cate {top:15px;}
	#footet {padding:40px 0;}
	#footet address {font-size:10px; line-height:18px;}

	#main {padding-top:80px;}
	#sub {padding-top:80px;}
	.main_slide {padding:8vh 0 4vh 0;}
	.main_slide .swiper-slide h4 {
		position: relative;
		width: 100%;
		height: 260px;
	}

	.main_slide .swiper-slide h4 img{
		position: absolute;
		top: 0;
		left: 0;
		transform: translate(50, 50);
		width: 100%;
		height: 100%;
		object-fit: cover;
		margin: auto;
	}

	.about_cont ul li {display:block;}
	.about_cont ul li h4 {width:100%; padding:20px 0;}
	.about_cont ul li div {width:100%; padding:4%;}
	.process_cont ul li {padding:6%;}
	.contact_cont {display:block;}
	.contact_cont .contact_img {width:100%;
		position: relative;
		width: 100%;
		height: 220px;}
	.contact_cont .contact_img img{
		position: absolute;
		top: 0;
		left: 0;
		transform: translate(50, 50);
		width: 100%;
		height: 100%;
		object-fit: cover;
		margin: auto;
	}
	#map {height:250px !important;}
	.contact_cont .contact_text {width:100%; padding-top:30px;}
	#bo_gall .gall_box {margin-bottom:20px;}
}