@charset "utf-8";

/* ==================================================
	공통사항
================================================== */
.span_dp {
	display: block;
}

.img100 {
	width: 100%;
}

.tit {
	margin-top: 8rem;
	margin-bottom: 4rem;
	text-align: var(--text-ag-center);
}

.tit h4 {
	font-size: var(--rem-40);
	font-weight: var(--font-bd);
}

.tit p {
	margin-top: 20px;
	font-weight: 400;
	font-size: 2.4rem;
}

.tit p span {
	display: block;
	font-size: 80%;
}

.txt {
	word-break: keep-all;
}

.txt h5 {
	font-weight: var(--font-sb);
	font-size: var(--rem-24);
}

.txt p {
	margin-top: 20px;
	font-weight: var(--font-sb);
	font-size: var(--rem-18);
}

/* 애니메이션 */
.cont_inner {
	width: 100%;
	opacity: 0;
	transform: translateY(20px);
	-webkit-transform: translateY(20px);
	transition: all .6s cubic-bezier(0.42, 0.0, 0.58, 1.0);
	-webkit-transition: all .6s cubic-bezier(0.42, 0.0, 0.58, 1.0);
}

.cont_inner.active {
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0)
}

/* 모바일CSS */
@media screen and (max-width:1100px) {

	.tit {
		margin-top: 6rem;
		margin-bottom: 3rem;
	}

	.tit h4 {
		font-size: 3rem;
	}

	.tit p {
		margin-top: 16px;
		font-size: 2rem;
	}

	.txt h5 {
		font-size: 2rem;
	}

	.txt p {
		margin-top: 16px;
		font-size: 1.7rem;
	}
}

@media screen and (max-width:800px) {

	.tit p {
		margin-top: 12px;
		font-size: 1.8rem;
	}

	.txt h5 {
		font-size: 1.8rem;
	}

	.txt p {
		margin-top: 12px;
		font-size: 1.6rem;
	}

	.span_dp {
		display: inline;
	}

	.xp_hide {
		display: none;
	}
}

@media screen and (max-width:600px) {
	.tit {
		margin-top: 5rem;
		margin-bottom: 2rem;
	}

	.tit h4 {
		font-size: 2.4rem;
	}

	.tit br,
	.txt br {
		display: none;
	}
}

/* ==================================================
	공통테이블
================================================== */
.sub_con {
	width: 100%;
	overflow: hidden;
	margin-top: 20px;
}

.subtable {
	width: 100%;
	border: 0;
	border-spacing: 0;
	background: #fff;
	border-top: #000 2px solid;
	text-align: center;
}

.subtable caption {
	visibility: hidden;
	overflow: hidden;
	width: 1px;
	height: 1px;
	font-size: 0;
	line-height: 0;
}

.subtable tr th,
.subtable tr td {
	vertical-align: middle;
}

.subtable tr th {
	padding: 1.8rem 0.4rem;
	background-color: #f3f3f3;
	border-right: #ddd 1px solid;
	border-bottom: #ddd 1px solid;
	color: #333;
	font-size: 1.8rem;
	font-weight: 700;
}

.subtable thead tr:first-child th:last-child {
	border-right: none;
}

.subtable tr td {
	border-left: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 1.5rem 1rem;
	color: #595959;
	line-height: 1.4;
	word-break: keep-all;
	font-size: 1.7rem;
}

.subtable tr td:first-child {
	border-left: 0;
}

.subtable tr td.bg_gray {
	background: #f1f3f5;
	color: #222;
	font-weight: var(--font-bd);
	border-left: 0;
}

.subtable_tit {
	background: #f1f3f5;
	text-align: center;
	color: #222;
	font-weight: var(--font-bd);
}

.subtable_text {
	padding: 10px 20px !important;
}

.subtablebdl {
	border-left: 1px solid #dee2e6;
}

.subtable_bordleft {
	border-left: 0 !important;
}

/* 모바일CSS */
@media screen and (max-width:768px) {
	.subtable tr th {
		padding: 1.2rem 0.4rem;
		font-size: 1.6rem;
	}

	.subtable tr td {
		padding: 1rem 0.8rem;
		font-size: 1.5rem;
	}

	.subtable_tit {
		display: block;
		padding: 10px 0 10px 20px !important;
	}

	.subtable_text {
		display: block;
		border-left: none;
		padding: 10px 0 10px 20px !important;
	}
}

/* ==================================================
	영상
================================================== */
.youtubeWrap {
	position: relative;
	padding-bottom: 56.25%;
	/*   padding-top: 35px;*/
	height: 0;
	border-radius: var(--rem-10);
	overflow: hidden;
}

.youtubeWrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1
}

.youtubeWrap .btn_prev,
.youtubeWrap .btn_next {
	display: inline-block;
	position: absolute;
	top: 50%;
	margin-top: -45px;
	z-index: 100;
	background: rgba(0, 0, 0, 0.6);
	color: #fff
}

.youtubeWrap .btn_prev {
	left: 0
}

.youtubeWrap .btn_next {
	right: 0
}

.youtubeWrap .btn_prev>img {
	float: left
}

.youtubeWrap .btn_next>img {
	float: right
}

.youtubeWrap .btn_prev>span,
.youtubeWrap .btn_next>span {
	display: inline-block;
	float: left;
	height: 90px;
	padding: 0 15px;
	margin: 20px 0;
	max-height: 50px;
	max-width: 180px;
	font-size: 16px;
	display: block;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	display: none;
}

.youtubeWrap .btn_prev:hover>span,
.youtubeWrap .btn_prev:focus>span,
.youtubeWrap .btn_next:hover>span,
.youtubeWrap .btn_next:focus>span {
	display: inline-block
}

/* ==================================================
	아이콘
================================================== */
.l-list01 {
	line-height: 1.2;
	font-size: 1.8rem;
}

.l-list01>li {
	position: relative;
	padding-left: 1.5rem;
	margin-top: 1rem;
	color: #606060;
}

.l-list01>li:first-child {
	margin-top: 0;
}

.l-list01>li:before {
	content: "";
	position: absolute;
	top: 0.9rem;
	left: 0;
	width: 0.5rem;
	height: 0.5rem;
	background: #b8b8b8;
}

.l-list01>li span {
	font-weight: 700;
}

/* 모바일CSS */
@media screen and (max-width:1023px) {
	.l-list01 {
		font-size: 17px;
	}

	.l-list01>li:before {
		top: 9px;
		width: 5px;
		height: 5px;
	}
}

/* ==================================================
	반응형 테이블 스크롤
================================================== */
.msg_touch_help {
	display: none;
}

