main{overflow: hidden;}


._subVisual {height: 440px; padding-top: 190px; box-sizing: border-box; position: relative; }
._subVisual .wrap { }
._subVisual .wrap h1 { }
._subVisual .wrap h1 small {color: var(--purple); font-size: 20px; letter-spacing: -0.04em; line-height: 1.3;display: flex; align-items: center; gap: 0.5em; }
._subVisual .wrap h1 small::before {content:''; display: block; width: calc(8/20*1em); height: calc(8/20*1em); background-color: var(--purple);transform: rotate(45deg); }
._subVisual .wrap h1 p {font-size: 62px; font-weight: 600; letter-spacing: -0.04em; line-height: 1.3; }
/* 별도스타일 */
.ir_info ._subVisual .wrap h1 small{display: none;}
.financials ._subVisual .wrap h1 small{display: none;}
._resources ._subVisual .wrap h1 small{display: none;}
.about_news ._subVisual .wrap h1 small{display: none;}

._subVisual .wrap ul {display: flex; flex-wrap: wrap; gap: 16px 45px; margin-top: max(calc(45/17*1em),20px);font-size: 17px; font-weight: 500; letter-spacing: -0.04em; }
._subVisual .wrap ul li { position: relative; }
._subVisual .wrap ul li.on { color: var(--purple); }
._subVisual .wrap ul li.on::before {content:''; display: block; position: absolute; left: 0; top: 100%; margin-top: 5px;width: 100%; height: 2px; background-color: var(--purple); }
._subVisual .wrap ul li a { }
html.pc ._subVisual .wrap ul li a:hover{color: var(--purple);}
/* 서브비주얼 수정전 */
/* ._subVisual .bg {position: absolute; left: 0; bottom: -100px; width: 100%; z-index: -1; background-size: cover; background-position: center bottom;} */
/* ._subVisual .bg::before {content:''; display: block; padding-bottom: calc(182/983*100%); } */

/* 서브비주얼 수정후 */
._subVisual .bg {position: absolute; left: 0; bottom: -500px; width: 100%; z-index: -1; }
._subVisual .bg video {position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover;z-index: -1; }
._subVisual .bg::before {content:''; display: block; padding-bottom: calc(432/768*100%); }

@media screen and (max-width:1600px) { }
@media screen and (max-width:1440px) {
	._subVisual { padding-top: max(calc(194/1440*100vw),calc(var(--headerH) + 40px)); height: auto; padding-bottom: 60px; }
	._subVisual .bg { bottom: 0; }
}
@media screen and (max-width:1280px) { }
@media screen and (max-width:1024px) {
	._subVisual .wrap h1 p { font-size: max(calc(62/1024*100vw),34px); }
	._subVisual .wrap ul { gap: 16px 20px; font-size: 16px; }
}
@media screen and (max-width:820px) {
	._subVisual .bg { width: 200%; }
	/* ._subVisual .bg{width: 125%;} */
	._subVisual .wrap h1 small { font-size: 16px; }
}
@media screen and (max-width:500px) {
	/* ._subVisual .bg{width: clamp(120%, 120% / 360 * 100vw, 200%);} */
	._subVisual .wrap ul { font-size: 14px; }
}
@media screen and (max-width:320px) {
	/* ._subVisual .bg{width: 200%;} */
}


._contents{
	padding-bottom: 150px;
}


/* total */
._total {font-size: 20px; letter-spacing: -0.04em;display: flex; align-items: center; gap: 0.2em; }
._total p { }
._total b {font-weight: 700; color: var(--purple); }


