@charset "UTF-8";

.subWrap { 
    font-size:1rem;
    letter-spacing:-0.01em;
    line-height:1.625;
	color:#222;
}

.section { }

.section:not(:last-child) {
    margin-bottom:2rem;
}

.section-pd {
	padding:2rem 0;
} 
.section-ma {
	margin:2rem 0; 
}

/* 타이틀 */
.section-title {
    font-size:2em;
    font-weight:700;
    word-break:keep-all;
}
.section-subtitle {
    font-size:1.625em;
    font-weight:500;
    word-break:keep-all;
}

/* 텍스트 박스 시작점 */
.sub-area-txt { 
	clear:both;
	margin-top:3rem;
}

/* dl */
.sub-dl { 
	display:block; 
	margin-bottom:1rem;
}
.sub-dl dt,
.sub-dl dd { 
	display:inline-block; 
	vertical-align:top; 
}
.sub-dl-block dt,
.sub-dl-block dd { 
	display:block; 
	vertical-align:top; 
}
.sub-dl dt { 
	width:60px; 
} 
.sub-dl-block dt { 
	width:100%;
	margin-bottom:0.5rem;
}
.sub-dl dd { 
	width :90%; /* 구식 브라우저를 위한 대비책(fallback) */
    width :-webkit-calc(100% - 100px); /* for Chrome, Safari */
    width :-moz-calc(100% - 100px); /* for Firefox */
    width :calc(100% - 100px); /* for IE */
	word-break:keep-all;
} 
.sub-dl-block dd { 
	width:100%;
}
.sub-dl dd p { }
.sub-dl dd ol { 
	padding:0.5rem 0; 
}
.sub-dl dd li { 
	list-style:none; 
	display:block;
	margin:0.5rem 0;
}
.sub-dl dd li.inline { 
	display:inline-block;
	margin-right:1rem;
}
.sub-dl dd li.vision_icon { }
.sub-dl dd li.vision_icon img {
	display:inline-block;
	vertical-align:middle;
}
.sub-dl dd li.vision_icon span { 
	display:inline-block;
	vertical-align:middle;
	font-size:1.125rem;
	color:#888;
	padding-left:10px; 
}
.sub-dt-num {
	font-size:2rem;
	color:#909090;
}
.sub-dd-tit {
	font-size:1.8rem;
	color:#909090;
	padding-bottom:0.5rem;
}
.sub-dd-tit2 {
	font-weight:bold;
	font-size:1.6rem;
}

@media (max-width:640px) {
	.sub-dl dt,
	.sub-dl dd { display:block; width:100%; }
	.sub-dl dd li.inline { display:block; }
	.sub-dl dd li.vision_icon img { max-height:70px; }
}





/* 테이블 */
.section-table-title { 
	font-size:1.5rem; 
	padding-bottom:1.5rem;
	position:relative;
} 
.section-table-title:before { 
	content:"";
	position:absolute;
	left:0;
	bottom:-1px;
	width:4rem;
	height:3px;
	background:#ed1c24;
}
.section-box--table {
    padding-top:0.6875rem;
}
.section-box--table th {
    width:6rem;
	font-weight:bold;
}
.section-table > thead > tr > th,
.section-table > thead > tr > td,
.section-table > tbody > tr > th,
.section-table > tbody > tr > td {
    padding:1rem 0;
}
.section-table--sm > thead > tr > th,
.section-table--sm > thead > tr > td,
.section-table--sm > tbody > tr > th,
.section-table--sm > tbody > tr > td {
    padding:0.5rem 0;
}

/*  */
.section p {
    word-break:keep-all;
}

.section-paragraph p + p {
    padding-top:1rem;
}
.section-paragraph--sm p + p {
    padding-top:0.5rem;
}


.pc-none { display:none; }

@media (max-width:768px) {
	.section-title { font-size:1.65rem; }
	.sub-dt-num { font-size:1.65rem; }
	.sub-dd-tit { font-size:1.4rem; }

	.pc-none { display:block; }
	.m-none { display:none; }
}