/* 모바일CSS */
@media screen and (max-width:800px) {
	.con_table_wrap {
		overflow-x: auto;
	}

	.con_table_wrap {
		position: relative;
	}

	.table_scroll {
		width: 200%;
		max-width: 1100px;
	}

	.msg_touch_help {
		position: absolute;
		left: 50%;
		top: 50%;
		margin-left: -40px;
		margin-top: -40px;
		display: block;
	}

	.msg_touch_help img {
		width: 100px;
		height: 100px;
	}
}

/* ==================================================
	이미지 움직이는 효과
================================================== */
.over-cover {
	overflow: hidden;
	position: relative;
	display: inline-block;
	border: 1px solid #dbdbdb;
	line-height: 0;
}

.over-cover img {
	width: 100%;
	height: 100%;
	-webkit-transition: all 0.5s linear;
	transition: all 0.5s linear;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}

.over-cover:hover img {
	-webkit-transform: scale3d(1.2, 1.2, 1);
	transform: scale3d(1.2, 1.2, 1);
}

.over-cover2 {
	/* overflow: hidden; */
	position: relative;
	display: inline-block;
	/* border: 1px solid #dbdbdb; */
	/* line-height: 0; */
}

.over-cover2 img {
	width: 100%;
	/* height: 100%; */
	-webkit-transition: all 0.5s linear;
	transition: all 0.5s linear;
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
}

.over-cover2:hover img {
	-webkit-transform: scale3d(1.2, 1.2, 1);
	transform: scale3d(1.2, 1.2, 1);
}

/* 통이미지로*/
.cont_item img {
	width: 100%;
}

/* ==================================================
	회사소개 - 회사개요
================================================== */
.oerview_top {
	display: flex;
	padding-bottom: 12rem;
	/* color: var(--color-white); */
	border-radius: var(--rem-20);
}

.oerview_top img {
	width: 100%;
}

.ov_topTxt {
	margin-left: 6rem;
}

.ov_topTxt p {
	font-size: var(--rem-20);
	font-weight: var(--font-sb);
}

.oerview_top h3 {
	color: var(--color-blue);
	font-size: var(--rem-55);
	font-weight: normal;
}

.oerview_top h3 span {
	margin-top: var(--rem-10);
	font-weight: var(--font-bd);
}

.ov_topTxt ul {
	margin-top: 3rem;
	border-top: solid 1px #000;
}

.ov_topTxt li {
	padding: 3% 0;
	border-bottom: solid 1px #D3D3D3;
}

.ov_topTxt li dl {
	display: flex;
}

.ov_topTxt li dl dt {
	width: 25%;
}

.ov_topTxt li dl dd {
	font-weight: var(--font-sb);
}

/* Business Objectives */
.oerview_obj {
	position: relative;
	margin-top: 8rem;
	padding: 8rem 0;
	text-align: center;
}

.oerview_obj h3 {
	position: absolute;
	top: -100px;
	width: 100%;
	color: #426597;
	font-size: var(--rem-55);
	font-weight: var(--font-bd);
}

.oerview_obj:after {
	content: '';
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	width: 100vw;
	height: 100%;
	background: url('../images/about/ov_img02.jpg') no-repeat center 0;
	z-index: -1;
}

.oerview_obj ul {
	padding-top: 3rem;
	width: 100%;
}

.oerview_obj li {
	padding: 3.5rem 0.1rem 2.5rem 0.1rem;
	margin: 0 auto 4rem auto;
	width: 60%;
	background-color: rgba(255, 255, 255, 0.8);
	border: solid 1px #426597;
	border-radius: 20rem;
	text-align: center;
	font-size: var(--rem-30);
	font-weight: var(--font-bd);
}
.oerview_obj li:last-child {
	margin-bottom: 0;
}

.oerview_obj li .blue_dot {
	position: absolute;
	top: -20px;
	left: 47%;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50%;
	font-size: var(--rem-20);
	background-color: #426597;
	color: var(--color-white);
	font-weight: var(--font-sb);
}

.oerview_obj li:nth-child(2) img {
	max-width: 60px;
}

.oerview_obj p {
	margin-top: 1rem;
	font-weight: 500;
	letter-spacing: -0.5px;
	font-size: var(--rem-17);
}

.oerview_obj p.light {
	margin-top: var(--rem-22);
	font-weight: var(--font-lg);
	font-size: var(--rem-20);
}



/* 애니메이션 */

/*회사개요*/
.overview .tit {
	opacity: 0;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
}

.overview.active .tit {
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
	transition: all 0.5s 0.7s;
	-webkit-transition: all 0.5s 0.7s;
}

.oerview_obj li {
	opacity: 0;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
}

.oerview_obj.active li {
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
}

.oerview_obj.active li:nth-child(1) {
	transition: all 0.5s 0.7s;
	-webkit-transition: all 0.5s 0.7s;
}

.oerview_obj.active li:nth-child(2) {
	transition: all 0.8s 0.7s;
	-webkit-transition: all 0.8s 0.7s;

}

.oerview_obj.active li:nth-child(3) {
	transition: all 1.1s 0.7s;
	-webkit-transition: all 1.1s 0.7s;
}

/*주요사업*/
.overview.overview_buiz ul li:nth-child(-n+2) {
	opacity: 0;
	transform: translateX(-50px);
	-webkit-transform: translateX(-50px);
}

.overview.overview_buiz ul li:nth-child(n+3) {
	opacity: 0;
	transform: translateX(50px);
	-webkit-transform: translateX(50px);
}

.overview.overview_buiz.active ul li {
	opacity: 1;
	transform: translateX(0);
	-webkit-transform: translateX(0);
}

.overview.overview_buiz.active ul li:nth-child(-n+2) {
	transition: all 0.9s 1.2s;
}

.overview.overview_buiz.active ul li:nth-child(n+3) {
	transition: all 1.7s 1.2s;
}

/*주요생산제품*/
.overview.ov_products ul li {
	opacity: 0;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
}

.overview.ov_products.active ul li {
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
}

.overview.ov_products.active ul li:nth-child(1) {
	transition: all 0.9s 1.2s;
}

.overview.ov_products.active ul li:nth-child(2) {
	transition: all 1.2s 1.2s;
}

.overview.ov_products.active ul li:nth-child(3) {
	transition: all 1.5s 1.2s;
}

/* 모바일CSS */
@media screen and (max-width:1100px) {

	.oerview_top {
		padding: 0 0 10rem 4rem;
		border-radius: var(--rem-18);
	}


	.oerview_top p {
		margin-top: var(--rem-35);
	}

	.oerview .conbox {
		width: calc(50% - 3rem);
	}

	.oerview .conbox dl dt {
		width: 100px;
		font-size: var(--rem-17);
	}

	.oerview .conbox dl dd {
		width: calc(100% - 100px);
		font-size: var(--rem-17);
	}

	/* 개요 */


	.oerview_obj ul {
		gap: 3.0rem;
	}

	.oerview_obj li {
		padding: 4rem 0.5rem;
	}
}