/* paging */
._paging { text-align: center; margin-top: 90px;}
._paging a { transition: color 0.1s; color: #999999;}
html.pc ._paging a:hover { color: #000; }

._paging .inner {display: inline-flex; justify-content: center; position: relative;}
._paging .inner > div {
	font-size: 20px; display: flex; align-items: center; justify-content: center;
	position: absolute; height: 100%;
}
._paging .inner .left{right: 100%}
._paging .inner .right{left: 100%}
._paging .inner > div a {  height: 100%; display: flex; align-items: center; justify-content: center;  padding: 0 9px; }
._paging .inner > div .dot { }
._paging .inner > div .arrow { }
._paging .inner > div.right .arrow i { transform: rotate(180deg); }

._paging ul {display: flex; gap: 10px; align-items: center; justify-content: center; padding: 0 9px; }
._paging ul li { }
._paging ul li a {display: flex; align-items: center; justify-content: center;width: calc(32/16*1em); height: calc(32/16*1em); border-radius: 3px; }
._paging ul li.on a { background-color: var(--purple); color: #fff !important; }

@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	._contents{padding-bottom: 100px;}
	._total{font-size: 18px;}
	._paging {margin-top: 60px;}
}
@media screen and (max-width:500px) {
	._total{font-size: 16px;}
	/* ._paging {margin-top: 40px;} */
	._paging .inner > div{font-size: 18px;}
	._paging .inner > div a {padding: 0 6px;}
	._paging ul{font-size: 14px; gap: 2px;}
}
@media screen and (max-width:320px) {}




/* 검색바 */
._searchBar{
	text-align: center;
}
._searchBar .inner{
	border: 1px solid #b8b8b8; box-sizing: border-box;
	border-radius: 5px; font-size: 17px; letter-spacing: -0.04em;
	display: inline-flex; align-items: center; font-family: 'Pretendard';
	height: 44px;
}
._searchBar .select{position: relative; cursor: pointer; height: 100%;}
._searchBar .select div{
	min-width: calc(100/17*1em); max-width: calc(80/17*1em); box-sizing: border-box; padding-left: 17px;
    color: #b8b8b8; height: 100%;
	border: 0;
	display: flex; align-items: center; justify-content: space-between; gap: 5px;
}
._searchBar .select div p{max-width: calc(100% - 1em); overflow: hidden; text-overflow: ellipsis;}
._searchBar .select div p.on{color: #000;}
._searchBar .select div i{color: #000;}
._searchBar .select ul{
	display: none; background-color: #fff;
	position: absolute; z-index: 5; top: 100%; left: 0; margin-top: 6px; border-radius: 4px; background-color: #fff;
	min-width: 100%; border: 1px solid #dbdbdb; box-sizing: border-box; font-size: max(calc(14/17*1em),12px); overflow: hidden;
}
._searchBar .select ul li{padding: 6px 8px; box-sizing: border-box; cursor: pointer;}
._searchBar .select ul li:first-child{padding-top: 10px;}
._searchBar .select ul li:last-child{padding-bottom: 10px;}
html.pc ._searchBar .select ul li:hover{background-color: #7c7c7c; color: #fff;}
._searchBar option{}
._searchBar .ico{
	width: 2px; height: 18px; background-color: #ddd;
	margin: 0 16px;
}
._searchBar .inputBx{
	display: flex;
	height: 100%;
}
._searchBar .inputBx input{
	height: 100%; width: calc(200/17*1em); border: 0; padding-left: 5px; box-sizing: border-box;
	font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
}
._searchBar .inputBx input::placeholder{
	font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    color: #b8b8b8;
}
._searchBar .inputBx i{
	cursor: pointer; min-width: calc(45/17*1em);
	display: flex; align-items: center; justify-content: center;
}

@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {}
@media screen and (max-width:820px) {
	._searchBar .inner{font-size: 13px; height: 38px; border-radius: 2px;}
	._searchBar .ico{margin: 0 10px;}
}
@media screen and (max-width:500px) {
	._searchBar{width: 100%;}
	._searchBar .inner{width: 100%;}
	._searchBar .select div{min-width: 7em; padding-left: 10px;}
	._searchBar .inputBx{width: 100%;}
	._searchBar .inputBx input{width: 100%;}
}
@media screen and (max-width:320px) {
	._searchBar .select div{min-width: 5em; max-width: 7em;}
}



/* 버튼 공통 */

/* contact */
._contact ._contents {
    padding-top: 200px;
    letter-spacing: -0.04em;
}

@media screen and (max-width: 1024px) {
	._contact ._contents {
		padding-top: 150px;
    }
}
@media screen and (max-width: 820px) {
	._contact ._contents {
		padding-top: 100px;
	}
}