/* greeting */
.greeting-wrap{display:flex;justify-content: space-between; flex-direction: column-reverse;}
.greeting-wrap .sub-area-txt:first-child{padding-right:10px;}
.about-greeting{padding:10px;}
.about-greeting .section-paragraph {font-weight:bold; font-size:18px; margin-top:30px; color:#4e4e4e;}
.about-greeting .img-sign {
    display:inline-block;
    vertical-align:bottom;
    margin-left:0.25rem;
}
.about-greeting .sub-area-txt p { font-size:1.2em; word-break:keep-all; color:#555;}
.about-greeting .sub-area-txt p + p { margin-top:20px; }
.about-greeting .section-title{padding-top:20px;} 
@media screen and (max-width:768px) {
	.about-greeting .sub-area-txt p { font-size:1em; }
	.sub-area-txt{margin-top: 1.5rem;}
	.about-greeting .section-title{padding-top:40px;} 
}

@media screen and (min-width:768px) {
	.about-greeting .section-paragraph {font-size:20px;}
	
}

@media screen and (min-width:1024px) {
	.about-greeting .section-paragraph {font-size:25px;  margin-top:40px;}
	.greeting-wrap{flex-direction: row;}
}

/* 히스토리 */
#historyBox { clear:both; }
#historyBox > ul { width:100%; padding:0 50px 0 300px; box-sizing:border-box; }
#historyBox > ul > li { position:relative; padding:23px 0 45px 45px; border-left:1px solid #ebebeb; }
#historyBox > ul > li:last-child { padding-bottom:0; }
#historyBox .yearList dt { position:absolute; left:-166px; top:0; width:170px; height:70px; line-height:70px; padding-right:50px; text-align:right; box-sizing:border-box; background:#fff; font-size:2rem; }
#historyBox .yearList dt:after { content:""; position:absolute; right:0; top:50%; display:inline-block; width:8px; height:8px; border-radius:4px; margin-top:-4px; background:#ed1c24; }
#historyBox .monthList > li { position:relative; margin-top:30px; }
#historyBox .monthList > li:first-child { margin-top:0; }
#historyBox .monthList > li > strong { position:absolute; left:0; top:0; display:inline-block; width:60px; font-weight:400; }
#historyBox .monthList > li li { margin-top:10px; }
#historyBox .monthList > li li:first-child { margin-top:0; }

@media screen and (max-width:767px) {
	#historyBox > ul { padding:0 15px; }
	#historyBox > ul > li { padding:0 0 50px 30px; }
	#historyBox .yearList dt { position:relative; left:auto; top:auto; width:auto; height:34px; margin-left:-34px; line-height:34px; margin-bottom:10px; padding:0 0 0 35px; text-align:left; font-size:1.65rem; }
	#historyBox .yearList dt:after { right:auto; left:0; }
	#historyBox .monthList > li { padding-left:0; }
	#historyBox .monthList > li > strong { position:static; left:auto; top:auto; display:block; width:auto; margin-bottom:10px; font-size:1.333rem; }
	#historyBox .monthList > li li { font-size:1rem; }
	#historyBox > ul > li:last-child { border-left:0; }
	#historyBox .imgArea p strong { font-size:1.333rem; }
}




/*
 * location
*/
.about-location .section {
    font-size:1rem;
    font-weight:400;
}
.about-location .section .section-table {
	padding:1.375rem 1.375rem 2.75rem; 
}
.about-location .location-tabs {
    font-size:0.9333em;
    border:1px solid #ddd;
    border-bottom:0;
}
.about-location .location-tabs > li {
    width:50%;
    margin-bottom:0;
}
.about-location .location-tabs > li > a {
    margin-right:0;
    padding:0;
    text-align:center;
    line-height:3.3333;
    background-color:#f7f7f7;
    border:0;
    border-bottom:1px solid #ddd;
}
.about-location .location-tabs > li + li > a {
    border-left:1px solid #ddd;
}
.about-location .location-tabs > .active > a:hover,
.about-location .location-tabs > .active > a:focus,
.about-location .location-tabs > .active > a {
    color:inherit;
    border-top:0;
    border-right:0;
}
.about-location .location-tabs > .active > a {
    font-weight:500;
    background-color:#fff;
    border-bottom-color:transparent;
}
.about-location .location-panes {
    padding:1rem 2rem;
    border:1px solid #ddd;
    border-top:0;
}
.about-location .contact-icon {
    top:50%;
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%);
    font-size:1.125rem;
}
.about-location .fa-map-marker {
    font-size:1.5rem;
}


/* ci 소개 */
.about-ci { }
.about-ci .page_ci_img { margin-bottom:2rem; }
.about-ci .ci-icon,
.about-ci .ci-txt { display:inline-block; vertical-align:middle; margin-bottom:0.5rem; }
.about-ci .ci-icon { width:90px; }
.about-ci .ci-txt { width:calc(100% - 110px); padding-left:20px; }
.about-ci .colorchip { display:inline-block; width:10px; height:10px; margin-right:10px; }
.about-ci .colorchip.color_bg1 { background-color:#ed1c24; }
.about-ci .colorchip.color_bg2 { background-color:#65646a; }
.about-ci .btn_wrap { 
	margin-top:2rem; 
}
.about-ci .btn_wrap a { 
    min-width:11rem;
    height:auto;
    padding:0.75rem 1rem;
    margin:0 1px;
    font-size:1rem;
    font-weight:300;
    line-height:1.5;
    text-align:left;
}


/* 윤리강령 */
.about-ethics { }
.about-ethics p { text-align:justify; }
.about-ethics .section-tit { font-size:1.125rem; font-weight:500; padding-top:1rem; }
.about-ethics .section-tit.first { padding-top:0; }
.about-ethics .text-bold { font-weight:600; }
.about-ethics .section-table-title { padding-top:2rem; }
.about-ethics .section-table-title.first { padding-top:0; }
.about-ethics .pdtop { padding-top:0.5rem; }
.about-ethics em.underline { text-decoration:underline; }
.about-ethics .section-toptxt { padding:2rem; font-family:'Noto Serif KR', serif; }
.about-ethics .section-toptxt p { font-size:1.125rem; }
.about-ethics .section-txt { padding:2rem; font-family:'Noto Serif KR', serif; }
.about-ethics .section-txt p { padding-left:20px; }

/* 사이트맵 */
.site_map { margin:0 auto; padding-top:2rem; font-size:0; }
.site_map:after { display:block; content:''; clear:both; }
.site_map .site_list { display:inline-block; zoom:1; *display:inline; vertical-align:top; width:20%; }
.site_map .site_list .tit { display:block; font-size:1.5rem; padding-bottom:0.5rem; }
.site_map .site_list ul { }
.site_map .site_list li { line-height:30px; }
.site_map .site_list li a { font-size:1rem; color:#7a7a7a; }
.site_map .site_list li a:hover { color:#222; padding-left:4px; }
@media (max-width:768px) {
	.site_map .site_list .tit { font-size:1.2rem; }
	.site_map .site_list li a { font-size:0.85rem; }
}
@media (max-width:520px) {
	.site_map { text-align:center; }
	.site_map .site_list { width:100%; text-align:center; padding-bottom:1rem; }
}



/* 비즈니스 관련 페이지 탭 */
.business-tabs { }
.business-tabs > li {	
	float:left; 
	width:50%; 
}
.business-tabs-5 > li {
	width:25%; 
}
.nugu_tabs > li {
	width:25%; 
}
.business-tabs03 li{
	width:33.3%;
}

@media all and (max-width:991px) {
.business-tabs-5 > li { width:33.33%; }
}

.business-tabs {
            display: flex;
            justify-content: center;
            align-items: center;
            list-style: none;
            padding: 0;
            margin: 0px auto 130px;
			max-width: 800px;
        }

        .business-tabs li {
            position: relative;
            padding: 0 25px;
        }

        .business-tabs li:not(:last-child)::after {
            content: '';
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 1px;
            height: 16px;
            background-color: #dcdcdc;
        }

        .business-tabs li > a {
            text-decoration: none;
            color: #555;
            font-size: 20px;
            font-weight: 500;
            padding-bottom: 4px;
            display: inline-block;
            border-bottom: 2px solid transparent;
            transition: all 0.3s ease;
        }

        .business-tabs li > a:hover , .business-tabs li > a:focus  {
            color: #343F7D;
			background:transparent;
			border-color:#343F7D;
			display:inline-block;
        }

        .business-tabs .active a {
            color: #343F7D;
            font-weight: 600;
            border-bottom: 2px solid #343F7D;
			display:inline-block;
        }
.business-panes { 
}
.business-panes p img {
	margin:0 auto;
}

/* 리뉴얼 tabs */





/* vrzon */
.vr_infoBox { position:relative; padding-top:66px; border-bottom:1px solid #ddd; padding-bottom:3rem; }
.vr_infoBox:after { content:""; display:block; clear:both; }
.vr_infoBox > li { float:left; text-align:center; width:48%; margin-right:2%; position:relative; }
.vr_infoBox > li:last-child { margin-right:0; }
.vr_infoBox > li:last-child:after { display:none; }
.vr_infoBox > li > .img { border:2px solid #ddd; border-radius:50%; width:140px; height:140px; line-height:140px; display:inline-block; position:relative; margin-bottom:70px; }
.vr_infoBox > li > .img:before { content:""; display:inline-block; width:168px; height:168px; border:1px solid #ddd; border-radius:50%; position:absolute; top:-16px; left:-16px; }
.vr_infoBox > li > .img:after { content:""; display:inline-block; width:1px; height:70px; background:#ddd; position:absolute; bottom:-70px; left:50%; transform:translateX(-50%); }
.vr_infoBox > li > .txt > h4 { font-size:2rem; margin:1rem 0; }
.vr_infoBox > li > .txt > ul > li { font-size:1rem; margin-bottom:0.5rem; }
.vr_infoBox > li > .txt > ul > li:before { content:""; display:inline-block; width:3px; height:3px; background:#ed1c24; margin-right:5px; margin-bottom:5px; }
.vr_infoBox > li > .txt > ul > li:last-child { margin-bottom:0; }
@media (max-width:768px) {
	.vr_infoBox > li { float:none; width:100%; margin-right:0; margin-bottom:2rem; }
	.vr_infoBox > li:last-child { margin-bottom:0; }
	.vr_infoBox > li > .img { width:100px; height:100px; line-height:100px; margin-bottom:40px; }
	.vr_infoBox > li > .img img { height:44px; }
	.vr_infoBox > li > .img:before { width:116px; height:116px; position:absolute; top:-10px; left:-10px; }
	.vr_infoBox > li > .img:after { height:40px; position:absolute; bottom:-40px; }
	.vr_infoBox > li > .txt > h4 { font-size:1.65rem; }
	
.business-tabs02 > li > a {font-size:1.0em;}
}




/* 인재채용 */
.page-recruit { }
.recruit-box {
	clear:both;
	margin-top:30px;
}
.recruit-box.first {
	margin-top:0;
}
.recruit-tabs { }
.recruit-tabs.mission-tab > li{
width:50%;}

.recruit-tabs > li {	
	float:left; 
	width:33.33%;
	background:#999; 
	cursor:pointer;
}
.recruit-tabs > li.active { 
	background:#3c6db1;
}
.recruit-tabs > li:nth-child(1) {
	border-radius:5px 0 0 5px; 
}

.recruit-tabs.mission-tab > li:nth-child(2) {
	border-radius:0 5px 5px 0
}
.recruit-tabs > li:nth-child(3) {
	border-radius:0 5px 5px 0
}
.recruit-tabs > li > a {
	display:block;
	padding:1rem 0;
	color:#fff;
	font-weight:300;
	font-size:1.25rem;
	letter-spacing:-0.01em;
	line-height:1;
	-webkit-transition:color 0.3s ease-in-out, border 0.3s ease-in-out;
	-moz-transition:color 0.3s ease-in-out, border 0.3s ease-in-out;
	-ms-transition:color 0.3s ease-in-out, border 0.3s ease-in-out;
	-o-transition:color 0.3s ease-in-out, border 0.3s ease-in-out;
	transition:color 0.3s ease-in-out, border 0.3s ease-in-out;
}
.recruit-tabs > li > a:focus,
.recruit-tabs > li > a:hover {
	color:#fff;
	background-color:transparent;
}
.recruit-tabs > li.active > a,
.recruit-tabs > li.active > a:focus,
.recruit-tabs > li.active > a:hover {
	color:#fff;
	font-weight:500;
}
.recruit-panes {
	clear:both;
	border:0;
	padding:2rem 0; 
}
.recruit-panes p img {
	margin:0 auto;
}
.recruit-panes h3 { 
	display:block;
    font-size:1.8rem;
    color:#909090;
    padding-bottom:1rem;
    margin-bottom:1rem;
	position:relative;
}
.recruit-panes h3:before {
	content:"";
	display:block;
	position:absolute;
	background:#909090;
	bottom:0;
	left:0;
	width:30px;
	height:2px;
}

.recruit-txt-list { clear:both; height:auto; overflow:hidden; }
.recruit-txt-list > div { padding:0; }
.recruit-txt-list > div > h4 { font-size:1.333rem; font-weight:500; position:relative; padding-left:10px; margin-bottom:0.5rem; }
.recruit-txt-list > div > h4:before { content:""; position:absolute; left:0; top:50%; z-index:1; background:#ed1c24; width:3px; height:18px; margin-top:-9px; }
.recruit-txt-list > div > dl { display:block; margin-bottom:0.5rem; }
.recruit-txt-list > div > dl > dt { display:inline-block; vertical-align:top; width:70px; font-weight:bold; }
.recruit-txt-list > div > dl > dd { display:inline-block; vertical-align:top; }
.recruit-txt-list > div > p { margin-bottom:0.5rem; }
.recruit-txt-list2 > div > dl { margin-bottom:1rem; }
.recruit-txt-list2 > div > dl > dt { display:block; width:100%; margin-bottom:0.5rem; }
.recruit-txt-list2 > div > dl > dd { display:block; }
.bg-recruit { position:absolute; bottom:0; right:0; z-index:1; padding-bottom:4rem; }
.btn-recruit-form { min-width:200px; position:absolute; bottom:-21px; left:50%; z-index:1; margin-left:-100px; }
@media (max-width:768px) {
	.recruit-panes p.bordered.section-pd { padding:2rem 1rem; }
	.bg-recruit { display:none; }
}



/* 탭 */
.history-tabs { clear:both; margin:0 auto; text-align:center; padding-bottom:6rem; }
.history-tabsl:after { content:''; display:block; clear:both; }
.history-tabs li { display:inline-block; transition:0.25s; } 
.history-tabs li a { font-size:26px; color:#000; letter-spacing:-0.6px; font-weight:400; display:block; transition:0.25s; padding:5px 20px; border: 1px solid #000; border-radius:50px;} 
.history-tabs li.active a { color:#fff; background:#000; font-weight:bold; }
.history-tabs li a:hover {background:#000; color:#fff; transition:0.25s; } 
.history-tabs li:focus a { }

/* 내용 */
.about-history .bar_img { text-align:center; }
.about-history .bar_img img { height:170px; margin:0 auto; }

/* 반응형 */
@media only screen and (min-width:1024px) { 
	#timelineArea { margin-top:0; margin-bottom:3em; }
	#timelineArea::before { left:50%; margin-left:-2px; }


}

@media only screen and (max-width:1024px) { 
	.history .bar_img { text-align:center; }
	.history .bar_img img { display:block; width:auto; height:auto; max-width:100%; }
	.timeline-con { }
	.timeline-con h2 { margin-top:-5px; font-size:20px; }
	.timeline-con ul { margin-top:10px; }
	.timeline-con ul li { font-size:14px; color:#4c4c4c; line-height:21px; position:relative; padding-left:10px; }
	.timeline-con ul li strong { display:none; }
	.timeline-con ul li:before { content:""; position:absolute; top:50%; left:0; margin-top:-1px; width:3px; height:3px; background:#ed1c24; }
}

@media only screen and (max-width:768px) { 
	.history-tabs li { } 
	.history-tabs li a { font-size:16px;  } 
	.history-tabs{padding-bottom: 2rem;}
	#history01, #history02, #history03{    flex-direction: column;}
}


#history01, #history02, #history03{
	justify-content: flex-end;
	    align-items: flex-start;
		gap:50px;
}
#history01.active, #history02.active, #history03.active{
	display:flex;
}

.tab-pane h1{font-weight: bold; font-size: 50px; line-height: 1; width:25rem;}
.tab-pane h1 span{display:block; text-align:center;}



.timeline-container {
	width: 100%;
	max-width: 800px;
	position: relative;
}

/* The vertical line */
.timeline-container::before {
	content: '';
	position: absolute;
	left: 100px;
	top: 20px;
	bottom: 20px;
	width: 3px;
	background-color: #e0e0e0;
}

.timeline-block {
	display: flex;
	position: relative;
	margin-bottom: 2rem;
}

.timeline-year {
	flex: 0 0 100px;
	text-align: right;
	padding-right: 2rem;
	font-size: 1.75rem;
	font-weight: 700;
	color: #8270db;
	box-sizing: border-box;
}

.timeline-dot {
	position: absolute;
	left: 101px;
	top: 10px;
	transform: translateX(-50%);
	width: 15px;
	height: 15px;
	background-color: #8270db;
	border-radius: 50%;
	border: 2px solid #fff;
}

.timeline-content {
	flex: 1;
	padding-left: 2rem;
	padding-top: 5px;
}

.timeline-content ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.timeline-content li {
	color: #555;
	margin-bottom: 0.5rem;
	line-height: 1.6;
}

.timeline-content li span{font-size:17px; color:#000; padding-right:5px; font-weight:bold; }

@media (max-width: 768px) {

	.timeline-container::before {
		left: 80px; /* 모바일 화면에 맞게 라인 위치 조정 */
	}
	
	.timeline-year {
		flex: 0 0 80px; /* 연도 영역 너비 조정 */
		padding-right: 1rem;
		font-size: 1.2rem; /* 모바일용 폰트 크기 조정 */
	}

	.timeline-dot {
		left: 80px; /* 라인 위치에 맞게 조정 */
		top: 5px;
	}

	.timeline-block {
		margin-bottom: 2.5rem; /* 블록 간격 조정 */
	}

	 .timeline-content {
		padding-left: 1.5rem; /* 콘텐츠 좌측 여백 조정 */
	}
	.timeline-content li { font-size: 0.9rem; }
	.tab-pane h1{display:none;}
	#history01, #history02, #history03{gap:20px;}
}

@media (min-width: 1200px) {
	.tab-pane h1 {font-size: 70px;}
}





/* 20191106 추가 */
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.inline-list { display:table; margin:0 auto; }
.inline-list:after { content:""; display:block; clear:both; }
.inline-list li { display:table-cell; vertical-align:middle; padding:10px 10px; }

.vrzon-p { font-size:1.4rem; word-break:keep-all; }

#atc_page { clear:both; text-align:center; margin:2em auto; }
#atc_page .pg_page.active {
    font-weight:normal;
    color:#222;
    border-bottom:1px solid #222;
}


/*************   ci_new   ****************/

.ci_new { text-align:left; }
.ci_new section { margin-bottom:100px;}
.ci_new section  h3 { display:block; font-size:46px; color:#8270db; margin-bottom:40px; font-weight:600; }
.ci_new .ci_cnt01 b { font-size:20px; color:#434343; line-height:24px; font-weight:420; }
.ci_new section > p { font-size:18px; color:#555; line-height:28px; font-weight:320; text-align:left; padding-bottom:20px;padding-left:10px;}
.ci_new section img {width:100%;}
.ci_t_img { margin:30px 0; }
.ci_pc_img { width:100%; }
.ci_mo_img { display:none; }
.ci_btn { text-align:center; width:250px; height:53px; margin:0 auto; }
.ci_btn a { display:block; width:100%; line-height:53px; background:#8270db; color:#fff; font-weight:420; font-size:20px; letter-spacing :-.2px; border-radius:12px; }


.ci_btn2 { text-align:center; width:100%; height:53px; margin:0 auto; }
.ci_btn2 > div { width:49.5%; display:inline-block; }
.ci_btn2 a { display:block; width:90%; margin:0 auto; line-height:53px; background:#8270db; color:#fff; font-weight:420; font-size:20px; letter-spacing :-.2px; border-radius:12px; }

.logo-showcase {
	background-color: #ffffff;
	border: 1px solid #e5e7eb;
	padding: 4rem 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	margin-bottom: 2rem;
}

.logo-item {
	display: flex;
	align-items: center;
	font-size: 2.5rem;
	font-weight: 900;
	font-family: 'Inter', sans-serif;
	color: #1f2937;
	letter-spacing: -0.05em;
	width:50%;
}

.logo-item .separator {
	display: inline-block;
	width: 0.75rem;
	height: 2.1rem;
	background-color: #8270db;
	margin: 0 0.5rem;
}

.logo-item.logo-kr span:not(.separator) {
	 font-family: 'Noto Sans KR', sans-serif;
}

.download-section {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.download-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	border: 1px solid #d1d5db;
	padding: 0.5rem 1rem;
	border-radius: 0.25rem;
	text-decoration: none;
	color: #4b5563;
	font-size: 0.875rem;
	font-weight: 500;
	background-color: #ffffff;
	transition: background-color 0.2s;
}

.download-btn:hover { background-color: #f3f4f6; color:#4b5563;}

.download-btn svg {
	width: 1rem;
	height: 1rem;
}

/* Responsive */
@media (min-width: 768px) {
	.logo-showcase { 
		flex-direction: row;
		justify-content: space-between;
		padding: 5rem 2rem;
		gap: 1.5rem;
	}
	.logo-info p{white-space: pre-line;}
	
}
@media (min-width: 1480px) {
	.logo-showcase { 
		gap: 4rem;
	}
	
}


.ci_new .ci_color b { font-size:30px; color:#8270db; line-height:24px; font-weight:420; }
.ci_new h1{font-size:32px; font-weight:bold; padding-bottom: 10px;}
.color-palette {
	display: flex; margin-top:30px;
}
.logo-info{width:50%;}
.logo-info p{    font-size: 18px;
    color: #555;
    line-height: 28px;
    font-weight: 320;
    text-align: left;}

.color-block {
	padding: 5rem 2rem;
	display: flex;
	justify-content: space-between;
	width: 100%;
	box-sizing: border-box;
	flex-direction: row;
	align-items: center;
}

.color-block.text-white { color: #ffffff; }
.color-block.text-black { color: #000000; }

/* Color-specific backgrounds */
.bg-peri { background-color: #8270db; }
.bg-turq { background-color: #10e8e2; }
.bg-pink { background-color: #e6c2ff; }

.bg-hotp { background-color: #E21944; }
.bg-purp { background-color: #8f4790; }
.bg-vrgr { background:linear-gradient(to right, #E21944, #8f4790);}

.color-info h2 {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0 0 0.25rem 0;
}

.color-info p {
	font-size: 1.125rem;
	margin: 0;
}

.color-values {
	font-weight: 500;
}

.color-values p {
	margin: 0.25rem 0;
}

.color-values .hex {
	font-weight: 700;
}

.color-row {
	display: flex;
	flex-direction: column;
}

/* Responsive Styles */
@media (min-width: 768px) {

	.color-info { margin-bottom: 0; }
	.color-values { text-align: right; }
	
	.color-row { flex-direction: row; }
	.color-row .color-block { width: 50%; }
}

@media (max-width: 1024px) {
	.logo-info{width:100%;}
	.logo-item{width:100%;}
	.color-palette{flex-direction: column;}
}


/* business 가방 */

.gabang_bx a{display:block;}

@media (max-width:768px) {
		
br.m_off {display:none;}
.ci_pc_img { display:none }
.ci_mo_img { display:block; width:100%;}

.ci_new section { margin-bottom:60px;}
.ci_color {  padding-top:60px; }
.ci_new section  h3 { font-size:1.7em; margin-bottom:20px; font-weight:520; }
.ci_new .ci_cnt01 b { font-size:1.2em; line-height:180%;}
.ci_new section > p { font-size:1.0em; line-height:180%;}
.ci_btn {  width:200px; height:53px }
.ci_btn a {  line-height:53px; font-size:0.95em;}

.ci_btn2  { height:auto; }
.ci_btn2 >div { width:100%; display:block; }
.ci_btn2 >div.ci_b_right { margin-top:3%;}
.ci_btn2 a {  width:98%; line-height:53px; font-size:0.95em; }

.ci_new .ci_color b { font-size:1.7em; line-height:180%; font-weight:420; }
.ci_mo_img.ci_img02.us{display:block;}

.qa_board_text{height:100px !important;}
.qa_board_text p{font-size:15px !important; line-height:25px; word-break:keep-all;}
.logo-info p{font-size:1em;}
.color-block{padding:2rem;}

}


/* 고객의소리  text 추가 */

.qa_board_text{padding-bottom:20px; height:68px;}
.qa_board_text p{text-align:center; font-size:18px; font-weight:bold;}
.qa_board_text p span{font-weight:400; font-size:34px; position:relative; top:6px;}


/*고객의 소리 */
.link_bx{margin-top:40px;}
.link_bx ul li{width:100%; padding-bottom:20px;}

.link_bx ul li a{display:block;}
.link_bx ul li a img{width:100%;}

.advertising_bx2{margin-top:20px;}


@media (min-width:768px) {
	
.link_bx ul li{width:49%; float:left; text-align:center;}
.link_bx ul li:first-child{margin-right:2%;}
.adv_img img{width:75%;}
}

/* 임시 인사말 */
.hd_wrt{font-family:'NanumGangInHanWiRo', sans-serif; font-size: 28px; font-weight: 600;}

@media (min-width:1024px) {
.hd_wrt{font-size: 42px;}
}

/* 광고제휴문의 */
.about-adv .advwrap{box-sizing:border-box;padding:40px;border:1px solid #eee;}
.about-adv .top_tit{margin-bottom:20px;}
.about-adv .top_tit ul:after{content:"";display:block;clear:both;}
.about-adv .top_tit ul li{width:50%;float:left;}
.about-adv .top_tit ul li label{color:#000;display:inline-block;min-width:120px;font-weight:600;}
.about-adv .top_tit ul li input[type=text]{box-sizing:border-box;padding:5px;min-width:240px; border:2px solid #212121;}
.about-adv .e_organization{margin-bottom:20px;}
.about-adv .e_organization h5{display:inline-block;min-width:120px;font-weight:600;}
.about-adv .e_organization .formation{display:inline-block;}
.about-adv .e_organization .formation select{min-width:240px;box-sizing:border-box;padding:5px; border:2px solid #212121; color:#7c7c7c;}
.about-adv .gengre{margin-bottom:20px;}
.about-adv .gengre h5{display:inline-block;min-width:120px;font-weight:600;margin-bottom:10px;}
.about-adv .gengre_bx {background:#f2f0fe;box-sizing:border-box;padding:10px;}
.about-adv .gengre_bx input[type="checkbox"] {position:absolute; width:1; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0);border:0;}
.about-adv .gengre_bx input[type="checkbox"] + label {cursor:pointer;}
.about-adv .gengre_bx input + label {display:inline-block; height:38px; background:#fff; border: 1px solid ; border-radius: 1px; text-align:center; line-height:38px; color:#8270db; font-size:15px; margin:0 10px 0 0; padding: 0 10px;}
.about-adv .gengre_bx input[type="checkbox"]:checked + label{background:#8270db; color:#fff;}
.about-adv .gengre_bx ul li{display:inline-block;}
.about-adv .adtxtwrp h5{display:inline-block;min-width:120px;font-weight:600;}
.adtxtwrp textarea{width:100%;border:1px solid #ccc;min-height:160px;box-sizing:border-box;padding:10px;}
.about-adv .agrbx h2{display:inline-block;min-width:120px;font-weight:600;}
.adtime_info{margin-bottom:5px;}
.adtime_info2{margin-top:10px;background:#f8f8f8;box-sizing:border-box;padding:20px !important;}
.adt_ul{margin-top:5px;}
.adt_ul li{position:relative;box-sizing:border-box;padding-left:15px;margin-bottom:10px;}
.adt_ul li:before{content:"";display:block;width:6px;height:6px;border-radius:50%;background:#999;position:absolute;top:7px;left:2px;}

.res_p{height:150px; overflow-y:scroll; border:1px solid #ddd; margin-bottom:10px;}
.res_p .doc{border:0px;padding:20px;background:#f8f8f8;}
.res_form{padding:10px; padding-bottom:20px;}
.res_form form h2{padding-bottom:5px; font-size:16px; color:#8877dd;}
.res_form form label{font-size:14px;}
.res_p .doc .article h2{color:#666;}
.agrbx{padding:0;}
.adtxtwrp{margin-bottom:20px;}
.bottom_btn{text-align:center;margin:20px 0;}
.bottom_btn a,.bottom_btn input, .bottom_btn button{ 
	padding:6px 14px; 
	text-align:center;
	font-weight:500;
	border-radius:0;
	vertical-align:middle;
	transition:all 0.3s ease-out; 
	border:1px solid #000;
	min-width:120px;
	display:inline-block;
}
.bottom_btn a{ background:#fff; border-color:#a7a7b1; color:#68686e; }
.bottom_btn a:hover { border-color:#333; color:#333; } 
.bottom_btn input{background:#393939;color:#fff;}

@media (max-width:768px) {
	.about-adv .top_tit ul li{width:100%;float:none;}
	.about-adv .top_tit ul li:first-child{margin-bottom:20px;}
}



.side_flex_wrap{display: flex; gap: 40px;}

.vision-sidebar {
	flex: 0 0 230px;
}

.vision-sidebar ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.vision-sidebar li {
	padding: 27px;
	border-bottom: 1px solid #e0e0e0;
}

.vision-sidebar li span {
	display: block;
}

.vision-sidebar li .ko {
	font-size: 22px;
	font-weight: bold;
}

.vision-sidebar li .en {
	font-size: 14px;
}

.content_box_wrap{
	flex: 1;
}



.content-box {
	text-align: center;
    padding: 0 27px;
    font-size: 22px;
    font-weight: bold;
    height: 113px;
    line-height: 113px;
	border:#8270db 2px solid;
	color:#8270db;
}

.mission {
	background-color: #8270db;
	color: #fff;
}

.core-values {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	margin-top: 20px;
}

.value-card {
	flex: 1;
	border: 1px solid #e0e0e0;
	padding: 30px 20px;
	text-align: center;
	background-color: #fdfdfd;
	margin-bottom: 20px;
}

.value-card .logo {
	height: auto;
	margin-bottom: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.value-card .logo img {
}

.value-card .title {
	font-size: 18px;
	font-weight: bold;
	padding-bottom: 5px;
}

.value-card .subtitle {
	font-size: 14px;
	color: #555;
	margin: 5px 0 15px 0;
}

.value-card .description {
	font-size: 15px;
	color: #666;
	line-height: 1.5;
}

.extra-values {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	margin-top: 40px;
	text-align: center;
}

.extra-item {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
}

.extra-item .description {
	color:#8270db;
	word-break: auto-phrase;
}

@media (max-width: 1024px) {
            .side_flex_wrap { flex-direction: column; gap: 20px; }
            .vision-sidebar { flex: 0 0 auto; }
        }

/* 768px 이하 (모바일) */
@media (max-width: 768px) {
	.vision-content { padding: 15px; }
	.core-values { flex-direction: column; gap:0;}
	.vision-sidebar li { padding: 20px; text-align: center;}
	.vision-sidebar li .ko { font-size: 20px; }
	.content-box {
		height: auto;
		line-height: 1.5;
		padding: 20px;
		font-size: 20px;
	}
	.value-card { padding: 20px; }
	.side_flex_wrap { margin-bottom: 30px; }
}


.top-image-container {
            width: 100%;
            margin-bottom: 50px;
        }
        .top-image-container img {
            width: 100%;
            height: auto;
            display: block;
        }

        /* Intro Section (2-column layout) */
        .intro-section {
            display: flex;
            align-items: center;
            gap: 40px;
            margin-bottom: 80px;
			 margin-top: 80px;
        }
        .intro-section .text-content {
            flex: 1;
        }
        .intro-section .image-content {
            flex: 1.5; background-color:#F2EAFF; padding: 0 70px 30px; border-radius:20px; max-height:390px;
        }
		#ai_02 .intro-section .image-content{padding-right:0; padding-bottom:0;}
        .intro-section .text-content h2 {
            font-size: clamp(1.3rem, 1.5vw, 2rem);
            font-weight: normal;
			margin-bottom: 10px;
        }
        .intro-section .text-content h3 {
            font-size: clamp(2rem, 2.9vw, 4rem);
            font-weight: bold;
            color: #8267FF;
            margin-top: 0;
            margin-bottom:50px;
			line-height:1.1
        }
		.intro-section .text-content h3 span{
			color:#000; font-weight:normal; display: block	
		}
        .intro-section .text-content .subtitle {
            font-size: 24px;
            font-weight: normal;
            color: #000;
            margin-bottom: 20px;
        }
        .intro-section .text-content p {
            font-size: clamp(1rem, 1.5vw, 1.3rem);
            color: #555;
        }
        .intro-section .image-content img {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 8px;
			    transform: translateY(-60px);
        }

        /* Features Section */
        .features-title {
            text-align: center;
            margin-bottom: 40px;
        }
        .features-title h3 {
            font-size: clamp(2rem, 3vw, 2.9rem);
            font-weight: bold;
        }

		.features-title p {font-size: clamp(1rem, 1.5vw, 1.3rem);}

        .features-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
			margin-bottom:100px;
        }

        .feature-item {
            background:linear-gradient(to top, #AB78FF1a, #B68BFF);
            border-radius: 12px;
            overflow: hidden; 
            text-align: center;
			padding: 25px;
        }

		.feature-item:nth-child(2) {
            background:linear-gradient(to top, #6880FF1a, #8195FF);
            border-radius: 12px;
            overflow: hidden; 
            text-align: center;
			padding: 25px;
        }
        .feature-item img {
            width: 100%;
            height: auto;
            display: block;
        }
        .feature-item .feature-text {
            padding: 25px;
			display: flex;
			flex-direction: column;
			justify-content: center;
        }
        .feature-item h4 {
            font-size: clamp(1.4rem, 1.5vw, 1.6rem);
            font-weight: bold;
            margin-top: 0;
            margin-bottom: 15px;
        }
        .feature-item p {
            font-size: clamp(1rem, 1.5vw, 1.2rem);
            color: #555;
            margin: 0;
        }

.services-section{background:linear-gradient(to bottom, #EBF6FF, #F6EBFF); padding: 100px 10px 160px; margin-top:100px; margin-bottom: 100px; border-radius:20px;}

		.services-section .section-title {
            text-align: center;
            font-size: clamp(2rem, 3vw, 2.9rem);
            font-weight: bold;
            margin-bottom: 50px;
        }

        .services-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 25px;
			max-width:1200px;
			margin:0 auto;
			width:100%;
        }

        .service-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            background-color: #fff;
            padding: 55px 40px;
            border-radius: 16px;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.07);
        }

		.service-item:nth-child(2n){transform: translateY(40px);}
        
        .service-item .text-content h4 {
            font-size: clamp(1.4rem, 1.5vw, 1.6rem);
            margin: 0 0 20px 0;
			font-weight:500
        }

        .service-item .text-content p {
            font-size: clamp(1rem, 1.5vw, 1.2rem);
            color: #666;
            margin: 0;
        }

        .service-item .icon-content {
            width: 100px;
            height: 100px;
            min-width: 60px;
            margin-left: 20px;
            border-radius: 12px;
            background: linear-gradient(to right, #6880FF, #9A5DFF);;
            display: flex;
            align-items: center;
            justify-content: center;
			flex-shrink: 0;
        }
		.service-item .icon-content img{
			padding: 10px;
			max-width: 100%;
		}
		.how-to-use-section .section-title { text-align: center; font-size: clamp(2rem, 3vw, 2.9rem); font-weight: bold; margin-bottom: 40px; }
        .usage-container {
            background-color: #F1F1F1;
            border-radius: 20px;
            padding: 40px 80px;
            text-align: center;
			width: fit-content; margin: 0 auto;
        }
        .usage-banner {
            background: linear-gradient(90deg, #887aff, #62a1ff);
            color: white;
            padding: 18px 35px;
            border-radius: 50px;
            font-size: clamp(1.3rem, 1.5vw, 2rem);
            font-weight: 600;
            display: inline-block;
            margin-bottom: 40px;
			width:100%;
        }
		.usage-image-placeholder{max-width: 830px;}
        .usage-image-placeholder img { max-width: 100%; height: auto; border-radius: 8px;  }

        

        /* Responsive Styles */
		@media (max-width: 1200px) {
            .service-item {padding:30px;}
        }
        @media (max-width: 1080px) {
            .intro-section { flex-direction: column-reverse; text-align: center; margin-top:0;}
            .features-grid { grid-template-columns: 1fr; }
			.service-item .icon-content{width:80px; height:80px;}
			.intro-section .image-content{padding:20px; max-height:unset;}
			.intro-section .image-content img{transform: translateY(0px);}
			.feature-item{display:flex;}
			.feature-item img{width:50%; object-fit:contain;}
			.intro-section .text-content h3{line-height:1.2;}
			.business-tabs{margin: 0px auto 40px;}
        }
        
        @media (max-width: 768px) {
            .intro-section h3, .features-title h3, .services-section .section-title, .how-to-use-section .section-title { font-size: 26px; }
            .intro-section .subtitle { font-size: 20px; }
            .feature-item h4 { font-size: 18px; }
            .services-grid { grid-template-columns: 1fr; gap: 20px; }
            .service-item { padding: 20px; }
            .services-section { padding: 50px 0; margin-bottom:50px; margin-top:50px;}
            .usage-container { padding: 25px; }
            .usage-banner { font-size: 16px; padding: 15px 25px; }
			.section-title {font-size: 28px;}

            .services-grid {
                grid-template-columns: 1fr; /* Single column layout */
                width: 90%;
            }
			.features-grid{margin-bottom:50px;}

            /* Remove staggered effect on mobile */
            .service-item:nth-child(2n) {
                transform: translateY(0);
            }
            .service-item {
                padding: 20px 25px;
            }

            .service-item .icon-content {
                width: 80px;
                height: 80px;
                min-width: 80px;
            }

            .service-item .icon-content img {
                padding:20px;
            }
			.intro-section{margin-bottom:30px;}
			.intro-section .text-content h3{margin-bottom:20px;}
			.feature-item{flex-direction:column; align-items: center;}
			.feature-item img{width:auto; max-width:100%; object-fit:contain;}
			.business-tabs{margin: 0px auto 20px;}
        }
		@media (max-width: 560px) {
			.usage-banner{white-space:pre-line}	
		}