@media screen and (max-width:800px) {

	.oerview_top {
		display: block;
		padding: 0 0 6rem 0;
	}

	.ov_topTxt {
		margin-left: 0;
		padding-bottom: 5rem;
	}

	.ov_topTxt li {
		font-size: var(--rem-25);
	}

	.oerview_obj h3 {
		top: -80px;
		font-size: var(--rem-40);
	}

	.oerview_obj li {
		width: 80%;
	}

	.oerview_obj li .blue_dot {
		left: 44%;
	}

	.ov_topTxt p {
		font-size: var(--rem-25);
	}

	.oerview_obj p {
		font-size: var(--rem-22);
	}

}

@media screen and (max-width: 480px) {

	.oerview_top {
		padding: 0 1rem 5rem;
		border-radius: var(--rem-18);
	}

	.oerview_top h3 {
		font-size: var(--rem-35);
	}

	.oerview_top span {
		/* font-size: var(--rem-13);*/
	}

	.oerview_top p {
		margin-top: var(--rem-25);
		font-size: var(--rem-15);
	}


	.oerview_obj {
		margin-top: 3rem;
		padding: 6rem 0;
	}

	.oerview_obj ul {
		-ms-grid-columns: (1fr)[1];
		grid-template-columns: repeat(1, 1fr);
		gap: 2.5rem;
	}

	.oerview_obj li {
		padding: 3rem 0.5rem;
		font-size: var(--rem-20);
	}

	.oerview_obj img {
		max-width: 35px;
		max-height: 35px;
	}

	.oerview_obj p.light {
		margin-top: 1.0rem;
		font-size: var(--rem-18);
	}

	.oerview_obj p {
		font-size: 1.5rem;
	}

	.overview_buiz ul>li .img h1,
	.overview_buiz ul>li .img_tit .img_txt h1 {
		font-size: var(--rem-20);
	}

	/*주요생산제품*/
	.ov_products ul {
		grid-template-columns: repeat(1, 1fr);
	}

	.ov_products ul li a {
		height: 15rem;
		gap: 2rem;
		flex-direction: row;
		justify-content: space-between;
		padding: 0 5rem;
	}
}

/* ==================================================
	회사소개 - 인사말
================================================== */
.ceo {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: (1fr) [2];
	grid-template-columns: repeat(2, 1fr);
	gap: 7rem;
}

.ceo .ceo_pic {
	display: block;
	background: url('../images/about/ceo_pic.jpg?v=2025') center no-repeat;
	background-size: cover;
}

.ceo .ceo_word h4 {
	margin-bottom: var(--rem-10);
	font-size: var(--rem-50);
}

.ceo ul {
	display: flex;
}

.ceo_word ul li {
	padding-right: 2rem;
	font-size: var(--rem-25);
	font-weight: var(--font-sb);
	color: var(--color-blue);
}

.ceo_word ul li {
	opacity: 0;
	transform: translateY(50px);
	-webkit-transform: translateY(50px);
}

/* 애니메이션 */
.ceo_word.active li {
	opacity: 1;
	transform: translateY(0);
	-webkit-transform: translateY(0);
}

.ceo_word ul li:nth-child(1) {
	transition: all 0.5s 0.3s;
	-webkit-transition: all 0.5s 0.3s;
}

.ceo_word ul li:nth-child(2) {
	transition: all 0.8s 0.3s;
	-webkit-transition: all 0.8s 0.3s;
}

.ceo_word ul li:nth-child(3) {
	transition: all 1.1s 0.3s;
	-webkit-transition: all 1.1s 0.3s;
}

.ceo .ceo_word p {
	padding-bottom: 2rem;
	line-height: 1.5;
	word-break: keep-all;
}

.ceo_txt {
	font-weight: var(--font-sb);
	font-size: var(--rem-20);
}

.ceo_pic ul {
	padding-top: 30%;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0;
	display: none;
}

.ceo_pic li {
	text-align: center;
}

.ceo_pic li img {
	width: 100%;
	max-width: 130px;
}



/* 모바일 CSS */
@media all and (max-width:1100px) {
	.ceo {
		gap: 6rem;
	}

	.ceo_word ul li {
		padding-right: 1.2rem;
	}
}

@media all and (max-width:800px) {
	.ceo {
		-ms-grid-columns: (1fr) [1];
		grid-template-columns: repeat(1, 1fr);
		gap: 5rem;
	}

	.ceo .ceo_pic {
		background-size: cover;
		height: 40rem;
		border-radius: var(--rem-15);
	}

	.ceo .ceo_word .name span {
		padding-left: var(--rem-14);
	}

	.ceo .ceo_word .name span img {
		max-width: 120px;
	}
}

@media screen and (max-width:480px) {
	.ceo {
		gap: 4.5rem;
	}

	.ceo .ceo_pic {
		height: 28rem;
		border-radius: var(--rem-10);
	}

	.ceo .ceo_word h4 {
		font-size: var(--rem-22);
	}

	.ceo .ceo_word p {
		font-size: var(--rem-16);
	}
}


/* ==================================================
	회사소개 - 연혁
================================================== */
/* 모바일 CSS */
.history {
	display: flex;
	flex-direction: column;
	gap: 7rem;
}

.history ul {
	column-count: 2;
	column-gap: var(--rem-20);
}

.history ul li {
	margin-bottom: var(--rem-20);
}

.history ul li dl {
	display: grid;
	grid-template-columns: 10rem auto;
	gap: var(--rem-18);
}

.history ul li dl dt {
	font-weight: var(--font-md);
}


.history .img {
	width: 100%;
}

.history .img img {
	display: block;
	width: 100%;
}

@media all and (max-width:1100px) {
	.history ul {
		column-count: 1;
	}
}

@media screen and (max-width:480px) {
	.history {
		gap: 5rem;
		flex-direction: column-reverse;
	}
}

/* ==================================================
	회사소개 - 주요고객
================================================== */
.customer {
	display: flex;
	flex-direction: column;
	gap: 7rem;
}

.customer .top_txt {
	display: flex;
	flex-direction: column;
	gap: var(--rem-20);
	text-align: center;
}

.customer .top_txt h4 {
	color: var(--color-blue);
	font-size: var(--rem-55);
}

.customer .top_txt p {
	font-size: var(--rem-20);
}

.customer .map_wrap {
	position: relative;
}

.customer .map_wrap h5 {
	position: absolute;
	top: -3rem;
	left: calc(50% - 15rem);
	display: block;
	z-index: 1;
	background: #122F72;
	font-size: var(--rem-25);
	font-weight: var(--font-bd);
	color: var(--color-white);
	text-align: center;
	padding: 1.3rem 4.5rem;
	width: 30rem;
	border-radius: 3rem;
	-moz-border-radius: 3rem;
}

.customer .map {
	width: 100%;
	border: 1px solid var(--color-blue);
	position: relative;
	overflow: hidden;
	border-radius: 0.8rem;
	-moz-border-radius: 0.8rem;
}

.customer .map img {
	display: block;
	width: 100%;
}

.customer .map div.txt {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	width: 12rem;
	height: 12rem;
	border: 1px solid var(--color-black);
	background: #ffffffcc;
	border-radius: 50%;
	-moz-border-radius: 50%;
}

.customer .map div.txt p {
	font-size: var(--rem-18);
	font-weight: var(--font-md);
	margin: 0;
}

.customer .map div.txt p.digit {
	font-size: var(--rem-35);
	font-weight: var(--font-bd);
	margin-top: -0.5rem;
}

.customer .map div.txt.eu p.digit {
	color: #628f2b;
}

.customer .map div.txt.asia p.digit {
	color: #244fb4;
}

.customer .map div.txt.domestic p.digit {
	color: #022578;
}

.customer .map div.txt.namerica p.digit {
	color: #6d3dc1;
}

.customer .map div.eu {
	top: 22%;
	left: 9%;
}

.customer .map div.asia {
	top: 30%;
	left: 25%;
}

.customer .map div.domestic {
	top: 33%;
	left: 36%;
}

.customer .map div.namerica {
	top: 28%;
	left: 68%;
}

/* 등장애니메이션 */
.customer .map_wrap .map div.txt {
	opacity: 0;
	transform: scale3d(1.20, 1.20, 1.20);
	-webkit-transform: scale3d(1.20, 1.20, 1.20);
}

.customer .map_wrap.active .map div.txt {
	opacity: 1;
	transform: scale3d(1, 1, 1);
	-webkit-transform: scale3d(1, 1, 1);
}

.customer .map_wrap.active .map div.domestic {
	transition: all 0.5s 0.3s;
	-webkit-transition: all 0.5s 0.3s;
}

.customer .map_wrap.active .map div.asia {
	transition: all 0.8s 0.3s;
	-webkit-transition: all 0.8s 0.3s;
}

.customer .map_wrap.active .map div.eu {
	transition: all 1.1s 0.3s;
	-webkit-transition: all 1.1s 0.3s;
}

.customer .map_wrap.active .map div.namerica {
	transition: all 1.3s 0.3s;
	-webkit-transition: all 1.3s 0.3s;
}


/* 모바일CSS */
@media screen and (max-width:1100px) {
	.customer .top_txt h4 {
		font-size: var(--rem-40);
	}
}

@media screen and (max-width:800px) {
	.customer .map div.txt {
		width: 10rem;
		height: 10rem;
	}

	.customer .map div.txt p {
		font-size: var(--rem-16);
	}

	.customer .map div.txt p.digit {
		font-size: var(--rem-20);
	}
}

@media screen and (max-width:480px) {
	.customer .map div.txt {
		width: 7rem;
		height: 7rem;
	}

	.customer .map div.txt p {
		font-size: var(--rem-15);
	}

	.customer .map div.txt p.digit {
		font-size: var(--rem-18);
		margin-top: 0;
	}


	.customer .map div.eu {
		left: 5%;
	}

	.customer .map div.asia {
		left: 21%;
	}

	.customer .map div.domestic {
		left: 40%;
	}

	.customer .map div.namerica p {
		font-size: 1.3rem
	}

}


/* ==================================================
	회사소개 - 오시는 길
================================================== */
.loca_tit {
	padding-bottom: 2rem;
	width: 100%;
	text-align: center;
}

.location {
	margin-bottom: 3rem;
}

.location .tit {
	position: relative;
	font-size: 3.6rem;
	padding-left: 65px;
	text-align: left;
}

.location .tit::before {
	position: absolute;
	content: '';
	width: 50px;
	height: 50px;
	top: 0;
	left: 0;
	background: url('../images/about/location_icon.svg') 50% 50% no-repeat;
	background-size: cover;
}

.location .lo_box {
	display: flex;
}

.location .lo_box dl {
	display: flex;
	gap: 2rem;
	margin-right: 4rem;
}


.location .lo_box dl dt {
	font-size: var(--rem-20);
	font-weight: var(--font-bd);
	text-align: left;
	color: #313131;
}

.location .tit dl dd {
	font-weight: var(--font-md);
	font-size: var(--rem-20);
}

.location .cn {
	font-family: 'Noto_Sans_SC';
	font-weight: 500 !important;
}

/* 지도 */
.cont_inner>.map {
	height: 500px;
}

.cont_inner>.map .root_daum_roughmap_landing {
	overflow: visible;
}

.map_size {
	width: 65%;
}

.root_daum_roughmap {
	width: 100% !important;
}

/* 모바일CSS */
@media screen and (max-width:1100px) {

	.location .tit {
		width: 100%;
	}

	.location .tit dl dt {
		font-size: var(--rem-18);
	}

	.location .tit dl dd {
		font-size: var(--rem-18);
	}

	/* 지도 */
	.map_size {
		width: calc(100% - 30rem);
		height: 340px;
	}

	.root_daum_roughmap {
		height: 340px !important;
	}

}

@media screen and (max-width:800px) {

	.location {
		display: grid;
		margin-bottom: 6rem;
	}

	.location .tit {
		margin-top: 3rem;
	}

	.location .lo_box {
		margin-top: 2rem;
		flex-direction: column;
		gap: 1rem;
	}

	.location .tit dl dt {
		font-size: var(--rem-17);
	}

	.location .tit dl dd {
		font-size: var(--rem-17);
	}


	/* 지도 */
	.map_size {
		width: 100%;
		height: 260px;
	}

	.root_daum_roughmap {
		height: 260px !important;
	}
}


/* ==================================================
	회사소개 - Contact us
================================================== */
.contact {
	width: 100%;
	background: url('../images/about/contact_bg.jpg?v=new') center center no-repeat #e8ecef;
	background-size: cover;
	border-radius: 0.8rem;
	/* box-shadow: 0 0 15px rgba(0,0,0,0.2); */
}

.contact .txt {
	padding: 10rem 8rem 10rem 58%;
	line-height: 1.6;
}

.contact h2 {
	font-size: 3.6rem;
	color: #000;
}

.contact .txt1 {
	width: 100%;
	font-size: 2rem;
	color: #333;
	padding: 1rem 0 4rem;
	border-bottom: 1px solid #808080;
}

.contact .txt1 span {
	display: block;
}

.contact .txt2 {
	margin: 4rem 0 1rem;
}

.contact .txt2 li {
	font-size: 1.8rem;
	color: #333;
	line-height: 50px;
	padding-left: 46px;
}

.contact .txt2 li.tel {
	background: url('../images/icon/ic_tel.svg') 0 50% no-repeat;
}

.contact .txt2 li.fax {
	background: url('../images/icon/ic_fax.svg') 0 50% no-repeat;
}

.contact .txt2 li.email {
	background: url('../images/icon/ic_email.svg') 0 50% no-repeat;
}

.contact .txt2 li.tel,
.contact .txt2 li.fax,
.contact .txt2 li.email {
	background-size: 40px;
}

.contact .txt2 li.email a {
	color: #333;
}

.contact .txt3 {
	color: #333;
}

/* 모바일CSS */
@media screen and (max-width:1400px) {

	.contact .txt {
		padding: 10rem 6rem 10rem 50%;
	}
}

@media screen and (max-width:1100px) {

	.contact .txt {
		padding: 10rem 6rem 8rem 50%;
	}

	.contact .txt1 {
		padding: 1rem 0 3rem;
	}

	.contact .txt2 {
		margin: 3rem 0 1rem;
	}

	.contact .txt2 li {
		padding-left: 40px;
		line-height: 40px;
	}

	.contact .txt2 li.tel,
	.contact .txt2 li.fax,
	.contact .txt2 li.email {
		background-size: 30px;
	}

}

@media screen and (max-width:800px) {

	.contact {
		background-image: none;
	}

	.contact .txt {
		padding: 6rem;
	}

	.contact .txt1 {
		border-bottom: 1px solid #aaaaac;
	}

	.contact .txt2 {
		margin: 2rem 0 1rem;
	}

	.contact .txt2 li {
		line-height: 36px;
		padding-left: 36px;
	}

	.contact .txt2 li.tel,
	.contact .txt2 li.fax,
	.contact .txt2 li.email {
		background-size: 26px;
	}
}

@media screen and (max-width:480px) {

	.contact h2 {
		font-size: 3.0rem;
	}

	.contact .txt {
		padding: 4rem 2rem;
	}

	.contact .txt1 span {
		display: inline;
	}

	.txt p {
		margin-top: 1rem;
		font-size: 1.5rem;
	}

	.contact .txt1 {
		padding: 0 0 2rem;
	}
}


/* ==================================================
	제품소개 - 주요생산품
================================================== */
.major_pro {
	display: flex;
	flex-direction: column;
	gap: 6rem;
}

.pro_tit {
	display: flex;
	flex-direction: column;
	gap: var(--rem-30);
}

.pro_tit .txt h4 {
	font-size: var(--rem-40);
	font-weight: var(--font-bd);
}

.pro_tit .txt p {
	font-size: var(--rem-20);
	font-weight: var(--font-rg);
	line-height: 1.4;
}

.pro_tit .txt p span {
	display: block;
}

.pro_tit .img_box {
	width: 100%;
	display: flex;
	justify-content: center;
}

.pro_tit .img {
	max-width: 78rem;
	width: 100%;
	border: 1px solid var(--color-gray2);
}

.pro_tit .img img {
	display: block;
	width: 100%;
}

.pro_list {
	display: flex;
	flex-direction: column;
	gap: var(--rem-40);
}

.pro_list h4 {
	font-size: var(--rem-30);
	font-weight: var(--font-sb);
	padding-bottom: var(--rem-15);
	border-bottom: 1px solid var(--color-black);
}

.pro_list ul {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 5rem 3.5rem;
}

.pro_list ul li {
	display: flex;
	flex-direction: column;
	gap: var(--rem-20)
}

.pro_list ul li .img {
	border: 1px solid var(--color-gray2);
}

.pro_list ul li .txt {
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
}

.pro_list ul li .txt p {
	font-size: var(--rem-18);
	font-weight: var(--font-rg);
	margin: 0;
}

.pro_list ul li .txt p:nth-child(1) {
	font-size: var(--rem-22);
	font-weight: var(--font-md);
	display: none;
}

.pro_table h4 {
	font-size: var(--rem-30);
	font-weight: var(--font-sb);
	padding-bottom: var(--rem-15);
}


.pro_table table {
	width: 100%;
	border-top: 1px solid var(--color-black);
	vertical-align: middle;
}

.pro_table colgroup col:nth-child(1) {
	width: 20%;
}

.pro_table colgroup col::nth-child(2) {
	width: 80%;
}

.pro_table table tr td {
	padding: var(--rem-18);
	font-size: var(--rem-20);
	border-bottom: 1px solid var(--color-gray3);
	border-left: 1px solid var(--color-gray3);

}

.pro_table table tr td:first-child {
	font-weight: var(--font-sb);
	border-left: 0;
	text-align: center;
	vertical-align: middle;
}

.pro_table table tr:nth-child(2n) td {
	background: var(--color-gray1);
}


@media screen and (max-width:800px) {
	.pro_tit .txt p span {
		display: inline;
	}

	.pro_tit .img {
		max-width: 100%;
	}

	.pro_list ul {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media screen and (max-width:650px) {
	.pro_list ul {
		grid-template-columns: repeat(2, 1fr);
	}

	.pro_table colgroup col:nth-child(1) {
		width: 40%;
	}

	.pro_table colgroup col::nth-child(2) {
		width: 60%;
	}

}

/* 주요실적품 */
.key_pro_list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 5rem 3.5rem;
}

.key_pro_list li {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.key_pro_list li .img {
	width: 100%;
	border: 1px solid var(--color-gray2);
}

.key_pro_list li img {
	width: 100%;
	display: block;
}

.key_pro_list li .txt {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	text-align: center;
}

.key_pro_list li .txt h4 {
	font-weight: var(--font-sb);
	font-size: var(--rem-24);
}

.key_pro_list li .txt p {
	font-weight: var(--font-md);
	font-size: var(--rem-20);
	margin-top: 0;
}

.key_pro_list li .txt ul li {
	font-weight: var(--font-rg);
	font-size: var(--rem-18);
}


@media screen and (max-width:800px) {
	.key_pro_list {
		grid-template-columns: repeat(2, 1fr);
	}

}

@media screen and (max-width:650px) {
	.key_pro_list {
		grid-template-columns: repeat(1, 1fr);
	}

}

/* 주요개발품 */
.major_dev_list {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 4rem 1.5rem;
}

.major_dev_list li {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.major_dev_list .img {
	width: 100%;
}

.major_dev_list .img img {
	width: 100%;
	display: block;
}

.major_dev_list p {
	margin: 0;
	font-size: var(--rem-20);
	font-weight: var(--font-md);
	text-align: center;
}

.pro_table.dev colgroup col:nth-child(1) {
	width: 20%;
}

.pro_table.dev colgroup col::nth-child(2) {
	width: 20%;
}

.pro_table.dev colgroup col:last-child {
	width: auto;
}

.pro_table.dev td.item {
	font-weight: var(--font-md);
	text-align: left;
	border-left: 1px solid var(--color-gray3);
	vertical-align: middle;
}

@media screen and (max-width:800px) {
	.major_dev_list {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media screen and (max-width:450px) {
	.major_dev_list {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ==================================================
	경쟁력 - RND
================================================== */
.rnd {
	display: flex;
	flex-direction: column;
	gap: 7rem;
}

.rnd_top {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 6rem;
}

.rnd_top>div {
	width: 100%;
}

.rnd_top .txt {
	display: flex;
	flex-direction: column;
	gap: var(--rem-20)
}

.rnd_top .txt h4 {
	font-size: var(--rem-40);
	color: var(--color-blue);
}

.rnd_top .txt h4 span {
	display: block;
}

.rnd_top .txt p {
	font-size: var(--rem-20);
	font-weight: var(--font-rg);
	margin-top: 0;
}

.rnd_top .txt .certi_img {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: var(--rem-30);
}

.fc {
	display: flex;
	flex-direction: column;
	gap: var(--rem-30);
}

.fc h4 {
	display: block;
	position: relative;
	font-size: var(--rem-30);
	font-weight: var(--font-sb);
}

.fc h4::after {
	display: block;
	content: '';
	position: absolute;
	width: 100%;
	height: 1px;
	background: var(--color-black);
	bottom: 8px;
	left: 0;
	z-index: -1;
}

.fc h4 span {
	background: var(--color-white);
	padding-right: 2rem;
}

.fc .img_list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--rem-25);
}

.fc_table_cont {}

.fc_table_cont table {
	width: 100%;
}

.fc_table_cont col:nth-child(2n-1) {
	width: 30%;
}

.fc_table_cont col:nth-child(2n) {
	width: 20%;
}

.fc_table_cont th {
	background: #7993B7;
	color: var(--color-white);
	text-align: center;
	padding: var(--rem-15);
	border-right: 1px solid var(--color-white);
	vertical-align: middle;
}

.ie.fc_table_cont th {
	background: #2a538c;
}

.fc_table_cont td {
	border-bottom: 1px solid var(--color-gray3);
	padding: var(--rem-15);
	border-right: 1px solid var(--color-gray3);
	vertical-align: middle;
}

.fc_table_cont tr:nth-child(2n) td {
	background: var(--color-gray1);
}

.fc_table_cont th:last-child,
.fc_table_cont td:last-child {
	border-right: 0;
}

.fc_table_cont td:nth-child(2n) {
	text-align: center;
}

@media screen and (max-width:1024px) {
	.rnd_top .txt h4 span {
		display: inline;
	}
}

@media screen and (max-width:800px) {
	.rnd_top {
		display: flex;
		flex-direction: column;
	}
}

@media screen and (max-width:650px) {
	.fc .img_list {
		grid-template-columns: repeat(1, 1fr);
		gap: var(--rem-10);
	}

	.fc_table_cont {
		overflow-x: scroll;
		position: relative;
	}

	.fc_table_cont::after {
		position: absolute;
		content: '';
		display: block;
		top: calc(50% - 25px);
		left: calc(50% - 25px);
		width: 50px;
		height: 50px;
		background: url('../images/common/bg_touch_help.png')50% 50% no-repeat;
		background-size: cover;
		border-radius: 50%;
		z-index: 1;
	}

	.fc_table_cont table {
		width: 650px;
	}

}

/* ==================================================
	경쟁력 - 전용기기
================================================== */
.sp_mc {
	display: flex;
	flex-direction: column;
	gap: 8rem;
}

.sp_mc .top_txt {
	display: flex;
	flex-direction: column;
	gap: 4rem;
	position: relative;
}

.sp_mc .top_txt::after {
	display: block;
	content: '';
	position: absolute;
	bottom: -8rem;
	left: 0;
	width: 100%;
	height: 1px;
	background: var(--color-gray2);
}

.sp_mc .top_txt .top_img {
	background: url('../images/competition/specialized_mc_top.jpg') 50% 50% no-repeat;
	background-size: cover;
	height: 35rem;
}

.sp_mc .top_txt .txt {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

.sp_mc .top_txt .txt h4 {
	color: var(--color-blue);
	font-size: var(--rem-45);
	font-weight: var(--font-bd);
	line-height: 1.3;
}

.sp_mc .top_txt .txt ul {
	list-style-type: disc;
	padding: 0;
	margin: 0;
	margin-left: 10px;
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.sp_mc .top_txt .txt ul li {
	list-style-type: disc;
}

.sp_mc .top_txt .txt ul li::marker {
	font-size: 0.8rem;
}

.sp_mc .top_txt .img {
	position: absolute;
	top: 8rem;
	right: 2rem;
	width: 45%;
}

.sp_mc .top_txt .img img {
	width: 100%;
	display: block;
	filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.351));
}

.sp_mc .sp_dig {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4rem;
	margin-top: 8rem;
	;
}

.sp_mc .sp_dig div {
	text-align: center;
}

.sp_mc .sp_dig h5 {
	font-weight: var(--font-bd);
	font-size: var(--rem-35);
	color: var(--color-blue);
}

.sp_mc .sp_dig p {
	font-size: var(--rem-20);
	margin-top: 2rem;
}

.sp_mc .sp_dig ul {
	width: 70%;
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.sp_mc .sp_dig ul::before {
	display: block;
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 2px;
	background: var(--color-gray2);
	z-index: -1;
}

.sp_mc .sp_dig ul li {
	background: var(--color-white);
	border: 2px solid var(--color-blue);
	border-radius: 50%;
	-moz-border-radius: 50%;
	width: 18rem;
	height: 18rem;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	font-weight: var(--font-bd);
	font-size: var(--rem-20);
	text-align: center;
}

.sp_mc .sp_dig ul li span {
	display: block;
}

.sp_mc .list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.sp_mc .list>li {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	border: 1px solid var(--color-gray2);
	padding: 3.5rem;
	border-radius: 0.8rem;
}

.sp_mc .list li p {
	font-weight: var(--font-bd);
	font-size: var(--rem-20);
}

.sp_mc .list li ul {
	list-style-type: disc;
	padding: 0;
	margin: 0;
	margin-left: 10px;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.sp_mc .list li ul li {
	list-style-type: disc;
}

.sp_mc .list li ul li::marker {
	font-size: 0.8rem;
}

@media screen and (max-width:1024px) {
	.sp_mc .top_txt .top_img {
		height: 28rem;
	}

	.sp_mc .top_txt .txt h4 {
		font-size: var(--rem-40);
	}

	.sp_mc .sp_dig ul {
		width: 90%;
	}

	.sp_mc .sp_dig ul li {
		width: 18vw;
		height: 18vw;
	}


}

@media screen and (max-width:800px) {
	.sp_mc .top_txt .top_img {
		height: 25rem;
	}

	.sp_mc .top_txt .txt h4 {
		font-size: var(--rem-35);
	}

	.sp_mc .list {
		grid-template-columns: repeat(1, 1fr);
	}

	.sp_mc .top_txt .top_img {
		height: 20rem;
	}

	.sp_mc .top_txt .img {
		top: 6rem;
		right: 2rem;
		width: 50%;
	}

	.sp_mc .sp_dig ul li {
		font-size: var(--rem-15);
	}

}


/* ==================================================
	경쟁력 - 스마트 팩토리
================================================== */
.sf {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8rem;
}

.sf h4 {
	text-align: center;
	font-size: var(--rem-30);
}

.sf h4 span {
	display: block;
}

.sf .img {
	max-width: 38rem;
	width: 100%;
}

.sf .img img {
	display: block;
	width: 100%;
}

.sf_diag {
	display: block;
	width: 100%;
}

.sf_diag .str {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 9rem;
	margin-bottom: 9rem;
}

.sf_diag .str:last-child {
	margin-bottom: 0;
}

.sf_diag .str h5 {
	padding: 2rem 3rem;
	min-width: 500px;
	color: var(--color-white);
	font-size: var(--rem-28);
	background: #2A538C;
	border-radius: 5rem;
	text-align: center;
	position: relative;
}

.sf_diag .str h5::after {
	position: absolute;
	content: '';
	display: block;
	width: 2px;
	height: 4.5rem;
	background: var(--color-gray3);
	bottom: -4.5rem;
	left: calc(50% - 1px);
}

.sf_diag .str:nth-child(2) h5 {
	background: #7993b7;
}

.sf_diag .str ul {
	position: relative;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2.4rem;
	width: 100%;
}

.sf_diag .str ul::after {
	position: absolute;
	content: '';
	display: block;
	width: calc(((100% - 2 * 2.4rem) / 3) * 2 + 2 * 2.4rem);
	height: 2px;
	/* 선 두께 2px */
	background: var(--color-gray3);
	top: -4.5rem;
	left: calc(((100% - 2 * 2.4rem) / 3) / 2 - 1px);
	/* 중앙 정렬을 위해 1px 왼쪽으로 이동 */
}

.sf_diag .str ul li {
	position: relative;
	border: 1px solid var(--color-blue);
	padding: 3rem 1rem;
	border-radius: 7rem;
	-moz-border-radius: 7rem;
	text-align: center;
}

.sf_diag .str ul li::after {
	position: absolute;
	content: '';
	display: block;
	width: 2px;
	height: 4.5rem;
	background: var(--color-gray3);
	top: -4.5rem;
	left: calc(50% - 1px);
	/* 미세한 정렬 조정 */
}

.sf_diag .str ul li div {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.sf_diag .str ul li p {
	font-size: var(--rem-15);
}

@media screen and (max-width:800px) {

	.sf h4{
		font-size: var(--rem-23);
		font-weight: var(--font-md);
	}
	.sf_diag .str {
		gap: 7rem;
	}

	.sf_diag .str h5 {
		width: 100%;
		min-width: 100%;
		color: var(--color-white);
		font-size: var(--rem-25);
	}

	.sf_diag .str h5::after {
		width: 2px;
		height: 3.5rem;
		bottom: -3.5rem;
		left: calc(50% - 1px);
		/* 미세한 정렬 조정 */
	}

	.sf_diag .str ul {
		gap: 2rem;
	}

	.sf_diag .str ul::after {
		width: calc(((100% - 2 * 2rem) / 3) * 2 + 2 * 2.4rem);
		top: -3.5rem;
	}

	.sf_diag .str ul li {
		border-radius: 1rem;
		-moz-border-radius: 1rem;
	}

	.sf_diag .str ul li::after {
		height: 3.5rem;
		top: -3.5rem;
	}
}

/* ==================================================
	경쟁력 - 인증현황황
================================================== */
.certi {
	display: flex;
	flex-direction: column;
	gap: 8rem;
}

.certi .pro_list ul li .txt p:nth-child(1) {
	display: block;
	text-align: center;
}


/* ==================================================
	ESG경영
================================================== */
.esg {
	display: flex;
	flex-direction: column;
	gap: 8rem;
}

.esg_top {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.tit_height {
	height: 240px;
}

.esg_top.envir {
	background: url('../images/esg/environment_top.jpg') 50% 50% no-repeat;
	background-size: cover;
}

.esg_top.social {
	background: url('../images/esg/social_top.jpg') 50% 50% no-repeat;
	background-size: cover;
}

.esg_top.gov {
	background: url('../images/esg/gov_top.jpg') 50% 50% no-repeat;
	background-size: cover;
}


.esg_top .txt {
	background: var(--color-white);
	width: 80%;
	padding: var(--rem-30);
	text-align: center;
}

.esg_top .txt {
	background: var(--color-white);
	width: 80%;
	padding: var(--rem-30) var(--rem-30) 0;
	text-align: center;
	margin-bottom: -2rem;
}

.esg_top .txt h4 {
	font-size: var(--rem-40);
	margin-bottom: var(--rem-10);
}

.esg_top .txt p {
	margin: 0;
}

.esg_list>div {
	display: grid;
	grid-template-columns: 35% auto;
	gap: var(--rem-30);
	padding: var(--rem-40) 0;
	border-bottom: 2px dotted var(--color-gray3);
}

.esg_list>div:first-child {
	padding-top: 0;
}

.esg_list>div h5 {
	font-size: var(--rem-28);
	font-weight: var(--font-md);
}

.esg_list>div ul {
	padding-left: 0;
}

.esg_list>div ul li {
	padding-bottom: var(--rem-10);
	padding-left: 8px;
}

.esg_list>div ul li:last-child {
	padding-bottom: 0;
}

.esg_list>div ul li::before {
	content: "\00B7";
	margin-left: -8px;
	margin-right: 6px;
}

.esg_img_list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--rem-30);
}

.esg_img_list>div {
	display: flex;
	flex-direction: column;
	gap: var(--rem-20);
}

.esg_img_list p {
	text-align: center;
	font-size: var(--rem-22);
	font-weight: var(--font-md);
}

.esg_img_list .img {
	border: 1px solid var(--color-gray3);
}

.esg_img_list .img img {
	width: 100;
	display: block;
}

@media screen and (max-width:800px) {
	.esg_top {}

	.tit_height {
		height: 30vw
	}

	.esg_top .txt {
		width: 90%;
		padding: var(--rem-20);
	}

	.esg_top .txt h4 {
		font-size: 7vw;
	}


	.esg_list>div {
		display: flex;
		flex-direction: column;
		gap: var(--rem-15);
	}
}


/* ==================================================
	커뮤니티 - CONTACT
================================================== */

.consulser_txt {
	width: 100%;
	padding: 12rem 5rem 10rem;
	background: url('../images/community/consulser_txt.jpg') center no-repeat;
	text-align: center;
	color: #ffffff;
}

.consulser_txt div {
	position: relative;
	display: inline-block;
	padding: 4rem 6rem;
	word-break: keep-all;
}

.consulser_txt div::before,
.consulser_txt div::after {
	content: '';
	position: absolute;
	width: 5rem;
	height: 100%;
}

.consulser_txt div::before {
	top: 0;
	left: 0;
	background: url('../images/community/consulser_left.png') left no-repeat;
	background-size: contain;
}

.consulser_txt div::after {
	top: 0;
	right: 0;
	background: url('../images/community/consulser_right.png') right no-repeat;
	background-size: contain;
}

.consulser_txt h3 {
	font-size: var(--rem-40);
}

.consulser_txt p {
	margin-top: var(--rem-18);
	font-size: var(--rem-22);
}

.consulser_txt ul {
	margin-top: var(--rem-35);
	font-size: var(--rem-24);
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 4rem;
}

.consulser_txt img {
	margin-right: var(--rem-10);
}

.consulser_txt .line {
	width: 1px;
	height: 100%;
	min-height: var(--rem-20);
	background: var(--color-white);
}

.cperson_con {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0 30px;
	margin-top: var(--rem-60);
}

.cperson_box {
	border-bottom: 2px solid var(--color-green) !important;
	border: 1px solid #E9ECEF;
	border-radius: 0 50px 0 0;
}

.box-top {
	padding: 30px 30px 0 30px;
	width: 100%;
}

.c-tit01 {
	font-size: 2.5rem;
	/*	color: var(--color-green);*/
	line-height: 1;
	margin: 0 0 25px 0;
	font-weight: 700;
}

.box-bottom {
	background: #E9ECEF;
	padding: 25px 30px 40px 30px;
}

.box-bottom dl {
	position: relative;
	line-height: 2;
	margin-bottom: 15px;
}

.box-bottom dl:last-child {
	margin-bottom: 0;
}

.box-bottom dd {
	font-size: 1.8rem;
	color: #333;
	margin: 7px 0 0 0;
	line-height: 1.9;
}

.cpbox2-bottom dd {
	margin: 7px 0 0 220px;
}

.box-bottom dd:first-child {
	margin-top: 0;
}

.box-bottom dd a[href^=tel] {
	color: #333;
}

.box-bottom dd .bbtitle {
	display: inline-block;
	width: 10rem;
	background-color: var(--color-green);
	border-radius: 50px;
	color: #fff;
	text-align: center;
	font-size: 1.6rem;
	margin-right: 15px;
}

/* 모바일CSS */
@media all and (max-width:1100px) {
	.consulser_txt {
		padding: 10rem 5rem 8rem;
	}

	.consulser_txt div {
		padding: 3rem 6rem;
	}

	.consulser_txt h3 {
		font-size: var(--rem-35);
	}

	.consulser_txt ul {
		font-size: var(--rem-20);
		gap: 3.5rem;
	}

	.cperson_con {
		grid-template-columns: repeat(2, 1fr);
		gap: var(--rem-30);
		margin-top: var(--rem-55);
	}

	.cperson_box {
		border-radius: 0 40px 0 0;
	}

	.c-tit01 {
		font-size: 2.3rem;
		margin: 0 0 20px 0;
	}

	.box-bottom {
		padding: 20px 25px;
	}

}

@media all and (max-width:640px) {
	.consulser_txt {
		padding: 5rem 3rem 4rem;
	}

	.consulser_txt div {
		padding: 2rem 5rem;
	}

	.consulser_txt h3 {
		font-size: var(--rem-28);
	}

	.consulser_txt p {
		margin-top: var(--rem-16);
		font-size: var(--rem-18);
	}

	.consulser_txt ul {
		font-size: var(--rem-16);
		gap: var(--rem-10);
		margin-top: var(--rem-20);
		flex-direction: column;
	}

	.consulser_txt .line {
		min-height: 1px;
		width: 14px;
	}

	.cperson_con {
		margin-top: var(--rem-45);
		grid-template-columns: repeat(1, 1fr);
		gap: var(--rem-20);
	}

	.box-top {
		padding: 20px 20px 0 20px;
	}

	.c-tit01 {
		font-size: 2rem;
		margin: 0 0 15px 0;
	}

	.box-bottom {
		padding: 20px 20px;
	}

	.box-bottom dd {
		display: block;
	}
}


/* ==================================================
	사이트맵
================================================== */
.sitemap:after {
	content: '';
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.sitemap .depth01 {
	float: left;
	width: 18%;
	margin: 0 1%;
	padding-top: 10px;
	border-top: 2px solid #000;
	line-height: 1.5;
}

.sitemap div.depth01 {
	font-size: 1.8rem;
	color: #000;
	font-weight: 600;
}

.sitemap .sub {
	border-top: 1px solid #ccc;
	margin-top: 10px;
	margin-bottom: 25px;
}

.sitemap ul.sub2 {
	padding-left: 14px;
}

.sitemap li.depth02 {
	padding: 8px 0;
	border-bottom: 1px dashed #ccc;
}

.sitemap li.depth02 a {
	font-size: 1.7rem;
	color: #222;
}

.sitemap .sub_m {
	padding-top: 4px;
}

.sitemap .sub_m li {
	background: url('../images/icon/ico_grayDot.png') no-repeat 0 13px;
	background-size: 3px;
	padding-left: 10px;
}

.sitemap .sub_m li a {
	font-size: 1.6rem;
	font-weight: normal;
	color: #495057;
	line-height: 160%;
}

.sitemap .sub_m .model {
	padding-left: 13px;
}

/* 모바일CSS */
@media screen and (max-width:750px) {
	.sitemap .depth01 {
		width: 96%;
		margin: 5px 0 0 0;
	}

	.sitemap div.m01 {
		margin-top: 0 !important;
	}
}